@affinda/wc 0.0.15 → 0.0.16

package/dist/components/p-LUt2VDjp.js

@@ -1,68 +0,0 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-Dt4Fpr3O.js';
-
-const afTypographyLockupCss = ":host{display:block}.lockup{display:flex;flex-direction:column;gap:40px}.text-left{align-items:flex-start}.text-center{align-items:center}.text-left .copy,.text-left .heading,.text-left .description{text-align:left}.text-center .copy,.text-center .heading,.text-center .description{text-align:center}.copy{display:flex;flex-direction:column;gap:16px;width:100%}.heading{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;color:var(--typography-heading-primary, #14343B);line-height:1;white-space:pre-wrap}.breakpoint-desktop.heading-1 .heading{font-size:56px;letter-spacing:-1.12px}.breakpoint-desktop.heading-2 .heading{font-size:44px;letter-spacing:-0.88px}.breakpoint-desktop.heading-3 .heading{font-size:34px;letter-spacing:-0.68px}.breakpoint-desktop.heading-4 .heading{font-size:24px;letter-spacing:-0.48px;line-height:1.2}.breakpoint-desktop.heading-5 .heading{font-size:20px;letter-spacing:-0.4px;line-height:1.2}.breakpoint-mobile.heading-1 .heading{font-size:38px;letter-spacing:-0.76px}.breakpoint-mobile.heading-2 .heading{font-size:32px;letter-spacing:-0.64px}.breakpoint-mobile.heading-3 .heading{font-size:25px;letter-spacing:-0.5px}.breakpoint-mobile.heading-4 .heading{font-size:20px;letter-spacing:-0.4px;line-height:1.1}.breakpoint-mobile.heading-5 .heading{font-size:18px;letter-spacing:-0.36px;line-height:1.1}.description{font-family:'Helvetica', var(--typography-primaryfont, 'NeuSans', sans-serif), sans-serif;font-size:18px;font-weight:400;line-height:26px;color:var(--typography-body-default, #2B484F);white-space:pre-wrap}.description:empty{display:none}.buttons{display:flex;gap:12px}.buttons:empty{display:none}.button-horizontal .buttons{flex-direction:row;align-items:center}.text-left.button-horizontal{flex-direction:row;align-items:center;gap:16px}.text-left.button-horizontal .copy{flex:1 0 0;max-width:950px}.text-left.button-horizontal .buttons{flex-shrink:0}.button-vertical .buttons{flex-direction:row;align-items:flex-start}.text-center.button-vertical .buttons{align-items:center}.text-center .copy{max-width:840px}::slotted(*){margin:0}";
-
-const AfTypographyLockup = /*@__PURE__*/ proxyCustomElement(class AfTypographyLockup extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        /**
-         * The heading size (1-5, where 1 is largest)
-         */
-        this.headingSize = 2;
-        /**
-         * The breakpoint for responsive typography
-         */
-        this.breakpoint = 'desktop';
-        /**
-         * Text alignment
-         */
-        this.textAlignment = 'left';
-        /**
-         * Button alignment (horizontal or vertical stacking)
-         */
-        this.buttonAlignment = 'vertical';
-    }
-    render() {
-        const containerClasses = {
-            'lockup': true,
-            [`text-${this.textAlignment}`]: true,
-            [`button-${this.buttonAlignment}`]: true
-        };
-        const copyClasses = {
-            'copy': true,
-            [`heading-${this.headingSize}`]: true,
-            [`breakpoint-${this.breakpoint}`]: true
-        };
-        const copyStyle = this.maxWidth ? { maxWidth: `${this.maxWidth}px` } : {};
-        return (h(Host, { key: 'c8bc936e14d143125926e4cc03a3344911d46360' }, h("div", { key: '4c51fcb278daba5e4b8287130a1e61021750af18', class: containerClasses }, h("div", { key: '6d563b91c8b548a72f898978569bceda44a26b14', class: copyClasses, style: copyStyle }, h("div", { key: '6eb8a67a451643770caae7e1967a4d9be94548ac', class: "heading", part: "heading" }, h("slot", { key: '3dc8bdd804b8ccca68ec3f85ada6fca1560f8905' })), h("div", { key: '4e2ad38d585d392419ae8e596b6af226a48cffb1', class: "description", part: "body" }, h("slot", { key: 'f53fa56abca48a11b876368d7586a6f90bce5014', name: "description" }))), h("div", { key: 'b51f1178a58b9b48ed9ec1a76afbe09e2c78fd82', class: "buttons", part: "buttons" }, h("slot", { key: 'fb4b207a762e066f11ee3e36b570ec1c52e721f0', name: "buttons" })))));
-    }
-    static get style() { return afTypographyLockupCss; }
-}, [257, "af-typography-lockup", {
-        "headingSize": [2, "heading-size"],
-        "breakpoint": [1],
-        "textAlignment": [1, "text-alignment"],
-        "buttonAlignment": [1, "button-alignment"],
-        "maxWidth": [2, "max-width"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["af-typography-lockup"];
-    components.forEach(tagName => { switch (tagName) {
-        case "af-typography-lockup":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, AfTypographyLockup);
-            }
-            break;
-    } });
-}
-
-export { AfTypographyLockup as A, defineCustomElement as d };
-//# sourceMappingURL=p-LUt2VDjp.js.map
-
-//# sourceMappingURL=p-LUt2VDjp.js.map

package/dist/components/p-LUt2VDjp.js.map

@@ -1 +0,0 @@
-{"file":"p-LUt2VDjp.js","mappings":";;AAAA,MAAM,qBAAqB,GAAG,8jEAA8jE;;MCO/kE,kBAAkB,iBAAAA,kBAAA,CAAA,MAAA,kBAAA,SAAAC,CAAA,CAAA;AAL/B,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAME;;AAEG;AACK,QAAA,IAAW,CAAA,WAAA,GAAsB,CAAC;AAE1C;;AAEG;AACK,QAAA,IAAU,CAAA,UAAA,GAAyB,SAAS;AAEpD;;AAEG;AACK,QAAA,IAAa,CAAA,aAAA,GAAsB,MAAM;AAEjD;;AAEG;AACK,QAAA,IAAe,CAAA,eAAA,GAA8B,UAAU;AAwChE;IAjCC,MAAM,GAAA;AACJ,QAAA,MAAM,gBAAgB,GAAG;AACvB,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,CAAC,QAAQ,IAAI,CAAC,aAAa,CAAE,CAAA,GAAG,IAAI;AACpC,YAAA,CAAC,UAAU,IAAI,CAAC,eAAe,CAAE,CAAA,GAAG;SACrC;AAED,QAAA,MAAM,WAAW,GAAG;AAClB,YAAA,MAAM,EAAE,IAAI;AACZ,YAAA,CAAC,WAAW,IAAI,CAAC,WAAW,CAAE,CAAA,GAAG,IAAI;AACrC,YAAA,CAAC,cAAc,IAAI,CAAC,UAAU,CAAE,CAAA,GAAG;SACpC;QAED,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,GAAG,EAAE,QAAQ,EAAE,CAAG,EAAA,IAAI,CAAC,QAAQ,CAAA,EAAA,CAAI,EAAE,GAAG,EAAE;AAEzE,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,gBAAgB,EAAA,EAC1B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAA,EACvC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS,EAAA,EACjC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,aAAa,EAAC,IAAI,EAAC,MAAM,EAAA,EAClC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,aAAa,EAAA,CAAQ,CAC5B,CACF,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS,EAAA,EACjC,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EAAA,CAAQ,CACxB,CACF,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-typography-lockup/af-typography-lockup.css?tag=af-typography-lockup&encapsulation=shadow","src/components/af-typography-lockup/af-typography-lockup.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.lockup {\n  display: flex;\n  flex-direction: column;\n  gap: 40px;\n}\n\n/* Text alignment */\n.text-left {\n  align-items: flex-start;\n}\n\n.text-center {\n  align-items: center;\n}\n\n.text-left .copy,\n.text-left .heading,\n.text-left .description {\n  text-align: left;\n}\n\n.text-center .copy,\n.text-center .heading,\n.text-center .description {\n  text-align: center;\n}\n\n/* Copy section */\n.copy {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  width: 100%;\n}\n\n/* Heading styles */\n.heading {\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: 400;\n  color: var(--typography-heading-primary, #14343B);\n  line-height: 1;\n  white-space: pre-wrap;\n}\n\n/* Desktop heading sizes */\n.breakpoint-desktop.heading-1 .heading {\n  font-size: 56px;\n  letter-spacing: -1.12px;\n}\n\n.breakpoint-desktop.heading-2 .heading {\n  font-size: 44px;\n  letter-spacing: -0.88px;\n}\n\n.breakpoint-desktop.heading-3 .heading {\n  font-size: 34px;\n  letter-spacing: -0.68px;\n}\n\n.breakpoint-desktop.heading-4 .heading {\n  font-size: 24px;\n  letter-spacing: -0.48px;\n  line-height: 1.2;\n}\n\n.breakpoint-desktop.heading-5 .heading {\n  font-size: 20px;\n  letter-spacing: -0.4px;\n  line-height: 1.2;\n}\n\n/* Mobile heading sizes */\n.breakpoint-mobile.heading-1 .heading {\n  font-size: 38px;\n  letter-spacing: -0.76px;\n}\n\n.breakpoint-mobile.heading-2 .heading {\n  font-size: 32px;\n  letter-spacing: -0.64px;\n}\n\n.breakpoint-mobile.heading-3 .heading {\n  font-size: 25px;\n  letter-spacing: -0.5px;\n}\n\n.breakpoint-mobile.heading-4 .heading {\n  font-size: 20px;\n  letter-spacing: -0.4px;\n  line-height: 1.1;\n}\n\n.breakpoint-mobile.heading-5 .heading {\n  font-size: 18px;\n  letter-spacing: -0.36px;\n  line-height: 1.1;\n}\n\n/* Description/body text */\n.description {\n  font-family: 'Helvetica', var(--typography-primaryfont, 'NeuSans', sans-serif), sans-serif;\n  font-size: 18px;\n  font-weight: 400;\n  line-height: 26px;\n  color: var(--typography-body-default, #2B484F);\n  white-space: pre-wrap;\n}\n\n.description:empty {\n  display: none;\n}\n\n/* Buttons section */\n.buttons {\n  display: flex;\n  gap: 12px;\n}\n\n.buttons:empty {\n  display: none;\n}\n\n/* Button alignment - horizontal */\n.button-horizontal .buttons {\n  flex-direction: row;\n  align-items: center;\n}\n\n.text-left.button-horizontal {\n  flex-direction: row;\n  align-items: center;\n  gap: 16px;\n}\n\n.text-left.button-horizontal .copy {\n  flex: 1 0 0;\n  max-width: 950px;\n}\n\n.text-left.button-horizontal .buttons {\n  flex-shrink: 0;\n}\n\n/* Button alignment - vertical */\n.button-vertical .buttons {\n  flex-direction: row;\n  align-items: flex-start;\n}\n\n.text-center.button-vertical .buttons {\n  align-items: center;\n}\n\n/* Max width constraints for centered layouts */\n.text-center .copy {\n  max-width: 840px;\n}\n\n/* Slot content styling */\n::slotted(*) {\n  margin: 0;\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\n\n@Component({\n  tag: 'af-typography-lockup',\n  styleUrl: 'af-typography-lockup.css',\n  shadow: true\n})\nexport class AfTypographyLockup {\n  /**\n   * The heading size (1-5, where 1 is largest)\n   */\n  @Prop() headingSize: 1 | 2 | 3 | 4 | 5 = 2;\n\n  /**\n   * The breakpoint for responsive typography\n   */\n  @Prop() breakpoint: 'desktop' | 'mobile' = 'desktop';\n\n  /**\n   * Text alignment\n   */\n  @Prop() textAlignment: 'left' | 'center' = 'left';\n\n  /**\n   * Button alignment (horizontal or vertical stacking)\n   */\n  @Prop() buttonAlignment: 'horizontal' | 'vertical' = 'vertical';\n\n  /**\n   * Maximum width for the copy section (in pixels)\n   */\n  @Prop() maxWidth?: number;\n\n  render() {\n    const containerClasses = {\n      'lockup': true,\n      [`text-${this.textAlignment}`]: true,\n      [`button-${this.buttonAlignment}`]: true\n    };\n\n    const copyClasses = {\n      'copy': true,\n      [`heading-${this.headingSize}`]: true,\n      [`breakpoint-${this.breakpoint}`]: true\n    };\n\n    const copyStyle = this.maxWidth ? { maxWidth: `${this.maxWidth}px` } : {};\n\n    return (\n      <Host>\n        <div class={containerClasses}>\n          <div class={copyClasses} style={copyStyle}>\n            <div class=\"heading\" part=\"heading\">\n              <slot></slot>\n            </div>\n            <div class=\"description\" part=\"body\">\n              <slot name=\"description\"></slot>\n            </div>\n          </div>\n          <div class=\"buttons\" part=\"buttons\">\n            <slot name=\"buttons\"></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/p-PLXzXWgX.js.map

@@ -1 +0,0 @@
-{"file":"p-PLXzXWgX.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,mLAAmL;;MCW/L,aAAa,iBAAAA,kBAAA,CAAA,MAAA,aAAA,SAAAC,CAAA,CAAA;AAL1B,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAME;;;;;;;;AAQG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,KAAK;AAuE9B;IArES,aAAa,GAAA;;AAEnB,QAAA,MAAM,QAAQ,GAA8B;;AAE1C,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,KAAK,EAAE,OAAO;;AAEd,YAAA,KAAK,EAAE,OAAO;AACd,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,MAAM,EAAE,QAAQ;;AAEhB,YAAA,iBAAiB,EAAE,WAAW;AAC9B,YAAA,kBAAkB,EAAE,WAAW;AAC/B,YAAA,sBAAsB,EAAE,WAAW;AACnC,YAAA,uBAAuB,EAAE,WAAW;;AAEpC,YAAA,aAAa,EAAE,WAAW;AAC1B,YAAA,cAAc,EAAE,WAAW;AAC3B,YAAA,kBAAkB,EAAE,WAAW;AAC/B,YAAA,mBAAmB,EAAE,WAAW;;AAEhC,YAAA,iBAAiB,EAAE,WAAW;AAC9B,YAAA,kBAAkB,EAAE,WAAW;AAC/B,YAAA,sBAAsB,EAAE,WAAW;AACnC,YAAA,uBAAuB,EAAE,WAAW;;AAEpC,YAAA,KAAK,EAAE;SACR;;AAGD,QAAA,IAAI,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;AACxB,YAAA,OAAO,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;;;QAI7B,OAAO,IAAI,CAAC,KAAK;;IAGnB,MAAM,GAAA;AACJ,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,aAAa,EAAE;AAEvC,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,wBAAwB,EAC9B,KAAK,EAAE,EAAE,WAAW,EAAE,UAAU,EAAE,EAAA,EAElC,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/af-aspect-ratio/af-aspect-ratio.css?tag=af-aspect-ratio&encapsulation=shadow","src/components/af-aspect-ratio/af-aspect-ratio.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n.aspect-ratio-container {\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n}\n\n/* Ensure slotted content fills the container */\n.aspect-ratio-container ::slotted(*) {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * A container component that maintains a fixed aspect ratio for its content.\n * Useful for images, videos, or any content that needs to maintain specific proportions.\n */\n@Component({\n  tag: 'af-aspect-ratio',\n  styleUrl: 'af-aspect-ratio.css',\n  shadow: true\n})\nexport class AfAspectRatio {\n  /**\n   * The aspect ratio to maintain. Can be:\n   * - A predefined ratio: '1:1', '16:9', '4:3', 'golden-portrait', 'golden-landscape', 'a4-portrait', 'a4-landscape', 'letter-portrait', 'letter-landscape', etc.\n   * - A custom ratio in format 'width / height': '16 / 9', '4 / 3', '1.618 / 1', etc.\n   *\n   * @example\n   * <af-aspect-ratio ratio=\"16:9\">Content</af-aspect-ratio>\n   * <af-aspect-ratio ratio=\"1.618 / 1\">Content</af-aspect-ratio>\n   */\n  @Prop() ratio: string = '1:1';\n\n  private getRatioValue(): string {\n    // Map common ratio shortcuts to actual CSS aspect-ratio values\n    const ratioMap: { [key: string]: string } = {\n      // Common ratios\n      '1:1': '1 / 1',\n      '1:2': '1 / 2',\n      '2:1': '2 / 1',\n      '2:3': '2 / 3',\n      '3:1': '3 / 1',\n      '3:2': '3 / 2',\n      '3:4': '3 / 4',\n      '4:1': '4 / 1',\n      '4:3': '4 / 3',\n      '4:5': '4 / 5',\n      '5:2': '5 / 2',\n      '5:4': '5 / 4',\n      '8:3': '8 / 3',\n      '8:5': '8 / 5',\n      // Screen ratios\n      '9:8': '9 / 8',\n      '9:16': '9 / 16',\n      '9:21': '9 / 21',\n      '10:16': '10 / 16',\n      '14:3': '14 / 3',\n      '16:5': '16 / 5',\n      '16:9': '16 / 9',\n      '16:10': '16 / 10',\n      '21:9': '21 / 9',\n      '32:9': '32 / 9',\n      // Golden ratio variants\n      'golden-portrait': '1 / 1.618',\n      'golden-landscape': '1.618 / 1',\n      'golden-portrait-half': '1 / 0.809',\n      'golden-landscape-half': '0.809 / 1',\n      // Paper sizes - A4\n      'a4-portrait': '1 / 1.414',\n      'a4-landscape': '1.414 / 1',\n      'a4-portrait-half': '1 / 0.707',\n      'a4-landscape-half': '0.707 / 1',\n      // Paper sizes - Letter\n      'letter-portrait': '1 / 1.294',\n      'letter-landscape': '1.294 / 1',\n      'letter-portrait-half': '1 / 0.647',\n      'letter-landscape-half': '0.647 / 1',\n      // Special\n      '6:7': '6 / 7'\n    };\n\n    // If it's a predefined ratio, return the mapped value\n    if (ratioMap[this.ratio]) {\n      return ratioMap[this.ratio];\n    }\n\n    // Otherwise, assume it's a custom ratio already in the correct format\n    return this.ratio;\n  }\n\n  render() {\n    const ratioValue = this.getRatioValue();\n\n    return (\n      <div\n        class=\"aspect-ratio-container\"\n        style={{ aspectRatio: ratioValue }}\n      >\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/af-cta-section.entry.js

@@ -1,32 +0,0 @@
-import { r as registerInstance, h, H as Host } from './index-DI7b0bCy.js';
-
-const afCtaSectionCss = ".cta-section.sc-af-cta-section{padding:32px}.cta-section__container.sc-af-cta-section{position:relative;display:flex;align-items:center;gap:48px;padding:64px 80px;background-color:#D6E8E4;border-radius:24px;overflow:hidden;max-width:1200px;margin:0 auto}.cta-section__wave-bg.sc-af-cta-section{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;overflow:hidden}.cta-section__wave-svg.sc-af-cta-section{position:absolute;bottom:-50px;right:-50px;width:120%;height:120%;opacity:0.8}.cta-section__illustration.sc-af-cta-section{position:relative;z-index:1;flex-shrink:0;width:200px;height:200px;display:flex;align-items:center;justify-content:center}.cta-section__illustration-img.sc-af-cta-section{width:100%;height:100%;object-fit:contain}.cta-section__illustration.sc-af-cta-section svg.sc-af-cta-section{width:100%;height:100%}.cta-section__content.sc-af-cta-section{position:relative;z-index:1;flex:1}.cta-section__heading.sc-af-cta-section{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:clamp(28px, 4vw, 40px);line-height:1.1;letter-spacing:-0.02em;color:var(--colour-brand-inkwell, #14343b);margin:0 0 12px 0;font-style:normal}.cta-section__description.sc-af-cta-section{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:18px;line-height:1.5;color:var(--colour-brand-inkwell, #14343b);margin:0 0 24px 0;opacity:0.85}.cta-section__buttons.sc-af-cta-section{display:flex;gap:12px;flex-wrap:wrap}.cta-section__button.sc-af-cta-section{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border-radius:100px;font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:500;font-size:16px;line-height:1.25;text-decoration:none;transition:all 0.2s ease;cursor:pointer}.cta-section__button--primary.sc-af-cta-section{background-color:var(--colour-brand-ice, #A6FFFB);color:var(--colour-brand-inkwell, #14343b);border:1px solid var(--colour-brand-inkwell, #14343b)}.cta-section__button--primary.sc-af-cta-section:hover{background-color:#8FEBE3}.cta-section__button--secondary.sc-af-cta-section{background-color:white;color:var(--colour-brand-inkwell, #14343b);border:1px solid var(--colour-brand-inkwell, #14343b)}.cta-section__button--secondary.sc-af-cta-section:hover{background-color:var(--colour-brand-inkwell, #14343b);color:white}@media (max-width: 768px){.cta-section__container.sc-af-cta-section{flex-direction:column;padding:48px 32px;gap:32px;text-align:center}.cta-section__illustration.sc-af-cta-section{width:150px;height:150px}.cta-section__buttons.sc-af-cta-section{justify-content:center}.cta-section__heading.sc-af-cta-section{font-size:28px}}@media (max-width: 480px){.cta-section.sc-af-cta-section{padding:16px}.cta-section__container.sc-af-cta-section{padding:32px 24px}.cta-section__buttons.sc-af-cta-section{flex-direction:column;width:100%}.cta-section__button.sc-af-cta-section{width:100%}}";
-
-const AfCtaSection = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        /** Section heading */
-        this.heading = '';
-        /** Section description */
-        this.description = '';
-        /** Primary button text */
-        this.primaryButtonText = '';
-        /** Primary button URL */
-        this.primaryButtonUrl = '#';
-        /** Secondary button text (optional - if empty, button won't show) */
-        this.secondaryButtonText = '';
-        /** Secondary button URL */
-        this.secondaryButtonUrl = '#';
-        /** Illustration URL - if provided, displays this image */
-        this.illustrationUrl = '';
-        /** Whether to show the decorative wave background */
-        this.showWaveDecoration = true;
-    }
-    render() {
-        return (h(Host, { key: 'e9f0a58563bdaa67ff950b0e2ebb70ef4600a7b8' }, h("div", { key: '5cf583e9fd622cff15e61eb772e45bf8af020d09', class: "cta-section" }, h("div", { key: 'c1d43e16f3684299bc5c82d90c02e1deaf3cf824', class: "cta-section__container" }, this.showWaveDecoration && (h("div", { key: 'fb79dea8af188428e54a7e214200ca5fc2905329', class: "cta-section__wave-bg" }, h("svg", { key: 'c5d14799b1613e3c8cada805bdf343df40a539cc', viewBox: "0 0 1200 400", preserveAspectRatio: "none", class: "cta-section__wave-svg" }, h("ellipse", { key: '2d331cefb1d3a5881c83d34a61fc7c66fa47db1b', cx: "900", cy: "450", rx: "600", ry: "350", fill: "rgba(255,255,255,0.2)" }), h("ellipse", { key: 'cb9a17fd4cbd1e69b241148536511c0ebfd8de85', cx: "1000", cy: "500", rx: "400", ry: "250", fill: "rgba(255,255,255,0.15)" })))), (h("div", { key: '39305e7825aee761bb31652cb3765698c6ba3e88', class: "cta-section__illustration" }, this.illustrationUrl ? (h("img", { src: this.illustrationUrl, alt: "", class: "cta-section__illustration-img" })) : (h("slot", { name: "illustration" })))), h("div", { key: 'df1ab05bdc3834683ce7fcf070d64aa42d0e87b5', class: "cta-section__content" }, this.heading && h("h2", { key: '4aa79be8dd38f866a01847d8aae01a7cdd07409d', class: "cta-section__heading" }, this.heading), this.description && h("p", { key: '3e75362c397895545e75548f2b35602def38f007', class: "cta-section__description" }, this.description), h("div", { key: 'b66121d982806657298e4399579202daed91900b', class: "cta-section__buttons" }, this.primaryButtonText && (h("a", { key: '00380240c2507c3ba6b61e54c8ec0e91bfc8fea1', href: this.primaryButtonUrl, class: "cta-section__button cta-section__button--primary" }, this.primaryButtonText)), this.secondaryButtonText && (h("a", { key: '49704465778c7a29d40e6064d71e9ddfd821c223', href: this.secondaryButtonUrl, class: "cta-section__button cta-section__button--secondary" }, this.secondaryButtonText))))))));
-    }
-};
-AfCtaSection.style = afCtaSectionCss;
-
-export { AfCtaSection as af_cta_section };
-//# sourceMappingURL=af-cta-section.entry.js.map

package/dist/esm/af-cta-section.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"af-cta-section.entry.js","sources":["src/components/af-cta-section/af-cta-section.css?tag=af-cta-section&encapsulation=scoped","src/components/af-cta-section/af-cta-section.tsx"],"sourcesContent":[".cta-section {\n  padding: 32px;\n}\n\n.cta-section__container {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 48px;\n  padding: 64px 80px;\n  /* Match the exact background color from affinda.com */\n  background-color: #D6E8E4;\n  border-radius: 24px;\n  overflow: hidden;\n  max-width: 1200px;\n  margin: 0 auto;\n}\n\n/* Decorative wave background */\n.cta-section__wave-bg {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  pointer-events: none;\n  overflow: hidden;\n}\n\n.cta-section__wave-svg {\n  position: absolute;\n  bottom: -50px;\n  right: -50px;\n  width: 120%;\n  height: 120%;\n  opacity: 0.8;\n}\n\n/* Illustration container */\n.cta-section__illustration {\n  position: relative;\n  z-index: 1;\n  flex-shrink: 0;\n  width: 200px;\n  height: 200px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.cta-section__illustration-img {\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.cta-section__illustration svg {\n  width: 100%;\n  height: 100%;\n}\n\n/* Content area */\n.cta-section__content {\n  position: relative;\n  z-index: 1;\n  flex: 1;\n}\n\n.cta-section__heading {\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: 400;\n  font-size: clamp(28px, 4vw, 40px);\n  line-height: 1.1;\n  letter-spacing: -0.02em;\n  color: var(--colour-brand-inkwell, #14343b);\n  margin: 0 0 12px 0;\n  /* Remove italic - use normal style */\n  font-style: normal;\n}\n\n.cta-section__description {\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: 400;\n  font-size: 18px;\n  line-height: 1.5;\n  color: var(--colour-brand-inkwell, #14343b);\n  margin: 0 0 24px 0;\n  opacity: 0.85;\n}\n\n.cta-section__buttons {\n  display: flex;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n\n.cta-section__button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  padding: 12px 24px;\n  border-radius: 100px;\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 1.25;\n  text-decoration: none;\n  transition: all 0.2s ease;\n  cursor: pointer;\n}\n\n/* Primary button - matches navbar \"Try for free\" button (ice with black outline) */\n.cta-section__button--primary {\n  background-color: var(--colour-brand-ice, #A6FFFB);\n  color: var(--colour-brand-inkwell, #14343b);\n  border: 1px solid var(--colour-brand-inkwell, #14343b);\n}\n\n.cta-section__button--primary:hover {\n  background-color: #8FEBE3;\n}\n\n/* Secondary button - white with black outline */\n.cta-section__button--secondary {\n  background-color: white;\n  color: var(--colour-brand-inkwell, #14343b);\n  border: 1px solid var(--colour-brand-inkwell, #14343b);\n}\n\n.cta-section__button--secondary:hover {\n  background-color: var(--colour-brand-inkwell, #14343b);\n  color: white;\n}\n\n/* Responsive adjustments */\n@media (max-width: 768px) {\n  .cta-section__container {\n    flex-direction: column;\n    padding: 48px 32px;\n    gap: 32px;\n    text-align: center;\n  }\n\n  .cta-section__illustration {\n    width: 150px;\n    height: 150px;\n  }\n\n  .cta-section__buttons {\n    justify-content: center;\n  }\n\n  .cta-section__heading {\n    font-size: 28px;\n  }\n}\n\n@media (max-width: 480px) {\n  .cta-section {\n    padding: 16px;\n  }\n\n  .cta-section__container {\n    padding: 32px 24px;\n  }\n\n  .cta-section__buttons {\n    flex-direction: column;\n    width: 100%;\n  }\n\n  .cta-section__button {\n    width: 100%;\n  }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Call-to-action section component with illustration and decorative background\n * A flexible CTA section with customizable content, buttons, and optional illustration\n */\n@Component({\n  tag: 'af-cta-section',\n  styleUrl: 'af-cta-section.css',\n  shadow: false,\n  scoped: true,\n})\nexport class AfCtaSection {\n  /** Section heading */\n  @Prop() heading: string = '';\n\n  /** Section description */\n  @Prop() description: string = '';\n\n  /** Primary button text */\n  @Prop() primaryButtonText: string = '';\n\n  /** Primary button URL */\n  @Prop() primaryButtonUrl: string = '#';\n\n  /** Secondary button text (optional - if empty, button won't show) */\n  @Prop() secondaryButtonText: string = '';\n\n  /** Secondary button URL */\n  @Prop() secondaryButtonUrl: string = '#';\n\n  /** Illustration URL - if provided, displays this image */\n  @Prop() illustrationUrl: string = '';\n\n  /** Whether to show the decorative wave background */\n  @Prop() showWaveDecoration: boolean = true;\n\n  render() {\n    return (\n      <Host>\n        <div class=\"cta-section\">\n          <div class=\"cta-section__container\">\n            {/* Decorative wave background (optional) */}\n            {this.showWaveDecoration && (\n              <div class=\"cta-section__wave-bg\">\n                <svg viewBox=\"0 0 1200 400\" preserveAspectRatio=\"none\" class=\"cta-section__wave-svg\">\n                  <ellipse cx=\"900\" cy=\"450\" rx=\"600\" ry=\"350\" fill=\"rgba(255,255,255,0.2)\" />\n                  <ellipse cx=\"1000\" cy=\"500\" rx=\"400\" ry=\"250\" fill=\"rgba(255,255,255,0.15)\" />\n                </svg>\n              </div>\n            )}\n\n            {/* Illustration (optional) */}\n            {(this.illustrationUrl || true) && (\n              <div class=\"cta-section__illustration\">\n                {this.illustrationUrl ? (\n                  <img src={this.illustrationUrl} alt=\"\" class=\"cta-section__illustration-img\" />\n                ) : (\n                  <slot name=\"illustration\"></slot>\n                )}\n              </div>\n            )}\n\n            {/* Content */}\n            <div class=\"cta-section__content\">\n              {this.heading && <h2 class=\"cta-section__heading\">{this.heading}</h2>}\n              {this.description && <p class=\"cta-section__description\">{this.description}</p>}\n              <div class=\"cta-section__buttons\">\n                {this.primaryButtonText && (\n                  <a href={this.primaryButtonUrl} class=\"cta-section__button cta-section__button--primary\">\n                    {this.primaryButtonText}\n                  </a>\n                )}\n                {this.secondaryButtonText && (\n                  <a href={this.secondaryButtonUrl} class=\"cta-section__button cta-section__button--secondary\">\n                    {this.secondaryButtonText}\n                  </a>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}