@affinda/wc 0.0.20 → 0.0.22

package/dist/collection/components/af-stepper-step/af-stepper-step.css

@@ -0,0 +1,85 @@
+:host {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  flex: 1 1 0;
+  min-width: 0;
+  padding: 0 16px;
+  position: relative;
+  z-index: 1;
+}
+
+.stepper-step__badge {
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  border: 1px solid var(--colour-brand-inkwell, #14343b);
+  background: var(--colour-background-white, #ffffff);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-family: var(--typography-headingfont, 'NeuSans', sans-serif);
+  font-weight: 500;
+  font-size: 20px;
+  color: var(--colour-brand-inkwell, #14343b);
+  margin-bottom: 24px;
+  flex-shrink: 0;
+}
+
+.stepper-step__content {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  max-width: 320px;
+}
+
+.stepper-step__heading {
+  font-family: var(--typography-headingfont, 'NeuSans', sans-serif);
+  font-weight: var(--font-weight-regular, 400);
+  font-size: 24px;
+  line-height: 1.2;
+  letter-spacing: -0.02em;
+  color: var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));
+}
+
+.stepper-step__body {
+  font-family: var(--typography-bodyfont, 'NeuSans', sans-serif);
+  font-size: 16px;
+  line-height: 1.5;
+  color: var(--af-typography-body-default, var(--colour-brand-inkwell, #14343b));
+}
+
+/* Normalize slotted heading/body tags */
+:host :where(h1, h2, h3, h4, h5, h6),
+:host :where(p) {
+  font: inherit;
+  color: inherit;
+  margin: 0;
+}
+
+/* Vertical orientation — align left */
+:host-context(.stepper--vertical) {
+  flex-direction: row;
+  align-items: flex-start;
+  text-align: left;
+  gap: 24px;
+  padding: 0;
+}
+
+:host-context(.stepper--vertical) .stepper-step__badge {
+  margin-bottom: 0;
+}
+
+@media (max-width: 767px) {
+  :host {
+    flex-direction: row;
+    align-items: flex-start;
+    text-align: left;
+    gap: 24px;
+    padding: 0;
+  }
+  .stepper-step__badge {
+    margin-bottom: 0;
+  }
+}

package/dist/collection/components/af-stepper-step/af-stepper-step.js

@@ -0,0 +1,59 @@
+import { h, Host } from "@stencil/core";
+/**
+ * A single step within an af-stepper. Renders a numbered circular badge
+ * followed by slotted heading + body content.
+ *
+ * The parent af-stepper auto-assigns the `index` attribute based on DOM
+ * order, so consumers don't need to hand-number the steps.
+ *
+ * @slot heading - Step title (h3/h4 recommended).
+ * @slot body - Step description paragraph(s).
+ */
+export class AfStepperStep {
+    constructor() {
+        /**
+         * Step number shown in the badge. Auto-assigned by the parent stepper if
+         * not explicitly set.
+         */
+        this.index = 1;
+    }
+    render() {
+        return (h(Host, { key: 'c4b991bb2f6a9e153ee940b8f5090340e40159e9' }, h("span", { key: '7cf8db3a00d2bf0ad3b84d0795b2bfae5bf9359a', class: "stepper-step__badge" }, this.index), h("div", { key: '3e7db621c832d3dfc5415a5b9159994fd1b2379c', class: "stepper-step__content" }, h("div", { key: 'fa4ed0245ae043579a46506d0427a2e6e9a0c9c5', class: "stepper-step__heading" }, h("slot", { key: '24f2c339c855548e72e4c1b708fcdf3f9ac0c030', name: "heading" })), h("div", { key: '1449b56f91745a08ed7a6404a94cee5c4c478015', class: "stepper-step__body" }, h("slot", { key: '8ad129720c27a408b91fcda2ccaf448fd0d91826', name: "body" })))));
+    }
+    static get is() { return "af-stepper-step"; }
+    static get encapsulation() { return "scoped"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-stepper-step.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-stepper-step.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "index": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Step number shown in the badge. Auto-assigned by the parent stepper if\nnot explicitly set."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "index",
+                "defaultValue": "1"
+            }
+        };
+    }
+}

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

@@ -37,7 +37,7 @@ export class AfSwitch {
             'active': this.active,
             'disabled': this.disabled
         };
-        return (h(Host, { key: '40208bbee69ac5f433b5949737ea7ae25abb04d1' }, h("label", { key: '57f6e0fd6b4e57b0d7fd0385d783162ba9b5223c', class: switchClasses }, h("input", { key: 'ef12fcf04481c28d8cdf56951cdb2db2686f5f11', type: "checkbox", role: "switch", class: "input", checked: this.active, disabled: this.disabled, name: this.name, value: this.value, onChange: this.handleChange }), h("span", { key: '3a58b5503f2a431eabb79a4dc9091d4ec1f72e4d', class: trackClasses }, h("span", { key: 'f202d1bd926a4bf495778c0e51cb6473ab2eace1', class: knobClasses })), h("span", { key: 'c7b975cbb09a30105751ec5706279320b642e56c', class: "label" }, h("slot", { key: '2666e5ffaed3213357141dfff086837c6bf094e3' })))));
+        return (h(Host, { key: '9d319d8029449a756153131636059690a9a68fa5' }, h("label", { key: '301299033334d52e22ed85572ae096290248b3a6', class: switchClasses }, h("input", { key: '2866ca995d02543294b95363b3dc2eb72df94d69', type: "checkbox", role: "switch", class: "input", checked: this.active, disabled: this.disabled, name: this.name, value: this.value, onChange: this.handleChange }), h("span", { key: '1ea8b8d63d7ba48d0d26419dd08d9463968560fe', class: trackClasses }, h("span", { key: '7f0888ef41bbf3d4ace36ef2c3ceadce7a531cc1', class: knobClasses })), h("span", { key: '7ba5088e7a6fe6e70bdb6dc0b91d2fb0912db5d5', class: "label" }, h("slot", { key: '2c55a31a722662c4bb8fef0eb771e72546e95e03' })))));
     }
     static get is() { return "af-switch"; }
     static get encapsulation() { return "shadow"; }
@@ -152,4 +152,3 @@ export class AfSwitch {
             }];
     }
 }
-//# sourceMappingURL=af-switch.js.map

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

@@ -66,7 +66,7 @@ export class AfTab {
             'disabled': this.disabled,
             [`shape-${this.shape}`]: true,
         };
-        return (h(Host, { key: 'fcf77b9850cb9993b793fecc1e99a4c4d66083e5' }, h("button", { key: '0a365b50db1fa33892eb81e1dbc5a2865cc66f3c', class: tabClasses, role: "tab", "aria-selected": this.active ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown, disabled: this.disabled }, this.displayNumber && (h("span", { key: 'a0747ae5203c28324b9922561d50115a1f62285d', class: "number-slot" }, h("slot", { key: '3ca35e03fe76f71fde734d3fd6a0c98d6ca3f447', name: "number" }))), this.displayIcon && (h("span", { key: '70946507dd105fdb3322fcfb0e59971dc7f34b05', class: "icon-slot" }, h("slot", { key: 'abcc10059ca476b4c61392107823ec22e1d65a38', name: "icon" }))), h("span", { key: 'ab7d4e45bff940cc079c11f24fcc43406436e603', class: "label" }, this.label))));
+        return (h(Host, { key: '1f07a8b192e123bb4d053ef6910f45431ba2915a' }, h("button", { key: '6e56a2ca19222220a77096948fee53a4a88ffd54', class: tabClasses, role: "tab", "aria-selected": this.active ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown, disabled: this.disabled }, this.displayNumber && (h("span", { key: 'df9f4233d6ce7dd8ca4f9e65dc139bb878af294d', class: "number-slot" }, h("slot", { key: 'e41b64a2c9252a9f267a71e629ef5e2fe95e154c', name: "number" }))), this.displayIcon && (h("span", { key: '9df655a8da71ea036c0717fa56f5fdcdb5973945', class: "icon-slot" }, h("slot", { key: '5e7dda8a613a9829a5e9dff107152d436f56902e', name: "icon" }))), h("span", { key: 'c516e04e5acc82910c7f94e31e326fdeb9de3fe7', class: "label" }, this.label))));
     }
     static get is() { return "af-tab"; }
     static get encapsulation() { return "shadow"; }
@@ -151,7 +151,7 @@ export class AfTab {
                     "references": {
                         "TabShape": {
                             "location": "local",
-                            "path": "/home/elle/affinda-ui/packages/wc/src/components/af-tab/af-tab.tsx",
+                            "path": "/home/andrew/affinda-ui/packages/wc/src/components/af-tab/af-tab.tsx",
                             "id": "src/components/af-tab/af-tab.tsx::TabShape"
                         }
                     }
@@ -248,4 +248,3 @@ export class AfTab {
             }];
     }
 }
-//# sourceMappingURL=af-tab.js.map

package/dist/collection/components/af-tab-bar/af-tab-bar.js

@@ -87,7 +87,7 @@ export class AfTabBar {
             [`shape-${this.shape}`]: true,
             [`breakpoint-${this.breakpoint}`]: true,
         };
-        return (h(Host, { key: 'dc384f23c8237eb5fde5afcec5579806bfd94d3d', role: "tablist" }, h("div", { key: '65e52eda0dbb0eff9ca3b0e5c5a27d03df6d70fa', class: containerClasses }, h("slot", { key: 'd65cdf4b1760b5ab6a5116f183e8b080b594bd86' }))));
+        return (h(Host, { key: '79e200382e16ac4fde0bef958763373b01d24feb', role: "tablist" }, h("div", { key: '703f11c9ed35f8163feba14a6056435c420ccf49', class: containerClasses }, h("slot", { key: '959d4581b14fd720f00f2faaf5b9845d9faa367a' }))));
     }
     static get is() { return "af-tab-bar"; }
     static get encapsulation() { return "shadow"; }
@@ -112,7 +112,7 @@ export class AfTabBar {
                     "references": {
                         "TabBarShape": {
                             "location": "local",
-                            "path": "/home/elle/affinda-ui/packages/wc/src/components/af-tab-bar/af-tab-bar.tsx",
+                            "path": "/home/andrew/affinda-ui/packages/wc/src/components/af-tab-bar/af-tab-bar.tsx",
                             "id": "src/components/af-tab-bar/af-tab-bar.tsx::TabBarShape"
                         }
                     }
@@ -138,7 +138,7 @@ export class AfTabBar {
                     "references": {
                         "TabBarBreakpoint": {
                             "location": "local",
-                            "path": "/home/elle/affinda-ui/packages/wc/src/components/af-tab-bar/af-tab-bar.tsx",
+                            "path": "/home/andrew/affinda-ui/packages/wc/src/components/af-tab-bar/af-tab-bar.tsx",
                             "id": "src/components/af-tab-bar/af-tab-bar.tsx::TabBarBreakpoint"
                         }
                     }
@@ -168,4 +168,3 @@ export class AfTabBar {
             }];
     }
 }
-//# sourceMappingURL=af-tab-bar.js.map

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

@@ -17,54 +17,77 @@
   cursor: default;
 }
 
-/* Make links look clickable */
 a.tag {
   cursor: pointer;
 }
 
 /* ==========================================================================
-   VARIANT: SAND (Soft-clay/tan colored - default)
+   VARIANT: DEFAULT (inherits from parent theme context)
    ========================================================================== */
 
-.tag.variant-sand {
-  background-color: var(--af-tag-sand-bg, var(--colour-brand-soft-clay, #b09670));
-  color: var(--af-tag-sand-text, var(--colour-brand-inkwell, #14343b));
+.tag.variant-default {
+  background-color: var(--af-tag-bg, var(--colour-brand-soft-clay, #b09670));
+  color: var(--af-tag-text, var(--colour-brand-inkwell, #14343b));
 }
 
-.tag.variant-sand:hover {
-  background-color: var(--af-tag-sand-bg-hover, var(--colour-softclay-400, #c0ab8d));
+.tag.variant-default:hover {
+  background-color: var(--af-tag-bg-hover, var(--colour-tints-soft-clay-400, #c0ab8d));
 }
 
 /* ==========================================================================
-   VARIANT: LIGHT (Mist-green/light colored)
+   EXPLICIT THEME VARIANTS
    ========================================================================== */
 
-.tag.variant-light {
-  background-color: var(--af-tag-light-bg, var(--colour-background-level1, #e8eeed));
-  color: var(--af-tag-light-text, var(--colour-brand-inkwell, #14343b));
+.tag.variant-inkwell {
+  background-color: var(--colour-brand-inkwell, #14343b);
+  color: var(--colour-brand-white, #ffffff);
 }
 
-.tag.variant-light:hover {
-  background-color: var(--af-tag-light-bg-hover, var(--colour-tints-mist-green-200, #d2e8e3));
+.tag.variant-inkwell:hover {
+  background-color: var(--colour-tints-inkwell-500, #1e4a48);
+}
+
+.tag.variant-white {
+  background-color: var(--colour-brand-white, #ffffff);
+  color: var(--colour-brand-inkwell, #14343b);
+}
+
+.tag.variant-white:hover {
+  background-color: var(--colour-tints-mist-green-100, #e1eee1);
+}
+
+.tag.variant-soft-clay {
+  background-color: var(--colour-brand-soft-clay, #b09670);
+  color: var(--colour-brand-inkwell, #14343b);
+}
+
+.tag.variant-soft-clay:hover {
+  background-color: var(--colour-tints-soft-clay-400, #c0ab8d);
+}
+
+.tag.variant-mist-green {
+  background-color: var(--colour-brand-mist-green, #c6d5d1);
+  color: var(--colour-brand-inkwell, #14343b);
+}
+
+.tag.variant-mist-green:hover {
+  background-color: var(--colour-tints-mist-green-200, #d2e8e3);
 }
 
 /* ==========================================================================
    SIZES
    ========================================================================== */
 
-/* Size: X-Small */
 .tag.size-x-small {
   padding: 6px 10px;
   font-size: var(--font-size-label-tag, 14px);
 }
 
-/* Size: Small */
 .tag.size-small {
   padding: 8px 12px;
   font-size: var(--font-size-label-tag, 14px);
 }
 
-/* Size: Large */
 .tag.size-large {
   padding: 12px 16px;
   font-size: var(--font-size-body-large, 18px);
@@ -74,19 +97,16 @@ a.tag {
    FOCUS STATES
    ========================================================================== */
 
-/* Focus state */
 .tag:focus {
   outline: none;
-  box-shadow: 
+  box-shadow:
     0 0 0 4px var(--af-background-base, var(--colour-background-white, #ffffff)),
     0 0 0 5px var(--af-button-secondary-stroke, var(--colour-brand-inkwell, #14343b));
 }
 
-/* Focus visible for keyboard navigation */
 .tag:focus-visible {
   outline: none;
-  box-shadow: 
+  box-shadow:
     0 0 0 4px var(--af-background-base, var(--colour-background-white, #ffffff)),
     0 0 0 5px var(--af-button-secondary-stroke, var(--colour-brand-inkwell, #14343b));
 }
-

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

@@ -3,11 +3,15 @@ import { h, Host } from "@stencil/core";
  * Tag displays a label in a styled container.
  * Perfect for categorization, topics, or metadata display.
  *
+ * The `default` variant inherits its colors from the parent theme context
+ * (af-section, af-card). Use explicit variants (`inkwell`, `white`,
+ * `soft-clay`, `mist-green`) to override.
+ *
  * @example
  * ```html
  * <af-tag>AI</af-tag>
- * <af-tag size="small">Machine Learning</af-tag>
- * <af-tag size="large" variant="light">Document Processing</af-tag>
+ * <af-tag size="small" variant="inkwell">Machine Learning</af-tag>
+ * <af-tag size="large" variant="white">Document Processing</af-tag>
  * ```
  */
 export class AfTag {
@@ -15,25 +19,24 @@ export class AfTag {
         /**
          * The size of the tag
          * - `x-small` - Compact tag with minimal padding
-         * - `small` - Small tag with moderate padding
+         * - `small` - Small tag with moderate padding (default)
          * - `large` - Large tag with generous padding
          */
         this.size = 'small';
         /**
-         * The visual variant of the tag
-         * - `sand` - Soft-clay/tan colored background (default)
-         * - `light` - Mist-green/light colored background
+         * Visual variant of the tag. `default` inherits tag colors from the
+         * parent theme context. Theme-named variants force a specific palette.
          */
-        this.variant = 'sand';
+        this.variant = 'default';
     }
     render() {
         const TagElement = this.href ? 'a' : 'span';
         const linkProps = this.href ? { href: this.href } : {};
-        return (h(Host, { key: '7114f4a8e55509fb2c45561967d0dab339b7a75c' }, h(TagElement, { key: '868a14474ecd8edb4a90489d39913e5862c033c4', class: {
+        return (h(Host, { key: '389b869350a0ead31639016403b8bbd86c8be12f' }, h(TagElement, { key: '7be8b372a4c391ae3e426827cf425274dfe3dc44', class: {
                 'tag': true,
                 [`size-${this.size}`]: true,
                 [`variant-${this.variant}`]: true,
-            }, ...linkProps }, h("slot", { key: '57d2975785b2ec3ac74256510c1a26bfe2b6d96b' }))));
+            }, ...linkProps }, h("slot", { key: 'cf622bef7dca7e64215e0e778f3893097e9e30d0' }))));
     }
     static get is() { return "af-tag"; }
     static get encapsulation() { return "shadow"; }
@@ -58,7 +61,7 @@ export class AfTag {
                     "references": {
                         "TagSize": {
                             "location": "local",
-                            "path": "/home/elle/affinda-ui/packages/wc/src/components/af-tag/af-tag.tsx",
+                            "path": "/home/andrew/affinda-ui/packages/wc/src/components/af-tag/af-tag.tsx",
                             "id": "src/components/af-tag/af-tag.tsx::TagSize"
                         }
                     }
@@ -67,7 +70,7 @@ export class AfTag {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The size of the tag\n- `x-small` - Compact tag with minimal padding\n- `small` - Small tag with moderate padding\n- `large` - Large tag with generous padding"
+                    "text": "The size of the tag\n- `x-small` - Compact tag with minimal padding\n- `small` - Small tag with moderate padding (default)\n- `large` - Large tag with generous padding"
                 },
                 "getter": false,
                 "setter": false,
@@ -80,11 +83,11 @@ export class AfTag {
                 "mutable": false,
                 "complexType": {
                     "original": "TagVariant",
-                    "resolved": "\"light\" | \"sand\"",
+                    "resolved": "\"default\" | \"inkwell\" | \"mist-green\" | \"soft-clay\" | \"white\"",
                     "references": {
                         "TagVariant": {
                             "location": "local",
-                            "path": "/home/elle/affinda-ui/packages/wc/src/components/af-tag/af-tag.tsx",
+                            "path": "/home/andrew/affinda-ui/packages/wc/src/components/af-tag/af-tag.tsx",
                             "id": "src/components/af-tag/af-tag.tsx::TagVariant"
                         }
                     }
@@ -93,13 +96,13 @@ export class AfTag {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The visual variant of the tag\n- `sand` - Soft-clay/tan colored background (default)\n- `light` - Mist-green/light colored background"
+                    "text": "Visual variant of the tag. `default` inherits tag colors from the\nparent theme context. Theme-named variants force a specific palette."
                 },
                 "getter": false,
                 "setter": false,
                 "reflect": false,
                 "attribute": "variant",
-                "defaultValue": "'sand'"
+                "defaultValue": "'default'"
             },
             "href": {
                 "type": "string",
@@ -123,4 +126,3 @@ export class AfTag {
         };
     }
 }
-//# sourceMappingURL=af-tag.js.map

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

@@ -16,7 +16,7 @@
 /* Image side - 40.5% of card width (519px of 1280px in Figma) */
 .testimonial-image {
   position: relative;
-  width: 40.5%;
+  width: 50%;
   min-width: 300px;
   /* Minimum for readability */
   max-width: 519px;
@@ -84,16 +84,38 @@
   flex-shrink: 0;
 }
 
-/* Quote text - layout only, typography comes from af-text */
+/* Quote text — 22px / 140% per Webflow reference. Accepts either the
+   `quote` prop (rendered as plain text) or the `quote-body` slot (rich). */
 .testimonial-text {
-  max-height: 155px;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  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 ::slotted(p),
+.testimonial-text p {
+  font: inherit;
+  color: inherit;
+  margin: 0 0 12px 0;
+}
+.testimonial-text ::slotted(p:last-child),
+.testimonial-text p:last-child {
+  margin-bottom: 0;
+}
+.testimonial-text ::slotted(ul),
+.testimonial-text ul {
+  margin: 0 0 12px 0;
+  padding-left: 20px;
 }
 
 /* Attribution uses body-dark color for emphasis */
 .testimonial-attribution {
-  --af-typography-body-default: var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343b));
+  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 {

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

@@ -1,4 +1,12 @@
 import { h, Host } from "@stencil/core";
+/**
+ * @slot quote-body - Rich quote content (paragraphs, lists). Overrides the
+ *   `quote` string prop when provided. Use for testimonials that include
+ *   multiple paragraphs, bulleted points, or inline emphasis.
+ * @slot quote-icon - Quote icon (defaults to af-icon name="quote").
+ * @slot stats - Statistic items (af-testimonial-stat components).
+ * @slot navigation - Custom nav controls (when not using built-in ones).
+ */
 export class AfTestimonial {
     constructor() {
         /**
@@ -21,11 +29,11 @@ export class AfTestimonial {
         };
     }
     render() {
-        return (h(Host, { key: '3e77d8e2922ae899fdddfa2ff5f495e97a4f0014' }, h("div", { key: 'fc304bd6b0c74f09ee4be159480c447a3788a919', class: "testimonial-card" }, h("div", { key: 'be695215e50b0a0c0ba0903ddb0bf8b134316185', class: "testimonial-image" }, this.backgroundImage && (h("img", { key: '898522a8038ca9fdde2ea014f65e2a92b925cb22', src: this.backgroundImage, alt: "", class: "testimonial-bg-image" })), this.logoImage && (h("div", { key: 'a94f0ddf5ea5b19894296267ef5fa02a4ad123d1', class: "testimonial-logo" }, h("img", { key: '82a2a7adf088ccfbf50a5c5181d2377f002e7e2d', src: this.logoImage, alt: "Company logo" })))), h("div", { key: '39248255de8f8dd551a69ea0b36877ac762bebc2', class: "testimonial-content" }, h("div", { key: '0f6f8aa1d0a0cb96f8ef05c272afa2c349bcc9ce', class: "testimonial-quote-section" }, h("div", { key: 'bc29a0d1b408f44445d3951824b347d14c4f615e', class: "testimonial-quote-icon" }, h("slot", { key: '9c611e4faf05905c5188374a10932610858990ec', name: "quote-icon" }, h("af-icon", { key: 'a7e1862ccdd9d0492ed028372dbb77febb15fcb6', name: "quote", size: 48 }))), h("af-text", { key: '8b654e90692d7106be3c7c023977cf3eb0d449c8', variant: "xlarge", class: "testimonial-text" }, this.quote), h("af-text", { key: '89011282ffd9e5857cdf121abdfb183a1e8ea87c', variant: "xlarge", class: "testimonial-attribution" }, this.attribution)), h("div", { key: '195335ab3ab060c48c60780ac0d62e6dc6dff639', class: "testimonial-stats" }, h("slot", { key: 'bdd887e8dfe27d9879dcfe92cc4a212be78e83d1', name: "stats" })), h("div", { key: '579b975917923bcda4d8b9e5efea6ab76b96756f', class: "testimonial-footer" }, h("div", { key: '15b64a7ad6e409692c8c38823b438102733e2b5f', class: "testimonial-nav" }, this.showNavigation ? (
+        return (h(Host, { key: '8569be1c99d6591352606630716aa70ac4a9134d' }, h("div", { key: 'adb4ecf4962b068fc0d0bb9d7b74510b22bb2770', class: "testimonial-card" }, h("div", { key: 'db1decd942f7dbca4d0b75579c511e8b9e94bbc0', class: "testimonial-image" }, this.backgroundImage && (h("img", { key: '143fb0ef560023d9b6224623e363d99cc300bf03', src: this.backgroundImage, alt: "", class: "testimonial-bg-image" })), this.logoImage && (h("div", { key: 'f4b17a16293f12aa0d131944e2c69d31242f1105', class: "testimonial-logo" }, h("img", { key: '3b055aeb3b2eec2fa9df98592f5bcbe6a3a63cb0', src: this.logoImage, alt: "Company logo" })))), h("div", { key: 'f2731d7ed1364ca9dec2b104023908302fdff54a', class: "testimonial-content" }, h("div", { key: '9ae2d70a5a4dfbb890ce8aa9e475f80b04457fae', class: "testimonial-quote-section" }, h("div", { key: '5085969f61a7e1df88898cbd9c40400ad0ab91bc', class: "testimonial-quote-icon" }, h("slot", { key: 'a2ea0e72c9267548af02132d481ae73d158f9fd4', name: "quote-icon" }, h("af-icon", { key: '6ba9c790a1ed14d6b979f008bdb6fc4fb181d8ba', name: "quote", size: 48 }))), h("div", { key: 'd44e1066b30701dcd123a0a25390cf77578b8b6e', class: "testimonial-text" }, h("slot", { key: 'e7605429bac4865b598ead216287e5277eb99cd9', name: "quote-body" }, this.quote)), h("div", { key: '470481474dad18baa1fe22d6536bb5f5c02c8faa', class: "testimonial-attribution" }, this.attribution)), h("div", { key: 'd2fc708759c8b4c6638522bfc5f42589bccf7a82', class: "testimonial-stats" }, h("slot", { key: 'e3181ab8145788a9e374c2f9ea2d9823504c5543', name: "stats" })), h("div", { key: 'ff9a5d3b5cdb0da6e16ed2763680854686546f12', class: "testimonial-footer" }, h("div", { key: 'bc3e4a3229f8814e6140d40cab2f6997e212cd00', 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: '96f5417e1afd667746a06a0e52f108840dfc3e85', variant: "secondary", href: this.readMoreLink }, "Read full story", h("af-icon", { key: 'ede339436c8332c9463a4f1252b97235aae80f70', slot: "icon-right", name: "arrow-right", size: 24 }))))))));
+        h("slot", { name: "navigation" }))), this.readMoreLink && (h("af-button", { key: '4ab4295ecbd966fe1749c2db6ac8c96c50b3bb0d', variant: "secondary", href: this.readMoreLink }, "Read full story", h("af-icon", { key: 'd96405c3f90f36768fa3dbe2dd9f83347f31f53e', slot: "icon-right", name: "arrow-right", size: 24 }))))))));
     }
     static get is() { return "af-testimonial"; }
     static get encapsulation() { return "scoped"; }
@@ -84,14 +92,14 @@ export class AfTestimonial {
                 "mutable": false,
                 "complexType": {
                     "original": "string",
-                    "resolved": "string",
+                    "resolved": "string | undefined",
                     "references": {}
                 },
-                "required": true,
-                "optional": false,
+                "required": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "Testimonial quote text"
+                    "text": "Testimonial quote text. Falls back to the `quote-body` slot if that\nslot has content."
                 },
                 "getter": false,
                 "setter": false,
@@ -232,4 +240,3 @@ export class AfTestimonial {
             }];
     }
 }
-//# sourceMappingURL=af-testimonial.js.map

package/dist/collection/components/af-testimonial-carousel/af-testimonial-carousel.js

@@ -94,7 +94,7 @@ export class AfTestimonialCarousel {
         return (this.currentIndex + 1) / this.testimonialCount;
     }
     render() {
-        return (h(Host, { key: 'deda1bbad2330b3e82ebc7a6b1f424ba76b72c29' }, h("div", { key: '1146c1a67a3a682114c95bcfa37993ccf2a1fd3e', class: "testimonial-carousel" }, h("div", { key: '38c56a104b2f8956acb144f95a7607b35220f99b', class: "testimonial-slides" }, h("slot", { key: '981f9b3eb29f8f72095568747b45d56eb4d58ca3' })), this.testimonialCount > 1 && (h("div", { key: '5f49d3b23edf9748e5c1205b1ee25948b9d5817b', class: "testimonial-progress" }, h("af-progress-line", { key: 'ef7d80cbae1f4284e58a25cad35120880b6746d2', progress: this.getProgress() }))))));
+        return (h(Host, { key: '0b3ff300953cdb7f1ef8f4e6fa3f52811892c1a1' }, h("div", { key: '5106fa052b9e1b4d166a03b043305affadf20eb6', class: "testimonial-carousel" }, h("div", { key: '90ac4c283e3b5d6f2a20be866b6aa79e39b6adf6', class: "testimonial-slides" }, h("slot", { key: 'db7b93b76346a33092cbf69e1c3f150d393ff32d' })), this.testimonialCount > 1 && (h("div", { key: 'd81f5ff6ae68237385cf9c18428a0883c23dc766', class: "testimonial-progress" }, h("af-progress-line", { key: '7fed7be1bede0e492cd3b1df33e529778a34666b', progress: this.getProgress() }))))));
     }
     static get is() { return "af-testimonial-carousel"; }
     static get encapsulation() { return "scoped"; }
@@ -132,4 +132,3 @@ export class AfTestimonialCarousel {
             }];
     }
 }
-//# sourceMappingURL=af-testimonial-carousel.js.map

package/dist/collection/components/af-testimonial-stat/af-testimonial-stat.js

@@ -7,7 +7,7 @@ export class AfTestimonialStat {
         this.accentBorder = false;
     }
     render() {
-        return (h(Host, { key: 'a52644b3c724b893aa469f41611026c4fcd51494' }, h("div", { key: '7dd93afb4f9767e144223640e398e589659d613d', class: `stat ${this.accentBorder ? 'stat--accent' : ''}` }, h("af-heading", { key: '203a0b96fb9b3704f2afb0441d21fead46a55cb0', level: 2, class: "stat-value" }, this.value), h("af-text", { key: 'a8786177a797f6251cb97d771ff831aec4dc92fc', variant: "medium", class: "stat-description" }, this.description))));
+        return (h(Host, { key: '4e5314a0a58cc128f9f84bab0a414cfdf725d9a7' }, h("div", { key: '6b6a91315b2084942c9ba501c71673445d71cd3d', class: `stat ${this.accentBorder ? 'stat--accent' : ''}` }, h("af-heading", { key: 'f7f4b15a953a5cb0d67874f16f537d1846792a08', level: 2, class: "stat-value" }, this.value), h("af-text", { key: '8358643895dc0e8a9d06ec0fd119ee9065bbcdf4', variant: "medium", class: "stat-description" }, this.description))));
     }
     static get is() { return "af-testimonial-stat"; }
     static get encapsulation() { return "scoped"; }
@@ -84,4 +84,3 @@ export class AfTestimonialStat {
         };
     }
 }
-//# sourceMappingURL=af-testimonial-stat.js.map

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

@@ -95,4 +95,3 @@ export class AfText {
         };
     }
 }
-//# sourceMappingURL=af-text.js.map

package/dist/collection/components/af-text-image/af-text-image.css

@@ -19,8 +19,10 @@
   gap: var(--space-8, 32px);
 }
 
+/* DOM order is controlled from the TSX (image first for image-left, text
+   first for image-right), so both variants use plain row flow. */
 .text-image--image-left {
-  flex-direction: row-reverse;
+  flex-direction: row;
 }
 
 .text-image--image-right {
@@ -99,7 +101,7 @@
   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: pre-wrap;
+  white-space: normal;
 }
 
 .text-image__heading:empty {
@@ -113,7 +115,7 @@
   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: pre-wrap;
+  white-space: normal;
 }
 
 .text-image__description:empty {

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

@@ -170,4 +170,3 @@ export class AfTextImage {
         };
     }
 }
-//# sourceMappingURL=af-text-image.js.map

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

@@ -29,7 +29,7 @@ export class AfTextImageNest {
             'nest__grid': true,
             [`grid-${this.layout}`]: true,
         };
-        return (h(Host, { key: 'fda547a6eaca9705f52fbbed04113534e438f3c8' }, h("div", { key: '565730e0ed6a4b127ef191536b1f10f1c8b417d6', class: containerClasses }, h("div", { key: '65e97a6335b837f1ffd259e5c128c01c1c212f17', class: "nest__content" }, h("div", { key: 'c6eab25a6e3fc7c6c864a6aa6182c6adc7b22032', class: gridClasses }, h("slot", { key: 'e936abaaf1854605ebb1be90130df7d2d100ef49' })), h("div", { key: '11f48762fb08c787ac90256b55bb1a351e92c505', class: "nest__footer" }, h("slot", { key: '8a0f8c1ad853f3aa9deea5df5a3f0b565a1f631e', name: "buttons" }))))));
+        return (h(Host, { key: '6236efcd1868aea0a8ae6647790ea6d6afb86b51' }, h("div", { key: '863feee89464ff752ad04fefa2011224fb98e13e', class: containerClasses }, h("div", { key: 'd09229ad450d4426defe18db4052eee784f0dde2', class: "nest__content" }, h("div", { key: '1c622be554abd392c0f29272a4f93ef74cebd83d', class: gridClasses }, h("slot", { key: 'e99c2569d4b764d7d27d52479f3d536aceb9d085' })), h("div", { key: '82e03d0f533835f4c25aeca901125ec390906037', class: "nest__footer" }, h("slot", { key: '132ff2ea9b3cd73d2dc5e634748ec65bf2ab959d', name: "buttons" }))))));
     }
     static get is() { return "af-text-image-nest"; }
     static get encapsulation() { return "scoped"; }
@@ -68,4 +68,3 @@ export class AfTextImageNest {
         };
     }
 }
-//# sourceMappingURL=af-text-image-nest.js.map