hr-design-system-handlebars 1.83.11 → 1.84.0

package/chromatic.config.json

@@ -0,0 +1,5 @@
+{
+  "onlyChanged": true,
+  "projectId": "Project:60bf71339b5fb20042bc58a6",
+  "zip": true
+}

package/dist/assets/index.css

@@ -3322,7 +3322,7 @@ article.indexTextDS .indexTextHighlighted .link {
   border-bottom-color: var(--color-secondary-ds);
 }
 .counter-reset {
-  counter-reset: cnt1721827813356;
+  counter-reset: cnt1721909350986;
 }
 .hyphens-auto {
   -webkit-hyphens: auto;
@@ -3730,7 +3730,7 @@ article.indexTextDS .indexTextHighlighted .link {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1721827813356 1;
+  counter-increment: cnt1721909350986 1;
 }
 .-ordered::before {
   position: absolute;
@@ -3746,7 +3746,7 @@ article.indexTextDS .indexTextHighlighted .link {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1721827813356);
+  content: counter(cnt1721909350986);
 }
 /*! ****************************/
 /*! DataPolicy stuff           */
@@ -6153,6 +6153,10 @@ ul.restrictedToTwo li:nth-of-type(1n + 2) .timelineBorder {
     margin-right: 1.625rem;
   }
 
+  .sm\:mt-0 {
+    margin-top: 0px;
+  }
+
   .sm\:mt-1 {
     margin-top: 0.25rem;
   }

package/dist/views/components/page/base/page_wrapper.hbs

@@ -1,4 +1,4 @@
-<div class="grid grid-page">
+<div class="grid grid-page{{#if _webview}} mt-4 sm:mt-0{{/if}}">
     <{{#if _isArticle}}article{{else}}div{{/if}} class="grid items-baseline bg-white dark:bg-black grid-article">
         {{> @partial-block }}    
     </{{#if _isArticle}}article{{else}}div{{/if}}>

package/dist/views/components/page/story/story_article.hbs

@@ -1,4 +1,5 @@
-{{#>components/page/base/page_wrapper _isArticle=true}}
+{{#>components/page/base/page_wrapper _isArticle=true _webview=_webview}}
+
     {{> components/page/base/page_header}}
 
     {{> components/page/components/shorttext _text=this.shorttext }}

package/dist/views_static/components/page/base/page_wrapper.hbs

@@ -1,4 +1,4 @@
-<div class="grid grid-page">
+<div class="grid grid-page{{#if _webview}} mt-4 sm:mt-0{{/if}}">
     <{{#if _isArticle}}article{{else}}div{{/if}} class="grid items-baseline bg-white dark:bg-black grid-article">
         {{> @partial-block }}    
     </{{#if _isArticle}}article{{else}}div{{/if}}>

package/dist/views_static/components/page/story/story_article.hbs

@@ -1,4 +1,5 @@
-{{#>components/page/base/page_wrapper _isArticle=true}}
+{{#>components/page/base/page_wrapper _isArticle=true _webview=_webview}}
+
     {{> components/page/base/page_header}}
 
     {{> components/page/components/shorttext _text=this.shorttext }}

package/package.json

@@ -1,138 +1,140 @@
 {
-    "name": "hr-design-system-handlebars",
-    "description": "Web component library of Hessischer Rundfunk",
-    "author": "Hessischer Rundfunk <technikteam@hr.de>",
-    "private": false,
-    "license": "MIT",
-    "main": "dist/index.js",
-    "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "1.83.11",
-    "scripts": {
-        "test": "echo \"Error: no test specified\" && exit 1",
-        "storybook": "storybook dev -p 6006 public",
-        "build-storybook": "storybook build",
-        "build-storybook-with-tailwind": "npm run build:tailwind && npm run build-storybook",
-        "build-storybook-docs": "storybook build --docs",
-        "build-storybook-docs-with-tailwind": "npm run build:tailwind && npm run build-storybook-docs",
-        "build:tailwind": "postcss src/assets/tailwind.css -o dist/assets/index.css",
-        "build": "yarn clean && yarn build:tailwind && node ./build/scripts/build.js && yarn preparePartialsForDelivery",
-        "chromatic": "npx chromatic --project-token 84f1628f224a",
-        "clean": "rimraf  dist",
-        "release": "npx auto shipit --base-branch=main",
-        "optimize-assets": "gulp",
-        "optimize-svgs": "gulp optimizeSvgs",
-        "parseJson": "gulp parseJson",
-        "partialsToJs": "gulp convertPartialsToJs",
-        "saveLogoFilesToFolder": "gulp saveLogoFilesToFolder",
-        "preparePartialsForDelivery": "gulp preparePartialsForDelivery",
-        "create-modernizr-config": "gulp createModernizrConfig",
-        "merge-locatags": "gulp mergeLocatags",
-        "prepare": "yarn build",
-        "test-storybook": "test-storybook"
-    },
-    "browserslist": [
-        "last 2 versions",
-        "not dead",
-        "Firefox ESR",
-        "iOS >= 10",
-        "Safari >= 10",
-        "> 2.5% in DE"
-    ],
-    "keywords": [],
-    "devDependencies": {
-        "@babel/cli": "^7.13.16",
-        "@babel/core": "^7.12.10",
-        "@babel/preset-env": "^7.21.4",
-        "@storybook/addon-a11y": "^7.2.1",
-        "@storybook/addon-actions": "7.5.3",
-        "@storybook/addon-console": "^2.0.0",
-        "@storybook/addon-essentials": "7.5.3",
-        "@storybook/addon-interactions": "7.6.16",
-        "@storybook/addon-links": "^7.2.1",
-        "@storybook/addon-styling": "^1.3.5",
-        "@storybook/addons": "^7.2.1",
-        "@storybook/blocks": "7.2.1",
-        "@storybook/html": "^7.2.1",
-        "@storybook/html-webpack5": "7.2.1",
-        "@storybook/jest": "^0.2.3",
-        "@storybook/test-runner": "~0.16.0",
-        "@storybook/testing-library": "^0.2.2",
-        "@storybook/theming": "^7.2.1",
-        "auto": "^11.0.5",
-        "autoprefixer": "^10.4.2",
-        "babel-loader": "^8.2.2",
-        "chromatic": "^10.9.5",
-        "copyfiles": "^2.4.1",
-        "core-js-pure": "^3.30.1",
-        "cross-env": "^7.0.3",
-        "fancy-log": "^2.0.0",
-        "file-loader": "^6.2.0",
-        "glob": "^7.1.7",
-        "gulp": "^4.0.2",
-        "gulp-cheerio": "^1.0.0",
-        "gulp-cli": "^2.3.0",
-        "gulp-concat": "^2.6.1",
-        "gulp-debug": "^4.0.0",
-        "gulp-file-cache": "^0.0.1",
-        "gulp-filter": "^7.0.0",
-        "gulp-html-to-js": "^0.0.7",
-        "gulp-json-transform": "^0.4.8",
-        "gulp-merge-json": "^2.1.2",
-        "gulp-modernizr": "^4.0.3",
-        "gulp-rename": "^2.0.0",
-        "gulp-replace": "^1.1.4",
-        "gulp-svgmin": "^4.0.1",
-        "gulp-svgstore": "^8.0.0",
-        "handlebars": "^4.7.6",
-        "handlebars-loader": "^1.7.1",
-        "merge-stream": "^2.0.0",
-        "node-json-minify": "^3.0.0",
-        "path": "^0.12.7",
-        "postcss": "^8.4.5",
-        "postcss-cli": "^8.3.1",
-        "postcss-import": "^14.1.0",
-        "postcss-loader": "^4.2.0",
-        "postcss-nested": "^6.0.1",
-        "postcss-preset-env": "^7.3.1",
-        "prettier": "^2.2.1",
-        "raw-loader": "^4.0.2",
-        "react": "^18.2.0",
-        "react-dom": "^18.2.0",
-        "remark-gfm": "^3.0.1",
-        "rimraf": "^3.0.2",
-        "storybook": "^7.6.16",
-        "storybook-conditional-toolbar-selector": "^1.0.3",
-        "tailwindcss": "^3.0.23",
-        "tailwindcss-hyphens": "^0.1.0",
-        "tailwindcss-important": "^1.0.0",
-        "typescript": "^5.0.4",
-        "underscore": "^1.13.2",
-        "zepto-modules": "^1.0.1"
-    },
-    "dependencies": {
-        "@alpine-collective/toolkit": "^1.0.0",
-        "@alpinejs/anchor": "^3.13.3",
-        "@alpinejs/collapse": "^3.8.1",
-        "@alpinejs/intersect": "^3.13.3",
-        "@tailwindcss/line-clamp": "^0.4.2",
-        "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"
-    },
-    "prettier": {
-        "tabWidth": 4,
-        "quoteProps": "consistent",
-        "semi": false,
-        "singleQuote": true,
-        "endOfLine": "lf",
-        "printWidth": 100
-    },
-    "browser": {
-        "fs": false,
-        "path": false,
-        "os": false
-    }
+  "name": "hr-design-system-handlebars",
+  "description": "Web component library of Hessischer Rundfunk",
+  "author": "Hessischer Rundfunk <technikteam@hr.de>",
+  "private": false,
+  "license": "MIT",
+  "main": "dist/index.js",
+  "repository": "https://github.com/szuelch/hr-design-system-handlebars",
+  "version": "1.84.0",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "storybook": "storybook dev -p 6006 public",
+    "build-storybook": "storybook build",
+    "build-storybook-with-tailwind": "npm run build:tailwind && npm run build-storybook",
+    "build-storybook-docs": "storybook build --docs",
+    "build-storybook-docs-with-tailwind": "npm run build:tailwind && npm run build-storybook-docs",
+    "build:tailwind": "postcss src/assets/tailwind.css -o dist/assets/index.css",
+    "build": "yarn clean && yarn build:tailwind && node ./build/scripts/build.js && yarn preparePartialsForDelivery",
+    "chromatic": "npx chromatic --project-token 84f1628f224a",
+    "clean": "rimraf  dist",
+    "release": "npx auto shipit --base-branch=main",
+    "optimize-assets": "gulp",
+    "optimize-svgs": "gulp optimizeSvgs",
+    "parseJson": "gulp parseJson",
+    "partialsToJs": "gulp convertPartialsToJs",
+    "saveLogoFilesToFolder": "gulp saveLogoFilesToFolder",
+    "preparePartialsForDelivery": "gulp preparePartialsForDelivery",
+    "create-modernizr-config": "gulp createModernizrConfig",
+    "merge-locatags": "gulp mergeLocatags",
+    "prepare": "yarn build",
+    "test-storybook": "test-storybook"
+  },
+  "browserslist": [
+    "last 2 versions",
+    "not dead",
+    "Firefox ESR",
+    "iOS >= 10",
+    "Safari >= 10",
+    "> 2.5% in DE"
+  ],
+  "keywords": [],
+  "devDependencies": {
+    "@babel/cli": "^7.13.16",
+    "@babel/core": "^7.12.10",
+    "@babel/preset-env": "^7.21.4",
+    "@chromatic-com/storybook": "1",
+    "@storybook/addon-a11y": "^8.2.6",
+    "@storybook/addon-actions": "^8.2.6",
+    "@storybook/addon-console": "^3.0.0",
+    "@storybook/addon-essentials": "^8.2.6",
+    "@storybook/addon-interactions": "^8.2.6",
+    "@storybook/addon-links": "^8.2.6",
+    "@storybook/addon-styling-webpack": "1.0.0",
+    "@storybook/addon-themes": "^8.2.6",
+    "@storybook/addon-webpack5-compiler-babel": "3.0.3",
+    "@storybook/addon-webpack5-compiler-swc": "1.0.4",
+    "@storybook/blocks": "^8.2.6",
+    "@storybook/html": "^8.2.6",
+    "@storybook/html-webpack5": "^8.2.6",
+    "@storybook/test": "^8.2.6",
+    "@storybook/test-runner": "^0.19.1",
+    "@storybook/theming": "^8.2.6",
+    "auto": "^11.0.5",
+    "autoprefixer": "^10.4.2",
+    "babel-loader": "^8.2.2",
+    "chromatic": "^10.9.5",
+    "copyfiles": "^2.4.1",
+    "core-js-pure": "^3.30.1",
+    "cross-env": "^7.0.3",
+    "css-loader": "^7.1.2",
+    "fancy-log": "^2.0.0",
+    "file-loader": "^6.2.0",
+    "glob": "^7.1.7",
+    "gulp": "^4.0.2",
+    "gulp-cheerio": "^1.0.0",
+    "gulp-cli": "^2.3.0",
+    "gulp-concat": "^2.6.1",
+    "gulp-debug": "^4.0.0",
+    "gulp-file-cache": "^0.0.1",
+    "gulp-filter": "^7.0.0",
+    "gulp-html-to-js": "^0.0.7",
+    "gulp-json-transform": "^0.4.8",
+    "gulp-merge-json": "^2.1.2",
+    "gulp-modernizr": "^4.0.3",
+    "gulp-rename": "^2.0.0",
+    "gulp-replace": "^1.1.4",
+    "gulp-svgmin": "^4.0.1",
+    "gulp-svgstore": "^8.0.0",
+    "handlebars": "^4.7.6",
+    "handlebars-loader": "^1.7.1",
+    "merge-stream": "^2.0.0",
+    "node-json-minify": "^3.0.0",
+    "path": "^0.12.7",
+    "postcss": "^8.4.5",
+    "postcss-cli": "^8.3.1",
+    "postcss-import": "^14.1.0",
+    "postcss-loader": "^4.2.0",
+    "postcss-nested": "^6.0.1",
+    "postcss-preset-env": "^7.3.1",
+    "prettier": "^2.2.1",
+    "raw-loader": "^4.0.2",
+    "remark-gfm": "^3.0.1",
+    "rimraf": "^3.0.2",
+    "storybook": "^8.2.6",
+    "storybook-conditional-toolbar-selector": "^1.0.3",
+    "style-loader": "^4.0.0",
+    "tailwindcss": "^3.0.23",
+    "tailwindcss-hyphens": "^0.1.0",
+    "tailwindcss-important": "^1.0.0",
+    "typescript": "^5.0.4",
+    "underscore": "^1.13.2",
+    "zepto-modules": "^1.0.1"
+  },
+  "dependencies": {
+    "@alpine-collective/toolkit": "^1.0.0",
+    "@alpinejs/anchor": "^3.13.3",
+    "@alpinejs/collapse": "^3.8.1",
+    "@alpinejs/intersect": "^3.13.3",
+    "@tailwindcss/line-clamp": "^0.4.2",
+    "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"
+  },
+  "prettier": {
+    "tabWidth": 4,
+    "quoteProps": "consistent",
+    "semi": false,
+    "singleQuote": true,
+    "endOfLine": "lf",
+    "printWidth": 100
+  },
+  "browser": {
+    "fs": false,
+    "path": false,
+    "os": false
+  }
 }

package/src/stories/basics/Fixtures.mdx

@@ -460,7 +460,7 @@ stehen danach als Javascript-Objekt zur Verfügung. Um sie in einer Story zu nut
 werden. Das folgende Beispiel soll dies verdeutlichen.
 
 ```javascript
-import { ArgsTable, Meta, Story, Canvas, Preview } from '@storybook/addon-docs'
+import { Meta, Story, Canvas, Preview } from '@storybook/addon-docs'
 import xxlTeaserSerifWithLabel from './fixtures/teaser_standard_xxl_serif_label.json'
 import xxlTeaserSerifWithComments from './fixtures/teaser_standard_xxl_serif_comments.json'
 import xxlTeaserSerif from './fixtures/teaser_standard_xxl_serif.json'

package/src/stories/basics/conventions-and-datastructure.mdx

@@ -21,9 +21,7 @@ Dieses Kapitel richtet sich vor allem an die Entwickler des Designsystems. Es er
 
 ## Aufbau der Datenstruktur des Designsystems
 
-<Canvas>
-    <pre>
-        {`
+```
 .github/
 |——— workflows/
 .storybook/ 
@@ -50,9 +48,7 @@ package.json
 postcss.config.js
 README.md
 tailwind.config.js
-`}
-    </pre>
-</Canvas>
+```
 
 Im folgenden werden kurz die Ordner, deren Inhalte und andere für das Designsystem wichtige Dateien beschrieben
 
@@ -83,9 +79,7 @@ In den Ordner `dist` werden bei einem Release verschiedene Dateien (u.a. die Tem
 
 ### src
 
-<Canvas>
-    <pre>
-        {`
+```
 src/
 |——— assets/ 
 |    |——— brand/ 
@@ -99,9 +93,7 @@ src/
 |    |    |——— base/
 |    |    |——— components/   
 |    |    |——— pages/     
-`}
-    </pre>
-</Canvas>
+```
 
 Der `src` Ordner enthält die Unterordner `assets` sowie `stories`. Im Ordner `assets` finden sich die Folgenden Ordner und Dateien
 

package/src/stories/views/components/banner/header.stories.js

@@ -4,7 +4,7 @@ import bannerData from './fixtures/banner.json'
 const TemplateHeader = (args, { globals: { theme } }) => {
     // You can either use a function to create DOM elements or use a plain html string!
     // return `<div>${label}</div>`;
-    let brand = undefined !== theme ? theme : 'hessenschau'       
+    let brand = undefined !== theme ? theme : 'hessenschau'
     return header({ brand, ...args })
 }
 
@@ -30,7 +30,6 @@ export const Seitenfooter = {
     args: {
         ...bannerData,
         _currentPageUrl: '#currentPage',
-        _currentPageTitle:  'Der hr3 Nachmittag'
-    }
-  
-}
+        _currentPageTitle: 'Der hr3 Nachmittag',
+    },
+}

package/src/stories/views/components/banner/structure_nav/structureNav.stories.js

@@ -4,7 +4,7 @@ import structureNavData from '../fixtures/structureNav.json'
 const TemplateStructureNav = (args, { globals: { theme } }) => {
     // You can either use a function to create DOM elements or use a plain html string!
     // return `<div>${label}</div>`;
-    let brand = undefined !== theme ? theme : 'hessenschau'       
+    let brand = undefined !== theme ? theme : 'hessenschau'
     return structureNav({ brand, ...args })
 }
 
@@ -27,6 +27,5 @@ export default {
 export const Seitenfooter = {
     render: TemplateStructureNav.bind({}),
     name: 'StructureNav',
-    args: structureNavData
-  
-}
+    args: structureNavData,
+}

package/src/stories/views/components/base/link.mdx

@@ -1,4 +1,4 @@
-import { ArgsTable, Meta, Story, Canvas } from '@storybook/blocks'
+import { ArgTypes, Meta, Story, Canvas } from '@storybook/blocks'
 import * as LinkStories from './link.stories'
 
 <Meta of={LinkStories} />
@@ -21,7 +21,7 @@ Sobald es einen standardisierten Text-Link oder etwas ähnliches gibt kann und s
 
 ## Eigenschaften
 
-<ArgsTable story="Spielplatz" />
+<ArgTypes story="Spielplatz" />
 
 ## Verwendung
 

package/src/stories/views/components/button/button.mdx

@@ -1,4 +1,4 @@
-import { ArgsTable, Meta, Story, Canvas } from '@storybook/blocks'
+import { ArgTypes, Meta, Story, Canvas } from '@storybook/blocks'
 import * as ButtonStories from './button.stories'
 
 <Meta of={ButtonStories} />
@@ -30,7 +30,7 @@ Alle Inhalte des Buttons, wie das [Label](?path=/docs/komponenten-buttons-kompon
 
 ## Eigenschaften
 
-<ArgsTable story="Spielplatz" />
+<ArgTypes story="Spielplatz" />
 
 ## Varianten
 

package/src/stories/views/components/button/button.stories.js

@@ -408,7 +408,7 @@ export const ButtonPrimaryDisabled = {
     args: {
         _size: 'lg',
         _label: 'Primary',
-        _disabled : true
+        _disabled: true,
     },
 }
 
@@ -430,7 +430,7 @@ export const ButtonSecondaryDisabled = {
         _size: 'lg',
         _label: 'Secondary',
         _variant: 'secondary',
-        _disabled : true
+        _disabled: true,
     },
 }
 
@@ -452,7 +452,7 @@ export const ButtonTertiaryDisabled = {
         _size: 'lg',
         _label: 'Tertiary',
         _variant: 'tertiary',
-        _disabled : true
+        _disabled: true,
     },
 }
 
@@ -477,7 +477,6 @@ export const ButtonIconRechts = {
     },
 }
 
-
 export const ButtonIconLinks = {
     render: buttonWithLabelAndIconLeftTemplate.bind({}),
     name: 'Button - Icon links',
@@ -574,4 +573,4 @@ export const ButtonTertiaryAufFarbigemHintergrund = {
         _variant: 'tertiary',
         _onBackground: true,
     },
-}
+}

package/src/stories/views/components/button/components/button_icon.mdx

@@ -1,4 +1,4 @@
-import { ArgsTable, Meta, Story, Canvas } from '@storybook/blocks'
+import { ArgTypes, Meta, Story, Canvas } from '@storybook/blocks'
 import * as ButtonIconStories from './button_icon.stories'
 
 <Meta of={ButtonIconStories} />
@@ -10,7 +10,7 @@ ausschließlich als Subkomponente der Button-Komponente eingebunden werden.
 
 ## Eigenschaften
 
-<ArgsTable story="Icon" />
+<ArgTypes story="Icon" />
 
 ## Verwendung
 

package/src/stories/views/components/button/components/button_label.mdx

@@ -1,4 +1,4 @@
-import { ArgsTable, Meta, Story, Canvas } from '@storybook/blocks'
+import { ArgTypes, Meta, Story, Canvas } from '@storybook/blocks'
 import * as ButtonLabelStories from './button_label.stories'
 
 <Meta of={ButtonLabelStories} />
@@ -10,7 +10,7 @@ ausschließlich als Subkomponente der Button-Komponente eingebunden werden.
 
 ## Eigenschaften
 
-<ArgsTable story="Label" />
+<ArgTypes story="Label" />
 
 ## Verwendung
 

package/src/stories/views/components/button/link_button.mdx

@@ -1,4 +1,4 @@
-import { ArgsTable, Meta, Story, Canvas } from '@storybook/blocks'
+import { ArgTypes, Meta, Story, Canvas } from '@storybook/blocks'
 import * as LinkButtonStories from './link_button.stories'
 
 <Meta of={LinkButtonStories} />
@@ -28,7 +28,7 @@ Alle Inhalte des Buttons, wie das [Label](?path=/docs/komponenten-buttons-kompon
 
 ## Eigenschaften
 
-<ArgsTable story="Spielplatz" />
+<ArgTypes story="Spielplatz" />
 
 ## Varianten
 

package/src/stories/views/components/button/link_button.stories.js

@@ -349,7 +349,7 @@ export const ButtonPrimaryDisabled = {
     args: {
         _size: 'lg',
         _label: 'Primary',
-        _disabled: true
+        _disabled: true,
     },
 }
 
@@ -371,7 +371,7 @@ export const ButtonSecondaryDisabled = {
         _size: 'lg',
         _label: 'Secondary',
         _variant: 'secondary',
-        _disabled: true
+        _disabled: true,
     },
 }
 
@@ -393,11 +393,10 @@ export const ButtonTertiaryDisabled = {
         _size: 'lg',
         _label: 'Tertiary',
         _variant: 'tertiary',
-        _disabled: true
+        _disabled: true,
     },
 }
 
-
 export const ButtonIconRechts = {
     render: buttonWithLabelAndIconRightTemplate.bind({}),
     name: 'Button - Icon rechts',

package/src/stories/views/components/content/content_footer/content_footer.mdx

@@ -1,4 +1,4 @@
-import { ArgsTable, Meta, Story, Canvas } from '@storybook/blocks'
+import { ArgTypes, Meta, Story, Canvas } from '@storybook/blocks'
 import * as ContentFooterStories from './content_footer.stories'
 
 <Meta of={ContentFooterStories} />
@@ -26,4 +26,4 @@ Die Content-Footer-Komponente wird in handlebars wie folgt eingebaut:
     <Story of={ContentFooterStories.Default} />
 </Canvas>
 
-<ArgsTable story="default" />
+<ArgTypes story="default" />

package/src/stories/views/components/content/content_footer/content_footer.stories.js

@@ -20,4 +20,4 @@ export const Default = {
     render: Template.bind({}),
     name: 'default',
     args: contentfooterjson,
-}
+}

package/src/stories/views/components/content/copytext/components/accordion/accordion.mdx

@@ -1,4 +1,4 @@
-import { ArgsTable, Meta, Story, Canvas } from '@storybook/blocks'
+import { ArgTypes, Meta, Story, Canvas } from '@storybook/blocks'
 import * as AccordionStories from './accordion.stories'
 
 <Meta of={AccordionStories} />
@@ -11,7 +11,7 @@ import * as AccordionStories from './accordion.stories'
 ## Parameter
 
 
-<ArgsTable story="default" />
+<ArgTypes story="default" />
 
 ## Verwendung