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

package/README.md

@@ -0,0 +1,7 @@
+# react
+
+React target wrappers for Stencil output, allowing for seamless integration of Stencil components into React projects.
+
+## Usage 
+
+More information about importing and using the package can be found currently in the WIP [https://design-dev.ebrains.eu/ui-components/](EBRAINS Design System).

package/bookmark-c200037c.esm.js

@@ -0,0 +1,16 @@
+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>`;
+
+export { bookmark as b };

package/color-primary-palette_6.entry.esm.js

@@ -32,8 +32,8 @@ const ColorPrimaryPalette = class {
   }
   render() {
     return h("ul", {
-      key: '153e3c0f00db6f824cb0f43b420645bcbd66632f',
-      class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
+      key: '970e6baf4b258e9a0ed194316daf1c862d17733e',
+      class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, this.colors.map(color => h("li", {
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
@@ -113,8 +113,8 @@ const ColorSecondaryPalette = class {
   }
   render() {
     return h("ul", {
-      key: 'b0af2cdf6524cf79ef8d28f37533d1f84812f174',
-      class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
+      key: '54f985b91b28ae253a06ec313872ccc81449bf51',
+      class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, this.colors.map(color => h("li", {
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
@@ -146,7 +146,6 @@ const ColorSecondaryPalette = class {
 const ColorSupportPalette = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    // Support palette data
     this.colors = [{
       rgb: 'R20 G20 B20',
       cmyk: 'C78 M69 Y61 K87',
@@ -184,36 +183,59 @@ const ColorSupportPalette = class {
       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 h("ul", {
-      key: 'c58041047c7d7993ac4e936051d40e1e8dda5263',
-      class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
-    }, this.colors.map(color => h("li", {
-      class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
-    }, h("div", {
-      class: "effect-height flex items-center justify-between p-16",
-      style: {
-        backgroundColor: color.background
-      }
-    }, h("div", {
-      class: "grid"
-    }, h("span", {
-      class: "f-body-02"
-    }, color.rgb), h("span", {
-      class: "f-body-02 w-full"
-    }, color.cmyk), h("eds-code-block", {
-      code: color.hex,
-      style: {
-        minWidth: '150px',
-        marginRight: '5px'
-      }
-    })), h("div", {
-      class: "grid"
-    }, h("span", {
-      class: "f-body-02"
-    }, color.pantoneC || 'N/A'), h("span", {
-      class: "f-body-02"
-    }, color.pantoneU || 'N/A'))))));
+      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 h("li", {
+        class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
+      }, h("div", {
+        class: "effect-height flex items-center justify-between p-16",
+        style: {
+          backgroundColor: color.background
+        }
+      }, h("div", {
+        class: "grid"
+      }, h("span", {
+        class: `f-body-02 ${textClass}`
+      }, color.cmyk), h("eds-code-block", {
+        code: color.hex,
+        style: {
+          minWidth: '150px',
+          marginRight: '5px'
+        },
+        class: textClass
+      })), h("div", {
+        class: "grid"
+      }, h("span", {
+        class: `f-body-02 ${textClass}`
+      }, color.pantoneC), h("span", {
+        class: `f-body-02 ${textClass}`
+      }, color.pantoneU))));
+    }));
   }
 };
 const GradientPrimaryPalette = class {
@@ -245,8 +267,8 @@ const GradientPrimaryPalette = class {
   }
   render() {
     return h("ul", {
-      key: '95d991a7331f3f75909421db363b0c30646dd9f7',
-      class: "gap-y-8 md:gap-y-12 lg:gap-y-16",
+      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%)'
       }
@@ -325,214 +347,214 @@ const GradientSecondaryPalette = class {
   }
   render() {
     return h("div", {
-      key: '95324cdbb1dc2eec5d1b47b5a88b69c9e2139535'
+      key: 'bcfd5c5ca5a01138d27ae5f0867998bb40d526ac'
     }, h("ul", {
-      key: 'deddb39135e4dee2c6b401eb543ea2169d606331',
-      class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
+      key: '6f79d13b142488f1253ba77b0a044fd8ada8d297',
+      class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: '848cdd2984b1dc5b2c0672ab125fe951b9c7d30c',
+      key: 'e8e44a1ee3993564fc2331d0d9337a2e0ceaebc1',
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
-      key: 'af8b2fd8be90d0fffe2334f66878a34b32fa148f',
+      key: '229940b2fe6264429fb7627c9d3aa02e18e90b5a',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         background: this.colors[0].background
       }
     }, h("div", {
-      key: 'b796899ca009ee80c877e2e728639abcf2b46770',
+      key: '0cf83c147dde777efe2783d2148e780ab328c978',
       class: "grid"
     }, h("span", {
-      key: '2ba29c5bb91fef4b817f853056701feb001bdca0',
+      key: '06f893ff45abe7c1d3cb817fe5834a5176c93f06',
       class: "f-body-02"
     }, this.colors[0].rgb), h("span", {
-      key: '23e36499f1ba4dd08ac928c6fefc6d38f03f4724',
+      key: '3967e17ed980810d8b35b0d2b2e754f7b2e8b3e0',
       class: "f-body-02 w-full"
     }, this.colors[0].cmyk), h("eds-code-block", {
-      key: '11af3db24e81dc5382e8b3c64296e0416c3a2a5a',
+      key: '2adc489cee7b3a3a67f62493fb5e125fc1e75c04',
       code: this.colors[0].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: '0bc7aa191c1ddd71c5e716ac07687c2412530bad',
+      key: 'cb27de2308afcaaaad82675c50573805e51f36f7',
       class: "grid"
     }, h("span", {
-      key: '3b84d1f6f75c3fa401fc08597318cb24e00a6db3',
+      key: '0655190c8a8d555ed0fec5c319ff349d9fefc4d0',
       class: "f-body-02"
     }, this.colors[0].pantoneC), h("span", {
-      key: 'beb7250e567791947e9ccda81cf99d4fd3c7e007',
+      key: '2b75a99e922965547e9f86240c0db577ec0b9682',
       class: "f-body-02"
     }, this.colors[0].pantoneU))), h("div", {
-      key: 'd5c6301370b862c3bd713188b468ed22f9377e9c',
+      key: 'a8b7ef1c5309601366baffa2d3b48c6cd8893eb6',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         background: this.colors[1].background
       }
     }, h("div", {
-      key: '14958bec1bc69da8afcd5abbec40153900003aea',
+      key: 'fd01906e34a91984aa7ce6439abcf03673d70099',
       class: "grid"
     }, h("span", {
-      key: '7efe478f1588fc12a88e74eb6385a9ac1e83f2d2',
+      key: 'd4e119028ad415d9a21988c2bf603011856bb78d',
       class: "f-body-02"
     }, this.colors[1].rgb), h("span", {
-      key: 'aaf8b133f495682cd5934be9719889fd6cd79d5f',
+      key: '4ba9d26645884bc1fc75741ee40509af56a9e7ae',
       class: "f-body-02 w-full"
     }, this.colors[1].cmyk), h("eds-code-block", {
-      key: 'ba3050a85770e74810686603510bbd439e9c48c2',
+      key: '5be1c28b15b458fba099868b598ee513077562e0',
       code: this.colors[1].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: 'cc133d0be620d1749317a2d46386c3b662c7e231',
+      key: '8609b9e68f23aaec35e76b312a425c376d508892',
       class: "grid"
     }, h("span", {
-      key: '77a6292eec6c5b36a209d627e8ebe4b0d8978529',
+      key: 'f5cbb2d867e1a66e8371ebd73503ac1cd208f51d',
       class: "f-body-02"
     }, this.colors[1].pantoneC), h("span", {
-      key: '4bbf9a51af72aecd3d8e40388d56f7ec04307e5b',
+      key: 'b72b8b23c5b1e136cb1114af22f34c6222b0d0f9',
       class: "f-body-02"
     }, this.colors[1].pantoneU))))), h("eds-block-break", {
-      key: 'd8bd95b4b6a4992490b8a28c88ba94524ed3f89d'
+      key: '73e70749f132579efc19bccab4fff8b3e2d6979a'
     }), h("ul", {
-      key: 'dcd47948561897e2b9dd5052f542b6faece97160',
-      class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
+      key: 'ae61acfb731129d85d3c5151ac08d676113a5971',
+      class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: '4c2780b54496da965860adb2a13b3874198d2c50',
+      key: '2b59810dbc40db3dfca10a09ad524499ea87f0e9',
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
-      key: '1817732e6c42366661ef95cc1efad7bb3443481d',
+      key: 'e66cdabf69654205b975801bbc5ff102982fba78',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         background: this.colors[2].background
       }
     }, h("div", {
-      key: 'fdb50c1ad5c1b19aa7d6b271857d63d7ff129d66',
+      key: '0f4d10150dc7694d7d4ccf59bc99a95216a00bc5',
       class: "grid"
     }, h("span", {
-      key: '4b5f5b8e075d73329803b5ca1204c257e8e8d6c4',
+      key: '85bbcdc4ca9b1f35625c15f5e742c35599084456',
       class: "f-body-02"
     }, this.colors[2].rgb), h("span", {
-      key: '67a26de500956ca477aa2213e6ecf8bea6d7ecb0',
+      key: '0b5354d88e4ada3497bb20ae9138e3f23d31b5e7',
       class: "f-body-02 w-full"
     }, this.colors[2].cmyk), h("eds-code-block", {
-      key: 'f0cd24d68af26304da2bfc8755328ca9d319c1b9',
+      key: 'a67ca35d57d13a66fcab132565c1a246e37f42e8',
       code: this.colors[2].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: 'f45ddb2b08e36a64e0383289fe7e1e70d11bc725',
+      key: '41322955767caa5ce439b142ccacdcb809ebc52e',
       class: "grid"
     }, h("span", {
-      key: 'b5f5fd53de2e0fee6122c0797f3269dd0e70e9f3',
+      key: 'ab06d7acd75b1065d057a4ec8cd7af93cd91bb5c',
       class: "f-body-02"
     }, this.colors[2].pantoneC), h("span", {
-      key: 'cbe037d718989eaf0274463ed300e81415e701e9',
+      key: 'ec63cad47f9021cfd1bed508721cc5772d037bd3',
       class: "f-body-02"
     }, this.colors[2].pantoneU))), h("div", {
-      key: '64e866bab4859c8a35a08440bf4c855d3824d20a',
+      key: 'ce5898b0ff195f6033d28e68dfd981a1813a23a4',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         background: this.colors[3].background
       }
     }, h("div", {
-      key: '1060ff9082dc3fd0c1d76a7b1c348ee980d59d5d',
+      key: '1126fbf08d60b5840ba76e7d838d0ebfb47a0af9',
       class: "grid"
     }, h("span", {
-      key: 'abe785e555f4ec227ae6fd5eda65431b63f69d84',
+      key: 'd18fbf24fcedb41638c626991e9ef3706cd0e4f7',
       class: "f-body-02"
     }, this.colors[3].rgb), h("span", {
-      key: '43a7d7afd959c53d552225df797f308f2c6672c0',
+      key: '9d7d1df13ce9ab7b447d72851a2f5f3b66cf1034',
       class: "f-body-02 w-full"
     }, this.colors[3].cmyk), h("eds-code-block", {
-      key: '0238b051353f4d717d7e1fc8a2d038e03c337150',
+      key: '5f92ba3b52a56638b7469572614d75fde23a1516',
       code: this.colors[3].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: 'c922aca2c73e3d489f029edee6c21f2c741608bc',
+      key: '4b17671dd5d18382d80ee52b8cbce51633d78603',
       class: "grid"
     }, h("span", {
-      key: 'fd09943b23b1c58efcb1f971fde59cdcdd6fb6d3',
+      key: 'cc6a59b63bcd128d5adfd70d908cecba1324a717',
       class: "f-body-02"
     }, this.colors[3].pantoneC), h("span", {
-      key: '5a9e9d68d53c02c9a871efc71e384bfe4f3dc15e',
+      key: '1cf37dab03769794f85d09d8d331306fb24e2fb3',
       class: "f-body-02"
     }, this.colors[3].pantoneU))))), h("eds-block-break", {
-      key: '708821f7228d40fa0a6af2ce906955e7d0a9134a'
+      key: '1e1888c860c39e5ac93c2dcd5ff9bf65e8c3b412'
     }), h("ul", {
-      key: 'af9971a8abdf34a4397466712e6391496a4fbbfb',
-      class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
+      key: '46ee0e1cd0a80a6da7991ee9474e4db5841b1c52',
+      class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: 'fc026fa3187ed8536a553a34eca496d60c0a3c28',
+      key: '59343e8799ddb56b0d14d3a9c43f4d43c5d82cba',
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
-      key: 'd42c5c8620956085d632daa27f552935cc57c4f5',
+      key: '5388a8eb55332a9a6d5b5fbe8bf022eb2a76d06c',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         background: this.colors[4].background
       }
     }, h("div", {
-      key: '3cd0f3371918e997facce06672764914a168e7b9',
+      key: '0f57d835c53d5844a155c8cfb78b1b3d0d37aecd',
       class: "grid"
     }, h("span", {
-      key: '1111da42bd889d65bba8615cbb321c1ad6386a5b',
+      key: '65b91767f90901590ca0ca4d892bf4bf5ca215d2',
       class: "f-body-02"
     }, this.colors[4].rgb), h("span", {
-      key: '172ea59eb6a729ba29341662dba089d665dfe921',
+      key: 'c2c46be9bee84e4ca53929dc9a0f5b87f48ad3ed',
       class: "f-body-02 w-full"
     }, this.colors[4].cmyk), h("eds-code-block", {
-      key: '7a56e5937a4ae52d5c55489d49379b04d99f1bc3',
+      key: 'c40e13a9f535d710cede159d555fac9bbddf7b4c',
       code: this.colors[4].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: '4a5fd644619823b3ae0e30cd60fa6d7bfc643047',
+      key: '0ebf1113e44f4e2704465d286022b84ddd57c43e',
       class: "grid"
     }, h("span", {
-      key: '15a2d7d98420c0ebb8fe3914bb1457e821a5a99a',
+      key: 'e8c7485dfe4b2d1e36eae2cb21ec624384e5c085',
       class: "f-body-02"
     }, this.colors[4].pantoneC), h("span", {
-      key: '4e09b1d98588aba17283686303f02ddce63b9f79',
+      key: '7d875d8c15a4f7bee7c746d9f297bd910f4cc5a6',
       class: "f-body-02"
     }, this.colors[4].pantoneU))), h("div", {
-      key: '527816987ba5afd8d906ab1b1c92c1499bb0c82c',
+      key: '27777683ba91c02274fd691b09a43c836e24aca3',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         background: this.colors[5].background
       }
     }, h("div", {
-      key: '5723ecebf48cb271b908892880b2e5916a2260d3',
+      key: '4f9b082b9e6c5d679801446fa5a7b88d18b40147',
       class: "grid"
     }, h("span", {
-      key: '1f4bc5243c69d4d875100dea5678eca909a318d6',
+      key: '6afd59aafb0f1b793a8f989f7d201a922951dacd',
       class: "f-body-02"
     }, this.colors[5].rgb), h("span", {
-      key: 'a0d7e3283b2c27c9c909174671f84f0e127fd47b',
+      key: '2114f91de062deba17e69d9bff77670107ed3f91',
       class: "f-body-02 w-full"
     }, this.colors[5].cmyk), h("eds-code-block", {
-      key: '80eb873c0ef3db0ab0fedb0b97fd6a55c77b7a9b',
+      key: '08f8b3155d932eed5b05f4dbfc0e3c6e23aa02b5',
       code: this.colors[5].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: '7ad8e2f8fd77fa22f8c960b9f60b93160d7b18e4',
+      key: '5459b32225dbf86021dd6a95e84b73bf14a74fe8',
       class: "grid"
     }, h("span", {
-      key: '76d8a46dc70cabfb90314730a14cf613dd94e5a2',
+      key: 'bedfeaa4250c3bf74f267d50aecc0df93fbf21ad',
       class: "f-body-02"
     }, this.colors[5].pantoneC), h("span", {
-      key: '6fba90e3c22c2a2cb79dc99345648fdce235a529',
+      key: '8cc7a7a1abef3dcccad63c600692bffa5df89837',
       class: "f-body-02"
     }, this.colors[5].pantoneU))))));
   }
@@ -580,174 +602,174 @@ const GradientSupportPalette = class {
   }
   render() {
     return h("ul", {
-      key: '2d73e1f2954e7900990f3f1b92e088172c48d193',
-      class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
+      key: 'd965ec67f29697480e0b7a6fea0743d946476153',
+      class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: 'ddd095d39334d645bd69143f975c869c9061becf',
+      key: '7ae7f96aa9b3ce2a8d1fbc018b652a83e4f41e90',
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
-      key: '8fdd52e523f612f65293cefa69cd1587722ea0b2',
+      key: '604c51b26cc5eec60e2e0125cda0cb60c82282f0',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         backgroundColor: this.colors[0].background
       }
     }, h("div", {
-      key: 'ba16ce258232ac4ff1dd57e69ce89eba2755ea4e',
+      key: '083d7aa003c99b54dc0c62c5ba1603c2a2a75c0a',
       class: "grid"
     }, h("span", {
-      key: 'e5bbd8438eedce22c00a570b5000bb2f9544f943',
+      key: '4bc89f70e22217fa58f1db0586a8d5ee0db8bdae',
       class: "f-body-02"
     }, this.colors[0].rgb), h("span", {
-      key: '26bdb7eab2bf73b568d79a31d697d835a1a2c16d',
+      key: 'd8e1bb4f6ce3e173e31685fc4435be29d9eac4a4',
       class: "f-body-02 w-full"
     }, this.colors[0].cmyk), h("eds-code-block", {
-      key: '63ed93911453afa708119d3bc237581fc14d859b',
+      key: 'e370e6ea2808161625aea5e9b1e6e4dd9d137f33',
       code: this.colors[0].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: 'a99939016fee0fdcbfc8916ddabc70da990506b6',
+      key: '6caf8c42e6296081a3daaca0e52c2a2776d1ab46',
       class: "grid"
     }, h("span", {
-      key: 'f51ea8694129ef99920037fae8837b2c4f7552ce',
+      key: '48ac4de4d194ae630a8a14df56ff2670f2f37092',
       class: "f-body-02"
     }, this.colors[0].pantoneC || 'N/A'), h("span", {
-      key: '047e32f25dc6f2c8d8c0881c500e4485d20e9312',
+      key: 'fd02781c816a152d92c1579dc9a3115eadb0690e',
       class: "f-body-02"
     }, this.colors[0].pantoneU || 'N/A')))), h("li", {
-      key: '8364ad80dc8a18b4315f9e39f8d364fe928e1334',
+      key: 'a8562d9fb6ff77fcc6b31952a2ead12f3e0e9b50',
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
-      key: 'f03dce05b8e864f63560d3ac02bdbc37c66f5c00',
+      key: '4578880af1de315101deb5b42c91769dc2ca7437',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         backgroundColor: this.colors[1].background
       }
     }, h("div", {
-      key: 'b6995567668ffafb14824bfcb2394dfbaff7f718',
+      key: 'ed304eb3c8c3ccb769db7d769872ce075261cb17',
       class: "grid"
     }, h("span", {
-      key: 'eea29f050955e9cb036650af9760f4056ca2de29',
+      key: '956fe1115a5c1c4f6d2503737a46f0f1cbdc8e06',
       class: "f-body-02"
     }, this.colors[1].rgb), h("span", {
-      key: '4978ad35c6902267c8bbecb471ea479c2a08577b',
+      key: '6beb1017eec40dd27351fda2ec1609987d46fb05',
       class: "f-body-02 w-full"
     }, this.colors[1].cmyk), h("eds-code-block", {
-      key: 'e043773af3e73ebd7978c7f7bc7cbc0ca02f162c',
+      key: 'a9319b683d13670c827b3444484d5469142ef76d',
       code: this.colors[1].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: '3fa13de855940e4188818ff7031463b9d3915511',
+      key: '1d4f1a48a18aee0a90dd04fb336352042014ce29',
       class: "grid"
     }, h("span", {
-      key: '0c5f5c3ab2946033c7ff74f39b7a71380471d887',
+      key: 'f4b7df5e0cde451a5e650e11b9805cc5be0c9fec',
       class: "f-body-02"
     }, this.colors[1].pantoneC || 'N/A'), h("span", {
-      key: '4b21f7ed78add17b4d013c59aac12976670ef037',
+      key: '26d4869a2207e1386f72d2833aaf819c15006c34',
       class: "f-body-02"
     }, this.colors[1].pantoneU || 'N/A')))), h("li", {
-      key: 'fce44ca75c9d2317b6fd9a1953db054b8d1ca4b3',
+      key: 'ed2b1465825e249bff9f5df38649b331f19e0672',
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
-      key: '4748c78922ae9c03cd457911b0e9e92c818545d8',
+      key: '22182a6d9bb64ab5dcbc38e359c3a7d7f79f3090',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         background: this.colors[2].background
       }
     }, h("div", {
-      key: '9cff6d7998f301a7c97d939bf5c38e5687fb0bde',
+      key: '28e2e772e7d12fbfdebec31f0aff6db397140132',
       class: "grid"
     }, h("span", {
-      key: 'a1561d5f9472d43e40bd054cf516458f89841c3f',
+      key: '872451c9846398641f1a592e8c166a6a51ee7298',
       class: "f-body-02"
     }, this.colors[2].rgb), h("span", {
-      key: 'b55020b6dbb423ec2151b81c185311229993ec83',
+      key: '84e28be1191f264e126c8579e26cbe6966010b4d',
       class: "f-body-02 w-full"
     }, this.colors[2].cmyk), h("eds-code-block", {
-      key: 'ae4d929c795f5e12cb1f2f41aad3bfc9a1db47c7',
+      key: 'a4c3dc76652feefaf3a9eba5bb3694b8dbf96be8',
       code: this.colors[2].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: '3ba7d23eb05b4dcc97b8dd7204a93daca6e0e798',
+      key: 'ff3a6599da869d3f9e85cb94481206e7e6331988',
       class: "grid"
     }, h("span", {
-      key: '4c047aae61adb93550b0ce1da65387b6d57e745f',
+      key: '37ef90488eb673fdac1221f7123daa87a5a75fcd',
       class: "f-body-02"
     }, this.colors[2].pantoneC), h("span", {
-      key: '8d8776d142dd8f9378900dc152b32b5b3cfbe95e',
+      key: '0a6fbb96f982a3e7c12af3787520335878faa9fe',
       class: "f-body-02"
     }, this.colors[2].pantoneU))), h("div", {
-      key: 'd4d02de329e6d6407c8e360a7b1838395f7aab40',
+      key: 'b59aeb053ab1145e0d3bc163f4650cdf30afe7d4',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         background: this.colors[3].background
       }
     }, h("div", {
-      key: '50659022ed31e85fa46df11e33050430bc3a92db',
+      key: 'af020f1a66c2d0afcb2e2bdf189569e6d897ef32',
       class: "grid"
     }, h("span", {
-      key: 'b2353739a0a09c5576eed0355a2c96913fb81a97',
+      key: '3b2f895dccdeb5e2fb5aa505f19514f012d24426',
       class: "f-body-02"
     }, this.colors[3].rgb), h("span", {
-      key: 'a40cd11295617a0b67bfe1ac49420d9918503a6d',
+      key: '9836a6ef47ed0dc8767a590212a23bfca2f74adf',
       class: "f-body-02 w-full"
     }, this.colors[3].cmyk), h("eds-code-block", {
-      key: 'd42fa64fbc856b2a52241650d6b74acd2b8642ee',
+      key: '3b274f716c6ca1381e4cc0136d18e167290bfa74',
       code: this.colors[3].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: '341bd4f637751cefa429bc6c3aab0adc714830e6',
+      key: 'a41592e2172dc9f81e9d2f36328ff88de3f0954e',
       class: "grid"
     }, h("span", {
-      key: '728dfa47d7e92236cfb9c321fcd610a9cd3c4cd8',
+      key: 'fd7a06a256d3513bcf239fe9f778f3589895b9d5',
       class: "f-body-02"
     }, this.colors[3].pantoneC), h("span", {
-      key: '3f06c0d1468942e9999655d32b0b32454720ceae',
+      key: '991f38ea137b729c9e9e6c9e0031940151f6e9dc',
       class: "f-body-02"
     }, this.colors[3].pantoneU)))), h("li", {
-      key: '9bdd7ba9ccb255e8540b12ae33636a164f2d2da1',
+      key: '8efdd7d9f93cba4b9479e1d3face7cec94cf1af6',
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col"
     }, h("div", {
-      key: 'e700e5494922cdd1940a4002cab7fecfd407ce72',
+      key: '4223ec29cac4313dc261cb472bd880ae00279657',
       class: "effect-height flex items-center justify-between p-16",
       style: {
         backgroundColor: this.colors[4].background
       }
     }, h("div", {
-      key: '7dc4bfe5e3db4754f7e0c21005b36e16f32cf531',
+      key: '227dd5fab1add4083271b6e7f95c7d575d91252e',
       class: "grid"
     }, h("span", {
-      key: '7faca86fa5a0477b8a136c39c9e6caac63bbaa27',
+      key: 'e5b1aab8d67f7c67f231acd4156768f146320be3',
       class: "f-body-02"
     }, this.colors[4].rgb), h("span", {
-      key: 'b0dede7a2415df03772b15e32feb066f1dc18124',
+      key: 'fc4712e37494e8e30a48bc77a0ca61c94e24075d',
       class: "f-body-02 w-full"
     }, this.colors[4].cmyk), h("eds-code-block", {
-      key: '3903bcb378fc37313c79c187d2722a80773a6fdf',
+      key: 'a429c519e42e242d8ce8f661a513f7b5327ffce7',
       code: this.colors[4].hex,
       style: {
         minWidth: '150px',
         marginRight: '5px'
       }
     })), h("div", {
-      key: 'b15d2d0529d6ac65f549219155b0dc1f17c4e43e',
+      key: '84f30a1620cacadf8c0bf1382333d74772f81f27',
       class: "grid"
     }, h("span", {
-      key: 'c7bc170b9f4b11552e5f5b7332fb3cc2db628dbf',
+      key: '2b6dfc8e87517e4d0421ef0e5c2391a07f033600',
       class: "f-body-02"
     }, this.colors[4].pantoneC || 'N/A'), h("span", {
-      key: '8c643a1a1590e3cf928835afc3a0a8c35dbe18f2',
+      key: 'c4cd5bc061ce4163a170568c0ed5934c7f30d75f',
       class: "f-body-02"
     }, this.colors[4].pantoneU || 'N/A')))));
   }