@affinda/wc 0.0.28 → 0.2.0
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-card.entry.esm.js.map +1 -1
- package/dist/affinda/af-client-carousel.entry.esm.js.map +1 -1
- package/dist/affinda/af-divider.entry.esm.js.map +1 -1
- package/dist/affinda/af-feature-accordion.entry.esm.js.map +1 -1
- package/dist/affinda/af-feature-card.entry.esm.js.map +1 -1
- package/dist/affinda/af-footer.entry.esm.js.map +1 -1
- package/dist/affinda/af-grid.entry.esm.js.map +1 -1
- package/dist/affinda/af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.esm.js.map +1 -1
- package/dist/affinda/af-hero.entry.esm.js.map +1 -0
- package/dist/affinda/af-illustrated-card.entry.esm.js.map +1 -1
- package/dist/affinda/af-in-page-banner.entry.esm.js.map +1 -1
- package/dist/affinda/af-inline.entry.esm.js.map +1 -1
- package/dist/affinda/af-numbered-stepper-item.entry.esm.js.map +1 -0
- package/dist/affinda/af-numbered-stepper.entry.esm.js.map +1 -0
- package/dist/affinda/af-paperclip-decoration.entry.esm.js.map +1 -0
- package/dist/affinda/af-section.entry.esm.js.map +1 -1
- package/dist/affinda/af-split-section.entry.esm.js.map +1 -1
- package/dist/affinda/af-stack.entry.esm.js.map +1 -1
- package/dist/affinda/af-stat.entry.esm.js.map +1 -0
- package/dist/affinda/af-stats-row.entry.esm.js.map +1 -0
- package/dist/affinda/af-theme-override.entry.esm.js.map +1 -1
- package/dist/affinda/af-typography-lockup.entry.esm.js.map +1 -1
- package/dist/affinda/affinda.css +1 -1
- package/dist/affinda/affinda.esm.js +1 -1
- package/dist/affinda/index.esm.js +1 -1
- package/dist/affinda/index.esm.js.map +1 -1
- package/dist/affinda/p-068ac2fb.entry.js +2 -0
- package/dist/affinda/{p-b14c1a4b.entry.js.map → p-068ac2fb.entry.js.map} +1 -1
- package/dist/affinda/{p-9bb5202e.entry.js → p-09dfcd40.entry.js} +2 -2
- package/dist/affinda/p-0acadf6f.entry.js +2 -0
- package/dist/affinda/p-0acadf6f.entry.js.map +1 -0
- package/dist/affinda/{p-6eca2722.entry.js → p-15f0bd34.entry.js} +2 -2
- package/dist/affinda/{p-97ac8f5f.entry.js → p-1b4b0c88.entry.js} +2 -2
- package/dist/affinda/{p-2c655ae2.entry.js → p-1c96856a.entry.js} +2 -2
- package/dist/affinda/p-2237e652.entry.js +2 -0
- package/dist/affinda/{p-5e5d16dd.entry.js.map → p-2237e652.entry.js.map} +1 -1
- package/dist/affinda/{p-4cbdf940.entry.js → p-24e74c10.entry.js} +2 -2
- package/dist/affinda/p-2526604b.entry.js +2 -0
- package/dist/affinda/p-2526604b.entry.js.map +1 -0
- package/dist/affinda/{p-bf941fa7.entry.js → p-256970e3.entry.js} +2 -2
- package/dist/affinda/p-32d62fbb.entry.js +2 -0
- package/dist/affinda/{p-af3f6e16.entry.js → p-342b08e5.entry.js} +2 -2
- package/dist/affinda/{p-102e8b8c.entry.js → p-35607741.entry.js} +2 -2
- package/dist/affinda/{p-c7ba4e7f.entry.js → p-364ffa25.entry.js} +2 -2
- package/dist/affinda/{p-e9f8ef54.entry.js → p-365a75e2.entry.js} +2 -2
- package/dist/affinda/p-3ed408f6.entry.js +2 -0
- package/dist/affinda/{p-80c96efd.entry.js → p-4058a1eb.entry.js} +2 -2
- package/dist/affinda/{p-159fe9b1.entry.js → p-41bbb218.entry.js} +2 -2
- package/dist/affinda/p-436673bb.entry.js +2 -0
- package/dist/affinda/p-436673bb.entry.js.map +1 -0
- package/dist/affinda/{p-f9b6d1c6.entry.js → p-43f40921.entry.js} +2 -2
- package/dist/affinda/p-44d960ca.entry.js +2 -0
- package/dist/affinda/{p-da999c10.entry.js.map → p-44d960ca.entry.js.map} +1 -1
- package/dist/affinda/{p-0f3267ea.entry.js → p-4a355b69.entry.js} +2 -2
- package/dist/affinda/p-4a9b192b.entry.js +2 -0
- package/dist/affinda/{p-d60d1943.entry.js.map → p-4a9b192b.entry.js.map} +1 -1
- package/dist/affinda/{p-3ecf43aa.entry.js → p-4b2c0698.entry.js} +2 -2
- package/dist/affinda/p-4eeeb8a1.entry.js +2 -0
- package/dist/affinda/{p-cc22a8da.entry.js.map → p-4eeeb8a1.entry.js.map} +1 -1
- package/dist/affinda/{p-12652bf5.entry.js → p-4f59b554.entry.js} +2 -2
- package/dist/affinda/{p-4e8bd716.entry.js → p-5c163c5b.entry.js} +2 -2
- package/dist/affinda/{p-8d9d0cb3.entry.js → p-5e5e7d75.entry.js} +2 -2
- package/dist/affinda/{p-648e2d76.entry.js → p-61a6b43d.entry.js} +2 -2
- package/dist/affinda/p-631d141c.entry.js +2 -0
- package/dist/affinda/p-631d141c.entry.js.map +1 -0
- package/dist/affinda/p-6475796d.entry.js +2 -0
- package/dist/affinda/{p-50590601.entry.js.map → p-6475796d.entry.js.map} +1 -1
- package/dist/affinda/p-6756aa66.entry.js +2 -0
- package/dist/affinda/{p-432c7bfc.entry.js → p-6c33fee6.entry.js} +2 -2
- package/dist/affinda/p-6e181b2b.entry.js +2 -0
- package/dist/affinda/{p-816deae3.entry.js → p-6ea474a3.entry.js} +2 -2
- package/dist/affinda/{p-ef41e743.entry.js → p-7111051c.entry.js} +2 -2
- package/dist/affinda/{p-23aa03dc.entry.js → p-76cb736d.entry.js} +2 -2
- package/dist/affinda/{p-e78112d9.entry.js → p-7867c2ff.entry.js} +2 -2
- package/dist/affinda/p-7d3cdda1.entry.js +2 -0
- package/dist/affinda/p-7d3cdda1.entry.js.map +1 -0
- package/dist/affinda/{p-11e7ddf3.entry.js → p-827f3050.entry.js} +2 -2
- package/dist/affinda/{p-77ed47d5.entry.js → p-83bb96cc.entry.js} +2 -2
- package/dist/affinda/p-85cc55bb.entry.js +2 -0
- package/dist/affinda/p-85cc55bb.entry.js.map +1 -0
- package/dist/affinda/{p-5e444a9a.entry.js → p-862a2509.entry.js} +2 -2
- package/dist/affinda/{p-7238fc21.entry.js → p-86f6dfdc.entry.js} +2 -2
- package/dist/affinda/{p-e0163836.entry.js → p-90ef7baa.entry.js} +2 -2
- package/dist/affinda/{p-ab0b621e.entry.js → p-9480f00d.entry.js} +2 -2
- package/dist/affinda/{p-3ca3e4dc.entry.js → p-95d4696a.entry.js} +2 -2
- package/dist/affinda/{p-892f9bc3.entry.js → p-9aed7039.entry.js} +2 -2
- package/dist/affinda/{p-bfc17d0c.entry.js → p-9c1e9bd8.entry.js} +2 -2
- package/dist/affinda/{p-be45f85c.entry.js → p-9ce0adc2.entry.js} +2 -2
- package/dist/affinda/{p-8da30e7a.entry.js → p-9eba91fd.entry.js} +2 -2
- package/dist/affinda/{p-aa5c6cc0.entry.js → p-9f3e7116.entry.js} +2 -2
- package/dist/affinda/p-MwnBSqEY.js +3 -0
- package/dist/affinda/p-MwnBSqEY.js.map +1 -0
- package/dist/affinda/{p-636045e8.entry.js → p-a02d6192.entry.js} +2 -2
- package/dist/affinda/p-a1e80460.entry.js +2 -0
- package/dist/affinda/{p-6bb831c5.entry.js.map → p-a1e80460.entry.js.map} +1 -1
- package/dist/affinda/{p-2140698f.entry.js → p-a25d3257.entry.js} +2 -2
- package/dist/affinda/{p-401fc5b1.entry.js → p-a7a8f18c.entry.js} +2 -2
- package/dist/affinda/{p-a4d39bdd.entry.js → p-a8d75eb1.entry.js} +2 -2
- package/dist/affinda/{p-a3865306.entry.js → p-ae430873.entry.js} +2 -2
- package/dist/affinda/p-b39eea31.entry.js +2 -0
- package/dist/affinda/{p-570283f6.entry.js.map → p-b39eea31.entry.js.map} +1 -1
- package/dist/affinda/{p-2aa112c2.entry.js → p-b9ec0e75.entry.js} +2 -2
- package/dist/affinda/{p-2aa112c2.entry.js.map → p-b9ec0e75.entry.js.map} +1 -1
- package/dist/affinda/{p-5ab389c6.entry.js → p-bbfc9df6.entry.js} +2 -2
- package/dist/affinda/{p-a002c784.entry.js → p-bed7d9a1.entry.js} +2 -2
- package/dist/affinda/p-d7d82986.entry.js +2 -0
- package/dist/affinda/{p-07f9580c.entry.js.map → p-d7d82986.entry.js.map} +1 -1
- package/dist/affinda/p-dabd389a.entry.js +2 -0
- package/dist/affinda/p-dabd389a.entry.js.map +1 -0
- package/dist/affinda/{p-eb96f29b.entry.js → p-dcc89b4c.entry.js} +2 -2
- package/dist/affinda/{p-1dff35bf.entry.js → p-de75cb4f.entry.js} +2 -2
- package/dist/affinda/{p-7b7d9c6a.entry.js → p-e07e27f1.entry.js} +2 -2
- package/dist/affinda/{p-8f6884c8.entry.js → p-eeda78ea.entry.js} +2 -2
- package/dist/affinda/{p-d54abc45.entry.js → p-f19cb091.entry.js} +2 -2
- package/dist/cjs/af-accordion-item.cjs.entry.js +2 -2
- package/dist/cjs/af-accordion.cjs.entry.js +2 -2
- package/dist/cjs/af-aspect-ratio.cjs.entry.js +1 -1
- package/dist/cjs/af-button-group.cjs.entry.js +1 -1
- package/dist/cjs/af-button.cjs.entry.js +1 -1
- package/dist/cjs/af-card.cjs.entry.js +3 -3
- package/dist/cjs/af-card.entry.cjs.js.map +1 -1
- package/dist/cjs/af-center.cjs.entry.js +2 -2
- package/dist/cjs/af-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/af-client-carousel.cjs.entry.js +21 -6
- package/dist/cjs/af-client-carousel.entry.cjs.js.map +1 -1
- package/dist/cjs/af-color-swatch.cjs.entry.js +1 -1
- package/dist/cjs/af-contact-item.cjs.entry.js +2 -2
- package/dist/cjs/af-container.cjs.entry.js +1 -1
- package/dist/cjs/af-divider.cjs.entry.js +2 -2
- package/dist/cjs/af-divider.entry.cjs.js.map +1 -1
- package/dist/cjs/af-feature-accordion.cjs.entry.js +4 -4
- package/dist/cjs/af-feature-accordion.entry.cjs.js.map +1 -1
- package/dist/cjs/af-feature-card.cjs.entry.js +1 -1
- package/dist/cjs/af-feature-card.entry.cjs.js.map +1 -1
- package/dist/cjs/af-feature-grid.cjs.entry.js +2 -2
- package/dist/cjs/af-fieldset.cjs.entry.js +1 -1
- package/dist/cjs/af-footer-column.cjs.entry.js +2 -2
- package/dist/cjs/af-footer-link.cjs.entry.js +2 -2
- package/dist/cjs/af-footer.cjs.entry.js +3 -3
- package/dist/cjs/af-footer.entry.cjs.js.map +1 -1
- package/dist/cjs/af-grid-callout.cjs.entry.js +1 -1
- package/dist/cjs/af-grid.cjs.entry.js +3 -3
- package/dist/cjs/af-grid.entry.cjs.js.map +1 -1
- package/dist/cjs/af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.cjs.js.map +1 -1
- package/dist/cjs/af-heading_5.cjs.entry.js +3 -3
- package/dist/cjs/af-hero.cjs.entry.js +94 -0
- package/dist/cjs/af-hero.entry.cjs.js.map +1 -0
- package/dist/cjs/af-icon-box.cjs.entry.js +2 -2
- package/dist/cjs/af-icon-button.cjs.entry.js +1 -1
- package/dist/cjs/af-icon-text.cjs.entry.js +2 -2
- package/dist/cjs/af-icon.cjs.entry.js +1 -1
- package/dist/cjs/af-illustrated-card.cjs.entry.js +3 -3
- package/dist/cjs/af-illustrated-card.entry.cjs.js.map +1 -1
- package/dist/cjs/af-image.cjs.entry.js +2 -2
- package/dist/cjs/af-in-page-banner.cjs.entry.js +3 -3
- package/dist/cjs/af-in-page-banner.entry.cjs.js.map +1 -1
- package/dist/cjs/af-inline.cjs.entry.js +2 -2
- package/dist/cjs/af-inline.entry.cjs.js.map +1 -1
- package/dist/cjs/af-input.cjs.entry.js +1 -1
- package/dist/cjs/af-logo-well.cjs.entry.js +2 -2
- package/dist/cjs/af-nav-accordion-item.cjs.entry.js +3 -3
- package/dist/cjs/af-nav-accordion.cjs.entry.js +2 -2
- package/dist/cjs/af-nav-card.cjs.entry.js +1 -1
- package/dist/cjs/af-nav-menu-nest.cjs.entry.js +2 -2
- package/dist/cjs/af-nav-menu.cjs.entry.js +2 -2
- package/dist/cjs/af-number-badge.cjs.entry.js +2 -2
- package/dist/cjs/af-numbered-stepper-item.cjs.entry.js +25 -0
- package/dist/cjs/af-numbered-stepper-item.entry.cjs.js.map +1 -0
- package/dist/cjs/af-numbered-stepper.cjs.entry.js +36 -0
- package/dist/cjs/af-numbered-stepper.entry.cjs.js.map +1 -0
- package/dist/cjs/af-paperclip-decoration.cjs.entry.js +39 -0
- package/dist/cjs/af-paperclip-decoration.entry.cjs.js.map +1 -0
- package/dist/cjs/af-progress-line.cjs.entry.js +3 -3
- package/dist/cjs/af-radio.cjs.entry.js +1 -1
- package/dist/cjs/af-section.cjs.entry.js +3 -3
- package/dist/cjs/af-section.entry.cjs.js.map +1 -1
- package/dist/cjs/af-show.cjs.entry.js +2 -2
- package/dist/cjs/af-social-link.cjs.entry.js +2 -2
- package/dist/cjs/af-spacer.cjs.entry.js +2 -2
- package/dist/cjs/af-split-section.cjs.entry.js +3 -3
- package/dist/cjs/af-split-section.entry.cjs.js.map +1 -1
- package/dist/cjs/af-stack.cjs.entry.js +2 -2
- package/dist/cjs/af-stack.entry.cjs.js.map +1 -1
- package/dist/cjs/af-stat.cjs.entry.js +18 -0
- package/dist/cjs/af-stat.entry.cjs.js.map +1 -0
- package/dist/cjs/af-stats-row.cjs.entry.js +18 -0
- package/dist/cjs/af-stats-row.entry.cjs.js.map +1 -0
- package/dist/cjs/af-stepper-step.cjs.entry.js +2 -2
- package/dist/cjs/af-stepper.cjs.entry.js +2 -2
- package/dist/cjs/af-switch.cjs.entry.js +1 -1
- package/dist/cjs/af-tab-bar.cjs.entry.js +1 -1
- package/dist/cjs/af-tab.cjs.entry.js +1 -1
- package/dist/cjs/af-tag.cjs.entry.js +1 -1
- package/dist/cjs/af-testimonial-carousel.cjs.entry.js +2 -2
- package/dist/cjs/af-testimonial-stat.cjs.entry.js +2 -2
- package/dist/cjs/af-testimonial.cjs.entry.js +3 -3
- package/dist/cjs/af-text-image-nest.cjs.entry.js +2 -2
- package/dist/cjs/af-text-image.cjs.entry.js +1 -1
- package/dist/cjs/af-textarea.cjs.entry.js +1 -1
- package/dist/cjs/af-theme-override.cjs.entry.js +2 -2
- package/dist/cjs/af-theme-override.entry.cjs.js.map +1 -1
- package/dist/cjs/af-typography-lockup.cjs.entry.js +11 -5
- package/dist/cjs/af-typography-lockup.entry.cjs.js.map +1 -1
- package/dist/cjs/af-video-container.cjs.entry.js +2 -2
- package/dist/cjs/af-visually-hidden.cjs.entry.js +2 -2
- package/dist/cjs/affinda.cjs.js +2 -2
- package/dist/cjs/{index-CcvVbx1D.js → index-BzZA0USq.js} +3 -3
- package/dist/cjs/index-BzZA0USq.js.map +1 -0
- package/dist/cjs/index.cjs.js +3 -1
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +6 -0
- package/dist/collection/components/af-accordion/af-accordion.js +1 -1
- package/dist/collection/components/af-accordion-item/af-accordion-item.js +1 -1
- package/dist/collection/components/af-card/af-card.css +4 -1
- package/dist/collection/components/af-card/af-card.js +9 -3
- package/dist/collection/components/af-card/af-card.js.map +1 -1
- package/dist/collection/components/af-center/af-center.js +1 -1
- package/dist/collection/components/af-client-carousel/af-client-carousel.css +36 -0
- package/dist/collection/components/af-client-carousel/af-client-carousel.js +61 -16
- package/dist/collection/components/af-client-carousel/af-client-carousel.js.map +1 -1
- package/dist/collection/components/af-contact-item/af-contact-item.js +1 -1
- package/dist/collection/components/af-divider/af-divider.js +1 -1
- package/dist/collection/components/af-divider/af-divider.js.map +1 -1
- package/dist/collection/components/af-feature-accordion/af-feature-accordion.css +27 -5
- package/dist/collection/components/af-feature-accordion/af-feature-accordion.js +2 -2
- package/dist/collection/components/af-feature-card/af-feature-card.js +8 -2
- package/dist/collection/components/af-feature-card/af-feature-card.js.map +1 -1
- package/dist/collection/components/af-feature-grid/af-feature-grid.js +1 -1
- package/dist/collection/components/af-footer/af-footer.css +5 -2
- package/dist/collection/components/af-footer/af-footer.js +1 -1
- package/dist/collection/components/af-footer-column/af-footer-column.js +1 -1
- package/dist/collection/components/af-footer-link/af-footer-link.js +1 -1
- package/dist/collection/components/af-grid/af-grid.js +5 -4
- package/dist/collection/components/af-grid/af-grid.js.map +1 -1
- package/dist/collection/components/af-hero/af-hero.css +282 -0
- package/dist/collection/components/af-hero/af-hero.js +314 -0
- package/dist/collection/components/af-hero/af-hero.js.map +1 -0
- package/dist/collection/components/af-icon-box/af-icon-box.js +1 -1
- package/dist/collection/components/af-icon-text/af-icon-text.js +1 -1
- package/dist/collection/components/af-illustrated-card/af-illustrated-card.css +5 -1
- package/dist/collection/components/af-illustrated-card/af-illustrated-card.js +9 -3
- package/dist/collection/components/af-illustrated-card/af-illustrated-card.js.map +1 -1
- package/dist/collection/components/af-image/af-image.js +1 -1
- package/dist/collection/components/af-in-page-banner/af-in-page-banner.css +6 -4
- package/dist/collection/components/af-in-page-banner/af-in-page-banner.js +7 -6
- package/dist/collection/components/af-in-page-banner/af-in-page-banner.js.map +1 -1
- package/dist/collection/components/af-inline/af-inline.js +4 -3
- package/dist/collection/components/af-inline/af-inline.js.map +1 -1
- package/dist/collection/components/af-logo-well/af-logo-well.js +1 -1
- package/dist/collection/components/af-nav-accordion/af-nav-accordion.js +1 -1
- package/dist/collection/components/af-nav-accordion-item/af-nav-accordion-item.js +2 -2
- package/dist/collection/components/af-nav-menu/af-nav-menu.js +1 -1
- package/dist/collection/components/af-nav-menu-nest/af-nav-menu-nest.js +1 -1
- package/dist/collection/components/af-navbar/af-navbar.css +4 -1
- package/dist/collection/components/af-navbar/af-navbar.js +10 -4
- package/dist/collection/components/af-navbar/af-navbar.js.map +1 -1
- package/dist/collection/components/af-number-badge/af-number-badge.js +1 -1
- package/dist/collection/components/af-numbered-stepper/af-numbered-stepper.css +30 -0
- package/dist/collection/components/af-numbered-stepper/af-numbered-stepper.js +92 -0
- package/dist/collection/components/af-numbered-stepper/af-numbered-stepper.js.map +1 -0
- package/dist/collection/components/af-numbered-stepper-item/af-numbered-stepper-item.css +113 -0
- package/dist/collection/components/af-numbered-stepper-item/af-numbered-stepper-item.js +66 -0
- package/dist/collection/components/af-numbered-stepper-item/af-numbered-stepper-item.js.map +1 -0
- package/dist/collection/components/af-paperclip-decoration/af-paperclip-decoration.css +11 -0
- package/dist/collection/components/af-paperclip-decoration/af-paperclip-decoration.js +152 -0
- package/dist/collection/components/af-paperclip-decoration/af-paperclip-decoration.js.map +1 -0
- package/dist/collection/components/af-progress-line/af-progress-line.js +2 -2
- package/dist/collection/components/af-section/af-section.js +18 -6
- package/dist/collection/components/af-section/af-section.js.map +1 -1
- package/dist/collection/components/af-show/af-show.js +1 -1
- package/dist/collection/components/af-social-link/af-social-link.js +1 -1
- package/dist/collection/components/af-spacer/af-spacer.js +1 -1
- package/dist/collection/components/af-split-section/af-split-section.js +16 -8
- package/dist/collection/components/af-split-section/af-split-section.js.map +1 -1
- package/dist/collection/components/af-stack/af-stack.js +4 -3
- package/dist/collection/components/af-stack/af-stack.js.map +1 -1
- package/dist/collection/components/af-stat/af-stat.css +25 -0
- package/dist/collection/components/af-stat/af-stat.js +69 -0
- package/dist/collection/components/af-stat/af-stat.js.map +1 -0
- package/dist/collection/components/af-stats-row/af-stats-row.css +32 -0
- package/dist/collection/components/af-stats-row/af-stats-row.js +33 -0
- package/dist/collection/components/af-stats-row/af-stats-row.js.map +1 -0
- package/dist/collection/components/af-stepper/af-stepper.js +1 -1
- package/dist/collection/components/af-stepper-step/af-stepper-step.js +1 -1
- package/dist/collection/components/af-testimonial/af-testimonial.js +2 -2
- package/dist/collection/components/af-testimonial-carousel/af-testimonial-carousel.js +1 -1
- package/dist/collection/components/af-testimonial-stat/af-testimonial-stat.js +1 -1
- package/dist/collection/components/af-text-image-nest/af-text-image-nest.js +1 -1
- package/dist/collection/components/af-theme-override/af-theme-override.js +9 -3
- package/dist/collection/components/af-theme-override/af-theme-override.js.map +1 -1
- package/dist/collection/components/af-typography-lockup/af-typography-lockup.css +36 -12
- package/dist/collection/components/af-typography-lockup/af-typography-lockup.js +27 -9
- package/dist/collection/components/af-typography-lockup/af-typography-lockup.js.map +1 -1
- package/dist/collection/components/af-video-container/af-video-container.js +1 -1
- package/dist/collection/components/af-visually-hidden/af-visually-hidden.js +1 -1
- package/dist/collection/components.js +1 -0
- package/dist/collection/components.js.map +1 -1
- package/dist/collection/types.js +2 -0
- package/dist/collection/types.js.map +1 -0
- package/dist/components/af-accordion-item.js +2 -2
- package/dist/components/af-accordion.js +2 -2
- package/dist/components/af-aspect-ratio.js +1 -1
- package/dist/components/af-button-group.js +1 -1
- package/dist/components/af-button.js +1 -1
- package/dist/components/af-card.js +1 -1
- package/dist/components/af-center.js +2 -2
- package/dist/components/af-checkbox.js +1 -1
- package/dist/components/af-client-carousel.js +23 -7
- package/dist/components/af-client-carousel.js.map +1 -1
- package/dist/components/af-color-swatch.js +1 -1
- package/dist/components/af-contact-item.js +2 -2
- package/dist/components/af-container.js +1 -1
- package/dist/components/af-divider.js +2 -2
- package/dist/components/af-divider.js.map +1 -1
- package/dist/components/af-feature-accordion.js +4 -4
- package/dist/components/af-feature-accordion.js.map +1 -1
- package/dist/components/af-feature-card.js +1 -1
- package/dist/components/af-feature-grid.js +3 -3
- package/dist/components/af-fieldset.js +1 -1
- package/dist/components/af-footer-column.js +2 -2
- package/dist/components/af-footer-link.js +2 -2
- package/dist/components/af-footer.js +3 -3
- package/dist/components/af-footer.js.map +1 -1
- package/dist/components/af-grid-callout.js +2 -2
- package/dist/components/af-grid.js +3 -3
- package/dist/components/af-grid.js.map +1 -1
- package/dist/components/af-heading.js +1 -1
- package/dist/components/af-hero.d.ts +11 -0
- package/dist/components/af-hero.js +9 -0
- package/dist/components/af-hero.js.map +1 -0
- package/dist/components/af-icon-box.js +1 -1
- package/dist/components/af-icon-button.js +1 -1
- package/dist/components/af-icon-text.js +5 -5
- package/dist/components/af-icon.js +1 -1
- package/dist/components/af-illustrated-card.js +1 -1
- package/dist/components/af-image.js +1 -1
- package/dist/components/af-in-page-banner.js +4 -4
- package/dist/components/af-in-page-banner.js.map +1 -1
- package/dist/components/af-inline.js +2 -2
- package/dist/components/af-inline.js.map +1 -1
- package/dist/components/af-input.js +1 -1
- package/dist/components/af-logo-well.js +2 -2
- package/dist/components/af-logo.js +1 -1
- package/dist/components/af-nav-accordion-item.js +3 -3
- package/dist/components/af-nav-accordion.js +2 -2
- package/dist/components/af-nav-card.js +1 -1
- package/dist/components/af-nav-item.js +1 -1
- package/dist/components/af-nav-menu-nest.js +2 -2
- package/dist/components/af-nav-menu.js +2 -2
- package/dist/components/af-navbar.js +1 -1
- package/dist/components/af-number-badge.js +1 -58
- package/dist/components/af-number-badge.js.map +1 -1
- package/dist/components/af-numbered-stepper-item.d.ts +11 -0
- package/dist/components/af-numbered-stepper-item.js +58 -0
- package/dist/components/af-numbered-stepper-item.js.map +1 -0
- package/dist/components/af-numbered-stepper.d.ts +11 -0
- package/dist/components/af-numbered-stepper.js +57 -0
- package/dist/components/af-numbered-stepper.js.map +1 -0
- package/dist/components/af-paperclip-decoration.d.ts +11 -0
- package/dist/components/af-paperclip-decoration.js +64 -0
- package/dist/components/af-paperclip-decoration.js.map +1 -0
- package/dist/components/af-progress-line.js +1 -1
- package/dist/components/af-radio.js +1 -1
- package/dist/components/af-section.js +1 -46
- package/dist/components/af-section.js.map +1 -1
- package/dist/components/af-show.js +2 -2
- package/dist/components/af-social-link.js +2 -2
- package/dist/components/af-spacer.js +2 -2
- package/dist/components/af-split-section.js +4 -4
- package/dist/components/af-split-section.js.map +1 -1
- package/dist/components/af-stack.js +2 -2
- package/dist/components/af-stack.js.map +1 -1
- package/dist/components/af-stat.d.ts +11 -0
- package/dist/components/af-stat.js +53 -0
- package/dist/components/af-stat.js.map +1 -0
- package/dist/components/af-stats-row.d.ts +11 -0
- package/dist/components/af-stats-row.js +37 -0
- package/dist/components/af-stats-row.js.map +1 -0
- package/dist/components/af-stepper-step.js +2 -2
- package/dist/components/af-stepper.js +2 -2
- package/dist/components/af-switch.js +1 -1
- package/dist/components/af-tab-bar.js +1 -1
- package/dist/components/af-tab.js +1 -1
- package/dist/components/af-tag.js +1 -1
- package/dist/components/af-testimonial-carousel.js +3 -3
- package/dist/components/af-testimonial-stat.js +4 -4
- package/dist/components/af-testimonial.js +6 -6
- package/dist/components/af-text-image-nest.js +2 -2
- package/dist/components/af-text-image.js +2 -2
- package/dist/components/af-text.js +1 -1
- package/dist/components/af-textarea.js +1 -1
- package/dist/components/af-theme-override.js +2 -2
- package/dist/components/af-theme-override.js.map +1 -1
- package/dist/components/af-typography-lockup.js +1 -1
- package/dist/components/af-video-container.js +4 -4
- package/dist/components/af-visually-hidden.js +2 -2
- package/dist/components/index.js +25 -24
- package/dist/components/index.js.map +1 -1
- package/dist/components/{p-CNuja1ax.js → p--gChEc0P.js} +3 -3
- package/dist/components/{p-CNuja1ax.js.map → p--gChEc0P.js.map} +1 -1
- package/dist/components/{p-TfjpcU9q.js → p-3Gzh4deR.js} +7 -7
- package/dist/components/p-3Gzh4deR.js.map +1 -0
- package/dist/components/{p-DCu8UsJv.js → p-BRDu9zN1.js} +3 -3
- package/dist/components/{p-DCu8UsJv.js.map → p-BRDu9zN1.js.map} +1 -1
- package/dist/components/{p-CSsp_M05.js → p-BROLmNeM.js} +3 -3
- package/dist/components/{p-CSsp_M05.js.map → p-BROLmNeM.js.map} +1 -1
- package/dist/components/{p-Dz4dEIxw.js → p-BT13eL0Y.js} +3 -3
- package/dist/components/{p-Dz4dEIxw.js.map → p-BT13eL0Y.js.map} +1 -1
- package/dist/components/{p-DAYoQm46.js → p-BW-FxZwa.js} +3 -3
- package/dist/components/{p-DAYoQm46.js.map → p-BW-FxZwa.js.map} +1 -1
- package/dist/components/{p-DwhGQrZK.js → p-BXmiPS9x.js} +5 -5
- package/dist/components/{p-DwhGQrZK.js.map → p-BXmiPS9x.js.map} +1 -1
- package/dist/components/{p-aAVeavhK.js → p-B_OoX__z.js} +3 -3
- package/dist/components/{p-aAVeavhK.js.map → p-B_OoX__z.js.map} +1 -1
- package/dist/components/{p-C0R_vg0S.js → p-BgXXQG75.js} +3 -3
- package/dist/components/{p-C0R_vg0S.js.map → p-BgXXQG75.js.map} +1 -1
- package/dist/components/{p-DqgLTGE0.js → p-C4G6votC.js} +3 -3
- package/dist/components/{p-DqgLTGE0.js.map → p-C4G6votC.js.map} +1 -1
- package/dist/components/p-CJxqw006.js +53 -0
- package/dist/components/p-CJxqw006.js.map +1 -0
- package/dist/components/{p-CHLm_AuW.js → p-CP8rLe_C.js} +3 -3
- package/dist/components/{p-CHLm_AuW.js.map → p-CP8rLe_C.js.map} +1 -1
- package/dist/components/p-CRnEuh5f.js +136 -0
- package/dist/components/p-CRnEuh5f.js.map +1 -0
- package/dist/components/{p-Bw8fdMnn.js → p-CX0pktY8.js} +3 -3
- package/dist/components/{p-Bw8fdMnn.js.map → p-CX0pktY8.js.map} +1 -1
- package/dist/components/{p-CAUqW6Mp.js → p-CYKk6Qhi.js} +3 -3
- package/dist/components/{p-CAUqW6Mp.js.map → p-CYKk6Qhi.js.map} +1 -1
- package/dist/components/{p-N0xV1Erp.js → p-ClZAZSzR.js} +14 -8
- package/dist/components/p-ClZAZSzR.js.map +1 -0
- package/dist/components/{p-DkaLi-uL.js → p-CoL_hRAR.js} +3 -3
- package/dist/components/{p-DkaLi-uL.js.map → p-CoL_hRAR.js.map} +1 -1
- package/dist/components/{p-CB9GFAlk.js → p-D8DmhESZ.js} +3 -3
- package/dist/components/{p-CB9GFAlk.js.map → p-D8DmhESZ.js.map} +1 -1
- package/dist/components/{p-B3Yr4Hxx.js → p-DJC-C2BS.js} +3 -3
- package/dist/components/{p-B3Yr4Hxx.js.map → p-DJC-C2BS.js.map} +1 -1
- package/dist/components/{p-CqQyDZ-4.js → p-DOgb6SUj.js} +3 -3
- package/dist/components/p-DOgb6SUj.js.map +1 -0
- package/dist/components/{p-Dxa6cHAb.js → p-DbVc-b1e.js} +3 -3
- package/dist/components/{p-Dxa6cHAb.js.map → p-DbVc-b1e.js.map} +1 -1
- package/dist/components/{p-D3oGtcJ5.js → p-Dd3nOGt_.js} +3 -3
- package/dist/components/{p-D3oGtcJ5.js.map → p-Dd3nOGt_.js.map} +1 -1
- package/dist/components/{p-DRujYIJW.js → p-DqJRvNOl.js} +6 -6
- package/dist/components/p-DqJRvNOl.js.map +1 -0
- package/dist/components/{p-DGBMGvZK.js → p-Dx_UXI2a.js} +3 -3
- package/dist/components/{p-DGBMGvZK.js.map → p-Dx_UXI2a.js.map} +1 -1
- package/dist/components/{p-DENib4OL.js → p-DyZaoX4Q.js} +3 -3
- package/dist/components/{p-DENib4OL.js.map → p-DyZaoX4Q.js.map} +1 -1
- package/dist/components/{p-CKcuq0NU.js → p-LRPXnaSx.js} +4 -4
- package/dist/components/{p-CKcuq0NU.js.map → p-LRPXnaSx.js.map} +1 -1
- package/dist/components/{p-DMOGClIa.js → p-NtJ_O8-z.js} +3 -3
- package/dist/components/{p-DMOGClIa.js.map → p-NtJ_O8-z.js.map} +1 -1
- package/dist/components/p-O26uYJSV.js +51 -0
- package/dist/components/p-O26uYJSV.js.map +1 -0
- package/dist/components/p-QoDae21y.js +63 -0
- package/dist/components/p-QoDae21y.js.map +1 -0
- package/dist/components/{p-D30gSxh2.js → p-kEqwmn80.js} +3 -3
- package/dist/components/{p-D30gSxh2.js.map → p-kEqwmn80.js.map} +1 -1
- package/dist/components/{p-XrKBGe-M.js → p-mbl86-w6.js} +5 -5
- package/dist/components/p-mbl86-w6.js.map +1 -0
- package/dist/components/{p-BHAWxoQE.js → p-nA3Uvhwb.js} +5 -5
- package/dist/components/{p-BHAWxoQE.js.map → p-nA3Uvhwb.js.map} +1 -1
- package/dist/esm/af-accordion-item.entry.js +2 -2
- package/dist/esm/af-accordion.entry.js +2 -2
- package/dist/esm/af-aspect-ratio.entry.js +1 -1
- package/dist/esm/af-button-group.entry.js +1 -1
- package/dist/esm/af-button.entry.js +1 -1
- package/dist/esm/af-card.entry.js +3 -3
- package/dist/esm/af-card.entry.js.map +1 -1
- package/dist/esm/af-center.entry.js +2 -2
- package/dist/esm/af-checkbox.entry.js +1 -1
- package/dist/esm/af-client-carousel.entry.js +21 -6
- package/dist/esm/af-client-carousel.entry.js.map +1 -1
- package/dist/esm/af-color-swatch.entry.js +1 -1
- package/dist/esm/af-contact-item.entry.js +2 -2
- package/dist/esm/af-container.entry.js +1 -1
- package/dist/esm/af-divider.entry.js +2 -2
- package/dist/esm/af-divider.entry.js.map +1 -1
- package/dist/esm/af-feature-accordion.entry.js +4 -4
- package/dist/esm/af-feature-accordion.entry.js.map +1 -1
- package/dist/esm/af-feature-card.entry.js +1 -1
- package/dist/esm/af-feature-card.entry.js.map +1 -1
- package/dist/esm/af-feature-grid.entry.js +2 -2
- package/dist/esm/af-fieldset.entry.js +1 -1
- package/dist/esm/af-footer-column.entry.js +2 -2
- package/dist/esm/af-footer-link.entry.js +2 -2
- package/dist/esm/af-footer.entry.js +3 -3
- package/dist/esm/af-footer.entry.js.map +1 -1
- package/dist/esm/af-grid-callout.entry.js +1 -1
- package/dist/esm/af-grid.entry.js +3 -3
- package/dist/esm/af-grid.entry.js.map +1 -1
- package/dist/esm/af-heading.af-logo.af-nav-item.af-navbar.af-text.entry.js.map +1 -1
- package/dist/esm/af-heading_5.entry.js +3 -3
- package/dist/esm/af-hero.entry.js +92 -0
- package/dist/esm/af-hero.entry.js.map +1 -0
- package/dist/esm/af-icon-box.entry.js +2 -2
- package/dist/esm/af-icon-button.entry.js +1 -1
- package/dist/esm/af-icon-text.entry.js +2 -2
- package/dist/esm/af-icon.entry.js +1 -1
- package/dist/esm/af-illustrated-card.entry.js +3 -3
- package/dist/esm/af-illustrated-card.entry.js.map +1 -1
- package/dist/esm/af-image.entry.js +2 -2
- package/dist/esm/af-in-page-banner.entry.js +3 -3
- package/dist/esm/af-in-page-banner.entry.js.map +1 -1
- package/dist/esm/af-inline.entry.js +2 -2
- package/dist/esm/af-inline.entry.js.map +1 -1
- package/dist/esm/af-input.entry.js +1 -1
- package/dist/esm/af-logo-well.entry.js +2 -2
- package/dist/esm/af-nav-accordion-item.entry.js +3 -3
- package/dist/esm/af-nav-accordion.entry.js +2 -2
- package/dist/esm/af-nav-card.entry.js +1 -1
- package/dist/esm/af-nav-menu-nest.entry.js +2 -2
- package/dist/esm/af-nav-menu.entry.js +2 -2
- package/dist/esm/af-number-badge.entry.js +2 -2
- package/dist/esm/af-numbered-stepper-item.entry.js +23 -0
- package/dist/esm/af-numbered-stepper-item.entry.js.map +1 -0
- package/dist/esm/af-numbered-stepper.entry.js +34 -0
- package/dist/esm/af-numbered-stepper.entry.js.map +1 -0
- package/dist/esm/af-paperclip-decoration.entry.js +37 -0
- package/dist/esm/af-paperclip-decoration.entry.js.map +1 -0
- package/dist/esm/af-progress-line.entry.js +3 -3
- package/dist/esm/af-radio.entry.js +1 -1
- package/dist/esm/af-section.entry.js +3 -3
- package/dist/esm/af-section.entry.js.map +1 -1
- package/dist/esm/af-show.entry.js +2 -2
- package/dist/esm/af-social-link.entry.js +2 -2
- package/dist/esm/af-spacer.entry.js +2 -2
- package/dist/esm/af-split-section.entry.js +3 -3
- package/dist/esm/af-split-section.entry.js.map +1 -1
- package/dist/esm/af-stack.entry.js +2 -2
- package/dist/esm/af-stack.entry.js.map +1 -1
- package/dist/esm/af-stat.entry.js +16 -0
- package/dist/esm/af-stat.entry.js.map +1 -0
- package/dist/esm/af-stats-row.entry.js +16 -0
- package/dist/esm/af-stats-row.entry.js.map +1 -0
- package/dist/esm/af-stepper-step.entry.js +2 -2
- package/dist/esm/af-stepper.entry.js +2 -2
- package/dist/esm/af-switch.entry.js +1 -1
- package/dist/esm/af-tab-bar.entry.js +1 -1
- package/dist/esm/af-tab.entry.js +1 -1
- package/dist/esm/af-tag.entry.js +1 -1
- package/dist/esm/af-testimonial-carousel.entry.js +2 -2
- package/dist/esm/af-testimonial-stat.entry.js +2 -2
- package/dist/esm/af-testimonial.entry.js +3 -3
- package/dist/esm/af-text-image-nest.entry.js +2 -2
- package/dist/esm/af-text-image.entry.js +1 -1
- package/dist/esm/af-textarea.entry.js +1 -1
- package/dist/esm/af-theme-override.entry.js +2 -2
- package/dist/esm/af-theme-override.entry.js.map +1 -1
- package/dist/esm/af-typography-lockup.entry.js +11 -5
- package/dist/esm/af-typography-lockup.entry.js.map +1 -1
- package/dist/esm/af-video-container.entry.js +2 -2
- package/dist/esm/af-visually-hidden.entry.js +2 -2
- package/dist/esm/affinda.js +3 -3
- package/dist/esm/{index-nb89SRN6.js → index-MwnBSqEY.js} +3 -3
- package/dist/esm/index-MwnBSqEY.js.map +1 -0
- package/dist/esm/index.js +2 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/types/components/af-card/af-card.d.ts +2 -1
- package/dist/types/components/af-client-carousel/af-client-carousel.d.ts +26 -13
- package/dist/types/components/af-divider/af-divider.d.ts +2 -1
- package/dist/types/components/af-feature-card/af-feature-card.d.ts +2 -1
- package/dist/types/components/af-grid/af-grid.d.ts +1 -1
- package/dist/types/components/af-hero/af-hero.d.ts +93 -0
- package/dist/types/components/af-illustrated-card/af-illustrated-card.d.ts +2 -1
- package/dist/types/components/af-in-page-banner/af-in-page-banner.d.ts +2 -3
- package/dist/types/components/af-inline/af-inline.d.ts +1 -1
- package/dist/types/components/af-navbar/af-navbar.d.ts +2 -1
- package/dist/types/components/af-numbered-stepper/af-numbered-stepper.d.ts +38 -0
- package/dist/types/components/af-numbered-stepper-item/af-numbered-stepper-item.d.ts +22 -0
- package/dist/types/components/af-paperclip-decoration/af-paperclip-decoration.d.ts +50 -0
- package/dist/types/components/af-section/af-section.d.ts +3 -2
- package/dist/types/components/af-split-section/af-split-section.d.ts +2 -3
- package/dist/types/components/af-stack/af-stack.d.ts +1 -1
- package/dist/types/components/af-stat/af-stat.d.ts +15 -0
- package/dist/types/components/af-stats-row/af-stats-row.d.ts +17 -0
- package/dist/types/components/af-theme-override/af-theme-override.d.ts +2 -1
- package/dist/types/components/af-typography-lockup/af-typography-lockup.d.ts +12 -4
- package/dist/types/components.d.ts +800 -64
- package/dist/types/types.d.ts +57 -0
- package/package.json +3 -3
- package/dist/affinda/p-07f9580c.entry.js +0 -2
- package/dist/affinda/p-50590601.entry.js +0 -2
- package/dist/affinda/p-570283f6.entry.js +0 -2
- package/dist/affinda/p-5b3ff010.entry.js +0 -2
- package/dist/affinda/p-5e5d16dd.entry.js +0 -2
- package/dist/affinda/p-6bb831c5.entry.js +0 -2
- package/dist/affinda/p-9229defb.entry.js +0 -2
- package/dist/affinda/p-9229defb.entry.js.map +0 -1
- package/dist/affinda/p-94adb381.entry.js +0 -2
- package/dist/affinda/p-b14c1a4b.entry.js +0 -2
- package/dist/affinda/p-cc22a8da.entry.js +0 -2
- package/dist/affinda/p-d60d1943.entry.js +0 -2
- package/dist/affinda/p-d7e29257.entry.js +0 -2
- package/dist/affinda/p-da999c10.entry.js +0 -2
- package/dist/affinda/p-f9e3c2b7.entry.js +0 -2
- package/dist/affinda/p-nb89SRN6.js +0 -3
- package/dist/affinda/p-nb89SRN6.js.map +0 -1
- package/dist/cjs/index-CcvVbx1D.js.map +0 -1
- package/dist/components/p-BO4blShf.js +0 -53
- package/dist/components/p-BO4blShf.js.map +0 -1
- package/dist/components/p-CqQyDZ-4.js.map +0 -1
- package/dist/components/p-DRujYIJW.js.map +0 -1
- package/dist/components/p-N0xV1Erp.js.map +0 -1
- package/dist/components/p-TfjpcU9q.js.map +0 -1
- package/dist/components/p-XrKBGe-M.js.map +0 -1
- package/dist/esm/index-nb89SRN6.js.map +0 -1
- /package/dist/affinda/{p-9bb5202e.entry.js.map → p-09dfcd40.entry.js.map} +0 -0
- /package/dist/affinda/{p-6eca2722.entry.js.map → p-15f0bd34.entry.js.map} +0 -0
- /package/dist/affinda/{p-97ac8f5f.entry.js.map → p-1b4b0c88.entry.js.map} +0 -0
- /package/dist/affinda/{p-2c655ae2.entry.js.map → p-1c96856a.entry.js.map} +0 -0
- /package/dist/affinda/{p-4cbdf940.entry.js.map → p-24e74c10.entry.js.map} +0 -0
- /package/dist/affinda/{p-bf941fa7.entry.js.map → p-256970e3.entry.js.map} +0 -0
- /package/dist/affinda/{p-5b3ff010.entry.js.map → p-32d62fbb.entry.js.map} +0 -0
- /package/dist/affinda/{p-af3f6e16.entry.js.map → p-342b08e5.entry.js.map} +0 -0
- /package/dist/affinda/{p-102e8b8c.entry.js.map → p-35607741.entry.js.map} +0 -0
- /package/dist/affinda/{p-c7ba4e7f.entry.js.map → p-364ffa25.entry.js.map} +0 -0
- /package/dist/affinda/{p-e9f8ef54.entry.js.map → p-365a75e2.entry.js.map} +0 -0
- /package/dist/affinda/{p-d7e29257.entry.js.map → p-3ed408f6.entry.js.map} +0 -0
- /package/dist/affinda/{p-80c96efd.entry.js.map → p-4058a1eb.entry.js.map} +0 -0
- /package/dist/affinda/{p-159fe9b1.entry.js.map → p-41bbb218.entry.js.map} +0 -0
- /package/dist/affinda/{p-f9b6d1c6.entry.js.map → p-43f40921.entry.js.map} +0 -0
- /package/dist/affinda/{p-0f3267ea.entry.js.map → p-4a355b69.entry.js.map} +0 -0
- /package/dist/affinda/{p-3ecf43aa.entry.js.map → p-4b2c0698.entry.js.map} +0 -0
- /package/dist/affinda/{p-12652bf5.entry.js.map → p-4f59b554.entry.js.map} +0 -0
- /package/dist/affinda/{p-4e8bd716.entry.js.map → p-5c163c5b.entry.js.map} +0 -0
- /package/dist/affinda/{p-8d9d0cb3.entry.js.map → p-5e5e7d75.entry.js.map} +0 -0
- /package/dist/affinda/{p-648e2d76.entry.js.map → p-61a6b43d.entry.js.map} +0 -0
- /package/dist/affinda/{p-94adb381.entry.js.map → p-6756aa66.entry.js.map} +0 -0
- /package/dist/affinda/{p-432c7bfc.entry.js.map → p-6c33fee6.entry.js.map} +0 -0
- /package/dist/affinda/{p-f9e3c2b7.entry.js.map → p-6e181b2b.entry.js.map} +0 -0
- /package/dist/affinda/{p-816deae3.entry.js.map → p-6ea474a3.entry.js.map} +0 -0
- /package/dist/affinda/{p-ef41e743.entry.js.map → p-7111051c.entry.js.map} +0 -0
- /package/dist/affinda/{p-23aa03dc.entry.js.map → p-76cb736d.entry.js.map} +0 -0
- /package/dist/affinda/{p-e78112d9.entry.js.map → p-7867c2ff.entry.js.map} +0 -0
- /package/dist/affinda/{p-11e7ddf3.entry.js.map → p-827f3050.entry.js.map} +0 -0
- /package/dist/affinda/{p-77ed47d5.entry.js.map → p-83bb96cc.entry.js.map} +0 -0
- /package/dist/affinda/{p-5e444a9a.entry.js.map → p-862a2509.entry.js.map} +0 -0
- /package/dist/affinda/{p-7238fc21.entry.js.map → p-86f6dfdc.entry.js.map} +0 -0
- /package/dist/affinda/{p-e0163836.entry.js.map → p-90ef7baa.entry.js.map} +0 -0
- /package/dist/affinda/{p-ab0b621e.entry.js.map → p-9480f00d.entry.js.map} +0 -0
- /package/dist/affinda/{p-3ca3e4dc.entry.js.map → p-95d4696a.entry.js.map} +0 -0
- /package/dist/affinda/{p-892f9bc3.entry.js.map → p-9aed7039.entry.js.map} +0 -0
- /package/dist/affinda/{p-bfc17d0c.entry.js.map → p-9c1e9bd8.entry.js.map} +0 -0
- /package/dist/affinda/{p-be45f85c.entry.js.map → p-9ce0adc2.entry.js.map} +0 -0
- /package/dist/affinda/{p-8da30e7a.entry.js.map → p-9eba91fd.entry.js.map} +0 -0
- /package/dist/affinda/{p-aa5c6cc0.entry.js.map → p-9f3e7116.entry.js.map} +0 -0
- /package/dist/affinda/{p-636045e8.entry.js.map → p-a02d6192.entry.js.map} +0 -0
- /package/dist/affinda/{p-2140698f.entry.js.map → p-a25d3257.entry.js.map} +0 -0
- /package/dist/affinda/{p-401fc5b1.entry.js.map → p-a7a8f18c.entry.js.map} +0 -0
- /package/dist/affinda/{p-a4d39bdd.entry.js.map → p-a8d75eb1.entry.js.map} +0 -0
- /package/dist/affinda/{p-a3865306.entry.js.map → p-ae430873.entry.js.map} +0 -0
- /package/dist/affinda/{p-5ab389c6.entry.js.map → p-bbfc9df6.entry.js.map} +0 -0
- /package/dist/affinda/{p-a002c784.entry.js.map → p-bed7d9a1.entry.js.map} +0 -0
- /package/dist/affinda/{p-eb96f29b.entry.js.map → p-dcc89b4c.entry.js.map} +0 -0
- /package/dist/affinda/{p-1dff35bf.entry.js.map → p-de75cb4f.entry.js.map} +0 -0
- /package/dist/affinda/{p-7b7d9c6a.entry.js.map → p-e07e27f1.entry.js.map} +0 -0
- /package/dist/affinda/{p-8f6884c8.entry.js.map → p-eeda78ea.entry.js.map} +0 -0
- /package/dist/affinda/{p-d54abc45.entry.js.map → p-f19cb091.entry.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"af-section.entry.esm.js","sources":["src/components/af-section/af-section.css?tag=af-section&encapsulation=scoped","src/components/af-section/af-section.tsx"],"sourcesContent":["/**\n * Section Component Styles\n * \n * Provides themed containers with proper spacing.\n * Theme classes set CSS custom properties that child components consume.\n */\n\n:host {\n display: block;\n width: 100%;\n}\n\n.section {\n width: 100%;\n position: relative;\n}\n\n/* Padding variants */\n.padding-none {\n padding: 0;\n}\n\n.padding-tight {\n padding: 48px 0;\n}\n\n.padding-default {\n padding: 96px 0;\n}\n\n.padding-loose {\n padding: 120px 0 96px;\n}\n\n/* ==========================================================================\n WHITE THEME\n ========================================================================== */\n\n.theme-white {\n background-color: var(--colour-brand-white, #FFFFFF);\n \n /* Background tokens */\n --af-background-base: var(--colour-brand-white, #FFFFFF);\n --af-background-base-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-mistgreen-200, #e8eeed);\n --af-background-level-1-hover: var(--colour-mistgreen-300, #dde6e3);\n --af-background-border-subtle: var(--colour-mistgreen-200, #e8eeed);\n --af-background-border-default: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-heavy: var(--colour-mistgreen-500, #c6d5d1);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-200, #e8ebeb);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n INKWELL THEME (Dark)\n ========================================================================== */\n\n.theme-inkwell {\n background-color: var(--colour-brand-inkwell, #14343B);\n \n /* Background tokens */\n --af-background-base: var(--colour-brand-inkwell, #14343b);\n --af-background-base-hover: var(--colour-inkwell-600, #102a2f);\n --af-background-contrast: var(--colour-inkwell-700, #102a2f);\n --af-background-level-1: var(--colour-inkwell-450, #203e45);\n --af-background-level-1-hover: var(--colour-inkwell-400, #2b484f);\n --af-background-border-subtle: var(--colour-inkwell-450, #203e45);\n --af-background-border-default: var(--colour-inkwell-400, #2b484f);\n --af-background-border-heavy: var(--colour-inkwell-700, #102a2f);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-white, #ffffff);\n --af-background-icon-accent: var(--colour-brand-ice, #a6fffb);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-mist-green, #c6d5d1);\n --af-typography-heading-secondary: var(--colour-brand-white, #ffffff);\n --af-typography-body-dark: var(--colour-brand-white, #ffffff);\n --af-typography-body-default: var(--colour-inkwell-100, #d0d6d8);\n --af-typography-body-subtle: var(--colour-inkwell-200, #a1aeb1);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-white, #ffffff);\n --af-button-secondary-icon: var(--colour-brand-white, #ffffff);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(255, 255, 255, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-white, #ffffff);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-white, #ffffff);\n --af-button-ghost-icon: var(--colour-brand-white, #ffffff);\n --af-button-ghost-stroke: var(--colour-brand-ice, #A6FFFB);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-inkwell-450, #203e45);\n --af-input-bg-hover: var(--colour-inkwell-400, #2b484f);\n --af-input-bg-disabled: var(--colour-inkwell-600, #102a2f);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--colour-brand-ice, #a6fffb);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--colour-brand-ice, #a6fffb);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-inkwell-450, #203e45);\n --af-form-control-bg-checked: var(--colour-brand-mist-green, #c6d5d1);\n --af-form-control-bg-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-bg-checked-disabled: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke: var(--colour-inkwell-350, #60767b);\n --af-form-control-stroke-hover: var(--colour-brand-white, #ffffff);\n --af-form-control-stroke-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-icon: var(--colour-brand-inkwell, #14343b);\n --af-form-control-label: var(--colour-brand-white, #ffffff);\n}\n\n/* ==========================================================================\n MIST-GREEN THEME\n ========================================================================== */\n\n.theme-mist-green {\n background-color: var(--colour-brand-mist-green, #C6D5D1);\n \n /* Background tokens */\n --af-background-base: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-base-hover: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-contrast: var(--colour-brand-soft-clay, #b09670);\n --af-background-level-1: var(--colour-mistgreen-300, #dde6e3);\n --af-background-level-1-hover: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-subtle: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-border-default: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-heavy: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-300, #dde6e3);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-600, #b2c0bc);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n SOFT-CLAY THEME\n ========================================================================== */\n\n.theme-soft-clay {\n background-color: var(--colour-softclay-400, #c0ab8d);\n \n /* Background tokens */\n --af-background-base: var(--colour-softclay-400, #c0ab8d);\n --af-background-base-hover: var(--colour-softclay-500, #b09670);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-softclay-500, #b09670);\n --af-background-level-1-hover: var(--colour-softclay-600, #9e8765);\n --af-background-border-subtle: var(--colour-softclay-600, #9e8765);\n --af-background-border-default: var(--colour-softclay-700, #8d785a);\n --af-background-border-heavy: var(--colour-brand-inkwell, #14343b);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-ivory-paper, #fff9ee);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-ivory-paper, #fff9ee);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-softclay-300, #d0c1a8);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-softclay-700, #8d785a);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-softclay-600, #9e8765);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n WHITE-IVORY THEME\n ========================================================================== */\n\n.theme-white-ivory {\n background-color: var(--colour-brand-ivory-paper, #fff9ee);\n \n /* Background tokens */\n --af-background-base: var(--colour-brand-ivory-paper, #fff9ee);\n --af-background-base-hover: var(--colour-ivory-100, #fff5e0);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-ivory-200, #ffefcc);\n --af-background-level-1-hover: var(--colour-ivory-300, #ffe9b8);\n --af-background-border-subtle: var(--colour-ivory-200, #ffefcc);\n --af-background-border-default: var(--colour-ivory-400, #ffe3a3);\n --af-background-border-heavy: var(--colour-brand-soft-clay, #b09670);\n --af-background-border-active: var(--colour-brand-soft-clay, #b09670);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #b09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-ivory-100, #fff5e0);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-ivory-200, #ffefcc);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-ivory-400, #ffe3a3);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-ivory-300, #ffe9b8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* Mobile adjustments */\n/* mobile-only */\n@media (max-width: 768px) {\n .padding-tight {\n padding: 32px 0;\n }\n \n .padding-default {\n padding: 64px 0;\n }\n \n .padding-loose {\n padding: 80px 0 64px;\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Section layout component for consistent spacing and backgrounds.\n * Sets theme context for all child components via CSS custom properties.\n */\n@Component({\n tag: 'af-section',\n styleUrl: 'af-section.css',\n shadow: false,\n scoped: true,\n})\nexport class AfSection {\n /** Padding variant */\n @Prop() padding: 'none' | 'tight' | 'default' | 'loose' = 'default';\n \n /** Theme - sets background color and provides theme context to children */\n @Prop() theme: 'white' | 'inkwell' | 'mist-green' | 'soft-clay' | 'white-ivory' = 'white';\n \n /** Whether to include a Container wrapper */\n @Prop() container: boolean = true;\n\n render() {\n const content = <slot></slot>;\n \n return (\n <Host>\n <div class={`section padding-${this.padding} theme-${this.theme}`}>\n {this.container ? (\n <af-container>{content}</af-container>\n ) : content}\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,YAAY,GAAG,olgBAAolgB;;MCY5lgB,SAAS,GAAA,MAAA;AANtB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQU,QAAA,IAAO,CAAA,OAAA,GAA2C,SAAS;;AAG3D,QAAA,IAAK,CAAA,KAAA,GAAqE,OAAO;;AAGjF,QAAA,IAAS,CAAA,SAAA,GAAY,IAAI;AAelC;IAbC,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa;QAE7B,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAmB,gBAAA,EAAA,IAAI,CAAC,OAAO,CAAU,OAAA,EAAA,IAAI,CAAC,KAAK,CAAA,CAAE,EAAA,EAC9D,IAAI,CAAC,SAAS,IACb,CAAe,CAAA,cAAA,EAAA,IAAA,EAAA,OAAO,CAAgB,IACpC,OAAO,CACP,CACD;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"af-section.entry.esm.js","sources":["src/components/af-section/af-section.css?tag=af-section&encapsulation=scoped","src/components/af-section/af-section.tsx"],"sourcesContent":["/**\n * Section Component Styles\n * \n * Provides themed containers with proper spacing.\n * Theme classes set CSS custom properties that child components consume.\n */\n\n:host {\n display: block;\n width: 100%;\n}\n\n.section {\n width: 100%;\n position: relative;\n}\n\n/* Padding variants */\n.padding-none {\n padding: 0;\n}\n\n.padding-tight {\n padding: 48px 0;\n}\n\n.padding-default {\n padding: 96px 0;\n}\n\n.padding-loose {\n padding: 120px 0 96px;\n}\n\n/* ==========================================================================\n WHITE THEME\n ========================================================================== */\n\n.theme-white {\n background-color: var(--colour-brand-white, #FFFFFF);\n \n /* Background tokens */\n --af-background-base: var(--colour-brand-white, #FFFFFF);\n --af-background-base-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-mistgreen-200, #e8eeed);\n --af-background-level-1-hover: var(--colour-mistgreen-300, #dde6e3);\n --af-background-border-subtle: var(--colour-mistgreen-200, #e8eeed);\n --af-background-border-default: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-heavy: var(--colour-mistgreen-500, #c6d5d1);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-200, #e8ebeb);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n INKWELL THEME (Dark)\n ========================================================================== */\n\n.theme-inkwell {\n background-color: var(--colour-brand-inkwell, #14343B);\n \n /* Background tokens */\n --af-background-base: var(--colour-brand-inkwell, #14343b);\n --af-background-base-hover: var(--colour-inkwell-600, #102a2f);\n --af-background-contrast: var(--colour-inkwell-700, #102a2f);\n --af-background-level-1: var(--colour-inkwell-450, #203e45);\n --af-background-level-1-hover: var(--colour-inkwell-400, #2b484f);\n --af-background-border-subtle: var(--colour-inkwell-450, #203e45);\n --af-background-border-default: var(--colour-inkwell-400, #2b484f);\n --af-background-border-heavy: var(--colour-inkwell-700, #102a2f);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-white, #ffffff);\n --af-background-icon-accent: var(--colour-brand-ice, #a6fffb);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-mist-green, #c6d5d1);\n --af-typography-heading-secondary: var(--colour-brand-white, #ffffff);\n --af-typography-body-dark: var(--colour-brand-white, #ffffff);\n --af-typography-body-default: var(--colour-inkwell-100, #d0d6d8);\n --af-typography-body-subtle: var(--colour-inkwell-200, #a1aeb1);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-white, #ffffff);\n --af-button-secondary-icon: var(--colour-brand-white, #ffffff);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(255, 255, 255, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-white, #ffffff);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-white, #ffffff);\n --af-button-ghost-icon: var(--colour-brand-white, #ffffff);\n --af-button-ghost-stroke: var(--colour-brand-ice, #A6FFFB);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-inkwell-450, #203e45);\n --af-input-bg-hover: var(--colour-inkwell-400, #2b484f);\n --af-input-bg-disabled: var(--colour-inkwell-600, #102a2f);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--colour-brand-ice, #a6fffb);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--colour-brand-ice, #a6fffb);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-inkwell-450, #203e45);\n --af-form-control-bg-checked: var(--colour-brand-mist-green, #c6d5d1);\n --af-form-control-bg-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-bg-checked-disabled: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke: var(--colour-inkwell-350, #60767b);\n --af-form-control-stroke-hover: var(--colour-brand-white, #ffffff);\n --af-form-control-stroke-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-icon: var(--colour-brand-inkwell, #14343b);\n --af-form-control-label: var(--colour-brand-white, #ffffff);\n}\n\n/* ==========================================================================\n MIST-GREEN THEME\n ========================================================================== */\n\n.theme-mist-green {\n background-color: var(--colour-brand-mist-green, #C6D5D1);\n \n /* Background tokens */\n --af-background-base: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-base-hover: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-contrast: var(--colour-brand-soft-clay, #b09670);\n --af-background-level-1: var(--colour-mistgreen-300, #dde6e3);\n --af-background-level-1-hover: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-subtle: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-border-default: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-heavy: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-300, #dde6e3);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-600, #b2c0bc);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n SOFT-CLAY THEME\n ========================================================================== */\n\n.theme-soft-clay {\n background-color: var(--colour-softclay-400, #c0ab8d);\n \n /* Background tokens */\n --af-background-base: var(--colour-softclay-400, #c0ab8d);\n --af-background-base-hover: var(--colour-softclay-500, #b09670);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-softclay-500, #b09670);\n --af-background-level-1-hover: var(--colour-softclay-600, #9e8765);\n --af-background-border-subtle: var(--colour-softclay-600, #9e8765);\n --af-background-border-default: var(--colour-softclay-700, #8d785a);\n --af-background-border-heavy: var(--colour-brand-inkwell, #14343b);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-ivory-paper, #fff9ee);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-ivory-paper, #fff9ee);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-softclay-300, #d0c1a8);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-softclay-700, #8d785a);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-softclay-600, #9e8765);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n WHITE-IVORY THEME\n ========================================================================== */\n\n.theme-white-ivory {\n background-color: var(--colour-brand-ivory-paper, #fff9ee);\n \n /* Background tokens */\n --af-background-base: var(--colour-brand-ivory-paper, #fff9ee);\n --af-background-base-hover: var(--colour-ivory-100, #fff5e0);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-ivory-200, #ffefcc);\n --af-background-level-1-hover: var(--colour-ivory-300, #ffe9b8);\n --af-background-border-subtle: var(--colour-ivory-200, #ffefcc);\n --af-background-border-default: var(--colour-ivory-400, #ffe3a3);\n --af-background-border-heavy: var(--colour-brand-soft-clay, #b09670);\n --af-background-border-active: var(--colour-brand-soft-clay, #b09670);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #b09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-ivory-100, #fff5e0);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-ivory-200, #ffefcc);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-ivory-400, #ffe3a3);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-ivory-300, #ffe9b8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* Mobile adjustments */\n/* mobile-only */\n@media (max-width: 768px) {\n .padding-tight {\n padding: 32px 0;\n }\n \n .padding-default {\n padding: 64px 0;\n }\n \n .padding-loose {\n padding: 80px 0 64px;\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport type { Padding, Theme } from '../../types';\n\n/**\n * Section layout component for consistent spacing and backgrounds.\n * Sets theme context for all child components via CSS custom properties.\n */\n@Component({\n tag: 'af-section',\n styleUrl: 'af-section.css',\n shadow: false,\n scoped: true,\n})\nexport class AfSection {\n /** Padding variant */\n @Prop() padding: Padding = 'default';\n\n /** Theme - sets background color and provides theme context to children */\n @Prop() theme: Theme = 'white';\n \n /** Whether to include a Container wrapper */\n @Prop() container: boolean = true;\n\n render() {\n const content = <slot></slot>;\n \n return (\n <Host>\n <div class={`section padding-${this.padding} theme-${this.theme}`}>\n {this.container ? (\n <af-container>{content}</af-container>\n ) : content}\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,YAAY,GAAG,olgBAAolgB;;MCa5lgB,SAAS,GAAA,MAAA;AANtB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQU,QAAA,IAAO,CAAA,OAAA,GAAY,SAAS;;AAG5B,QAAA,IAAK,CAAA,KAAA,GAAU,OAAO;;AAGtB,QAAA,IAAS,CAAA,SAAA,GAAY,IAAI;AAelC;IAbC,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa;QAE7B,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAmB,gBAAA,EAAA,IAAI,CAAC,OAAO,CAAU,OAAA,EAAA,IAAI,CAAC,KAAK,CAAA,CAAE,EAAA,EAC9D,IAAI,CAAC,SAAS,IACb,CAAe,CAAA,cAAA,EAAA,IAAA,EAAA,OAAO,CAAgB,IACpC,OAAO,CACP,CACD;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"af-split-section.entry.esm.js","sources":["src/components/af-split-section/af-split-section.css?tag=af-split-section&encapsulation=scoped","src/components/af-split-section/af-split-section.tsx"],"sourcesContent":["/* Theme CSS custom properties are loaded globally from @affinda/css */\n\n:host {\n display: block;\n width: 100%;\n}\n\n.split-section {\n position: relative;\n width: 100%;\n /* Background is set via inline style with linear-gradient */\n}\n\n/* ==========================================================================\n Padding Variants\n ========================================================================== */\n\n.padding-none {\n padding: 0;\n}\n\n.padding-tight {\n padding: 48px 0;\n}\n\n.padding-default {\n padding: 96px 0;\n}\n\n.padding-loose {\n padding: 120px 0 96px;\n}\n\n/* ==========================================================================\n Mobile Adjustments\n ========================================================================== */\n\n/* mobile-only */\n@media (max-width: 768px) {\n .padding-tight {\n padding: 32px 0;\n }\n \n .padding-default {\n padding: 64px 0;\n }\n \n .padding-loose {\n padding: 80px 0 64px;\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\
|
|
1
|
+
{"version":3,"file":"af-split-section.entry.esm.js","sources":["src/components/af-split-section/af-split-section.css?tag=af-split-section&encapsulation=scoped","src/components/af-split-section/af-split-section.tsx"],"sourcesContent":["/* Theme CSS custom properties are loaded globally from @affinda/css */\n\n:host {\n display: block;\n width: 100%;\n}\n\n.split-section {\n position: relative;\n width: 100%;\n /* Background is set via inline style with linear-gradient */\n}\n\n/* ==========================================================================\n Padding Variants\n ========================================================================== */\n\n.padding-none {\n padding: 0;\n}\n\n.padding-tight {\n padding: 48px 0;\n}\n\n.padding-default {\n padding: 96px 0;\n}\n\n.padding-loose {\n padding: 120px 0 96px;\n}\n\n/* ==========================================================================\n Mobile Adjustments\n ========================================================================== */\n\n/* mobile-only */\n@media (max-width: 768px) {\n .padding-tight {\n padding: 32px 0;\n }\n \n .padding-default {\n padding: 64px 0;\n }\n \n .padding-loose {\n padding: 80px 0 64px;\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport type { Padding, Theme } from '../../types';\n\n// Map theme names to CSS color values\nconst themeColors: Record<Theme, string> = {\n 'white': 'var(--colour-brand-white, #FFFFFF)',\n 'inkwell': 'var(--colour-brand-inkwell, #14343B)',\n 'mist-green': 'var(--colour-brand-mist-green, #C6D5D1)',\n 'soft-clay': 'var(--colour-softclay-400, #c0ab8d)',\n 'white-ivory': 'var(--colour-brand-ivory-paper, #fff9ee)',\n};\n\n/**\n * Split Section component for layouts with two-tone backgrounds.\n * Creates a vertical split with different themes for top and bottom halves.\n * Useful for content that visually spans across two themed areas.\n * \n * Uses a CSS linear-gradient for the split background effect.\n */\n@Component({\n tag: 'af-split-section',\n styleUrl: 'af-split-section.css',\n shadow: false,\n scoped: true,\n})\nexport class AfSplitSection {\n /** Theme for the top half of the section */\n @Prop() topTheme: Theme = 'mist-green';\n\n /** Theme for the bottom half of the section */\n @Prop() bottomTheme: Theme = 'white';\n\n /** Padding variant */\n @Prop() padding: Padding = 'default';\n\n /** Whether to include a Container wrapper */\n @Prop() container: boolean = true;\n\n render() {\n const content = <slot></slot>;\n \n // Create the split background using CSS gradient\n const topColor = themeColors[this.topTheme];\n const bottomColor = themeColors[this.bottomTheme];\n const backgroundStyle = {\n background: `linear-gradient(to bottom, ${topColor} 0%, ${topColor} 50%, ${bottomColor} 50%, ${bottomColor} 100%)`\n };\n\n return (\n <Host>\n <div\n class={`split-section padding-${this.padding} top-theme-${this.topTheme}`}\n style={backgroundStyle}\n >\n {this.container ? (\n <af-container>{content}</af-container>\n ) : content}\n </div>\n </Host>\n );\n }\n}\n\n"],"names":[],"mappings":";;AAAA,MAAM,iBAAiB,GAAG,ofAAof;;ACG9gB;AACA,MAAM,WAAW,GAA0B;AACzC,IAAA,OAAO,EAAE,oCAAoC;AAC7C,IAAA,SAAS,EAAE,sCAAsC;AACjD,IAAA,YAAY,EAAE,yCAAyC;AACvD,IAAA,WAAW,EAAE,qCAAqC;AAClD,IAAA,aAAa,EAAE,0CAA0C;CAC1D;MAeY,cAAc,GAAA,MAAA;AAN3B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQU,QAAA,IAAQ,CAAA,QAAA,GAAU,YAAY;;AAG9B,QAAA,IAAW,CAAA,WAAA,GAAU,OAAO;;AAG5B,QAAA,IAAO,CAAA,OAAA,GAAY,SAAS;;AAG5B,QAAA,IAAS,CAAA,SAAA,GAAY,IAAI;AAyBlC;IAvBC,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa;;QAG7B,MAAM,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC3C,MAAM,WAAW,GAAG,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC;AACjD,QAAA,MAAM,eAAe,GAAG;YACtB,UAAU,EAAE,8BAA8B,QAAQ,CAAA,KAAA,EAAQ,QAAQ,CAAS,MAAA,EAAA,WAAW,CAAS,MAAA,EAAA,WAAW,CAAQ,MAAA;SACnH;AAED,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,CAAyB,sBAAA,EAAA,IAAI,CAAC,OAAO,CAAc,WAAA,EAAA,IAAI,CAAC,QAAQ,CAAE,CAAA,EACzE,KAAK,EAAE,eAAe,EAErB,EAAA,IAAI,CAAC,SAAS,IACb,wBAAe,OAAO,CAAgB,IACpC,OAAO,CACP,CACD;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"af-stack.entry.esm.js","sources":["src/components/af-stack/af-stack.css?tag=af-stack&encapsulation=shadow","src/components/af-stack/af-stack.tsx"],"sourcesContent":[":host {\n display: flex;\n box-sizing: border-box;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n","import { Component, h, Host, Prop } from '@stencil/core';\
|
|
1
|
+
{"version":3,"file":"af-stack.entry.esm.js","sources":["src/components/af-stack/af-stack.css?tag=af-stack&encapsulation=shadow","src/components/af-stack/af-stack.tsx"],"sourcesContent":[":host {\n display: flex;\n box-sizing: border-box;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport type { Gap } from '../../types';\n\ntype Direction = 'vertical' | 'horizontal';\ntype Align = 'start' | 'center' | 'end' | 'stretch' | 'baseline';\ntype Justify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';\n\n/**\n * Stack layout component for vertical or horizontal flex layouts with consistent gap spacing.\n * Uses design tokens for gap values.\n *\n * @slot - Content to stack\n */\n@Component({\n tag: 'af-stack',\n styleUrl: 'af-stack.css',\n shadow: true,\n})\nexport class AfStack {\n /**\n * Stack direction.\n * - 'vertical': Items stack top to bottom (flex-direction: column)\n * - 'horizontal': Items stack left to right (flex-direction: row)\n */\n @Prop() direction: Direction = 'vertical';\n\n /**\n * Gap between items using space tokens (1-8).\n * Maps to --space-1 through --space-8 (4px to 32px).\n */\n @Prop() gap: Gap = '4';\n\n /**\n * Align items on the cross axis.\n */\n @Prop() align: Align = 'stretch';\n\n /**\n * Justify content on the main axis.\n */\n @Prop() justify: Justify = 'start';\n\n /**\n * Whether items should wrap to the next line.\n */\n @Prop() wrap: boolean = false;\n\n render() {\n const alignMap: Record<Align, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n stretch: 'stretch',\n baseline: 'baseline',\n };\n\n const justifyMap: Record<Justify, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n between: 'space-between',\n around: 'space-around',\n evenly: 'space-evenly',\n };\n\n const style = {\n display: 'flex',\n flexDirection: this.direction === 'vertical' ? 'column' : 'row',\n gap: `var(--space-${this.gap})`,\n alignItems: alignMap[this.align],\n justifyContent: justifyMap[this.justify],\n flexWrap: this.wrap ? 'wrap' : 'nowrap',\n } as Record<string, string>;\n\n return (\n <Host style={style}>\n <slot></slot>\n </Host>\n );\n }\n}\n\n"],"names":[],"mappings":";;AAAA,MAAM,UAAU,GAAG,wEAAwE;;MCkB9E,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;;;AAIG;AACK,QAAA,IAAS,CAAA,SAAA,GAAc,UAAU;AAEzC;;;AAGG;AACK,QAAA,IAAG,CAAA,GAAA,GAAQ,GAAG;AAEtB;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAU,SAAS;AAEhC;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAY,OAAO;AAElC;;AAEG;AACK,QAAA,IAAI,CAAA,IAAA,GAAY,KAAK;AAmC9B;IAjCC,MAAM,GAAA;AACJ,QAAA,MAAM,QAAQ,GAA0B;AACtC,YAAA,KAAK,EAAE,YAAY;AACnB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,GAAG,EAAE,UAAU;AACf,YAAA,OAAO,EAAE,SAAS;AAClB,YAAA,QAAQ,EAAE,UAAU;SACrB;AAED,QAAA,MAAM,UAAU,GAA4B;AAC1C,YAAA,KAAK,EAAE,YAAY;AACnB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,GAAG,EAAE,UAAU;AACf,YAAA,OAAO,EAAE,eAAe;AACxB,YAAA,MAAM,EAAE,cAAc;AACtB,YAAA,MAAM,EAAE,cAAc;SACvB;AAED,QAAA,MAAM,KAAK,GAAG;AACZ,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,aAAa,EAAE,IAAI,CAAC,SAAS,KAAK,UAAU,GAAG,QAAQ,GAAG,KAAK;AAC/D,YAAA,GAAG,EAAE,CAAA,YAAA,EAAe,IAAI,CAAC,GAAG,CAAG,CAAA,CAAA;AAC/B,YAAA,UAAU,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;AAChC,YAAA,cAAc,EAAE,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC;YACxC,QAAQ,EAAE,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,QAAQ;SACd;QAE3B,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,KAAK,EAAA,EAChB,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"af-stat.entry.esm.js","sources":["src/components/af-stat/af-stat.css?tag=af-stat&encapsulation=shadow","src/components/af-stat/af-stat.tsx"],"sourcesContent":[":host {\n display: block;\n flex: 1 1 0;\n min-width: 0;\n /* Left accent border mirrors the website's stats-row styling. Reads\n the active border colour from whatever theme the ancestor sets. */\n border-left: 2px solid var(--af-background-border-active, var(--colour-brand-soft-clay, #b09670));\n padding-left: var(--space-4, 16px);\n}\n\n.stat {\n display: flex;\n flex-direction: column;\n gap: var(--space-2, 8px);\n min-height: 76px;\n justify-content: center;\n}\n\n/* Nudge the value towards the theme's secondary heading colour for that\n gold/ochre accent on light themes — matches af-testimonial-stat. */\n.stat__value {\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}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\n/**\n * Individual stat — a large value (e.g. \"1B+\") paired with a descriptive label.\n *\n * Intended as a slotted child of `af-stats-row`, but renders standalone too.\n * Colour is inherited from the ancestor theme context (`af-section` /\n * `af-card` / `af-theme-override`) via the `--af-typography-*` tokens that\n * `af-heading` and `af-text` already consume — no theme prop needed here.\n */\n@Component({\n tag: 'af-stat',\n styleUrl: 'af-stat.css',\n shadow: true,\n})\nexport class AfStat {\n /** The statistic headline value (e.g. \"1B+\", \"95%\", \"10+\"). */\n @Prop() value!: string;\n\n /** Description / caption rendered beneath the value. */\n @Prop() label!: string;\n\n render() {\n return (\n <Host>\n <div class=\"stat\">\n <af-heading level=\"2\" class=\"stat__value\">{this.value}</af-heading>\n <af-text variant=\"medium\" class=\"stat__label\">{this.label}</af-text>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,SAAS,GAAG,8bAA8b;;MCenc,MAAM,GAAA,MAAA;;;;IAOjB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,EAAA,EACf,CAAY,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,GAAG,EAAC,KAAK,EAAC,aAAa,EAAE,EAAA,IAAI,CAAC,KAAK,CAAc,EACnE,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAC,aAAa,EAAE,EAAA,IAAI,CAAC,KAAK,CAAW,CAChE,CACD;;;;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"af-stats-row.entry.esm.js","sources":["src/components/af-stats-row/af-stats-row.css?tag=af-stats-row&encapsulation=scoped","src/components/af-stats-row/af-stats-row.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n}\n\n.stats-row {\n display: flex;\n flex-wrap: wrap;\n gap: var(--space-6, 24px);\n align-items: stretch;\n}\n\n/* Ensure each stat claims an equal share of the row. Descendant (not\n child) combinator — see AGENTS.md \"Stencil scoped-slot `>` gotcha\". */\n.stats-row af-stat {\n flex: 1 1 calc(50% - var(--space-6, 24px));\n min-width: 0;\n}\n\n/* On wider viewports, prefer 4-up without wrapping when there's room. */\n@media (min-width: 768px) {\n .stats-row af-stat {\n flex: 1 1 0;\n }\n}\n\n/* Narrow: stack to a single column for readability. */\n@media (max-width: 480px) {\n .stats-row af-stat {\n flex: 1 1 100%;\n }\n}\n","import { Component, h, Host } from '@stencil/core';\n\n/**\n * Layout container for a horizontal row of `af-stat` children.\n *\n * Flex row that wraps to a grid on narrow viewports. Uses `scoped: true`\n * so slotted `<af-stat>` children stay in the light DOM and inherit the\n * ancestor theme (`af-section`) via the cascaded `.theme-*` class.\n *\n * Intentionally has **no `theme` prop** — a stats row is always flush\n * against its section background, so a local theme would fight the\n * ancestor. If you need a different background for the row, wrap it in\n * its own `af-section` or `af-theme-override`.\n *\n * @slot - `af-stat` elements (typically 3–4 for a balanced row).\n */\n@Component({\n tag: 'af-stats-row',\n styleUrl: 'af-stats-row.css',\n shadow: false,\n scoped: true,\n})\nexport class AfStatsRow {\n render() {\n return (\n <Host>\n <div class=\"stats-row\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,gbAAgb;;MCsBzb,UAAU,GAAA,MAAA;;;;IACrB,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EACpB,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"af-theme-override.entry.esm.js","sources":["src/components/af-theme-override/af-theme-override.css?tag=af-theme-override&encapsulation=scoped","src/components/af-theme-override/af-theme-override.tsx"],"sourcesContent":["/**\n * Theme Override Component Styles\n * \n * Sets theme CSS custom properties WITHOUT applying background color.\n * This allows overriding the theme context for child components while\n * maintaining the parent's visual background.\n */\n\n:host {\n display: contents;\n}\n\n.theme-override {\n display: contents;\n}\n\n/* ==========================================================================\n WHITE THEME\n ========================================================================== */\n\n.theme-white {\n /* Background tokens */\n --af-background-base: var(--colour-brand-white, #FFFFFF);\n --af-background-base-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-mistgreen-200, #e8eeed);\n --af-background-level-1-hover: var(--colour-mistgreen-300, #dde6e3);\n --af-background-border-subtle: var(--colour-mistgreen-200, #e8eeed);\n --af-background-border-default: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-heavy: var(--colour-mistgreen-500, #c6d5d1);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-200, #e8ebeb);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n INKWELL THEME (Dark)\n ========================================================================== */\n\n.theme-inkwell {\n /* Background tokens */\n --af-background-base: var(--colour-brand-inkwell, #14343b);\n --af-background-base-hover: var(--colour-inkwell-600, #102a2f);\n --af-background-contrast: var(--colour-inkwell-700, #102a2f);\n --af-background-level-1: var(--colour-inkwell-450, #203e45);\n --af-background-level-1-hover: var(--colour-inkwell-400, #2b484f);\n --af-background-border-subtle: var(--colour-inkwell-450, #203e45);\n --af-background-border-default: var(--colour-inkwell-400, #2b484f);\n --af-background-border-heavy: var(--colour-inkwell-700, #102a2f);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-white, #ffffff);\n --af-background-icon-accent: var(--colour-brand-ice, #a6fffb);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-mist-green, #c6d5d1);\n --af-typography-heading-secondary: var(--colour-brand-white, #ffffff);\n --af-typography-body-dark: var(--colour-brand-white, #ffffff);\n --af-typography-body-default: var(--colour-inkwell-100, #d0d6d8);\n --af-typography-body-subtle: var(--colour-inkwell-200, #a1aeb1);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-white, #ffffff);\n --af-button-secondary-icon: var(--colour-brand-white, #ffffff);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(255, 255, 255, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-white, #ffffff);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-white, #ffffff);\n --af-button-ghost-icon: var(--colour-brand-white, #ffffff);\n --af-button-ghost-stroke: var(--colour-brand-ice, #A6FFFB);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-inkwell-450, #203e45);\n --af-input-bg-hover: var(--colour-inkwell-400, #2b484f);\n --af-input-bg-disabled: var(--colour-inkwell-600, #102a2f);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--colour-brand-ice, #a6fffb);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--colour-brand-ice, #a6fffb);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-inkwell-450, #203e45);\n --af-form-control-bg-checked: var(--colour-brand-mist-green, #c6d5d1);\n --af-form-control-bg-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-bg-checked-disabled: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke: var(--colour-inkwell-350, #60767b);\n --af-form-control-stroke-hover: var(--colour-brand-white, #ffffff);\n --af-form-control-stroke-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-icon: var(--colour-brand-inkwell, #14343b);\n --af-form-control-label: var(--colour-brand-white, #ffffff);\n}\n\n/* ==========================================================================\n MIST-GREEN THEME\n ========================================================================== */\n\n.theme-mist-green {\n /* Background tokens */\n --af-background-base: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-base-hover: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-contrast: var(--colour-brand-soft-clay, #b09670);\n --af-background-level-1: var(--colour-mistgreen-300, #dde6e3);\n --af-background-level-1-hover: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-subtle: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-border-default: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-heavy: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-300, #dde6e3);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-600, #b2c0bc);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n SOFT-CLAY THEME\n ========================================================================== */\n\n.theme-soft-clay {\n /* Background tokens */\n --af-background-base: var(--colour-softclay-400, #c0ab8d);\n --af-background-base-hover: var(--colour-softclay-500, #b09670);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-softclay-500, #b09670);\n --af-background-level-1-hover: var(--colour-softclay-600, #9e8765);\n --af-background-border-subtle: var(--colour-softclay-600, #9e8765);\n --af-background-border-default: var(--colour-softclay-700, #8d785a);\n --af-background-border-heavy: var(--colour-brand-inkwell, #14343b);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-ivory-paper, #fff9ee);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-ivory-paper, #fff9ee);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-softclay-300, #d0c1a8);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-softclay-700, #8d785a);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-softclay-600, #9e8765);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n WHITE-IVORY THEME\n ========================================================================== */\n\n.theme-white-ivory {\n /* Background tokens */\n --af-background-base: var(--colour-brand-ivory-paper, #fff9ee);\n --af-background-base-hover: var(--colour-ivory-100, #fff5e0);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-ivory-200, #ffefcc);\n --af-background-level-1-hover: var(--colour-ivory-300, #ffe9b8);\n --af-background-border-subtle: var(--colour-ivory-200, #ffefcc);\n --af-background-border-default: var(--colour-ivory-400, #ffe3a3);\n --af-background-border-heavy: var(--colour-brand-soft-clay, #b09670);\n --af-background-border-active: var(--colour-brand-soft-clay, #b09670);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #b09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-ivory-100, #fff5e0);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-ivory-200, #ffefcc);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-ivory-400, #ffe3a3);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-ivory-300, #ffe9b8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Theme Override utility component.\n * Wraps content and applies an explicit theme, overriding any inherited theme\n * from parent containers like AfSection or AfCard.\n * \n * Unlike AfSection, this component does NOT apply a background color - \n * it only sets the CSS custom properties that child components consume.\n * \n * @slot - Content to be themed\n */\n@Component({\n tag: 'af-theme-override',\n styleUrl: 'af-theme-override.css',\n shadow: false,\n scoped: true,\n})\nexport class AfThemeOverride {\n /** \n * The theme to apply to child components.\n * Overrides any inherited theme from parent containers.\n */\n @Prop() theme: 'white' | 'inkwell' | 'mist-green' | 'soft-clay' | 'white-ivory' = 'white';\n\n render() {\n return (\n <Host>\n <div class={`theme-override theme-${this.theme}`}>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n\n"],"names":[],"mappings":";;AAAA,MAAM,kBAAkB,GAAG,8gfAA8gf;;MCkB5hf,eAAe,GAAA,MAAA;AAN5B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOE;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAqE,OAAO;AAW1F;IATC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAA,qBAAA,EAAwB,IAAI,CAAC,KAAK,EAAE,EAAA,EAC9C,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"af-theme-override.entry.esm.js","sources":["src/components/af-theme-override/af-theme-override.css?tag=af-theme-override&encapsulation=scoped","src/components/af-theme-override/af-theme-override.tsx"],"sourcesContent":["/**\n * Theme Override Component Styles\n * \n * Sets theme CSS custom properties WITHOUT applying background color.\n * This allows overriding the theme context for child components while\n * maintaining the parent's visual background.\n */\n\n:host {\n display: contents;\n}\n\n.theme-override {\n display: contents;\n}\n\n/* ==========================================================================\n WHITE THEME\n ========================================================================== */\n\n.theme-white {\n /* Background tokens */\n --af-background-base: var(--colour-brand-white, #FFFFFF);\n --af-background-base-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-mistgreen-200, #e8eeed);\n --af-background-level-1-hover: var(--colour-mistgreen-300, #dde6e3);\n --af-background-border-subtle: var(--colour-mistgreen-200, #e8eeed);\n --af-background-border-default: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-heavy: var(--colour-mistgreen-500, #c6d5d1);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-200, #e8ebeb);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-500, #d0d6d8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n INKWELL THEME (Dark)\n ========================================================================== */\n\n.theme-inkwell {\n /* Background tokens */\n --af-background-base: var(--colour-brand-inkwell, #14343b);\n --af-background-base-hover: var(--colour-inkwell-600, #102a2f);\n --af-background-contrast: var(--colour-inkwell-700, #102a2f);\n --af-background-level-1: var(--colour-inkwell-450, #203e45);\n --af-background-level-1-hover: var(--colour-inkwell-400, #2b484f);\n --af-background-border-subtle: var(--colour-inkwell-450, #203e45);\n --af-background-border-default: var(--colour-inkwell-400, #2b484f);\n --af-background-border-heavy: var(--colour-inkwell-700, #102a2f);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-white, #ffffff);\n --af-background-icon-accent: var(--colour-brand-ice, #a6fffb);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-mist-green, #c6d5d1);\n --af-typography-heading-secondary: var(--colour-brand-white, #ffffff);\n --af-typography-body-dark: var(--colour-brand-white, #ffffff);\n --af-typography-body-default: var(--colour-inkwell-100, #d0d6d8);\n --af-typography-body-subtle: var(--colour-inkwell-200, #a1aeb1);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-white, #ffffff);\n --af-button-secondary-icon: var(--colour-brand-white, #ffffff);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(255, 255, 255, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-white, #ffffff);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-white, #ffffff);\n --af-button-ghost-icon: var(--colour-brand-white, #ffffff);\n --af-button-ghost-stroke: var(--colour-brand-ice, #A6FFFB);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-inkwell-450, #203e45);\n --af-input-bg-hover: var(--colour-inkwell-400, #2b484f);\n --af-input-bg-disabled: var(--colour-inkwell-600, #102a2f);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--colour-brand-ice, #a6fffb);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--colour-brand-ice, #a6fffb);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-inkwell-450, #203e45);\n --af-form-control-bg-checked: var(--colour-brand-mist-green, #c6d5d1);\n --af-form-control-bg-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-bg-checked-disabled: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke: var(--colour-inkwell-350, #60767b);\n --af-form-control-stroke-hover: var(--colour-brand-white, #ffffff);\n --af-form-control-stroke-disabled: var(--colour-inkwell-400, #2b484f);\n --af-form-control-icon: var(--colour-brand-inkwell, #14343b);\n --af-form-control-label: var(--colour-brand-white, #ffffff);\n}\n\n/* ==========================================================================\n MIST-GREEN THEME\n ========================================================================== */\n\n.theme-mist-green {\n /* Background tokens */\n --af-background-base: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-base-hover: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-contrast: var(--colour-brand-soft-clay, #b09670);\n --af-background-level-1: var(--colour-mistgreen-300, #dde6e3);\n --af-background-level-1-hover: var(--colour-mistgreen-400, #d1ddda);\n --af-background-border-subtle: var(--colour-mistgreen-600, #b2c0bc);\n --af-background-border-default: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-heavy: var(--colour-mistgreen-700, #9eaaa7);\n --af-background-border-active: var(--colour-softclay-800, #8a7049);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #B09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-mistgreen-300, #dde6e3);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-mistgreen-700, #9eaaa7);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-mistgreen-600, #b2c0bc);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n SOFT-CLAY THEME\n ========================================================================== */\n\n.theme-soft-clay {\n /* Background tokens */\n --af-background-base: var(--colour-softclay-400, #c0ab8d);\n --af-background-base-hover: var(--colour-softclay-500, #b09670);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-softclay-500, #b09670);\n --af-background-level-1-hover: var(--colour-softclay-600, #9e8765);\n --af-background-border-subtle: var(--colour-softclay-600, #9e8765);\n --af-background-border-default: var(--colour-softclay-700, #8d785a);\n --af-background-border-heavy: var(--colour-brand-inkwell, #14343b);\n --af-background-border-active: var(--colour-brand-ice, #a6fffb);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-ivory-paper, #fff9ee);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-ivory-paper, #fff9ee);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-mistgreen-100, #f4f7f6);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-softclay-300, #d0c1a8);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-softclay-700, #8d785a);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-softclay-600, #9e8765);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n/* ==========================================================================\n WHITE-IVORY THEME\n ========================================================================== */\n\n.theme-white-ivory {\n /* Background tokens */\n --af-background-base: var(--colour-brand-ivory-paper, #fff9ee);\n --af-background-base-hover: var(--colour-ivory-100, #fff5e0);\n --af-background-contrast: var(--colour-brand-mist-green, #c6d5d1);\n --af-background-level-1: var(--colour-ivory-200, #ffefcc);\n --af-background-level-1-hover: var(--colour-ivory-300, #ffe9b8);\n --af-background-border-subtle: var(--colour-ivory-200, #ffefcc);\n --af-background-border-default: var(--colour-ivory-400, #ffe3a3);\n --af-background-border-heavy: var(--colour-brand-soft-clay, #b09670);\n --af-background-border-active: var(--colour-brand-soft-clay, #b09670);\n --af-background-icon-default: var(--colour-brand-inkwell, #14343b);\n --af-background-icon-accent: var(--colour-brand-soft-clay, #b09670);\n \n /* Typography tokens */\n --af-typography-heading-primary: var(--colour-brand-inkwell, #14343b);\n --af-typography-heading-secondary: var(--colour-brand-soft-clay, #b09670);\n --af-typography-body-dark: var(--colour-brand-inkwell, #14343b);\n --af-typography-body-default: var(--colour-inkwell-400, #2b484f);\n --af-typography-body-subtle: var(--colour-inkwell-350, #60767b);\n \n /* Button - Primary */\n --af-button-primary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-primary-bg: var(--colour-brand-ice, #a6fffb);\n --af-button-primary-bg-hover: var(--colour-ice-600, #95e6e2);\n --af-button-primary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Secondary */\n --af-button-secondary-text: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-secondary-bg: transparent;\n --af-button-secondary-bg-hover: rgba(0, 0, 0, 0.08);\n --af-button-secondary-stroke: var(--colour-brand-inkwell, #14343b);\n \n /* Button - Tertiary */\n --af-button-ghost-text: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-icon: var(--colour-brand-inkwell, #14343b);\n --af-button-ghost-stroke: var(--colour-brand-soft-clay, #b09670);\n \n /* Input tokens */\n --af-input-label: var(--af-typography-body-dark);\n --af-input-description: var(--af-typography-body-default);\n --af-input-text: var(--af-typography-body-dark);\n --af-input-placeholder: var(--af-typography-body-subtle);\n --af-input-icon: var(--af-background-icon-default);\n --af-input-bg: var(--colour-brand-white, #ffffff);\n --af-input-bg-hover: var(--colour-ivory-100, #fff5e0);\n --af-input-bg-disabled: var(--af-background-level-1);\n --af-input-border: var(--af-background-border-default);\n --af-input-border-hover: var(--af-background-border-heavy);\n --af-input-border-active: var(--af-typography-body-dark);\n --af-input-border-error: var(--colour-error, #be292a);\n --af-input-error: var(--colour-error, #be292a);\n --af-input-focus-ring: var(--af-typography-body-dark);\n \n /* Form control tokens (checkbox, radio, switch) */\n --af-form-control-bg: var(--colour-brand-white, #ffffff);\n --af-form-control-bg-checked: var(--colour-brand-inkwell, #14343b);\n --af-form-control-bg-disabled: var(--colour-ivory-200, #ffefcc);\n --af-form-control-bg-checked-disabled: var(--colour-inkwell-350, #708380);\n --af-form-control-stroke: var(--colour-ivory-400, #ffe3a3);\n --af-form-control-stroke-hover: var(--colour-brand-inkwell, #14343b);\n --af-form-control-stroke-disabled: var(--colour-ivory-300, #ffe9b8);\n --af-form-control-icon: var(--colour-brand-white, #ffffff);\n --af-form-control-label: var(--colour-brand-inkwell, #14343b);\n}\n\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport type { Theme } from '../../types';\n\n/**\n * Theme Override utility component.\n * Wraps content and applies an explicit theme, overriding any inherited theme\n * from parent containers like AfSection or AfCard.\n * \n * Unlike AfSection, this component does NOT apply a background color - \n * it only sets the CSS custom properties that child components consume.\n * \n * @slot - Content to be themed\n */\n@Component({\n tag: 'af-theme-override',\n styleUrl: 'af-theme-override.css',\n shadow: false,\n scoped: true,\n})\nexport class AfThemeOverride {\n /** \n * The theme to apply to child components.\n * Overrides any inherited theme from parent containers.\n */\n @Prop() theme: Theme = 'white';\n\n render() {\n return (\n <Host>\n <div class={`theme-override theme-${this.theme}`}>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n\n"],"names":[],"mappings":";;AAAA,MAAM,kBAAkB,GAAG,8gfAA8gf;;MCmB5hf,eAAe,GAAA,MAAA;AAN5B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOE;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAU,OAAO;AAW/B;IATC,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAA,qBAAA,EAAwB,IAAI,CAAC,KAAK,EAAE,EAAA,EAC9C,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"af-typography-lockup.entry.esm.js","sources":["src/components/af-typography-lockup/af-typography-lockup.css?tag=af-typography-lockup&encapsulation=shadow","src/components/af-typography-lockup/af-typography-lockup.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.lockup {\n display: flex;\n flex-direction: column;\n}\n\n/* Lockup gap variations (between copy and buttons) - matches copy internal gap */\n/* Heading 1 desktop: 24px gap */\n.breakpoint-desktop.heading-1.lockup {\n gap: var(--space-6, 24px);\n}\n\n/* Heading 1 mobile: 20px gap */\n.breakpoint-mobile.heading-1.lockup {\n gap: var(--space-5, 20px);\n}\n\n/* Heading 2, 3 desktop: 16px gap */\n.breakpoint-desktop.heading-2.lockup,\n.breakpoint-desktop.heading-3.lockup {\n gap: var(--space-4, 16px);\n}\n\n/* Heading 2 mobile: 16px gap */\n.breakpoint-mobile.heading-2.lockup {\n gap: var(--space-4, 16px);\n}\n\n/* Heading 3 mobile, 4 desktop, 5 desktop: 12px gap */\n.breakpoint-mobile.heading-3.lockup,\n.breakpoint-desktop.heading-4.lockup,\n.breakpoint-desktop.heading-5.lockup {\n gap: var(--space-3, 12px);\n}\n\n/* Heading 4 mobile, 5 mobile: 8px gap */\n.breakpoint-mobile.heading-4.lockup,\n.breakpoint-mobile.heading-5.lockup {\n gap: var(--space-2, 8px);\n}\n\n/* Container alignment (affects flexbox positioning) */\n.text-left {\n align-items: flex-start;\n}\n\n.text-center {\n align-items: center;\n}\n\n.text-right {\n align-items: flex-end;\n}\n\n.text-justify {\n align-items: stretch;\n}\n\n/* Individual text alignment classes */\n.align-left {\n text-align: left;\n --af-text-align: left;\n}\n\n.align-center {\n text-align: center;\n --af-text-align: center;\n}\n\n.align-right {\n text-align: right;\n --af-text-align: right;\n}\n\n.align-justify {\n text-align: justify;\n --af-text-align: justify;\n}\n\n/* Copy section - base styles */\n.copy {\n display: flex;\n flex-direction: column;\n width: 100%;\n max-width: 840px;\n}\n\n/* Copy gap variations based on heading size and breakpoint */\n/* Heading 1 desktop: 24px gap */\n.breakpoint-desktop.heading-1 .copy {\n gap: var(--space-6, 24px);\n}\n\n/* Heading 1 mobile: 20px gap */\n.breakpoint-mobile.heading-1 .copy {\n gap: var(--space-5, 20px);\n}\n\n/* Heading 2, 3 desktop: 16px gap */\n.breakpoint-desktop.heading-2 .copy,\n.breakpoint-desktop.heading-3 .copy {\n gap: var(--space-4, 16px);\n}\n\n/* Heading 2 mobile: 16px gap */\n.breakpoint-mobile.heading-2 .copy {\n gap: var(--space-4, 16px);\n}\n\n/* Heading 3 mobile, 4 desktop, 5 desktop: 12px gap */\n.breakpoint-mobile.heading-3 .copy,\n.breakpoint-desktop.heading-4 .copy,\n.breakpoint-desktop.heading-5 .copy {\n gap: var(--space-3, 12px);\n}\n\n/* Heading 4 mobile, 5 mobile: 8px gap */\n.breakpoint-mobile.heading-4 .copy,\n.breakpoint-mobile.heading-5 .copy {\n gap: var(--space-2, 8px);\n}\n\n/* Heading styles - font-weight 400 (regular) matches Webflow's NeuSans usage.\n * display: flex collapses any whitespace-only text nodes that Astro (and\n * other templating engines) leave between the slotted heading and the\n * following named-slot siblings — those stray text nodes get projected into\n * the default slot and, without flex layout, each one occupies a full line\n * of the heading's line-height (user-visible \"extra line break\" after the\n * heading). */\n.heading {\n display: flex;\n flex-direction: column;\n font-family: var(--typography-headingfont, 'NeuSans', sans-serif);\n font-weight: var(--font-weight-regular, 400);\n color: var(--af-typography-heading-primary, var(--colour-typography-heading-primary, #14343B));\n line-height: var(--line-height-heading-tight, 1);\n letter-spacing: var(--letter-spacing-heading, -0.02em);\n white-space: normal;\n}\n\n/* Desktop heading sizes */\n.breakpoint-desktop.heading-1 .heading {\n font-size: var(--font-size-heading-1-desktop, 56px);\n}\n\n.breakpoint-desktop.heading-2 .heading {\n font-size: var(--font-size-heading-2-desktop, 44px);\n}\n\n.breakpoint-desktop.heading-3 .heading {\n font-size: var(--font-size-heading-3-desktop, 34px);\n}\n\n.breakpoint-desktop.heading-4 .heading {\n font-size: var(--font-size-heading-4-desktop, 24px);\n line-height: var(--line-height-heading-relaxed, 1.2);\n}\n\n.breakpoint-desktop.heading-5 .heading {\n font-size: var(--font-size-heading-5-desktop, 20px);\n line-height: var(--line-height-heading-relaxed, 1.2);\n}\n\n/* Mobile heading sizes */\n.breakpoint-mobile.heading-1 .heading {\n font-size: var(--font-size-heading-1-mobile, 38px);\n}\n\n.breakpoint-mobile.heading-2 .heading {\n font-size: var(--font-size-heading-2-mobile, 32px);\n}\n\n.breakpoint-mobile.heading-3 .heading {\n font-size: var(--font-size-heading-3-mobile, 25px);\n}\n\n.breakpoint-mobile.heading-4 .heading {\n font-size: var(--font-size-heading-4-mobile, 20px);\n line-height: var(--line-height-heading-normal, 1.1);\n}\n\n.breakpoint-mobile.heading-5 .heading {\n font-size: var(--font-size-heading-5-mobile, 18px);\n line-height: var(--line-height-heading-normal, 1.1);\n}\n\n/* Description/body text - default (body/large) */\n.description {\n font-family: var(--typography-bodyfont, 'NeuSans', sans-serif);\n font-size: var(--font-size-body-large, 18px);\n font-weight: var(--font-weight-regular, 400);\n line-height: var(--line-height-body-large, 26px);\n color: var(--af-typography-body-default, var(--colour-typography-body-default, #2B484F));\n white-space: normal;\n}\n\n/* Heading colour variants — matches Webflow's h1.primary / h1.secondary pattern */\n.heading.heading-color-primary {\n color: var(--af-typography-heading-primary, var(--colour-typography-heading-primary, #14343B));\n}\n\n.heading.heading-color-secondary {\n color: var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #B09670));\n}\n\n/* Description colour variants */\n.description.description-color-default {\n color: var(--af-typography-body-default, var(--colour-typography-body-default, #2B484F));\n}\n\n.description.description-color-secondary {\n color: var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #B09670));\n}\n\n/* Description text size variations - smaller for heading 3 mobile, 4, and 5 */\n.breakpoint-mobile.heading-3 .description,\n.breakpoint-desktop.heading-4 .description,\n.breakpoint-mobile.heading-4 .description,\n.breakpoint-desktop.heading-5 .description,\n.breakpoint-mobile.heading-5 .description {\n font-size: var(--font-size-body-medium, 16px);\n line-height: var(--line-height-body-medium, 24px);\n}\n\n.description:empty {\n display: none;\n}\n\n/* Buttons section */\n.buttons {\n display: flex;\n flex-direction: row;\n gap: var(--space-3, 12px);\n}\n\n.buttons:empty {\n display: none;\n}\n\n/* Button layout - horizontal (inline with copy) */\n.layout-horizontal .buttons {\n align-items: center;\n}\n\n.text-left.layout-horizontal {\n flex-direction: row;\n align-items: center;\n gap: var(--space-4, 16px);\n}\n\n.text-left.layout-horizontal .copy {\n flex: 1 0 0;\n max-width: 950px;\n}\n\n/* Heading 3, 4 horizontal: different max-width */\n.text-left.layout-horizontal.heading-3 .copy,\n.text-left.layout-horizontal.heading-4 .copy {\n max-width: 840px;\n}\n\n.text-left.layout-horizontal .buttons {\n flex-shrink: 0;\n}\n\n/* Button layout - vertical (stacked below copy) */\n.layout-vertical .buttons {\n align-items: flex-start;\n}\n\n/* Button position alignment */\n.buttons.align-left {\n justify-content: flex-start;\n}\n\n.buttons.align-center {\n justify-content: center;\n}\n\n.buttons.align-right {\n justify-content: flex-end;\n}\n\n.buttons.align-justify {\n justify-content: space-between;\n}\n\n/* Mobile button stacking - buttons stack vertically on mobile */\n.breakpoint-mobile .buttons {\n flex-direction: column;\n align-items: stretch;\n}\n\n.breakpoint-mobile .buttons.align-center {\n align-items: center;\n}\n\n.breakpoint-mobile .buttons.align-right {\n align-items: flex-end;\n}\n\n.breakpoint-mobile .buttons.align-left {\n align-items: flex-start;\n}\n\n/* Max width constraints for centered layouts */\n.text-center .copy {\n max-width: 840px;\n}\n\n/* Slot content styling */\n::slotted(*) {\n margin: 0;\n}\n","import { Component, Element, h, Prop, State, Host } from '@stencil/core';\n\ntype TextAlign = 'left' | 'center' | 'right' | 'justify';\n\n/**\n * Marketing-style composition of heading + description + buttons with\n * consistent spacing and alignment driven by the `headingSize` prop.\n *\n * **Semantic vs visual:** `headingSize` controls ONLY the visual scale\n * (the lockup sets font-size via a `heading-{1..5}` class). The semantic\n * level (h1-h6) is whatever the consumer slots in as default content.\n * Keep them aligned by convention so assistive tech and search engines\n * see the right hierarchy:\n *\n * headingSize=1 ↔ <h1> (or <h2> on non-top-of-page sections)\n * headingSize=2 ↔ <h2>\n * headingSize=3 ↔ <h3>\n * headingSize=4 ↔ <h4>\n * headingSize=5 ↔ <h5>\n *\n * When a design asks for a visually small H1 or a visually large H3,\n * pass the two independently — just do it deliberately, not by\n * accident. A console warning fires in dev mode if the slotted tag is\n * more than one level away from the prop.\n */\n@Component({\n tag: 'af-typography-lockup',\n styleUrl: 'af-typography-lockup.css',\n shadow: true\n})\nexport class AfTypographyLockup {\n @Element() el!: HTMLElement;\n\n /**\n * The heading size (1-5, where 1 is largest). Controls visual scale\n * only — pair with a matching <h1>-<h5> slotted element for correct\n * document outline (see component docblock).\n */\n @Prop() headingSize: 1 | 2 | 3 | 4 | 5 = 2;\n\n /**\n * The breakpoint for responsive typography\n */\n @Prop() breakpoint: 'desktop' | 'mobile' = 'desktop';\n\n /**\n * Text alignment for the entire lockup (heading and description).\n * Can be overridden individually with headingAlignment and descriptionAlignment.\n */\n @Prop() textAlignment: TextAlign = 'left';\n\n /**\n * Heading text alignment. Falls back to textAlignment if not specified.\n */\n @Prop() headingAlignment?: TextAlign;\n\n /**\n * Description text alignment. Falls back to textAlignment if not specified.\n */\n @Prop() descriptionAlignment?: TextAlign;\n\n /**\n * Button layout direction (horizontal or vertical stacking)\n */\n @Prop() buttonLayout: 'horizontal' | 'vertical' = 'vertical';\n\n /**\n * Buttons position alignment. Falls back to textAlignment if not specified.\n */\n @Prop() buttonsAlignment?: TextAlign;\n\n /**\n * Maximum width for the copy section (in pixels)\n */\n @Prop() maxWidth?: number;\n\n /**\n * Heading colour variant. Matches the Webflow pattern of `h1.primary` vs\n * `h1.secondary`, where \"secondary\" renders in the theme's accent/heading-\n * secondary colour (soft-clay on most themes).\n * - `primary` (default) - uses `--af-typography-heading-primary`\n * - `secondary` - uses `--af-typography-heading-secondary`\n */\n @Prop() headingColor: 'primary' | 'secondary' = 'primary';\n\n /**\n * Description colour variant. Same pattern as `headingColor`; useful for\n * hero-style lockups where the description is rendered in the accent colour.\n * - `default` (default) - uses `--af-typography-body-default`\n * - `secondary` - uses `--af-typography-heading-secondary`\n */\n @Prop() descriptionColor: 'default' | 'secondary' = 'default';\n\n /**\n * Whether the consumer passed anything into the description / buttons\n * slots. The CSS `:empty` selector can't help here — the `<slot>`\n * element itself counts as a child, so the wrapper divs would always\n * render as empty-but-visible lines of gap. Tracked on mount and on\n * any `slotchange` so wrappers collapse cleanly when there's nothing\n * to show.\n */\n @State() hasDescription: boolean = false;\n @State() hasButtons: boolean = false;\n\n private descriptionSlot?: HTMLSlotElement;\n private buttonsSlot?: HTMLSlotElement;\n\n componentDidLoad() {\n this.syncSlotState();\n this.descriptionSlot?.addEventListener('slotchange', this.syncSlotState);\n this.buttonsSlot?.addEventListener('slotchange', this.syncSlotState);\n // Dev-time check that the slotted semantic tag (h1-h6) is within one\n // level of the visual headingSize. Pairs with the class-level docblock;\n // silent in production unless the author explicitly turned on dev mode\n // via `window.__AF_STRICT_HEADINGS__`.\n if (typeof window === 'undefined') return;\n const strict = (window as unknown as { __AF_STRICT_HEADINGS__?: boolean })\n .__AF_STRICT_HEADINGS__;\n if (!strict) return;\n const heading = Array.from(this.el.children).find(\n (child) => !(child as HTMLElement).hasAttribute('slot') && /^h[1-6]$/i.test(child.tagName),\n );\n if (!heading) return;\n const slottedLevel = Number(heading.tagName.slice(1));\n const expected = this.headingSize;\n if (Math.abs(slottedLevel - expected) > 1) {\n // eslint-disable-next-line no-console\n console.warn(\n `[af-typography-lockup] heading-size=${expected} paired with <${heading.tagName.toLowerCase()}>; ` +\n `expected an <h${expected}> for document outline. Pass deliberately or align the two.`,\n );\n }\n }\n\n disconnectedCallback() {\n this.descriptionSlot?.removeEventListener('slotchange', this.syncSlotState);\n this.buttonsSlot?.removeEventListener('slotchange', this.syncSlotState);\n }\n\n private syncSlotState = () => {\n this.hasDescription = (this.descriptionSlot?.assignedNodes({ flatten: true }).length ?? 0) > 0;\n this.hasButtons = (this.buttonsSlot?.assignedNodes({ flatten: true }).length ?? 0) > 0;\n };\n\n render() {\n const effectiveHeadingAlignment = this.headingAlignment ?? this.textAlignment;\n const effectiveDescriptionAlignment = this.descriptionAlignment ?? this.textAlignment;\n const effectiveButtonsAlignment = this.buttonsAlignment ?? this.textAlignment;\n\n const containerClasses = {\n 'lockup': true,\n [`text-${this.textAlignment}`]: true,\n [`layout-${this.buttonLayout}`]: true,\n [`heading-${this.headingSize}`]: true,\n [`breakpoint-${this.breakpoint}`]: true\n };\n\n const headingClasses = {\n 'heading': true,\n [`align-${effectiveHeadingAlignment}`]: true,\n [`heading-color-${this.headingColor}`]: true\n };\n\n const descriptionClasses = {\n 'description': true,\n [`align-${effectiveDescriptionAlignment}`]: true,\n [`description-color-${this.descriptionColor}`]: true\n };\n\n const buttonsClasses = {\n 'buttons': true,\n [`align-${effectiveButtonsAlignment}`]: true\n };\n\n const copyStyle = this.maxWidth ? { maxWidth: `${this.maxWidth}px` } : {};\n\n return (\n <Host>\n <div class={containerClasses}>\n <div class=\"copy\" style={copyStyle}>\n <div class={headingClasses} part=\"heading\">\n <slot></slot>\n </div>\n <div class={descriptionClasses} part=\"body\" hidden={!this.hasDescription}>\n <slot name=\"description\" ref={(el) => (this.descriptionSlot = el as HTMLSlotElement)}></slot>\n </div>\n </div>\n <div class={buttonsClasses} part=\"buttons\" hidden={!this.hasButtons}>\n <slot name=\"buttons\" ref={(el) => (this.buttonsSlot = el as HTMLSlotElement)}></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"af-typography-lockup.entry.esm.js","sources":["src/components/af-typography-lockup/af-typography-lockup.css?tag=af-typography-lockup&encapsulation=shadow","src/components/af-typography-lockup/af-typography-lockup.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.lockup {\n display: flex;\n flex-direction: column;\n}\n\n/* Lockup gap variations (between copy and buttons) - matches copy internal gap */\n/* Heading 1 desktop: 24px gap */\n.breakpoint-desktop.heading-1.lockup {\n gap: var(--space-6, 24px);\n}\n\n/* Heading 1 mobile: 20px gap */\n.breakpoint-mobile.heading-1.lockup {\n gap: var(--space-5, 20px);\n}\n\n/* Heading 2, 3 desktop: 16px gap */\n.breakpoint-desktop.heading-2.lockup,\n.breakpoint-desktop.heading-3.lockup {\n gap: var(--space-4, 16px);\n}\n\n/* Heading 2 mobile: 16px gap */\n.breakpoint-mobile.heading-2.lockup {\n gap: var(--space-4, 16px);\n}\n\n/* Heading 3 mobile, 4 desktop, 5 desktop, card desktop: 12px gap */\n.breakpoint-mobile.heading-3.lockup,\n.breakpoint-desktop.heading-4.lockup,\n.breakpoint-desktop.heading-5.lockup,\n.breakpoint-desktop.heading-card.lockup {\n gap: var(--space-3, 12px);\n}\n\n/* Heading 4 mobile, 5 mobile, card mobile: 8px gap */\n.breakpoint-mobile.heading-4.lockup,\n.breakpoint-mobile.heading-5.lockup,\n.breakpoint-mobile.heading-card.lockup {\n gap: var(--space-2, 8px);\n}\n\n/* Container alignment (affects flexbox positioning) */\n.text-left {\n align-items: flex-start;\n}\n\n.text-center {\n align-items: center;\n}\n\n.text-right {\n align-items: flex-end;\n}\n\n.text-justify {\n align-items: stretch;\n}\n\n/* Individual text alignment classes */\n.align-left {\n text-align: left;\n --af-text-align: left;\n}\n\n.align-center {\n text-align: center;\n --af-text-align: center;\n}\n\n.align-right {\n text-align: right;\n --af-text-align: right;\n}\n\n.align-justify {\n text-align: justify;\n --af-text-align: justify;\n}\n\n/* Copy section - base styles */\n.copy {\n display: flex;\n flex-direction: column;\n width: 100%;\n max-width: 840px;\n}\n\n/* Copy gap variations based on heading size and breakpoint */\n/* Heading 1 desktop: 24px gap */\n.breakpoint-desktop.heading-1 .copy {\n gap: var(--space-6, 24px);\n}\n\n/* Heading 1 mobile: 20px gap */\n.breakpoint-mobile.heading-1 .copy {\n gap: var(--space-5, 20px);\n}\n\n/* Heading 2, 3 desktop: 16px gap */\n.breakpoint-desktop.heading-2 .copy,\n.breakpoint-desktop.heading-3 .copy {\n gap: var(--space-4, 16px);\n}\n\n/* Heading 2 mobile: 16px gap */\n.breakpoint-mobile.heading-2 .copy {\n gap: var(--space-4, 16px);\n}\n\n/* Heading 3 mobile, 4 desktop, 5 desktop, card desktop: 12px gap */\n.breakpoint-mobile.heading-3 .copy,\n.breakpoint-desktop.heading-4 .copy,\n.breakpoint-desktop.heading-5 .copy,\n.breakpoint-desktop.heading-card .copy {\n gap: var(--space-3, 12px);\n}\n\n/* Heading 4 mobile, 5 mobile, card mobile: 8px gap */\n.breakpoint-mobile.heading-4 .copy,\n.breakpoint-mobile.heading-5 .copy,\n.breakpoint-mobile.heading-card .copy {\n gap: var(--space-2, 8px);\n}\n\n/* Heading styles - font-weight 400 (regular) matches Webflow's NeuSans usage.\n * display: flex collapses any whitespace-only text nodes that Astro (and\n * other templating engines) leave between the slotted heading and the\n * following named-slot siblings — those stray text nodes get projected into\n * the default slot and, without flex layout, each one occupies a full line\n * of the heading's line-height (user-visible \"extra line break\" after the\n * heading). */\n.heading {\n display: flex;\n flex-direction: column;\n font-family: var(--typography-headingfont, 'NeuSans', sans-serif);\n font-weight: var(--font-weight-regular, 400);\n color: var(--af-typography-heading-primary, var(--colour-typography-heading-primary, #14343B));\n line-height: var(--line-height-heading-tight, 1);\n letter-spacing: var(--letter-spacing-heading, -0.02em);\n white-space: normal;\n}\n\n/* Desktop heading sizes */\n.breakpoint-desktop.heading-1 .heading {\n font-size: var(--font-size-heading-1-desktop, 56px);\n}\n\n.breakpoint-desktop.heading-2 .heading {\n font-size: var(--font-size-heading-2-desktop, 44px);\n}\n\n/* Explicit px line-heights (38/30/24) for heading 3/4/5 replace the\n * previous ratio-based values (1.1/1.2) — renders identically within a\n * pixel but exposes a predictable token consumers can reference directly. */\n.breakpoint-desktop.heading-3 .heading {\n font-size: var(--font-size-heading-3-desktop, 34px);\n line-height: var(--line-height-heading-3, 38px);\n}\n\n.breakpoint-desktop.heading-4 .heading {\n font-size: var(--font-size-heading-4-desktop, 24px);\n line-height: var(--line-height-heading-4, 30px);\n}\n\n.breakpoint-desktop.heading-5 .heading {\n font-size: var(--font-size-heading-5-desktop, 20px);\n line-height: var(--line-height-heading-5, 24px);\n}\n\n/* Card-title scale (22/20px): retires the bespoke heading sizes on\n * diff-card h3, NumberedStepper title, and expert-insights related-card h3\n * on the website. Sits between heading-4 (24px) and heading-5 (20px) at\n * desktop, and between heading-4 and heading-5 (both 20px→18px) at mobile. */\n.breakpoint-desktop.heading-card .heading {\n font-size: var(--font-size-heading-card-desktop, 22px);\n line-height: var(--line-height-heading-card, 28px);\n}\n\n/* Mobile heading sizes */\n.breakpoint-mobile.heading-1 .heading {\n font-size: var(--font-size-heading-1-mobile, 38px);\n}\n\n.breakpoint-mobile.heading-2 .heading {\n font-size: var(--font-size-heading-2-mobile, 32px);\n}\n\n.breakpoint-mobile.heading-3 .heading {\n font-size: var(--font-size-heading-3-mobile, 25px);\n}\n\n.breakpoint-mobile.heading-4 .heading {\n font-size: var(--font-size-heading-4-mobile, 20px);\n line-height: var(--line-height-heading-normal, 1.1);\n}\n\n.breakpoint-mobile.heading-5 .heading {\n font-size: var(--font-size-heading-5-mobile, 18px);\n line-height: var(--line-height-heading-normal, 1.1);\n}\n\n.breakpoint-mobile.heading-card .heading {\n font-size: var(--font-size-heading-card-mobile, 20px);\n line-height: var(--line-height-heading-card, 28px);\n}\n\n/* Description/body text - default (body/large) */\n.description {\n font-family: var(--typography-bodyfont, 'NeuSans', sans-serif);\n font-size: var(--font-size-body-large, 18px);\n font-weight: var(--font-weight-regular, 400);\n line-height: var(--line-height-body-large, 26px);\n color: var(--af-typography-body-default, var(--colour-typography-body-default, #2B484F));\n white-space: normal;\n}\n\n/* Heading colour variants — matches Webflow's h1.primary / h1.secondary pattern */\n.heading.heading-color-primary {\n color: var(--af-typography-heading-primary, var(--colour-typography-heading-primary, #14343B));\n}\n\n.heading.heading-color-secondary {\n color: var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #B09670));\n}\n\n/* Description colour variants */\n.description.description-color-default {\n color: var(--af-typography-body-default, var(--colour-typography-body-default, #2B484F));\n}\n\n.description.description-color-secondary {\n color: var(--af-typography-heading-secondary, var(--colour-brand-soft-clay, #B09670));\n}\n\n/* Description text size variations - smaller for heading 3 mobile, 4, 5, and card */\n.breakpoint-mobile.heading-3 .description,\n.breakpoint-desktop.heading-4 .description,\n.breakpoint-mobile.heading-4 .description,\n.breakpoint-desktop.heading-5 .description,\n.breakpoint-mobile.heading-5 .description,\n.breakpoint-desktop.heading-card .description,\n.breakpoint-mobile.heading-card .description {\n font-size: var(--font-size-body-medium, 16px);\n line-height: var(--line-height-body-medium, 24px);\n}\n\n.description:empty {\n display: none;\n}\n\n/* Buttons section */\n.buttons {\n display: flex;\n flex-direction: row;\n gap: var(--space-3, 12px);\n}\n\n.buttons:empty {\n display: none;\n}\n\n/* Button layout - horizontal (inline with copy) */\n.layout-horizontal .buttons {\n align-items: center;\n}\n\n.text-left.layout-horizontal {\n flex-direction: row;\n align-items: center;\n gap: var(--space-4, 16px);\n}\n\n.text-left.layout-horizontal .copy {\n flex: 1 0 0;\n max-width: 950px;\n}\n\n/* Heading 3, 4 horizontal: different max-width */\n.text-left.layout-horizontal.heading-3 .copy,\n.text-left.layout-horizontal.heading-4 .copy {\n max-width: 840px;\n}\n\n.text-left.layout-horizontal .buttons {\n flex-shrink: 0;\n}\n\n/* Button layout - vertical (stacked below copy) */\n.layout-vertical .buttons {\n align-items: flex-start;\n}\n\n/* Button position alignment */\n.buttons.align-left {\n justify-content: flex-start;\n}\n\n.buttons.align-center {\n justify-content: center;\n}\n\n.buttons.align-right {\n justify-content: flex-end;\n}\n\n.buttons.align-justify {\n justify-content: space-between;\n}\n\n/* Mobile button stacking - buttons stack vertically on mobile */\n.breakpoint-mobile .buttons {\n flex-direction: column;\n align-items: stretch;\n}\n\n.breakpoint-mobile .buttons.align-center {\n align-items: center;\n}\n\n.breakpoint-mobile .buttons.align-right {\n align-items: flex-end;\n}\n\n.breakpoint-mobile .buttons.align-left {\n align-items: flex-start;\n}\n\n/* Max width constraints for centered layouts */\n.text-center .copy {\n max-width: 840px;\n}\n\n/* Slot content styling */\n::slotted(*) {\n margin: 0;\n}\n","import { Component, Element, h, Prop, State, Host } from '@stencil/core';\nimport type { HeadingSize } from '../../types';\n\ntype TextAlign = 'left' | 'center' | 'right' | 'justify';\n\n/**\n * Marketing-style composition of heading + description + buttons with\n * consistent spacing and alignment driven by the `headingSize` prop.\n *\n * **Semantic vs visual:** `headingSize` controls ONLY the visual scale\n * (the lockup sets font-size via a `heading-{1..5|card}` class). The semantic\n * level (h1-h6) is whatever the consumer slots in as default content.\n * Keep them aligned by convention so assistive tech and search engines\n * see the right hierarchy:\n *\n * headingSize=1 ↔ <h1> (or <h2> on non-top-of-page sections)\n * headingSize=2 ↔ <h2>\n * headingSize=3 ↔ <h3>\n * headingSize=4 ↔ <h4>\n * headingSize=5 ↔ <h5>\n * headingSize=\"card\" ↔ <h3> (card-title scale: 22/20px)\n *\n * When a design asks for a visually small H1 or a visually large H3,\n * pass the two independently — just do it deliberately, not by\n * accident. A console warning fires in dev mode if the slotted tag is\n * more than one level away from the prop.\n *\n * The `card` variant renders slightly larger than `5` (22/20px vs 20/18px)\n * and targets card titles in dense grids (diff-card h3, NumberedStepper\n * title, expert-insights related-card h3 on the marketing site). It sits\n * between `4` and `5` in the type ladder.\n */\n@Component({\n tag: 'af-typography-lockup',\n styleUrl: 'af-typography-lockup.css',\n shadow: true\n})\nexport class AfTypographyLockup {\n @Element() el!: HTMLElement;\n\n /**\n * The heading size (1-5, or \"card\"; 1 is largest). Controls visual scale\n * only — pair with a matching <h1>-<h5> slotted element for correct\n * document outline (see component docblock). The `card` variant sits\n * between 4 and 5 at 22/20px and is meant for card titles.\n */\n @Prop() headingSize: HeadingSize = 2;\n\n /**\n * The breakpoint for responsive typography\n */\n @Prop() breakpoint: 'desktop' | 'mobile' = 'desktop';\n\n /**\n * Text alignment for the entire lockup (heading and description).\n * Can be overridden individually with headingAlignment and descriptionAlignment.\n */\n @Prop() textAlignment: TextAlign = 'left';\n\n /**\n * Heading text alignment. Falls back to textAlignment if not specified.\n */\n @Prop() headingAlignment?: TextAlign;\n\n /**\n * Description text alignment. Falls back to textAlignment if not specified.\n */\n @Prop() descriptionAlignment?: TextAlign;\n\n /**\n * Button layout direction (horizontal or vertical stacking)\n */\n @Prop() buttonLayout: 'horizontal' | 'vertical' = 'vertical';\n\n /**\n * Buttons position alignment. Falls back to textAlignment if not specified.\n */\n @Prop() buttonsAlignment?: TextAlign;\n\n /**\n * Maximum width for the copy section (in pixels)\n */\n @Prop() maxWidth?: number;\n\n /**\n * Heading colour variant. Matches the Webflow pattern of `h1.primary` vs\n * `h1.secondary`, where \"secondary\" renders in the theme's accent/heading-\n * secondary colour (soft-clay on most themes).\n * - `primary` (default) - uses `--af-typography-heading-primary`\n * - `secondary` - uses `--af-typography-heading-secondary`\n */\n @Prop() headingColor: 'primary' | 'secondary' = 'primary';\n\n /**\n * Description colour variant. Same pattern as `headingColor`; useful for\n * hero-style lockups where the description is rendered in the accent colour.\n * - `default` (default) - uses `--af-typography-body-default`\n * - `secondary` - uses `--af-typography-heading-secondary`\n */\n @Prop() descriptionColor: 'default' | 'secondary' = 'default';\n\n /**\n * Whether the consumer passed anything into the description / buttons\n * slots. The CSS `:empty` selector can't help here — the `<slot>`\n * element itself counts as a child, so the wrapper divs would always\n * render as empty-but-visible lines of gap. Tracked on mount and on\n * any `slotchange` so wrappers collapse cleanly when there's nothing\n * to show.\n */\n @State() hasDescription: boolean = false;\n @State() hasButtons: boolean = false;\n\n private descriptionSlot?: HTMLSlotElement;\n private buttonsSlot?: HTMLSlotElement;\n\n componentDidLoad() {\n this.syncSlotState();\n this.descriptionSlot?.addEventListener('slotchange', this.syncSlotState);\n this.buttonsSlot?.addEventListener('slotchange', this.syncSlotState);\n // Dev-time check that the slotted semantic tag (h1-h6) is within one\n // level of the visual headingSize. Pairs with the class-level docblock;\n // silent in production unless the author explicitly turned on dev mode\n // via `window.__AF_STRICT_HEADINGS__`.\n if (typeof window === 'undefined') return;\n const strict = (window as unknown as { __AF_STRICT_HEADINGS__?: boolean })\n .__AF_STRICT_HEADINGS__;\n if (!strict) return;\n const heading = Array.from(this.el.children).find(\n (child) => !(child as HTMLElement).hasAttribute('slot') && /^h[1-6]$/i.test(child.tagName),\n );\n if (!heading) return;\n const slottedLevel = Number(heading.tagName.slice(1));\n const expected = this.headingSize;\n // The `card` variant is a named scale (card-title), not a semantic level.\n // Skip the numeric-proximity check entirely — convention is <h3>, but\n // consumers may legitimately pair it with <h2>-<h4> depending on context.\n if (expected === 'card') return;\n if (Math.abs(slottedLevel - expected) > 1) {\n // eslint-disable-next-line no-console\n console.warn(\n `[af-typography-lockup] heading-size=${expected} paired with <${heading.tagName.toLowerCase()}>; ` +\n `expected an <h${expected}> for document outline. Pass deliberately or align the two.`,\n );\n }\n }\n\n disconnectedCallback() {\n this.descriptionSlot?.removeEventListener('slotchange', this.syncSlotState);\n this.buttonsSlot?.removeEventListener('slotchange', this.syncSlotState);\n }\n\n private syncSlotState = () => {\n this.hasDescription = (this.descriptionSlot?.assignedNodes({ flatten: true }).length ?? 0) > 0;\n this.hasButtons = (this.buttonsSlot?.assignedNodes({ flatten: true }).length ?? 0) > 0;\n };\n\n render() {\n const effectiveHeadingAlignment = this.headingAlignment ?? this.textAlignment;\n const effectiveDescriptionAlignment = this.descriptionAlignment ?? this.textAlignment;\n const effectiveButtonsAlignment = this.buttonsAlignment ?? this.textAlignment;\n\n const containerClasses = {\n 'lockup': true,\n [`text-${this.textAlignment}`]: true,\n [`layout-${this.buttonLayout}`]: true,\n [`heading-${this.headingSize}`]: true,\n [`breakpoint-${this.breakpoint}`]: true\n };\n\n const headingClasses = {\n 'heading': true,\n [`align-${effectiveHeadingAlignment}`]: true,\n [`heading-color-${this.headingColor}`]: true\n };\n\n const descriptionClasses = {\n 'description': true,\n [`align-${effectiveDescriptionAlignment}`]: true,\n [`description-color-${this.descriptionColor}`]: true\n };\n\n const buttonsClasses = {\n 'buttons': true,\n [`align-${effectiveButtonsAlignment}`]: true\n };\n\n const copyStyle = this.maxWidth ? { maxWidth: `${this.maxWidth}px` } : {};\n\n return (\n <Host>\n <div class={containerClasses}>\n <div class=\"copy\" style={copyStyle}>\n <div class={headingClasses} part=\"heading\">\n <slot></slot>\n </div>\n <div class={descriptionClasses} part=\"body\" hidden={!this.hasDescription}>\n <slot name=\"description\" ref={(el) => (this.descriptionSlot = el as HTMLSlotElement)}></slot>\n </div>\n </div>\n <div class={buttonsClasses} part=\"buttons\" hidden={!this.hasButtons}>\n <slot name=\"buttons\" ref={(el) => (this.buttonsSlot = el as HTMLSlotElement)}></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
package/dist/affinda/affinda.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--colour-brand-mist-green:#C6D5D1;--colour-brand-inkwell:#14343B;--colour-brand-soft-clay:#B09670;--colour-brand-white:#FFFFFF;--colour-brand-ivory-paper:#FFF9EE;--colour-brand-azure:#7FE2D4;--colour-brand-ice:#A6FFF8;--colour-tints-mist-green-50:#f9fbfa;--colour-mistgreen-50:#f9fbfa;--colour-tints-mist-green-100:#f4f7f6;--colour-mistgreen-100:#f4f7f6;--colour-tints-mist-green-200:#e8eeed;--colour-mistgreen-200:#e8eeed;--colour-tints-mist-green-300:#dde6e3;--colour-mistgreen-300:#dde6e3;--colour-tints-mist-green-400:#d1ddda;--colour-mistgreen-400:#d1ddda;--colour-tints-mist-green-500:#c6d5d1;--colour-mistgreen-500:#c6d5d1;--colour-tints-mist-green-600:#b2c0bc;--colour-mistgreen-600:#b2c0bc;--colour-tints-mist-green-700:#9eaaa7;--colour-mistgreen-700:#9eaaa7;--colour-tints-inkwell-20:#f9fafa;--colour-inkwell-20:#f9fafa;--colour-tints-inkwell-30:#f3f5f5;--colour-inkwell-30:#f3f5f5;--colour-tints-inkwell-40:#edf0f0;--colour-inkwell-40:#edf0f0;--colour-tints-inkwell-50:#e8ebeb;--colour-inkwell-50:#e8ebeb;--colour-tints-inkwell-100:#d0d6d8;--colour-inkwell-100:#d0d6d8;--colour-tints-inkwell-200:#a1aeb1;--colour-inkwell-200:#a1aeb1;--colour-tints-inkwell-300:#728589;--colour-inkwell-300:#728589;--colour-tints-inkwell-350:#60767b;--colour-inkwell-350:#60767b;--colour-tints-inkwell-400:#2b484f;--colour-inkwell-400:#2b484f;--colour-tints-inkwell-450:#203e45;--colour-inkwell-450:#203e45;--colour-tints-inkwell-500:#14343b;--colour-inkwell-500:#14343b;--colour-tints-inkwell-600:#102a2f;--colour-inkwell-600:#102a2f;--colour-tints-inkwell-700:#102a2f;--colour-inkwell-700:#102a2f;--colour-tints-soft-clay-50:#f7f5f1;--colour-softclay-50:#f7f5f1;--colour-tints-soft-clay-100:#efeae2;--colour-softclay-100:#efeae2;--colour-tints-soft-clay-200:#dfd5c6;--colour-softclay-200:#dfd5c6;--colour-tints-soft-clay-300:#d0c0a9;--colour-softclay-300:#d0c0a9;--colour-tints-soft-clay-400:#c0ab8d;--colour-softclay-400:#c0ab8d;--colour-tints-soft-clay-500:#b09670;--colour-softclay-500:#b09670;--colour-tints-soft-clay-600:#9e8765;--colour-softclay-600:#9e8765;--colour-tints-soft-clay-700:#8d785a;--colour-softclay-700:#8d785a;--colour-tints-soft-clay-800:#8a7049;--colour-softclay-800:#8a7049;--colour-tints-ice-50:#f6ffff;--colour-ice-50:#f6ffff;--colour-tints-ice-100:#edfffe;--colour-ice-100:#edfffe;--colour-tints-ice-200:#dbfffd;--colour-ice-200:#dbfffd;--colour-tints-ice-300:#cafffd;--colour-ice-300:#cafffd;--colour-tints-ice-400:#b8fffc;--colour-ice-400:#b8fffc;--colour-tints-ice-500:#a6fffb;--colour-ice-500:#a6fffb;--colour-tints-ice-600:#95e6e2;--colour-ice-600:#95e6e2;--colour-tints-ice-700:#85ccc9;--colour-ice-700:#85ccc9;--colour-typography-heading-primary:#14343B;--colour-typography-heading-secondary:#B09670;--colour-typography-body-dark:#14343B;--colour-typography-body-default:#14343B;--colour-typography-body-subtle:#708380;--colour-background-mist-green:#C6D5D1;--colour-background-inkwell:#14343B;--colour-background-soft-clay:#B09670;--colour-background-white:#FFFFFF;--colour-background-ivory-paper:#FFF9EE;--colour-background-level1:#E8EEED;--colour-ui-mist-green:#C6D5D1;--colour-ui-inkwell:#14343B;--colour-ui-soft-clay:#B09670;--colour-ui-white:#FFFFFF;--colour-ui-ivory-paper:#FFF9EE;--colour-ui-azure:#7FE2D4;--colour-ui-ice:#A6FFF8;--radius-sm:6px;--radius-md:12px;--radius-pill:999px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--typography-headingfont:'NeuSans', Arial, sans-serif;--typography-bodyfont:'NeuSans', Arial, sans-serif;--typography-sansfont:'NeuSans', Arial, sans-serif;--font-weight-regular:400;--font-weight-book:500;--font-weight-semibold:600;--font-size-heading-1-desktop:56px;--font-size-heading-1-mobile:38px;--font-size-heading-2-desktop:44px;--font-size-heading-2-mobile:32px;--font-size-heading-3-desktop:34px;--font-size-heading-3-mobile:25px;--font-size-heading-4-desktop:24px;--font-size-heading-4-mobile:20px;--font-size-heading-5-desktop:20px;--font-size-heading-5-mobile:18px;--font-size-heading-xl-desktop:80px;--font-size-heading-xl-mobile:50px;--font-size-body-xlarge:22px;--font-size-body-large:18px;--font-size-body-medium:16px;--font-size-body-small:14px;--font-size-label-button:17px;--font-size-label-tag:14px;--line-height-heading-tight:1;--line-height-heading-normal:1.1;--line-height-heading-relaxed:1.2;--line-height-body-xlarge:28px;--line-height-body-large:26px;--line-height-body-medium:24px;--line-height-body-small:20px;--line-height-label-button:20px;--line-height-label-tag:1;--letter-spacing-heading:-0.02em;--letter-spacing-body:0;--grid-xlarge-breakpoint:1440px;--grid-xlarge-columns:12;--grid-xlarge-margin:80px;--grid-xlarge-gutter:24px;--grid-xlarge-max-width:1440px;--grid-large-breakpoint:1024px;--grid-large-columns:12;--grid-large-margin:64px;--grid-large-gutter:16px;--grid-large-max-width:1024px;--grid-medium-breakpoint:768px;--grid-medium-columns:6;--grid-medium-margin:32px;--grid-medium-gutter:16px;--grid-medium-max-width:768px;--grid-small-breakpoint:375px;--grid-small-columns:4;--grid-small-margin:20px;--grid-small-gutter:16px;--grid-small-max-width:100%;--grid-xsmall-breakpoint:320px;--grid-xsmall-columns:4;--grid-xsmall-margin:16px;--grid-xsmall-gutter:16px;--grid-xsmall-max-width:100%;--icon-size-small:16px;--icon-size-medium:24px;--icon-size-large:32px;--icon-badge-size:48px;--illustration-size:432px}
|
|
1
|
+
:root{--colour-brand-mist-green:#C6D5D1;--colour-brand-inkwell:#14343B;--colour-brand-soft-clay:#B09670;--colour-brand-white:#FFFFFF;--colour-brand-ivory-paper:#FFF9EE;--colour-brand-azure:#7FE2D4;--colour-brand-ice:#A6FFF8;--colour-tints-mist-green-50:#f9fbfa;--colour-mistgreen-50:#f9fbfa;--colour-tints-mist-green-100:#f4f7f6;--colour-mistgreen-100:#f4f7f6;--colour-tints-mist-green-200:#e8eeed;--colour-mistgreen-200:#e8eeed;--colour-tints-mist-green-300:#dde6e3;--colour-mistgreen-300:#dde6e3;--colour-tints-mist-green-400:#d1ddda;--colour-mistgreen-400:#d1ddda;--colour-tints-mist-green-500:#c6d5d1;--colour-mistgreen-500:#c6d5d1;--colour-tints-mist-green-600:#b2c0bc;--colour-mistgreen-600:#b2c0bc;--colour-tints-mist-green-700:#9eaaa7;--colour-mistgreen-700:#9eaaa7;--colour-tints-inkwell-20:#f9fafa;--colour-inkwell-20:#f9fafa;--colour-tints-inkwell-30:#f3f5f5;--colour-inkwell-30:#f3f5f5;--colour-tints-inkwell-40:#edf0f0;--colour-inkwell-40:#edf0f0;--colour-tints-inkwell-50:#e8ebeb;--colour-inkwell-50:#e8ebeb;--colour-tints-inkwell-100:#d0d6d8;--colour-inkwell-100:#d0d6d8;--colour-tints-inkwell-200:#a1aeb1;--colour-inkwell-200:#a1aeb1;--colour-tints-inkwell-300:#728589;--colour-inkwell-300:#728589;--colour-tints-inkwell-350:#60767b;--colour-inkwell-350:#60767b;--colour-tints-inkwell-400:#2b484f;--colour-inkwell-400:#2b484f;--colour-tints-inkwell-450:#203e45;--colour-inkwell-450:#203e45;--colour-tints-inkwell-500:#14343b;--colour-inkwell-500:#14343b;--colour-tints-inkwell-600:#102a2f;--colour-inkwell-600:#102a2f;--colour-tints-inkwell-700:#102a2f;--colour-inkwell-700:#102a2f;--colour-tints-soft-clay-50:#f7f5f1;--colour-softclay-50:#f7f5f1;--colour-tints-soft-clay-100:#efeae2;--colour-softclay-100:#efeae2;--colour-tints-soft-clay-200:#dfd5c6;--colour-softclay-200:#dfd5c6;--colour-tints-soft-clay-300:#d0c0a9;--colour-softclay-300:#d0c0a9;--colour-tints-soft-clay-400:#c0ab8d;--colour-softclay-400:#c0ab8d;--colour-tints-soft-clay-500:#b09670;--colour-softclay-500:#b09670;--colour-tints-soft-clay-600:#9e8765;--colour-softclay-600:#9e8765;--colour-tints-soft-clay-700:#8d785a;--colour-softclay-700:#8d785a;--colour-tints-soft-clay-800:#8a7049;--colour-softclay-800:#8a7049;--colour-tints-ice-50:#f6ffff;--colour-ice-50:#f6ffff;--colour-tints-ice-100:#edfffe;--colour-ice-100:#edfffe;--colour-tints-ice-200:#dbfffd;--colour-ice-200:#dbfffd;--colour-tints-ice-300:#cafffd;--colour-ice-300:#cafffd;--colour-tints-ice-400:#b8fffc;--colour-ice-400:#b8fffc;--colour-tints-ice-500:#a6fffb;--colour-ice-500:#a6fffb;--colour-tints-ice-600:#95e6e2;--colour-ice-600:#95e6e2;--colour-tints-ice-700:#85ccc9;--colour-ice-700:#85ccc9;--colour-typography-heading-primary:#14343B;--colour-typography-heading-secondary:#B09670;--colour-typography-body-dark:#14343B;--colour-typography-body-default:#14343B;--colour-typography-body-subtle:#708380;--colour-background-mist-green:#C6D5D1;--colour-background-inkwell:#14343B;--colour-background-soft-clay:#B09670;--colour-background-white:#FFFFFF;--colour-background-ivory-paper:#FFF9EE;--colour-background-level1:#E8EEED;--colour-ui-mist-green:#C6D5D1;--colour-ui-inkwell:#14343B;--colour-ui-soft-clay:#B09670;--colour-ui-white:#FFFFFF;--colour-ui-ivory-paper:#FFF9EE;--colour-ui-azure:#7FE2D4;--colour-ui-ice:#A6FFF8;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-pill:999px;--shadow-sm:0 1px 2px rgba(20, 52, 59, 0.08);--shadow-md:1px 2px 4px rgba(20, 52, 59, 0.2);--shadow-navbar:0 4px 24px rgba(20, 52, 59, 0.12);--status-ok:#3E8F6E;--status-issue:#B94A3B;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--typography-headingfont:'NeuSans', Arial, sans-serif;--typography-bodyfont:'NeuSans', Arial, sans-serif;--typography-sansfont:'NeuSans', Arial, sans-serif;--font-weight-regular:400;--font-weight-book:500;--font-weight-semibold:600;--font-size-heading-1-desktop:56px;--font-size-heading-1-mobile:38px;--font-size-heading-2-desktop:44px;--font-size-heading-2-mobile:32px;--font-size-heading-3-desktop:34px;--font-size-heading-3-mobile:25px;--font-size-heading-4-desktop:24px;--font-size-heading-4-mobile:20px;--font-size-heading-5-desktop:20px;--font-size-heading-5-mobile:18px;--font-size-heading-xl-desktop:80px;--font-size-heading-xl-mobile:50px;--font-size-heading-card-desktop:22px;--font-size-heading-card-mobile:20px;--font-size-body-xlarge:22px;--font-size-body-large:18px;--font-size-body-medium:16px;--font-size-body-small:14px;--font-size-label-button:17px;--font-size-label-tag:14px;--line-height-heading-3:38px;--line-height-heading-4:30px;--line-height-heading-5:24px;--line-height-heading-tight:1;--line-height-heading-normal:1.1;--line-height-heading-relaxed:1.2;--line-height-heading-card:28px;--line-height-body-xlarge:28px;--line-height-body-large:26px;--line-height-body-medium:24px;--line-height-body-small:20px;--line-height-label-button:20px;--line-height-label-tag:1;--letter-spacing-heading:-0.02em;--letter-spacing-body:0;--grid-xlarge-breakpoint:1440px;--grid-xlarge-columns:12;--grid-xlarge-margin:80px;--grid-xlarge-gutter:24px;--grid-xlarge-max-width:1440px;--grid-large-breakpoint:1024px;--grid-large-columns:12;--grid-large-margin:64px;--grid-large-gutter:16px;--grid-large-max-width:1024px;--grid-medium-breakpoint:768px;--grid-medium-columns:6;--grid-medium-margin:32px;--grid-medium-gutter:16px;--grid-medium-max-width:768px;--grid-small-breakpoint:375px;--grid-small-columns:4;--grid-small-margin:20px;--grid-small-gutter:16px;--grid-small-max-width:100%;--grid-xsmall-breakpoint:320px;--grid-xsmall-columns:4;--grid-xsmall-margin:16px;--grid-xsmall-gutter:16px;--grid-xsmall-max-width:100%;--icon-size-small:16px;--icon-size-medium:24px;--icon-size-large:32px;--icon-badge-size:48px;--illustration-size:432px}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,g as a,b as
|
|
1
|
+
import{p as e,g as a,b as t}from"./p-MwnBSqEY.js";export{s as setNonce}from"./p-MwnBSqEY.js";var i=()=>{const a=import.meta.url;const t={};if(a!==""){t.resourcesUrl=new URL(".",a).href}return e(t)};i().then((async e=>{await a();return t([["p-7d3cdda1",[[262,"af-hero",{variant:[513],heading:[1],description:[1],floatNavbar:[516,"float-navbar"],topPad:[1,"top-pad"],maxWidth:[2,"max-width"],maskImage:[4,"mask-image"]}]]],["p-6e181b2b",[[262,"af-icon-text",{icon:[1],headingSize:[2,"heading-size"],orientation:[1],iconSize:[1,"icon-size"]}]]],["p-de75cb4f",[[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"]}]]],["p-86f6dfdc",[[262,"af-feature-card",{theme:[1],layout:[1],cardSize:[513,"card-size"],headingSize:[2,"heading-size"],imageSrc:[1,"image-src"],imageAlt:[1,"image-alt"]}]]],["p-4a9b192b",[[262,"af-illustrated-card",{theme:[1],breakpoint:[1],cardSize:[1,"card-size"]}]]],["p-436673bb",[[262,"af-numbered-stepper-item",{index:[514]}]]],["p-2526604b",[[257,"af-stat",{value:[1],label:[1]}]]],["p-83bb96cc",[[258,"af-testimonial-stat",{value:[1],description:[1],accentBorder:[4,"accent-border"]}]]],["p-09dfcd40",[[262,"af-video-container",{videoThumbnailUrl:[1,"video-thumbnail-url"],videoAlt:[1,"video-alt"],videoUrl:[1,"video-url"]}]]],["p-342b08e5",[[262,"af-feature-grid",{columns:[2],mobileLayout:[1,"mobile-layout"],scrollProgress:[32]},null,{mobileLayout:["onMobileLayoutChange"]}]]],["p-1c96856a",[[262,"af-grid-callout",{imageSrc:[1,"image-src"],imageAlt:[1,"image-alt"],imagePosition:[1,"image-position"],columns:[2],headingSize:[2,"heading-size"]}]]],["p-d7d82986",[[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"]}]]],["p-a25d3257",[[262,"af-split-section",{topTheme:[1,"top-theme"],bottomTheme:[1,"bottom-theme"],padding:[1],container:[4]}]]],["p-a7a8f18c",[[262,"af-testimonial-carousel",{currentIndex:[32],isAnimating:[32],testimonialCount:[32]},[[0,"navPrev","handleNavPrev"],[0,"navNext","handleNavNext"]]]]],["p-9c1e9bd8",[[262,"af-text-image",{imagePosition:[1,"image-position"],imageProportion:[1,"image-proportion"],src:[1],alt:[1],showSecondLockup:[4,"show-second-lockup"]}]]],["p-32d62fbb",[[262,"af-accordion",{mode:[1],value:[1025],defaultValue:[1,"default-value"],internalValue:[32]},[[0,"af-accordion-toggle","handleItemToggle"]],{value:["handleValueChange"]}]]],["p-4eeeb8a1",[[257,"af-accordion-item",{itemId:[513,"item-id"],open:[1540],disabled:[516],contentHeight:[32],toggle:[64]},null,{open:["handleOpenChange"]}]]],["p-9eba91fd",[[257,"af-button-group",{direction:[1],gap:[1]}]]],["p-bbfc9df6",[[257,"af-center",{axis:[1],inline:[4],minHeight:[1,"min-height"]}]]],["p-4f59b554",[[257,"af-checkbox",{checked:[1540],indeterminate:[516],disabled:[516],name:[1],value:[1]}]]],["p-0acadf6f",[[262,"af-client-carousel",{theme:[1],rows:[2],mode:[1]}]]],["p-95d4696a",[[257,"af-color-swatch",{color:[1],name:[1],size:[1]}]]],["p-3ed408f6",[[262,"af-contact-item",{label:[1],value:[1]}]]],["p-41bbb218",[[257,"af-divider",{orientation:[1],spacing:[1]}]]],["p-068ac2fb",[[262,"af-feature-accordion",{heading:[1],items:[1],cycleInterval:[2,"cycle-interval"],autoCycle:[4,"auto-cycle"],expandedIndex:[32],timerProgress:[32]},null,{autoCycle:["handleAutoCycleChange"]}]]],["p-862a2509",[[257,"af-fieldset",{legend:[1],orientation:[1],disabled:[516]}]]],["p-6475796d",[[262,"af-footer",{copyrightText:[1,"copyright-text"],statusText:[1,"status-text"],statusUrl:[1,"status-url"],systemsOperational:[4,"systems-operational"],showStatus:[4,"show-status"]}]]],["p-6756aa66",[[262,"af-footer-column",{heading:[1]}]]],["p-dcc89b4c",[[262,"af-footer-link",{href:[1],external:[4]}]]],["p-6ea474a3",[[257,"af-grid",{columns:[2],columnsLg:[2,"columns-lg"],columnsMd:[2,"columns-md"],columnsSm:[2,"columns-sm"],gap:[1],align:[1]}]]],["p-5e5e7d75",[[257,"af-inline",{gap:[1],align:[1],justify:[1],wrap:[4]}]]],["p-4a355b69",[[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]}]]],["p-9480f00d",[[257,"af-logo-well"]]],["p-a1e80460",[[262,"af-nav-accordion",{mode:[1],breakpoint:[513],value:[1025],internalValue:[32]},[[0,"af-nav-accordion-item-toggle","handleItemToggle"]]]]],["p-1b4b0c88",[[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"]}]]],["p-43f40921",[[258,"af-nav-card",{heading:[1],href:[1],imageSrc:[1,"image-src"],imageAlt:[1,"image-alt"],isHovered:[32]}]]],["p-5c163c5b",[[262,"af-nav-menu",{heading:[1],breakpoint:[1],showBorder:[4,"show-border"],cardStyle:[516,"card-style"]}]]],["p-827f3050",[[262,"af-nav-menu-nest",{type:[1],breakpoint:[1],showSidebarBorder:[516,"show-sidebar-border"]}]]],["p-dabd389a",[[262,"af-numbered-stepper",{orientation:[1]}]]],["p-631d141c",[[257,"af-paperclip-decoration",{width:[1],height:[1],opacity:[2],fill:[1]}]]],["p-76cb736d",[[257,"af-radio",{checked:[1540],disabled:[516],name:[513],value:[1]}]]],["p-7111051c",[[257,"af-show",{above:[1],below:[1]}]]],["p-a8d75eb1",[[262,"af-social-link",{href:[1],label:[1],icon:[1]}]]],["p-61a6b43d",[[257,"af-spacer",{size:[1],flex:[4],axis:[1]}]]],["p-bed7d9a1",[[257,"af-stack",{direction:[1],gap:[1],align:[1],justify:[1],wrap:[4]}]]],["p-85cc55bb",[[262,"af-stats-row"]]],["p-256970e3",[[262,"af-stepper",{orientation:[1]}]]],["p-eeda78ea",[[262,"af-stepper-step",{index:[514]}]]],["p-7867c2ff",[[257,"af-switch",{active:[1540],disabled:[516],name:[1],value:[1]}]]],["p-9f3e7116",[[257,"af-tab",{label:[1],active:[516],disabled:[516],shape:[513],displayIcon:[4,"display-icon"],displayNumber:[4,"display-number"],value:[1]}]]],["p-35607741",[[257,"af-tab-bar",{shape:[513],breakpoint:[513]},[[0,"keydown","handleKeyDown"]]]]],["p-15f0bd34",[[257,"af-tag",{size:[1],variant:[1],href:[1]}]]],["p-ae430873",[[262,"af-text-image-nest",{layout:[1]}]]],["p-24e74c10",[[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]}]]],["p-e07e27f1",[[262,"af-theme-override",{theme:[1]}]]],["p-f19cb091",[[257,"af-visually-hidden",{focusable:[4]}]]],["p-365a75e2",[[258,"af-icon-box",{icon:[1],size:[1]}]]],["p-4058a1eb",[[262,"af-section",{padding:[1],theme:[1],container:[4]}]]],["p-6c33fee6",[[257,"af-aspect-ratio",{ratio:[1]}]]],["p-9aed7039",[[257,"af-icon-button",{variant:[513],size:[1],disabled:[4],href:[1],type:[1],ariaLabel:[1,"aria-label"]}]]],["p-9ce0adc2",[[258,"af-image",{src:[1],alt:[1],shape:[1]}]]],["p-a02d6192",[[257,"af-number-badge",{number:[2],variant:[1],size:[2]}]]],["p-90ef7baa",[[257,"af-button",{variant:[513],size:[1],disabled:[4],type:[1],href:[1],hasIconLeft:[32],hasIconRight:[32]}]]],["p-b39eea31",[[262,"af-card",{theme:[1],stretch:[516]}]]],["p-2237e652",[[258,"af-progress-line",{progress:[2],orientation:[1]}]]],["p-4b2c0698",[[257,"af-container",{maxWidth:[1,"max-width"]}]]],["p-364ffa25",[[257,"af-icon",{name:[1],size:[2],label:[1]}]]],["p-b9ec0e75",[[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-logo"],[257,"af-heading",{level:[1],align:[1]}],[257,"af-text",{variant:[1],align:[1],as:[1]}]]],["p-44d960ca",[[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]}]]]],e)}));
|
|
2
2
|
//# sourceMappingURL=affinda.esm.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export{af_heading as AfHeading,af_logo as AfLogo,af_nav_item as AfNavItem,af_navbar as AfNavbar,af_text as AfText}from"./p-
|
|
1
|
+
export{af_heading as AfHeading,af_logo as AfLogo,af_nav_item as AfNavItem,af_navbar as AfNavbar,af_text as AfText}from"./p-b9ec0e75.entry.js";export{af_color_swatch as AfColorSwatch}from"./p-95d4696a.entry.js";export{af_container as AfContainer}from"./p-4b2c0698.entry.js";export{af_aspect_ratio as AfAspectRatio}from"./p-6c33fee6.entry.js";export{af_button as AfButton}from"./p-90ef7baa.entry.js";export{af_icon_button as AfIconButton}from"./p-9aed7039.entry.js";export{af_button_group as AfButtonGroup}from"./p-9eba91fd.entry.js";export{af_typography_lockup as AfTypographyLockup}from"./p-44d960ca.entry.js";export{af_checkbox as AfCheckbox}from"./p-4f59b554.entry.js";export{af_radio as AfRadio}from"./p-76cb736d.entry.js";export{af_switch as AfSwitch}from"./p-7867c2ff.entry.js";export{af_fieldset as AfFieldset}from"./p-862a2509.entry.js";export{af_input as AfInput}from"./p-4a355b69.entry.js";export{af_textarea as AfTextarea}from"./p-24e74c10.entry.js";export{af_tag as AfTag}from"./p-15f0bd34.entry.js";export{af_tab as AfTab}from"./p-9f3e7116.entry.js";export{af_tab_bar as AfTabBar}from"./p-35607741.entry.js";export{af_feature_card as AfFeatureCard}from"./p-86f6dfdc.entry.js";export{af_illustrated_card as AfIllustratedCard}from"./p-4a9b192b.entry.js";export{af_hero as AfHero}from"./p-7d3cdda1.entry.js";import"./p-MwnBSqEY.js";
|
|
2
2
|
//# sourceMappingURL=index.esm.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,h as a,H as o,a as i}from"./p-MwnBSqEY.js";const c=".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 0.2s ease}.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 0.3s ease, opacity 0.3s ease}.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 t=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:"335d71685c8aad8e3ffc0b32c95b8ddd3b670491"},a("div",{key:"03d0f317865722652ad21e8dfd38e3806e890993",class:"feature-accordion"},a("div",{key:"ddc8fa8c2690f670cd3fdd7efa55c7c11ff29e14",class:"feature-accordion__container"},a("h2",{key:"2d81b47cdc05b6924f2a5a17407bd5d073b6f955",class:"feature-accordion__heading"},this.heading),a("div",{key:"ea1c924a393afab5a8dfe223d3404798a7cacf46",class:"feature-accordion__content"},a("div",{key:"64edad33b88cc793e93debad5f2f051f795deb65",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"},this.expandedIndex===o?a("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M5 12H19",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round"})):a("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M12 5V19M5 12H19",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:"ca61ce3c070f35e9084dcd2bdd4c0fdf8c873fb5",class:"feature-accordion__image-container"},a("div",{key:"f741bd15d6fdd17b8947a099a94ba37c5d9a797b",class:"feature-accordion__image-wrapper"},i?.imageUrl&&a("img",{key:"8f8dbccdfb3ac4857d0a8bb8bcc317b00ac1cb87",src:i.imageUrl,alt:i.imageAlt||i.title,class:"feature-accordion__image"}),!i?.imageUrl&&a("div",{key:"a06a0cb9eccf2504e9515c9da650cb9b2717173b",class:"feature-accordion__image-placeholder"},a("slot",{key:"31097d47af5bb4f131aecfddb2ed370bb84c3b34",name:"image"}))))))))}get el(){return i(this)}static get watchers(){return{autoCycle:["handleAutoCycleChange"]}}};t.style=c;export{t as af_feature_accordion};
|
|
2
|
+
//# sourceMappingURL=p-068ac2fb.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
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":"YAAcA,OAAkBC,OAAQC,OAAWC,MAAkB,kBAErE,MAAMC,EAAwB,
|
|
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":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as a,c as e,h as o,H as i}from"./p-MwnBSqEY.js";const t=".sc-af-video-container-h{display:block;width:100%}.video-container.sc-af-video-container{display:flex;flex-direction:column;align-items:center;width:100%;gap:var(--space-10, 40px)}.video-container__top.sc-af-video-container,.video-container__bottom.sc-af-video-container{width:100%;display:flex;flex-direction:column;align-items:center}.video-container__top.sc-af-video-container:empty,.video-container__bottom.sc-af-video-container:empty{display:none}.video-container__video.sc-af-video-container{width:100%;max-width:1024px}.video-container__thumbnail-wrapper.sc-af-video-container{position:absolute;inset:0;border-radius:var(--radii-video-crop, 16px);overflow:hidden;background-color:var(--colour-inkwell-400, #2b484f)}.video-container__thumbnail.sc-af-video-container{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}.video-container__play-button.sc-af-video-container{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;align-items:center;justify-content:center;padding:24px;border-radius:var(--radii-button, 9999px);background-color:var(--af-button-primary-bg, var(--colour-brand-ice, #a6fffb));border:1px solid var(--af-button-primary-stroke, var(--colour-brand-inkwell, #14343b));cursor:pointer;transition:background-color 0.2s ease;color:var(--af-button-primary-icon, var(--colour-brand-inkwell, #14343b))}.video-container__play-button.sc-af-video-container:hover{background-color:var(--af-button-primary-bg-hover, var(--colour-ice-600, #95e6e2))}.video-container__play-button.sc-af-video-container:focus-visible{outline:2px solid var(--colour-brand-ice, #a6fffb);outline-offset:2px}@media (max-width: 768px){.video-container.sc-af-video-container{gap:var(--space-8, 32px)}.video-container__play-button.sc-af-video-container{padding:12px}}";const n=class{constructor(o){a(this,o);this.playClick=e(this,"playClick");this.videoThumbnailUrl="";this.videoAlt="Video thumbnail";this.videoUrl="";this.handlePlayClick=()=>{const a=this.playClick.emit({videoUrl:this.videoUrl});if(!a.defaultPrevented&&this.videoUrl){window.open(this.videoUrl,"_blank")}}}render(){return o(i,{key:"2bef13cab427a55363cd89b0398bfb5187d33424"},o("div",{key:"ecd350d7cc04482a4e04fa0d22ff2b57a91374ad",class:"video-container"},o("div",{key:"d855f0cb2a805b9fff46008f360f8643f91e9a5e",class:"video-container__top"},o("slot",{key:"87d02b710b110573e2ee3b177665ae6d277f1533",name:"top"})),o("div",{key:"a9f263a746850568c487f84f889ff55ce8b68f56",class:"video-container__video"},o("af-aspect-ratio",{key:"f6473ffa87a633d101094bb4d34b85c9edf8d0fa",ratio:"16:9"},o("div",{key:"042a90b134fa35101b56be745561fb729ac912d8",class:"video-container__thumbnail-wrapper"},this.videoThumbnailUrl&&o("img",{key:"4fc0ee51ac96f79b496a16d9a43004c2fa1111a9",src:this.videoThumbnailUrl,alt:this.videoAlt,class:"video-container__thumbnail",loading:"lazy"}),o("button",{key:"1dbe720ac679b9fac1405e1d7b28ae3f7c6bf234",class:"video-container__play-button",onClick:this.handlePlayClick,"aria-label":"Play video",type:"button"},o("af-icon",{key:"7d8db3173c20d105c7371765255a3046c9ee1b07",name:"play",size:24}))))),o("div",{key:"f0da765eb52e956a8d77df2158e0e2fe984d672c",class:"video-container__bottom"},o("slot",{key:"1cb4acc596c066f5ac1c9981d4aeab4c6a249072",name:"bottom"}))))}};n.style=t;export{n as af_video_container};
|
|
2
|
+
//# sourceMappingURL=p-09dfcd40.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,h as a,H as c,a as l}from"./p-MwnBSqEY.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:"ca25bfa9d9ca4bcf2b9326e48c89e7f5fb0599b3",class:`theme-${this.theme} mode-${this.mode}`},a("div",{key:"ea36aed6990f569561dce562510f88a9a50b5653",class:`client-carousel theme-${this.theme} rows-${e} mode-${this.mode}`},a("div",{key:"a96a00ea379f9908f01845e9d2e515146bc2de1e",class:"carousel-container"},a("div",{key:"1a5d6c4298b9229ee1ef3c3cf2fd0f358e5bf0e8",class:"carousel-row scroll-left"},a("div",{key:"825e3e9149cc95c97892bb89becc2ea3eccddde5",class:"logo-track",ref:e=>this.row1TrackRef=e},a("slot",{key:"6e03784bd1f196374f0b73bb45b54f6dc1db66a2",name:"row-1"},a("slot",{key:"ed18d97e06d91a10ed6914cafa488ffc59f385ff"})))),e===2&&a("div",{key:"7143c9333e29ffaaf5b8bcf8d1cf905d60236a7a",class:"carousel-row scroll-right"},a("div",{key:"8446a3dcf958b370b4cc14a27ec4bd7c0228ded2",class:"logo-track",ref:e=>this.row2TrackRef=e},a("slot",{key:"2d4de0f0697f22ac4742cebe0e20ed94b218f030",name:"row-2"}))))))}get el(){return l(this)}};r.style=o;export{r as af_client_carousel};
|
|
2
|
+
//# sourceMappingURL=p-0acadf6f.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["registerInstance","h","Host","getElement","afClientCarouselCss","AfClientCarousel","constructor","hostRef","this","theme","rows","mode","componentDidLoad","duplicateTrackContent","row1TrackRef","Number","row2TrackRef","track","originals","Array","from","children","filter","child","hasAttribute","forEach","el","clone","cloneNode","setAttribute","appendChild","render","key","class","ref","name","style"],"sources":["0"],"mappings":"YAAcA,OAAkBC,OAAQC,OAAWC,MAAkB,kBAErE,MAAMC,EAAsB,+qHAE5B,MAAMC,EAAmB,MACrB,WAAAC,CAAYC,GACRP,EAAiBQ,KAAMD,GAEvBC,KAAKC,MAAQ,UASbD,KAAKE,KAAO,EAQZF,KAAKG,KAAO,QAChB,CACA,gBAAAC,GAGI,GAAIJ,KAAKG,OAAS,SACd,OACJH,KAAKK,sBAAsBL,KAAKM,cAChC,GAAIC,OAAOP,KAAKE,QAAU,EAAG,CACzBF,KAAKK,sBAAsBL,KAAKQ,aACpC,CACJ,CAWA,qBAAAH,CAAsBI,GAClB,IAAKA,EACD,OACJ,MAAMC,EAAYC,MAAMC,KAAKH,EAAMI,UAAUC,QAAQC,IAAWA,EAAMC,aAAa,yBACnFN,EAAUO,SAASC,IACf,MAAMC,EAAQD,EAAGE,UAAU,MAC3BD,EAAME,aAAa,sBAAuB,IAC1CF,EAAME,aAAa,cAAe,QAClCZ,EAAMa,YAAYH,EAAM,GAEhC,CACA,MAAAI,GACI,MAAMrB,EAAOK,OAAOP,KAAKE,MAIzB,OAAQT,EAAEC,EAAM,CAAE8B,IAAK,2CAA4CC,MAAO,SAASzB,KAAKC,cAAcD,KAAKG,QAAUV,EAAE,MAAO,CAAE+B,IAAK,2CAA4CC,MAAO,yBAAyBzB,KAAKC,cAAcC,UAAaF,KAAKG,QAAUV,EAAE,MAAO,CAAE+B,IAAK,2CAA4CC,MAAO,sBAAwBhC,EAAE,MAAO,CAAE+B,IAAK,2CAA4CC,MAAO,4BAA8BhC,EAAE,MAAO,CAAE+B,IAAK,2CAA4CC,MAAO,aAAcC,IAAMR,GAAQlB,KAAKM,aAAeY,GAAOzB,EAAE,OAAQ,CAAE+B,IAAK,2CAA4CG,KAAM,SAAWlC,EAAE,OAAQ,CAAE+B,IAAK,gDAAkDtB,IAAS,GAAMT,EAAE,MAAO,CAAE+B,IAAK,2CAA4CC,MAAO,6BAA+BhC,EAAE,MAAO,CAAE+B,IAAK,2CAA4CC,MAAO,aAAcC,IAAMR,GAAQlB,KAAKQ,aAAeU,GAAOzB,EAAE,OAAQ,CAAE+B,IAAK,2CAA4CG,KAAM,cACz/B,CACA,MAAIT,GAAO,OAAOvB,EAAWK,KAAO,GAExCH,EAAiB+B,MAAQhC,SAEhBC","ignoreList":[]}
|