@affinda/wc 0.0.27 → 0.1.0

package/dist/cjs/index.cjs.js

@@ -19,7 +19,7 @@ var afTab_entry = require('./af-tab.cjs.entry.js');
 var afTabBar_entry = require('./af-tab-bar.cjs.entry.js');
 var afFeatureCard_entry = require('./af-feature-card.cjs.entry.js');
 var afIllustratedCard_entry = require('./af-illustrated-card.cjs.entry.js');
-require('./index-BKMHxS4K.js');
+require('./index-BzZA0USq.js');
 
 
 

package/dist/cjs/loader.cjs.js

@@ -1,11 +1,11 @@
 'use strict';
 
-var index = require('./index-BKMHxS4K.js');
+var index = require('./index-BzZA0USq.js');
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await index.globalScripts();
-  return index.bootstrapLazy([["af-icon-text.cjs",[[262,"af-icon-text",{"icon":[1],"headingSize":[2,"heading-size"],"orientation":[1],"iconSize":[1,"icon-size"]}]]],["af-testimonial.cjs",[[262,"af-testimonial",{"backgroundImage":[1,"background-image"],"logoImage":[1,"logo-image"],"quote":[1],"attribution":[1],"readMoreLink":[1,"read-more-link"],"showNavigation":[1028,"show-navigation"],"hasPrev":[1028,"has-prev"],"hasNext":[1028,"has-next"]}]]],["af-feature-card.cjs",[[262,"af-feature-card",{"theme":[1],"layout":[1],"cardSize":[513,"card-size"],"headingSize":[2,"heading-size"],"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"]}]]],["af-illustrated-card.cjs",[[262,"af-illustrated-card",{"theme":[1],"breakpoint":[1],"cardSize":[1,"card-size"]}]]],["af-testimonial-stat.cjs",[[258,"af-testimonial-stat",{"value":[1],"description":[1],"accentBorder":[4,"accent-border"]}]]],["af-video-container.cjs",[[262,"af-video-container",{"videoThumbnailUrl":[1,"video-thumbnail-url"],"videoAlt":[1,"video-alt"],"videoUrl":[1,"video-url"]}]]],["af-feature-grid.cjs",[[262,"af-feature-grid",{"columns":[2],"mobileLayout":[1,"mobile-layout"],"scrollProgress":[32]},null,{"mobileLayout":["onMobileLayoutChange"]}]]],["af-grid-callout.cjs",[[262,"af-grid-callout",{"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"],"imagePosition":[1,"image-position"],"columns":[2],"headingSize":[2,"heading-size"]}]]],["af-in-page-banner.cjs",[[262,"af-in-page-banner",{"theme":[1],"heading":[1],"description":[1],"primaryButtonText":[1,"primary-button-text"],"primaryButtonUrl":[1,"primary-button-url"],"secondaryButtonText":[1,"secondary-button-text"],"secondaryButtonUrl":[1,"secondary-button-url"],"illustrationUrl":[1,"illustration-url"],"showWaveDecoration":[4,"show-wave-decoration"]}]]],["af-section.cjs",[[262,"af-section",{"padding":[1],"theme":[1],"container":[4]}]]],["af-split-section.cjs",[[262,"af-split-section",{"topTheme":[1,"top-theme"],"bottomTheme":[1,"bottom-theme"],"padding":[1],"container":[4]}]]],["af-testimonial-carousel.cjs",[[262,"af-testimonial-carousel",{"currentIndex":[32],"isAnimating":[32],"testimonialCount":[32]},[[0,"navPrev","handleNavPrev"],[0,"navNext","handleNavNext"]]]]],["af-text-image.cjs",[[262,"af-text-image",{"imagePosition":[1,"image-position"],"imageProportion":[1,"image-proportion"],"src":[1],"alt":[1],"showSecondLockup":[4,"show-second-lockup"]}]]],["af-accordion.cjs",[[262,"af-accordion",{"mode":[1],"value":[1025],"defaultValue":[1,"default-value"],"internalValue":[32]},[[0,"af-accordion-toggle","handleItemToggle"]],{"value":["handleValueChange"]}]]],["af-accordion-item.cjs",[[257,"af-accordion-item",{"itemId":[513,"item-id"],"open":[1540],"disabled":[516],"contentHeight":[32],"toggle":[64]},null,{"open":["handleOpenChange"]}]]],["af-button-group.cjs",[[257,"af-button-group",{"direction":[1],"gap":[1]}]]],["af-center.cjs",[[257,"af-center",{"axis":[1],"inline":[4],"minHeight":[1,"min-height"]}]]],["af-checkbox.cjs",[[257,"af-checkbox",{"checked":[1540],"indeterminate":[516],"disabled":[516],"name":[1],"value":[1]}]]],["af-client-carousel.cjs",[[262,"af-client-carousel",{"theme":[1],"rows":[2]}]]],["af-color-swatch.cjs",[[257,"af-color-swatch",{"color":[1],"name":[1],"size":[1]}]]],["af-contact-item.cjs",[[262,"af-contact-item",{"label":[1],"value":[1]}]]],["af-divider.cjs",[[257,"af-divider",{"orientation":[1],"spacing":[1]}]]],["af-feature-accordion.cjs",[[262,"af-feature-accordion",{"heading":[1],"items":[1],"cycleInterval":[2,"cycle-interval"],"autoCycle":[4,"auto-cycle"],"expandedIndex":[32],"timerProgress":[32]},null,{"autoCycle":["handleAutoCycleChange"]}]]],["af-fieldset.cjs",[[257,"af-fieldset",{"legend":[1],"orientation":[1],"disabled":[516]}]]],["af-footer.cjs",[[262,"af-footer",{"copyrightText":[1,"copyright-text"],"statusText":[1,"status-text"],"statusUrl":[1,"status-url"],"systemsOperational":[4,"systems-operational"],"showStatus":[4,"show-status"]}]]],["af-footer-column.cjs",[[262,"af-footer-column",{"heading":[1]}]]],["af-footer-link.cjs",[[262,"af-footer-link",{"href":[1],"external":[4]}]]],["af-grid.cjs",[[257,"af-grid",{"columns":[2],"columnsLg":[2,"columns-lg"],"columnsMd":[2,"columns-md"],"columnsSm":[2,"columns-sm"],"gap":[1],"align":[1]}]]],["af-inline.cjs",[[257,"af-inline",{"gap":[1],"align":[1],"justify":[1],"wrap":[4]}]]],["af-input.cjs",[[257,"af-input",{"label":[1],"description":[1],"placeholder":[1],"value":[1025],"type":[1],"name":[1],"disabled":[516],"required":[4],"readonly":[4],"error":[1],"showInfoIcon":[4,"show-info-icon"],"showSearchIcon":[4,"show-search-icon"],"clearable":[4],"autocomplete":[1],"maxlength":[2],"minlength":[2],"pattern":[1],"isFocused":[32],"isHovered":[32]}]]],["af-logo-well.cjs",[[257,"af-logo-well"]]],["af-nav-accordion.cjs",[[262,"af-nav-accordion",{"mode":[1],"breakpoint":[513],"value":[1025],"internalValue":[32]},[[0,"af-nav-accordion-item-toggle","handleItemToggle"]]]]],["af-nav-accordion-item.cjs",[[262,"af-nav-accordion-item",{"itemId":[513,"item-id"],"label":[1],"open":[1540],"disabled":[516],"href":[1],"breakpoint":[513],"contentHeight":[32],"hasTriggerSlot":[32],"hasContent":[32],"toggle":[64]},null,{"open":["handleOpenChange"]}]]],["af-nav-card.cjs",[[258,"af-nav-card",{"heading":[1],"href":[1],"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"],"isHovered":[32]}]]],["af-nav-menu.cjs",[[262,"af-nav-menu",{"heading":[1],"breakpoint":[1],"showBorder":[4,"show-border"],"cardStyle":[516,"card-style"]}]]],["af-nav-menu-nest.cjs",[[262,"af-nav-menu-nest",{"type":[1],"breakpoint":[1],"showSidebarBorder":[516,"show-sidebar-border"]}]]],["af-number-badge.cjs",[[257,"af-number-badge",{"number":[2],"variant":[1],"size":[2]}]]],["af-radio.cjs",[[257,"af-radio",{"checked":[1540],"disabled":[516],"name":[513],"value":[1]}]]],["af-show.cjs",[[257,"af-show",{"above":[1],"below":[1]}]]],["af-social-link.cjs",[[262,"af-social-link",{"href":[1],"label":[1],"icon":[1]}]]],["af-spacer.cjs",[[257,"af-spacer",{"size":[1],"flex":[4],"axis":[1]}]]],["af-stack.cjs",[[257,"af-stack",{"direction":[1],"gap":[1],"align":[1],"justify":[1],"wrap":[4]}]]],["af-stepper.cjs",[[262,"af-stepper",{"orientation":[1]}]]],["af-stepper-step.cjs",[[262,"af-stepper-step",{"index":[514]}]]],["af-switch.cjs",[[257,"af-switch",{"active":[1540],"disabled":[516],"name":[1],"value":[1]}]]],["af-tab.cjs",[[257,"af-tab",{"label":[1],"active":[516],"disabled":[516],"shape":[513],"displayIcon":[4,"display-icon"],"displayNumber":[4,"display-number"],"value":[1]}]]],["af-tab-bar.cjs",[[257,"af-tab-bar",{"shape":[513],"breakpoint":[513]},[[0,"keydown","handleKeyDown"]]]]],["af-tag.cjs",[[257,"af-tag",{"size":[1],"variant":[1],"href":[1]}]]],["af-text-image-nest.cjs",[[262,"af-text-image-nest",{"layout":[1]}]]],["af-textarea.cjs",[[257,"af-textarea",{"label":[1],"description":[1],"placeholder":[1],"value":[1025],"name":[1],"disabled":[516],"required":[4],"readonly":[4],"error":[1],"showInfoIcon":[4,"show-info-icon"],"rows":[2],"maxlength":[2],"minlength":[2],"resize":[1],"isFocused":[32],"isHovered":[32]}]]],["af-theme-override.cjs",[[262,"af-theme-override",{"theme":[1]}]]],["af-visually-hidden.cjs",[[257,"af-visually-hidden",{"focusable":[4]}]]],["af-icon-box.cjs",[[258,"af-icon-box",{"icon":[1],"size":[1]}]]],["af-aspect-ratio.cjs",[[257,"af-aspect-ratio",{"ratio":[1]}]]],["af-icon-button.cjs",[[257,"af-icon-button",{"variant":[513],"size":[1],"disabled":[4],"href":[1],"type":[1],"ariaLabel":[1,"aria-label"]}]]],["af-image.cjs",[[258,"af-image",{"src":[1],"alt":[1],"shape":[1]}]]],["af-button.cjs",[[257,"af-button",{"variant":[513],"size":[1],"disabled":[4],"type":[1],"href":[1],"hasIconLeft":[32],"hasIconRight":[32]}]]],["af-card.cjs",[[262,"af-card",{"theme":[1],"stretch":[516]}]]],["af-container.cjs",[[257,"af-container",{"maxWidth":[1,"max-width"]}]]],["af-progress-line.cjs",[[258,"af-progress-line",{"progress":[2],"orientation":[1]}]]],["af-heading_5.cjs",[[262,"af-navbar",{"showDefaultLogo":[4,"show-default-logo"],"theme":[1],"forceMobile":[516,"force-mobile"],"mobileMenuOpen":[32],"activeDropdown":[32]},[[0,"click","handleTriggerClick"],[1,"mouseover","handleHover"],[1,"mouseleave","handleHostLeave"],[1,"mouseenter","handleHostEnter"],[4,"click","handleDocumentClick"],[4,"keydown","handleKeyDown"]]],[262,"af-nav-item",{"hierarchy":[1],"variant":[1],"breakpoint":[513],"href":[1],"active":[4]}],[257,"af-heading",{"level":[1],"align":[1]}],[257,"af-logo"],[257,"af-text",{"variant":[1],"align":[1],"as":[1]}]]],["af-icon.cjs",[[257,"af-icon",{"name":[1],"size":[2],"label":[1]}]]],["af-typography-lockup.cjs",[[257,"af-typography-lockup",{"headingSize":[2,"heading-size"],"breakpoint":[1],"textAlignment":[1,"text-alignment"],"headingAlignment":[1,"heading-alignment"],"descriptionAlignment":[1,"description-alignment"],"buttonLayout":[1,"button-layout"],"buttonsAlignment":[1,"buttons-alignment"],"maxWidth":[2,"max-width"],"headingColor":[1,"heading-color"],"descriptionColor":[1,"description-color"],"hasDescription":[32],"hasButtons":[32]}]]]], options);
+  return index.bootstrapLazy([["af-icon-text.cjs",[[262,"af-icon-text",{"icon":[1],"headingSize":[2,"heading-size"],"orientation":[1],"iconSize":[1,"icon-size"]}]]],["af-testimonial.cjs",[[262,"af-testimonial",{"backgroundImage":[1,"background-image"],"logoImage":[1,"logo-image"],"quote":[1],"attribution":[1],"readMoreLink":[1,"read-more-link"],"showNavigation":[1028,"show-navigation"],"hasPrev":[1028,"has-prev"],"hasNext":[1028,"has-next"]}]]],["af-feature-card.cjs",[[262,"af-feature-card",{"theme":[1],"layout":[1],"cardSize":[513,"card-size"],"headingSize":[2,"heading-size"],"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"]}]]],["af-illustrated-card.cjs",[[262,"af-illustrated-card",{"theme":[1],"breakpoint":[1],"cardSize":[1,"card-size"]}]]],["af-testimonial-stat.cjs",[[258,"af-testimonial-stat",{"value":[1],"description":[1],"accentBorder":[4,"accent-border"]}]]],["af-video-container.cjs",[[262,"af-video-container",{"videoThumbnailUrl":[1,"video-thumbnail-url"],"videoAlt":[1,"video-alt"],"videoUrl":[1,"video-url"]}]]],["af-feature-grid.cjs",[[262,"af-feature-grid",{"columns":[2],"mobileLayout":[1,"mobile-layout"],"scrollProgress":[32]},null,{"mobileLayout":["onMobileLayoutChange"]}]]],["af-grid-callout.cjs",[[262,"af-grid-callout",{"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"],"imagePosition":[1,"image-position"],"columns":[2],"headingSize":[2,"heading-size"]}]]],["af-in-page-banner.cjs",[[262,"af-in-page-banner",{"theme":[1],"heading":[1],"description":[1],"primaryButtonText":[1,"primary-button-text"],"primaryButtonUrl":[1,"primary-button-url"],"secondaryButtonText":[1,"secondary-button-text"],"secondaryButtonUrl":[1,"secondary-button-url"],"illustrationUrl":[1,"illustration-url"],"showWaveDecoration":[4,"show-wave-decoration"]}]]],["af-section.cjs",[[262,"af-section",{"padding":[1],"theme":[1],"container":[4]}]]],["af-split-section.cjs",[[262,"af-split-section",{"topTheme":[1,"top-theme"],"bottomTheme":[1,"bottom-theme"],"padding":[1],"container":[4]}]]],["af-testimonial-carousel.cjs",[[262,"af-testimonial-carousel",{"currentIndex":[32],"isAnimating":[32],"testimonialCount":[32]},[[0,"navPrev","handleNavPrev"],[0,"navNext","handleNavNext"]]]]],["af-color-swatch.cjs",[[257,"af-color-swatch",{"color":[1],"name":[1],"size":[1]}]]],["af-image.cjs",[[258,"af-image",{"src":[1],"alt":[1],"shape":[1]}]]],["af-text-image.cjs",[[262,"af-text-image",{"imagePosition":[1,"image-position"],"imageProportion":[1,"image-proportion"],"src":[1],"alt":[1],"showSecondLockup":[4,"show-second-lockup"]}]]],["af-accordion.cjs",[[262,"af-accordion",{"mode":[1],"value":[1025],"defaultValue":[1,"default-value"],"internalValue":[32]},[[0,"af-accordion-toggle","handleItemToggle"]],{"value":["handleValueChange"]}]]],["af-accordion-item.cjs",[[257,"af-accordion-item",{"itemId":[513,"item-id"],"open":[1540],"disabled":[516],"contentHeight":[32],"toggle":[64]},null,{"open":["handleOpenChange"]}]]],["af-button-group.cjs",[[257,"af-button-group",{"direction":[1],"gap":[1]}]]],["af-center.cjs",[[257,"af-center",{"axis":[1],"inline":[4],"minHeight":[1,"min-height"]}]]],["af-checkbox.cjs",[[257,"af-checkbox",{"checked":[1540],"indeterminate":[516],"disabled":[516],"name":[1],"value":[1]}]]],["af-client-carousel.cjs",[[262,"af-client-carousel",{"theme":[1],"rows":[2],"mode":[1]}]]],["af-contact-item.cjs",[[262,"af-contact-item",{"label":[1],"value":[1]}]]],["af-divider.cjs",[[257,"af-divider",{"orientation":[1],"spacing":[1]}]]],["af-feature-accordion.cjs",[[262,"af-feature-accordion",{"heading":[1],"items":[1],"cycleInterval":[2,"cycle-interval"],"autoCycle":[4,"auto-cycle"],"expandedIndex":[32],"timerProgress":[32]},null,{"autoCycle":["handleAutoCycleChange"]}]]],["af-fieldset.cjs",[[257,"af-fieldset",{"legend":[1],"orientation":[1],"disabled":[516]}]]],["af-footer.cjs",[[262,"af-footer",{"copyrightText":[1,"copyright-text"],"statusText":[1,"status-text"],"statusUrl":[1,"status-url"],"systemsOperational":[4,"systems-operational"],"showStatus":[4,"show-status"]}]]],["af-footer-column.cjs",[[262,"af-footer-column",{"heading":[1]}]]],["af-footer-link.cjs",[[262,"af-footer-link",{"href":[1],"external":[4]}]]],["af-grid.cjs",[[257,"af-grid",{"columns":[2],"columnsLg":[2,"columns-lg"],"columnsMd":[2,"columns-md"],"columnsSm":[2,"columns-sm"],"gap":[1],"align":[1]}]]],["af-inline.cjs",[[257,"af-inline",{"gap":[1],"align":[1],"justify":[1],"wrap":[4]}]]],["af-input.cjs",[[257,"af-input",{"label":[1],"description":[1],"placeholder":[1],"value":[1025],"type":[1],"name":[1],"disabled":[516],"required":[4],"readonly":[4],"error":[1],"showInfoIcon":[4,"show-info-icon"],"showSearchIcon":[4,"show-search-icon"],"clearable":[4],"autocomplete":[1],"maxlength":[2],"minlength":[2],"pattern":[1],"isFocused":[32],"isHovered":[32]}]]],["af-logo-well.cjs",[[257,"af-logo-well"]]],["af-nav-accordion.cjs",[[262,"af-nav-accordion",{"mode":[1],"breakpoint":[513],"value":[1025],"internalValue":[32]},[[0,"af-nav-accordion-item-toggle","handleItemToggle"]]]]],["af-nav-accordion-item.cjs",[[262,"af-nav-accordion-item",{"itemId":[513,"item-id"],"label":[1],"open":[1540],"disabled":[516],"href":[1],"breakpoint":[513],"contentHeight":[32],"hasTriggerSlot":[32],"hasContent":[32],"toggle":[64]},null,{"open":["handleOpenChange"]}]]],["af-nav-card.cjs",[[258,"af-nav-card",{"heading":[1],"href":[1],"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"],"isHovered":[32]}]]],["af-nav-menu.cjs",[[262,"af-nav-menu",{"heading":[1],"breakpoint":[1],"showBorder":[4,"show-border"],"cardStyle":[516,"card-style"]}]]],["af-nav-menu-nest.cjs",[[262,"af-nav-menu-nest",{"type":[1],"breakpoint":[1],"showSidebarBorder":[516,"show-sidebar-border"]}]]],["af-number-badge.cjs",[[257,"af-number-badge",{"number":[2],"variant":[1],"size":[2]}]]],["af-paperclip-decoration.cjs",[[257,"af-paperclip-decoration",{"width":[1],"height":[1],"opacity":[2],"fill":[1]}]]],["af-radio.cjs",[[257,"af-radio",{"checked":[1540],"disabled":[516],"name":[513],"value":[1]}]]],["af-show.cjs",[[257,"af-show",{"above":[1],"below":[1]}]]],["af-social-link.cjs",[[262,"af-social-link",{"href":[1],"label":[1],"icon":[1]}]]],["af-spacer.cjs",[[257,"af-spacer",{"size":[1],"flex":[4],"axis":[1]}]]],["af-stack.cjs",[[257,"af-stack",{"direction":[1],"gap":[1],"align":[1],"justify":[1],"wrap":[4]}]]],["af-stepper.cjs",[[262,"af-stepper",{"orientation":[1]}]]],["af-stepper-step.cjs",[[262,"af-stepper-step",{"index":[514]}]]],["af-switch.cjs",[[257,"af-switch",{"active":[1540],"disabled":[516],"name":[1],"value":[1]}]]],["af-tab.cjs",[[257,"af-tab",{"label":[1],"active":[516],"disabled":[516],"shape":[513],"displayIcon":[4,"display-icon"],"displayNumber":[4,"display-number"],"value":[1]}]]],["af-tab-bar.cjs",[[257,"af-tab-bar",{"shape":[513],"breakpoint":[513]},[[0,"keydown","handleKeyDown"]]]]],["af-tag.cjs",[[257,"af-tag",{"size":[1],"variant":[1],"href":[1]}]]],["af-text-image-nest.cjs",[[262,"af-text-image-nest",{"layout":[1]}]]],["af-textarea.cjs",[[257,"af-textarea",{"label":[1],"description":[1],"placeholder":[1],"value":[1025],"name":[1],"disabled":[516],"required":[4],"readonly":[4],"error":[1],"showInfoIcon":[4,"show-info-icon"],"rows":[2],"maxlength":[2],"minlength":[2],"resize":[1],"isFocused":[32],"isHovered":[32]}]]],["af-theme-override.cjs",[[262,"af-theme-override",{"theme":[1]}]]],["af-visually-hidden.cjs",[[257,"af-visually-hidden",{"focusable":[4]}]]],["af-aspect-ratio.cjs",[[257,"af-aspect-ratio",{"ratio":[1]}]]],["af-icon-button.cjs",[[257,"af-icon-button",{"variant":[513],"size":[1],"disabled":[4],"href":[1],"type":[1],"ariaLabel":[1,"aria-label"]}]]],["af-button.cjs",[[257,"af-button",{"variant":[513],"size":[1],"disabled":[4],"type":[1],"href":[1],"hasIconLeft":[32],"hasIconRight":[32]}]]],["af-icon.cjs",[[257,"af-icon",{"name":[1],"size":[2],"label":[1]}]]],["af-icon-box.cjs",[[258,"af-icon-box",{"icon":[1],"size":[1]}]]],["af-card.cjs",[[262,"af-card",{"theme":[1],"stretch":[516]}]]],["af-container.cjs",[[257,"af-container",{"maxWidth":[1,"max-width"]}]]],["af-progress-line.cjs",[[258,"af-progress-line",{"progress":[2],"orientation":[1]}]]],["af-heading_5.cjs",[[262,"af-navbar",{"showDefaultLogo":[4,"show-default-logo"],"theme":[1],"forceMobile":[516,"force-mobile"],"mobileMenuOpen":[32],"activeDropdown":[32]},[[0,"click","handleTriggerClick"],[1,"mouseover","handleHover"],[1,"mouseleave","handleHostLeave"],[1,"mouseenter","handleHostEnter"],[4,"click","handleDocumentClick"],[4,"keydown","handleKeyDown"]]],[262,"af-nav-item",{"hierarchy":[1],"variant":[1],"breakpoint":[513],"href":[1],"active":[4]}],[257,"af-heading",{"level":[1],"align":[1]}],[257,"af-logo"],[257,"af-text",{"variant":[1],"align":[1],"as":[1]}]]],["af-typography-lockup.cjs",[[257,"af-typography-lockup",{"headingSize":[8,"heading-size"],"breakpoint":[1],"textAlignment":[1,"text-alignment"],"headingAlignment":[1,"heading-alignment"],"descriptionAlignment":[1,"description-alignment"],"buttonLayout":[1,"button-layout"],"buttonsAlignment":[1,"buttons-alignment"],"maxWidth":[2,"max-width"],"headingColor":[1,"heading-color"],"descriptionColor":[1,"description-color"],"hasDescription":[32],"hasButtons":[32]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/collection/collection-manifest.json

@@ -50,6 +50,7 @@
     "components/af-nav-menu/af-nav-menu.js",
     "components/af-nav-menu-nest/af-nav-menu-nest.js",
     "components/af-number-badge/af-number-badge.js",
+    "components/af-paperclip-decoration/af-paperclip-decoration.js",
     "components/af-progress-line/af-progress-line.js",
     "components/af-section/af-section.js",
     "components/af-show/af-show.js",

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

@@ -32,7 +32,10 @@
    ========================================================================== */
 
 .card {
-  border-radius: var(--border-radius-card-level-1, 32px);
+  /* radius-lg (20px) is the Affinda card corner — replaces the bespoke
+   * `--border-radius-card-level-1` that previously shimmed in at 32px.
+   * Consumers can still override by setting `--af-card-radius` on the host. */
+  border-radius: var(--af-card-radius, var(--radius-lg, 20px));
   overflow: hidden;
   position: relative;
   display: flex;

package/dist/collection/components/af-client-carousel/af-client-carousel.css

@@ -62,6 +62,42 @@
   }
 }
 
+/* ==========================================================================
+   Static Mode
+   ==========================================================================
+   Non-animated, centred row. Used when the logo set is small enough to
+   fit on screen without scrolling (the former website LogoPillRow use
+   case). The clone-for-seamless-loop is skipped in TSX, so each logo
+   appears exactly once here. */
+.client-carousel.mode-static .logo-track {
+  animation: none;
+  /* The track is what we centre — the .carousel-row is full-width so
+   * it can host the overflow cue in scroll mode; in static mode we
+   * centre its child track instead of fighting the row's flex default. */
+  justify-content: center;
+  /* Let the track grow only as wide as its content so justify-content
+   * on the parent row can actually centre it horizontally. */
+  flex-wrap: wrap;
+  width: 100%;
+}
+
+.client-carousel.mode-static .carousel-row {
+  justify-content: center;
+  /* Static rows have no scrolling motion to mask, so allow the row to
+   * expand content-naturally instead of clipping at viewport edges. */
+  overflow: visible;
+}
+
+.client-carousel.mode-static .carousel-container {
+  /* Match the row's no-clip behaviour so wrapped logos stay visible. */
+  overflow: visible;
+}
+
+.client-carousel.mode-static {
+  /* Keep horizontal bleed contained for consistency with scroll mode. */
+  overflow: hidden;
+}
+
 @keyframes scroll-left {
   0% {
     transform: translateX(0);

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

@@ -1,36 +1,52 @@
 import { h, Host } from "@stencil/core";
 /**
- * Infinite scrolling carousel for client logos.
+ * Full-width row of client logos, either infinite-scrolling (default)
+ * or a centred static row.
  *
  * This is a section-level component that spans full width.
- * Renders one or two scrolling rows; single row matches the Webflow
- * reference, two rows (scrolling opposite directions) is the denser
- * variant.
+ * Renders one or two rows; single row matches the Webflow reference,
+ * two rows is the denser variant. When `mode="scroll"` (default) rows
+ * animate in opposite directions; when `mode="static"` rows are centred
+ * and the animation is disabled.
  *
  * For headlines, use a separate TypographyLockup or Heading component
  * above this carousel.
  *
- * **Seamless loop:** the CSS animation translates the track from 0% to
- * -50% (or vice versa), which only looks continuous if the track holds
- * two identical copies of the content end-to-end. Shadow DOM slots can
- * only project content once, so we clone the slotted nodes in
- * `componentDidLoad` and append the copies to the track.
+ * **Seamless loop (scroll mode only):** the CSS animation translates
+ * the track from 0% to -50% (or vice versa), which only looks continuous
+ * if the track holds two identical copies of the content end-to-end.
+ * Shadow DOM slots can only project content once, so we clone the
+ * slotted nodes in `componentDidLoad` and append the copies to the track.
+ * Static mode skips the clone — nothing is animating, so duplicating
+ * the logos would just render them twice.
  */
 export class AfClientCarousel {
     constructor() {
         /** Theme - sets background color and provides theme context to children */
         this.theme = 'inkwell';
         /**
-         * Number of scrolling rows.
-         * - `1` (default) — single row scrolling left, matches the Webflow reference.
-         * - `2` — two rows scrolling in opposite directions.
+         * Number of rows.
+         * - `1` (default) — single row, matches the Webflow reference.
+         * - `2` — two rows (scroll in opposite directions, or stacked when static).
          *
          * When `rows="2"`, slot `row-1` and `row-2` independently.
          * When `rows="1"`, slot the default slot (unnamed) or `row-1`.
          */
         this.rows = 1;
+        /**
+         * Layout mode.
+         * - `scroll` (default) — infinite animated scroll; rows fill the full
+         *   width and are cloned for a seamless loop.
+         * - `static` — no animation, logos centred horizontally. Use when the
+         *   logo set is small enough to fit on screen without scrolling.
+         */
+        this.mode = 'scroll';
     }
     componentDidLoad() {
+        // Static mode doesn't animate, so the clone trick isn't needed —
+        // skipping it avoids rendering every logo twice.
+        if (this.mode === 'static')
+            return;
         this.duplicateTrackContent(this.row1TrackRef);
         if (Number(this.rows) === 2) {
             this.duplicateTrackContent(this.row2TrackRef);
@@ -59,7 +75,10 @@ export class AfClientCarousel {
     }
     render() {
         const rows = Number(this.rows);
-        return (h(Host, { key: '46f4a3c383b4f067cc74697860d437e38428a94c', class: `theme-${this.theme}` }, h("div", { key: '3a112f1ba371dee4fbea77994ff2ce5b33d85702', class: `client-carousel theme-${this.theme} rows-${rows}` }, h("div", { key: '32bf5229631e03fdae350f2224cbc7c2728b164d', class: "carousel-container" }, h("div", { key: '265e1f762ad375913bb0d308a1ab313bb75b76c0', class: "carousel-row scroll-left" }, h("div", { key: 'd92c38d3ff861cc1f422b261cf6239dd59b8dbfc', class: "logo-track", ref: (el) => (this.row1TrackRef = el) }, h("slot", { key: 'bf82ec86369fd9bb927a003108959eb7f8ede1bf', name: "row-1" }, h("slot", { key: '6845159319fb23679e7b27968dbe8f86cc7d4bd1' })))), rows === 2 && (h("div", { key: 'a0327e6d2f98e1e34c3ab7b763565b73e511d90d', class: "carousel-row scroll-right" }, h("div", { key: 'ead9bd1658eb547b23967463f84a3a9575e43ad5', class: "logo-track", ref: (el) => (this.row2TrackRef = el) }, h("slot", { key: 'f849ded863bd0ece4cca88143f45c658aa0c9e83', name: "row-2" }))))))));
+        // Direction classes are left on in static mode too — the `.mode-static`
+        // CSS rule overrides `animation` to `none`, so the direction is a no-op
+        // visually but keeps the markup shape consistent across modes.
+        return (h(Host, { key: 'a60dab195d08a5afa44c871598584c1175cff4af', class: `theme-${this.theme} mode-${this.mode}` }, h("div", { key: 'dafd6b1501a592ceaa0b9babc27d2437ccfb2c62', class: `client-carousel theme-${this.theme} rows-${rows} mode-${this.mode}` }, h("div", { key: 'c318457802deebbc34b289b2d83d0dd50c15cc5c', class: "carousel-container" }, h("div", { key: '878d1a443b488828f54e6915cede096654624435', class: "carousel-row scroll-left" }, h("div", { key: '1e8751fc3ed7429196b6d7e5e9e6fb0255ab277c', class: "logo-track", ref: (el) => (this.row1TrackRef = el) }, h("slot", { key: 'd030308358617334fa318abd95780133d13a0b01', name: "row-1" }, h("slot", { key: '230f591311b0245946dd64c465fe7e9634a9ab99' })))), rows === 2 && (h("div", { key: 'd942aaa3e6994e73f1ad52a2deedc9564f6105fd', class: "carousel-row scroll-right" }, h("div", { key: '96e438271bee8bd840a7645b1634fc0e125617de', class: "logo-track", ref: (el) => (this.row2TrackRef = el) }, h("slot", { key: '90661d285bc8f65b1d1188f66a15edf60503b1a3', name: "row-2" }))))))));
     }
     static get is() { return "af-client-carousel"; }
     static get encapsulation() { return "scoped"; }
@@ -112,13 +131,38 @@ export class AfClientCarousel {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Number of scrolling rows.\n- `1` (default) \u2014 single row scrolling left, matches the Webflow reference.\n- `2` \u2014 two rows scrolling in opposite directions.\n\nWhen `rows=\"2\"`, slot `row-1` and `row-2` independently.\nWhen `rows=\"1\"`, slot the default slot (unnamed) or `row-1`."
+                    "text": "Number of rows.\n- `1` (default) \u2014 single row, matches the Webflow reference.\n- `2` \u2014 two rows (scroll in opposite directions, or stacked when static).\n\nWhen `rows=\"2\"`, slot `row-1` and `row-2` independently.\nWhen `rows=\"1\"`, slot the default slot (unnamed) or `row-1`."
                 },
                 "getter": false,
                 "setter": false,
                 "reflect": false,
                 "attribute": "rows",
                 "defaultValue": "1"
+            },
+            "mode": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "Mode",
+                    "resolved": "\"scroll\" | \"static\"",
+                    "references": {
+                        "Mode": {
+                            "location": "global",
+                            "id": "global::Mode"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Layout mode.\n- `scroll` (default) \u2014 infinite animated scroll; rows fill the full\n  width and are cloned for a seamless loop.\n- `static` \u2014 no animation, logos centred horizontally. Use when the\n  logo set is small enough to fit on screen without scrolling."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "mode",
+                "defaultValue": "'scroll'"
             }
         };
     }

package/dist/collection/components/af-client-carousel/af-client-carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"af-client-carousel.js","sourceRoot":"","sources":["../../../src/components/af-client-carousel/af-client-carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAIlE;;;;;;;;;;;;;;;;GAgBG;AAUH,MAAM,OAAO,gBAAgB;IAT7B;QAYE,2EAA2E;QACnE,UAAK,GAAU,SAAS,CAAC;QAEjC;;;;;;;WAOG;QACK,SAAI,GAAU,CAAC,CAAC;KA6DzB;IAxDC,gBAAgB;QACd,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAC9C,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAChD,CAAC;IACH,CAAC;IAED;;;;;;;;;OASG;IACK,qBAAqB,CAAC,KAA8B;QAC1D,IAAI,CAAC,KAAK;YAAE,OAAO;QACnB,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,MAAM,CACjD,CAAC,KAAK,EAAE,EAAE,CAAC,CAAE,KAAqB,CAAC,YAAY,CAAC,qBAAqB,CAAC,CACvE,CAAC;QACF,SAAS,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;YACvB,MAAM,KAAK,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAgB,CAAC;YAChD,KAAK,CAAC,YAAY,CAAC,qBAAqB,EAAE,EAAE,CAAC,CAAC;YAC9C,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;YAC1C,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAC3B,CAAC,CAAC,CAAC;IACL,CAAC;IAED,MAAM;QACJ,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC/B,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,SAAS,IAAI,CAAC,KAAK,EAAE;YAChC,4DAAK,KAAK,EAAE,yBAAyB,IAAI,CAAC,KAAK,SAAS,IAAI,EAAE;gBAC5D,4DAAK,KAAK,EAAC,oBAAoB;oBAC7B,4DAAK,KAAK,EAAC,0BAA0B;wBACnC,4DAAK,KAAK,EAAC,YAAY,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;4BAC3D,6DAAM,IAAI,EAAC,OAAO;gCAChB,8DAAa,CACR,CACH,CACF;oBAEL,IAAI,KAAK,CAAC,IAAI,CACb,4DAAK,KAAK,EAAC,2BAA2B;wBACpC,4DAAK,KAAK,EAAC,YAAY,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;4BAC3D,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,CACF,CACP,CACG,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Prop } from '@stencil/core';\n\ntype Theme = 'white' | 'inkwell' | 'mist-green' | 'soft-clay' | 'white-ivory';\n\n/**\n * Infinite scrolling carousel for client logos.\n *\n * This is a section-level component that spans full width.\n * Renders one or two scrolling rows; single row matches the Webflow\n * reference, two rows (scrolling opposite directions) is the denser\n * variant.\n *\n * For headlines, use a separate TypographyLockup or Heading component\n * above this carousel.\n *\n * **Seamless loop:** the CSS animation translates the track from 0% to\n * -50% (or vice versa), which only looks continuous if the track holds\n * two identical copies of the content end-to-end. Shadow DOM slots can\n * only project content once, so we clone the slotted nodes in\n * `componentDidLoad` and append the copies to the track.\n */\n@Component({\n  tag: 'af-client-carousel',\n  styleUrl: 'af-client-carousel.css',\n  // Scoped (not shadow) so that cloned nodes inherit the consumer's\n  // external CSS (e.g. Astro-scoped `.logo-pill` on the SiteHeader\n  // carousel). Shadow DOM would seal the clones off from outer styles.\n  shadow: false,\n  scoped: true,\n})\nexport class AfClientCarousel {\n  @Element() el!: HTMLElement;\n\n  /** Theme - sets background color and provides theme context to children */\n  @Prop() theme: Theme = 'inkwell';\n\n  /**\n   * Number of scrolling rows.\n   * - `1` (default) — single row scrolling left, matches the Webflow reference.\n   * - `2` — two rows scrolling in opposite directions.\n   *\n   * When `rows=\"2\"`, slot `row-1` and `row-2` independently.\n   * When `rows=\"1\"`, slot the default slot (unnamed) or `row-1`.\n   */\n  @Prop() rows: 1 | 2 = 1;\n\n  private row1TrackRef?: HTMLElement;\n  private row2TrackRef?: HTMLElement;\n\n  componentDidLoad() {\n    this.duplicateTrackContent(this.row1TrackRef);\n    if (Number(this.rows) === 2) {\n      this.duplicateTrackContent(this.row2TrackRef);\n    }\n  }\n\n  /**\n   * Append clones of every existing track child into the track so the\n   * -50% translate animation loops seamlessly. Marks clones with\n   * `aria-hidden` and `data-carousel-clone` so assistive tech ignores\n   * them and we can skip them when re-duplicating.\n   *\n   * In scoped mode, slotted content is moved into the track as regular\n   * children (there's no `<slot>` element to read from), so we just\n   * iterate direct children that aren't themselves prior clones.\n   */\n  private duplicateTrackContent(track: HTMLElement | undefined) {\n    if (!track) return;\n    const originals = Array.from(track.children).filter(\n      (child) => !(child as HTMLElement).hasAttribute('data-carousel-clone'),\n    );\n    originals.forEach((el) => {\n      const clone = el.cloneNode(true) as HTMLElement;\n      clone.setAttribute('data-carousel-clone', '');\n      clone.setAttribute('aria-hidden', 'true');\n      track.appendChild(clone);\n    });\n  }\n\n  render() {\n    const rows = Number(this.rows);\n    return (\n      <Host class={`theme-${this.theme}`}>\n        <div class={`client-carousel theme-${this.theme} rows-${rows}`}>\n          <div class=\"carousel-container\">\n            <div class=\"carousel-row scroll-left\">\n              <div class=\"logo-track\" ref={(el) => (this.row1TrackRef = el)}>\n                <slot name=\"row-1\">\n                  <slot></slot>\n                </slot>\n              </div>\n            </div>\n\n            {rows === 2 && (\n              <div class=\"carousel-row scroll-right\">\n                <div class=\"logo-track\" ref={(el) => (this.row2TrackRef = el)}>\n                  <slot name=\"row-2\"></slot>\n                </div>\n              </div>\n            )}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"af-client-carousel.js","sourceRoot":"","sources":["../../../src/components/af-client-carousel/af-client-carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKlE;;;;;;;;;;;;;;;;;;;;GAoBG;AAUH,MAAM,OAAO,gBAAgB;IAT7B;QAYE,2EAA2E;QACnE,UAAK,GAAU,SAAS,CAAC;QAEjC;;;;;;;WAOG;QACK,SAAI,GAAU,CAAC,CAAC;QAExB;;;;;;WAMG;QACK,SAAI,GAAS,QAAQ,CAAC;KAmE/B;IA9DC,gBAAgB;QACd,iEAAiE;QACjE,iDAAiD;QACjD,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ;YAAE,OAAO;QACnC,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAC9C,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAChD,CAAC;IACH,CAAC;IAED;;;;;;;;;OASG;IACK,qBAAqB,CAAC,KAA8B;QAC1D,IAAI,CAAC,KAAK;YAAE,OAAO;QACnB,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,MAAM,CACjD,CAAC,KAAK,EAAE,EAAE,CAAC,CAAE,KAAqB,CAAC,YAAY,CAAC,qBAAqB,CAAC,CACvE,CAAC;QACF,SAAS,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;YACvB,MAAM,KAAK,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAgB,CAAC;YAChD,KAAK,CAAC,YAAY,CAAC,qBAAqB,EAAE,EAAE,CAAC,CAAC;YAC9C,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;YAC1C,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAC3B,CAAC,CAAC,CAAC;IACL,CAAC;IAED,MAAM;QACJ,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC/B,wEAAwE;QACxE,wEAAwE;QACxE,+DAA+D;QAC/D,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,SAAS,IAAI,CAAC,KAAK,SAAS,IAAI,CAAC,IAAI,EAAE;YAClD,4DAAK,KAAK,EAAE,yBAAyB,IAAI,CAAC,KAAK,SAAS,IAAI,SAAS,IAAI,CAAC,IAAI,EAAE;gBAC9E,4DAAK,KAAK,EAAC,oBAAoB;oBAC7B,4DAAK,KAAK,EAAC,0BAA0B;wBACnC,4DAAK,KAAK,EAAC,YAAY,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;4BAC3D,6DAAM,IAAI,EAAC,OAAO;gCAChB,8DAAa,CACR,CACH,CACF;oBAEL,IAAI,KAAK,CAAC,IAAI,CACb,4DAAK,KAAK,EAAC,2BAA2B;wBACpC,4DAAK,KAAK,EAAC,YAAY,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;4BAC3D,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,CACF,CACP,CACG,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Host, Prop } from '@stencil/core';\n\ntype Theme = 'white' | 'inkwell' | 'mist-green' | 'soft-clay' | 'white-ivory';\ntype Mode = 'scroll' | 'static';\n\n/**\n * Full-width row of client logos, either infinite-scrolling (default)\n * or a centred static row.\n *\n * This is a section-level component that spans full width.\n * Renders one or two rows; single row matches the Webflow reference,\n * two rows is the denser variant. When `mode=\"scroll\"` (default) rows\n * animate in opposite directions; when `mode=\"static\"` rows are centred\n * and the animation is disabled.\n *\n * For headlines, use a separate TypographyLockup or Heading component\n * above this carousel.\n *\n * **Seamless loop (scroll mode only):** the CSS animation translates\n * the track from 0% to -50% (or vice versa), which only looks continuous\n * if the track holds two identical copies of the content end-to-end.\n * Shadow DOM slots can only project content once, so we clone the\n * slotted nodes in `componentDidLoad` and append the copies to the track.\n * Static mode skips the clone — nothing is animating, so duplicating\n * the logos would just render them twice.\n */\n@Component({\n  tag: 'af-client-carousel',\n  styleUrl: 'af-client-carousel.css',\n  // Scoped (not shadow) so that cloned nodes inherit the consumer's\n  // external CSS (e.g. Astro-scoped `.logo-pill` on the SiteHeader\n  // carousel). Shadow DOM would seal the clones off from outer styles.\n  shadow: false,\n  scoped: true,\n})\nexport class AfClientCarousel {\n  @Element() el!: HTMLElement;\n\n  /** Theme - sets background color and provides theme context to children */\n  @Prop() theme: Theme = 'inkwell';\n\n  /**\n   * Number of rows.\n   * - `1` (default) — single row, matches the Webflow reference.\n   * - `2` — two rows (scroll in opposite directions, or stacked when static).\n   *\n   * When `rows=\"2\"`, slot `row-1` and `row-2` independently.\n   * When `rows=\"1\"`, slot the default slot (unnamed) or `row-1`.\n   */\n  @Prop() rows: 1 | 2 = 1;\n\n  /**\n   * Layout mode.\n   * - `scroll` (default) — infinite animated scroll; rows fill the full\n   *   width and are cloned for a seamless loop.\n   * - `static` — no animation, logos centred horizontally. Use when the\n   *   logo set is small enough to fit on screen without scrolling.\n   */\n  @Prop() mode: Mode = 'scroll';\n\n  private row1TrackRef?: HTMLElement;\n  private row2TrackRef?: HTMLElement;\n\n  componentDidLoad() {\n    // Static mode doesn't animate, so the clone trick isn't needed —\n    // skipping it avoids rendering every logo twice.\n    if (this.mode === 'static') return;\n    this.duplicateTrackContent(this.row1TrackRef);\n    if (Number(this.rows) === 2) {\n      this.duplicateTrackContent(this.row2TrackRef);\n    }\n  }\n\n  /**\n   * Append clones of every existing track child into the track so the\n   * -50% translate animation loops seamlessly. Marks clones with\n   * `aria-hidden` and `data-carousel-clone` so assistive tech ignores\n   * them and we can skip them when re-duplicating.\n   *\n   * In scoped mode, slotted content is moved into the track as regular\n   * children (there's no `<slot>` element to read from), so we just\n   * iterate direct children that aren't themselves prior clones.\n   */\n  private duplicateTrackContent(track: HTMLElement | undefined) {\n    if (!track) return;\n    const originals = Array.from(track.children).filter(\n      (child) => !(child as HTMLElement).hasAttribute('data-carousel-clone'),\n    );\n    originals.forEach((el) => {\n      const clone = el.cloneNode(true) as HTMLElement;\n      clone.setAttribute('data-carousel-clone', '');\n      clone.setAttribute('aria-hidden', 'true');\n      track.appendChild(clone);\n    });\n  }\n\n  render() {\n    const rows = Number(this.rows);\n    // Direction classes are left on in static mode too — the `.mode-static`\n    // CSS rule overrides `animation` to `none`, so the direction is a no-op\n    // visually but keeps the markup shape consistent across modes.\n    return (\n      <Host class={`theme-${this.theme} mode-${this.mode}`}>\n        <div class={`client-carousel theme-${this.theme} rows-${rows} mode-${this.mode}`}>\n          <div class=\"carousel-container\">\n            <div class=\"carousel-row scroll-left\">\n              <div class=\"logo-track\" ref={(el) => (this.row1TrackRef = el)}>\n                <slot name=\"row-1\">\n                  <slot></slot>\n                </slot>\n              </div>\n            </div>\n\n            {rows === 2 && (\n              <div class=\"carousel-row scroll-right\">\n                <div class=\"logo-track\" ref={(el) => (this.row2TrackRef = el)}>\n                  <slot name=\"row-2\"></slot>\n                </div>\n              </div>\n            )}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -1,3 +1,25 @@
+/*
+ * af-feature-accordion
+ * ---------------------------------------------------------------------------
+ * Themable CSS custom properties (safe to override from consumers):
+ *
+ *   --af-accent-progress            Colour of the per-item timer/progress bar.
+ *                                    Defaults to --colour-softclay-600 (brand
+ *                                    soft-clay). Override to retheme the accent.
+ *   --af-feature-accordion-image-pad
+ *                                   Padding around the accompanying image
+ *                                    inside its rounded container. Defaults to
+ *                                    40px — tune for tighter or looser rhythm.
+ *
+ * The component also inherits the following theme tokens from its parent
+ * <af-section> (or any ancestor setting them):
+ *
+ *   --af-typography-heading-primary   heading colour
+ *   --af-typography-body-default      body colour
+ *   --af-background-border-default    rule/divider colour
+ *   --af-background-level-1           image-container background
+ */
+
 :host {
   display: block;
   width: 100%;
@@ -6,12 +28,11 @@
 .feature-accordion {
   /* Inherits theme from parent Section via CSS custom properties */
   padding: 0 24px;
-  
+
   /* Internal custom properties that inherit from parent Section's theme */
   --_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));
-  --_level-1-bg: var(--af-background-level-1, var(--colour-mistgreen-300, #dde6e3));
 }
 
 .feature-accordion__heading {
@@ -120,7 +141,7 @@
 
 .accordion-item__timer-progress {
   height: 100%;
-  background-color: var(--colour-brand-ice, #a6fffb);
+  background-color: var(--af-accent-progress, var(--colour-softclay-600, #9e8765));
   border-radius: 2px;
   transition: width 0.05s linear;
 }
@@ -130,7 +151,8 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  background-color: var(--_level-1-bg);
+  /* Flows from parent Section's theme; mist-green fallback for unthemed use */
+  background-color: var(--af-background-level-1, var(--colour-mistgreen-300, #dde6e3));
   border-radius: 20px;
   overflow: hidden;
   flex: 1;
@@ -142,7 +164,7 @@
   align-items: center;
   justify-content: center;
   width: 100%;
-  padding: 32px;
+  padding: var(--af-feature-accordion-image-pad, 40px);
 }
 
 .feature-accordion__image {

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

@@ -178,11 +178,14 @@
 }
 
 .footer__status-dot--operational {
-  background-color: #22c55e;
+  /* Affinda-palette green — tuned to sit comfortably against the inkwell
+   * footer backdrop without the candy-bright Tailwind default. */
+  background-color: var(--status-ok, #3E8F6E);
 }
 
 .footer__status-dot--issue {
-  background-color: #ef4444;
+  /* Affinda-palette red — darkened toward soft-clay to match brand tone. */
+  background-color: var(--status-issue, #B94A3B);
 }
 
 .footer__status-text {

package/dist/collection/components/af-illustrated-card/af-illustrated-card.css

@@ -79,13 +79,17 @@
   justify-content: center;
 }
 
-/* Illustration image styling */
+/* Illustration image styling. The inner image gets the same corner radius
+ * (radius-lg / 20px) as the outer af-card so art with a photographic edge
+ * stays within the card's rounded frame. Consumers of af-illustrated-card
+ * previously hand-rolled this value; it now comes from the token ladder. */
 .illustrated-card__illustration-area ::slotted(img),
 .illustrated-card__illustration-area img {
   max-width: 100%;
   max-height: 200px;
   height: auto;
   object-fit: contain;
+  border-radius: var(--radius-lg, 20px);
 }
 
 /* ==========================================================================

package/dist/collection/components/af-in-page-banner/af-in-page-banner.css

@@ -5,10 +5,10 @@
 
 /* ==========================================================================
    Banner Container
-   
+
    Design specs from Figma:
    - Desktop: max-width 1280px, gap 40px, left padding 40px, right padding 148px
-   - Border radius: 32px (desktop), 24px (mobile)
+   - Border radius: radius-lg (20px) — aligned with af-card across the token ladder
    - Content padding vertical: 48px (margins/margin TB tight)
    ========================================================================== */
 
@@ -21,7 +21,7 @@
   padding-right: 148px;
   padding-top: 0;
   padding-bottom: 0;
-  border-radius: var(--radii-card-level-1, 32px);
+  border-radius: var(--radius-lg, 20px);
   overflow: hidden;
   max-width: 1280px;
   width: 100%;
@@ -290,7 +290,9 @@
     flex-direction: column;
     align-items: stretch;
     padding: 224px 0 0 0;
-    border-radius: var(--radii-card-level-1-mobile, 24px);
+    /* Mobile keeps the same 20px corner as desktop — simpler after the
+     * token ladder consolidation. */
+    border-radius: var(--radius-lg, 20px);
     max-width: 100%;
     min-height: auto;
   }

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

@@ -134,7 +134,10 @@
   background: var(--colour-background-base, #ffffff);
   border-radius: 32px;
   overflow: hidden;
-  box-shadow: 0 4px 24px rgba(20, 52, 59, 0.12);
+  /* shadow-navbar replaces the hand-rolled `0 4px 24px rgba(20, 52, 59, 0.12)`;
+   * same value, now sourced from the token ladder so the marketing site can
+   * retire its matching bespoke rule. */
+  box-shadow: var(--shadow-navbar, 0 4px 24px rgba(20, 52, 59, 0.12));
 }
 
 /* Hide empty dropdown slots */

package/dist/collection/components/af-paperclip-decoration/af-paperclip-decoration.css

@@ -0,0 +1,11 @@
+:host {
+  display: block;
+  /* Decorative-only; host is sized/positioned by the consumer. */
+  pointer-events: none;
+}
+
+svg {
+  display: block;
+  /* Let the SVG honour its own width/height attributes rather than
+     inheriting host dimensions. */
+}

package/dist/collection/components/af-paperclip-decoration/af-paperclip-decoration.js

@@ -0,0 +1,152 @@
+import { h, Host } from "@stencil/core";
+/**
+ * Decorative paperclip vector graphic. Renders the left-half paperclip
+ * silhouette (viewBox `0 0 655 754`) that the marketing site bleeds off
+ * the right edge of inkwell hero sections.
+ *
+ * Purely decorative — the inner `<svg>` is `aria-hidden="true"`. Size it
+ * via the `width` / `height` props (they accept any CSS length, e.g.
+ * `"655"`, `"100%"`, `"50vw"`) and position the host element in CSS.
+ *
+ * `fill` is white by default (intended for inkwell backgrounds); override
+ * for other themes, e.g. `fill="var(--colour-brand-inkwell)"` on a
+ * mist-green section. `opacity` defaults to `0.06` to match the
+ * watermark treatment used on `/`, `/au`, and `/platform`.
+ *
+ * @example
+ * ```html
+ * <af-section theme="inkwell" padding="loose" style="position:relative;overflow:hidden">
+ *   <af-paperclip-decoration
+ *     style="position:absolute;bottom:-80px;right:-80px"
+ *   ></af-paperclip-decoration>
+ *   <af-container style="position:relative;z-index:1">
+ *     <!-- hero content -->
+ *   </af-container>
+ * </af-section>
+ * ```
+ */
+export class AfPaperclipDecoration {
+    constructor() {
+        /**
+         * SVG width — accepts any CSS length or unitless number (pixels).
+         * Defaults to the intrinsic viewBox width (`655`).
+         */
+        this.width = '655';
+        /**
+         * SVG height — accepts any CSS length or unitless number (pixels).
+         * Defaults to the intrinsic viewBox height (`754`).
+         */
+        this.height = '754';
+        /**
+         * Fill opacity of the paperclip shape. Defaults to `0.06` to match the
+         * marketing-site watermark treatment.
+         */
+        this.opacity = 0.06;
+        /**
+         * Fill colour. Defaults to `white` (designed for inkwell backgrounds);
+         * override for other themes, e.g. `var(--colour-brand-inkwell)` on a
+         * mist-green section.
+         */
+        this.fill = 'white';
+    }
+    render() {
+        return (h(Host, { key: '679d13bd4d4824752eb722a39fda943553da8a30' }, h("svg", { key: 'dc6ea4d9fe9c09512d48b09c0a95ec8fd6a4f2f2', "aria-hidden": "true", width: this.width, height: this.height, viewBox: "0 0 655 754", fill: "none", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "none" }, h("path", { key: '0b9121fa25531dd6725b0db1e2174d3df9bafc3b', d: "M1102.14 108.279C1031.8 37.5181 939.128 -1.06817 840.61 0.447304H358.674L262.104 157.124H841.87C842.558 157.124 843.36 157.124 844.047 157.124C900.638 157.124 953.791 179.273 994 219.725C1035.24 261.225 1058.04 316.715 1058.04 376.052C1058.04 497.872 960.665 596.844 841.068 596.844H251.335C197.609 596.844 153.848 552.313 153.848 497.639C153.848 442.965 197.723 397.734 251.221 396.102H779.208L878.872 239.426H248.586C111.577 242.923 0 358.682 0 497.639C0 636.596 112.723 753.404 251.335 753.404H841.068C1045.55 753.404 1212 584.021 1212 375.935C1212 274.398 1173.05 179.39 1102.26 108.162L1102.14 108.279Z", fill: this.fill, "fill-opacity": this.opacity }))));
+    }
+    static get is() { return "af-paperclip-decoration"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["af-paperclip-decoration.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["af-paperclip-decoration.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "width": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "SVG width \u2014 accepts any CSS length or unitless number (pixels).\nDefaults to the intrinsic viewBox width (`655`)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "width",
+                "defaultValue": "'655'"
+            },
+            "height": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "SVG height \u2014 accepts any CSS length or unitless number (pixels).\nDefaults to the intrinsic viewBox height (`754`)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "height",
+                "defaultValue": "'754'"
+            },
+            "opacity": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Fill opacity of the paperclip shape. Defaults to `0.06` to match the\nmarketing-site watermark treatment."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "opacity",
+                "defaultValue": "0.06"
+            },
+            "fill": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Fill colour. Defaults to `white` (designed for inkwell backgrounds);\noverride for other themes, e.g. `var(--colour-brand-inkwell)` on a\nmist-green section."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "fill",
+                "defaultValue": "'white'"
+            }
+        };
+    }
+}
+//# sourceMappingURL=af-paperclip-decoration.js.map

package/dist/collection/components/af-paperclip-decoration/af-paperclip-decoration.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"af-paperclip-decoration.js","sourceRoot":"","sources":["../../../src/components/af-paperclip-decoration/af-paperclip-decoration.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAMH,MAAM,OAAO,qBAAqB;IALlC;QAME;;;WAGG;QACK,UAAK,GAAW,KAAK,CAAC;QAE9B;;;WAGG;QACK,WAAM,GAAW,KAAK,CAAC;QAE/B;;;WAGG;QACK,YAAO,GAAW,IAAI,CAAC;QAE/B;;;;WAIG;QACK,SAAI,GAAW,OAAO,CAAC;KAuBhC;IArBC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,2EACc,MAAM,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,mBAAmB,EAAC,MAAM;gBAE1B,6DACE,CAAC,EAAC,imBAAimB,EACnmB,IAAI,EAAE,IAAI,CAAC,IAAI,kBACD,IAAI,CAAC,OAAO,GAC1B,CACE,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Decorative paperclip vector graphic. Renders the left-half paperclip\n * silhouette (viewBox `0 0 655 754`) that the marketing site bleeds off\n * the right edge of inkwell hero sections.\n *\n * Purely decorative — the inner `<svg>` is `aria-hidden=\"true\"`. Size it\n * via the `width` / `height` props (they accept any CSS length, e.g.\n * `\"655\"`, `\"100%\"`, `\"50vw\"`) and position the host element in CSS.\n *\n * `fill` is white by default (intended for inkwell backgrounds); override\n * for other themes, e.g. `fill=\"var(--colour-brand-inkwell)\"` on a\n * mist-green section. `opacity` defaults to `0.06` to match the\n * watermark treatment used on `/`, `/au`, and `/platform`.\n *\n * @example\n * ```html\n * <af-section theme=\"inkwell\" padding=\"loose\" style=\"position:relative;overflow:hidden\">\n *   <af-paperclip-decoration\n *     style=\"position:absolute;bottom:-80px;right:-80px\"\n *   ></af-paperclip-decoration>\n *   <af-container style=\"position:relative;z-index:1\">\n *     <!-- hero content -->\n *   </af-container>\n * </af-section>\n * ```\n */\n@Component({\n  tag: 'af-paperclip-decoration',\n  styleUrl: 'af-paperclip-decoration.css',\n  shadow: true\n})\nexport class AfPaperclipDecoration {\n  /**\n   * SVG width — accepts any CSS length or unitless number (pixels).\n   * Defaults to the intrinsic viewBox width (`655`).\n   */\n  @Prop() width: string = '655';\n\n  /**\n   * SVG height — accepts any CSS length or unitless number (pixels).\n   * Defaults to the intrinsic viewBox height (`754`).\n   */\n  @Prop() height: string = '754';\n\n  /**\n   * Fill opacity of the paperclip shape. Defaults to `0.06` to match the\n   * marketing-site watermark treatment.\n   */\n  @Prop() opacity: number = 0.06;\n\n  /**\n   * Fill colour. Defaults to `white` (designed for inkwell backgrounds);\n   * override for other themes, e.g. `var(--colour-brand-inkwell)` on a\n   * mist-green section.\n   */\n  @Prop() fill: string = 'white';\n\n  render() {\n    return (\n      <Host>\n        <svg\n          aria-hidden=\"true\"\n          width={this.width}\n          height={this.height}\n          viewBox=\"0 0 655 754\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          preserveAspectRatio=\"none\"\n        >\n          <path\n            d=\"M1102.14 108.279C1031.8 37.5181 939.128 -1.06817 840.61 0.447304H358.674L262.104 157.124H841.87C842.558 157.124 843.36 157.124 844.047 157.124C900.638 157.124 953.791 179.273 994 219.725C1035.24 261.225 1058.04 316.715 1058.04 376.052C1058.04 497.872 960.665 596.844 841.068 596.844H251.335C197.609 596.844 153.848 552.313 153.848 497.639C153.848 442.965 197.723 397.734 251.221 396.102H779.208L878.872 239.426H248.586C111.577 242.923 0 358.682 0 497.639C0 636.596 112.723 753.404 251.335 753.404H841.068C1045.55 753.404 1212 584.021 1212 375.935C1212 274.398 1173.05 179.39 1102.26 108.162L1102.14 108.279Z\"\n            fill={this.fill}\n            fill-opacity={this.opacity}\n          />\n        </svg>\n      </Host>\n    );\n  }\n}\n"]}