npm - @affinda/wc - Versions diffs - 0.0.25 → 0.0.27 - Mend

@affinda/wc 0.0.25 → 0.0.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (910) hide show

package/dist/components/af-testimonial.js CHANGED Viewed

@@ -1 +1,88 @@
-import{p as e,H as a,d as t,h as i,c as s,t as o}from"./p-DsNqeD3z.js";import{d as n}from"./p-wM1k9Wi7.js";import{d as l}from"./p-BeX5VmwL.js";import{d}from"./p-B7lJGMfD.js";import{d as c}from"./p-DRm58pvc.js";const r=e(class extends a{constructor(e){super(),!1!==e&&this.__registerHost(),this.navPrev=t(this,"navPrev"),this.navNext=t(this,"navNext"),this.showNavigation=!1,this.hasPrev=!1,this.hasNext=!1,this.handlePrev=()=>{this.navPrev.emit()},this.handleNext=()=>{this.navNext.emit()}}render(){return i(s,{key:"33b2a19b7f369227cdfcf6eee289fb834d5b6329"},i("div",{key:"761a3e5c92a22b2ad88d0a76bf9ef8f6002cdbce",class:"testimonial-card"},i("div",{key:"8d4d5287881cec18e5b1d64b2463ed2c07460d07",class:"testimonial-image"},this.backgroundImage&&i("img",{key:"a976c752ab87e3f5da7582f97b54d50ee5c1a1cd",src:this.backgroundImage,alt:"",class:"testimonial-bg-image"}),this.logoImage&&i("div",{key:"f8141dc44ac5c28ab1141cc1d9d855467cdf8b09",class:"testimonial-logo"},i("img",{key:"65ef7ab84bdae5e47ecfdda2f8336fd83fa90c7a",src:this.logoImage,alt:"Company logo"}))),i("div",{key:"6cb5e2b4832a5a65fb3ea04810dbf7f698b11ec1",class:"testimonial-content"},i("div",{key:"b1f58ce100b7721750f562a6e9de9e7f91ae93a5",class:"testimonial-quote-section"},i("div",{key:"c320c3775e11356bd5e5108b7677b7b67f4c6f89",class:"testimonial-quote-icon"},i("slot",{key:"c951a7d40e7e0012d89ba4393a3f1561665c9c4d",name:"quote-icon"},i("af-icon",{key:"3a8764d0a3d34b16b722b777a20b11e6426cdb66",name:"quote",size:48}))),i("af-text",{key:"d5c29a4a791304cb3b98b582e72a16d6865eb3ca",variant:"xlarge",class:"testimonial-text"},this.quote),i("af-text",{key:"a8839b04257e79df76d9f3ae97a4d9dcb0070a66",variant:"xlarge",class:"testimonial-attribution"},this.attribution)),i("div",{key:"3eb72d12ba340557e26e9bbb7faaea3b06fbf711",class:"testimonial-stats"},i("slot",{key:"2c54f1ed69a1c31ff5999804e11312460cd33ccb",name:"stats"})),i("div",{key:"160149782113f03e0e14e17d2aa200ac1773990b",class:"testimonial-footer"},i("div",{key:"3f2efa1c37fca41827722b48b12b0e8a4c2c0528",class:"testimonial-nav"},this.showNavigation?i("div",{class:"testimonial-nav-buttons"},i("af-icon-button",{variant:"secondary",disabled:!this.hasPrev,onClick:this.handlePrev,ariaLabel:"Previous testimonial"},i("af-icon",{name:"arrow-left",size:24})),i("af-icon-button",{variant:"secondary",disabled:!this.hasNext,onClick:this.handleNext,ariaLabel:"Next testimonial"},i("af-icon",{name:"arrow-right",size:24}))):i("slot",{name:"navigation"})),this.readMoreLink&&i("af-button",{key:"68c099e51f01e9f715d93eab790ff87d99291a10",variant:"secondary",href:this.readMoreLink},"Read full story",i("af-icon",{key:"549160eb2d850d2ae14eef62ff3d6cd72c9aa991",slot:"icon-right",name:"arrow-right",size:24}))))))}static get style(){return".sc-af-testimonial-h{display:block;width:100%}.testimonial-card.sc-af-testimonial{background:var(--af-background-level-1, var(--colour-mistgreen-200, #e8eeed));border-radius:var(--border-radius-card-level-1, 32px);overflow:hidden;display:flex;height:544px;box-sizing:border-box}.testimonial-image.sc-af-testimonial{position:relative;width:40.5%;min-width:300px;max-width:519px;height:100%;background:var(--colour-brand-inkwell, #14343b);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.testimonial-bg-image.sc-af-testimonial{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.7}.testimonial-logo.sc-af-testimonial{position:relative;z-index:1;padding:0 108px;max-width:100%}.testimonial-logo.sc-af-testimonial img.sc-af-testimonial{width:100%;height:auto;display:block}.testimonial-content.sc-af-testimonial{flex:1;display:flex;flex-direction:column;gap:32px;padding:48px;border:1px solid var(--af-background-border-subtle, var(--colour-mistgreen-200, #e8eeed));border-left:1px solid var(--af-background-border-subtle, var(--colour-mistgreen-200, #e8eeed));box-sizing:border-box}.testimonial-quote-section.sc-af-testimonial{flex:1;display:flex;flex-direction:column;gap:12px;min-height:0;overflow:hidden}.testimonial-quote-icon.sc-af-testimonial{width:48px;height:48px;color:var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #b09670));flex-shrink:0}.testimonial-text.sc-af-testimonial{max-height:155px;overflow:hidden;text-overflow:ellipsis}.testimonial-attribution.sc-af-testimonial{--af-typography-body-default:var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343b))}.testimonial-stats.sc-af-testimonial{display:grid;grid-template-columns:repeat(4, 1fr);gap:32px;width:100%;flex-shrink:0}@media (min-width: 768px) and (max-width: 1023px){.testimonial-stats.sc-af-testimonial{grid-template-columns:repeat(2, 1fr)}}@media (max-width: 767px){.testimonial-stats.sc-af-testimonial{grid-template-columns:1fr}}.testimonial-footer.sc-af-testimonial{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--af-background-border-default, var(--colour-mistgreen-400, #d1ddda));padding-top:32px;flex-shrink:0;min-height:48px}.testimonial-nav.sc-af-testimonial{display:flex;gap:12px}.testimonial-nav-buttons.sc-af-testimonial{display:flex;gap:12px}"}},[262,"af-testimonial",{backgroundImage:[1,"background-image"],logoImage:[1,"logo-image"],quote:[1],attribution:[1],readMoreLink:[1,"read-more-link"],showNavigation:[1028,"show-navigation"],hasPrev:[1028,"has-prev"],hasNext:[1028,"has-next"]}]),f=r,m=function(){"undefined"!=typeof customElements&&["af-testimonial","af-button","af-icon","af-icon-button","af-text"].forEach((e=>{switch(e){case"af-testimonial":customElements.get(o(e))||customElements.define(o(e),r);break;case"af-button":customElements.get(o(e))||n();break;case"af-icon":customElements.get(o(e))||l();break;case"af-icon-button":customElements.get(o(e))||d();break;case"af-text":customElements.get(o(e))||c()}}))};export{f as AfTestimonial,m as defineCustomElement}
+import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-BBpihWJI.js';
+import { d as defineCustomElement$4 } from './p-CyTj19Yy.js';
+import { d as defineCustomElement$3 } from './p-BFLKhcjQ.js';
+import { d as defineCustomElement$2 } from './p-CBrB-J4s.js';
+const afTestimonialCss = ".sc-af-testimonial-h{display:block;width:100%}.testimonial-card.sc-af-testimonial{background:var(--af-background-level-1, var(--colour-mistgreen-200, #e8eeed));border-radius:var(--border-radius-card-level-1, 32px);overflow:hidden;display:flex;height:544px;box-sizing:border-box}.testimonial-image.sc-af-testimonial{position:relative;width:50%;min-width:300px;max-width:519px;height:100%;background:var(--colour-brand-inkwell, #14343b);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.testimonial-bg-image.sc-af-testimonial{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0.7}.testimonial-logo.sc-af-testimonial{position:relative;z-index:1;padding:0 108px;max-width:100%}.testimonial-logo.sc-af-testimonial img.sc-af-testimonial{width:100%;height:auto;display:block}.testimonial-content.sc-af-testimonial{flex:1;display:flex;flex-direction:column;gap:32px;padding:48px;border:1px solid var(--af-background-border-subtle, var(--colour-mistgreen-200, #e8eeed));border-left:1px solid var(--af-background-border-subtle, var(--colour-mistgreen-200, #e8eeed));box-sizing:border-box}.testimonial-quote-section.sc-af-testimonial{flex:1;display:flex;flex-direction:column;gap:12px;min-height:0;overflow:hidden}.testimonial-quote-icon.sc-af-testimonial{width:48px;height:48px;color:var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #b09670));flex-shrink:0}.testimonial-text.sc-af-testimonial{font-family:var(--typography-bodyfont, 'NeuSans', sans-serif);font-size:22px;line-height:1.4;font-weight:var(--font-weight-regular, 400);color:var(--af-typography-body-default, var(--colour-brand-inkwell, #14343b))}.testimonial-text.sc-af-testimonial-s>p,.testimonial-text .sc-af-testimonial-s>p,.testimonial-text.sc-af-testimonial p.sc-af-testimonial{font:inherit;color:inherit;margin:0 0 12px 0}.testimonial-text.sc-af-testimonial-s>p,.testimonial-text.sc-af-testimonial-s>p:last-child,.testimonial-text .sc-af-testimonial-s>p:last-child,.testimonial-text.sc-af-testimonial p.sc-af-testimonial:last-child{margin-bottom:0}.testimonial-text.sc-af-testimonial-s>ul,.testimonial-text .sc-af-testimonial-s>ul,.testimonial-text.sc-af-testimonial ul.sc-af-testimonial{margin:0 0 12px 0;padding-left:20px}.testimonial-attribution.sc-af-testimonial{font-family:var(--typography-bodyfont, 'NeuSans', sans-serif);font-size:16px;line-height:24px;color:var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343b));margin-top:12px}.testimonial-stats.sc-af-testimonial{display:grid;grid-template-columns:repeat(4, 1fr);gap:32px;width:100%;flex-shrink:0}@media (min-width: 768px) and (max-width: 1023px){.testimonial-stats.sc-af-testimonial{grid-template-columns:repeat(2, 1fr)}}@media (max-width: 767px){.testimonial-stats.sc-af-testimonial{grid-template-columns:1fr}}.testimonial-footer.sc-af-testimonial{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--af-background-border-default, var(--colour-mistgreen-400, #d1ddda));padding-top:32px;flex-shrink:0;min-height:48px}.testimonial-nav.sc-af-testimonial{display:flex;gap:12px}.testimonial-nav-buttons.sc-af-testimonial{display:flex;gap:12px}";
+const AfTestimonial$1 = /*@__PURE__*/ proxyCustomElement(class AfTestimonial extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.navPrev = createEvent(this, "navPrev");
+        this.navNext = createEvent(this, "navNext");
+        /**
+         * Whether to show built-in navigation buttons (used when in a carousel)
+         */
+        this.showNavigation = false;
+        /**
+         * Whether the previous button is enabled
+         */
+        this.hasPrev = false;
+        /**
+         * Whether the next button is enabled
+         */
+        this.hasNext = false;
+        this.handlePrev = () => {
+            this.navPrev.emit();
+        };
+        this.handleNext = () => {
+            this.navNext.emit();
+        };
+    }
+    render() {
+        return (h(Host, { key: 'ece3fb36d1f133e0429a59f8fe24dadae0d25e51' }, h("div", { key: '874ba61ab34378a92f496d9143b817d3cbbce2ef', class: "testimonial-card" }, h("div", { key: 'c7812c978b4b0ce7ad5f23e2fc429986c787ec4e', class: "testimonial-image" }, this.backgroundImage && (h("img", { key: 'd8ae7c602c4e7a78037f8ca1dfb1363136499942', src: this.backgroundImage, alt: "", class: "testimonial-bg-image" })), this.logoImage && (h("div", { key: '1e2b8f1252b1bf4d480bd453fd558c3ab8cf4888', class: "testimonial-logo" }, h("img", { key: '7d9dda13479c1f46f97bca5e3628ac03925c058a', src: this.logoImage, alt: "Company logo" })))), h("div", { key: '4bfabf5919bb04b966ba56aeba9d5ecbb473c6df', class: "testimonial-content" }, h("div", { key: 'ceb09f4ea4fa02cb1289501b94b87a378b8388bf', class: "testimonial-quote-section" }, h("div", { key: '26388df84c2fa2191edc36c844e46a131133741f', class: "testimonial-quote-icon" }, h("slot", { key: '76862abdc6eb6a79abe4e1024045252cc843fbd8', name: "quote-icon" }, h("af-icon", { key: 'ad6a19f54dd5c19d2fd41b6c8d8689e35ee5fc47', name: "quote", size: 48 }))), h("div", { key: '3773864a3bbb9bcb6788ca49b401eb59d140cbf2', class: "testimonial-text" }, h("slot", { key: 'e98fb304d608a76e95b08c3dc29e54ab556327b6', name: "quote-body" }, this.quote)), h("div", { key: 'e056c13a838325f20767bf35a3659d898843767d', class: "testimonial-attribution" }, this.attribution)), h("div", { key: 'b568594caa24f709dc3723c58eb3fa6263f229b9', class: "testimonial-stats" }, h("slot", { key: 'e463d0484e771db9fcf598f67adb6c8f4ebd2eae', name: "stats" })), h("div", { key: '3e645d385530722738d88c7764b41997385e5811', class: "testimonial-footer" }, h("div", { key: 'aa8d161c9a9030cb19f0e49e7614d665200b6c43', class: "testimonial-nav" }, this.showNavigation ? (
+        // Render built-in navigation buttons
+        h("div", { class: "testimonial-nav-buttons" }, h("af-icon-button", { variant: "secondary", disabled: !this.hasPrev, onClick: this.handlePrev, ariaLabel: "Previous testimonial" }, h("af-icon", { name: "arrow-left", size: 24 })), h("af-icon-button", { variant: "secondary", disabled: !this.hasNext, onClick: this.handleNext, ariaLabel: "Next testimonial" }, h("af-icon", { name: "arrow-right", size: 24 })))) : (
+        // Allow custom navigation via slot
+        h("slot", { name: "navigation" }))), this.readMoreLink && (h("af-button", { key: '3764047858f6661077ec1a696c327c6dc80c5056', variant: "secondary", href: this.readMoreLink }, "Read full story", h("af-icon", { key: 'bd1cc25cf7e59c030fc4c2d94593e1437e57cd81', slot: "icon-right", name: "arrow-right", size: 24 }))))))));
+    }
+    static get style() { return afTestimonialCss; }
+}, [262, "af-testimonial", {
+        "backgroundImage": [1, "background-image"],
+        "logoImage": [1, "logo-image"],
+        "quote": [1],
+        "attribution": [1],
+        "readMoreLink": [1, "read-more-link"],
+        "showNavigation": [1028, "show-navigation"],
+        "hasPrev": [1028, "has-prev"],
+        "hasNext": [1028, "has-next"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["af-testimonial", "af-button", "af-icon", "af-icon-button"];
+    components.forEach(tagName => { switch (tagName) {
+        case "af-testimonial":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AfTestimonial$1);
+            }
+            break;
+        case "af-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "af-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "af-icon-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+const AfTestimonial = AfTestimonial$1;
+const defineCustomElement = defineCustomElement$1;
+export { AfTestimonial, defineCustomElement };
+//# sourceMappingURL=af-testimonial.js.map
+//# sourceMappingURL=af-testimonial.js.map

package/dist/components/af-testimonial.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"af-testimonial.js","mappings":"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","names":["AfTestimonial","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-testimonial/af-testimonial.css?tag=af-testimonial&encapsulation=scoped","src/components/af-testimonial/af-testimonial.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n}\n\n.testimonial-card {\n /* Uses themed level-1 background from parent Section */\n background: var(--af-background-level-1, var(--colour-mistgreen-200, #e8eeed));\n border-radius: var(--border-radius-card-level-1, 32px);\n overflow: hidden;\n display: flex;\n height: 544px;\n box-sizing: border-box;\n}\n\n/* Image side - 40.5% of card width (519px of 1280px in Figma) */\n.testimonial-image {\n position: relative;\n width: 50%;\n min-width: 300px;\n /* Minimum for readability */\n max-width: 519px;\n /* Cap at Figma design width */\n height: 100%;\n /* Dark background for image overlay effect - always dark regardless of theme */\n background: var(--colour-brand-inkwell, #14343b);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n overflow: hidden;\n}\n\n.testimonial-bg-image {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n opacity: 0.7;\n}\n\n.testimonial-logo {\n position: relative;\n z-index: 1;\n padding: 0 108px;\n max-width: 100%;\n}\n\n.testimonial-logo img {\n width: 100%;\n height: auto;\n display: block;\n}\n\n/* Content side */\n.testimonial-content {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 32px;\n padding: 48px;\n /* Subtle border using themed border token */\n border: 1px solid var(--af-background-border-subtle, var(--colour-mistgreen-200, #e8eeed));\n border-left: 1px solid var(--af-background-border-subtle, var(--colour-mistgreen-200, #e8eeed));\n box-sizing: border-box;\n}\n\n.testimonial-quote-section {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 12px;\n min-height: 0;\n /* Allow flex item to shrink */\n overflow: hidden;\n}\n\n.testimonial-quote-icon {\n width: 48px;\n height: 48px;\n /* Quote icon uses themed secondary heading color (gold/ochre accent) */\n color: var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #b09670));\n flex-shrink: 0;\n}\n\n/* Quote text — 22px / 140% per Webflow reference. Accepts either the\n `quote` prop (rendered as plain text) or the `quote-body` slot (rich). */\n.testimonial-text {\n font-family: var(--typography-bodyfont, 'NeuSans', sans-serif);\n font-size: 22px;\n line-height: 1.4;\n font-weight: var(--font-weight-regular, 400);\n color: var(--af-typography-body-default, var(--colour-brand-inkwell, #14343b));\n}\n.testimonial-text ::slotted(p),\n.testimonial-text p {\n font: inherit;\n color: inherit;\n margin: 0 0 12px 0;\n}\n.testimonial-text ::slotted(p:last-child),\n.testimonial-text p:last-child {\n margin-bottom: 0;\n}\n.testimonial-text ::slotted(ul),\n.testimonial-text ul {\n margin: 0 0 12px 0;\n padding-left: 20px;\n}\n\n/* Attribution uses body-dark color for emphasis */\n.testimonial-attribution {\n font-family: var(--typography-bodyfont, 'NeuSans', sans-serif);\n font-size: 16px;\n line-height: 24px;\n color: var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343b));\n margin-top: 12px;\n}\n\n.testimonial-stats {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 32px;\n width: 100%;\n flex-shrink: 0;\n}\n\n/* ≥ mobile and ≤ tablet — 2-column intermediate layout so the stats row\n * doesn't snap straight from 4-across to 1-across on common iPad / narrow\n * laptop widths. */\n@media (min-width: 768px) and (max-width: 1023px) {\n .testimonial-stats {\n grid-template-columns: repeat(2, 1fr);\n }\n}\n\n/* ≤ mobile — single column stack */\n@media (max-width: 767px) {\n .testimonial-stats {\n grid-template-columns: 1fr;\n }\n}\n\n.testimonial-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n /* Themed border color */\n border-top: 1px solid var(--af-background-border-default, var(--colour-mistgreen-400, #d1ddda));\n padding-top: 32px;\n flex-shrink: 0;\n min-height: 48px;\n}\n\n.testimonial-nav {\n display: flex;\n gap: 12px;\n}\n\n.testimonial-nav-buttons {\n display: flex;\n gap: 12px;\n}\n\n/* CTA button is now handled by af-button atom component */","import { Component, Prop, h, Host, Event, EventEmitter } from '@stencil/core';\n\n/**\n * @slot quote-body - Rich quote content (paragraphs, lists). Overrides the\n * `quote` string prop when provided. Use for testimonials that include\n * multiple paragraphs, bulleted points, or inline emphasis.\n * @slot quote-icon - Quote icon (defaults to af-icon name=\"quote\").\n * @slot stats - Statistic items (af-testimonial-stat components).\n * @slot navigation - Custom nav controls (when not using built-in ones).\n */\n@Component({\n tag: 'af-testimonial',\n styleUrl: 'af-testimonial.css',\n shadow: false,\n scoped: true,\n})\nexport class AfTestimonial {\n /**\n * Background image URL for the testimonial card\n */\n @Prop() backgroundImage?: string;\n\n /**\n * Company logo URL\n */\n @Prop() logoImage?: string;\n\n /**\n * Testimonial quote text. Falls back to the `quote-body` slot if that\n * slot has content.\n */\n @Prop() quote?: string;\n\n /**\n * Attribution text (e.g., \"– Nathaniel Barrs, CTO, PSC Insurance\")\n */\n @Prop() attribution!: string;\n\n /**\n * Link to full case study\n */\n @Prop() readMoreLink?: string;\n\n /**\n * Whether to show built-in navigation buttons (used when in a carousel)\n */\n @Prop({ mutable: true }) showNavigation: boolean = false;\n\n /**\n * Whether the previous button is enabled\n */\n @Prop({ mutable: true }) hasPrev: boolean = false;\n\n /**\n * Whether the next button is enabled\n */\n @Prop({ mutable: true }) hasNext: boolean = false;\n\n /**\n * Emitted when the previous button is clicked\n */\n @Event() navPrev!: EventEmitter<void>;\n\n /**\n * Emitted when the next button is clicked\n */\n @Event() navNext!: EventEmitter<void>;\n\n private handlePrev = () => {\n this.navPrev.emit();\n };\n\n private handleNext = () => {\n this.navNext.emit();\n };\n\n render() {\n return (\n <Host>\n <div class=\"testimonial-card\">\n {/* Image side */}\n <div class=\"testimonial-image\">\n {this.backgroundImage && (\n <img src={this.backgroundImage} alt=\"\" class=\"testimonial-bg-image\" />\n )}\n {this.logoImage && (\n <div class=\"testimonial-logo\">\n <img src={this.logoImage} alt=\"Company logo\" />\n </div>\n )}\n </div>\n\n {/* Content side */}\n <div class=\"testimonial-content\">\n <div class=\"testimonial-quote-section\">\n {/* Quote icon - using af-icon atom with slot for flexibility */}\n <div class=\"testimonial-quote-icon\">\n <slot name=\"quote-icon\">\n <af-icon name=\"quote\" size={48} />\n </slot>\n </div>\n\n {/* Quote text — slot takes priority; falls back to prop. */}\n <div class=\"testimonial-text\">\n <slot name=\"quote-body\">{this.quote}</slot>\n </div>\n {/* Attribution */}\n <div class=\"testimonial-attribution\">{this.attribution}</div>\n </div>\n\n {/* Statistics slot */}\n <div class=\"testimonial-stats\">\n <slot name=\"stats\"></slot>\n </div>\n\n {/* Footer with navigation and CTA */}\n <div class=\"testimonial-footer\">\n <div class=\"testimonial-nav\">\n {this.showNavigation ? (\n // Render built-in navigation buttons\n <div class=\"testimonial-nav-buttons\">\n <af-icon-button\n variant=\"secondary\"\n disabled={!this.hasPrev}\n onClick={this.handlePrev}\n ariaLabel=\"Previous testimonial\"\n >\n <af-icon name=\"arrow-left\" size={24} />\n </af-icon-button>\n <af-icon-button\n variant=\"secondary\"\n disabled={!this.hasNext}\n onClick={this.handleNext}\n ariaLabel=\"Next testimonial\"\n >\n <af-icon name=\"arrow-right\" size={24} />\n </af-icon-button>\n </div>\n ) : (\n // Allow custom navigation via slot\n <slot name=\"navigation\"></slot>\n )}\n </div>\n {this.readMoreLink && (\n <af-button variant=\"secondary\" href={this.readMoreLink}>\n Read full story\n <af-icon slot=\"icon-right\" name=\"arrow-right\" size={24} />\n </af-button>\n )}\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n\n\n"],"version":3}

package/dist/components/af-text-image-nest.js CHANGED Viewed

@@ -1 +1,51 @@
-import{p as e,H as t,h as a,c as s,t as i}from"./p-DsNqeD3z.js";const n=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.layout="grid-3"}render(){return a(s,{key:"3ec6b9ba229f43f503b31135e64ed4fc1c11f84d"},a("div",{key:"167fd7bc7875e0d8f780a36f27c1d4d3f981f40f",class:{"text-image-nest":!0,["layout-"+this.layout]:!0}},a("div",{key:"9631f476ab5c254d048ae821c5c308e1ab96a539",class:"nest__content"},a("div",{key:"c210eaf566a6f18b9809bd0a3e8392d4e3789f2a",class:{nest__grid:!0,["grid-"+this.layout]:!0}},a("slot",{key:"f17c92f4ecd6d2edd65eee7f06f51994906bd39a"})),a("div",{key:"e6db2988f646ab0bab78b3e3ccca02a5a1ad7cf0",class:"nest__footer"},a("slot",{key:"c60e084083357db2ab52c1743b236924887af55d",name:"buttons"})))))}static get style(){return".sc-af-text-image-nest-h{display:block;width:100%}.text-image-nest.sc-af-text-image-nest{width:100%;position:relative}.nest__content.sc-af-text-image-nest{display:flex;flex-direction:column;align-items:center;gap:48px}.nest__grid.sc-af-text-image-nest{display:grid;gap:40px;width:100%}.grid-single.sc-af-text-image-nest{grid-template-columns:1fr}.grid-grid-2.sc-af-text-image-nest{grid-template-columns:repeat(2, 1fr)}.grid-grid-3.sc-af-text-image-nest{grid-template-columns:repeat(3, 1fr)}.grid-grid-4.sc-af-text-image-nest{grid-template-columns:repeat(4, 1fr)}.grid-stacked.sc-af-text-image-nest{grid-template-columns:1fr;gap:48px}.nest__footer.sc-af-text-image-nest{display:flex;justify-content:center;gap:12px}.nest__footer.sc-af-text-image-nest:empty{display:none}@media (max-width: 768px){.nest__content.sc-af-text-image-nest{gap:32px}.nest__grid.sc-af-text-image-nest{grid-template-columns:1fr;gap:32px}.grid-stacked.sc-af-text-image-nest{gap:40px}.nest__footer.sc-af-text-image-nest{flex-direction:column;align-items:center}}.sc-af-text-image-nest-s>*{margin:0}"}},[262,"af-text-image-nest",{layout:[1]}]),c=n,d=function(){"undefined"!=typeof customElements&&["af-text-image-nest"].forEach((e=>{"af-text-image-nest"===e&&(customElements.get(i(e))||customElements.define(i(e),n))}))};export{c as AfTextImageNest,d as defineCustomElement}
+import { p as proxyCustomElement, H, h, c as Host } from './p-BBpihWJI.js';
+const afTextImageNestCss = ".sc-af-text-image-nest-h{display:block;width:100%}.text-image-nest.sc-af-text-image-nest{width:100%;position:relative}.nest__content.sc-af-text-image-nest{display:flex;flex-direction:column;align-items:center;gap:48px}.nest__grid.sc-af-text-image-nest{display:grid;gap:40px;width:100%}.grid-single.sc-af-text-image-nest{grid-template-columns:1fr}.grid-grid-2.sc-af-text-image-nest{grid-template-columns:repeat(2, 1fr)}.grid-grid-3.sc-af-text-image-nest{grid-template-columns:repeat(3, 1fr)}.grid-grid-4.sc-af-text-image-nest{grid-template-columns:repeat(4, 1fr)}.grid-stacked.sc-af-text-image-nest{grid-template-columns:1fr;gap:48px}.nest__footer.sc-af-text-image-nest{display:flex;justify-content:center;gap:12px}.nest__footer.sc-af-text-image-nest:empty{display:none}@media (max-width: 768px){.nest__content.sc-af-text-image-nest{gap:32px}.nest__grid.sc-af-text-image-nest{grid-template-columns:1fr;gap:32px}.grid-stacked.sc-af-text-image-nest{gap:40px}.nest__footer.sc-af-text-image-nest{flex-direction:column;align-items:center}}.sc-af-text-image-nest-s>*{margin:0}";
+const AfTextImageNest$1 = /*@__PURE__*/ proxyCustomElement(class AfTextImageNest extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        /**
+         * Layout variant for the content grid
+         */
+        this.layout = 'grid-3';
+    }
+    render() {
+        const containerClasses = {
+            'text-image-nest': true,
+            [`layout-${this.layout}`]: true,
+        };
+        const gridClasses = {
+            'nest__grid': true,
+            [`grid-${this.layout}`]: true,
+        };
+        return (h(Host, { key: '016ac9532a42a1494490c49dcffa488f49d1d5c8' }, h("div", { key: '38e16d51c44d69323e0b66e51449564631cc9077', class: containerClasses }, h("div", { key: 'a4c596c73303dde115357b80ece979b1a383e6a8', class: "nest__content" }, h("div", { key: '8d097e97a0cf9149fc3f775b27010d6d6d6c50e4', class: gridClasses }, h("slot", { key: '25ae554ae7f9091e503f1692115e483e552c6170' })), h("div", { key: 'e6105ef43ed3438ee6cd7edc671fc627d60ffef0', class: "nest__footer" }, h("slot", { key: 'ede8c7fa69237042eea88a7d0ed54f3551764e68', name: "buttons" }))))));
+    }
+    static get style() { return afTextImageNestCss; }
+}, [262, "af-text-image-nest", {
+        "layout": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["af-text-image-nest"];
+    components.forEach(tagName => { switch (tagName) {
+        case "af-text-image-nest":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AfTextImageNest$1);
+            }
+            break;
+    } });
+}
+const AfTextImageNest = AfTextImageNest$1;
+const defineCustomElement = defineCustomElement$1;
+export { AfTextImageNest, defineCustomElement };
+//# sourceMappingURL=af-text-image-nest.js.map
+//# sourceMappingURL=af-text-image-nest.js.map

package/dist/components/af-text-image-nest.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"af-text-image-nest.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,+iCAA+iC;;MCsB7jCA,iBAAe,iBAAAC,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;AAN5B,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;AAOE;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAA0D,QAAQ;AA+BjF;IA7BC,MAAM,GAAA;AACJ,QAAA,MAAM,gBAAgB,GAAG;AACvB,YAAA,iBAAiB,EAAE,IAAI;AACvB,YAAA,CAAC,UAAU,IAAI,CAAC,MAAM,CAAE,CAAA,GAAG,IAAI;SAChC;AAED,QAAA,MAAM,WAAW,GAAG;AAClB,YAAA,YAAY,EAAE,IAAI;AAClB,YAAA,CAAC,QAAQ,IAAI,CAAC,MAAM,CAAE,CAAA,GAAG,IAAI;SAC9B;QAED,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,gBAAgB,EAAA,EAC1B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EAExB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,WAAW,EAAA,EACrB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EAGN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EAAA,CAAQ,CACxB,CACF,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["AfTextImageNest","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-text-image-nest/af-text-image-nest.css?tag=af-text-image-nest&encapsulation=scoped","src/components/af-text-image-nest/af-text-image-nest.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n}\n\n/* ==========================================================================\n Base Container\n ========================================================================== */\n\n.text-image-nest {\n width: 100%;\n position: relative;\n}\n\n/* ==========================================================================\n Content Layout\n ========================================================================== */\n\n.nest__content {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 48px;\n}\n\n/* ==========================================================================\n Content Grid\n ========================================================================== */\n\n.nest__grid {\n display: grid;\n gap: 40px;\n width: 100%;\n}\n\n/* Single layout - full width */\n.grid-single {\n grid-template-columns: 1fr;\n}\n\n/* 2-column grid */\n.grid-grid-2 {\n grid-template-columns: repeat(2, 1fr);\n}\n\n/* 3-column grid */\n.grid-grid-3 {\n grid-template-columns: repeat(3, 1fr);\n}\n\n/* 4-column grid */\n.grid-grid-4 {\n grid-template-columns: repeat(4, 1fr);\n}\n\n/* Stacked layout - full width with larger gap for alternating rows */\n.grid-stacked {\n grid-template-columns: 1fr;\n gap: 48px;\n}\n\n/* ==========================================================================\n Footer Buttons\n ========================================================================== */\n\n.nest__footer {\n display: flex;\n justify-content: center;\n gap: 12px;\n}\n\n.nest__footer:empty {\n display: none;\n}\n\n/* ==========================================================================\n Mobile Responsive Styles\n ========================================================================== */\n\n/* mobile-only */\n@media (max-width: 768px) {\n /* Content gap */\n .nest__content {\n gap: 32px;\n }\n\n /* All grids collapse to single column on mobile */\n .nest__grid {\n grid-template-columns: 1fr;\n gap: 32px;\n }\n\n /* Stacked layout gap on mobile */\n .grid-stacked {\n gap: 40px;\n }\n\n /* Footer buttons stack vertically on mobile */\n .nest__footer {\n flex-direction: column;\n align-items: center;\n }\n}\n\n/* ==========================================================================\n Slot Content Styling\n ========================================================================== */\n\n::slotted(*) {\n margin: 0;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * TextImageNest is a layout component that arranges multiple text-image content pieces\n * in various grid layouts with optional footer buttons.\n * \n * This component inherits theming from a parent Section or theme-providing container.\n * Wrap it in an af-section to apply themes.\n * \n * Supports multiple layout variants:\n * - `single`: Full-width single item (side-by-side image + text)\n * - `grid-2`: 2-column grid with stacked items\n * - `grid-3`: 3-column grid with stacked items\n * - `grid-4`: 4-column grid with stacked items\n * - `stacked`: Alternating rows of side-by-side content\n */\n@Component({\n tag: 'af-text-image-nest',\n styleUrl: 'af-text-image-nest.css',\n shadow: false,\n scoped: true,\n})\nexport class AfTextImageNest {\n /**\n * Layout variant for the content grid\n */\n @Prop() layout: 'single' | 'grid-2' | 'grid-3' | 'grid-4' | 'stacked' = 'grid-3';\n\n render() {\n const containerClasses = {\n 'text-image-nest': true,\n [`layout-${this.layout}`]: true,\n };\n\n const gridClasses = {\n 'nest__grid': true,\n [`grid-${this.layout}`]: true,\n };\n\n return (\n <Host>\n <div class={containerClasses}>\n <div class=\"nest__content\">\n {/* Content Grid */}\n <div class={gridClasses}>\n <slot></slot>\n </div>\n\n {/* Footer Buttons */}\n <div class=\"nest__footer\">\n <slot name=\"buttons\"></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n\n"],"version":3}

package/dist/components/af-text-image.js CHANGED Viewed

@@ -1 +1,95 @@
-import{p as e,H as t,h as a,c as i,t as g}from"./p-DsNqeD3z.js";import{d as m}from"./p-BMwWkh8F.js";const s=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.imagePosition="right",this.imageProportion="1/3",this.alt="",this.showSecondLockup=!1}render(){const e="100%"===this.imageProportion,t="left"===this.imagePosition,g={"text-image":!0,"text-image--full-width":e,"text-image--side-by-side":!e,"text-image--image-left":t&&!e,"text-image--image-right":!t&&!e,["text-image--proportion-"+this.imageProportion.replace("/","-").replace("%","")]:!0},m=(e=!1)=>{const t=e?"second-":"";return a("div",{class:"text-image__lockup "+(e?"text-image__lockup--second":"")},a("div",{class:"text-image__copy"},a("div",{class:"text-image__heading"},a("slot",{name:e?"second-heading":void 0})),a("div",{class:"text-image__description"},a("slot",{name:t+"description"}))),a("div",{class:"text-image__buttons"},a("slot",{name:t+"buttons"})))},s=()=>this.src?a("div",{class:"text-image__image-wrapper"},a("af-image",{src:this.src,alt:this.alt})):null;if(e)return a(i,null,a("div",{class:g},a("div",{class:"text-image__content"},m(),this.showSecondLockup&&m(!0)),s()));const x=a("div",{class:"text-image__content"},m(),this.showSecondLockup&&m(!0)),o=s();return a(i,null,a("div",{class:g},t?[o,x]:[x,o]))}static get style(){return".sc-af-text-image-h{display:block;width:100%}.text-image.sc-af-text-image{display:flex;width:100%}.text-image--side-by-side.sc-af-text-image{flex-direction:row;align-items:flex-start;gap:var(--space-8, 32px)}.text-image--image-left.sc-af-text-image{flex-direction:row}.text-image--image-right.sc-af-text-image{flex-direction:row}.text-image--full-width.sc-af-text-image{flex-direction:column;gap:var(--space-8, 32px)}.text-image__content.sc-af-text-image{display:flex;flex-direction:column;gap:56px;flex:1;min-width:0}.text-image--proportion-1-2.sc-af-text-image .text-image__content.sc-af-text-image{flex:1}.text-image--proportion-1-3.sc-af-text-image .text-image__content.sc-af-text-image{flex:2}.text-image--proportion-1-4.sc-af-text-image .text-image__content.sc-af-text-image{flex:3}.text-image--proportion-100.sc-af-text-image .text-image__content.sc-af-text-image{flex:none;width:100%}.text-image--image-right.sc-af-text-image .text-image__content.sc-af-text-image{padding-right:var(--space-8, 32px)}.text-image--image-left.sc-af-text-image .text-image__content.sc-af-text-image{padding-left:var(--space-8, 32px)}.text-image--full-width.sc-af-text-image .text-image__content.sc-af-text-image{padding:0}.text-image__lockup.sc-af-text-image{display:flex;flex-direction:column;gap:var(--space-4, 16px);width:100%}.text-image__copy.sc-af-text-image{display:flex;flex-direction:column;gap:var(--space-4, 16px);max-width:840px;width:100%}.text-image__heading.sc-af-text-image{font-family:var(--typography-headingfont, 'NeuSans', sans-serif);font-weight:var(--font-weight-book, 500);font-size:var(--font-size-heading-3-desktop, 34px);line-height:var(--line-height-heading-tight, 1);letter-spacing:var(--letter-spacing-heading, -0.02em);color:var(--af-typography-heading-primary, #14343B);white-space:normal}.text-image__heading.sc-af-text-image:empty{display:none}.text-image__description.sc-af-text-image{font-family:var(--typography-bodyfont, 'NeuSans', sans-serif);font-weight:var(--font-weight-regular, 400);font-size:var(--font-size-body-large, 18px);line-height:var(--line-height-body-large, 26px);color:var(--af-typography-body-default, #2B484F);white-space:normal}.text-image__description.sc-af-text-image:empty{display:none}.text-image__buttons.sc-af-text-image{display:block}.text-image__buttons.sc-af-text-image:empty{display:none}.text-image__image-wrapper.sc-af-text-image{flex-shrink:0;overflow:hidden;border-radius:var(--radius-md, 12px)}.text-image--proportion-1-2.sc-af-text-image .text-image__image-wrapper.sc-af-text-image{flex:1;min-width:0}.text-image--proportion-1-3.sc-af-text-image .text-image__image-wrapper.sc-af-text-image{flex:1;min-width:0}.text-image--proportion-1-4.sc-af-text-image .text-image__image-wrapper.sc-af-text-image{flex:1;min-width:0}.text-image--proportion-100.sc-af-text-image .text-image__image-wrapper.sc-af-text-image{width:100%}@media (max-width: 768px){.text-image--side-by-side.sc-af-text-image{flex-direction:column;gap:var(--space-6, 24px)}.text-image--image-left.sc-af-text-image,.text-image--image-right.sc-af-text-image{flex-direction:column}.text-image--image-right.sc-af-text-image .text-image__content.sc-af-text-image,.text-image--image-left.sc-af-text-image .text-image__content.sc-af-text-image{padding:0}.text-image__content.sc-af-text-image,.text-image__image-wrapper.sc-af-text-image{flex:none !important;width:100%}.text-image__heading.sc-af-text-image{font-size:var(--font-size-heading-3-mobile, 25px)}.text-image--proportion-100.sc-af-text-image .text-image__description.sc-af-text-image{font-size:var(--font-size-body-medium, 16px);line-height:var(--line-height-body-medium, 24px)}.text-image--proportion-100.sc-af-text-image .text-image__lockup.sc-af-text-image{gap:var(--space-3, 12px)}.text-image--proportion-100.sc-af-text-image .text-image__copy.sc-af-text-image{gap:var(--space-3, 12px)}.text-image__image-wrapper.sc-af-text-image{border-radius:var(--radius-sm, 8px)}}.sc-af-text-image-s>*{margin:0}.sc-af-text-image-s>p{margin:0}"}},[262,"af-text-image",{imagePosition:[1,"image-position"],imageProportion:[1,"image-proportion"],src:[1],alt:[1],showSecondLockup:[4,"show-second-lockup"]}]),x=s,o=function(){"undefined"!=typeof customElements&&["af-text-image","af-image"].forEach((e=>{switch(e){case"af-text-image":customElements.get(g(e))||customElements.define(g(e),s);break;case"af-image":customElements.get(g(e))||m()}}))};export{x as AfTextImage,o as defineCustomElement}
+import { p as proxyCustomElement, H, h, c as Host } from './p-BBpihWJI.js';
+import { d as defineCustomElement$2 } from './p-CVYQKqKI.js';
+const afTextImageCss = ".sc-af-text-image-h{display:block;width:100%}.text-image.sc-af-text-image{display:flex;width:100%}.text-image--side-by-side.sc-af-text-image{flex-direction:row;align-items:flex-start;gap:var(--space-8, 32px)}.text-image--image-left.sc-af-text-image{flex-direction:row}.text-image--image-right.sc-af-text-image{flex-direction:row}.text-image--full-width.sc-af-text-image{flex-direction:column;gap:var(--space-8, 32px)}.text-image__content.sc-af-text-image{display:flex;flex-direction:column;gap:56px;flex:1;min-width:0}.text-image--proportion-1-2.sc-af-text-image .text-image__content.sc-af-text-image{flex:1}.text-image--proportion-1-3.sc-af-text-image .text-image__content.sc-af-text-image{flex:2}.text-image--proportion-1-4.sc-af-text-image .text-image__content.sc-af-text-image{flex:3}.text-image--proportion-100.sc-af-text-image .text-image__content.sc-af-text-image{flex:none;width:100%}.text-image--image-right.sc-af-text-image .text-image__content.sc-af-text-image{padding-right:var(--space-8, 32px)}.text-image--image-left.sc-af-text-image .text-image__content.sc-af-text-image{padding-left:var(--space-8, 32px)}.text-image--full-width.sc-af-text-image .text-image__content.sc-af-text-image{padding:0}.text-image__lockup.sc-af-text-image{display:flex;flex-direction:column;gap:var(--space-4, 16px);width:100%}.text-image__copy.sc-af-text-image{display:flex;flex-direction:column;gap:var(--space-4, 16px);max-width:840px;width:100%}.text-image__heading.sc-af-text-image{font-family:var(--typography-headingfont, 'NeuSans', sans-serif);font-weight:var(--font-weight-book, 500);font-size:var(--font-size-heading-3-desktop, 34px);line-height:var(--line-height-heading-tight, 1);letter-spacing:var(--letter-spacing-heading, -0.02em);color:var(--af-typography-heading-primary, #14343B);white-space:normal}.text-image__heading.sc-af-text-image:empty{display:none}.text-image__description.sc-af-text-image{font-family:var(--typography-bodyfont, 'NeuSans', sans-serif);font-weight:var(--font-weight-regular, 400);font-size:var(--font-size-body-large, 18px);line-height:var(--line-height-body-large, 26px);color:var(--af-typography-body-default, #2B484F);white-space:normal}.text-image__description.sc-af-text-image:empty{display:none}.text-image__buttons.sc-af-text-image{display:block}.text-image__buttons.sc-af-text-image:empty{display:none}.text-image__image-wrapper.sc-af-text-image{flex-shrink:0;overflow:hidden;border-radius:var(--radius-md, 12px)}.text-image--proportion-1-2.sc-af-text-image .text-image__image-wrapper.sc-af-text-image{flex:1;min-width:0}.text-image--proportion-1-3.sc-af-text-image .text-image__image-wrapper.sc-af-text-image{flex:1;min-width:0}.text-image--proportion-1-4.sc-af-text-image .text-image__image-wrapper.sc-af-text-image{flex:1;min-width:0}.text-image--proportion-100.sc-af-text-image .text-image__image-wrapper.sc-af-text-image{width:100%}@media (max-width: 768px){.text-image--side-by-side.sc-af-text-image{flex-direction:column;gap:var(--space-6, 24px)}.text-image--image-left.sc-af-text-image,.text-image--image-right.sc-af-text-image{flex-direction:column}.text-image--image-right.sc-af-text-image .text-image__content.sc-af-text-image,.text-image--image-left.sc-af-text-image .text-image__content.sc-af-text-image{padding:0}.text-image__content.sc-af-text-image,.text-image__image-wrapper.sc-af-text-image{flex:none !important;width:100%}.text-image__heading.sc-af-text-image{font-size:var(--font-size-heading-3-mobile, 25px)}.text-image--proportion-100.sc-af-text-image .text-image__description.sc-af-text-image{font-size:var(--font-size-body-medium, 16px);line-height:var(--line-height-body-medium, 24px)}.text-image--proportion-100.sc-af-text-image .text-image__lockup.sc-af-text-image{gap:var(--space-3, 12px)}.text-image--proportion-100.sc-af-text-image .text-image__copy.sc-af-text-image{gap:var(--space-3, 12px)}.text-image__image-wrapper.sc-af-text-image{border-radius:var(--radius-sm, 8px)}}.sc-af-text-image-s>*{margin:0}.sc-af-text-image-s>p{margin:0}";
+const AfTextImage$1 = /*@__PURE__*/ proxyCustomElement(class AfTextImage extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        /**
+         * Position of the image relative to the text content
+         */
+        this.imagePosition = 'right';
+        /**
+         * Proportion of the image in the layout
+         * - '1/2': Image and text each take half the width (50/50)
+         * - '1/3': Image takes 1/3 of the width (text takes 2/3)
+         * - '1/4': Image takes 1/4 of the width (text takes 3/4)
+         * - '100%': Image takes full width below text
+         */
+        this.imageProportion = '1/3';
+        /**
+         * Image alt text for accessibility
+         */
+        this.alt = '';
+        /**
+         * Whether to show a second typography lockup section
+         */
+        this.showSecondLockup = false;
+    }
+    render() {
+        const isFullWidth = this.imageProportion === '100%';
+        const isImageLeft = this.imagePosition === 'left';
+        const containerClasses = {
+            'text-image': true,
+            'text-image--full-width': isFullWidth,
+            'text-image--side-by-side': !isFullWidth,
+            'text-image--image-left': isImageLeft && !isFullWidth,
+            'text-image--image-right': !isImageLeft && !isFullWidth,
+            [`text-image--proportion-${this.imageProportion.replace('/', '-').replace('%', '')}`]: true,
+        };
+        const renderTypographyLockup = (isSecond = false) => {
+            const prefix = isSecond ? 'second-' : '';
+            return (h("div", { class: `text-image__lockup ${isSecond ? 'text-image__lockup--second' : ''}` }, h("div", { class: "text-image__copy" }, h("div", { class: "text-image__heading" }, h("slot", { name: isSecond ? 'second-heading' : undefined })), h("div", { class: "text-image__description" }, h("slot", { name: `${prefix}description` }))), h("div", { class: "text-image__buttons" }, h("slot", { name: `${prefix}buttons` }))));
+        };
+        const renderImage = () => {
+            if (!this.src)
+                return null;
+            return (h("div", { class: "text-image__image-wrapper" }, h("af-image", { src: this.src, alt: this.alt })));
+        };
+        // For full-width layout, text is always above image
+        if (isFullWidth) {
+            return (h(Host, null, h("div", { class: containerClasses }, h("div", { class: "text-image__content" }, renderTypographyLockup(), this.showSecondLockup && renderTypographyLockup(true)), renderImage())));
+        }
+        // For side-by-side layouts
+        const textContent = (h("div", { class: "text-image__content" }, renderTypographyLockup(), this.showSecondLockup && renderTypographyLockup(true)));
+        const imageContent = renderImage();
+        return (h(Host, null, h("div", { class: containerClasses }, isImageLeft ? ([imageContent, textContent]) : ([textContent, imageContent]))));
+    }
+    static get style() { return afTextImageCss; }
+}, [262, "af-text-image", {
+        "imagePosition": [1, "image-position"],
+        "imageProportion": [1, "image-proportion"],
+        "src": [1],
+        "alt": [1],
+        "showSecondLockup": [4, "show-second-lockup"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["af-text-image", "af-image"];
+    components.forEach(tagName => { switch (tagName) {
+        case "af-text-image":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AfTextImage$1);
+            }
+            break;
+        case "af-image":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+const AfTextImage = AfTextImage$1;
+const defineCustomElement = defineCustomElement$1;
+export { AfTextImage, defineCustomElement };
+//# sourceMappingURL=af-text-image.js.map
+//# sourceMappingURL=af-text-image.js.map

package/dist/components/af-text-image.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"af-text-image.js","mappings":"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","names":["AfTextImage","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-text-image/af-text-image.css?tag=af-text-image&encapsulation=scoped","src/components/af-text-image/af-text-image.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n}\n\n/* ==========================================================================\n Container Layout\n ========================================================================== */\n\n.text-image {\n display: flex;\n width: 100%;\n}\n\n/* Side-by-side layout (default for 1/3 and 1/4 proportions) */\n.text-image--side-by-side {\n flex-direction: row;\n align-items: flex-start;\n gap: var(--space-8, 32px);\n}\n\n/* DOM order is controlled from the TSX (image first for image-left, text\n first for image-right), so both variants use plain row flow. */\n.text-image--image-left {\n flex-direction: row;\n}\n\n.text-image--image-right {\n flex-direction: row;\n}\n\n/* Full-width layout (100% proportion) */\n.text-image--full-width {\n flex-direction: column;\n gap: var(--space-8, 32px);\n}\n\n/* ==========================================================================\n Content Area (Typography Lockups Container)\n ========================================================================== */\n\n.text-image__content {\n display: flex;\n flex-direction: column;\n gap: 56px;\n flex: 1;\n min-width: 0;\n}\n\n/* Proportion-based content sizing for side-by-side */\n.text-image--proportion-1-2 .text-image__content {\n flex: 1;\n}\n\n.text-image--proportion-1-3 .text-image__content {\n flex: 2;\n}\n\n.text-image--proportion-1-4 .text-image__content {\n flex: 3;\n}\n\n.text-image--proportion-100 .text-image__content {\n flex: none;\n width: 100%;\n}\n\n/* Padding for content when image is on opposite side */\n.text-image--image-right .text-image__content {\n padding-right: var(--space-8, 32px);\n}\n\n.text-image--image-left .text-image__content {\n padding-left: var(--space-8, 32px);\n}\n\n.text-image--full-width .text-image__content {\n padding: 0;\n}\n\n/* ==========================================================================\n Typography Lockup\n ========================================================================== */\n\n.text-image__lockup {\n display: flex;\n flex-direction: column;\n gap: var(--space-4, 16px);\n width: 100%;\n}\n\n.text-image__copy {\n display: flex;\n flex-direction: column;\n gap: var(--space-4, 16px);\n max-width: 840px;\n width: 100%;\n}\n\n/* Heading styles - inherits color from theme context */\n.text-image__heading {\n font-family: var(--typography-headingfont, 'NeuSans', sans-serif);\n font-weight: var(--font-weight-book, 500);\n font-size: var(--font-size-heading-3-desktop, 34px);\n line-height: var(--line-height-heading-tight, 1);\n letter-spacing: var(--letter-spacing-heading, -0.02em);\n color: var(--af-typography-heading-primary, #14343B);\n white-space: normal;\n}\n\n.text-image__heading:empty {\n display: none;\n}\n\n/* Description/body text - inherits color from theme context */\n.text-image__description {\n font-family: var(--typography-bodyfont, 'NeuSans', sans-serif);\n font-weight: var(--font-weight-regular, 400);\n font-size: var(--font-size-body-large, 18px);\n line-height: var(--line-height-body-large, 26px);\n color: var(--af-typography-body-default, #2B484F);\n white-space: normal;\n}\n\n.text-image__description:empty {\n display: none;\n}\n\n/* Buttons section - wrapper for slotted ButtonGroup */\n.text-image__buttons {\n display: block;\n}\n\n.text-image__buttons:empty {\n display: none;\n}\n\n/* ==========================================================================\n Image Area\n ========================================================================== */\n\n.text-image__image-wrapper {\n flex-shrink: 0;\n overflow: hidden;\n border-radius: var(--radius-md, 12px);\n}\n\n/* Proportion-based image sizing for side-by-side */\n.text-image--proportion-1-2 .text-image__image-wrapper {\n flex: 1;\n min-width: 0;\n}\n\n.text-image--proportion-1-3 .text-image__image-wrapper {\n flex: 1;\n min-width: 0;\n}\n\n.text-image--proportion-1-4 .text-image__image-wrapper {\n flex: 1;\n min-width: 0;\n}\n\n.text-image--proportion-100 .text-image__image-wrapper {\n width: 100%;\n}\n\n/* ==========================================================================\n Mobile Responsive Styles\n ========================================================================== */\n\n/* mobile-only */\n@media (max-width: 768px) {\n /* Stack everything vertically on mobile */\n .text-image--side-by-side {\n flex-direction: column;\n gap: var(--space-6, 24px);\n }\n\n /* Reset order - text always first on mobile */\n .text-image--image-left,\n .text-image--image-right {\n flex-direction: column;\n }\n\n /* Remove side padding on mobile */\n .text-image--image-right .text-image__content,\n .text-image--image-left .text-image__content {\n padding: 0;\n }\n\n /* Full width for all proportions on mobile */\n .text-image__content,\n .text-image__image-wrapper {\n flex: none !important;\n width: 100%;\n }\n\n /* Smaller heading on mobile */\n .text-image__heading {\n font-size: var(--font-size-heading-3-mobile, 25px);\n }\n\n /* Smaller body text for full-width on mobile */\n .text-image--proportion-100 .text-image__description {\n font-size: var(--font-size-body-medium, 16px);\n line-height: var(--line-height-body-medium, 24px);\n }\n\n /* On mobile, ButtonGroup handles its own responsive behavior */\n\n /* Smaller lockup gap on mobile for full-width */\n .text-image--proportion-100 .text-image__lockup {\n gap: var(--space-3, 12px);\n }\n\n .text-image--proportion-100 .text-image__copy {\n gap: var(--space-3, 12px);\n }\n\n /* Smaller border radius on mobile */\n .text-image__image-wrapper {\n border-radius: var(--radius-sm, 8px);\n }\n}\n\n/* ==========================================================================\n Slot Content Styling\n ========================================================================== */\n\n::slotted(*) {\n margin: 0;\n}\n\n::slotted(p) {\n margin: 0;\n}\n\n\n\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * TextImage composite component that combines typography content with an image.\n * Supports various layout configurations with image position and proportion options.\n */\n@Component({\n tag: 'af-text-image',\n styleUrl: 'af-text-image.css',\n shadow: false,\n scoped: true,\n})\nexport class AfTextImage {\n /**\n * Position of the image relative to the text content\n */\n @Prop() imagePosition: 'left' | 'right' = 'right';\n\n /**\n * Proportion of the image in the layout\n * - '1/2': Image and text each take half the width (50/50)\n * - '1/3': Image takes 1/3 of the width (text takes 2/3)\n * - '1/4': Image takes 1/4 of the width (text takes 3/4)\n * - '100%': Image takes full width below text\n */\n @Prop() imageProportion: '1/2' | '1/3' | '1/4' | '100%' = '1/3';\n\n /**\n * Image source URL\n */\n @Prop() src?: string;\n\n /**\n * Image alt text for accessibility\n */\n @Prop() alt: string = '';\n\n /**\n * Whether to show a second typography lockup section\n */\n @Prop() showSecondLockup: boolean = false;\n\n render() {\n const isFullWidth = this.imageProportion === '100%';\n const isImageLeft = this.imagePosition === 'left';\n\n const containerClasses = {\n 'text-image': true,\n 'text-image--full-width': isFullWidth,\n 'text-image--side-by-side': !isFullWidth,\n 'text-image--image-left': isImageLeft && !isFullWidth,\n 'text-image--image-right': !isImageLeft && !isFullWidth,\n [`text-image--proportion-${this.imageProportion.replace('/', '-').replace('%', '')}`]: true,\n };\n\n const renderTypographyLockup = (isSecond: boolean = false) => {\n const prefix = isSecond ? 'second-' : '';\n return (\n <div class={`text-image__lockup ${isSecond ? 'text-image__lockup--second' : ''}`}>\n <div class=\"text-image__copy\">\n <div class=\"text-image__heading\">\n <slot name={isSecond ? 'second-heading' : undefined}></slot>\n </div>\n <div class=\"text-image__description\">\n <slot name={`${prefix}description`}></slot>\n </div>\n </div>\n <div class=\"text-image__buttons\">\n <slot name={`${prefix}buttons`}></slot>\n </div>\n </div>\n );\n };\n\n const renderImage = () => {\n if (!this.src) return null;\n return (\n <div class=\"text-image__image-wrapper\">\n <af-image src={this.src} alt={this.alt}></af-image>\n </div>\n );\n };\n\n // For full-width layout, text is always above image\n if (isFullWidth) {\n return (\n <Host>\n <div class={containerClasses}>\n <div class=\"text-image__content\">\n {renderTypographyLockup()}\n {this.showSecondLockup && renderTypographyLockup(true)}\n </div>\n {renderImage()}\n </div>\n </Host>\n );\n }\n\n // For side-by-side layouts\n const textContent = (\n <div class=\"text-image__content\">\n {renderTypographyLockup()}\n {this.showSecondLockup && renderTypographyLockup(true)}\n </div>\n );\n\n const imageContent = renderImage();\n\n return (\n <Host>\n <div class={containerClasses}>\n {isImageLeft ? (\n [imageContent, textContent]\n ) : (\n [textContent, imageContent]\n )}\n </div>\n </Host>\n );\n }\n}\n\n\n\n"],"version":3}

package/dist/components/af-text.js CHANGED Viewed

@@ -1 +1,9 @@
-import{A as o,d as p}from"./p-DRm58pvc.js";const s=o,m=p;export{s as AfText,m as defineCustomElement}
+import { A as AfText$1, d as defineCustomElement$1 } from './p-BQ1El6-J.js';
+const AfText = AfText$1;
+const defineCustomElement = defineCustomElement$1;
+export { AfText, defineCustomElement };
+//# sourceMappingURL=af-text.js.map
+//# sourceMappingURL=af-text.js.map

package/dist/components/af-text.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"af-text.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/af-textarea.js CHANGED Viewed

@@ -1 +1,9 @@
-import{A as o,d as s}from"./p-CVQiSujq.js";const p=o,r=s;export{p as AfTextarea,r as defineCustomElement}
+import { A as AfTextarea$1, d as defineCustomElement$1 } from './p-D-Xf1-qQ.js';
+const AfTextarea = AfTextarea$1;
+const defineCustomElement = defineCustomElement$1;
+export { AfTextarea, defineCustomElement };
+//# sourceMappingURL=af-textarea.js.map
+//# sourceMappingURL=af-textarea.js.map

package/dist/components/af-textarea.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"af-textarea.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/af-theme-override.js CHANGED Viewed

@@ -1 +1,44 @@
-import{p as r,H as a,h as o,c as e,t as f}from"./p-DsNqeD3z.js";const n=r(class extends a{constructor(r){super(),!1!==r&&this.__registerHost(),this.theme="white"}render(){return o(e,{key:"0dbebde89199b19c6716b0e521026ec82ae42ee5"},o("div",{key:"a8a5761b4ce5d48bc52579c995fde8f15f154aac",class:"theme-override theme-"+this.theme},o("slot",{key:"f2f30666635125d26438b8b5da72493830f226b7"})))}static get style(){return".sc-af-theme-override-h{display:contents}.theme-override.sc-af-theme-override{display:contents}.theme-white.sc-af-theme-override{--af-background-base:var(--colour-brand-white, #FFFFFF);--af-background-base-hover:var(--colour-mistgreen-100, #f4f7f6);--af-background-contrast:var(--colour-brand-mist-green, #c6d5d1);--af-background-level-1:var(--colour-mistgreen-200, #e8eeed);--af-background-level-1-hover:var(--colour-mistgreen-300, #dde6e3);--af-background-border-subtle:var(--colour-mistgreen-200, #e8eeed);--af-background-border-default:var(--colour-mistgreen-400, #d1ddda);--af-background-border-heavy:var(--colour-mistgreen-500, #c6d5d1);--af-background-border-active:var(--colour-softclay-800, #8a7049);--af-background-icon-default:var(--colour-brand-inkwell, #14343b);--af-background-icon-accent:var(--colour-brand-soft-clay, #b09670);--af-typography-heading-primary:var(--colour-brand-inkwell, #14343b);--af-typography-heading-secondary:var(--colour-brand-soft-clay, #b09670);--af-typography-body-dark:var(--colour-brand-inkwell, #14343b);--af-typography-body-default:var(--colour-inkwell-400, #2b484f);--af-typography-body-subtle:var(--colour-inkwell-350, #60767b);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-icon:var(--colour-brand-inkwell, #14343b);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(0, 0, 0, 0.08);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-text:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-icon:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-stroke:var(--colour-brand-soft-clay, #B09670);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-brand-white, #ffffff);--af-input-bg-hover:var(--colour-mistgreen-100, #f4f7f6);--af-input-bg-disabled:var(--af-background-level-1);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--af-typography-body-dark);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--af-typography-body-dark);--af-form-control-bg:var(--colour-brand-white, #ffffff);--af-form-control-bg-checked:var(--colour-brand-inkwell, #14343b);--af-form-control-bg-disabled:var(--colour-mistgreen-200, #e8ebeb);--af-form-control-bg-checked-disabled:var(--colour-inkwell-350, #708380);--af-form-control-stroke:var(--colour-mistgreen-500, #d0d6d8);--af-form-control-stroke-hover:var(--colour-brand-inkwell, #14343b);--af-form-control-stroke-disabled:var(--colour-mistgreen-500, #d0d6d8);--af-form-control-icon:var(--colour-brand-white, #ffffff);--af-form-control-label:var(--colour-brand-inkwell, #14343b)}.theme-inkwell.sc-af-theme-override{--af-background-base:var(--colour-brand-inkwell, #14343b);--af-background-base-hover:var(--colour-inkwell-600, #102a2f);--af-background-contrast:var(--colour-inkwell-700, #102a2f);--af-background-level-1:var(--colour-inkwell-450, #203e45);--af-background-level-1-hover:var(--colour-inkwell-400, #2b484f);--af-background-border-subtle:var(--colour-inkwell-450, #203e45);--af-background-border-default:var(--colour-inkwell-400, #2b484f);--af-background-border-heavy:var(--colour-inkwell-700, #102a2f);--af-background-border-active:var(--colour-brand-ice, #a6fffb);--af-background-icon-default:var(--colour-brand-white, #ffffff);--af-background-icon-accent:var(--colour-brand-ice, #a6fffb);--af-typography-heading-primary:var(--colour-brand-mist-green, #c6d5d1);--af-typography-heading-secondary:var(--colour-brand-white, #ffffff);--af-typography-body-dark:var(--colour-brand-white, #ffffff);--af-typography-body-default:var(--colour-inkwell-100, #d0d6d8);--af-typography-body-subtle:var(--colour-inkwell-200, #a1aeb1);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-white, #ffffff);--af-button-secondary-icon:var(--colour-brand-white, #ffffff);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(255, 255, 255, 0.08);--af-button-secondary-stroke:var(--colour-brand-white, #ffffff);--af-button-tertiary-text:var(--colour-brand-white, #ffffff);--af-button-tertiary-icon:var(--colour-brand-white, #ffffff);--af-button-tertiary-stroke:var(--colour-brand-ice, #A6FFFB);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-inkwell-450, #203e45);--af-input-bg-hover:var(--colour-inkwell-400, #2b484f);--af-input-bg-disabled:var(--colour-inkwell-600, #102a2f);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--colour-brand-ice, #a6fffb);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--colour-brand-ice, #a6fffb);--af-form-control-bg:var(--colour-inkwell-450, #203e45);--af-form-control-bg-checked:var(--colour-brand-mist-green, #c6d5d1);--af-form-control-bg-disabled:var(--colour-inkwell-400, #2b484f);--af-form-control-bg-checked-disabled:var(--colour-mistgreen-700, #9eaaa7);--af-form-control-stroke:var(--colour-inkwell-350, #60767b);--af-form-control-stroke-hover:var(--colour-brand-white, #ffffff);--af-form-control-stroke-disabled:var(--colour-inkwell-400, #2b484f);--af-form-control-icon:var(--colour-brand-inkwell, #14343b);--af-form-control-label:var(--colour-brand-white, #ffffff)}.theme-mist-green.sc-af-theme-override{--af-background-base:var(--colour-brand-mist-green, #c6d5d1);--af-background-base-hover:var(--colour-mistgreen-600, #b2c0bc);--af-background-contrast:var(--colour-brand-soft-clay, #b09670);--af-background-level-1:var(--colour-mistgreen-300, #dde6e3);--af-background-level-1-hover:var(--colour-mistgreen-400, #d1ddda);--af-background-border-subtle:var(--colour-mistgreen-600, #b2c0bc);--af-background-border-default:var(--colour-mistgreen-700, #9eaaa7);--af-background-border-heavy:var(--colour-mistgreen-700, #9eaaa7);--af-background-border-active:var(--colour-softclay-800, #8a7049);--af-background-icon-default:var(--colour-brand-inkwell, #14343b);--af-background-icon-accent:var(--colour-brand-soft-clay, #b09670);--af-typography-heading-primary:var(--colour-brand-inkwell, #14343b);--af-typography-heading-secondary:var(--colour-brand-soft-clay, #b09670);--af-typography-body-dark:var(--colour-brand-inkwell, #14343b);--af-typography-body-default:var(--colour-inkwell-400, #2b484f);--af-typography-body-subtle:var(--colour-inkwell-350, #60767b);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-icon:var(--colour-brand-inkwell, #14343b);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(0, 0, 0, 0.08);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-text:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-icon:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-stroke:var(--colour-brand-soft-clay, #B09670);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-brand-white, #ffffff);--af-input-bg-hover:var(--colour-mistgreen-100, #f4f7f6);--af-input-bg-disabled:var(--af-background-level-1);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--af-typography-body-dark);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--af-typography-body-dark);--af-form-control-bg:var(--colour-brand-white, #ffffff);--af-form-control-bg-checked:var(--colour-brand-inkwell, #14343b);--af-form-control-bg-disabled:var(--colour-mistgreen-300, #dde6e3);--af-form-control-bg-checked-disabled:var(--colour-inkwell-350, #708380);--af-form-control-stroke:var(--colour-mistgreen-700, #9eaaa7);--af-form-control-stroke-hover:var(--colour-brand-inkwell, #14343b);--af-form-control-stroke-disabled:var(--colour-mistgreen-600, #b2c0bc);--af-form-control-icon:var(--colour-brand-white, #ffffff);--af-form-control-label:var(--colour-brand-inkwell, #14343b)}.theme-soft-clay.sc-af-theme-override{--af-background-base:var(--colour-softclay-400, #c0ab8d);--af-background-base-hover:var(--colour-softclay-500, #b09670);--af-background-contrast:var(--colour-brand-mist-green, #c6d5d1);--af-background-level-1:var(--colour-softclay-500, #b09670);--af-background-level-1-hover:var(--colour-softclay-600, #9e8765);--af-background-border-subtle:var(--colour-softclay-600, #9e8765);--af-background-border-default:var(--colour-softclay-700, #8d785a);--af-background-border-heavy:var(--colour-brand-inkwell, #14343b);--af-background-border-active:var(--colour-brand-ice, #a6fffb);--af-background-icon-default:var(--colour-brand-inkwell, #14343b);--af-background-icon-accent:var(--colour-brand-ivory-paper, #fff9ee);--af-typography-heading-primary:var(--colour-brand-inkwell, #14343b);--af-typography-heading-secondary:var(--colour-brand-ivory-paper, #fff9ee);--af-typography-body-dark:var(--colour-brand-inkwell, #14343b);--af-typography-body-default:var(--colour-inkwell-400, #2b484f);--af-typography-body-subtle:var(--colour-inkwell-350, #60767b);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-icon:var(--colour-brand-inkwell, #14343b);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(0, 0, 0, 0.08);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-text:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-icon:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-stroke:var(--colour-brand-inkwell, #14343b);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-brand-white, #ffffff);--af-input-bg-hover:var(--colour-mistgreen-100, #f4f7f6);--af-input-bg-disabled:var(--af-background-level-1);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--af-typography-body-dark);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--af-typography-body-dark);--af-form-control-bg:var(--colour-brand-white, #ffffff);--af-form-control-bg-checked:var(--colour-brand-inkwell, #14343b);--af-form-control-bg-disabled:var(--colour-softclay-300, #d0c1a8);--af-form-control-bg-checked-disabled:var(--colour-inkwell-350, #708380);--af-form-control-stroke:var(--colour-softclay-700, #8d785a);--af-form-control-stroke-hover:var(--colour-brand-inkwell, #14343b);--af-form-control-stroke-disabled:var(--colour-softclay-600, #9e8765);--af-form-control-icon:var(--colour-brand-white, #ffffff);--af-form-control-label:var(--colour-brand-inkwell, #14343b)}.theme-white-ivory.sc-af-theme-override{--af-background-base:var(--colour-brand-ivory-paper, #fff9ee);--af-background-base-hover:var(--colour-ivory-100, #fff5e0);--af-background-contrast:var(--colour-brand-mist-green, #c6d5d1);--af-background-level-1:var(--colour-ivory-200, #ffefcc);--af-background-level-1-hover:var(--colour-ivory-300, #ffe9b8);--af-background-border-subtle:var(--colour-ivory-200, #ffefcc);--af-background-border-default:var(--colour-ivory-400, #ffe3a3);--af-background-border-heavy:var(--colour-brand-soft-clay, #b09670);--af-background-border-active:var(--colour-brand-soft-clay, #b09670);--af-background-icon-default:var(--colour-brand-inkwell, #14343b);--af-background-icon-accent:var(--colour-brand-soft-clay, #b09670);--af-typography-heading-primary:var(--colour-brand-inkwell, #14343b);--af-typography-heading-secondary:var(--colour-brand-soft-clay, #b09670);--af-typography-body-dark:var(--colour-brand-inkwell, #14343b);--af-typography-body-default:var(--colour-inkwell-400, #2b484f);--af-typography-body-subtle:var(--colour-inkwell-350, #60767b);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-icon:var(--colour-brand-inkwell, #14343b);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(0, 0, 0, 0.08);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-text:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-icon:var(--colour-brand-inkwell, #14343b);--af-button-tertiary-stroke:var(--colour-brand-soft-clay, #b09670);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-brand-white, #ffffff);--af-input-bg-hover:var(--colour-ivory-100, #fff5e0);--af-input-bg-disabled:var(--af-background-level-1);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--af-typography-body-dark);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--af-typography-body-dark);--af-form-control-bg:var(--colour-brand-white, #ffffff);--af-form-control-bg-checked:var(--colour-brand-inkwell, #14343b);--af-form-control-bg-disabled:var(--colour-ivory-200, #ffefcc);--af-form-control-bg-checked-disabled:var(--colour-inkwell-350, #708380);--af-form-control-stroke:var(--colour-ivory-400, #ffe3a3);--af-form-control-stroke-hover:var(--colour-brand-inkwell, #14343b);--af-form-control-stroke-disabled:var(--colour-ivory-300, #ffe9b8);--af-form-control-icon:var(--colour-brand-white, #ffffff);--af-form-control-label:var(--colour-brand-inkwell, #14343b)}"}},[262,"af-theme-override",{theme:[1]}]),t=n,b=function(){"undefined"!=typeof customElements&&["af-theme-override"].forEach((r=>{"af-theme-override"===r&&(customElements.get(f(r))||customElements.define(f(r),n))}))};export{t as AfThemeOverride,b as defineCustomElement}
+import { p as proxyCustomElement, H, h, c as Host } from './p-BBpihWJI.js';
+const afThemeOverrideCss = ".sc-af-theme-override-h{display:contents}.theme-override.sc-af-theme-override{display:contents}.theme-white.sc-af-theme-override{--af-background-base:var(--colour-brand-white, #FFFFFF);--af-background-base-hover:var(--colour-mistgreen-100, #f4f7f6);--af-background-contrast:var(--colour-brand-mist-green, #c6d5d1);--af-background-level-1:var(--colour-mistgreen-200, #e8eeed);--af-background-level-1-hover:var(--colour-mistgreen-300, #dde6e3);--af-background-border-subtle:var(--colour-mistgreen-200, #e8eeed);--af-background-border-default:var(--colour-mistgreen-400, #d1ddda);--af-background-border-heavy:var(--colour-mistgreen-500, #c6d5d1);--af-background-border-active:var(--colour-softclay-800, #8a7049);--af-background-icon-default:var(--colour-brand-inkwell, #14343b);--af-background-icon-accent:var(--colour-brand-soft-clay, #b09670);--af-typography-heading-primary:var(--colour-brand-inkwell, #14343b);--af-typography-heading-secondary:var(--colour-brand-soft-clay, #b09670);--af-typography-body-dark:var(--colour-brand-inkwell, #14343b);--af-typography-body-default:var(--colour-inkwell-400, #2b484f);--af-typography-body-subtle:var(--colour-inkwell-350, #60767b);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-icon:var(--colour-brand-inkwell, #14343b);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(0, 0, 0, 0.08);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-ghost-text:var(--colour-brand-inkwell, #14343b);--af-button-ghost-icon:var(--colour-brand-inkwell, #14343b);--af-button-ghost-stroke:var(--colour-brand-soft-clay, #B09670);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-brand-white, #ffffff);--af-input-bg-hover:var(--colour-mistgreen-100, #f4f7f6);--af-input-bg-disabled:var(--af-background-level-1);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--af-typography-body-dark);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--af-typography-body-dark);--af-form-control-bg:var(--colour-brand-white, #ffffff);--af-form-control-bg-checked:var(--colour-brand-inkwell, #14343b);--af-form-control-bg-disabled:var(--colour-mistgreen-200, #e8ebeb);--af-form-control-bg-checked-disabled:var(--colour-inkwell-350, #708380);--af-form-control-stroke:var(--colour-mistgreen-500, #d0d6d8);--af-form-control-stroke-hover:var(--colour-brand-inkwell, #14343b);--af-form-control-stroke-disabled:var(--colour-mistgreen-500, #d0d6d8);--af-form-control-icon:var(--colour-brand-white, #ffffff);--af-form-control-label:var(--colour-brand-inkwell, #14343b)}.theme-inkwell.sc-af-theme-override{--af-background-base:var(--colour-brand-inkwell, #14343b);--af-background-base-hover:var(--colour-inkwell-600, #102a2f);--af-background-contrast:var(--colour-inkwell-700, #102a2f);--af-background-level-1:var(--colour-inkwell-450, #203e45);--af-background-level-1-hover:var(--colour-inkwell-400, #2b484f);--af-background-border-subtle:var(--colour-inkwell-450, #203e45);--af-background-border-default:var(--colour-inkwell-400, #2b484f);--af-background-border-heavy:var(--colour-inkwell-700, #102a2f);--af-background-border-active:var(--colour-brand-ice, #a6fffb);--af-background-icon-default:var(--colour-brand-white, #ffffff);--af-background-icon-accent:var(--colour-brand-ice, #a6fffb);--af-typography-heading-primary:var(--colour-brand-mist-green, #c6d5d1);--af-typography-heading-secondary:var(--colour-brand-white, #ffffff);--af-typography-body-dark:var(--colour-brand-white, #ffffff);--af-typography-body-default:var(--colour-inkwell-100, #d0d6d8);--af-typography-body-subtle:var(--colour-inkwell-200, #a1aeb1);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-white, #ffffff);--af-button-secondary-icon:var(--colour-brand-white, #ffffff);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(255, 255, 255, 0.08);--af-button-secondary-stroke:var(--colour-brand-white, #ffffff);--af-button-ghost-text:var(--colour-brand-white, #ffffff);--af-button-ghost-icon:var(--colour-brand-white, #ffffff);--af-button-ghost-stroke:var(--colour-brand-ice, #A6FFFB);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-inkwell-450, #203e45);--af-input-bg-hover:var(--colour-inkwell-400, #2b484f);--af-input-bg-disabled:var(--colour-inkwell-600, #102a2f);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--colour-brand-ice, #a6fffb);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--colour-brand-ice, #a6fffb);--af-form-control-bg:var(--colour-inkwell-450, #203e45);--af-form-control-bg-checked:var(--colour-brand-mist-green, #c6d5d1);--af-form-control-bg-disabled:var(--colour-inkwell-400, #2b484f);--af-form-control-bg-checked-disabled:var(--colour-mistgreen-700, #9eaaa7);--af-form-control-stroke:var(--colour-inkwell-350, #60767b);--af-form-control-stroke-hover:var(--colour-brand-white, #ffffff);--af-form-control-stroke-disabled:var(--colour-inkwell-400, #2b484f);--af-form-control-icon:var(--colour-brand-inkwell, #14343b);--af-form-control-label:var(--colour-brand-white, #ffffff)}.theme-mist-green.sc-af-theme-override{--af-background-base:var(--colour-brand-mist-green, #c6d5d1);--af-background-base-hover:var(--colour-mistgreen-600, #b2c0bc);--af-background-contrast:var(--colour-brand-soft-clay, #b09670);--af-background-level-1:var(--colour-mistgreen-300, #dde6e3);--af-background-level-1-hover:var(--colour-mistgreen-400, #d1ddda);--af-background-border-subtle:var(--colour-mistgreen-600, #b2c0bc);--af-background-border-default:var(--colour-mistgreen-700, #9eaaa7);--af-background-border-heavy:var(--colour-mistgreen-700, #9eaaa7);--af-background-border-active:var(--colour-softclay-800, #8a7049);--af-background-icon-default:var(--colour-brand-inkwell, #14343b);--af-background-icon-accent:var(--colour-brand-soft-clay, #b09670);--af-typography-heading-primary:var(--colour-brand-inkwell, #14343b);--af-typography-heading-secondary:var(--colour-brand-soft-clay, #b09670);--af-typography-body-dark:var(--colour-brand-inkwell, #14343b);--af-typography-body-default:var(--colour-inkwell-400, #2b484f);--af-typography-body-subtle:var(--colour-inkwell-350, #60767b);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-icon:var(--colour-brand-inkwell, #14343b);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(0, 0, 0, 0.08);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-ghost-text:var(--colour-brand-inkwell, #14343b);--af-button-ghost-icon:var(--colour-brand-inkwell, #14343b);--af-button-ghost-stroke:var(--colour-brand-soft-clay, #B09670);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-brand-white, #ffffff);--af-input-bg-hover:var(--colour-mistgreen-100, #f4f7f6);--af-input-bg-disabled:var(--af-background-level-1);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--af-typography-body-dark);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--af-typography-body-dark);--af-form-control-bg:var(--colour-brand-white, #ffffff);--af-form-control-bg-checked:var(--colour-brand-inkwell, #14343b);--af-form-control-bg-disabled:var(--colour-mistgreen-300, #dde6e3);--af-form-control-bg-checked-disabled:var(--colour-inkwell-350, #708380);--af-form-control-stroke:var(--colour-mistgreen-700, #9eaaa7);--af-form-control-stroke-hover:var(--colour-brand-inkwell, #14343b);--af-form-control-stroke-disabled:var(--colour-mistgreen-600, #b2c0bc);--af-form-control-icon:var(--colour-brand-white, #ffffff);--af-form-control-label:var(--colour-brand-inkwell, #14343b)}.theme-soft-clay.sc-af-theme-override{--af-background-base:var(--colour-softclay-400, #c0ab8d);--af-background-base-hover:var(--colour-softclay-500, #b09670);--af-background-contrast:var(--colour-brand-mist-green, #c6d5d1);--af-background-level-1:var(--colour-softclay-500, #b09670);--af-background-level-1-hover:var(--colour-softclay-600, #9e8765);--af-background-border-subtle:var(--colour-softclay-600, #9e8765);--af-background-border-default:var(--colour-softclay-700, #8d785a);--af-background-border-heavy:var(--colour-brand-inkwell, #14343b);--af-background-border-active:var(--colour-brand-ice, #a6fffb);--af-background-icon-default:var(--colour-brand-inkwell, #14343b);--af-background-icon-accent:var(--colour-brand-ivory-paper, #fff9ee);--af-typography-heading-primary:var(--colour-brand-inkwell, #14343b);--af-typography-heading-secondary:var(--colour-brand-ivory-paper, #fff9ee);--af-typography-body-dark:var(--colour-brand-inkwell, #14343b);--af-typography-body-default:var(--colour-inkwell-400, #2b484f);--af-typography-body-subtle:var(--colour-inkwell-350, #60767b);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-icon:var(--colour-brand-inkwell, #14343b);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(0, 0, 0, 0.08);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-ghost-text:var(--colour-brand-inkwell, #14343b);--af-button-ghost-icon:var(--colour-brand-inkwell, #14343b);--af-button-ghost-stroke:var(--colour-brand-inkwell, #14343b);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-brand-white, #ffffff);--af-input-bg-hover:var(--colour-mistgreen-100, #f4f7f6);--af-input-bg-disabled:var(--af-background-level-1);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--af-typography-body-dark);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--af-typography-body-dark);--af-form-control-bg:var(--colour-brand-white, #ffffff);--af-form-control-bg-checked:var(--colour-brand-inkwell, #14343b);--af-form-control-bg-disabled:var(--colour-softclay-300, #d0c1a8);--af-form-control-bg-checked-disabled:var(--colour-inkwell-350, #708380);--af-form-control-stroke:var(--colour-softclay-700, #8d785a);--af-form-control-stroke-hover:var(--colour-brand-inkwell, #14343b);--af-form-control-stroke-disabled:var(--colour-softclay-600, #9e8765);--af-form-control-icon:var(--colour-brand-white, #ffffff);--af-form-control-label:var(--colour-brand-inkwell, #14343b)}.theme-white-ivory.sc-af-theme-override{--af-background-base:var(--colour-brand-ivory-paper, #fff9ee);--af-background-base-hover:var(--colour-ivory-100, #fff5e0);--af-background-contrast:var(--colour-brand-mist-green, #c6d5d1);--af-background-level-1:var(--colour-ivory-200, #ffefcc);--af-background-level-1-hover:var(--colour-ivory-300, #ffe9b8);--af-background-border-subtle:var(--colour-ivory-200, #ffefcc);--af-background-border-default:var(--colour-ivory-400, #ffe3a3);--af-background-border-heavy:var(--colour-brand-soft-clay, #b09670);--af-background-border-active:var(--colour-brand-soft-clay, #b09670);--af-background-icon-default:var(--colour-brand-inkwell, #14343b);--af-background-icon-accent:var(--colour-brand-soft-clay, #b09670);--af-typography-heading-primary:var(--colour-brand-inkwell, #14343b);--af-typography-heading-secondary:var(--colour-brand-soft-clay, #b09670);--af-typography-body-dark:var(--colour-brand-inkwell, #14343b);--af-typography-body-default:var(--colour-inkwell-400, #2b484f);--af-typography-body-subtle:var(--colour-inkwell-350, #60767b);--af-button-primary-text:var(--colour-brand-inkwell, #14343b);--af-button-primary-icon:var(--colour-brand-inkwell, #14343b);--af-button-primary-bg:var(--colour-brand-ice, #a6fffb);--af-button-primary-bg-hover:var(--colour-ice-600, #95e6e2);--af-button-primary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-secondary-text:var(--colour-brand-inkwell, #14343b);--af-button-secondary-icon:var(--colour-brand-inkwell, #14343b);--af-button-secondary-bg:transparent;--af-button-secondary-bg-hover:rgba(0, 0, 0, 0.08);--af-button-secondary-stroke:var(--colour-brand-inkwell, #14343b);--af-button-ghost-text:var(--colour-brand-inkwell, #14343b);--af-button-ghost-icon:var(--colour-brand-inkwell, #14343b);--af-button-ghost-stroke:var(--colour-brand-soft-clay, #b09670);--af-input-label:var(--af-typography-body-dark);--af-input-description:var(--af-typography-body-default);--af-input-text:var(--af-typography-body-dark);--af-input-placeholder:var(--af-typography-body-subtle);--af-input-icon:var(--af-background-icon-default);--af-input-bg:var(--colour-brand-white, #ffffff);--af-input-bg-hover:var(--colour-ivory-100, #fff5e0);--af-input-bg-disabled:var(--af-background-level-1);--af-input-border:var(--af-background-border-default);--af-input-border-hover:var(--af-background-border-heavy);--af-input-border-active:var(--af-typography-body-dark);--af-input-border-error:var(--colour-error, #be292a);--af-input-error:var(--colour-error, #be292a);--af-input-focus-ring:var(--af-typography-body-dark);--af-form-control-bg:var(--colour-brand-white, #ffffff);--af-form-control-bg-checked:var(--colour-brand-inkwell, #14343b);--af-form-control-bg-disabled:var(--colour-ivory-200, #ffefcc);--af-form-control-bg-checked-disabled:var(--colour-inkwell-350, #708380);--af-form-control-stroke:var(--colour-ivory-400, #ffe3a3);--af-form-control-stroke-hover:var(--colour-brand-inkwell, #14343b);--af-form-control-stroke-disabled:var(--colour-ivory-300, #ffe9b8);--af-form-control-icon:var(--colour-brand-white, #ffffff);--af-form-control-label:var(--colour-brand-inkwell, #14343b)}";
+const AfThemeOverride$1 = /*@__PURE__*/ proxyCustomElement(class AfThemeOverride extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        /**
+         * The theme to apply to child components.
+         * Overrides any inherited theme from parent containers.
+         */
+        this.theme = 'white';
+    }
+    render() {
+        return (h(Host, { key: '67765126b10a933cf927169cab2c88135f9b9c9d' }, h("div", { key: '00e00242c786f339f93c30005e1bbdc2eb5cdae6', class: `theme-override theme-${this.theme}` }, h("slot", { key: '19b1cfc18e8d8218a2bc0e04fb70b2e2e3a68121' }))));
+    }
+    static get style() { return afThemeOverrideCss; }
+}, [262, "af-theme-override", {
+        "theme": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["af-theme-override"];
+    components.forEach(tagName => { switch (tagName) {
+        case "af-theme-override":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AfThemeOverride$1);
+            }
+            break;
+    } });
+}
+const AfThemeOverride = AfThemeOverride$1;
+const defineCustomElement = defineCustomElement$1;
+export { AfThemeOverride, defineCustomElement };
+//# sourceMappingURL=af-theme-override.js.map
+//# sourceMappingURL=af-theme-override.js.map

package/dist/components/af-theme-override.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"af-theme-override.js","mappings":";;AAAA,MAAM,kBAAkB,GAAG,8gfAA8gf;;MCkB5hfA,iBAAe,iBAAAC,kBAAA,CAAA,MAAA,eAAA,SAAAC,CAAA,CAAA;AAN5B,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;AAOE;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAqE,OAAO;AAW1F;IATC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAA,qBAAA,EAAwB,IAAI,CAAC,KAAK,EAAE,EAAA,EAC9C,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["AfThemeOverride","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-theme-override/af-theme-override.css?tag=af-theme-override&encapsulation=scoped","src/components/af-theme-override/af-theme-override.tsx"],"sourcesContent":["/**\n * Theme Override Component Styles\n * \n * Sets theme CSS custom properties WITHOUT applying background color.\n * This allows overriding the theme context for child components while\n * maintaining the parent's visual background.\n */\n\n:host {\n display: contents;\n}\n\n.theme-override {\n display: contents;\n}\n\n/* ==========================================================================\n WHITE THEME\n ========================================================================== */\n\n.theme-white {\n /* Background tokens */\n --af-background-base: var(--colour-brand-white, #FFFFFF);\n --af-background-base-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-mistgreen-200, #e8eeed);\n --af-background-level-1-hover: var(--colour-mistgreen-300, #dde6e3);\n --af-background-border-subtle: var(--colour-mistgreen-200, #e8eeed);\n --af-background-border-default: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-heavy: var(--colour-mistgreen-500, #c6d5d1);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-200, #e8ebeb);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n INKWELL THEME (Dark)\n ========================================================================== */\n\n.theme-inkwell {\n /* Background tokens */\n --af-background-base: var(--colour-brand-inkwell, #14343b);\n --af-background-base-hover: var(--colour-inkwell-600, #102a2f);\n --af-background-contrast: var(--colour-inkwell-700, #102a2f);\n --af-background-level-1: var(--colour-inkwell-450, #203e45);\n --af-background-level-1-hover: var(--colour-inkwell-400, #2b484f);\n --af-background-border-subtle: var(--colour-inkwell-450, #203e45);\n --af-background-border-default: var(--colour-inkwell-400, #2b484f);\n --af-background-border-heavy: var(--colour-inkwell-700, #102a2f);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-white, #ffffff);\n --af-background-icon-accent: var(--colour-brand-ice, #a6fffb);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-mist-green, #c6d5d1);\n --af-typography-heading-secondary: var(--colour-brand-white, #ffffff);\n --af-typography-body-dark: var(--colour-brand-white, #ffffff);\n --af-typography-body-default: var(--colour-inkwell-100, #d0d6d8);\n --af-typography-body-subtle: var(--colour-inkwell-200, #a1aeb1);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-white, #ffffff);\n --af-button-secondary-icon: var(--colour-brand-white, #ffffff);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(255, 255, 255, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-white, #ffffff);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-white, #ffffff);\n --af-button-ghost-icon: var(--colour-brand-white, #ffffff);\n --af-button-ghost-stroke: var(--colour-brand-ice, #A6FFFB);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-inkwell-450, #203e45);\n --af-input-bg-hover: var(--colour-inkwell-400, #2b484f);\n --af-input-bg-disabled: var(--colour-inkwell-600, #102a2f);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--colour-brand-ice, #a6fffb);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--colour-brand-ice, #a6fffb);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-inkwell-450, #203e45);\n --af-form-control-bg-checked: var(--colour-brand-mist-green, #c6d5d1);\n --af-form-control-bg-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-bg-checked-disabled: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke: var(--colour-inkwell-350, #60767b);\n --af-form-control-stroke-hover: var(--colour-brand-white, #ffffff);\n --af-form-control-stroke-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-icon: var(--colour-brand-inkwell, #14343b);\n --af-form-control-label: var(--colour-brand-white, #ffffff);\n}\n\n/* ==========================================================================\n MIST-GREEN THEME\n ========================================================================== */\n\n.theme-mist-green {\n /* Background tokens */\n --af-background-base: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-base-hover: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-contrast: var(--colour-brand-soft-clay, #b09670);\n --af-background-level-1: var(--colour-mistgreen-300, #dde6e3);\n --af-background-level-1-hover: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-subtle: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-border-default: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-heavy: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-300, #dde6e3);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-600, #b2c0bc);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n SOFT-CLAY THEME\n ========================================================================== */\n\n.theme-soft-clay {\n /* Background tokens */\n --af-background-base: var(--colour-softclay-400, #c0ab8d);\n --af-background-base-hover: var(--colour-softclay-500, #b09670);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-softclay-500, #b09670);\n --af-background-level-1-hover: var(--colour-softclay-600, #9e8765);\n --af-background-border-subtle: var(--colour-softclay-600, #9e8765);\n --af-background-border-default: var(--colour-softclay-700, #8d785a);\n --af-background-border-heavy: var(--colour-brand-inkwell, #14343b);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-ivory-paper, #fff9ee);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-ivory-paper, #fff9ee);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-softclay-300, #d0c1a8);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-softclay-700, #8d785a);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-softclay-600, #9e8765);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n WHITE-IVORY THEME\n ========================================================================== */\n\n.theme-white-ivory {\n /* Background tokens */\n --af-background-base: var(--colour-brand-ivory-paper, #fff9ee);\n --af-background-base-hover: var(--colour-ivory-100, #fff5e0);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-ivory-200, #ffefcc);\n --af-background-level-1-hover: var(--colour-ivory-300, #ffe9b8);\n --af-background-border-subtle: var(--colour-ivory-200, #ffefcc);\n --af-background-border-default: var(--colour-ivory-400, #ffe3a3);\n --af-background-border-heavy: var(--colour-brand-soft-clay, #b09670);\n --af-background-border-active: var(--colour-brand-soft-clay, #b09670);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #b09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-ivory-100, #fff5e0);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-ivory-200, #ffefcc);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-ivory-400, #ffe3a3);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-ivory-300, #ffe9b8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Theme Override utility component.\n * Wraps content and applies an explicit theme, overriding any inherited theme\n * from parent containers like AfSection or AfCard.\n * \n * Unlike AfSection, this component does NOT apply a background color - \n * it only sets the CSS custom properties that child components consume.\n * \n * @slot - Content to be themed\n */\n@Component({\n tag: 'af-theme-override',\n styleUrl: 'af-theme-override.css',\n shadow: false,\n scoped: true,\n})\nexport class AfThemeOverride {\n /** \n * The theme to apply to child components.\n * Overrides any inherited theme from parent containers.\n */\n @Prop() theme: 'white' | 'inkwell' | 'mist-green' | 'soft-clay' | 'white-ivory' = 'white';\n\n render() {\n return (\n <Host>\n <div class={`theme-override theme-${this.theme}`}>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n\n"],"version":3}

package/dist/components/af-typography-lockup.js CHANGED Viewed

@@ -1 +1,9 @@
-import{A as o,d as s}from"./p-CQfk7gDb.js";const p=o,r=s;export{p as AfTypographyLockup,r as defineCustomElement}
+import { A as AfTypographyLockup$1, d as defineCustomElement$1 } from './p-287-nef9.js';
+const AfTypographyLockup = AfTypographyLockup$1;
+const defineCustomElement = defineCustomElement$1;
+export { AfTypographyLockup, defineCustomElement };
+//# sourceMappingURL=af-typography-lockup.js.map
+//# sourceMappingURL=af-typography-lockup.js.map

package/dist/components/af-typography-lockup.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"file":"af-typography-lockup.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}