@affinda/wc 0.0.17 → 0.0.18

package/dist/collection/components/af-illustrated-card/af-illustrated-card.js

@@ -33,7 +33,7 @@ export class AfIllustratedCard {
             [`illustrated-card--breakpoint-${this.breakpoint}`]: true,
             [`illustrated-card--size-${this.cardSize}`]: true,
         };
-        return (h(Host, { key: '60f265c32638f31318bcb0292b108cc1989af937' }, h("div", { key: '25d4c1f7652930f7e6948fef7ff33c21448dcb0f', class: wrapperClasses }, h("af-card", { key: '3b6dcf78a697a100273447de8ac6c19cc774bf1c', theme: this.theme }, h("div", { key: '4f1268ae1c60812414414423ec4af94ab3ee8b72', class: "illustrated-card__content" }, h("af-typography-lockup", { key: '346399ff84a4c2d22b201e0296f47a9b3fd5ab0a', headingSize: 3, breakpoint: this.breakpoint, textAlignment: "left", buttonAlignment: "vertical" }, h("slot", { key: '6e164be82cc05eb6debffc4ec24af5653f6a1306' }), h("span", { key: 'd0266f34ec02d44b76eba1e0ccf9c4856c08f33c', slot: "description" }, h("slot", { key: '6b6d659c54e83419f3b5e452b64fada7ba33e257', name: "body" })))), h("div", { key: '1319568917cdce5d2d37294af416dcfe58b1c4b5', class: "illustrated-card__illustration-area" }, h("slot", { key: 'bdea39d0db9615de5a1a6535f845d0c392604e74', name: "illustration" }))))));
+        return (h(Host, { key: '10c5250554859428b03c48c48b095b8b688b9e76' }, h("div", { key: '6c9859967f5fa583c7910ca6f2f33f53d14688e9', class: wrapperClasses }, h("af-card", { key: '945d2120fe82c60b60ca961ffa86cfe8f2344da3', theme: this.theme }, h("div", { key: 'd09cf3a9bd78dce22ccbed77b6b037b1533a106b', class: "illustrated-card__content" }, h("af-typography-lockup", { key: '5bbc4f4885d0b5c7369e363ba5f8a32b2ab0792f', headingSize: 3, breakpoint: this.breakpoint, textAlignment: "left", buttonAlignment: "vertical" }, h("slot", { key: 'c356febe02752679ac3e2210dbef75ea793fd884' }), h("span", { key: '677bbb48a4aeb2d65d4943541639942e8de96258', slot: "description" }, h("slot", { key: 'd747b66a032e5043614f0192dc5b01eafc98bb0d', name: "body" })))), h("div", { key: 'e3552088bc91fbdaf9c7c6901b30a75545e51e06', class: "illustrated-card__illustration-area" }, h("slot", { key: '0b42d7faec8934be964d400d324e26c9b1b8d5ee', name: "illustration" }))))));
     }
     static get is() { return "af-illustrated-card"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-image/af-image.js

@@ -5,7 +5,7 @@ import { h, Host } from "@stencil/core";
  */
 export class AfImage {
     render() {
-        return (h(Host, { key: 'dd1304f9c9c6c757638ddd67ee312534819e9e48' }, h("div", { key: '4ecbd48548404ecf0839eb15fef64dcb7b2d0757', class: "image-container" }, h("img", { key: '73d9d87b21b3aec12f708f19a83f91622b5bb896', src: this.src, alt: this.alt, class: "image" }), h("div", { key: 'e54f1dbc2ec4976056e58a570420fd3f772907cf', class: "image-border", "aria-hidden": "true" }))));
+        return (h(Host, { key: '96f56008e769e15ec20399b2911563a7be1561b9' }, h("div", { key: 'a4b7eb695f4a7074e657f5cfb947a472f3bf9ae9', class: "image-container" }, h("img", { key: 'fcd9e6ca93ea345cf7a94a895b5161c79c9fe776', src: this.src, alt: this.alt, class: "image" }), h("div", { key: 'cee231a0d19312cc4659da8707d3e31955dcad18', class: "image-border", "aria-hidden": "true" }))));
     }
     static get is() { return "af-image"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-in-page-banner/af-in-page-banner.js

@@ -56,7 +56,7 @@ export class AfInPageBanner {
         return (h("div", { class: "banner__wave-overlay", "aria-hidden": "true" }, h("svg", { viewBox: "0 0 521 323", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "banner__wave-svg" }, h("path", { d: "M473.775 46.273C443.539 15.92 403.701 -0.631616 361.351 0.0184478H154.183L112.67 67.225H361.893C362.189 67.225 362.533 67.225 362.829 67.225C387.155 67.225 410.004 76.7259 427.289 94.0776C445.017 111.879 454.816 135.682 454.816 161.134C454.816 213.389 412.959 255.843 361.548 255.843H108.041C84.9457 255.843 66.1345 236.742 66.1345 213.289C66.1345 189.837 84.9949 170.435 107.992 169.735H334.957L377.799 102.528H106.859C47.9636 104.029 0 153.683 0 213.289C0 272.895 48.456 323 108.041 323H361.548C449.449 323 521 250.343 521 161.084C521 117.53 504.257 76.7759 473.824 46.2229L473.775 46.273Z", fill: "currentColor" }))));
     }
     render() {
-        return (h(Host, { key: '41403ba6ca0b60c416dd41d81f1eedbfe566f5c4' }, h("div", { key: '0c68549f2f1664d676fd969500702ccb8d4e43f5', class: `banner theme-${this.theme}` }, this.showWaveDecoration && this.renderWaveOverlay(), h("div", { key: '213397e65a87e0999f857af1201219ec1987c5b1', class: "banner__illustration" }, this.illustrationUrl ? (h("img", { src: this.illustrationUrl, alt: "", class: "banner__illustration-img", loading: "lazy" })) : (h("slot", { name: "illustration" }))), h("div", { key: '972c0ba5f99a8cc22bb9bf04402ee6f7feabb6be', class: "banner__content" }, h("div", { key: '659301eefed48b4abdfaaafa2c4db3fe242703fc', class: "banner__copy" }, this.heading && (h("h2", { key: 'aa4e2b0acf38d149b302c573da7e8f5bf097b846', class: "banner__heading" }, this.heading)), this.description && (h("p", { key: 'e0bb0b75f31b1a3c5bb0c61e48521a3ee0085f6e', class: "banner__description" }, this.description))), (this.primaryButtonText || this.secondaryButtonText) && (h("div", { key: '8a029743425b837cc8275eea38a1313366add6ec', class: "banner__buttons" }, this.primaryButtonText && (h("af-button", { key: '9a237dc0b9c4165c7b96ba526aae791b8504941e', href: this.primaryButtonUrl, variant: "primary" }, this.primaryButtonText)), this.secondaryButtonText && (h("af-button", { key: 'a9ab21d4efa1f68061b64f6e64c1da2d179eb0d2', href: this.secondaryButtonUrl, variant: "secondary" }, this.secondaryButtonText))))))));
+        return (h(Host, { key: '382549642707642ba3182f7bf4391e3254a6cf8e' }, h("div", { key: '0d144e64a93e5222c426d0b9d0379a1318538972', class: `banner theme-${this.theme}` }, this.showWaveDecoration && this.renderWaveOverlay(), h("div", { key: 'f82845be709ec7e98b84dd5e65f5eb67473c13bb', class: "banner__illustration" }, this.illustrationUrl ? (h("img", { src: this.illustrationUrl, alt: "", class: "banner__illustration-img", loading: "lazy" })) : (h("slot", { name: "illustration" }))), h("div", { key: '73c35ca159f9588ac8fb9c8941ec43ea5ffa0b7a', class: "banner__content" }, h("div", { key: '5cab358c648677515bb9bf8f8594d2e37c43af89', class: "banner__copy" }, this.heading && (h("h2", { key: 'f0bbe316c200bbf7e6a5406f3e089c0a839e7709', class: "banner__heading" }, this.heading)), this.description && (h("p", { key: 'c6a0f293b2eb35489ed97d32ed162791a9087a2d', class: "banner__description" }, this.description))), (this.primaryButtonText || this.secondaryButtonText) && (h("div", { key: '87cff6182bb7de438ba7393ae308aaf0fba09814', class: "banner__buttons" }, this.primaryButtonText && (h("af-button", { key: 'b3f3c97a10e8571fbbf9ebd20c6773303dc90b18', href: this.primaryButtonUrl, variant: "primary" }, this.primaryButtonText)), this.secondaryButtonText && (h("af-button", { key: 'efae95eebae4dc6401bff0c1219c376f7c7d73a5', href: this.secondaryButtonUrl, variant: "secondary" }, this.secondaryButtonText))))))));
     }
     static get is() { return "af-in-page-banner"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-inline/af-inline.css

@@ -0,0 +1,9 @@
+:host {
+  display: inline-flex;
+  box-sizing: border-box;
+}
+
+:host([hidden]) {
+  display: none;
+}
+

package/dist/collection/components/af-inline/af-inline.js

@@ -0,0 +1,166 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Inline layout component for horizontal inline-flex layouts with gap and optional wrapping.
+ * Ideal for button groups, tags, pills, and other inline elements.
+ *
+ * @slot - Content to layout inline
+ */
+export class AfInline {
+    constructor() {
+        /**
+         * Gap between items using space tokens (1-8).
+         * Maps to --space-1 through --space-8 (4px to 32px).
+         */
+        this.gap = '2';
+        /**
+         * Align items on the cross axis.
+         */
+        this.align = 'center';
+        /**
+         * Justify content on the main axis.
+         */
+        this.justify = 'start';
+        /**
+         * Whether items should wrap to the next line when they overflow.
+         */
+        this.wrap = true;
+    }
+    render() {
+        const alignMap = {
+            start: 'flex-start',
+            center: 'center',
+            end: 'flex-end',
+            stretch: 'stretch',
+            baseline: 'baseline',
+        };
+        const justifyMap = {
+            start: 'flex-start',
+            center: 'center',
+            end: 'flex-end',
+            between: 'space-between',
+            around: 'space-around',
+            evenly: 'space-evenly',
+        };
+        const style = {
+            display: 'inline-flex',
+            flexDirection: 'row',
+            gap: `var(--space-${this.gap})`,
+            alignItems: alignMap[this.align],
+            justifyContent: justifyMap[this.justify],
+            flexWrap: this.wrap ? 'wrap' : 'nowrap',
+        };
+        return (h(Host, { key: '947a3a94d5b8f5d1a60132d690523ae8e842b542', style: style }, h("slot", { key: '7b60eb9cf33eeaf6a0002fc70ad664adaecaad8e' })));
+    }
+    static get is() { return "af-inline"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-inline.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-inline.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "gap": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Gap",
+                    "resolved": "\"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"8\"",
+                    "references": {
+                        "Gap": {
+                            "location": "global",
+                            "id": "global::Gap"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Gap between items using space tokens (1-8).\nMaps to --space-1 through --space-8 (4px to 32px)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "gap",
+                "defaultValue": "'2'"
+            },
+            "align": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Align",
+                    "resolved": "\"baseline\" | \"center\" | \"end\" | \"start\" | \"stretch\"",
+                    "references": {
+                        "Align": {
+                            "location": "global",
+                            "id": "global::Align"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Align items on the cross axis."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "align",
+                "defaultValue": "'center'"
+            },
+            "justify": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Justify",
+                    "resolved": "\"around\" | \"between\" | \"center\" | \"end\" | \"evenly\" | \"start\"",
+                    "references": {
+                        "Justify": {
+                            "location": "global",
+                            "id": "global::Justify"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Justify content on the main axis."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "justify",
+                "defaultValue": "'start'"
+            },
+            "wrap": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether items should wrap to the next line when they overflow."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "wrap",
+                "defaultValue": "true"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-inline.js.map

package/dist/collection/components/af-inline/af-inline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-inline.js","sourceRoot":"","sources":["../../../src/components/af-inline/af-inline.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAMzD;;;;;GAKG;AAMH,MAAM,OAAO,QAAQ;IALrB;QAME;;;WAGG;QACK,QAAG,GAAQ,GAAG,CAAC;QAEvB;;WAEG;QACK,UAAK,GAAU,QAAQ,CAAC;QAEhC;;WAEG;QACK,YAAO,GAAY,OAAO,CAAC;QAEnC;;WAEG;QACK,SAAI,GAAY,IAAI,CAAC;KAmC9B;IAjCC,MAAM;QACJ,MAAM,QAAQ,GAA0B;YACtC,KAAK,EAAE,YAAY;YACnB,MAAM,EAAE,QAAQ;YAChB,GAAG,EAAE,UAAU;YACf,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,UAAU;SACrB,CAAC;QAEF,MAAM,UAAU,GAA4B;YAC1C,KAAK,EAAE,YAAY;YACnB,MAAM,EAAE,QAAQ;YAChB,GAAG,EAAE,UAAU;YACf,OAAO,EAAE,eAAe;YACxB,MAAM,EAAE,cAAc;YACtB,MAAM,EAAE,cAAc;SACvB,CAAC;QAEF,MAAM,KAAK,GAAG;YACZ,OAAO,EAAE,aAAa;YACtB,aAAa,EAAE,KAAK;YACpB,GAAG,EAAE,eAAe,IAAI,CAAC,GAAG,GAAG;YAC/B,UAAU,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;YAChC,cAAc,EAAE,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC;YACxC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ;SACd,CAAC;QAE5B,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,KAAK;YAChB,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\ntype Gap = '1' | '2' | '3' | '4' | '5' | '6' | '8';\ntype Align = 'start' | 'center' | 'end' | 'stretch' | 'baseline';\ntype Justify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';\n\n/**\n * Inline layout component for horizontal inline-flex layouts with gap and optional wrapping.\n * Ideal for button groups, tags, pills, and other inline elements.\n *\n * @slot - Content to layout inline\n */\n@Component({\n  tag: 'af-inline',\n  styleUrl: 'af-inline.css',\n  shadow: true,\n})\nexport class AfInline {\n  /**\n   * Gap between items using space tokens (1-8).\n   * Maps to --space-1 through --space-8 (4px to 32px).\n   */\n  @Prop() gap: Gap = '2';\n\n  /**\n   * Align items on the cross axis.\n   */\n  @Prop() align: Align = 'center';\n\n  /**\n   * Justify content on the main axis.\n   */\n  @Prop() justify: Justify = 'start';\n\n  /**\n   * Whether items should wrap to the next line when they overflow.\n   */\n  @Prop() wrap: boolean = true;\n\n  render() {\n    const alignMap: Record<Align, string> = {\n      start: 'flex-start',\n      center: 'center',\n      end: 'flex-end',\n      stretch: 'stretch',\n      baseline: 'baseline',\n    };\n\n    const justifyMap: Record<Justify, string> = {\n      start: 'flex-start',\n      center: 'center',\n      end: 'flex-end',\n      between: 'space-between',\n      around: 'space-around',\n      evenly: 'space-evenly',\n    };\n\n    const style = {\n      display: 'inline-flex',\n      flexDirection: 'row',\n      gap: `var(--space-${this.gap})`,\n      alignItems: alignMap[this.align],\n      justifyContent: justifyMap[this.justify],\n      flexWrap: this.wrap ? 'wrap' : 'nowrap',\n    } as Record<string, string>;\n\n    return (\n      <Host style={style}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\n"]}

package/dist/collection/components/af-input/af-input.css

@@ -24,12 +24,12 @@
   font-weight: var(--font-weight-book, 500);
   font-size: 16px;
   line-height: 24px;
-  color: var(--forms-fields-label, var(--colour-brand-inkwell, #14343b));
+  color: var(--af-input-label, var(--af-typography-body-dark, #14343b));
   cursor: default;
 }
 
 .required {
-  color: var(--forms-fields-error, #be292a);
+  color: var(--af-input-error, var(--colour-error, #be292a));
   margin-left: 2px;
 }
 
@@ -44,7 +44,7 @@
   border: none;
   background: none;
   cursor: pointer;
-  color: var(--forms-fields-label, var(--colour-brand-inkwell, #14343b));
+  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));
   flex-shrink: 0;
 }
 
@@ -58,7 +58,7 @@
 }
 
 .info-icon:focus-visible {
-  outline: 2px solid var(--buttons-secondary-stroke, #14343b);
+  outline: 2px solid var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));
   outline-offset: 2px;
   border-radius: 4px;
 }
@@ -69,7 +69,7 @@
   font-weight: var(--font-weight-regular, 400);
   font-size: 16px;
   line-height: 24px;
-  color: var(--forms-fields-description, var(--colour-inkwell-400, #2b484f));
+  color: var(--af-input-description, var(--af-typography-body-default, #2b484f));
   margin: 0;
 }
 
@@ -79,8 +79,8 @@
   align-items: center;
   gap: 12px;
   padding: 12px 16px;
-  background: var(--forms-fields-bg-default, #ffffff);
-  border: 1px solid var(--forms-fields-stroke-default, #d0d6d8);
+  background: var(--af-input-bg, #ffffff);
+  border: 1px solid var(--af-input-border, var(--af-background-border-default, #d1ddda));
   border-radius: var(--radii-input, 8px);
   transition: all 0.15s ease;
   min-height: 48px;
@@ -89,27 +89,28 @@
 
 /* Hover state */
 .input-container.hovered {
-  background: var(--forms-fields-bg-hover, #f3f5f5);
+  background: var(--af-input-bg-hover, var(--af-background-base-hover, #f4f7f6));
+  border-color: var(--af-input-border-hover, var(--af-background-border-heavy, #c6d5d1));
 }
 
 /* Focus state */
 .input-container.focused {
-  background: var(--forms-fields-bg-default, #ffffff);
-  border-color: var(--forms-fields-stroke-active, var(--colour-brand-inkwell, #14343b));
+  background: var(--af-input-bg, #ffffff);
+  border-color: var(--af-input-border-active, var(--af-typography-body-dark, #14343b));
   box-shadow: 
-    0 0 0 4px var(--background-base, #ffffff), 
-    0 0 0 5px var(--buttons-secondary-stroke, #14343b);
+    0 0 0 4px var(--af-background-base, #ffffff), 
+    0 0 0 5px var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));
 }
 
 /* Error state */
 .input-container.error {
-  border-color: var(--forms-fields-stroke-error, #be292a);
+  border-color: var(--af-input-border-error, var(--colour-error, #be292a));
 }
 
 /* Disabled state */
 .input-container.disabled {
-  background: var(--forms-fields-bg-disabled, #e8ebeb);
-  border-color: var(--forms-fields-stroke-default, #d0d6d8);
+  background: var(--af-input-bg-disabled, var(--af-background-level-1, #e8eeed));
+  border-color: var(--af-input-border, var(--af-background-border-default, #d1ddda));
   cursor: not-allowed;
 }
 
@@ -121,7 +122,7 @@
   width: 24px;
   height: 24px;
   flex-shrink: 0;
-  color: var(--forms-fields-label, var(--colour-brand-inkwell, #14343b));
+  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));
 }
 
 .search-icon svg {
@@ -144,22 +145,22 @@
   font-weight: var(--font-weight-regular, 400);
   font-size: 16px;
   line-height: 24px;
-  color: var(--forms-fields-input, var(--colour-brand-inkwell, #14343b));
+  color: var(--af-input-text, var(--af-typography-body-dark, #14343b));
   outline: none;
 }
 
 .input::placeholder {
-  color: var(--forms-fields-placeholder, #60767b);
+  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));
   opacity: 1;
 }
 
 .input:disabled {
   cursor: not-allowed;
-  color: var(--forms-fields-placeholder, #60767b);
+  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));
 }
 
 .input:disabled::placeholder {
-  color: var(--forms-fields-placeholder, #60767b);
+  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));
 }
 
 /* Hide native browser styling for search inputs */
@@ -192,7 +193,7 @@
   border: none;
   background: none;
   cursor: pointer;
-  color: var(--forms-fields-label, var(--colour-brand-inkwell, #14343b));
+  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));
   flex-shrink: 0;
   opacity: 0.6;
   transition: opacity 0.15s ease;
@@ -208,7 +209,7 @@
 }
 
 .clear-button:focus-visible {
-  outline: 2px solid var(--buttons-secondary-stroke, #14343b);
+  outline: 2px solid var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));
   outline-offset: 2px;
   border-radius: 4px;
 }
@@ -227,7 +228,7 @@
   width: 24px;
   height: 24px;
   flex-shrink: 0;
-  color: var(--forms-fields-error, #be292a);
+  color: var(--af-input-error, var(--colour-error, #be292a));
 }
 
 .error-icon svg {
@@ -241,6 +242,5 @@
   font-weight: var(--font-weight-regular, 400);
   font-size: 16px;
   line-height: 24px;
-  color: var(--forms-fields-error, #be292a);
+  color: var(--af-input-error, var(--colour-error, #be292a));
 }
-

package/dist/collection/components/af-input/af-input.js

@@ -90,7 +90,7 @@ export class AfInput {
             'focused': this.isFocused,
             'hovered': this.isHovered && !this.disabled && !this.isFocused
         };
-        return (h(Host, { key: '5bf8980e12ad5fc3b8b84df3acc749bddf61042d' }, h("div", { key: 'd0266eca85871397ed73381ca3d36f3dc2dd79ce', class: wrapperClasses }, this.label && (h("div", { key: 'f9fc2fe3f52a1f9be1404943d91489357ea941dc', class: "label-row" }, h("label", { key: '76283a7f0c9be127aa8c9115fcbc26b2d67d51cc', class: "label", htmlFor: "input" }, this.label, this.required && h("span", { key: '6b0de23e857abfdd25d6eefaa6ff22f22fa813dd', class: "required" }, "*")), this.showInfoIcon && (h("button", { key: '7c5f7a47a8357301f3fe28d6078bdec3ec1160c3', type: "button", class: "info-icon", onClick: this.handleInfoClick, "aria-label": "More information" }, h("svg", { key: '655c9448589937c2047a58962f78ab1872e0da84', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '5066c29389ac8f9e1e27771f43a98f75f9b03634', d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '1993da070066d33575618267d6af5b13b641143b', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'dd99ac12d4a23b98c98fca1df34916968276fc0e', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("slot", { key: 'b406de5a455af79a69497c6a641b5c41347ee1ab', name: "label-end" }))), this.description && (h("p", { key: '0dcebb186df7055efb168f96ad4199e2f614a87c', class: "description" }, this.description)), h("div", { key: '754b8a3e67d5807d7d484d475d31913dee8004f4', class: inputContainerClasses, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, this.showSearchIcon && (h("span", { key: '5757962a3479a6cd1f12bd1da183919af69ad9f4', class: "search-icon" }, h("svg", { key: '4106175e5b41e4c978b38eda6db36799a6a6f762', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '1d54b9a8c682c9049e97b28143f0dcd90e068dee', d: "M11 19C15.4183 19 19 15.4183 19 11C19 6.58172 15.4183 3 11 3C6.58172 3 3 6.58172 3 11C3 15.4183 6.58172 19 11 19Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'd3ed0187abde8c14eae462612c918e10cb46916d', d: "M21 21L16.65 16.65", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("input", { key: 'fb7a551d44282686732b78865bab8720c5e08830', ref: (el) => this.inputEl = el ?? undefined, id: "input", class: "input", type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, required: this.required, readonly: this.readonly, autocomplete: this.autocomplete, maxlength: this.maxlength, minlength: this.minlength, pattern: this.pattern, "aria-invalid": hasError ? 'true' : undefined, "aria-describedby": hasError ? 'error-message' : this.description ? 'description' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur }), this.clearable && hasValue && !this.disabled && !this.readonly && (h("button", { key: '6ad41a3ee4ffdbeefa11e45754a22143b33405e5', type: "button", class: "clear-button", onClick: this.handleClear, "aria-label": "Clear input" }, h("svg", { key: '129f73660030e81ff17071fae51bb34af23eca57', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '78d4c71521ac7daced7023c5bcfb2bfccf593fab', d: "M18 6L6 18", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '4eb85452029e8347dd648dcc849fa000b41b7fea', d: "M6 6L18 18", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), hasError && (h("div", { key: 'cc3b6083e88bb99ec17edffbf95ec89e2bb27e97', class: "error-row", id: "error-message" }, h("span", { key: 'fe264a854aaebe481a6913275859ca57b1d61d0d', class: "error-icon" }, h("svg", { key: '1159f77b184d1888c5c5ebe6138070c66abb66e6', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '59975a202086127c2548843e842d33895d6ba1ff', d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '11c79f296c1dce73beebd67eeefe3d71b17ee191', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '9f146c96a38b14afb1919cf480224ee520ac16b0', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("span", { key: '2d326d0d72727dca4c4839fb5279323e556fbe04', class: "error-text" }, this.error))))));
+        return (h(Host, { key: '400a7886308cc6fdf7ba226480dc0971050fe809' }, h("div", { key: 'd241fd889b7974dedc5713c6a07b3d0ca34f8e00', class: wrapperClasses }, this.label && (h("div", { key: '05a49e0176eec70d8962d6a11f9a151cb7be97c0', class: "label-row" }, h("label", { key: '3cfdce5b0c1d5d2b8f086e5815d02b9c641f1b5f', class: "label", htmlFor: "input" }, this.label, this.required && h("span", { key: '500e7e6904ce5060bf39488058f0c57903954733', class: "required" }, "*")), this.showInfoIcon && (h("button", { key: '597bf0ec5edd0164a873c8fb378e00259b375707', type: "button", class: "info-icon", onClick: this.handleInfoClick, "aria-label": "More information" }, h("svg", { key: '4e1d799e58aefcf2997566402ab6dbd45fb3a317', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '742b68edb5d9fb322f6fa706f4e8ee7ed89ad304', d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'be9c43a114883b85bf67fe2df3b9cc0589fad04b', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '7a52e45ebf0b5c2a3d4d8fce1bc5f755375a82fa', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("slot", { key: '64ac646e64b8aed7f53bf520c04be4b1c9175a66', name: "label-end" }))), this.description && (h("p", { key: 'da26f8ed87f2565d8e91dd5e85c72a15d0d8a12a', class: "description" }, this.description)), h("div", { key: 'ad0274109fc614bcc8c4149705229bf73633e406', class: inputContainerClasses, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, this.showSearchIcon && (h("span", { key: '37fd67942ce8e7b3436131eaa3b39548d8a9ea84', class: "search-icon" }, h("svg", { key: '94087fd6095eea01b1e975cac92ecc636ff28f1a', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'bfe3ba50936b25bff5ae3c39758a99f3189e9c3d', d: "M11 19C15.4183 19 19 15.4183 19 11C19 6.58172 15.4183 3 11 3C6.58172 3 3 6.58172 3 11C3 15.4183 6.58172 19 11 19Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '02100f03ff7aa547b00f44cd4b28b3aad8daae69', d: "M21 21L16.65 16.65", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("input", { key: '4b8cebb727e5bb02d9d8ced50b465e95369c6b84', ref: (el) => this.inputEl = el ?? undefined, id: "input", class: "input", type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, required: this.required, readonly: this.readonly, autocomplete: this.autocomplete, maxlength: this.maxlength, minlength: this.minlength, pattern: this.pattern, "aria-invalid": hasError ? 'true' : undefined, "aria-describedby": hasError ? 'error-message' : this.description ? 'description' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur }), this.clearable && hasValue && !this.disabled && !this.readonly && (h("button", { key: 'a5293446b1164329ff14e679ba986311a1c5f586', type: "button", class: "clear-button", onClick: this.handleClear, "aria-label": "Clear input" }, h("svg", { key: '02f3854e7314476211ee532f42bc72dc0618c920', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '577fc3ec1b2083f18607f7b1120a3adfdd8d29d5', d: "M18 6L6 18", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '87bd9e583a12efa1c12d31316259af90ddf7e33d', d: "M6 6L18 18", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), hasError && (h("div", { key: 'abb797c9a006d2dfc62a40d2acd1d7c38ebd8487', class: "error-row", id: "error-message" }, h("span", { key: '87230aa50a9065d77ff6a723c48d08a4f06b72cb', class: "error-icon" }, h("svg", { key: 'c70ab9ce3225e446754a73502504cf2af35ac78d', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'd1c8bf0df150f15e0262e107ab6485f6af7bde75', d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '33bdff80da8e914db45146af10742618624306dd', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '1780ff18f1757e682c30ad69d7a16ac01dcf2979', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("span", { key: 'e3dca808bc53e8bd47a00b108147ee931c8535da', class: "error-text" }, this.error))))));
     }
     static get is() { return "af-input"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/af-logo/af-logo.css

@@ -1,6 +1,6 @@
 :host {
   display: inline-block;
-  color: var(--colour-brand-inkwell, #14343b);
+  color: var(--af-background-icon-default, var(--colour-brand-inkwell, #14343b));
 }
 
 .logo-svg {

package/dist/collection/components/af-logo/af-logo.js

@@ -4,7 +4,7 @@ import { h, Host } from "@stencil/core";
  */
 export class AfLogo {
     render() {
-        return (h(Host, { key: '6e315eac8e083807fb987237502d1bdaa06a579c' }, h("svg", { key: 'a837202d331f867eecd017d388d952cdbd09c0b0', class: "logo-svg", viewBox: "0 0 9290 1432", "aria-label": "Affinda", role: "img" }, h("path", { key: '425b4957d10c5427134caa67834ea5f306d23d14', fill: "currentColor", d: "M1691.17,452.11c-107.93-107.48-250.13-166.09-401.3-163.79h-739.51l-148.18,237.98h892.96c86.83,0,168.39,33.64,230.09,95.09,63.28,63.04,98.26,147.32,98.26,237.45,0,185.03-149.41,335.36-332.92,335.36H385.66c-82.44,0-149.59-67.64-149.59-150.68s67.32-151.75,149.41-154.23h810.17l152.93-237.98H381.44C171.21,656.62,0,832.45,0,1043.52s172.97,388.48,385.66,388.48h904.91c313.76,0,569.17-257.28,569.17-573.34,0-154.22-59.76-298.53-168.4-406.72l-.17.18Z" }), h("path", { key: '3dbe122502fce7882967a8a77a04b38e61a9d30f', fill: "currentColor", d: "M3265.12,353.81c-21.8-16.16-44.47-30.56-68.02-42.85-75.76-39.69-161-59.89-253.45-59.89-159.6,0-297.92,58.13-411.29,172.82-113.02,114.33-170.49,253.96-170.49,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.29,173.52,409.35,173.52,89.47,0,173.31-18.97,249.06-56.38,26.19-12.99,51.68-28.1,76.11-45.49v89.05h268.39V276.36h-268.39v77.45ZM3232.07,1013.47c-27.24,48.65-65.38,86.24-116.35,114.87-51.85,29.15-105.11,43.38-162.58,43.38s-107.92-14.05-157.31-43.21c-49.57-28.98-87.88-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.18-51.99,67.32-91.15,116.36-119.6,49.21-28.63,101.41-42.5,159.94-42.5,90.87,0,165.04,30.56,226.73,93.61,62.23,63.4,92.46,140.68,92.46,236.22,0,63.05-13.54,117.67-41.13,167.02l-.18.35Z" }), h("path", { key: 'e0f15cb4025c3fadcc740fc8f4b47e240f4497c3', fill: "currentColor", d: "M5569.92,278.96h-269.66v1143.74h269.66V278.96Z" }), h("path", { key: 'b7054c3fe019f0c42e8d56338c6034d9843a4a05', fill: "currentColor", d: "M6504.78,328.74c-68.7-45.4-148.11-68.37-235.78-68.37s-163.57,19.96-235.61,59.36c-21.61,11.84-42.69,25.44-63.07,40.81v-89.22h-270.22v1151.2h270.22v-436.03c0-154.94,8.78-223.14,15.81-252.11,15.64-61.13,47.44-110.95,96.81-152.65,47.96-40.28,100.49-59.89,160.58-59.89,51.13,0,89.96,11.13,118.95,34.28,28.81,22.79,48.14,58.13,59.56,109.18,4.56,18.37,12.12,70.14,12.12,211.83v545.57h270.21v-583.02c0-146.29-15.28-253.17-46.56-326.67-32.67-76.85-84.33-138.69-153.2-184.27h.18Z" }), h("path", { key: 'abb1e667124d30d807c41ab1cd446c4568990a18', fill: "currentColor", d: "M7728.49,355.19c-21.79-16.14-44.46-30.52-68.02-42.8-75.75-39.64-161-59.81-253.45-59.81-159.59,0-297.92,58.06-411.28,172.6-113.02,114.19-170.49,253.63-170.49,414.48s56.77,304.68,168.73,419.04c112.49,115.07,250.29,173.3,409.35,173.3,89.47,0,173.3-18.94,249.06-56.3,26.19-12.98,51.67-28.07,76.1-45.43v90.68h268.39V0h-268.39v355.37-.17ZM7695.45,1014.01c-27.24,48.59-65.38,86.13-116.36,114.72-51.85,29.11-104.93,43.32-162.58,43.32s-107.92-14.03-157.31-43.15c-49.56-28.94-87.88-68.76-117.58-121.38-29.88-52.97-44.29-106.64-44.29-164.18s14.41-111.73,43.94-164c29.17-51.92,67.32-91.03,116.35-119.45,49.22-28.59,101.42-42.45,159.95-42.45,90.87,0,165.04,30.52,226.73,93.49,62.22,63.32,92.45,140.5,92.45,235.92,0,62.97-13.53,117.52-41.12,166.81l-.18.35Z" }), h("path", { key: '8cd032a3cb346e1e2bf41b33a8c888d366a9c634', fill: "currentColor", d: "M9021.01,277.76v76.05c-21.79-16.16-44.47-30.56-68.02-42.85-75.75-39.69-161-59.89-253.45-59.89-159.59,0-297.92,58.13-411.29,172.82-113.01,114.33-170.48,253.96-170.48,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.28,173.52,409.35,173.52,89.46,0,173.3-18.97,249.06-56.38,26.19-12.99,51.67-28.1,76.1-45.49v89.05h268.39V277.76h-268.39ZM8987.97,1013.47c-27.25,48.65-65.39,86.24-116.36,114.87-51.85,29.15-105.1,43.38-162.58,43.38s-107.92-14.05-157.3-43.21c-49.57-28.98-87.89-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.17-51.99,67.31-91.15,116.35-119.6,49.22-28.63,101.42-42.5,159.95-42.5,90.87,0,165.04,30.56,226.73,93.61,62.22,63.4,92.45,140.68,92.45,236.22,0,63.05-13.53,117.67-41.13,167.02l-.17.35Z" }), h("path", { key: '3087e75a044032e2bf6ff1a49f78d18adb3a0688', fill: "currentColor", d: "M3927.32,519.82c0-140.11,112.99-241.01,251.96-241.01h302.69V0h-302.69c-284.39,0-515.59,233.28-515.59,519.82v902.88h263.81v-445.28h431.9v-265.98h-431.9v-191.62h-.18Z" }), h("path", { key: '3118ef825a1bc7640b1a49abddc5f0b6f1743bf0', fill: "currentColor", d: "M4745.61,519.82c0-140.11,112.99-241.01,251.95-241.01h302.7V0h-302.7c-284.38,0-515.59,233.28-515.59,519.82v902.88h263.82v-445.28h431.89v-265.98h-431.89v-191.62h-.18Z" }))));
+        return (h(Host, { key: 'df7fdd77101269480d619d9ba86275680079b32a' }, h("svg", { key: '96644e0b5cf18e589084ca1083718c7b6c4b9f17', class: "logo-svg", viewBox: "0 0 9290 1432", "aria-label": "Affinda", role: "img" }, h("path", { key: '954a70a6af7a9f98899b1093a9ec86bde3b69637', fill: "currentColor", d: "M1691.17,452.11c-107.93-107.48-250.13-166.09-401.3-163.79h-739.51l-148.18,237.98h892.96c86.83,0,168.39,33.64,230.09,95.09,63.28,63.04,98.26,147.32,98.26,237.45,0,185.03-149.41,335.36-332.92,335.36H385.66c-82.44,0-149.59-67.64-149.59-150.68s67.32-151.75,149.41-154.23h810.17l152.93-237.98H381.44C171.21,656.62,0,832.45,0,1043.52s172.97,388.48,385.66,388.48h904.91c313.76,0,569.17-257.28,569.17-573.34,0-154.22-59.76-298.53-168.4-406.72l-.17.18Z" }), h("path", { key: '97f720a0fbbf7b40f08fa96e4cec4020b723b19e', fill: "currentColor", d: "M3265.12,353.81c-21.8-16.16-44.47-30.56-68.02-42.85-75.76-39.69-161-59.89-253.45-59.89-159.6,0-297.92,58.13-411.29,172.82-113.02,114.33-170.49,253.96-170.49,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.29,173.52,409.35,173.52,89.47,0,173.31-18.97,249.06-56.38,26.19-12.99,51.68-28.1,76.11-45.49v89.05h268.39V276.36h-268.39v77.45ZM3232.07,1013.47c-27.24,48.65-65.38,86.24-116.35,114.87-51.85,29.15-105.11,43.38-162.58,43.38s-107.92-14.05-157.31-43.21c-49.57-28.98-87.88-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.18-51.99,67.32-91.15,116.36-119.6,49.21-28.63,101.41-42.5,159.94-42.5,90.87,0,165.04,30.56,226.73,93.61,62.23,63.4,92.46,140.68,92.46,236.22,0,63.05-13.54,117.67-41.13,167.02l-.18.35Z" }), h("path", { key: 'aca04016a8e4c386527296e8072d833a19ac64db', fill: "currentColor", d: "M5569.92,278.96h-269.66v1143.74h269.66V278.96Z" }), h("path", { key: '548ae27e683f7e40841b33e4b23f99d1cd35132e', fill: "currentColor", d: "M6504.78,328.74c-68.7-45.4-148.11-68.37-235.78-68.37s-163.57,19.96-235.61,59.36c-21.61,11.84-42.69,25.44-63.07,40.81v-89.22h-270.22v1151.2h270.22v-436.03c0-154.94,8.78-223.14,15.81-252.11,15.64-61.13,47.44-110.95,96.81-152.65,47.96-40.28,100.49-59.89,160.58-59.89,51.13,0,89.96,11.13,118.95,34.28,28.81,22.79,48.14,58.13,59.56,109.18,4.56,18.37,12.12,70.14,12.12,211.83v545.57h270.21v-583.02c0-146.29-15.28-253.17-46.56-326.67-32.67-76.85-84.33-138.69-153.2-184.27h.18Z" }), h("path", { key: '04bd2f2c3f4428a8705f31842226f1ee12876416', fill: "currentColor", d: "M7728.49,355.19c-21.79-16.14-44.46-30.52-68.02-42.8-75.75-39.64-161-59.81-253.45-59.81-159.59,0-297.92,58.06-411.28,172.6-113.02,114.19-170.49,253.63-170.49,414.48s56.77,304.68,168.73,419.04c112.49,115.07,250.29,173.3,409.35,173.3,89.47,0,173.3-18.94,249.06-56.3,26.19-12.98,51.67-28.07,76.1-45.43v90.68h268.39V0h-268.39v355.37-.17ZM7695.45,1014.01c-27.24,48.59-65.38,86.13-116.36,114.72-51.85,29.11-104.93,43.32-162.58,43.32s-107.92-14.03-157.31-43.15c-49.56-28.94-87.88-68.76-117.58-121.38-29.88-52.97-44.29-106.64-44.29-164.18s14.41-111.73,43.94-164c29.17-51.92,67.32-91.03,116.35-119.45,49.22-28.59,101.42-42.45,159.95-42.45,90.87,0,165.04,30.52,226.73,93.49,62.22,63.32,92.45,140.5,92.45,235.92,0,62.97-13.53,117.52-41.12,166.81l-.18.35Z" }), h("path", { key: '1fe70269b3db17a9c423f241d2cf4cbf073a54d4', fill: "currentColor", d: "M9021.01,277.76v76.05c-21.79-16.16-44.47-30.56-68.02-42.85-75.75-39.69-161-59.89-253.45-59.89-159.59,0-297.92,58.13-411.29,172.82-113.01,114.33-170.48,253.96-170.48,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.28,173.52,409.35,173.52,89.46,0,173.3-18.97,249.06-56.38,26.19-12.99,51.67-28.1,76.1-45.49v89.05h268.39V277.76h-268.39ZM8987.97,1013.47c-27.25,48.65-65.39,86.24-116.36,114.87-51.85,29.15-105.1,43.38-162.58,43.38s-107.92-14.05-157.3-43.21c-49.57-28.98-87.89-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.17-51.99,67.31-91.15,116.35-119.6,49.22-28.63,101.42-42.5,159.95-42.5,90.87,0,165.04,30.56,226.73,93.61,62.22,63.4,92.45,140.68,92.45,236.22,0,63.05-13.53,117.67-41.13,167.02l-.17.35Z" }), h("path", { key: 'a0ff5279153bd62d88d0bbca172159aef3ca96a3', fill: "currentColor", d: "M3927.32,519.82c0-140.11,112.99-241.01,251.96-241.01h302.69V0h-302.69c-284.39,0-515.59,233.28-515.59,519.82v902.88h263.81v-445.28h431.9v-265.98h-431.9v-191.62h-.18Z" }), h("path", { key: '23f6981ad2f37b47528985eb436eb4c18ba32c9f', fill: "currentColor", d: "M4745.61,519.82c0-140.11,112.99-241.01,251.95-241.01h302.7V0h-302.7c-284.38,0-515.59,233.28-515.59,519.82v902.88h263.82v-445.28h431.89v-265.98h-431.89v-191.62h-.18Z" }))));
     }
     static get is() { return "af-logo"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/af-logo-well/af-logo-well.js

@@ -4,7 +4,7 @@ import { h, Host } from "@stencil/core";
  */
 export class AfLogoWell {
     render() {
-        return (h(Host, { key: 'f64c4eb4974d71972365ba55c49b54bd1667d157' }, h("div", { key: '1192eb30a0dcb0426d15b23148f9f48b2ded06d4', class: "logo-well" }, h("slot", { key: 'f62638c5fab67512858baf0756c38ce45546dd0e' }))));
+        return (h(Host, { key: '88b751702096b45e12c8d9394e69b6a0abd2122b' }, h("div", { key: '3bbdff4a72c4491b8a75359d18d0609f22811696', class: "logo-well" }, h("slot", { key: '6173141ef408944cd4e2b87e6cb40096a1ba3c08' }))));
     }
     static get is() { return "af-logo-well"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/af-nav-accordion/af-nav-accordion.css

@@ -0,0 +1,21 @@
+:host {
+  display: block;
+  width: 100%;
+}
+
+.nav-accordion {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+
+/* Mobile breakpoint styling */
+:host(.breakpoint-mobile) .nav-accordion {
+  /* Mobile-specific styles */
+}
+
+/* Desktop breakpoint styling */
+:host(.breakpoint-desktop) .nav-accordion {
+  /* Desktop-specific styles if needed */
+}
+