@alto-avios/alto-ui 5.10.0 → 5.12.0-alpha.1

package/dist/Accordion-DUMWsZOv.js

@@ -0,0 +1,5 @@
+import{t as o}from"./Icon-DweSiH3B.js";import e from"react";import{Button as r,Disclosure as n,DisclosureGroup as c,DisclosurePanel as i}from"react-aria-components";import{Fragment as t,jsx as a,jsxs as d}from"react/jsx-runtime";import './assets/Accordion.css';var l={accordion:"_accordion_15993_1","accordion-group":"_accordion-group_15993_16","accordion-group__stack":"_accordion-group__stack_15993_22","accordion-group__header":"_accordion-group__header_15993_28",accordion__trigger:"_accordion__trigger_15993_35","accordion__button-content":"_accordion__button-content_15993_44","accordion__title-container":"_accordion__title-container_15993_52","accordion__title-wrapper":"_accordion__title-wrapper_15993_59","accordion__end-container":"_accordion__end-container_15993_64","accordion__start-slot":"_accordion__start-slot_15993_70","accordion__end-slot":"_accordion__end-slot_15993_71",accordion__title:"_accordion__title_15993_52",accordion__description:"_accordion__description_15993_90","accordion__icon-wrapper":"_accordion__icon-wrapper_15993_100","accordion__panel-content":"_accordion__panel-content_15993_132"},_=({title:e,description:n,startSlot:c,endSlot:i,id:t,headingLevel:_="h3"})=>{const s=_;/* @__PURE__ */
+return a(r,{slot:"trigger",className:l.accordion__trigger,...t?{id:t}:{},children:/* @__PURE__ */d("span",{className:l["accordion__button-content"],children:[/* @__PURE__ */d("span",{className:l["accordion__title-container"],children:[c&&/* @__PURE__ */a("span",{className:l["accordion__start-slot"],children:c}),/* @__PURE__ */d("div",{className:l["accordion__title-wrapper"],children:[/* @__PURE__ */a(s,{className:l.accordion__title,children:e}),n&&/* @__PURE__ */a("p",{className:l.accordion__description,children:n})]})]}),/* @__PURE__ */d("span",{className:l["accordion__end-container"],children:[i&&/* @__PURE__ */a("span",{className:l["accordion__end-slot"],children:i}),/* @__PURE__ */a(o,{iconName:"chevron-down",iconPrefix:"fas",className:l["accordion__icon-wrapper"],color:"accentSecondary"})]})]})})},s=({children:o,...r})=>{const n=e.useRef(null);return e.useEffect(()=>{const o=n.current;if(!o)return;const e=o.closest('[role="group"]');if(!e)return;requestAnimationFrame(()=>{const r=o.scrollHeight;e.style.setProperty("--group-height",`${r}px`)});const r=()=>{const r=o.scrollHeight;e.style.setProperty("--group-height",`${r}px`)};r();const c=new ResizeObserver(()=>{r()});return c.observe(o),c.observe(e),window.addEventListener("resize",r),()=>{c.disconnect(),window.removeEventListener("resize",r)}},[]),/* @__PURE__ */a(i,{...r,children:/* @__PURE__ */a("div",{ref:n,className:l["accordion__panel-content"],children:o})})},p=({children:o})=>/* @__PURE__ */a(t,{children:o}),h=({children:o})=>/* @__PURE__ */a(t,{children:o}),u=({title:o,description:r,children:c,defaultExpanded:i=!1,className:t,titleStart:u,titleEnd:m,id:g,headingLevel:f="h3",...N})=>{const E=[l.accordion,t].filter(Boolean).join(" ");let v=u,w=m;const y=e.Children.map(c,o=>{const e=o;return e.type===p?(v=e.props.children,null):e.type===h?(w=e.props.children,null):e})?.filter(Boolean);/* @__PURE__ */
+return d(n,{className:E,defaultExpanded:i,id:g,...N,children:[/* @__PURE__ */a(_,{title:o,description:r,startSlot:v,endSlot:w,id:g,headingLevel:f}),/* @__PURE__ */a(s,{children:y})]})},m=({title:o,description:r,children:n,className:i,allowsMultipleExpanded:t=!0})=>{const _=[l["accordion-group"],i].filter(Boolean).join(" "),s=e.Children.toArray(n).map((o,r)=>e.isValidElement(o)&&"object"==typeof o.props&&null!==o.props&&"defaultExpanded"in o.props&&o.props.defaultExpanded?"id"in o.props&&"string"==typeof o.props.id?o.props.id:`accordion-${r}`:null).filter(o=>null!==o);/* @__PURE__ */
+return d("div",{className:_,children:[(o||r)&&/* @__PURE__ */d("div",{className:l["accordion-group__header"],children:[o,r]}),/* @__PURE__ */a(c,{className:l["accordion-group__stack"],allowsMultipleExpanded:t,defaultExpandedKeys:s,children:e.Children.map(n,(o,r)=>e.isValidElement(o)?e.cloneElement(o,{key:`accordion-${r}`,id:o.props?.id||`accordion-${r}`}):o)})]})};u.StartSlot=p,u.EndSlot=h,p.displayName="Accordion.StartSlot",h.displayName="Accordion.EndSlot";export{p as i,m as n,h as r,u as t};
+//# sourceMappingURL=Accordion-DUMWsZOv.js.map

package/dist/Accordion-DUMWsZOv.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion-DUMWsZOv.js","names":[],"sources":["../src/components/Accordion/Accordion.module.css","../src/components/Accordion/Accordion.tsx"],"sourcesContent":[".accordion {\n  --accordion-transition-duration: 200ms;\n  --accordion-transition-timing: cubic-bezier(0.4, 0, 0.2, 1);\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  align-self: stretch;\n  border: 1px solid var(--alto-sem-color-border-secondary);\n  border-radius: var(--alto-card-radius);\n  background-color: var(--alto-sem-color-bg-white-vibrant-default);\n  padding: 0;\n  width: 100%;\n}\n\n.accordion-group {\n  display: flex;\n  flex-direction: column;\n  gap: var(--alto-sem-space-2xs);\n}\n\n.accordion-group__stack {\n  display: flex;\n  flex-direction: column;\n  gap: var(--alto-sem-space-2xs);\n}\n\n.accordion-group__header {\n  display: flex;\n  flex-direction: column;\n  gap: var(--alto-sem-space-4xs);\n  padding-bottom: var(--alto-sem-space-2xs);\n}\n\n.accordion__trigger {\n  width: 100%;\n  padding: var(--alto-sem-space-md) var(--alto-sem-space-sm);\n  background-color: var(--alto-sem-color-bg-white-vibrant-default);\n  border-radius: var(--alto-card-radius);\n  border: none;\n  cursor: pointer;\n}\n\n.accordion__button-content {\n  display: flex;\n  width: 100%;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--alto-sem-space-sm);\n}\n\n.accordion__title-container {\n  display: flex;\n  align-items: center;\n  gap: var(--alto-sem-space-2xs);\n  flex: 1;\n}\n\n.accordion__title-wrapper {\n  display: flex;\n  flex-direction: column;\n}\n\n.accordion__end-container {\n  display: flex;\n  align-items: center;\n  gap: var(--alto-sem-space-sm);\n}\n\n.accordion__start-slot,\n.accordion__end-slot {\n  display: flex;\n  align-items: center;\n}\n\n.accordion__title {\n  flex: 1;\n  margin: 0;\n  color: var(--alto-sem-color-fg-accent-secondary);\n  font-family: var(--alto-sem-text-body-font-family);\n  font-size: var(--alto-sem-text-body-lg-font-size);\n  font-style: normal;\n  font-weight: var(--alto-sem-text-body-bold-font-weight);\n  line-height: var(--alto-sem-text-body-lg-line-height);\n  letter-spacing: var(--alto-sem-text-body-lg-letter-spacing);\n  text-align: left;\n  word-break: break-word;\n}\n\n.accordion__description {\n  color: var(--alto-sem-color-fg-secondary);\n  font-family: var(--alto-sem-text-body-font-family);\n  font-size: var(--alto-sem-text-body-md-font-size);\n  line-height: var(--alto-sem-text-body-md-line-height);\n  letter-spacing: var(--alto-sem-text-body-md-letter-spacing);\n  text-align: left;\n  margin: 0;\n}\n\n.accordion__icon-wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--alto-sem-color-fg-secondary);\n  transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.accordion[data-expanded='true'] .accordion__icon-wrapper {\n  transform: rotate(180deg);\n}\n\n/* Animation styles */\n.accordion > [role='group'] {\n  height: 0;\n  width: 100%;\n  overflow: hidden;\n  visibility: hidden;\n  transition:\n    height var(--accordion-transition-duration)\n      var(--accordion-transition-timing),\n    visibility 0ms linear;\n}\n\n.accordion[data-expanded='true'] > [role='group'] {\n  height: var(--group-height);\n  visibility: visible;\n  transition:\n    height var(--accordion-transition-duration)\n      var(--accordion-transition-timing),\n    visibility 0ms linear;\n}\n.accordion__panel-content {\n  padding: var(--alto-sem-space-xs) var(--alto-sem-space-sm)\n    var(--alto-sem-space-2xl);\n}\n\n.accordion[data-expanded='true'] {\n  background-color: var(--alto-sem-color-bg-layer1-default);\n}\n\n.accordion[data-expanded='true'] .accordion__trigger {\n  background-color: var(--alto-sem-color-bg-layer1-default);\n}\n\n/* Hover state */\n.accordion .accordion__trigger[data-hovered] {\n  background-color: var(--alto-sem-color-overlay-state-darken-invert-hover);\n}\n\n/* Focus state */\n.accordion .accordion__trigger[data-focus-visible] {\n  outline: none;\n  box-shadow: 0 0 0 2px var(--alto-sem-color-border-accent);\n}\n\n/* Pressed state */\n.accordion .accordion__trigger[data-pressed] {\n  background-color: var(--alto-sem-color-overlay-state-darken-invert-active);\n  outline: none;\n}\n\n/* Combined states for expanded accordion */\n.accordion[data-expanded='true'] .accordion__trigger[data-hovered] {\n  background-color: var(--alto-sem-color-overlay-state-darken-invert-hover);\n  border-radius: var(--alto-card-radius) var(--alto-card-radius) 0 0;\n}\n\n.accordion .accordion__trigger[data-focused] {\n  outline: none;\n}\n\n/* Disabled state */\n.accordion .accordion__trigger[data-disabled] {\n  cursor: not-allowed;\n  background-color: var(--alto-sem-color-bg-disabled-subtle);\n  color: var(--alto-sem-color-fg-disabled-on-subtle);\n}\n\n.accordion__trigger[data-disabled] .accordion__title,\n.accordion__trigger[data-disabled] .accordion__description {\n  color: var(--alto-sem-color-fg-disabled-on-subtle);\n}\n\n.accordion .accordion__trigger[data-disabled] svg {\n  color: var(--alto-sem-color-fg-disabled-on-subtle);\n}\n\n.accordion[data-disabled] {\n  border-color: var(--alto-sem-color-border-disabled-subtle);\n  background-color: var(--alto-sem-color-bg-disabled-subtle);\n}\n","import React, { ReactElement } from 'react';\nimport {\n  Disclosure as AriaDisclosure,\n  type DisclosureProps as AriaDisclosureProps,\n  Button as AriaButton,\n  DisclosurePanel as AriaDisclosurePanel,\n  DisclosureGroup as AriaDisclosureGroup,\n} from 'react-aria-components';\nimport { Icon } from '../Icon/Icon';\nimport styles from './Accordion.module.css';\n\ntype HeadingLevel = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport interface AccordionProps extends Omit<AriaDisclosureProps, 'children'> {\n  /** The title text displayed in the accordion header */\n  title: string;\n\n  /** Optional description text displayed below the title */\n  description?: string;\n\n  /** Content rendered inside the accordion when expanded */\n  children: React.ReactNode;\n\n  /** Controls if accordion is expanded on initial render */\n  defaultExpanded?: boolean;\n\n  /** Additional CSS class for custom styling */\n  className?: string;\n\n  /**\n   * Content (typically an icon) rendered before the heading.\n   * **Deprecated. Use `Accordion.StartSlot` instead**\n   * @deprecated\n   */\n  titleStart?: React.ReactNode;\n\n  /**\n   * Content (typically an icon) rendered after the heading.\n   * **Deprecated. Use `Accordion.EndSlot` instead**\n   * @deprecated\n   */\n  titleEnd?: React.ReactNode;\n\n  /** Unique identifier for the accordion */\n  id?: string;\n\n  /** The semantic heading level for the accordion title */\n  headingLevel?: HeadingLevel;\n\n  /** Whether the accordion is disabled and cannot be interacted with */\n  isDisabled?: boolean;\n}\n\ninterface AccordionTriggerProps\n  extends Pick<\n    AccordionProps,\n    'title' | 'description' | 'id' | 'headingLevel'\n  > {\n  startSlot?: React.ReactNode;\n  endSlot?: React.ReactNode;\n}\n\nconst AccordionTrigger = ({\n  title,\n  description,\n  startSlot,\n  endSlot,\n  id,\n  headingLevel = 'h3',\n}: AccordionTriggerProps) => {\n  const HeadingElement = headingLevel;\n\n  return (\n    <AriaButton\n      slot=\"trigger\"\n      className={styles.accordion__trigger}\n      {...(id ? { id } : {})}\n    >\n      <span className={styles['accordion__button-content']}>\n        <span className={styles['accordion__title-container']}>\n          {startSlot && (\n            <span className={styles['accordion__start-slot']}>{startSlot}</span>\n          )}\n          <div className={styles['accordion__title-wrapper']}>\n            <HeadingElement className={styles.accordion__title}>\n              {title}\n            </HeadingElement>\n            {description && (\n              <p className={styles.accordion__description}>{description}</p>\n            )}\n          </div>\n        </span>\n        <span className={styles['accordion__end-container']}>\n          {endSlot && (\n            <span className={styles['accordion__end-slot']}>{endSlot}</span>\n          )}\n          <Icon\n            iconName=\"chevron-down\"\n            iconPrefix=\"fas\"\n            className={styles['accordion__icon-wrapper']}\n            color=\"accentSecondary\"\n          />\n        </span>\n      </span>\n    </AriaButton>\n  );\n};\n\nconst AccordionPanel = ({\n  children,\n  ...props\n}: React.ComponentProps<typeof AriaDisclosurePanel>) => {\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  React.useEffect(() => {\n    const content = contentRef.current;\n    if (!content) return;\n\n    // Get the parent group element\n    const group = content.closest('[role=\"group\"]') as HTMLElement;\n    if (!group) return;\n\n    requestAnimationFrame(() => {\n      const height = content.scrollHeight;\n      group.style.setProperty('--group-height', `${height}px`);\n    });\n\n    const updateHeight = () => {\n      const height = content.scrollHeight;\n      group.style.setProperty('--group-height', `${height}px`);\n    };\n\n    updateHeight();\n\n    const resizeObserver = new ResizeObserver(() => {\n      updateHeight();\n    });\n\n    resizeObserver.observe(content);\n    resizeObserver.observe(group);\n\n    window.addEventListener('resize', updateHeight);\n\n    return () => {\n      resizeObserver.disconnect();\n      window.removeEventListener('resize', updateHeight);\n    };\n  }, []);\n\n  return (\n    <AriaDisclosurePanel {...props}>\n      <div ref={contentRef} className={styles['accordion__panel-content']}>\n        {children}\n      </div>\n    </AriaDisclosurePanel>\n  );\n};\n\ninterface SlotProps {\n  children: React.ReactNode;\n}\n\nexport const StartSlot = ({ children }: SlotProps) => <>{children}</>;\nexport const EndSlot = ({ children }: SlotProps) => <>{children}</>;\n\nexport const Accordion = ({\n  title,\n  description,\n  children,\n  defaultExpanded = false,\n  className,\n  titleStart,\n  titleEnd,\n  id,\n  headingLevel = 'h3',\n  ...props\n}: AccordionProps) => {\n  const accordionClasses = [styles.accordion, className]\n    .filter(Boolean)\n    .join(' ');\n\n  // Pick start and end content out of `children`\n  let startSlot = titleStart;\n  let endSlot = titleEnd;\n  const panelContent = React.Children.map(children, (child) => {\n    const childElement = child as ReactElement<SlotProps>;\n\n    if (childElement.type === StartSlot) {\n      startSlot = childElement.props.children;\n      return null;\n    }\n\n    if (childElement.type === EndSlot) {\n      endSlot = childElement.props.children;\n      return null;\n    }\n\n    return childElement;\n  })?.filter(Boolean);\n\n  return (\n    <AriaDisclosure\n      className={accordionClasses}\n      defaultExpanded={defaultExpanded}\n      id={id}\n      {...props}\n    >\n      <AccordionTrigger\n        title={title}\n        description={description}\n        startSlot={startSlot}\n        endSlot={endSlot}\n        id={id}\n        headingLevel={headingLevel}\n      />\n      <AccordionPanel>{panelContent}</AccordionPanel>\n    </AriaDisclosure>\n  );\n};\n\nexport interface AccordionGroupProps {\n  /** Title for the accordion group - can be string or ReactNode */\n  title?: string | React.ReactNode;\n\n  /** Description for the accordion group - can be string or ReactNode */\n  description?: string | React.ReactNode;\n\n  /** Collection of Accordion components */\n  children?: React.ReactNode;\n\n  /** Additional CSS class for custom styling */\n  className?: string;\n\n  /** Whether multiple accordions can be expanded at once */\n  allowsMultipleExpanded?: boolean;\n}\n\nexport const AccordionGroup = ({\n  title,\n  description,\n  children,\n  className,\n  allowsMultipleExpanded = true,\n}: AccordionGroupProps) => {\n  const groupClasses = [styles['accordion-group'], className]\n    .filter(Boolean)\n    .join(' ');\n\n  // Find any children that have defaultExpanded={true}\n  const defaultExpandedKeys = React.Children.toArray(children)\n    .map((child, index) => {\n      if (\n        React.isValidElement(child) &&\n        typeof child.props === 'object' &&\n        child.props !== null &&\n        'defaultExpanded' in child.props &&\n        child.props.defaultExpanded\n      ) {\n        return 'id' in child.props && typeof child.props.id === 'string'\n          ? child.props.id\n          : `accordion-${index}`;\n      }\n      return null;\n    })\n    .filter((key): key is string => key !== null);\n\n  return (\n    <div className={groupClasses}>\n      {(title || description) && (\n        <div className={styles['accordion-group__header']}>\n          {title}\n          {description}\n        </div>\n      )}\n      <AriaDisclosureGroup\n        className={styles['accordion-group__stack']}\n        allowsMultipleExpanded={allowsMultipleExpanded}\n        defaultExpandedKeys={defaultExpandedKeys}\n      >\n        {React.Children.map(children, (child, index) => {\n          if (React.isValidElement<AccordionProps>(child)) {\n            return React.cloneElement(child, {\n              key: `accordion-${index}`,\n              id: child.props?.id || `accordion-${index}`,\n            } as Partial<AccordionProps>);\n          }\n          return child;\n        })}\n      </AriaDisclosureGroup>\n    </div>\n  );\n};\n\nAccordion.StartSlot = StartSlot;\nAccordion.EndSlot = EndSlot;\nStartSlot.displayName = 'Accordion.StartSlot';\nEndSlot.displayName = 'Accordion.EndSlot';\n\nexport default Accordion;\n"],"mappings":"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"}

package/dist/AppBannerSection-DDXD31a-.js

@@ -0,0 +1,3 @@
+import{t as a}from"./Link-CvZnzAx_.js";import{n as e}from"./Heading-DFWOvlGq.js";import{t as n}from"./Paragraph-ByacJXSw.js";import{t as i}from"./Section-DoSIu1Ky.js";import t from"react";import{jsx as l,jsxs as p}from"react/jsx-runtime";import './assets/AppBannerSection.css';var s="_app-banner-section_1ixwj_1",d="_app-banner-section__content_1ixwj_23",r="_app-banner-section__content-text_1ixwj_59",o="_app-banner-section__links_1ixwj_72",c=({customAsset:e,...n})=>e?/* @__PURE__ */l("span",{"data-app-banner-slot":"app-media",children:/* @__PURE__ */l(a,{inline:!0,"data-app-banner-link":!0,...n,children:/* @__PURE__ */l("span",{"data-app-banner-asset":!0,children:e})})}):null,m=({customAsset:e,...n})=>e?/* @__PURE__ */l("span",{"data-app-banner-slot":"qr-code",children:/* @__PURE__ */l(a,{inline:!0,"data-app-banner-link":!0,...n,children:/* @__PURE__ */l("span",{"data-app-banner-asset":!0,children:e})})}):null,h=({customAsset:e,...n})=>e?/* @__PURE__ */l("span",{"data-app-banner-slot":"app-store-badge",children:/* @__PURE__ */l(a,{inline:!0,"data-app-banner-link":!0,...n,children:/* @__PURE__ */l("span",{"data-app-banner-asset":!0,children:e})})}):null,b=({customAsset:e,...n})=>e?/* @__PURE__ */l("span",{"data-app-banner-slot":"google-play-badge",children:/* @__PURE__ */l(a,{inline:!0,"data-app-banner-link":!0,...n,children:/* @__PURE__ */l("span",{"data-app-banner-asset":!0,children:e})})}):null,g=({children:a,"data-testid":g,title:_,headingLevel:u="h2",description:A})=>{const y=t.Children.toArray(a),f=y.find(a=>t.isValidElement(a)&&a.type===c),x=y.find(a=>t.isValidElement(a)&&a.type===m),j=y.find(a=>t.isValidElement(a)&&a.type===h),B=y.find(a=>t.isValidElement(a)&&a.type===b),N=f&&t.isValidElement(f)?f:null,E=x&&t.isValidElement(x)?x:null,S=j&&t.isValidElement(j)?j:null,V=B&&t.isValidElement(B)?B:null;/* @__PURE__ */
+return l(i,{containerMaxWidth:"page",paddingX:"default",paddingY:"default","data-testid":g,children:/* @__PURE__ */l(i.Container,{children:/* @__PURE__ */p("div",{className:s,children:[/* @__PURE__ */p("div",{className:d,children:[N,/* @__PURE__ */p("div",{className:r,children:[/* @__PURE__ */l(e,{as:u,size:"xxs",children:_}),/* @__PURE__ */l(n,{size:"md",textAlign:{base:"center",lg:"start"},children:A})]})]}),/* @__PURE__ */p("div",{className:o,children:[E,S,V]})]})})})};g.AppMedia=c,g.QRCode=m,g.AppStoreBadge=h,g.GooglePlayBadge=b,g.displayName="AppBannerSection",c.displayName="AppBannerSection.AppMedia",m.displayName="AppBannerSection.QRCode",h.displayName="AppBannerSection.AppStoreBadge",b.displayName="AppBannerSection.GooglePlayBadge";export{m as a,b as i,c as n,h as r,g as t};
+//# sourceMappingURL=AppBannerSection-DDXD31a-.js.map

package/dist/AppBannerSection-DDXD31a-.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppBannerSection-DDXD31a-.js","names":[],"sources":["../src/components/AppBannerSection/AppBannerSection.module.css","../src/components/AppBannerSection/AppBannerSection.tsx"],"sourcesContent":[".app-banner-section {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  align-self: stretch;\n  width: 100%;\n  background: var(--alto-sem-color-bg-layer2-default);\n  border-radius: var(--alto-card-radius);\n  border: var(--alto-sem-border-width-sm) solid\n    var(--alto-sem-color-border-secondary);\n  padding: var(--alto-sem-space-md);\n  gap: var(--alto-sem-space-sm);\n  box-shadow:\n    0 1px 2px 0 var(--alto-shadow-ink-400),\n    0 4px 8px 0 var(--alto-shadow-ink-400);\n  @media (--bp-lg) {\n    flex-direction: row;\n    padding: var(--alto-sem-space-lg);\n    gap: 0;\n  }\n}\n\n.app-banner-section__content {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  @media (--bp-lg) {\n    flex-direction: row;\n  }\n}\n\n@media (--bp-lg) {\n  .app-banner-section__content::after {\n    content: '';\n    display: block;\n    width: 1px;\n    height: 70px;\n    background: var(--alto-sem-color-border-tertiary);\n  }\n}\n\n.app-banner-section [data-app-banner-link],\n.app-banner-section [data-app-banner-asset] {\n  display: inline-flex;\n  width: 100%;\n  height: 100%;\n}\n\n.app-banner-section__content [data-app-banner-slot='app-media'] {\n  display: inline-flex;\n  width: 76px;\n  height: 76px;\n  margin-bottom: var(--alto-sem-space-md);\n  @media (--bp-lg) {\n    margin-bottom: 0;\n  }\n}\n\n.app-banner-section__content-text {\n  display: flex;\n  flex-direction: column;\n  gap: var(--alto-sem-space-2xs);\n  align-items: center;\n  @media (--bp-lg) {\n    gap: 0;\n    align-items: flex-start;\n    margin-left: var(--alto-sem-space-md);\n    padding-right: var(--alto-sem-space-3xl);\n  }\n}\n\n.app-banner-section__links {\n  display: flex;\n  gap: var(--alto-sem-space-sm);\n  align-items: center;\n  @media (--bp-lg) {\n    padding-left: var(--alto-sem-space-3xl);\n  }\n}\n\n.app-banner-section__links [data-app-banner-slot='qr-code'] {\n  display: none;\n  width: 70px;\n  height: 70px;\n  flex-shrink: 0;\n  @media (--bp-md) {\n    display: inline-flex;\n  }\n}\n\n.app-banner-section__links [data-app-banner-slot='app-store-badge'] {\n  width: 120px;\n  height: 40px;\n  display: inline-flex;\n  flex-shrink: 0;\n}\n\n.app-banner-section__links [data-app-banner-slot='google-play-badge'] {\n  width: 135px;\n  height: 40px;\n  display: inline-flex;\n  flex-shrink: 0;\n}\n","import React from 'react';\nimport styles from './AppBannerSection.module.css';\nimport Link, { type LinkProps } from '../Link';\nimport Heading from '../Heading';\nimport Paragraph from '../Paragraph';\nimport Section from '../Section';\n\nexport type AppBannerLinkProps = Omit<LinkProps, 'children' | 'inline'> & {\n  /**\n   * All AppBannerSection subcomponents are rendered inside the design-system Link component,\n   * so Link props like href/target/isDisabled are supported here.\n   */\n  /** Custom asset (image/SVG) to render inside the link */\n  customAsset?: React.ReactNode;\n  /** @ignore Always controlled by AppBannerSection slots. */\n  children?: never;\n  /** @ignore Always enabled for banner assets. */\n  inline?: never;\n};\n\nexport type AppBannerSectionMediaProps = AppBannerLinkProps;\n\nexport type AppBannerSectionLinkProps = AppBannerLinkProps;\n\nexport interface AppBannerSectionProps {\n  /** Optional compound subcomponents */\n  children?: React.ReactNode;\n  /** Main heading text for the banner. */\n  title: string;\n  /** Semantic heading level for the title.\n   * @default 'h2'\n   */\n  headingLevel?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n  /** Supporting text rendered below the heading. */\n  description: string;\n  /** Test identifier for testing purposes. */\n  'data-testid'?: string;\n}\n\ninterface AppBannerSectionComponent extends React.FC<AppBannerSectionProps> {\n  AppMedia: React.FC<AppBannerSectionMediaProps>;\n  QRCode: React.FC<AppBannerSectionLinkProps>;\n  AppStoreBadge: React.FC<AppBannerSectionLinkProps>;\n  GooglePlayBadge: React.FC<AppBannerSectionLinkProps>;\n}\n\nexport const AppBannerSectionAppMedia = ({\n  customAsset,\n  ...linkProps\n}: AppBannerSectionMediaProps) => {\n  if (!customAsset) {\n    return null;\n  }\n\n  return (\n    <span data-app-banner-slot=\"app-media\">\n      <Link inline data-app-banner-link {...linkProps}>\n        <span data-app-banner-asset>{customAsset}</span>\n      </Link>\n    </span>\n  );\n};\n\nexport const AppBannerSectionQRCode = ({\n  customAsset,\n  ...linkProps\n}: AppBannerSectionLinkProps) => {\n  if (!customAsset) {\n    return null;\n  }\n\n  return (\n    <span data-app-banner-slot=\"qr-code\">\n      <Link inline data-app-banner-link {...linkProps}>\n        <span data-app-banner-asset>{customAsset}</span>\n      </Link>\n    </span>\n  );\n};\n\nexport const AppBannerSectionAppStoreBadge = ({\n  customAsset,\n  ...linkProps\n}: AppBannerSectionLinkProps) => {\n  if (!customAsset) {\n    return null;\n  }\n\n  return (\n    <span data-app-banner-slot=\"app-store-badge\">\n      <Link inline data-app-banner-link {...linkProps}>\n        <span data-app-banner-asset>{customAsset}</span>\n      </Link>\n    </span>\n  );\n};\n\nexport const AppBannerSectionGooglePlayBadge = ({\n  customAsset,\n  ...linkProps\n}: AppBannerSectionLinkProps) => {\n  if (!customAsset) {\n    return null;\n  }\n\n  return (\n    <span data-app-banner-slot=\"google-play-badge\">\n      <Link inline data-app-banner-link {...linkProps}>\n        <span data-app-banner-asset>{customAsset}</span>\n      </Link>\n    </span>\n  );\n};\n\nexport const AppBannerSection = (({\n  children,\n  'data-testid': dataTestId,\n  title,\n  headingLevel = 'h2',\n  description,\n}: AppBannerSectionProps) => {\n  const childComponents = React.Children.toArray(children);\n\n  const mediaChild = childComponents.find(\n    (child) =>\n      React.isValidElement<AppBannerSectionMediaProps>(child) &&\n      child.type === AppBannerSectionAppMedia,\n  );\n\n  const qrCodeChild = childComponents.find(\n    (child) =>\n      React.isValidElement<AppBannerSectionLinkProps>(child) &&\n      child.type === AppBannerSectionQRCode,\n  );\n\n  const appStoreBadgeChild = childComponents.find(\n    (child) =>\n      React.isValidElement<AppBannerSectionLinkProps>(child) &&\n      child.type === AppBannerSectionAppStoreBadge,\n  );\n\n  const googlePlayBadgeChild = childComponents.find(\n    (child) =>\n      React.isValidElement<AppBannerSectionLinkProps>(child) &&\n      child.type === AppBannerSectionGooglePlayBadge,\n  );\n\n  const mediaNode =\n    mediaChild && React.isValidElement<AppBannerSectionMediaProps>(mediaChild)\n      ? mediaChild\n      : null;\n\n  const qrCodeNode =\n    qrCodeChild && React.isValidElement<AppBannerSectionLinkProps>(qrCodeChild)\n      ? qrCodeChild\n      : null;\n\n  const appStoreBadgeNode =\n    appStoreBadgeChild &&\n    React.isValidElement<AppBannerSectionLinkProps>(appStoreBadgeChild)\n      ? appStoreBadgeChild\n      : null;\n\n  const googlePlayBadgeNode =\n    googlePlayBadgeChild &&\n    React.isValidElement<AppBannerSectionLinkProps>(googlePlayBadgeChild)\n      ? googlePlayBadgeChild\n      : null;\n\n  return (\n    <Section\n      containerMaxWidth=\"page\"\n      paddingX=\"default\"\n      paddingY=\"default\"\n      data-testid={dataTestId}\n    >\n      <Section.Container>\n        <div className={styles['app-banner-section']}>\n          <div className={styles['app-banner-section__content']}>\n            {mediaNode}\n            <div className={styles['app-banner-section__content-text']}>\n              <Heading as={headingLevel} size=\"xxs\">\n                {title}\n              </Heading>\n              <Paragraph size=\"md\" textAlign={{ base: 'center', lg: 'start' }}>\n                {description}\n              </Paragraph>\n            </div>\n          </div>\n\n          <div className={styles['app-banner-section__links']}>\n            {qrCodeNode}\n            {appStoreBadgeNode}\n            {googlePlayBadgeNode}\n          </div>\n        </div>\n      </Section.Container>\n    </Section>\n  );\n}) as AppBannerSectionComponent;\n\nAppBannerSection.AppMedia = AppBannerSectionAppMedia;\nAppBannerSection.QRCode = AppBannerSectionQRCode;\nAppBannerSection.AppStoreBadge = AppBannerSectionAppStoreBadge;\nAppBannerSection.GooglePlayBadge = AppBannerSectionGooglePlayBadge;\n\nAppBannerSection.displayName = 'AppBannerSection';\nAppBannerSectionAppMedia.displayName = 'AppBannerSection.AppMedia';\nAppBannerSectionQRCode.displayName = 'AppBannerSection.QRCode';\nAppBannerSectionAppStoreBadge.displayName = 'AppBannerSection.AppStoreBadge';\nAppBannerSectionGooglePlayBadge.displayName =\n  'AppBannerSection.GooglePlayBadge';\n\nexport default AppBannerSection;\n"],"mappings":"mZC8Ca,EAAA,EACX,iBACG,KAEE,iBAKH,EAAC,OAAD,CAAM,uBAAqB,oCACzB,EAAC,EAAD,CAAM,QAAA,EAAO,wBAAA,KAAyB,0BACpC,EAAC,OAAD,CAAM,yBAAA,WAAuB,QAN1B,KAYE,EAAA,EACX,iBACG,KAEE,iBAKH,EAAC,OAAD,CAAM,uBAAqB,kCACzB,EAAC,EAAD,CAAM,QAAA,EAAO,wBAAA,KAAyB,0BACpC,EAAC,OAAD,CAAM,yBAAA,WAAuB,QAN1B,KAYE,EAAA,EACX,iBACG,KAEE,iBAKH,EAAC,OAAD,CAAM,uBAAqB,0CACzB,EAAC,EAAD,CAAM,QAAA,EAAO,wBAAA,KAAyB,0BACpC,EAAC,OAAD,CAAM,yBAAA,WAAuB,QAN1B,KAYE,EAAA,EACX,iBACG,KAEE,iBAKH,EAAC,OAAD,CAAM,uBAAqB,4CACzB,EAAC,EAAD,CAAM,QAAA,EAAO,wBAAA,KAAyB,0BACpC,EAAC,OAAD,CAAM,yBAAA,WAAuB,QAN1B,KAYE,EAAA,EACX,WACA,cAAe,EACf,QACA,eAAe,KACf,kBAEA,MAAM,EAAkB,EAAM,SAAS,QAAQ,GAEzC,EAAa,EAAgB,KAChC,GACC,EAAM,eAA2C,IACjD,EAAM,OAAS,GAGb,EAAc,EAAgB,KACjC,GACC,EAAM,eAA0C,IAChD,EAAM,OAAS,GAGb,EAAqB,EAAgB,KACxC,GACC,EAAM,eAA0C,IAChD,EAAM,OAAS,GAGb,EAAuB,EAAgB,KAC1C,GACC,EAAM,eAA0C,IAChD,EAAM,OAAS,GAGb,EACJ,GAAc,EAAM,eAA2C,GAC3D,EACA,KAEA,EACJ,GAAe,EAAM,eAA0C,GAC3D,EACA,KAEA,EACJ,GACA,EAAM,eAA0C,GAC5C,EACA,KAEA,EACJ,GACA,EAAM,eAA0C,GAC5C,EACA;AAEN,OACE,EAAC,EAAD,CACE,kBAAkB,OAClB,SAAS,UACT,SAAS,UACT,cAAa,0BAEb,EAAC,EAAQ,UAAT,CAAA,wBACE,EAAC,MAAD,CAAK,UAAW,WAAhB,gBACE,EAAC,MAAD,CAAK,UAAW,WAAhB,CACG,iBACD,EAAC,MAAD,CAAK,UAAW,WAAhB,gBACE,EAAC,EAAD,CAAS,GAAI,EAAc,KAAK,eAC7B,mBAEH,EAAC,EAAD,CAAW,KAAK,KAAK,UAAW,CAAE,KAAM,SAAU,GAAI,kBACnD,yBAKP,EAAC,MAAD,CAAK,UAAW,WAAhB,CACG,EACA,EACA,WAMb,EAEA,EAAiB,SAAW,EAC5B,EAAiB,OAAS,EAC1B,EAAiB,cAAgB,EACjC,EAAiB,gBAAkB,EAEnC,EAAiB,YAAc,mBAC/B,EAAyB,YAAc,4BACvC,EAAuB,YAAc,0BACrC,EAA8B,YAAc,iCAC5C,EAAgC,YAC9B"}

package/dist/AutoplayControl-BJRqecwg.js

@@ -0,0 +1,3 @@
+import{t as e}from"./Icon-DweSiH3B.js";import{t}from"./focusStyles-BA5rd0UP.js";import{r as a,t as r}from"./IconButton.module-KzgIkEZS.js";import{useRef as o,useState as s}from"react";import{jsx as n}from"react/jsx-runtime";import{useFocusRing as i}from"@react-aria/focus";import './assets/AutoplayControl.css';var u={autoplayControl:"_autoplayControl_kk1sb_1",iconButton:"_iconButton_kk1sb_17",sizeMd:"_sizeMd_kk1sb_25",sizeSm:"_sizeSm_kk1sb_31",neutralVibrant:"_neutralVibrant_kk1sb_38",whiteVibrant:"_whiteVibrant_kk1sb_44",neutralSubtle:"_neutralSubtle_kk1sb_55",whiteSubtle:"_whiteSubtle_kk1sb_61"},l=({variant:l="neutralVibrant",size:c="md",focusStyle:d="default",className:b="",buttonClassName:p="",onPress:_})=>{const{isFocusVisible:m,focusProps:f,isFocused:k}=i(),[v,h]=s(!1),[y,S]=s(!1),w=o(null),V=u[l]||"",$="md"===c?"1.25x":"1x",z=()=>{switch(l){case"whiteVibrant":default:return"whiteOnVibrant";case"whiteSubtle":return"whiteOnSubtle";case"neutralVibrant":return"inverseOnVibrant";case"neutralSubtle":return"inverseOnSubtle"}},x=e=>e?"Pause slideshow":"Start slideshow";/* @__PURE__ */
+return n(a,{className:`${u.autoplayControl} ${u[`size${c.toUpperCase()}`]} ${V} ${b||""}`,...f,onMouseEnter:()=>h(!0),onMouseLeave:()=>{h(!1),S(!1)},onMouseDown:()=>S(!0),onMouseUp:()=>S(!1),onKeyDown:e=>{" "!==e.key&&"Enter"!==e.key||(e.preventDefault(),S(!0))},onKeyUp:e=>{" "!==e.key&&"Enter"!==e.key||(e.preventDefault(),S(!1),w.current&&w.current.click())},"data-hovered":!!v||void 0,"data-pressed":!!y||void 0,"data-focused":!!k||void 0,"data-size":c,tabIndex:0,role:"button",children:({autoplayUserPreference:a})=>/* @__PURE__ */n("div",{ref:w,className:`${u.iconButton} ${r.iconButton} ${r[c]||""} ${t({focusStyle:d})} ${p||""}`,"data-focused":!!k||void 0,"data-focus-visible":!!m||void 0,"data-parent-hovered":!!v||void 0,"data-parent-pressed":!!y||void 0,"data-size":c,"aria-hidden":"true",title:x(a),onClick:()=>{_&&_(a?"pause":"play")},children:/* @__PURE__ */n(e,{iconPrefix:"fas",iconName:a?"pause":"play",color:z(),iconSize:$,"aria-hidden":"true"})})})};export{l as t};
+//# sourceMappingURL=AutoplayControl-BJRqecwg.js.map

package/dist/AutoplayControl-BJRqecwg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoplayControl-BJRqecwg.js","names":[],"sources":["../src/components/Carousel/AutoplayControl/AutoplayControl.module.css","../src/components/Carousel/AutoplayControl/AutoplayControl.tsx"],"sourcesContent":[".autoplayControl {\n  position: relative;\n  z-index: 10;\n  pointer-events: auto;\n  background: none;\n  border: none;\n  padding: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  /* Ensure the control has a minimum size */\n  min-width: 40px;\n  min-height: 40px;\n}\n\n/* Base icon button */\n.autoplayControl .iconButton {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);\n}\n\n/* Size variants */\n.autoplayControl.sizeMd,\n.autoplayControl.sizeMd .iconButton {\n  width: 48px;\n  height: 48px;\n}\n\n.autoplayControl.sizeSm,\n.autoplayControl.sizeSm .iconButton {\n  width: 36px;\n  height: 36px;\n}\n\n/* Vibrant Variants */\n.autoplayControl.neutralVibrant .iconButton {\n  background-color: var(--alto-sem-color-fg-inverse-on-subtle);\n  border-radius: var(--alto-sem-radius-circle, 50%);\n  color: var(--alto-sem-color-fg-inverse-on-vibrant);\n}\n\n.autoplayControl.whiteVibrant .iconButton {\n  background-color: var(--alto-sem-color-fg-white-primary);\n  border-radius: var(--alto-sem-radius-circle, 50%);\n  color: var(--alto-sem-color-fg-white-on-vibrant);\n}\n\n.autoplayControl.whiteVibrant .iconButton[data-focused] {\n  outline-color: var(--alto-sem-color-border-white);\n}\n\n/* Subtle Variants */\n.autoplayControl.neutralSubtle .iconButton {\n  background-color: var(--alto-sem-color-fg-inverse-primary);\n  border-radius: var(--alto-sem-radius-circle, 50%);\n  color: var(--alto-sem-color-fg-inverse-on-subtle);\n}\n\n.autoplayControl.whiteSubtle .iconButton {\n  background-color: rgba(0, 0, 0, 0.5);\n  border-radius: var(--alto-sem-radius-circle, 50%);\n  color: var(--alto-sem-color-fg-white-on-subtle);\n}\n\n.autoplayControl.whiteSubtle .iconButton[data-focused] {\n  outline-color: var(--alto-sem-color-border-white);\n}\n","import { useState, useRef } from 'react';\nimport { CarouselAutoplayControl as AriaAutoplayControl } from 'react-aria-carousel';\nimport { useFocusRing } from '@react-aria/focus';\nimport styles from './AutoplayControl.module.css';\nimport iconButtonStyles from '../../IconButton/IconButton.module.css';\nimport { Icon } from '../../Icon/Icon';\nimport { focusStyleVariants } from '../../../utils/focus/focusStyles';\n\nexport interface AutoplayControlProps {\n  /**\n   * Focus style\n   * @default 'default'\n   */\n  focusStyle?: 'default' | 'white';\n\n  /**\n   * Style variant of the button\n   * @default 'neutralVibrant'\n   */\n  variant?: 'neutralVibrant' | 'neutralSubtle' | 'whiteVibrant' | 'whiteSubtle';\n\n  /**\n   * Size of the button\n   * @default 'md'\n   */\n  size?: 'sm' | 'md';\n\n  /**\n   * Additional CSS class name for the container\n   */\n  className?: string;\n\n  /**\n   * Additional CSS class name for the button\n   */\n  buttonClassName?: string;\n\n  /**\n   * Callback fired when the autoplay button is pressed\n   */\n  onPress?: (state: 'play' | 'pause') => void;\n}\n\nexport const AutoplayControl = ({\n  variant = 'neutralVibrant',\n  size = 'md',\n  focusStyle = 'default',\n  className = '',\n  buttonClassName = '',\n  onPress,\n}: AutoplayControlProps) => {\n  const { isFocusVisible, focusProps, isFocused } = useFocusRing();\n  const [isHovered, setIsHovered] = useState(false);\n  const [isPressed, setIsPressed] = useState(false);\n  const innerDivRef = useRef<HTMLDivElement>(null);\n\n  // Generate CSS class based on variant\n  const variantClass = styles[variant] || '';\n\n  // Map button size to icon size:\n  // - 'md' button uses '1.25x' icon\n  // - 'sm' button uses '1x' icon\n  const iconSize = size === 'md' ? '1.25x' : '1x';\n\n  // Determine the icon color based on variant\n  const getIconColor = () => {\n    switch (variant) {\n      case 'whiteVibrant':\n        return 'whiteOnVibrant';\n      case 'whiteSubtle':\n        return 'whiteOnSubtle';\n      case 'neutralVibrant':\n        return 'inverseOnVibrant';\n      case 'neutralSubtle':\n        return 'inverseOnSubtle';\n      default:\n        return 'whiteOnVibrant';\n    }\n  };\n\n  // Handle keyboard events for better accessibility\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    // Prevent default behavior for space and enter to avoid double-triggering\n    if (e.key === ' ' || e.key === 'Enter') {\n      e.preventDefault();\n      setIsPressed(true);\n    }\n  };\n\n  const handleKeyUp = (e: React.KeyboardEvent) => {\n    // Trigger the action on keyboard release\n    if (e.key === ' ' || e.key === 'Enter') {\n      e.preventDefault();\n      setIsPressed(false);\n\n      // Programmatically click the inner div to trigger the carousel's autoplay toggle\n      if (innerDivRef.current) {\n        innerDivRef.current.click();\n      }\n    }\n  };\n\n  // Get title attribute for tooltip\n  const getTitle = (autoplayUserPreference: boolean) => {\n    return autoplayUserPreference ? 'Pause slideshow' : 'Start slideshow';\n  };\n\n  return (\n    <AriaAutoplayControl\n      className={`${styles.autoplayControl} ${styles[`size${size.toUpperCase()}`]} ${variantClass} ${className || ''}`}\n      {...focusProps}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => {\n        setIsHovered(false);\n        setIsPressed(false); // Reset pressed state on mouse leave\n      }}\n      onMouseDown={() => setIsPressed(true)}\n      onMouseUp={() => setIsPressed(false)}\n      onKeyDown={handleKeyDown}\n      onKeyUp={handleKeyUp}\n      data-hovered={isHovered ? true : undefined}\n      data-pressed={isPressed ? true : undefined}\n      data-focused={isFocused ? true : undefined}\n      data-size={size}\n      tabIndex={0} // Ensure it's in the tab order\n      role=\"button\"\n    >\n      {({ autoplayUserPreference }) => {\n        return (\n          <div\n            ref={innerDivRef}\n            className={`${styles.iconButton} ${iconButtonStyles.iconButton} ${iconButtonStyles[size] || ''} ${focusStyleVariants({ focusStyle })} ${buttonClassName || ''}`}\n            data-focused={isFocused ? true : undefined}\n            data-focus-visible={isFocusVisible ? true : undefined}\n            data-parent-hovered={isHovered ? true : undefined}\n            data-parent-pressed={isPressed ? true : undefined}\n            data-size={size}\n            aria-hidden=\"true\" // Hide from screen readers since parent has the semantics\n            title={getTitle(autoplayUserPreference)}\n            onClick={() => {\n              if (onPress) {\n                // Pass the action being taken based on the current icon shown\n                onPress(autoplayUserPreference ? 'pause' : 'play');\n              }\n            }}\n          >\n            <Icon\n              iconPrefix=\"fas\"\n              iconName={autoplayUserPreference ? 'pause' : 'play'}\n              color={getIconColor()}\n              iconSize={iconSize}\n              aria-hidden=\"true\"\n            />\n          </div>\n        );\n      }}\n    </AriaAutoplayControl>\n  );\n};\n\nexport default AutoplayControl;\n"],"mappings":"sjBC2Ca,EAAA,EACX,UAAU,iBACV,OAAO,KACP,aAAa,UACb,YAAY,GACZ,kBAAkB,GAClB,cAEA,MAAM,eAAE,EAAA,WAAgB,EAAA,UAAY,GAAc,KAC3C,EAAW,GAAgB,GAAS,IACpC,EAAW,GAAgB,GAAS,GACrC,EAAc,EAAuB,MAGrC,EAAe,EAAO,IAAY,GAKlC,EAAoB,OAAT,EAAgB,QAAU,KAGrC,EAAA,KACJ,OAAQ,GACN,IAAK,eAQL,QACE,MAAO,iBAPT,IAAK,cACH,MAAO,gBACT,IAAK,iBACH,MAAO,mBACT,IAAK,gBACH,MAAO,oBA6BP,EAAY,GACT,EAAyB,kBAAoB;AAGtD,OACE,EAAC,EAAD,CACE,UAAW,GAAG,EAAO,mBAAmB,EAAO,OAAO,EAAK,oBAAoB,KAAgB,GAAa,QACxG,EACJ,aAAA,IAAoB,GAAa,GACjC,aAAA,KACE,GAAa,GACb,GAAa,IAEf,YAAA,IAAmB,GAAa,GAChC,UAAA,IAAiB,GAAa,GAC9B,UArCmB,IAEP,MAAV,EAAE,KAAyB,UAAV,EAAE,MACrB,EAAE,iBACF,GAAa,KAkCb,QA9BiB,IAEL,MAAV,EAAE,KAAyB,UAAV,EAAE,MACrB,EAAE,iBACF,GAAa,GAGT,EAAY,SACd,EAAY,QAAQ,UAuBtB,iBAAc,QAAmB,EACjC,iBAAc,QAAmB,EACjC,iBAAc,QAAmB,EACjC,YAAW,EACX,SAAU,EACV,KAAK,oBAED,2CAEA,EAAC,MAAD,CACE,IAAK,EACL,UAAW,GAAG,EAAO,cAAc,EAAiB,cAAc,EAAiB,IAAS,MAAM,EAAmB,CAAE,kBAAiB,GAAmB,KAC3J,iBAAc,QAAmB,EACjC,uBAAoB,QAAwB,EAC5C,wBAAqB,QAAmB,EACxC,wBAAqB,QAAmB,EACxC,YAAW,EACX,cAAY,OACZ,MAAO,EAAS,GAChB,QAAA,KACM,GAEF,EAAQ,EAAyB,QAAU,iCAI/C,EAAC,EAAD,CACE,WAAW,MACX,SAAU,EAAyB,QAAU,OAC7C,MAAO,IACG,WACV,cAAY"}

package/dist/AviosBadge-Xyq3HDcQ.js

@@ -0,0 +1,4 @@
+import{t as a}from"./AviosCurrencySymbol-C10fgzsk.js";import{t as e}from"./Badge-C0IfwYZq.js";import s from"react";import{Fragment as t,jsx as n,jsxs as l}from"react/jsx-runtime";import './assets/AviosBadge.css';var i={aviosBadge:"_aviosBadge_a9p4a_1",collect:"_collect_a9p4a_13",spend:"_spend_a9p4a_18",content:"_content_a9p4a_23",points:"_points_a9p4a_30",label:"_label_a9p4a_31",textEnd:"_textEnd_a9p4a_37",sm:"_sm_a9p4a_43",lg:"_lg_a9p4a_48"},c=({kind:s="collect",size:c="md",textEnd:o,points:r,children:p,ariaLabel:d,className:_,...m})=>{const g=r.toLocaleString(),h=`${s} ${g} ${p||"Avios"} ${o||""}`.trim(),x={sm:"18px",md:"20px",lg:"24px"};/* @__PURE__ */
+return l(e,{styleVariant:"collect"===s?"success":"info",size:"lg"===c?"md":c,ariaLabel:d||h,className:`${i.aviosBadge} ${i[c]}  ${i[s]} ${_||""}`,...m,children:[/* @__PURE__ */n(a,{kind:s,styleVariant:"collect"===s?"onCollect":"onSpend",width:x[c],height:x[c],"aria-hidden":"true","data-testid":"avios-currency-symbol"}),/* @__PURE__ */l("span",{className:i.content,children:[
+/* @__PURE__ */n("span",{className:i.points,children:g}),p&&/* @__PURE__ */n("span",{className:i.label,children:p}),o&&/* @__PURE__ */l(t,{children:[/* @__PURE__ */n("span",{className:i.plusSign,children:"+"}),/* @__PURE__ */n("span",{className:i.textEnd,children:o})]})]})]})};export{c as t};
+//# sourceMappingURL=AviosBadge-Xyq3HDcQ.js.map

package/dist/AviosBadge-Xyq3HDcQ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AviosBadge-Xyq3HDcQ.js","names":[],"sources":["../src/components/AviosBadge/AviosBadge.module.css","../src/components/AviosBadge/AviosBadge.tsx"],"sourcesContent":[".aviosBadge {\n  display: inline-flex;\n  align-items: center;\n  border-radius: var(--alto-sem-radius-circle);\n  padding: var(--alto-sem-space-4xs) var(--alto-sem-space-xs);\n  gap: var(--alto-sem-space-5xs);\n  color: var(--alto-sem-color-fg-collect-on-vibrant-default);\n  height: 28px;\n  box-sizing: border-box;\n  line-height: var(--alto-sem-text-label-md-line-height);\n}\n\n.collect {\n  background-color: var(--alto-sem-color-bg-collect-vibrant-default);\n  color: var(--alto-sem-color-fg-collect-on-vibrant-default);\n}\n\n.spend {\n  background-color: var(--alto-sem-color-bg-spend-vibrant-default);\n  color: var(--alto-sem-color-fg-spend-on-vibrant-default);\n}\n\n.content {\n  align-items: center;\n  display: inline-flex;\n  gap: var(--alto-sem-space-5xs);\n  padding-right: var(--alto-sem-space-5xs);\n}\n\n.points,\n.label {\n  font-family: var(--alto-sem-text-heading-font-family);\n  font-size: var(--alto-sem-text-label-md-font-size);\n  font-weight: var(--alto-sem-text-heading-xs-font-weight);\n}\n\n.textEnd {\n  font-size: var(--alto-sem-text-body-xs-font-size);\n  line-height: var(--alto-sem-text-body-xs-line-height);\n}\n\n/* Sizes override */\n.sm {\n  height: 22px;\n  padding: var(--alto-sem-space-5xs) var(--alto-sem-space-2xs);\n}\n\n.lg {\n  height: 32px;\n}\n\n.sm .points {\n  font-size: var(--alto-sem-text-label-sm-font-size);\n  line-height: var(--alto-sem-text-label-sm-line-height);\n}\n\n.sm .textEnd {\n  font-size: var(--alto-sem-text-label-2xs-font-size);\n}\n\n.lg .points {\n  font-size: var(--alto-sem-text-label-lg-font-size);\n  line-height: var(--alto-sem-text-label-lg-line-height);\n}\n\n.lg .textEnd {\n  font-size: var(--alto-sem-text-body-sm-font-size);\n}\n","// Deprecated: This component is deprecated and should not be used in new development. Please use the new Avios Currency Badge component instead\nimport React from 'react';\nimport { Badge, BadgeProps } from '../Badge/Badge';\nimport { AviosCurrencySymbol } from '../AviosCurrencySymbol/AviosCurrencySymbol';\nimport styles from './AviosBadge.module.css';\n\ntype AviosBadgeKind = 'collect' | 'spend';\nexport interface AviosBadgeProps extends Omit<BadgeProps, 'variant' | 'size'> {\n  /**\n   * The kind of Avios badge (collect or spend)\n   * @default 'collect'\n   */\n  kind?: AviosBadgeKind;\n\n  /**\n   * Additional text to be displayed at the end of the badge\n   */\n  textEnd?: string;\n\n  /**\n   * Number of Avios points\n   */\n  points: number;\n\n  /**\n   * Optional label text\n   */\n  children?: React.ReactNode;\n\n  /**\n   * Size of the badge\n   * @default 'md'\n   */\n  size?: 'sm' | 'md' | 'lg';\n\n  /**\n   * A string representation of the badge's contents, used for accessibility\n   * Example: \"Collect 50,000 Avios points\"\n   */\n  ariaLabel?: string;\n}\n\nexport const AviosBadge = ({\n  kind = 'collect',\n  size = 'md',\n  textEnd,\n  points,\n  children,\n  ariaLabel,\n  className,\n  ...props\n}: AviosBadgeProps) => {\n  const formattedPoints = points.toLocaleString();\n\n  const defaultAriaLabel =\n    `${kind} ${formattedPoints} ${children || 'Avios'} ${textEnd || ''}`.trim();\n\n  const iconSizes = {\n    sm: '18px',\n    md: '20px',\n    lg: '24px',\n  };\n\n  const badgeSize = size === 'lg' ? 'md' : size;\n\n  return (\n    <Badge\n      styleVariant={kind === 'collect' ? 'success' : 'info'}\n      size={badgeSize}\n      ariaLabel={ariaLabel || defaultAriaLabel}\n      className={`${styles.aviosBadge} ${styles[size]}  ${styles[kind]} ${className || ''}`}\n      {...props}\n    >\n      <AviosCurrencySymbol\n        kind={kind}\n        styleVariant={kind === 'collect' ? 'onCollect' : 'onSpend'}\n        width={iconSizes[size]}\n        height={iconSizes[size]}\n        aria-hidden=\"true\"\n        data-testid=\"avios-currency-symbol\"\n      />\n      <span className={styles.content}>\n        <span className={styles.points}>{formattedPoints}</span>\n        {children && <span className={styles.label}>{children}</span>}\n        {textEnd && (\n          <>\n            <span className={styles.plusSign}>+</span>\n            <span className={styles.textEnd}>{textEnd}</span>\n          </>\n        )}\n      </span>\n    </Badge>\n  );\n};\n\nexport default AviosBadge;\n"],"mappings":"8ZC0Ca,EAAA,EACX,OAAO,UACP,OAAO,KACP,UACA,SACA,WACA,YACA,eACG,MAEH,MAAM,EAAkB,EAAO,iBAEzB,EACJ,GAAG,KAAQ,KAAmB,GAAY,WAAW,GAAW,KAAK,OAEjE,EAAY,CAChB,GAAI,OACJ,GAAI,OACJ,GAAI;AAKN,OACE,EAAC,EAAD,CACE,aAAuB,YAAT,EAAqB,UAAY,OAC/C,KALuB,OAAT,EAAgB,KAAO,EAMrC,UAAW,GAAa,EACxB,UAAW,GAAG,EAAO,cAAc,EAAO,OAAU,EAAO,MAAS,GAAa,QAC7E,WALN,gBAOE,EAAC,EAAD,CACQ,OACN,aAAuB,YAAT,EAAqB,YAAc,UACjD,MAAO,EAAU,GACjB,OAAQ,EAAU,GAClB,cAAY,OACZ,cAAY,yCAEd,EAAC,OAAD,CAAM,UAAW,EAAO,iBAAxB;eACE,EAAC,OAAD,CAAM,UAAW,EAAO,gBAAS,IAChC,kBAAY,EAAC,OAAD,CAAM,UAAW,EAAO,MAAQ,aAC5C,kBACC,EAAA,EAAA,CAAA,SAAA,gBACE,EAAC,OAAD,CAAM,UAAW,EAAO,kBAAU,qBAClC,EAAC,OAAD,CAAM,UAAW,EAAO,iBAAU"}

package/dist/AviosCurrency-CrPtplq6.js

@@ -0,0 +1,5 @@
+import{t as r}from"./dist-B0nWL9R9.js";import{t as c}from"./Icon-DweSiH3B.js";import{t as s}from"./AviosCurrencySymbol-C10fgzsk.js";import{useMemo as e}from"react";import{jsx as a,jsxs as n}from"react/jsx-runtime";import './assets/AviosCurrency.css';var i={"avios-currency":"_avios-currency_wwfm9_1","avios-currency__name":"_avios-currency__name_wwfm9_15","avios-currency--strikethrough":"_avios-currency--strikethrough_wwfm9_19","avios-currency--primary":"_avios-currency--primary_wwfm9_31","avios-currency--secondary":"_avios-currency--secondary_wwfm9_35","avios-currency--white":"_avios-currency--white_wwfm9_39","avios-currency--on-spend":"_avios-currency--on-spend_wwfm9_43","avios-currency--on-collect":"_avios-currency--on-collect_wwfm9_47","avios-currency--accent-primary":"_avios-currency--accent-primary_wwfm9_51","avios-currency--accent-secondary":"_avios-currency--accent-secondary_wwfm9_55","avios-currency--xl":"_avios-currency--xl_wwfm9_59","avios-currency--lg":"_avios-currency--lg_wwfm9_71","avios-currency--md":"_avios-currency--md_wwfm9_78","avios-currency--sm":"_avios-currency--sm_wwfm9_85","avios-currency--xs":"_avios-currency--xs_wwfm9_92","avios-currency--2xs":"_avios-currency--2xs_wwfm9_99","avios-currency--3xs":"_avios-currency--3xs_wwfm9_106","avios-currency--4xs":"_avios-currency--4xs_wwfm9_113","avios-currency--5xs":"_avios-currency--5xs_wwfm9_120"},o=r(i["avios-currency"],{variants:{styleVariant:{primary:i["avios-currency--primary"],secondary:i["avios-currency--secondary"],white:i["avios-currency--white"],onSpend:i["avios-currency--on-spend"],onCollect:i["avios-currency--on-collect"],accentPrimary:i["avios-currency--accent-primary"],accentSecondary:i["avios-currency--accent-secondary"]},size:{xl:i["avios-currency--xl"],lg:i["avios-currency--lg"],md:i["avios-currency--md"],sm:i["avios-currency--sm"],xs:i["avios-currency--xs"],"2xs":i["avios-currency--2xs"],"3xs":i["avios-currency--3xs"],"4xs":i["avios-currency--4xs"],"5xs":i["avios-currency--5xs"]},isStrikethrough:{true:i["avios-currency--strikethrough"],false:""}},defaultVariants:{styleVariant:"accentSecondary"}});function y(r){switch(r){case"sm":return"0.75x";case"2xs":case"3xs":case"4xs":case"5xs":return"0.5x";default:return"1x"}}var t=({children:r=0,styleVariant:t="accentSecondary",kind:u="balance",size:_="xl",hasCurrencyName:m=!1,decorator:v,isStrikethrough:w=!1,...d})=>{const l=new Intl.NumberFormat("en-GB",{style:"decimal",maximumFractionDigits:0}).format(r),{isLink:x,isDropdown:f}=e(()=>"link"===v?{isLink:!0,isDropdown:!1}:"dropdown"===v?{isLink:!1,isDropdown:!0}:{isLink:!1,isDropdown:!1},[v]),p=e(()=>y(_),[_]);/* @__PURE__ */
+return n("span",{className:o({styleVariant:t,size:_,isStrikethrough:w}),children:[
+/* @__PURE__ */a(s,{...d,styleVariant:t,kind:u}),
+/* @__PURE__ */a("span",{className:i.aviosCurrency__points,children:l}),x&&/* @__PURE__ */a(c,{iconName:"chevron-right",iconSize:p,"data-testid":"icon"}),f&&/* @__PURE__ */a(c,{iconName:"angles-up-down",iconSize:p,"data-testid":"icon"}),m&&/* @__PURE__ */a("span",{className:i["avios-currency__name"],children:"Avios"})]})};export{y as n,t};
+//# sourceMappingURL=AviosCurrency-CrPtplq6.js.map

package/dist/AviosCurrency-CrPtplq6.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AviosCurrency-CrPtplq6.js","names":[],"sources":["../src/components/AviosCurrency/AviosCurrency.module.css","../src/components/AviosCurrency/AviosCurrency.tsx"],"sourcesContent":[".avios-currency {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: var(--alto-sem-space-5xs);\n  width: fit-content;\n  color: var(--alto-sem-color-fg-spend-on-vibrant-default);\n  font-family: var(--alto-sem-text-heading-font-family);\n}\n\n.avios-currency > span {\n  text-box: trim-both cap alphabetic;\n}\n\n.avios-currency__name {\n  padding-left: var(--alto-sem-space-5xs);\n}\n\n.avios-currency--strikethrough:after {\n  position: absolute;\n  bottom: 0.4cap;\n  left: calc(100% + 3px);\n  width: calc(100% + 5px);\n  content: '';\n  display: block;\n  border-top: 0.05em solid;\n  transform: translateX(-100%);\n  transition: transform 0.25s ease-in-out;\n}\n\n.avios-currency--primary {\n  color: var(--alto-sem-color-fg-primary);\n}\n\n.avios-currency--secondary {\n  color: var(--alto-sem-color-fg-secondary);\n}\n\n.avios-currency--white {\n  color: var(--alto-sem-color-fg-white-primary);\n}\n\n.avios-currency--on-spend {\n  color: var(--alto-sem-color-fg-spend-on-vibrant-default);\n}\n\n.avios-currency--on-collect {\n  color: var(--alto-sem-color-fg-collect-on-vibrant-default);\n}\n\n.avios-currency--accent-primary {\n  color: var(--alto-sem-color-fg-accent-primary);\n}\n\n.avios-currency--accent-secondary {\n  color: var(--alto-sem-color-fg-accent-secondary);\n}\n\n.avios-currency--xl {\n  font-size: var(--alto-sem-text-heading-xl-font-size);\n  font-weight: var(--alto-sem-text-heading-xl-font-weight);\n  line-height: var(--alto-sem-text-heading-xl-font-size);\n  letter-spacing: var(--alto-sem-text-heading-xl-letter-spacing);\n}\n\n.avios-currency svg {\n  height: 1cap;\n  width: auto;\n}\n\n.avios-currency--lg {\n  font-size: var(--alto-sem-text-heading-lg-font-size);\n  font-weight: var(--alto-sem-text-heading-lg-font-weight);\n  line-height: var(--alto-sem-text-heading-lg-font-size);\n  letter-spacing: var(--alto-sem-text-heading-lg-letter-spacing);\n}\n\n.avios-currency--md {\n  font-size: var(--alto-sem-text-heading-md-font-size);\n  font-weight: var(--alto-sem-text-heading-md-font-weight);\n  line-height: var(--alto-sem-text-heading-md-font-size);\n  letter-spacing: var(--alto-sem-text-heading-md-letter-spacing);\n}\n\n.avios-currency--sm {\n  font-size: var(--alto-sem-text-heading-sm-font-size);\n  font-weight: var(--alto-sem-text-heading-sm-font-weight);\n  line-height: var(--alto-sem-text-heading-sm-font-size);\n  letter-spacing: var(--alto-sem-text-heading-sm-letter-spacing);\n}\n\n.avios-currency--xs {\n  font-size: var(--alto-sem-text-heading-xs-font-size);\n  font-weight: var(--alto-sem-text-heading-xs-font-weight);\n  line-height: var(--alto-sem-text-heading-xs-font-size);\n  letter-spacing: var(--alto-sem-text-heading-xs-letter-spacing);\n}\n\n.avios-currency--2xs {\n  font-size: var(--alto-sem-text-heading-2xs-font-size);\n  font-weight: var(--alto-sem-text-heading-2xs-font-weight);\n  line-height: var(--alto-sem-text-heading-2xs-font-size);\n  letter-spacing: var(--alto-sem-text-heading-2xs-letter-spacing);\n}\n\n.avios-currency--3xs {\n  font-weight: var(--alto-sem-text-heading-2xs-font-weight);\n  font-size: var(--alto-sem-text-body-md-font-size);\n  line-height: var(--alto-sem-text-body-md-font-size);\n  letter-spacing: var(--alto-sem-text-body-md-letter-spacing);\n}\n\n.avios-currency--4xs {\n  font-weight: var(--alto-sem-text-heading-2xs-font-weight);\n  font-size: var(--alto-sem-text-body-sm-font-size);\n  line-height: var(--alto-sem-text-body-sm-font-size);\n  letter-spacing: var(--alto-sem-text-body-sm-letter-spacing);\n}\n\n.avios-currency--5xs {\n  font-weight: var(--alto-sem-text-heading-2xs-font-weight);\n  font-size: var(--alto-sem-text-body-xs-font-size);\n  line-height: var(--alto-sem-text-body-xs-font-size);\n  letter-spacing: var(--alto-sem-text-body-xs-letter-spacing);\n}\n","import { useMemo } from 'react';\nimport styles from './AviosCurrency.module.css';\nimport { cva } from 'class-variance-authority';\nimport AviosCurrencySymbol, {\n  type AviosCurrencySymbolProps,\n} from '../AviosCurrencySymbol';\nimport Icon, { IconSize } from '../Icon/Icon';\n\nconst aviosCurrency = cva(styles['avios-currency'], {\n  variants: {\n    styleVariant: {\n      primary: styles['avios-currency--primary'],\n      secondary: styles['avios-currency--secondary'],\n      white: styles['avios-currency--white'],\n      onSpend: styles['avios-currency--on-spend'],\n      onCollect: styles['avios-currency--on-collect'],\n      accentPrimary: styles['avios-currency--accent-primary'],\n      accentSecondary: styles['avios-currency--accent-secondary'],\n    },\n    size: {\n      xl: styles['avios-currency--xl'],\n      lg: styles['avios-currency--lg'],\n      md: styles['avios-currency--md'],\n      sm: styles['avios-currency--sm'],\n      xs: styles['avios-currency--xs'],\n      '2xs': styles['avios-currency--2xs'],\n      '3xs': styles['avios-currency--3xs'],\n      '4xs': styles['avios-currency--4xs'],\n      '5xs': styles['avios-currency--5xs'],\n    },\n    isStrikethrough: {\n      true: styles['avios-currency--strikethrough'],\n      false: '',\n    },\n  },\n  defaultVariants: {\n    styleVariant: 'accentSecondary',\n  },\n});\n\nexport interface AviosCurrencyProps\n  extends Omit<AviosCurrencySymbolProps, 'styleVariant'> {\n  children?: number;\n  /**\n   * The style variant of the Avios currency\n   */\n  styleVariant?: AviosCurrencySymbolProps['styleVariant'];\n  /**\n   * The size of the Avios currency\n   */\n  size?: 'xl' | 'lg' | 'md' | 'sm' | 'xs' | '2xs' | '3xs' | '4xs' | '5xs';\n  /**\n   * Whether to display the currency name \" Avios\"\n   */\n  hasCurrencyName?: boolean;\n  /**\n   * The decorator to display\n   */\n  decorator?: 'link' | 'dropdown';\n  /**\n   * Whether to display the Avios currency as a strikethrough\n   */\n  isStrikethrough?: boolean;\n}\n\nexport function getIconSize(size: AviosCurrencyProps['size']): IconSize {\n  switch (size) {\n    case 'sm':\n      return '0.75x';\n    case '2xs':\n    case '3xs':\n    case '4xs':\n    case '5xs':\n      return '0.5x';\n    default:\n      return '1x';\n  }\n}\n\nexport const AviosCurrency = ({\n  children = 0,\n  styleVariant = 'accentSecondary',\n  kind = 'balance',\n  size = 'xl',\n  hasCurrencyName = false,\n  decorator,\n  isStrikethrough = false,\n  ...props\n}: AviosCurrencyProps) => {\n  const formattedChildren = new Intl.NumberFormat('en-GB', {\n    style: 'decimal',\n    maximumFractionDigits: 0,\n  }).format(children);\n\n  const { isLink, isDropdown } = useMemo(() => {\n    if (decorator === 'link') {\n      return { isLink: true, isDropdown: false };\n    }\n    if (decorator === 'dropdown') {\n      return { isLink: false, isDropdown: true };\n    }\n    return { isLink: false, isDropdown: false };\n  }, [decorator]);\n\n  const iconSize = useMemo(() => getIconSize(size), [size]);\n\n  return (\n    <span className={aviosCurrency({ styleVariant, size, isStrikethrough })}>\n      <AviosCurrencySymbol {...props} styleVariant={styleVariant} kind={kind} />\n      <span className={styles.aviosCurrency__points}>{formattedChildren}</span>\n      {isLink && (\n        <Icon iconName=\"chevron-right\" iconSize={iconSize} data-testid=\"icon\" />\n      )}\n      {isDropdown && (\n        <Icon\n          iconName=\"angles-up-down\"\n          iconSize={iconSize}\n          data-testid=\"icon\"\n        />\n      )}\n      {hasCurrencyName && (\n        <span className={styles['avios-currency__name']}>Avios</span>\n      )}\n    </span>\n  );\n};\n\nexport default AviosCurrency;\n"],"mappings":"o0CCQM,EAAgB,EAAI,EAAO,kBAAmB,CAClD,SAAU,CACR,aAAc,CACZ,QAAS,EAAO,2BAChB,UAAW,EAAO,6BAClB,MAAO,EAAO,yBACd,QAAS,EAAO,4BAChB,UAAW,EAAO,8BAClB,cAAe,EAAO,kCACtB,gBAAiB,EAAO,qCAE1B,KAAM,CACJ,GAAI,EAAO,sBACX,GAAI,EAAO,sBACX,GAAI,EAAO,sBACX,GAAI,EAAO,sBACX,GAAI,EAAO,sBACX,MAAO,EAAO,uBACd,MAAO,EAAO,uBACd,MAAO,EAAO,uBACd,MAAO,EAAO,wBAEhB,gBAAiB,CACf,KAAM,EAAO,iCACb,MAAO,KAGX,gBAAiB,CACf,aAAc,qBA6BlB,SAAgB,EAAY,GAC1B,OAAQ,GACN,IAAK,KACH,MAAO,QACT,IAAK,MACL,IAAK,MACL,IAAK,MACL,IAAK,MACH,MAAO,OACT,QACE,MAAO,KAEb,CAEA,IAAa,EAAA,EACX,WAAW,EACX,eAAe,kBACf,OAAO,UACP,OAAO,KACP,mBAAkB,EAClB,YACA,mBAAkB,KACf,MAEH,MAAM,EAAoB,IAAI,KAAK,aAAa,QAAS,CACvD,MAAO,UACP,sBAAuB,IACtB,OAAO,IAEJ,OAAE,EAAA,WAAQ,GAAe,EAAA,IACX,SAAd,EACK,CAAE,QAAQ,EAAM,YAAY,GAEnB,aAAd,EACK,CAAE,QAAQ,EAAO,YAAY,GAE/B,CAAE,QAAQ,EAAO,YAAY,GACnC,CAAC,IAEE,EAAW,EAAA,IAAc,EAAY,GAAO,CAAC;AAEnD,OACE,EAAC,OAAD,CAAM,UAAW,EAAc,CAAE,eAAc,OAAM,6BAArD;eACE,EAAC,EAAD,IAAyB,EAAqB,eAAoB;eAClE,EAAC,OAAD,CAAM,UAAW,EAAO,+BAAwB,IAC/C,kBACC,EAAC,EAAD,CAAM,SAAS,gBAA0B,WAAU,cAAY,SAEhE,kBACC,EAAC,EAAD,CACE,SAAS,iBACC,WACV,cAAY,SAGf,kBACC,EAAC,OAAD,CAAM,UAAW,EAAO,iCAAyB"}

package/dist/AviosCurrencyBadge-CovWfkZQ.js

@@ -0,0 +1,4 @@
+import{t as e}from"./dist-B0nWL9R9.js";import{t as s}from"./AviosCurrency-CrPtplq6.js";import{isValidElement as a,useMemo as r}from"react";import{jsx as d,jsxs as i}from"react/jsx-runtime";import './assets/AviosCurrencyBadge.css';var o="_avios-currency-badge__text--xs-bold_1d5jx_78",t="_avios-currency-badge__text--sm-bold_1d5jx_79",l="_avios-currency-badge__text--md-bold_1d5jx_80",c="_avios-currency-badge__text--lg-bold_1d5jx_81",n="_avios-currency-badge__text--xl-bold_1d5jx_85",_="_avios-currency-badge__text_1d5jx_78",m=e("_avios-currency-badge_1d5jx_1",{variants:{size:{xs:"_avios-currency-badge--xs_1d5jx_28",sm:"_avios-currency-badge--sm_1d5jx_35",md:"_avios-currency-badge--md_1d5jx_47",lg:"_avios-currency-badge--lg_1d5jx_59",xl:"_avios-currency-badge--xl_1d5jx_71"},kind:{collect:"_avios-currency-badge--collect_1d5jx_16",spend:"_avios-currency-badge--spend_1d5jx_21"}},defaultVariants:{size:"md",kind:"collect"}}),x=e(_,{variants:{size:{xs:void 0,sm:void 0,md:void 0,lg:void 0,xl:void 0},bold:{true:void 0,false:void 0}},defaultVariants:{size:"md",bold:!1},compoundVariants:[{size:"xs",bold:!0,className:o},{size:"sm",bold:!0,className:t},{size:"md",bold:!0,className:l},{size:"lg",bold:!0,className:c},{size:"xl",bold:!0,className:n}]}),b=["xs","sm","md","lg","xl"],u={xs:"5xs",sm:"4xs",md:"3xs",lg:"2xs",xl:"xs"};function v(e){return"string"==typeof e||"number"==typeof e?String(e):Array.isArray(e)?e.map(v).join(" "):a(e)&&e.props&&e.props.children?v(e.props.children):""}var g=({kind:e="collect",size:a="md",textStart:o,textEnd:t,textStartBold:l=!1,textEndBold:c=!1,ariaLabel:n,role:_,children:b=0,...g})=>{const y=Number(b),p=new Intl.NumberFormat("en-GB",{style:"decimal",maximumFractionDigits:0}).format(y),j=r(()=>{if(n)return n;const e=p??"";return`${v(o)||""} ${e} Avios ${v(t)||""}`.trim()},[n,o,t,p]),z=u[a]??"3xs";/* @__PURE__ */
+return i("span",{"data-testid":"avios-currency-badge","aria-label":j,role:_||void 0,className:m({size:a,kind:e}),children:[o&&/* @__PURE__ */d("span",{className:x({size:a,bold:l}),children:o}),
+/* @__PURE__ */d(s,{"aria-hidden":!0,styleVariant:"collect"===e?"onCollect":"onSpend",size:z,kind:e,...g,children:Number.isFinite(y)?y:0}),t&&/* @__PURE__ */d("span",{className:x({size:a,bold:c}),children:t})]})};export{b as n,x as r,g as t};
+//# sourceMappingURL=AviosCurrencyBadge-CovWfkZQ.js.map

package/dist/AviosCurrencyBadge-CovWfkZQ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AviosCurrencyBadge-CovWfkZQ.js","names":[],"sources":["../src/components/AviosCurrencyBadge/AviosCurrencyBadge.module.css","../src/components/AviosCurrencyBadge/AviosCurrencyBadge.tsx"],"sourcesContent":[".avios-currency-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--alto-sem-space-4xs);\n  width: fit-content;\n  padding: var(--alto-sem-space-3xs) var(--alto-sem-space-xs);\n  border-radius: var(--alto-button-sm-radius);\n  font-family: var(--alto-sem-text-heading-font-family);\n}\n\n.avios-currency-badge span {\n  text-box: trim-both cap alphabetic;\n}\n\n/* kind */\n.avios-currency-badge--collect {\n  color: var(--alto-sem-color-fg-collect-on-vibrant-default);\n  background: var(--alto-sem-color-bg-collect-vibrant-default);\n}\n\n.avios-currency-badge--spend {\n  color: var(--alto-sem-color-fg-spend-on-vibrant-default);\n  background: var(--alto-sem-color-bg-spend-vibrant-default);\n}\n\n/* size */\n\n.avios-currency-badge--xs {\n  padding: var(--alto-sem-space-4xs) var(--alto-sem-space-2xs);\n  font-size: var(--alto-sem-text-label-2xs-font-size);\n  line-height: var(--alto-sem-text-label-2xs-font-size);\n  letter-spacing: var(--alto-sem-text-body-md-letter-spacing);\n}\n\n.avios-currency-badge--sm {\n  padding: var(--alto-sem-space-3xs) var(--alto-sem-space-xs);\n  font-size: var(--alto-sem-text-label-2xs-font-size);\n  line-height: var(--alto-sem-text-label-2xs-font-size);\n  letter-spacing: var(--alto-sem-text-body-md-letter-spacing);\n}\n\n.avios-currency-badge.avios-currency-badge--sm svg {\n  width: 11px;\n  height: 11px;\n}\n\n.avios-currency-badge--md {\n  padding: var(--alto-sem-space-3xs) var(--alto-sem-space-xs);\n  font-size: var(--alto-sem-text-body-xs-font-size);\n  line-height: var(--alto-sem-text-body-xs-line-height);\n  letter-spacing: var(--alto-sem-text-body-md-letter-spacing);\n}\n\n.avios-currency-badge.avios-currency-badge--md svg {\n  width: 12px;\n  height: 12px;\n}\n\n.avios-currency-badge--lg {\n  padding: var(--alto-sem-space-2xs) var(--alto-sem-space-xs);\n  font-size: var(--alto-sem-text-body-md-font-size);\n  line-height: var(--alto-sem-text-body-md-line-height);\n  letter-spacing: var(--alto-sem-text-body-md-letter-spacing);\n}\n\n.avios-currency-badge.avios-currency-badge--lg svg {\n  width: 14px;\n  height: 14px;\n}\n\n.avios-currency-badge--xl {\n  padding: var(--alto-sem-space-2xs) var(--alto-sem-space-xs);\n  font-size: var(--alto-sem-text-body-md-font-size);\n  line-height: var(--alto-sem-text-body-md-line-height);\n  letter-spacing: var(--alto-sem-text-body-md-letter-spacing);\n}\n\n.avios-currency-badge__text--xs-bold,\n.avios-currency-badge__text--sm-bold,\n.avios-currency-badge__text--md-bold,\n.avios-currency-badge__text--lg-bold {\n  font-weight: var(--alto-sem-text-heading-2xs-font-weight);\n}\n\n.avios-currency-badge__text--xl-bold {\n  font-weight: var(--alto-sem-text-heading-xl-font-weight);\n}\n\n.avios-currency-badge__text {\n  text-box: trim-both cap alphabetic;\n}\n","import styles from './AviosCurrencyBadge.module.css';\nimport AviosCurrency, {\n  AviosCurrencyProps,\n} from '../AviosCurrency/AviosCurrency';\nimport { cva } from 'class-variance-authority';\nimport { useMemo, type ReactNode, isValidElement } from 'react';\n\nconst aviosCurrencyBadge = cva(styles['avios-currency-badge'], {\n  variants: {\n    size: {\n      xs: styles['avios-currency-badge--xs'],\n      sm: styles['avios-currency-badge--sm'],\n      md: styles['avios-currency-badge--md'],\n      lg: styles['avios-currency-badge--lg'],\n      xl: styles['avios-currency-badge--xl'],\n    },\n    kind: {\n      collect: styles['avios-currency-badge--collect'],\n      spend: styles['avios-currency-badge--spend'],\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    kind: 'collect',\n  },\n});\n\nexport const textCva = cva(styles['avios-currency-badge__text'], {\n  variants: {\n    // we pull in size so we can fire off the .xs-bold/.sm-bold/etc macros\n    size: {\n      xs: undefined,\n      sm: undefined,\n      md: undefined,\n      lg: undefined,\n      xl: undefined,\n    },\n    bold: {\n      true: undefined,\n      false: undefined,\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    bold: false,\n  },\n  compoundVariants: [\n    {\n      size: 'xs',\n      bold: true,\n      className: styles['avios-currency-badge__text--xs-bold'],\n    },\n    {\n      size: 'sm',\n      bold: true,\n      className: styles['avios-currency-badge__text--sm-bold'],\n    },\n    {\n      size: 'md',\n      bold: true,\n      className: styles['avios-currency-badge__text--md-bold'],\n    },\n    {\n      size: 'lg',\n      bold: true,\n      className: styles['avios-currency-badge__text--lg-bold'],\n    },\n    {\n      size: 'xl',\n      bold: true,\n      className: styles['avios-currency-badge__text--xl-bold'],\n    },\n  ],\n});\n\nexport const BADGE_SIZES = ['xs', 'sm', 'md', 'lg', 'xl'] as const;\nexport type BadgeSize = (typeof BADGE_SIZES)[number];\n\nexport interface AviosCurrencyBadgeProps\n  extends Omit<\n    AviosCurrencyProps,\n    'isStrikethrough' | 'decorator' | 'styleVariant'\n  > {\n  /**\n   * The kind of Avios badge (collect or spend)\n   * @default 'collect'\n   */\n  kind?: 'collect' | 'spend';\n  /**\n   * Additional content to be displayed at the start of the badge\n   */\n  textStart?: ReactNode;\n  /**\n   * Additional content to be displayed at the end of the badge\n   */\n  textEnd?: ReactNode;\n  /**\n   * Whether the text at the start of the badge should be bold\n   * @default false\n   */\n  textStartBold?: boolean;\n  /**\n   * Whether the text at the end of the badge should be bold\n   * @default false\n   */\n  textEndBold?: boolean;\n  /**\n   * Size of the badge\n   * @default 'md'\n   */\n  size?: BadgeSize;\n  /**\n   * A string representation of the badge's contents, used for accessibility\n   * Example: \"Collect 50,000 Avios points\"\n   */\n  ariaLabel?: string;\n  /**\n   * ARIA role for the badge container. This should only be used when changes to the currency badge need to be announced.\n   */\n  role?: string;\n  /**\n   * Number of Avios points\n   */\n  children?: number;\n}\n\nconst sizeMap: Record<BadgeSize, AviosCurrencyProps['size']> = {\n  xs: '5xs',\n  sm: '4xs',\n  md: '3xs',\n  lg: '2xs',\n  xl: 'xs',\n};\n\nfunction extractText(node: ReactNode): string {\n  if (typeof node === 'string' || typeof node === 'number') return String(node);\n  if (Array.isArray(node)) return node.map(extractText).join(' ');\n  if (isValidElement(node) && node.props && node.props.children) {\n    return extractText(node.props.children);\n  }\n  return '';\n}\n\nexport const AviosCurrencyBadge = ({\n  kind = 'collect',\n  size = 'md',\n  textStart,\n  textEnd,\n  textStartBold = false,\n  textEndBold = false,\n  ariaLabel,\n  role,\n  children = 0,\n  ...props\n}: AviosCurrencyBadgeProps) => {\n  const numericChildren = Number(children);\n\n  const formattedPoints = new Intl.NumberFormat('en-GB', {\n    style: 'decimal',\n    maximumFractionDigits: 0,\n  }).format(numericChildren);\n\n  const computedAriaLabel = useMemo(() => {\n    if (ariaLabel) return ariaLabel;\n\n    const formatted = formattedPoints ?? '';\n    const startText = extractText(textStart);\n    const endText = extractText(textEnd);\n    return `${startText || ''} ${formatted} Avios ${endText || ''}`.trim();\n  }, [ariaLabel, textStart, textEnd, formattedPoints]);\n\n  const aviosCurrencySize = sizeMap[size] ?? '3xs';\n\n  return (\n    <span\n      data-testid=\"avios-currency-badge\"\n      aria-label={computedAriaLabel}\n      role={role || undefined}\n      className={aviosCurrencyBadge({\n        size,\n        kind,\n      })}\n    >\n      {textStart && (\n        <span className={textCva({ size, bold: textStartBold })}>\n          {textStart}\n        </span>\n      )}\n      <AviosCurrency\n        aria-hidden\n        styleVariant={kind === 'collect' ? 'onCollect' : 'onSpend'}\n        size={aviosCurrencySize}\n        kind={kind}\n        {...props}\n      >\n        {Number.isFinite(numericChildren) ? numericChildren : 0}\n      </AviosCurrency>\n      {textEnd && (\n        <span className={textCva({ size, bold: textEndBold })}>{textEnd}</span>\n      )}\n    </span>\n  );\n};\n\nexport default AviosCurrencyBadge;\n"],"mappings":"oeCOM,EAAqB,kCAAoC,CAC7D,SAAU,CACR,KAAM,CACJ,wCACA,wCACA,wCACA,wCACA,yCAEF,KAAM,CACJ,kDACA,gDAGJ,gBAAiB,CACf,KAAM,KACN,KAAM,aAIG,EAAU,EAAI,EAAsC,CAC/D,SAAU,CAER,KAAM,CACJ,QAAI,EACJ,QAAI,EACJ,QAAI,EACJ,QAAI,EACJ,QAAI,GAEN,KAAM,CACJ,UAAM,EACN,WAAO,IAGX,gBAAiB,CACf,KAAM,KACN,MAAM,GAER,iBAAkB,CAChB,CACE,KAAM,KACN,MAAM,EACN,UAAW,GAEb,CACE,KAAM,KACN,MAAM,EACN,UAAW,GAEb,CACE,KAAM,KACN,MAAM,EACN,UAAW,GAEb,CACE,KAAM,KACN,MAAM,EACN,UAAW,GAEb,CACE,KAAM,KACN,MAAM,EACN,UAAW,MAKJ,EAAc,CAAC,KAAM,KAAM,KAAM,KAAM,MAmD9C,EAAyD,CAC7D,GAAI,MACJ,GAAI,MACJ,GAAI,MACJ,GAAI,MACJ,GAAI,MAGN,SAAS,EAAY,GACnB,MAAoB,iBAAT,GAAqC,iBAAT,EAA0B,OAAO,GACpE,MAAM,QAAQ,GAAc,EAAK,IAAI,GAAa,KAAK,KACvD,EAAe,IAAS,EAAK,OAAS,EAAK,MAAM,SAC5C,EAAY,EAAK,MAAM,UAEzB,EACT,CAEA,IAAa,EAAA,EACX,OAAO,UACP,OAAO,KACP,YACA,UACA,iBAAgB,EAChB,eAAc,EACd,YACA,OACA,WAAW,KACR,MAEH,MAAM,EAAkB,OAAO,GAEzB,EAAkB,IAAI,KAAK,aAAa,QAAS,CACrD,MAAO,UACP,sBAAuB,IACtB,OAAO,GAEJ,EAAoB,EAAA,KACxB,GAAI,EAAW,OAAO,EAEtB,MAAM,EAAY,GAAmB,GAGrC,MAAO,GAFW,EAAY,IAEP,MAAM,WADb,EAAY,IAC+B,KAAK,QAC/D,CAAC,EAAW,EAAW,EAAS,IAE7B,EAAoB,EAAQ,IAAS;AAE3C,OACE,EAAC,OAAD,CACE,cAAY,uBACZ,aAAY,EACZ,KAAM,QAAQ,EACd,UAAW,EAAmB,CAC5B,OACA,kBANJ,CASG,kBACC,EAAC,OAAD,CAAM,UAAW,EAAQ,CAAE,OAAM,KAAM,aACpC;eAGL,EAAC,EAAD,CACE,eAAA,EACA,aAAuB,YAAT,EAAqB,YAAc,UACjD,KAAM,EACA,UACF,WAEH,OAAO,SAAS,GAAmB,EAAkB,IAEvD,kBACC,EAAC,OAAD,CAAM,UAAW,EAAQ,CAAE,OAAM,KAAM,aAAiB"}

package/dist/AviosCurrencySymbol-C10fgzsk.js

@@ -0,0 +1,3 @@
+import{t as a}from"./dist-B0nWL9R9.js";import r from"react";import{jsx as i,jsxs as e}from"react/jsx-runtime";import './assets/AviosCurrencySymbol.css';var c=a("_avios-currency-symbol_dvvi8_1",{variants:{styleVariant:{primary:"_avios-currency-symbol--primary_dvvi8_4",secondary:"_avios-currency-symbol--secondary_dvvi8_14",white:"_avios-currency-symbol--white_dvvi8_24",onSpend:"_avios-currency-symbol--on-spend_dvvi8_34",onCollect:"_avios-currency-symbol--on-collect_dvvi8_44",accentPrimary:"_avios-currency-symbol--accent-primary_dvvi8_54",accentSecondary:"_avios-currency-symbol--accent-secondary_dvvi8_64"}},defaultVariants:{styleVariant:"primary"}}),t=({kind:a="collect"})=>{switch(a){case"collect":/* @__PURE__ */return i("path",{fill:"currentColor",d:"M7.562 11.188a.317.317 0 0 0 .317-.318V8.648h2.222a.317.317 0 0 0 .317-.317V7.06a.317.317 0 0 0-.317-.317H7.879V4.522a.317.317 0 0 0-.317-.318h-1.27a.317.317 0 0 0-.317.318v2.222H3.752a.317.317 0 0 0-.317.317v1.27c0 .175.142.317.317.317h2.223v2.222c0 .175.142.318.317.318z"});case"spend":/* @__PURE__ */return i("path",{fill:"currentColor",d:"M9.288 4.914a.3.3 0 0 1 .056.005.27.27 0 0 1 .217.268v4.371a.273.273 0 0 1-.273.273H8.195a.273.273 0 0 1-.273-.273V7.712l-3.265 3.265a.273.273 0 0 1-.386 0l-.773-.773a.273.273 0 0 1 0-.386l3.265-3.265H4.917a.273.273 0 0 1-.274-.273V5.187c0-.151.123-.273.274-.273z"});case"balance":return null}},l={width:"24px",height:"24px"},n=({kind:a="collect",styleVariant:n="accentPrimary",width:o,height:s,label:d,...v})=>{const y=r.useMemo(()=>o&&s?{width:o,height:s}:o?{width:o,height:o}:s?{width:s,height:s}:l,[o,s]),h=d||v["aria-label"];/* @__PURE__ */
+return e("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0.82 0.52 14.00 14.02",className:c({styleVariant:n}),"aria-label":h,"aria-hidden":v["aria-hidden"]??!0,role:v["aria-hidden"]?void 0:"img",...y,...v,children:[/* @__PURE__ */i("path",{fill:"#0032A0",d:"M14.512 5.968C14.025 5.127 9.659.865 4.364.526c-.923-.06-1.797.448-2.18 1.262-1.01 2.17-2.246 7.022-.459 11.442a2.06 2.06 0 0 0 1.94 1.312c.098 0 .191-.005.29-.016 6.043-.744 9.923-4.946 10.579-6.306.246-.514.508-1.3-.033-2.24z"}),/* @__PURE__ */i(t,{kind:a})]})};n.displayName="AviosCurrencySymbol";export{n as t};
+//# sourceMappingURL=AviosCurrencySymbol-C10fgzsk.js.map

package/dist/AviosCurrencySymbol-C10fgzsk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AviosCurrencySymbol-C10fgzsk.js","names":[],"sources":["../src/components/AviosCurrencySymbol/AviosCurrencySymbol.module.css","../src/components/AviosCurrencySymbol/AviosCurrencySymbol.tsx"],"sourcesContent":[".avios-currency-symbol {\n}\n\n.avios-currency-symbol--primary {\n  & path:first-child {\n    fill: var(--alto-sem-color-fg-primary);\n  }\n\n  & path:nth-child(2) {\n    fill: var(--alto-sem-color-fg-white-primary);\n  }\n}\n\n.avios-currency-symbol--secondary {\n  & path:first-child {\n    fill: var(--alto-sem-color-fg-secondary);\n  }\n\n  & path:nth-child(2) {\n    fill: var(--alto-sem-color-fg-white-primary);\n  }\n}\n\n.avios-currency-symbol--white {\n  & path:first-child {\n    fill: var(--alto-sem-color-fg-white-primary);\n  }\n\n  & path:nth-child(2) {\n    fill: var(--alto-sem-color-fg-accent-primary);\n  }\n}\n\n.avios-currency-symbol--on-spend {\n  & path:first-child {\n    fill: var(--alto-sem-color-fg-spend-on-vibrant-default);\n  }\n\n  & path:nth-child(2) {\n    fill: var(--alto-sem-color-fg-white-primary);\n  }\n}\n\n.avios-currency-symbol--on-collect {\n  & path:first-child {\n    fill: var(--alto-sem-color-fg-collect-on-vibrant-default);\n  }\n\n  & path:nth-child(2) {\n    fill: var(--alto-sem-color-fg-white-primary);\n  }\n}\n\n.avios-currency-symbol--accent-primary {\n  & path:first-child {\n    fill: var(--alto-sem-color-fg-accent-primary);\n  }\n\n  & path:nth-child(2) {\n    fill: var(--alto-sem-color-fg-white-primary);\n  }\n}\n\n.avios-currency-symbol--accent-secondary {\n  & path:first-child {\n    fill: var(--alto-sem-color-fg-accent-secondary);\n  }\n\n  & path:nth-child(2) {\n    fill: var(--alto-sem-color-fg-white-primary);\n  }\n}\n","import React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport styles from './AviosCurrencySymbol.module.css';\n\nconst aviosCurrencySymbol = cva(styles['avios-currency-symbol'], {\n  variants: {\n    styleVariant: {\n      primary: styles['avios-currency-symbol--primary'],\n      secondary: styles['avios-currency-symbol--secondary'],\n      white: styles['avios-currency-symbol--white'],\n      onSpend: styles['avios-currency-symbol--on-spend'],\n      onCollect: styles['avios-currency-symbol--on-collect'],\n      accentPrimary: styles['avios-currency-symbol--accent-primary'],\n      accentSecondary: styles['avios-currency-symbol--accent-secondary'],\n    },\n  },\n  defaultVariants: {\n    styleVariant: 'primary',\n  },\n});\n\nexport type AviosCurrencySymbolVariants = VariantProps<\n  typeof aviosCurrencySymbol\n>;\n\nexport type AviosCurrencySymbolKind = 'collect' | 'spend' | 'balance';\nexport type AviosCurrencySymbolStyleVariant =\n  | 'primary'\n  | 'secondary'\n  | 'white'\n  | 'onSpend'\n  | 'onCollect'\n  | 'accentPrimary'\n  | 'accentSecondary';\n\nexport interface AviosCurrencySymbolProps\n  extends Omit<React.SVGProps<SVGSVGElement>, 'fill' | 'className' | 'style'> {\n  /**\n   * The style variant to use for the Avios currency symbol\n   * @default 'primary'\n   */\n  styleVariant?: AviosCurrencySymbolStyleVariant;\n  /**\n   * The kind of Avios currency to display \"collect\", \"spend\", or \"balance\"\n   * @default 'collect'\n   */\n  kind?: AviosCurrencySymbolKind;\n  /**\n   * The screen reader label to use for the SVG element\n   * @default \"Avios ${kind} currency symbol\"\n   * @deprecated Use `aria-label` instead\n   */\n  label?: string;\n}\n\nconst AviosCurrencyKindPath = ({\n  kind = 'collect',\n}: Pick<AviosCurrencySymbolProps, 'kind'>) => {\n  switch (kind) {\n    case 'collect':\n      return (\n        <path\n          fill=\"currentColor\"\n          d=\"M7.562 11.188a.317.317 0 0 0 .317-.318V8.648h2.222a.317.317 0 0 0 .317-.317V7.06a.317.317 0 0 0-.317-.317H7.879V4.522a.317.317 0 0 0-.317-.318h-1.27a.317.317 0 0 0-.317.318v2.222H3.752a.317.317 0 0 0-.317.317v1.27c0 .175.142.317.317.317h2.223v2.222c0 .175.142.318.317.318z\"\n        />\n      );\n    case 'spend':\n      return (\n        <path\n          fill=\"currentColor\"\n          d=\"M9.288 4.914a.3.3 0 0 1 .056.005.27.27 0 0 1 .217.268v4.371a.273.273 0 0 1-.273.273H8.195a.273.273 0 0 1-.273-.273V7.712l-3.265 3.265a.273.273 0 0 1-.386 0l-.773-.773a.273.273 0 0 1 0-.386l3.265-3.265H4.917a.273.273 0 0 1-.274-.273V5.187c0-.151.123-.273.274-.273z\"\n        />\n      );\n    case 'balance':\n      return null;\n  }\n};\n\nconst DEFAULT_DIMENSIONS = {\n  width: '24px',\n  height: '24px',\n};\n\nexport const AviosCurrencySymbol = ({\n  kind = 'collect',\n  styleVariant = 'accentPrimary',\n  width,\n  height,\n  label,\n  ...props\n}: AviosCurrencySymbolProps) => {\n  // Handle custom dimensions from props\n  const dimensions = React.useMemo(() => {\n    if (width && height) {\n      return {\n        width,\n        height,\n      };\n    }\n\n    if (width) {\n      return {\n        width,\n        height: width,\n      };\n    }\n\n    if (height) {\n      return {\n        width: height,\n        height: height,\n      };\n    }\n\n    return DEFAULT_DIMENSIONS;\n  }, [width, height]);\n\n  // TODO: Remove deprecated `label` prop in future major release\n  const screenReaderLabel = label || props['aria-label'];\n\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      fill=\"none\"\n      viewBox=\"0.82 0.52 14.00 14.02\"\n      className={aviosCurrencySymbol({ styleVariant })}\n      aria-label={screenReaderLabel}\n      aria-hidden={props['aria-hidden'] ?? true}\n      role={props['aria-hidden'] ? undefined : 'img'}\n      {...dimensions}\n      {...props}\n    >\n      <path\n        fill=\"#0032A0\"\n        d=\"M14.512 5.968C14.025 5.127 9.659.865 4.364.526c-.923-.06-1.797.448-2.18 1.262-1.01 2.17-2.246 7.022-.459 11.442a2.06 2.06 0 0 0 1.94 1.312c.098 0 .191-.005.29-.016 6.043-.744 9.923-4.946 10.579-6.306.246-.514.508-1.3-.033-2.24z\"\n      ></path>\n      <AviosCurrencyKindPath kind={kind} />\n    </svg>\n  );\n};\n\nAviosCurrencySymbol.displayName = 'AviosCurrencySymbol';\nexport default AviosCurrencySymbol;\n"],"mappings":"kHCIM,EAAsB,mCAAqC,CAC/D,SAAU,CACR,aAAc,CACZ,kDACA,uDACA,+CACA,oDACA,wDACA,gEACA,sEAGJ,gBAAiB,CACf,aAAc,aAsCZ,EAAA,EACJ,OAAO,cAEP,OAAQ,GACN,IAAK,yBACH,OACE,EAAC,OAAD,CACE,KAAK,eACL,EAAE,qRAGR,IAAK,uBACH,OACE,EAAC,OAAD,CACE,KAAK,eACL,EAAE,4QAGR,IAAK,UACH,OAAO,OAIP,EAAqB,CACzB,MAAO,OACP,OAAQ,QAGG,EAAA,EACX,OAAO,UACP,eAAe,gBACf,QACA,SACA,WACG,MAGH,MAAM,EAAa,EAAM,QAAA,IACnB,GAAS,EACJ,CACL,QACA,UAIA,EACK,CACL,QACA,OAAQ,GAIR,EACK,CACL,MAAO,EACC,UAIL,EACN,CAAC,EAAO,IAGL,EAAoB,GAAS,EAAM;AAEzC,OACE,EAAC,MAAD,CACE,MAAM,6BACN,KAAK,OACL,QAAQ,wBACR,UAAW,EAAoB,CAAE,iBACjC,aAAY,EACZ,cAAa,EAAM,iBAAkB,EACrC,KAAM,EAAM,oBAAiB,EAAY,SACrC,KACA,WATN,gBAWE,EAAC,OAAD,CACE,KAAK,UACL,EAAE,uPAEJ,EAAC,EAAD,CAA6B,aAKnC,EAAoB,YAAc"}

package/dist/Badge-C0IfwYZq.js

@@ -0,0 +1,3 @@
+import{t as a}from"./dist-B0nWL9R9.js";import{t as e}from"./Icon-DweSiH3B.js";import{t}from"./focusStyles-BA5rd0UP.js";import s from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";import './assets/Badge.css';var _=a("_badge_1xfg2_1",{variants:{size:{sm:"_badge--sm_1xfg2_24",md:"_badge--md_1xfg2_15"},styleVariant:{neutral:"_badge--neutral_1xfg2_33",critical:"_badge--critical_1xfg2_38",warning:"_badge--warning_1xfg2_43",caution:"_badge--caution_1xfg2_48",success:"_badge--success_1xfg2_53",info:"_badge--info_1xfg2_58",brand:"_badge--brand_1xfg2_63",sale:"_badge--sale_1xfg2_68",white:"_badge--white_1xfg2_73"}},defaultVariants:{size:"md",styleVariant:"neutral"}}),n=({children:a,size:s="md",styleVariant:n,ariaLabel:d,iconStartProps:g,iconEndProps:o,focusStyle:f="default",className:c,...l})=>{const m={iconSize:"md"===s?"0.75x":"0.5x",iconPrefix:"fas",padding:"square"};/* @__PURE__ */
+return i("span",{"data-testid":"badge",className:`${_({size:s,styleVariant:n})} ${t({focusStyle:f})} ${c||""}`,role:"status","aria-label":d,...l,children:[g&&/* @__PURE__ */r(e,{...m,...g}),a,o&&/* @__PURE__ */r(e,{...m,...o})]})};export{n as t};
+//# sourceMappingURL=Badge-C0IfwYZq.js.map

package/dist/Badge-C0IfwYZq.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge-C0IfwYZq.js","names":[],"sources":["../src/components/Badge/Badge.module.css","../src/components/Badge/Badge.tsx"],"sourcesContent":[".badge {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  flex-shrink: 0;\n  overflow: hidden;\n  text-align: center;\n  text-overflow: ellipsis;\n  border-radius: var(--alto-tag-radius);\n  font-family: var(--alto-sem-text-label-font-family);\n  font-style: normal;\n  font-weight: var(--alto-sem-text-label-font-weight);\n}\n\n.badge--md {\n  height: 26px;\n  padding: 0 var(--alto-sem-space-xs);\n  gap: var(--alto-sem-space-2xs);\n  font-size: var(--alto-sem-text-label-md-font-size);\n  line-height: var(--alto-sem-text-label-md-line-height);\n  letter-spacing: var(--alto-sem-text-label-md-letter-spacing);\n}\n\n.badge--sm {\n  height: 20px;\n  padding: 0 var(--alto-sem-space-2xs);\n  gap: var(--alto-sem-space-4xs);\n  font-size: var(--alto-sem-text-label-xs-font-size);\n  line-height: var(--alto-sem-text-label-xs-line-height);\n  letter-spacing: var(--alto-sem-text-label-xs-letter-spacing);\n}\n\n.badge--neutral {\n  background: var(--alto-sem-color-bg-inverse-subtle-default);\n  color: var(--alto-sem-color-fg-inverse-on-subtle);\n}\n\n.badge--critical {\n  background: var(--alto-sem-color-bg-critical-subtle-default);\n  color: var(--alto-sem-color-fg-critical-on-subtle);\n}\n\n.badge--warning {\n  background: var(--alto-sem-color-bg-warning-subtle-default);\n  color: var(--alto-sem-color-fg-warning-on-subtle);\n}\n\n.badge--caution {\n  background: var(--alto-sem-color-bg-caution-subtle-default);\n  color: var(--alto-sem-color-fg-caution-on-subtle);\n}\n\n.badge--success {\n  background: var(--alto-sem-color-bg-success-subtle-default);\n  color: var(--alto-sem-color-fg-success-on-subtle);\n}\n\n.badge--info {\n  background: var(--alto-sem-color-bg-information-subtle-default);\n  color: var(--alto-sem-color-fg-information-on-subtle);\n}\n\n.badge--brand {\n  background: var(--alto-sem-color-bg-accent-subtle-default);\n  color: var(--alto-sem-color-fg-accent-on-subtle);\n}\n\n.badge--sale {\n  background: var(--alto-sem-color-bg-sale-vibrant-default);\n  color: var(--alto-sem-color-fg-sale-on-vibrant);\n}\n\n.badge--white {\n  background: var(--alto-sem-color-bg-white-vibrant-default);\n  color: var(--alto-sem-color-fg-white-on-vibrant);\n}\n","import React from 'react';\nimport { cva } from 'class-variance-authority';\nimport { Icon, IconProps } from '../Icon/Icon';\nimport styles from './Badge.module.css';\nimport { focusStyleVariants } from '../../utils/focus/focusStyles';\n\nconst badge = cva(styles.badge, {\n  variants: {\n    size: {\n      sm: styles['badge--sm'],\n      md: styles['badge--md'],\n    },\n    styleVariant: {\n      neutral: styles['badge--neutral'],\n      critical: styles['badge--critical'],\n      warning: styles['badge--warning'],\n      caution: styles['badge--caution'],\n      success: styles['badge--success'],\n      info: styles['badge--info'],\n      brand: styles['badge--brand'],\n      sale: styles['badge--sale'],\n      white: styles['badge--white'],\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    styleVariant: 'neutral',\n  },\n});\n\nexport interface BadgeProps {\n  /**\n   * The children of the component\n   */\n  children?: React.ReactNode;\n  /**\n   * A string representation of the tag's contents, used for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * The size of the tag\n   */\n  size?: 'sm' | 'md';\n  /**\n   * The style variant of the tag\n   */\n  styleVariant?:\n    | 'neutral'\n    | 'critical'\n    | 'warning'\n    | 'caution'\n    | 'success'\n    | 'info'\n    | 'brand'\n    | 'sale'\n    | 'white';\n  /**\n   * Whether an icon should display at the start of the Button and icon properties\n   */\n  iconStartProps?: IconProps;\n  /**\n   * Whether an icon should display at the end of Button and icon properties\n   */\n  iconEndProps?: IconProps;\n  /**\n   * The focus style of the button\n   */\n  focusStyle?: 'default' | 'white';\n  /**\n   * @internal\n   * Internal className prop for design system use only\n   */\n  className?: string;\n}\n\nexport const Badge = ({\n  children,\n  size = 'md',\n  styleVariant,\n  ariaLabel,\n  iconStartProps,\n  iconEndProps,\n  focusStyle = 'default',\n  className,\n  ...props\n}: BadgeProps) => {\n  // Set default icon props which are overwritten if passed explicity\n  const defaultIconProps: Partial<IconProps> = {\n    iconSize: size === 'md' ? '0.75x' : '0.5x',\n    iconPrefix: 'fas',\n    padding: 'square',\n  };\n\n  return (\n    <span\n      data-testid=\"badge\"\n      className={`${badge({ size, styleVariant })} ${focusStyleVariants({ focusStyle })} ${className || ''}`}\n      role=\"status\"\n      aria-label={ariaLabel}\n      {...props}\n    >\n      {iconStartProps && (\n        <Icon {...{ ...defaultIconProps, ...iconStartProps }} />\n      )}\n      {children}\n      {iconEndProps && <Icon {...{ ...defaultIconProps, ...iconEndProps }} />}\n    </span>\n  );\n};\n\nexport default Badge;\n"],"mappings":"kMCMM,EAAQ,mBAAkB,CAC9B,SAAU,CACR,KAAM,CACJ,yBACA,0BAEF,aAAc,CACZ,mCACA,qCACA,mCACA,mCACA,mCACA,6BACA,+BACA,6BACA,iCAGJ,gBAAiB,CACf,KAAM,KACN,aAAc,aAiDL,EAAA,EACX,WACA,OAAO,KACP,eACA,YACA,iBACA,eACA,aAAa,UACb,eACG,MAGH,MAAM,EAAuC,CAC3C,SAAmB,OAAT,EAAgB,QAAU,OACpC,WAAY,MACZ,QAAS;AAGX,OACE,EAAC,OAAD,CACE,cAAY,QACZ,UAAW,GAAG,EAAM,CAAE,OAAM,oBAAmB,EAAmB,CAAE,kBAAiB,GAAa,KAClG,KAAK,SACL,aAAY,KACR,WALN,CAOG,kBACC,EAAC,EAAD,IAAe,KAAqB,IAErC,EACA,kBAAgB,EAAC,EAAD,IAAe,KAAqB"}

package/dist/BannerSectionContent-CY4IfmBj.js

@@ -0,0 +1,4 @@
+import{n as e}from"./Heading-DFWOvlGq.js";import{t as n}from"./Paragraph-ByacJXSw.js";import{t as r}from"./SubHeading-BVGzGWtr.js";import t,{forwardRef as o}from"react";import{jsx as a,jsxs as i}from"react/jsx-runtime";import './assets/BannerSectionContent.css';var d="_bannerSectionContent_1196e_1",s="_bannerSectionContent__content_1196e_7",c="_bannerSectionContent__end-slot_1196e_14",h=["h1","h2","h3","h4","h5"],l=["h2","h3","h4","h5","h6"],m=e=>l[h.indexOf(e)],_=o(({title:t,headingLevel:o="h2",subtitle:h,description:l,styleVariant:_="onLight",startSlot:g,endSlot:f,...p},S)=>{const y="onLight"===_;/* @__PURE__ */
+return i("div",{...p,className:d,"data-on-light":y||void 0,"data-on-dark":!y||void 0,ref:S,children:[/* @__PURE__ */i("div",{className:s,children:[g,
+/* @__PURE__ */a(e,{as:o,size:"lg",foregroundColor:y?"accentSecondary":"whitePrimary",children:t}),h&&/* @__PURE__ */a(r,{as:m(o),size:"xs",foregroundColor:y?"accentSecondary":"whitePrimary",children:h}),l&&/* @__PURE__ */a(n,{size:"lg",foregroundColor:y?"secondary":"whitePrimary",children:l})]}),f&&/* @__PURE__ */a("div",{className:c,children:f})]})});_.displayName="BannerSectionContent";export{_ as t};
+//# sourceMappingURL=BannerSectionContent-CY4IfmBj.js.map

package/dist/BannerSectionContent-CY4IfmBj.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerSectionContent-CY4IfmBj.js","names":[],"sources":["../src/components/BannerSectionContent/BannerSectionContent.module.css","../src/components/BannerSectionContent/BannerSectionContent.tsx"],"sourcesContent":[".bannerSectionContent {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n}\n\n.bannerSectionContent__content {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: var(--alto-sem-space-2xs);\n}\n\n.bannerSectionContent__content:has(+ .bannerSectionContent__end-slot) {\n  padding-bottom: var(--alto-grid-gutter-default);\n}\n","import React, { forwardRef, HTMLAttributes } from 'react';\nimport Heading from '../Heading';\nimport Paragraph from '../Paragraph';\n\nimport styles from './BannerSectionContent.module.css';\nimport SubHeading from '../SubHeading';\n\n// Accepted heading levels for title and subtitle elements\nconst titleHeadingLevels = ['h1', 'h2', 'h3', 'h4', 'h5'] as const;\ntype TitleHeadingLevel = (typeof titleHeadingLevels)[number];\n\nconst subtitleHeadingLevels = ['h2', 'h3', 'h4', 'h5', 'h6'] as const;\ntype SubtitleHeadingLevel = (typeof titleHeadingLevels)[number];\n\n// Get subtitle heading level by matching the index of the title heading level\nconst getSubtitleHeadingLevel = (headingLevel: TitleHeadingLevel) => {\n  const index = titleHeadingLevels.indexOf(headingLevel);\n  return subtitleHeadingLevels[index] as SubtitleHeadingLevel;\n};\n\nexport interface BannerSectionContentProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'className' | 'style'> {\n  /**\n   * Text displayed in heading. Rendered in an `h2` unless `headingLevel` is set\n   */\n  title: string;\n  /**\n   * Heading level of the title element\n   * @default 'h2'\n   */\n  headingLevel?: TitleHeadingLevel;\n  /**\n   * Text displayed in subheading. Renders one heading level below `headingLevel`, default `h3`\n   */\n  subtitle?: string;\n  /**\n   * Content displayed below the title\n   */\n  description?: React.ReactNode;\n  /**\n   * Changes the colour of the `title` and `description` for placement on light or dark backgrounds\n   *\n   * @default 'onLight'\n   */\n  styleVariant?: 'onLight' | 'onDark';\n  /**\n   * Content displayed above the title\n   */\n  startSlot?: React.ReactNode;\n  /**\n   * Content displayed below the description\n   */\n  endSlot?: React.ReactNode;\n}\n\nexport const BannerSectionContent = forwardRef<\n  HTMLDivElement,\n  BannerSectionContentProps\n>(\n  (\n    {\n      title,\n      headingLevel = 'h2',\n      subtitle,\n      description,\n      styleVariant = 'onLight',\n      startSlot,\n      endSlot,\n      ...props\n    },\n    forwardedRef,\n  ) => {\n    const isOnLight = styleVariant === 'onLight';\n\n    return (\n      <div\n        {...props}\n        className={styles['bannerSectionContent']}\n        data-on-light={isOnLight || undefined}\n        data-on-dark={!isOnLight || undefined}\n        ref={forwardedRef}\n      >\n        <div className={styles['bannerSectionContent__content']}>\n          {startSlot}\n          <Heading\n            as={headingLevel}\n            size=\"lg\"\n            foregroundColor={isOnLight ? 'accentSecondary' : 'whitePrimary'}\n          >\n            {title}\n          </Heading>\n          {subtitle && (\n            <SubHeading\n              as={getSubtitleHeadingLevel(headingLevel)}\n              size=\"xs\"\n              foregroundColor={isOnLight ? 'accentSecondary' : 'whitePrimary'}\n            >\n              {subtitle}\n            </SubHeading>\n          )}\n          {description && (\n            <Paragraph\n              size=\"lg\"\n              foregroundColor={isOnLight ? 'secondary' : 'whitePrimary'}\n            >\n              {description}\n            </Paragraph>\n          )}\n        </div>\n        {endSlot && (\n          <div className={styles['bannerSectionContent__end-slot']}>\n            {endSlot}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\nBannerSectionContent.displayName = 'BannerSectionContent';\n\nexport default BannerSectionContent;\n"],"mappings":"yVCQM,EAAqB,CAAC,KAAM,KAAM,KAAM,KAAM,MAG9C,EAAwB,CAAC,KAAM,KAAM,KAAM,KAAM,MAIjD,EAA2B,GAExB,EADO,EAAmB,QAAQ,IAuC9B,EAAuB,EAAA,EAM9B,QACA,eAAe,KACf,WACA,cACA,eAAe,UACf,YACA,aACG,GAEL,KAEA,MAAM,EAA6B,YAAjB;AAElB,OACE,EAAC,MAAD,IACM,EACJ,UAAW,EACX,gBAAe,QAAa,EAC5B,gBAAe,QAAa,EAC5B,IAAK,WALP,gBAOE,EAAC,MAAD,CAAK,UAAW,WAAhB,CACG;eACD,EAAC,EAAD,CACE,GAAI,EACJ,KAAK,KACL,gBAAiB,EAAY,kBAAoB,wBAEhD,IAEF,kBACC,EAAC,EAAD,CACE,GAAI,EAAwB,GAC5B,KAAK,KACL,gBAAiB,EAAY,kBAAoB,wBAEhD,IAGJ,kBACC,EAAC,EAAD,CACE,KAAK,KACL,gBAAiB,EAAY,YAAc,wBAE1C,OAIN,kBACC,EAAC,MAAD,CAAK,UAAW,WACb,SAOb,EAAqB,YAAc"}

package/dist/BannerSectionPlectrum-Cma_FRKz.js

@@ -0,0 +1,6 @@
+import{t as e}from"./dist-B0nWL9R9.js";import{BREAKPOINTS as r}from"./utils/breakpoint/theme/breakpoints.js";import{getBaseValueOrUndefined as t}from"./utils/breakpoint/responsiveSSR.js";import{t as n}from"./Section-DoSIu1Ky.js";import{t as a}from"./BannerSectionContent-CY4IfmBj.js";import i,{forwardRef as s,useMemo as c}from"react";import{jsx as l,jsxs as m}from"react/jsx-runtime";import './assets/BannerSectionPlectrum.css';var o="_banner-section-plectrum_4lnw1_1",d="_banner-section-plectrum--is-mobile-reversed_4lnw1_17",p="_banner-section-plectrum__content-wrapper_4lnw1_43",_="_banner-section-plectrum__media-wrapper_4lnw1_62",u="_banner-section-plectrum-media_4lnw1_77",b="_banner-section-plectrum-media__image_4lnw1_95",h="_banner-section-plectrum-media__pictocard-wrapper_4lnw1_162",v=e("_banner-section-plectrum-media__plectrum-overlay_4lnw1_129",{variants:{plectrumVariant:{sharkfin:"_banner-section-plectrum-media__plectrum-overlay--plectrum-variant-sharkfin_4lnw1_152",sharktooth:"_banner-section-plectrum-media__plectrum-overlay--plectrum-variant-sharktooth_4lnw1_156"}}}),w=({children:e,plectrumVariant:n="sharkfin",src:a,...i})=>{const s=t(a);/* @__PURE__ */
+return m("div",{className:u,...i,children:[
+/* @__PURE__ */m("picture",{className:b,children:["object"==typeof a&&Object.entries(r).toSorted((e,r)=>r[1]-e[1]).map(e=>{const[r,t]=e;return"base"!==r&&a[r]?/* @__PURE__ */l("source",{"data-testid":`banner-section-plectrum-media-source-${r}`,media:`(min-width: ${t}px)`,srcSet:a[r]},r):null}),/* @__PURE__ */l("img",{src:s,"data-testid":"banner-section-plectrum-media-image",alt:""})]}),
+/* @__PURE__ */l("svg",{role:"img","aria-hidden":!0,"data-testid":"banner-section-plectrum-media-plectrum-overlay",viewBox:"0 0 1677 1677",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:v({plectrumVariant:n}),children:/* @__PURE__ */l("path",{d:"M1676.67 1676.67H0V0L1676.67 0V1676.67ZM353.326 1.11555C283.916 -3.42414 215.25 35.7074 187.301 95.9813C56.3545 378.22 -103.769 1008.64 126.585 1581.16C150.857 1641.51 202.026 1675.72 266.001 1675.72C273.616 1675.72 281.408 1675.24 289.351 1674.25C1078.71 1576.78 1578.79 1020.94 1649.94 872.37C1678.62 812.449 1689.71 758.544 1650.58 690.268C1597.01 596.788 1031.47 43.8853 353.326 1.11555Z"})}),e&&/* @__PURE__ */l("div",{className:h,children:e})]})},f=e(o,{variants:{isMobileReversed:{true:d,false:null}}}),y=s(({isMobileReversed:e,children:r,...t},s)=>{const o=i.Children.toArray(r),d=c(()=>o.find(e=>e.type===a),o),u=c(()=>o.find(e=>e.type===w),o);/* @__PURE__ */
+return l(n,{ref:s,justifyContent:"center",paddingX:{base:"none",lg:"lg"},...t,children:/* @__PURE__ */m("div",{className:f({isMobileReversed:e}),children:[/* @__PURE__ */l("div",{className:p,children:d}),/* @__PURE__ */l("div",{className:_,children:u})]})})});y.displayName="BannerSectionPlectrum",a.displayName="BannerSectionPlectrum.Content",y.Content=a,w.displayName="BannerSectionPlectrum.Media",y.Media=w;export{w as n,y as t};
+//# sourceMappingURL=BannerSectionPlectrum-Cma_FRKz.js.map

package/dist/BannerSectionPlectrum-Cma_FRKz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerSectionPlectrum-Cma_FRKz.js","names":[],"sources":["../src/components/BannerSectionPlectrum/BannerSectionPlectrum.module.css","../src/components/BannerSectionPlectrum/BannerSectionPlectrum.tsx"],"sourcesContent":[".banner-section-plectrum {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  gap: var(--alto-sem-space-sm);\n}\n\n@media (--bp-lg) {\n  .banner-section-plectrum {\n    height: 568px;\n  }\n}\n\n.banner-section-plectrum--is-mobile-reversed {\n  flex-direction: column-reverse;\n}\n\n@media (--bp-lg) {\n  .banner-section-plectrum {\n    flex-direction: row;\n    background-color: var(--alto-sem-color-bg-layer1-default);\n    border-radius: var(--alto-card-radius);\n    padding-inline: var(--alto-sem-space-4xl);\n  }\n\n  .banner-section-plectrum--is-mobile-reversed {\n    flex-direction: row;\n  }\n}\n\n@media (--bp-xxl) {\n  .banner-section-plectrum {\n    max-width: calc(\n      1920px - (2 * var(--alto-section-padding-vertical-default))\n    );\n  }\n}\n\n/** Content **/\n.banner-section-plectrum__content-wrapper {\n  position: relative;\n  z-index: 2;\n  padding: var(--alto-sem-space-sm)\n    var(--alto-section-padding-horizontal-default);\n}\n\n@media (--bp-lg) {\n  .banner-section-plectrum__content-wrapper {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: var(--alto-sem-space-md);\n    max-width: var(--alto-section-container-max-width);\n    margin: auto;\n    padding: 0;\n  }\n}\n\n/** Media **/\n.banner-section-plectrum__media-wrapper {\n  position: relative;\n}\n\n@media (--bp-lg) {\n  .banner-section-plectrum__media-wrapper {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    z-index: 1;\n  }\n}\n\n.banner-section-plectrum-media {\n  position: relative;\n  display: flex;\n  width: 100%;\n}\n\n@media (--bp-lg) {\n  .banner-section-plectrum-media {\n    position: absolute;\n    z-index: 1;\n    overflow: hidden;\n    height: 100%;\n    width: calc(50% - (12px + 32px));\n    right: 0;\n    top: 0;\n  }\n}\n\n.banner-section-plectrum-media__image {\n  display: flex;\n  width: 100%;\n  aspect-ratio: 1;\n  background-color: var(--alto-sem-color-bg-base);\n  border: 1px solid var(--alto-sem-color-bg-base); /* Fix for high pixel density screens */\n}\n\n.banner-section-plectrum-media__image img {\n  height: 100%;\n  width: 100%;\n  object-fit: cover;\n}\n\n@media (--bp-sm) {\n  .banner-section-plectrum-media__image {\n    aspect-ratio: 5/4;\n  }\n}\n@media (--bp-md) {\n  .banner-section-plectrum-media__image {\n    aspect-ratio: 3/2;\n  }\n}\n\n@media (--bp-lg) {\n  .banner-section-plectrum-media__image {\n    height: 100%;\n    aspect-ratio: unset;\n    background-color: var(--alto-sem-color-bg-layer1-default);\n    border: 1px solid var(--alto-sem-color-bg-layer1-default); /* Fix for high pixel density screens */\n  }\n}\n\n.banner-section-plectrum-media__plectrum-overlay {\n  position: absolute;\n  top: 0;\n  left: -9.6%;\n  width: 150%;\n}\n\n.banner-section-plectrum-media__plectrum-overlay path {\n  fill: var(--alto-sem-color-bg-base);\n}\n\n@media (--bp-lg) {\n  .banner-section-plectrum-media__plectrum-overlay {\n    width: 167%;\n    left: 0px;\n    top: 0px;\n    min-width: 800px;\n  }\n\n  .banner-section-plectrum-media__plectrum-overlay path {\n    fill: var(--alto-sem-color-bg-layer1-default);\n  }\n\n  .banner-section-plectrum-media__plectrum-overlay--plectrum-variant-sharkfin {\n    top: 0px;\n  }\n\n  .banner-section-plectrum-media__plectrum-overlay--plectrum-variant-sharktooth {\n    top: unset;\n    bottom: -1px;\n  }\n}\n\n.banner-section-plectrum-media__pictocard-wrapper {\n  position: absolute;\n  z-index: 1;\n  bottom: 0;\n  right: 0;\n  max-width: calc(100% - (2 * var(--alto-grid-gutter-default)));\n  padding: var(--alto-grid-gutter-default);\n}\n\n/** BoxLink fix on `xs` breakpoint **/\n\n.banner-section-plectrum [data-alto-box-link] {\n  width: 100%;\n}\n\n@media (max-width: 479px) {\n  .banner-section-plectrum [data-alto-box-link] > div > div {\n    max-width: calc(100% - (2 * var(--alto-grid-gutter-default)));\n  }\n}\n","import React, {\n  HTMLAttributes,\n  ReactElement,\n  ReactNode,\n  forwardRef,\n  useMemo,\n} from 'react';\nimport styles from './BannerSectionPlectrum.module.css';\nimport BannerSectionContent, {\n  BannerSectionContentProps,\n} from '../BannerSectionContent';\nimport { cva } from 'class-variance-authority';\nimport {\n  getBaseValueOrUndefined,\n  ResponsiveValue,\n} from '../../utils/breakpoint/responsiveSSR';\nimport { Breakpoint, BREAKPOINTS } from '../../utils';\nimport Section, { SectionProps } from '../Section';\n\n// Define `src` explicity with `ResponsiveValue` instead of using `WithResponsiveKeys` to fix the prop disappearing in Storybook sub-components section\nexport interface BannerSectionPlectrumMediaProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'classname' | 'styles'> {\n  /**\n   * Element positioned on top on the media in the bottom right corner\n   */\n  children?: ReactNode;\n  /**\n   * Style of the plectrum overlay\n   * @default 'sharktooth'\n   */\n  plectrumVariant?: 'sharktooth' | 'sharkfin';\n  /**\n   * **[Responsive]** Media source, recommended aspect ratio: 3:2.\n   * Responsive image sources are useful when art directing.\n   */\n  src: string | ResponsiveValue<string>;\n}\n\nconst plectrumOverlay = cva(\n  styles['banner-section-plectrum-media__plectrum-overlay'],\n  {\n    variants: {\n      plectrumVariant: {\n        sharkfin:\n          styles[\n            'banner-section-plectrum-media__plectrum-overlay--plectrum-variant-sharkfin'\n          ],\n        sharktooth:\n          styles[\n            'banner-section-plectrum-media__plectrum-overlay--plectrum-variant-sharktooth'\n          ],\n      },\n    },\n  },\n);\n\nexport const BannerSectionPlectrumMedia = ({\n  children,\n  plectrumVariant = 'sharkfin',\n  src,\n  ...rest\n}: BannerSectionPlectrumMediaProps) => {\n  const baseSrc = getBaseValueOrUndefined(src);\n\n  return (\n    <div className={styles['banner-section-plectrum-media']} {...rest}>\n      {/* Media element */}\n      <picture className={styles['banner-section-plectrum-media__image']}>\n        {typeof src === 'object' &&\n          Object.entries(BREAKPOINTS)\n            .toSorted((a, b) => b[1] - a[1]) // `source` breakpoints need to be rendered in the correct order, largest to smallest\n            .map((bp) => {\n              const [breakpoint, minWidth] = bp;\n              if (breakpoint === 'base' || !src[breakpoint as Breakpoint])\n                return null;\n\n              return (\n                <source\n                  key={breakpoint}\n                  data-testid={`banner-section-plectrum-media-source-${breakpoint}`}\n                  media={`(min-width: ${minWidth}px)`}\n                  srcSet={src[breakpoint as Breakpoint]}\n                />\n              );\n            })}\n        <img\n          src={baseSrc}\n          data-testid=\"banner-section-plectrum-media-image\"\n          alt=\"\"\n        />\n      </picture>\n      {/* Plectrum cutout overlay element */}\n      <svg\n        role=\"img\" // Role for purely visual svg elements\n        aria-hidden\n        data-testid=\"banner-section-plectrum-media-plectrum-overlay\"\n        viewBox=\"0 0 1677 1677\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        className={plectrumOverlay({ plectrumVariant })}\n      >\n        <path d=\"M1676.67 1676.67H0V0L1676.67 0V1676.67ZM353.326 1.11555C283.916 -3.42414 215.25 35.7074 187.301 95.9813C56.3545 378.22 -103.769 1008.64 126.585 1581.16C150.857 1641.51 202.026 1675.72 266.001 1675.72C273.616 1675.72 281.408 1675.24 289.351 1674.25C1078.71 1576.78 1578.79 1020.94 1649.94 872.37C1678.62 812.449 1689.71 758.544 1650.58 690.268C1597.01 596.788 1031.47 43.8853 353.326 1.11555Z\" />\n      </svg>\n      {children && (\n        <div\n          className={styles['banner-section-plectrum-media__pictocard-wrapper']}\n        >\n          {children}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport interface BannerSectionPlectrumProps extends SectionProps {\n  /**\n   * Content displayed in the banner section. Expects `BannerSectionPlectrum.Content`, `BannerSectionPlectrum.Media`\n   */\n  children: React.ReactNode;\n  /**\n   * Reverses layout order of Media and Content on screens below lg breakpoint (1024px)\n   */\n  isMobileReversed?: boolean;\n}\n\ninterface BannerSectionPlectrumComponent\n  extends React.ForwardRefExoticComponent<\n    BannerSectionPlectrumProps & React.RefAttributes<HTMLElement>\n  > {\n  Content: typeof BannerSectionContent;\n  Media: typeof BannerSectionPlectrumMedia;\n}\n\nconst bannerSectionPlectrum = cva(styles['banner-section-plectrum'], {\n  variants: {\n    isMobileReversed: {\n      true: styles['banner-section-plectrum--is-mobile-reversed'],\n      false: null,\n    },\n  },\n});\n\nexport const BannerSectionPlectrum = forwardRef<\n  HTMLDivElement,\n  BannerSectionPlectrumProps\n>(({ isMobileReversed, children, ...rest }, forwardedRef) => {\n  /**\n   * Media\n   */\n  const childComponents = React.Children.toArray(children);\n\n  const content = useMemo(() => {\n    return childComponents.find(\n      (child) =>\n        (child as ReactElement<BannerSectionContentProps>).type ===\n        BannerSectionContent,\n    );\n  }, childComponents);\n\n  const media = useMemo(() => {\n    return childComponents.find(\n      (child) =>\n        (child as ReactElement<BannerSectionPlectrumMediaProps>).type ===\n        BannerSectionPlectrumMedia,\n    );\n  }, childComponents);\n\n  return (\n    <Section\n      ref={forwardedRef}\n      justifyContent=\"center\"\n      paddingX={{ base: 'none', lg: 'lg' }}\n      {...rest}\n    >\n      <div className={bannerSectionPlectrum({ isMobileReversed })}>\n        <div className={styles['banner-section-plectrum__content-wrapper']}>\n          {content}\n        </div>\n        <div className={styles['banner-section-plectrum__media-wrapper']}>\n          {media}\n        </div>\n      </div>\n    </Section>\n  );\n}) as BannerSectionPlectrumComponent;\nBannerSectionPlectrum.displayName = 'BannerSectionPlectrum';\n\nBannerSectionContent.displayName = 'BannerSectionPlectrum.Content';\nBannerSectionPlectrum.Content = BannerSectionContent;\n\nBannerSectionPlectrumMedia.displayName = 'BannerSectionPlectrum.Media';\nBannerSectionPlectrum.Media = BannerSectionPlectrumMedia;\n\nexport default BannerSectionPlectrum;\n"],"mappings":"+uBCsCM,EAAkB,+DAEtB,CACE,SAAU,CACR,gBAAiB,CACf,iGAIA,yGASK,EAAA,EACX,WACA,kBAAkB,WAClB,SACG,MAEH,MAAM,EAAU,EAAwB;AAExC,OACE,EAAC,MAAD,CAAK,UAAW,KAA6C,WAA7D;eAEE,EAAC,UAAD,CAAS,UAAW,WAApB,CACkB,iBAAR,GACN,OAAO,QAAQ,GACZ,SAAA,CAAU,EAAG,IAAM,EAAE,GAAK,EAAE,IAC5B,IAAK,IACJ,MAAO,EAAY,GAAY,EAC/B,MAAmB,SAAf,GAA0B,EAAI,kBAIhC,EAAC,SAAD,CAEE,cAAa,wCAAwC,IACrD,MAAO,eAAe,OACtB,OAAQ,EAAI,IAHP,GAJA,sBAWf,EAAC,MAAD,CACE,IAAK,EACL,cAAY,sCACZ,IAAI;eAIR,EAAC,MAAD,CACE,KAAK,MACL,eAAA,EACA,cAAY,iDACZ,QAAQ,gBACR,KAAK,OACL,MAAM,6BACN,UAAW,EAAgB,CAAE,4CAE7B,EAAC,OAAD,CAAM,EAAE,8YAET,kBACC,EAAC,MAAD,CACE,UAAW,EAEV,iBA0BL,EAAwB,EAAI,EAAmC,CACnE,SAAU,CACR,iBAAkB,CAChB,KAAM,EACN,MAAO,SAKA,EAAwB,EAAA,EAGhC,mBAAkB,cAAa,GAAQ,KAI1C,MAAM,EAAkB,EAAM,SAAS,QAAQ,GAEzC,EAAU,EAAA,IACP,EAAgB,KACpB,GACE,EAAkD,OACnD,GAEH,GAEG,EAAQ,EAAA,IACL,EAAgB,KACpB,GACE,EAAwD,OACzD,GAEH;AAEH,OACE,EAAC,EAAD,CACE,IAAK,EACL,eAAe,SACf,SAAU,CAAE,KAAM,OAAQ,GAAI,SAC1B,0BAEJ,EAAC,MAAD,CAAK,UAAW,EAAsB,CAAE,8BAAxC,gBACE,EAAC,MAAD,CAAK,UAAW,WACb,mBAEH,EAAC,MAAD,CAAK,UAAW,WACb,WAMX,EAAsB,YAAc,wBAEpC,EAAqB,YAAc,gCACnC,EAAsB,QAAU,EAEhC,EAA2B,YAAc,8BACzC,EAAsB,MAAQ"}

package/dist/Box-B6PIHJQ2.js

@@ -0,0 +1,3 @@
+import{r as o}from"./backgroundColor-CWudpbwi.js";import{generateResponsiveClasses as r,getBaseValueOrUndefined as i}from"./utils/breakpoint/responsiveSSR.js";import{n as t,r as d}from"./padding-BOBsD3FM.js";import{a,i as e,o as n,r as m}from"./flex-BPwdqZ_O.js";import{n as g,r as p}from"./margin-DDdhQ_cW.js";import{w as s}from"./border-BG4jNsTr.js";import{r as l}from"./position-Dkx8pbtt.js";import{responsiveToCssVars as f}from"./utils/breakpoint/responsiveToCssVars.js";import h from"react";import{jsx as b}from"react/jsx-runtime";import './assets/Box.css';var x={box:"_box_sckl4_1"},u=r(n),R=r(d),c=r(p),B=/* @__PURE__ */new Set,W=[["borderTopRadius",["borderRadiusTopLeft","borderRadiusTopRight"]],["borderBottomRadius",["borderRadiusBottomLeft","borderRadiusBottomRight"]],["borderLeftRadius",["borderRadiusTopLeft","borderRadiusBottomLeft"]],["borderRightRadius",["borderRadiusTopRight","borderRadiusBottomRight"]]],v=({children:r,as:d="div",width:n,height:p,minHeight:h,zIndex:v,top:w,right:T,bottom:C,left:L,position:j,"data-testid":k,dataTestId:y="box",overflowWrap:G,wordBreak:I,...X})=>{"production"!==process.env.NODE_ENV&&W.forEach(([o,r])=>{o in X&&void 0!==X[o]&&!B.has(o)&&(B.add(o),console.warn(`[Box] The prop "${o}" is deprecated. Please use ${r.map(o=>`"${o}"`).join(" and ")} instead.`))});const Y=i(X.justifyContent),P=i(X.flexDirection),S=i(X.gap),D=i(X.rowGap),H=i(X.columnGap),_=i(X.alignItems),E=i(X.display),N=i(X.flexWrap),$=i(X.flexGrow),z=i(X.flexShrink),V=i(X.flexBasis),q=i(X.paddingTop),O=i(X.paddingRight),A=i(X.paddingBottom),F=i(X.paddingLeft),J=i(X.padding),K=i(X.paddingX),M=i(X.paddingY),Q=i(X.marginTop),U=i(X.marginRight),Z=i(X.marginBottom),oo=i(X.marginLeft),ro=i(X.margin),io=i(X.marginX),to=i(X.marginY),ao=f(X.maxWidth,{varPrefix:"--box-max-width",normalise:o=>"pageWidth"===o?"var(--alto-section-container-max-width)":o}),eo=f(X.maxHeight,{varPrefix:"--box-max-height",normalise:o=>o}),no=f(X.minWidth,{varPrefix:"--box-min-width",normalise:o=>o}),mo=f(X.flexBasis,{varPrefix:"--box-flex-basis",normalise:o=>a(o)}),go=m({display:E,justifyContent:Y,flexDirection:P,gap:S,rowGap:D,columnGap:H,alignItems:_,flexWrap:N,flexGrow:$,flexShrink:z,flexBasis:e(V)?V:void 0}),po=t({paddingTop:q,paddingRight:O,paddingBottom:A,paddingLeft:F,padding:J,paddingX:K,paddingY:M}),so=g({marginTop:Q,marginRight:U,marginBottom:Z,marginLeft:oo,margin:ro,marginX:io,marginY:to}),lo=u(X.justifyContent,"flex-justify-content"),fo=u(X.flexDirection,"flex-direction"),ho=u(X.gap,"flex-gap"),bo=u(X.rowGap,"flex-row-gap"),xo=u(X.columnGap,"flex-column-gap"),uo=u(X.alignItems,"flex-align-items"),Ro=R(X.paddingTop,"padding-top"),co=R(X.paddingRight,"padding-right"),Bo=R(X.paddingBottom,"padding-bottom"),Wo=R(X.paddingLeft,"padding-left"),vo=R(X.padding,"padding"),wo=R(X.paddingX,"padding-x"),To=R(X.paddingY,"padding-y"),Co=c(X.marginTop,"margin-top"),Lo=c(X.marginRight,"margin-right"),jo=c(X.marginBottom,"margin-bottom"),ko=c(X.marginLeft,"margin-left"),yo=c(X.margin,"margin"),Go=c(X.marginX,"margin-x"),Io=c(X.marginY,"margin-y"),Xo=X?.borderWidth||void 0===X.borderColour||"none"===X.borderColour?X.borderWidth:"sm",Yo=X?.borderTopWidth||void 0===X.borderTopColour||"none"===X.borderTopColour?X.borderTopWidth:"sm",Po=X?.borderRightWidth||void 0===X.borderRightColour||"none"===X.borderRightColour?X.borderRightWidth:"sm",So=X?.borderBottomWidth||void 0===X.borderBottomColour||"none"===X.borderBottomColour?X.borderBottomWidth:"sm",Do=X?.borderLeftWidth||void 0===X.borderLeftColour||"none"===X.borderLeftColour?X.borderLeftWidth:"sm",Ho={width:"full"===n?"100%":n,height:"full"===p?"100%":p,minHeight:h,zIndex:v,top:w,right:T,bottom:C,left:L,...ao,...no,...eo,...mo,overflow:X.maxHeight||X.maxWidth?"auto":void 0,overflowWrap:G,wordBreak:I};/* @__PURE__ */
+return b(d,{className:[x.box,s({...X,borderWidth:Xo,borderTopWidth:Yo,borderRightWidth:Po,borderBottomWidth:So,borderLeftWidth:Do}),go,po,so,o({backgroundColor:X.backgroundColor,...X}),l({position:j}),...lo,...fo,...ho,...bo,...xo,...uo,...Ro,...co,...Bo,...Wo,...vo,...wo,...To,...Co,...Lo,...jo,...ko,...yo,...Go,...Io].filter(Boolean).join(" "),style:Ho,"data-testid":k??y,children:r})};export{v as t};
+//# sourceMappingURL=Box-B6PIHJQ2.js.map

package/dist/Box-B6PIHJQ2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Box-B6PIHJQ2.js","names":[],"sources":["../src/components/Box/Box.module.css","../src/components/Box/Box.tsx"],"sourcesContent":[".box {\n  /* Prevent CSS variable inheritance between nested Box components. */\n  --box-max-width-base: initial;\n  --box-max-width-sm: initial;\n  --box-max-width-md: initial;\n  --box-max-width-lg: initial;\n  --box-max-width-xl: initial;\n  --box-max-width-xxl: initial;\n  --box-min-width-base: initial;\n  --box-min-width-sm: initial;\n  --box-min-width-md: initial;\n  --box-min-width-lg: initial;\n  --box-min-width-xl: initial;\n  --box-min-width-xxl: initial;\n  --box-max-height-base: initial;\n  --box-max-height-sm: initial;\n  --box-max-height-md: initial;\n  --box-max-height-lg: initial;\n  --box-max-height-xl: initial;\n  --box-max-height-xxl: initial;\n  --box-flex-basis-base: initial;\n  --box-flex-basis-sm: initial;\n  --box-flex-basis-md: initial;\n  --box-flex-basis-lg: initial;\n  --box-flex-basis-xl: initial;\n  --box-flex-basis-xxl: initial;\n\n  max-width: var(--box-max-width-base, none);\n  min-width: var(--box-min-width-base, none);\n  max-height: var(--box-max-height-base, none);\n  flex-basis: var(--box-flex-basis-base, auto);\n}\n\n@media (--bp-sm) {\n  .box {\n    max-width: var(--box-max-width-sm, var(--box-max-width-base, none));\n    min-width: var(--box-min-width-sm, var(--box-min-width-base, none));\n    max-height: var(--box-max-height-sm, var(--box-max-height-base, none));\n    flex-basis: var(--box-flex-basis-sm, var(--box-flex-basis-base, auto));\n  }\n}\n\n@media (--bp-md) {\n  .box {\n    max-width: var(\n      --box-max-width-md,\n      var(--box-max-width-sm, var(--box-max-width-base, none))\n    );\n    min-width: var(\n      --box-min-width-md,\n      var(--box-min-width-sm, var(--box-min-width-base, none))\n    );\n    max-height: var(\n      --box-max-height-md,\n      var(--box-max-height-sm, var(--box-max-height-base, none))\n    );\n    flex-basis: var(\n      --box-flex-basis-md,\n      var(--box-flex-basis-sm, var(--box-flex-basis-base, auto))\n    );\n  }\n}\n\n@media (--bp-lg) {\n  .box {\n    max-width: var(\n      --box-max-width-lg,\n      var(\n        --box-max-width-md,\n        var(--box-max-width-sm, var(--box-max-width-base, none))\n      )\n    );\n    min-width: var(\n      --box-min-width-lg,\n      var(\n        --box-min-width-md,\n        var(--box-min-width-sm, var(--box-min-width-base, none))\n      )\n    );\n    max-height: var(\n      --box-max-height-lg,\n      var(\n        --box-max-height-md,\n        var(--box-max-height-sm, var(--box-max-height-base, none))\n      )\n    );\n    flex-basis: var(\n      --box-flex-basis-lg,\n      var(\n        --box-flex-basis-md,\n        var(--box-flex-basis-sm, var(--box-flex-basis-base, auto))\n      )\n    );\n  }\n}\n\n@media (--bp-xl) {\n  .box {\n    max-width: var(\n      --box-max-width-xl,\n      var(\n        --box-max-width-lg,\n        var(\n          --box-max-width-md,\n          var(--box-max-width-sm, var(--box-max-width-base, none))\n        )\n      )\n    );\n    min-width: var(\n      --box-min-width-xl,\n      var(\n        --box-min-width-lg,\n        var(\n          --box-min-width-md,\n          var(--box-min-width-sm, var(--box-min-width-base, none))\n        )\n      )\n    );\n    max-height: var(\n      --box-max-height-xl,\n      var(\n        --box-max-height-lg,\n        var(\n          --box-max-height-md,\n          var(--box-max-height-sm, var(--box-max-height-base, none))\n        )\n      )\n    );\n    flex-basis: var(\n      --box-flex-basis-xl,\n      var(\n        --box-flex-basis-lg,\n        var(\n          --box-flex-basis-md,\n          var(--box-flex-basis-sm, var(--box-flex-basis-base, auto))\n        )\n      )\n    );\n  }\n}\n\n@media (--bp-xxl) {\n  .box {\n    max-width: var(\n      --box-max-width-xxl,\n      var(\n        --box-max-width-xl,\n        var(\n          --box-max-width-lg,\n          var(\n            --box-max-width-md,\n            var(--box-max-width-sm, var(--box-max-width-base, none))\n          )\n        )\n      )\n    );\n    min-width: var(\n      --box-min-width-xxl,\n      var(\n        --box-min-width-xl,\n        var(\n          --box-min-width-lg,\n          var(\n            --box-min-width-md,\n            var(--box-min-width-sm, var(--box-min-width-base, none))\n          )\n        )\n      )\n    );\n    max-height: var(\n      --box-max-height-xxl,\n      var(\n        --box-max-height-xl,\n        var(\n          --box-max-height-lg,\n          var(\n            --box-max-height-md,\n            var(--box-max-height-sm, var(--box-max-height-base, none))\n          )\n        )\n      )\n    );\n    flex-basis: var(\n      --box-flex-basis-xxl,\n      var(\n        --box-flex-basis-xl,\n        var(\n          --box-flex-basis-lg,\n          var(\n            --box-flex-basis-md,\n            var(--box-flex-basis-sm, var(--box-flex-basis-base, auto))\n          )\n        )\n      )\n    );\n  }\n}\n","import React, { CSSProperties } from 'react';\nimport styles from './Box.module.css';\nimport {\n  backgroundColorVariants,\n  type BackgroundVariants,\n} from '../../utils/backgroundColor/backgroundColor';\nimport {\n  flexVariants,\n  isFlexBasisToken,\n  resolveFlexBasisCssValue,\n  type FlexBasisToken,\n  type FlexVariants,\n} from '../../utils/flex/flex';\nimport flexStyles from '../../utils/flex/flex.module.css';\nimport paddingStyles from '../../utils/padding/padding.module.css';\nimport marginStyles from '../../utils/margin/margin.module.css';\nimport { borderVariants, type BorderVariants } from '../../utils/border/border';\nimport {\n  paddingVariants,\n  type PaddingVariants,\n} from '../../utils/padding/padding';\nimport { marginVariants, type MarginVariants } from '../../utils/margin/margin';\nimport {\n  positionVariants,\n  type PositionVariants,\n} from '../../utils/position/position';\nimport {\n  getBaseValueOrUndefined,\n  generateResponsiveClasses,\n  type WithResponsiveProps,\n} from '../../utils/breakpoint/responsiveSSR';\nimport { responsiveToCssVars } from '../../utils/breakpoint/responsiveToCssVars';\n\nconst getResponsiveClassesFlex = generateResponsiveClasses(flexStyles);\nconst getResponsiveClassesPadding = generateResponsiveClasses(paddingStyles);\nconst getResponsiveClassesMargin = generateResponsiveClasses(marginStyles);\n\nconst warnedDeprecations = new Set<string>();\nconst deprecatedBorderRadiusProps: Array<[string, string[]]> = [\n  ['borderTopRadius', ['borderRadiusTopLeft', 'borderRadiusTopRight']],\n  ['borderBottomRadius', ['borderRadiusBottomLeft', 'borderRadiusBottomRight']],\n  ['borderLeftRadius', ['borderRadiusTopLeft', 'borderRadiusBottomLeft']],\n  ['borderRightRadius', ['borderRadiusTopRight', 'borderRadiusBottomRight']],\n];\n\nexport interface BoxBaseProps\n  extends BackgroundVariants,\n    Omit<FlexVariants, 'flexBasis'>,\n    BorderVariants,\n    PaddingVariants,\n    MarginVariants,\n    PositionVariants,\n    Omit<React.HTMLAttributes<Element>, 'className' | 'style'> {\n  /**\n   * @deprecated Use `borderRadiusTopLeft` and `borderRadiusTopRight` instead.\n   */\n  borderTopRadius?: BorderVariants['borderTopRadius'];\n  /**\n   * @deprecated Use `borderRadiusBottomLeft` and `borderRadiusBottomRight` instead.\n   */\n  borderBottomRadius?: BorderVariants['borderBottomRadius'];\n  /**\n   * @deprecated Use `borderRadiusTopLeft` and `borderRadiusBottomLeft` instead.\n   */\n  borderLeftRadius?: BorderVariants['borderLeftRadius'];\n  /**\n   * @deprecated Use `borderRadiusTopRight` and `borderRadiusBottomRight` instead.\n   */\n  borderRightRadius?: BorderVariants['borderRightRadius'];\n  /**\n   * The HTML element to render the Box as.\n   */\n  as?:\n    | 'div'\n    | 'article'\n    | 'aside'\n    | 'nav'\n    | 'section'\n    | 'main'\n    | 'span'\n    | 'ul'\n    | 'ol'\n    | 'li';\n  /**\n   * The width of the Box.\n   * Accepts any valid CSS unit or \"full\"\n   */\n  width?: 'full' | string;\n  /**\n   * **[Responsive]** The maximum width of the Box.\n   * Accepts any valid CSS unit or \"pageWidth\" to use the `section-container-max-width` token.\n   */\n  maxWidth?: 'pageWidth' | string;\n  /**\n   * **[Responsive]** The minimum width of the Box.\n   * Accepts any valid CSS unit.\n   */\n  minWidth?: string;\n  /**\n   * The height of the Box.\n   * Accepts any valid CSS unit.\n   */\n  height?: string;\n  /**\n   * **[Responsive]** The maximum height of the Box.\n   * Accepts any valid CSS unit.\n   */\n  maxHeight?: string;\n  /**\n   * The minimum height of the Box.\n   * Accepts any valid CSS unit.\n   */\n  minHeight?: string;\n  /**\n   * The z-index of the Box.\n   * Accepts any valid CSS z-index value.\n   */\n  zIndex?: string;\n  /**\n   * The top position of the Box.\n   * Accepts any valid CSS position value.\n   */\n  top?: string;\n  /**\n   * The right position of the Box.\n   * Accepts any valid CSS position value.\n   */\n  right?: string;\n  /**\n   * The bottom position of the Box.\n   * Accepts any valid CSS position value.\n   */\n  bottom?: string;\n  /**\n   * The left position of the Box.\n   * Accepts any valid CSS position value.\n   */\n  left?: string;\n  /**\n   * Test identifier for testing purposes.\n   * Defaults to \"box\" if not provided.\n   */\n  'data-testid'?: string;\n  /**\n   * @deprecated Use `data-testid` instead.\n   * @ignore\n   */\n  dataTestId?: string;\n  /**\n   * CSS overflow-wrap property.\n   */\n  overflowWrap?: 'normal' | 'break-word' | 'anywhere';\n  /**\n   * CSS word-break property.\n   */\n  wordBreak?: React.CSSProperties['wordBreak'];\n  /**\n   * **[Responsive]** Defines the default size of a flex item before remaining space is distributed.\n   * Accepts predefined flex-basis tokens and arbitrary CSS values (e.g. \"200px\", \"30%\", \"clamp(200px, 50vw, 400px)\").\n   */\n  flexBasis?: FlexBasisToken | string | number;\n}\n\ntype ResponsivePropKeys =\n  | 'justifyContent'\n  | 'flexDirection'\n  | 'gap'\n  | 'rowGap'\n  | 'columnGap'\n  | 'flexBasis'\n  | 'alignItems'\n  | 'paddingTop'\n  | 'paddingRight'\n  | 'paddingBottom'\n  | 'paddingLeft'\n  | 'padding'\n  | 'paddingX'\n  | 'paddingY'\n  | 'marginTop'\n  | 'marginRight'\n  | 'marginBottom'\n  | 'marginLeft'\n  | 'margin'\n  | 'marginX'\n  | 'marginY'\n  | 'minWidth'\n  | 'maxWidth'\n  | 'maxHeight';\n\nexport type BoxProps = WithResponsiveProps<BoxBaseProps, ResponsivePropKeys>;\n\nexport const Box = ({\n  children,\n  as: Component = 'div',\n  width,\n  height,\n  minHeight,\n  zIndex,\n  top,\n  right,\n  bottom,\n  left,\n  position,\n  'data-testid': dataTestIdNative,\n  dataTestId: dataTestIdLegacy = 'box',\n  overflowWrap,\n  wordBreak,\n  ...props\n}: BoxProps) => {\n  // Deprecation warnings for side-based border radius props\n  if (process.env.NODE_ENV !== 'production') {\n    deprecatedBorderRadiusProps.forEach(([prop, replacements]) => {\n      const typedProp = prop as keyof typeof props;\n      if (\n        typedProp in props &&\n        props[typedProp] !== undefined &&\n        !warnedDeprecations.has(prop)\n      ) {\n        warnedDeprecations.add(prop);\n        console.warn(\n          `[Box] The prop \"${prop}\" is deprecated. Please use ${replacements\n            .map((replacement) => `\"${replacement}\"`)\n            .join(' and ')} instead.`,\n        );\n      }\n    });\n  }\n\n  //Responsive Props\n\n  const baseJustifyContent = getBaseValueOrUndefined(props.justifyContent);\n  const baseFlexDirection = getBaseValueOrUndefined(props.flexDirection);\n  const baseGap = getBaseValueOrUndefined(props.gap);\n  const baseRowGap = getBaseValueOrUndefined(props.rowGap);\n  const baseColumnGap = getBaseValueOrUndefined(props.columnGap);\n  const baseAlignItems = getBaseValueOrUndefined(props.alignItems);\n  const baseDisplay = getBaseValueOrUndefined(props.display);\n  const baseFlexWrap = getBaseValueOrUndefined(props.flexWrap);\n  const baseFlexGrow = getBaseValueOrUndefined(props.flexGrow);\n  const baseFlexShrink = getBaseValueOrUndefined(props.flexShrink);\n  const baseFlexBasis = getBaseValueOrUndefined(props.flexBasis);\n  const basePaddingTop = getBaseValueOrUndefined(props.paddingTop);\n  const basePaddingRight = getBaseValueOrUndefined(props.paddingRight);\n  const basePaddingBottom = getBaseValueOrUndefined(props.paddingBottom);\n  const basePaddingLeft = getBaseValueOrUndefined(props.paddingLeft);\n  const basePadding = getBaseValueOrUndefined(props.padding);\n  const basePaddingX = getBaseValueOrUndefined(props.paddingX);\n  const basePaddingY = getBaseValueOrUndefined(props.paddingY);\n  const baseMarginTop = getBaseValueOrUndefined(props.marginTop);\n  const baseMarginRight = getBaseValueOrUndefined(props.marginRight);\n  const baseMarginBottom = getBaseValueOrUndefined(props.marginBottom);\n  const baseMarginLeft = getBaseValueOrUndefined(props.marginLeft);\n  const baseMargin = getBaseValueOrUndefined(props.margin);\n  const baseMarginX = getBaseValueOrUndefined(props.marginX);\n  const baseMarginY = getBaseValueOrUndefined(props.marginY);\n\n  const maxWidthVars = responsiveToCssVars(props.maxWidth, {\n    varPrefix: '--box-max-width',\n    normalise: (value) => {\n      if (value === 'pageWidth') {\n        return 'var(--alto-section-container-max-width)';\n      }\n      return value; // arbitrary CSS string (e.g. \"960px\", \"80vw\", \"min(960px, 100%)\")\n    },\n  });\n\n  const maxHeightVars = responsiveToCssVars(props.maxHeight, {\n    varPrefix: '--box-max-height',\n    normalise: (value) => value, // arbitrary CSS string (e.g. \"500px\", \"80vh\", \"min(500px, 100%)\")\n  });\n\n  const minWidthVars = responsiveToCssVars(props.minWidth, {\n    varPrefix: '--box-min-width',\n    normalise: (value) => value, // arbitrary CSS string (e.g. \"300px\", \"50vw\", \"min(300px, 100%)\")\n  });\n\n  const flexBasisVars = responsiveToCssVars(props.flexBasis, {\n    varPrefix: '--box-flex-basis',\n    normalise: (value) => resolveFlexBasisCssValue(value),\n  });\n\n  const flexBaseClass = flexVariants({\n    display: baseDisplay,\n    justifyContent: baseJustifyContent,\n    flexDirection: baseFlexDirection,\n    gap: baseGap,\n    rowGap: baseRowGap,\n    columnGap: baseColumnGap,\n    alignItems: baseAlignItems,\n    flexWrap: baseFlexWrap,\n    flexGrow: baseFlexGrow,\n    flexShrink: baseFlexShrink,\n    flexBasis: isFlexBasisToken(baseFlexBasis) ? baseFlexBasis : undefined,\n  });\n\n  const paddingBaseClass = paddingVariants({\n    paddingTop: basePaddingTop,\n    paddingRight: basePaddingRight,\n    paddingBottom: basePaddingBottom,\n    paddingLeft: basePaddingLeft,\n    padding: basePadding,\n    paddingX: basePaddingX,\n    paddingY: basePaddingY,\n  });\n\n  const marginBaseClass = marginVariants({\n    marginTop: baseMarginTop,\n    marginRight: baseMarginRight,\n    marginBottom: baseMarginBottom,\n    marginLeft: baseMarginLeft,\n    margin: baseMargin,\n    marginX: baseMarginX,\n    marginY: baseMarginY,\n  });\n\n  const justifyContentResponsiveClasses = getResponsiveClassesFlex(\n    props.justifyContent,\n    'flex-justify-content',\n  );\n\n  const flexDirectionResponsiveClasses = getResponsiveClassesFlex(\n    props.flexDirection,\n    'flex-direction',\n  );\n\n  const gapResponsiveClasses = getResponsiveClassesFlex(props.gap, 'flex-gap');\n\n  const rowGapResponsiveClasses = getResponsiveClassesFlex(\n    props.rowGap,\n    'flex-row-gap',\n  );\n\n  const columnGapResponsiveClasses = getResponsiveClassesFlex(\n    props.columnGap,\n    'flex-column-gap',\n  );\n\n  const alignItemsResponsiveClasses = getResponsiveClassesFlex(\n    props.alignItems,\n    'flex-align-items',\n  );\n\n  const paddingTopResponsiveClasses = getResponsiveClassesPadding(\n    props.paddingTop,\n    'padding-top',\n  );\n\n  const paddingRightResponsiveClasses = getResponsiveClassesPadding(\n    props.paddingRight,\n    'padding-right',\n  );\n\n  const paddingBottomResponsiveClasses = getResponsiveClassesPadding(\n    props.paddingBottom,\n    'padding-bottom',\n  );\n\n  const paddingLeftResponsiveClasses = getResponsiveClassesPadding(\n    props.paddingLeft,\n    'padding-left',\n  );\n\n  const paddingResponsiveClasses = getResponsiveClassesPadding(\n    props.padding,\n    'padding',\n  );\n\n  const paddingXResponsiveClasses = getResponsiveClassesPadding(\n    props.paddingX,\n    'padding-x',\n  );\n\n  const paddingYResponsiveClasses = getResponsiveClassesPadding(\n    props.paddingY,\n    'padding-y',\n  );\n\n  const marginTopResponsiveClasses = getResponsiveClassesMargin(\n    props.marginTop,\n    'margin-top',\n  );\n\n  const marginRightResponsiveClasses = getResponsiveClassesMargin(\n    props.marginRight,\n    'margin-right',\n  );\n\n  const marginBottomResponsiveClasses = getResponsiveClassesMargin(\n    props.marginBottom,\n    'margin-bottom',\n  );\n\n  const marginLeftResponsiveClasses = getResponsiveClassesMargin(\n    props.marginLeft,\n    'margin-left',\n  );\n\n  const marginResponsiveClasses = getResponsiveClassesMargin(\n    props.margin,\n    'margin',\n  );\n\n  const marginXResponsiveClasses = getResponsiveClassesMargin(\n    props.marginX,\n    'margin-x',\n  );\n\n  const marginYResponsiveClasses = getResponsiveClassesMargin(\n    props.marginY,\n    'margin-y',\n  );\n\n  // Keep existing convenience behavior for all-sides borders:\n  // if a border colour is set but width is omitted, default width to `sm`.\n  const borderWidth =\n    !props?.borderWidth &&\n    props.borderColour !== undefined &&\n    props.borderColour !== 'none'\n      ? 'sm'\n      : props.borderWidth;\n\n  // Mirror the same convenience behavior for top-only borders.\n  // If top colour is set without top width, default top width to `sm`.\n  const borderTopWidth =\n    !props?.borderTopWidth &&\n    props.borderTopColour !== undefined &&\n    props.borderTopColour !== 'none'\n      ? 'sm'\n      : props.borderTopWidth;\n\n  // Apply the same side-only convenience fallback for right, bottom, and left.\n  const borderRightWidth =\n    !props?.borderRightWidth &&\n    props.borderRightColour !== undefined &&\n    props.borderRightColour !== 'none'\n      ? 'sm'\n      : props.borderRightWidth;\n\n  const borderBottomWidth =\n    !props?.borderBottomWidth &&\n    props.borderBottomColour !== undefined &&\n    props.borderBottomColour !== 'none'\n      ? 'sm'\n      : props.borderBottomWidth;\n\n  const borderLeftWidth =\n    !props?.borderLeftWidth &&\n    props.borderLeftColour !== undefined &&\n    props.borderLeftColour !== 'none'\n      ? 'sm'\n      : props.borderLeftWidth;\n\n  const stylesProp: React.CSSProperties = {\n    width: width === 'full' ? '100%' : (width as CSSProperties['width']),\n    height: height === 'full' ? '100%' : height,\n    minHeight,\n    zIndex,\n    top,\n    right,\n    bottom,\n    left,\n    ...maxWidthVars,\n    ...minWidthVars,\n    ...maxHeightVars,\n    ...flexBasisVars,\n    overflow: props.maxHeight || props.maxWidth ? 'auto' : undefined,\n    overflowWrap,\n    wordBreak,\n  };\n\n  return (\n    <Component\n      className={[\n        styles.box,\n        borderVariants({\n          ...props,\n          borderWidth,\n          borderTopWidth,\n          borderRightWidth,\n          borderBottomWidth,\n          borderLeftWidth,\n        }),\n        flexBaseClass,\n        paddingBaseClass,\n        marginBaseClass,\n        backgroundColorVariants({\n          backgroundColor: props.backgroundColor,\n          ...props,\n        }),\n        positionVariants({ position }),\n        ...justifyContentResponsiveClasses,\n        ...flexDirectionResponsiveClasses,\n        ...gapResponsiveClasses,\n        ...rowGapResponsiveClasses,\n        ...columnGapResponsiveClasses,\n        ...alignItemsResponsiveClasses,\n        ...paddingTopResponsiveClasses,\n        ...paddingRightResponsiveClasses,\n        ...paddingBottomResponsiveClasses,\n        ...paddingLeftResponsiveClasses,\n        ...paddingResponsiveClasses,\n        ...paddingXResponsiveClasses,\n        ...paddingYResponsiveClasses,\n        ...marginTopResponsiveClasses,\n        ...marginRightResponsiveClasses,\n        ...marginBottomResponsiveClasses,\n        ...marginLeftResponsiveClasses,\n        ...marginResponsiveClasses,\n        ...marginXResponsiveClasses,\n        ...marginYResponsiveClasses,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={stylesProp}\n      data-testid={dataTestIdNative ?? dataTestIdLegacy}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Box;\n"],"mappings":"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"}

package/dist/BoxLink-D5clnx38.js

@@ -0,0 +1,3 @@
+import{t as e}from"./VisuallyHidden-oVPU7r7u.js";import{t as i}from"./focusStyles-BA5rd0UP.js";import{BoxLinkContext as o}from"./components/BoxLink/BoxLinkContext.js";import{forwardRef as r}from"react";import{jsx as s,jsxs as t}from"react/jsx-runtime";import{mergeProps as n,useObjectRef as a}from"@react-aria/utils";import{useLink as d}from"@react-aria/link";import{useHover as l}from"@react-aria/interactions";import{useFocusRing as u}from"@react-aria/focus";import './assets/BoxLink.css';var c="_box-link_jbtzi_1",f="_box-link--default_jbtzi_8",p="_box-link--underline-heading-on-hover_jbtzi_53",v="_box-link--disabled_jbtzi_61",b=["onPointerDown","onPointerUp","onPointerCancel","onMouseDown","onMouseUp","onTouchStart","onTouchEnd"],m="noopener noreferrer",h=r(function({children:r,isSelected:h=!1,isDisabled:k=!1,focusStyle:_="default",underlineHeadingOnHover:x=!1,styleVariant:D="default",target:j="_self",externalLinkScreenReaderText:H="opens in a new tab",allowDragGestures:P=!1,href:S,onClick:y,rel:g,...C},w){const F=a(w),O=function(e){if("boolean"==typeof e)return e;if("string"==typeof e){const i=e.trim().toLowerCase();if("true"===i)return!0;if("false"===i)return!1}return!1}(k),z="_blank"===j,L=((e,i)=>e?i?`${m} ${i}`:m:i)(z,g),{linkProps:V,isPressed:B}=d({isDisabled:O,href:S},F),T=Object.fromEntries(Object.entries(V).filter(([e])=>!b.includes(e))),E=P?T:V,{hoverProps:M,isHovered:U}=l({isDisabled:O}),{focusProps:$,isFocusVisible:G,isFocused:N}=u(),R="default"===D,q=(({isDefault:e,focusStyle:o,underlineHeadingOnHover:r,disabled:s})=>{const t=[c];return e&&(t.push(f),t.push(i({focusStyle:o})),r&&t.push(p)),s&&t.push(v),t.filter(Boolean).join(" ")})({isDefault:R,focusStyle:_,underlineHeadingOnHover:x,disabled:O}),A=(({isDefault:e,isHovered:i,isFocused:o,isPressed:r,isSelected:s})=>e?{"data-hovered":!!i||void 0,"data-focused":!!o||void 0,"data-pressed":!!r||void 0,"data-selected":!!s||void 0}:{"data-hovered":void 0,"data-focused":void 0,"data-pressed":void 0,"data-selected":void 0})({isDefault:R,isHovered:U,isFocused:N,isPressed:B,isSelected:h});/* @__PURE__ */
+return s(o.Provider,{value:{isHovered:U,isPressed:B,isFocusVisible:G,isDisabled:O,isSelected:h},children:/* @__PURE__ */t("a",{...n(E,M,$,C),ref:F,href:O?void 0:S,target:j,rel:L,"aria-disabled":!!O||void 0,className:q,onClick:e=>{O?e.preventDefault():(V.onClick?.(e),y?.(e))},"data-alto-box-link":"",...A,children:[r,z&&/* @__PURE__ */s(e,{children:H})]})})});export{h as t};
+//# sourceMappingURL=BoxLink-D5clnx38.js.map

package/dist/BoxLink-D5clnx38.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BoxLink-D5clnx38.js","names":[],"sources":["../src/components/BoxLink/BoxLink.module.css","../src/components/BoxLink/BoxLink.tsx"],"sourcesContent":[".box-link,\n[data-alto-box-link] {\n  --alto-boxlink-transition: 300ms cubic-bezier(0.5, 0, 0.23, 1);\n  text-decoration: none;\n  display: inline-block;\n}\n\n.box-link--default {\n  border-radius: var(--alto-card-radius);\n  border: var(--alto-sem-border-width-sm) solid\n    var(--alto-sem-color-border-secondary);\n  background-color: var(--alto-sem-color-bg-layer2-default);\n  outline-offset: -1px;\n  transition:\n    background-color var(--alto-boxlink-transition),\n    outline-color var(--alto-boxlink-transition),\n    transform var(--alto-boxlink-transition);\n}\n\n.box-link--default[data-hovered] {\n  outline: var(--alto-sem-border-width-md) solid\n    var(--alto-sem-color-border-accent);\n  background-color: var(--alto-sem-color-bg-layer2-hover);\n  transform: translateY(-1px);\n}\n\n.box-link--default[data-pressed] {\n  outline: var(--alto-sem-border-width-md) solid\n    var(--alto-sem-color-border-accent);\n  background-color: var(--alto-sem-color-bg-layer2-active);\n  transform: translateY(0);\n}\n\n.box-link--default[data-focused] {\n  outline-width: var(--alto-sem-border-width-md);\n  outline-style: solid;\n  outline-offset: var(--alto-sem-border-width-md);\n  /* TODO - replace this with card-radiusFocus after tokens merged in */\n  border-radius: var(--alto-sem-radius-sm);\n  background-color: var(--alto-sem-color-bg-layer2-hover);\n  transform: translateY(-1px);\n}\n\n.box-link--default[data-selected] {\n  outline: var(--alto-sem-border-width-md) solid\n    var(--alto-sem-color-border-accent);\n  /* TODO - replace this with card-radiusFocus after tokens merged in */\n  border-radius: var(--alto-sem-radius-sm);\n  background-color: var(--alto-sem-color-bg-layer2-hover);\n  transform: translateY(-1px);\n}\n\n.box-link--underline-heading-on-hover[data-hovered] h2,\n.box-link--underline-heading-on-hover[data-hovered] h3,\n.box-link--underline-heading-on-hover[data-hovered] h4,\n.box-link--underline-heading-on-hover[data-hovered] h5,\n.box-link--underline-heading-on-hover[data-hovered] h6 {\n  text-decoration: var(--alto-sem-text-body-link-text-decoration);\n}\n\n.box-link--disabled,\n.box-link[aria-disabled='true'] {\n  opacity: 0.5;\n  pointer-events: none;\n}\n","import { forwardRef } from 'react';\nimport { useLink } from '@react-aria/link';\nimport { useHover } from '@react-aria/interactions';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps, useObjectRef } from '@react-aria/utils';\nimport { focusStyleVariants } from '../../utils/focus/focusStyles';\nimport { BoxLinkContext } from './BoxLinkContext';\nimport VisuallyHidden from '../VisuallyHidden/VisuallyHidden';\nimport styles from './BoxLink.module.css';\nimport type React from 'react';\n\ntype OmittedAnchorProps = 'className' | 'style';\nconst PRESS_POINTER_HANDLER_KEYS = [\n  'onPointerDown',\n  'onPointerUp',\n  'onPointerCancel',\n  'onMouseDown',\n  'onMouseUp',\n  'onTouchStart',\n  'onTouchEnd',\n] as const;\n\nconst EXTERNAL_LINK_REL_TOKENS = 'noopener noreferrer';\n\nconst getMergedRel = (\n  isExternalLink: boolean,\n  rel: string | undefined,\n): string | undefined => {\n  if (!isExternalLink) {\n    return rel;\n  }\n\n  return rel ? `${EXTERNAL_LINK_REL_TOKENS} ${rel}` : EXTERNAL_LINK_REL_TOKENS;\n};\n\ninterface GetClassNameParams {\n  isDefault: boolean;\n  focusStyle: 'default' | 'white';\n  underlineHeadingOnHover: boolean;\n  disabled: boolean;\n}\n\nconst getClassName = ({\n  isDefault,\n  focusStyle,\n  underlineHeadingOnHover,\n  disabled,\n}: GetClassNameParams): string => {\n  const classNames = [styles['box-link']];\n\n  if (isDefault) {\n    classNames.push(styles['box-link--default']);\n    classNames.push(focusStyleVariants({ focusStyle }));\n\n    if (underlineHeadingOnHover) {\n      classNames.push(styles['box-link--underline-heading-on-hover']);\n    }\n  }\n\n  if (disabled) {\n    classNames.push(styles['box-link--disabled']);\n  }\n\n  return classNames.filter(Boolean).join(' ');\n};\n\ninterface GetInteractionDataAttributesParams {\n  isDefault: boolean;\n  isHovered: boolean;\n  isFocused: boolean;\n  isPressed: boolean;\n  isSelected: boolean;\n}\n\nconst getInteractionDataAttributes = ({\n  isDefault,\n  isHovered,\n  isFocused,\n  isPressed,\n  isSelected,\n}: GetInteractionDataAttributesParams) => {\n  if (!isDefault) {\n    return {\n      'data-hovered': undefined,\n      'data-focused': undefined,\n      'data-pressed': undefined,\n      'data-selected': undefined,\n    };\n  }\n\n  return {\n    'data-hovered': isHovered ? true : undefined,\n    'data-focused': isFocused ? true : undefined,\n    'data-pressed': isPressed ? true : undefined,\n    'data-selected': isSelected ? true : undefined,\n  };\n};\n\nexport interface BoxLinkProps\n  extends Omit<\n    React.AnchorHTMLAttributes<HTMLAnchorElement>,\n    OmittedAnchorProps\n  > {\n  /**\n   * The content to render inside the BoxLink.\n   */\n  children: React.ReactNode;\n  /**\n   * Whether the BoxLink is in a selected state.\n   * @default false\n   */\n  isSelected?: boolean;\n  /**\n   * Whether the BoxLink is disabled.\n   * Prevents navigation, removes href, and reflects aria-disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * The focus ring style.\n   * Use 'white' when BoxLink is placed on a dark or coloured background.\n   * @default 'default'\n   */\n  focusStyle?: 'default' | 'white';\n  /**\n   * Whether headings (h2–h6) inside the BoxLink should be underlined on hover.\n   * @default false\n   */\n  underlineHeadingOnHover?: boolean;\n  /**\n   * Controls which layer handles CSS styling for interactive states.\n   *\n   * - 'default' — BoxLink applies all styles including hover, focus, pressed and selected\n   * - 'custom'  — BoxLink strips back to inline-block only, children own\n   *               their own styles via the `useBoxLink` hook\n   *\n   * @default 'default'\n   */\n  styleVariant?: 'default' | 'custom';\n  /**\n   * The target attribute for the link.\n   * @default '_self'\n   */\n  target?: '_self' | '_blank' | '_parent' | '_top';\n  /**\n   * Specify custom screen reader text for external links.\n   * @default 'opens in a new tab'\n   */\n  externalLinkScreenReaderText?: string;\n  /**\n   * Allows pointer drag gestures to bubble through the link wrapper.\n   * Useful when BoxLink is inside draggable containers like carousels.\n   * @default false\n   * @internal\n   */\n  allowDragGestures?: boolean;\n}\n\nexport const BoxLink = forwardRef<HTMLAnchorElement, BoxLinkProps>(\n  function BoxLink(\n    {\n      children,\n      isSelected = false,\n      isDisabled = false,\n      focusStyle = 'default',\n      underlineHeadingOnHover = false,\n      styleVariant = 'default',\n      target = '_self',\n      externalLinkScreenReaderText = 'opens in a new tab',\n      allowDragGestures = false,\n      href,\n      onClick,\n      rel,\n      ...restProps\n    },\n    forwardedRef,\n  ) {\n    const ref = useObjectRef(forwardedRef);\n\n    const disabled = normalizeBooleanProp(isDisabled);\n    const isExternalLink = target === '_blank';\n    const mergedRel = getMergedRel(isExternalLink, rel);\n\n    const ariaLinkProps = { isDisabled: disabled, href };\n    const { linkProps, isPressed } = useLink(ariaLinkProps, ref);\n    const linkPropsWithoutPressPointers = Object.fromEntries(\n      Object.entries(linkProps).filter(\n        ([propName]) =>\n          !PRESS_POINTER_HANDLER_KEYS.includes(\n            propName as (typeof PRESS_POINTER_HANDLER_KEYS)[number],\n          ),\n      ),\n    ) as typeof linkProps;\n    const resolvedLinkProps = allowDragGestures\n      ? linkPropsWithoutPressPointers\n      : linkProps;\n    const { hoverProps, isHovered } = useHover({ isDisabled: disabled });\n    const { focusProps, isFocusVisible, isFocused } = useFocusRing();\n\n    const isDefault = styleVariant === 'default';\n\n    const className = getClassName({\n      isDefault,\n      focusStyle,\n      underlineHeadingOnHover,\n      disabled,\n    });\n\n    const interactionDataAttributes = getInteractionDataAttributes({\n      isDefault,\n      isHovered,\n      isFocused,\n      isPressed,\n      isSelected,\n    });\n\n    const handleClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n      if (disabled) {\n        e.preventDefault();\n        return;\n      }\n      // Call React Aria's onClick handler first\n      linkProps.onClick?.(e);\n      // Then call consumer's onClick\n      onClick?.(e);\n    };\n\n    return (\n      <BoxLinkContext.Provider\n        value={{\n          isHovered,\n          isPressed,\n          isFocusVisible,\n          isDisabled: disabled,\n          isSelected,\n        }}\n      >\n        <a\n          {...mergeProps(resolvedLinkProps, hoverProps, focusProps, restProps)}\n          ref={ref}\n          href={disabled ? undefined : href}\n          target={target}\n          rel={mergedRel}\n          aria-disabled={disabled ? true : undefined}\n          className={className}\n          onClick={handleClick}\n          data-alto-box-link=\"\"\n          {...interactionDataAttributes}\n        >\n          {children}\n          {isExternalLink && (\n            <VisuallyHidden>{externalLinkScreenReaderText}</VisuallyHidden>\n          )}\n        </a>\n      </BoxLinkContext.Provider>\n    );\n  },\n);\n\nfunction normalizeBooleanProp(value: unknown): boolean {\n  if (typeof value === 'boolean') {\n    return value;\n  }\n\n  if (typeof value === 'string') {\n    const normalized = value.trim().toLowerCase();\n\n    if (normalized === 'true') {\n      return true;\n    }\n\n    if (normalized === 'false') {\n      return false;\n    }\n  }\n\n  return false;\n}\nexport default BoxLink;\n"],"mappings":"0lBCYM,EAA6B,CACjC,gBACA,cACA,kBACA,cACA,YACA,eACA,cAGI,EAA2B,sBAwIpB,EAAU,EACrB,UACE,SACE,EAAA,WACA,GAAa,EAAA,WACb,GAAa,EAAA,WACb,EAAa,UAAA,wBACb,GAA0B,EAAA,aAC1B,EAAe,UAAA,OACf,EAAS,QAAA,6BACT,EAA+B,qBAAA,kBAC/B,GAAoB,EAAA,KACpB,EAAA,QACA,EAAA,IACA,KACG,GAEL,GAEA,MAAM,EAAM,EAAa,GAEnB,EAgFV,SAA8B,GAC5B,GAAqB,kBAAV,EACT,OAAO,EAGT,GAAqB,iBAAV,EAAoB,CAC7B,MAAM,EAAa,EAAM,OAAO,cAEhC,GAAmB,SAAf,EACF,OAAO,EAGT,GAAmB,UAAf,EACF,OAAO,CAEX,CAEA,OAAO,CACT,CAlGqB,CAAqB,GAChC,EAA4B,WAAX,EACjB,EA7JJ,EACJ,EACA,IAEK,EAIE,EAAM,GAAG,KAA4B,IAAQ,EAH3C,EAwJW,CAAa,EAAgB,IAGzC,UAAE,EAAA,UAAW,GAAc,EAAQ,CADjB,WAAY,EAAU,QACU,GAClD,EAAgC,OAAO,YAC3C,OAAO,QAAQ,GAAW,OAAA,EACtB,MACC,EAA2B,SAC1B,KAIF,EAAoB,EACtB,EACA,GACE,WAAE,EAAA,UAAY,GAAc,EAAS,CAAE,WAAY,KACnD,WAAE,EAAA,eAAY,EAAA,UAAgB,GAAc,IAE5C,EAA6B,YAAjB,EAEZ,EA/JJ,GACJ,YACA,aACA,0BACA,eAEA,MAAM,EAAa,CAAC,GAepB,OAbI,IACF,EAAW,KAAK,GAChB,EAAW,KAAK,EAAmB,CAAE,gBAEjC,GACF,EAAW,KAAK,IAIhB,GACF,EAAW,KAAK,GAGX,EAAW,OAAO,SAAS,KAAK,MA0InB,CAAa,CAC7B,YACA,aACA,0BACA,aAGI,EAtIJ,GACJ,YACA,YACA,YACA,YACA,gBAEK,EASE,CACL,iBAAgB,QAAmB,EACnC,iBAAgB,QAAmB,EACnC,iBAAgB,QAAmB,EACnC,kBAAiB,QAAoB,GAZ9B,CACL,oBAAgB,EAChB,oBAAgB,EAChB,oBAAgB,EAChB,qBAAiB,GA0He,CAA6B,CAC7D,YACA,YACA,YACA,YACA;AAcF,OACE,EAAC,EAAe,SAAhB,CACE,MAAO,CACL,YACA,YACA,iBACA,WAAY,EACZ,sCAGF,EAAC,IAAD,IACM,EAAW,EAAmB,EAAY,EAAY,GACrD,MACL,KAAM,OAAW,EAAY,EACrB,SACR,IAAK,EACL,kBAAe,QAAkB,EACtB,YACX,QA7Be,IACf,EACF,EAAE,kBAIJ,EAAU,UAAU,GAEpB,IAAU,KAsBN,qBAAmB,MACf,WAVN,CAYG,EACA,kBACC,EAAC,EAAD,CAAA,SAAiB,QAK3B"}

package/dist/Breadcrumbs-COb8Za-O.js

@@ -0,0 +1,5 @@
+import{t as r}from"./Icon-DweSiH3B.js";import{r as e}from"./foregroundColor-BNNtljES.js";import{t as a}from"./Link-CvZnzAx_.js";import{t}from"./Menu-Cz6s0oMh.js";import{IconButton as n}from"./components/IconButton/IconButton.js";import o,{Children as i,forwardRef as s,useLayoutEffect as c,useState as l}from"react";import{jsx as m,jsxs as u}from"react/jsx-runtime";import{mergeProps as d,useObjectRef as p}from"@react-aria/utils";import{useBreadcrumbs as b}from"@react-aria/breadcrumbs";import './assets/Breadcrumbs.css';var h="_breadcrumbs_xrrvy_1",f="_breadcrumbs__list_xrrvy_8",_="_breadcrumbs__list-item_xrrvy_20",v="_breadcrumbs__overflow-list_xrrvy_30",y="_breadcrumbs__list-separator_xrrvy_82";function g({as:r=a,isCurrent:t=!1,foregroundColor:n="default","data-parent":i,children:s,...c}){const l=e({foregroundColor:n}),u=d(c,{className:l}),p=o.createElement(r,u,s);/* @__PURE__ */
+return m("li",{className:_,"data-parent":i,children:t?/* @__PURE__ */m("span",{"aria-current":"page",className:l,children:s}):p})}var N=g,O=({color:e})=>/* @__PURE__ */m("li",{className:y,"aria-hidden":!0,children:/* @__PURE__ */m(r,{iconName:"chevron-right",iconSize:"0.75x",size:"sm",color:e,"data-testid":"breadcrumbs-separator"})}),V=({children:r,buttonStyleVariant:e="neutral",...a})=>/* @__PURE__ */m("li",{className:_,children:/* @__PURE__ */u(t,{shouldFlip:!0,"aria-label":`${a["aria-label"]} menu`,children:[/* @__PURE__ */m(t.Trigger,{children:/* @__PURE__ */m(n,{emphasis:"quaternary",iconProps:{iconName:"ellipsis"},"aria-label":`${a["aria-label"]} menu button`,size:"sm",styleVariant:e})}),/* @__PURE__ */m("ol",{className:v,children:r})]})}),w=new Set(["accentOnVibrant","accentOnVibrantAccent","accentOnDeep","criticalOnVibrant","warningOnVibrant","successOnVibrant","informationOnVibrant","inversePrimary","inverseOnVibrant","whitePrimary","whiteOnSubtle","disabledOnVibrant","saleOnVibrant"]),C=s((r,e)=>{const{navProps:t}=b(r),{as:n=a,children:s,maxItems:u=4,itemForegroundColor:d="primary",separatorForegroundColor:_=d,buttonStyleVariant:v="neutral",hasCurrentItem:y=!0,disableAutomaticOverflow:g=!1}=r,N=r?.["aria-label"]||"Breadcrumb",C=p(e),x=i.toArray(s);let I=x.map((r,e)=>{const t=r,i=t.props?.isCurrent?(s=d,w.has(s)?"whitePrimary":"secondary"):d;var s;const c=t.props?.iconEndProps||!1;return o.cloneElement(t,{as:n,"data-parent":e===x.length-2||void 0,iconEndProps:n===a?c:void 0,foregroundColor:t.props?.foregroundColor||i,...t.props})});y||(I=I.filter(r=>!r?.props?.isCurrent));const P=I.length,j=P>u,[S,B]=l(!1),[E,z]=l(-1),A=!g&&E>0&&S;c(()=>{C.current&&!g&&z(C.current.clientWidth)},[C.current]),c(()=>{if(!C.current||g)return;const r=new ResizeObserver(r=>{r.forEach(r=>{(r=>{if(!C.current)return;const e=r.contentRect.width;B(e<=E)})(r)})}),e=C.current.parentNode;return r.observe(e),()=>{r.disconnect()}},[C.current]);const F=P>2&&(j||A)?[
+/* @__PURE__ */m(V,{buttonStyleVariant:v,"aria-label":N,children:I.slice(0,-2)},"overflow"),I[P-2],I[P-1]]:I,$=F.flatMap((r,e)=>e===F.length-1?r:[r,/* @__PURE__ */m(O,{color:_},`${r.key}-separator`)]);/* @__PURE__ */
+return m("nav",{...t,className:h,"aria-label":N,ref:C,children:/* @__PURE__ */m("ol",{className:f,children:$})})});C.displayName="Breadcrumbs",C.Item=g,g.displayName="Breadcrumbs.Item";export{C as n,N as r,g as t};
+//# sourceMappingURL=Breadcrumbs-COb8Za-O.js.map

package/dist/Breadcrumbs-COb8Za-O.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs-COb8Za-O.js","names":[],"sources":["../src/components/Breadcrumbs/Breadcrumbs.module.css","../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":[".breadcrumbs {\n  display: inline-block;\n  font-family: var(--alto-sem-text-body-font-family);\n  font-style: normal;\n}\n\n/* List */\n.breadcrumbs__list {\n  display: flex;\n  list-style-type: none;\n  margin: 0;\n  padding: 0;\n  gap: var(--alto-sem-space-2xs);\n  align-items: center;\n  min-height: 56px;\n  text-align: left;\n}\n\n/* Breadcrumb item */\n.breadcrumbs__list-item > a:focus-visible {\n  border-radius: var(--alto-sem-radius-6xs);\n}\n\n.breadcrumbs > span,\n.breadcrumbs__list-item > a {\n  font-weight: normal;\n}\n\n/* Overflow menu */\n.breadcrumbs__overflow-list {\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  overflow: hidden;\n  outline: none;\n}\n\n.breadcrumbs__overflow-list .breadcrumbs__list-item {\n  border-bottom: 1px solid var(--alto-sem-color-border-tertiary);\n}\n\n.breadcrumbs__overflow-list .breadcrumbs__list-item:first-child {\n  border-top-left-radius: var(--alto-tag-radius);\n  border-top-right-radius: var(--alto-tag-radius);\n}\n\n.breadcrumbs__overflow-list .breadcrumbs__list-item:last-child {\n  border-bottom: none;\n  border-bottom-left-radius: var(--alto-tag-radius);\n  border-bottom-right-radius: var(--alto-tag-radius);\n}\n\n.breadcrumbs__overflow-list .breadcrumbs__list-item a {\n  display: block;\n  padding: var(--alto-sem-space-sm) var(--alto-sem-space-md);\n  cursor: pointer;\n  color: var(--alto-sem-color-fg-primary);\n  text-decoration: none;\n  outline: none;\n}\n\n.breadcrumbs__overflow-list .breadcrumbs__list-item:hover,\n.breadcrumbs__overflow-list .breadcrumbs__list-item:has([data-hovered]) {\n  background-color: var(--alto-sem-color-bg-layer2-hover);\n}\n\n.breadcrumbs__overflow-list .breadcrumbs__list-item:focus,\n.breadcrumbs__overflow-list .breadcrumbs__list-item:has([data-focused]) {\n  background-color: var(--alto-sem-color-bg-layer2-active);\n}\n\n.breadcrumbs__overflow-list .breadcrumbs__list-item:has([data-active]) {\n  background-color: var(--alto-sem-color-bg-layer2-active);\n}\n\n/* Mobile */\n@media screen and (max-width: 479px) {\n  .breadcrumbs__list-item,\n  .breadcrumbs__list-separator {\n    display: none;\n  }\n\n  /* Only show last link item (parent page) and preceeding separator */\n  .breadcrumbs__list-separator:has(+ [data-parent]),\n  .breadcrumbs__list-item[data-parent] {\n    display: block;\n  }\n\n  /* Rotate the chevron to point to the left */\n  .breadcrumbs__list-separator:has(+ [data-parent]) svg {\n    transform: rotate(180deg);\n  }\n}\n\n/* RTL support */\n[dir='rtl'] .breadcrumbs__list-separator {\n  transform: rotate(180deg);\n}\n","import React, {\n  Children,\n  forwardRef,\n  ReactElement,\n  useLayoutEffect,\n  useState,\n} from 'react';\nimport {\n  useBreadcrumbs,\n  type AriaBreadcrumbsProps,\n} from '@react-aria/breadcrumbs';\nimport { mergeProps, useObjectRef } from '@react-aria/utils';\nimport Link, { type LinkProps } from '../Link';\nimport styles from './Breadcrumbs.module.css';\nimport Icon, { IconProps } from '../Icon';\nimport Menu from '../Menu';\nimport { ButtonProps } from '../Button';\nimport IconButton from '../IconButton';\nimport {\n  foregroundColorVariants,\n  ForegroundVariants,\n} from '../../utils/foregroundColour/foregroundColor';\n\nexport type BreadcrumbItemProps<T = LinkProps> = T &\n  Pick<LinkProps, 'children' | 'foregroundColor'> & {\n    /**\n     * The React component to be rendered as the breadcrumb item. For use with external library components like Next.JS Link.\n     * @default Link\n     */\n    as?: React.ElementType;\n    /**\n     * Whether the breadcrumb item is the link for the current page\n     * @default false\n     */\n    isCurrent?: boolean;\n    /**\n     * Data attribute used to show parent link in CSS on mobile\n     * @private\n     */\n    'data-parent'?: boolean;\n  };\n\nexport function BreadcrumbItem<T = LinkProps>({\n  as = Link,\n  isCurrent = false,\n  foregroundColor = 'default',\n  'data-parent': dataParent,\n  children,\n  ...props\n}: BreadcrumbItemProps<T>) {\n  const className = foregroundColorVariants({\n    foregroundColor: foregroundColor,\n  });\n\n  // if user is using a custom link component, we shouldn't overwrite their classname\n  const itemProps = mergeProps(props, { className });\n  const itemElement = React.createElement(as, itemProps, children);\n\n  return (\n    <li className={styles['breadcrumbs__list-item']} data-parent={dataParent}>\n      {isCurrent ? (\n        <span aria-current=\"page\" className={className}>\n          {children}\n        </span>\n      ) : (\n        itemElement\n      )}\n    </li>\n  );\n}\n\nexport const BreadcrumbsItem = BreadcrumbItem;\n// TODO: unify the naming conflict between BreadcrumbsItem and BreadcrumbItem. Should be consolidated across the component.\n\nconst SeparatorItem = ({ color }: Pick<IconProps, 'color'>) => {\n  return (\n    <li className={styles['breadcrumbs__list-separator']} aria-hidden>\n      <Icon\n        iconName=\"chevron-right\"\n        iconSize=\"0.75x\"\n        size=\"sm\"\n        color={color}\n        data-testid=\"breadcrumbs-separator\"\n      />\n    </li>\n  );\n};\n\ntype OverflowMenuProps = Pick<\n  BreadcrumbsProps,\n  'children' | 'buttonStyleVariant' | 'aria-label'\n>;\n\nconst OverflowMenu = ({\n  children,\n  buttonStyleVariant = 'neutral',\n  ...props\n}: OverflowMenuProps) => {\n  return (\n    <li className={styles['breadcrumbs__list-item']}>\n      <Menu shouldFlip aria-label={`${props['aria-label']} menu`}>\n        <Menu.Trigger>\n          <IconButton\n            emphasis=\"quaternary\"\n            iconProps={{ iconName: 'ellipsis' }}\n            aria-label={`${props['aria-label']} menu button`}\n            size=\"sm\"\n            styleVariant={buttonStyleVariant}\n          />\n        </Menu.Trigger>\n        <ol className={styles['breadcrumbs__overflow-list']}>{children}</ol>\n      </Menu>\n    </li>\n  );\n};\n\nexport interface BreadcrumbsProps extends AriaBreadcrumbsProps {\n  /**\n   * The React component to be rendered as the breadcrumb item. For use with external library components like Next.JS Link.\n   * @default Link\n   */\n  as?: React.ElementType;\n  /**\n   * Breadcrumb items rendered in the list.\n   */\n  children?: React.ReactNode;\n  /**\n   * Colour of the breadcrumb item links.\n   * @default 'primary'\n   */\n  itemForegroundColor?: LinkProps['foregroundColor'];\n  /**\n   * Colour of the separator chevron icons.\n   */\n  separatorForegroundColor?: IconProps['color'];\n  /**\n   * Style variant of the overflow menu trigger iconButton.\n   * @default 'neutral'\n   */\n  buttonStyleVariant?: ButtonProps['styleVariant'];\n  /**\n   * The amount of items shown before the overflow menu is shown.\n   * @default 4\n   */\n  maxItems?: number;\n  /**\n   * Accessible label for the breadcrumb nav element.\n   * @default 'Breadcrumbs'\n   */\n  'aria-label'?: string;\n  /**\n   * Hide any breadcrumb items with `isCurrent` set to `true`\n   * @default true\n   */\n  hasCurrentItem?: boolean;\n  /**\n   * Disable automatic showing and hiding of the overflow menu. Can be used if the parent element width isn't properly calculated by the browser.\n   * @default false\n   */\n  disableAutomaticOverflow?: boolean;\n}\n\ninterface BreadcrumbsComponent\n  extends React.ForwardRefExoticComponent<\n    BreadcrumbsProps & React.RefAttributes<HTMLElement>\n  > {\n  Item: typeof BreadcrumbItem;\n}\n\nconst CURRENT_ITEM_WHITE_FOREGROUND_COLORS = new Set<\n  Partial<ForegroundVariants['foregroundColor']>\n>([\n  'accentOnVibrant',\n  'accentOnVibrantAccent',\n  'accentOnDeep',\n  'criticalOnVibrant',\n  'warningOnVibrant',\n  'successOnVibrant',\n  'informationOnVibrant',\n  'inversePrimary',\n  'inverseOnVibrant',\n  'whitePrimary',\n  'whiteOnSubtle',\n  'disabledOnVibrant',\n  'saleOnVibrant',\n]);\n\nconst getDefaultCurrentItemColour = (\n  foregroundColor: ForegroundVariants['foregroundColor'],\n) =>\n  CURRENT_ITEM_WHITE_FOREGROUND_COLORS.has(foregroundColor)\n    ? 'whitePrimary'\n    : 'secondary';\n\nexport const Breadcrumbs = forwardRef<HTMLElement, BreadcrumbsProps>(\n  (props, forwardedRef) => {\n    /** Props */\n    const { navProps } = useBreadcrumbs(props);\n    const {\n      as = Link,\n      children,\n      maxItems = 4,\n      itemForegroundColor = 'primary',\n      separatorForegroundColor = itemForegroundColor,\n      buttonStyleVariant = 'neutral',\n      hasCurrentItem = true,\n      disableAutomaticOverflow = false,\n    } = props;\n    const ariaLabel = props?.['aria-label'] || 'Breadcrumb';\n\n    // Combine refs\n    const navRef = useObjectRef(forwardedRef);\n\n    /** Items */\n    const itemsArray = Children.toArray(children);\n    // Pass default props to breadcrums items\n    let items = itemsArray.map((child, index) => {\n      const item = child as ReactElement<BreadcrumbItemProps>;\n\n      // Set default props\n      const itemColor = item.props?.isCurrent\n        ? getDefaultCurrentItemColour(itemForegroundColor)\n        : itemForegroundColor;\n      const iconEndProps = item.props?.iconEndProps || false;\n\n      return React.cloneElement(item, {\n        as,\n        'data-parent': index === itemsArray.length - 2 || undefined,\n        iconEndProps: as === Link ? iconEndProps : undefined,\n        foregroundColor: item.props?.foregroundColor || itemColor,\n        ...item.props,\n      });\n    });\n    // Remove current page\n    if (!hasCurrentItem) {\n      items = items.filter((item) => !item?.props?.isCurrent);\n    }\n    // Count\n    const itemCount = items.length;\n    const shouldOverflowMaxItems = itemCount > maxItems;\n\n    /** Automatic collapsing */\n    const [hasOverflow, setHasOverflow] = useState(false);\n    const [breadcrumbsWidth, setBreadcrumbsWidth] = useState(-1);\n    const shouldOverflowAutomatically =\n      !disableAutomaticOverflow && breadcrumbsWidth > 0 && hasOverflow;\n\n    // Get the parent element width\n    const checkForOverflow = (element: ResizeObserverEntry) => {\n      if (!navRef.current) return;\n      const parentWidth = element.contentRect.width;\n      setHasOverflow(parentWidth <= breadcrumbsWidth);\n    };\n\n    // Get the full length of the breadcrumbs before rendering\n    useLayoutEffect(() => {\n      if (!navRef.current || disableAutomaticOverflow) return;\n      setBreadcrumbsWidth(navRef.current.clientWidth);\n    }, [navRef.current]);\n\n    // Setup resize observer for parent so we know when to automatically overflow\n    useLayoutEffect(() => {\n      if (!navRef.current || disableAutomaticOverflow) return;\n      const observer = new ResizeObserver((entries) => {\n        entries.forEach((entry) => {\n          checkForOverflow(entry);\n        });\n      });\n\n      const parent = navRef.current.parentNode as HTMLElement;\n      observer.observe(parent);\n\n      return () => {\n        observer.disconnect();\n      };\n    }, [navRef.current]);\n\n    /**\n     * Item logic\n     */\n    const shouldOverflow =\n      itemCount > 2 && (shouldOverflowMaxItems || shouldOverflowAutomatically);\n\n    const visibleItems = shouldOverflow\n      ? [\n          <OverflowMenu\n            key=\"overflow\"\n            buttonStyleVariant={buttonStyleVariant}\n            aria-label={ariaLabel}\n          >\n            {items.slice(0, -2)}\n          </OverflowMenu>,\n          items[itemCount - 2],\n          items[itemCount - 1],\n        ]\n      : items;\n\n    // Place separators between all child elements\n    const breadcrumbItems = visibleItems.flatMap((child, index) => {\n      return index === visibleItems.length - 1\n        ? child\n        : [\n            child,\n            <SeparatorItem\n              key={`${child.key}-separator`}\n              color={separatorForegroundColor}\n            />,\n          ];\n    });\n\n    return (\n      <nav\n        {...navProps}\n        className={styles.breadcrumbs}\n        aria-label={ariaLabel}\n        ref={navRef}\n      >\n        <ol className={styles['breadcrumbs__list']}>{breadcrumbItems}</ol>\n      </nav>\n    );\n  },\n) as BreadcrumbsComponent;\n\nBreadcrumbs.displayName = 'Breadcrumbs';\nBreadcrumbs.Item = BreadcrumbItem;\nBreadcrumbItem.displayName = 'Breadcrumbs.Item';\n\nexport default Breadcrumbs;\n"],"mappings":"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"}

package/dist/Button.module-CIZxP-bC.js

@@ -0,0 +1,2 @@
+import './assets/Button.css';var t={button:"_button_lts25_1",content:"_content_lts25_34",isNotLoading:"_isNotLoading_lts25_41",loadingSpinner:"_loadingSpinner_lts25_41",isLoading:"_isLoading_lts25_50",focusWhite:"_focusWhite_lts25_66",iconButton:"_iconButton_lts25_70",iconButton__sm:"_iconButton__sm_lts25_75",iconButton__md:"_iconButton__md_lts25_79",iconButton__lg:"_iconButton__lg_lts25_83","full-width--true":"_full-width--true_lts25_87","full-width--false":"_full-width--false_lts25_91","size--sm":"_size--sm_lts25_139","size--md":"_size--md_lts25_142","size--lg":"_size--lg_lts25_145","text-align--left":"_text-align--left_lts25_178","text-align--center":"_text-align--center_lts25_181","text-align--right":"_text-align--right_lts25_184","sm:size--sm":"_sm:size--sm_lts25_1","sm:size--md":"_sm:size--md_lts25_1","sm:size--lg":"_sm:size--lg_lts25_1","sm:text-align--left":"_sm:text-align--left_lts25_1","sm:text-align--center":"_sm:text-align--center_lts25_1","sm:text-align--right":"_sm:text-align--right_lts25_1","sm:full-width--true":"_sm:full-width--true_lts25_1","sm:full-width--false":"_sm:full-width--false_lts25_1","md:size--sm":"_md:size--sm_lts25_1","md:size--md":"_md:size--md_lts25_1","md:size--lg":"_md:size--lg_lts25_1","md:text-align--left":"_md:text-align--left_lts25_1","md:text-align--center":"_md:text-align--center_lts25_1","md:text-align--right":"_md:text-align--right_lts25_1","md:full-width--true":"_md:full-width--true_lts25_1","md:full-width--false":"_md:full-width--false_lts25_1","lg:size--sm":"_lg:size--sm_lts25_1","lg:size--md":"_lg:size--md_lts25_1","lg:size--lg":"_lg:size--lg_lts25_1","lg:text-align--left":"_lg:text-align--left_lts25_1","lg:text-align--center":"_lg:text-align--center_lts25_1","lg:text-align--right":"_lg:text-align--right_lts25_1","lg:full-width--true":"_lg:full-width--true_lts25_1","lg:full-width--false":"_lg:full-width--false_lts25_1","xl:size--sm":"_xl:size--sm_lts25_1","xl:size--md":"_xl:size--md_lts25_1","xl:size--lg":"_xl:size--lg_lts25_1","xl:text-align--left":"_xl:text-align--left_lts25_1","xl:text-align--center":"_xl:text-align--center_lts25_1","xl:text-align--right":"_xl:text-align--right_lts25_1","xl:full-width--true":"_xl:full-width--true_lts25_1","xl:full-width--false":"_xl:full-width--false_lts25_1","xxl:size--sm":"_xxl:size--sm_lts25_1","xxl:size--md":"_xxl:size--md_lts25_1","xxl:size--lg":"_xxl:size--lg_lts25_1","xxl:text-align--left":"_xxl:text-align--left_lts25_1","xxl:text-align--center":"_xxl:text-align--center_lts25_1","xxl:text-align--right":"_xxl:text-align--right_lts25_1","xxl:full-width--true":"_xxl:full-width--true_lts25_1","xxl:full-width--false":"_xxl:full-width--false_lts25_1",accentPrimary:"_accentPrimary_lts25_224",accentSecondary:"_accentSecondary_lts25_253",accentTertiary:"_accentTertiary_lts25_291",accentQuaternary:"_accentQuaternary_lts25_325",accentSecondaryFilled:"_accentSecondaryFilled_lts25_359",criticalPrimary:"_criticalPrimary_lts25_403",criticalSecondary:"_criticalSecondary_lts25_433",criticalTertiary:"_criticalTertiary_lts25_471",criticalQuaternary:"_criticalQuaternary_lts25_505",criticalSecondaryFilled:"_criticalSecondaryFilled_lts25_539",neutralPrimary:"_neutralPrimary_lts25_582",neutralSecondary:"_neutralSecondary_lts25_616",neutralTertiary:"_neutralTertiary_lts25_654",neutralQuaternary:"_neutralQuaternary_lts25_688",neutralSecondaryFilled:"_neutralSecondaryFilled_lts25_722","fa-spinner-third":"_fa-spinner-third_lts25_768","icon-wrapper":"_icon-wrapper_lts25_773"};export{t};
+//# sourceMappingURL=Button.module-CIZxP-bC.js.map