@sbb-esta/lyne-elements-dev 5.7.0-dev.1788783153 → 5.7.0-dev.1788796277

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 (98) hide show
  1. package/alert.pure.js +1 -1
  2. package/badge/_badge.global.scss +1 -1
  3. package/breadcrumb.pure.js +1 -1
  4. package/button.pure.js +2 -2
  5. package/calendar.pure.js +2 -2
  6. package/card.pure.js +1 -1
  7. package/checkbox-panel.pure.js +1 -1
  8. package/checkbox.pure.js +1 -1
  9. package/chip-label.pure.js +1 -1
  10. package/chip.pure.js +1 -1
  11. package/core/styles/_theme.scss +9 -1
  12. package/core/styles/features/image.scss +1 -1
  13. package/core/styles/lean-off-brand-theme.scss +2 -1
  14. package/core/styles/mixins/_lists.scss +2 -2
  15. package/core/styles/mixins/_typo.scss +3 -3
  16. package/core/styles/off-brand-theme.scss +2 -1
  17. package/datepicker.pure.js +1 -1
  18. package/development/alert.pure.js +1 -1
  19. package/development/breadcrumb.pure.js +1 -1
  20. package/development/button.pure.js +2 -2
  21. package/development/calendar.pure.js +2 -2
  22. package/development/card.pure.js +1 -1
  23. package/development/checkbox-panel.pure.js +1 -1
  24. package/development/checkbox.pure.js +1 -1
  25. package/development/chip-label.pure.js +1 -1
  26. package/development/chip.pure.js +1 -1
  27. package/development/datepicker.pure.js +1 -1
  28. package/development/download.pure.js +1 -1
  29. package/development/expansion-panel.pure.js +1 -1
  30. package/development/file-selector.pure.js +2 -2
  31. package/development/footer.pure.js +1 -1
  32. package/development/form-field.pure.js +3 -3
  33. package/development/header.pure.js +2 -2
  34. package/development/link.pure.js +1 -1
  35. package/development/menu.pure.js +1 -1
  36. package/development/message.pure.js +1 -1
  37. package/development/mini-calendar.pure.js +1 -1
  38. package/development/navigation.pure.js +4 -4
  39. package/development/notification.pure.js +1 -1
  40. package/development/option.pure.js +3 -3
  41. package/development/paginator.pure.js +2 -2
  42. package/development/radio-button-panel.pure.js +1 -1
  43. package/development/radio-button.pure.js +1 -1
  44. package/development/status.pure.js +1 -1
  45. package/development/stepper.pure.js +1 -1
  46. package/development/tabs.pure.js +1 -1
  47. package/development/tag.pure.js +1 -1
  48. package/development/teaser-panel.pure.js +1 -1
  49. package/development/teaser-product.pure.js +1 -1
  50. package/development/teaser.pure.js +1 -1
  51. package/development/timetable-occupancy.pure.js +1 -1
  52. package/development/title.pure.js +1 -1
  53. package/development/toast.pure.js +1 -1
  54. package/development/toggle-check.pure.js +1 -1
  55. package/development/toggle.pure.js +2 -2
  56. package/development/tooltip.pure.js +1 -1
  57. package/development/train.pure.js +3 -3
  58. package/download.pure.js +1 -1
  59. package/expansion-panel.pure.js +1 -1
  60. package/file-selector.pure.js +2 -2
  61. package/footer.pure.js +1 -1
  62. package/form-field/_form-field.global.scss +1 -1
  63. package/form-field.pure.js +3 -3
  64. package/header/_header.global.scss +2 -2
  65. package/header.pure.js +2 -2
  66. package/lean-off-brand-theme.css +16 -34
  67. package/lean-safety-theme.css +18 -16
  68. package/lean-theme.css +18 -16
  69. package/link.pure.js +1 -1
  70. package/menu.pure.js +1 -1
  71. package/message.pure.js +1 -1
  72. package/mini-calendar.pure.js +1 -1
  73. package/navigation/_navigation.global.scss +2 -2
  74. package/navigation.pure.js +4 -4
  75. package/notification.pure.js +1 -1
  76. package/off-brand-theme.css +16 -34
  77. package/option.pure.js +3 -3
  78. package/package.json +2 -2
  79. package/paginator.pure.js +2 -2
  80. package/radio-button-panel.pure.js +1 -1
  81. package/radio-button.pure.js +1 -1
  82. package/safety-theme.css +18 -16
  83. package/standard-theme.css +18 -16
  84. package/status.pure.js +1 -1
  85. package/stepper.pure.js +1 -1
  86. package/table/_table.global.scss +4 -4
  87. package/tabs.pure.js +1 -1
  88. package/tag.pure.js +1 -1
  89. package/teaser-panel.pure.js +1 -1
  90. package/teaser-product.pure.js +1 -1
  91. package/teaser.pure.js +1 -1
  92. package/timetable-occupancy.pure.js +1 -1
  93. package/title.pure.js +1 -1
  94. package/toast.pure.js +1 -1
  95. package/toggle-check.pure.js +1 -1
  96. package/toggle.pure.js +2 -2
  97. package/tooltip.pure.js +1 -1
  98. package/train.pure.js +3 -3
package/alert.pure.js CHANGED
@@ -4,7 +4,7 @@ import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,not
4
4
  <slot name="accessibility-title">${this.accessibilityTitle}</slot>
5
5
  </${c(e)}>`:r}
6
6
  <slot @slotchange=${e=>this._slotChanged(e)}></slot>
7
- `}}})();var w=`:host{--sbb-alert-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-6x));opacity:0;border-radius:var(--sbb-alert-forced-color-border-radius);outline:var(--sbb-alert-outline);grid-template-rows:0fr;display:grid}:host(:is(:state(state-opening),[state--state-opening]):not([animation=open],[animation=all])),:host(:is(:state(state-closing),[state--state-closing]):not([animation=close],[animation=all])){--sbb-disable-animation-duration:0s}:host([size=s]){--sbb-alert-gap:var(--sbb-spacing-fixed-1x) var(--sbb-spacing-responsive-xxs);--sbb-alert-close-icon-margin:var(--sbb-spacing-responsive-xxxs)}:host([size=m]){--sbb-alert-gap:var(--sbb-spacing-fixed-2x) var(--sbb-spacing-responsive-xs);--sbb-alert-close-icon-margin:var(--sbb-spacing-responsive-xxs)}:host([size=l]){--sbb-alert-icon-size:var(--sbb-alert-icon-size-l);--sbb-alert-title-margin-block:0 var(--sbb-spacing-fixed-1x)}:host(:not(:is(:state(dark),[state--dark]))){--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark)}:host(:is(:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){opacity:1;grid-template-rows:1fr}:host(:is(:state(state-opening),[state--state-opening])){animation-name:open,open-opacity;animation-fill-mode:forwards;animation-duration:var(--sbb-alert-animation-duration);animation-timing-function:var(--sbb-alert-timing-function);animation-delay:0s, var(--sbb-alert-animation-duration)}:host(:is(:state(state-closing),[state--state-closing])){animation-name:close-opacity,close;animation-fill-mode:forwards;animation-duration:var(--sbb-alert-animation-duration);animation-timing-function:var(--sbb-alert-timing-function);animation-delay:0s, var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x))}.sbb-alert__transition-wrapper{overflow:hidden}.sbb-alert{align-items:center;gap:var(--sbb-alert-gap);min-width:fit-content;padding:var(--sbb-alert-padding);color:var(--sbb-alert-color);background-color:var(--sbb-alert-background-color);border-radius:var(--sbb-alert-border-radius);font-size:var(--sbb-alert-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);grid-template-columns:1fr auto;display:grid;overflow:hidden}@media (width>=37.5rem){.sbb-alert{grid-template-columns:auto 1fr auto;align-items:flex-start}}.sbb-alert__icon{padding-block:var(--sbb-spacing-fixed-1x);min-width:var(--sbb-alert-icon-size);--sbb-icon-svg-width:var(--sbb-alert-icon-size);--sbb-icon-svg-height:var(--sbb-alert-icon-size);align-items:start;display:flex}.sbb-alert__content{color-scheme:light only;order:3;grid-column:1/3}@media (width>=37.5rem){.sbb-alert__content{order:initial;grid-column-start:initial;grid-column-end:initial}}.sbb-alert__content-slot{margin:0;padding:0;display:inline}.sbb-alert__close-button-wrapper{color-scheme:light only;justify-content:flex-end;align-items:center;height:100%;display:flex}@media (width>=37.5rem){.sbb-alert__close-button{margin-inline-start:var(--sbb-alert-close-icon-margin)}}.sbb-alert__close-button-divider{display:var(--sbb-alert-close-button-divider-display,none);height:calc(100% - var(--sbb-spacing-fixed-1x) * 2)}@keyframes open{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes open-opacity{0%{opacity:0}to{opacity:1}}@keyframes close{0%{grid-template-rows:1fr}to{grid-template-rows:0fr}}@keyframes close-opacity{0%{opacity:1}to{opacity:0}}::slotted(sbb-title){margin-block:var(--sbb-alert-title-margin-block)}
7
+ `}}})();var w=`:host{--sbb-alert-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-6x));opacity:0;border-radius:var(--sbb-alert-forced-color-border-radius);outline:var(--sbb-alert-outline);grid-template-rows:0fr;display:grid}:host(:is(:state(state-opening),[state--state-opening]):not([animation=open],[animation=all])),:host(:is(:state(state-closing),[state--state-closing]):not([animation=close],[animation=all])){--sbb-disable-animation-duration:0s}:host([size=s]){--sbb-alert-gap:var(--sbb-spacing-fixed-1x) var(--sbb-spacing-responsive-xxs);--sbb-alert-close-icon-margin:var(--sbb-spacing-responsive-xxxs)}:host([size=m]){--sbb-alert-gap:var(--sbb-spacing-fixed-2x) var(--sbb-spacing-responsive-xs);--sbb-alert-close-icon-margin:var(--sbb-spacing-responsive-xxs)}:host([size=l]){--sbb-alert-icon-size:var(--sbb-alert-icon-size-l);--sbb-alert-title-margin-block:0 var(--sbb-spacing-fixed-1x)}:host(:not(:is(:state(dark),[state--dark]))){--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark)}:host(:is(:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){opacity:1;grid-template-rows:1fr}:host(:is(:state(state-opening),[state--state-opening])){animation-name:open,open-opacity;animation-fill-mode:forwards;animation-duration:var(--sbb-alert-animation-duration);animation-timing-function:var(--sbb-alert-timing-function);animation-delay:0s, var(--sbb-alert-animation-duration)}:host(:is(:state(state-closing),[state--state-closing])){animation-name:close-opacity,close;animation-fill-mode:forwards;animation-duration:var(--sbb-alert-animation-duration);animation-timing-function:var(--sbb-alert-timing-function);animation-delay:0s, var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x))}.sbb-alert__transition-wrapper{overflow:hidden}.sbb-alert{align-items:center;gap:var(--sbb-alert-gap);min-width:fit-content;padding:var(--sbb-alert-padding);color:var(--sbb-alert-color);background-color:var(--sbb-alert-background-color);border-radius:var(--sbb-alert-border-radius);font-size:var(--sbb-alert-font-size);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);grid-template-columns:1fr auto;display:grid;overflow:hidden}@media (width>=37.5rem){.sbb-alert{grid-template-columns:auto 1fr auto;align-items:flex-start}}.sbb-alert__icon{padding-block:var(--sbb-spacing-fixed-1x);min-width:var(--sbb-alert-icon-size);--sbb-icon-svg-width:var(--sbb-alert-icon-size);--sbb-icon-svg-height:var(--sbb-alert-icon-size);align-items:start;display:flex}.sbb-alert__content{color-scheme:light only;order:3;grid-column:1/3}@media (width>=37.5rem){.sbb-alert__content{order:initial;grid-column-start:initial;grid-column-end:initial}}.sbb-alert__content-slot{margin:0;padding:0;display:inline}.sbb-alert__close-button-wrapper{color-scheme:light only;justify-content:flex-end;align-items:center;height:100%;display:flex}@media (width>=37.5rem){.sbb-alert__close-button{margin-inline-start:var(--sbb-alert-close-icon-margin)}}.sbb-alert__close-button-divider{display:var(--sbb-alert-close-button-divider-display,none);height:calc(100% - var(--sbb-spacing-fixed-1x) * 2)}@keyframes open{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes open-opacity{0%{opacity:0}to{opacity:1}}@keyframes close{0%{grid-template-rows:1fr}to{grid-template-rows:0fr}}@keyframes close-opacity{0%{opacity:1}to{opacity:0}}::slotted(sbb-title){margin-block:var(--sbb-alert-title-margin-block)}
8
8
  `;let T=(()=>{let o=x(p(f)),s,c=[],u=[],m,g=[],v=[];return class extends o{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;s=[a({reflect:!0})],m=[a({reflect:!0})],e(this,null,s,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:t},c,u),e(this,null,m,{kind:`accessor`,name:`animation`,static:!1,private:!1,access:{has:e=>`animation`in e,get:e=>e.animation,set:(e,t)=>{e.animation=t}},metadata:t},g,v),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-alert`}static{this.elementDependencies=[y,b]}static{this.styles=[i(w)]}static{this.events={beforeopen:`beforeopen`,open:`open`,beforeclose:`beforeclose`,close:`close`}}#e;get size(){return this.#e}set size(e){this.#e=e}#t;get animation(){return this.#t}set animation(e){this.#t=e}constructor(){super(),this.#e=t(this,c,null),this.#t=(t(this,u),t(this,g,`all`)),this._language=(t(this,v),new d(this)),this._darkModeController=new l(this,()=>{this._syncLinks(),this._configureTitle(),this.requestUpdate()}),this.addEventListener(`animationend`,e=>this._onAnimationEnd(e))}open(){this.state=`opening`,this.dispatchBeforeOpenEvent()&&this._isZeroAnimationDuration()&&this._handleOpening()}close(){this.state===`opened`&&this.dispatchBeforeCloseEvent()&&(this.state=`closing`,this._isZeroAnimationDuration()&&this._handleClosing())}firstUpdated(e){super.firstUpdated(e),this.open()}willUpdate(e){super.willUpdate(e),e.has(`size`)&&this._configureTitle()}_isZeroAnimationDuration(){return _(this,`--sbb-alert-animation-duration`)}_onAnimationEnd(e){this.state===`opening`&&e.animationName===`open-opacity`?this._handleOpening():this.state===`closing`&&e.animationName===`close`&&this._handleClosing()}_handleOpening(){this.state=`opened`,this.dispatchOpenEvent()}_handleClosing(){this.state=`closed`,this.dispatchCloseEvent(),setTimeout(()=>this.remove())}_handleSlotchange(){this._syncLinks();let e=Array.from(this.children).find(e=>e.localName===`sbb-title`);e&&(e.slot=`title`)}_syncLinks(){Array.from(this.querySelectorAll?.(`sbb-link`)??[]).forEach(e=>{customElements.upgrade(e),e.negative=this._isLightMode()})}_configureTitle(){let e=this.querySelector?.(`sbb-title`);e&&(customElements.upgrade(e),e.negative=this._isLightMode(),e.visualLevel=this.size===`l`?`3`:`5`)}_isLightMode(){return!this._darkModeController.matches()}renderIconName(){return super.renderIconName()||`info`}render(){return n`
9
9
  <!-- wrapper needed to properly support fade in animation -->
10
10
  <div class="sbb-alert__transition-wrapper">
@@ -13,7 +13,7 @@ $theme: 'standard' !default;
13
13
  min-width: var(--sbb-spacing-fixed-4x);
14
14
  max-height: var(--sbb-spacing-fixed-4x);
15
15
  line-height: var(--sbb-typo-line-height-text);
16
- letter-spacing: var(--sbb-typo-letter-spacing-text);
16
+ letter-spacing: var(--sbb-letter-spacing-text);
17
17
  font-size: var(--sbb-text-font-size-xxs);
18
18
  font-weight: bold;
19
19
 
@@ -38,7 +38,7 @@ import{__esDecorate as e,__runInitializers as t}from"tslib";import{ResizeControl
38
38
  ${this._state===`collapsed`?this._renderCollapsed():this._renderExpanded()}
39
39
  </ol>
40
40
  ${this.renderHiddenSlot()}
41
- `}}})();var S=`:host{display:flex}@media (any-hover:hover){:host(:hover){--sbb-breadcrumb-color:var(--sbb-breadcrumb-color-hover)}}:host(:is(:active,:is(:state(active),[state--active]))){--sbb-breadcrumb-color:var(--sbb-breadcrumb-color-active)}.sbb-breadcrumb{--sbb-link-text-decoration-line:none;color:var(--sbb-link-color-normal);text-decoration-line:var(--sbb-link-text-decoration-line,underline);text-underline-offset:.3125em;text-decoration-thickness:.0625rem}@media (forced-colors:active){.sbb-breadcrumb{text-decoration:underline}}.sbb-breadcrumb{cursor:var(--sbb-cursor-pointer);gap:var(--sbb-breadcrumb-gap);color:var(--sbb-breadcrumb-color);font-size:var(--sbb-breadcrumb-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);outline:none;align-items:center;display:flex;overflow:hidden}.sbb-breadcrumb:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);border-radius:var(--sbb-border-radius-2x)}.sbb-breadcrumb__label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-breadcrumb__label{display:none}slot[name=icon] .sbb-breadcrumb__icon,slot[name=icon] ::slotted(*){flex-shrink:0}
41
+ `}}})();var S=`:host{display:flex}@media (any-hover:hover){:host(:hover){--sbb-breadcrumb-color:var(--sbb-breadcrumb-color-hover)}}:host(:is(:active,:is(:state(active),[state--active]))){--sbb-breadcrumb-color:var(--sbb-breadcrumb-color-active)}.sbb-breadcrumb{--sbb-link-text-decoration-line:none;color:var(--sbb-link-color-normal);text-decoration-line:var(--sbb-link-text-decoration-line,underline);text-underline-offset:.3125em;text-decoration-thickness:.0625rem}@media (forced-colors:active){.sbb-breadcrumb{text-decoration:underline}}.sbb-breadcrumb{cursor:var(--sbb-cursor-pointer);gap:var(--sbb-breadcrumb-gap);color:var(--sbb-breadcrumb-color);font-size:var(--sbb-breadcrumb-font-size);letter-spacing:var(--sbb-letter-spacing-text);outline:none;align-items:center;display:flex;overflow:hidden}.sbb-breadcrumb:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);border-radius:var(--sbb-border-radius-2x)}.sbb-breadcrumb__label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-breadcrumb__label{display:none}slot[name=icon] .sbb-breadcrumb__icon,slot[name=icon] ::slotted(*){flex-shrink:0}
42
42
  `,C=class extends v(l){static{this.elementName=`sbb-breadcrumb`}static{this.styles=[a(S)]}renderTemplate(){return y`
43
43
  ${this.renderIconSlot(`sbb-breadcrumb__icon`)}
44
44
  <span class="sbb-breadcrumb__label">
package/button.pure.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import{SbbActionBaseElement as e,SbbButtonBaseElement as t,SbbDisabledInteractiveMixin as n,SbbDisabledMixin as r,SbbDisabledTabIndexActionMixin as i,SbbElement as a,SbbLinkBaseElement as o,SbbNamedSlotListMixin as s,SbbNegativeMixin as c,forceType as l}from"./core.js";import{__esDecorate as u,__runInitializers as d}from"tslib";import{html as f,nothing as p,unsafeCSS as m}from"lit";import{property as h}from"lit/decorators.js";import{html as g}from"lit/static-html.js";import{SbbIconNameMixin as _}from"./icon.pure.js";var v=`:host{--sbb-button-color-active-background:var(--sbb-background-color-1-inverted);--sbb-button-color-active-border:var(--sbb-border-color-1);--sbb-button-color-active-text:light-dark(var(--sbb-color-cloud),var(--sbb-color-anthracite));--sbb-button-color-default-background:var(--sbb-background-color-3-inverted);--sbb-button-color-default-border:var(--sbb-border-color-3);--sbb-button-color-default-text:var(--sbb-color-1-inverted);--sbb-button-color-hover-background:var(--sbb-background-color-3-inverted);--sbb-button-color-hover-border:var(--sbb-border-color-3);--sbb-button-color-hover-text:var(--sbb-color-3-inverted);--sbb-button-color-loading-border:light-dark(var(--sbb-color-iron),var(--sbb-color-silver));--sbb-button-shadow-1-color:light-dark(color-mix(in srgb, var(--sbb-color-platinum) 20%, transparent),color-mix(in srgb, var(--sbb-color-black) 30%, transparent));--sbb-button-shadow-2-color:light-dark(color-mix(in srgb, var(--sbb-color-cement) 20%, transparent),color-mix(in srgb, var(--sbb-color-black) 30%, transparent))}:host([negative]){--sbb-button-color-active-background:var(--sbb-background-color-1-negative-inverted);--sbb-button-color-active-border:var(--sbb-border-color-1-negative);--sbb-button-color-active-text:var(--sbb-color-anthracite);--sbb-button-color-default-background:var(--sbb-background-color-3-negative-inverted);--sbb-button-color-default-border:var(--sbb-border-color-3-negative);--sbb-button-color-default-text:var(--sbb-color-1-negative-inverted);--sbb-button-color-hover-background:var(--sbb-background-color-3-negative-inverted);--sbb-button-color-hover-border:var(--sbb-border-color-3-negative);--sbb-button-color-hover-text:var(--sbb-color-4-negative-inverted);--sbb-button-color-loading-border:var(--sbb-color-silver);--sbb-button-shadow-1-color:color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-button-shadow-2-color:color-mix(in srgb, var(--sbb-color-black) 30%, transparent)}:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]),[loading])){--sbb-button-box-shadow:var(--sbb-button-box-shadow-definition)}
2
- `,y=`:host{--sbb-button-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));--sbb-button-box-shadow-definition:var(--sbb-shadow-elevation-level-3-shadow-2-offset-x) var(--sbb-button-shadow-2-offset-y) var(--sbb-button-shadow-2-blur) var(--sbb-shadow-elevation-level-3-shadow-2-spread) var(--sbb-button-shadow-2-color), var(--sbb-shadow-elevation-level-3-shadow-1-offset-x) var(--sbb-button-shadow-1-offset-y) var(--sbb-button-shadow-1-blur) var(--sbb-shadow-elevation-level-3-shadow-1-spread) var(--sbb-button-shadow-1-color);--_width:unset;--_min-height-modifier:0rem;--_border-color:var(--sbb-button-color-default-border);--_background-color:var(--sbb-button-color-default-background);--_color:var(--sbb-button-color-default-text);--_button-inset:0;--_border:calc(var(--sbb-button-border-width) + var(--sbb-button-border-overlap-fix,1px)) solid var(--_border-color);display:inline-block;outline:none!important}@media (forced-colors:active){:host{--sbb-button-border-overlap-fix:0rem;--sbb-button-color-default-border:CanvasText!important;--sbb-button-color-active-border:Highlight!important;--sbb-button-color-default-background:Canvas!important;--sbb-button-color-hover-background:Canvas!important;--sbb-button-color-active-background:Canvas!important;--sbb-button-color-disabled-background:Canvas!important;--sbb-button-color-disabled-text:GrayText!important;--sbb-button-color-loading-border:Highlight!important;--sbb-button-color-default-text:CanvasText!important;--sbb-button-color-hover-text:CanvasText!important;--sbb-button-color-active-text:CanvasText!important}:host(:is(:state(button),[state--button])){--sbb-button-color-default-text:ButtonText!important;--sbb-button-color-hover-text:ButtonText!important;--sbb-button-color-active-text:ButtonText!important}:host(:is(:state(link),[state--link])){--sbb-button-color-default-text:LinkText!important;--sbb-button-color-hover-text:LinkText!important;--sbb-button-color-active-text:LinkText!important}}:host([negative]){--sbb-button-color-disabled-background:var(--sbb-background-color-3-negative);--sbb-button-color-disabled-text:var(--sbb-color-aluminium)}:host([size=l]){--sbb-button-min-height:var(--sbb-button-min-height-size-l);--sbb-button-padding-inline:var(--sbb-button-padding-inline-size-l)}:host([size=m]){--sbb-button-min-height:var(--sbb-button-min-height-size-m);--sbb-button-padding-inline:var(--sbb-button-padding-inline-size-m)}:host([size=s]){--sbb-button-min-height:var(--sbb-button-min-height-size-s);--sbb-button-padding-inline:var(--sbb-button-padding-inline-size-s);--sbb-button-gap:var(--sbb-spacing-fixed-1x)}:host(:where(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name])):not(:is(:state(slotted),[state--slotted]))){--sbb-button-padding-inline:0;--_width:calc(var(--sbb-button-min-height) + var(--_min-height-modifier))}@media (any-hover:hover){:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]),[loading]):is(:hover,:is(:state(force-hover),[state--force-hover]))){--sbb-button-translate-y-content-hover:-.0625rem;--sbb-button-shadow-1-offset-y:calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-1-offset-y));--sbb-button-shadow-1-blur:calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-1-blur));--sbb-button-shadow-2-blur:calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-2-blur));--sbb-button-cursor:var(--sbb-cursor-pointer);--_border-color:var(--sbb-button-color-hover-border);--_color:var(--sbb-button-color-hover-text);--_background-color:var(--sbb-button-color-hover-background);--_button-inset:calc(var(--sbb-button-border-width) * -1)}}@media (forced-colors:active){:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]),[loading]):is(:hover,:is(:state(force-hover),[state--force-hover]))){--sbb-button-color-hover-border:Highlight!important}}:host(:is([disabled],:disabled,[disabled-interactive])){--sbb-button-cursor:var(--sbb-cursor-default);--_color:var(--sbb-button-color-disabled-text);--_background-color:var(--sbb-button-color-disabled-background);--_border-color:var(--sbb-button-color-disabled-border);--_border:var(--sbb-button-border-disabled-width) var(--sbb-button-border-disabled-style) var(--_border-color)}:host(:not([disabled],:disabled,[disabled-interactive]):is(:active,:is(:state(active),[state--active]),[loading])){--_color:var(--sbb-button-color-active-text);--_background-color:var(--sbb-button-color-active-background);--_border-color:var(--sbb-button-color-active-border)}:host([loading]:not([disabled],:disabled,[disabled-interactive])){--_min-height-modifier:calc(-2 * var(--sbb-button-loading-border-width));--sbb-button-focus-outline-offset-override:calc(var(--sbb-focus-outline-offset) + var(--sbb-button-loading-border-width));--_border:none;--_transform-style:preserve-3d}.sbb-action-base{gap:var(--sbb-button-gap);font-size:var(--sbb-text-font-size-xs);letter-spacing:var(--sbb-typo-letter-spacing-text);font-weight:700;line-height:var(--sbb-typo-line-height-text);text-align:left;white-space:nowrap;min-height:calc(var(--sbb-button-min-height) + var(--_min-height-modifier));width:var(--_width);border-radius:var(--sbb-button-border-radius);color:var(--_color);cursor:var(--sbb-button-cursor);user-select:none;background-color:var(--_background-color);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transform-style:var(--_transform-style,flat);padding-block:var(--sbb-button-padding-block-min);padding-inline:var(--sbb-button-padding-inline);outline:none;justify-content:center;align-items:center;text-decoration:none;transition-property:color,background-color;display:flex;position:relative}.sbb-action-base:before{content:"";inset:var(--_button-inset);border:var(--_border);border-radius:var(--sbb-button-border-radius);pointer-events:none;box-shadow:var(--sbb-button-box-shadow);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:inset,border,box-shadow;position:absolute}:host([loading]:not([disabled],:disabled,[disabled-interactive])) .sbb-action-base{margin:var(--sbb-button-loading-border-width);padding-inline:calc(var(--sbb-button-padding-inline) - var(--sbb-button-loading-border-width));transition-property:none}:host(:is(:state(focus-visible),[state--focus-visible])) .sbb-action-base:before,:host(:focus-visible) .sbb-action-base:before,.sbb-action-base:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-button-focus-outline-offset-override,var(--sbb-focus-outline-offset))}.sbb-button__label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:where(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name])):not(:is(:state(slotted),[state--slotted]))) .sbb-button__label{display:none}.sbb-button__label,::slotted([slot=icon]),sbb-icon{transition:translate var(--sbb-button-transition-duration) var(--sbb-button-transition-easing-function);translate:0 var(--sbb-button-translate-y-content-hover,0)}.sbb-button-loading-border{inset:calc(-1 * var(--sbb-button-loading-border-width));clip-path:border-box;border-radius:var(--sbb-button-border-radius);background:var(--_background-color);z-index:-1;contain:paint;animation:background-fade-in var(--sbb-disable-animation-duration,var(--sbb-animation-duration-6x)) var(--sbb-disable-animation-duration,var(--sbb-button-loading-delay)) linear;animation-fill-mode:forwards;position:absolute;transform:translateZ(-1px);container-type:inline-size}.sbb-button-loading-border:before{content:"";width:64cqmin;max-height:var(--sbb-button-min-height);aspect-ratio:2;background:radial-gradient(100% 100% at right, var(--sbb-button-color-active-text), transparent 50%);offset-path:border-box;offset-anchor:100% 50%;opacity:0;animation:snake-fade-in var(--sbb-disable-animation-duration,calc(var(--sbb-animation-duration-12x) * 2)) var(--sbb-disable-animation-duration,calc(var(--sbb-button-loading-delay) + var(--sbb-animation-duration-5x))) var(--sbb-animation-easing), snake-position var(--sbb-disable-animation-duration,calc(max(tan(atan2(var(--sbb-button-width), 1px)) / 136, .5) * 3s)) infinite linear;transform-style:preserve-3d;animation-fill-mode:forwards;display:block;position:absolute}@keyframes snake-position{to{offset-distance:100%}}@keyframes snake-fade-in{to{opacity:1}}@keyframes background-fade-in{to{background:var(--sbb-button-color-loading-border)}}
2
+ `,y=`:host{--sbb-button-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));--sbb-button-box-shadow-definition:var(--sbb-shadow-elevation-level-3-shadow-2-offset-x) var(--sbb-button-shadow-2-offset-y) var(--sbb-button-shadow-2-blur) var(--sbb-shadow-elevation-level-3-shadow-2-spread) var(--sbb-button-shadow-2-color), var(--sbb-shadow-elevation-level-3-shadow-1-offset-x) var(--sbb-button-shadow-1-offset-y) var(--sbb-button-shadow-1-blur) var(--sbb-shadow-elevation-level-3-shadow-1-spread) var(--sbb-button-shadow-1-color);--_width:unset;--_min-height-modifier:0rem;--_border-color:var(--sbb-button-color-default-border);--_background-color:var(--sbb-button-color-default-background);--_color:var(--sbb-button-color-default-text);--_button-inset:0;--_border:calc(var(--sbb-button-border-width) + var(--sbb-button-border-overlap-fix,1px)) solid var(--_border-color);display:inline-block;outline:none!important}@media (forced-colors:active){:host{--sbb-button-border-overlap-fix:0rem;--sbb-button-color-default-border:CanvasText!important;--sbb-button-color-active-border:Highlight!important;--sbb-button-color-default-background:Canvas!important;--sbb-button-color-hover-background:Canvas!important;--sbb-button-color-active-background:Canvas!important;--sbb-button-color-disabled-background:Canvas!important;--sbb-button-color-disabled-text:GrayText!important;--sbb-button-color-loading-border:Highlight!important;--sbb-button-color-default-text:CanvasText!important;--sbb-button-color-hover-text:CanvasText!important;--sbb-button-color-active-text:CanvasText!important}:host(:is(:state(button),[state--button])){--sbb-button-color-default-text:ButtonText!important;--sbb-button-color-hover-text:ButtonText!important;--sbb-button-color-active-text:ButtonText!important}:host(:is(:state(link),[state--link])){--sbb-button-color-default-text:LinkText!important;--sbb-button-color-hover-text:LinkText!important;--sbb-button-color-active-text:LinkText!important}}:host([negative]){--sbb-button-color-disabled-background:var(--sbb-background-color-3-negative);--sbb-button-color-disabled-text:var(--sbb-color-aluminium)}:host([size=l]){--sbb-button-min-height:var(--sbb-button-min-height-size-l);--sbb-button-padding-inline:var(--sbb-button-padding-inline-size-l)}:host([size=m]){--sbb-button-min-height:var(--sbb-button-min-height-size-m);--sbb-button-padding-inline:var(--sbb-button-padding-inline-size-m)}:host([size=s]){--sbb-button-min-height:var(--sbb-button-min-height-size-s);--sbb-button-padding-inline:var(--sbb-button-padding-inline-size-s);--sbb-button-gap:var(--sbb-spacing-fixed-1x)}:host(:where(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name])):not(:is(:state(slotted),[state--slotted]))){--sbb-button-padding-inline:0;--_width:calc(var(--sbb-button-min-height) + var(--_min-height-modifier))}@media (any-hover:hover){:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]),[loading]):is(:hover,:is(:state(force-hover),[state--force-hover]))){--sbb-button-translate-y-content-hover:-.0625rem;--sbb-button-shadow-1-offset-y:calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-1-offset-y));--sbb-button-shadow-1-blur:calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-1-blur));--sbb-button-shadow-2-blur:calc(.5 * var(--sbb-shadow-elevation-level-3-shadow-2-blur));--sbb-button-cursor:var(--sbb-cursor-pointer);--_border-color:var(--sbb-button-color-hover-border);--_color:var(--sbb-button-color-hover-text);--_background-color:var(--sbb-button-color-hover-background);--_button-inset:calc(var(--sbb-button-border-width) * -1)}}@media (forced-colors:active){:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]),[loading]):is(:hover,:is(:state(force-hover),[state--force-hover]))){--sbb-button-color-hover-border:Highlight!important}}:host(:is([disabled],:disabled,[disabled-interactive])){--sbb-button-cursor:var(--sbb-cursor-default);--_color:var(--sbb-button-color-disabled-text);--_background-color:var(--sbb-button-color-disabled-background);--_border-color:var(--sbb-button-color-disabled-border);--_border:var(--sbb-button-border-disabled-width) var(--sbb-button-border-disabled-style) var(--_border-color)}:host(:not([disabled],:disabled,[disabled-interactive]):is(:active,:is(:state(active),[state--active]),[loading])){--_color:var(--sbb-button-color-active-text);--_background-color:var(--sbb-button-color-active-background);--_border-color:var(--sbb-button-color-active-border)}:host([loading]:not([disabled],:disabled,[disabled-interactive])){--_min-height-modifier:calc(-2 * var(--sbb-button-loading-border-width));--sbb-button-focus-outline-offset-override:calc(var(--sbb-focus-outline-offset) + var(--sbb-button-loading-border-width));--_border:none;--_transform-style:preserve-3d}.sbb-action-base{gap:var(--sbb-button-gap);font-size:var(--sbb-text-font-size-xs);letter-spacing:var(--sbb-letter-spacing-text);font-weight:700;line-height:var(--sbb-typo-line-height-text);text-align:left;white-space:nowrap;min-height:calc(var(--sbb-button-min-height) + var(--_min-height-modifier));width:var(--_width);border-radius:var(--sbb-button-border-radius);color:var(--_color);cursor:var(--sbb-button-cursor);user-select:none;background-color:var(--_background-color);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transform-style:var(--_transform-style,flat);padding-block:var(--sbb-button-padding-block-min);padding-inline:var(--sbb-button-padding-inline);outline:none;justify-content:center;align-items:center;text-decoration:none;transition-property:color,background-color;display:flex;position:relative}.sbb-action-base:before{content:"";inset:var(--_button-inset);border:var(--_border);border-radius:var(--sbb-button-border-radius);pointer-events:none;box-shadow:var(--sbb-button-box-shadow);transition-duration:var(--sbb-button-transition-duration);transition-timing-function:var(--sbb-button-transition-easing-function);transition-property:inset,border,box-shadow;position:absolute}:host([loading]:not([disabled],:disabled,[disabled-interactive])) .sbb-action-base{margin:var(--sbb-button-loading-border-width);padding-inline:calc(var(--sbb-button-padding-inline) - var(--sbb-button-loading-border-width));transition-property:none}:host(:is(:state(focus-visible),[state--focus-visible])) .sbb-action-base:before,:host(:focus-visible) .sbb-action-base:before,.sbb-action-base:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-button-focus-outline-offset-override,var(--sbb-focus-outline-offset))}.sbb-button__label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:where(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name])):not(:is(:state(slotted),[state--slotted]))) .sbb-button__label{display:none}.sbb-button__label,::slotted([slot=icon]),sbb-icon{transition:translate var(--sbb-button-transition-duration) var(--sbb-button-transition-easing-function);translate:0 var(--sbb-button-translate-y-content-hover,0)}.sbb-button-loading-border{inset:calc(-1 * var(--sbb-button-loading-border-width));clip-path:border-box;border-radius:var(--sbb-button-border-radius);background:var(--_background-color);z-index:-1;contain:paint;animation:background-fade-in var(--sbb-disable-animation-duration,var(--sbb-animation-duration-6x)) var(--sbb-disable-animation-duration,var(--sbb-button-loading-delay)) linear;animation-fill-mode:forwards;position:absolute;transform:translateZ(-1px);container-type:inline-size}.sbb-button-loading-border:before{content:"";width:64cqmin;max-height:var(--sbb-button-min-height);aspect-ratio:2;background:radial-gradient(100% 100% at right, var(--sbb-button-color-active-text), transparent 50%);offset-path:border-box;offset-anchor:100% 50%;opacity:0;animation:snake-fade-in var(--sbb-disable-animation-duration,calc(var(--sbb-animation-duration-12x) * 2)) var(--sbb-disable-animation-duration,calc(var(--sbb-button-loading-delay) + var(--sbb-animation-duration-5x))) var(--sbb-animation-easing), snake-position var(--sbb-disable-animation-duration,calc(max(tan(atan2(var(--sbb-button-width), 1px)) / 136, .5) * 3s)) infinite linear;transform-style:preserve-3d;animation-fill-mode:forwards;display:block;position:absolute}@keyframes snake-position{to{offset-distance:100%}}@keyframes snake-fade-in{to{opacity:1}}@keyframes background-fade-in{to{background:var(--sbb-button-color-loading-border)}}
3
3
  `,b=`:host{-webkit-tap-highlight-color:transparent;--sbb-mini-button-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));--sbb-mini-button-color-background:var(--sbb-mini-button-color-default-background);--sbb-mini-button-color:var(--sbb-mini-button-color-text);height:fit-content;display:inline-block;outline:none!important}@media (forced-colors:active){:host{--sbb-mini-button-color-text:ButtonText!important;--sbb-mini-button-color-hover-background:Highlight!important;--sbb-mini-button-color-active-background:Highlight!important;--sbb-mini-button-color-disabled-background:Canvas!important;--sbb-mini-button-color-disabled-border:GrayText!important;--sbb-mini-button-color-disabled-text:GrayText!important}}:host([negative]){--sbb-mini-button-color-text:var(--sbb-color-3-negative);--sbb-mini-button-color-default-background:transparent;--sbb-mini-button-color-hover-background:var(--sbb-background-color-3-negative);--sbb-mini-button-color-active-background:var(--sbb-background-color-4-negative);--sbb-mini-button-color-disabled-background:var(--sbb-background-color-3-negative);--sbb-mini-button-color-disabled-border:var(--sbb-border-color-5);--sbb-mini-button-color-disabled-text:var(--sbb-color-5)}@media (any-hover:hover){:host(:is(:hover,:is(:state(force-hover),[state--force-hover])):not([disabled],:disabled,[disabled-interactive],:is(:state(disabled),[state--disabled]),:active,:is(:state(active),[state--active]))){--sbb-mini-button-translate-y-content-hover:-.0625rem;--sbb-mini-button-color-background:var(--sbb-mini-button-color-hover-background)}}:host(:is(:active,:is(:state(active),[state--active])):not([disabled],:disabled,[disabled-interactive],:is(:state(disabled),[state--disabled]))){--sbb-mini-button-color-background:var(--sbb-mini-button-color-active-background)}:host(:is([disabled],:disabled,[disabled-interactive],:is(:state(disabled),[state--disabled]))){--sbb-mini-button-color-background:var(--sbb-mini-button-color-disabled-background);--sbb-mini-button-border:var(--sbb-border-width-1x) dashed var(--sbb-mini-button-color-disabled-border);--sbb-mini-button-color:var(--sbb-mini-button-color-disabled-text);--sbb-mini-button-pointer-events:none;--sbb-mini-button-cursor:var(--sbb-cursor-default)}:host(:is(:state(focus-visible),[state--focus-visible])){--sbb-focus-outline-style:initial}.sbb-action-base{color:var(--sbb-mini-button-color);border-radius:var(--sbb-mini-button-border-radius);user-select:none;pointer-events:var(--sbb-mini-button-pointer-events,auto);cursor:var(--sbb-mini-button-cursor,var(--sbb-cursor-pointer));transition:color var(--sbb-mini-button-transition-duration) var(--sbb-mini-button-transition-easing-function);outline:none;text-decoration:none;display:flex;position:relative}.sbb-action-base:before{content:"";border-radius:var(--sbb-mini-button-border-radius);background-color:var(--sbb-mini-button-color-background);transition-duration:var(--sbb-mini-button-transition-duration);transition-timing-function:var(--sbb-mini-button-transition-easing-function);border:var(--sbb-mini-button-border);transition-property:inset,background-color;position:absolute;inset:0}.sbb-action-base:focus-visible:before,:host(:is(:is(:state(focus-visible),[state--focus-visible]),:focus-visible)) .sbb-action-base:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}::slotted(sbb-icon),sbb-icon{transition:translate var(--sbb-mini-button-transition-duration) var(--sbb-mini-button-transition-easing-function);translate:0 var(--sbb-mini-button-translate-y-content-hover,0);min-width:var(--_sbb-mini-button-image-size,var(--sbb-size-icon-ui-small));min-height:var(--_sbb-mini-button-image-size,var(--sbb-size-icon-ui-small));justify-content:center;align-items:center;display:flex}
4
- `,x=`:host{--sbb-mini-button-gap:.125rem;--sbb-mini-button-padding-inline:var(--sbb-spacing-fixed-2x);--sbb-mini-button-label-display:block;--sbb-mini-button-label-height:var(--sbb-size-icon-ui-small)}:host(:where(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name])):not(:is(:state(slotted),[state--slotted]))){--sbb-mini-button-padding-inline:0;--sbb-mini-button-label-display:none;--sbb-mini-button-label-height:unset}.sbb-action-base{height:var(--sbb-mini-button-label-height);gap:var(--sbb-mini-button-gap);padding-inline:var(--sbb-mini-button-padding-inline);justify-content:center;align-items:center}.sbb-mini-button__label{white-space:nowrap;text-overflow:ellipsis;font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:var(--sbb-mini-button-label-display);transition:translate var(--sbb-mini-button-transition-duration) var(--sbb-mini-button-transition-easing-function);translate:0 var(--sbb-mini-button-translate-y-content-hover,0);overflow:hidden}
4
+ `,x=`:host{--sbb-mini-button-gap:.125rem;--sbb-mini-button-padding-inline:var(--sbb-spacing-fixed-2x);--sbb-mini-button-label-display:block;--sbb-mini-button-label-height:var(--sbb-size-icon-ui-small)}:host(:where(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name])):not(:is(:state(slotted),[state--slotted]))){--sbb-mini-button-padding-inline:0;--sbb-mini-button-label-display:none;--sbb-mini-button-label-height:unset}.sbb-action-base{height:var(--sbb-mini-button-label-height);gap:var(--sbb-mini-button-gap);padding-inline:var(--sbb-mini-button-padding-inline);justify-content:center;align-items:center}.sbb-mini-button__label{white-space:nowrap;text-overflow:ellipsis;font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:var(--sbb-mini-button-label-display);transition:translate var(--sbb-mini-button-transition-duration) var(--sbb-mini-button-transition-easing-function);translate:0 var(--sbb-mini-button-translate-y-content-hover,0);overflow:hidden}
5
5
  `,S=`:host{--sbb-button-color-active-background:var(--sbb-color-primary150);--sbb-button-color-active-border:var(--sbb-color-primary150);--sbb-button-color-active-text:var(--sbb-color-4-negative);--sbb-button-color-default-background:var(--sbb-color-primary);--sbb-button-color-default-border:var(--sbb-color-primary);--sbb-button-color-default-text:var(--sbb-color-1-negative);--sbb-button-color-hover-background:var(--sbb-color-primary125);--sbb-button-color-hover-border:var(--sbb-color-primary125);--sbb-button-color-hover-text:var(--sbb-color-3-negative);--sbb-button-color-loading-border:light-dark(color-mix(in srgb, var(--sbb-button-color-active-background) 50%, var(--sbb-button-color-default-text)),color-mix(in srgb, var(--sbb-button-color-active-background) 70%, var(--sbb-button-color-default-text)));--sbb-button-shadow-1-color:light-dark(color-mix(in srgb, var(--sbb-color-primary) 20%, transparent),color-mix(in srgb, var(--sbb-color-primary) 40%, transparent));--sbb-button-shadow-2-color:light-dark(color-mix(in srgb, var(--sbb-color-primary125) 20%, transparent),color-mix(in srgb, var(--sbb-color-primary125) 40%, transparent))}:host([negative]){--sbb-button-color-active-background:var(--sbb-color-primary150);--sbb-button-color-active-border:var(--sbb-color-primary150);--sbb-button-color-active-text:var(--sbb-color-4-negative);--sbb-button-color-default-background:var(--sbb-color-primary);--sbb-button-color-default-border:var(--sbb-color-primary);--sbb-button-color-default-text:var(--sbb-color-1-negative);--sbb-button-color-hover-background:var(--sbb-color-primary125);--sbb-button-color-hover-border:var(--sbb-color-primary125);--sbb-button-color-hover-text:var(--sbb-color-3-negative);--sbb-button-color-loading-border:color-mix(in srgb, var(--sbb-button-color-active-background) 70%, var(--sbb-button-color-default-text));--sbb-button-shadow-1-color:light-dark(color-mix(in srgb, var(--sbb-color-primary) 60%, transparent),color-mix(in srgb, var(--sbb-color-primary) 40%, transparent));--sbb-button-shadow-2-color:light-dark(color-mix(in srgb, var(--sbb-color-primary125) 60%, transparent),color-mix(in srgb, var(--sbb-color-primary125) 40%, transparent))}:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]),[loading])){--sbb-button-box-shadow:var(--sbb-button-box-shadow-definition)}
6
6
  `,C=`:host{--sbb-button-color-active-background:var(--sbb-background-color-3);--sbb-button-color-active-border:var(--sbb-border-color-4-inverted);--sbb-button-color-active-text:light-dark(var(--sbb-color-anthracite),var(--sbb-color-graphite));--sbb-button-color-default-background:var(--sbb-background-color-1);--sbb-button-color-default-border:var(--sbb-border-color-4-inverted);--sbb-button-color-default-text:var(--sbb-color-3);--sbb-button-color-hover-background:var(--sbb-background-color-1);--sbb-button-color-hover-border:var(--sbb-border-color-4-inverted);--sbb-button-color-hover-text:var(--sbb-color-4);--sbb-button-color-loading-border:var(--sbb-border-color-4-inverted);--sbb-button-shadow-1-color:light-dark(color-mix(in srgb, var(--sbb-color-platinum) 20%, transparent),color-mix(in srgb, var(--sbb-color-black) 30%, transparent));--sbb-button-shadow-2-color:light-dark(color-mix(in srgb, var(--sbb-color-cement) 20%, transparent),color-mix(in srgb, var(--sbb-color-black) 30%, transparent));--sbb-button-border-overlap-fix:0rem}:host([negative]){--sbb-button-color-active-background:var(--sbb-background-color-2-negative);--sbb-button-color-active-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-color-active-text:var(--sbb-color-graphite);--sbb-button-color-default-background:var(--sbb-background-color-1-negative);--sbb-button-color-default-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-color-default-text:var(--sbb-color-3-negative);--sbb-button-color-hover-background:var(--sbb-background-color-1-negative);--sbb-button-color-hover-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-color-hover-text:var(--sbb-color-4-negative);--sbb-button-color-loading-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-shadow-1-color:color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-button-shadow-2-color:color-mix(in srgb, var(--sbb-color-black) 30%, transparent)}:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]))){--sbb-button-box-shadow:var(--sbb-button-box-shadow-definition)}
7
7
  `,w=`:host{--sbb-button-color-active-background:var(--sbb-background-color-4);--sbb-button-color-active-border:var(--sbb-border-color-4-inverted);--sbb-button-color-active-text:var(--sbb-color-1);--sbb-button-color-default-background:transparent;--sbb-button-color-default-border:transparent;--sbb-button-color-default-text:var(--sbb-color-1);--sbb-button-color-hover-background:var(--sbb-background-color-3);--sbb-button-color-hover-border:var(--sbb-border-color-3-inverted);--sbb-button-color-hover-text:var(--sbb-color-1);--sbb-button-color-loading-border:light-dark(var(--sbb-color-silver),var(--sbb-color-granite))}:host([negative]){--sbb-button-color-active-background:var(--sbb-background-color-4-negative);--sbb-button-color-active-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-color-active-text:var(--sbb-color-1-negative);--sbb-button-color-default-background:transparent;--sbb-button-color-default-border:transparent;--sbb-button-color-default-text:var(--sbb-color-1-negative);--sbb-button-color-hover-background:var(--sbb-background-color-3-negative);--sbb-button-color-hover-border:var(--sbb-border-color-3-negative-inverted);--sbb-button-color-hover-text:var(--sbb-color-1-negative);--sbb-button-color-loading-border:var(--sbb-color-granite)}
package/calendar.pure.js CHANGED
@@ -1,11 +1,11 @@
1
- import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,isServer as r,nothing as i,unsafeCSS as a}from"lit";import{property as o,state as s}from"lit/decorators.js";import{MONDAY as c,SbbButtonLikeBaseElement as l,SbbDisabledMixin as u,SbbElement as ee,SbbFormAssociatedMixin as te,SbbLanguageController as d,SbbPropertyWatcherController as f,THURSDAY as ne,TUESDAY as re,WEDNESDAY as ie,buttonResetStyles as ae,defaultDateAdapter as p,forceType as m,handleDistinctChange as oe,i18nCalendarDateSelection as h,i18nCalendarWeekNumber as g,i18nNextMonth as se,i18nNextYear as ce,i18nNextYearRange as le,i18nPreviousMonth as ue,i18nPreviousYear as de,i18nPreviousYearRange as fe,i18nYearMonthSelection as pe,isArrowKeyOrPageKeysPressed as me,plainDate as _,readConfig as v,screenReaderOnlyStyles as he}from"./core.js";import{SbbSecondaryButtonElement as ge}from"./button.pure.js";import{SbbIconElement as _e}from"./icon.pure.js";var y=`:host{--sbb-focus-outline-offset:.125rem;--sbb-calendar-cell-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));font-size:var(--sbb-calendar-cell-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);cursor:var(--sbb-calendar-cell-cursor);color:var(--sbb-calendar-cell-color);border-radius:calc(var(--sbb-border-radius-4x) + var(--sbb-calendar-cell-border-width));margin:var(--sbb-calendar-cell-margin);padding:var(--sbb-calendar-cell-border-width);transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);background-clip:content-box;transition-property:background-color;display:block}:host(:is(sbb-calendar-weekday,sbb-calendar-weeknumber)){--sbb-calendar-cell-font-size:var(--sbb-text-font-size-xs);--sbb-calendar-day-height:var(--sbb-calendar-day-size);color:var(--sbb-calendar-header-color);margin-inline:auto}:host(:is(sbb-calendar-day,sbb-calendar-weekday,sbb-calendar-weeknumber)){height:var(--sbb-calendar-day-height);width:var(--sbb-calendar-day-width)}:host(:is(:state(current),[state--current])){font-weight:700}:host(:is(:state(selected),[state--selected])){border:var(--sbb-calendar-cell-border-width) solid var(--sbb-calendar-cell-border-color-selected);padding:0}:host(:disabled){--sbb-calendar-cell-color:var(--sbb-calendar-cell-disabled-color);--sbb-calendar-cell-cursor:default}:host(:disabled:is(:state(crossed-out),[state--crossed-out])){--sbb-calendar-cell-color:var(--sbb-calendar-cell-disabled-crossed-out-color)}:host(:focus-visible){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}@media (any-hover:hover){:host(:not(:disabled,:where(:is(:state(active),[state--active]),:active)):hover){background-color:var(--sbb-calendar-cell-background-color-hover)}}@media (any-hover:hover) and (forced-colors:active){:host(:not(:disabled):hover){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);--sbb-focus-outline-style:initial}}:host(:not(:disabled):where(:is(:state(active),[state--active]),:active)){background-color:var(--sbb-calendar-cell-background-color-active)}.sbb-action-base{flex-direction:column;justify-content:center;width:100%;height:100%;display:flex}.sbb-calendar-year,.sbb-calendar-month{height:var(--sbb-calendar-cell-year-month-height);min-width:var(--sbb-calendar-cell-year-month-width);justify-content:center;width:100%}:host(:is(:state(crossed-out),[state--crossed-out])) :is(.sbb-calendar-year,.sbb-calendar-month,.sbb-calendar-day__value):after{content:"";height:var(--sbb-calendar-cell-disabled-height);width:var(--sbb-calendar-cell-disabled-width);background-color:var(--sbb-calendar-cell-disabled-crossed-out-color);position:absolute;top:50%;left:50%;translate:-50% -50%;rotate:-45deg}
1
+ import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,isServer as r,nothing as i,unsafeCSS as a}from"lit";import{property as o,state as s}from"lit/decorators.js";import{MONDAY as c,SbbButtonLikeBaseElement as l,SbbDisabledMixin as u,SbbElement as ee,SbbFormAssociatedMixin as te,SbbLanguageController as d,SbbPropertyWatcherController as f,THURSDAY as ne,TUESDAY as re,WEDNESDAY as ie,buttonResetStyles as ae,defaultDateAdapter as p,forceType as m,handleDistinctChange as oe,i18nCalendarDateSelection as h,i18nCalendarWeekNumber as g,i18nNextMonth as se,i18nNextYear as ce,i18nNextYearRange as le,i18nPreviousMonth as ue,i18nPreviousYear as de,i18nPreviousYearRange as fe,i18nYearMonthSelection as pe,isArrowKeyOrPageKeysPressed as me,plainDate as _,readConfig as v,screenReaderOnlyStyles as he}from"./core.js";import{SbbSecondaryButtonElement as ge}from"./button.pure.js";import{SbbIconElement as _e}from"./icon.pure.js";var y=`:host{--sbb-focus-outline-offset:.125rem;--sbb-calendar-cell-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));font-size:var(--sbb-calendar-cell-font-size);letter-spacing:var(--sbb-letter-spacing-text);cursor:var(--sbb-calendar-cell-cursor);color:var(--sbb-calendar-cell-color);border-radius:calc(var(--sbb-border-radius-4x) + var(--sbb-calendar-cell-border-width));margin:var(--sbb-calendar-cell-margin);padding:var(--sbb-calendar-cell-border-width);transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);background-clip:content-box;transition-property:background-color;display:block}:host(:is(sbb-calendar-weekday,sbb-calendar-weeknumber)){--sbb-calendar-cell-font-size:var(--sbb-text-font-size-xs);--sbb-calendar-day-height:var(--sbb-calendar-day-size);color:var(--sbb-calendar-header-color);margin-inline:auto}:host(:is(sbb-calendar-day,sbb-calendar-weekday,sbb-calendar-weeknumber)){height:var(--sbb-calendar-day-height);width:var(--sbb-calendar-day-width)}:host(:is(:state(current),[state--current])){font-weight:700}:host(:is(:state(selected),[state--selected])){border:var(--sbb-calendar-cell-border-width) solid var(--sbb-calendar-cell-border-color-selected);padding:0}:host(:disabled){--sbb-calendar-cell-color:var(--sbb-calendar-cell-disabled-color);--sbb-calendar-cell-cursor:default}:host(:disabled:is(:state(crossed-out),[state--crossed-out])){--sbb-calendar-cell-color:var(--sbb-calendar-cell-disabled-crossed-out-color)}:host(:focus-visible){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}@media (any-hover:hover){:host(:not(:disabled,:where(:is(:state(active),[state--active]),:active)):hover){background-color:var(--sbb-calendar-cell-background-color-hover)}}@media (any-hover:hover) and (forced-colors:active){:host(:not(:disabled):hover){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);--sbb-focus-outline-style:initial}}:host(:not(:disabled):where(:is(:state(active),[state--active]),:active)){background-color:var(--sbb-calendar-cell-background-color-active)}.sbb-action-base{flex-direction:column;justify-content:center;width:100%;height:100%;display:flex}.sbb-calendar-year,.sbb-calendar-month{height:var(--sbb-calendar-cell-year-month-height);min-width:var(--sbb-calendar-cell-year-month-width);justify-content:center;width:100%}:host(:is(:state(crossed-out),[state--crossed-out])) :is(.sbb-calendar-year,.sbb-calendar-month,.sbb-calendar-day__value):after{content:"";height:var(--sbb-calendar-cell-disabled-height);width:var(--sbb-calendar-cell-disabled-width);background-color:var(--sbb-calendar-cell-disabled-crossed-out-color);position:absolute;top:50%;left:50%;translate:-50% -50%;rotate:-45deg}
2
2
  `,b=class extends u(l){static{this.styles=[a(y)]}constructor(){super(),this.dateAdapter=v().datetime?.dateAdapter??p,this.addController(new f(this,()=>this.getParent(),{dateFilter:e=>this.setDisabledFilteredState(e),min:e=>this.setDisabledFilteredState(e),max:e=>this.setDisabledFilteredState(e),value:e=>this.setSelectedState(e)}))}getParent(){return this.getRootNode?.()?.host?.closest(`sbb-calendar`)}formResetCallback(){}formStateRestoreCallback(e,t){}},x=`.sbb-calendar-day{justify-content:var(--sbb-calendar-day-justify-content)}.sbb-calendar-day__value{height:var(--sbb-calendar-day-value-height);justify-content:center;align-items:center;display:flex;position:relative}.sbb-calendar-day__extra{display:var(--sbb-calendar-day-extra-display);height:var(--sbb-calendar-day-extra-height)}::slotted(*){height:var(--sbb-calendar-day-extra-height)}
3
3
  `;let S=(()=>{let r=b,i=[],c,l;return class extends r{constructor(){super(...arguments),this._value=(t(this,i),null)}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;c=[o()],l=[s()],e(this,null,c,{kind:`setter`,name:`slot`,static:!1,private:!1,access:{has:e=>`slot`in e,set:(e,t)=>{e.slot=t}},metadata:t},null,i),e(this,null,l,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-day`}static{this.styles=[a(x)]}set slot(e){super.slot=e,this.value=this.dateAdapter.deserialize(e)}get slot(){return super.slot}set value(e){let t=this.dateAdapter.getValidDateOrNull(this.dateAdapter.deserialize(e));if(t){this._value=t;let e=this.dateAdapter.sameDate(t,this.dateAdapter.today());this.toggleState(`current`,e),this.internals.ariaCurrent=e?`date`:null,this.internals.ariaLabel=this.dateAdapter.getAccessibilityFormatDate(t);let n=this.getParent();n&&(this.setDisabledFilteredState(n),this.setSelectedState(n))}}get value(){return this._value}connectedCallback(){super.connectedCallback(),this.tabIndex=-1}getParent(){return this.closest?.(`sbb-calendar`)??this.getRootNode?.()?.host?.closest(`sbb-calendar`)}setSelectedState(e){let t=this.dateAdapter.isValid(this.value)&&(e.multiple?e.value.some(e=>this.dateAdapter.sameDate(this.value,e)):!!e.value&&this.dateAdapter.compareDate(this.value,e.value)===0);this.toggleState(`selected`,t),this.internals.ariaPressed=String(t)}setDisabledFilteredState(e){let t=!this._isActiveDate(e.dateFilter),n=!this._isDayInRange(e.min,e.max);this.disabled=t||n,this.internals.ariaDisabled=String(this.disabled),this.toggleState(`crossed-out`,t&&!n)}_isActiveDate(e){return e&&this.dateAdapter.isValid(this.value)?e(this.value):!0}_isDayInRange(e,t){return!this.dateAdapter.isValid(this.value)||!e&&!t||this.dateAdapter.sameDate(this.value,this.dateAdapter.clampDate(this.value,e,t))}_handleSlotchange(e){this.internals.ariaDescribedByElements=e.target.assignedElements()}renderTemplate(){return n` <span class="sbb-calendar-day__value" aria-hidden="true">
4
4
  ${this.value?this.dateAdapter.getDate(this.value):``}
5
5
  </span>
6
6
  <span class="sbb-calendar-day__extra">
7
7
  <slot @slotchange=${e=>this._handleSlotchange(e)}></slot>
8
- </span>`}}})(),C=(()=>{let r=b,i=[],a;return class o extends r{constructor(){super(...arguments),this._monthShortNames=(t(this,i),this.dateAdapter.getMonthNames(`short`)),this._monthLongNames=this.dateAdapter.getMonthNames(`long`),this._monthValue=null,this._yearValue=null,this._value=null}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;a=[s()],e(this,null,a,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-month`}static{this._monthFormatRegex=/^\d{4}-(0[1-9]|1[0-2])$/}set value(e){if(!e||!o._monthFormatRegex.test(e))return;this._value=e;let t=e.split(`-`);this._yearValue=Number(t[0]),this._monthValue=Number(t[1]);let n=this._yearValue===this.dateAdapter.getYear(this.dateAdapter.today())&&this._monthValue===this.dateAdapter.getMonth(this.dateAdapter.today());this.toggleState(`current`,n),this.internals.ariaLabel=`${this._monthLongNames[this._monthValue-1]} ${this._yearValue}`;let r=this.getParent();r&&(this.setDisabledFilteredState(r),this.setSelectedState(r))}get value(){return this._value}connectedCallback(){super.connectedCallback(),this.tabIndex=-1}setSelectedState(e){let t=!!this.value&&(e.multiple?e.value?.some(e=>this._yearValue===this.dateAdapter.getYear(e)&&this._monthValue===this.dateAdapter.getMonth(e))??!1:!!e.value&&this.dateAdapter.getYear(e.value)===this._yearValue&&this.dateAdapter.getMonth(e.value)===this._monthValue);this.toggleState(`selected`,t),this.internals.ariaPressed=String(t)}setDisabledFilteredState(e){let t=!this._isActiveMonth(e),n=!this._isMonthInRange(e.min,e.max);this.disabled=t||n,this.internals.ariaDisabled=String(this.disabled),this.toggleState(`crossed-out`,t&&!n)}_isActiveMonth(e){if(!e.dateFilter||!this._yearValue||!this._monthValue)return!0;let t=this.dateAdapter.createDate(this._yearValue,this._monthValue,1);for(let n=t;this.dateAdapter.getMonth(n)==this._monthValue;n=this.dateAdapter.addCalendarDays(n,1))if(e.dateFilter(n))return!0;return!1}_isMonthInRange(e,t){if(!e&&!t||!this._yearValue||!this._monthValue)return!0;let n=this.dateAdapter.isValid(e)&&(this._yearValue<this.dateAdapter.getYear(e)||this._yearValue===this.dateAdapter.getYear(e)&&this._monthValue<this.dateAdapter.getMonth(e)),r=this.dateAdapter.isValid(t)&&(this._yearValue>this.dateAdapter.getYear(t)||this._yearValue===this.dateAdapter.getYear(t)&&this._monthValue>this.dateAdapter.getMonth(t));return!(n||r)}renderTemplate(){return n`${this._monthShortNames[this._monthValue-1]}`}}})(),w=(()=>{let r=b,i=[],a;return class extends r{constructor(){super(...arguments),this._value=(t(this,i),null)}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;a=[s()],e(this,null,a,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-year`}set value(e){let t=Number(e);if(isNaN(t))return;this._value=e;let n=this.dateAdapter.getYear(this.dateAdapter.today())===t;this.toggleState(`current`,n),this.internals.ariaLabel=String(t);let r=this.getParent();r&&(this.setDisabledFilteredState(r),this.setSelectedState(r))}get value(){return this._value}connectedCallback(){super.connectedCallback(),this.tabIndex=-1}setSelectedState(e){let t=!!this.value&&(e.multiple?e.value?.some(e=>Number(this.value)===this.dateAdapter.getYear(e))??!1:!!e.value&&this.dateAdapter.getYear(e.value)===Number(this.value));this.toggleState(`selected`,t),this.internals.ariaPressed=String(t)}setDisabledFilteredState(e){let t=!this._isActiveYear(e),n=!this._isYearInRange(e.min,e.max);this.disabled=t||n,this.internals.ariaDisabled=String(this.disabled),this.toggleState(`crossed-out`,t&&!n)}_isActiveYear(e){if(!e.dateFilter||!this.value)return!0;let t=this.dateAdapter.createDate(Number(this.value),1,1);for(let n=t;this.dateAdapter.getYear(n)==Number(this.value);n=this.dateAdapter.addCalendarDays(n,1))if(e.dateFilter(n))return!0;return!1}_isYearInRange(e,t){if(!e&&!t||!this.value)return!0;let n=this.dateAdapter.isValid(e)&&this.dateAdapter.getYear(e)>Number(this.value),r=this.dateAdapter.isValid(t)&&this.dateAdapter.getYear(t)<Number(this.value);return!(n||r)}renderTemplate(){return n`${this.value}`}}})(),T=(()=>{let r=b,i=[],a;return class extends r{constructor(){super(...arguments),this._value=(t(this,i),null)}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;a=[s()],e(this,null,a,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-weekday`}set value(e){e&&(this._value=e,this.internals.ariaLabel=e.long)}get value(){return this._value}setSelectedState(){}setDisabledFilteredState(){}renderTemplate(){return n`${this.value?.narrow}`}}})(),E=(()=>{let r=b,i=[],a;return class extends r{constructor(){super(...arguments),this._language=(t(this,i),new d(this)),this._value=null}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;a=[s()],e(this,null,a,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-weeknumber`}set value(e){e&&(this._value=String(e),this.internals.ariaLabel=`${g[this._language.current]} ${e}`)}get value(){return this._value}setSelectedState(){}setDisabledFilteredState(){}renderTemplate(){return n`${this.value}`}}})();var ve=`:host{width:max-content;max-width:100%;line-height:var(--sbb-typo-line-height-text);display:block}:host(:is(:state(enhanced),[state--enhanced])){--sbb-calendar-cell-padding-block-end:var(--sbb-spacing-fixed-3x)}.sbb-calendar__wrapper{gap:var(--sbb-calendar-tables-gap);flex-wrap:wrap;width:100%;display:flex;position:relative}:host(:is(:state(single-month),[state--single-month])) .sbb-calendar__table-wrapper{width:100%;min-width:fit-content}.sbb-calendar__table-data>slot{justify-content:center;display:flex}:is(.sbb-calendar__year-view,.sbb-calendar__month-view){position:absolute;inset-block-start:0;inset-inline-start:0}:host(:not(:is(:state(view-day),[state--view-day]))) .sbb-calendar__day-view{visibility:hidden}.sbb-calendar__table-header{align-items:center;gap:var(--sbb-calendar-control-gap);height:var(--sbb-size-element-xs);margin-block-end:var(--sbb-spacing-fixed-4x);display:flex}.sbb-calendar__table-header span{color:var(--sbb-calendar-control-view-change-color);flex:auto;padding-inline-start:var(--sbb-spacing-fixed-3x)}.sbb-calendar__control{-webkit-tap-highlight-color:transparent}.sbb-calendar__table{border-collapse:collapse;flex:0 0;width:100%;height:max-content}.sbb-calendar__table :is(thead,tbody){text-align:center}.sbb-calendar__table-header-cell,.sbb-calendar__table-header-cell-vertical{width:var(--sbb-calendar-cell-size);min-width:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-header-color);font-size:var(--sbb-text-font-size-xs);letter-spacing:var(--sbb-typo-letter-spacing-text);justify-content:center;padding:0;font-weight:400}:host(:not([multiple])) .sbb-calendar__table-header-cell,:host(:not([multiple])) .sbb-calendar__table-header-cell-vertical{height:var(--sbb-calendar-cell-size)}.sbb-calendar__table-header-cell-vertical{padding-block-end:var(--sbb-calendar-cell-padding-block-end)}.sbb-calendar__table-data{text-align:center;padding:0;position:relative}.sbb-calendar__day-cell{padding-block-end:var(--sbb-calendar-cell-padding-block-end)}:host(:not(:is(:state(enhanced),[state--enhanced]))) sbb-calendar-day{--sbb-calendar-day-justify-content:center;--sbb-calendar-day-height:var(--sbb-calendar-day-size);--sbb-calendar-day-extra-display:none;--sbb-calendar-day-value-height:unset}
8
+ </span>`}}})(),C=(()=>{let r=b,i=[],a;return class o extends r{constructor(){super(...arguments),this._monthShortNames=(t(this,i),this.dateAdapter.getMonthNames(`short`)),this._monthLongNames=this.dateAdapter.getMonthNames(`long`),this._monthValue=null,this._yearValue=null,this._value=null}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;a=[s()],e(this,null,a,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-month`}static{this._monthFormatRegex=/^\d{4}-(0[1-9]|1[0-2])$/}set value(e){if(!e||!o._monthFormatRegex.test(e))return;this._value=e;let t=e.split(`-`);this._yearValue=Number(t[0]),this._monthValue=Number(t[1]);let n=this._yearValue===this.dateAdapter.getYear(this.dateAdapter.today())&&this._monthValue===this.dateAdapter.getMonth(this.dateAdapter.today());this.toggleState(`current`,n),this.internals.ariaLabel=`${this._monthLongNames[this._monthValue-1]} ${this._yearValue}`;let r=this.getParent();r&&(this.setDisabledFilteredState(r),this.setSelectedState(r))}get value(){return this._value}connectedCallback(){super.connectedCallback(),this.tabIndex=-1}setSelectedState(e){let t=!!this.value&&(e.multiple?e.value?.some(e=>this._yearValue===this.dateAdapter.getYear(e)&&this._monthValue===this.dateAdapter.getMonth(e))??!1:!!e.value&&this.dateAdapter.getYear(e.value)===this._yearValue&&this.dateAdapter.getMonth(e.value)===this._monthValue);this.toggleState(`selected`,t),this.internals.ariaPressed=String(t)}setDisabledFilteredState(e){let t=!this._isActiveMonth(e),n=!this._isMonthInRange(e.min,e.max);this.disabled=t||n,this.internals.ariaDisabled=String(this.disabled),this.toggleState(`crossed-out`,t&&!n)}_isActiveMonth(e){if(!e.dateFilter||!this._yearValue||!this._monthValue)return!0;let t=this.dateAdapter.createDate(this._yearValue,this._monthValue,1);for(let n=t;this.dateAdapter.getMonth(n)==this._monthValue;n=this.dateAdapter.addCalendarDays(n,1))if(e.dateFilter(n))return!0;return!1}_isMonthInRange(e,t){if(!e&&!t||!this._yearValue||!this._monthValue)return!0;let n=this.dateAdapter.isValid(e)&&(this._yearValue<this.dateAdapter.getYear(e)||this._yearValue===this.dateAdapter.getYear(e)&&this._monthValue<this.dateAdapter.getMonth(e)),r=this.dateAdapter.isValid(t)&&(this._yearValue>this.dateAdapter.getYear(t)||this._yearValue===this.dateAdapter.getYear(t)&&this._monthValue>this.dateAdapter.getMonth(t));return!(n||r)}renderTemplate(){return n`${this._monthShortNames[this._monthValue-1]}`}}})(),w=(()=>{let r=b,i=[],a;return class extends r{constructor(){super(...arguments),this._value=(t(this,i),null)}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;a=[s()],e(this,null,a,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-year`}set value(e){let t=Number(e);if(isNaN(t))return;this._value=e;let n=this.dateAdapter.getYear(this.dateAdapter.today())===t;this.toggleState(`current`,n),this.internals.ariaLabel=String(t);let r=this.getParent();r&&(this.setDisabledFilteredState(r),this.setSelectedState(r))}get value(){return this._value}connectedCallback(){super.connectedCallback(),this.tabIndex=-1}setSelectedState(e){let t=!!this.value&&(e.multiple?e.value?.some(e=>Number(this.value)===this.dateAdapter.getYear(e))??!1:!!e.value&&this.dateAdapter.getYear(e.value)===Number(this.value));this.toggleState(`selected`,t),this.internals.ariaPressed=String(t)}setDisabledFilteredState(e){let t=!this._isActiveYear(e),n=!this._isYearInRange(e.min,e.max);this.disabled=t||n,this.internals.ariaDisabled=String(this.disabled),this.toggleState(`crossed-out`,t&&!n)}_isActiveYear(e){if(!e.dateFilter||!this.value)return!0;let t=this.dateAdapter.createDate(Number(this.value),1,1);for(let n=t;this.dateAdapter.getYear(n)==Number(this.value);n=this.dateAdapter.addCalendarDays(n,1))if(e.dateFilter(n))return!0;return!1}_isYearInRange(e,t){if(!e&&!t||!this.value)return!0;let n=this.dateAdapter.isValid(e)&&this.dateAdapter.getYear(e)>Number(this.value),r=this.dateAdapter.isValid(t)&&this.dateAdapter.getYear(t)<Number(this.value);return!(n||r)}renderTemplate(){return n`${this.value}`}}})(),T=(()=>{let r=b,i=[],a;return class extends r{constructor(){super(...arguments),this._value=(t(this,i),null)}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;a=[s()],e(this,null,a,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-weekday`}set value(e){e&&(this._value=e,this.internals.ariaLabel=e.long)}get value(){return this._value}setSelectedState(){}setDisabledFilteredState(){}renderTemplate(){return n`${this.value?.narrow}`}}})(),E=(()=>{let r=b,i=[],a;return class extends r{constructor(){super(...arguments),this._language=(t(this,i),new d(this)),this._value=null}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;a=[s()],e(this,null,a,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,i),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar-weeknumber`}set value(e){e&&(this._value=String(e),this.internals.ariaLabel=`${g[this._language.current]} ${e}`)}get value(){return this._value}setSelectedState(){}setDisabledFilteredState(){}renderTemplate(){return n`${this.value}`}}})();var ve=`:host{width:max-content;max-width:100%;line-height:var(--sbb-typo-line-height-text);display:block}:host(:is(:state(enhanced),[state--enhanced])){--sbb-calendar-cell-padding-block-end:var(--sbb-spacing-fixed-3x)}.sbb-calendar__wrapper{gap:var(--sbb-calendar-tables-gap);flex-wrap:wrap;width:100%;display:flex;position:relative}:host(:is(:state(single-month),[state--single-month])) .sbb-calendar__table-wrapper{width:100%;min-width:fit-content}.sbb-calendar__table-data>slot{justify-content:center;display:flex}:is(.sbb-calendar__year-view,.sbb-calendar__month-view){position:absolute;inset-block-start:0;inset-inline-start:0}:host(:not(:is(:state(view-day),[state--view-day]))) .sbb-calendar__day-view{visibility:hidden}.sbb-calendar__table-header{align-items:center;gap:var(--sbb-calendar-control-gap);height:var(--sbb-size-element-xs);margin-block-end:var(--sbb-spacing-fixed-4x);display:flex}.sbb-calendar__table-header span{color:var(--sbb-calendar-control-view-change-color);flex:auto;padding-inline-start:var(--sbb-spacing-fixed-3x)}.sbb-calendar__control{-webkit-tap-highlight-color:transparent}.sbb-calendar__table{border-collapse:collapse;flex:0 0;width:100%;height:max-content}.sbb-calendar__table :is(thead,tbody){text-align:center}.sbb-calendar__table-header-cell,.sbb-calendar__table-header-cell-vertical{width:var(--sbb-calendar-cell-size);min-width:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-header-color);font-size:var(--sbb-text-font-size-xs);letter-spacing:var(--sbb-letter-spacing-text);justify-content:center;padding:0;font-weight:400}:host(:not([multiple])) .sbb-calendar__table-header-cell,:host(:not([multiple])) .sbb-calendar__table-header-cell-vertical{height:var(--sbb-calendar-cell-size)}.sbb-calendar__table-header-cell-vertical{padding-block-end:var(--sbb-calendar-cell-padding-block-end)}.sbb-calendar__table-data{text-align:center;padding:0;position:relative}.sbb-calendar__day-cell{padding-block-end:var(--sbb-calendar-cell-padding-block-end)}:host(:not(:is(:state(enhanced),[state--enhanced]))) sbb-calendar-day{--sbb-calendar-day-justify-content:center;--sbb-calendar-day-height:var(--sbb-calendar-day-size);--sbb-calendar-day-extra-display:none;--sbb-calendar-day-value-height:unset}
9
9
  `,D=class extends Event{get range(){return this._range}constructor(e){super(`monthchange`,{bubbles:!0,composed:!0}),this._range=Object.freeze(e||[])}},O=class extends Event{get dateSelected(){return this._dateSelected}constructor(e){super(`dateselected`,{bubbles:!0,composed:!0}),this._dateSelected=Object.freeze(e)}};let k=(()=>{let l=te(ee),u=[],f,y=[],b=[],x,k=[],A=[],j,M=[],N=[],P,F=[],ye=[],I,L=[],R=[],z,B,V=[],H=[],U,W=[],G=[],K,q,J,Y=[],X=[],Z,be=[],xe=[],Q,Se=[],Ce=[],we,Te=[],Ee=[],De,Oe=[],$=[];return class extends l{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(l[Symbol.metadata]??null):void 0;f=[m(),o({type:Number})],x=[o()],j=[_(),o()],P=[_(),o()],I=[m(),oe((e,t)=>e._onMultipleChanged(t)),o({type:Boolean})],z=[o()],B=[s()],U=[o({attribute:`date-filter`})],K=[o({attribute:`fixed-month`})],q=[o({attribute:`active-month`})],J=[o({reflect:!0})],Z=[m(),o({attribute:`week-numbers`,type:Boolean})],Q=[s()],we=[s()],De=[s()],e(this,null,f,{kind:`accessor`,name:`amount`,static:!1,private:!1,access:{has:e=>`amount`in e,get:e=>e.amount,set:(e,t)=>{e.amount=t}},metadata:t},y,b),e(this,null,x,{kind:`accessor`,name:`view`,static:!1,private:!1,access:{has:e=>`view`in e,get:e=>e.view,set:(e,t)=>{e.view=t}},metadata:t},k,A),e(this,null,j,{kind:`accessor`,name:`min`,static:!1,private:!1,access:{has:e=>`min`in e,get:e=>e.min,set:(e,t)=>{e.min=t}},metadata:t},M,N),e(this,null,P,{kind:`accessor`,name:`max`,static:!1,private:!1,access:{has:e=>`max`in e,get:e=>e.max,set:(e,t)=>{e.max=t}},metadata:t},F,ye),e(this,null,I,{kind:`accessor`,name:`multiple`,static:!1,private:!1,access:{has:e=>`multiple`in e,get:e=>e.multiple,set:(e,t)=>{e.multiple=t}},metadata:t},L,R),e(this,null,z,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,u),e(this,null,B,{kind:`accessor`,name:`_value`,static:!1,private:!1,access:{has:e=>`_value`in e,get:e=>e._value,set:(e,t)=>{e._value=t}},metadata:t},V,H),e(this,null,U,{kind:`accessor`,name:`dateFilter`,static:!1,private:!1,access:{has:e=>`dateFilter`in e,get:e=>e.dateFilter,set:(e,t)=>{e.dateFilter=t}},metadata:t},W,G),e(this,null,K,{kind:`setter`,name:`fixedMonth`,static:!1,private:!1,access:{has:e=>`fixedMonth`in e,set:(e,t)=>{e.fixedMonth=t}},metadata:t},null,u),e(this,null,q,{kind:`setter`,name:`activeMonth`,static:!1,private:!1,access:{has:e=>`activeMonth`in e,set:(e,t)=>{e.activeMonth=t}},metadata:t},null,u),e(this,null,J,{kind:`accessor`,name:`orientation`,static:!1,private:!1,access:{has:e=>`orientation`in e,get:e=>e.orientation,set:(e,t)=>{e.orientation=t}},metadata:t},Y,X),e(this,null,Z,{kind:`accessor`,name:`weekNumbers`,static:!1,private:!1,access:{has:e=>`weekNumbers`in e,get:e=>e.weekNumbers,set:(e,t)=>{e.weekNumbers=t}},metadata:t},be,xe),e(this,null,Q,{kind:`accessor`,name:`_activeDate`,static:!1,private:!1,access:{has:e=>`_activeDate`in e,get:e=>e._activeDate,set:(e,t)=>{e._activeDate=t}},metadata:t},Se,Ce),e(this,null,we,{kind:`accessor`,name:`_calendarView`,static:!1,private:!1,access:{has:e=>`_calendarView`in e,get:e=>e._calendarView,set:(e,t)=>{e._calendarView=t}},metadata:t},Te,Ee),e(this,null,De,{kind:`accessor`,name:`_initialized`,static:!1,private:!1,access:{has:e=>`_initialized`in e,get:e=>e._initialized,set:(e,t)=>{e._initialized=t}},metadata:t},Oe,$),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-calendar`}static{this.elementDependencies=[S,C,T,E,w,_e,ge]}static{this.styles=[ae,he,a(ve)]}static{this.events={dateselected:`dateselected`,monthchange:`monthchange`}}#e;get amount(){return this.#e}set amount(e){this.#e=e}#t;get view(){return this.#t}set view(e){this.#t=e}#n;get min(){return this.#n}set min(e){this.#n=e}#r;get max(){return this.#r}set max(e){this.#r=e}#i;get multiple(){return this.#i}set multiple(e){this.#i=e}set value(e){if(Array.isArray(e))this._value=e.map(e=>this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(e))).filter(e=>e!==null).filter(e=>!this._isDayInRange(this._dateAdapter.toIso8601(e))||this._dateFilter(e)).sort(this._sortDate);else{let t=this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(e));this._value=t&&(!this._isDayInRange(this._dateAdapter.toIso8601(t))||this._dateFilter(t))?t:null}}get value(){return this._value}#a;get _value(){return this.#a}set _value(e){this.#a=e}#o;get dateFilter(){return this.#o}set dateFilter(e){this.#o=e}set fixedMonth(e){this._fixedMonth=this._parseMonth(e)}get fixedMonth(){return this._fixedMonth?this._toMonthIsoString(this._fixedMonth):``}set activeMonth(e){this._activeMonth=this._parseMonth(e),this._resetCalendarView()}get activeMonth(){return this._activeMonth?this._toMonthIsoString(this._activeMonth):``}#s;get orientation(){return this.#s}set orientation(e){this.#s=e}#c;get weekNumbers(){return this.#c}set weekNumbers(e){this.#c=e}#l;get _activeDate(){return this.#l}set _activeDate(e){this.#l=e}#u;get _calendarView(){return this.#u}set _calendarView(e){this.#u=e}get _cells(){return Array.from((this._calendarView===`day`?Array.from(this.shadowRoot.querySelectorAll(`slot`)).flatMap(e=>e.assignedElements({flatten:!0})):this.shadowRoot?.querySelectorAll(`sbb-calendar-${this._calendarView}`))??[])}#d;get _initialized(){return this.#d}set _initialized(e){this.#d=e}constructor(){super(),this.#e=(t(this,u),t(this,y,1)),this.#t=(t(this,b),t(this,k,`day`)),this.#n=(t(this,A),t(this,M,null)),this.#r=(t(this,N),t(this,F,null)),this.#i=(t(this,ye),t(this,L,!1)),this.#a=(t(this,R),t(this,V,null)),this.#o=(t(this,H),t(this,W,null)),this._fixedMonth=(t(this,G),null),this._activeMonth=null,this.#s=t(this,Y,`horizontal`),this.#c=(t(this,X),t(this,be,!1)),this._dateAdapter=(t(this,xe),v().datetime?.dateAdapter??p),this.#l=t(this,Se,this._dateAdapter.today()),this.#u=(t(this,Ce),t(this,Te,`day`)),this._weekdays=t(this,Ee),this._weeks=[],this._firstVisibleDay=``,this._lastVisibleDay=``,this._monthNames=this._dateAdapter.getMonthNames(`long`),this._enhancedVariant=!1,this._resetFocus=!1,this._containingFocus=!1,this._lastSelection=null,this.#d=t(this,Oe,!1),this._language=(t(this,$),new d(this).withHandler(()=>{this._monthNames=this._dateAdapter.getMonthNames(`long`),this._createMonthRows()})),this._sortDate=(e,t)=>this._dateAdapter.compareDate(e,t),this._onSlotChange=()=>{this._enhancedVariant=Array.from(this.children).some(e=>e.localName===`sbb-calendar-day`),this.toggleState(`enhanced`,this._enhancedVariant),this._setTabIndex()},this._createMonthRows(),this._setWeekdays(),this.addEventListener(`focusin`,()=>this._containingFocus=!0),this.addEventListener(`focusout`,()=>this._containingFocus=!1);let e=e=>e.target.closest(`sbb-calendar-day`)??e.composedPath().find(e=>e.localName===`sbb-calendar-day`)??null;this.addEventListener(`click`,t=>{let n=e(t);n&&this._selectDate(n.value,t)}),this.addEventListener(`keydown`,t=>{let n=e(t);n&&this._handleKeyboardEvent(t,n)}),this.addEventListener(`blur`,()=>this._lastSelection=null)}_dateFilter(e){return this.dateFilter?.(e)??!0}_parseMonth(e){if(typeof e==`string`){let t=e?e.match(/^(\d{4})-(\d{2})$/):null;return t?this._dateAdapter.createDate(Number(t[1]),Number(t[2]),1):null}return e instanceof Date?this._dateAdapter.createDate(e.getFullYear(),e.getMonth()+1,1):this._dateAdapter.isDateInstance(e)&&this._dateAdapter.isValid(e)?this._dateAdapter.clone(e):null}_toMonthIsoString(e){return this._dateAdapter.toIso8601(e).split(`-`).slice(0,2).join(`-`)}resetPosition(){this._resetCalendarView()}connectedCallback(){super.connectedCallback(),this.resetPosition(),this.shadowRoot?.addEventListener(`slotchange`,this._onSlotChange,{capture:!0})}disconnectedCallback(){super.disconnectedCallback(),this.shadowRoot?.removeEventListener(`slotchange`,this._onSlotChange,{capture:!0})}visibleDays(){return this._weeks.flat(2).sort((e,t)=>e.value.localeCompare(t.value))}formResetCallback(){}formStateRestoreCallback(e,t){if(t===`autocomplete`||e==null)return;let n=e=>this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(e));if(typeof e==`string`)this.value=n(e);else if(e instanceof FormData){if(this.multiple){this._readFormData(e).then(e=>this.value=e.map(n).filter(e=>e!=null));return}let t=e.get(this.name);t instanceof Blob?t.text().then(e=>this.value=n(JSON.parse(e))):this.value=n(t)}}async _readFormData(e){return Promise.all(e.getAll(this.name).map(async e=>e instanceof Blob?JSON.parse(await e.text()):e))}focus(){this._resetFocus=!0,this._focusCell()}willUpdate(e){super.willUpdate(e),this._initialized&&((e.has(`amount`)||e.has(`orientation`)||e.has(`fixedMonth`))&&this.resetPosition(),e.has(`view`)&&(this._setChosenYear(),this._chosenMonth=void 0,this._calendarView=this.view))}requestUpdate(e,t,n){super.requestUpdate(e,t,n),e===`_calendarView`?(this.internals.states.delete(`view-${t}`),this.internals.states.add(`view-${this._calendarView}`),this._containingFocus&&(this._resetFocus=!0)):e===`amount`&&this.toggleState(`single-month`,this.amount===1)}updated(e){super.updated(e),this._setTabIndex(),this._focusCell()}firstUpdated(e){super.firstUpdated(e),this._emitMonthChange()}_onMultipleChanged(e){e&&!Array.isArray(this._value)&&(this._value=this._value?[this._value]:[]),!e&&Array.isArray(this._value)&&(this._value=this._value.length?this._value[0]:null)}_createCalendarState(e){if(r)return;if(this.hydrationRequired){this.hydrationComplete.then(()=>this._createCalendarState());return}e&&this._assignActiveDate(e);let t=this._fixedMonth??this._activeDate,n=this.amount<1?1:this.amount;if(this._weeks.length===n&&this._isSameMonth(this._weeks[0][0][0].dateValue,t))return;this._weeks=Array.from({length:n},(e,n)=>this._createWeekRows(this._dateAdapter.addCalendarMonths(t,n)));let i=this._weeks[0][0][0].dateValue;this._firstVisibleDay=this._dateAdapter.toIso8601(this._dateAdapter.createDate(this._dateAdapter.getYear(i),this._dateAdapter.getMonth(i),1));let a=this._weeks[n-1][0][0].dateValue;this._lastVisibleDay=this._dateAdapter.toIso8601(this._dateAdapter.createDate(this._dateAdapter.getYear(a),this._dateAdapter.getMonth(a),this._dateAdapter.getNumDaysInMonth(a))),this._years=this._createYearRows(),this._weekNumbers=this._weeks.map(e=>e.flat().sort((e,t)=>e.value.localeCompare(t.value)).map(e=>e.weekValue).filter((e,t,n)=>n.indexOf(e)===t)),this._initialized=!0}_isSameMonth(e,t){return this._dateAdapter.getYear(e)===this._dateAdapter.getYear(t)&&this._dateAdapter.getMonth(e)===this._dateAdapter.getMonth(t)}_focusCell(){this._resetFocus&&=(this._getFirstFocusable()?.focus(),!1)}_setWeekdays(){let e=this._dateAdapter.getDayOfWeekNames(`narrow`),t=this._dateAdapter.getDayOfWeekNames(`long`).map((t,n)=>({long:t,narrow:e[n]})),n=this._dateAdapter.getFirstDayOfWeek();this._weekdays=t.slice(n).concat(t.slice(0,n))}_createWeekRows(e){let t=this._dateAdapter.getNumDaysInMonth(e),n=this._dateAdapter.getFirstWeekOffset(e);return this.orientation===`horizontal`?this._createWeekRowsHorizontal(e,t,n):this._createWeekRowsVertical(e,t,n)}_createWeekRowsHorizontal(e,t,n){let r=[[]];for(let i=0,a=n;i<t;i++,a++){a===7&&(r.push([]),a=0);let t=this._dateAdapter.createDate(this._dateAdapter.getYear(e),this._dateAdapter.getMonth(e),i+1);r[r.length-1].push(this._mapDateToDay(t))}return r}_createWeekRowsVertical(e,t,n){let r=Array.from({length:7},()=>[]);for(let i=0,a=n;i<t;i++,a++){a===7&&(a=0);let t=this._dateAdapter.createDate(this._dateAdapter.getYear(e),this._dateAdapter.getMonth(e),i+1);r[a].push(this._mapDateToDay(t))}return r}_mapDateToDay(e){return{value:this._dateAdapter.toIso8601(e),dateValue:e,dayValue:String(this._dateAdapter.getDate(e)),monthValue:String(this._dateAdapter.getMonth(e)),yearValue:String(this._dateAdapter.getYear(e)),weekValue:this._getWeek(e),weekDayValue:this._dateAdapter.getDayOfWeek(e)}}_getWeek(e){let t=this._dateAdapter.createDate(this._dateAdapter.getYear(e),1,1),n=this._dateAdapter.getDayOfWeek(t),r=+!![c,re,ie,ne].includes(n),i=this._dateAdapter.addCalendarDays(t,this._dateAdapter.getFirstWeekOffset(t)*-1);for(;this._dateAdapter.compareDate(i,e)<=0;){let n=this._dateAdapter.addCalendarDays(i,6);if(this._dateAdapter.compareDate(e,n)<=0)return r>0?r:this._getWeek(this._dateAdapter.addCalendarDays(t,-1));i=this._dateAdapter.addCalendarDays(i,7),r++}throw Error(`The provided date is invalid`)}_mapValueToISODate(e){return typeof e==`string`?e:this._dateAdapter.toIso8601(e)}_createMonthRows(){let e=Array(12).fill(null).map((e,t)=>({value:String(t+1).padStart(2,`0`),monthValue:t+1})),t=[];for(let n=0;n<3;n++)t.push(e.slice(4*n,4*(n+1)));this._months=t}_createYearRows(){let e=this._getStartValueYearView(),t=Array(24).fill(0).map((t,n)=>e+n),n=[];for(let e=0;e<6;e++)n.push(t.slice(4*e,4*(e+1)));return n}_getStartValueYearView(){let e=0;this.max?e=this._dateAdapter.getYear(this.max)-24+1:this.min&&(e=this._dateAdapter.getYear(this.min));let t=this._dateAdapter.getYear(this._activeDate);return t-((t-e)%24+24)%24}_isDayInRange(e){if(!this.min&&!this.max)return!0;let t=this._dateAdapter.deserialize(e);return this._dateAdapter.sameDate(t,this._dateAdapter.clampDate(t,this.min,this.max))}_selectDate(e,t){if(this._chosenMonth=void 0,this._setChosenYear(),this.multiple){window.getSelection()?.removeAllRanges();let n=this._value?Array.isArray(this._value)?this._value:[this._value]:[],r=n.map(e=>this._dateAdapter.toIso8601(e));if(t.shiftKey&&this._lastSelection&&r.includes(this._dateAdapter.toIso8601(this._lastSelection))&&!r.includes(this._dateAdapter.toIso8601(e))){let t=this._dateAdapter.compareDate(this._lastSelection,e)<0?1:-1,i=[],a=this._lastSelection;for(;!this._dateAdapter.sameDate(a,e);){a=this._dateAdapter.addCalendarDays(a,t);let e=this._dateAdapter.toIso8601(a);r.includes(e)||i.push(e)}n=this._mergeDates(i,r)}else n=n.some(t=>this._dateAdapter.sameDate(t,e))?n.filter(t=>!this._dateAdapter.sameDate(t,e)):[...n,e].sort(this._sortDate);this._lastSelection=e,this._value=n,this._emitDateSelectedEvent(this._value.map(e=>this._dateAdapter.deserialize(e)))}else(!this._value||this._dateAdapter.compareDate(this._value,e)!==0)&&(this._value=e,this._emitDateSelectedEvent(this._dateAdapter.deserialize(e)))}_selectMultipleDates(e){this._value=this._mergeDates(e.map(e=>e.value)),this._emitDateSelectedEvent(this._value.map(e=>this._dateAdapter.deserialize(e)))}_mergeDates(e,t){t??=this._value.map(e=>this._dateAdapter.toIso8601(e));let n=this._cells.filter(e=>!e.disabled).map(e=>this._mapValueToISODate(e.value)),r=e.filter(e=>n.includes(e));return t=r.every(e=>t.includes(e))?t.filter(e=>!r.includes(e)):[...t,...r].filter((e,t,n)=>n.indexOf(e)===t),t.map(e=>this._dateAdapter.deserialize(e)).sort(this._sortDate)}_emitDateSelectedEvent(e){this.dispatchEvent(new O(e)),this.dispatchEvent(new InputEvent(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0}))}_emitMonthChange(){let e=this.visibleDays();this.dispatchEvent(new D(e))}_setChosenYear(){if(this.view===`month`){let e;e=this.multiple?this.value.at(-1):this.value,this._chosenYear=this._dateAdapter.getYear(e??this._dateAdapter.today())}else this._chosenYear=void 0}_assignActiveDate(e){this._activeDate=this._dateAdapter.clampDate(e,this.min,this.max)}_goToDifferentMonth(e){this._createCalendarState(this._dateAdapter.addCalendarMonths(this._activeDate,e)),this._emitMonthChange()}_goToDifferentYear(e){this._chosenYear+=e,this._activeDate=this._dateAdapter.createDate(this._chosenYear,this._dateAdapter.getMonth(this._activeDate),1),this._createCalendarState()}_goToDifferentYearRange(e){this._createCalendarState(this._dateAdapter.addCalendarYears(this._activeDate,e))}_prevDisabled(e){return this.min?this._dateAdapter.compareDate(e,this.min)<0:!1}_nextDisabled(e){return this.max?this._dateAdapter.compareDate(e,this.max)>0:!1}_previousMonthDisabled(){let e=this._dateAdapter.addCalendarDays(this._activeDate,this._dateAdapter.getDate(this._activeDate)*-1);return this._prevDisabled(e)}_nextMonthDisabled(){let e=this._dateAdapter.addCalendarMonths(this._activeDate,this.amount<1?1:this.amount);return e=this._dateAdapter.createDate(this._dateAdapter.getYear(e),this._dateAdapter.getMonth(e),1),this._nextDisabled(e)}_previousYearDisabled(){let e=this._dateAdapter.createDate(this._dateAdapter.getYear(this._activeDate)-1,12,31);return this._prevDisabled(e)}_nextYearDisabled(){let e=this._dateAdapter.createDate(this._dateAdapter.getYear(this._activeDate)+(this.amount<1?1:this.amount),1,1);return this._nextDisabled(e)}_previousYearRangeDisabled(){let e=this._dateAdapter.createDate(this._years[0][0]-1,12,31);return this._prevDisabled(e)}_nextYearRangeDisabled(){let e=this._years.flat(2).at(-1),t=this._dateAdapter.createDate(e+1,1,1);return this._nextDisabled(t)}_handleTableBlur(e){e?.localName!==`sbb-calendar-day`&&this._setTabIndex()}_setTabIndex(){Array.from(this._cells.filter(e=>e.tabIndex===0)??[]).forEach(e=>e.tabIndex=-1);let e=this._getFirstFocusable();e&&(e.tabIndex=0)}_getFirstFocusable(){if(this._calendarView===`day`){let e=this._cells.find(e=>e.matches(`:is(:state(selected),[state--selected])`))??this._cells.find(e=>e.matches(`:is(:state(current),[state--current])`));return e&&!e.disabled?e:this._getFirstFocusableDay()}{let e=this.shadowRoot?.querySelector(`sbb-calendar-${this._calendarView}:is(:state(selected),[state--selected])`)??this.shadowRoot?.querySelector(`sbb-calendar-${this._calendarView}:is(:state(current),[state--current])`);return e&&!e.disabled?e:this.shadowRoot.querySelector(`sbb-calendar-${this._calendarView}:not([disabled])`)}}_getFirstFocusableDay(){let e=this._cells,t=e.filter(e=>!e.disabled);if(!t||t.length===0)return null;{let n=t.map(e=>this._dateAdapter.toIso8601(e.value)).sort()[0];return e.find(e=>e.matches(`[slot="${n}"]`))??null}}_handleKeyboardEvent(e,t){me(e)&&e.preventDefault();let n=t??e.target,r=this._cells,i=r.indexOf(n),a;a=t?this._navigateByKeyboardDayView(e,i,r,this._mapDateToDay(t.value)):this._navigateByKeyboard(e,i,r);let o=(this._enhancedVariant?document:this.shadowRoot).activeElement;a!==o&&(a.tabIndex=0,a.focus(),r.includes(o)&&(o.tabIndex=-1))}_navigateByKeyboardDayView(e,t,n,r){let i=this.orientation===`horizontal`?{leftRight:1,upDown:7}:{leftRight:7,upDown:1};switch(e.key){case`ArrowUp`:return this._findDayArrows(n,t,r.dateValue,-i.upDown);case`ArrowDown`:return this._findDayArrows(n,t,r.dateValue,i.upDown);case`ArrowLeft`:return this._findDayArrows(n,t,r.dateValue,-i.leftRight);case`ArrowRight`:return this._findDayArrows(n,t,r.dateValue,i.leftRight);case`PageUp`:if(this.orientation===`horizontal`){let e=(r.dayValue%7||7)-r.dayValue;return this._findDayPageUpDown(n,t,r,e,i.upDown)}{let e=this._dateAdapter.getFirstWeekOffset(r.dateValue),a=(Math.ceil((+r.dayValue+e)/7)-1)*7-e+1-r.dayValue;return this._findDayPageUpDown(n,t,r,a,i.upDown)}case`PageDown`:if(this.orientation===`horizontal`){let e=+r.monthValue+1>12?1:+r.monthValue+1,a=+r.monthValue+1>12?+r.yearValue+1:+r.yearValue,o=this._dateAdapter.createDate(a,e,1),s=this._dateAdapter.getDate(this._dateAdapter.addCalendarDays(o,-1)),c=Math.trunc((s-+r.dayValue)/7)*7;return this._findDayPageUpDown(n,t,r,c,-i.upDown)}{let e=this._dateAdapter.getFirstWeekOffset(r.dateValue),a=Math.ceil((+r.dayValue+e)/7)*7-e-r.dayValue;return this._findDayPageUpDown(n,t,r,a,-i.upDown)}case`Home`:return this._findDayFirst(n,t,r,1);case`End`:{let e=+r.monthValue+1>12?1:+r.monthValue+1,i=+r.monthValue+1>12?+r.yearValue+1:+r.yearValue,a=this._dateAdapter.createDate(i,e,1);return this._findDayLast(n,t,a)}default:return n[t]}}_isDayOutOfView(e){return e<this._firstVisibleDay||e>this._lastVisibleDay}_findDayArrows(e,t,n,r){let i=this._dateAdapter.toIso8601(this._dateAdapter.addCalendarDays(n,r));if(this._isDayOutOfView(i))return e[t];let a=e.find(e=>this._mapValueToISODate(e.value)===i);return!a||a.disabled?this._findDayArrows(e,t,this._dateAdapter.deserialize(i),r):a}_findDayPageUpDown(e,t,n,r,i){let a=this._dateAdapter.toIso8601(this._dateAdapter.addCalendarDays(n.dateValue,r));if(this._isDayOutOfView(a))return e[t];let o=e.find(e=>this._mapValueToISODate(e.value)===a);return!o||o.disabled?this._findDayPageUpDown(e,t,n,r+i,i):o}_findDayFirst(e,t,n,r){let i=this._dateAdapter.toIso8601(this._dateAdapter.createDate(+n.yearValue,+n.monthValue,r));if(this._isDayOutOfView(i))return e[t];let a=e.find(e=>this._mapValueToISODate(e.value)===i);return!a||a.disabled?this._findDayFirst(e,t,n,r+1):a}_findDayLast(e,t,n){let r=this._dateAdapter.toIso8601(this._dateAdapter.addCalendarDays(n,-1));if(this._isDayOutOfView(r))return e[t];let i=e.find(e=>this._mapValueToISODate(e.value)===r);return!i||i.disabled?this._findDayLast(e,t,this._dateAdapter.deserialize(r)):i}_navigateByKeyboard(e,t,n){let{elementIndexForWideMode:r,offsetForWideMode:i,lastElementIndexForWideMode:a,verticalOffset:o}=this._calculateParametersForKeyboardNavigation(t,this._calendarView===`year`);switch(e.key){case`ArrowUp`:return this._findNext(n,t,-o);case`ArrowDown`:return this._findNext(n,t,o);case`ArrowLeft`:return this._findNext(n,t,-1);case`ArrowRight`:return this._findNext(n,t,1);case`Home`:return this._findFirst(n,i);case`PageUp`:return this._findFirstOnColumn(n,r,i,o);case`PageDown`:return this._findLastOnColumn(n,t,a,o);case`End`:return this._findLast(n,a-1);default:return n[t]}}_calculateParametersForKeyboardNavigation(e,t){let n=t?24:12,r=Math.trunc(e/n)*n,i=r===0?e:e-n;return{verticalOffset:4,elementIndexForWideMode:i,offsetForWideMode:e-i,lastElementIndexForWideMode:r===0?n:n*2}}_findNext(e,t,n){let r=t+n;for(;r<e.length&&e[r]?.disabled;)r+=n;return e[r]??e[t]}_findFirst(e,t){return e[t].disabled?this._findNext(e,t,1):e[t]}_findLast(e,t){return e[t].disabled?this._findNext(e,t,-1):e[t]}_findFirstOnColumn(e,t,n,r){let i=t%r+n;return e[i].disabled?this._findNext(e,i,r):e[i]}_findLastOnColumn(e,t,n,r){let i=t+Math.trunc((n-t-1)/r)*r;return e[i].disabled?this._findNext(e,i,-r):e[i]}_resetCalendarViewAndEmitMonthChange(){this._resetCalendarView(),this._emitMonthChange()}_resetCalendarView(){this._containingFocus&&(this._resetFocus=!0),this._activeDate=this._activeMonth??(this.multiple?this._value.at(-1):this._value)??this._dateAdapter.today(),this._setChosenYear(),this._chosenMonth=void 0,this._createCalendarState(),this._calendarView=this.view}_createDayTable(e,t,r){let a=e[0][0].dateValue,o=`${this._monthNames[this._dateAdapter.getMonth(a)-1]} ${this._dateAdapter.getYear(a)}`,s=e.flat(),c=e.flat();return n`
10
10
  <div class="sbb-calendar__table-wrapper sbb-calendar__day-view">
11
11
  <div class="sbb-calendar__table-header">
package/card.pure.js CHANGED
@@ -1,4 +1,4 @@
1
- import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{IS_FOCUSABLE_QUERY as a,SbbButtonBaseElement as o,SbbElement as s,SbbLinkBaseElement as c,screenReaderOnlyStyles as l,ɵstateController as u}from"./core.js";import{MutationController as d}from"@lit-labs/observers/mutation-controller.js";import{html as f}from"lit/static-html.js";var p=`:host{width:fit-content;height:fit-content;margin-inline-start:auto;display:flex;position:relative}:host:after{content:"";display:var(--sbb-card-badge-border-display,none);border:var(--sbb-border-width-1x) solid CanvasText;position:absolute;inset:0}:host{padding-inline:var(--sbb-card-badge-padding-inline);inset-block-start:0;inset-inline-end:0}:host([color=white]){--sbb-card-badge-color:var(--sbb-color-3);--sbb-card-badge-background-color:var(--sbb-background-color-1);--sbb-card-badge-border-color:light-dark(var(--sbb-color-aluminium),var(--sbb-color-anthracite))}:host(:dir(rtl)){--sbb-card-badge-skew:skew(-16deg, 0deg)}.sbb-card-badge-content{font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);align-items:center;gap:var(--sbb-card-badge-gap);color:var(--sbb-card-badge-color);font-weight:700;display:flex;position:relative}.sbb-card-badge-background{background-color:var(--sbb-card-badge-background-color);transform:var(--sbb-card-badge-skew);border-end-start-radius:var(--sbb-card-badge-border-radius);margin-inline-end:calc(var(--sbb-spacing-fixed-3x) * -1);display:block;position:absolute;inset:0}.sbb-card-badge-background:before{content:"";display:var(--sbb-card-badge-inline-border-display,block);border-block-end:var(--sbb-card-badge-border-width) solid var(--sbb-card-badge-border-color);border-inline-start:var(--sbb-card-badge-border-width) solid var(--sbb-card-badge-border-color);border-end-start-radius:var(--sbb-card-badge-border-radius);position:absolute;inset:0}
1
+ import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{IS_FOCUSABLE_QUERY as a,SbbButtonBaseElement as o,SbbElement as s,SbbLinkBaseElement as c,screenReaderOnlyStyles as l,ɵstateController as u}from"./core.js";import{MutationController as d}from"@lit-labs/observers/mutation-controller.js";import{html as f}from"lit/static-html.js";var p=`:host{width:fit-content;height:fit-content;margin-inline-start:auto;display:flex;position:relative}:host:after{content:"";display:var(--sbb-card-badge-border-display,none);border:var(--sbb-border-width-1x) solid CanvasText;position:absolute;inset:0}:host{padding-inline:var(--sbb-card-badge-padding-inline);inset-block-start:0;inset-inline-end:0}:host([color=white]){--sbb-card-badge-color:var(--sbb-color-3);--sbb-card-badge-background-color:var(--sbb-background-color-1);--sbb-card-badge-border-color:light-dark(var(--sbb-color-aluminium),var(--sbb-color-anthracite))}:host(:dir(rtl)){--sbb-card-badge-skew:skew(-16deg, 0deg)}.sbb-card-badge-content{font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);align-items:center;gap:var(--sbb-card-badge-gap);color:var(--sbb-card-badge-color);font-weight:700;display:flex;position:relative}.sbb-card-badge-background{background-color:var(--sbb-card-badge-background-color);transform:var(--sbb-card-badge-skew);border-end-start-radius:var(--sbb-card-badge-border-radius);margin-inline-end:calc(var(--sbb-spacing-fixed-3x) * -1);display:block;position:absolute;inset:0}.sbb-card-badge-background:before{content:"";display:var(--sbb-card-badge-inline-border-display,block);border-block-end:var(--sbb-card-badge-border-width) solid var(--sbb-card-badge-border-color);border-inline-start:var(--sbb-card-badge-border-width) solid var(--sbb-card-badge-border-color);border-end-start-radius:var(--sbb-card-badge-border-radius);position:absolute;inset:0}
2
2
  `;let m=(()=>{let a=s,o,c=[],l=[];return class extends a{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(a[Symbol.metadata]??null):void 0;o=[i({reflect:!0})],e(this,null,o,{kind:`accessor`,name:`color`,static:!1,private:!1,access:{has:e=>`color`in e,get:e=>e.color,set:(e,t)=>{e.color=t}},metadata:t},c,l),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-card-badge`}static{this.role=`text`}static{this.styles=[r(p)]}#e=t(this,c,`charcoal`);get color(){return this.#e}set color(e){this.#e=e}connectedCallback(){super.connectedCallback(),this.slot||=`badge`}render(){return n`
3
3
  <span class="sbb-card-badge-background" aria-hidden="true"></span>
4
4
  <span class="sbb-card-badge-content">
@@ -1,4 +1,4 @@
1
- import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,nothing as r,unsafeCSS as i}from"lit";import{property as a}from"lit/decorators.js";import{SbbElement as o,SbbFormAssociatedCheckboxMixin as s,SbbPanelMixin as c,SbbPropertyWatcherController as l,SbbUpdateSchedulerMixin as u,forceType as d,screenReaderOnlyStyles as f}from"./core.js";import{SbbVisualCheckboxElement as p}from"./visual-checkbox.pure.js";var m=`:host([size=xs]){--sbb-checkbox-font-size:var(--sbb-text-font-size-xs);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-xs)}:host([size=s]){--sbb-checkbox-font-size:var(--sbb-text-font-size-s);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-s)}:host([size=m]){--sbb-checkbox-font-size:var(--sbb-text-font-size-m);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-m)}:host(:disabled){--sbb-checkbox-cursor:var(--sbb-cursor-default);--sbb-checkbox-label-color:light-dark(var(--sbb-color-granite),var(--sbb-color-aluminium))}.sbb-checkbox-wrapper{display:flex}.sbb-checkbox-wrapper:before{content:"​";user-select:none;width:0;height:0}.sbb-checkbox{width:100%;cursor:var(--sbb-checkbox-cursor);user-select:none;-webkit-tap-highlight-color:transparent;font-size:var(--sbb-checkbox-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:block;position:relative}.sbb-checkbox__inner{align-items:start;gap:var(--sbb-spacing-fixed-2x);display:flex}.sbb-checkbox__label{color:var(--sbb-checkbox-label-color);line-height:max(1em * var(--sbb-typo-line-height-text), var(--sbb-checkbox-dimension));flex-grow:1;display:flex}.sbb-checkbox__aligner{height:calc(1em * var(--sbb-typo-line-height-text));align-items:center;display:flex}
1
+ import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,nothing as r,unsafeCSS as i}from"lit";import{property as a}from"lit/decorators.js";import{SbbElement as o,SbbFormAssociatedCheckboxMixin as s,SbbPanelMixin as c,SbbPropertyWatcherController as l,SbbUpdateSchedulerMixin as u,forceType as d,screenReaderOnlyStyles as f}from"./core.js";import{SbbVisualCheckboxElement as p}from"./visual-checkbox.pure.js";var m=`:host([size=xs]){--sbb-checkbox-font-size:var(--sbb-text-font-size-xs);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-xs)}:host([size=s]){--sbb-checkbox-font-size:var(--sbb-text-font-size-s);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-s)}:host([size=m]){--sbb-checkbox-font-size:var(--sbb-text-font-size-m);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-m)}:host(:disabled){--sbb-checkbox-cursor:var(--sbb-cursor-default);--sbb-checkbox-label-color:light-dark(var(--sbb-color-granite),var(--sbb-color-aluminium))}.sbb-checkbox-wrapper{display:flex}.sbb-checkbox-wrapper:before{content:"​";user-select:none;width:0;height:0}.sbb-checkbox{width:100%;cursor:var(--sbb-checkbox-cursor);user-select:none;-webkit-tap-highlight-color:transparent;font-size:var(--sbb-checkbox-font-size);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:block;position:relative}.sbb-checkbox__inner{align-items:start;gap:var(--sbb-spacing-fixed-2x);display:flex}.sbb-checkbox__label{color:var(--sbb-checkbox-label-color);line-height:max(1em * var(--sbb-typo-line-height-text), var(--sbb-checkbox-dimension));flex-grow:1;display:flex}.sbb-checkbox__aligner{height:calc(1em * var(--sbb-typo-line-height-text));align-items:center;display:flex}
2
2
  `;const h=n=>(()=>{let r=s(n),o,c=[],u=[];return class extends r{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;o=[d(),a({type:Boolean})],e(this,null,o,{kind:`accessor`,name:`indeterminate`,static:!1,private:!1,access:{has:e=>`indeterminate`in e,get:e=>e.indeterminate,set:(e,t)=>{e.indeterminate=t}},metadata:t},c,u),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[i(m)]}#e;get indeterminate(){return this.#e}set indeterminate(e){this.#e=e}get group(){return this._group}constructor(){super(),this.#e=t(this,c,!1),this._group=(t(this,u),null),this.addController(new l(this,()=>this.closest(`sbb-checkbox-group`),[`disabled`,`required`,`size`].reduce((e,t)=>Object.assign(e,{[t]:()=>this.requestUpdate(t)}),{})))}connectedCallback(){super.connectedCallback(),this._group=this.closest(`sbb-checkbox-group`)}willUpdate(e){super.willUpdate(e),(e.has(`checked`)||e.has(`indeterminate`))&&(this.internals.ariaChecked=this.indeterminate?`mixed`:`${this.checked}`)}isDisabledExternally(){return this.group?.disabled??!1}isRequiredExternally(){return this.group?.required??!1}withUserInteraction(){this.indeterminate&&=!1}}})();let g=(()=>{let i=c(h(u(o))),s,l=[],d=[];return class extends i{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(i[Symbol.metadata]??null):void 0;s=[a()],e(this,null,s,{kind:`accessor`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,get:e=>e.value,set:(e,t)=>{e.value=t}},metadata:t},l,d),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-checkbox-panel`}static{this.elementDependencies=[p]}static{this.styles=[f]}#e=t(this,l,null);get value(){return this.#e}set value(e){this.#e=e}requestUpdate(e,t,n){super.requestUpdate(e,t,n),e===`checked`&&(this.internals.ariaChecked=`${this.checked}`,this.toggleState(`checked`,this.checked))}render(){return n`
3
3
  <span class="sbb-selection-panel">
4
4
  <div class="sbb-selection-panel__badge">
package/checkbox.pure.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,nothing as r,unsafeCSS as i}from"lit";import{property as a}from"lit/decorators.js";import{SbbElement as o,SbbFormAssociatedCheckboxMixin as s,SbbPropertyWatcherController as c,forceType as l,getOverride as u}from"./core.js";import{SbbIconNameMixin as d}from"./icon.pure.js";import{SbbVisualCheckboxElement as f}from"./visual-checkbox.pure.js";var p=`:host{display:inline-block;outline:none!important}:host([icon-placement=start]){--sbb-checkbox-label-icon-flex-direction:row-reverse;--sbb-checkbox-label-icon-justify-content:flex-end;--sbb-checkbox-label-icon-flex-grow:0}:host(:focus-visible) .sbb-checkbox-wrapper{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);border-radius:calc(var(--sbb-border-radius-4x) - var(--sbb-focus-outline-offset))}.sbb-checkbox__label{flex-direction:var(--sbb-checkbox-label-icon-flex-direction);justify-content:var(--sbb-checkbox-label-icon-justify-content);flex-grow:var(--sbb-checkbox-label-icon-flex-grow);gap:var(--sbb-checkbox-label-gap)}:host(:not(:is(:state(slotted),[state--slotted]),:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-checkbox__label{display:none}sbb-icon,slot[name=icon] ::slotted(sbb-icon){height:calc(1em * var(--sbb-typo-line-height-text));align-items:center;display:flex}
2
- `,m=`:host([size=xs]){--sbb-checkbox-font-size:var(--sbb-text-font-size-xs);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-xs)}:host([size=s]){--sbb-checkbox-font-size:var(--sbb-text-font-size-s);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-s)}:host([size=m]){--sbb-checkbox-font-size:var(--sbb-text-font-size-m);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-m)}:host(:disabled){--sbb-checkbox-cursor:var(--sbb-cursor-default);--sbb-checkbox-label-color:light-dark(var(--sbb-color-granite),var(--sbb-color-aluminium))}.sbb-checkbox-wrapper{display:flex}.sbb-checkbox-wrapper:before{content:"​";user-select:none;width:0;height:0}.sbb-checkbox{width:100%;cursor:var(--sbb-checkbox-cursor);user-select:none;-webkit-tap-highlight-color:transparent;font-size:var(--sbb-checkbox-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:block;position:relative}.sbb-checkbox__inner{align-items:start;gap:var(--sbb-spacing-fixed-2x);display:flex}.sbb-checkbox__label{color:var(--sbb-checkbox-label-color);line-height:max(1em * var(--sbb-typo-line-height-text), var(--sbb-checkbox-dimension));flex-grow:1;display:flex}.sbb-checkbox__aligner{height:calc(1em * var(--sbb-typo-line-height-text));align-items:center;display:flex}
2
+ `,m=`:host([size=xs]){--sbb-checkbox-font-size:var(--sbb-text-font-size-xs);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-xs)}:host([size=s]){--sbb-checkbox-font-size:var(--sbb-text-font-size-s);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-s)}:host([size=m]){--sbb-checkbox-font-size:var(--sbb-text-font-size-m);--sbb-checkbox-dimension:var(--sbb-checkbox-dimension-m)}:host(:disabled){--sbb-checkbox-cursor:var(--sbb-cursor-default);--sbb-checkbox-label-color:light-dark(var(--sbb-color-granite),var(--sbb-color-aluminium))}.sbb-checkbox-wrapper{display:flex}.sbb-checkbox-wrapper:before{content:"​";user-select:none;width:0;height:0}.sbb-checkbox{width:100%;cursor:var(--sbb-checkbox-cursor);user-select:none;-webkit-tap-highlight-color:transparent;font-size:var(--sbb-checkbox-font-size);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:block;position:relative}.sbb-checkbox__inner{align-items:start;gap:var(--sbb-spacing-fixed-2x);display:flex}.sbb-checkbox__label{color:var(--sbb-checkbox-label-color);line-height:max(1em * var(--sbb-typo-line-height-text), var(--sbb-checkbox-dimension));flex-grow:1;display:flex}.sbb-checkbox__aligner{height:calc(1em * var(--sbb-typo-line-height-text));align-items:center;display:flex}
3
3
  `;const h=n=>(()=>{let r=s(n),o,u=[],d=[];return class extends r{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;o=[l(),a({type:Boolean})],e(this,null,o,{kind:`accessor`,name:`indeterminate`,static:!1,private:!1,access:{has:e=>`indeterminate`in e,get:e=>e.indeterminate,set:(e,t)=>{e.indeterminate=t}},metadata:t},u,d),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.styles=[i(m)]}#e;get indeterminate(){return this.#e}set indeterminate(e){this.#e=e}get group(){return this._group}constructor(){super(),this.#e=t(this,u,!1),this._group=(t(this,d),null),this.addController(new c(this,()=>this.closest(`sbb-checkbox-group`),[`disabled`,`required`,`size`].reduce((e,t)=>Object.assign(e,{[t]:()=>this.requestUpdate(t)}),{})))}connectedCallback(){super.connectedCallback(),this._group=this.closest(`sbb-checkbox-group`)}willUpdate(e){super.willUpdate(e),(e.has(`checked`)||e.has(`indeterminate`))&&(this.internals.ariaChecked=this.indeterminate?`mixed`:`${this.checked}`)}isDisabledExternally(){return this.group?.disabled??!1}isRequiredExternally(){return this.group?.required??!1}withUserInteraction(){this.indeterminate&&=!1}}})();let g=(()=>{let s=d(h(o)),c,l=[],m=[],g,_=[],v=[],y,b=[],x=[];return class extends s{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(s[Symbol.metadata]??null):void 0;c=[a()],g=[a({reflect:!0}),u((e,t)=>e.group?.size??t)],y=[a({attribute:`icon-placement`,reflect:!0})],e(this,null,c,{kind:`accessor`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,get:e=>e.value,set:(e,t)=>{e.value=t}},metadata:t},l,m),e(this,null,g,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:t},_,v),e(this,null,y,{kind:`accessor`,name:`iconPlacement`,static:!1,private:!1,access:{has:e=>`iconPlacement`in e,get:e=>e.iconPlacement,set:(e,t)=>{e.iconPlacement=t}},metadata:t},b,x),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-checkbox`}static{this.elementDependencies=[f]}static{this.styles=[i(p)]}#e=t(this,l,null);get value(){return this.#e}set value(e){this.#e=e}#t=(t(this,m),t(this,_,null));get size(){return this.#t}set size(e){this.#t=e}#n=(t(this,v),t(this,b,`end`));get iconPlacement(){return this.#n}set iconPlacement(e){this.#n=e}render(){return n`
4
4
  <span class="sbb-checkbox-wrapper">
5
5
  <span class="sbb-checkbox">
@@ -1,4 +1,4 @@
1
- import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{SbbElement as a}from"./core.js";var o=`:host{height:var(--sbb-chip-label-fixed-height,calc(var(--sbb-typo-line-height-text) * var(--sbb-chip-label-font-size) + var(--sbb-chip-label-padding-block) * 2));background-color:var(--sbb-chip-label-background-color);padding-inline:var(--sbb-chip-label-padding-inline);border-radius:var(--sbb-border-radius-infinity);color:var(--sbb-chip-label-color);font-size:var(--sbb-chip-label-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);justify-content:center;align-items:center;display:inline-flex}@media (forced-colors:active){:host{outline:var(--sbb-border-width-1x) solid CanvasText;outline-offset:calc(-1 * var(--sbb-border-width-1x))}}:host([color=charcoal]){--sbb-chip-label-color:var(--sbb-color-2-inverted);--sbb-chip-label-background-color:var(--sbb-background-color-2-inverted)}:host([color=white]){--sbb-chip-label-color:light-dark(var(--sbb-color-granite),var(--sbb-color-cloud));--sbb-chip-label-background-color:var(--sbb-background-color-1)}:host([color=granite]){--sbb-chip-label-color:var(--sbb-color-2-inverted);--sbb-chip-label-background-color:light-dark(var(--sbb-color-granite),var(--sbb-color-storm))}:host([size=xxxs]){--sbb-chip-label-fixed-height:1rem}:host([size=xs]){--sbb-chip-label-padding-block:var(--sbb-spacing-fixed-1x);--sbb-chip-label-padding-inline:var(--sbb-spacing-fixed-3x);--sbb-chip-label-font-size:var(--sbb-text-font-size-xs)}:host([size=s]){--sbb-chip-label-padding-block:var(--sbb-spacing-fixed-1x);--sbb-chip-label-padding-inline:var(--sbb-spacing-fixed-4x);--sbb-chip-label-font-size:var(--sbb-text-font-size-s)}.sbb-chip__text-wrapper{white-space:nowrap;text-overflow:ellipsis;line-height:calc(var(--sbb-typo-line-height-text) * var(--sbb-chip-label-font-size));line-height:round(down, var(--sbb-typo-line-height-text) * var(--sbb-chip-label-font-size), 2px);display:inline-block;overflow:hidden}
1
+ import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{SbbElement as a}from"./core.js";var o=`:host{height:var(--sbb-chip-label-fixed-height,calc(var(--sbb-typo-line-height-text) * var(--sbb-chip-label-font-size) + var(--sbb-chip-label-padding-block) * 2));background-color:var(--sbb-chip-label-background-color);padding-inline:var(--sbb-chip-label-padding-inline);border-radius:var(--sbb-border-radius-infinity);color:var(--sbb-chip-label-color);font-size:var(--sbb-chip-label-font-size);letter-spacing:var(--sbb-letter-spacing-text);justify-content:center;align-items:center;display:inline-flex}@media (forced-colors:active){:host{outline:var(--sbb-border-width-1x) solid CanvasText;outline-offset:calc(-1 * var(--sbb-border-width-1x))}}:host([color=charcoal]){--sbb-chip-label-color:var(--sbb-color-2-inverted);--sbb-chip-label-background-color:var(--sbb-background-color-2-inverted)}:host([color=white]){--sbb-chip-label-color:light-dark(var(--sbb-color-granite),var(--sbb-color-cloud));--sbb-chip-label-background-color:var(--sbb-background-color-1)}:host([color=granite]){--sbb-chip-label-color:var(--sbb-color-2-inverted);--sbb-chip-label-background-color:light-dark(var(--sbb-color-granite),var(--sbb-color-storm))}:host([size=xxxs]){--sbb-chip-label-fixed-height:1rem}:host([size=xs]){--sbb-chip-label-padding-block:var(--sbb-spacing-fixed-1x);--sbb-chip-label-padding-inline:var(--sbb-spacing-fixed-3x);--sbb-chip-label-font-size:var(--sbb-text-font-size-xs)}:host([size=s]){--sbb-chip-label-padding-block:var(--sbb-spacing-fixed-1x);--sbb-chip-label-padding-inline:var(--sbb-spacing-fixed-4x);--sbb-chip-label-font-size:var(--sbb-text-font-size-s)}.sbb-chip__text-wrapper{white-space:nowrap;text-overflow:ellipsis;line-height:calc(var(--sbb-typo-line-height-text) * var(--sbb-chip-label-font-size));line-height:round(down, var(--sbb-typo-line-height-text) * var(--sbb-chip-label-font-size), 2px);display:inline-block;overflow:hidden}
2
2
  `;let s=(()=>{let s=a,c,l=[],u=[],d,f=[],p=[];return class extends s{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(s[Symbol.metadata]??null):void 0;c=[i({reflect:!0})],d=[i({reflect:!0})],e(this,null,c,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:t},l,u),e(this,null,d,{kind:`accessor`,name:`color`,static:!1,private:!1,access:{has:e=>`color`in e,get:e=>e.color,set:(e,t)=>{e.color=t}},metadata:t},f,p),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-chip-label`}static{this.styles=[r(o)]}#e=t(this,l,`xxs`);get size(){return this.#e}set size(e){this.#e=e}#t=(t(this,u),t(this,f,`milk`));get color(){return this.#t}set color(e){this.#t=e}render(){return n`
3
3
  <span class="sbb-chip__text-wrapper">
4
4
  <slot></slot>
package/chip.pure.js CHANGED
@@ -1,4 +1,4 @@
1
- import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,isServer as r,unsafeCSS as i}from"lit";import{property as a}from"lit/decorators.js";import{SbbDisabledMixin as o,SbbElement as s,SbbFormAssociatedMixin as c,SbbLanguageController as l,SbbNegativeMixin as u,SbbPropertyWatcherController as d,SbbReadonlyMixin as f,SbbRequiredMixin as p,forceType as m,getNextElementIndex as h,i18nChipDelete as g,i18nChipGroupInputDescription as _,i18nSelectionRequired as v,isArrowKeyPressed as y,screenReaderOnlyStyles as b}from"./core.js";import{SbbMiniButtonElement as x}from"./button.pure.js";var S=`:host{--sbb-chip-border:var(--sbb-border-width-1x) solid var(--sbb-chip-border-color);--sbb-chip-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));background-color:var(--sbb-chip-background-color);border-radius:var(--sbb-chip-border-radius);color:var(--sbb-chip-color);height:var(--sbb-chip-height);align-items:stretch;display:inline-flex}:host(:focus){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);--sbb-focus-outline-offset:-.0625rem;--sbb-focus-outline-style:initial}:host([negative]){--sbb-chip-border-color:var(--sbb-border-color-4-negative-inverted);--sbb-chip-background-color:var(--sbb-background-color-3-negative);--sbb-chip-color:var(--sbb-color-4-negative);--sbb-chip-color-hover:var(--sbb-color-2-negative);--sbb-chip-background-color-active:var(--sbb-background-color-1-negative);--sbb-chip-background-color-hover:var(--sbb-background-color-1-negative);--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark)}.sbb-chip__label-wrapper{border:var(--sbb-chip-border);border-radius:var(--sbb-chip-border-radius) 0 0 var(--sbb-chip-border-radius);padding-inline:var(--sbb-chip-label-padding-inline);border-inline-end:none;outline:none;align-items:center;display:flex;overflow:hidden}:host(:is([disabled],[readonly])) .sbb-chip__label-wrapper{border:var(--sbb-chip-border);border-radius:var(--sbb-chip-border-radius)}.sbb-chip__label{white-space:nowrap;text-overflow:ellipsis;font-size:var(--sbb-chip-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);transition:transform var(--sbb-chip-transition-duration) var(--sbb-animation-easing);display:inline-block;overflow:hidden}.sbb-chip__delete{--sbb-mini-button-border-radius:0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0;--sbb-mini-button-color-text:var(--sbb-chip-color);--sbb-mini-button-color-active-background:var(--sbb-chip-background-color-active);--sbb-mini-button-color-hover-background:var(--sbb-chip-background-color-hover);--sbb-icon-svg-width:calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);--sbb-icon-svg-height:calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);--_sbb-mini-button-image-size: ;border:var(--sbb-chip-border);border-radius:0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0}:host(:is([disabled],[readonly])) .sbb-chip__delete{display:none}@media (any-hover:hover){:host(:not([disabled])) .sbb-chip__delete:hover{--sbb-mini-button-color-text:var(--sbb-chip-color-hover)}}
1
+ import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,isServer as r,unsafeCSS as i}from"lit";import{property as a}from"lit/decorators.js";import{SbbDisabledMixin as o,SbbElement as s,SbbFormAssociatedMixin as c,SbbLanguageController as l,SbbNegativeMixin as u,SbbPropertyWatcherController as d,SbbReadonlyMixin as f,SbbRequiredMixin as p,forceType as m,getNextElementIndex as h,i18nChipDelete as g,i18nChipGroupInputDescription as _,i18nSelectionRequired as v,isArrowKeyPressed as y,screenReaderOnlyStyles as b}from"./core.js";import{SbbMiniButtonElement as x}from"./button.pure.js";var S=`:host{--sbb-chip-border:var(--sbb-border-width-1x) solid var(--sbb-chip-border-color);--sbb-chip-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));background-color:var(--sbb-chip-background-color);border-radius:var(--sbb-chip-border-radius);color:var(--sbb-chip-color);height:var(--sbb-chip-height);align-items:stretch;display:inline-flex}:host(:focus){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);--sbb-focus-outline-offset:-.0625rem;--sbb-focus-outline-style:initial}:host([negative]){--sbb-chip-border-color:var(--sbb-border-color-4-negative-inverted);--sbb-chip-background-color:var(--sbb-background-color-3-negative);--sbb-chip-color:var(--sbb-color-4-negative);--sbb-chip-color-hover:var(--sbb-color-2-negative);--sbb-chip-background-color-active:var(--sbb-background-color-1-negative);--sbb-chip-background-color-hover:var(--sbb-background-color-1-negative);--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark)}.sbb-chip__label-wrapper{border:var(--sbb-chip-border);border-radius:var(--sbb-chip-border-radius) 0 0 var(--sbb-chip-border-radius);padding-inline:var(--sbb-chip-label-padding-inline);border-inline-end:none;outline:none;align-items:center;display:flex;overflow:hidden}:host(:is([disabled],[readonly])) .sbb-chip__label-wrapper{border:var(--sbb-chip-border);border-radius:var(--sbb-chip-border-radius)}.sbb-chip__label{white-space:nowrap;text-overflow:ellipsis;font-size:var(--sbb-chip-font-size);letter-spacing:var(--sbb-letter-spacing-text);transition:transform var(--sbb-chip-transition-duration) var(--sbb-animation-easing);display:inline-block;overflow:hidden}.sbb-chip__delete{--sbb-mini-button-border-radius:0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0;--sbb-mini-button-color-text:var(--sbb-chip-color);--sbb-mini-button-color-active-background:var(--sbb-chip-background-color-active);--sbb-mini-button-color-hover-background:var(--sbb-chip-background-color-hover);--sbb-icon-svg-width:calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);--sbb-icon-svg-height:calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);--_sbb-mini-button-image-size: ;border:var(--sbb-chip-border);border-radius:0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0}:host(:is([disabled],[readonly])) .sbb-chip__delete{display:none}@media (any-hover:hover){:host(:not([disabled])) .sbb-chip__delete:hover{--sbb-mini-button-color-text:var(--sbb-chip-color-hover)}}
2
2
  `;let C=(()=>{let r=u(o(f(s))),c,d=[],p=[];return class extends r{constructor(){super(...arguments),this.#e=t(this,d,null),this._language=(t(this,p),new l(this))}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(r[Symbol.metadata]??null):void 0;c=[a()],e(this,null,c,{kind:`accessor`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,get:e=>e.value,set:(e,t)=>{e.value=t}},metadata:t},d,p),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-chip`}static{this.elementDependencies=[x]}static{this.role=`option`}static{this.styles=[b,i(S)]}static{this.events={requestdelete:`requestdelete`,delete:`delete`}}#e;get value(){return this.#e}set value(e){this.#e=e}willUpdate(e){super.willUpdate(e),e.has(`disabled`)&&(this.disabled?this.removeAttribute(`tabindex`):this.setAttribute(`tabindex`,`-1`))}firstUpdated(e){super.firstUpdated(e),setTimeout(()=>this._deleteButton().removeAttribute(`tabindex`))}_deleteButton(){return this.shadowRoot.querySelector(`sbb-mini-button`)}_handleDeleteButtonClick(){this.dispatchEvent(new Event(`requestdelete`,{bubbles:!0,composed:!0}))}dispatchDeleteEvent(){this.dispatchEvent(new Event(`delete`,{bubbles:!0,composed:!0}))}render(){return n`
3
3
  <div class="sbb-chip__label-wrapper">
4
4
  <span class="sbb-chip__label">
@@ -1,4 +1,5 @@
1
1
  $theme: 'standard' !default;
2
+ $font-face: 'SBB' !default;
2
3
 
3
4
  @use 'sass:meta';
4
5
  @use './_index' as sbb;
@@ -210,12 +211,19 @@ $theme: 'standard' !default;
210
211
 
211
212
  // end-auto-generated-scss-module-imports
212
213
 
213
- @include meta.load-css('./features/font-face');
214
+ @if $font-face == 'SBB' {
215
+ @include meta.load-css('./features/font-face');
216
+ }
214
217
  @include meta.load-css('./features/normalize');
215
218
 
216
219
  :root {
217
220
  @include sbb.core-base;
218
221
 
222
+ @if $font-face == 'SBB' {
223
+ --sbb-letter-spacing-heading: var(--sbb-typo-letter-spacing-heading);
224
+ --sbb-letter-spacing-text: var(--sbb-typo-letter-spacing-text);
225
+ }
226
+
219
227
  // start-auto-generated-scss-module-root
220
228
  @include sbb-css-tokens.base;
221
229
  @include action-group.base;
@@ -19,7 +19,7 @@
19
19
  padding-block-start: var(--sbb-spacing-fixed-4x);
20
20
  color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
21
21
  line-height: var(--sbb-typo-line-height-text);
22
- letter-spacing: var(--sbb-typo-letter-spacing-text);
22
+ letter-spacing: var(--sbb-letter-spacing-text);
23
23
  font-size: var(--sbb-text-font-size-xs);
24
24
  }
25
25
 
@@ -1,3 +1,4 @@
1
1
  @use './theme' with (
2
- $theme: 'lean-off-brand'
2
+ $theme: 'lean-off-brand',
3
+ $font-face: 'none'
3
4
  );
@@ -86,7 +86,7 @@
86
86
  }
87
87
  #{$selector} {
88
88
  line-height: var(--sbb-typo-line-height-text);
89
- letter-spacing: var(--sbb-typo-letter-spacing-text);
89
+ letter-spacing: var(--sbb-letter-spacing-text);
90
90
  font-size: var(--sbb-text-font-size-s);
91
91
  margin: 0;
92
92
  padding: 0;
@@ -236,7 +236,7 @@
236
236
  light-dark(var(--sbb-color-cement), var(--sbb-color-smoke));
237
237
  border-radius: 50%;
238
238
  line-height: var(--sbb-typo-line-height-text);
239
- letter-spacing: var(--sbb-typo-letter-spacing-text);
239
+ letter-spacing: var(--sbb-letter-spacing-text);
240
240
  font-size: var(--sbb-text-font-size-xxs);
241
241
  font-weight: bold;
242
242
  }
@@ -5,7 +5,7 @@
5
5
  @mixin heading-rules {
6
6
  font-family: var(--sbb-typo-font-family);
7
7
  font-weight: bold;
8
- letter-spacing: var(--sbb-typo-letter-spacing-heading);
8
+ letter-spacing: var(--sbb-letter-spacing-heading);
9
9
  line-height: var(--sbb-typo-line-height-heading);
10
10
  }
11
11
 
@@ -113,7 +113,7 @@
113
113
  font-family: var(--sbb-typo-font-family);
114
114
  font-weight: normal;
115
115
  line-height: var(--sbb-typo-line-height-text);
116
- letter-spacing: var(--sbb-typo-letter-spacing-text);
116
+ letter-spacing: var(--sbb-letter-spacing-text);
117
117
  font-size: var(--sbb-text-font-size);
118
118
  }
119
119
 
@@ -155,7 +155,7 @@
155
155
 
156
156
  @mixin legend {
157
157
  line-height: var(--sbb-typo-line-height-text);
158
- letter-spacing: var(--sbb-typo-letter-spacing-text);
158
+ letter-spacing: var(--sbb-letter-spacing-text);
159
159
  font-size: var(--sbb-text-font-size-xs);
160
160
  padding: 0;
161
161
  color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
@@ -1,3 +1,4 @@
1
1
  @use './theme' with (
2
- $theme: 'off-brand'
2
+ $theme: 'off-brand',
3
+ $font-face: 'none'
3
4
  );
@@ -1,6 +1,6 @@
1
1
  import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,isServer as r,nothing as i,unsafeCSS as a}from"lit";import{property as o,state as s}from"lit/decorators.js";import"lit/static-html.js";import{SbbButtonBaseElement as c,SbbLanguageController as l,SbbMediaMatcherController as u,SbbMediaQueryBreakpointLargeAndAbove as d,SbbNegativeMixin as f,SbbUpdateSchedulerMixin as p,defaultDateAdapter as m,forceType as h,i18nDateChangedTo as g,i18nNextDay as _,i18nPreviousDay as v,i18nSelectNextDay as y,i18nSelectPreviousDay as b,i18nShowCalendar as x,i18nToday as S,idReference as C,readConfig as w,screenReaderOnlyStyles as T}from"./core.js";import{SbbIconElement as E}from"./icon.pure.js";import{SbbDateInputElement as D}from"./date-input.pure.js";import{SbbCalendarElement as O}from"./calendar.pure.js";import{SbbPopoverBaseElement as k}from"./popover.pure.js";var A=`:host{--sbb-button-color-active-background:var(--sbb-background-color-1-inverted);--sbb-button-color-active-border:var(--sbb-border-color-1);--sbb-button-color-active-text:light-dark(var(--sbb-color-cloud),var(--sbb-color-anthracite));--sbb-button-color-default-background:var(--sbb-background-color-3-inverted);--sbb-button-color-default-border:var(--sbb-border-color-3);--sbb-button-color-default-text:var(--sbb-color-1-inverted);--sbb-button-color-hover-background:var(--sbb-background-color-3-inverted);--sbb-button-color-hover-border:var(--sbb-border-color-3);--sbb-button-color-hover-text:var(--sbb-color-3-inverted);--sbb-button-color-loading-border:light-dark(var(--sbb-color-iron),var(--sbb-color-silver));--sbb-button-shadow-1-color:light-dark(color-mix(in srgb, var(--sbb-color-platinum) 20%, transparent),color-mix(in srgb, var(--sbb-color-black) 30%, transparent));--sbb-button-shadow-2-color:light-dark(color-mix(in srgb, var(--sbb-color-cement) 20%, transparent),color-mix(in srgb, var(--sbb-color-black) 30%, transparent))}:host([negative]){--sbb-button-color-active-background:var(--sbb-background-color-1-negative-inverted);--sbb-button-color-active-border:var(--sbb-border-color-1-negative);--sbb-button-color-active-text:var(--sbb-color-anthracite);--sbb-button-color-default-background:var(--sbb-background-color-3-negative-inverted);--sbb-button-color-default-border:var(--sbb-border-color-3-negative);--sbb-button-color-default-text:var(--sbb-color-1-negative-inverted);--sbb-button-color-hover-background:var(--sbb-background-color-3-negative-inverted);--sbb-button-color-hover-border:var(--sbb-border-color-3-negative);--sbb-button-color-hover-text:var(--sbb-color-4-negative-inverted);--sbb-button-color-loading-border:var(--sbb-color-silver);--sbb-button-shadow-1-color:color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-button-shadow-2-color:color-mix(in srgb, var(--sbb-color-black) 30%, transparent)}:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]),[loading])){--sbb-button-box-shadow:var(--sbb-button-box-shadow-definition)}
2
2
  `,j=`:host{-webkit-tap-highlight-color:transparent;--sbb-mini-button-transition-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));--sbb-mini-button-color-background:var(--sbb-mini-button-color-default-background);--sbb-mini-button-color:var(--sbb-mini-button-color-text);height:fit-content;display:inline-block;outline:none!important}@media (forced-colors:active){:host{--sbb-mini-button-color-text:ButtonText!important;--sbb-mini-button-color-hover-background:Highlight!important;--sbb-mini-button-color-active-background:Highlight!important;--sbb-mini-button-color-disabled-background:Canvas!important;--sbb-mini-button-color-disabled-border:GrayText!important;--sbb-mini-button-color-disabled-text:GrayText!important}}:host([negative]){--sbb-mini-button-color-text:var(--sbb-color-3-negative);--sbb-mini-button-color-default-background:transparent;--sbb-mini-button-color-hover-background:var(--sbb-background-color-3-negative);--sbb-mini-button-color-active-background:var(--sbb-background-color-4-negative);--sbb-mini-button-color-disabled-background:var(--sbb-background-color-3-negative);--sbb-mini-button-color-disabled-border:var(--sbb-border-color-5);--sbb-mini-button-color-disabled-text:var(--sbb-color-5)}@media (any-hover:hover){:host(:is(:hover,:is(:state(force-hover),[state--force-hover])):not([disabled],:disabled,[disabled-interactive],:is(:state(disabled),[state--disabled]),:active,:is(:state(active),[state--active]))){--sbb-mini-button-translate-y-content-hover:-.0625rem;--sbb-mini-button-color-background:var(--sbb-mini-button-color-hover-background)}}:host(:is(:active,:is(:state(active),[state--active])):not([disabled],:disabled,[disabled-interactive],:is(:state(disabled),[state--disabled]))){--sbb-mini-button-color-background:var(--sbb-mini-button-color-active-background)}:host(:is([disabled],:disabled,[disabled-interactive],:is(:state(disabled),[state--disabled]))){--sbb-mini-button-color-background:var(--sbb-mini-button-color-disabled-background);--sbb-mini-button-border:var(--sbb-border-width-1x) dashed var(--sbb-mini-button-color-disabled-border);--sbb-mini-button-color:var(--sbb-mini-button-color-disabled-text);--sbb-mini-button-pointer-events:none;--sbb-mini-button-cursor:var(--sbb-cursor-default)}:host(:is(:state(focus-visible),[state--focus-visible])){--sbb-focus-outline-style:initial}.sbb-action-base{color:var(--sbb-mini-button-color);border-radius:var(--sbb-mini-button-border-radius);user-select:none;pointer-events:var(--sbb-mini-button-pointer-events,auto);cursor:var(--sbb-mini-button-cursor,var(--sbb-cursor-pointer));transition:color var(--sbb-mini-button-transition-duration) var(--sbb-mini-button-transition-easing-function);outline:none;text-decoration:none;display:flex;position:relative}.sbb-action-base:before{content:"";border-radius:var(--sbb-mini-button-border-radius);background-color:var(--sbb-mini-button-color-background);transition-duration:var(--sbb-mini-button-transition-duration);transition-timing-function:var(--sbb-mini-button-transition-easing-function);border:var(--sbb-mini-button-border);transition-property:inset,background-color;position:absolute;inset:0}.sbb-action-base:focus-visible:before,:host(:is(:is(:state(focus-visible),[state--focus-visible]),:focus-visible)) .sbb-action-base:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}::slotted(sbb-icon),sbb-icon{transition:translate var(--sbb-mini-button-transition-duration) var(--sbb-mini-button-transition-easing-function);translate:0 var(--sbb-mini-button-translate-y-content-hover,0);min-width:var(--_sbb-mini-button-image-size,var(--sbb-size-icon-ui-small));min-height:var(--_sbb-mini-button-image-size,var(--sbb-size-icon-ui-small));justify-content:center;align-items:center;display:flex}
3
- `,M=`:host{--sbb-mini-button-gap:.125rem;--sbb-mini-button-padding-inline:var(--sbb-spacing-fixed-2x);--sbb-mini-button-label-display:block;--sbb-mini-button-label-height:var(--sbb-size-icon-ui-small)}:host(:where(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name])):not(:is(:state(slotted),[state--slotted]))){--sbb-mini-button-padding-inline:0;--sbb-mini-button-label-display:none;--sbb-mini-button-label-height:unset}.sbb-action-base{height:var(--sbb-mini-button-label-height);gap:var(--sbb-mini-button-gap);padding-inline:var(--sbb-mini-button-padding-inline);justify-content:center;align-items:center}.sbb-mini-button__label{white-space:nowrap;text-overflow:ellipsis;font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:var(--sbb-mini-button-label-display);transition:translate var(--sbb-mini-button-transition-duration) var(--sbb-mini-button-transition-easing-function);translate:0 var(--sbb-mini-button-translate-y-content-hover,0);overflow:hidden}
3
+ `,M=`:host{--sbb-mini-button-gap:.125rem;--sbb-mini-button-padding-inline:var(--sbb-spacing-fixed-2x);--sbb-mini-button-label-display:block;--sbb-mini-button-label-height:var(--sbb-size-icon-ui-small)}:host(:where(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name])):not(:is(:state(slotted),[state--slotted]))){--sbb-mini-button-padding-inline:0;--sbb-mini-button-label-display:none;--sbb-mini-button-label-height:unset}.sbb-action-base{height:var(--sbb-mini-button-label-height);gap:var(--sbb-mini-button-gap);padding-inline:var(--sbb-mini-button-padding-inline);justify-content:center;align-items:center}.sbb-mini-button__label{white-space:nowrap;text-overflow:ellipsis;font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text);display:var(--sbb-mini-button-label-display);transition:translate var(--sbb-mini-button-transition-duration) var(--sbb-mini-button-transition-easing-function);translate:0 var(--sbb-mini-button-translate-y-content-hover,0);overflow:hidden}
4
4
  `;a(`:host{--sbb-button-color-active-background:var(--sbb-color-primary150);--sbb-button-color-active-border:var(--sbb-color-primary150);--sbb-button-color-active-text:var(--sbb-color-4-negative);--sbb-button-color-default-background:var(--sbb-color-primary);--sbb-button-color-default-border:var(--sbb-color-primary);--sbb-button-color-default-text:var(--sbb-color-1-negative);--sbb-button-color-hover-background:var(--sbb-color-primary125);--sbb-button-color-hover-border:var(--sbb-color-primary125);--sbb-button-color-hover-text:var(--sbb-color-3-negative);--sbb-button-color-loading-border:light-dark(color-mix(in srgb, var(--sbb-button-color-active-background) 50%, var(--sbb-button-color-default-text)),color-mix(in srgb, var(--sbb-button-color-active-background) 70%, var(--sbb-button-color-default-text)));--sbb-button-shadow-1-color:light-dark(color-mix(in srgb, var(--sbb-color-primary) 20%, transparent),color-mix(in srgb, var(--sbb-color-primary) 40%, transparent));--sbb-button-shadow-2-color:light-dark(color-mix(in srgb, var(--sbb-color-primary125) 20%, transparent),color-mix(in srgb, var(--sbb-color-primary125) 40%, transparent))}:host([negative]){--sbb-button-color-active-background:var(--sbb-color-primary150);--sbb-button-color-active-border:var(--sbb-color-primary150);--sbb-button-color-active-text:var(--sbb-color-4-negative);--sbb-button-color-default-background:var(--sbb-color-primary);--sbb-button-color-default-border:var(--sbb-color-primary);--sbb-button-color-default-text:var(--sbb-color-1-negative);--sbb-button-color-hover-background:var(--sbb-color-primary125);--sbb-button-color-hover-border:var(--sbb-color-primary125);--sbb-button-color-hover-text:var(--sbb-color-3-negative);--sbb-button-color-loading-border:color-mix(in srgb, var(--sbb-button-color-active-background) 70%, var(--sbb-button-color-default-text));--sbb-button-shadow-1-color:light-dark(color-mix(in srgb, var(--sbb-color-primary) 60%, transparent),color-mix(in srgb, var(--sbb-color-primary) 40%, transparent));--sbb-button-shadow-2-color:light-dark(color-mix(in srgb, var(--sbb-color-primary125) 60%, transparent),color-mix(in srgb, var(--sbb-color-primary125) 40%, transparent))}:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]),[loading])){--sbb-button-box-shadow:var(--sbb-button-box-shadow-definition)}
5
5
  `),a(`:host{--sbb-button-color-active-background:var(--sbb-background-color-3);--sbb-button-color-active-border:var(--sbb-border-color-4-inverted);--sbb-button-color-active-text:light-dark(var(--sbb-color-anthracite),var(--sbb-color-graphite));--sbb-button-color-default-background:var(--sbb-background-color-1);--sbb-button-color-default-border:var(--sbb-border-color-4-inverted);--sbb-button-color-default-text:var(--sbb-color-3);--sbb-button-color-hover-background:var(--sbb-background-color-1);--sbb-button-color-hover-border:var(--sbb-border-color-4-inverted);--sbb-button-color-hover-text:var(--sbb-color-4);--sbb-button-color-loading-border:var(--sbb-border-color-4-inverted);--sbb-button-shadow-1-color:light-dark(color-mix(in srgb, var(--sbb-color-platinum) 20%, transparent),color-mix(in srgb, var(--sbb-color-black) 30%, transparent));--sbb-button-shadow-2-color:light-dark(color-mix(in srgb, var(--sbb-color-cement) 20%, transparent),color-mix(in srgb, var(--sbb-color-black) 30%, transparent));--sbb-button-border-overlap-fix:0rem}:host([negative]){--sbb-button-color-active-background:var(--sbb-background-color-2-negative);--sbb-button-color-active-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-color-active-text:var(--sbb-color-graphite);--sbb-button-color-default-background:var(--sbb-background-color-1-negative);--sbb-button-color-default-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-color-default-text:var(--sbb-color-3-negative);--sbb-button-color-hover-background:var(--sbb-background-color-1-negative);--sbb-button-color-hover-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-color-hover-text:var(--sbb-color-4-negative);--sbb-button-color-loading-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-shadow-1-color:color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-button-shadow-2-color:color-mix(in srgb, var(--sbb-color-black) 30%, transparent)}:host(:not([disabled],:disabled,[disabled-interactive],:active,:is(:state(active),[state--active]))){--sbb-button-box-shadow:var(--sbb-button-box-shadow-definition)}
6
6
  `),a(A),a(`:host{--sbb-button-color-active-background:var(--sbb-background-color-4);--sbb-button-color-active-border:var(--sbb-border-color-4-inverted);--sbb-button-color-active-text:var(--sbb-color-1);--sbb-button-color-default-background:transparent;--sbb-button-color-default-border:transparent;--sbb-button-color-default-text:var(--sbb-color-1);--sbb-button-color-hover-background:var(--sbb-background-color-3);--sbb-button-color-hover-border:var(--sbb-border-color-3-inverted);--sbb-button-color-hover-text:var(--sbb-color-1);--sbb-button-color-loading-border:light-dark(var(--sbb-color-silver),var(--sbb-color-granite))}:host([negative]){--sbb-button-color-active-background:var(--sbb-background-color-4-negative);--sbb-button-color-active-border:var(--sbb-border-color-4-negative-inverted);--sbb-button-color-active-text:var(--sbb-color-1-negative);--sbb-button-color-default-background:transparent;--sbb-button-color-default-border:transparent;--sbb-button-color-default-text:var(--sbb-color-1-negative);--sbb-button-color-hover-background:var(--sbb-background-color-3-negative);--sbb-button-color-hover-border:var(--sbb-border-color-3-negative-inverted);--sbb-button-color-hover-text:var(--sbb-color-1-negative);--sbb-button-color-loading-border:var(--sbb-color-granite)}
@@ -188,7 +188,7 @@ let SbbAlertGroupElement = (() => {
188
188
 
189
189
  //#endregion
190
190
  //#region src/elements/alert/alert/alert.scss?inline
191
- var alert_default = ":host {\n --sbb-alert-animation-duration: var(\n --sbb-disable-animation-duration,\n var(--sbb-animation-duration-6x)\n );\n display: grid;\n grid-template-rows: 0fr;\n opacity: 0;\n border-radius: var(--sbb-alert-forced-color-border-radius);\n outline: var(--sbb-alert-outline);\n}\n\n:host(:is(:state(state-opening),[state--state-opening]):not([animation=open], [animation=all])) {\n --sbb-disable-animation-duration: 0s;\n}\n\n:host(:is(:state(state-closing),[state--state-closing]):not([animation=close], [animation=all])) {\n --sbb-disable-animation-duration: 0s;\n}\n\n:host([size=s]) {\n --sbb-alert-gap: var(--sbb-spacing-fixed-1x) var(--sbb-spacing-responsive-xxs);\n --sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxxs);\n}\n\n:host([size=m]) {\n --sbb-alert-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-responsive-xs);\n --sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxs);\n}\n\n:host([size=l]) {\n --sbb-alert-icon-size: var(--sbb-alert-icon-size-l);\n --sbb-alert-title-margin-block: 0 var(--sbb-spacing-fixed-1x);\n}\n\n:host(:not(:is(:state(dark),[state--dark]))) {\n --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);\n}\n\n:host(:is(:is(:state(state-opened),[state--state-opened]), :is(:state(state-closing),[state--state-closing]))) {\n grid-template-rows: 1fr;\n opacity: 1;\n}\n\n:host(:is(:state(state-opening),[state--state-opening])) {\n animation-name: open, open-opacity;\n animation-fill-mode: forwards;\n animation-duration: var(--sbb-alert-animation-duration);\n animation-timing-function: var(--sbb-alert-timing-function);\n animation-delay: 0s, var(--sbb-alert-animation-duration);\n}\n\n:host(:is(:state(state-closing),[state--state-closing])) {\n animation-name: close-opacity, close;\n animation-fill-mode: forwards;\n animation-duration: var(--sbb-alert-animation-duration);\n animation-timing-function: var(--sbb-alert-timing-function);\n animation-delay: 0s, var(--sbb-disable-animation-duration, var(--sbb-animation-duration-2x));\n}\n\n.sbb-alert__transition-wrapper {\n overflow: hidden;\n}\n\n.sbb-alert {\n display: grid;\n grid-template-columns: 1fr auto;\n align-items: center;\n gap: var(--sbb-alert-gap);\n min-width: fit-content;\n padding: var(--sbb-alert-padding);\n overflow: hidden;\n color: var(--sbb-alert-color);\n background-color: var(--sbb-alert-background-color);\n border-radius: var(--sbb-alert-border-radius);\n font-size: var(--sbb-alert-font-size);\n letter-spacing: var(--sbb-typo-letter-spacing-text);\n line-height: var(--sbb-typo-line-height-text);\n}\n@media (min-width: calc(37.5rem)) {\n .sbb-alert {\n grid-template-columns: auto 1fr auto;\n align-items: flex-start;\n }\n}\n\n.sbb-alert__icon {\n display: flex;\n align-items: start;\n padding-block: var(--sbb-spacing-fixed-1x);\n min-width: var(--sbb-alert-icon-size);\n --sbb-icon-svg-width: var(--sbb-alert-icon-size);\n --sbb-icon-svg-height: var(--sbb-alert-icon-size);\n}\n\n.sbb-alert__content {\n color-scheme: only light;\n order: 3;\n grid-column: 1/3;\n}\n@media (min-width: calc(37.5rem)) {\n .sbb-alert__content {\n order: initial;\n grid-column-start: initial;\n grid-column-end: initial;\n }\n}\n\n.sbb-alert__content-slot {\n display: inline;\n margin: 0;\n padding: 0;\n}\n\n.sbb-alert__close-button-wrapper {\n color-scheme: only light;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n height: 100%;\n}\n\n@media (min-width: calc(37.5rem)) {\n .sbb-alert__close-button {\n margin-inline-start: var(--sbb-alert-close-icon-margin);\n }\n}\n\n.sbb-alert__close-button-divider {\n display: var(--sbb-alert-close-button-divider-display, none);\n height: calc(100% - var(--sbb-spacing-fixed-1x) * 2);\n}\n\n@keyframes open {\n from {\n grid-template-rows: 0fr;\n }\n to {\n grid-template-rows: 1fr;\n }\n}\n@keyframes open-opacity {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n@keyframes close {\n from {\n grid-template-rows: 1fr;\n }\n to {\n grid-template-rows: 0fr;\n }\n}\n@keyframes close-opacity {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n::slotted(sbb-title) {\n margin-block: var(--sbb-alert-title-margin-block);\n}\n";
191
+ var alert_default = ":host {\n --sbb-alert-animation-duration: var(\n --sbb-disable-animation-duration,\n var(--sbb-animation-duration-6x)\n );\n display: grid;\n grid-template-rows: 0fr;\n opacity: 0;\n border-radius: var(--sbb-alert-forced-color-border-radius);\n outline: var(--sbb-alert-outline);\n}\n\n:host(:is(:state(state-opening),[state--state-opening]):not([animation=open], [animation=all])) {\n --sbb-disable-animation-duration: 0s;\n}\n\n:host(:is(:state(state-closing),[state--state-closing]):not([animation=close], [animation=all])) {\n --sbb-disable-animation-duration: 0s;\n}\n\n:host([size=s]) {\n --sbb-alert-gap: var(--sbb-spacing-fixed-1x) var(--sbb-spacing-responsive-xxs);\n --sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxxs);\n}\n\n:host([size=m]) {\n --sbb-alert-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-responsive-xs);\n --sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxs);\n}\n\n:host([size=l]) {\n --sbb-alert-icon-size: var(--sbb-alert-icon-size-l);\n --sbb-alert-title-margin-block: 0 var(--sbb-spacing-fixed-1x);\n}\n\n:host(:not(:is(:state(dark),[state--dark]))) {\n --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);\n}\n\n:host(:is(:is(:state(state-opened),[state--state-opened]), :is(:state(state-closing),[state--state-closing]))) {\n grid-template-rows: 1fr;\n opacity: 1;\n}\n\n:host(:is(:state(state-opening),[state--state-opening])) {\n animation-name: open, open-opacity;\n animation-fill-mode: forwards;\n animation-duration: var(--sbb-alert-animation-duration);\n animation-timing-function: var(--sbb-alert-timing-function);\n animation-delay: 0s, var(--sbb-alert-animation-duration);\n}\n\n:host(:is(:state(state-closing),[state--state-closing])) {\n animation-name: close-opacity, close;\n animation-fill-mode: forwards;\n animation-duration: var(--sbb-alert-animation-duration);\n animation-timing-function: var(--sbb-alert-timing-function);\n animation-delay: 0s, var(--sbb-disable-animation-duration, var(--sbb-animation-duration-2x));\n}\n\n.sbb-alert__transition-wrapper {\n overflow: hidden;\n}\n\n.sbb-alert {\n display: grid;\n grid-template-columns: 1fr auto;\n align-items: center;\n gap: var(--sbb-alert-gap);\n min-width: fit-content;\n padding: var(--sbb-alert-padding);\n overflow: hidden;\n color: var(--sbb-alert-color);\n background-color: var(--sbb-alert-background-color);\n border-radius: var(--sbb-alert-border-radius);\n font-size: var(--sbb-alert-font-size);\n letter-spacing: var(--sbb-letter-spacing-text);\n line-height: var(--sbb-typo-line-height-text);\n}\n@media (min-width: calc(37.5rem)) {\n .sbb-alert {\n grid-template-columns: auto 1fr auto;\n align-items: flex-start;\n }\n}\n\n.sbb-alert__icon {\n display: flex;\n align-items: start;\n padding-block: var(--sbb-spacing-fixed-1x);\n min-width: var(--sbb-alert-icon-size);\n --sbb-icon-svg-width: var(--sbb-alert-icon-size);\n --sbb-icon-svg-height: var(--sbb-alert-icon-size);\n}\n\n.sbb-alert__content {\n color-scheme: only light;\n order: 3;\n grid-column: 1/3;\n}\n@media (min-width: calc(37.5rem)) {\n .sbb-alert__content {\n order: initial;\n grid-column-start: initial;\n grid-column-end: initial;\n }\n}\n\n.sbb-alert__content-slot {\n display: inline;\n margin: 0;\n padding: 0;\n}\n\n.sbb-alert__close-button-wrapper {\n color-scheme: only light;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n height: 100%;\n}\n\n@media (min-width: calc(37.5rem)) {\n .sbb-alert__close-button {\n margin-inline-start: var(--sbb-alert-close-icon-margin);\n }\n}\n\n.sbb-alert__close-button-divider {\n display: var(--sbb-alert-close-button-divider-display, none);\n height: calc(100% - var(--sbb-spacing-fixed-1x) * 2);\n}\n\n@keyframes open {\n from {\n grid-template-rows: 0fr;\n }\n to {\n grid-template-rows: 1fr;\n }\n}\n@keyframes open-opacity {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n@keyframes close {\n from {\n grid-template-rows: 1fr;\n }\n to {\n grid-template-rows: 0fr;\n }\n}\n@keyframes close-opacity {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n::slotted(sbb-title) {\n margin-block: var(--sbb-alert-title-margin-block);\n}\n";
192
192
 
193
193
  //#endregion
194
194
  //#region src/elements/alert/alert/alert.component.ts
@@ -198,7 +198,7 @@ let SbbBreadcrumbGroupElement = (() => {
198
198
 
199
199
  //#endregion
200
200
  //#region src/elements/breadcrumb/breadcrumb/breadcrumb.scss?inline
201
- var breadcrumb_default = ":host {\n display: flex;\n}\n\n@media (any-hover: hover) {\n :host(:hover) {\n --sbb-breadcrumb-color: var(--sbb-breadcrumb-color-hover);\n }\n}\n:host(:is(:active, :is(:state(active),[state--active]))) {\n --sbb-breadcrumb-color: var(--sbb-breadcrumb-color-active);\n}\n\n.sbb-breadcrumb {\n --sbb-link-text-decoration-line: none;\n color: var(--sbb-link-color-normal);\n text-decoration-line: var(--sbb-link-text-decoration-line, underline);\n text-decoration-thickness: 0.0625rem;\n text-underline-offset: 0.3125em;\n}\n@media (forced-colors: active) {\n .sbb-breadcrumb {\n text-decoration: underline;\n }\n}\n.sbb-breadcrumb {\n display: flex;\n cursor: var(--sbb-cursor-pointer);\n gap: var(--sbb-breadcrumb-gap);\n color: var(--sbb-breadcrumb-color);\n align-items: center;\n overflow: hidden;\n outline: none;\n font-size: var(--sbb-breadcrumb-font-size);\n letter-spacing: var(--sbb-typo-letter-spacing-text);\n}\n.sbb-breadcrumb:focus-visible {\n outline-offset: var(--sbb-focus-outline-offset);\n outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);\n border-radius: var(--sbb-border-radius-2x);\n}\n\n.sbb-breadcrumb__label {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-breadcrumb__label {\n display: none;\n}\n\nslot[name=icon] .sbb-breadcrumb__icon,\nslot[name=icon] ::slotted(*) {\n flex-shrink: 0;\n}\n";
201
+ var breadcrumb_default = ":host {\n display: flex;\n}\n\n@media (any-hover: hover) {\n :host(:hover) {\n --sbb-breadcrumb-color: var(--sbb-breadcrumb-color-hover);\n }\n}\n:host(:is(:active, :is(:state(active),[state--active]))) {\n --sbb-breadcrumb-color: var(--sbb-breadcrumb-color-active);\n}\n\n.sbb-breadcrumb {\n --sbb-link-text-decoration-line: none;\n color: var(--sbb-link-color-normal);\n text-decoration-line: var(--sbb-link-text-decoration-line, underline);\n text-decoration-thickness: 0.0625rem;\n text-underline-offset: 0.3125em;\n}\n@media (forced-colors: active) {\n .sbb-breadcrumb {\n text-decoration: underline;\n }\n}\n.sbb-breadcrumb {\n display: flex;\n cursor: var(--sbb-cursor-pointer);\n gap: var(--sbb-breadcrumb-gap);\n color: var(--sbb-breadcrumb-color);\n align-items: center;\n overflow: hidden;\n outline: none;\n font-size: var(--sbb-breadcrumb-font-size);\n letter-spacing: var(--sbb-letter-spacing-text);\n}\n.sbb-breadcrumb:focus-visible {\n outline-offset: var(--sbb-focus-outline-offset);\n outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);\n border-radius: var(--sbb-border-radius-2x);\n}\n\n.sbb-breadcrumb__label {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-breadcrumb__label {\n display: none;\n}\n\nslot[name=icon] .sbb-breadcrumb__icon,\nslot[name=icon] ::slotted(*) {\n flex-shrink: 0;\n}\n";
202
202
 
203
203
  //#endregion
204
204
  //#region src/elements/breadcrumb/breadcrumb/breadcrumb.component.ts