@affinda/wc 0.0.12 → 0.0.14

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

@@ -0,0 +1,340 @@
+:host {
+  display: block;
+}
+
+.footer {
+  background-color: var(--colour-brand-inkwell, #14343b);
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+  padding: 64px 0 0;
+}
+
+.footer__container {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 0 24px;
+}
+
+/* Top section layout */
+.footer__top {
+  display: grid;
+  grid-template-columns: 380px 1fr;
+  gap: 48px;
+  padding-bottom: 48px;
+}
+
+/* Brand column (left side) */
+.footer__brand {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.footer__brand-card {
+  background-color: rgba(198, 213, 209, 0.08);
+  border-radius: 16px;
+  padding: 32px;
+}
+
+.footer__logo {
+  margin-bottom: 24px;
+}
+
+.footer__logo svg,
+.footer__logo img {
+  height: 32px;
+  width: auto;
+}
+
+.footer__social {
+  display: flex;
+  gap: 12px;
+}
+
+.footer__social-link {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 48px;
+  height: 48px;
+  border: 1px solid rgba(198, 213, 209, 0.3);
+  border-radius: 50%;
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+  transition: all 0.2s ease;
+}
+
+.footer__social-link:hover {
+  background-color: rgba(198, 213, 209, 0.1);
+  border-color: rgba(198, 213, 209, 0.5);
+}
+
+.footer__contact-card {
+  background-color: rgba(198, 213, 209, 0.08);
+  border-radius: 16px;
+  padding: 24px 32px;
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.footer__contact-item {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.footer__contact-label {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+  margin: 0;
+}
+
+.footer__contact-value {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  font-weight: 400;
+  color: rgba(198, 213, 209, 0.7);
+  margin: 0;
+}
+
+/* Navigation section (right side) */
+.footer__nav {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+.footer__nav-columns {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 32px;
+}
+
+.footer__nav-column {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.footer__nav-heading {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+  margin: 0;
+  text-transform: none;
+}
+
+.footer__nav-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.footer__nav-list li {
+  margin: 0;
+}
+
+.footer__nav-list a {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  font-weight: 400;
+  color: rgba(198, 213, 209, 0.7);
+  text-decoration: none;
+  transition: color 0.2s ease;
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.footer__nav-list a:hover {
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+}
+
+.footer__external-icon {
+  opacity: 0.7;
+  flex-shrink: 0;
+}
+
+/* Status indicator */
+.footer__status {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-top: 32px;
+  padding-top: 24px;
+  border-top: 1px solid rgba(198, 213, 209, 0.1);
+}
+
+.footer__status-dot {
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  flex-shrink: 0;
+}
+
+.footer__status-dot--operational {
+  background-color: #22c55e;
+}
+
+.footer__status-dot--issue {
+  background-color: #ef4444;
+}
+
+.footer__status-text {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  color: rgba(198, 213, 209, 0.7);
+}
+
+.footer__status-link {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+  text-decoration: underline;
+  text-underline-offset: 2px;
+  margin-left: 8px;
+}
+
+.footer__status-link:hover {
+  text-decoration: none;
+}
+
+/* Bottom section */
+.footer__bottom {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  gap: 24px;
+  padding: 24px 0;
+  border-top: 1px solid rgba(198, 213, 209, 0.1);
+  background-color: rgba(198, 213, 209, 0.05);
+  margin: 0 -24px;
+  padding-left: 24px;
+  padding-right: 24px;
+}
+
+.footer__copyright {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  color: rgba(198, 213, 209, 0.7);
+  margin: 0;
+}
+
+.footer__legal {
+  display: flex;
+  gap: 24px;
+}
+
+.footer__legal a {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  color: rgba(198, 213, 209, 0.7);
+  text-decoration: underline;
+  text-underline-offset: 2px;
+}
+
+.footer__legal a:hover {
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+  text-decoration: none;
+}
+
+.footer__badges {
+  display: flex;
+  gap: 16px;
+  align-items: center;
+}
+
+.footer__badge {
+  width: 48px;
+  height: 48px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.footer__badge svg {
+  width: 100%;
+  height: 100%;
+}
+
+/* Responsive styles */
+@media (max-width: 1024px) {
+  .footer__top {
+    grid-template-columns: 1fr;
+    gap: 48px;
+  }
+
+  .footer__brand {
+    flex-direction: row;
+    gap: 16px;
+  }
+
+  .footer__brand-card,
+  .footer__contact-card {
+    flex: 1;
+  }
+}
+
+@media (max-width: 768px) {
+  .footer {
+    padding: 48px 0 0;
+  }
+
+  .footer__top {
+    gap: 32px;
+  }
+
+  .footer__brand {
+    flex-direction: column;
+  }
+
+  .footer__nav-columns {
+    grid-template-columns: repeat(2, 1fr);
+    gap: 32px;
+  }
+
+  .footer__bottom {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 16px;
+  }
+
+  .footer__legal {
+    flex-wrap: wrap;
+    gap: 16px;
+  }
+}
+
+@media (max-width: 480px) {
+  .footer__container {
+    padding: 0 16px;
+  }
+
+  .footer__brand-card,
+  .footer__contact-card {
+    padding: 24px;
+  }
+
+  .footer__nav-columns {
+    grid-template-columns: 1fr;
+    gap: 24px;
+  }
+
+  .footer__bottom {
+    margin: 0 -16px;
+    padding-left: 16px;
+    padding-right: 16px;
+  }
+
+  .footer__badges {
+    width: 100%;
+    justify-content: flex-start;
+  }
+}
+

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

@@ -0,0 +1,140 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Footer component for marketing pages
+ * Provides a flexible, slot-based layout for footer content
+ * All content is passed via slots - no hardcoded links or content
+ */
+export class AfFooter {
+    constructor() {
+        /** Copyright text (e.g., "© 2025 Company Name. All rights reserved.") */
+        this.copyrightText = '';
+        /** Status message text */
+        this.statusText = '';
+        /** Status page URL */
+        this.statusUrl = '';
+        /** Whether systems are operational (shows green/red indicator) */
+        this.systemsOperational = true;
+        /** Whether to show the status indicator */
+        this.showStatus = true;
+    }
+    render() {
+        return (h(Host, { key: '37ff278a4e94d6a530143e49a7d2cd89bf4b2108' }, h("footer", { key: '1465dbc7c890329e248ee6f15b6082b63cc6d66f', class: "footer" }, h("div", { key: '5e1b29375b3f14c3ebe451e56f70d0726e9af0ae', class: "footer__container" }, h("div", { key: 'a36ec8ae9f0f211347b2ccdd47dbe45599eaf43c', class: "footer__top" }, h("div", { key: '3f749c08a7a0866748e5818156db2bf6c9fd2d8e', class: "footer__brand" }, h("div", { key: 'a71e240e851ec6348fa80eff89cb319f2126ae6f', class: "footer__brand-card" }, h("div", { key: '1e2b46f8bc10ad4be3b41a5545445ca421d93614', class: "footer__logo" }, h("slot", { key: '55a6b9f5181e3e19e91dc8bbf9d94283e2805d1b', name: "logo" })), h("div", { key: 'd0f58f0b8f8449b62f7fb9cb22dbf44d990c274c', class: "footer__social" }, h("slot", { key: '14995e1b89c281dcb618cc5044171dc5e770df78', name: "social" }))), h("div", { key: '9ee5c6a384a5915c7d25d5b7918737eb3aedd457', class: "footer__contact-card" }, h("slot", { key: '669c0f2dec223e8e964a117be3ed1f1b626284ea', name: "contact" }))), h("div", { key: 'e5c055d705f12e9f4389f6a5d342d594b20636b7', class: "footer__nav" }, h("div", { key: 'b8ba3f9e42996210094d6962888fd380645c83e0', class: "footer__nav-columns" }, h("slot", { key: 'be54e86e7a3dadcf9dd01006cbbca1124bcfb1df', name: "nav" })), this.showStatus && (h("div", { key: 'c949887c44f734c93c679a72aa07362fea9b939c', class: "footer__status" }, h("span", { key: '2d8e3df717e880ad71e8af9591699fee7b50e711', class: `footer__status-dot ${this.systemsOperational ? 'footer__status-dot--operational' : 'footer__status-dot--issue'}` }), h("span", { key: '743707f9b7750dc2312262028b2d6d0ca86f6e60', class: "footer__status-text" }, this.statusText), this.statusUrl && (h("a", { key: 'f667c9ecb73d4c17645afc24ad09c4b58fa0d265', href: this.statusUrl, target: "_blank", rel: "noopener noreferrer", class: "footer__status-link" }, "Learn more")))))), h("div", { key: '3935d821d1ccf1563de444e244802c500b7ba9db', class: "footer__bottom" }, this.copyrightText && (h("p", { key: '9bbf076b86d2d221a65f7f19e325a0f79fb42cd3', class: "footer__copyright" }, this.copyrightText)), h("div", { key: 'b671070b4274c1d0b8fdc21ad33b211ad8d37390', class: "footer__legal" }, h("slot", { key: '24338a5e5fea9b88352e47680ef18160f52e9ee2', name: "legal" })), h("div", { key: '772913b85cf9b1f2f93b649c01c11b71a27d64a4', class: "footer__badges" }, h("slot", { key: '9a40bc862ed3512ee94398da5ac0e754dbd33240', name: "badges" })))))));
+    }
+    static get is() { return "af-footer"; }
+    static get encapsulation() { return "scoped"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-footer.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-footer.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "copyrightText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Copyright text (e.g., \"\u00A9 2025 Company Name. All rights reserved.\")"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "copyright-text",
+                "defaultValue": "''"
+            },
+            "statusText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Status message text"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "status-text",
+                "defaultValue": "''"
+            },
+            "statusUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Status page URL"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "status-url",
+                "defaultValue": "''"
+            },
+            "systemsOperational": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether systems are operational (shows green/red indicator)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "systems-operational",
+                "defaultValue": "true"
+            },
+            "showStatus": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether to show the status indicator"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-status",
+                "defaultValue": "true"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-footer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"af-footer.js","sourceRoot":"","sources":["../../../src/components/af-footer/af-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;;GAIG;AAOH,MAAM,OAAO,QAAQ;IANrB;QAOE,yEAAyE;QACjE,kBAAa,GAAW,EAAE,CAAC;QAEnC,0BAA0B;QAClB,eAAU,GAAW,EAAE,CAAC;QAEhC,sBAAsB;QACd,cAAS,GAAW,EAAE,CAAC;QAE/B,kEAAkE;QAC1D,uBAAkB,GAAY,IAAI,CAAC;QAE3C,2CAA2C;QACnC,eAAU,GAAY,IAAI,CAAC;KAmEpC;IAjEC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,+DAAQ,KAAK,EAAC,QAAQ;gBACpB,4DAAK,KAAK,EAAC,mBAAmB;oBAE5B,4DAAK,KAAK,EAAC,aAAa;wBAEtB,4DAAK,KAAK,EAAC,eAAe;4BACxB,4DAAK,KAAK,EAAC,oBAAoB;gCAC7B,4DAAK,KAAK,EAAC,cAAc;oCACvB,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACrB;gCACN,4DAAK,KAAK,EAAC,gBAAgB;oCACzB,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF;4BAEN,4DAAK,KAAK,EAAC,sBAAsB;gCAC/B,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF;wBAGN,4DAAK,KAAK,EAAC,aAAa;4BACtB,4DAAK,KAAK,EAAC,qBAAqB;gCAC9B,6DAAM,IAAI,EAAC,KAAK,GAAQ,CACpB;4BAGL,IAAI,CAAC,UAAU,IAAI,CAClB,4DAAK,KAAK,EAAC,gBAAgB;gCACzB,6DAAM,KAAK,EAAE,sBAAsB,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,iCAAiC,CAAC,CAAC,CAAC,2BAA2B,EAAE,GAAS;gCACvI,6DAAM,KAAK,EAAC,qBAAqB,IAC9B,IAAI,CAAC,UAAU,CACX;gCACN,IAAI,CAAC,SAAS,IAAI,CACjB,0DAAG,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAAC,KAAK,EAAC,qBAAqB,iBAE1F,CACL,CACG,CACP,CACG,CACF;oBAGN,4DAAK,KAAK,EAAC,gBAAgB;wBACxB,IAAI,CAAC,aAAa,IAAI,CACrB,0DAAG,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,aAAa,CAAK,CACtD;wBAED,4DAAK,KAAK,EAAC,eAAe;4BACxB,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB;wBAEN,4DAAK,KAAK,EAAC,gBAAgB;4BACzB,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACF,CACC,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Footer component for marketing pages\n * Provides a flexible, slot-based layout for footer content\n * All content is passed via slots - no hardcoded links or content\n */\n@Component({\n  tag: 'af-footer',\n  styleUrl: 'af-footer.css',\n  shadow: false,\n  scoped: true,\n})\nexport class AfFooter {\n  /** Copyright text (e.g., \"© 2025 Company Name. All rights reserved.\") */\n  @Prop() copyrightText: string = '';\n\n  /** Status message text */\n  @Prop() statusText: string = '';\n\n  /** Status page URL */\n  @Prop() statusUrl: string = '';\n\n  /** Whether systems are operational (shows green/red indicator) */\n  @Prop() systemsOperational: boolean = true;\n\n  /** Whether to show the status indicator */\n  @Prop() showStatus: boolean = true;\n\n  render() {\n    return (\n      <Host>\n        <footer class=\"footer\">\n          <div class=\"footer__container\">\n            {/* Top section */}\n            <div class=\"footer__top\">\n              {/* Left column - Brand area */}\n              <div class=\"footer__brand\">\n                <div class=\"footer__brand-card\">\n                  <div class=\"footer__logo\">\n                    <slot name=\"logo\"></slot>\n                  </div>\n                  <div class=\"footer__social\">\n                    <slot name=\"social\"></slot>\n                  </div>\n                </div>\n\n                <div class=\"footer__contact-card\">\n                  <slot name=\"contact\"></slot>\n                </div>\n              </div>\n\n              {/* Right section - Navigation columns */}\n              <div class=\"footer__nav\">\n                <div class=\"footer__nav-columns\">\n                  <slot name=\"nav\"></slot>\n                </div>\n\n                {/* Status indicator */}\n                {this.showStatus && (\n                  <div class=\"footer__status\">\n                    <span class={`footer__status-dot ${this.systemsOperational ? 'footer__status-dot--operational' : 'footer__status-dot--issue'}`}></span>\n                    <span class=\"footer__status-text\">\n                      {this.statusText}\n                    </span>\n                    {this.statusUrl && (\n                      <a href={this.statusUrl} target=\"_blank\" rel=\"noopener noreferrer\" class=\"footer__status-link\">\n                        Learn more\n                      </a>\n                    )}\n                  </div>\n                )}\n              </div>\n            </div>\n\n            {/* Bottom section */}\n            <div class=\"footer__bottom\">\n              {this.copyrightText && (\n                <p class=\"footer__copyright\">{this.copyrightText}</p>\n              )}\n              \n              <div class=\"footer__legal\">\n                <slot name=\"legal\"></slot>\n              </div>\n\n              <div class=\"footer__badges\">\n                <slot name=\"badges\"></slot>\n              </div>\n            </div>\n          </div>\n        </footer>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/af-footer-column/af-footer-column.css

@@ -0,0 +1,32 @@
+:host {
+  display: block;
+}
+
+.footer-column {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.footer-column__heading {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+  margin: 0;
+  text-transform: none;
+}
+
+.footer-column__list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.footer-column__list ::slotted(li) {
+  margin: 0;
+}
+

package/dist/collection/components/af-footer-column/af-footer-column.js

@@ -0,0 +1,51 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Footer navigation column component
+ * Used within af-footer to create navigation link groups
+ */
+export class AfFooterColumn {
+    constructor() {
+        /** Column heading */
+        this.heading = '';
+    }
+    render() {
+        return (h(Host, { key: '8ba73f2f7a90d6a6b7ee33a04d4533b750624256' }, h("div", { key: '5b3f50b63fd0461d64dca4c7a6cbb6ee94ab98f6', class: "footer-column" }, this.heading && (h("h5", { key: '3583cd3ef323471dd2a106281e1522bba5e8dec6', class: "footer-column__heading" }, this.heading)), h("ul", { key: '35334470d9c1fd1832d52169a757a2d5a11cab10', class: "footer-column__list" }, h("slot", { key: 'e37bd4e38617d11fe8bbf931f71d0ff71123770c' })))));
+    }
+    static get is() { return "af-footer-column"; }
+    static get encapsulation() { return "scoped"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-footer-column.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-footer-column.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "heading": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Column heading"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "heading",
+                "defaultValue": "''"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-footer-column.js.map

package/dist/collection/components/af-footer-column/af-footer-column.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-footer-column.js","sourceRoot":"","sources":["../../../src/components/af-footer-column/af-footer-column.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;GAGG;AAOH,MAAM,OAAO,cAAc;IAN3B;QAOE,qBAAqB;QACb,YAAO,GAAW,EAAE,CAAC;KAgB9B;IAdC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,eAAe;gBACvB,IAAI,CAAC,OAAO,IAAI,CACf,2DAAI,KAAK,EAAC,wBAAwB,IAAE,IAAI,CAAC,OAAO,CAAM,CACvD;gBACD,2DAAI,KAAK,EAAC,qBAAqB;oBAC7B,8DAAa,CACV,CACD,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Footer navigation column component\n * Used within af-footer to create navigation link groups\n */\n@Component({\n  tag: 'af-footer-column',\n  styleUrl: 'af-footer-column.css',\n  shadow: false,\n  scoped: true,\n})\nexport class AfFooterColumn {\n  /** Column heading */\n  @Prop() heading: string = '';\n\n  render() {\n    return (\n      <Host>\n        <div class=\"footer-column\">\n          {this.heading && (\n            <h5 class=\"footer-column__heading\">{this.heading}</h5>\n          )}\n          <ul class=\"footer-column__list\">\n            <slot></slot>\n          </ul>\n        </div>\n      </Host>\n    );\n  }\n}\n\n"]}

package/dist/collection/components/af-footer-link/af-footer-link.css

@@ -0,0 +1,30 @@
+:host {
+  display: contents;
+}
+
+li {
+  margin: 0;
+  list-style: none;
+}
+
+.footer-link {
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-size: 14px;
+  font-weight: 400;
+  color: rgba(198, 213, 209, 0.7);
+  text-decoration: none;
+  transition: color 0.2s ease;
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.footer-link:hover {
+  color: var(--colour-tints-mistGreen-200, #C6D5D1);
+}
+
+.footer-link__external-icon {
+  opacity: 0.7;
+  flex-shrink: 0;
+}
+

package/dist/collection/components/af-footer-link/af-footer-link.js

@@ -0,0 +1,73 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Footer link component
+ * Styled link for use in footer navigation columns
+ */
+export class AfFooterLink {
+    constructor() {
+        /** Link URL */
+        this.href = '#';
+        /** Whether this is an external link (opens in new tab) */
+        this.external = false;
+    }
+    render() {
+        return (h(Host, { key: 'e6f7a589242a219d1b6378fd253972c760443500' }, h("li", { key: '335bfe5438a894bd61de90b79d3ab22d0fc89900' }, h("a", { key: 'f409bdcd2f5cc5ab98a3e63917c46406af0d5305', href: this.href, class: "footer-link", target: this.external ? '_blank' : undefined, rel: this.external ? 'noopener noreferrer' : undefined }, h("slot", { key: '8b511b8adf25e0a930186cc6276ffa4bebda0fc1' }), this.external && (h("svg", { key: '53a643543ad59dce128eec87b02d0397305522e2', class: "footer-link__external-icon", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: '0e20bfbaaaf254a98aca18375442a11c4d2719d3', d: "M10 6.5v3a1 1 0 0 1-1 1H2.5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3M7.5 1.5h3v3M5.5 6.5l5-5", stroke: "currentColor", "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
+    }
+    static get is() { return "af-footer-link"; }
+    static get encapsulation() { return "scoped"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-footer-link.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-footer-link.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "href": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Link URL"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "href",
+                "defaultValue": "'#'"
+            },
+            "external": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether this is an external link (opens in new tab)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "external",
+                "defaultValue": "false"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-footer-link.js.map

package/dist/collection/components/af-footer-link/af-footer-link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-footer-link.js","sourceRoot":"","sources":["../../../src/components/af-footer-link/af-footer-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;GAGG;AAOH,MAAM,OAAO,YAAY;IANzB;QAOE,eAAe;QACP,SAAI,GAAW,GAAG,CAAC;QAE3B,0DAA0D;QAClD,aAAQ,GAAY,KAAK,CAAC;KAuBnC;IArBC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH;gBACE,0DACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAC,aAAa,EACnB,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC5C,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS;oBAEtD,8DAAa;oBACZ,IAAI,CAAC,QAAQ,IAAI,CAChB,4DAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM;wBAC5F,6DAAM,CAAC,EAAC,qFAAqF,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE,CACnL,CACP,CACC,CACD,CACA,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Footer link component\n * Styled link for use in footer navigation columns\n */\n@Component({\n  tag: 'af-footer-link',\n  styleUrl: 'af-footer-link.css',\n  shadow: false,\n  scoped: true,\n})\nexport class AfFooterLink {\n  /** Link URL */\n  @Prop() href: string = '#';\n\n  /** Whether this is an external link (opens in new tab) */\n  @Prop() external: boolean = false;\n\n  render() {\n    return (\n      <Host>\n        <li>\n          <a \n            href={this.href} \n            class=\"footer-link\"\n            target={this.external ? '_blank' : undefined}\n            rel={this.external ? 'noopener noreferrer' : undefined}\n          >\n            <slot></slot>\n            {this.external && (\n              <svg class=\"footer-link__external-icon\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\">\n                <path d=\"M10 6.5v3a1 1 0 0 1-1 1H2.5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3M7.5 1.5h3v3M5.5 6.5l5-5\" stroke=\"currentColor\" stroke-width=\"1.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n              </svg>\n            )}\n          </a>\n        </li>\n      </Host>\n    );\n  }\n}\n\n"]}