@affinda/wc 0.0.16 → 0.0.18

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

@@ -0,0 +1,104 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Divider component for visual separation between content.
+ * Supports horizontal and vertical orientations with theme-aware styling.
+ */
+export class AfDivider {
+    constructor() {
+        /**
+         * Orientation of the divider.
+         */
+        this.orientation = 'horizontal';
+        /**
+         * Spacing (margin) around the divider using space tokens.
+         * For horizontal: margin-top and margin-bottom
+         * For vertical: margin-left and margin-right
+         */
+        this.spacing = '4';
+    }
+    render() {
+        const isVertical = this.orientation === 'vertical';
+        const spacingValue = this.spacing === 'none' ? '0' : `var(--space-${this.spacing})`;
+        const style = isVertical
+            ? {
+                marginLeft: spacingValue,
+                marginRight: spacingValue,
+            }
+            : {
+                marginTop: spacingValue,
+                marginBottom: spacingValue,
+            };
+        return (h(Host, { key: '4accfc3bacd7851849d58807bd0713704be3f43a', class: {
+                'divider': true,
+                'divider--horizontal': !isVertical,
+                'divider--vertical': isVertical,
+            }, style: style, role: "separator", "aria-orientation": this.orientation }));
+    }
+    static get is() { return "af-divider"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-divider.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-divider.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "orientation": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Orientation",
+                    "resolved": "\"horizontal\" | \"vertical\"",
+                    "references": {
+                        "Orientation": {
+                            "location": "global",
+                            "id": "global::Orientation"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Orientation of the divider."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "orientation",
+                "defaultValue": "'horizontal'"
+            },
+            "spacing": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Spacing",
+                    "resolved": "\"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"8\" | \"none\"",
+                    "references": {
+                        "Spacing": {
+                            "location": "global",
+                            "id": "global::Spacing"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Spacing (margin) around the divider using space tokens.\nFor horizontal: margin-top and margin-bottom\nFor vertical: margin-left and margin-right"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "spacing",
+                "defaultValue": "'4'"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-divider.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"af-divider.js","sourceRoot":"","sources":["../../../src/components/af-divider/af-divider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD;;;GAGG;AAMH,MAAM,OAAO,SAAS;IALtB;QAME;;WAEG;QACK,gBAAW,GAAgB,YAAY,CAAC;QAEhD;;;;WAIG;QACK,YAAO,GAAY,GAAG,CAAC;KA6BhC;IA3BC,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW,KAAK,UAAU,CAAC;QACnD,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,eAAe,IAAI,CAAC,OAAO,GAAG,CAAC;QAEpF,MAAM,KAAK,GAA2B,UAAU;YAC9C,CAAC,CAAC;gBACE,UAAU,EAAE,YAAY;gBACxB,WAAW,EAAE,YAAY;aAC1B;YACH,CAAC,CAAC;gBACE,SAAS,EAAE,YAAY;gBACvB,YAAY,EAAE,YAAY;aAC3B,CAAC;QAEN,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,qBAAqB,EAAE,CAAC,UAAU;gBAClC,mBAAmB,EAAE,UAAU;aAChC,EACD,KAAK,EAAE,KAAK,EACZ,IAAI,EAAC,WAAW,sBACE,IAAI,CAAC,WAAW,GAC5B,CACT,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\ntype Orientation = 'horizontal' | 'vertical';\ntype Spacing = 'none' | '1' | '2' | '3' | '4' | '5' | '6' | '8';\n\n/**\n * Divider component for visual separation between content.\n * Supports horizontal and vertical orientations with theme-aware styling.\n */\n@Component({\n  tag: 'af-divider',\n  styleUrl: 'af-divider.css',\n  shadow: true,\n})\nexport class AfDivider {\n  /**\n   * Orientation of the divider.\n   */\n  @Prop() orientation: Orientation = 'horizontal';\n\n  /**\n   * Spacing (margin) around the divider using space tokens.\n   * For horizontal: margin-top and margin-bottom\n   * For vertical: margin-left and margin-right\n   */\n  @Prop() spacing: Spacing = '4';\n\n  render() {\n    const isVertical = this.orientation === 'vertical';\n    const spacingValue = this.spacing === 'none' ? '0' : `var(--space-${this.spacing})`;\n\n    const style: Record<string, string> = isVertical\n      ? {\n          marginLeft: spacingValue,\n          marginRight: spacingValue,\n        }\n      : {\n          marginTop: spacingValue,\n          marginBottom: spacingValue,\n        };\n\n    return (\n      <Host\n        class={{\n          'divider': true,\n          'divider--horizontal': !isVertical,\n          'divider--vertical': isVertical,\n        }}\n        style={style}\n        role=\"separator\"\n        aria-orientation={this.orientation}\n      ></Host>\n    );\n  }\n}\n\n"]}

package/dist/collection/components/af-feature-accordion/af-feature-accordion.js

@@ -98,13 +98,13 @@ export class AfFeatureAccordion {
     render() {
         const items = this.getItems();
         const currentItem = items[this.expandedIndex];
-        return (h(Host, { key: '8285d5116d64b9f02d758fa8e0ecb8c4129636d0' }, h("div", { key: '53894f00e6ba9a9900fa63fe199e4448d21e8886', class: "feature-accordion" }, h("div", { key: 'e50c879453d39367bd88e02cc5756a59292b7b71', class: "feature-accordion__container" }, h("h2", { key: 'd2c797f6d1feddafd01b2b933e73e3d71063ae1d', class: "feature-accordion__heading" }, this.heading), h("div", { key: '48ba662a3cd7ab981fd947c4063f81e6ef94773f', class: "feature-accordion__content" }, h("div", { key: '05b190936f6c4a9e849de1b724a577dbf33aba12', class: "feature-accordion__list" }, items.map((item, index) => (h("div", { class: {
+        return (h(Host, { key: '7dea35d43a55761d3e36564de53886910cf43269' }, h("div", { key: 'f53d9194b7b3e0ca17f3507cae98af2f70d694f4', class: "feature-accordion" }, h("div", { key: 'f0f3ae26b637c86a754f536a45c30d2538d6f189', class: "feature-accordion__container" }, h("h2", { key: '5572067284f6d8c14b9b78104a7d89cc562319d7', class: "feature-accordion__heading" }, this.heading), h("div", { key: '953eb50fc040115ef17e2668362526e5c5aa20c2', class: "feature-accordion__content" }, h("div", { key: '035699b851f330d0b61c86f3e06aca2d6a2eb8ce', class: "feature-accordion__list" }, items.map((item, index) => (h("div", { class: {
                 'accordion-item': true,
                 'accordion-item--expanded': this.expandedIndex === index
             }, key: index }, h("button", { class: "accordion-item__header", onClick: () => this.handleItemClick(index), "aria-expanded": this.expandedIndex === index ? 'true' : 'false' }, h("h4", { class: "accordion-item__title" }, item.title), h("span", { class: "accordion-item__icon" }, this.expandedIndex === index ? (h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M5 12H19", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" }))) : (h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M12 5V19M5 12H19", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" }))))), h("div", { class: "accordion-item__content", style: {
                 maxHeight: this.expandedIndex === index ? '200px' : '0',
                 opacity: this.expandedIndex === index ? '1' : '0'
-            } }, h("p", { class: "accordion-item__description" }, item.description), this.expandedIndex === index && this.autoCycle && (h("div", { class: "accordion-item__timer-track" }, h("div", { class: "accordion-item__timer-progress", style: { width: `${this.timerProgress}%` } })))))))), h("div", { key: '34a3497894ab6aa63acafa62cc8a7029848731e8', class: "feature-accordion__image-container" }, h("div", { key: '3a60c7ffb55e49194d2d3dfb9a324382f1bd2e6a', class: "feature-accordion__image-wrapper" }, currentItem?.imageUrl && (h("img", { key: '1120770253d6442130baea4e74deae1694a36bf7', src: currentItem.imageUrl, alt: currentItem.imageAlt || currentItem.title, class: "feature-accordion__image" })), !currentItem?.imageUrl && (h("div", { key: '50a4b4201d0141f018d7e9ce2e03e2cfc090e2fc', class: "feature-accordion__image-placeholder" }, h("slot", { key: '2d029a56bc680d3f40be5c18841a5477de9c3862', name: "image" }))))))))));
+            } }, h("p", { class: "accordion-item__description" }, item.description), this.expandedIndex === index && this.autoCycle && (h("div", { class: "accordion-item__timer-track" }, h("div", { class: "accordion-item__timer-progress", style: { width: `${this.timerProgress}%` } })))))))), h("div", { key: '60b8b8c12647e3c0d49c61a260a69354ed7e529f', class: "feature-accordion__image-container" }, h("div", { key: '2f916ff6544cb4574e887b4a4155f2aaf83343c1', class: "feature-accordion__image-wrapper" }, currentItem?.imageUrl && (h("img", { key: '53db01fe2689049546729652973eb2c6246c01aa', src: currentItem.imageUrl, alt: currentItem.imageAlt || currentItem.title, class: "feature-accordion__image" })), !currentItem?.imageUrl && (h("div", { key: 'f79c210e398ccb423a48a40afee74d295117a42a', class: "feature-accordion__image-placeholder" }, h("slot", { key: '1fa843fb1b02413dc831023cb9957c96e0a4fa15', name: "image" }))))))))));
     }
     static get is() { return "af-feature-accordion"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-feature-grid/af-feature-grid.js

@@ -82,7 +82,7 @@ export class AfFeatureGrid {
             [`feature-grid--mobile-${this.mobileLayout}`]: true,
         };
         const showProgressLine = this.mobileLayout === 'scroll';
-        return (h(Host, { key: '9f86e8111e73d046e6e391d54781972ca0c1a78a' }, h("div", { key: '409d9c22be533612e2f079f38bc613e3a1f35fe2', class: gridClasses }, h("div", { key: '18261ef9c3dab6b7dfc5c947fd0b21712f1e6416', class: "feature-grid__cards" }, h("slot", { key: '9f90257092482cce17c374813116bf5ea6338401' })), showProgressLine && (h("div", { key: '208800f5dfe5d944f9bc4198fbe656696471ce21', class: "feature-grid__progress" }, h("af-progress-line", { key: 'c95b717d018803c4f56a9066bf7aa869c01cb1aa', progress: this.scrollProgress }))))));
+        return (h(Host, { key: '143cda464ef9d63cf4a4190fed2ec938438a6e2f' }, h("div", { key: '602a26836a596570c5ed3bc0679158718c32f125', class: gridClasses }, h("div", { key: '5844b5a699d3be238730c4b94012048a6c5a2b72', class: "feature-grid__cards" }, h("slot", { key: '8447309016d09376256c066f7f732a938066d8cf' })), showProgressLine && (h("div", { key: '7c798167883b9e231bbca9e124515ec418459dd5', class: "feature-grid__progress" }, h("af-progress-line", { key: '3e321ef9f01dc390156e51efcad4d988fc144fad', progress: this.scrollProgress }))))));
     }
     static get is() { return "af-feature-grid"; }
     static get encapsulation() { return "scoped"; }

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

@@ -24,7 +24,8 @@
   font-size: var(--font-size-heading-5-desktop, 20px);
   line-height: var(--line-height-heading-relaxed, 1.2);
   letter-spacing: var(--letter-spacing-heading, -0.02em);
-  color: var(--colour-typography-heading-primary, var(--colour-brand-inkwell, #14343b));
+  /* Inherit color from theme context via CSS custom property */
+  color: var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));
   padding: 0;
   margin: 0 0 12px 0;
   width: 100%;

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

@@ -28,7 +28,7 @@ export class AfFieldset {
             'items': true,
             [`orientation-${this.orientation}`]: true
         };
-        return (h(Host, { key: '367a58328f883d5df31989021ad7dba14ed3ab6c' }, h("fieldset", { key: 'f43a04b8808db04886a0997b42593af2445b185d', class: fieldsetClasses, disabled: this.disabled }, this.legend && (h("legend", { key: 'fc08d5e1464ffeb00005fda04169ceb2654a00b8', class: "legend" }, this.legend)), h("div", { key: '815f2dc77dc417791e1a3d736e1b0ce91250a325', class: itemsClasses }, h("slot", { key: 'd080ec923b57a3ae95cc868be6bf42b57df08e7a' })))));
+        return (h(Host, { key: '60d884edafad36deb7c25a515523fcab744f8406' }, h("fieldset", { key: '252f9bda68649344d71938d40bdaa187bb5f5448', class: fieldsetClasses, disabled: this.disabled }, this.legend && (h("legend", { key: '09281657368ccdcc2f8773d08cb875316dc04a33', class: "legend" }, this.legend)), h("div", { key: '35b7536fc7c751d101119021bd31b59f19e76e9b', class: itemsClasses }, h("slot", { key: 'd278bfdc67820471928fafd8b5ba9127332db935' })))));
     }
     static get is() { return "af-fieldset"; }
     static get encapsulation() { return "shadow"; }

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

@@ -18,7 +18,7 @@ export class AfFooter {
         this.showStatus = true;
     }
     render() {
-        return (h(Host, { key: '58d15bfa72370f9d72767081d7d821ce7e5cfcad' }, h("footer", { key: 'f53cc2cb44f334bc6709344d11663bbc8facbde4', class: "footer" }, h("div", { key: 'ad17b47d33fad7fea79fee647817ee8dceade8b8', class: "footer__container" }, h("div", { key: '24bf87ec90f567b260fdc3bd7f70c76fc72789bc', class: "footer__top" }, h("div", { key: '272bbb94a4d889579b9991c016165a7376559024', class: "footer__brand" }, h("div", { key: 'f1a892dab1d6ce935451978ae4584dfd0d50bca4', class: "footer__brand-card" }, h("div", { key: '15818798cdfd09873836e109472556a224a40f56', class: "footer__logo" }, h("slot", { key: 'd753c7044f3870ec66cf37da700cc2bf2aceda2c', name: "logo" })), h("div", { key: '2660af6bab2666242dfffe25dc81e050693d024e', class: "footer__social" }, h("slot", { key: '76dd64ed787aaa4698ca3687673b32899ed4a6a2', name: "social" }))), h("div", { key: '71c365eae2e2f2748cf42978179a1047d51dd391', class: "footer__contact-card" }, h("slot", { key: 'df48c5734759ac12a8ef398cf5002c793f02a309', name: "contact" }))), h("div", { key: 'b78002e34cc197ab9157697c48eeded05a3acdcd', class: "footer__nav" }, h("div", { key: '715717dd80882654ca91ccaf5474953b827f08a3', class: "footer__nav-columns" }, h("slot", { key: '062c88854fbd11d4c007e7daf166828db8db2131', name: "nav" })), this.showStatus && (h("div", { key: '39cd615cff666e79f0ed91ef90f6ad414f89addd', class: "footer__status" }, h("span", { key: '8396b890dc62b5f65c9ba5eaff2db72b83709a2a', class: `footer__status-dot ${this.systemsOperational ? 'footer__status-dot--operational' : 'footer__status-dot--issue'}` }), h("span", { key: '5266b10f2e2e8129425cd61acd0865cc6be38ec0', class: "footer__status-text" }, this.statusText), this.statusUrl && (h("a", { key: 'c4e999a03cbb89eaaaae079250c9eda8756ca8d6', href: this.statusUrl, target: "_blank", rel: "noopener noreferrer", class: "footer__status-link" }, "Learn more")))))), h("div", { key: '354acdb5d3442c876affc6e44c0e3541a27ff06f', class: "footer__bottom" }, this.copyrightText && (h("p", { key: '677a8291f263b026a01855422fc08ddd7fb69b89', class: "footer__copyright" }, this.copyrightText)), h("div", { key: '46b34f1634c53ff716c53ee575e1894c60b056e8', class: "footer__legal" }, h("slot", { key: 'f7ed01d5374e9c7d627ccf47413f62f7ab049ae7', name: "legal" })), h("div", { key: 'db6a6911e45c9c50e2c53d21e4aab25d3aa331f7', class: "footer__badges" }, h("slot", { key: '1fa6134c03aac63734592e4325663a1e91f92f02', name: "badges" })))))));
+        return (h(Host, { key: 'cb150b784dd5bf43eca9b014d2f1cffd6ce9ae66' }, h("footer", { key: 'd625ee7e4ababf20b4629e192350f9f721ec8399', class: "footer" }, h("div", { key: '1378e675a4894ea1ba000927e5c6fc72985700ae', class: "footer__container" }, h("div", { key: '7a250ef4b2dce3019e26cc9d6b04397754a374ea', class: "footer__top" }, h("div", { key: '6abf819fff33c52a70a3b7b92388213c07f13647', class: "footer__brand" }, h("div", { key: '05cb8a0de6df6792e08fecb34ff8b07a6f6e7f51', class: "footer__brand-card" }, h("div", { key: '52ac66df35016dcc4a93a7684c6b6a99a96c6227', class: "footer__logo" }, h("slot", { key: '87918d5e37c324d4b8ea31a6405f03ae540e4d6e', name: "logo" })), h("div", { key: '55e6a3cc404da02b19f7ce1bc1f90d1dbf5b5549', class: "footer__social" }, h("slot", { key: 'b28bf973a05b7a8ef1c26956b1ea1a3f7e07de5a', name: "social" }))), h("div", { key: '84192d593a0a7fe2592975fcbecf7e35e81b49af', class: "footer__contact-card" }, h("slot", { key: '8bb25d9ab4a3659b2f171b706268796f79361c19', name: "contact" }))), h("div", { key: '7d734e6f509999419a0bbf716b224c322bfef234', class: "footer__nav" }, h("div", { key: '406da5392a399a4d1c1e98889a01cc8c8fc3f18a', class: "footer__nav-columns" }, h("slot", { key: 'bf422aeca3942072261b2a5f8fbc77309d2bb76c', name: "nav" })), this.showStatus && (h("div", { key: '738dc3e32b6c6e2cacd0dc4b97d4f3520b5482af', class: "footer__status" }, h("span", { key: 'ccf1cc242f2b367c5e3c2064b5e51f9f623f5e7d', class: `footer__status-dot ${this.systemsOperational ? 'footer__status-dot--operational' : 'footer__status-dot--issue'}` }), h("span", { key: 'bc41ea24a56f349814f079f2db28f5cc266b7e83', class: "footer__status-text" }, this.statusText), this.statusUrl && (h("a", { key: '6c5c8c2feffc98154a77336178a6f9ac63cbac1e', href: this.statusUrl, target: "_blank", rel: "noopener noreferrer", class: "footer__status-link" }, "Learn more")))))), h("div", { key: 'f3f9d665f7c4f2a336e15a795377bcbd01d10950', class: "footer__bottom" }, this.copyrightText && (h("p", { key: '943181dfb341d268301db656fdd4b778581d6dd1', class: "footer__copyright" }, this.copyrightText)), h("div", { key: '9909918646c1cfa7765accf8b9d3017a792cc860', class: "footer__legal" }, h("slot", { key: '3b7ba2443306b2bbd48843af246a7407c9cbf2a5', name: "legal" })), h("div", { key: 'c954830920c2e75b2b203640bd8970942eabf0d7', class: "footer__badges" }, h("slot", { key: '35bb8c9c487eae7f15ac6b4558070096497ed997', name: "badges" })))))));
     }
     static get is() { return "af-footer"; }
     static get encapsulation() { return "scoped"; }

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

@@ -9,7 +9,7 @@ export class AfFooterColumn {
         this.heading = '';
     }
     render() {
-        return (h(Host, { key: '90953efd8907072a4a9c336f5a47eafe0317af61' }, h("div", { key: 'cef4b4554d8384e86e24c6329f35a8d9eadf6f44', class: "footer-column" }, this.heading && (h("h5", { key: '22119f6749453837427dc0438254b271f13d81f6', class: "footer-column__heading" }, this.heading)), h("ul", { key: '6a51a9e7e210654d410842b6b2e9c76054c0ecb8', class: "footer-column__list" }, h("slot", { key: '5bc741d972164228b460f30981cc306cdd7435fa' })))));
+        return (h(Host, { key: '675f525c7548bf5b1566c91fb26315451064079f' }, h("div", { key: '6acde9560897e0f7ecf5644a1f0ea26e8ff8239e', class: "footer-column" }, this.heading && (h("h5", { key: '19444320ae2cee0a0e5aa5c88dc02789d013749f', class: "footer-column__heading" }, this.heading)), h("ul", { key: '770eab7015f5cd480436c31ddbd58bfacc076b30', class: "footer-column__list" }, h("slot", { key: '9c71065b4fc32344bcc90bf0ac4766554fc4b84f' })))));
     }
     static get is() { return "af-footer-column"; }
     static get encapsulation() { return "scoped"; }

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

@@ -11,7 +11,7 @@ export class AfFooterLink {
         this.external = false;
     }
     render() {
-        return (h(Host, { key: '121d2b0936ddfa70eb6a2db79fc0ae41b28245a8' }, h("li", { key: '8528d61539f57e05277b3af353d22e43f61e6c52' }, h("a", { key: '05da59ba1868f89e6cc849428b784d530158c0c8', href: this.href, class: "footer-link", target: this.external ? '_blank' : undefined, rel: this.external ? 'noopener noreferrer' : undefined }, h("slot", { key: '33aa087cc0634c62e79df7fa210c897720845623' }), this.external && (h("svg", { key: 'e024e5e1768b11d113943af0c48a0ae894f4d76d', class: "footer-link__external-icon", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: 'c0ccfe70f94d6df8057ccd1c8ea151e27b9c2dc5', 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" })))))));
+        return (h(Host, { key: '4c8565ffc90c571aa34c4a7b60e782519caa866f' }, h("li", { key: 'a23edb8dda823b10747e1927acb1c402da15890f' }, h("a", { key: 'e58f7d1ee389fc21c5f4513af0fee59cdd5d9890', href: this.href, class: "footer-link", target: this.external ? '_blank' : undefined, rel: this.external ? 'noopener noreferrer' : undefined }, h("slot", { key: '8f1fcb75860c1b7046c596702660f59aa5399f45' }), this.external && (h("svg", { key: '54195a756acbe32c01e814e25be8d6dca24ccabc', class: "footer-link__external-icon", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: 'baba36e00a1632e089340dafa1a2f1dc434801e4', 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"; }

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

@@ -0,0 +1,37 @@
+:host {
+  display: block;
+  box-sizing: border-box;
+}
+
+:host([hidden]) {
+  display: none;
+}
+
+.grid {
+  display: grid;
+  grid-template-columns: repeat(var(--grid-columns), 1fr);
+  gap: var(--grid-gap);
+  align-items: var(--grid-align);
+}
+
+/* Large breakpoint: 1024px and below */
+@media (max-width: 1024px) {
+  .grid {
+    grid-template-columns: repeat(var(--grid-columns-lg), 1fr);
+  }
+}
+
+/* Medium breakpoint: 768px and below */
+@media (max-width: 768px) {
+  .grid {
+    grid-template-columns: repeat(var(--grid-columns-md), 1fr);
+  }
+}
+
+/* Small breakpoint: 375px and below */
+@media (max-width: 375px) {
+  .grid {
+    grid-template-columns: repeat(var(--grid-columns-sm), 1fr);
+  }
+}
+

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

@@ -0,0 +1,204 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Generic CSS Grid component for flexible column layouts.
+ * Supports responsive column counts at different breakpoints.
+ *
+ * @slot - Grid items
+ */
+export class AfGrid {
+    constructor() {
+        /**
+         * Number of columns at the default (largest) breakpoint.
+         */
+        this.columns = 3;
+        /**
+         * Gap between grid items using space tokens (1-8).
+         * Maps to --space-1 through --space-8 (4px to 32px).
+         */
+        this.gap = '4';
+        /**
+         * Align items within their grid cells.
+         */
+        this.align = 'stretch';
+    }
+    render() {
+        const alignMap = {
+            start: 'start',
+            center: 'center',
+            end: 'end',
+            stretch: 'stretch',
+        };
+        return (h(Host, { key: '3043700eaf21addce4bd20eb107790fea7a7f5cc', style: {
+                '--grid-columns': String(this.columns),
+                '--grid-columns-lg': String(this.columnsLg ?? this.columns),
+                '--grid-columns-md': String(this.columnsMd ?? this.columnsLg ?? this.columns),
+                '--grid-columns-sm': String(this.columnsSm ?? this.columnsMd ?? this.columnsLg ?? 1),
+                '--grid-gap': `var(--space-${this.gap})`,
+                '--grid-align': alignMap[this.align],
+            } }, h("div", { key: 'fd9bfb0ab2982d4d48ccaa4dc20889cde822a25a', class: "grid" }, h("slot", { key: '8dd95107a71f18910ac3b27b2f8e074f87bacff2' }))));
+    }
+    static get is() { return "af-grid"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-grid.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-grid.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "columns": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "Columns",
+                    "resolved": "1 | 12 | 2 | 3 | 4 | 5 | 6",
+                    "references": {
+                        "Columns": {
+                            "location": "global",
+                            "id": "global::Columns"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Number of columns at the default (largest) breakpoint."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "columns",
+                "defaultValue": "3"
+            },
+            "columnsLg": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "Columns",
+                    "resolved": "1 | 12 | 2 | 3 | 4 | 5 | 6 | undefined",
+                    "references": {
+                        "Columns": {
+                            "location": "global",
+                            "id": "global::Columns"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Number of columns at the large breakpoint (1024px and below)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "columns-lg"
+            },
+            "columnsMd": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "Columns",
+                    "resolved": "1 | 12 | 2 | 3 | 4 | 5 | 6 | undefined",
+                    "references": {
+                        "Columns": {
+                            "location": "global",
+                            "id": "global::Columns"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Number of columns at the medium breakpoint (768px and below)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "columns-md"
+            },
+            "columnsSm": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "Columns",
+                    "resolved": "1 | 12 | 2 | 3 | 4 | 5 | 6 | undefined",
+                    "references": {
+                        "Columns": {
+                            "location": "global",
+                            "id": "global::Columns"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Number of columns at the small breakpoint (375px and below)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "columns-sm"
+            },
+            "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 grid 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": "'4'"
+            },
+            "align": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Align",
+                    "resolved": "\"center\" | \"end\" | \"start\" | \"stretch\"",
+                    "references": {
+                        "Align": {
+                            "location": "global",
+                            "id": "global::Align"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Align items within their grid cells."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "align",
+                "defaultValue": "'stretch'"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-grid.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"af-grid.js","sourceRoot":"","sources":["../../../src/components/af-grid/af-grid.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAMzD;;;;;GAKG;AAMH,MAAM,OAAO,MAAM;IALnB;QAME;;WAEG;QACK,YAAO,GAAY,CAAC,CAAC;QAiB7B;;;WAGG;QACK,QAAG,GAAQ,GAAG,CAAC;QAEvB;;WAEG;QACK,UAAK,GAAU,SAAS,CAAC;KA2BlC;IAzBC,MAAM;QACJ,MAAM,QAAQ,GAA0B;YACtC,KAAK,EAAE,OAAO;YACd,MAAM,EAAE,QAAQ;YAChB,GAAG,EAAE,KAAK;YACV,OAAO,EAAE,SAAS;SACnB,CAAC;QAEF,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,gBAAgB,EAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC;gBACtC,mBAAmB,EAAE,MAAM,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,OAAO,CAAC;gBAC3D,mBAAmB,EAAE,MAAM,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,OAAO,CAAC;gBAC7E,mBAAmB,EAAE,MAAM,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC;gBACpF,YAAY,EAAE,eAAe,IAAI,CAAC,GAAG,GAAG;gBACxC,cAAc,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;aACX;YAE3B,4DAAK,KAAK,EAAC,MAAM;gBACf,8DAAa,CACT,CACD,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 Columns = 1 | 2 | 3 | 4 | 5 | 6 | 12;\ntype Align = 'start' | 'center' | 'end' | 'stretch';\n\n/**\n * Generic CSS Grid component for flexible column layouts.\n * Supports responsive column counts at different breakpoints.\n *\n * @slot - Grid items\n */\n@Component({\n  tag: 'af-grid',\n  styleUrl: 'af-grid.css',\n  shadow: true,\n})\nexport class AfGrid {\n  /**\n   * Number of columns at the default (largest) breakpoint.\n   */\n  @Prop() columns: Columns = 3;\n\n  /**\n   * Number of columns at the large breakpoint (1024px and below).\n   */\n  @Prop() columnsLg?: Columns;\n\n  /**\n   * Number of columns at the medium breakpoint (768px and below).\n   */\n  @Prop() columnsMd?: Columns;\n\n  /**\n   * Number of columns at the small breakpoint (375px and below).\n   */\n  @Prop() columnsSm?: Columns;\n\n  /**\n   * Gap between grid items using space tokens (1-8).\n   * Maps to --space-1 through --space-8 (4px to 32px).\n   */\n  @Prop() gap: Gap = '4';\n\n  /**\n   * Align items within their grid cells.\n   */\n  @Prop() align: Align = 'stretch';\n\n  render() {\n    const alignMap: Record<Align, string> = {\n      start: 'start',\n      center: 'center',\n      end: 'end',\n      stretch: 'stretch',\n    };\n\n    return (\n      <Host\n        style={{\n          '--grid-columns': String(this.columns),\n          '--grid-columns-lg': String(this.columnsLg ?? this.columns),\n          '--grid-columns-md': String(this.columnsMd ?? this.columnsLg ?? this.columns),\n          '--grid-columns-sm': String(this.columnsSm ?? this.columnsMd ?? this.columnsLg ?? 1),\n          '--grid-gap': `var(--space-${this.gap})`,\n          '--grid-align': alignMap[this.align],\n        } as Record<string, string>}\n      >\n        <div class=\"grid\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n\n"]}

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

@@ -12,7 +12,11 @@
   letter-spacing: var(--letter-spacing-heading, -0.02em);
 }
 
-/* Alignment */
+/* Alignment - inherits from --af-text-align if set, otherwise uses explicit align prop */
+.align-inherit {
+  text-align: var(--af-text-align, left);
+}
+
 .align-left {
   text-align: left;
 }

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

@@ -1,15 +1,15 @@
 import { h } from "@stencil/core";
 /**
  * Heading component that inherits color from theme context.
- * Color is determined by the parent theme (af-section, af-hero-section, etc.)
+ * Color is determined by the parent theme (af-section, af-card, etc.)
  * via CSS custom properties.
  */
 export class AfHeading {
     constructor() {
         /** Heading level */
         this.level = '1';
-        /** Visual alignment */
-        this.align = 'left';
+        /** Visual alignment. Defaults to 'inherit' which reads from parent context (e.g. AfTypographyLockup) */
+        this.align = 'inherit';
     }
     getHeadingTag() {
         // Map display levels to semantic HTML tags
@@ -25,11 +25,11 @@ export class AfHeading {
     }
     render() {
         const Tag = this.getHeadingTag();
-        return (h(Tag, { key: '05bfc95960c7546b642fde77e0cc4018817c4241', class: {
+        return (h(Tag, { key: '554451170ad9c9cf3345d4c115cc4bd360c54651', class: {
                 'heading': true,
                 [`level-${this.level}`]: true,
                 [`align-${this.align}`]: true
-            }, part: "base" }, h("slot", { key: '9ebf0b011f26063a1835dfe157d0d485a30a5a0b' })));
+            }, part: "base" }, h("slot", { key: 'a41808f28f04efa17b49ef1a4ebfd79896ba8e98' })));
     }
     static get is() { return "af-heading"; }
     static get encapsulation() { return "shadow"; }
@@ -69,21 +69,21 @@ export class AfHeading {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "'left' | 'center' | 'right'",
-                    "resolved": "\"center\" | \"left\" | \"right\"",
+                    "original": "'inherit' | 'left' | 'center' | 'right'",
+                    "resolved": "\"center\" | \"inherit\" | \"left\" | \"right\"",
                     "references": {}
                 },
                 "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Visual alignment"
+                    "text": "Visual alignment. Defaults to 'inherit' which reads from parent context (e.g. AfTypographyLockup)"
                 },
                 "getter": false,
                 "setter": false,
                 "reflect": false,
                 "attribute": "align",
-                "defaultValue": "'left'"
+                "defaultValue": "'inherit'"
             }
         };
     }

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

@@ -1 +1 @@
-{"version":3,"file":"af-heading.js","sourceRoot":"","sources":["../../../src/components/af-heading/af-heading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;;;GAIG;AAMH,MAAM,OAAO,SAAS;IALtB;QAME,oBAAoB;QACZ,UAAK,GAAuC,GAAG,CAAC;QAExD,uBAAuB;QACf,UAAK,GAAgC,MAAM,CAAC;KA+BrD;IA7BS,aAAa;QACnB,2CAA2C;QAC3C,MAAM,MAAM,GAA2B;YACrC,IAAI,EAAE,IAAI;YACV,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;SACV,CAAC;QACF,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC;IACpC,CAAC;IAED,MAAM;QACJ,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,EAAS,CAAC;QAExC,OAAO,CACL,EAAC,GAAG,qDACF,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;gBAC7B,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;aAC9B,EACD,IAAI,EAAC,MAAM;YAEX,8DAAQ,CACJ,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Heading component that inherits color from theme context.\n * Color is determined by the parent theme (af-section, af-hero-section, etc.)\n * via CSS custom properties.\n */\n@Component({\n  tag: 'af-heading',\n  styleUrl: 'af-heading.css',\n  shadow: true\n})\nexport class AfHeading {\n  /** Heading level */\n  @Prop() level: 'xl' | '1' | '2' | '3' | '4' | '5' = '1';\n\n  /** Visual alignment */\n  @Prop() align: 'left' | 'center' | 'right' = 'left';\n\n  private getHeadingTag() {\n    // Map display levels to semantic HTML tags\n    const tagMap: Record<string, string> = {\n      'xl': 'h1',\n      '1': 'h1',\n      '2': 'h2',\n      '3': 'h3',\n      '4': 'h4',\n      '5': 'h5'\n    };\n    return tagMap[this.level] || 'h1';\n  }\n\n  render() {\n    const Tag = this.getHeadingTag() as any;\n\n    return (\n      <Tag\n        class={{\n          'heading': true,\n          [`level-${this.level}`]: true,\n          [`align-${this.align}`]: true\n        }}\n        part=\"base\"\n      >\n        <slot />\n      </Tag>\n    );\n  }\n}\n"]}
+{"version":3,"file":"af-heading.js","sourceRoot":"","sources":["../../../src/components/af-heading/af-heading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;;;GAIG;AAMH,MAAM,OAAO,SAAS;IALtB;QAME,oBAAoB;QACZ,UAAK,GAAuC,GAAG,CAAC;QAExD,wGAAwG;QAChG,UAAK,GAA4C,SAAS,CAAC;KA+BpE;IA7BS,aAAa;QACnB,2CAA2C;QAC3C,MAAM,MAAM,GAA2B;YACrC,IAAI,EAAE,IAAI;YACV,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;SACV,CAAC;QACF,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC;IACpC,CAAC;IAED,MAAM;QACJ,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,EAAS,CAAC;QAExC,OAAO,CACL,EAAC,GAAG,qDACF,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;gBAC7B,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;aAC9B,EACD,IAAI,EAAC,MAAM;YAEX,8DAAQ,CACJ,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Heading component that inherits color from theme context.\n * Color is determined by the parent theme (af-section, af-card, etc.)\n * via CSS custom properties.\n */\n@Component({\n  tag: 'af-heading',\n  styleUrl: 'af-heading.css',\n  shadow: true\n})\nexport class AfHeading {\n  /** Heading level */\n  @Prop() level: 'xl' | '1' | '2' | '3' | '4' | '5' = '1';\n\n  /** Visual alignment. Defaults to 'inherit' which reads from parent context (e.g. AfTypographyLockup) */\n  @Prop() align: 'inherit' | 'left' | 'center' | 'right' = 'inherit';\n\n  private getHeadingTag() {\n    // Map display levels to semantic HTML tags\n    const tagMap: Record<string, string> = {\n      'xl': 'h1',\n      '1': 'h1',\n      '2': 'h2',\n      '3': 'h3',\n      '4': 'h4',\n      '5': 'h5'\n    };\n    return tagMap[this.level] || 'h1';\n  }\n\n  render() {\n    const Tag = this.getHeadingTag() as any;\n\n    return (\n      <Tag\n        class={{\n          'heading': true,\n          [`level-${this.level}`]: true,\n          [`align-${this.align}`]: true\n        }}\n        part=\"base\"\n      >\n        <slot />\n      </Tag>\n    );\n  }\n}\n"]}

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

@@ -51,7 +51,7 @@ export class AfIcon {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"info\" | \"home\" | \"email\" | \"search\" | \"code\" | \"data\" | \"menu\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
+                    "resolved": "\"info\" | \"home\" | \"email\" | \"code\" | \"data\" | \"menu\" | \"search\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
                     "references": {
                         "IconName": {
                             "location": "import",

package/dist/collection/components/af-icon-box/af-icon-box.js

@@ -27,7 +27,7 @@ export class AfIconBox {
             [`icon-box--size-${this.size}`]: true,
         };
         const iconSize = this.size === 'small' ? 20 : this.size === 'large' ? 48 : 40;
-        return (h(Host, { key: 'f98a89d393a98dbb00fe8f3d47c22e18392015c9' }, h("div", { key: '5f899eafc9b55126f495ba5ac60e768454bde2c9', class: containerClasses }, h("af-icon", { key: '1be5097838ffb99ac6b127d3848327bbe24f6e7e', name: this.icon, size: iconSize }))));
+        return (h(Host, { key: '961d990c78faedbaa7595e26966edd712ffe323a' }, h("div", { key: '499bd1a36c589994cd1f1c848450aa0fe3d43ac0', class: containerClasses }, h("af-icon", { key: '6b48d327dc1a712e764f9ff783ba904252f9873d', name: this.icon, size: iconSize }))));
     }
     static get is() { return "af-icon-box"; }
     static get encapsulation() { return "scoped"; }
@@ -48,7 +48,7 @@ export class AfIconBox {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"info\" | \"home\" | \"email\" | \"search\" | \"code\" | \"data\" | \"menu\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
+                    "resolved": "\"info\" | \"home\" | \"email\" | \"code\" | \"data\" | \"menu\" | \"search\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
                     "references": {
                         "IconName": {
                             "location": "import",

package/dist/collection/components/af-icon-text/af-icon-text.js

@@ -43,7 +43,7 @@ export class AfIconText {
             'icon-text': true,
             [`icon-text--${this.orientation}`]: true,
         };
-        return (h(Host, { key: '4ab83cfbaeadd4d5db898582966050b6bc193d6c' }, h("div", { key: 'ff16245f1344e9cb51e60f9615b126f31154c998', class: containerClasses }, h("af-icon-box", { key: 'dc83c0df2a209383d501dfba6ae0d633cc56dc1d', icon: this.icon, size: this.iconSize, class: "icon-text__icon" }), h("af-typography-lockup", { key: 'e0b1c5ed913b36c137de77e194e5241cfa3e6973', headingSize: this.headingSize, textAlignment: "left", buttonAlignment: "vertical", class: "icon-text__lockup" }, h("slot", { key: 'df7ddf9e2ea7045346db6380f52b74ff36bbad45' }), h("span", { key: '07dcdcaa69def9ba0a5c1964efdcf7778f4dc210', slot: "description" }, h("slot", { key: '2c609e55d2c5fd41ee6c7681f73ea2e0c84e8130', name: "description" })), h("span", { key: '27789b11658d17fd3695648e1798f6efdc3ac913', slot: "buttons" }, h("slot", { key: '3e9c4e2ff23ba9966add8f618d5b3c0ef0b8bc4e', name: "buttons" }))))));
+        return (h(Host, { key: '05f526330b69a8868f4d5d98e43ba59367a17319' }, h("div", { key: '1f64e5aa24607f13916bbde18e2ec9427c9a3f7c', class: containerClasses }, h("af-icon-box", { key: '9db629d1afad970e95194b87796b56abc6b94b27', icon: this.icon, size: this.iconSize, class: "icon-text__icon" }), h("af-typography-lockup", { key: '998fa3c49a6f8eca89d4235d8f2c6b226671ba04', headingSize: this.headingSize, textAlignment: "left", buttonAlignment: "vertical", class: "icon-text__lockup" }, h("slot", { key: 'd2d2e7054010367e338d54788b4f3ed8d0c157d7' }), h("span", { key: 'e31750f8dc682839c544dba6ea924fd21a454e52', slot: "description" }, h("slot", { key: '10248d219f5125818d91a41d2472bcad65e24b4f', name: "description" })), h("span", { key: '634276962dea534962e7a33dbcb9d87f98ca968f', slot: "buttons" }, h("slot", { key: 'b52e5205b2a9e3d7947c8978050b15c2431e5f8a', name: "buttons" }))))));
     }
     static get is() { return "af-icon-text"; }
     static get encapsulation() { return "scoped"; }
@@ -64,7 +64,7 @@ export class AfIconText {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"info\" | \"home\" | \"email\" | \"search\" | \"code\" | \"data\" | \"menu\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
+                    "resolved": "\"info\" | \"home\" | \"email\" | \"code\" | \"data\" | \"menu\" | \"search\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
                     "references": {
                         "IconName": {
                             "location": "import",