@aarhus-university/au-designsystem-delphinus 0.34.16 → 0.35.0

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## 0.35.0 (February 28, 2023)
+
+### Core Delphinus Updates
+JS for truncators. Better handling of content-toggles on demo site.
+
+### Delphinus Projects Updates
+TYPO3-specific JS implemented.
+
+
+
 ## 0.34.16 (February 20, 2023)
 
 ### Core Delphinus Updates

package/Gruntfile.js

@@ -1,3 +1,6 @@
+/* eslint-disable max-len */
+/* eslint-disable consistent-return */
+/* eslint-disable @typescript-eslint/no-var-requires */
 /* eslint-env node */
 const sass = require('node-sass');
 const webpackConfig = require('./webpack.config.js');
@@ -16,11 +19,11 @@ module.exports = (grunt) => {
         src: ['build/**/_*.html'],
       },
       figmatokens: {
-        src: ['build/figma-tokens', 'bin']
+        src: ['build/figma-tokens', 'bin'],
       },
       bin: {
-        src: ['bin']
-      }
+        src: ['bin'],
+      },
     },
     cleanempty: {
       options: {},
@@ -45,25 +48,25 @@ module.exports = (grunt) => {
       },
       figmastyles: {
         options: {
-          flatten: true
+          flatten: true,
         },
         files: {
-          //the breakpoints
-          'bin/pre/breakpoint/01_medium.json' : 'source/figma-tokens/styles/breakpoint.json',
-          'bin/pre/breakpoint/02_wide.json' : 'source/figma-tokens/styles/breakpoint.json',
-          //the color colorthemes
-          'bin/pre/theme/01_cyan.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/02_turquoise.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/03_green.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/04_yellow.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/05_orange.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/06_red.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/07_magenta.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/08_purple.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/09_blue.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/21_mitstudie.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/22_omnibus.json' : 'source/figma-tokens/styles/theme.json',
-          'bin/pre/theme/23_brightspace.json' : 'source/figma-tokens/styles/theme.json',
+          // the breakpoints
+          'bin/pre/breakpoint/01_medium.json': 'source/figma-tokens/styles/breakpoint.json',
+          'bin/pre/breakpoint/02_wide.json': 'source/figma-tokens/styles/breakpoint.json',
+          // the color colorthemes
+          'bin/pre/theme/01_cyan.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/02_turquoise.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/03_green.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/04_yellow.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/05_orange.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/06_red.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/07_magenta.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/08_purple.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/09_blue.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/21_mitstudie.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/22_omnibus.json': 'source/figma-tokens/styles/theme.json',
+          'bin/pre/theme/23_brightspace.json': 'source/figma-tokens/styles/theme.json',
         },
       },
       figmatokens: {
@@ -72,7 +75,7 @@ module.exports = (grunt) => {
         dest: 'bin/pre',
         expand: true,
         flatten: true,
-      }
+      },
     },
     watch: {
       sass: {
@@ -87,10 +90,6 @@ module.exports = (grunt) => {
         files: ['source/**', '!source/**/*.scss', '!source/**/*.pug', '!source/figma-tokens/**/*.json'],
         tasks: ['copy', 'cleanempty'],
       },
-      webpack: {
-        files: ['source/**/*.ts'],
-        tasks: ['webpack'],
-      },
     },
     pug: {
       compile: {
@@ -233,138 +232,137 @@ module.exports = (grunt) => {
     'merge-json': {
       breakpoints: {
         src: ['bin/pre/breakpoint/*.json'],
-        dest: 'bin/pre/sizes-breakpoints.json'
+        dest: 'bin/pre/sizes-breakpoints.json',
       },
       themes: {
         src: ['bin/pre/theme/*.json'],
-        dest: 'bin/pre/colors-themes.json'
+        dest: 'bin/pre/colors-themes.json',
       },
       designsystem: {
         src: [
-            'bin/figma-tokens/colors-all.json',
-            'bin/figma-tokens/colors-themes.json',
-            'bin/figma-tokens/sizes-default.json',
-            'bin/figma-tokens/sizes-breakpoints.json',
-            'bin/figma-tokens/sizing.json',
-            'bin/figma-tokens/spacing.json',
-            'bin/figma-tokens/shadows-default.json',
-            'bin/figma-tokens/blurs-default.json',
-            'bin/figma-tokens/typography-fonts.json',
-            'bin/figma-tokens/typography-line-widths.json',
-            'bin/figma-tokens/typography-styles.json',
-            'bin/figma-tokens/borders-widths.json',
-            'bin/figma-tokens/borders-default.json',
-            'bin/figma-tokens/borders-theme.json',
-            'bin/figma-tokens/borders-nav-item.json',
-            'bin/figma-tokens/borders-nav-item-theme.json',
-          ],
-        dest: 'build/figma-tokens/design-system.json'
+          'bin/figma-tokens/colors-all.json',
+          'bin/figma-tokens/colors-themes.json',
+          'bin/figma-tokens/sizes-default.json',
+          'bin/figma-tokens/sizes-breakpoints.json',
+          'bin/figma-tokens/sizing.json',
+          'bin/figma-tokens/spacing.json',
+          'bin/figma-tokens/shadows-default.json',
+          'bin/figma-tokens/blurs-default.json',
+          'bin/figma-tokens/typography-fonts.json',
+          'bin/figma-tokens/typography-line-widths.json',
+          'bin/figma-tokens/typography-styles.json',
+          'bin/figma-tokens/borders-widths.json',
+          'bin/figma-tokens/borders-default.json',
+          'bin/figma-tokens/borders-theme.json',
+          'bin/figma-tokens/borders-nav-item.json',
+          'bin/figma-tokens/borders-nav-item-theme.json',
+        ],
+        dest: 'build/figma-tokens/design-system.json',
       },
       designfile: {
         src: [
-            'bin/figma-tokens/sizes-default.json',
-            'bin/figma-tokens/sizes-breakpoints.json',
-            'bin/figma-tokens/sizing.json',
-            'bin/figma-tokens/spacing.json',
-            'bin/figma-tokens/blurs-default.json',
-            'bin/figma-tokens/typography-fonts.json',
-            'bin/figma-tokens/typography-line-widths.json',
-            'bin/figma-tokens/typography-styles.json',
-            'bin/figma-tokens/borders-widths.json',
-          ],
-        dest: 'build/figma-tokens/design-file.json'
+          'bin/figma-tokens/sizes-default.json',
+          'bin/figma-tokens/sizes-breakpoints.json',
+          'bin/figma-tokens/sizing.json',
+          'bin/figma-tokens/spacing.json',
+          'bin/figma-tokens/blurs-default.json',
+          'bin/figma-tokens/typography-fonts.json',
+          'bin/figma-tokens/typography-line-widths.json',
+          'bin/figma-tokens/typography-styles.json',
+          'bin/figma-tokens/borders-widths.json',
+        ],
+        dest: 'build/figma-tokens/design-file.json',
       },
       colorthemes: {
         src: [
-            'bin/figma-tokens/borders-widths.json',
-            'bin/figma-tokens/borders-theme.json',
-            'bin/figma-tokens/borders-nav-item-theme.json',
-            'bin/figma-tokens/colors-themes.json',
-          ],
-        dest: 'build/figma-tokens/color-themes.json'
+          'bin/figma-tokens/borders-widths.json',
+          'bin/figma-tokens/borders-theme.json',
+          'bin/figma-tokens/borders-nav-item-theme.json',
+          'bin/figma-tokens/colors-themes.json',
+        ],
+        dest: 'build/figma-tokens/color-themes.json',
       },
       breakpointstyles: {
         src: [
-            'bin/figma-tokens/typography-fonts.json',
-            'bin/figma-tokens/typography-line-widths.json',
-            'bin/figma-tokens/typography-styles.json',
-            'bin/figma-tokens/sizes-breakpoints.json',
-          ],
-        dest: 'build/figma-tokens/breakpoint-styles.json'
+          'bin/figma-tokens/typography-fonts.json',
+          'bin/figma-tokens/typography-line-widths.json',
+          'bin/figma-tokens/typography-styles.json',
+          'bin/figma-tokens/sizes-breakpoints.json',
+        ],
+        dest: 'build/figma-tokens/breakpoint-styles.json',
       },
     },
     'string-replace': {
       cssvars: {
         files: [{
-        flatten: true,
-        expand: true,
-        cwd: 'bin/',
-        src: 'pre/*.json',
-        dest: 'bin/figma-tokens'
+          flatten: true,
+          expand: true,
+          cwd: 'bin/',
+          src: 'pre/*.json',
+          dest: 'bin/figma-tokens',
         }],
         options: {
           replacements: [{
             pattern: /(--[a-z0-9-]+)/ig,
-            replacement: function (match) {
-              //console.log(match)
-              var cssvars = grunt.file.read('bin/pre/cssvars/figma-tokens.css');
-              var regex = new RegExp(match + ': ([a-zA-Z0-9-#.,\(\)]+)');
-              var value = cssvars.match(regex);
+            replacement(match) {
+              // console.log(match)
+              const cssvars = grunt.file.read('bin/pre/cssvars/figma-tokens.css');
+              const regex = new RegExp(`${match}: ([a-zA-Z0-9-#.,()]+)`);
+              const value = cssvars.match(regex);
               if (value == null) {
-                grunt.fail.fatal('Cannot find css-var: ' + match);
-              }
-              else {
+                grunt.fail.fatal(`Cannot find css-var: ${match}`);
+              } else {
                 return value[1];
               }
-            }
-          }]
-        }
+            },
+          }],
+        },
       },
       figmastyles: {
         files: [{
-        expand: true,
-        cwd: 'bin/',
-        src: ['pre/breakpoint/*.json', 'pre/theme/*.json'],
-        dest: 'bin/'
+          expand: true,
+          cwd: 'bin/',
+          src: ['pre/breakpoint/*.json', 'pre/theme/*.json'],
+          dest: 'bin/',
         }],
         options: {
           replacements: [{
             pattern: /{{([a-zA-Z0-9-]+)}}/ig,
-            replacement: function (match, value, a, b, path) {
-
-              //extract the filename
-              var regex = new RegExp('([a-zA-Z0-9]+)\/[0-9]+_([a-zA-Z0-9]+).json');
-              var file = path.match(regex);
+            replacement(match, value, a, b, path) {
+              // extract the filename
+              let foldername = null;
+              let filename = null;
+              const re = new RegExp('([a-zA-Z0-9]+)/[0-9]+_([a-zA-Z0-9]+).json');
+              const file = path.match(re);
               if (file == null) {
-                grunt.fail.fatal('Unable to extract file and folder name from: ' + path);
-              }
-              else {
-                var foldername = file[1];
-                var filename = file[2];
+                grunt.fail.fatal(`Unable to extract file and folder name from: ${path}`);
+              } else {
+                // eslint-disable-next-line prefer-destructuring
+                foldername = file[1];
+                // eslint-disable-next-line prefer-destructuring
+                filename = file[2];
               }
 
-              //if matched value is not name, find display name i css vars file. Else return the filename.
-              if (value != 'name') {
-                var cssvars = grunt.file.read('bin/pre/cssvars/figma-tokens.css');
-                var regex = new RegExp('--' + foldername + '-' + filename + ': ([a-zA-Z0-9-#. ]+)');
-                var displayname = cssvars.match(regex);
+              // if matched value is not name, find display name i css vars file. Else return the filename.
+              if (value !== 'name') {
+                const cssvars = grunt.file.read('bin/pre/cssvars/figma-tokens.css');
+                const re2 = new RegExp(`--${foldername}-${filename}: ([a-zA-Z0-9-#. ]+)`);
+                const displayname = cssvars.match(re2);
                 if (displayname == null) {
-                  grunt.fail.fatal('Cannot find css var with display name for: ' + filename);
-                }
-                else {
-                  //console.log(displayname[1]);
+                  grunt.fail.fatal(`Cannot find css var with display name for: ${filename}`);
+                } else {
+                  // console.log(displayname[1]);
                   return displayname[1];
                 }
-              }
-              else {
-                //console.log(filename);
+              } else {
+                // console.log(filename);
                 return filename;
               }
-            }
-          }]
-        }
-      }
-    }
+            },
+          }],
+        },
+      },
+    },
   });
 
   // load the tasks
@@ -392,7 +390,7 @@ module.exports = (grunt) => {
     'figma-tokens',
     'clean:postbuild',
     'cleanempty',
-    'webpack'
+    'webpack',
   ]);
 
   grunt.registerTask('default', ['build', 'connect', 'browserSync', 'watch']);
@@ -413,6 +411,6 @@ module.exports = (grunt) => {
     'merge-json:themes',
     'string-replace:cssvars',
     'merge-json',
-    'clean:bin'
+    'clean:bin',
   ]);
 };

package/build/changelog.html

@@ -17,7 +17,12 @@ a(href="/components" class= active_nav_item=="components" ? "nav__item--active"
 a(href="/atom-fonts.html" class= active_nav_item=="atoms" ? "nav__item--active" : "").nav__item Atoms
 a(href="/code.html" class= active_nav_item=="code" ? "nav__item--active" : "").nav__item Code
 a(href="/projects" class= active_nav_item=="projects" ? "nav__item--active" : "").nav__item Projects
-a(href="/changelog.html" class= active_nav_item=="changelog" ? "nav__item--active" : "").nav__item Changelog--><!--button(title="Show full menu" aria-label="Show full menu" aria-haspopup="true" aria-expanded="false" aria-controls="nav-items-global").nav__toggle Menu--></div></nav></header><main class="page__content theme--normal" id="content"><div class="page__content__block"><h1> <strong>Changelog</strong></h1><div class="changelog"><h2>0.34.16 (February 20, 2023)</h2>
+a(href="/changelog.html" class= active_nav_item=="changelog" ? "nav__item--active" : "").nav__item Changelog--><!--button(title="Show full menu" aria-label="Show full menu" aria-haspopup="true" aria-expanded="false" aria-controls="nav-items-global").nav__toggle Menu--></div></nav></header><main class="page__content theme--normal" id="content"><div class="page__content__block"><h1> <strong>Changelog</strong></h1><div class="changelog"><h2>0.35.0 (February 28, 2023)</h2>
+<h3>Core Delphinus Updates</h3>
+<p>JS for truncators. Better handling of content-toggles on demo site.</p>
+<h3>Delphinus Projects Updates</h3>
+<p>TYPO3-specific JS implemented.</p>
+<h2>0.34.16 (February 20, 2023)</h2>
 <h3>Core Delphinus Updates</h3>
 <p>Fixes issue with icons not displaying correctly in <a href="https://delphinus.au.dk/components/toast-notification">Toast Notification</a> component in confirm and warnings states.</p>
 <h3>Delphinus Projects Updates</h3>

package/build/js/app.js

@@ -1,2 +1,2 @@
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var n=t();for(var o in n)("object"==typeof exports?exports:e)[o]=n[o]}}(window,(function(){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var r=t[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(o,r,function(t){return e[t]}.bind(null,r));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){e.exports=n(1)},function(e,t,n){"use strict";n.r(t);const o=(e,t)=>{let n=!1;return e.composedPath().forEach(e=>{e.classList&&e.classList.contains(t)&&(n=!0)}),n},r=e=>e*parseFloat(getComputedStyle(document.documentElement).fontSize),l=e=>{return Math.max(document.documentElement.clientWidth||0,window.innerWidth||0)<r(parseInt(getComputedStyle(document.documentElement).getPropertyValue(e).replace("rem",""),10))},a=e=>{const t=e.parentElement;return t?t.classList.contains("nav")?t:a(t):e},c=(e,t=null)=>{e.forEach(e=>{const n=e.querySelector(".nav__toggle");e!==t&&(e.classList.contains("nav--toggled")&&(n.focus(),n.setAttribute("aria-expanded","false")),e.classList.remove("nav--toggled"))})},i=e=>{const t=[];return document.querySelectorAll(".nav__toggle").forEach(n=>{const o=()=>{const t=(e=>{const t=a(e),n=t.querySelector(".nav__items"),o=null==n?void 0:n.querySelector(".nav__item:last-of-type");null==n||n.classList.add("nav__items--fadeout");const r=null==n?void 0:n.querySelector(".nav__item--is-overflown");r&&r.focus();const l=()=>{t.classList.toggle("nav--toggled"),null==n||n.classList.remove("nav__items--fadeout"),null==o||o.removeEventListener("transitionend",l)};return null==o||o.addEventListener("transitionend",l),t})(n),o=n.getAttribute("aria-expanded");n.setAttribute("aria-expanded","false"===o?"true":"false"),c(e,t)};t.push({element:n,clickEvent:o}),n.addEventListener("click",o)}),t},s=(e,t)=>{var n;t.classList.remove("nav--toggled");const r=t.querySelector(".nav__items");if(r){const e=r.querySelectorAll(".nav__item"),n="nav__item--is-overflown",o="nav--has-overflow",l="nav__item--active";let a=!1;for(let r=e.length-1;r>=0;r-=1){const c=e[r];c.offsetTop>0?(c.classList.add(n),t.classList.add(o),a=!0):c.classList.contains(l)||c.classList.remove(n)}if(!a){t.classList.remove(o);const e=t.querySelector(`.${l}`);e&&e.classList.remove(n)}}const l=t=>{t.target.classList.contains("nav__toggle")||o(t,"nav__items")||c(e)};return null===(n=document.querySelector("body"))||void 0===n||n.addEventListener("click",l),{element:document.querySelector("body"),clickEvent:l}},d=e=>{const t=Math.max(document.documentElement.clientWidth||0,window.innerWidth||0)/(()=>parseInt(window.getComputedStyle(document.documentElement).fontSize.replace("px",""),10))(),n=(e=>e.contains("tabbed-content--hide-tabs-on-medium-width")?parseInt(getComputedStyle(document.documentElement).getPropertyValue("--bp-medium").replace("rem",""),10):e.contains("tabbed-content--hide-tabs-on-wide-width")?parseInt(getComputedStyle(document.documentElement).getPropertyValue("--bp-wide").replace("rem",""),10):-1)(e);return!(n>-1)||t<n},u=(e,t,n,o,r,l=!0,a=(e=>console.log(e)))=>{l&&o.focus(),o.removeAttribute("tabindex"),o.setAttribute("aria-selected","true"),o.classList.contains("switch__segment")?o.classList.add("switch__segment--active"):o.classList.add("nav__item--active"),n&&(n.removeAttribute("aria-selected"),n.setAttribute("tabindex","-1"),n.classList.contains("switch__segment")?n.classList.remove("switch__segment--active"):n.classList.remove("nav__item--active"));const c=Array.prototype.indexOf.call(e,o);if(Array.from(document.querySelectorAll(`[data-for="${t[c].id}"]`)).forEach(e=>{e.classList.add("tabbed-content-peripheral--active"),e.hidden=!1}),t[c].hidden=!1,n){const o=Array.prototype.indexOf.call(e,n);Array.from(document.querySelectorAll(`[data-for="${t[o].id}"]`)).forEach(e=>{e.classList.remove("tabbed-content-peripheral--active"),e.hidden=!0}),t[o].hidden=!0}o.dispatchEvent(new CustomEvent("switch-tab",{bubbles:!0,detail:{tab:c}})),a(c)},m=e=>{e.querySelectorAll(".content-toggle__toggle").forEach(e=>{var t;const n=null===(t=e.parentElement)||void 0===t?void 0:t.querySelector(".content-toggle__content");e.setAttribute("aria-expanded","false"),null==n||n.setAttribute("hidden","hidden")})},p=e=>{const t=e.parentElement;return t?t.classList.contains("toolbar")?t:p(t):e};let f=0;const v=[],b=()=>{v.forEach((e,t)=>{const{rendered:n,domElement:o}=e;if(d(o.classList)){if(!n){const n=o.getAttribute("data-focus-onload"),r=o.getAttribute("data-initial-tab");((e,t,n=0,o=!0,r=(e=>console.log(e)))=>{const l=t.querySelector(".switch,.nav__items"),a=l.querySelectorAll("a"),c=[];t.querySelectorAll("section").forEach(e=>{e.parentNode===t&&c.push(e)});const i=t.querySelector("button.tabbed-content__expand-all");if(i){const e=()=>{l.hidden=!0,c.forEach(e=>{e.hidden=!1})};i.removeEventListener("click",e),i.addEventListener("click",e)}l.setAttribute("role","tablist"),a.forEach((n,o)=>{var i;n.setAttribute("role","tab"),n.setAttribute("id",`tab${e}_${o+1}`),n.setAttribute("tabindex","-1"),null===(i=n.parentElement)||void 0===i||i.setAttribute("role","presentation");const s=e=>{e.preventDefault();const n=l.querySelector("[aria-selected]");e.currentTarget!==n&&u(a,c,n,e.currentTarget,t.classList,!0,e=>{r(e)})};n.removeEventListener("click",s),n.addEventListener("click",s);const d=e=>{const n=Array.prototype.indexOf.call(a,e.currentTarget);let l=null;"ArrowLeft"===e.key&&(l=n-1),"ArrowRight"===e.key&&(l=n+1),"ArrowDown"===e.key&&(l="down"),null!==l&&(e.preventDefault(),"down"===l?c[o].focus():a[l]&&u(a,c,e.currentTarget,a[l],t.classList,!0,e=>{r(e)}))};n.removeEventListener("keydown",d),n.addEventListener("keydown",d)}),c.forEach((e,t)=>{e.setAttribute("tabindex","-1"),e.setAttribute("aria-labelledby",a[t].id),e.hidden=!0,e.setAttribute("role","tabpanel")}),n>-1&&u(a,c,null,a[n],t.classList,o)})(t,o,r?parseInt(r,10):0,"false"!==n),e.rendered=!0}}else n&&((e=>{const t=e.querySelector(".nav__items"),n=null==t?void 0:t.querySelectorAll("a"),o=[];e.querySelectorAll("section").forEach(t=>{t.parentNode===e&&o.push(t)}),null==n||n.forEach(e=>{e.removeAttribute("aria-selected"),e.classList.remove("nav__item--active")}),o.forEach(e=>{e.hidden=!1,e.removeAttribute("role")})})(o),e.rendered=!1)})};(e=>{"loading"!==document.readyState?e():document.addEventListener("DOMContentLoaded",e)})(()=>{document.querySelectorAll(".tabbed-content").forEach(e=>v.push({domElement:e,rendered:!1})),b(),(()=>{const e=document.querySelector("body");if(e){const t=window.getComputedStyle(e).getPropertyValue("--color-background"),n=document.querySelector('meta[name="theme-color"]');if(n)n.content=t;else{const e=document.createElement("meta");e.name="theme-color",e.content=t,document.getElementsByTagName("head")[0].appendChild(e)}}})();const e=document.querySelectorAll(".nav:not(.nav--vertical)");e.forEach(t=>s(e,t)),i(e),document.querySelectorAll(".table--wrap-medium-width, .table--wrap-default-width").forEach(e=>(e=>{const t=e.querySelector("thead"),n=e.querySelector("tbody"),o=e.querySelector("tfoot");if(t){const e=[];t.querySelectorAll("th").forEach(t=>{t.classList.contains("table__cell--self-explanatory")?e.push(""):e.push(t.innerHTML)});const r=[];n&&r.push(n),o&&r.push(o),r.forEach(t=>{t.querySelectorAll("tr").forEach(t=>{t.querySelectorAll("td, th").forEach((t,n)=>{e[n]&&t.setAttribute("data-label",e[n])})})})}})(e)),document.querySelectorAll(".content-toggle__content").forEach(e=>{((e,t,n,o)=>{var r;const l=[],a=(t,n,o)=>{o&&n.focus();const r=()=>{e.setAttribute("hidden","hidden"),t.removeAttribute("hidden"),t.setAttribute("aria-expanded","false"),t.focus()};return n.addEventListener("click",r),r},c=null==e?void 0:null===(r=e.parentElement)||void 0===r?void 0:r.querySelector(".content-toggle__toggle"),i=e.querySelectorAll(".content-toggle__close");if(c){const r=()=>{const r=c.getAttribute("aria-expanded");"function"==typeof n&&"false"===r&&n(e,c),c.setAttribute("aria-expanded","false"===r?"true":"false"),"true"===r?e.setAttribute("hidden","hidden"):e.removeAttribute("hidden"),"function"==typeof t&&t(e,c),c.hasAttribute("aria-haspopup")&&(c.setAttribute("hidden","hidden"),i.forEach(e=>{a(c,e,!0)})),"function"==typeof o&&o(e,c)};c.addEventListener("click",r),l.push({element:c,clickEvent:r}),i.forEach(e=>{const t=a(c,e,!1);l.push({element:e,clickEvent:t})})}})(e,e=>{(e=>{if(!l("--bp-medium")&&!l("--bp-low-height")){const t=r(parseInt(getComputedStyle(document.documentElement).getPropertyValue("--toolbar-popout-allowed-edge-distance").replace("rem,",""),10)),n=parseInt(getComputedStyle(e).width.replace("px",""),10),o=e.getBoundingClientRect().x,l=document.body.offsetWidth-t-n-o;l<0&&e.style.setProperty("--toolbar-popout-edge-overflow",`${l}px`)}})(e),(()=>{const e=document.querySelector("body");(l("--bp-medium")||l("--bp-low-height"))&&(null==e||e.classList.add("body--no-scroll"))})()},e=>m(p(e)),(e,t)=>{const n=t.getAttribute("aria-expanded"),r=p(e);"true"===n?null==r||r.classList.add("toolbar--has-popout"):null==r||r.classList.remove("toolbar--has-popout"),e.addEventListener("click",e=>{e.target.classList.contains("toolbar__popout")&&!o(e,"toolbar__filter__content")&&(m(r),(()=>{const e=document.querySelector("body");null==e||e.classList.remove("body--no-scroll")})())})})}),window.addEventListener("load",()=>{f=window.innerWidth}),window.addEventListener("resize",()=>{f>0&&window.innerWidth!==f&&(f=window.innerWidth,e.forEach(t=>s(e,t)),b())})})}])}));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var n=t();for(var o in n)("object"==typeof exports?exports:e)[o]=n[o]}}(window,(function(){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var r=t[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(o,r,function(t){return e[t]}.bind(null,r));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){e.exports=n(1)},function(e,t,n){"use strict";n.r(t);const o=(e,t)=>{let n=!1;return e.composedPath().forEach(e=>{e.classList&&e.classList.contains(t)&&(n=!0)}),n},r=e=>e*parseFloat(getComputedStyle(document.documentElement).fontSize),l=e=>{return Math.max(document.documentElement.clientWidth||0,window.innerWidth||0)<r(parseInt(getComputedStyle(document.documentElement).getPropertyValue(e).replace("rem",""),10))},a=e=>{const t=e.parentElement;return t?t.classList.contains("nav")?t:a(t):e},c=(e,t=null)=>{e.forEach(e=>{const n=e.querySelector(".nav__toggle");e!==t&&(e.classList.contains("nav--toggled")&&(n.focus(),n.setAttribute("aria-expanded","false")),e.classList.remove("nav--toggled"))})},i=e=>{const t=[];return document.querySelectorAll(".nav__toggle").forEach(n=>{const o=()=>{const t=(e=>{const t=a(e),n=t.querySelector(".nav__items"),o=null==n?void 0:n.querySelector(".nav__item:last-of-type");null==n||n.classList.add("nav__items--fadeout");const r=null==n?void 0:n.querySelector(".nav__item--is-overflown");r&&r.focus();const l=()=>{t.classList.toggle("nav--toggled"),null==n||n.classList.remove("nav__items--fadeout"),null==o||o.removeEventListener("transitionend",l)};return null==o||o.addEventListener("transitionend",l),t})(n),o=n.getAttribute("aria-expanded");n.setAttribute("aria-expanded","false"===o?"true":"false"),c(e,t)};t.push({element:n,clickEvent:o}),n.addEventListener("click",o)}),t},s=(e,t)=>{var n;t.classList.remove("nav--toggled");const r=t.querySelector(".nav__items");if(r){const e=r.querySelectorAll(".nav__item"),n="nav__item--is-overflown",o="nav--has-overflow",l="nav__item--active";let a=!1;for(let r=e.length-1;r>=0;r-=1){const c=e[r];c.offsetTop>0?(c.classList.add(n),t.classList.add(o),a=!0):c.classList.contains(l)||c.classList.remove(n)}if(!a){t.classList.remove(o);const e=t.querySelector(`.${l}`);e&&e.classList.remove(n)}}const l=t=>{t.target.classList.contains("nav__toggle")||o(t,"nav__items")||c(e)};return null===(n=document.querySelector("body"))||void 0===n||n.addEventListener("click",l),{element:document.querySelector("body"),clickEvent:l}},d=e=>{const t=Math.max(document.documentElement.clientWidth||0,window.innerWidth||0)/(()=>parseInt(window.getComputedStyle(document.documentElement).fontSize.replace("px",""),10))(),n=(e=>e.contains("tabbed-content--hide-tabs-on-medium-width")?parseInt(getComputedStyle(document.documentElement).getPropertyValue("--bp-medium").replace("rem",""),10):e.contains("tabbed-content--hide-tabs-on-wide-width")?parseInt(getComputedStyle(document.documentElement).getPropertyValue("--bp-wide").replace("rem",""),10):-1)(e);return!(n>-1)||t<n},u=(e,t,n,o,r,l=!0,a=(e=>console.log(e)))=>{l&&o.focus(),o.removeAttribute("tabindex"),o.setAttribute("aria-selected","true"),o.classList.contains("switch__segment")?o.classList.add("switch__segment--active"):o.classList.add("nav__item--active"),n&&(n.removeAttribute("aria-selected"),n.setAttribute("tabindex","-1"),n.classList.contains("switch__segment")?n.classList.remove("switch__segment--active"):n.classList.remove("nav__item--active"));const c=Array.prototype.indexOf.call(e,o);if(Array.from(document.querySelectorAll(`[data-for="${t[c].id}"]`)).forEach(e=>{e.classList.add("tabbed-content-peripheral--active"),e.hidden=!1}),t[c].hidden=!1,n){const o=Array.prototype.indexOf.call(e,n);Array.from(document.querySelectorAll(`[data-for="${t[o].id}"]`)).forEach(e=>{e.classList.remove("tabbed-content-peripheral--active"),e.hidden=!0}),t[o].hidden=!0}o.dispatchEvent(new CustomEvent("switch-tab",{bubbles:!0,detail:{tab:c}})),a(c)},m=e=>{e.forEach((e,t)=>{const{rendered:n,domElement:o}=e;if(d(o.classList)){if(!n){const n=o.getAttribute("data-focus-onload"),r=o.getAttribute("data-initial-tab");((e,t,n=0,o=!0,r=(e=>console.log(e)))=>{const l=t.querySelector(".switch,.nav__items"),a=l.querySelectorAll("a"),c=[];t.querySelectorAll("section").forEach(e=>{e.parentNode===t&&c.push(e)});const i=t.querySelector("button.tabbed-content__expand-all");if(i){const e=()=>{l.hidden=!0,c.forEach(e=>{e.hidden=!1})};i.removeEventListener("click",e),i.addEventListener("click",e)}l.setAttribute("role","tablist"),a.forEach((n,o)=>{var i;n.setAttribute("role","tab"),n.setAttribute("id",`tab${e}_${o+1}`),n.setAttribute("tabindex","-1"),null===(i=n.parentElement)||void 0===i||i.setAttribute("role","presentation");const s=e=>{e.preventDefault();const n=l.querySelector("[aria-selected]");e.currentTarget!==n&&u(a,c,n,e.currentTarget,t.classList,!0,e=>{r(e)})};n.removeEventListener("click",s),n.addEventListener("click",s);const d=e=>{const n=Array.prototype.indexOf.call(a,e.currentTarget);let l=null;"ArrowLeft"===e.key&&(l=n-1),"ArrowRight"===e.key&&(l=n+1),"ArrowDown"===e.key&&(l="down"),null!==l&&(e.preventDefault(),"down"===l?c[o].focus():a[l]&&u(a,c,e.currentTarget,a[l],t.classList,!0,e=>{r(e)}))};n.removeEventListener("keydown",d),n.addEventListener("keydown",d)}),c.forEach((e,t)=>{e.setAttribute("tabindex","-1"),e.setAttribute("aria-labelledby",a[t].id),e.hidden=!0,e.setAttribute("role","tabpanel")}),n>-1&&u(a,c,null,a[n],t.classList,o)})(t,o,r?parseInt(r,10):0,"false"!==n),e.rendered=!0}}else n&&((e=>{const t=e.querySelector(".nav__items"),n=null==t?void 0:t.querySelectorAll("a"),o=[];e.querySelectorAll("section").forEach(t=>{t.parentNode===e&&o.push(t)}),null==n||n.forEach(e=>{e.removeAttribute("aria-selected"),e.classList.remove("nav__item--active")}),o.forEach(e=>{e.hidden=!1,e.removeAttribute("role")})})(o),e.rendered=!1)})},f=(e,t,n,o)=>{var r;const l=[],a=(t,n,o)=>{o&&n.focus();const r=()=>{e.setAttribute("hidden","hidden"),t.removeAttribute("hidden"),t.setAttribute("aria-expanded","false"),t.focus()};return n.addEventListener("click",r),r},c=null==e?void 0:null===(r=e.parentElement)||void 0===r?void 0:r.querySelector(".content-toggle__toggle"),i=e.querySelectorAll(".content-toggle__close");if(c){const r=()=>{const r=c.getAttribute("aria-expanded");"function"==typeof n&&"false"===r&&n(e,c),c.setAttribute("aria-expanded","false"===r?"true":"false"),"true"===r?e.setAttribute("hidden","hidden"):e.removeAttribute("hidden"),"function"==typeof t&&t(e,c),c.hasAttribute("aria-haspopup")&&(c.setAttribute("hidden","hidden"),i.forEach(e=>{a(c,e,!0)})),"function"==typeof o&&o(e,c)};c.addEventListener("click",r),l.push({element:c,clickEvent:r}),i.forEach(e=>{const t=a(c,e,!1);l.push({element:e,clickEvent:t})})}return l},p=e=>{e.querySelectorAll(".content-toggle__toggle").forEach(e=>{var t;const n=null===(t=e.parentElement)||void 0===t?void 0:t.querySelector(".content-toggle__content");e.setAttribute("aria-expanded","false"),null==n||n.setAttribute("hidden","hidden")})},v=e=>{const t=e.parentElement;return t?t.classList.contains("toolbar")?t:v(t):e};let b=0;(e=>{"loading"!==document.readyState?e():document.addEventListener("DOMContentLoaded",e)})(()=>{const e=document.querySelectorAll(".tabbed-content"),t=[];e.forEach(e=>t.push({domElement:e,rendered:!1})),m(t),(()=>{const e=document.querySelector("body");if(e){const t=window.getComputedStyle(e).getPropertyValue("--color-background"),n=document.querySelector('meta[name="theme-color"]');if(n)n.content=t;else{const e=document.createElement("meta");e.name="theme-color",e.content=t,document.getElementsByTagName("head")[0].appendChild(e)}}})();const n=document.querySelectorAll(".nav:not(.nav--vertical)");n.forEach(e=>s(n,e)),i(n),document.querySelectorAll(".table--wrap-medium-width, .table--wrap-default-width").forEach(e=>(e=>{const t=e.querySelector("thead"),n=e.querySelector("tbody"),o=e.querySelector("tfoot");if(t){const e=[];t.querySelectorAll("th").forEach(t=>{t.classList.contains("table__cell--self-explanatory")?e.push(""):e.push(t.innerHTML)});const r=[];n&&r.push(n),o&&r.push(o),r.forEach(t=>{t.querySelectorAll("tr").forEach(t=>{t.querySelectorAll("td, th").forEach((t,n)=>{e[n]&&t.setAttribute("data-label",e[n])})})})}})(e)),document.querySelectorAll(".box .content-toggle__content").forEach(e=>{f(e)}),document.querySelectorAll(".toolbar .content-toggle__content").forEach(e=>{f(e,e=>{(e=>{if(!l("--bp-medium")&&!l("--bp-low-height")){const t=r(parseInt(getComputedStyle(document.documentElement).getPropertyValue("--toolbar-popout-allowed-edge-distance").replace("rem,",""),10)),n=parseInt(getComputedStyle(e).width.replace("px",""),10),o=e.getBoundingClientRect().x,l=document.body.offsetWidth-t-n-o;l<0&&e.style.setProperty("--toolbar-popout-edge-overflow",`${l}px`)}})(e),(()=>{const e=document.querySelector("body");(l("--bp-medium")||l("--bp-low-height"))&&(null==e||e.classList.add("body--no-scroll"))})()},e=>p(v(e)),(e,t)=>{const n=t.getAttribute("aria-expanded"),r=v(e);"true"===n?null==r||r.classList.add("toolbar--has-popout"):null==r||r.classList.remove("toolbar--has-popout"),e.addEventListener("click",e=>{e.target.classList.contains("toolbar__popout")&&!o(e,"toolbar__filter__content")&&(p(r),(()=>{const e=document.querySelector("body");null==e||e.classList.remove("body--no-scroll")})())})})}),window.addEventListener("load",()=>{b=window.innerWidth}),window.addEventListener("resize",()=>{b>0&&window.innerWidth!==b&&(b=window.innerWidth,n.forEach(e=>s(n,e)),m(t))})})}])}));
 //# sourceMappingURL=app.js.map