@affinda/wc 0.6.1 → 0.6.2
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.
- package/dist/affinda/af-client-carousel.entry.esm.js.map +1 -1
- package/dist/affinda/af-feature-accordion.entry.esm.js.map +1 -1
- package/dist/affinda/af-testimonial-stat.entry.esm.js.map +1 -1
- package/dist/affinda/affinda.esm.js +1 -1
- package/dist/affinda/p-41160f3a.entry.js +2 -0
- package/dist/affinda/p-41160f3a.entry.js.map +1 -0
- package/dist/affinda/p-81f2ccb4.entry.js +2 -0
- package/dist/affinda/{p-2e67fb0d.entry.js.map → p-81f2ccb4.entry.js.map} +1 -1
- package/dist/affinda/{p-764601e6.entry.js → p-99ec99e1.entry.js} +2 -2
- package/dist/cjs/af-client-carousel.cjs.entry.js +1 -1
- package/dist/cjs/af-client-carousel.entry.cjs.js.map +1 -1
- package/dist/cjs/af-feature-accordion.cjs.entry.js +2 -3
- package/dist/cjs/af-feature-accordion.entry.cjs.js.map +1 -1
- package/dist/cjs/af-testimonial-stat.cjs.entry.js +1 -1
- package/dist/cjs/af-testimonial-stat.entry.cjs.js.map +1 -1
- package/dist/collection/components/af-client-carousel/af-client-carousel.css +3 -4
- package/dist/collection/components/af-feature-accordion/af-feature-accordion.css +26 -1
- package/dist/collection/components/af-feature-accordion/af-feature-accordion.js +1 -2
- package/dist/collection/components/af-feature-accordion/af-feature-accordion.js.map +1 -1
- package/dist/collection/components/af-testimonial-stat/af-testimonial-stat.css +6 -1
- package/dist/components/af-client-carousel.js +1 -1
- package/dist/components/af-client-carousel.js.map +1 -1
- package/dist/components/af-feature-accordion.js +2 -3
- package/dist/components/af-feature-accordion.js.map +1 -1
- package/dist/components/af-testimonial-stat.js +1 -1
- package/dist/components/af-testimonial-stat.js.map +1 -1
- package/dist/esm/af-client-carousel.entry.js +1 -1
- package/dist/esm/af-client-carousel.entry.js.map +1 -1
- package/dist/esm/af-feature-accordion.entry.js +2 -3
- package/dist/esm/af-feature-accordion.entry.js.map +1 -1
- package/dist/esm/af-testimonial-stat.entry.js +1 -1
- package/dist/esm/af-testimonial-stat.entry.js.map +1 -1
- package/dist/hydrate/index.js +4 -5
- package/dist/hydrate/index.mjs +4 -5
- package/package.json +2 -2
- package/dist/affinda/p-2e67fb0d.entry.js +0 -2
- package/dist/affinda/p-39a40e6a.entry.js +0 -2
- package/dist/affinda/p-39a40e6a.entry.js.map +0 -1
- /package/dist/affinda/{p-764601e6.entry.js.map → p-99ec99e1.entry.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"af-feature-accordion.entry.js","sources":["src/components/af-feature-accordion/af-feature-accordion.css?tag=af-feature-accordion&encapsulation=scoped","src/components/af-feature-accordion/af-feature-accordion.tsx"],"sourcesContent":["/*\n * af-feature-accordion\n * ---------------------------------------------------------------------------\n * Themable CSS custom properties (safe to override from consumers):\n *\n * --af-accent-progress Colour of the per-item timer/progress bar.\n * Defaults to --colour-softclay-600 (brand\n * soft-clay). Override to retheme the accent.\n * --af-feature-accordion-image-pad\n * Padding around the accompanying image\n * inside its rounded container. Defaults to\n * 40px — tune for tighter or looser rhythm.\n *\n * The component also inherits the following theme tokens from its parent\n * <af-section> (or any ancestor setting them):\n *\n * --af-typography-heading-primary heading colour\n * --af-typography-body-default body colour\n * --af-background-border-default rule/divider colour\n * --af-background-level-1 image-container background\n */\n\n:host {\n display: block;\n width: 100%;\n}\n\n.feature-accordion {\n /* Inherits theme from parent Section via CSS custom properties */\n padding: 0 24px;\n\n /* Internal custom properties that inherit from parent Section's theme */\n --_heading-color: var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));\n --_body-color: var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));\n --_border-color: var(--af-background-border-default, rgba(20, 52, 59, 0.12));\n}\n\n.feature-accordion__heading {\n font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n font-weight: 400;\n font-size: clamp(36px, 5vw, 52px);\n line-height: 1.05;\n letter-spacing: -0.025em;\n color: var(--_heading-color);\n margin: 0 0 56px 0;\n}\n\n.feature-accordion__content {\n display: flex;\n gap: 48px;\n}\n\n/* Accordion List */\n.feature-accordion__list {\n display: flex;\n flex-direction: column;\n flex: 1;\n min-width: 0;\n}\n\n/* Accordion Item */\n.accordion-item {\n border-bottom: 1px solid var(--_border-color);\n}\n\n.accordion-item:first-child {\n border-top: 1px solid var(--_border-color);\n}\n\n.accordion-item__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n padding: 24px 0;\n background: none;\n border: none;\n cursor: pointer;\n text-align: left;\n gap: 16px;\n}\n\n.accordion-item__header:hover .accordion-item__title {\n color: var(--_heading-color);\n}\n\n.accordion-item__title {\n font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n font-weight: 500;\n font-size: 22px;\n line-height: 1.25;\n color: var(--_heading-color);\n margin: 0;\n flex: 1;\n transition: color 0.2s ease;\n}\n\n/* Collapsed items have lighter text */\n.accordion-item:not(.accordion-item--expanded) .accordion-item__title {\n opacity: 0.7;\n}\n\n.accordion-item__icon {\n flex-shrink: 0;\n width: 24px;\n height: 24px;\n color: var(--_heading-color);\n transition:\n transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));\n}\n\n.accordion-item__icon svg {\n display: block;\n width: 100%;\n height: 100%;\n overflow: visible;\n}\n\n/* Plus → minus morph: vertical bar collapses and the whole icon rotates\n 45° when expanding, giving a single, fluid gesture. */\n.accordion-item__icon-bar {\n transition:\n transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-fast, 150ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));\n transform-origin: 12px 12px;\n}\n\n.accordion-item--expanded .accordion-item__icon-bar--vert {\n transform: scaleY(0);\n opacity: 0;\n}\n\n.accordion-item:not(.accordion-item--expanded) .accordion-item__icon {\n opacity: 0.5;\n}\n\n.accordion-item__content {\n overflow: hidden;\n transition:\n max-height var(--motion-duration-slow, 300ms) var(--motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n opacity var(--motion-duration-slow, 300ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));\n}\n\n@media (prefers-reduced-motion: reduce) {\n .accordion-item__icon,\n .accordion-item__icon-bar,\n .accordion-item__content,\n .accordion-item__title {\n transition-duration: 0.01ms;\n }\n}\n\n.accordion-item__description {\n font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n font-weight: 400;\n font-size: 17px;\n line-height: 1.6;\n color: var(--_body-color);\n margin: 0 0 20px 0;\n padding-right: 40px;\n opacity: 0.85;\n}\n\n/* Timer track - the progress bar at the bottom of expanded items */\n.accordion-item__timer-track {\n height: 3px;\n background-color: var(--_border-color);\n border-radius: 2px;\n margin-bottom: 8px;\n overflow: hidden;\n display: flex;\n justify-content: flex-start;\n}\n\n.accordion-item__timer-progress {\n height: 100%;\n background-color: var(--af-accent-progress, var(--colour-softclay-600, #9e8765));\n border-radius: 2px;\n transition: width 0.05s linear;\n}\n\n/* Image Container - stretches full height to align with accordion */\n.feature-accordion__image-container {\n display: flex;\n align-items: center;\n justify-content: center;\n /* Flows from parent Section's theme; mist-green fallback for unthemed use */\n background-color: var(--af-background-level-1, var(--colour-mistgreen-300, #dde6e3));\n border-radius: 20px;\n overflow: hidden;\n flex: 1;\n min-width: 0;\n}\n\n.feature-accordion__image-wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n padding: var(--af-feature-accordion-image-pad, 40px);\n}\n\n.feature-accordion__image {\n max-width: 100%;\n max-height: 100%;\n width: auto;\n height: auto;\n object-fit: contain;\n border-radius: 12px;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);\n}\n\n.feature-accordion__image-placeholder {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n/* Tablet */\n/* ≤ tablet */\n@media (max-width: 1024px) {\n .feature-accordion__content {\n gap: 32px;\n }\n\n .feature-accordion__heading {\n margin-bottom: 40px;\n }\n\n .accordion-item__title {\n font-size: 20px;\n }\n}\n\n/* Mobile */\n/* mobile-only */\n@media (max-width: 768px) {\n .feature-accordion__content {\n flex-direction: column;\n gap: 32px;\n }\n\n .feature-accordion__image-container {\n order: -1;\n min-height: 280px;\n flex: none;\n }\n\n .feature-accordion__list {\n flex: none;\n }\n\n .accordion-item__title {\n font-size: 18px;\n }\n\n .accordion-item__description {\n font-size: 15px;\n padding-right: 0;\n }\n}\n","import { Component, h, Host, Prop, State, Element, Watch } from '@stencil/core';\n\nexport interface FeatureAccordionItem {\n title: string;\n description: string;\n imageUrl?: string;\n imageAlt?: string;\n}\n\n/**\n * Feature accordion component with expandable items and accompanying image.\n * Used for showcasing product features with visual examples.\n * Features auto-cycling through items with a progress timer.\n * \n * **Must be wrapped in a Section component** to inherit theme styling.\n * The component automatically adapts colors based on the parent Section's theme.\n * \n * @example\n * ```tsx\n * <Section theme=\"inkwell\">\n * <FeatureAccordion heading=\"Features\" items={...} />\n * </Section>\n * ```\n */\n@Component({\n tag: 'af-feature-accordion',\n styleUrl: 'af-feature-accordion.css',\n shadow: false,\n scoped: true,\n})\nexport class AfFeatureAccordion {\n @Element() el!: HTMLElement;\n\n /** Section heading */\n @Prop() heading: string = 'Give AI agents your paperwork';\n\n /** JSON string of accordion items */\n @Prop() items: string = '[]';\n\n /** Auto-cycle interval in milliseconds (default: 6000ms = 6 seconds) */\n @Prop() cycleInterval: number = 6000;\n\n /** Whether auto-cycling is enabled */\n @Prop() autoCycle: boolean = true;\n\n /** Currently expanded item index */\n @State() expandedIndex: number = 0;\n\n /** Progress of current timer (0-100) */\n @State() timerProgress: number = 100;\n\n private progressTimer: number | null = null;\n private progressStartTime: number = 0;\n\n componentDidLoad() {\n if (this.autoCycle) {\n this.startCycling();\n }\n }\n\n disconnectedCallback() {\n this.stopCycling();\n }\n\n @Watch('autoCycle')\n handleAutoCycleChange(newValue: boolean) {\n if (newValue) {\n this.startCycling();\n } else {\n this.stopCycling();\n }\n }\n\n private getItems(): FeatureAccordionItem[] {\n try {\n return JSON.parse(this.items);\n } catch {\n return [];\n }\n }\n\n private startCycling() {\n this.stopCycling();\n this.progressStartTime = Date.now();\n this.timerProgress = 100;\n \n // Progress animation frame\n const updateProgress = () => {\n const elapsed = Date.now() - this.progressStartTime;\n const remaining = this.cycleInterval - elapsed;\n \n if (remaining <= 0) {\n this.moveToNextItem();\n } else {\n this.timerProgress = (remaining / this.cycleInterval) * 100;\n this.progressTimer = requestAnimationFrame(updateProgress);\n }\n };\n \n this.progressTimer = requestAnimationFrame(updateProgress);\n }\n\n private stopCycling() {\n if (this.progressTimer) {\n cancelAnimationFrame(this.progressTimer);\n this.progressTimer = null;\n }\n }\n\n private moveToNextItem() {\n const items = this.getItems();\n if (items.length === 0) return;\n \n this.expandedIndex = (this.expandedIndex + 1) % items.length;\n // Restart the cycling timer for the new item\n this.startCycling();\n }\n\n private handleItemClick(index: number) {\n // Reset timer when user clicks\n this.expandedIndex = index;\n // Restart the cycling timer for the clicked item\n if (this.autoCycle) {\n this.startCycling();\n }\n }\n\n render() {\n const items = this.getItems();\n const currentItem = items[this.expandedIndex];\n\n return (\n <Host>\n <div class=\"feature-accordion\">\n <div class=\"feature-accordion__container\">\n <h2 class=\"feature-accordion__heading\">{this.heading}</h2>\n \n <div class=\"feature-accordion__content\">\n {/* Left side - Accordion */}\n <div class=\"feature-accordion__list\">\n {items.map((item, index) => (\n <div \n class={{\n 'accordion-item': true,\n 'accordion-item--expanded': this.expandedIndex === index\n }}\n key={index}\n >\n <button\n class=\"accordion-item__header\"\n onClick={() => this.handleItemClick(index)}\n aria-expanded={this.expandedIndex === index ? 'true' : 'false'}\n >\n <h4 class=\"accordion-item__title\">{item.title}</h4>\n {/* Plus → minus: a single SVG with two strokes, the\n vertical one rotated-out to zero when expanded. This\n gives a fluid morph instead of swapping SVGs mid-\n animation. */}\n <span class=\"accordion-item__icon\" aria-hidden=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path class=\"accordion-item__icon-bar\" d=\"M5 12H19\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\n <path class=\"accordion-item__icon-bar accordion-item__icon-bar--vert\" d=\"M12 5V19\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\n </svg>\n </span>\n </button>\n <div \n class=\"accordion-item__content\"\n style={{ \n maxHeight: this.expandedIndex === index ? '200px' : '0',\n opacity: this.expandedIndex === index ? '1' : '0'\n }}\n >\n <p class=\"accordion-item__description\">{item.description}</p>\n {this.expandedIndex === index && this.autoCycle && (\n <div class=\"accordion-item__timer-track\">\n <div \n class=\"accordion-item__timer-progress\"\n style={{ width: `${this.timerProgress}%` }}\n ></div>\n </div>\n )}\n </div>\n </div>\n ))}\n </div>\n\n {/* Right side - Image */}\n <div class=\"feature-accordion__image-container\">\n <div class=\"feature-accordion__image-wrapper\">\n {currentItem?.imageUrl && (\n <img \n src={currentItem.imageUrl} \n alt={currentItem.imageAlt || currentItem.title}\n class=\"feature-accordion__image\"\n />\n )}\n {!currentItem?.imageUrl && (\n <div class=\"feature-accordion__image-placeholder\">\n <slot name=\"image\"></slot>\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"af-feature-accordion.entry.js","sources":["src/components/af-feature-accordion/af-feature-accordion.css?tag=af-feature-accordion&encapsulation=scoped","src/components/af-feature-accordion/af-feature-accordion.tsx"],"sourcesContent":["/*\n * af-feature-accordion\n * ---------------------------------------------------------------------------\n * Themable CSS custom properties (safe to override from consumers):\n *\n * --af-accent-progress Colour of the per-item timer/progress bar.\n * Defaults to --colour-softclay-600 (brand\n * soft-clay). Override to retheme the accent.\n * --af-feature-accordion-image-pad\n * Padding around the accompanying image\n * inside its rounded container. Defaults to\n * 40px — tune for tighter or looser rhythm.\n *\n * The component also inherits the following theme tokens from its parent\n * <af-section> (or any ancestor setting them):\n *\n * --af-typography-heading-primary heading colour\n * --af-typography-body-default body colour\n * --af-background-border-default rule/divider colour\n * --af-background-level-1 image-container background\n */\n\n:host {\n display: block;\n width: 100%;\n}\n\n.feature-accordion {\n /* Inherits theme from parent Section via CSS custom properties */\n padding: 0 24px;\n\n /* Internal custom properties that inherit from parent Section's theme */\n --_heading-color: var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));\n --_body-color: var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));\n --_border-color: var(--af-background-border-default, rgba(20, 52, 59, 0.12));\n}\n\n.feature-accordion__heading {\n font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n font-weight: 400;\n font-size: clamp(36px, 5vw, 52px);\n line-height: 1.05;\n letter-spacing: -0.025em;\n color: var(--_heading-color);\n margin: 0 0 56px 0;\n}\n\n.feature-accordion__content {\n display: flex;\n gap: 48px;\n}\n\n/* Accordion List */\n.feature-accordion__list {\n display: flex;\n flex-direction: column;\n flex: 1;\n min-width: 0;\n}\n\n/* Accordion Item */\n.accordion-item {\n border-bottom: 1px solid var(--_border-color);\n}\n\n.accordion-item:first-child {\n border-top: 1px solid var(--_border-color);\n}\n\n.accordion-item__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n padding: 24px 0;\n background: none;\n border: none;\n cursor: pointer;\n text-align: left;\n gap: 16px;\n}\n\n.accordion-item__header:hover .accordion-item__title {\n color: var(--_heading-color);\n}\n\n.accordion-item__title {\n font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n font-weight: 500;\n font-size: 22px;\n line-height: 1.25;\n color: var(--_heading-color);\n margin: 0;\n flex: 1;\n transition: color 0.2s ease;\n}\n\n/* Collapsed items have lighter text */\n.accordion-item:not(.accordion-item--expanded) .accordion-item__title {\n opacity: 0.7;\n}\n\n.accordion-item__icon {\n flex-shrink: 0;\n width: 24px;\n height: 24px;\n color: var(--_heading-color);\n transition:\n transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));\n}\n\n.accordion-item__icon svg {\n display: block;\n width: 100%;\n height: 100%;\n overflow: visible;\n}\n\n/* Plus → minus morph: vertical bar collapses and the whole icon rotates\n 45° when expanding, giving a single, fluid gesture. */\n.accordion-item__icon-bar {\n transition:\n transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-fast, 150ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));\n transform-origin: 12px 12px;\n}\n\n.accordion-item--expanded .accordion-item__icon-bar--vert {\n transform: scaleY(0);\n opacity: 0;\n}\n\n.accordion-item:not(.accordion-item--expanded) .accordion-item__icon {\n opacity: 0.5;\n}\n\n.accordion-item__content {\n overflow: hidden;\n /* Use grid-template-rows-based expansion (0fr → 1fr) so the\n transition animates the *actual* content height, not a max-height\n ceiling. Avoids the \"section height bumps for a split second\"\n jank that happens when the outgoing item's content is shorter\n than max-height: at the midpoint of a max-height transition the\n outgoing item still renders at its natural height (because\n max-height >> content) while the incoming item ALSO renders at\n its natural height — sum > steady-state for a frame, so the\n image column on the right jumps. With grid-rows, each item\n occupies its proportional fraction of its own natural height;\n incoming + outgoing always sums to one full content row.\n Reported 2026-04-27 on /au's \"Give Affinda Platform your\n paperwork\" section. */\n display: grid;\n grid-template-rows: 0fr;\n transition:\n grid-template-rows var(--motion-duration-slow, 300ms) var(--motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n opacity var(--motion-duration-slow, 300ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));\n}\n\n.accordion-item--expanded .accordion-item__content {\n grid-template-rows: 1fr;\n}\n\n/* Inner wrapper required for grid-template-rows interpolation:\n the direct grid child collapses to min-content otherwise. */\n.accordion-item__content > * {\n min-height: 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .accordion-item__icon,\n .accordion-item__icon-bar,\n .accordion-item__content,\n .accordion-item__title {\n transition-duration: 0.01ms;\n }\n}\n\n.accordion-item__description {\n font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n font-weight: 400;\n font-size: 17px;\n line-height: 1.6;\n color: var(--_body-color);\n margin: 0 0 20px 0;\n padding-right: 40px;\n opacity: 0.85;\n}\n\n/* Timer track - the progress bar at the bottom of expanded items */\n.accordion-item__timer-track {\n height: 3px;\n background-color: var(--_border-color);\n border-radius: 2px;\n margin-bottom: 8px;\n overflow: hidden;\n display: flex;\n justify-content: flex-start;\n}\n\n.accordion-item__timer-progress {\n height: 100%;\n background-color: var(--af-accent-progress, var(--colour-softclay-600, #9e8765));\n border-radius: 2px;\n transition: width 0.05s linear;\n}\n\n/* Image Container - stretches full height to align with accordion */\n.feature-accordion__image-container {\n display: flex;\n align-items: center;\n justify-content: center;\n /* Flows from parent Section's theme; mist-green fallback for unthemed use */\n background-color: var(--af-background-level-1, var(--colour-mistgreen-300, #dde6e3));\n border-radius: 20px;\n overflow: hidden;\n flex: 1;\n min-width: 0;\n}\n\n.feature-accordion__image-wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n padding: var(--af-feature-accordion-image-pad, 40px);\n}\n\n.feature-accordion__image {\n max-width: 100%;\n max-height: 100%;\n width: auto;\n height: auto;\n object-fit: contain;\n border-radius: 12px;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);\n}\n\n.feature-accordion__image-placeholder {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n/* Tablet */\n/* ≤ tablet */\n@media (max-width: 1024px) {\n .feature-accordion__content {\n gap: 32px;\n }\n\n .feature-accordion__heading {\n margin-bottom: 40px;\n }\n\n .accordion-item__title {\n font-size: 20px;\n }\n}\n\n/* Mobile */\n/* mobile-only */\n@media (max-width: 768px) {\n .feature-accordion__content {\n flex-direction: column;\n gap: 32px;\n }\n\n .feature-accordion__image-container {\n order: -1;\n min-height: 280px;\n flex: none;\n }\n\n .feature-accordion__list {\n flex: none;\n }\n\n .accordion-item__title {\n font-size: 18px;\n }\n\n .accordion-item__description {\n font-size: 15px;\n padding-right: 0;\n }\n}\n","import { Component, h, Host, Prop, State, Element, Watch } from '@stencil/core';\n\nexport interface FeatureAccordionItem {\n title: string;\n description: string;\n imageUrl?: string;\n imageAlt?: string;\n}\n\n/**\n * Feature accordion component with expandable items and accompanying image.\n * Used for showcasing product features with visual examples.\n * Features auto-cycling through items with a progress timer.\n * \n * **Must be wrapped in a Section component** to inherit theme styling.\n * The component automatically adapts colors based on the parent Section's theme.\n * \n * @example\n * ```tsx\n * <Section theme=\"inkwell\">\n * <FeatureAccordion heading=\"Features\" items={...} />\n * </Section>\n * ```\n */\n@Component({\n tag: 'af-feature-accordion',\n styleUrl: 'af-feature-accordion.css',\n shadow: false,\n scoped: true,\n})\nexport class AfFeatureAccordion {\n @Element() el!: HTMLElement;\n\n /** Section heading */\n @Prop() heading: string = 'Give AI agents your paperwork';\n\n /** JSON string of accordion items */\n @Prop() items: string = '[]';\n\n /** Auto-cycle interval in milliseconds (default: 6000ms = 6 seconds) */\n @Prop() cycleInterval: number = 6000;\n\n /** Whether auto-cycling is enabled */\n @Prop() autoCycle: boolean = true;\n\n /** Currently expanded item index */\n @State() expandedIndex: number = 0;\n\n /** Progress of current timer (0-100) */\n @State() timerProgress: number = 100;\n\n private progressTimer: number | null = null;\n private progressStartTime: number = 0;\n\n componentDidLoad() {\n if (this.autoCycle) {\n this.startCycling();\n }\n }\n\n disconnectedCallback() {\n this.stopCycling();\n }\n\n @Watch('autoCycle')\n handleAutoCycleChange(newValue: boolean) {\n if (newValue) {\n this.startCycling();\n } else {\n this.stopCycling();\n }\n }\n\n private getItems(): FeatureAccordionItem[] {\n try {\n return JSON.parse(this.items);\n } catch {\n return [];\n }\n }\n\n private startCycling() {\n this.stopCycling();\n this.progressStartTime = Date.now();\n this.timerProgress = 100;\n \n // Progress animation frame\n const updateProgress = () => {\n const elapsed = Date.now() - this.progressStartTime;\n const remaining = this.cycleInterval - elapsed;\n \n if (remaining <= 0) {\n this.moveToNextItem();\n } else {\n this.timerProgress = (remaining / this.cycleInterval) * 100;\n this.progressTimer = requestAnimationFrame(updateProgress);\n }\n };\n \n this.progressTimer = requestAnimationFrame(updateProgress);\n }\n\n private stopCycling() {\n if (this.progressTimer) {\n cancelAnimationFrame(this.progressTimer);\n this.progressTimer = null;\n }\n }\n\n private moveToNextItem() {\n const items = this.getItems();\n if (items.length === 0) return;\n \n this.expandedIndex = (this.expandedIndex + 1) % items.length;\n // Restart the cycling timer for the new item\n this.startCycling();\n }\n\n private handleItemClick(index: number) {\n // Reset timer when user clicks\n this.expandedIndex = index;\n // Restart the cycling timer for the clicked item\n if (this.autoCycle) {\n this.startCycling();\n }\n }\n\n render() {\n const items = this.getItems();\n const currentItem = items[this.expandedIndex];\n\n return (\n <Host>\n <div class=\"feature-accordion\">\n <div class=\"feature-accordion__container\">\n <h2 class=\"feature-accordion__heading\">{this.heading}</h2>\n \n <div class=\"feature-accordion__content\">\n {/* Left side - Accordion */}\n <div class=\"feature-accordion__list\">\n {items.map((item, index) => (\n <div \n class={{\n 'accordion-item': true,\n 'accordion-item--expanded': this.expandedIndex === index\n }}\n key={index}\n >\n <button\n class=\"accordion-item__header\"\n onClick={() => this.handleItemClick(index)}\n aria-expanded={this.expandedIndex === index ? 'true' : 'false'}\n >\n <h4 class=\"accordion-item__title\">{item.title}</h4>\n {/* Plus → minus: a single SVG with two strokes, the\n vertical one rotated-out to zero when expanded. This\n gives a fluid morph instead of swapping SVGs mid-\n animation. */}\n <span class=\"accordion-item__icon\" aria-hidden=\"true\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path class=\"accordion-item__icon-bar\" d=\"M5 12H19\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\n <path class=\"accordion-item__icon-bar accordion-item__icon-bar--vert\" d=\"M12 5V19\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>\n </svg>\n </span>\n </button>\n <div\n class=\"accordion-item__content\"\n style={{\n opacity: this.expandedIndex === index ? '1' : '0'\n }}\n >\n <p class=\"accordion-item__description\">{item.description}</p>\n {this.expandedIndex === index && this.autoCycle && (\n <div class=\"accordion-item__timer-track\">\n <div \n class=\"accordion-item__timer-progress\"\n style={{ width: `${this.timerProgress}%` }}\n ></div>\n </div>\n )}\n </div>\n </div>\n ))}\n </div>\n\n {/* Right side - Image */}\n <div class=\"feature-accordion__image-container\">\n <div class=\"feature-accordion__image-wrapper\">\n {currentItem?.imageUrl && (\n <img \n src={currentItem.imageUrl} \n alt={currentItem.imageAlt || currentItem.title}\n class=\"feature-accordion__image\"\n />\n )}\n {!currentItem?.imageUrl && (\n <div class=\"feature-accordion__image-placeholder\">\n <slot name=\"image\"></slot>\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,qBAAqB,GAAG,+4KAA+4K;;MC8Bh6K,kBAAkB,GAAA,MAAA;AAN/B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAUU,QAAA,IAAO,CAAA,OAAA,GAAW,+BAA+B;;AAGjD,QAAA,IAAK,CAAA,KAAA,GAAW,IAAI;;AAGpB,QAAA,IAAa,CAAA,aAAA,GAAW,IAAI;;AAG5B,QAAA,IAAS,CAAA,SAAA,GAAY,IAAI;;AAGxB,QAAA,IAAa,CAAA,aAAA,GAAW,CAAC;;AAGzB,QAAA,IAAa,CAAA,aAAA,GAAW,GAAG;AAE5B,QAAA,IAAa,CAAA,aAAA,GAAkB,IAAI;AACnC,QAAA,IAAiB,CAAA,iBAAA,GAAW,CAAC;AA4JtC;IA1JC,gBAAgB,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,CAAC,YAAY,EAAE;;;IAIvB,oBAAoB,GAAA;QAClB,IAAI,CAAC,WAAW,EAAE;;AAIpB,IAAA,qBAAqB,CAAC,QAAiB,EAAA;QACrC,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,YAAY,EAAE;;aACd;YACL,IAAI,CAAC,WAAW,EAAE;;;IAId,QAAQ,GAAA;AACd,QAAA,IAAI;YACF,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;;AAC7B,QAAA,MAAM;AACN,YAAA,OAAO,EAAE;;;IAIL,YAAY,GAAA;QAClB,IAAI,CAAC,WAAW,EAAE;AAClB,QAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,GAAG,EAAE;AACnC,QAAA,IAAI,CAAC,aAAa,GAAG,GAAG;;QAGxB,MAAM,cAAc,GAAG,MAAK;YAC1B,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,iBAAiB;AACnD,YAAA,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,GAAG,OAAO;AAE9C,YAAA,IAAI,SAAS,IAAI,CAAC,EAAE;gBAClB,IAAI,CAAC,cAAc,EAAE;;iBAChB;AACL,gBAAA,IAAI,CAAC,aAAa,GAAG,CAAC,SAAS,GAAG,IAAI,CAAC,aAAa,IAAI,GAAG;AAC3D,gBAAA,IAAI,CAAC,aAAa,GAAG,qBAAqB,CAAC,cAAc,CAAC;;AAE9D,SAAC;AAED,QAAA,IAAI,CAAC,aAAa,GAAG,qBAAqB,CAAC,cAAc,CAAC;;IAGpD,WAAW,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;AACtB,YAAA,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC;AACxC,YAAA,IAAI,CAAC,aAAa,GAAG,IAAI;;;IAIrB,cAAc,GAAA;AACpB,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE;AAC7B,QAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;YAAE;AAExB,QAAA,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,KAAK,CAAC,MAAM;;QAE5D,IAAI,CAAC,YAAY,EAAE;;AAGb,IAAA,eAAe,CAAC,KAAa,EAAA;;AAEnC,QAAA,IAAI,CAAC,aAAa,GAAG,KAAK;;AAE1B,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,CAAC,YAAY,EAAE;;;IAIvB,MAAM,GAAA;AACJ,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE;QAC7B,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC;QAE7C,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,8BAA8B,EAAA,EACvC,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAI,KAAK,EAAC,4BAA4B,IAAE,IAAI,CAAC,OAAO,CAAM,EAE1D,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,4BAA4B,EAAA,EAErC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,yBAAyB,IACjC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,MACrB,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAE;AACL,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,0BAA0B,EAAE,IAAI,CAAC,aAAa,KAAK;AACpD,aAAA,EACD,GAAG,EAAE,KAAK,EAAA,EAEV,CAAA,CAAA,QAAA,EAAA,EACE,KAAK,EAAC,wBAAwB,EAC9B,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,EAAA,eAAA,EAC3B,IAAI,CAAC,aAAa,KAAK,KAAK,GAAG,MAAM,GAAG,OAAO,EAAA,EAE9D,CAAA,CAAA,IAAA,EAAA,EAAI,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,KAAK,CAAM,EAKnD,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,sBAAsB,EAAA,aAAA,EAAa,MAAM,EAAA,EACnD,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAA,EAC5F,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,0BAA0B,EAAC,CAAC,EAAC,UAAU,EAAC,MAAM,EAAC,cAAc,EAAA,cAAA,EAAc,GAAG,EAAA,gBAAA,EAAgB,OAAO,EAAE,CAAA,EACnH,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,yDAAyD,EAAC,CAAC,EAAC,UAAU,EAAC,MAAM,EAAC,cAAc,kBAAc,GAAG,EAAA,gBAAA,EAAgB,OAAO,EAAE,CAAA,CAC9I,CACD,CACA,EACT,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAC,yBAAyB,EAC/B,KAAK,EAAE;AACL,gBAAA,OAAO,EAAE,IAAI,CAAC,aAAa,KAAK,KAAK,GAAG,GAAG,GAAG;AAC/C,aAAA,EAAA,EAED,CAAA,CAAA,GAAA,EAAA,EAAG,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,WAAW,CAAK,EAC5D,IAAI,CAAC,aAAa,KAAK,KAAK,IAAI,IAAI,CAAC,SAAS,KAC7C,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,6BAA6B,EAAA,EACtC,CACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,gCAAgC,EACtC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAG,EAAA,IAAI,CAAC,aAAa,GAAG,EAAE,EACrC,CAAA,CACH,CACP,CACG,CACF,CACP,CAAC,CACE,EAGN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,oCAAoC,EAAA,EAC7C,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kCAAkC,EAAA,EAC1C,WAAW,EAAE,QAAQ,KACpB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,WAAW,CAAC,QAAQ,EACzB,GAAG,EAAE,WAAW,CAAC,QAAQ,IAAI,WAAW,CAAC,KAAK,EAC9C,KAAK,EAAC,0BAA0B,EAAA,CAChC,CACH,EACA,CAAC,WAAW,EAAE,QAAQ,KACrB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,sCAAsC,EAAA,EAC/C,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,OAAO,EAAA,CAAQ,CACtB,CACP,CACG,CACF,CACF,CACF,CACF,CACD;;;;;;;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host } from './index-CYq0zyKH.js';
|
|
2
2
|
|
|
3
|
-
const afTestimonialStatCss = ".sc-af-testimonial-stat-h{display:block;flex:1;min-width:0}.stat.sc-af-testimonial-stat{display:flex;flex-direction:column;gap:8px}.stat--accent.sc-af-testimonial-stat{border-left:2px solid var(--af-background-border-active, var(--colour-softclay-800, #8a7049));padding-left:
|
|
3
|
+
const afTestimonialStatCss = ".sc-af-testimonial-stat-h{display:block;flex:1;min-width:0}.stat.sc-af-testimonial-stat{display:flex;flex-direction:column;gap:8px}.stat--accent.sc-af-testimonial-stat{border-left:2px solid var(--af-background-border-active, var(--colour-softclay-800, #8a7049));padding-left:24px;min-height:76px;justify-content:center}.stat-value.sc-af-testimonial-stat{--af-typography-heading-primary:var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #b09670));letter-spacing:-0.88px;white-space:nowrap;font-variant-numeric:lining-nums proportional-nums;font-feature-settings:'ss01', 'kern'}.stat-description.sc-af-testimonial-stat{--af-typography-body-default:var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343b));overflow:hidden;text-overflow:ellipsis}";
|
|
4
4
|
|
|
5
5
|
const AfTestimonialStat = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"af-testimonial-stat.entry.js","sources":["src/components/af-testimonial-stat/af-testimonial-stat.css?tag=af-testimonial-stat&encapsulation=scoped","src/components/af-testimonial-stat/af-testimonial-stat.tsx"],"sourcesContent":[":host {\n display: block;\n flex: 1;\n min-width: 0;\n}\n\n.stat {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.stat--accent {\n /* Themed active/accent border color */\n border-left: 2px solid var(--af-background-border-active, var(--colour-softclay-800, #8a7049));\n padding-left:
|
|
1
|
+
{"version":3,"file":"af-testimonial-stat.entry.js","sources":["src/components/af-testimonial-stat/af-testimonial-stat.css?tag=af-testimonial-stat&encapsulation=scoped","src/components/af-testimonial-stat/af-testimonial-stat.tsx"],"sourcesContent":[":host {\n display: block;\n flex: 1;\n min-width: 0;\n}\n\n.stat {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.stat--accent {\n /* Themed active/accent border color */\n border-left: 2px solid var(--af-background-border-active, var(--colour-softclay-800, #8a7049));\n /* Bumped from 16 px → 24 px because the prior 16 px gave too little\n breathing room between the divider and the stat-value at narrower\n card widths — long values like \"$1.2M\" / \"95%\" intersected the\n rule on State Cover Mutual / Felix at 1024-1280 vw. Surfaced\n 2026-04-27. */\n padding-left: 24px;\n min-height: 76px;\n justify-content: center;\n}\n\n/* Stat value - override af-heading to use secondary color */\n.stat-value {\n /* Override the heading color to use secondary (gold/ochre) instead of primary */\n --af-typography-heading-primary: var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #b09670));\n letter-spacing: -0.88px;\n white-space: nowrap;\n /* Lining figures so \"1B+\" / \"95%\" hit a consistent baseline and\n optical weight, matching af-stat. */\n font-variant-numeric: lining-nums proportional-nums;\n font-feature-settings: 'ss01', 'kern';\n}\n\n/* Description - override af-text to use body-dark for emphasis */\n.stat-description {\n --af-typography-body-default: var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343b));\n overflow: hidden;\n text-overflow: ellipsis;\n}","import { Component, Prop, h, Host } from '@stencil/core';\n\n@Component({\n tag: 'af-testimonial-stat',\n styleUrl: 'af-testimonial-stat.css',\n shadow: false,\n scoped: true,\n})\nexport class AfTestimonialStat {\n /**\n * The statistic value (e.g., \"95%\", \"10×\", \"120,000\")\n */\n @Prop() value!: string;\n\n /**\n * Description text for the statistic\n */\n @Prop() description!: string;\n\n /**\n * Whether to show left accent border\n */\n @Prop() accentBorder: boolean = false;\n\n render() {\n return (\n <Host>\n <div class={`stat ${this.accentBorder ? 'stat--accent' : ''}`}>\n {/* Stat value uses secondary heading color via CSS override */}\n <af-heading level={2} class=\"stat-value\">{this.value}</af-heading>\n {/* Description uses af-text for proper theming */}\n <af-text variant=\"medium\" class=\"stat-description\">{this.description}</af-text>\n </div>\n </Host>\n );\n }\n}\n\n\n"],"names":[],"mappings":";;AAAA,MAAM,oBAAoB,GAAG,uwBAAuwB;;MCQvxB,iBAAiB,GAAA,MAAA;AAN9B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAiBE;;AAEG;AACK,QAAA,IAAY,CAAA,YAAA,GAAY,KAAK;AActC;IAZC,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,QAAQ,IAAI,CAAC,YAAY,GAAG,cAAc,GAAG,EAAE,CAAE,CAAA,EAAA,EAE3D,CAAY,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAC,EAAE,KAAK,EAAC,YAAY,EAAE,EAAA,IAAI,CAAC,KAAK,CAAc,EAElE,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAC,kBAAkB,EAAE,EAAA,IAAI,CAAC,WAAW,CAAW,CAC3E,CACD;;;;;;;"}
|
package/dist/hydrate/index.js
CHANGED
|
@@ -3969,7 +3969,7 @@ class AfCheckbox {
|
|
|
3969
3969
|
}; }
|
|
3970
3970
|
}
|
|
3971
3971
|
|
|
3972
|
-
const afClientCarouselCss = ".sc-af-client-carousel-h{display:block;width:100%}.client-carousel.sc-af-client-carousel{padding:48px 0;display:flex;flex-direction:column;align-items:center;width:100%;overflow:hidden}.carousel-container.sc-af-client-carousel{display:flex;flex-direction:column;gap:var(--space-4, 16px);width:100%;overflow:hidden}.carousel-row.sc-af-client-carousel{display:flex;width:100%;overflow:hidden;position:relative}.logo-track.sc-af-client-carousel{display:flex;gap:var(--space-4, 16px);animation-timing-function:linear;animation-iteration-count:infinite}.scroll-left.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-left;animation-duration:40s}.scroll-right.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-right;animation-duration:40s}
|
|
3972
|
+
const afClientCarouselCss = ".sc-af-client-carousel-h{display:block;width:100%}.client-carousel.sc-af-client-carousel{padding:48px 0;display:flex;flex-direction:column;align-items:center;width:100%;overflow:hidden}.carousel-container.sc-af-client-carousel{display:flex;flex-direction:column;gap:var(--space-4, 16px);width:100%;overflow:hidden}.carousel-row.sc-af-client-carousel{display:flex;width:100%;overflow:hidden;position:relative}.logo-track.sc-af-client-carousel{display:flex;gap:var(--space-4, 16px);animation-timing-function:linear;animation-iteration-count:infinite}.scroll-left.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-left;animation-duration:40s}.scroll-right.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-right;animation-duration:40s}@media (prefers-reduced-motion: reduce){.logo-track.sc-af-client-carousel,.scroll-left.sc-af-client-carousel .logo-track.sc-af-client-carousel,.scroll-right.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation:none;transform:translateX(0)}}.client-carousel.mode-static.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation:none;justify-content:center;flex-wrap:wrap;width:100%}.client-carousel.mode-static.sc-af-client-carousel .carousel-row.sc-af-client-carousel{justify-content:center;overflow:visible}.client-carousel.mode-static.sc-af-client-carousel .carousel-container.sc-af-client-carousel{overflow:visible}.client-carousel.mode-static.sc-af-client-carousel{overflow:hidden}@keyframes scroll-left{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}@keyframes scroll-right{0%{transform:translateX(-50%)}100%{transform:translateX(0)}}.logo-track.sc-af-client-carousel>*.sc-af-client-carousel{display:flex;flex-shrink:0;gap:var(--space-4, 16px);align-items:center}.theme-inkwell.sc-af-client-carousel-h,.client-carousel.theme-inkwell.sc-af-client-carousel{background-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-well-bg:var(--colour-background-level1-dark, #203e45);--af-carousel-logo-color:white;--af-carousel-logo-filter:brightness(0) invert(1)}.theme-white.sc-af-client-carousel-h,.client-carousel.theme-white.sc-af-client-carousel{background-color:var(--colour-brand-white, #FFFFFF);--af-carousel-logo-well-bg:var(--colour-background-level1, #e8eeed);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-mist-green.sc-af-client-carousel-h,.client-carousel.theme-mist-green.sc-af-client-carousel{background-color:var(--colour-brand-mist-green, #C6D5D1);--af-carousel-logo-well-bg:var(--colour-mistgreen-300, #dde6e3);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-soft-clay.sc-af-client-carousel-h,.client-carousel.theme-soft-clay.sc-af-client-carousel{background-color:var(--colour-softclay-400, #c0ab8d);--af-carousel-logo-well-bg:var(--colour-softclay-200, #d5c5b0);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-white-ivory.sc-af-client-carousel-h,.client-carousel.theme-white-ivory.sc-af-client-carousel{background-color:var(--colour-brand-ivory-paper, #fff9ee);--af-carousel-logo-well-bg:var(--colour-softclay-100, #f2eadc);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}@media (max-width: 1024px){.client-carousel.sc-af-client-carousel{padding:32px 0}}@media (max-width: 767px){.client-carousel.sc-af-client-carousel{padding:24px 0}.carousel-container.sc-af-client-carousel{gap:var(--space-3, 12px)}.logo-track.sc-af-client-carousel{gap:var(--space-3, 12px)}.sc-af-client-carousel-s>*{gap:var(--space-3, 12px)}}";
|
|
3973
3973
|
|
|
3974
3974
|
/**
|
|
3975
3975
|
* Full-width row of client logos, either infinite-scrolling (default)
|
|
@@ -4215,7 +4215,7 @@ class AfDivider {
|
|
|
4215
4215
|
}; }
|
|
4216
4216
|
}
|
|
4217
4217
|
|
|
4218
|
-
const afFeatureAccordionCss = ".sc-af-feature-accordion-h{display:block;width:100%}.feature-accordion.sc-af-feature-accordion{padding:0 24px;--_heading-color:var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));--_body-color:var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));--_border-color:var(--af-background-border-default, rgba(20, 52, 59, 0.12))}.feature-accordion__heading.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:clamp(36px, 5vw, 52px);line-height:1.05;letter-spacing:-0.025em;color:var(--_heading-color);margin:0 0 56px 0}.feature-accordion__content.sc-af-feature-accordion{display:flex;gap:48px}.feature-accordion__list.sc-af-feature-accordion{display:flex;flex-direction:column;flex:1;min-width:0}.accordion-item.sc-af-feature-accordion{border-bottom:1px solid var(--_border-color)}.accordion-item.sc-af-feature-accordion:first-child{border-top:1px solid var(--_border-color)}.accordion-item__header.sc-af-feature-accordion{display:flex;align-items:center;justify-content:space-between;width:100%;padding:24px 0;background:none;border:none;cursor:pointer;text-align:left;gap:16px}.accordion-item__header.sc-af-feature-accordion:hover .accordion-item__title.sc-af-feature-accordion{color:var(--_heading-color)}.accordion-item__title.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:500;font-size:22px;line-height:1.25;color:var(--_heading-color);margin:0;flex:1;transition:color 0.2s ease}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__title.sc-af-feature-accordion{opacity:0.7}.accordion-item__icon.sc-af-feature-accordion{flex-shrink:0;width:24px;height:24px;color:var(--_heading-color);transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1))}.accordion-item__icon.sc-af-feature-accordion svg.sc-af-feature-accordion{display:block;width:100%;height:100%;overflow:visible}.accordion-item__icon-bar.sc-af-feature-accordion{transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-fast, 150ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));transform-origin:12px 12px}.accordion-item--expanded.sc-af-feature-accordion .accordion-item__icon-bar--vert.sc-af-feature-accordion{transform:scaleY(0);opacity:0}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__icon.sc-af-feature-accordion{opacity:0.5}.accordion-item__content.sc-af-feature-accordion{overflow:hidden;transition:
|
|
4218
|
+
const afFeatureAccordionCss = ".sc-af-feature-accordion-h{display:block;width:100%}.feature-accordion.sc-af-feature-accordion{padding:0 24px;--_heading-color:var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));--_body-color:var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));--_border-color:var(--af-background-border-default, rgba(20, 52, 59, 0.12))}.feature-accordion__heading.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:clamp(36px, 5vw, 52px);line-height:1.05;letter-spacing:-0.025em;color:var(--_heading-color);margin:0 0 56px 0}.feature-accordion__content.sc-af-feature-accordion{display:flex;gap:48px}.feature-accordion__list.sc-af-feature-accordion{display:flex;flex-direction:column;flex:1;min-width:0}.accordion-item.sc-af-feature-accordion{border-bottom:1px solid var(--_border-color)}.accordion-item.sc-af-feature-accordion:first-child{border-top:1px solid var(--_border-color)}.accordion-item__header.sc-af-feature-accordion{display:flex;align-items:center;justify-content:space-between;width:100%;padding:24px 0;background:none;border:none;cursor:pointer;text-align:left;gap:16px}.accordion-item__header.sc-af-feature-accordion:hover .accordion-item__title.sc-af-feature-accordion{color:var(--_heading-color)}.accordion-item__title.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:500;font-size:22px;line-height:1.25;color:var(--_heading-color);margin:0;flex:1;transition:color 0.2s ease}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__title.sc-af-feature-accordion{opacity:0.7}.accordion-item__icon.sc-af-feature-accordion{flex-shrink:0;width:24px;height:24px;color:var(--_heading-color);transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1))}.accordion-item__icon.sc-af-feature-accordion svg.sc-af-feature-accordion{display:block;width:100%;height:100%;overflow:visible}.accordion-item__icon-bar.sc-af-feature-accordion{transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-fast, 150ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));transform-origin:12px 12px}.accordion-item--expanded.sc-af-feature-accordion .accordion-item__icon-bar--vert.sc-af-feature-accordion{transform:scaleY(0);opacity:0}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__icon.sc-af-feature-accordion{opacity:0.5}.accordion-item__content.sc-af-feature-accordion{overflow:hidden;display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--motion-duration-slow, 300ms) var(--motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n opacity var(--motion-duration-slow, 300ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1))}.accordion-item--expanded.sc-af-feature-accordion .accordion-item__content.sc-af-feature-accordion{grid-template-rows:1fr}.accordion-item__content.sc-af-feature-accordion>*.sc-af-feature-accordion{min-height:0}@media (prefers-reduced-motion: reduce){.accordion-item__icon.sc-af-feature-accordion,.accordion-item__icon-bar.sc-af-feature-accordion,.accordion-item__content.sc-af-feature-accordion,.accordion-item__title.sc-af-feature-accordion{transition-duration:0.01ms}}.accordion-item__description.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:17px;line-height:1.6;color:var(--_body-color);margin:0 0 20px 0;padding-right:40px;opacity:0.85}.accordion-item__timer-track.sc-af-feature-accordion{height:3px;background-color:var(--_border-color);border-radius:2px;margin-bottom:8px;overflow:hidden;display:flex;justify-content:flex-start}.accordion-item__timer-progress.sc-af-feature-accordion{height:100%;background-color:var(--af-accent-progress, var(--colour-softclay-600, #9e8765));border-radius:2px;transition:width 0.05s linear}.feature-accordion__image-container.sc-af-feature-accordion{display:flex;align-items:center;justify-content:center;background-color:var(--af-background-level-1, var(--colour-mistgreen-300, #dde6e3));border-radius:20px;overflow:hidden;flex:1;min-width:0}.feature-accordion__image-wrapper.sc-af-feature-accordion{display:flex;align-items:center;justify-content:center;width:100%;padding:var(--af-feature-accordion-image-pad, 40px)}.feature-accordion__image.sc-af-feature-accordion{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 8px 32px rgba(0, 0, 0, 0.12)}.feature-accordion__image-placeholder.sc-af-feature-accordion{width:100%;height:100%;display:flex;align-items:center;justify-content:center}@media (max-width: 1024px){.feature-accordion__content.sc-af-feature-accordion{gap:32px}.feature-accordion__heading.sc-af-feature-accordion{margin-bottom:40px}.accordion-item__title.sc-af-feature-accordion{font-size:20px}}@media (max-width: 768px){.feature-accordion__content.sc-af-feature-accordion{flex-direction:column;gap:32px}.feature-accordion__image-container.sc-af-feature-accordion{order:-1;min-height:280px;flex:none}.feature-accordion__list.sc-af-feature-accordion{flex:none}.accordion-item__title.sc-af-feature-accordion{font-size:18px}.accordion-item__description.sc-af-feature-accordion{font-size:15px;padding-right:0}}";
|
|
4219
4219
|
|
|
4220
4220
|
/**
|
|
4221
4221
|
* Feature accordion component with expandable items and accompanying image.
|
|
@@ -4321,9 +4321,8 @@ class AfFeatureAccordion {
|
|
|
4321
4321
|
'accordion-item': true,
|
|
4322
4322
|
'accordion-item--expanded': this.expandedIndex === index
|
|
4323
4323
|
}, key: index }, hAsync("button", { class: "accordion-item__header", onClick: () => this.handleItemClick(index), "aria-expanded": this.expandedIndex === index ? 'true' : 'false' }, hAsync("h4", { class: "accordion-item__title" }, item.title), hAsync("span", { class: "accordion-item__icon", "aria-hidden": "true" }, hAsync("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { class: "accordion-item__icon-bar", d: "M5 12H19", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" }), hAsync("path", { class: "accordion-item__icon-bar accordion-item__icon-bar--vert", d: "M12 5V19", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" })))), hAsync("div", { class: "accordion-item__content", style: {
|
|
4324
|
-
maxHeight: this.expandedIndex === index ? '200px' : '0',
|
|
4325
4324
|
opacity: this.expandedIndex === index ? '1' : '0'
|
|
4326
|
-
} }, hAsync("p", { class: "accordion-item__description" }, item.description), this.expandedIndex === index && this.autoCycle && (hAsync("div", { class: "accordion-item__timer-track" }, hAsync("div", { class: "accordion-item__timer-progress", style: { width: `${this.timerProgress}%` } })))))))), hAsync("div", { key: '
|
|
4325
|
+
} }, hAsync("p", { class: "accordion-item__description" }, item.description), this.expandedIndex === index && this.autoCycle && (hAsync("div", { class: "accordion-item__timer-track" }, hAsync("div", { class: "accordion-item__timer-progress", style: { width: `${this.timerProgress}%` } })))))))), hAsync("div", { key: '160448af8f6c8c07adcb6aebf2cfdc27e29a242a', class: "feature-accordion__image-container" }, hAsync("div", { key: 'c67cb6ce37a6a737d005d445eeea242241439fd4', class: "feature-accordion__image-wrapper" }, currentItem?.imageUrl && (hAsync("img", { key: '663d009d13858b56ff4f4f91e64b07d386630f95', src: currentItem.imageUrl, alt: currentItem.imageAlt || currentItem.title, class: "feature-accordion__image" })), !currentItem?.imageUrl && (hAsync("div", { key: '2a1142e7e82cd7c0e0e12a6ba0b9b5bd7397f928', class: "feature-accordion__image-placeholder" }, hAsync("slot", { key: '6023de60150d6eb41b27ee459b123e2f95234588', name: "image" }))))))))));
|
|
4327
4326
|
}
|
|
4328
4327
|
get el() { return getElement(this); }
|
|
4329
4328
|
static get watchers() { return {
|
|
@@ -8039,7 +8038,7 @@ class AfTestimonialCarousel {
|
|
|
8039
8038
|
}; }
|
|
8040
8039
|
}
|
|
8041
8040
|
|
|
8042
|
-
const afTestimonialStatCss = ".sc-af-testimonial-stat-h{display:block;flex:1;min-width:0}.stat.sc-af-testimonial-stat{display:flex;flex-direction:column;gap:8px}.stat--accent.sc-af-testimonial-stat{border-left:2px solid var(--af-background-border-active, var(--colour-softclay-800, #8a7049));padding-left:
|
|
8041
|
+
const afTestimonialStatCss = ".sc-af-testimonial-stat-h{display:block;flex:1;min-width:0}.stat.sc-af-testimonial-stat{display:flex;flex-direction:column;gap:8px}.stat--accent.sc-af-testimonial-stat{border-left:2px solid var(--af-background-border-active, var(--colour-softclay-800, #8a7049));padding-left:24px;min-height:76px;justify-content:center}.stat-value.sc-af-testimonial-stat{--af-typography-heading-primary:var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #b09670));letter-spacing:-0.88px;white-space:nowrap;font-variant-numeric:lining-nums proportional-nums;font-feature-settings:'ss01', 'kern'}.stat-description.sc-af-testimonial-stat{--af-typography-body-default:var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343b));overflow:hidden;text-overflow:ellipsis}";
|
|
8043
8042
|
|
|
8044
8043
|
class AfTestimonialStat {
|
|
8045
8044
|
constructor(hostRef) {
|
package/dist/hydrate/index.mjs
CHANGED
|
@@ -3967,7 +3967,7 @@ class AfCheckbox {
|
|
|
3967
3967
|
}; }
|
|
3968
3968
|
}
|
|
3969
3969
|
|
|
3970
|
-
const afClientCarouselCss = ".sc-af-client-carousel-h{display:block;width:100%}.client-carousel.sc-af-client-carousel{padding:48px 0;display:flex;flex-direction:column;align-items:center;width:100%;overflow:hidden}.carousel-container.sc-af-client-carousel{display:flex;flex-direction:column;gap:var(--space-4, 16px);width:100%;overflow:hidden}.carousel-row.sc-af-client-carousel{display:flex;width:100%;overflow:hidden;position:relative}.logo-track.sc-af-client-carousel{display:flex;gap:var(--space-4, 16px);animation-timing-function:linear;animation-iteration-count:infinite}.scroll-left.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-left;animation-duration:40s}.scroll-right.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-right;animation-duration:40s}
|
|
3970
|
+
const afClientCarouselCss = ".sc-af-client-carousel-h{display:block;width:100%}.client-carousel.sc-af-client-carousel{padding:48px 0;display:flex;flex-direction:column;align-items:center;width:100%;overflow:hidden}.carousel-container.sc-af-client-carousel{display:flex;flex-direction:column;gap:var(--space-4, 16px);width:100%;overflow:hidden}.carousel-row.sc-af-client-carousel{display:flex;width:100%;overflow:hidden;position:relative}.logo-track.sc-af-client-carousel{display:flex;gap:var(--space-4, 16px);animation-timing-function:linear;animation-iteration-count:infinite}.scroll-left.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-left;animation-duration:40s}.scroll-right.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-right;animation-duration:40s}@media (prefers-reduced-motion: reduce){.logo-track.sc-af-client-carousel,.scroll-left.sc-af-client-carousel .logo-track.sc-af-client-carousel,.scroll-right.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation:none;transform:translateX(0)}}.client-carousel.mode-static.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation:none;justify-content:center;flex-wrap:wrap;width:100%}.client-carousel.mode-static.sc-af-client-carousel .carousel-row.sc-af-client-carousel{justify-content:center;overflow:visible}.client-carousel.mode-static.sc-af-client-carousel .carousel-container.sc-af-client-carousel{overflow:visible}.client-carousel.mode-static.sc-af-client-carousel{overflow:hidden}@keyframes scroll-left{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}@keyframes scroll-right{0%{transform:translateX(-50%)}100%{transform:translateX(0)}}.logo-track.sc-af-client-carousel>*.sc-af-client-carousel{display:flex;flex-shrink:0;gap:var(--space-4, 16px);align-items:center}.theme-inkwell.sc-af-client-carousel-h,.client-carousel.theme-inkwell.sc-af-client-carousel{background-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-well-bg:var(--colour-background-level1-dark, #203e45);--af-carousel-logo-color:white;--af-carousel-logo-filter:brightness(0) invert(1)}.theme-white.sc-af-client-carousel-h,.client-carousel.theme-white.sc-af-client-carousel{background-color:var(--colour-brand-white, #FFFFFF);--af-carousel-logo-well-bg:var(--colour-background-level1, #e8eeed);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-mist-green.sc-af-client-carousel-h,.client-carousel.theme-mist-green.sc-af-client-carousel{background-color:var(--colour-brand-mist-green, #C6D5D1);--af-carousel-logo-well-bg:var(--colour-mistgreen-300, #dde6e3);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-soft-clay.sc-af-client-carousel-h,.client-carousel.theme-soft-clay.sc-af-client-carousel{background-color:var(--colour-softclay-400, #c0ab8d);--af-carousel-logo-well-bg:var(--colour-softclay-200, #d5c5b0);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-white-ivory.sc-af-client-carousel-h,.client-carousel.theme-white-ivory.sc-af-client-carousel{background-color:var(--colour-brand-ivory-paper, #fff9ee);--af-carousel-logo-well-bg:var(--colour-softclay-100, #f2eadc);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}@media (max-width: 1024px){.client-carousel.sc-af-client-carousel{padding:32px 0}}@media (max-width: 767px){.client-carousel.sc-af-client-carousel{padding:24px 0}.carousel-container.sc-af-client-carousel{gap:var(--space-3, 12px)}.logo-track.sc-af-client-carousel{gap:var(--space-3, 12px)}.sc-af-client-carousel-s>*{gap:var(--space-3, 12px)}}";
|
|
3971
3971
|
|
|
3972
3972
|
/**
|
|
3973
3973
|
* Full-width row of client logos, either infinite-scrolling (default)
|
|
@@ -4213,7 +4213,7 @@ class AfDivider {
|
|
|
4213
4213
|
}; }
|
|
4214
4214
|
}
|
|
4215
4215
|
|
|
4216
|
-
const afFeatureAccordionCss = ".sc-af-feature-accordion-h{display:block;width:100%}.feature-accordion.sc-af-feature-accordion{padding:0 24px;--_heading-color:var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));--_body-color:var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));--_border-color:var(--af-background-border-default, rgba(20, 52, 59, 0.12))}.feature-accordion__heading.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:clamp(36px, 5vw, 52px);line-height:1.05;letter-spacing:-0.025em;color:var(--_heading-color);margin:0 0 56px 0}.feature-accordion__content.sc-af-feature-accordion{display:flex;gap:48px}.feature-accordion__list.sc-af-feature-accordion{display:flex;flex-direction:column;flex:1;min-width:0}.accordion-item.sc-af-feature-accordion{border-bottom:1px solid var(--_border-color)}.accordion-item.sc-af-feature-accordion:first-child{border-top:1px solid var(--_border-color)}.accordion-item__header.sc-af-feature-accordion{display:flex;align-items:center;justify-content:space-between;width:100%;padding:24px 0;background:none;border:none;cursor:pointer;text-align:left;gap:16px}.accordion-item__header.sc-af-feature-accordion:hover .accordion-item__title.sc-af-feature-accordion{color:var(--_heading-color)}.accordion-item__title.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:500;font-size:22px;line-height:1.25;color:var(--_heading-color);margin:0;flex:1;transition:color 0.2s ease}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__title.sc-af-feature-accordion{opacity:0.7}.accordion-item__icon.sc-af-feature-accordion{flex-shrink:0;width:24px;height:24px;color:var(--_heading-color);transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1))}.accordion-item__icon.sc-af-feature-accordion svg.sc-af-feature-accordion{display:block;width:100%;height:100%;overflow:visible}.accordion-item__icon-bar.sc-af-feature-accordion{transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-fast, 150ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));transform-origin:12px 12px}.accordion-item--expanded.sc-af-feature-accordion .accordion-item__icon-bar--vert.sc-af-feature-accordion{transform:scaleY(0);opacity:0}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__icon.sc-af-feature-accordion{opacity:0.5}.accordion-item__content.sc-af-feature-accordion{overflow:hidden;transition:
|
|
4216
|
+
const afFeatureAccordionCss = ".sc-af-feature-accordion-h{display:block;width:100%}.feature-accordion.sc-af-feature-accordion{padding:0 24px;--_heading-color:var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));--_body-color:var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));--_border-color:var(--af-background-border-default, rgba(20, 52, 59, 0.12))}.feature-accordion__heading.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:clamp(36px, 5vw, 52px);line-height:1.05;letter-spacing:-0.025em;color:var(--_heading-color);margin:0 0 56px 0}.feature-accordion__content.sc-af-feature-accordion{display:flex;gap:48px}.feature-accordion__list.sc-af-feature-accordion{display:flex;flex-direction:column;flex:1;min-width:0}.accordion-item.sc-af-feature-accordion{border-bottom:1px solid var(--_border-color)}.accordion-item.sc-af-feature-accordion:first-child{border-top:1px solid var(--_border-color)}.accordion-item__header.sc-af-feature-accordion{display:flex;align-items:center;justify-content:space-between;width:100%;padding:24px 0;background:none;border:none;cursor:pointer;text-align:left;gap:16px}.accordion-item__header.sc-af-feature-accordion:hover .accordion-item__title.sc-af-feature-accordion{color:var(--_heading-color)}.accordion-item__title.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:500;font-size:22px;line-height:1.25;color:var(--_heading-color);margin:0;flex:1;transition:color 0.2s ease}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__title.sc-af-feature-accordion{opacity:0.7}.accordion-item__icon.sc-af-feature-accordion{flex-shrink:0;width:24px;height:24px;color:var(--_heading-color);transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1))}.accordion-item__icon.sc-af-feature-accordion svg.sc-af-feature-accordion{display:block;width:100%;height:100%;overflow:visible}.accordion-item__icon-bar.sc-af-feature-accordion{transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-fast, 150ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));transform-origin:12px 12px}.accordion-item--expanded.sc-af-feature-accordion .accordion-item__icon-bar--vert.sc-af-feature-accordion{transform:scaleY(0);opacity:0}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__icon.sc-af-feature-accordion{opacity:0.5}.accordion-item__content.sc-af-feature-accordion{overflow:hidden;display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--motion-duration-slow, 300ms) var(--motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n opacity var(--motion-duration-slow, 300ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1))}.accordion-item--expanded.sc-af-feature-accordion .accordion-item__content.sc-af-feature-accordion{grid-template-rows:1fr}.accordion-item__content.sc-af-feature-accordion>*.sc-af-feature-accordion{min-height:0}@media (prefers-reduced-motion: reduce){.accordion-item__icon.sc-af-feature-accordion,.accordion-item__icon-bar.sc-af-feature-accordion,.accordion-item__content.sc-af-feature-accordion,.accordion-item__title.sc-af-feature-accordion{transition-duration:0.01ms}}.accordion-item__description.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:17px;line-height:1.6;color:var(--_body-color);margin:0 0 20px 0;padding-right:40px;opacity:0.85}.accordion-item__timer-track.sc-af-feature-accordion{height:3px;background-color:var(--_border-color);border-radius:2px;margin-bottom:8px;overflow:hidden;display:flex;justify-content:flex-start}.accordion-item__timer-progress.sc-af-feature-accordion{height:100%;background-color:var(--af-accent-progress, var(--colour-softclay-600, #9e8765));border-radius:2px;transition:width 0.05s linear}.feature-accordion__image-container.sc-af-feature-accordion{display:flex;align-items:center;justify-content:center;background-color:var(--af-background-level-1, var(--colour-mistgreen-300, #dde6e3));border-radius:20px;overflow:hidden;flex:1;min-width:0}.feature-accordion__image-wrapper.sc-af-feature-accordion{display:flex;align-items:center;justify-content:center;width:100%;padding:var(--af-feature-accordion-image-pad, 40px)}.feature-accordion__image.sc-af-feature-accordion{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 8px 32px rgba(0, 0, 0, 0.12)}.feature-accordion__image-placeholder.sc-af-feature-accordion{width:100%;height:100%;display:flex;align-items:center;justify-content:center}@media (max-width: 1024px){.feature-accordion__content.sc-af-feature-accordion{gap:32px}.feature-accordion__heading.sc-af-feature-accordion{margin-bottom:40px}.accordion-item__title.sc-af-feature-accordion{font-size:20px}}@media (max-width: 768px){.feature-accordion__content.sc-af-feature-accordion{flex-direction:column;gap:32px}.feature-accordion__image-container.sc-af-feature-accordion{order:-1;min-height:280px;flex:none}.feature-accordion__list.sc-af-feature-accordion{flex:none}.accordion-item__title.sc-af-feature-accordion{font-size:18px}.accordion-item__description.sc-af-feature-accordion{font-size:15px;padding-right:0}}";
|
|
4217
4217
|
|
|
4218
4218
|
/**
|
|
4219
4219
|
* Feature accordion component with expandable items and accompanying image.
|
|
@@ -4319,9 +4319,8 @@ class AfFeatureAccordion {
|
|
|
4319
4319
|
'accordion-item': true,
|
|
4320
4320
|
'accordion-item--expanded': this.expandedIndex === index
|
|
4321
4321
|
}, key: index }, hAsync("button", { class: "accordion-item__header", onClick: () => this.handleItemClick(index), "aria-expanded": this.expandedIndex === index ? 'true' : 'false' }, hAsync("h4", { class: "accordion-item__title" }, item.title), hAsync("span", { class: "accordion-item__icon", "aria-hidden": "true" }, hAsync("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { class: "accordion-item__icon-bar", d: "M5 12H19", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" }), hAsync("path", { class: "accordion-item__icon-bar accordion-item__icon-bar--vert", d: "M12 5V19", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" })))), hAsync("div", { class: "accordion-item__content", style: {
|
|
4322
|
-
maxHeight: this.expandedIndex === index ? '200px' : '0',
|
|
4323
4322
|
opacity: this.expandedIndex === index ? '1' : '0'
|
|
4324
|
-
} }, hAsync("p", { class: "accordion-item__description" }, item.description), this.expandedIndex === index && this.autoCycle && (hAsync("div", { class: "accordion-item__timer-track" }, hAsync("div", { class: "accordion-item__timer-progress", style: { width: `${this.timerProgress}%` } })))))))), hAsync("div", { key: '
|
|
4323
|
+
} }, hAsync("p", { class: "accordion-item__description" }, item.description), this.expandedIndex === index && this.autoCycle && (hAsync("div", { class: "accordion-item__timer-track" }, hAsync("div", { class: "accordion-item__timer-progress", style: { width: `${this.timerProgress}%` } })))))))), hAsync("div", { key: '160448af8f6c8c07adcb6aebf2cfdc27e29a242a', class: "feature-accordion__image-container" }, hAsync("div", { key: 'c67cb6ce37a6a737d005d445eeea242241439fd4', class: "feature-accordion__image-wrapper" }, currentItem?.imageUrl && (hAsync("img", { key: '663d009d13858b56ff4f4f91e64b07d386630f95', src: currentItem.imageUrl, alt: currentItem.imageAlt || currentItem.title, class: "feature-accordion__image" })), !currentItem?.imageUrl && (hAsync("div", { key: '2a1142e7e82cd7c0e0e12a6ba0b9b5bd7397f928', class: "feature-accordion__image-placeholder" }, hAsync("slot", { key: '6023de60150d6eb41b27ee459b123e2f95234588', name: "image" }))))))))));
|
|
4325
4324
|
}
|
|
4326
4325
|
get el() { return getElement(this); }
|
|
4327
4326
|
static get watchers() { return {
|
|
@@ -8037,7 +8036,7 @@ class AfTestimonialCarousel {
|
|
|
8037
8036
|
}; }
|
|
8038
8037
|
}
|
|
8039
8038
|
|
|
8040
|
-
const afTestimonialStatCss = ".sc-af-testimonial-stat-h{display:block;flex:1;min-width:0}.stat.sc-af-testimonial-stat{display:flex;flex-direction:column;gap:8px}.stat--accent.sc-af-testimonial-stat{border-left:2px solid var(--af-background-border-active, var(--colour-softclay-800, #8a7049));padding-left:
|
|
8039
|
+
const afTestimonialStatCss = ".sc-af-testimonial-stat-h{display:block;flex:1;min-width:0}.stat.sc-af-testimonial-stat{display:flex;flex-direction:column;gap:8px}.stat--accent.sc-af-testimonial-stat{border-left:2px solid var(--af-background-border-active, var(--colour-softclay-800, #8a7049));padding-left:24px;min-height:76px;justify-content:center}.stat-value.sc-af-testimonial-stat{--af-typography-heading-primary:var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #b09670));letter-spacing:-0.88px;white-space:nowrap;font-variant-numeric:lining-nums proportional-nums;font-feature-settings:'ss01', 'kern'}.stat-description.sc-af-testimonial-stat{--af-typography-body-default:var(--af-typography-body-dark, var(--colour-brand-inkwell, #14343b));overflow:hidden;text-overflow:ellipsis}";
|
|
8041
8040
|
|
|
8042
8041
|
class AfTestimonialStat {
|
|
8043
8042
|
constructor(hostRef) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@affinda/wc",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.2",
|
|
4
4
|
"private": false,
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.cjs.js",
|
|
@@ -34,8 +34,8 @@
|
|
|
34
34
|
],
|
|
35
35
|
"dependencies": {
|
|
36
36
|
"@stencil/core": "^4.9.1",
|
|
37
|
+
"@affinda/css": "^0.1.5",
|
|
37
38
|
"@affinda/icons": "^0.0.6",
|
|
38
|
-
"@affinda/css": "^0.1.2",
|
|
39
39
|
"@affinda/illustrations": "^0.0.8",
|
|
40
40
|
"@affinda/tokens": "^0.2.0"
|
|
41
41
|
},
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,h as a,H as c,a as l}from"./p-CYq0zyKH.js";const o=".sc-af-client-carousel-h{display:block;width:100%}.client-carousel.sc-af-client-carousel{padding:48px 0;display:flex;flex-direction:column;align-items:center;width:100%;overflow:hidden}.carousel-container.sc-af-client-carousel{display:flex;flex-direction:column;gap:var(--space-4, 16px);width:100%;overflow:hidden}.carousel-row.sc-af-client-carousel{display:flex;width:100%;overflow:hidden;position:relative}.logo-track.sc-af-client-carousel{display:flex;gap:var(--space-4, 16px);animation-timing-function:linear;animation-iteration-count:infinite}.scroll-left.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-left;animation-duration:40s}.scroll-right.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation-name:scroll-right;animation-duration:40s}.sc-af-client-carousel-h:hover .logo-track.sc-af-client-carousel{animation-play-state:paused}@media (prefers-reduced-motion: reduce){.logo-track.sc-af-client-carousel,.scroll-left.sc-af-client-carousel .logo-track.sc-af-client-carousel,.scroll-right.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation:none;transform:translateX(0)}}.client-carousel.mode-static.sc-af-client-carousel .logo-track.sc-af-client-carousel{animation:none;justify-content:center;flex-wrap:wrap;width:100%}.client-carousel.mode-static.sc-af-client-carousel .carousel-row.sc-af-client-carousel{justify-content:center;overflow:visible}.client-carousel.mode-static.sc-af-client-carousel .carousel-container.sc-af-client-carousel{overflow:visible}.client-carousel.mode-static.sc-af-client-carousel{overflow:hidden}@keyframes scroll-left{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}@keyframes scroll-right{0%{transform:translateX(-50%)}100%{transform:translateX(0)}}.logo-track.sc-af-client-carousel>*.sc-af-client-carousel{display:flex;flex-shrink:0;gap:var(--space-4, 16px);align-items:center}.theme-inkwell.sc-af-client-carousel-h,.client-carousel.theme-inkwell.sc-af-client-carousel{background-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-well-bg:var(--colour-background-level1-dark, #203e45);--af-carousel-logo-color:white;--af-carousel-logo-filter:brightness(0) invert(1)}.theme-white.sc-af-client-carousel-h,.client-carousel.theme-white.sc-af-client-carousel{background-color:var(--colour-brand-white, #FFFFFF);--af-carousel-logo-well-bg:var(--colour-background-level1, #e8eeed);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-mist-green.sc-af-client-carousel-h,.client-carousel.theme-mist-green.sc-af-client-carousel{background-color:var(--colour-brand-mist-green, #C6D5D1);--af-carousel-logo-well-bg:var(--colour-mistgreen-300, #dde6e3);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-soft-clay.sc-af-client-carousel-h,.client-carousel.theme-soft-clay.sc-af-client-carousel{background-color:var(--colour-softclay-400, #c0ab8d);--af-carousel-logo-well-bg:var(--colour-softclay-200, #d5c5b0);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}.theme-white-ivory.sc-af-client-carousel-h,.client-carousel.theme-white-ivory.sc-af-client-carousel{background-color:var(--colour-brand-ivory-paper, #fff9ee);--af-carousel-logo-well-bg:var(--colour-softclay-100, #f2eadc);--af-carousel-logo-color:var(--colour-brand-inkwell, #14343B);--af-carousel-logo-filter:none}@media (max-width: 1024px){.client-carousel.sc-af-client-carousel{padding:32px 0}}@media (max-width: 767px){.client-carousel.sc-af-client-carousel{padding:24px 0}.carousel-container.sc-af-client-carousel{gap:var(--space-3, 12px)}.logo-track.sc-af-client-carousel{gap:var(--space-3, 12px)}.sc-af-client-carousel-s>*{gap:var(--space-3, 12px)}}";const r=class{constructor(a){e(this,a);this.theme="inkwell";this.rows=1;this.mode="scroll"}componentDidLoad(){if(this.mode==="static")return;this.duplicateTrackContent(this.row1TrackRef);if(Number(this.rows)===2){this.duplicateTrackContent(this.row2TrackRef)}}duplicateTrackContent(e){if(!e)return;const a=Array.from(e.children).filter((e=>!e.hasAttribute("data-carousel-clone")));a.forEach((a=>{const c=a.cloneNode(true);c.setAttribute("data-carousel-clone","");c.setAttribute("aria-hidden","true");e.appendChild(c)}))}render(){const e=Number(this.rows);return a(c,{key:"de2ab8e013b602bae7f3a7ec86f46008271017df",class:`theme-${this.theme} mode-${this.mode}`},a("div",{key:"2a7f391b7f2821cc2b1fd22c4fecee8db49993eb",class:`client-carousel theme-${this.theme} rows-${e} mode-${this.mode}`},a("div",{key:"a050be7df00baa8f606edaaffaf80bf66d2745a5",class:"carousel-container"},a("div",{key:"652ebd5057f104456d327ea0741676d4c5f365c1",class:"carousel-row scroll-left"},a("div",{key:"115c61cf864eafef5de415cf47d5e7ad78326f49",class:"logo-track",ref:e=>this.row1TrackRef=e},a("slot",{key:"16d1001521b3950fbf24868df8f2f3141571ab9d",name:"row-1"},a("slot",{key:"b939997a0c782911cc46b68d6a2ea14cb3a85018"})))),e===2&&a("div",{key:"3490957a149d49dbbf37571efb27663c64bd39ea",class:"carousel-row scroll-right"},a("div",{key:"46944607b424071fc97864601f4392a649f1a890",class:"logo-track",ref:e=>this.row2TrackRef=e},a("slot",{key:"ec1be2a0b81dccfeda6a29650242808fcc67b214",name:"row-2"}))))))}get el(){return l(this)}};r.style=o;export{r as af_client_carousel};
|
|
2
|
-
//# sourceMappingURL=p-2e67fb0d.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,h as a,H as o,a as i}from"./p-CYq0zyKH.js";const r=".sc-af-feature-accordion-h{display:block;width:100%}.feature-accordion.sc-af-feature-accordion{padding:0 24px;--_heading-color:var(--af-typography-heading-primary, var(--colour-brand-inkwell, #14343b));--_body-color:var(--af-typography-body-default, var(--colour-inkwell-400, #2b484f));--_border-color:var(--af-background-border-default, rgba(20, 52, 59, 0.12))}.feature-accordion__heading.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:clamp(36px, 5vw, 52px);line-height:1.05;letter-spacing:-0.025em;color:var(--_heading-color);margin:0 0 56px 0}.feature-accordion__content.sc-af-feature-accordion{display:flex;gap:48px}.feature-accordion__list.sc-af-feature-accordion{display:flex;flex-direction:column;flex:1;min-width:0}.accordion-item.sc-af-feature-accordion{border-bottom:1px solid var(--_border-color)}.accordion-item.sc-af-feature-accordion:first-child{border-top:1px solid var(--_border-color)}.accordion-item__header.sc-af-feature-accordion{display:flex;align-items:center;justify-content:space-between;width:100%;padding:24px 0;background:none;border:none;cursor:pointer;text-align:left;gap:16px}.accordion-item__header.sc-af-feature-accordion:hover .accordion-item__title.sc-af-feature-accordion{color:var(--_heading-color)}.accordion-item__title.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:500;font-size:22px;line-height:1.25;color:var(--_heading-color);margin:0;flex:1;transition:color 0.2s ease}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__title.sc-af-feature-accordion{opacity:0.7}.accordion-item__icon.sc-af-feature-accordion{flex-shrink:0;width:24px;height:24px;color:var(--_heading-color);transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1))}.accordion-item__icon.sc-af-feature-accordion svg.sc-af-feature-accordion{display:block;width:100%;height:100%;overflow:visible}.accordion-item__icon-bar.sc-af-feature-accordion{transition:transform var(--motion-duration-base, 200ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1)),\n opacity var(--motion-duration-fast, 150ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1));transform-origin:12px 12px}.accordion-item--expanded.sc-af-feature-accordion .accordion-item__icon-bar--vert.sc-af-feature-accordion{transform:scaleY(0);opacity:0}.accordion-item.sc-af-feature-accordion:not(.accordion-item--expanded) .accordion-item__icon.sc-af-feature-accordion{opacity:0.5}.accordion-item__content.sc-af-feature-accordion{overflow:hidden;transition:max-height var(--motion-duration-slow, 300ms) var(--motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n opacity var(--motion-duration-slow, 300ms) var(--motion-easing-standard, cubic-bezier(0.4, 0, 0.2, 1))}@media (prefers-reduced-motion: reduce){.accordion-item__icon.sc-af-feature-accordion,.accordion-item__icon-bar.sc-af-feature-accordion,.accordion-item__content.sc-af-feature-accordion,.accordion-item__title.sc-af-feature-accordion{transition-duration:0.01ms}}.accordion-item__description.sc-af-feature-accordion{font-family:var(--typography-primaryfont, 'NeuSans', sans-serif);font-weight:400;font-size:17px;line-height:1.6;color:var(--_body-color);margin:0 0 20px 0;padding-right:40px;opacity:0.85}.accordion-item__timer-track.sc-af-feature-accordion{height:3px;background-color:var(--_border-color);border-radius:2px;margin-bottom:8px;overflow:hidden;display:flex;justify-content:flex-start}.accordion-item__timer-progress.sc-af-feature-accordion{height:100%;background-color:var(--af-accent-progress, var(--colour-softclay-600, #9e8765));border-radius:2px;transition:width 0.05s linear}.feature-accordion__image-container.sc-af-feature-accordion{display:flex;align-items:center;justify-content:center;background-color:var(--af-background-level-1, var(--colour-mistgreen-300, #dde6e3));border-radius:20px;overflow:hidden;flex:1;min-width:0}.feature-accordion__image-wrapper.sc-af-feature-accordion{display:flex;align-items:center;justify-content:center;width:100%;padding:var(--af-feature-accordion-image-pad, 40px)}.feature-accordion__image.sc-af-feature-accordion{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 8px 32px rgba(0, 0, 0, 0.12)}.feature-accordion__image-placeholder.sc-af-feature-accordion{width:100%;height:100%;display:flex;align-items:center;justify-content:center}@media (max-width: 1024px){.feature-accordion__content.sc-af-feature-accordion{gap:32px}.feature-accordion__heading.sc-af-feature-accordion{margin-bottom:40px}.accordion-item__title.sc-af-feature-accordion{font-size:20px}}@media (max-width: 768px){.feature-accordion__content.sc-af-feature-accordion{flex-direction:column;gap:32px}.feature-accordion__image-container.sc-af-feature-accordion{order:-1;min-height:280px;flex:none}.feature-accordion__list.sc-af-feature-accordion{flex:none}.accordion-item__title.sc-af-feature-accordion{font-size:18px}.accordion-item__description.sc-af-feature-accordion{font-size:15px;padding-right:0}}";const c=class{constructor(a){e(this,a);this.heading="Give AI agents your paperwork";this.items="[]";this.cycleInterval=6e3;this.autoCycle=true;this.expandedIndex=0;this.timerProgress=100;this.progressTimer=null;this.progressStartTime=0}componentDidLoad(){if(this.autoCycle){this.startCycling()}}disconnectedCallback(){this.stopCycling()}handleAutoCycleChange(e){if(e){this.startCycling()}else{this.stopCycling()}}getItems(){try{return JSON.parse(this.items)}catch{return[]}}startCycling(){this.stopCycling();this.progressStartTime=Date.now();this.timerProgress=100;const e=()=>{const a=Date.now()-this.progressStartTime;const o=this.cycleInterval-a;if(o<=0){this.moveToNextItem()}else{this.timerProgress=o/this.cycleInterval*100;this.progressTimer=requestAnimationFrame(e)}};this.progressTimer=requestAnimationFrame(e)}stopCycling(){if(this.progressTimer){cancelAnimationFrame(this.progressTimer);this.progressTimer=null}}moveToNextItem(){const e=this.getItems();if(e.length===0)return;this.expandedIndex=(this.expandedIndex+1)%e.length;this.startCycling()}handleItemClick(e){this.expandedIndex=e;if(this.autoCycle){this.startCycling()}}render(){const e=this.getItems();const i=e[this.expandedIndex];return a(o,{key:"595e09ae8153ade7a4fa676eb6f286fc4fec5efe"},a("div",{key:"ee35766aa1e9300b4826576913bb7c84ede6a1e7",class:"feature-accordion"},a("div",{key:"a12641497c3c3de7e975ebd0735998d4febefb5f",class:"feature-accordion__container"},a("h2",{key:"42bb968907b3f2745f0ca8f2b40ccfb0e085dad5",class:"feature-accordion__heading"},this.heading),a("div",{key:"b70e9007418de1a53cf3f77b4e5477b63d0a11f1",class:"feature-accordion__content"},a("div",{key:"3fdfbc954daa9d02efb1cdb4ea9d26caeba603c8",class:"feature-accordion__list"},e.map(((e,o)=>a("div",{class:{"accordion-item":true,"accordion-item--expanded":this.expandedIndex===o},key:o},a("button",{class:"accordion-item__header",onClick:()=>this.handleItemClick(o),"aria-expanded":this.expandedIndex===o?"true":"false"},a("h4",{class:"accordion-item__title"},e.title),a("span",{class:"accordion-item__icon","aria-hidden":"true"},a("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("path",{class:"accordion-item__icon-bar",d:"M5 12H19",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round"}),a("path",{class:"accordion-item__icon-bar accordion-item__icon-bar--vert",d:"M12 5V19",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round"})))),a("div",{class:"accordion-item__content",style:{maxHeight:this.expandedIndex===o?"200px":"0",opacity:this.expandedIndex===o?"1":"0"}},a("p",{class:"accordion-item__description"},e.description),this.expandedIndex===o&&this.autoCycle&&a("div",{class:"accordion-item__timer-track"},a("div",{class:"accordion-item__timer-progress",style:{width:`${this.timerProgress}%`}}))))))),a("div",{key:"902712779f4ff2eaae179762a7b78ff1f0784d58",class:"feature-accordion__image-container"},a("div",{key:"b741cfaf96428e786e8780cfeff90a0c315716e8",class:"feature-accordion__image-wrapper"},i?.imageUrl&&a("img",{key:"2a565b530441c9953139b3c0517f480a81f0a77a",src:i.imageUrl,alt:i.imageAlt||i.title,class:"feature-accordion__image"}),!i?.imageUrl&&a("div",{key:"f8248c73c5dcbd6b8224ad646ee867d34004437d",class:"feature-accordion__image-placeholder"},a("slot",{key:"9cbe9ee773b0acd5a1b80fa4f6dd2f293152e598",name:"image"}))))))))}get el(){return i(this)}static get watchers(){return{autoCycle:["handleAutoCycleChange"]}}};c.style=r;export{c as af_feature_accordion};
|
|
2
|
-
//# sourceMappingURL=p-39a40e6a.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["registerInstance","h","Host","getElement","afFeatureAccordionCss","AfFeatureAccordion","constructor","hostRef","this","heading","items","cycleInterval","autoCycle","expandedIndex","timerProgress","progressTimer","progressStartTime","componentDidLoad","startCycling","disconnectedCallback","stopCycling","handleAutoCycleChange","newValue","getItems","JSON","parse","Date","now","updateProgress","elapsed","remaining","moveToNextItem","requestAnimationFrame","cancelAnimationFrame","length","handleItemClick","index","render","currentItem","key","class","map","item","onClick","title","width","height","viewBox","fill","xmlns","d","stroke","style","maxHeight","opacity","description","imageUrl","src","alt","imageAlt","name","el","watchers"],"sources":["0"],"mappings":"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","ignoreList":[]}
|
|
File without changes
|