@alto-avios/alto-ui 3.5.1 → 3.5.2-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/dist/IconButton.module-DcfPVyUX.js +48 -0
  2. package/dist/IconButton.module-DcfPVyUX.js.map +1 -0
  3. package/dist/assets/AutoplayControl.css +1 -0
  4. package/dist/assets/Carousel.css +1 -0
  5. package/dist/assets/CarouselButton.css +1 -0
  6. package/dist/assets/CarouselDots.css +1 -0
  7. package/dist/components/Accordion/Accordion.js +8 -8
  8. package/dist/components/AviosCurrencySymbol/AviosCurrencySymbol.js +2 -2
  9. package/dist/components/ButtonGroup/ButtonGroup.js +2 -2
  10. package/dist/components/CalloutBanner/CalloutBanner.js +2 -2
  11. package/dist/components/Carousel/AutoplayControl/AutoplayControl.d.ts +27 -0
  12. package/dist/components/Carousel/AutoplayControl/AutoplayControl.js +116 -0
  13. package/dist/components/Carousel/AutoplayControl/AutoplayControl.js.map +1 -0
  14. package/dist/components/Carousel/Carousel.d.ts +169 -0
  15. package/dist/components/Carousel/Carousel.js +419 -0
  16. package/dist/components/Carousel/Carousel.js.map +1 -0
  17. package/dist/components/Carousel/CarouselButton/CarouselButton.d.ts +49 -0
  18. package/dist/components/Carousel/CarouselButton/CarouselButton.js +197 -0
  19. package/dist/components/Carousel/CarouselButton/CarouselButton.js.map +1 -0
  20. package/dist/components/Carousel/CarouselDots/CarouselDots.d.ts +17 -0
  21. package/dist/components/Carousel/CarouselDots/CarouselDots.js +158 -0
  22. package/dist/components/Carousel/CarouselDots/CarouselDots.js.map +1 -0
  23. package/dist/components/Carousel/index.d.ts +1 -0
  24. package/dist/components/Carousel/index.js +5 -0
  25. package/dist/components/Carousel/index.js.map +1 -0
  26. package/dist/components/CreditCardNumberField/CreditCardNumberField.js +4 -4
  27. package/dist/components/CreditCardSecurityCodeField/CreditCardSecurityCodeField.js +3 -3
  28. package/dist/components/Dialog/Dialog.js +3 -3
  29. package/dist/components/ErrorSummary/ErrorSummary.js +4 -4
  30. package/dist/components/IconButton/IconButton.js +21 -64
  31. package/dist/components/IconButton/IconButton.js.map +1 -1
  32. package/dist/components/Image/Image.js +7 -7
  33. package/dist/components/ListBoxItem/index.d.ts +1 -1
  34. package/dist/components/PasswordField/PasswordField.js +2 -2
  35. package/dist/components/PhoneNumberField/PhoneNumberField.js +1 -1
  36. package/dist/components/Popover/Popover.js +2 -2
  37. package/dist/components/SearchField/SearchField.js +3 -3
  38. package/dist/components/Section/Section.js +4 -4
  39. package/dist/components/SelectCard/SelectCard.js +2 -2
  40. package/dist/components/_base/Field/Field.js +2 -2
  41. package/dist/components/index.d.ts +2 -0
  42. package/dist/components/index.js +2 -0
  43. package/dist/components/index.js.map +1 -1
  44. package/dist/index-uZFEbUWx.js +1005 -0
  45. package/dist/index-uZFEbUWx.js.map +1 -0
  46. package/dist/index.js +2 -0
  47. package/dist/index.js.map +1 -1
  48. package/dist/{react-number-format.es-DMLgWFZX.js → react-number-format.es-DXPULhrt.js} +6 -6
  49. package/dist/{react-number-format.es-DMLgWFZX.js.map → react-number-format.es-DXPULhrt.js.map} +1 -1
  50. package/package.json +2 -1
@@ -0,0 +1,48 @@
1
+ import './assets/IconButton.css';const iconButton = "_iconButton_kb1oz_1";
2
+ const sm = "_sm_kb1oz_24";
3
+ const md = "_md_kb1oz_30";
4
+ const lg = "_lg_kb1oz_36";
5
+ const accentPrimary = "_accentPrimary_kb1oz_46";
6
+ const accentSecondary = "_accentSecondary_kb1oz_69";
7
+ const accentTertiary = "_accentTertiary_kb1oz_98";
8
+ const accentQuaternary = "_accentQuaternary_kb1oz_127";
9
+ const criticalPrimary = "_criticalPrimary_kb1oz_151";
10
+ const criticalSecondary = "_criticalSecondary_kb1oz_175";
11
+ const criticalTertiary = "_criticalTertiary_kb1oz_204";
12
+ const criticalQuaternary = "_criticalQuaternary_kb1oz_229";
13
+ const neutralPrimary = "_neutralPrimary_kb1oz_254";
14
+ const neutralSecondary = "_neutralSecondary_kb1oz_278";
15
+ const neutralTertiary = "_neutralTertiary_kb1oz_305";
16
+ const neutralQuaternary = "_neutralQuaternary_kb1oz_330";
17
+ const whitePrimary = "_whitePrimary_kb1oz_356";
18
+ const whiteSecondary = "_whiteSecondary_kb1oz_385";
19
+ const whiteTertiary = "_whiteTertiary_kb1oz_416";
20
+ const whiteQuaternary = "_whiteQuaternary_kb1oz_445";
21
+ const iconButtonStyles = {
22
+ iconButton,
23
+ sm,
24
+ md,
25
+ lg,
26
+ accentPrimary,
27
+ accentSecondary,
28
+ accentTertiary,
29
+ accentQuaternary,
30
+ criticalPrimary,
31
+ criticalSecondary,
32
+ criticalTertiary,
33
+ criticalQuaternary,
34
+ neutralPrimary,
35
+ neutralSecondary,
36
+ neutralTertiary,
37
+ neutralQuaternary,
38
+ whitePrimary,
39
+ whiteSecondary,
40
+ whiteTertiary,
41
+ whiteQuaternary,
42
+ "fa-spinner-third": "_fa-spinner-third_kb1oz_476",
43
+ "icon-wrapper": "_icon-wrapper_kb1oz_481"
44
+ };
45
+ export {
46
+ iconButtonStyles as i
47
+ };
48
+ //# sourceMappingURL=IconButton.module-DcfPVyUX.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IconButton.module-DcfPVyUX.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -0,0 +1 @@
1
+ ._autoplayControl_kk1sb_1{align-items:center;background:none;border:none;display:flex;justify-content:center;min-height:40px;min-width:40px;padding:0;pointer-events:auto;position:relative;z-index:10}._autoplayControl_kk1sb_1 ._iconButton_kk1sb_17{align-items:center;box-shadow:0 2px 8px #0003;display:flex;justify-content:center}._autoplayControl_kk1sb_1._sizeMd_kk1sb_25,._autoplayControl_kk1sb_1._sizeMd_kk1sb_25 ._iconButton_kk1sb_17{height:48px;width:48px}._autoplayControl_kk1sb_1._sizeSm_kk1sb_31,._autoplayControl_kk1sb_1._sizeSm_kk1sb_31 ._iconButton_kk1sb_17{height:36px;width:36px}._autoplayControl_kk1sb_1._neutralVibrant_kk1sb_38 ._iconButton_kk1sb_17{background-color:var(--alto-sem-color-fg-inverse-on-subtle);border-radius:var(--alto-sem-radius-circle,50%);color:var(--alto-sem-color-fg-inverse-on-vibrant)}._autoplayControl_kk1sb_1._whiteVibrant_kk1sb_44 ._iconButton_kk1sb_17{background-color:var(--alto-sem-color-fg-white-primary);border-radius:var(--alto-sem-radius-circle,50%);color:var(--alto-sem-color-fg-white-on-vibrant)}._autoplayControl_kk1sb_1._whiteVibrant_kk1sb_44 ._iconButton_kk1sb_17[data-focused]{outline-color:var(--alto-sem-color-border-white)}._autoplayControl_kk1sb_1._neutralSubtle_kk1sb_55 ._iconButton_kk1sb_17{background-color:var(--alto-sem-color-fg-inverse-primary);border-radius:var(--alto-sem-radius-circle,50%);color:var(--alto-sem-color-fg-inverse-on-subtle)}._autoplayControl_kk1sb_1._whiteSubtle_kk1sb_61 ._iconButton_kk1sb_17{background-color:#00000080;border-radius:var(--alto-sem-radius-circle,50%);color:var(--alto-sem-color-fg-white-on-subtle)}._autoplayControl_kk1sb_1._whiteSubtle_kk1sb_61 ._iconButton_kk1sb_17[data-focused]{outline-color:var(--alto-sem-color-border-white)}
@@ -0,0 +1 @@
1
+ ._carouselWrapper_5ipin_2{box-sizing:border-box;margin:0;max-width:100%;padding:0;position:relative;width:100%}._carouselWrapper_5ipin_2,._carouselWrapper_5ipin_2._showPartialItems_5ipin_14,._carouselWrapper_5ipin_2._showPartialItems_5ipin_14 ._carousel_5ipin_2{overflow-x:visible;overflow-y:hidden}._carouselWrapper_5ipin_2._hasScrollPadding_5ipin_25,._carouselWrapper_5ipin_2._hasScrollPadding_5ipin_25 ._carousel_5ipin_2{overflow-x:visible!important;overflow-y:hidden!important}._carousel_5ipin_2{overflow-x:visible;position:relative;width:100%}._carousel_5ipin_2,._scroller_5ipin_43{box-sizing:border-box;overflow-y:hidden}._scroller_5ipin_43{display:grid;grid-auto-columns:100%;grid-auto-flow:column;overflow-x:auto;-ms-overflow-style:none;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;border-radius:var(--alto-sem-radius-md);height:auto;padding:0 1px;transition:all .3s ease}._scroller_5ipin_43:focus{outline-offset:-2px;outline-width:2px}._scroller_5ipin_43::-webkit-scrollbar{display:none}._carouselWrapper_5ipin_2 [data-dragging=true] ._scroller_5ipin_43{cursor:grabbing;scroll-behavior:auto;touch-action:pan-x}._carouselWrapper_5ipin_2 ._scroller_5ipin_43:hover{cursor:grab;touch-action:pan-x}._item_5ipin_86{box-sizing:border-box;height:auto;max-width:100%;min-height:100%;overflow-y:hidden;scroll-snap-align:start;scroll-snap-stop:always}._carouselWrapper_5ipin_2 ._carousel_5ipin_2 ._scroller_5ipin_43 ._item_5ipin_86>*{display:block;height:auto;width:100%}[data-scroll-padding=true],[data-scroll-padding=true] ._carousel_5ipin_2,[data-scroll-padding=true] ._scroller_5ipin_43{overflow-x:visible!important;overflow-y:hidden!important}[data-scroll-padding=true] ._item_5ipin_86{scroll-snap-align:start}._slideLeft_5ipin_124{animation:_slideLeftAnimation_5ipin_1 1s cubic-bezier(.25,0,.85,.1)}._slideRight_5ipin_128{animation:_slideRightAnimation_5ipin_1 1s cubic-bezier(.25,0,.85,.1)}@keyframes _slideLeftAnimation_5ipin_1{0%{transform:translate(0)}to{transform:translate(0)}}@keyframes _slideRightAnimation_5ipin_1{0%{transform:translate(0)}to{transform:translate(0)}}._controls_5ipin_151{bottom:0;left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1}._showOnHover_5ipin_162 ._arrowContainer_5ipin_162{opacity:0;transition:opacity .3s ease}._carouselWrapper_5ipin_2 [data-arrows-visible=true] ._showOnHover_5ipin_162 ._arrowContainer_5ipin_162{opacity:1}._hidden_5ipin_172{opacity:0;transition:opacity .3s ease,visibility .3s ease;visibility:hidden}._dotsContainerWrapper_5ipin_181{pointer-events:auto;z-index:2}._dotsContainer_5ipin_181{position:relative}@media (max-width:768px){._carouselWrapper_5ipin_2 ._dotsContainerWrapper_5ipin_181{cursor:pointer}._carouselWrapper_5ipin_2 ._dotsContainerWrapper_5ipin_181:active{opacity:.8}}._hiddenTabs_5ipin_203{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}._tapEnabled_5ipin_216{cursor:pointer;touch-action:manipulation}._autoplayControlWrapper_5ipin_231{align-items:center;display:flex;justify-content:center;pointer-events:auto;position:absolute;right:16px;top:16px;z-index:10}._carouselDefault_5ipin_245{height:100%;overflow-x:hidden;width:361px}._carouselDefault_5ipin_245 ._prevButton_5ipin_250{left:10px;position:absolute;top:50%;transform:translateY(-50%);z-index:5}._carouselDefault_5ipin_245 ._nextButton_5ipin_257{position:absolute;right:10px;top:50%;transform:translateY(-50%);z-index:5}._carouselDefault_5ipin_245 ._dotsContainer_5ipin_181{bottom:12px;display:flex;justify-content:center;left:0;position:absolute;right:0;z-index:5}._carouselWithAutoPlay_5ipin_275{position:relative;width:100%}._carouselWithAutoPlay_5ipin_275 ._prevButton_5ipin_250{left:10px;position:absolute;top:50%;transform:translateY(-50%);z-index:5}._carouselWithAutoPlay_5ipin_275 ._nextButton_5ipin_257{position:absolute;right:10px;top:50%;transform:translateY(-50%);z-index:5}._carouselWithAutoPlay_5ipin_275 ._dotsContainer_5ipin_181{bottom:12px;display:flex;justify-content:center;left:0;position:absolute;right:0;z-index:5}._carouselWithAutoPlay_5ipin_275 ._autoplayControl_5ipin_231{pointer-events:auto!important;position:absolute!important;right:16px!important;top:16px!important;z-index:20!important}._carouselWithScrollPeek_5ipin_311{position:relative}._carouselWithScrollPeek_5ipin_311,._carouselWithScrollPeek_5ipin_311 ._carousel_5ipin_2{overflow-x:visible!important;overflow-y:hidden!important}._carouselWithScrollPeek_5ipin_311 ._prevButton_5ipin_250{left:16px;position:absolute;top:50%;transform:translateY(-50%);z-index:10}._carouselWithScrollPeek_5ipin_311 ._nextButton_5ipin_257{position:absolute;right:16px;top:50%;transform:translateY(-50%);z-index:10}._carouselWithScrollPeek_5ipin_311 ._dotsContainer_5ipin_181{bottom:20px;display:flex;justify-content:center;left:0;position:absolute;right:0;z-index:5}._carouselWithFractionalItems_5ipin_345{position:relative}._carouselWithFractionalItems_5ipin_345,._carouselWithFractionalItems_5ipin_345 ._carousel_5ipin_2{overflow-x:visible!important;overflow-y:hidden!important}._carouselWithFractionalItems_5ipin_345 ._prevButton_5ipin_250{left:16px;position:absolute;top:50%;transform:translateY(-50%);z-index:10}._carouselWithFractionalItems_5ipin_345 ._nextButton_5ipin_257{position:absolute;right:16px;top:50%;transform:translateY(-50%);z-index:10}._carouselWithFractionalItems_5ipin_345 ._dotsContainer_5ipin_181{bottom:20px;display:flex;justify-content:center;left:0;position:absolute;right:0;z-index:5}._paginationDotsDefault_5ipin_379{position:relative;width:100%}._paginationDotsDefault_5ipin_379 ._prevButton_5ipin_250{left:10px;position:absolute;top:50%;transform:translateY(-50%);z-index:5}._paginationDotsDefault_5ipin_379 ._nextButton_5ipin_257{position:absolute;right:10px;top:50%;transform:translateY(-50%);z-index:5}._paginationDotsDefault_5ipin_379 ._dotsContainer_5ipin_181{bottom:12px;display:flex;justify-content:center;left:0;position:absolute;right:0;z-index:5}._hoverArrowsDefault_5ipin_408{height:100%;overflow-x:hidden;width:361px}._hoverArrowsDefault_5ipin_408 ._prevButton_5ipin_250{left:10px;opacity:0;position:absolute;top:50%;transform:translateY(-50%);transition:opacity .3s ease;z-index:5}._hoverArrowsDefault_5ipin_408 ._nextButton_5ipin_257{opacity:0;position:absolute;right:10px;top:50%;transform:translateY(-50%);transition:opacity .3s ease;z-index:5}._hoverArrowsDefault_5ipin_408:focus-within ._nextButton_5ipin_257,._hoverArrowsDefault_5ipin_408:focus-within ._prevButton_5ipin_250,._hoverArrowsDefault_5ipin_408:hover ._nextButton_5ipin_257,._hoverArrowsDefault_5ipin_408:hover ._prevButton_5ipin_250{opacity:1}._hoverArrowsDefault_5ipin_408 ._dotsContainer_5ipin_181{bottom:12px;display:flex;justify-content:center;left:0;position:absolute;right:0;z-index:5}
@@ -0,0 +1 @@
1
+ ._arrowContainer_f9nx_1{background:none;border:none;box-shadow:none!important;outline:none!important;padding:0;pointer-events:auto;position:relative;z-index:2}._arrowContainer_f9nx_1:focus,._arrowContainer_f9nx_1:focus-visible{box-shadow:none!important;outline:none!important}._iconButton_f9nx_20{align-items:center;display:flex;justify-content:center}._arrowContainer_f9nx_1._hideDisabledArrow_f9nx_26[aria-disabled=true]{display:none}._arrowContainer_f9nx_1._neutral_f9nx_32 ._iconButton_f9nx_20[data-focused=true],._arrowContainer_f9nx_1._neutral_f9nx_32 ._iconButton_f9nx_20[data-parent-hovered=true]{background-color:var(--alto-sem-color-overlay-state-darken-invert-hover)}._arrowContainer_f9nx_1:not([aria-disabled]) ._neutral_f9nx_32 ._iconButton_f9nx_20[data-parent-pressed=true]{background-color:var(--alto-sem-color-overlay-state-darken-invert-active)}._arrowContainer_f9nx_1._white_f9nx_44 ._iconButton_f9nx_20{background-color:transparent;border:none;border-radius:0}._arrowContainer_f9nx_1._white_f9nx_44:not([aria-disabled]) ._iconButton_f9nx_20[data-focused=true],._arrowContainer_f9nx_1._white_f9nx_44:not([aria-disabled]) ._iconButton_f9nx_20[data-parent-hovered=true]{background-color:var(--alto-sem-color-overlay-state-lighten-hover)}._arrowContainer_f9nx_1._white_f9nx_44:not([aria-disabled]) ._iconButton_f9nx_20[data-parent-pressed=true]{background-color:var(--alto-sem-color-overlay-state-lighten-active)}._arrowContainer_f9nx_1._shapeFlat_f9nx_62:not([aria-disabled]) ._iconButton_f9nx_20{background-color:var(--alto-sem-color-bg-white-vibrant-default)}._arrowContainer_f9nx_1._shapeFlat_f9nx_62:not([aria-disabled]) ._iconButton_f9nx_20[data-parent-pressed=true]{background-color:var(--alto-sem-color-bg-white-vibrant-active)}._arrowContainer_f9nx_1._shapeElevated_f9nx_72:not([aria-disabled]) ._iconButton_f9nx_20{background-color:var(--alto-sem-color-bg-white-vibrant-default);box-shadow:0 11.4px 9.12px #2f2a850d,0 2.59px 4.4px #2f2a850d,0 6.99px 18.18px #2f2a8514}._arrowContainer_f9nx_1._shapeElevated_f9nx_72:not([aria-disabled]) ._iconButton_f9nx_20[data-focused=true],._arrowContainer_f9nx_1._shapeElevated_f9nx_72:not([aria-disabled]) ._iconButton_f9nx_20[data-parent-hovered=true]{background-color:var(--alto-sem-color-bg-white-vibrant-hover)}._arrowContainer_f9nx_1._shapeElevated_f9nx_72:not([aria-disabled]) ._iconButton_f9nx_20[data-parent-pressed=true]{background-color:var(--alto-sem-color-bg-white-vibrant-active)}._arrowContainer_f9nx_1._gradient_f9nx_93:not([aria-disabled]) ._iconButton_f9nx_20{background:linear-gradient(90deg,#fefefe 50%,#fff0);border:none;border-radius:0;height:100%}._arrowContainer_f9nx_1._gradient_f9nx_93._next_f9nx_100:not([aria-disabled]) ._iconButton_f9nx_20{background:linear-gradient(90deg,#fff0,#fefefe 50%)}._arrowContainer_f9nx_1._gradient_f9nx_93:not([aria-disabled]) ._iconButton_f9nx_20[data-focused=true],._arrowContainer_f9nx_1._gradient_f9nx_93:not([aria-disabled]) ._iconButton_f9nx_20[data-parent-hovered=true]{background:linear-gradient(90deg,#fefefe 50%,#fff0);color:var(--alto-sem-color-fg-accent-primary)}._arrowContainer_f9nx_1._gradient_f9nx_93._next_f9nx_100:not([aria-disabled]) ._iconButton_f9nx_20[data-focused=true],._arrowContainer_f9nx_1._gradient_f9nx_93._next_f9nx_100:not([aria-disabled]) ._iconButton_f9nx_20[data-parent-hovered=true]{background:linear-gradient(90deg,#fff0,#fefefe 50%);color:var(--alto-sem-color-fg-accent-primary)}._arrowContainer_f9nx_1._gradient_f9nx_93:not([aria-disabled]) ._iconButton_f9nx_20[data-parent-pressed=true]{background-color:var(--alto-sem-color-overlay-state-lighten-active)}._arrowContainer_f9nx_1._gradient_f9nx_93:not([aria-disabled]) ._iconButton_f9nx_20[data-focused],._arrowContainer_f9nx_1._white_f9nx_44:not([aria-disabled]) ._iconButton_f9nx_20{outline-offset:var(--alto-sem-border-width-none)}._arrowContainer_f9nx_1[aria-disabled] ._iconButton_f9nx_20{background-color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;opacity:var(--alto-sem-opacity-30)}._arrowContainer_f9nx_1._fullHeight_f9nx_137{align-items:center;bottom:0;cursor:pointer;display:flex;height:100%;top:0;transform:none}._arrowContainer_f9nx_1._fullHeight_f9nx_137._prev_f9nx_148{justify-content:flex-start;left:0}._arrowContainer_f9nx_1._fullHeight_f9nx_137._next_f9nx_100{justify-content:flex-end;right:0}._arrowContainer_f9nx_1._fullHeight_f9nx_137 ._iconButton_f9nx_20{border:none!important;box-shadow:none!important;outline:none!important;position:relative;z-index:2}._arrowContainer_f9nx_1._fullHeight_f9nx_137 ._iconButton_f9nx_20:focus,._arrowContainer_f9nx_1._fullHeight_f9nx_137 ._iconButton_f9nx_20:focus-visible,._arrowContainer_f9nx_1._fullHeight_f9nx_137 ._iconButton_f9nx_20[data-focus-visible=true],._arrowContainer_f9nx_1._fullHeight_f9nx_137 ._iconButton_f9nx_20[data-focused=true]{border:none!important;box-shadow:none!important;outline:none!important}._arrowContainer_f9nx_1:not(._fullHeight_f9nx_137){box-shadow:none!important;outline:none!important}._arrowContainer_f9nx_1:not(._fullHeight_f9nx_137):focus,._arrowContainer_f9nx_1:not(._fullHeight_f9nx_137):focus-visible{box-shadow:none!important;outline:none!important}
@@ -0,0 +1 @@
1
+ ._tabsContainer_c3kjx_1{align-items:center;display:flex;justify-content:center;margin:0 auto;min-height:30px;position:relative;width:auto}._tabsContainer_c3kjx_1:focus{border:2px solid green}._tabs_c3kjx_1{align-items:center;background-color:var(--alto-sem-color-bg-white-vibrant-default);border-radius:var(--alto-sem-radius-circle);display:flex;justify-content:center;padding:var(--alto-sem-space-2xs) var(--alto-sem-space-xs);position:relative}._tabs_c3kjx_1._transparent_c3kjx_25{background-color:transparent}._dotsScroller_c3kjx_29{align-items:center;display:flex;flex-wrap:wrap;gap:var(--alto-sem-space-2xs);justify-content:center;position:relative;white-space:nowrap}._tab_c3kjx_1{background-color:#0000004d;border:none;border-radius:var(--alto-sem-radius-circle);cursor:pointer;display:block;flex-shrink:0;margin:0;padding:0}._tab_c3kjx_1:hover,._tab_c3kjx_1[data-hovered=true]{transform:scale(1.1)}._tab_c3kjx_1._activeTab_c3kjx_56{background-color:var(--alto-sem-color-fg-primary)}._tabs_c3kjx_1[data-focused=true] ._tab_c3kjx_1._activeTab_c3kjx_56{background-color:var(--alto-sem-color-border-accent)}._tabsContainer_c3kjx_1[data-transitioning=true] ._tab_c3kjx_1{pointer-events:none;transition:none!important}._tabsContainer_c3kjx_1[data-transitioning=true] ._dotsScroller_c3kjx_29{transition:none!important}._tabMd_c3kjx_75{height:8px;width:8px}._tabLg_c3kjx_80{height:12px;width:12px}
@@ -1,5 +1,5 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import React from "react";
2
+ import React__default from "react";
3
3
  import { Disclosure, DisclosureGroup, Button, DisclosurePanel } from "react-aria-components";
4
4
  import { Icon } from "../Icon/Icon.js";
5
5
  import '../../assets/Accordion.css';const accordion = "_accordion_1m3lr_1";
@@ -58,8 +58,8 @@ const AccordionPanel = ({
58
58
  children,
59
59
  ...props
60
60
  }) => {
61
- const contentRef = React.useRef(null);
62
- React.useEffect(() => {
61
+ const contentRef = React__default.useRef(null);
62
+ React__default.useEffect(() => {
63
63
  const content = contentRef.current;
64
64
  if (!content) return;
65
65
  const group = content.closest('[role="group"]');
@@ -110,8 +110,8 @@ const AccordionGroup = ({
110
110
  allowsMultipleExpanded = true
111
111
  }) => {
112
112
  const groupClasses = [styles.accordionGroup, className].filter(Boolean).join(" ");
113
- const defaultExpandedKeys = React.Children.toArray(children).map((child, index) => {
114
- if (React.isValidElement(child) && child.props.defaultExpanded) {
113
+ const defaultExpandedKeys = React__default.Children.toArray(children).map((child, index) => {
114
+ if (React__default.isValidElement(child) && child.props.defaultExpanded) {
115
115
  return `accordion-${index}`;
116
116
  }
117
117
  return null;
@@ -121,9 +121,9 @@ const AccordionGroup = ({
121
121
  title,
122
122
  description
123
123
  ] }),
124
- /* @__PURE__ */ jsx(DisclosureGroup, { className: styles.accordionStack, allowsMultipleExpanded, defaultExpandedKeys, children: React.Children.map(children, (child, index) => {
125
- if (React.isValidElement(child)) {
126
- return React.cloneElement(child, {
124
+ /* @__PURE__ */ jsx(DisclosureGroup, { className: styles.accordionStack, allowsMultipleExpanded, defaultExpandedKeys, children: React__default.Children.map(children, (child, index) => {
125
+ if (React__default.isValidElement(child)) {
126
+ return React__default.cloneElement(child, {
127
127
  key: `accordion-${index}`,
128
128
  id: `accordion-${index}`
129
129
  });
@@ -1,5 +1,5 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import React from "react";
2
+ import React__default from "react";
3
3
  import { c as cva } from "../../index-Bi3v_EjJ.js";
4
4
  import '../../assets/AviosCurrencySymbol.css';const styles = {
5
5
  "aviosCurrencySymbol-primary": "_aviosCurrencySymbol-primary_152jd_1",
@@ -51,7 +51,7 @@ const AviosCurrencySymbol = ({
51
51
  "aria-label": ariaLabel,
52
52
  ...props
53
53
  }) => {
54
- const dimensions = React.useMemo(() => {
54
+ const dimensions = React__default.useMemo(() => {
55
55
  if (width && height) {
56
56
  return {
57
57
  width,
@@ -1,5 +1,5 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import React from "react";
2
+ import React__default from "react";
3
3
  import { c as cva } from "../../index-Bi3v_EjJ.js";
4
4
  import '../../assets/ButtonGroup.css';const buttonGroup = "_buttonGroup_zcnod_2";
5
5
  const alignStart = "_alignStart_zcnod_10";
@@ -41,7 +41,7 @@ const ButtonGroup = ({
41
41
  }) => {
42
42
  return /* @__PURE__ */ jsx("div", { className: `${buttonGroupStyles({
43
43
  align
44
- })}`, role: "group", "aria-label": "Button Group", children: React.Children.map(children, (child) => child) });
44
+ })}`, role: "group", "aria-label": "Button Group", children: React__default.Children.map(children, (child) => child) });
45
45
  };
46
46
  export {
47
47
  ButtonGroup,
@@ -1,5 +1,5 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import React from "react";
2
+ import React__default from "react";
3
3
  import { Icon } from "../Icon/Icon.js";
4
4
  import { c as cva } from "../../index-Bi3v_EjJ.js";
5
5
  import { IconButton } from "../IconButton/IconButton.js";
@@ -57,7 +57,7 @@ const CalloutBanner = ({
57
57
  emphasis = "primary",
58
58
  onDismiss
59
59
  }) => {
60
- const iconName = React.useMemo(() => {
60
+ const iconName = React__default.useMemo(() => {
61
61
  switch (styleVariant) {
62
62
  case "critical":
63
63
  return "circle-exclamation";
@@ -0,0 +1,27 @@
1
+ export interface AutoplayControlProps {
2
+ /**
3
+ * Focus style
4
+ * @default 'default'
5
+ */
6
+ focusStyle?: 'default' | 'white';
7
+ /**
8
+ * Style variant of the button
9
+ * @default 'neutralVibrant'
10
+ */
11
+ variant?: 'neutralVibrant' | 'neutralSubtle' | 'whiteVibrant' | 'whiteSubtle';
12
+ /**
13
+ * Size of the button
14
+ * @default 'md'
15
+ */
16
+ size?: 'sm' | 'md';
17
+ /**
18
+ * Additional CSS class name for the container
19
+ */
20
+ className?: string;
21
+ /**
22
+ * Additional CSS class name for the button
23
+ */
24
+ buttonClassName?: string;
25
+ }
26
+ export declare const AutoplayControl: ({ variant, size, focusStyle, className, buttonClassName, }: AutoplayControlProps) => import("react/jsx-runtime").JSX.Element;
27
+ export default AutoplayControl;
@@ -0,0 +1,116 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import { useState } from "react";
3
+ import { f as CarouselAutoplayControl } from "../../../index-uZFEbUWx.js";
4
+ import { useFocusRing } from "@react-aria/focus";
5
+ import { i as iconButtonStyles } from "../../../IconButton.module-DcfPVyUX.js";
6
+ import { Icon } from "../../Icon/Icon.js";
7
+ import { focusStyleVariants } from "../../../utils/focus/focusStyles.js";
8
+ import '../../../assets/AutoplayControl.css';const autoplayControl = "_autoplayControl_kk1sb_1";
9
+ const iconButton = "_iconButton_kk1sb_17";
10
+ const sizeMd = "_sizeMd_kk1sb_25";
11
+ const sizeSm = "_sizeSm_kk1sb_31";
12
+ const neutralVibrant = "_neutralVibrant_kk1sb_38";
13
+ const whiteVibrant = "_whiteVibrant_kk1sb_44";
14
+ const neutralSubtle = "_neutralSubtle_kk1sb_55";
15
+ const whiteSubtle = "_whiteSubtle_kk1sb_61";
16
+ const styles = {
17
+ autoplayControl,
18
+ iconButton,
19
+ sizeMd,
20
+ sizeSm,
21
+ neutralVibrant,
22
+ whiteVibrant,
23
+ neutralSubtle,
24
+ whiteSubtle
25
+ };
26
+ const AutoplayControl = ({
27
+ variant = "neutralVibrant",
28
+ size = "md",
29
+ focusStyle = "default",
30
+ className = "",
31
+ buttonClassName = ""
32
+ }) => {
33
+ const {
34
+ isFocusVisible,
35
+ focusProps,
36
+ isFocused
37
+ } = useFocusRing();
38
+ const [isHovered, setIsHovered] = useState(false);
39
+ const [isPressed, setIsPressed] = useState(false);
40
+ const variantClass = styles[variant] || "";
41
+ const iconSize = size === "md" ? "1.25x" : "1x";
42
+ const getIconColor = () => {
43
+ switch (variant) {
44
+ case "whiteVibrant":
45
+ return "whiteOnVibrant";
46
+ case "whiteSubtle":
47
+ return "whiteOnSubtle";
48
+ case "neutralVibrant":
49
+ return "inverseOnVibrant";
50
+ case "neutralSubtle":
51
+ return "inverseOnSubtle";
52
+ default:
53
+ return "whiteOnVibrant";
54
+ }
55
+ };
56
+ const handleKeyDown = (e) => {
57
+ if (e.key === " " || e.key === "Enter") {
58
+ e.preventDefault();
59
+ setIsPressed(true);
60
+ }
61
+ };
62
+ const handleKeyUp = (e) => {
63
+ if (e.key === " " || e.key === "Enter") {
64
+ e.preventDefault();
65
+ setIsPressed(false);
66
+ }
67
+ };
68
+ const getTitle = (autoplayUserPreference) => {
69
+ return autoplayUserPreference ? "Pause slideshow" : "Start slideshow";
70
+ };
71
+ return /* @__PURE__ */ jsx(
72
+ CarouselAutoplayControl,
73
+ {
74
+ className: `${styles.autoplayControl} ${styles[`size${size.toUpperCase()}`]} ${variantClass} ${className || ""}`,
75
+ ...focusProps,
76
+ onMouseEnter: () => setIsHovered(true),
77
+ onMouseLeave: () => {
78
+ setIsHovered(false);
79
+ setIsPressed(false);
80
+ },
81
+ onMouseDown: () => setIsPressed(true),
82
+ onMouseUp: () => setIsPressed(false),
83
+ onKeyDown: handleKeyDown,
84
+ onKeyUp: handleKeyUp,
85
+ "data-hovered": isHovered ? true : void 0,
86
+ "data-pressed": isPressed ? true : void 0,
87
+ "data-focused": isFocused ? true : void 0,
88
+ "data-size": size,
89
+ tabIndex: 0,
90
+ role: "button",
91
+ children: ({
92
+ autoplayUserPreference
93
+ }) => /* @__PURE__ */ jsx(
94
+ "div",
95
+ {
96
+ className: `${styles.iconButton} ${iconButtonStyles.iconButton} ${iconButtonStyles[size] || ""} ${focusStyleVariants({
97
+ focusStyle
98
+ })} ${buttonClassName || ""}`,
99
+ "data-focused": isFocused ? true : void 0,
100
+ "data-focus-visible": isFocusVisible ? true : void 0,
101
+ "data-parent-hovered": isHovered ? true : void 0,
102
+ "data-parent-pressed": isPressed ? true : void 0,
103
+ "data-size": size,
104
+ "aria-hidden": "true",
105
+ title: getTitle(autoplayUserPreference),
106
+ children: /* @__PURE__ */ jsx(Icon, { iconPrefix: "fas", iconName: autoplayUserPreference ? "pause" : "play", color: getIconColor(), iconSize, "aria-hidden": "true" })
107
+ }
108
+ )
109
+ }
110
+ );
111
+ };
112
+ export {
113
+ AutoplayControl,
114
+ AutoplayControl as default
115
+ };
116
+ //# sourceMappingURL=AutoplayControl.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AutoplayControl.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -0,0 +1,169 @@
1
+ import { default as React } from 'react';
2
+ import { WithResponsive } from '../../utils/breakpoint/responsive';
3
+ export interface CarouselBaseProps {
4
+ /**
5
+ * Content to be displayed in the carousel
6
+ */
7
+ children?: React.ReactNode | React.ReactNode[];
8
+ /**
9
+ * Accessible name for the carousel
10
+ * Describes the purpose or content of the carousel for screen readers
11
+ * @example "Featured products" or "Customer testimonials"
12
+ */
13
+ 'aria-label'?: string;
14
+ /**
15
+ * ID of an element that provides additional description for the carousel
16
+ * Can reference an element that gives more context about the carousel's content
17
+ * @example "carousel-description"
18
+ */
19
+ 'aria-describedby'?: string;
20
+ /**
21
+ * Looping behavior
22
+ * - 'infinite': Carousel loops continuously
23
+ * - 'backToStart': Carousel loops back to start after reaching end
24
+ * - 'off': Looping is disabled
25
+ * @default 'off'
26
+ */
27
+ looping?: 'infinite' | 'backToStart' | 'off';
28
+ /**
29
+ * Number of items to display per page (minimum: 1)
30
+ * Decimal values (e.g., 2.25) can be used to show partial items
31
+ * @default 1
32
+ * @min 1
33
+ */
34
+ itemsPerPage?: number;
35
+ /**
36
+ * Space between carousel items in pixels
37
+ * @default 0
38
+ */
39
+ spaceBetweenItems?: number;
40
+ /**
41
+ * Amount of padding added to the scroll container to create a "peek" effect.
42
+ * This shows a portion of the adjacent items.
43
+ * Accepts any valid CSS dimension (px, rem, em, %) - e.g., "15%", "20px", "2rem"
44
+ * @example "15%" or "20px" or "2rem"
45
+ * @default undefined
46
+ */
47
+ scrollPadding?: string;
48
+ /**
49
+ * Icon type for navigation buttons
50
+ * @default 'chevron'
51
+ */
52
+ iconType?: 'chevron';
53
+ /**
54
+ * Style of carousel arrow buttons
55
+ * @default 'neutral'
56
+ */
57
+ arrowStyleVariant?: 'neutral' | 'white' | 'shapeFlat' | 'shapeElevated' | 'gradient';
58
+ /**
59
+ * Size of navigation buttons
60
+ * @default 'md'
61
+ */
62
+ arrowSize?: 'sm' | 'md' | 'lg';
63
+ /**
64
+ * Whether to hide navigation buttons when disabled
65
+ * @default false
66
+ */
67
+ hideDisabledArrow?: boolean;
68
+ /**
69
+ * Whether to show arrows only when hovering over the carousel or when it has focus
70
+ * @default false
71
+ */
72
+ showArrowsOnHover?: boolean;
73
+ /**
74
+ * Focus style for interactive elements
75
+ * @default 'default'
76
+ */
77
+ focusStyle?: 'default' | 'white';
78
+ /**
79
+ * Size of pagination dots
80
+ * @default 'md'
81
+ */
82
+ dotsSize?: 'md' | 'lg';
83
+ /**
84
+ * Visual style of pagination dots
85
+ * @default 'standard'
86
+ */
87
+ dotsVariant?: 'standard' | 'transparent';
88
+ /**
89
+ * Whether to hide pagination dots
90
+ * @default false
91
+ */
92
+ hideDots?: boolean;
93
+ /**
94
+ * Whether the autoplay is enabled
95
+ * @default false
96
+ */
97
+ autoPlay?: boolean;
98
+ /**
99
+ * Interval in milliseconds between slides during autoplay
100
+ * @default 2000
101
+ */
102
+ autoPlayInterval?: number;
103
+ /**
104
+ * Style variant for autoplay control button
105
+ * @default 'neutralVibrant'
106
+ */
107
+ autoPlayStyleVariant?: 'neutralVibrant' | 'neutralSubtle' | 'whiteVibrant' | 'whiteSubtle';
108
+ /**
109
+ * Size of autoplay control button
110
+ * @default 'md'
111
+ */
112
+ autoPlayControlSize?: 'sm' | 'md';
113
+ /**
114
+ * Whether to enable mouse dragging for the carousel
115
+ * @default true
116
+ */
117
+ mouseDragging?: boolean;
118
+ /**
119
+ * Class name for the outermost wrapper of the carousel
120
+ */
121
+ carouselWrapperClassName?: string;
122
+ /**
123
+ * Class name for the previous button
124
+ * Use this to position the previous button
125
+ */
126
+ prevArrowClassName?: string;
127
+ /**
128
+ * Class name for the next button
129
+ * Use this to position the next button
130
+ */
131
+ nextArrowClassName?: string;
132
+ /**
133
+ * Class name for the autoplay control
134
+ * Use this to position the autoplay button
135
+ */
136
+ autoplayControlClassName?: string;
137
+ /**
138
+ * Class name for the dots container
139
+ * Use this to position the pagination dots
140
+ */
141
+ dotsContainerClassName?: string;
142
+ /**
143
+ * Class name for the dots wrapper
144
+ * Use this to style the dots wrapper
145
+ */
146
+ dotsWrapperClassName?: string;
147
+ /**
148
+ * Class name for individual dots
149
+ */
150
+ dotClassName?: string;
151
+ /**
152
+ * Class name for the active dot
153
+ */
154
+ activeDotClassName?: string;
155
+ /**
156
+ * Class name for individual carousel item wrappers
157
+ * Use this to style the wrapper div around each carousel item
158
+ */
159
+ itemWrapperClassName?: string;
160
+ /**
161
+ * Class name for the currently active/visible carousel item
162
+ * This class is applied to the item that corresponds to the current page
163
+ */
164
+ activeItemClassName?: string;
165
+ }
166
+ type ResponsiveKeys = 'itemsPerPage' | 'spaceBetweenItems' | 'scrollPadding' | 'showArrowsOnHover' | 'arrowSize';
167
+ export type CarouselProps = WithResponsive<CarouselBaseProps, ResponsiveKeys>;
168
+ export declare const Carousel: ({ children, "aria-label": ariaLabel, "aria-describedby": ariaDescribedby, looping, itemsPerPage, spaceBetweenItems, scrollPadding, iconType, arrowStyleVariant, arrowSize, hideDisabledArrow, showArrowsOnHover, focusStyle, dotsSize, dotsVariant, hideDots, autoPlay, autoPlayInterval, autoPlayStyleVariant, autoPlayControlSize, mouseDragging, carouselWrapperClassName, prevArrowClassName, nextArrowClassName, autoplayControlClassName, dotsContainerClassName, dotsWrapperClassName, dotClassName, activeDotClassName, itemWrapperClassName, activeItemClassName, }: CarouselProps) => import("react/jsx-runtime").JSX.Element;
169
+ export default Carousel;