@ebrains/components 0.9.2-beta → 0.9.3-beta

package/dist/components/logo-space.js

@@ -0,0 +1,101 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { v as vLogoMargins } from './logo-color-margins.js';
+import { d as defineCustomElement$c } from './eds-icon-wrapper2.js';
+import { d as defineCustomElement$b } from './eds-input2.js';
+import { d as defineCustomElement$a } from './eds-input-field2.js';
+import { d as defineCustomElement$9 } from './eds-input-footer2.js';
+import { d as defineCustomElement$8 } from './eds-input-label2.js';
+import { d as defineCustomElement$7 } from './eds-input-range2.js';
+import { d as defineCustomElement$6 } from './eds-input-search2.js';
+import { d as defineCustomElement$5 } from './eds-input-select2.js';
+import { d as defineCustomElement$4 } from './eds-link2.js';
+import { d as defineCustomElement$3 } from './eds-pagination2.js';
+import { d as defineCustomElement$2 } from './eds-table2.js';
+
+const logoSpaceCss = "ol,ul,menu{list-style:none;margin:0;padding:0}.text-center{text-align:center}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.grid-layout{--grid-columns:6;display:grid;grid-template-columns:repeat(var(--container-grid-columns, var(--grid-columns)), 1fr);grid-gap:var(--inner-gutter)}.grid-cols-6[class*=\"grid-line-x\"][class*=\"grid-line-x\"]>*:nth-child(n)::before{border-bottom-width:1px}.grid-cols-6[class*=\"grid-line-xfull\"]>*:nth-child(n)::before{inset-inline-start:calc(var(--inner-gutter) / -2);inset-inline-end:calc(var(--inner-gutter) / -2)}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1)::before{inset-inline-start:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+6)::before{inset-inline-end:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1):nth-last-child(-n+6)::before{border-bottom-width:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1):nth-last-child(-n+6)~*::before{border-bottom-width:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(n)::after{border-inline-end-width:1px}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+6)::after{border-inline-end-width:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(-n+6)::after{top:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+1):nth-last-child(-n+6)::after{bottom:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+1):nth-last-child(-n+6)~li::after{bottom:0}.grid-col-span-6{--container-grid-columns:6;grid-column:span 6 / span 6}.gap-y-8{row-gap:0.5rem}.flex{display:flex}.flex-col{flex-direction:column}.mx-auto{margin-left:auto;margin-right:auto}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}@media (min-width: 750px){.md\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}.md\\:gap-y-12{row-gap:0.75rem}}@media (min-width: 900px){.lg\\:gap-y-16{row-gap:1rem}.lg\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}@media (min-width: 1024px){.xl\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}@media (min-width: 1280px){.xxl\\:grid-col-span-2{--container-grid-columns:2;grid-column:span 2 / span 2}.xxl\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}.w-\\[150px\\]{width:150px}.w-\\[300px\\]{width:300px}";
+const LogoSpaceStyle0 = logoSpaceCss;
+
+const LogoSpace$1 = /*@__PURE__*/ proxyCustomElement(class LogoSpace extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+    }
+    render() {
+        return (h("div", { key: 'ac45631802109b60cbccb09102ba1e0aa0fca3e6', class: "container" }, h("ul", { key: '8739e8d9facd30229db4f9dad4f21c1491513945', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, h("li", { key: 'e5d12885d0faf35153d13e8da6d576ed421139b9', class: "grid-col-span-6 xxl:grid-col-span-3 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("div", { key: 'f754292bf3d3f3c39773e6fced7893a79ea5eda3', class: "logo-container mx-auto w-[300px]", innerHTML: vLogoMargins })), h("li", { key: 'de9d24e26be14bb0e975ebbc3568a38cfea69420', class: "grid-col-span-6 xxl:grid-col-span-3 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("div", { key: 'f040d91a7af79e939d3d5aa5c92d2c1527b0b2cb', class: "text-center mt-16" }, h("p", { key: '49759b744d2e71318d80712bfd3d6b19229a8a33', class: "f-body-01" }, "To ensure legibility, follow these minimum size guidelines:"), h("eds-table", { key: '54d2f4512baa60fa4c6d1bf9b96f5ee59fc32911', data: '[\n                  { "Media": "Print", "Landscape": "0.75 cm", "Portrait": "1.75 cm" },\n                  { "Media": "Web", "Landscape": "29 px", "Portrait": "50 px" }\n                ]', config: '{\n                  "Media": { "format": "bold" }\n                }' }))), h("li", { key: '060029fa1f01bca29cb7450c8be43ce0705effe3', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }))));
+    }
+    static get style() { return LogoSpaceStyle0; }
+}, [1, "logo-space"]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["logo-space", "eds-icon-wrapper", "eds-input", "eds-input-field", "eds-input-footer", "eds-input-label", "eds-input-range", "eds-input-search", "eds-input-select", "eds-link", "eds-pagination", "eds-table"];
+    components.forEach(tagName => { switch (tagName) {
+        case "logo-space":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, LogoSpace$1);
+            }
+            break;
+        case "eds-icon-wrapper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$c();
+            }
+            break;
+        case "eds-input":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$b();
+            }
+            break;
+        case "eds-input-field":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "eds-input-footer":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "eds-input-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "eds-input-range":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "eds-input-search":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "eds-input-select":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "eds-link":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "eds-pagination":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "eds-table":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const LogoSpace = LogoSpace$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LogoSpace, defineCustomElement };

package/dist/components/logo-variations-horizontal.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface LogoVariationsHorizontal extends Components.LogoVariationsHorizontal, HTMLElement {}
+export const LogoVariationsHorizontal: {
+    prototype: LogoVariationsHorizontal;
+    new (): LogoVariationsHorizontal;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/logo-variations-horizontal.js

@@ -0,0 +1,6 @@
+import { L as LogoVariationsHorizontal$1, d as defineCustomElement$1 } from './logo-variations-horizontal2.js';
+
+const LogoVariationsHorizontal = LogoVariationsHorizontal$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LogoVariationsHorizontal, defineCustomElement };

package/dist/components/{logo-variations-horizontal.entry.js → logo-variations-horizontal2.js}

@@ -1,15 +1,37 @@
-import { r as registerInstance, h } from './index-9d277061.js';
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$1 } from './eds-logo2.js';
 
 const logoVariationsHorizontalCss = "ol,ul,menu{list-style:none;margin:0;padding:0}.coloured{background:linear-gradient(to left,\n      #9CE142 0%,\n      #00C959 50%,\n      #00A595 100%)}.f-body-01{font-family:var(--f-body-01-fontFamily);font-weight:var(--f-body-01-fontWeight);font-size:var(--f-body-01-fontSize);line-height:var(--f-body-01-lineHeight);letter-spacing:var(--f-body-01-letterSpacing)}.text-center{text-align:center}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.grid-layout{--grid-columns:6;display:grid;grid-template-columns:repeat(var(--container-grid-columns, var(--grid-columns)), 1fr);grid-gap:var(--inner-gutter)}.grid-cols-6[class*=\"grid-line-x\"][class*=\"grid-line-x\"]>*:nth-child(n)::before{border-bottom-width:1px}.grid-cols-6[class*=\"grid-line-xfull\"]>*:nth-child(n)::before{inset-inline-start:calc(var(--inner-gutter) / -2);inset-inline-end:calc(var(--inner-gutter) / -2)}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1)::before{inset-inline-start:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+6)::before{inset-inline-end:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1):nth-last-child(-n+6)::before{border-bottom-width:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1):nth-last-child(-n+6)~*::before{border-bottom-width:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(n)::after{border-inline-end-width:1px}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+6)::after{border-inline-end-width:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(-n+6)::after{top:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+1):nth-last-child(-n+6)::after{bottom:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+1):nth-last-child(-n+6)~li::after{bottom:0}.grid-col-span-6{--container-grid-columns:6;grid-column:span 6 / span 6}.gap-y-8{row-gap:0.5rem}.flex{display:flex}.flex-col{flex-direction:column}.mx-auto{margin-left:auto;margin-right:auto}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}@media (min-width: 750px){.md\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}.md\\:gap-y-12{row-gap:0.75rem}}@media (min-width: 900px){.lg\\:gap-y-16{row-gap:1rem}.lg\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}@media (min-width: 1024px){.xl\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}@media (min-width: 1280px){.xxl\\:grid-col-span-2{--container-grid-columns:2;grid-column:span 2 / span 2}.xxl\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}";
+const LogoVariationsHorizontalStyle0 = logoVariationsHorizontalCss;
 
-const LogoVariationsHorizontal = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
+const LogoVariationsHorizontal = /*@__PURE__*/ proxyCustomElement(class LogoVariationsHorizontal extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
     }
     render() {
-        return (h("div", { key: '02941660c566920227b36481dd7d211ad0ae35cc', class: "container" }, h("ul", { key: 'a1859aafecdba011251097f758b38171278cac22', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, h("li", { key: 'c105a4f208a7b7f15c6e0b28aff947e14bd533b9', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: '7b465faf996ae41431f505a81f86711988fcf680', class: "f-body-01 text-center my-4" }, "#1 Coloured"), h("div", { key: '6e4ecd4347777a1fed5502129abe7247e2963923', class: "coloured" }, h("eds-logo", { key: '8b129a330768f306d009bf93a4602d761559d0b8', type: "no-bg", href: "#" }))), h("li", { key: '451cadfdb5178acc0269988a06afb0e454a07833', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: '7b9d5fc604ebea27478f9ea3f95bf353e3310132', class: "f-body-01 text-center my-4" }, "#2 Black & White"), h("div", { key: 'd3bb58f4f9c5c5e2d74511d7aac5375d221119e2', class: "bg-default" }, h("eds-logo", { key: 'bff3e05b114130b767cfecd65de33ba6ebf63778', type: "black", href: "#" }))), h("li", { key: 'f7a627949d4c2e2a31f2e8c713a311c440c7d644', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: '09f14d2777c7462c493953748b92cdadf971e67e', class: "f-body-01 text-center my-4" }, "#3 Dark"), h("div", { key: 'c7b79be6d031fb97e875525b848350a988879193' }, h("eds-logo", { key: '8a7fcf5800747bca95402df008423fd57ef2ebde', type: "color-white", href: "#" }))))));
+        return (h("div", { key: '303b9b6eaf8926bac5e0a36834fcd4f3ffbc239f', class: "container" }, h("ul", { key: '79498e5d6218fd979da5b658e083f3941811d16e', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, h("li", { key: 'b7af4d1c59ae2c8fd72e4328b9789c82f2631151', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: '05ac2498be41b34c65d7c427426bd860c34a9de6', class: "f-body-01 text-center my-4" }, "#1 Coloured"), h("div", { key: 'da35b27637ff24021defda4fa7e30dd25e24b33e', class: "coloured" }, h("eds-logo", { key: '6d9df95299de4f880ef937a3aeb95f855c2db4f1', type: "no-bg", href: "#" }))), h("li", { key: '259b8e02669bee318d7f07a8b35ac12bca18c089', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: 'a7c2453fe76f06c589cf4d877a870af88dfb6e0b', class: "f-body-01 text-center my-4" }, "#2 Black & White"), h("div", { key: '0579383e0f27625c33621f239901eb2726681c4c', class: "bg-default" }, h("eds-logo", { key: 'f496baea986ebe432c2fe98576f74947df9e79dd', type: "black", href: "#" }))), h("li", { key: '7bd878285bb3145c23ee87ab31c94583be5b9bab', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: 'c769dac987be6708208de115c1578c4d477fca22', class: "f-body-01 text-center my-4" }, "#3 Dark"), h("div", { key: '793108fc4fd8119b5eefc1c14a4ffc2e11f6ccca' }, h("eds-logo", { key: '2cf9e56591026c45d4cb074ec0cc8d4dd894ed97', type: "color-white", href: "#" }))))));
     }
-};
-LogoVariationsHorizontal.style = logoVariationsHorizontalCss;
+    static get style() { return LogoVariationsHorizontalStyle0; }
+}, [1, "logo-variations-horizontal"]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["logo-variations-horizontal", "eds-logo"];
+    components.forEach(tagName => { switch (tagName) {
+        case "logo-variations-horizontal":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, LogoVariationsHorizontal);
+            }
+            break;
+        case "eds-logo":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
 
-export { LogoVariationsHorizontal as logo_variations_horizontal };
+export { LogoVariationsHorizontal as L, defineCustomElement as d };

package/dist/components/logo-variations-tabs.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface LogoVariationsTabs extends Components.LogoVariationsTabs, HTMLElement {}
+export const LogoVariationsTabs: {
+    prototype: LogoVariationsTabs;
+    new (): LogoVariationsTabs;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/logo-variations-tabs.js

@@ -0,0 +1,60 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$4 } from './eds-logo2.js';
+import { d as defineCustomElement$3 } from './logo-variations-horizontal2.js';
+import { d as defineCustomElement$2 } from './logo-variations-vertical2.js';
+
+const LogoVariationsTabs$1 = /*@__PURE__*/ proxyCustomElement(class LogoVariationsTabs extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.tabIndex = undefined;
+    }
+    renderContent() {
+        switch (this.tabIndex) {
+            case 0:
+                return h("logo-variations-horizontal", null);
+            case 1:
+                return h("logo-variations-vertical", null);
+            default:
+                return h("p", null, "Content not available.");
+        }
+    }
+    render() {
+        return h("div", { key: 'c08e3e918cdad5cde3ccc7279faa6a0401379c4d', class: "container" }, this.renderContent());
+    }
+}, [0, "logo-variations-tabs", {
+        "tabIndex": [2, "tab-index"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["logo-variations-tabs", "eds-logo", "logo-variations-horizontal", "logo-variations-vertical"];
+    components.forEach(tagName => { switch (tagName) {
+        case "logo-variations-tabs":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, LogoVariationsTabs$1);
+            }
+            break;
+        case "eds-logo":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "logo-variations-horizontal":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "logo-variations-vertical":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const LogoVariationsTabs = LogoVariationsTabs$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LogoVariationsTabs, defineCustomElement };

package/dist/components/logo-variations-vertical.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface LogoVariationsVertical extends Components.LogoVariationsVertical, HTMLElement {}
+export const LogoVariationsVertical: {
+    prototype: LogoVariationsVertical;
+    new (): LogoVariationsVertical;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/logo-variations-vertical.js

@@ -0,0 +1,6 @@
+import { L as LogoVariationsVertical$1, d as defineCustomElement$1 } from './logo-variations-vertical2.js';
+
+const LogoVariationsVertical = LogoVariationsVertical$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LogoVariationsVertical, defineCustomElement };

package/dist/components/{logo-variations-vertical.entry.js → logo-variations-vertical2.js}

@@ -1,17 +1,42 @@
-import { r as registerInstance, h } from './index-9d277061.js';
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$1 } from './eds-logo2.js';
 
 const logoVariationsVerticalCss = ".coloured{background:linear-gradient(to left,\n      #9CE142 0%,\n      #00C959 50%,\n      #00A595 100%)}ol,ul,menu{list-style:none;margin:0;padding:0}.f-body-01{font-family:var(--f-body-01-fontFamily);font-weight:var(--f-body-01-fontWeight);font-size:var(--f-body-01-fontSize);line-height:var(--f-body-01-lineHeight);letter-spacing:var(--f-body-01-letterSpacing)}.text-center{text-align:center}.w-\\[200px\\]{width:200px}.w-\\[300px\\]{width:300px}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.grid-layout{--grid-columns:6;display:grid;grid-template-columns:repeat(var(--container-grid-columns, var(--grid-columns)), 1fr);grid-gap:var(--inner-gutter)}.grid-cols-6[class*=\"grid-line-x\"][class*=\"grid-line-x\"]>*:nth-child(n)::before{border-bottom-width:1px}.grid-cols-6[class*=\"grid-line-xfull\"]>*:nth-child(n)::before{inset-inline-start:calc(var(--inner-gutter) / -2);inset-inline-end:calc(var(--inner-gutter) / -2)}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1)::before{inset-inline-start:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+6)::before{inset-inline-end:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1):nth-last-child(-n+6)::before{border-bottom-width:0}.grid-cols-6[class*=\"grid-line-x\"]>*:nth-child(6n+1):nth-last-child(-n+6)~*::before{border-bottom-width:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(n)::after{border-inline-end-width:1px}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+6)::after{border-inline-end-width:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(-n+6)::after{top:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+1):nth-last-child(-n+6)::after{bottom:0}.grid-cols-6[class*=\"grid-line-y\"][class*=\"grid-line-y\"]>*:nth-child(6n+1):nth-last-child(-n+6)~li::after{bottom:0}.grid-col-span-6{--container-grid-columns:6;grid-column:span 6 / span 6}.gap-y-8{row-gap:0.5rem}.flex{display:flex}.flex-col{flex-direction:column}.mx-auto{margin-left:auto;margin-right:auto}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}@media (min-width: 750px){.md\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}.md\\:gap-y-12{row-gap:0.75rem}}@media (min-width: 900px){.lg\\:gap-y-16{row-gap:1rem}.lg\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}@media (min-width: 1024px){.xl\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}@media (min-width: 1280px){.xxl\\:grid-col-span-2{--container-grid-columns:2;grid-column:span 2 / span 2}.xxl\\:grid-col-span-3{--container-grid-columns:3;grid-column:span 3 / span 3}}";
+const LogoVariationsVerticalStyle0 = logoVariationsVerticalCss;
 
-const LogoVariationsVertical = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
+const LogoVariationsVertical = /*@__PURE__*/ proxyCustomElement(class LogoVariationsVertical extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
         this.orientation = 'vertical';
         this.type = undefined;
     }
     render() {
-        return (h("div", { key: 'e842e396933ee714f86a9443b55cd7045d12277e', class: "container" }, h("ul", { key: 'dfea7dc44294bfe2acbbfd580bff8908cbeb98bf', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, h("li", { key: 'fe44c472c10b814ff815c2a8cd7101adb0890872', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: '5ed6f1029df41907ca8b27a51612a1078f353ade', class: "f-body-01 text-center my-4" }, "#1 Coloured"), h("div", { key: 'eae38dbd0f8d4b92f2768559dbe65d6c136ba746', class: "mx-auto coloured w-[300px]" }, h("eds-logo", { key: '7a05dacc86c54c6ff51810b14c9dc99fad4e36b5', orientation: "vertical", type: "no-bg", href: "#" }))), h("li", { key: '4055ab71f60098acea7e27f2a8706c45aecb7097', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: '340cfb0cbf6383d46eabd91b6fb591a003ec00f6', class: "f-body-01 text-center my-4" }, "#2 Black & White"), h("div", { key: 'd4158d0b6413cae236c333fe0ffdd77dbda22c88', class: "mx-auto bg-default w-[300px]" }, h("eds-logo", { key: 'a411c3438499758b68cf949a83d9097da70a11f0', orientation: "vertical", type: "black", href: "#" }))), h("li", { key: 'a7a97185be422337fb333709c61fe7c435bc82f3', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: 'cef2acc75d1749cd93699a99a2d80aeaa61ed632', class: "f-body-01 text-center my-4" }, "#3 Dark"), h("div", { key: '43be8f5ca418a93b58c8f3a52d04a6e50b5bb03b', class: "mx-auto w-[300px]" }, h("eds-logo", { key: 'b5453b1009c0aa5c799c417e5c13b30cfc647840', orientation: "vertical", type: "color-white", href: "#" }))))));
+        return (h("div", { key: '98119d5c92d137e01d050699991658c764e9cb1b', class: "container" }, h("ul", { key: '191909da09aefdd362d8125790a1fe07f5f93293', class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16" }, h("li", { key: '1ce2f0a7266e25e132d6f52b04f15b526787a12c', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: 'e62d64aa3747eede49fe9687a73067a8dec5b54f', class: "f-body-01 text-center my-4" }, "#1 Coloured"), h("div", { key: '7ae9e21a9684d00c9ad91ccf70173e81bf8c707a', class: "mx-auto coloured w-[300px]" }, h("eds-logo", { key: '73aeaf945b418210481fbeabf7db1d320108cbce', orientation: "vertical", type: "no-bg", href: "#" }))), h("li", { key: '45494f2903afdb8a67b9a063a547f8b166bfc22f', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: 'd1c2475c0e32aba56377211b63ba139fd1d77c68', class: "f-body-01 text-center my-4" }, "#2 Black & White"), h("div", { key: '880d39be54129b285feec50302cf31c8cc52e9d9', class: "mx-auto bg-default w-[300px]" }, h("eds-logo", { key: '17eecfd918fb83aef6820576cfb0730328f5e442', orientation: "vertical", type: "black", href: "#" }))), h("li", { key: '48b40e5870cccea3eb0260697b1caddcab6cbed0', class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col" }, h("p", { key: '206c2b8286a9fe665a1a356ebd87082adfe5e4bf', class: "f-body-01 text-center my-4" }, "#3 Dark"), h("div", { key: '1d4b01ef162611ce1c2cc56d1ad7a44a10aacdd3', class: "mx-auto w-[300px]" }, h("eds-logo", { key: 'b6826d25f29634a7df4f51b4b66868ae06487b8b', orientation: "vertical", type: "color-white", href: "#" }))))));
     }
-};
-LogoVariationsVertical.style = logoVariationsVerticalCss;
+    static get style() { return LogoVariationsVerticalStyle0; }
+}, [1, "logo-variations-vertical", {
+        "orientation": [1],
+        "type": [1]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["logo-variations-vertical", "eds-logo"];
+    components.forEach(tagName => { switch (tagName) {
+        case "logo-variations-vertical":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, LogoVariationsVertical);
+            }
+            break;
+        case "eds-logo":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
 
-export { LogoVariationsVertical as logo_variations_vertical };
+export { LogoVariationsVertical as L, defineCustomElement as d };