@ebrains/components 0.8.0-alpha.0 → 0.9.0-beta

package/dist/cjs/bookmark-c61853d9.js

@@ -0,0 +1,18 @@
+'use strict';
+
+const bookmark = `  <svg
+    width="20"
+    height="20"
+    viewBox="0 0 20 20"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M5 4H15V16L10 12.0138L5 16V4Z"
+      stroke="currentColor"
+      stroke-width="1.5"
+      stroke-linejoin="round"
+    />
+  </svg>`;
+
+exports.bookmark = bookmark;

package/dist/cjs/color-primary-palette_6.cjs.entry.js

@@ -36,7 +36,7 @@ const ColorPrimaryPalette = class {
         ];
     }
     render() {
-        return (index.h("ul", { key: '153e3c0f00db6f824cb0f43b420645bcbd66632f', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.rgb), index.h("span", { class: "f-body-02 w-full" }, color.cmyk), index.h("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.pantoneC), index.h("span", { class: "f-body-02" }, color.pantoneU))))))));
+        return (index.h("ul", { key: '970e6baf4b258e9a0ed194316daf1c862d17733e', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.rgb), index.h("span", { class: "f-body-02 w-full" }, color.cmyk), index.h("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.pantoneC), index.h("span", { class: "f-body-02" }, color.pantoneU))))))));
     }
 };
 
@@ -97,23 +97,15 @@ const ColorSecondaryPalette = class {
         this.show = undefined;
     }
     render() {
-        return (index.h("ul", { key: 'b0af2cdf6524cf79ef8d28f37533d1f84812f174', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.rgb), index.h("span", { class: "f-body-02 w-full" }, color.cmyk), index.h("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.pantoneC), index.h("span", { class: "f-body-02" }, color.pantoneU))))))));
+        return (index.h("ul", { key: '54f985b91b28ae253a06ec313872ccc81449bf51', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.rgb), index.h("span", { class: "f-body-02 w-full" }, color.cmyk), index.h("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.pantoneC), index.h("span", { class: "f-body-02" }, color.pantoneU))))))));
     }
 };
 
 const ColorSupportPalette = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        // Support palette data
         this.colors = [
-            {
-                rgb: 'R20 G20 B20',
-                cmyk: 'C78 M69 Y61 K87',
-                hex: '#141414',
-                pantoneC: '',
-                pantoneU: '',
-                background: '#141414'
-            },
+            { rgb: 'R20 G20 B20', cmyk: 'C78 M69 Y61 K87', hex: '#141414', pantoneC: '', pantoneU: '', background: '#141414' },
             {
                 rgb: 'R56 G56 B56',
                 cmyk: 'C68 M58 Y55 K63',
@@ -138,18 +130,39 @@ const ColorSupportPalette = class {
                 pantoneU: 'PANTONE 649 U',
                 background: '#E6E6E6'
             },
-            {
-                rgb: 'R255 G255 B255',
-                cmyk: 'C0 M0 Y0 K0',
-                hex: '#FFFFFF',
-                pantoneC: '',
-                pantoneU: '',
-                background: '#FFFFFF'
-            }
+            { rgb: 'R255 G255 B255', cmyk: 'C0 M0 Y0 K0', hex: '#FFFFFF', pantoneC: '', pantoneU: '', background: '#FFFFFF' }
         ];
     }
+    getTextColor(value) {
+        // hex branch
+        if (value.startsWith('#')) {
+            const hex = value.slice(1);
+            const r = parseInt(hex.substring(0, 2), 16);
+            const g = parseInt(hex.substring(2, 4), 16);
+            const b = parseInt(hex.substring(4, 6), 16);
+            const brightness = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
+            return brightness > 0.5 ? 'text-default' : 'text-inverse';
+        }
+        // rgb(...) branch
+        if (/rgb/i.test(value)) {
+            const nums = value
+                .replace(/rgba?\(/i, '')
+                .replace(')', '')
+                .split(',')
+                .map((n) => parseFloat(n.trim()));
+            const [r, g, b] = nums;
+            const brightness = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
+            return brightness > 0.5 ? 'text-default' : 'text-inverse';
+        }
+        // fallback
+        return 'text-default';
+    }
     render() {
-        return (index.h("ul", { key: 'c58041047c7d7993ac4e936051d40e1e8dda5263', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.rgb), index.h("span", { class: "f-body-02 w-full" }, color.cmyk), index.h("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.pantoneC || 'N/A'), index.h("span", { class: "f-body-02" }, color.pantoneU || 'N/A'))))))));
+        return (index.h("ul", { key: 'cf31dbb2778735cb95f40243f557e97c15cd29f0', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, this.colors.map((color) => {
+            // compute once
+            const textClass = this.getTextColor(color.background);
+            return (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }, index.h("div", { class: "grid" }, index.h("span", { class: `f-body-02 ${textClass}` }, color.cmyk), index.h("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' }, class: textClass })), index.h("div", { class: "grid" }, index.h("span", { class: `f-body-02 ${textClass}` }, color.pantoneC), index.h("span", { class: `f-body-02 ${textClass}` }, color.pantoneU)))));
+        })));
     }
 };
 
@@ -185,7 +198,7 @@ const GradientPrimaryPalette = class {
         ];
     }
     render() {
-        return (index.h("ul", { key: '95d991a7331f3f75909421db363b0c30646dd9f7', class: "gap-y-8 md:gap-y-12 lg:gap-y-16", style: {
+        return (index.h("ul", { key: '469fc7f19a4346b7e930095c489c0e89cc58e6df', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16", style: {
                 background: 'linear-gradient(to bottom, #9CE142 0%, #00C959 50%, #00A595 100%)'
             } }, this.colors.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "effect-height flex items-center justify-between p-16" }, index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.rgb), index.h("span", { class: "f-body-02 w-full" }, color.cmyk), index.h("eds-code-block", { code: color.hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { class: "grid" }, index.h("span", { class: "f-body-02" }, color.pantoneC), index.h("span", { class: "f-body-02" }, color.pantoneU))))))));
     }
@@ -247,19 +260,19 @@ const GradientSecondaryPalette = class {
         ];
     }
     render() {
-        return (index.h("div", { key: '95324cdbb1dc2eec5d1b47b5a88b69c9e2139535' }, index.h("ul", { key: 'deddb39135e4dee2c6b401eb543ea2169d606331', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, index.h("li", { key: '848cdd2984b1dc5b2c0672ab125fe951b9c7d30c', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: 'af8b2fd8be90d0fffe2334f66878a34b32fa148f', class: "effect-height flex items-center justify-between p-16", style: {
+        return (index.h("div", { key: 'bcfd5c5ca5a01138d27ae5f0867998bb40d526ac' }, index.h("ul", { key: '6f79d13b142488f1253ba77b0a044fd8ada8d297', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, index.h("li", { key: 'e8e44a1ee3993564fc2331d0d9337a2e0ceaebc1', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '229940b2fe6264429fb7627c9d3aa02e18e90b5a', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[0].background
-            } }, index.h("div", { key: 'b796899ca009ee80c877e2e728639abcf2b46770', class: "grid" }, index.h("span", { key: '2ba29c5bb91fef4b817f853056701feb001bdca0', class: "f-body-02" }, this.colors[0].rgb), index.h("span", { key: '23e36499f1ba4dd08ac928c6fefc6d38f03f4724', class: "f-body-02 w-full" }, this.colors[0].cmyk), index.h("eds-code-block", { key: '11af3db24e81dc5382e8b3c64296e0416c3a2a5a', code: this.colors[0].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '0bc7aa191c1ddd71c5e716ac07687c2412530bad', class: "grid" }, index.h("span", { key: '3b84d1f6f75c3fa401fc08597318cb24e00a6db3', class: "f-body-02" }, this.colors[0].pantoneC), index.h("span", { key: 'beb7250e567791947e9ccda81cf99d4fd3c7e007', class: "f-body-02" }, this.colors[0].pantoneU))), index.h("div", { key: 'd5c6301370b862c3bd713188b468ed22f9377e9c', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, index.h("div", { key: '0cf83c147dde777efe2783d2148e780ab328c978', class: "grid" }, index.h("span", { key: '06f893ff45abe7c1d3cb817fe5834a5176c93f06', class: "f-body-02" }, this.colors[0].rgb), index.h("span", { key: '3967e17ed980810d8b35b0d2b2e754f7b2e8b3e0', class: "f-body-02 w-full" }, this.colors[0].cmyk), index.h("eds-code-block", { key: '2adc489cee7b3a3a67f62493fb5e125fc1e75c04', code: this.colors[0].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: 'cb27de2308afcaaaad82675c50573805e51f36f7', class: "grid" }, index.h("span", { key: '0655190c8a8d555ed0fec5c319ff349d9fefc4d0', class: "f-body-02" }, this.colors[0].pantoneC), index.h("span", { key: '2b75a99e922965547e9f86240c0db577ec0b9682', class: "f-body-02" }, this.colors[0].pantoneU))), index.h("div", { key: 'a8b7ef1c5309601366baffa2d3b48c6cd8893eb6', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[1].background
-            } }, index.h("div", { key: '14958bec1bc69da8afcd5abbec40153900003aea', class: "grid" }, index.h("span", { key: '7efe478f1588fc12a88e74eb6385a9ac1e83f2d2', class: "f-body-02" }, this.colors[1].rgb), index.h("span", { key: 'aaf8b133f495682cd5934be9719889fd6cd79d5f', class: "f-body-02 w-full" }, this.colors[1].cmyk), index.h("eds-code-block", { key: 'ba3050a85770e74810686603510bbd439e9c48c2', code: this.colors[1].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: 'cc133d0be620d1749317a2d46386c3b662c7e231', class: "grid" }, index.h("span", { key: '77a6292eec6c5b36a209d627e8ebe4b0d8978529', class: "f-body-02" }, this.colors[1].pantoneC), index.h("span", { key: '4bbf9a51af72aecd3d8e40388d56f7ec04307e5b', class: "f-body-02" }, this.colors[1].pantoneU))))), index.h("eds-block-break", { key: 'd8bd95b4b6a4992490b8a28c88ba94524ed3f89d' }), index.h("ul", { key: 'dcd47948561897e2b9dd5052f542b6faece97160', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, index.h("li", { key: '4c2780b54496da965860adb2a13b3874198d2c50', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '1817732e6c42366661ef95cc1efad7bb3443481d', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, index.h("div", { key: 'fd01906e34a91984aa7ce6439abcf03673d70099', class: "grid" }, index.h("span", { key: 'd4e119028ad415d9a21988c2bf603011856bb78d', class: "f-body-02" }, this.colors[1].rgb), index.h("span", { key: '4ba9d26645884bc1fc75741ee40509af56a9e7ae', class: "f-body-02 w-full" }, this.colors[1].cmyk), index.h("eds-code-block", { key: '5be1c28b15b458fba099868b598ee513077562e0', code: this.colors[1].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '8609b9e68f23aaec35e76b312a425c376d508892', class: "grid" }, index.h("span", { key: 'f5cbb2d867e1a66e8371ebd73503ac1cd208f51d', class: "f-body-02" }, this.colors[1].pantoneC), index.h("span", { key: 'b72b8b23c5b1e136cb1114af22f34c6222b0d0f9', class: "f-body-02" }, this.colors[1].pantoneU))))), index.h("eds-block-break", { key: '73e70749f132579efc19bccab4fff8b3e2d6979a' }), index.h("ul", { key: 'ae61acfb731129d85d3c5151ac08d676113a5971', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, index.h("li", { key: '2b59810dbc40db3dfca10a09ad524499ea87f0e9', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: 'e66cdabf69654205b975801bbc5ff102982fba78', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[2].background
-            } }, index.h("div", { key: 'fdb50c1ad5c1b19aa7d6b271857d63d7ff129d66', class: "grid" }, index.h("span", { key: '4b5f5b8e075d73329803b5ca1204c257e8e8d6c4', class: "f-body-02" }, this.colors[2].rgb), index.h("span", { key: '67a26de500956ca477aa2213e6ecf8bea6d7ecb0', class: "f-body-02 w-full" }, this.colors[2].cmyk), index.h("eds-code-block", { key: 'f0cd24d68af26304da2bfc8755328ca9d319c1b9', code: this.colors[2].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: 'f45ddb2b08e36a64e0383289fe7e1e70d11bc725', class: "grid" }, index.h("span", { key: 'b5f5fd53de2e0fee6122c0797f3269dd0e70e9f3', class: "f-body-02" }, this.colors[2].pantoneC), index.h("span", { key: 'cbe037d718989eaf0274463ed300e81415e701e9', class: "f-body-02" }, this.colors[2].pantoneU))), index.h("div", { key: '64e866bab4859c8a35a08440bf4c855d3824d20a', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, index.h("div", { key: '0f4d10150dc7694d7d4ccf59bc99a95216a00bc5', class: "grid" }, index.h("span", { key: '85bbcdc4ca9b1f35625c15f5e742c35599084456', class: "f-body-02" }, this.colors[2].rgb), index.h("span", { key: '0b5354d88e4ada3497bb20ae9138e3f23d31b5e7', class: "f-body-02 w-full" }, this.colors[2].cmyk), index.h("eds-code-block", { key: 'a67ca35d57d13a66fcab132565c1a246e37f42e8', code: this.colors[2].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '41322955767caa5ce439b142ccacdcb809ebc52e', class: "grid" }, index.h("span", { key: 'ab06d7acd75b1065d057a4ec8cd7af93cd91bb5c', class: "f-body-02" }, this.colors[2].pantoneC), index.h("span", { key: 'ec63cad47f9021cfd1bed508721cc5772d037bd3', class: "f-body-02" }, this.colors[2].pantoneU))), index.h("div", { key: 'ce5898b0ff195f6033d28e68dfd981a1813a23a4', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[3].background
-            } }, index.h("div", { key: '1060ff9082dc3fd0c1d76a7b1c348ee980d59d5d', class: "grid" }, index.h("span", { key: 'abe785e555f4ec227ae6fd5eda65431b63f69d84', class: "f-body-02" }, this.colors[3].rgb), index.h("span", { key: '43a7d7afd959c53d552225df797f308f2c6672c0', class: "f-body-02 w-full" }, this.colors[3].cmyk), index.h("eds-code-block", { key: '0238b051353f4d717d7e1fc8a2d038e03c337150', code: this.colors[3].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: 'c922aca2c73e3d489f029edee6c21f2c741608bc', class: "grid" }, index.h("span", { key: 'fd09943b23b1c58efcb1f971fde59cdcdd6fb6d3', class: "f-body-02" }, this.colors[3].pantoneC), index.h("span", { key: '5a9e9d68d53c02c9a871efc71e384bfe4f3dc15e', class: "f-body-02" }, this.colors[3].pantoneU))))), index.h("eds-block-break", { key: '708821f7228d40fa0a6af2ce906955e7d0a9134a' }), index.h("ul", { key: 'af9971a8abdf34a4397466712e6391496a4fbbfb', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, index.h("li", { key: 'fc026fa3187ed8536a553a34eca496d60c0a3c28', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: 'd42c5c8620956085d632daa27f552935cc57c4f5', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, index.h("div", { key: '1126fbf08d60b5840ba76e7d838d0ebfb47a0af9', class: "grid" }, index.h("span", { key: 'd18fbf24fcedb41638c626991e9ef3706cd0e4f7', class: "f-body-02" }, this.colors[3].rgb), index.h("span", { key: '9d7d1df13ce9ab7b447d72851a2f5f3b66cf1034', class: "f-body-02 w-full" }, this.colors[3].cmyk), index.h("eds-code-block", { key: '5f92ba3b52a56638b7469572614d75fde23a1516', code: this.colors[3].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '4b17671dd5d18382d80ee52b8cbce51633d78603', class: "grid" }, index.h("span", { key: 'cc6a59b63bcd128d5adfd70d908cecba1324a717', class: "f-body-02" }, this.colors[3].pantoneC), index.h("span", { key: '1cf37dab03769794f85d09d8d331306fb24e2fb3', class: "f-body-02" }, this.colors[3].pantoneU))))), index.h("eds-block-break", { key: '1e1888c860c39e5ac93c2dcd5ff9bf65e8c3b412' }), index.h("ul", { key: '46ee0e1cd0a80a6da7991ee9474e4db5841b1c52', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, index.h("li", { key: '59343e8799ddb56b0d14d3a9c43f4d43c5d82cba', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '5388a8eb55332a9a6d5b5fbe8bf022eb2a76d06c', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[4].background
-            } }, index.h("div", { key: '3cd0f3371918e997facce06672764914a168e7b9', class: "grid" }, index.h("span", { key: '1111da42bd889d65bba8615cbb321c1ad6386a5b', class: "f-body-02" }, this.colors[4].rgb), index.h("span", { key: '172ea59eb6a729ba29341662dba089d665dfe921', class: "f-body-02 w-full" }, this.colors[4].cmyk), index.h("eds-code-block", { key: '7a56e5937a4ae52d5c55489d49379b04d99f1bc3', code: this.colors[4].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '4a5fd644619823b3ae0e30cd60fa6d7bfc643047', class: "grid" }, index.h("span", { key: '15a2d7d98420c0ebb8fe3914bb1457e821a5a99a', class: "f-body-02" }, this.colors[4].pantoneC), index.h("span", { key: '4e09b1d98588aba17283686303f02ddce63b9f79', class: "f-body-02" }, this.colors[4].pantoneU))), index.h("div", { key: '527816987ba5afd8d906ab1b1c92c1499bb0c82c', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, index.h("div", { key: '0f57d835c53d5844a155c8cfb78b1b3d0d37aecd', class: "grid" }, index.h("span", { key: '65b91767f90901590ca0ca4d892bf4bf5ca215d2', class: "f-body-02" }, this.colors[4].rgb), index.h("span", { key: 'c2c46be9bee84e4ca53929dc9a0f5b87f48ad3ed', class: "f-body-02 w-full" }, this.colors[4].cmyk), index.h("eds-code-block", { key: 'c40e13a9f535d710cede159d555fac9bbddf7b4c', code: this.colors[4].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '0ebf1113e44f4e2704465d286022b84ddd57c43e', class: "grid" }, index.h("span", { key: 'e8c7485dfe4b2d1e36eae2cb21ec624384e5c085', class: "f-body-02" }, this.colors[4].pantoneC), index.h("span", { key: '7d875d8c15a4f7bee7c746d9f297bd910f4cc5a6', class: "f-body-02" }, this.colors[4].pantoneU))), index.h("div", { key: '27777683ba91c02274fd691b09a43c836e24aca3', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[5].background
-            } }, index.h("div", { key: '5723ecebf48cb271b908892880b2e5916a2260d3', class: "grid" }, index.h("span", { key: '1f4bc5243c69d4d875100dea5678eca909a318d6', class: "f-body-02" }, this.colors[5].rgb), index.h("span", { key: 'a0d7e3283b2c27c9c909174671f84f0e127fd47b', class: "f-body-02 w-full" }, this.colors[5].cmyk), index.h("eds-code-block", { key: '80eb873c0ef3db0ab0fedb0b97fd6a55c77b7a9b', code: this.colors[5].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '7ad8e2f8fd77fa22f8c960b9f60b93160d7b18e4', class: "grid" }, index.h("span", { key: '76d8a46dc70cabfb90314730a14cf613dd94e5a2', class: "f-body-02" }, this.colors[5].pantoneC), index.h("span", { key: '6fba90e3c22c2a2cb79dc99345648fdce235a529', class: "f-body-02" }, this.colors[5].pantoneU)))))));
+            } }, index.h("div", { key: '4f9b082b9e6c5d679801446fa5a7b88d18b40147', class: "grid" }, index.h("span", { key: '6afd59aafb0f1b793a8f989f7d201a922951dacd', class: "f-body-02" }, this.colors[5].rgb), index.h("span", { key: '2114f91de062deba17e69d9bff77670107ed3f91', class: "f-body-02 w-full" }, this.colors[5].cmyk), index.h("eds-code-block", { key: '08f8b3155d932eed5b05f4dbfc0e3c6e23aa02b5', code: this.colors[5].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '5459b32225dbf86021dd6a95e84b73bf14a74fe8', class: "grid" }, index.h("span", { key: 'bedfeaa4250c3bf74f267d50aecc0df93fbf21ad', class: "f-body-02" }, this.colors[5].pantoneC), index.h("span", { key: '8cc7a7a1abef3dcccad63c600692bffa5df89837', class: "f-body-02" }, this.colors[5].pantoneU)))))));
     }
 };
 
@@ -311,11 +324,11 @@ const GradientSupportPalette = class {
         ];
     }
     render() {
-        return (index.h("ul", { key: '2d73e1f2954e7900990f3f1b92e088172c48d193', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, index.h("li", { key: 'ddd095d39334d645bd69143f975c869c9061becf', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '8fdd52e523f612f65293cefa69cd1587722ea0b2', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[0].background } }, index.h("div", { key: 'ba16ce258232ac4ff1dd57e69ce89eba2755ea4e', class: "grid" }, index.h("span", { key: 'e5bbd8438eedce22c00a570b5000bb2f9544f943', class: "f-body-02" }, this.colors[0].rgb), index.h("span", { key: '26bdb7eab2bf73b568d79a31d697d835a1a2c16d', class: "f-body-02 w-full" }, this.colors[0].cmyk), index.h("eds-code-block", { key: '63ed93911453afa708119d3bc237581fc14d859b', code: this.colors[0].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: 'a99939016fee0fdcbfc8916ddabc70da990506b6', class: "grid" }, index.h("span", { key: 'f51ea8694129ef99920037fae8837b2c4f7552ce', class: "f-body-02" }, this.colors[0].pantoneC || 'N/A'), index.h("span", { key: '047e32f25dc6f2c8d8c0881c500e4485d20e9312', class: "f-body-02" }, this.colors[0].pantoneU || 'N/A')))), index.h("li", { key: '8364ad80dc8a18b4315f9e39f8d364fe928e1334', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: 'f03dce05b8e864f63560d3ac02bdbc37c66f5c00', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[1].background } }, index.h("div", { key: 'b6995567668ffafb14824bfcb2394dfbaff7f718', class: "grid" }, index.h("span", { key: 'eea29f050955e9cb036650af9760f4056ca2de29', class: "f-body-02" }, this.colors[1].rgb), index.h("span", { key: '4978ad35c6902267c8bbecb471ea479c2a08577b', class: "f-body-02 w-full" }, this.colors[1].cmyk), index.h("eds-code-block", { key: 'e043773af3e73ebd7978c7f7bc7cbc0ca02f162c', code: this.colors[1].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '3fa13de855940e4188818ff7031463b9d3915511', class: "grid" }, index.h("span", { key: '0c5f5c3ab2946033c7ff74f39b7a71380471d887', class: "f-body-02" }, this.colors[1].pantoneC || 'N/A'), index.h("span", { key: '4b21f7ed78add17b4d013c59aac12976670ef037', class: "f-body-02" }, this.colors[1].pantoneU || 'N/A')))), index.h("li", { key: 'fce44ca75c9d2317b6fd9a1953db054b8d1ca4b3', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '4748c78922ae9c03cd457911b0e9e92c818545d8', class: "effect-height flex items-center justify-between p-16", style: {
+        return (index.h("ul", { key: 'd965ec67f29697480e0b7a6fea0743d946476153', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, index.h("li", { key: '7ae7f96aa9b3ce2a8d1fbc018b652a83e4f41e90', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '604c51b26cc5eec60e2e0125cda0cb60c82282f0', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[0].background } }, index.h("div", { key: '083d7aa003c99b54dc0c62c5ba1603c2a2a75c0a', class: "grid" }, index.h("span", { key: '4bc89f70e22217fa58f1db0586a8d5ee0db8bdae', class: "f-body-02" }, this.colors[0].rgb), index.h("span", { key: 'd8e1bb4f6ce3e173e31685fc4435be29d9eac4a4', class: "f-body-02 w-full" }, this.colors[0].cmyk), index.h("eds-code-block", { key: 'e370e6ea2808161625aea5e9b1e6e4dd9d137f33', code: this.colors[0].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '6caf8c42e6296081a3daaca0e52c2a2776d1ab46', class: "grid" }, index.h("span", { key: '48ac4de4d194ae630a8a14df56ff2670f2f37092', class: "f-body-02" }, this.colors[0].pantoneC || 'N/A'), index.h("span", { key: 'fd02781c816a152d92c1579dc9a3115eadb0690e', class: "f-body-02" }, this.colors[0].pantoneU || 'N/A')))), index.h("li", { key: 'a8562d9fb6ff77fcc6b31952a2ead12f3e0e9b50', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '4578880af1de315101deb5b42c91769dc2ca7437', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[1].background } }, index.h("div", { key: 'ed304eb3c8c3ccb769db7d769872ce075261cb17', class: "grid" }, index.h("span", { key: '956fe1115a5c1c4f6d2503737a46f0f1cbdc8e06', class: "f-body-02" }, this.colors[1].rgb), index.h("span", { key: '6beb1017eec40dd27351fda2ec1609987d46fb05', class: "f-body-02 w-full" }, this.colors[1].cmyk), index.h("eds-code-block", { key: 'a9319b683d13670c827b3444484d5469142ef76d', code: this.colors[1].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '1d4f1a48a18aee0a90dd04fb336352042014ce29', class: "grid" }, index.h("span", { key: 'f4b7df5e0cde451a5e650e11b9805cc5be0c9fec', class: "f-body-02" }, this.colors[1].pantoneC || 'N/A'), index.h("span", { key: '26d4869a2207e1386f72d2833aaf819c15006c34', class: "f-body-02" }, this.colors[1].pantoneU || 'N/A')))), index.h("li", { key: 'ed2b1465825e249bff9f5df38649b331f19e0672', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '22182a6d9bb64ab5dcbc38e359c3a7d7f79f3090', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[2].background
-            } }, index.h("div", { key: '9cff6d7998f301a7c97d939bf5c38e5687fb0bde', class: "grid" }, index.h("span", { key: 'a1561d5f9472d43e40bd054cf516458f89841c3f', class: "f-body-02" }, this.colors[2].rgb), index.h("span", { key: 'b55020b6dbb423ec2151b81c185311229993ec83', class: "f-body-02 w-full" }, this.colors[2].cmyk), index.h("eds-code-block", { key: 'ae4d929c795f5e12cb1f2f41aad3bfc9a1db47c7', code: this.colors[2].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '3ba7d23eb05b4dcc97b8dd7204a93daca6e0e798', class: "grid" }, index.h("span", { key: '4c047aae61adb93550b0ce1da65387b6d57e745f', class: "f-body-02" }, this.colors[2].pantoneC), index.h("span", { key: '8d8776d142dd8f9378900dc152b32b5b3cfbe95e', class: "f-body-02" }, this.colors[2].pantoneU))), index.h("div", { key: 'd4d02de329e6d6407c8e360a7b1838395f7aab40', class: "effect-height flex items-center justify-between p-16", style: {
+            } }, index.h("div", { key: '28e2e772e7d12fbfdebec31f0aff6db397140132', class: "grid" }, index.h("span", { key: '872451c9846398641f1a592e8c166a6a51ee7298', class: "f-body-02" }, this.colors[2].rgb), index.h("span", { key: '84e28be1191f264e126c8579e26cbe6966010b4d', class: "f-body-02 w-full" }, this.colors[2].cmyk), index.h("eds-code-block", { key: 'a4c3dc76652feefaf3a9eba5bb3694b8dbf96be8', code: this.colors[2].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: 'ff3a6599da869d3f9e85cb94481206e7e6331988', class: "grid" }, index.h("span", { key: '37ef90488eb673fdac1221f7123daa87a5a75fcd', class: "f-body-02" }, this.colors[2].pantoneC), index.h("span", { key: '0a6fbb96f982a3e7c12af3787520335878faa9fe', class: "f-body-02" }, this.colors[2].pantoneU))), index.h("div", { key: 'b59aeb053ab1145e0d3bc163f4650cdf30afe7d4', class: "effect-height flex items-center justify-between p-16", style: {
                 background: this.colors[3].background
-            } }, index.h("div", { key: '50659022ed31e85fa46df11e33050430bc3a92db', class: "grid" }, index.h("span", { key: 'b2353739a0a09c5576eed0355a2c96913fb81a97', class: "f-body-02" }, this.colors[3].rgb), index.h("span", { key: 'a40cd11295617a0b67bfe1ac49420d9918503a6d', class: "f-body-02 w-full" }, this.colors[3].cmyk), index.h("eds-code-block", { key: 'd42fa64fbc856b2a52241650d6b74acd2b8642ee', code: this.colors[3].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '341bd4f637751cefa429bc6c3aab0adc714830e6', class: "grid" }, index.h("span", { key: '728dfa47d7e92236cfb9c321fcd610a9cd3c4cd8', class: "f-body-02" }, this.colors[3].pantoneC), index.h("span", { key: '3f06c0d1468942e9999655d32b0b32454720ceae', class: "f-body-02" }, this.colors[3].pantoneU)))), index.h("li", { key: '9bdd7ba9ccb255e8540b12ae33636a164f2d2da1', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: 'e700e5494922cdd1940a4002cab7fecfd407ce72', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[4].background } }, index.h("div", { key: '7dc4bfe5e3db4754f7e0c21005b36e16f32cf531', class: "grid" }, index.h("span", { key: '7faca86fa5a0477b8a136c39c9e6caac63bbaa27', class: "f-body-02" }, this.colors[4].rgb), index.h("span", { key: 'b0dede7a2415df03772b15e32feb066f1dc18124', class: "f-body-02 w-full" }, this.colors[4].cmyk), index.h("eds-code-block", { key: '3903bcb378fc37313c79c187d2722a80773a6fdf', code: this.colors[4].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: 'b15d2d0529d6ac65f549219155b0dc1f17c4e43e', class: "grid" }, index.h("span", { key: 'c7bc170b9f4b11552e5f5b7332fb3cc2db628dbf', class: "f-body-02" }, this.colors[4].pantoneC || 'N/A'), index.h("span", { key: '8c643a1a1590e3cf928835afc3a0a8c35dbe18f2', class: "f-body-02" }, this.colors[4].pantoneU || 'N/A'))))));
+            } }, index.h("div", { key: 'af020f1a66c2d0afcb2e2bdf189569e6d897ef32', class: "grid" }, index.h("span", { key: '3b2f895dccdeb5e2fb5aa505f19514f012d24426', class: "f-body-02" }, this.colors[3].rgb), index.h("span", { key: '9836a6ef47ed0dc8767a590212a23bfca2f74adf', class: "f-body-02 w-full" }, this.colors[3].cmyk), index.h("eds-code-block", { key: '3b274f716c6ca1381e4cc0136d18e167290bfa74', code: this.colors[3].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: 'a41592e2172dc9f81e9d2f36328ff88de3f0954e', class: "grid" }, index.h("span", { key: 'fd7a06a256d3513bcf239fe9f778f3589895b9d5', class: "f-body-02" }, this.colors[3].pantoneC), index.h("span", { key: '991f38ea137b729c9e9e6c9e0031940151f6e9dc', class: "f-body-02" }, this.colors[3].pantoneU)))), index.h("li", { key: '8efdd7d9f93cba4b9479e1d3face7cec94cf1af6', class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { key: '4223ec29cac4313dc261cb472bd880ae00279657', class: "effect-height flex items-center justify-between p-16", style: { backgroundColor: this.colors[4].background } }, index.h("div", { key: '227dd5fab1add4083271b6e7f95c7d575d91252e', class: "grid" }, index.h("span", { key: 'e5b1aab8d67f7c67f231acd4156768f146320be3', class: "f-body-02" }, this.colors[4].rgb), index.h("span", { key: 'fc4712e37494e8e30a48bc77a0ca61c94e24075d', class: "f-body-02 w-full" }, this.colors[4].cmyk), index.h("eds-code-block", { key: 'a429c519e42e242d8ce8f661a513f7b5327ffce7', code: this.colors[4].hex, style: { minWidth: '150px', marginRight: '5px' } })), index.h("div", { key: '84f30a1620cacadf8c0bf1382333d74772f81f27', class: "grid" }, index.h("span", { key: '2b6dfc8e87517e4d0421ef0e5c2391a07f033600', class: "f-body-02" }, this.colors[4].pantoneC || 'N/A'), index.h("span", { key: 'c4cd5bc061ce4163a170568c0ed5934c7f30d75f', class: "f-body-02" }, this.colors[4].pantoneU || 'N/A'))))));
     }
 };
 

package/dist/cjs/{eds-components-section.cjs.entry.js → components-section.cjs.entry.js}

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2f63169d.js');
 
-const EdsComponentsOverview = () => (index.h("div", { class: "static-content container" },
+const DocsOverview = () => (index.h("div", { class: "static-content container" },
     index.h("h2", null, "Load the module"),
     index.h("p", null,
         "Integrating the EBRAINS UI Components to a project without a JavaScript framework is straight forward. If you\u2019re working on a simple HTML page, you can start using the components immediately by adding the tags below to the",
@@ -39,15 +39,19 @@ const EdsComponentsOverview = () => (index.h("div", { class: "static-content con
         ' ',
         index.h("code", null, "head")),
     index.h("eds-code-block", { code: '<link rel="stylesheet" href="https://unpkg.com/@ebrains/assets@latest/styles/output.css"/>', language: "css", "copy-label": "Copy Code" }),
+    index.h("p", null,
+        "To directly use only the produced variables add the tag below to the ",
+        index.h("code", null, "head")),
+    index.h("eds-code-block", { code: '<link rel="stylesheet" href="https://unpkg.com/@ebrains/assets@latest/styles/vars.css"/>', language: "css", "copy-label": "Copy Code" }),
     index.h("p", null,
         "Note that, loading the predefined CSS framework above,",
         ' ',
         index.h("b", null, "automatically loads the fonts so you can skip loading them separately"),
         ". If you wish, however, to load the fonts, add the tag below to the ",
         index.h("code", null, "head")),
-    index.h("eds-code-block", { code: '<link rel="stylesheet" href="https://unpkg.com/@ebrains/assets@0.0.1/styles/base/fonts.css"/>', language: "css", "copy-label": "Copy Code" })));
+    index.h("eds-code-block", { code: '<link rel="stylesheet" href="https://unpkg.com/@ebrains/assets@latest/styles/base/fonts.css"/>', language: "css", "copy-label": "Copy Code" })));
 
-const EdsDocsInstallation = () => (index.h("div", null,
+const DocsInstallation = () => (index.h("div", null,
     index.h("p", null, "Before proceeding, ensure that Node.js is installed on your machine\u2014you can download the latest version from the official website. If your project doesn\u2019t already use npm and you plan to integrate EBRAINS Components, you'll need to create a package.json file by running npm init and following the on-screen instructions."),
     index.h("div", { class: "my-8" },
         index.h("eds-code-block", { code: "npm install @ebrains/components", language: "html", "copy-label": "Copy Code" })),
@@ -60,14 +64,15 @@ const EdsDocsInstallation = () => (index.h("div", null,
     index.h("div", { class: "my-8" },
         index.h("eds-code-block", { code: "npm install @ebrains/angular", language: "html", "copy-label": "Copy Code" }))));
 
-const EdsDocsReact = () => (index.h("div", null,
+const DocsReact = () => (index.h("div", null,
     index.h("h2", null, "React Wrappers"),
     index.h("p", null, "To use the EBRAINS web components in a React Application, simple install the package below and check out the examples"),
     index.h("eds-code-block", { code: "npm install @ebrains/react", language: "javascript", "copy-label": "Copy Code" }),
     index.h("eds-section-core", { "section-title": "Example React App", "heading-level": "h3" },
-        index.h("eds-code-block", { code: '\nimport {\n  EdsHeader,\n  EdsFullscreenMenu,\n  EdsUser\n} from "@ebrains/react";\n\ninterface User {\n  firstname: string;\n  lastname: string;\n  // Add any other properties your user object might have\n}\n\ninterface AuthStatus {\n  authenticated: boolean;\n  user: User | null;\n}\n\nimport { useEffect, useState } from "react";\n\nexport function App() {\n  const [authStatus, setAuthStatus] = useState<AuthStatus>({\n    authenticated: false,\n    user: null,\n  });\n  const [activeTabIndex, setActiveTabIndex] = useState<number>(0);\n\n  // Use useEffect to render Stencil components dynamically after the component mounts\n  useEffect(() => {\n    const handleAuthStatusChange = (event: CustomEvent) => {\n      console.log(event.detail);\n      setAuthStatus(event.detail); // Set the entire object\n    };\n\n    document.addEventListener(\n      "authStatusChanged",\n      handleAuthStatusChange as EventListener,\n    );\n\n    return () => {\n      document.removeEventListener(\n        "authStatusChanged",\n        handleAuthStatusChange as EventListener,\n      );\n    };\n  }, []);\n\n  return (\n    <div>\n      <EdsHeader\n        homeUrl="/"\n        menuEnabled={true}\n        inverseHeader={false}\n        links={[\n          { label: "About", url: "#" },\n          { label: "Focus Areas", url: "#" },\n          { label: "News & Events", url: "#" },\n          { label: "Contact", url: "#" }\n        ]}\n      >\n        <div className="px-16">\n          <EdsUser\n            keycloak-url="http://localhost:8080"\n            keycloak-realm="nigeor-realm"\n            keycloak-client-id="stencil-app"\n          ></EdsUser>\n        </div>\n      </EdsHeader>\n\n      <EdsFullscreenMenu\n        home-url="/"\n        links={[\n          { label: "About", url: "#" },\n          { label: "Focus Areas", url: "#" },\n          { label: "News & Events", url: "#" },\n          { label: "Contact", url: "#" }\n        ]}\n      ></EdsFullscreenMenu>\n      \n      <div>\n        User is{" "}\n        {authStatus.authenticated ? "authenticated" : "not authenticated"}\n      </div>\n      {authStatus.user && <div>Welcome, {authStatus.user.firstname}</div>}\n\n      <div id="main"></div>\n    </div>\n  );\n}\n\nexport default App;\n\n', language: "javascript", "copy-label": "Copy Code" }))));
+        index.h("p", null, "This code displays a Stencil-based splash screen that stays visible until an initialization promise resolves (or errors), then hides itself and reveals the main React app content."),
+        index.h("eds-code-block", { code: "\nimport React, { useMemo, useState } from 'react';\nimport {\n  EdsHeader\n  EdsSplashScreen,\n  EdsMatomoNotice,\n  EdsSteps\n} from '@ebrains/react';\nimport './app.css';\n\n// simulate 2s\nfunction fakeInit(): Promise<void> {\n  return new Promise(resolve => setTimeout(resolve, 2000));\n}\n\nexport function App() {\n  // 1) create init promise\n  const initPromise = useMemo(() => fakeInit(), []);\n\n  // 2) is splash still visible\n  const [splashVisible, setSplashVisible] = useState(true);\n  const [initError, setInitError] = useState<string | null>(null);\n\n  // 3) show the UI after the splash has hidden\n  const showApp = !splashVisible && !initError;\n\n  return (\n    <div>\n      {splashVisible && (\n        <EdsSplashScreen\n          inverse={false}\n          initPromise={initPromise}\n          onSplash={(e: CustomEvent) => {\n            if (e.detail.type === 'hidden') {\n              setSplashVisible(false);\n            } else if (e.detail.type === 'error') {\n              setInitError(e.detail.message);\n              setSplashVisible(false);\n            }\n          }}\n        />\n      )}\n\n      {initError && (\n        <div className='error'>\n          Failed to initialize: {initError}\n        </div>\n      )}\n\n      {/* Show App only when ready */}\n      {showApp && (\n        <>\n          <EdsHeader></EdsHeader>\n          <EdsSteps\n            steps={[\n              {\n                title: 'Introduction',\n                content: 'Begin by familiarizing yourself with the overall process.'\n              },\n              {\n                title: 'Process Overview',\n                content: 'Review the detailed steps and understand the workflow.'\n              }\n            ]}\n            type='linear'\n          />\n\n          <EdsMatomoNotice />\n\n          <div id='root'></div>\n        </>\n      )}\n    </div>\n  );\n}\nexport default App;\n", language: "javascript", "copy-label": "Copy Code" }))));
 
-const EdsDocsVue = () => (index.h("div", null,
+const DocsVue = () => (index.h("div", null,
     index.h("h2", null, "Vue Wrappers"),
     index.h("p", null, "To use the EBRAINS web components in a Vue Application, simple install the package below and check out the examples."),
     index.h("eds-code-block", { code: "npm install @ebrains/vue", language: "javascript", "copy-label": "Copy Code" }),
@@ -85,16 +90,16 @@ const EdsDocsVue = () => (index.h("div", null,
         index.h("eds-alert", { message: "This may lead to issues because Vue binds these as attributes .", intent: "error" })),
     index.h("eds-code-block", { code: '<EdsAlert\n  message="This is a default informational alert."\n  intent="default"\n  :pressableLabel="Press Me"\n  :pressableUrl="https://ebrains.eu"\n></EdsAlert>', language: "javascript", "copy-label": "Copy Code" }),
     index.h("div", { class: "my-8" },
-        index.h("eds-alert", { message: "Use the .prop modifier to ensure properties are passed correctly.", intent: "success" })),
+        index.h("eds-alert", { message: "Use the .prop modifier to ensure properties are passed correctly.", intent: "default" })),
     index.h("eds-code-block", { code: '<EdsAlert\n  message="This is a default informational alert."\n  intent="default"\n  :pressableLabel.prop="Press Me"\n  :pressableUrl.prop="https://ebrains.eu"\n></EdsAlert>', language: "javascript", "copy-label": "Copy Code" }),
     index.h("p", null,
         "Using the ",
         index.h("b", null, ".prop"),
         " modifier in Vue ensures that the data you pass to your custom elements is received as intended. It prevents Vue (and the browser) from transforming camelCase property names into lowercase attributes, thereby maintaining the correct data mapping in your Stencil components."),
     index.h("eds-section-core", { "section-title": "Example Vue App", "heading-level": "h3" },
-        index.h("eds-code-block", { code: '\n<template>\n  <EdsHeader \n    :inverseHeader.prop="true"\n    :menuEnabled.prop="true">\n  </EdsHeader>\n</template>\n\n<script>\n\nimport { EdsHeader } from "@ebrains/vue";\n\nexport default {\n  name: "App",\n  components: {\n    EdsHeader,\n  }\n};\n</script>\n', language: "javascript", "copy-label": "Copy Code" }))));
+        index.h("eds-code-block", { code: '\n<template>\n  <div>\n    <EdsHeader></EdsHeader>\n    <!-- render the splash until we manually hide it -->\n    <EdsSplashScreen inverse="false" />\n\n    <!-- then show main UI -->\n    <div v-if="!splashVisible" class="container my-16">\n      <EdsSteps \n        :steps="JSON.stringify(stepsdata)"\n        type="linear"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { EdsSplashScreen, EdsSteps, EdsHeader } from "@ebrains/vue";\n\nexport default {\n  name: "App",\n  components: { EdsHeader, EdsSplashScreen, EdsSteps },\n  data() {\n    return {\n      stepsdata: [\n        { title: "Introduction", content: "Begin by familiarizing yourself with the overall process." },\n        { title: "Process Overview", content: "Review the detailed steps and understand the workflow." }\n      ],\n      splashVisible: true\n    };\n  },\n  methods: {\n    delay(ms) {\n      return new Promise(resolve => setTimeout(resolve, ms));\n    },\n    async initialize() {\n      try {\n        // simulate your init work\n        await this.delay(2000);\n\n        // fire the built-in event that EdsSplashScreen listens for\n        window.dispatchEvent(new Event("hideSplash"));\n      } catch (e) {\n        console.error("Init error", e);\n        window.dispatchEvent(new Event("hideSplash"));\n      } finally {\n        // show the rest of the app\n        this.splashVisible = false;\n      }\n    }\n  },\n  mounted() {\n    this.initialize();\n  }\n};\n</script>\n', language: "javascript", "copy-label": "Copy Code" }))));
 
-const EdsDocsAngular = () => (index.h("div", null,
+const DocsAngular = () => (index.h("div", null,
     index.h("h2", null, "Angular Wrappers"),
     index.h("p", null, "To use the EBRAINS web components in an Angular Application, simple install the package below and check out the examples."),
     index.h("eds-code-block", { code: "npm install @ebrains/angular", language: "javascript", "copy-label": "Copy Code" }),
@@ -105,7 +110,7 @@ const EdsDocsAngular = () => (index.h("div", null,
     index.h("eds-section-core", { "section-title": "Example Angular App", "heading-level": "h3" },
         index.h("eds-code-block", { code: '\n<div class="container">\n  <eds-breadcrumb\n    intent="tertiary"\n    items="[\n      { "label": "Home", "url": "#" },\n      { "label": "Products", "url": "#" },\n    ]">\n  </eds-breadcrumb>\n  <eds-footer></eds-footer>\n</div>', language: "javascript", "copy-label": "Copy Code" }))));
 
-const EdsComponentsSection = class {
+const ComponentsSection = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.tabIndex = undefined;
@@ -113,22 +118,22 @@ const EdsComponentsSection = class {
     renderContent() {
         switch (this.tabIndex) {
             case 0:
-                return index.h(EdsComponentsOverview, null);
+                return index.h(DocsOverview, null);
             case 1:
-                return index.h(EdsDocsInstallation, null);
+                return index.h(DocsInstallation, null);
             case 2:
-                return index.h(EdsDocsReact, null);
+                return index.h(DocsReact, null);
             case 3:
-                return index.h(EdsDocsVue, null);
+                return index.h(DocsVue, null);
             case 4:
-                return index.h(EdsDocsAngular, null);
+                return index.h(DocsAngular, null);
             default:
                 return index.h("p", null, "Content not available.");
         }
     }
     render() {
-        return index.h("div", { key: '85fff494e98ff10bbcc630487a75d345e7cce78c', class: "container" }, this.renderContent());
+        return index.h("div", { key: 'ee8facfaad3786770fd3ea39f1db7922a67ffd3e', class: "container" }, this.renderContent());
     }
 };
 
-exports.eds_components_section = EdsComponentsSection;
+exports.components_section = ComponentsSection;

package/dist/cjs/components.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy(JSON.parse("[[\"eds-accordion_17.cjs\",[[1,\"eds-fullscreen-menu\",{\"links\":[1],\"menuLinks\":[1,\"menu-links\"],\"homeUrl\":[1,\"home-url\"],\"inverseHeader\":[4,\"inverse-header\"],\"isMenuOpen\":[32]},[[16,\"toggleMenu\",\"handleToggleMenu\"]]],[1,\"eds-user\",{\"user\":[1025]}],[1,\"eds-header\",{\"homeUrl\":[513,\"home-url\"],\"links\":[1],\"inverseHeader\":[4,\"inverse-header\"],\"menuEnabled\":[4,\"menu-enabled\"],\"isMenuOpen\":[32],\"isUserMenuOpen\":[32],\"isAuthenticated\":[32]},[[16,\"authStatusChanged\",\"onAuthStatusChanged\"]]],[1,\"eds-steps-v2\",{\"steps\":[1],\"type\":[1],\"imageSrc\":[1,\"image-src\"],\"bg\":[4],\"message\":[1],\"activeStep\":[32]},null,{\"activeStep\":[\"activeStepChanged\"]}],[1,\"eds-footer\",{\"social\":[4],\"enableScrollTop\":[4,\"enable-scroll-top\"],\"fundedBy\":[1,\"funded-by\"],\"rightsReserved\":[1,\"rights-reserved\"],\"enableCookiesSettings\":[4,\"enable-cookies-settings\"],\"showMatomoNotice\":[32]}],[1,\"eds-matomo-notice\",{\"title\":[1],\"description\":[1],\"optOutMessage\":[1,\"opt-out-message\"],\"forceShow\":[4,\"force-show\"],\"showNotice\":[32]},[[16,\"cookies\",\"toggleCookiesConsent\"]]],[1,\"eds-dropdown\",{\"icon\":[1],\"label\":[1],\"rounded\":[4],\"ariaLabel\":[1,\"aria-label\"],\"asNav\":[4,\"as-nav\"],\"dropdownPos\":[1,\"dropdown-pos\"],\"dropdownOffset\":[4,\"dropdown-offset\"],\"intent\":[1],\"isOpen\":[32],\"focusIndex\":[32]},[[8,\"click\",\"handleWindowClick\"],[8,\"keydown\",\"handleKeyDown\"]]],[1,\"eds-steps\",{\"steps\":[1],\"type\":[1],\"activeStep\":[32]},null,{\"activeStep\":[\"activeStepChanged\"]}],[1,\"eds-accordion\",{\"title\":[1],\"description\":[1],\"switchBg\":[4,\"switch-bg\"],\"expanded\":[4],\"clampText\":[4,\"clamp-text\"],\"isExpanded\":[32],\"panelHeight\":[32],\"shortContent\":[32],\"headerHeight\":[32]}],[1,\"eds-social-networks\",{\"title\":[1]}],[1,\"eds-block-break\",{\"extraClass\":[1,\"extra-class\"]}],[1,\"eds-avatar\",{\"firstName\":[1,\"first-name\"],\"lastName\":[1,\"last-name\"],\"picture\":[1],\"initials\":[1],\"color\":[1]}],[1,\"eds-logo\",{\"href\":[1],\"orientation\":[1],\"type\":[1],\"label\":[1]}],[1,\"eds-img\",{\"src\":[1],\"alt\":[1],\"width\":[2],\"height\":[2],\"srcset\":[1],\"sizes\":[1],\"formats\":[16],\"lazyload\":[4],\"withBg\":[4,\"with-bg\"],\"loaded\":[32],\"showBg\":[32]}],[1,\"eds-link\",{\"label\":[1],\"intent\":[1],\"icon\":[1],\"iconPos\":[1,\"icon-pos\"],\"iconSmall\":[4,\"icon-small\"],\"size\":[1],\"external\":[4],\"current\":[4],\"download\":[4],\"url\":[1],\"ariaLabel\":[1,\"aria-label\"],\"disabled\":[4],\"hideLabelOnSmallScreen\":[4,\"hide-label-on-small-screen\"],\"extraClass\":[1,\"extra-class\"]},[[0,\"parentContext\",\"handleParentContext\"]]],[1,\"eds-button\",{\"label\":[1],\"ariaLabel\":[1,\"aria-label\"],\"elementType\":[1,\"element-type\"],\"intent\":[1],\"loading\":[4],\"disabled\":[4],\"pill\":[4],\"icon\":[1],\"size\":[1],\"iconPos\":[1,\"icon-pos\"],\"iconSmall\":[4,\"icon-small\"],\"extraClass\":[1,\"extra-class\"],\"triggerClick\":[16]},[[0,\"parentContext\",\"handleParentContext\"]]],[0,\"eds-icon-wrapper\",{\"icon\":[1],\"class\":[1],\"IconComponent\":[32]},null,{\"icon\":[\"iconChanged\"]}]]],[\"eds-trl.cjs\",[[0,\"eds-trl\",{\"applications\":[1]}]]],[\"eds-svg-repository.cjs\",[[1,\"eds-svg-repository\"]]],[\"eds-docs-palettes.cjs\",[[0,\"eds-docs-palettes\",{\"tabIndex\":[2,\"tab-index\"]}]]],[\"eds-form.cjs\",[[1,\"eds-form\",{\"name\":[1],\"setFormUrl\":[4,\"set-form-url\"],\"formBtn\":[4,\"form-btn\"],\"formBtnLabel\":[1,\"form-btn-label\"],\"errorMessage\":[1,\"error-message\"],\"fields\":[1],\"initData\":[16],\"values\":[32],\"isSubmitting\":[32],\"hasError\":[32],\"errors\":[32],\"parsedFields\":[32]},null,{\"fields\":[\"parseFields\"]}]]],[\"eds-components-section.cjs\",[[0,\"eds-components-section\",{\"tabIndex\":[2,\"tab-index\"]}]]],[\"eds-app-root.cjs\",[[1,\"eds-app-root\",{\"isAuthenticated\":[32]}]]],[\"eds-card-section.cjs\",[[1,\"eds-card-section\",{\"cards\":[1],\"occupyCols\":[2,\"occupy-cols\"]}]]],[\"eds-timeline.cjs\",[[1,\"eds-timeline\",{\"events\":[1],\"selectedEvent\":[32],\"parsedEvents\":[32]},null,{\"events\":[\"parseEvents\"]}]]],[\"eds-card-tool.cjs\",[[1,\"eds-card-tool\",{\"cardTitle\":[1,\"card-title\"],\"url\":[1],\"description\":[1],\"image\":[8],\"avatar\":[1],\"shortAbbreviation\":[1,\"short-abbreviation\"],\"headingLevel\":[1,\"heading-level\"],\"tags\":[8],\"tiny\":[4],\"bg\":[4],\"withHover\":[4,\"with-hover\"],\"external\":[4],\"hierarchy\":[4]}]]],[\"eds-cookies-preference.cjs\",[[0,\"eds-cookies-preference\",{\"buttonText\":[1,\"button-text\"],\"intent\":[1],\"showMatomoNotice\":[32],\"noticeKey\":[32]}]]],[\"eds-docs-tokens.cjs\",[[0,\"eds-docs-tokens\",{\"tabIndex\":[2,\"tab-index\"]}]]],[\"eds-card-project.cjs\",[[0,\"eds-card-project\",{\"image\":[8],\"editorialTitle\":[1,\"editorial-title\"],\"headingLevel\":[1,\"heading-level\"],\"categoryTitle\":[1,\"category-title\"],\"color\":[1],\"bgOnHover\":[4,\"bg-on-hover\"],\"vertical\":[4],\"titleProject\":[1,\"title-project\"],\"url\":[1],\"parsedImage\":[32]}]]],[\"eds-feedback.cjs\",[[1,\"eds-feedback\",{\"type\":[1],\"count\":[2],\"label\":[1],\"description\":[1],\"textMapping\":[1,\"text-mapping\"],\"selectedRating\":[32]},[[16,\"rating\",\"ratingUpdated\"]]]]],[\"eds-logo-variations.cjs\",[[0,\"eds-logo-variations\",{\"tabIndex\":[2,\"tab-index\"]}]]],[\"eds-toast-manager.cjs\",[[1,\"eds-toast-manager\",{\"toasts\":[32]}]]],[\"incorrect-use-of-colors.cjs\",[[0,\"incorrect-use-of-colors\"]]],[\"correct-use-of-colors.cjs\",[[0,\"correct-use-of-colors\"]]],[\"eds-breadcrumb.cjs\",[[1,\"eds-breadcrumb\",{\"items\":[1],\"intent\":[1],\"parsedItems\":[32],\"isSmallScreen\":[32],\"maxVisibleItems\":[32]},null,{\"items\":[\"parseItems\"]}]]],[\"eds-frame.cjs\",[[1,\"eds-frame\",{\"frameLabel\":[1,\"frame-label\"],\"urlLabel\":[1,\"url-label\"],\"errorMessage\":[1,\"error-message\"],\"storybookUrl\":[1,\"storybook-url\"],\"storyPath\":[1,\"story-path\"],\"intent\":[1],\"size\":[1],\"iframeError\":[32]}]]],[\"eds-modal.cjs\",[[1,\"eds-modal\",{\"title\":[1],\"truncate\":[4],\"truncateLines\":[1,\"truncate-lines\"],\"position\":[1],\"isOpen\":[32],\"open\":[64],\"close\":[64],\"toggle\":[64]},[[0,\"eds-modal-open\",\"handleGlobalOpen\"],[0,\"eds-modal-close\",\"handleGlobalClose\"],[8,\"keydown\",\"handleKeyDown\"]]]]],[\"token-ratios.cjs\",[[0,\"token-ratios\"]]],[\"token-typography.cjs\",[[0,\"token-typography\"]]],[\"eds-card-tags.cjs\",[[1,\"eds-card-tags\",{\"accent\":[4],\"tags\":[16]}]]],[\"eds-card-wrapper.cjs\",[[4,\"eds-card-wrapper\",{\"tiny\":[4],\"withBg\":[4,\"with-bg\"],\"withHover\":[4,\"with-hover\"]}]]],[\"eds-icon-arrow-diagonal.cjs\",[[0,\"eds-icon-arrow-diagonal\",{\"class\":[1]}]]],[\"eds-icon-arrow-right.cjs\",[[0,\"eds-icon-arrow-right\",{\"class\":[1]}]]],[\"eds-icon-bluesky.cjs\",[[0,\"eds-icon-bluesky\",{\"class\":[1]}]]],[\"eds-icon-chevron-down.cjs\",[[0,\"eds-icon-chevron-down\",{\"class\":[1]}]]],[\"eds-icon-chevron-left.cjs\",[[0,\"eds-icon-chevron-left\",{\"class\":[1]}]]],[\"eds-icon-chevron-right.cjs\",[[0,\"eds-icon-chevron-right\",{\"class\":[1]}]]],[\"eds-icon-chevron-up.cjs\",[[0,\"eds-icon-chevron-up\",{\"class\":[1]}]]],[\"eds-icon-close.cjs\",[[0,\"eds-icon-close\",{\"class\":[1]}]]],[\"eds-icon-copy.cjs\",[[0,\"eds-icon-copy\",{\"class\":[1]}]]],[\"eds-icon-eu.cjs\",[[0,\"eds-icon-eu\",{\"class\":[1]}]]],[\"eds-icon-facebook.cjs\",[[0,\"eds-icon-facebook\",{\"class\":[1]}]]],[\"eds-icon-gitlab.cjs\",[[0,\"eds-icon-gitlab\",{\"class\":[1]}]]],[\"eds-icon-linkedin.cjs\",[[0,\"eds-icon-linkedin\",{\"class\":[1]}]]],[\"eds-icon-loader.cjs\",[[0,\"eds-icon-loader\",{\"class\":[1]}]]],[\"eds-icon-mastodon.cjs\",[[0,\"eds-icon-mastodon\",{\"class\":[1]}]]],[\"eds-icon-menu.cjs\",[[0,\"eds-icon-menu\",{\"class\":[1]}]]],[\"eds-icon-more.cjs\",[[0,\"eds-icon-more\",{\"class\":[1]}]]],[\"eds-icon-search.cjs\",[[0,\"eds-icon-search\",{\"class\":[1]}]]],[\"eds-icon-star.cjs\",[[0,\"eds-icon-star\",{\"class\":[1]}]]],[\"eds-icon-success.cjs\",[[0,\"eds-icon-success\",{\"class\":[1]}]]],[\"eds-icon-thumbs-down.cjs\",[[0,\"eds-icon-thumbs-down\",{\"class\":[1]}]]],[\"eds-icon-thumbs-up.cjs\",[[0,\"eds-icon-thumbs-up\",{\"class\":[1]}]]],[\"eds-icon-twitter.cjs\",[[0,\"eds-icon-twitter\",{\"class\":[1]}]]],[\"eds-icon-user.cjs\",[[0,\"eds-icon-user\",{\"class\":[1]}]]],[\"eds-icon-youtube.cjs\",[[0,\"eds-icon-youtube\",{\"class\":[1]}]]],[\"eds-switch.cjs\",[[1,\"eds-switch\",{\"checked\":[1540],\"disabled\":[4],\"labelOn\":[1,\"label-on\"],\"labelOff\":[1,\"label-off\"]}]]],[\"eds-tabs.cjs\",[[1,\"eds-tabs\",{\"id\":[1],\"navAriaLabel\":[1,\"nav-aria-label\"],\"tabs\":[1],\"parsedTabs\":[32],\"activeIndex\":[32]},null,{\"tabs\":[\"parseTabs\"]}]]],[\"eds-tooltip.cjs\",[[1,\"eds-tooltip\",{\"content\":[1],\"position\":[1],\"isVisible\":[32],\"isPositioned\":[32],\"tooltipStyle\":[32]},[[1,\"mouseover\",\"showTooltip\"],[1,\"mouseout\",\"hideTooltip\"],[8,\"keydown\",\"handleKeyPress\"]]]]],[\"logo-space.cjs\",[[1,\"logo-space\"]]],[\"logo-wrong-usage.cjs\",[[1,\"logo-wrong-usage\"]]],[\"token-spacing.cjs\",[[0,\"token-spacing\"]]],[\"eds-rating.cjs\",[[1,\"eds-rating\",{\"ratingType\":[1,\"rating-type\"],\"ratingCount\":[2,\"rating-count\"],\"selectedRating\":[32]}]]],[\"eds-toast.cjs\",[[1,\"eds-toast\",{\"message\":[1],\"intent\":[1],\"duration\":[2],\"visible\":[32]}]]],[\"eds-progress-bar.cjs\",[[1,\"eds-progress-bar\",{\"value\":[1026],\"updateValue\":[64]}]]],[\"eds-card-generic.cjs\",[[1,\"eds-card-generic\",{\"cardTitle\":[1,\"card-title\"],\"url\":[1],\"description\":[1],\"image\":[8],\"avatar\":[1],\"shortAbbreviation\":[1,\"short-abbreviation\"],\"headingLevel\":[1,\"heading-level\"],\"tags\":[1],\"tiny\":[4],\"bg\":[4],\"withHover\":[4,\"with-hover\"],\"hierarchy\":[4],\"parsedImage\":[32]},[[0,\"parentContext\",\"handleParentContext\"]]]]],[\"eds-login_2.cjs\",[[1,\"eds-login\",{\"keycloakUrl\":[1,\"keycloak-url\"],\"keycloakRealm\":[1,\"keycloak-realm\"],\"keycloakClientId\":[1,\"keycloak-client-id\"],\"authenticated\":[32],\"user\":[32],\"serverAvailable\":[32]}],[1,\"eds-splash-screen\",{\"inverse\":[4],\"initPromise\":[16],\"isVisible\":[32]},[[8,\"hideSplash\",\"handleHideSplash\"]]]]],[\"logo-variations-horizontal_2.cjs\",[[1,\"logo-variations-horizontal\"],[1,\"logo-variations-vertical\",{\"orientation\":[1],\"type\":[1]}]]],[\"eds-alert.cjs\",[[1,\"eds-alert\",{\"message\":[1],\"pressableLabel\":[1,\"pressable-label\"],\"pressableUrl\":[1,\"pressable-url\"],\"direction\":[1],\"intent\":[1],\"brd\":[1],\"withBtn\":[32]}]]],[\"eds-spinner.cjs\",[[1,\"eds-spinner\",{\"size\":[1],\"thickness\":[1],\"borderColor\":[1,\"border-color\"],\"bottomColor\":[1,\"bottom-color\"],\"background\":[1],\"fullscreen\":[4]}]]],[\"token-list_3.cjs\",[[0,\"token-list\",{\"show\":[1]}],[0,\"token-radii\"],[0,\"token-shadows\"]]],[\"eds-input_7.cjs\",[[1,\"eds-input-field\",{\"name\":[1],\"inputId\":[1,\"input-id\"],\"placeholder\":[1],\"disabled\":[4],\"onChange\":[16],\"onInput\":[16],\"type\":[1],\"required\":[4],\"label\":[1],\"hint\":[1],\"icon\":[1],\"link\":[16],\"message\":[1],\"error\":[4],\"checked\":[4],\"errorMessage\":[1,\"error-message\"],\"value\":[8],\"maxLength\":[2,\"max-length\"],\"options\":[1]}],[0,\"eds-input\",{\"name\":[1],\"inputId\":[1,\"input-id\"],\"placeholder\":[1],\"disabled\":[4],\"hasMessage\":[4,\"has-message\"],\"error\":[4],\"checked\":[4],\"type\":[1],\"required\":[4],\"value\":[8],\"icon\":[1],\"maxLength\":[2,\"max-length\"],\"options\":[16],\"extraClass\":[1,\"extra-class\"],\"innerVal\":[32],\"maxLengthReached\":[32]},null,{\"value\":[\"onValueChanged\"]}],[0,\"eds-input-footer\",{\"name\":[1],\"errorMessage\":[1,\"error-message\"],\"message\":[1],\"error\":[4],\"link\":[16]}],[0,\"eds-input-search\",{\"name\":[1],\"inputId\":[1,\"input-id\"],\"placeholder\":[1],\"value\":[1],\"disabled\":[4],\"required\":[4],\"decorate\":[1],\"label\":[1],\"getInputElement\":[64]}],[0,\"eds-input-select\",{\"inputId\":[1,\"input-id\"],\"name\":[1],\"placeholder\":[1],\"disabled\":[4],\"hasMessage\":[4,\"has-message\"],\"error\":[4],\"required\":[4],\"options\":[16],\"labelKey\":[1,\"label-key\"],\"valueKey\":[1,\"value-key\"],\"value\":[8],\"dynamicOptions\":[32],\"loading\":[32],\"dynamicValueKey\":[32],\"dynamicLabelKey\":[32],\"hasFetched\":[32]},null,{\"options\":[\"loadOptions\"]}],[0,\"eds-input-label\",{\"label\":[1],\"name\":[1],\"required\":[4],\"disabled\":[4]}],[0,\"eds-input-range\",{\"name\":[1],\"inputId\":[1,\"input-id\"],\"disabled\":[4],\"required\":[4],\"min\":[2],\"max\":[2],\"step\":[2],\"sliderVal\":[32],\"getInputElement\":[64]}]]],[\"eds-pagination_2.cjs\",[[1,\"eds-table\",{\"data\":[1,\"table-data\"],\"endpoint\":[1],\"config\":[1],\"rowsPerPage\":[2,\"rows-per-page\"],\"paginationEnabled\":[4,\"pagination-enabled\"],\"searchEnabled\":[4,\"search-enabled\"],\"hostWidth\":[1,\"host-width\"],\"columnSize\":[1,\"column-size\"],\"tbData\":[32],\"columns\":[32],\"currentPage\":[32],\"parsedConfig\":[32],\"totalRows\":[32],\"searchQuery\":[32],\"containerWidth\":[32]},null,{\"data\":[\"handleDataChange\",\"parseData\"],\"config\":[\"handleConfigChange\"]}],[1,\"eds-pagination\",{\"currentPage\":[2,\"current-page\"],\"lastPage\":[2,\"last-page\"],\"perPage\":[2,\"per-page\"],\"total\":[2],\"url\":[1],\"mode\":[1],\"prevLabel\":[1,\"prev-label\"],\"nextLabel\":[1,\"next-label\"],\"prevUrl\":[1,\"prev-url\"],\"nextUrl\":[1,\"next-url\"],\"links\":[32]},null,{\"currentPage\":[\"onPageOrLastPageChange\"],\"lastPage\":[\"onPageOrLastPageChange\"]}]]],[\"eds-section-core_2.cjs\",[[4,\"eds-section-core\",{\"tag\":[1],\"sectionTitle\":[1,\"section-title\"],\"headingLevel\":[1,\"heading-level\"]}],[0,\"eds-section-heading\",{\"sectionTitle\":[1,\"section-title\"],\"withContainer\":[4,\"with-container\"],\"headingLevel\":[1,\"heading-level\"],\"tag\":[1],\"spacingLarge\":[4,\"spacing-large\"]}]]],[\"eds-code-block.cjs\",[[1,\"eds-code-block\",{\"code\":[1],\"language\":[1],\"copied\":[32]}]]],[\"color-primary-palette_6.cjs\",[[0,\"gradient-secondary-palette\"],[0,\"color-primary-palette\"],[0,\"color-secondary-palette\",{\"show\":[1]}],[0,\"color-support-palette\"],[0,\"gradient-primary-palette\"],[0,\"gradient-support-palette\"]]],[\"eds-card-desc_3.cjs\",[[1,\"eds-card-desc\",{\"description\":[1],\"descClass\":[1,\"desc-class\"],\"truncate\":[4],\"truncateLines\":[1,\"truncate-lines\"]}],[1,\"eds-card-title\",{\"url\":[1],\"titleClass\":[1,\"title-class\"],\"headingLevel\":[1,\"heading-level\"],\"externalLink\":[4,\"external-link\"],\"cardTitle\":[1,\"card-title\"],\"hierarchy\":[4]}],[1,\"eds-tag\",{\"label\":[1],\"intent\":[1]}]]]]"), options);
+  return index.bootstrapLazy(JSON.parse("[[\"eds-avatar_24.cjs\",[[1,\"eds-form\",{\"name\":[1],\"setFormUrl\":[4,\"set-form-url\"],\"formBtn\":[4,\"form-btn\"],\"formBtnLabel\":[1,\"form-btn-label\"],\"errorMessage\":[1,\"error-message\"],\"fields\":[1],\"initData\":[16],\"values\":[32],\"isSubmitting\":[32],\"hasError\":[32],\"errors\":[32],\"parsedFields\":[32]},null,{\"fields\":[\"parseFields\"]}],[1,\"eds-fullscreen-menu\",{\"links\":[1],\"menuLinks\":[1,\"menu-links\"],\"homeUrl\":[1,\"home-url\"],\"inverseHeader\":[4,\"inverse-header\"],\"isMenuOpen\":[32]},[[16,\"toggleMenu\",\"handleToggleMenu\"]]],[1,\"eds-user\",{\"user\":[1025]}],[1,\"eds-header\",{\"homeUrl\":[513,\"home-url\"],\"links\":[1],\"inverseHeader\":[4,\"inverse-header\"],\"menuEnabled\":[4,\"menu-enabled\"],\"isMenuOpen\":[32],\"isUserMenuOpen\":[32],\"isAuthenticated\":[32]},[[16,\"authStatusChanged\",\"onAuthStatusChanged\"]]],[1,\"eds-steps-v2\",{\"steps\":[1],\"type\":[1],\"imageSrc\":[1,\"image-src\"],\"bg\":[4],\"message\":[1],\"activeStep\":[32]},null,{\"activeStep\":[\"activeStepChanged\"]}],[0,\"token-spacing\"],[1,\"eds-footer\",{\"social\":[4],\"enableScrollTop\":[4,\"enable-scroll-top\"],\"fundedBy\":[1,\"funded-by\"],\"rightsReserved\":[1,\"rights-reserved\"],\"enableCookiesSettings\":[4,\"enable-cookies-settings\"],\"showMatomoNotice\":[32]}],[1,\"eds-dropdown\",{\"icon\":[1],\"label\":[1],\"rounded\":[4],\"ariaLabel\":[1,\"aria-label\"],\"asNav\":[4,\"as-nav\"],\"dropdownPos\":[1,\"dropdown-pos\"],\"dropdownOffset\":[4,\"dropdown-offset\"],\"intent\":[1],\"isOpen\":[32],\"focusIndex\":[32]},[[8,\"click\",\"handleWindowClick\"],[8,\"keydown\",\"handleKeyDown\"]]],[1,\"eds-steps\",{\"steps\":[1],\"type\":[1],\"activeStep\":[32]},null,{\"activeStep\":[\"activeStepChanged\"]}],[1,\"eds-social-networks\",{\"title\":[1]}],[1,\"eds-block-break\",{\"extraClass\":[1,\"extra-class\"]}],[1,\"eds-input-field\",{\"name\":[1],\"inputId\":[1,\"input-id\"],\"placeholder\":[1],\"disabled\":[4],\"onChange\":[16],\"onInput\":[16],\"type\":[1],\"required\":[4],\"label\":[1],\"hint\":[1],\"icon\":[1],\"link\":[16],\"message\":[1],\"error\":[4],\"checked\":[4],\"errorMessage\":[1,\"error-message\"],\"value\":[8],\"maxLength\":[2,\"max-length\"],\"options\":[1]}],[1,\"eds-avatar\",{\"firstName\":[1,\"first-name\"],\"lastName\":[1,\"last-name\"],\"picture\":[1],\"initials\":[1],\"color\":[1]}],[0,\"eds-input\",{\"name\":[1],\"inputId\":[1,\"input-id\"],\"placeholder\":[1],\"disabled\":[4],\"hasMessage\":[4,\"has-message\"],\"error\":[4],\"checked\":[4],\"type\":[1],\"required\":[4],\"value\":[8],\"icon\":[1],\"maxLength\":[2,\"max-length\"],\"options\":[16],\"extraClass\":[1,\"extra-class\"],\"innerVal\":[32],\"maxLengthReached\":[32]},null,{\"value\":[\"onValueChanged\"]}],[0,\"eds-input-footer\",{\"name\":[1],\"errorMessage\":[1,\"error-message\"],\"message\":[1],\"error\":[4],\"link\":[16]}],[0,\"eds-input-search\",{\"name\":[1],\"inputId\":[1,\"input-id\"],\"placeholder\":[1],\"value\":[1],\"disabled\":[4],\"required\":[4],\"decorate\":[1],\"label\":[1],\"getInputElement\":[64]}],[0,\"eds-input-select\",{\"inputId\":[1,\"input-id\"],\"name\":[1],\"placeholder\":[1],\"disabled\":[4],\"hasMessage\":[4,\"has-message\"],\"error\":[4],\"required\":[4],\"options\":[16],\"labelKey\":[1,\"label-key\"],\"valueKey\":[1,\"value-key\"],\"value\":[8],\"dynamicOptions\":[32],\"loading\":[32],\"dynamicValueKey\":[32],\"dynamicLabelKey\":[32],\"hasFetched\":[32]},null,{\"options\":[\"loadOptions\"]}],[0,\"eds-input-label\",{\"label\":[1],\"name\":[1],\"required\":[4],\"disabled\":[4]}],[0,\"eds-input-range\",{\"name\":[1],\"inputId\":[1,\"input-id\"],\"disabled\":[4],\"required\":[4],\"min\":[2],\"max\":[2],\"step\":[2],\"value\":[2],\"sliderVal\":[32],\"getInputElement\":[64]},null,{\"value\":[\"onValueChange\"]}],[1,\"eds-logo\",{\"href\":[1],\"orientation\":[1],\"type\":[1],\"label\":[1]}],[1,\"eds-img\",{\"src\":[1],\"alt\":[1],\"width\":[2],\"height\":[2],\"srcset\":[1],\"sizes\":[1],\"formats\":[16],\"lazyload\":[4],\"withBg\":[4,\"with-bg\"],\"loaded\":[32],\"showBg\":[32]}],[1,\"eds-link\",{\"label\":[1],\"intent\":[1],\"icon\":[1],\"iconPos\":[1,\"icon-pos\"],\"iconSmall\":[4,\"icon-small\"],\"size\":[1],\"external\":[4],\"current\":[4],\"download\":[4],\"url\":[1],\"ariaLabel\":[1,\"aria-label\"],\"disabled\":[4],\"hideLabelOnSmallScreen\":[4,\"hide-label-on-small-screen\"],\"extraClass\":[1,\"extra-class\"]},[[0,\"parentContext\",\"handleParentContext\"]]],[1,\"eds-button\",{\"label\":[1],\"ariaLabel\":[1,\"aria-label\"],\"elementType\":[1,\"element-type\"],\"intent\":[1],\"loading\":[4],\"disabled\":[4],\"pill\":[4],\"icon\":[1],\"size\":[1],\"iconPos\":[1,\"icon-pos\"],\"iconSmall\":[4,\"icon-small\"],\"extraClass\":[1,\"extra-class\"],\"triggerClick\":[16]},[[0,\"parentContext\",\"handleParentContext\"]]],[0,\"eds-icon-wrapper\",{\"icon\":[1],\"class\":[1],\"IconComponent\":[32]},null,{\"icon\":[\"iconChanged\"]}]]],[\"eds-trl.cjs\",[[0,\"eds-trl\",{\"applications\":[1]}]]],[\"logo-space.cjs\",[[1,\"logo-space\"]]],[\"svg-repository.cjs\",[[1,\"svg-repository\"]]],[\"docs-palettes.cjs\",[[0,\"docs-palettes\",{\"tabIndex\":[2,\"tab-index\"]}]]],[\"components-section.cjs\",[[0,\"components-section\",{\"tabIndex\":[2,\"tab-index\"]}]]],[\"eds-app-root.cjs\",[[1,\"eds-app-root\",{\"isAuthenticated\":[32]}]]],[\"eds-card-section.cjs\",[[1,\"eds-card-section\",{\"cards\":[1],\"occupyCols\":[2,\"occupy-cols\"]}]]],[\"eds-timeline.cjs\",[[1,\"eds-timeline\",{\"events\":[1],\"selectedEvent\":[32],\"parsedEvents\":[32]},null,{\"events\":[\"parseEvents\"]}]]],[\"docs-tokens.cjs\",[[0,\"docs-tokens\",{\"tabIndex\":[2,\"tab-index\"]}]]],[\"eds-card-tool.cjs\",[[1,\"eds-card-tool\",{\"cardTitle\":[1,\"card-title\"],\"url\":[1],\"description\":[1],\"image\":[8],\"avatar\":[1],\"shortAbbreviation\":[1,\"short-abbreviation\"],\"headingLevel\":[1,\"heading-level\"],\"tags\":[8],\"tiny\":[4],\"bg\":[4],\"withHover\":[4,\"with-hover\"],\"external\":[4],\"hierarchy\":[4]}]]],[\"eds-cookies-preference.cjs\",[[0,\"eds-cookies-preference\",{\"buttonText\":[1,\"button-text\"],\"intent\":[1],\"showMatomoNotice\":[32],\"noticeKey\":[32]}]]],[\"eds-card-project.cjs\",[[0,\"eds-card-project\",{\"image\":[8],\"editorialTitle\":[1,\"editorial-title\"],\"headingLevel\":[1,\"heading-level\"],\"categoryTitle\":[1,\"category-title\"],\"color\":[1],\"bgOnHover\":[4,\"bg-on-hover\"],\"vertical\":[4],\"titleProject\":[1,\"title-project\"],\"url\":[1],\"parsedImage\":[32]}]]],[\"eds-feedback.cjs\",[[1,\"eds-feedback\",{\"type\":[1],\"count\":[2],\"label\":[1],\"description\":[1],\"textMapping\":[1,\"text-mapping\"],\"selectedRating\":[32]},[[16,\"rating\",\"ratingUpdated\"]]]]],[\"eds-toast-manager.cjs\",[[1,\"eds-toast-manager\",{\"toasts\":[32]}]]],[\"incorrect-use-of-colors.cjs\",[[0,\"incorrect-use-of-colors\"]]],[\"logo-variations-tabs.cjs\",[[0,\"logo-variations-tabs\",{\"tabIndex\":[2,\"tab-index\"]}]]],[\"correct-use-of-colors.cjs\",[[0,\"correct-use-of-colors\"]]],[\"eds-breadcrumb.cjs\",[[1,\"eds-breadcrumb\",{\"items\":[1],\"intent\":[1],\"parsedItems\":[32],\"isSmallScreen\":[32],\"maxVisibleItems\":[32]},null,{\"items\":[\"parseItems\"]}]]],[\"eds-frame.cjs\",[[1,\"eds-frame\",{\"frameLabel\":[1,\"frame-label\"],\"frameSrc\":[1,\"frame-src\"],\"urlLabel\":[1,\"url-label\"],\"errorMessage\":[1,\"error-message\"],\"url\":[1],\"intent\":[1],\"size\":[1],\"iframeError\":[32]}]]],[\"eds-modal.cjs\",[[1,\"eds-modal\",{\"title\":[1],\"truncate\":[4],\"truncateLines\":[1,\"truncate-lines\"],\"position\":[1],\"isOpen\":[32],\"open\":[64],\"close\":[64],\"toggle\":[64]},[[0,\"eds-modal-open\",\"handleGlobalOpen\"],[0,\"eds-modal-close\",\"handleGlobalClose\"],[8,\"keydown\",\"handleKeyDown\"]]]]],[\"token-ratios.cjs\",[[0,\"token-ratios\"]]],[\"token-typography.cjs\",[[0,\"token-typography\"]]],[\"eds-card-tags.cjs\",[[1,\"eds-card-tags\",{\"accent\":[4],\"tags\":[16]}]]],[\"eds-card-wrapper.cjs\",[[4,\"eds-card-wrapper\",{\"tiny\":[4],\"withBg\":[4,\"with-bg\"],\"withHover\":[4,\"with-hover\"]}]]],[\"eds-icon-arrow-diagonal.cjs\",[[0,\"eds-icon-arrow-diagonal\",{\"class\":[1]}]]],[\"eds-icon-arrow-right.cjs\",[[0,\"eds-icon-arrow-right\",{\"class\":[1]}]]],[\"eds-icon-bluesky.cjs\",[[0,\"eds-icon-bluesky\",{\"class\":[1]}]]],[\"eds-icon-bookmark.cjs\",[[0,\"eds-icon-bookmark\",{\"class\":[1]}]]],[\"eds-icon-chevron-down.cjs\",[[0,\"eds-icon-chevron-down\",{\"class\":[1]}]]],[\"eds-icon-chevron-left.cjs\",[[0,\"eds-icon-chevron-left\",{\"class\":[1]}]]],[\"eds-icon-chevron-right.cjs\",[[0,\"eds-icon-chevron-right\",{\"class\":[1]}]]],[\"eds-icon-chevron-up.cjs\",[[0,\"eds-icon-chevron-up\",{\"class\":[1]}]]],[\"eds-icon-close.cjs\",[[0,\"eds-icon-close\",{\"class\":[1]}]]],[\"eds-icon-copy.cjs\",[[0,\"eds-icon-copy\",{\"class\":[1]}]]],[\"eds-icon-eu.cjs\",[[0,\"eds-icon-eu\",{\"class\":[1]}]]],[\"eds-icon-external.cjs\",[[0,\"eds-icon-external\",{\"class\":[1]}]]],[\"eds-icon-facebook.cjs\",[[0,\"eds-icon-facebook\",{\"class\":[1]}]]],[\"eds-icon-gitlab.cjs\",[[0,\"eds-icon-gitlab\",{\"class\":[1]}]]],[\"eds-icon-linkedin.cjs\",[[0,\"eds-icon-linkedin\",{\"class\":[1]}]]],[\"eds-icon-loader.cjs\",[[0,\"eds-icon-loader\",{\"class\":[1]}]]],[\"eds-icon-mastodon.cjs\",[[0,\"eds-icon-mastodon\",{\"class\":[1]}]]],[\"eds-icon-menu.cjs\",[[0,\"eds-icon-menu\",{\"class\":[1]}]]],[\"eds-icon-minus.cjs\",[[0,\"eds-icon-minus\",{\"class\":[1]}]]],[\"eds-icon-more.cjs\",[[0,\"eds-icon-more\",{\"class\":[1]}]]],[\"eds-icon-paper.cjs\",[[0,\"eds-icon-paper\",{\"class\":[1]}]]],[\"eds-icon-plus.cjs\",[[0,\"eds-icon-plus\",{\"class\":[1]}]]],[\"eds-icon-portal.cjs\",[[0,\"eds-icon-portal\",{\"class\":[1]}]]],[\"eds-icon-private.cjs\",[[0,\"eds-icon-private\",{\"class\":[1]}]]],[\"eds-icon-public.cjs\",[[0,\"eds-icon-public\",{\"class\":[1]}]]],[\"eds-icon-search.cjs\",[[0,\"eds-icon-search\",{\"class\":[1]}]]],[\"eds-icon-star.cjs\",[[0,\"eds-icon-star\",{\"class\":[1]}]]],[\"eds-icon-success.cjs\",[[0,\"eds-icon-success\",{\"class\":[1]}]]],[\"eds-icon-thumbs-down.cjs\",[[0,\"eds-icon-thumbs-down\",{\"class\":[1]}]]],[\"eds-icon-thumbs-up.cjs\",[[0,\"eds-icon-thumbs-up\",{\"class\":[1]}]]],[\"eds-icon-tutorial.cjs\",[[0,\"eds-icon-tutorial\",{\"class\":[1]}]]],[\"eds-icon-twitter.cjs\",[[0,\"eds-icon-twitter\",{\"class\":[1]}]]],[\"eds-icon-unknown.cjs\",[[0,\"eds-icon-unknown\",{\"class\":[1]}]]],[\"eds-icon-updown.cjs\",[[0,\"eds-icon-updown\",{\"class\":[1]}]]],[\"eds-icon-user.cjs\",[[0,\"eds-icon-user\",{\"class\":[1]}]]],[\"eds-icon-youtube.cjs\",[[0,\"eds-icon-youtube\",{\"class\":[1]}]]],[\"eds-switch.cjs\",[[1,\"eds-switch\",{\"checked\":[1540],\"disabled\":[4],\"labelOn\":[1,\"label-on\"],\"labelOff\":[1,\"label-off\"]}]]],[\"eds-tabs.cjs\",[[1,\"eds-tabs\",{\"id\":[1],\"navAriaLabel\":[1,\"nav-aria-label\"],\"tabs\":[1],\"parsedTabs\":[32],\"activeIndex\":[32]},null,{\"tabs\":[\"parseTabs\"]}]]],[\"eds-tooltip.cjs\",[[1,\"eds-tooltip\",{\"content\":[1],\"position\":[1],\"isVisible\":[32],\"isPositioned\":[32],\"tooltipStyle\":[32]},[[1,\"mouseover\",\"showTooltip\"],[1,\"mouseout\",\"hideTooltip\"],[8,\"keydown\",\"handleKeyPress\"]]]]],[\"logo-wrong-usage.cjs\",[[1,\"logo-wrong-usage\"]]],[\"eds-accordion.cjs\",[[1,\"eds-accordion\",{\"title\":[1],\"description\":[1],\"switchBg\":[4,\"switch-bg\"],\"expanded\":[4],\"clampText\":[4,\"clamp-text\"],\"isExpanded\":[32],\"panelHeight\":[32],\"shortContent\":[32],\"headerHeight\":[32]}]]],[\"eds-matomo-notice.cjs\",[[1,\"eds-matomo-notice\",{\"title\":[1],\"description\":[1],\"optOutMessage\":[1,\"opt-out-message\"],\"forceShow\":[4,\"force-show\"],\"showNotice\":[32]},[[16,\"cookies\",\"toggleCookiesConsent\"]]]]],[\"eds-rating.cjs\",[[1,\"eds-rating\",{\"ratingType\":[1,\"rating-type\"],\"ratingCount\":[2,\"rating-count\"],\"selectedRating\":[32]}]]],[\"eds-toast.cjs\",[[1,\"eds-toast\",{\"message\":[1],\"intent\":[1],\"duration\":[2],\"visible\":[32]}]]],[\"eds-progress-bar.cjs\",[[1,\"eds-progress-bar\",{\"value\":[1026],\"updateValue\":[64]}]]],[\"eds-code-block.cjs\",[[1,\"eds-code-block\",{\"code\":[1],\"language\":[1],\"copied\":[32]}]]],[\"eds-card-desc_3.cjs\",[[1,\"eds-card-desc\",{\"description\":[1],\"descClass\":[1,\"desc-class\"],\"truncate\":[4],\"truncateLines\":[1,\"truncate-lines\"]}],[1,\"eds-card-title\",{\"url\":[1],\"titleClass\":[1,\"title-class\"],\"headingLevel\":[1,\"heading-level\"],\"externalLink\":[4,\"external-link\"],\"cardTitle\":[1,\"card-title\"],\"hierarchy\":[4]}],[1,\"eds-tag\",{\"label\":[1],\"intent\":[1]}]]],[\"eds-card-generic.cjs\",[[1,\"eds-card-generic\",{\"cardTitle\":[1,\"card-title\"],\"url\":[1],\"description\":[1],\"image\":[8],\"avatar\":[1],\"shortAbbreviation\":[1,\"short-abbreviation\"],\"headingLevel\":[1,\"heading-level\"],\"tags\":[1],\"tiny\":[4],\"bg\":[4],\"withHover\":[4,\"with-hover\"],\"hierarchy\":[4],\"parsedImage\":[32]},[[0,\"parentContext\",\"handleParentContext\"]]]]],[\"eds-login_2.cjs\",[[1,\"eds-login\",{\"keycloakUrl\":[1,\"keycloak-url\"],\"keycloakRealm\":[1,\"keycloak-realm\"],\"keycloakClientId\":[1,\"keycloak-client-id\"],\"authenticated\":[32],\"user\":[32],\"serverAvailable\":[32]}],[1,\"eds-splash-screen\",{\"inverse\":[4],\"initPromise\":[16],\"isVisible\":[32]},[[8,\"hideSplash\",\"handleHideSplash\"]],{\"initPromise\":[\"watchInitPromise\"]}]]],[\"logo-variations-horizontal_2.cjs\",[[1,\"logo-variations-horizontal\"],[1,\"logo-variations-vertical\",{\"orientation\":[1],\"type\":[1]}]]],[\"eds-alert.cjs\",[[1,\"eds-alert\",{\"message\":[1],\"pressableLabel\":[1,\"pressable-label\"],\"pressableUrl\":[1,\"pressable-url\"],\"direction\":[1],\"intent\":[1],\"brd\":[1],\"withBtn\":[32]}]]],[\"eds-spinner.cjs\",[[1,\"eds-spinner\",{\"size\":[1],\"thickness\":[1],\"borderColor\":[1,\"border-color\"],\"bottomColor\":[1,\"bottom-color\"],\"background\":[1],\"fullscreen\":[4]}]]],[\"token-list_3.cjs\",[[0,\"token-list\",{\"show\":[1]}],[0,\"token-radii\"],[0,\"token-shadows\"]]],[\"eds-section-core_2.cjs\",[[4,\"eds-section-core\",{\"tag\":[1],\"sectionTitle\":[1,\"section-title\"],\"headingLevel\":[1,\"heading-level\"]}],[0,\"eds-section-heading\",{\"sectionTitle\":[1,\"section-title\"],\"withContainer\":[4,\"with-container\"],\"headingLevel\":[1,\"heading-level\"],\"tag\":[1],\"spacingLarge\":[4,\"spacing-large\"]}]]],[\"color-primary-palette_6.cjs\",[[0,\"gradient-secondary-palette\"],[0,\"color-primary-palette\"],[0,\"color-secondary-palette\",{\"show\":[1]}],[0,\"color-support-palette\"],[0,\"gradient-primary-palette\"],[0,\"gradient-support-palette\"]]],[\"eds-pagination_2.cjs\",[[1,\"eds-table\",{\"data\":[1,\"table-data\"],\"endpoint\":[1],\"config\":[1],\"rowsPerPage\":[2,\"rows-per-page\"],\"paginationEnabled\":[4,\"pagination-enabled\"],\"searchEnabled\":[4,\"search-enabled\"],\"hostWidth\":[1,\"host-width\"],\"columnSize\":[1,\"column-size\"],\"tbData\":[32],\"columns\":[32],\"currentPage\":[32],\"parsedConfig\":[32],\"totalRows\":[32],\"searchQuery\":[32],\"containerWidth\":[32]},null,{\"data\":[\"handleDataChange\",\"parseData\"],\"config\":[\"handleConfigChange\"]}],[1,\"eds-pagination\",{\"currentPage\":[2,\"current-page\"],\"lastPage\":[2,\"last-page\"],\"perPage\":[2,\"per-page\"],\"total\":[2],\"url\":[1],\"mode\":[1],\"prevLabel\":[1,\"prev-label\"],\"nextLabel\":[1,\"next-label\"],\"prevUrl\":[1,\"prev-url\"],\"nextUrl\":[1,\"next-url\"],\"links\":[32]},null,{\"currentPage\":[\"onPageOrLastPageChange\"],\"lastPage\":[\"onPageOrLastPageChange\"]}]]]]"), options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/cjs/correct-use-of-colors.cjs.entry.js

@@ -61,7 +61,7 @@ const CorrectUseOfColors = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h("div", { key: '74aa6fcf077ee0f8ffb30e48b388699565d027ae', class: "container" }, index.h("p", { key: '2d1ce73998a1fe581f2e0084b0d14b12896b9ea9', class: "f-body-01" }, "This guide demonstrates the correct usage of the", index.h("eds-link", { key: 'fa880fe19f73596c751d30a4037906013753de5e', label: "primary", size: "small", intent: "blueish", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", index.h("eds-link", { key: 'd3da6d095d1a9ce23f9714aab1e25db32072411b', label: "support", size: "small", intent: "blueish", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), index.h("div", { key: '24fef1a5b6ad25898498de5711ec9059781c044a', class: "flex" }, index.h("div", { key: '4f0018cf0978c67133b79fd0c8d67016306e482f', class: "w-full" }, index.h("ul", { key: '0637d9cd614ccc157c3dd96d8d5264b2290bd7bb', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, primary.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[150px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), index.h("div", { key: '61f91bf37ad73c39cccff56dd0710e06fb774ae1', class: "w-full" }, index.h("ul", { key: 'd10642b60e7524d2d1b2e9b26d91f311391b35f3', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), index.h("p", { key: 'aa4d24b67c115d8c7367bc896e68f5a48f6b852f', class: "f-body-01" }, "This guide demonstrates the correct usage of the", index.h("eds-link", { key: '22d1cd8401ae4fd7243c093ee9e15c6d894f9cd0', label: "purple", size: "small", intent: "blueish", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", index.h("eds-link", { key: 'fac4687f27d767e08db6e692dc4cf1352d12805a', label: "support", size: "small", intent: "blueish", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), index.h("div", { key: '11afa11ed2070d0438d77cd614216d0f42f43ca4', class: "flex" }, index.h("div", { key: '69f516f64adb3d9cfbc4e2fc1ed44fedbee3bd68', class: "w-full" }, index.h("ul", { key: '6743e0c69ac85afc4eb1795c15d70769c5fd4046', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, purple.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), index.h("div", { key: '78ed314dc9917de85d1b9880a154d6be1d4fde5e', class: "w-full" }, index.h("ul", { key: 'f2217d033e75604de0c383991f5cea7af341a4ca', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), index.h("p", { key: '77be27368cd3b6a0ddfe8f7248ef32171dca8912', class: "f-body-01" }, "This guide demonstrates the correct usage of the", index.h("eds-link", { key: '0edd3991edfde34544537fd752ca5d6c02c1d942', label: "blue", size: "small", intent: "blueish", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", index.h("eds-link", { key: '434bacd1ad5f74cae7c004c137a05c9b7ac474ca', label: "support", size: "small", intent: "blueish", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), index.h("div", { key: '7af03503a498c61ee91471740e05b9e90f87de7a', class: "flex" }, index.h("div", { key: '1658c8d5436e600583bfb8f220b63e117201d4f1', class: "w-full" }, index.h("ul", { key: 'ec29934dae18e254728d1cdbd97198185454c614', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, blue.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), index.h("div", { key: '08153447043dc5a4908f33d98688904bb974c7ef', class: "w-full" }, index.h("ul", { key: 'd372026a4b720eff2ed363477e11e43f4635118d', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), index.h("p", { key: 'b50099b9e7c9963a66a61ab86ce045f4706c2280', class: "f-body-01" }, "This guide demonstrates the correct usage of the", index.h("eds-link", { key: '10cda6a7ea2a40523a47810bc6aec68db42716b8', label: "redish", size: "small", intent: "blueish", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", index.h("eds-link", { key: '85fa2465d7fef1e7965fab4100476f8856ca3d73', label: "support", size: "small", intent: "blueish", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), index.h("div", { key: '5733514d73d824ed93bf362cf005b3ed8270d636', class: "flex" }, index.h("div", { key: '9b74dbf6a74581b8f129e111bda369e1427bb3fd', class: "w-full" }, index.h("ul", { key: '312e5d6dcc21c3e691f083c3679ede29ed8914e2', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, red.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), index.h("div", { key: 'd2cc590214e56342b8675f63c532c3d00923b555', class: "w-full" }, index.h("ul", { key: '287cfda4148067a0e9051b5e026341f755b34722', class: "gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))))));
+        return (index.h("div", { key: '966cb542b868e89c3f2538548e8a1ca8e20ea8d8', class: "container" }, index.h("p", { key: '3c595ffa9a2de45b681924354486309004d4ceaf', class: "f-body-01" }, "This guide demonstrates the correct usage of the", index.h("eds-link", { key: '1d1fded0f8cf78cec9e364e5b6844598b55f3f86', label: "primary", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", index.h("eds-link", { key: 'abae691bb80eca1019f97375997b1aa6a577ba8b', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), index.h("div", { key: '251e6d8ad16d70974b67fa044d53abd1be79ccac', class: "flex" }, index.h("div", { key: 'de5b9b6720aababb693421663c52db85cee1b5fc', class: "w-full" }, index.h("ul", { key: 'a61f669f45c2f9d3b53d87bacc222a4274f93d34', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, primary.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[150px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), index.h("div", { key: 'e7787d0ae843d7767ecac3267f11325dcfecf948', class: "w-full" }, index.h("ul", { key: '0d740ad8178c88175939d32a4f84d518f587e43a', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), index.h("p", { key: '6c59b2c574f5039baafd91a2939fbbb307732500', class: "f-body-01" }, "This guide demonstrates the correct usage of the", index.h("eds-link", { key: '03e9ca7b0831c2b1d1908001324a38147ecea835', label: "purple", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", index.h("eds-link", { key: '021affd3b5db00ccb5ef0d51de4552c5d3a11f44', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), index.h("div", { key: 'b7a5c4c10adab099c57ed70c0d2186d791aa70ec', class: "flex" }, index.h("div", { key: '3732c49a47158c206e1b40fc5425e555487ec757', class: "w-full" }, index.h("ul", { key: '54a5d35510bd77397d1418aa2638cf310534e986', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, purple.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), index.h("div", { key: '048de44bd69a7b6ecefe3188d76821e4d5145620', class: "w-full" }, index.h("ul", { key: 'e3f8cadce4b9a575e1d844958cfccf20a19db681', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), index.h("p", { key: '14d7f9c88ae769d6feb2a8344f8b45b40d4ae095', class: "f-body-01" }, "This guide demonstrates the correct usage of the", index.h("eds-link", { key: '810bdfa6fd175f9d483129b70bbae469051e0e0d', label: "blue", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", index.h("eds-link", { key: 'fb8a9712f8e1ae1cffbb85c79f7e9c2657f867db', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), index.h("div", { key: '1df0919bb4c75ee251d7f5c8cf95bb2e2e990242', class: "flex" }, index.h("div", { key: '5a898462aa680267f4ac35aefb98e60b7f486c63', class: "w-full" }, index.h("ul", { key: 'ad6f3e6ccde7d225be344efbc176064fc89aa796', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, blue.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), index.h("div", { key: '8dd6e01b989c8589be6b553c85f0512c268ac369', class: "w-full" }, index.h("ul", { key: 'c36937d99efd585c4e8a37b80de5bce82374186c', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } }))))))), index.h("p", { key: '452c68d1c797de34e531d7c734d350fcc36ae2f2', class: "f-body-01" }, "This guide demonstrates the correct usage of the", index.h("eds-link", { key: '17453c9d78c20583c989281672c0f41bbe8d036f', label: "redish", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#primary-palette", "extra-class": "inline-block ml-4" }), "and", index.h("eds-link", { key: '3e78eb924b6a857674d50d4a209e4843f76e5fc3', label: "support", size: "small", intent: "underline", icon: "chevron-right", url: "../color-palette/#support-palette", "extra-class": "inline-block ml-4" }), "color palettes."), index.h("div", { key: 'ae3e2a703633013f632df3a75f45ec932ce5e13b', class: "flex" }, index.h("div", { key: '4a0f256fa355dcbd6d6fc0e95e81a6c2821c917d', class: "w-full" }, index.h("ul", { key: '8aaf611ed9b87b86d0c1b47b1e37cb01989838b2', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, red.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[225px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))), index.h("div", { key: '112e50da1627a671fbca843111becf51cd02ebc5', class: "w-full" }, index.h("ul", { key: '14033bd08a9d16bd0b6cfe8b87acc2a841c48a29', class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16" }, support.map((color) => (index.h("li", { class: "grid-col-span-12 md:grid-col-span-6 flex flex-col" }, index.h("div", { class: "w-full min-h-[90px] effect-height flex items-center justify-between p-16", style: { backgroundColor: color.background } })))))))));
     }
 };
 

package/dist/cjs/{eds-docs-palettes.cjs.entry.js → docs-palettes.cjs.entry.js}

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2f63169d.js');
 
-const EdsDocsPalettes = class {
+const DocsPalettes = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.tabIndex = undefined;
@@ -20,8 +20,8 @@ const EdsDocsPalettes = class {
         }
     }
     render() {
-        return index.h("div", { key: '480cc269ee31de61190b4ae7502c3c17e673c3f9', class: "container" }, this.renderContent());
+        return index.h("div", { key: 'f985628b9ea3f02a511e2facbda99b54f0723acf', class: "container" }, this.renderContent());
     }
 };
 
-exports.eds_docs_palettes = EdsDocsPalettes;
+exports.docs_palettes = DocsPalettes;

package/dist/cjs/{eds-docs-tokens.cjs.entry.js → docs-tokens.cjs.entry.js}

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2f63169d.js');
 
-const EdsDocsContent = class {
+const DocsContent = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.tabIndex = undefined;
@@ -28,8 +28,8 @@ const EdsDocsContent = class {
         }
     }
     render() {
-        return index.h("div", { key: '64ee8c20ec7dca1ea1a742ef53f0315c81107ead', class: "container" }, this.renderContent());
+        return index.h("div", { key: '29810a0ace60d2e5a0fc84d6715fc2fc89d6187f', class: "container" }, this.renderContent());
     }
 };
 
-exports.eds_docs_tokens = EdsDocsContent;
+exports.docs_tokens = DocsContent;