@sbb-esta/lyne-elements-dev 4.9.0-dev.1775125493 → 4.9.0-dev.1775144212

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 (28) hide show
  1. package/core/base-elements/element.js +2 -1
  2. package/core/styles/core.scss +6 -14
  3. package/core.css +37 -9
  4. package/development/core/base-elements/element.d.ts.map +1 -1
  5. package/development/core/base-elements/element.js +6 -2
  6. package/development/teaser-product/common/teaser-product-common.js +1 -1
  7. package/development/teaser-product/common.js +1 -1
  8. package/development/teaser-product/teaser-product/teaser-product.component.js +1 -1
  9. package/development/teaser-product/teaser-product.js +1 -1
  10. package/development/teaser-product-common-DYX370pm.js +78 -0
  11. package/development/teaser-product.component-CSArA8bH.js +43 -0
  12. package/development/teaser-product.js +2 -2
  13. package/development/teaser-product.pure.js +2 -2
  14. package/off-brand-theme.css +37 -9
  15. package/package.json +2 -2
  16. package/safety-theme.css +37 -9
  17. package/standard-theme.css +37 -9
  18. package/teaser-product/common/teaser-product-common.js +1 -1
  19. package/teaser-product/common.js +1 -1
  20. package/teaser-product/teaser-product/teaser-product.component.js +1 -1
  21. package/teaser-product/teaser-product.js +1 -1
  22. package/teaser-product-common-Ct19HzVX.js +63 -0
  23. package/{teaser-product.component-IyBPFzdf.js → teaser-product.component-Csj9pAne.js} +1 -1
  24. package/teaser-product.js +2 -2
  25. package/teaser-product.pure.js +2 -2
  26. package/development/teaser-product-common-B_r7GkGw.js +0 -78
  27. package/development/teaser-product.component-DjAMYUmw.js +0 -43
  28. package/teaser-product-common-qTPSq_o7.js +0 -63
package/core/base-elements/element.js CHANGED
@@ -7,7 +7,8 @@ var r = class extends n(t(e)) {
7
7
  this._$sbbElement$ = !0;
8
8
  }
9
9
  static define(e = customElements) {
10
- e.get(this.elementName) || e.define(this.elementName, this);
10
+ if (!this.elementName) throw Error(`The static property "elementName" is not defined on ${this.name}. Please define it to register the custom element.`);
11
+ e.get(this.elementName) || (e.define(this.elementName, this), this.finalize());
11
12
  }
12
13
  addController(e) {
13
14
  super.addController(e), (this._controllers ??= /* @__PURE__ */ new Set()).add(e);
package/core/styles/core.scss CHANGED
@@ -239,6 +239,9 @@ $theme: 'standard' !default;
239
239
  @use '../../teaser/teaser.global' as teaser with (
240
240
  $theme: $theme
241
241
  );
242
+ @use '../../teaser-product/common/teaser-product-common.global' as teaser-product-common with (
243
+ $theme: $theme
244
+ );
242
245
  @use '../../visual-checkbox/visual-checkbox.global' as visual-checkbox with (
243
246
  $theme: $theme
244
247
  );
@@ -318,6 +321,7 @@ $theme: 'standard' !default;
318
321
  @include tab-label-common.base;
319
322
  @include tag.base;
320
323
  @include teaser.base;
324
+ @include teaser-product-common.base;
321
325
  @include visual-checkbox.base;
322
326
 
323
327
  @include a11y.if-forced-colors {
@@ -410,6 +414,7 @@ $theme: 'standard' !default;
410
414
  @include form-field.base-breakpoint-large;
411
415
  @include header.base-breakpoint-large;
412
416
  @include menu.base-breakpoint-large;
417
+ @include teaser-product-common.base-breakpoint-large;
413
418
 
414
419
  // TODO: Remove complete block when new lean theme is complete
415
420
  // Only render the block in standard theme as fallback for CSS class usage
@@ -450,6 +455,7 @@ $theme: 'standard' !default;
450
455
  @include sidebar-close-button.rules;
451
456
  @include sidebar-container.rules;
452
457
  @include tab-nav-bar.rules;
458
+ @include teaser-product-common.rules;
453
459
 
454
460
  // TODO: discuss where to add these classes
455
461
  .sbb-dark {
@@ -571,20 +577,6 @@ img {
571
577
  }
572
578
  }
573
579
 
574
- // TODO: Move back to the teaser components when the global CSS refactoring happens
575
- :is(sbb-teaser-product, sbb-teaser-product-static) {
576
- :is(sbb-image, img):not(.sbb-figure-overlap-image) {
577
- border-radius: 0; // Reset sbb-image border radius in order to control it from teaser product.
578
-
579
- --sbb-image-object-fit: cover;
580
- --sbb-image-aspect-ratio: 16 / 9;
581
- }
582
-
583
- img:not(.sbb-figure-overlap-image) {
584
- place-self: stretch;
585
- }
586
- }
587
-
588
580
  sbb-teaser :is(sbb-image, img):not(.sbb-figure-overlap-image) {
589
581
  --sbb-image-object-fit: cover;
590
582
  --sbb-image-aspect-ratio: 4 / 3;
package/core.css CHANGED
@@ -1743,6 +1743,28 @@ slot[name=error]::slotted(*) {
1743
1743
  --sbb-teaser-gap: var(--sbb-spacing-fixed-4x);
1744
1744
  --sbb-teaser-border-radius: var(--sbb-border-radius-4x);
1745
1745
  --sbb-teaser-image-width: 18.75rem;
1746
+ --sbb-teaser-product-background-color: var(--sbb-color-cloud);
1747
+ --sbb-teaser-product-background-color: light-dark(
1748
+ var(--sbb-color-cloud),
1749
+ var(--sbb-color-midnight)
1750
+ );
1751
+ --sbb-teaser-product-background-gradient-direction: to right;
1752
+ --sbb-teaser-product-border-radius: var(--sbb-border-radius-4x);
1753
+ --sbb-teaser-product-min-height: 37.5rem;
1754
+ --sbb-teaser-product-background-gradient-start: 25%;
1755
+ --sbb-teaser-product-background-gradient-end: 75%;
1756
+ --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-s);
1757
+ --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-s);
1758
+ --sbb-teaser-product-container-spacing: var(--sbb-spacing-responsive-l);
1759
+ --sbb-teaser-product-content-color: var(--sbb-color-4);
1760
+ --sbb-teaser-product-footer-color: var(--sbb-color-anthracite);
1761
+ --sbb-teaser-product-footer-color: light-dark(
1762
+ var(--sbb-color-anthracite),
1763
+ var(--sbb-color-cloud)
1764
+ );
1765
+ --sbb-teaser-product-footer-font-size: var(--sbb-text-font-size-xxs);
1766
+ --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-s);
1767
+ --sbb-teaser-product-footer-padding-block-end: 0;
1746
1768
  --sbb-visual-checkbox-dimension: var(--sbb-checkbox-dimension-m);
1747
1769
  --sbb-visual-checkbox-selection-color: var(--sbb-color-primary);
1748
1770
  --sbb-visual-checkbox-selection-color-negative: var(--sbb-color-primary85);
@@ -1908,6 +1930,12 @@ slot[name=error]::slotted(*) {
1908
1930
  --sbb-menu-max-width: 20rem;
1909
1931
  --sbb-menu-min-width: 11.25rem;
1910
1932
  --sbb-menu-transform-y: var(--sbb-spacing-fixed-2x);
1933
+ --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-l) 0;
1934
+ --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-xl);
1935
+ --sbb-teaser-product-content-align-content: center;
1936
+ --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-xs);
1937
+ --sbb-teaser-product-footer-padding-block-end: var(--sbb-spacing-responsive-xs);
1938
+ --sbb-teaser-product-footer-min-height: var(--sbb-teaser-product-container-spacing);
1911
1939
  }
1912
1940
  :root.sbb-lean {
1913
1941
  --sbb-title-font-size-level-6-lean: var(--sbb-typo-scale-0-875x);
@@ -2285,6 +2313,15 @@ sbb-tab-nav-bar .sbb-tab-amount {
2285
2313
  text-decoration: var(--sbb-tab-label-text-decoration);
2286
2314
  }
2287
2315
 
2316
+ :is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2317
+ border-radius: 0;
2318
+ --sbb-image-object-fit: cover;
2319
+ --sbb-image-aspect-ratio: 16 / 9;
2320
+ }
2321
+ :is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
2322
+ place-self: stretch;
2323
+ }
2324
+
2288
2325
  .sbb-dark {
2289
2326
  color-scheme: dark;
2290
2327
  }
@@ -2401,15 +2438,6 @@ img {
2401
2438
  transition: filter var(--sbb-teaser-image-animation-duration) var(--sbb-teaser-image-animation-easing);
2402
2439
  }
2403
2440
 
2404
- :is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2405
- border-radius: 0;
2406
- --sbb-image-object-fit: cover;
2407
- --sbb-image-aspect-ratio: 16 / 9;
2408
- }
2409
- :is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
2410
- place-self: stretch;
2411
- }
2412
-
2413
2441
  sbb-teaser :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2414
2442
  --sbb-image-object-fit: cover;
2415
2443
  --sbb-image-aspect-ratio: 4 / 3;
package/development/core/base-elements/element.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"element.d.ts","sourceRoot":"","sources":["../../../../../src/elements/core/base-elements/element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,mBAAmB,EAAE,KAAK,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAKpF,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,qBAAsB,SAAQ,kBAAkB;IAC/D,kBAAkB,CAAC,CACjB,IAAI,EAAE,WAAW,EACjB,MAAM,CAAC,EAAE,iBAAiB,EAC1B,OAAO,CAAC,EAAE,mBAAmB,GAC5B,IAAI,CAAC;CACT;;AAED;;GAEG;AAEH,qBAAa,UAAW,SAAQ,eAAuD;IACrF,OAAc,CAAC,eAAe,CAAC,UAAQ;IACvC,gBAAuB,WAAW,EAAE,MAAM,CAAC;IAE3C,OAAO,CAAC,YAAY,CAAC,CAA6B;IAElD;;;;;OAKG;WACW,MAAM,CAAC,qBAAqB,GAAE,qBAAsC,GAAG,IAAI;IAWzF;;;;;;;OAOG;IACa,aAAa,CAAC,UAAU,EAAE,qBAAqB,GAAG,IAAI;IAKtE;;OAEG;IACa,gBAAgB,CAAC,UAAU,EAAE,qBAAqB,GAAG,IAAI;IAKzE;;;;;;;;;;;;;;;;;;OAkBG;IACa,aAAa,CAC3B,IAAI,CAAC,EAAE,WAAW,EAClB,QAAQ,CAAC,EAAE,OAAO,EAClB,OAAO,CAAC,EAAE,mBAAmB,EAC7B,WAAW,CAAC,EAAE,OAAO,EACrB,QAAQ,CAAC,EAAE,OAAO,GACjB,IAAI;CAYR"}
1
+ {"version":3,"file":"element.d.ts","sourceRoot":"","sources":["../../../../../src/elements/core/base-elements/element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,mBAAmB,EAAE,KAAK,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAKpF,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,qBAAsB,SAAQ,kBAAkB;IAC/D,kBAAkB,CAAC,CACjB,IAAI,EAAE,WAAW,EACjB,MAAM,CAAC,EAAE,iBAAiB,EAC1B,OAAO,CAAC,EAAE,mBAAmB,GAC5B,IAAI,CAAC;CACT;;AAED;;GAEG;AAEH,qBAAa,UAAW,SAAQ,eAAuD;IACrF,OAAc,CAAC,eAAe,CAAC,UAAQ;IACvC,gBAAuB,WAAW,EAAE,MAAM,CAAC;IAE3C,OAAO,CAAC,YAAY,CAAC,CAA6B;IAElD;;;;;OAKG;WACW,MAAM,CAAC,qBAAqB,GAAE,qBAAsC,GAAG,IAAI;IAoBzF;;;;;;;OAOG;IACa,aAAa,CAAC,UAAU,EAAE,qBAAqB,GAAG,IAAI;IAKtE;;OAEG;IACa,gBAAgB,CAAC,UAAU,EAAE,qBAAqB,GAAG,IAAI;IAKzE;;;;;;;;;;;;;;;;;;OAkBG;IACa,aAAa,CAC3B,IAAI,CAAC,EAAE,WAAW,EAClB,QAAQ,CAAC,EAAE,OAAO,EAClB,OAAO,CAAC,EAAE,mBAAmB,EAC7B,WAAW,CAAC,EAAE,OAAO,EACrB,QAAQ,CAAC,EAAE,OAAO,GACjB,IAAI;CAYR"}
package/development/core/base-elements/element.js CHANGED
@@ -16,7 +16,11 @@ var SbbElement = class extends SbbHydrationMixin(SbbElementInternalsMixin(LitEle
16
16
  * Defaults to the global `customElements` instance.
17
17
  */
18
18
  static define(customElementRegistry = customElements) {
19
- if (!customElementRegistry.get(this.elementName)) customElementRegistry.define(this.elementName, this);
19
+ if (!this.elementName) throw new Error(`The static property "elementName" is not defined on ${this.name}. Please define it to register the custom element.`);
20
+ if (!customElementRegistry.get(this.elementName)) {
21
+ customElementRegistry.define(this.elementName, this);
22
+ this.finalize();
23
+ }
20
24
  }
21
25
  /**
22
26
  * Registers a `ReactiveController` to participate in the element's reactive
@@ -70,4 +74,4 @@ var SbbElement = class extends SbbHydrationMixin(SbbElementInternalsMixin(LitEle
70
74
  //#endregion
71
75
  export { SbbElement };
72
76
 
73
- //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWxlbWVudC5qcyIsIm5hbWVzIjpbXSwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9iYXNlLWVsZW1lbnRzL2VsZW1lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTGl0RWxlbWVudCwgdHlwZSBQcm9wZXJ0eURlY2xhcmF0aW9uLCB0eXBlIFJlYWN0aXZlQ29udHJvbGxlciB9IGZyb20gJ2xpdCc7XG5cbmltcG9ydCB7IFNiYkVsZW1lbnRJbnRlcm5hbHNNaXhpbiB9IGZyb20gJy4uL21peGlucy9lbGVtZW50LWludGVybmFscy1taXhpbi50cyc7XG5pbXBvcnQgeyBTYmJIeWRyYXRpb25NaXhpbiB9IGZyb20gJy4uL21peGlucy9oeWRyYXRpb24tbWl4aW4udHMnO1xuXG5leHBvcnQgaW50ZXJmYWNlIFNiYlByb3BlcnR5VmFsdWVzIHtcbiAgb2xkVmFsdWU/OiB1bmtub3duO1xuICB2YWx1ZT86IHVua25vd247XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgU2JiUmVhY3RpdmVDb250cm9sbGVyIGV4dGVuZHMgUmVhY3RpdmVDb250cm9sbGVyIHtcbiAgaG9zdFByb3BlcnR5VXBkYXRlPyhcbiAgICBuYW1lOiBQcm9wZXJ0eUtleSxcbiAgICB2YWx1ZXM/OiBTYmJQcm9wZXJ0eVZhbHVlcyxcbiAgICBvcHRpb25zPzogUHJvcGVydHlEZWNsYXJhdGlvbixcbiAgKTogdm9pZDtcbn1cblxuLyoqXG4gKiBBIGJhc2UgY2xhc3MgZm9yIGFsbCBTQkIgZWxlbWVudHMuXG4gKi9cbi8vIFRPRE8oYnJlYWtpbmctY2hhbmdlKTogSW5saW5lIGFuZCByZW1vdmUgU2JiRWxlbWVudEludGVybmFsc01peGluIGFuZCBTYmJIeWRyYXRpb25NaXhpbiBhcyBhIGJyZWFraW5nIGNoYW5nZVxuZXhwb3J0IGNsYXNzIFNiYkVsZW1lbnQgZXh0ZW5kcyBTYmJIeWRyYXRpb25NaXhpbihTYmJFbGVtZW50SW50ZXJuYWxzTWl4aW4oTGl0RWxlbWVudCkpIHtcbiAgcHVibGljIHN0YXRpYyBbJ18kc2JiRWxlbWVudCQnXSA9IHRydWU7XG4gIHB1YmxpYyBzdGF0aWMgcmVhZG9ubHkgZWxlbWVudE5hbWU6IHN0cmluZztcblxuICBwcml2YXRlIF9jb250cm9sbGVycz86IFNldDxTYmJSZWFjdGl2ZUNvbnRyb2xsZXI+O1xuXG4gIC8qKlxuICAgKiBSZWdpc3RlciB0aGUgY3VzdG9tIGVsZW1lbnQgdG8gdGhlIHNwZWNpZmllZCBDdXN0b21FbGVtZW50UmVnaXN0cnkuXG4gICAqIElmIG5vbmUgaXMgcHJvdmlkZWQsIGRlZmF1bHRzIHRvIHRoZSBnbG9iYWwgYGN1c3RvbUVsZW1lbnRzYCByZWdpc3RyeS5cbiAgICogQHBhcmFtIGN1c3RvbUVsZW1lbnRSZWdpc3RyeSBPcHRpb25hbCBDdXN0b21FbGVtZW50UmVnaXN0cnkgdG8gcmVnaXN0ZXIgdGhpcyBlbGVtZW50IHRvLlxuICAgKiAgIERlZmF1bHRzIHRvIHRoZSBnbG9iYWwgYGN1c3RvbUVsZW1lbnRzYCBpbnN0YW5jZS5cbiAgICovXG4gIHB1YmxpYyBzdGF0aWMgZGVmaW5lKGN1c3RvbUVsZW1lbnRSZWdpc3RyeTogQ3VzdG9tRWxlbWVudFJlZ2lzdHJ5ID0gY3VzdG9tRWxlbWVudHMpOiB2b2lkIHtcbiAgICBjb25zdCBlbGVtZW50Q2xhc3MgPSBjdXN0b21FbGVtZW50UmVnaXN0cnkuZ2V0KHRoaXMuZWxlbWVudE5hbWUpO1xuICAgIGlmICghZWxlbWVudENsYXNzKSB7XG4gICAgICBjdXN0b21FbGVtZW50UmVnaXN0cnkuZGVmaW5lKHRoaXMuZWxlbWVudE5hbWUsIHRoaXMgYXMgdW5rbm93biBhcyBDdXN0b21FbGVtZW50Q29uc3RydWN0b3IpO1xuICAgIH0gZWxzZSBpZiAoaW1wb3J0Lm1ldGEuZW52LkRFViAmJiBlbGVtZW50Q2xhc3MgIT09IHRoaXMpIHtcbiAgICAgIGNvbnNvbGUud2FybihcbiAgICAgICAgYFRoZSBjdXN0b20gZWxlbWVudCB3aXRoIG5hbWUgXCIke3RoaXMuZWxlbWVudE5hbWV9XCIgaXMgYWxyZWFkeSBkZWZpbmVkLiBTa2lwcGluZy5gLFxuICAgICAgKTtcbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogUmVnaXN0ZXJzIGEgYFJlYWN0aXZlQ29udHJvbGxlcmAgdG8gcGFydGljaXBhdGUgaW4gdGhlIGVsZW1lbnQncyByZWFjdGl2ZVxuICAgKiB1cGRhdGUgY3ljbGUuIFRoZSBlbGVtZW50IGF1dG9tYXRpY2FsbHkgY2FsbHMgaW50byBhbnkgcmVnaXN0ZXJlZFxuICAgKiBjb250cm9sbGVycyBkdXJpbmcgaXRzIGxpZmVjeWNsZSBjYWxsYmFja3MuXG4gICAqXG4gICAqIElmIHRoZSBlbGVtZW50IGlzIGNvbm5lY3RlZCB3aGVuIGBhZGRDb250cm9sbGVyKClgIGlzIGNhbGxlZCwgdGhlXG4gICAqIGNvbnRyb2xsZXIncyBgaG9zdENvbm5lY3RlZCgpYCBjYWxsYmFjayB3aWxsIGJlIGltbWVkaWF0ZWx5IGNhbGxlZC5cbiAgICovXG4gIHB1YmxpYyBvdmVycmlkZSBhZGRDb250cm9sbGVyKGNvbnRyb2xsZXI6IFNiYlJlYWN0aXZlQ29udHJvbGxlcik6IHZvaWQge1xuICAgIHN1cGVyLmFkZENvbnRyb2xsZXIoY29udHJvbGxlcik7XG4gICAgKHRoaXMuX2NvbnRyb2xsZXJzID8/PSBuZXcgU2V0KCkpLmFkZChjb250cm9sbGVyKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBSZW1vdmVzIGEgYFJlYWN0aXZlQ29udHJvbGxlcmAgZnJvbSB0aGUgZWxlbWVudC5cbiAgICovXG4gIHB1YmxpYyBvdmVycmlkZSByZW1vdmVDb250cm9sbGVyKGNvbnRyb2xsZXI6IFNiYlJlYWN0aXZlQ29udHJvbGxlcik6IHZvaWQge1xuICAgIHN1cGVyLnJlbW92ZUNvbnRyb2xsZXIoY29udHJvbGxlcik7XG4gICAgdGhpcy5fY29udHJvbGxlcnM/LmRlbGV0ZShjb250cm9sbGVyKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBSZXF1ZXN0cyBhbiB1cGRhdGUgd2hpY2ggaXMgcHJvY2Vzc2VkIGFzeW5jaHJvbm91c2x5LiBUaGlzIHNob3VsZCBiZSBjYWxsZWRcbiAgICogd2hlbiBhbiBlbGVtZW50IHNob3VsZCB1cGRhdGUgYmFzZWQgb24gc29tZSBzdGF0ZSBub3QgdHJpZ2dlcmVkIGJ5IHNldHRpbmdcbiAgICogYSByZWFjdGl2ZSBwcm9wZXJ0eS4gSW4gdGhpcyBjYXNlLCBwYXNzIG5vIGFyZ3VtZW50cy4gSXQgc2hvdWxkIGFsc28gYmVcbiAgICogY2FsbGVkIHdoZW4gbWFudWFsbHkgaW1wbGVtZW50aW5nIGEgcHJvcGVydHkgc2V0dGVyLiBJbiB0aGlzIGNhc2UsIHBhc3MgdGhlXG4gICAqIHByb3BlcnR5IGBuYW1lYCBhbmQgYG9sZFZhbHVlYCB0byBlbnN1cmUgdGhhdCBhbnkgY29uZmlndXJlZCBwcm9wZXJ0eVxuICAgKiBvcHRpb25zIGFyZSBob25vcmVkLlxuICAgKlxuICAgKiBAcGFyYW0gbmFtZSBuYW1lIG9mIHJlcXVlc3RpbmcgcHJvcGVydHlcbiAgICogQHBhcmFtIG9sZFZhbHVlIG9sZCB2YWx1ZSBvZiByZXF1ZXN0aW5nIHByb3BlcnR5XG4gICAqIEBwYXJhbSBvcHRpb25zIHByb3BlcnR5IG9wdGlvbnMgdG8gdXNlIGluc3RlYWQgb2YgdGhlIHByZXZpb3VzbHlcbiAgICogICAgIGNvbmZpZ3VyZWQgb3B0aW9uc1xuICAgKiBAcGFyYW0gdXNlTmV3VmFsdWUgaWYgdHJ1ZSwgdGhlIG5ld1ZhbHVlIGFyZ3VtZW50IGlzIHVzZWQgaW5zdGVhZCBvZlxuICAgKiAgICAgcmVhZGluZyB0aGUgcHJvcGVydHkgdmFsdWUuIFRoaXMgaXMgaW1wb3J0YW50IHRvIHVzZSBpZiB0aGUgcmVhY3RpdmVcbiAgICogICAgIHByb3BlcnR5IGlzIGEgc3RhbmRhcmQgcHJpdmF0ZSBhY2Nlc3NvciwgYXMgb3Bwb3NlZCB0byBhIHBsYWluXG4gICAqICAgICBwcm9wZXJ0eSwgc2luY2UgcHJpdmF0ZSBtZW1iZXJzIGNhbid0IGJlIGR5bmFtaWNhbGx5IHJlYWQgYnkgbmFtZS5cbiAgICogQHBhcmFtIG5ld1ZhbHVlIHRoZSBuZXcgdmFsdWUgb2YgdGhlIHByb3BlcnR5LiBUaGlzIGlzIG9ubHkgdXNlZCBpZlxuICAgKiAgICAgYHVzZU5ld1ZhbHVlYCBpcyB0cnVlLlxuICAgKi9cbiAgcHVibGljIG92ZXJyaWRlIHJlcXVlc3RVcGRhdGUoXG4gICAgbmFtZT86IFByb3BlcnR5S2V5LFxuICAgIG9sZFZhbHVlPzogdW5rbm93bixcbiAgICBvcHRpb25zPzogUHJvcGVydHlEZWNsYXJhdGlvbixcbiAgICB1c2VOZXdWYWx1ZT86IGJvb2xlYW4sXG4gICAgbmV3VmFsdWU/OiB1bmtub3duLFxuICApOiB2b2lkIHtcbiAgICBzdXBlci5yZXF1ZXN0VXBkYXRlKG5hbWUsIG9sZFZhbHVlLCBvcHRpb25zLCB1c2VOZXdWYWx1ZSwgbmV3VmFsdWUpO1xuICAgIGlmIChuYW1lKSB7XG4gICAgICBjb25zdCB2YWx1ZXM6IFNiYlByb3BlcnR5VmFsdWVzID0ge1xuICAgICAgICBvbGRWYWx1ZSxcbiAgICAgICAgdmFsdWU6IHVzZU5ld1ZhbHVlID8gbmV3VmFsdWUgOiB0aGlzW25hbWUgYXMga2V5b2YgdGhpc10sXG4gICAgICB9O1xuICAgICAgdGhpcy5fY29udHJvbGxlcnM/LmZvckVhY2goKGNvbnRyb2xsZXIpID0+XG4gICAgICAgIGNvbnRyb2xsZXIuaG9zdFByb3BlcnR5VXBkYXRlPy4obmFtZSwgdmFsdWVzLCBvcHRpb25zKSxcbiAgICAgICk7XG4gICAgfVxuICB9XG59XG4iXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFzQkEsSUFBYSxhQUFiLGNBQWdDLGtCQUFrQix5QkFBeUIsV0FBVyxDQUFDLENBQUE7O0FBQ3ZFLE9BQUMsbUJBQW1COzs7Ozs7OztDQVczQixPQUFPLE9BQU8sd0JBQStDLGdCQUFjO0FBRWhGLE1BQUksQ0FEaUIsc0JBQXNCLElBQUksS0FBSyxZQUFZLENBRTlELHVCQUFzQixPQUFPLEtBQUssYUFBYSxLQUE0Qzs7Ozs7Ozs7OztDQWdCL0UsY0FBYyxZQUFpQztBQUM3RCxRQUFNLGNBQWMsV0FBVztBQUMvQixHQUFDLEtBQUssaUNBQWlCLElBQUksS0FBSyxFQUFFLElBQUksV0FBVzs7Ozs7Q0FNbkMsaUJBQWlCLFlBQWlDO0FBQ2hFLFFBQU0saUJBQWlCLFdBQVc7QUFDbEMsT0FBSyxjQUFjLE9BQU8sV0FBVzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0NBc0J2QixjQUNkLE1BQ0EsVUFDQSxTQUNBLGFBQ0EsVUFBa0I7QUFFbEIsUUFBTSxjQUFjLE1BQU0sVUFBVSxTQUFTLGFBQWEsU0FBUztBQUNuRSxNQUFJLE1BQU07R0FDUixNQUFNLFNBQTRCO0lBQ2hDO0lBQ0EsT0FBTyxjQUFjLFdBQVcsS0FBSztJQUN0QztBQUNELFFBQUssY0FBYyxTQUFTLGVBQzFCLFdBQVcscUJBQXFCLE1BQU0sUUFBUSxRQUFRLENBQ3ZEIn0=
77
+ //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWxlbWVudC5qcyIsIm5hbWVzIjpbXSwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9iYXNlLWVsZW1lbnRzL2VsZW1lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTGl0RWxlbWVudCwgdHlwZSBQcm9wZXJ0eURlY2xhcmF0aW9uLCB0eXBlIFJlYWN0aXZlQ29udHJvbGxlciB9IGZyb20gJ2xpdCc7XG5cbmltcG9ydCB7IFNiYkVsZW1lbnRJbnRlcm5hbHNNaXhpbiB9IGZyb20gJy4uL21peGlucy9lbGVtZW50LWludGVybmFscy1taXhpbi50cyc7XG5pbXBvcnQgeyBTYmJIeWRyYXRpb25NaXhpbiB9IGZyb20gJy4uL21peGlucy9oeWRyYXRpb24tbWl4aW4udHMnO1xuXG5leHBvcnQgaW50ZXJmYWNlIFNiYlByb3BlcnR5VmFsdWVzIHtcbiAgb2xkVmFsdWU/OiB1bmtub3duO1xuICB2YWx1ZT86IHVua25vd247XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgU2JiUmVhY3RpdmVDb250cm9sbGVyIGV4dGVuZHMgUmVhY3RpdmVDb250cm9sbGVyIHtcbiAgaG9zdFByb3BlcnR5VXBkYXRlPyhcbiAgICBuYW1lOiBQcm9wZXJ0eUtleSxcbiAgICB2YWx1ZXM/OiBTYmJQcm9wZXJ0eVZhbHVlcyxcbiAgICBvcHRpb25zPzogUHJvcGVydHlEZWNsYXJhdGlvbixcbiAgKTogdm9pZDtcbn1cblxuLyoqXG4gKiBBIGJhc2UgY2xhc3MgZm9yIGFsbCBTQkIgZWxlbWVudHMuXG4gKi9cbi8vIFRPRE8oYnJlYWtpbmctY2hhbmdlKTogSW5saW5lIGFuZCByZW1vdmUgU2JiRWxlbWVudEludGVybmFsc01peGluIGFuZCBTYmJIeWRyYXRpb25NaXhpbiBhcyBhIGJyZWFraW5nIGNoYW5nZVxuZXhwb3J0IGNsYXNzIFNiYkVsZW1lbnQgZXh0ZW5kcyBTYmJIeWRyYXRpb25NaXhpbihTYmJFbGVtZW50SW50ZXJuYWxzTWl4aW4oTGl0RWxlbWVudCkpIHtcbiAgcHVibGljIHN0YXRpYyBbJ18kc2JiRWxlbWVudCQnXSA9IHRydWU7XG4gIHB1YmxpYyBzdGF0aWMgcmVhZG9ubHkgZWxlbWVudE5hbWU6IHN0cmluZztcblxuICBwcml2YXRlIF9jb250cm9sbGVycz86IFNldDxTYmJSZWFjdGl2ZUNvbnRyb2xsZXI+O1xuXG4gIC8qKlxuICAgKiBSZWdpc3RlciB0aGUgY3VzdG9tIGVsZW1lbnQgdG8gdGhlIHNwZWNpZmllZCBDdXN0b21FbGVtZW50UmVnaXN0cnkuXG4gICAqIElmIG5vbmUgaXMgcHJvdmlkZWQsIGRlZmF1bHRzIHRvIHRoZSBnbG9iYWwgYGN1c3RvbUVsZW1lbnRzYCByZWdpc3RyeS5cbiAgICogQHBhcmFtIGN1c3RvbUVsZW1lbnRSZWdpc3RyeSBPcHRpb25hbCBDdXN0b21FbGVtZW50UmVnaXN0cnkgdG8gcmVnaXN0ZXIgdGhpcyBlbGVtZW50IHRvLlxuICAgKiAgIERlZmF1bHRzIHRvIHRoZSBnbG9iYWwgYGN1c3RvbUVsZW1lbnRzYCBpbnN0YW5jZS5cbiAgICovXG4gIHB1YmxpYyBzdGF0aWMgZGVmaW5lKGN1c3RvbUVsZW1lbnRSZWdpc3RyeTogQ3VzdG9tRWxlbWVudFJlZ2lzdHJ5ID0gY3VzdG9tRWxlbWVudHMpOiB2b2lkIHtcbiAgICBpZiAoIXRoaXMuZWxlbWVudE5hbWUpIHtcbiAgICAgIHRocm93IG5ldyBFcnJvcihcbiAgICAgICAgYFRoZSBzdGF0aWMgcHJvcGVydHkgXCJlbGVtZW50TmFtZVwiIGlzIG5vdCBkZWZpbmVkIG9uICR7dGhpcy5uYW1lfS4gUGxlYXNlIGRlZmluZSBpdCB0byByZWdpc3RlciB0aGUgY3VzdG9tIGVsZW1lbnQuYCxcbiAgICAgICk7XG4gICAgfVxuXG4gICAgY29uc3QgZWxlbWVudENsYXNzID0gY3VzdG9tRWxlbWVudFJlZ2lzdHJ5LmdldCh0aGlzLmVsZW1lbnROYW1lKTtcbiAgICBpZiAoIWVsZW1lbnRDbGFzcykge1xuICAgICAgY3VzdG9tRWxlbWVudFJlZ2lzdHJ5LmRlZmluZSh0aGlzLmVsZW1lbnROYW1lLCB0aGlzIGFzIHVua25vd24gYXMgQ3VzdG9tRWxlbWVudENvbnN0cnVjdG9yKTtcbiAgICAgIC8vIE5leHQuanMgcmUtcmVuZGVyaW5nIHNvbWVob3cgZmFpbHMsIGJlY2F1c2UgdGhlIGZpbmFsaXphdGlvbiBjYWxjdWxhdGlvblxuICAgICAgLy8gaXMgYnJva2VuIGluIFNTUi4gV2UgY2FsbCBgZmluYWxpemUoKWAgaGVyZSBleHBsaWNpdGx5IHRvIGF2b2lkIHRoYXQuXG4gICAgICB0aGlzLmZpbmFsaXplKCk7XG4gICAgfSBlbHNlIGlmIChpbXBvcnQubWV0YS5lbnYuREVWICYmIGVsZW1lbnRDbGFzcyAhPT0gdGhpcykge1xuICAgICAgY29uc29sZS53YXJuKFxuICAgICAgICBgVGhlIGN1c3RvbSBlbGVtZW50IHdpdGggbmFtZSBcIiR7dGhpcy5lbGVtZW50TmFtZX1cIiBpcyBhbHJlYWR5IGRlZmluZWQuIFNraXBwaW5nLmAsXG4gICAgICApO1xuICAgIH1cbiAgfVxuXG4gIC8qKlxuICAgKiBSZWdpc3RlcnMgYSBgUmVhY3RpdmVDb250cm9sbGVyYCB0byBwYXJ0aWNpcGF0ZSBpbiB0aGUgZWxlbWVudCdzIHJlYWN0aXZlXG4gICAqIHVwZGF0ZSBjeWNsZS4gVGhlIGVsZW1lbnQgYXV0b21hdGljYWxseSBjYWxscyBpbnRvIGFueSByZWdpc3RlcmVkXG4gICAqIGNvbnRyb2xsZXJzIGR1cmluZyBpdHMgbGlmZWN5Y2xlIGNhbGxiYWNrcy5cbiAgICpcbiAgICogSWYgdGhlIGVsZW1lbnQgaXMgY29ubmVjdGVkIHdoZW4gYGFkZENvbnRyb2xsZXIoKWAgaXMgY2FsbGVkLCB0aGVcbiAgICogY29udHJvbGxlcidzIGBob3N0Q29ubmVjdGVkKClgIGNhbGxiYWNrIHdpbGwgYmUgaW1tZWRpYXRlbHkgY2FsbGVkLlxuICAgKi9cbiAgcHVibGljIG92ZXJyaWRlIGFkZENvbnRyb2xsZXIoY29udHJvbGxlcjogU2JiUmVhY3RpdmVDb250cm9sbGVyKTogdm9pZCB7XG4gICAgc3VwZXIuYWRkQ29udHJvbGxlcihjb250cm9sbGVyKTtcbiAgICAodGhpcy5fY29udHJvbGxlcnMgPz89IG5ldyBTZXQoKSkuYWRkKGNvbnRyb2xsZXIpO1xuICB9XG5cbiAgLyoqXG4gICAqIFJlbW92ZXMgYSBgUmVhY3RpdmVDb250cm9sbGVyYCBmcm9tIHRoZSBlbGVtZW50LlxuICAgKi9cbiAgcHVibGljIG92ZXJyaWRlIHJlbW92ZUNvbnRyb2xsZXIoY29udHJvbGxlcjogU2JiUmVhY3RpdmVDb250cm9sbGVyKTogdm9pZCB7XG4gICAgc3VwZXIucmVtb3ZlQ29udHJvbGxlcihjb250cm9sbGVyKTtcbiAgICB0aGlzLl9jb250cm9sbGVycz8uZGVsZXRlKGNvbnRyb2xsZXIpO1xuICB9XG5cbiAgLyoqXG4gICAqIFJlcXVlc3RzIGFuIHVwZGF0ZSB3aGljaCBpcyBwcm9jZXNzZWQgYXN5bmNocm9ub3VzbHkuIFRoaXMgc2hvdWxkIGJlIGNhbGxlZFxuICAgKiB3aGVuIGFuIGVsZW1lbnQgc2hvdWxkIHVwZGF0ZSBiYXNlZCBvbiBzb21lIHN0YXRlIG5vdCB0cmlnZ2VyZWQgYnkgc2V0dGluZ1xuICAgKiBhIHJlYWN0aXZlIHByb3BlcnR5LiBJbiB0aGlzIGNhc2UsIHBhc3Mgbm8gYXJndW1lbnRzLiBJdCBzaG91bGQgYWxzbyBiZVxuICAgKiBjYWxsZWQgd2hlbiBtYW51YWxseSBpbXBsZW1lbnRpbmcgYSBwcm9wZXJ0eSBzZXR0ZXIuIEluIHRoaXMgY2FzZSwgcGFzcyB0aGVcbiAgICogcHJvcGVydHkgYG5hbWVgIGFuZCBgb2xkVmFsdWVgIHRvIGVuc3VyZSB0aGF0IGFueSBjb25maWd1cmVkIHByb3BlcnR5XG4gICAqIG9wdGlvbnMgYXJlIGhvbm9yZWQuXG4gICAqXG4gICAqIEBwYXJhbSBuYW1lIG5hbWUgb2YgcmVxdWVzdGluZyBwcm9wZXJ0eVxuICAgKiBAcGFyYW0gb2xkVmFsdWUgb2xkIHZhbHVlIG9mIHJlcXVlc3RpbmcgcHJvcGVydHlcbiAgICogQHBhcmFtIG9wdGlvbnMgcHJvcGVydHkgb3B0aW9ucyB0byB1c2UgaW5zdGVhZCBvZiB0aGUgcHJldmlvdXNseVxuICAgKiAgICAgY29uZmlndXJlZCBvcHRpb25zXG4gICAqIEBwYXJhbSB1c2VOZXdWYWx1ZSBpZiB0cnVlLCB0aGUgbmV3VmFsdWUgYXJndW1lbnQgaXMgdXNlZCBpbnN0ZWFkIG9mXG4gICAqICAgICByZWFkaW5nIHRoZSBwcm9wZXJ0eSB2YWx1ZS4gVGhpcyBpcyBpbXBvcnRhbnQgdG8gdXNlIGlmIHRoZSByZWFjdGl2ZVxuICAgKiAgICAgcHJvcGVydHkgaXMgYSBzdGFuZGFyZCBwcml2YXRlIGFjY2Vzc29yLCBhcyBvcHBvc2VkIHRvIGEgcGxhaW5cbiAgICogICAgIHByb3BlcnR5LCBzaW5jZSBwcml2YXRlIG1lbWJlcnMgY2FuJ3QgYmUgZHluYW1pY2FsbHkgcmVhZCBieSBuYW1lLlxuICAgKiBAcGFyYW0gbmV3VmFsdWUgdGhlIG5ldyB2YWx1ZSBvZiB0aGUgcHJvcGVydHkuIFRoaXMgaXMgb25seSB1c2VkIGlmXG4gICAqICAgICBgdXNlTmV3VmFsdWVgIGlzIHRydWUuXG4gICAqL1xuICBwdWJsaWMgb3ZlcnJpZGUgcmVxdWVzdFVwZGF0ZShcbiAgICBuYW1lPzogUHJvcGVydHlLZXksXG4gICAgb2xkVmFsdWU/OiB1bmtub3duLFxuICAgIG9wdGlvbnM/OiBQcm9wZXJ0eURlY2xhcmF0aW9uLFxuICAgIHVzZU5ld1ZhbHVlPzogYm9vbGVhbixcbiAgICBuZXdWYWx1ZT86IHVua25vd24sXG4gICk6IHZvaWQge1xuICAgIHN1cGVyLnJlcXVlc3RVcGRhdGUobmFtZSwgb2xkVmFsdWUsIG9wdGlvbnMsIHVzZU5ld1ZhbHVlLCBuZXdWYWx1ZSk7XG4gICAgaWYgKG5hbWUpIHtcbiAgICAgIGNvbnN0IHZhbHVlczogU2JiUHJvcGVydHlWYWx1ZXMgPSB7XG4gICAgICAgIG9sZFZhbHVlLFxuICAgICAgICB2YWx1ZTogdXNlTmV3VmFsdWUgPyBuZXdWYWx1ZSA6IHRoaXNbbmFtZSBhcyBrZXlvZiB0aGlzXSxcbiAgICAgIH07XG4gICAgICB0aGlzLl9jb250cm9sbGVycz8uZm9yRWFjaCgoY29udHJvbGxlcikgPT5cbiAgICAgICAgY29udHJvbGxlci5ob3N0UHJvcGVydHlVcGRhdGU/LihuYW1lLCB2YWx1ZXMsIG9wdGlvbnMpLFxuICAgICAgKTtcbiAgICB9XG4gIH1cbn1cbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQXNCQSxJQUFhLGFBQWIsY0FBZ0Msa0JBQWtCLHlCQUF5QixXQUFXLENBQUMsQ0FBQTs7QUFDdkUsT0FBQyxtQkFBbUI7Ozs7Ozs7O0NBVzNCLE9BQU8sT0FBTyx3QkFBK0MsZ0JBQWM7QUFDaEYsTUFBSSxDQUFDLEtBQUssWUFDUixPQUFNLElBQUksTUFDUix1REFBdUQsS0FBSyxLQUFJLG9EQUNqRTtBQUlILE1BQUksQ0FEaUIsc0JBQXNCLElBQUksS0FBSyxZQUFZLEVBQzdDO0FBQ2pCLHlCQUFzQixPQUFPLEtBQUssYUFBYSxLQUE0QztBQUczRixRQUFLLFVBQVU7Ozs7Ozs7Ozs7O0NBZ0JILGNBQWMsWUFBaUM7QUFDN0QsUUFBTSxjQUFjLFdBQVc7QUFDL0IsR0FBQyxLQUFLLGlDQUFpQixJQUFJLEtBQUssRUFBRSxJQUFJLFdBQVc7Ozs7O0NBTW5DLGlCQUFpQixZQUFpQztBQUNoRSxRQUFNLGlCQUFpQixXQUFXO0FBQ2xDLE9BQUssY0FBYyxPQUFPLFdBQVc7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztDQXNCdkIsY0FDZCxNQUNBLFVBQ0EsU0FDQSxhQUNBLFVBQWtCO0FBRWxCLFFBQU0sY0FBYyxNQUFNLFVBQVUsU0FBUyxhQUFhLFNBQVM7QUFDbkUsTUFBSSxNQUFNO0dBQ1IsTUFBTSxTQUE0QjtJQUNoQztJQUNBLE9BQU8sY0FBYyxXQUFXLEtBQUs7SUFDdEM7QUFDRCxRQUFLLGNBQWMsU0FBUyxlQUMxQixXQUFXLHFCQUFxQixNQUFNLFFBQVEsUUFBUSxDQUN2RCJ9
package/development/teaser-product/common/teaser-product-common.js CHANGED
@@ -1,2 +1,2 @@
1
- import { n as teaserProductCommonStyle, t as SbbTeaserProductCommonElementMixin } from "../../teaser-product-common-B_r7GkGw.js";
1
+ import { n as teaserProductCommonStyle, t as SbbTeaserProductCommonElementMixin } from "../../teaser-product-common-DYX370pm.js";
2
2
  export { SbbTeaserProductCommonElementMixin, teaserProductCommonStyle };
package/development/teaser-product/common.js CHANGED
@@ -1,4 +1,4 @@
1
- import { n as teaserProductCommonStyle, t as SbbTeaserProductCommonElementMixin } from "../teaser-product-common-B_r7GkGw.js";
1
+ import { n as teaserProductCommonStyle, t as SbbTeaserProductCommonElementMixin } from "../teaser-product-common-DYX370pm.js";
2
2
  //#region src/elements/teaser-product/common.ts
3
3
  console.warn(`The entrypoint '@sbb-esta/elements/teaser-product/common.js' has been deprecated.
4
4
  Use either '@sbb-esta/elements/teaser-product.js' or '@sbb-esta/elements/teaser-product.pure.js' instead.`);
package/development/teaser-product/teaser-product/teaser-product.component.js CHANGED
@@ -1,2 +1,2 @@
1
- import { t as SbbTeaserProductElement } from "../../teaser-product.component-DjAMYUmw.js";
1
+ import { t as SbbTeaserProductElement } from "../../teaser-product.component-CSArA8bH.js";
2
2
  export { SbbTeaserProductElement };
package/development/teaser-product/teaser-product.js CHANGED
@@ -1,4 +1,4 @@
1
- import { t as SbbTeaserProductElement } from "../teaser-product.component-DjAMYUmw.js";
1
+ import { t as SbbTeaserProductElement } from "../teaser-product.component-CSArA8bH.js";
2
2
  //#region src/elements/teaser-product/teaser-product.ts
3
3
  /** @entrypoint */
4
4
  SbbTeaserProductElement.define();
package/development/teaser-product-common-DYX370pm.js ADDED
@@ -0,0 +1,78 @@
1
+ import { __esDecorate, __runInitializers } from "tslib";
2
+ import { html, unsafeCSS } from "lit";
3
+ import { property } from "lit/decorators.js";
4
+ import { SbbNegativeMixin } from "./core/mixins.js";
5
+ //#endregion
6
+ //#region src/elements/teaser-product/common/teaser-product-common.ts
7
+ var teaserProductCommonStyle = unsafeCSS(":host {\n --sbb-teaser-product-background: var(--sbb-teaser-product-background-color);\n display: block;\n}\n@media (min-width: calc(64rem)) {\n :host {\n --sbb-teaser-product-content-min-height: calc(\n var(--sbb-teaser-product-min-height) - 2 * var(--sbb-teaser-product-container-spacing)\n );\n --sbb-teaser-product-background: linear-gradient(\n var(--sbb-teaser-product-background-gradient-direction),\n var(--sbb-teaser-product-background-color) var(--sbb-teaser-product-background-gradient-start),\n transparent var(--sbb-teaser-product-background-gradient-end)\n );\n }\n}\n\n:host([negative]) {\n --sbb-teaser-product-background-color: var(--sbb-background-color-1-negative);\n --sbb-teaser-product-content-color: var(--sbb-color-4-negative);\n --sbb-teaser-product-footer-color: var(--sbb-color-4-negative);\n --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);\n --sbb-title-text-color-normal-override: var(--sbb-color-3-negative);\n}\n\n:host([image-alignment=before]) {\n --sbb-teaser-product-background-gradient-direction: to left;\n}\n\n:host(:not(:is(:state(slotted-footnote),[state--slotted-footnote]))) {\n --sbb-teaser-product-footer-padding-block-start: 0;\n}\n\n.sbb-teaser-product__image-container {\n overflow: hidden;\n border-radius: var(--sbb-teaser-product-border-radius) var(--sbb-teaser-product-border-radius) 0 0;\n}\n@media (min-width: calc(64rem)) {\n .sbb-teaser-product__image-container {\n position: absolute;\n inset: 0;\n border-radius: var(--sbb-teaser-product-border-radius);\n }\n}\n\n::slotted(p.sbb-teaser-product--spacing) {\n margin: 0;\n}\n\n::slotted(sbb-title.sbb-teaser-product--spacing) {\n margin-block-start: 0;\n}\n\n::slotted(:is(sbb-action-group, :is(:state(action),[state--action])).sbb-teaser-product--spacing) {\n margin-block-start: var(--sbb-spacing-responsive-xxs);\n}\n\n::slotted([slot=image]) {\n display: flex;\n width: 100%;\n height: 100%;\n}\n\n@media (forced-colors: active) {\n .sbb-teaser-product__root::after {\n content: \"\";\n position: absolute;\n display: block;\n inset: 0;\n pointer-events: none;\n border: var(--sbb-border-width-2x) solid CanvasText;\n border-radius: var(--sbb-teaser-product-border-radius);\n }\n}\n\n.sbb-action-base {\n display: block;\n position: relative;\n text-decoration: none;\n}\n\n.sbb-teaser-product__container {\n background: var(--sbb-teaser-product-background);\n border-radius: 0 0 var(--sbb-teaser-product-border-radius) var(--sbb-teaser-product-border-radius);\n padding-block: var(--sbb-teaser-product-container-padding-block);\n padding-inline: var(--sbb-teaser-product-container-padding-inline);\n}\n@media (min-width: calc(64rem)) {\n .sbb-teaser-product__container {\n display: grid;\n grid: \"content .\" 1fr \"footnote .\" auto/1fr 1fr;\n column-gap: var(--sbb-spacing-responsive-xxl);\n border-radius: var(--sbb-teaser-product-border-radius);\n position: relative;\n }\n :host([image-alignment=before]) .sbb-teaser-product__container {\n grid-template-areas: \". content\" \". footnote\";\n }\n}\n\n.sbb-teaser-product__content {\n grid-area: content;\n align-self: center;\n margin: 0;\n color: var(--sbb-teaser-product-content-color);\n min-height: var(--sbb-teaser-product-content-min-height, 0);\n align-content: var(--sbb-teaser-product-content-align-content, normal);\n}\n\n.sbb-teaser-product__footnote {\n grid-area: footnote;\n padding-block: var(--sbb-teaser-product-footer-padding-block-start) var(--sbb-teaser-product-footer-padding-block-end);\n color: var(--sbb-teaser-product-footer-color);\n font-size: var(--sbb-teaser-product-footer-font-size);\n letter-spacing: var(--sbb-typo-letter-spacing-text);\n min-height: var(--sbb-teaser-product-footer-min-height, 0);\n}");
8
+ var SbbTeaserProductCommonElementMixin = (superClass) => {
9
+ return (() => {
10
+ let _classSuper = SbbNegativeMixin(superClass);
11
+ let _imageAlignment_decorators;
12
+ let _imageAlignment_initializers = [];
13
+ let _imageAlignment_extraInitializers = [];
14
+ return class SbbTeaserProductCommonElement extends _classSuper {
15
+ static {
16
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
17
+ _imageAlignment_decorators = [property({
18
+ attribute: "image-alignment",
19
+ reflect: true
20
+ })];
21
+ __esDecorate(this, null, _imageAlignment_decorators, {
22
+ kind: "accessor",
23
+ name: "imageAlignment",
24
+ static: false,
25
+ private: false,
26
+ access: {
27
+ has: (obj) => "imageAlignment" in obj,
28
+ get: (obj) => obj.imageAlignment,
29
+ set: (obj, value) => {
30
+ obj.imageAlignment = value;
31
+ }
32
+ },
33
+ metadata: _metadata
34
+ }, _imageAlignment_initializers, _imageAlignment_extraInitializers);
35
+ if (_metadata) Object.defineProperty(this, Symbol.metadata, {
36
+ enumerable: true,
37
+ configurable: true,
38
+ writable: true,
39
+ value: _metadata
40
+ });
41
+ }
42
+ #imageAlignment_accessor_storage = __runInitializers(this, _imageAlignment_initializers, "after");
43
+ /**
44
+ * Whether the fully visible part of the image is aligned 'before' or 'after' the content.
45
+ * Only relevant starting from large breakpoint.
46
+ */
47
+ get imageAlignment() {
48
+ return this.#imageAlignment_accessor_storage;
49
+ }
50
+ set imageAlignment(value) {
51
+ this.#imageAlignment_accessor_storage = value;
52
+ }
53
+ renderTemplate() {
54
+ return html`
55
+ <div class="sbb-teaser-product__root">
56
+ <div class="sbb-teaser-product__image-container"><slot name="image"></slot></div>
57
+ <div class="sbb-teaser-product__container">
58
+ <span class="sbb-teaser-product__content">
59
+ <slot></slot>
60
+ </span>
61
+ <div class="sbb-teaser-product__footnote">
62
+ <slot name="footnote"></slot>
63
+ </div>
64
+ </div>
65
+ </div>
66
+ `;
67
+ }
68
+ constructor() {
69
+ super(...arguments);
70
+ __runInitializers(this, _imageAlignment_extraInitializers);
71
+ }
72
+ };
73
+ })();
74
+ };
75
+ //#endregion
76
+ export { teaserProductCommonStyle as n, SbbTeaserProductCommonElementMixin as t };
77
+
78
+ //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGVhc2VyLXByb2R1Y3QtY29tbW9uLURZWDM3MHBtLmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy90ZWFzZXItcHJvZHVjdC9jb21tb24vdGVhc2VyLXByb2R1Y3QtY29tbW9uLnNjc3M/aW5saW5lIiwiLi4vLi4vLi4vc3JjL2VsZW1lbnRzL3RlYXNlci1wcm9kdWN0L2NvbW1vbi90ZWFzZXItcHJvZHVjdC1jb21tb24udHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vLi4vY29yZS9zdHlsZXMnIGFzIHNiYjtcblxuOmhvc3Qge1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kOiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtYmFja2dyb3VuZC1jb2xvcik7XG5cbiAgZGlzcGxheTogYmxvY2s7XG5cbiAgQGluY2x1ZGUgc2JiLm1xKCRmcm9tOiBsYXJnZSkge1xuICAgIC0tc2JiLXRlYXNlci1wcm9kdWN0LWNvbnRlbnQtbWluLWhlaWdodDogY2FsYyhcbiAgICAgIHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1taW4taGVpZ2h0KSAtIDIgKiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtY29udGFpbmVyLXNwYWNpbmcpXG4gICAgKTtcbiAgICAtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kOiBsaW5lYXItZ3JhZGllbnQoXG4gICAgICB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtYmFja2dyb3VuZC1ncmFkaWVudC1kaXJlY3Rpb24pLFxuICAgICAgdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQtY29sb3IpIHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWdyYWRpZW50LXN0YXJ0KSxcbiAgICAgIHRyYW5zcGFyZW50IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWdyYWRpZW50LWVuZClcbiAgICApO1xuICB9XG59XG5cbjpob3N0KFtuZWdhdGl2ZV0pIHtcbiAgLS1zYmItdGVhc2VyLXByb2R1Y3QtYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tc2JiLWJhY2tncm91bmQtY29sb3ItMS1uZWdhdGl2ZSk7XG4gIC0tc2JiLXRlYXNlci1wcm9kdWN0LWNvbnRlbnQtY29sb3I6IHZhcigtLXNiYi1jb2xvci00LW5lZ2F0aXZlKTtcbiAgLS1zYmItdGVhc2VyLXByb2R1Y3QtZm9vdGVyLWNvbG9yOiB2YXIoLS1zYmItY29sb3ItNC1uZWdhdGl2ZSk7XG4gIC0tc2JiLWZvY3VzLW91dGxpbmUtY29sb3I6IHZhcigtLXNiYi1mb2N1cy1vdXRsaW5lLWNvbG9yLWRhcmspO1xuICAtLXNiYi10aXRsZS10ZXh0LWNvbG9yLW5vcm1hbC1vdmVycmlkZTogdmFyKC0tc2JiLWNvbG9yLTMtbmVnYXRpdmUpO1xufVxuXG46aG9zdChbaW1hZ2UtYWxpZ25tZW50PSdiZWZvcmUnXSkge1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWdyYWRpZW50LWRpcmVjdGlvbjogdG8gbGVmdDtcbn1cblxuOmhvc3QoOm5vdCg6c3RhdGUoc2xvdHRlZC1mb290bm90ZSkpKSB7XG4gIC0tc2JiLXRlYXNlci1wcm9kdWN0LWZvb3Rlci1wYWRkaW5nLWJsb2NrLXN0YXJ0OiAwO1xufVxuXG4uc2JiLXRlYXNlci1wcm9kdWN0X19pbWFnZS1jb250YWluZXIge1xuICBvdmVyZmxvdzogaGlkZGVuO1xuXG4gIC8vIFdlIGhhdmUgdG8gcmVtb3ZlIHRoZSBpbWFnZSBib3R0b20gYm9yZGVyLXJhZGl1cyB3aGVuIHN0YWNrZWRcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJvcmRlci1yYWRpdXMpIHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1ib3JkZXItcmFkaXVzKSAwIDA7XG5cbiAgQGluY2x1ZGUgc2JiLm1xKCRmcm9tOiBsYXJnZSkge1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICBpbnNldDogMDtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtYm9yZGVyLXJhZGl1cyk7XG4gIH1cbn1cblxuOjpzbG90dGVkKHAuc2JiLXRlYXNlci1wcm9kdWN0LS1zcGFjaW5nKSB7XG4gIG1hcmdpbjogMDtcbn1cblxuOjpzbG90dGVkKHNiYi10aXRsZS5zYmItdGVhc2VyLXByb2R1Y3QtLXNwYWNpbmcpIHtcbiAgbWFyZ2luLWJsb2NrLXN0YXJ0OiAwO1xufVxuXG46OnNsb3R0ZWQoOmlzKHNiYi1hY3Rpb24tZ3JvdXAsIDpzdGF0ZShhY3Rpb24pKS5zYmItdGVhc2VyLXByb2R1Y3QtLXNwYWNpbmcpIHtcbiAgbWFyZ2luLWJsb2NrLXN0YXJ0OiB2YXIoLS1zYmItc3BhY2luZy1yZXNwb25zaXZlLXh4cyk7XG59XG5cbjo6c2xvdHRlZChbc2xvdD0naW1hZ2UnXSkge1xuICBkaXNwbGF5OiBmbGV4O1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xufVxuXG4uc2JiLXRlYXNlci1wcm9kdWN0X19yb290IHtcbiAgQGluY2x1ZGUgc2JiLmlmLWZvcmNlZC1jb2xvcnMge1xuICAgIC8vIEFwcGx5IGEgdmlzdWFsIGJvcmRlciBmb3IgZm9yY2VkIGNvbG9yIG1vZGVcbiAgICAmOjphZnRlciB7XG4gICAgICBjb250ZW50OiAnJztcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgaW5zZXQ6IDA7XG4gICAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgICAgIGJvcmRlcjogdmFyKC0tc2JiLWJvcmRlci13aWR0aC0yeCkgc29saWQgQ2FudmFzVGV4dDtcbiAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1ib3JkZXItcmFkaXVzKTtcbiAgICB9XG4gIH1cbn1cblxuLnNiYi1hY3Rpb24tYmFzZSB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcbn1cblxuLnNiYi10ZWFzZXItcHJvZHVjdF9fY29udGFpbmVyIHtcbiAgYmFja2dyb3VuZDogdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQpO1xuICBib3JkZXItcmFkaXVzOiAwIDAgdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJvcmRlci1yYWRpdXMpIHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1ib3JkZXItcmFkaXVzKTtcbiAgcGFkZGluZy1ibG9jazogdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWNvbnRhaW5lci1wYWRkaW5nLWJsb2NrKTtcbiAgcGFkZGluZy1pbmxpbmU6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1jb250YWluZXItcGFkZGluZy1pbmxpbmUpO1xuXG4gIEBpbmNsdWRlIHNiYi5tcSgkZnJvbTogbGFyZ2UpIHtcbiAgICBkaXNwbGF5OiBncmlkO1xuICAgIGdyaWQ6XG4gICAgICAnY29udGVudCAuJyAxZnJcbiAgICAgICdmb290bm90ZSAuJyBhdXRvIC8gMWZyIDFmcjtcbiAgICBjb2x1bW4tZ2FwOiB2YXIoLS1zYmItc3BhY2luZy1yZXNwb25zaXZlLXh4bCk7XG4gICAgYm9yZGVyLXJhZGl1czogdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJvcmRlci1yYWRpdXMpO1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuICAgIDpob3N0KFtpbWFnZS1hbGlnbm1lbnQ9J2JlZm9yZSddKSAmIHtcbiAgICAgIGdyaWQtdGVtcGxhdGUtYXJlYXM6XG4gICAgICAgICcuIGNvbnRlbnQnXG4gICAgICAgICcuIGZvb3Rub3RlJztcbiAgICB9XG4gIH1cbn1cblxuLnNiYi10ZWFzZXItcHJvZHVjdF9fY29udGVudCB7XG4gIGdyaWQtYXJlYTogY29udGVudDtcbiAgYWxpZ24tc2VsZjogY2VudGVyO1xuICBtYXJnaW46IDA7XG4gIGNvbG9yOiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtY29udGVudC1jb2xvcik7XG4gIG1pbi1oZWlnaHQ6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1jb250ZW50LW1pbi1oZWlnaHQsIDApO1xuICBhbGlnbi1jb250ZW50OiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtY29udGVudC1hbGlnbi1jb250ZW50LCBub3JtYWwpO1xufVxuXG4uc2JiLXRlYXNlci1wcm9kdWN0X19mb290bm90ZSB7XG4gIGdyaWQtYXJlYTogZm9vdG5vdGU7XG4gIHBhZGRpbmctYmxvY2s6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1mb290ZXItcGFkZGluZy1ibG9jay1zdGFydClcbiAgICB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtZm9vdGVyLXBhZGRpbmctYmxvY2stZW5kKTtcbiAgY29sb3I6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1mb290ZXItY29sb3IpO1xuICBmb250LXNpemU6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1mb290ZXItZm9udC1zaXplKTtcbiAgbGV0dGVyLXNwYWNpbmc6IHZhcigtLXNiYi10eXBvLWxldHRlci1zcGFjaW5nLXRleHQpO1xuICBtaW4taGVpZ2h0OiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtZm9vdGVyLW1pbi1oZWlnaHQsIDApO1xufVxuIiwiaW1wb3J0IHsgaHRtbCwgdW5zYWZlQ1NTLCB0eXBlIFRlbXBsYXRlUmVzdWx0IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IHByb3BlcnR5IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuXG5pbXBvcnQgdHlwZSB7IFNiYkFjdGlvbkJhc2VFbGVtZW50IH0gZnJvbSAnLi4vLi4vY29yZS9iYXNlLWVsZW1lbnRzLnRzJztcbmltcG9ydCB7IHR5cGUgQWJzdHJhY3RDb25zdHJ1Y3RvciwgU2JiTmVnYXRpdmVNaXhpbiB9IGZyb20gJy4uLy4uL2NvcmUvbWl4aW5zLnRzJztcblxuaW1wb3J0IHRlYXNlclByb2R1Y3RDb21tb25TdHlsZVN0cmluZyBmcm9tICcuL3RlYXNlci1wcm9kdWN0LWNvbW1vbi5zY3NzP2lubGluZSc7XG5cbmV4cG9ydCBjb25zdCB0ZWFzZXJQcm9kdWN0Q29tbW9uU3R5bGUgPSB1bnNhZmVDU1ModGVhc2VyUHJvZHVjdENvbW1vblN0eWxlU3RyaW5nKTtcblxuZXhwb3J0IGRlY2xhcmUgY2xhc3MgU2JiVGVhc2VyUHJvZHVjdENvbW1vbkVsZW1lbnRNaXhpblR5cGUgZXh0ZW5kcyBTYmJOZWdhdGl2ZU1peGluKFxuICBTYmJBY3Rpb25CYXNlRWxlbWVudCxcbikge1xuICBwdWJsaWMgYWNjZXNzb3IgaW1hZ2VBbGlnbm1lbnQ6ICdhZnRlcicgfCAnYmVmb3JlJztcbn1cblxuLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uYW1pbmctY29udmVudGlvblxuZXhwb3J0IGNvbnN0IFNiYlRlYXNlclByb2R1Y3RDb21tb25FbGVtZW50TWl4aW4gPSA8XG4gIFQgZXh0ZW5kcyBBYnN0cmFjdENvbnN0cnVjdG9yPFNiYkFjdGlvbkJhc2VFbGVtZW50Pixcbj4oXG4gIHN1cGVyQ2xhc3M6IFQsXG4pOiBBYnN0cmFjdENvbnN0cnVjdG9yPFNiYlRlYXNlclByb2R1Y3RDb21tb25FbGVtZW50TWl4aW5UeXBlPiAmIFQgPT4ge1xuICBhYnN0cmFjdCBjbGFzcyBTYmJUZWFzZXJQcm9kdWN0Q29tbW9uRWxlbWVudFxuICAgIGV4dGVuZHMgU2JiTmVnYXRpdmVNaXhpbihzdXBlckNsYXNzKVxuICAgIGltcGxlbWVudHMgU2JiVGVhc2VyUHJvZHVjdENvbW1vbkVsZW1lbnRNaXhpblR5cGVcbiAge1xuICAgIC8qKlxuICAgICAqIFdoZXRoZXIgdGhlIGZ1bGx5IHZpc2libGUgcGFydCBvZiB0aGUgaW1hZ2UgaXMgYWxpZ25lZCAnYmVmb3JlJyBvciAnYWZ0ZXInIHRoZSBjb250ZW50LlxuICAgICAqIE9ubHkgcmVsZXZhbnQgc3RhcnRpbmcgZnJvbSBsYXJnZSBicmVha3BvaW50LlxuICAgICAqL1xuICAgIEBwcm9wZXJ0eSh7IGF0dHJpYnV0ZTogJ2ltYWdlLWFsaWdubWVudCcsIHJlZmxlY3Q6IHRydWUgfSlcbiAgICBwdWJsaWMgYWNjZXNzb3IgaW1hZ2VBbGlnbm1lbnQ6ICdhZnRlcicgfCAnYmVmb3JlJyA9ICdhZnRlcic7XG5cbiAgICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVuZGVyVGVtcGxhdGUoKTogVGVtcGxhdGVSZXN1bHQge1xuICAgICAgcmV0dXJuIGh0bWxgXG4gICAgICAgIDxkaXYgY2xhc3M9XCJzYmItdGVhc2VyLXByb2R1Y3RfX3Jvb3RcIj5cbiAgICAgICAgICA8ZGl2IGNsYXNzPVwic2JiLXRlYXNlci1wcm9kdWN0X19pbWFnZS1jb250YWluZXJcIj48c2xvdCBuYW1lPVwiaW1hZ2VcIj48L3Nsb3Q+PC9kaXY+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cInNiYi10ZWFzZXItcHJvZHVjdF9fY29udGFpbmVyXCI+XG4gICAgICAgICAgICA8c3BhbiBjbGFzcz1cInNiYi10ZWFzZXItcHJvZHVjdF9fY29udGVudFwiPlxuICAgICAgICAgICAgICA8c2xvdD48L3Nsb3Q+XG4gICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwic2JiLXRlYXNlci1wcm9kdWN0X19mb290bm90ZVwiPlxuICAgICAgICAgICAgICA8c2xvdCBuYW1lPVwiZm9vdG5vdGVcIj48L3Nsb3Q+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgICBgO1xuICAgIH1cbiAgfVxuICByZXR1cm4gU2JiVGVhc2VyUHJvZHVjdENvbW1vbkVsZW1lbnQgYXMgQWJzdHJhY3RDb25zdHJ1Y3RvcjxTYmJUZWFzZXJQcm9kdWN0Q29tbW9uRWxlbWVudE1peGluVHlwZT4gJlxuICAgIFQ7XG59O1xuIl0sIm1hcHBpbmdzIjoiOzs7Ozs7QUNRQSxJQUFhLDJCQUEyQiwrd0hBQXlDO0FBU2pGLElBQWEsc0NBR1gsZUFDbUU7QUE0Qm5FLGVBM0I0QztvQkFDbEMsaUJBQWlCLFdBQVc7Ozs7ZUFEdkIsc0NBQ0wsWUFBNEI7OztrQ0FPbkMsU0FBUztLQUFFLFdBQVc7S0FBbUIsU0FBUztLQUFNLENBQUMsQ0FBQTtBQUMxRCxpQkFBQSxNQUFBLE1BQUEsNEJBQUE7S0FBQSxNQUFBO0tBQUEsTUFBQTtLQUFBLFFBQUE7S0FBQSxTQUFBO0tBQUEsUUFBQTtNQUFBLE1BQUEsUUFBQSxvQkFBQTtNQUFBLE1BQUEsUUFBQSxJQUFnQjtNQUFjLE1BQUEsS0FBQSxVQUFBO0FBQUEsV0FBZCxpQkFBYzs7TUFBQTtLQUFBLFVBQUE7S0FBQSxFQUFBLDhCQUFBLGtDQUFBOzs7Ozs7OztHQUE5QixtQ0FBQSxrQkFBQSxNQUFBLDhCQUFxRCxRQUFPOzs7OztHQUE1RCxJQUFnQixpQkFBYztBQUFBLFdBQUEsTUFBQTs7R0FBOUIsSUFBZ0IsZUFBYyxPQUFBO0FBQUEsVUFBQSxrQ0FBQTs7R0FFWCxpQkFBYztBQUMvQixXQUFPLElBQUkifQ==
package/development/teaser-product.component-CSArA8bH.js ADDED
@@ -0,0 +1,43 @@
1
+ import { unsafeCSS } from "lit";
2
+ import { SbbLinkBaseElement } from "./core/base-elements.js";
3
+ import { boxSizingStyles } from "./core/styles.js";
4
+ import { html as html$1 } from "lit/static-html.js";
5
+ import "./screen-reader-only.js";
6
+ import { SbbTeaserProductCommonElementMixin, teaserProductCommonStyle } from "./teaser-product/common/teaser-product-common.js";
7
+ //#region src/elements/teaser-product/teaser-product/teaser-product.scss?inline
8
+ var teaser_product_default = "@media (forced-colors: active) {\n :host {\n --sbb-title-text-color-normal-override: LinkText !important;\n --sbb-teaser-product-content-color: LinkText !important;\n --sbb-teaser-product-footer-color: LinkText !important;\n }\n}\n\n.sbb-teaser-product__wrapper {\n position: relative;\n}\n\n.sbb-teaser-product__root {\n pointer-events: none;\n}\n@media (forced-colors: active) {\n :host(:hover) .sbb-teaser-product__root::after {\n border-color: Highlight;\n }\n}\n\n.sbb-teaser-product {\n position: absolute;\n inset: 0;\n}\n.sbb-teaser-product: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-teaser-product-border-radius);\n}";
9
+ //#endregion
10
+ //#region src/elements/teaser-product/teaser-product/teaser-product.component.ts
11
+ /**
12
+ * Displays a text and a footnote, combined with an image, to tease a product
13
+ *
14
+ * @slot - Use this slot to provide the main content.
15
+ * @slot image - Use this slot to provide an image or a `sbb-image` as a background.
16
+ * @slot footnote - Use this slot to provide a footnote.
17
+ * @cssprop [--sbb-teaser-product-background-gradient-start=25%] - At which percentage the background should start getting transparent.
18
+ * @cssprop [--sbb-teaser-product-background-gradient-end=75%] - At which percentage the background should be fully transparent.
19
+ */
20
+ var SbbTeaserProductElement = class extends SbbTeaserProductCommonElementMixin(SbbLinkBaseElement) {
21
+ static {
22
+ this.elementName = "sbb-teaser-product";
23
+ }
24
+ static {
25
+ this.styles = [
26
+ boxSizingStyles,
27
+ teaserProductCommonStyle,
28
+ unsafeCSS(teaser_product_default)
29
+ ];
30
+ }
31
+ render() {
32
+ return html$1`
33
+ <div class="sbb-teaser-product__wrapper">
34
+ ${this.renderLink(html$1`<sbb-screen-reader-only>${this.accessibilityLabel}</sbb-screen-reader-only>`)}
35
+ ${this.renderTemplate()}
36
+ </div>
37
+ `;
38
+ }
39
+ };
40
+ //#endregion
41
+ export { SbbTeaserProductElement as t };
42
+
43
+ //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGVhc2VyLXByb2R1Y3QuY29tcG9uZW50LUNTQXJBOGJILmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy90ZWFzZXItcHJvZHVjdC90ZWFzZXItcHJvZHVjdC90ZWFzZXItcHJvZHVjdC5zY3NzP2lubGluZSIsIi4uLy4uLy4uL3NyYy9lbGVtZW50cy90ZWFzZXItcHJvZHVjdC90ZWFzZXItcHJvZHVjdC90ZWFzZXItcHJvZHVjdC5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vLi4vY29yZS9zdHlsZXMnIGFzIHNiYjtcblxuOmhvc3Qge1xuICAvLyBTaW11bGF0ZSBsaW5rIGNvbG9yIG9wdGljYWxseVxuICBAaW5jbHVkZSBzYmIuaWYtZm9yY2VkLWNvbG9ycyB7XG4gICAgLS1zYmItdGl0bGUtdGV4dC1jb2xvci1ub3JtYWwtb3ZlcnJpZGU6IExpbmtUZXh0ICFpbXBvcnRhbnQ7XG4gICAgLS1zYmItdGVhc2VyLXByb2R1Y3QtY29udGVudC1jb2xvcjogTGlua1RleHQgIWltcG9ydGFudDtcbiAgICAtLXNiYi10ZWFzZXItcHJvZHVjdC1mb290ZXItY29sb3I6IExpbmtUZXh0ICFpbXBvcnRhbnQ7XG4gIH1cbn1cblxuLnNiYi10ZWFzZXItcHJvZHVjdF9fd3JhcHBlciB7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbn1cblxuLnNiYi10ZWFzZXItcHJvZHVjdF9fcm9vdCB7XG4gIHBvaW50ZXItZXZlbnRzOiBub25lO1xuXG4gIEBpbmNsdWRlIHNiYi5pZi1mb3JjZWQtY29sb3JzIHtcbiAgICAmOjphZnRlciB7XG4gICAgICA6aG9zdCg6aG92ZXIpICYge1xuICAgICAgICBib3JkZXItY29sb3I6IEhpZ2hsaWdodDtcbiAgICAgIH1cbiAgICB9XG4gIH1cbn1cblxuLnNiYi10ZWFzZXItcHJvZHVjdCB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgaW5zZXQ6IDA7XG5cbiAgJjpmb2N1cy12aXNpYmxlIHtcbiAgICBAaW5jbHVkZSBzYmIuZm9jdXMtb3V0bGluZTtcblxuICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1ib3JkZXItcmFkaXVzKTtcbiAgfVxufVxuIiwiaW1wb3J0IHsgdHlwZSBDU1NSZXN1bHRHcm91cCwgdHlwZSBUZW1wbGF0ZVJlc3VsdCwgdW5zYWZlQ1NTIH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGh0bWwgfSBmcm9tICdsaXQvc3RhdGljLWh0bWwuanMnO1xuXG5pbXBvcnQgeyBTYmJMaW5rQmFzZUVsZW1lbnQgfSBmcm9tICcuLi8uLi9jb3JlL2Jhc2UtZWxlbWVudHMudHMnO1xuaW1wb3J0IHsgYm94U2l6aW5nU3R5bGVzIH0gZnJvbSAnLi4vLi4vY29yZS9zdHlsZXMudHMnO1xuaW1wb3J0IHtcbiAgU2JiVGVhc2VyUHJvZHVjdENvbW1vbkVsZW1lbnRNaXhpbixcbiAgdGVhc2VyUHJvZHVjdENvbW1vblN0eWxlLFxufSBmcm9tICcuLi9jb21tb24vdGVhc2VyLXByb2R1Y3QtY29tbW9uLnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vdGVhc2VyLXByb2R1Y3Quc2Nzcz9pbmxpbmUnO1xuXG5pbXBvcnQgJy4uLy4uL3NjcmVlbi1yZWFkZXItb25seS50cyc7XG5cbi8qKlxuICogRGlzcGxheXMgYSB0ZXh0IGFuZCBhIGZvb3Rub3RlLCBjb21iaW5lZCB3aXRoIGFuIGltYWdlLCB0byB0ZWFzZSBhIHByb2R1Y3RcbiAqXG4gKiBAc2xvdCAtIFVzZSB0aGlzIHNsb3QgdG8gcHJvdmlkZSB0aGUgbWFpbiBjb250ZW50LlxuICogQHNsb3QgaW1hZ2UgLSBVc2UgdGhpcyBzbG90IHRvIHByb3ZpZGUgYW4gaW1hZ2Ugb3IgYSBgc2JiLWltYWdlYCBhcyBhIGJhY2tncm91bmQuXG4gKiBAc2xvdCBmb290bm90ZSAtIFVzZSB0aGlzIHNsb3QgdG8gcHJvdmlkZSBhIGZvb3Rub3RlLlxuICogQGNzc3Byb3AgWy0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQtZ3JhZGllbnQtc3RhcnQ9MjUlXSAtIEF0IHdoaWNoIHBlcmNlbnRhZ2UgdGhlIGJhY2tncm91bmQgc2hvdWxkIHN0YXJ0IGdldHRpbmcgdHJhbnNwYXJlbnQuXG4gKiBAY3NzcHJvcCBbLS1zYmItdGVhc2VyLXByb2R1Y3QtYmFja2dyb3VuZC1ncmFkaWVudC1lbmQ9NzUlXSAtIEF0IHdoaWNoIHBlcmNlbnRhZ2UgdGhlIGJhY2tncm91bmQgc2hvdWxkIGJlIGZ1bGx5IHRyYW5zcGFyZW50LlxuICovXG5leHBvcnQgY2xhc3MgU2JiVGVhc2VyUHJvZHVjdEVsZW1lbnQgZXh0ZW5kcyBTYmJUZWFzZXJQcm9kdWN0Q29tbW9uRWxlbWVudE1peGluKFxuICBTYmJMaW5rQmFzZUVsZW1lbnQsXG4pIHtcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSByZWFkb25seSBlbGVtZW50TmFtZTogc3RyaW5nID0gJ3NiYi10ZWFzZXItcHJvZHVjdCc7XG4gIHB1YmxpYyBzdGF0aWMgb3ZlcnJpZGUgc3R5bGVzOiBDU1NSZXN1bHRHcm91cCA9IFtcbiAgICBib3hTaXppbmdTdHlsZXMsXG4gICAgdGVhc2VyUHJvZHVjdENvbW1vblN0eWxlLFxuICAgIHVuc2FmZUNTUyhzdHlsZSksXG4gIF07XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgLy8gV2UgcmVuZGVyIHRoZSBjb250ZW50IG91dHNpZGUgdGhlIGFuY2hvciB0YWcgdG8gYWxsb3cgc2NyZWVuIHJlYWRlcnMgdG8gbmF2aWdhdGUgdGhyb3VnaCBpdFxuICAgIHJldHVybiBodG1sYFxuICAgICAgPGRpdiBjbGFzcz1cInNiYi10ZWFzZXItcHJvZHVjdF9fd3JhcHBlclwiPlxuICAgICAgICAke3RoaXMucmVuZGVyTGluayhcbiAgICAgICAgICAvLyBGb3IgU0VPLCB3ZSBhZGQgdGhlIGFjY2Vzc2liaWxpdHkgaGlkZGVuIGFzIGhpZGRlbiBjb250ZW50IG9mIHRoZSBsaW5rXG4gICAgICAgICAgaHRtbGA8c2JiLXNjcmVlbi1yZWFkZXItb25seT4ke3RoaXMuYWNjZXNzaWJpbGl0eUxhYmVsfTwvc2JiLXNjcmVlbi1yZWFkZXItb25seT5gLFxuICAgICAgICApfVxuICAgICAgICAke3RoaXMucmVuZGVyVGVtcGxhdGUoKX1cbiAgICAgIDwvZGl2PlxuICAgIGA7XG4gIH1cbn1cblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgSFRNTEVsZW1lbnRUYWdOYW1lTWFwIHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uXG4gICAgJ3NiYi10ZWFzZXItcHJvZHVjdCc6IFNiYlRlYXNlclByb2R1Y3RFbGVtZW50O1xuICB9XG59XG4iXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUN1QkEsSUFBYSwwQkFBYixjQUE2QyxtQ0FDM0MsbUJBQ0QsQ0FBQTs7QUFDaUMsT0FBQSxjQUFzQjs7O0FBQy9CLE9BQUEsU0FBeUI7R0FDOUM7R0FDQTtHQUNBLFVBQVUsdUJBQUE7R0FDWDs7Q0FFa0IsU0FBTTtBQUV2QixTQUFPLE1BQUk7O1VBRUwsS0FBSyxXQUVMLE1BQUksMkJBQTJCLEtBQUssbUJBQWtCLDJCQUN2RCxDQUFBO1VBQ0MsS0FBSyxnQkFBZ0IsQ0FBQSJ9
package/development/teaser-product.js CHANGED
@@ -1,6 +1,6 @@
1
- import { n as teaserProductCommonStyle, t as SbbTeaserProductCommonElementMixin } from "./teaser-product-common-B_r7GkGw.js";
1
+ import { n as teaserProductCommonStyle, t as SbbTeaserProductCommonElementMixin } from "./teaser-product-common-DYX370pm.js";
2
2
  import { SbbTeaserProductStaticElement } from "./teaser-product/teaser-product-static/teaser-product-static.component.js";
3
- import { t as SbbTeaserProductElement } from "./teaser-product.component-DjAMYUmw.js";
3
+ import { t as SbbTeaserProductElement } from "./teaser-product.component-CSArA8bH.js";
4
4
  import "./teaser-product.pure.js";
5
5
  //#region src/elements/teaser-product.ts
6
6
  /** @entrypoint */
package/development/teaser-product.pure.js CHANGED
@@ -1,4 +1,4 @@
1
- import { n as teaserProductCommonStyle, t as SbbTeaserProductCommonElementMixin } from "./teaser-product-common-B_r7GkGw.js";
1
+ import { n as teaserProductCommonStyle, t as SbbTeaserProductCommonElementMixin } from "./teaser-product-common-DYX370pm.js";
2
2
  import { SbbTeaserProductStaticElement } from "./teaser-product/teaser-product-static/teaser-product-static.component.js";
3
- import { t as SbbTeaserProductElement } from "./teaser-product.component-DjAMYUmw.js";
3
+ import { t as SbbTeaserProductElement } from "./teaser-product.component-CSArA8bH.js";
4
4
  export { SbbTeaserProductCommonElementMixin, SbbTeaserProductElement, SbbTeaserProductStaticElement, teaserProductCommonStyle };
package/off-brand-theme.css CHANGED
@@ -1847,6 +1847,28 @@ slot[name=error]::slotted(*) {
1847
1847
  --sbb-teaser-gap: var(--sbb-spacing-fixed-4x);
1848
1848
  --sbb-teaser-border-radius: var(--sbb-border-radius-4x);
1849
1849
  --sbb-teaser-image-width: 18.75rem;
1850
+ --sbb-teaser-product-background-color: var(--sbb-color-cloud);
1851
+ --sbb-teaser-product-background-color: light-dark(
1852
+ var(--sbb-color-cloud),
1853
+ var(--sbb-color-midnight)
1854
+ );
1855
+ --sbb-teaser-product-background-gradient-direction: to right;
1856
+ --sbb-teaser-product-border-radius: var(--sbb-border-radius-4x);
1857
+ --sbb-teaser-product-min-height: 37.5rem;
1858
+ --sbb-teaser-product-background-gradient-start: 25%;
1859
+ --sbb-teaser-product-background-gradient-end: 75%;
1860
+ --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-s);
1861
+ --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-s);
1862
+ --sbb-teaser-product-container-spacing: var(--sbb-spacing-responsive-l);
1863
+ --sbb-teaser-product-content-color: var(--sbb-color-4);
1864
+ --sbb-teaser-product-footer-color: var(--sbb-color-anthracite);
1865
+ --sbb-teaser-product-footer-color: light-dark(
1866
+ var(--sbb-color-anthracite),
1867
+ var(--sbb-color-cloud)
1868
+ );
1869
+ --sbb-teaser-product-footer-font-size: var(--sbb-text-font-size-xxs);
1870
+ --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-s);
1871
+ --sbb-teaser-product-footer-padding-block-end: 0;
1850
1872
  --sbb-visual-checkbox-dimension: var(--sbb-checkbox-dimension-m);
1851
1873
  --sbb-visual-checkbox-selection-color: var(--sbb-color-primary);
1852
1874
  --sbb-visual-checkbox-selection-color-negative: var(--sbb-color-primary85);
@@ -2012,6 +2034,12 @@ slot[name=error]::slotted(*) {
2012
2034
  --sbb-menu-max-width: 20rem;
2013
2035
  --sbb-menu-min-width: 11.25rem;
2014
2036
  --sbb-menu-transform-y: var(--sbb-spacing-fixed-2x);
2037
+ --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-l) 0;
2038
+ --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-xl);
2039
+ --sbb-teaser-product-content-align-content: center;
2040
+ --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-xs);
2041
+ --sbb-teaser-product-footer-padding-block-end: var(--sbb-spacing-responsive-xs);
2042
+ --sbb-teaser-product-footer-min-height: var(--sbb-teaser-product-container-spacing);
2015
2043
  }
2016
2044
  :root.sbb-lean {
2017
2045
  --sbb-title-font-size-level-6-lean: var(--sbb-typo-scale-0-875x);
@@ -2389,6 +2417,15 @@ sbb-tab-nav-bar .sbb-tab-amount {
2389
2417
  text-decoration: var(--sbb-tab-label-text-decoration);
2390
2418
  }
2391
2419
 
2420
+ :is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2421
+ border-radius: 0;
2422
+ --sbb-image-object-fit: cover;
2423
+ --sbb-image-aspect-ratio: 16 / 9;
2424
+ }
2425
+ :is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
2426
+ place-self: stretch;
2427
+ }
2428
+
2392
2429
  .sbb-dark {
2393
2430
  color-scheme: dark;
2394
2431
  }
@@ -2505,15 +2542,6 @@ img {
2505
2542
  transition: filter var(--sbb-teaser-image-animation-duration) var(--sbb-teaser-image-animation-easing);
2506
2543
  }
2507
2544
 
2508
- :is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2509
- border-radius: 0;
2510
- --sbb-image-object-fit: cover;
2511
- --sbb-image-aspect-ratio: 16 / 9;
2512
- }
2513
- :is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
2514
- place-self: stretch;
2515
- }
2516
-
2517
2545
  sbb-teaser :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2518
2546
  --sbb-image-object-fit: cover;
2519
2547
  --sbb-image-aspect-ratio: 4 / 3;
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@sbb-esta/lyne-elements-dev",
3
- "version": "4.9.0-dev.1775125493",
3
+ "version": "4.9.0-dev.1775144212",
4
4
  "description": "Lyne Design System",
5
5
  "keywords": [
6
6
  "design system",
7
7
  "web components",
8
8
  "lit",
9
- "https://github.com/sbb-design-systems/lyne-components/commit/c82ec36c77eb0f4237b9f79483b91e894f89ae70"
9
+ "https://github.com/sbb-design-systems/lyne-components/commit/59562cd0cb9d5a2c920efc7f62a74fc4963aeb73"
10
10
  ],
11
11
  "type": "module",
12
12
  "exports": {
package/safety-theme.css CHANGED
@@ -1847,6 +1847,28 @@ slot[name=error]::slotted(*) {
1847
1847
  --sbb-teaser-gap: var(--sbb-spacing-fixed-4x);
1848
1848
  --sbb-teaser-border-radius: var(--sbb-border-radius-4x);
1849
1849
  --sbb-teaser-image-width: 18.75rem;
1850
+ --sbb-teaser-product-background-color: var(--sbb-color-cloud);
1851
+ --sbb-teaser-product-background-color: light-dark(
1852
+ var(--sbb-color-cloud),
1853
+ var(--sbb-color-midnight)
1854
+ );
1855
+ --sbb-teaser-product-background-gradient-direction: to right;
1856
+ --sbb-teaser-product-border-radius: var(--sbb-border-radius-4x);
1857
+ --sbb-teaser-product-min-height: 37.5rem;
1858
+ --sbb-teaser-product-background-gradient-start: 25%;
1859
+ --sbb-teaser-product-background-gradient-end: 75%;
1860
+ --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-s);
1861
+ --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-s);
1862
+ --sbb-teaser-product-container-spacing: var(--sbb-spacing-responsive-l);
1863
+ --sbb-teaser-product-content-color: var(--sbb-color-4);
1864
+ --sbb-teaser-product-footer-color: var(--sbb-color-anthracite);
1865
+ --sbb-teaser-product-footer-color: light-dark(
1866
+ var(--sbb-color-anthracite),
1867
+ var(--sbb-color-cloud)
1868
+ );
1869
+ --sbb-teaser-product-footer-font-size: var(--sbb-text-font-size-xxs);
1870
+ --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-s);
1871
+ --sbb-teaser-product-footer-padding-block-end: 0;
1850
1872
  --sbb-visual-checkbox-dimension: var(--sbb-checkbox-dimension-m);
1851
1873
  --sbb-visual-checkbox-selection-color: var(--sbb-color-primary);
1852
1874
  --sbb-visual-checkbox-selection-color-negative: var(--sbb-color-primary85);
@@ -2012,6 +2034,12 @@ slot[name=error]::slotted(*) {
2012
2034
  --sbb-menu-max-width: 20rem;
2013
2035
  --sbb-menu-min-width: 11.25rem;
2014
2036
  --sbb-menu-transform-y: var(--sbb-spacing-fixed-2x);
2037
+ --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-l) 0;
2038
+ --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-xl);
2039
+ --sbb-teaser-product-content-align-content: center;
2040
+ --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-xs);
2041
+ --sbb-teaser-product-footer-padding-block-end: var(--sbb-spacing-responsive-xs);
2042
+ --sbb-teaser-product-footer-min-height: var(--sbb-teaser-product-container-spacing);
2015
2043
  }
2016
2044
  :root.sbb-lean {
2017
2045
  --sbb-title-font-size-level-6-lean: var(--sbb-typo-scale-0-875x);
@@ -2389,6 +2417,15 @@ sbb-tab-nav-bar .sbb-tab-amount {
2389
2417
  text-decoration: var(--sbb-tab-label-text-decoration);
2390
2418
  }
2391
2419
 
2420
+ :is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2421
+ border-radius: 0;
2422
+ --sbb-image-object-fit: cover;
2423
+ --sbb-image-aspect-ratio: 16 / 9;
2424
+ }
2425
+ :is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
2426
+ place-self: stretch;
2427
+ }
2428
+
2392
2429
  .sbb-dark {
2393
2430
  color-scheme: dark;
2394
2431
  }
@@ -2505,15 +2542,6 @@ img {
2505
2542
  transition: filter var(--sbb-teaser-image-animation-duration) var(--sbb-teaser-image-animation-easing);
2506
2543
  }
2507
2544
 
2508
- :is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2509
- border-radius: 0;
2510
- --sbb-image-object-fit: cover;
2511
- --sbb-image-aspect-ratio: 16 / 9;
2512
- }
2513
- :is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
2514
- place-self: stretch;
2515
- }
2516
-
2517
2545
  sbb-teaser :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2518
2546
  --sbb-image-object-fit: cover;
2519
2547
  --sbb-image-aspect-ratio: 4 / 3;
package/standard-theme.css CHANGED
@@ -1847,6 +1847,28 @@ slot[name=error]::slotted(*) {
1847
1847
  --sbb-teaser-gap: var(--sbb-spacing-fixed-4x);
1848
1848
  --sbb-teaser-border-radius: var(--sbb-border-radius-4x);
1849
1849
  --sbb-teaser-image-width: 18.75rem;
1850
+ --sbb-teaser-product-background-color: var(--sbb-color-cloud);
1851
+ --sbb-teaser-product-background-color: light-dark(
1852
+ var(--sbb-color-cloud),
1853
+ var(--sbb-color-midnight)
1854
+ );
1855
+ --sbb-teaser-product-background-gradient-direction: to right;
1856
+ --sbb-teaser-product-border-radius: var(--sbb-border-radius-4x);
1857
+ --sbb-teaser-product-min-height: 37.5rem;
1858
+ --sbb-teaser-product-background-gradient-start: 25%;
1859
+ --sbb-teaser-product-background-gradient-end: 75%;
1860
+ --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-s);
1861
+ --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-s);
1862
+ --sbb-teaser-product-container-spacing: var(--sbb-spacing-responsive-l);
1863
+ --sbb-teaser-product-content-color: var(--sbb-color-4);
1864
+ --sbb-teaser-product-footer-color: var(--sbb-color-anthracite);
1865
+ --sbb-teaser-product-footer-color: light-dark(
1866
+ var(--sbb-color-anthracite),
1867
+ var(--sbb-color-cloud)
1868
+ );
1869
+ --sbb-teaser-product-footer-font-size: var(--sbb-text-font-size-xxs);
1870
+ --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-s);
1871
+ --sbb-teaser-product-footer-padding-block-end: 0;
1850
1872
  --sbb-visual-checkbox-dimension: var(--sbb-checkbox-dimension-m);
1851
1873
  --sbb-visual-checkbox-selection-color: var(--sbb-color-primary);
1852
1874
  --sbb-visual-checkbox-selection-color-negative: var(--sbb-color-primary85);
@@ -2012,6 +2034,12 @@ slot[name=error]::slotted(*) {
2012
2034
  --sbb-menu-max-width: 20rem;
2013
2035
  --sbb-menu-min-width: 11.25rem;
2014
2036
  --sbb-menu-transform-y: var(--sbb-spacing-fixed-2x);
2037
+ --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-l) 0;
2038
+ --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-xl);
2039
+ --sbb-teaser-product-content-align-content: center;
2040
+ --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-xs);
2041
+ --sbb-teaser-product-footer-padding-block-end: var(--sbb-spacing-responsive-xs);
2042
+ --sbb-teaser-product-footer-min-height: var(--sbb-teaser-product-container-spacing);
2015
2043
  }
2016
2044
  :root.sbb-lean {
2017
2045
  --sbb-title-font-size-level-6-lean: var(--sbb-typo-scale-0-875x);
@@ -2389,6 +2417,15 @@ sbb-tab-nav-bar .sbb-tab-amount {
2389
2417
  text-decoration: var(--sbb-tab-label-text-decoration);
2390
2418
  }
2391
2419
 
2420
+ :is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2421
+ border-radius: 0;
2422
+ --sbb-image-object-fit: cover;
2423
+ --sbb-image-aspect-ratio: 16 / 9;
2424
+ }
2425
+ :is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
2426
+ place-self: stretch;
2427
+ }
2428
+
2392
2429
  .sbb-dark {
2393
2430
  color-scheme: dark;
2394
2431
  }
@@ -2505,15 +2542,6 @@ img {
2505
2542
  transition: filter var(--sbb-teaser-image-animation-duration) var(--sbb-teaser-image-animation-easing);
2506
2543
  }
2507
2544
 
2508
- :is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2509
- border-radius: 0;
2510
- --sbb-image-object-fit: cover;
2511
- --sbb-image-aspect-ratio: 16 / 9;
2512
- }
2513
- :is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
2514
- place-self: stretch;
2515
- }
2516
-
2517
2545
  sbb-teaser :is(sbb-image, img):not(.sbb-figure-overlap-image) {
2518
2546
  --sbb-image-object-fit: cover;
2519
2547
  --sbb-image-aspect-ratio: 4 / 3;
package/teaser-product/common/teaser-product-common.js CHANGED
@@ -1,2 +1,2 @@
1
- import { n as e, t } from "../../teaser-product-common-qTPSq_o7.js";
1
+ import { n as e, t } from "../../teaser-product-common-Ct19HzVX.js";
2
2
  export { t as SbbTeaserProductCommonElementMixin, e as teaserProductCommonStyle };
package/teaser-product/common.js CHANGED
@@ -1,4 +1,4 @@
1
- import { n as e, t } from "../teaser-product-common-qTPSq_o7.js";
1
+ import { n as e, t } from "../teaser-product-common-Ct19HzVX.js";
2
2
  //#region src/elements/teaser-product/common.ts
3
3
  console.warn("The entrypoint '@sbb-esta/elements/teaser-product/common.js' has been deprecated.\nUse either '@sbb-esta/elements/teaser-product.js' or '@sbb-esta/elements/teaser-product.pure.js' instead.");
4
4
  //#endregion
package/teaser-product/teaser-product/teaser-product.component.js CHANGED
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../teaser-product.component-IyBPFzdf.js";
1
+ import { t as e } from "../../teaser-product.component-Csj9pAne.js";
2
2
  export { e as SbbTeaserProductElement };
package/teaser-product/teaser-product.js CHANGED
@@ -1,4 +1,4 @@
1
- import { t as e } from "../teaser-product.component-IyBPFzdf.js";
1
+ import { t as e } from "../teaser-product.component-Csj9pAne.js";
2
2
  e.define(), console.warn("The entrypoint '@sbb-esta/elements/teaser-product/teaser-product.js' has been deprecated.\nUse either '@sbb-esta/elements/teaser-product.js' or '@sbb-esta/elements/teaser-product.pure.js' instead.");
3
3
  //#endregion
4
4
  export { e as SbbTeaserProductElement };
package/teaser-product-common-Ct19HzVX.js ADDED
@@ -0,0 +1,63 @@
1
+ import { __esDecorate as e, __runInitializers as t } from "tslib";
2
+ import { html as n, unsafeCSS as r } from "lit";
3
+ import { property as i } from "lit/decorators.js";
4
+ import { SbbNegativeMixin as a } from "./core/mixins.js";
5
+ //#endregion
6
+ //#region src/elements/teaser-product/common/teaser-product-common.ts
7
+ var o = r(":host{--sbb-teaser-product-background: var(--sbb-teaser-product-background-color);display:block}@media(min-width:64rem){:host{--sbb-teaser-product-content-min-height: calc( var(--sbb-teaser-product-min-height) - 2 * var(--sbb-teaser-product-container-spacing) );--sbb-teaser-product-background: linear-gradient( var(--sbb-teaser-product-background-gradient-direction), var(--sbb-teaser-product-background-color) var(--sbb-teaser-product-background-gradient-start), transparent var(--sbb-teaser-product-background-gradient-end) )}}:host([negative]){--sbb-teaser-product-background-color: var(--sbb-background-color-1-negative);--sbb-teaser-product-content-color: var(--sbb-color-4-negative);--sbb-teaser-product-footer-color: var(--sbb-color-4-negative);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-title-text-color-normal-override: var(--sbb-color-3-negative)}:host([image-alignment=before]){--sbb-teaser-product-background-gradient-direction: to left}:host(:not(:is(:state(slotted-footnote),[state--slotted-footnote]))){--sbb-teaser-product-footer-padding-block-start: 0}.sbb-teaser-product__image-container{overflow:hidden;border-radius:var(--sbb-teaser-product-border-radius) var(--sbb-teaser-product-border-radius) 0 0}@media(min-width:64rem){.sbb-teaser-product__image-container{position:absolute;inset:0;border-radius:var(--sbb-teaser-product-border-radius)}}::slotted(p.sbb-teaser-product--spacing){margin:0}::slotted(sbb-title.sbb-teaser-product--spacing){margin-block-start:0}::slotted(:is(sbb-action-group,:is(:state(action),[state--action])).sbb-teaser-product--spacing){margin-block-start:var(--sbb-spacing-responsive-xxs)}::slotted([slot=image]){display:flex;width:100%;height:100%}@media(forced-colors:active){.sbb-teaser-product__root:after{content:\"\";position:absolute;display:block;inset:0;pointer-events:none;border:var(--sbb-border-width-2x) solid CanvasText;border-radius:var(--sbb-teaser-product-border-radius)}}.sbb-action-base{display:block;position:relative;text-decoration:none}.sbb-teaser-product__container{background:var(--sbb-teaser-product-background);border-radius:0 0 var(--sbb-teaser-product-border-radius) var(--sbb-teaser-product-border-radius);padding-block:var(--sbb-teaser-product-container-padding-block);padding-inline:var(--sbb-teaser-product-container-padding-inline)}@media(min-width:64rem){.sbb-teaser-product__container{display:grid;grid:\"content .\" 1fr \"footnote .\" auto/1fr 1fr;column-gap:var(--sbb-spacing-responsive-xxl);border-radius:var(--sbb-teaser-product-border-radius);position:relative}:host([image-alignment=before]) .sbb-teaser-product__container{grid-template-areas:\". content\" \". footnote\"}}.sbb-teaser-product__content{grid-area:content;align-self:center;margin:0;color:var(--sbb-teaser-product-content-color);min-height:var(--sbb-teaser-product-content-min-height, 0);align-content:var(--sbb-teaser-product-content-align-content, normal)}.sbb-teaser-product__footnote{grid-area:footnote;padding-block:var(--sbb-teaser-product-footer-padding-block-start) var(--sbb-teaser-product-footer-padding-block-end);color:var(--sbb-teaser-product-footer-color);font-size:var(--sbb-teaser-product-footer-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);min-height:var(--sbb-teaser-product-footer-min-height, 0)}"), s = (r) => (() => {
8
+ let o = a(r), s, c = [], l = [];
9
+ return class extends o {
10
+ static {
11
+ let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
12
+ s = [i({
13
+ attribute: "image-alignment",
14
+ reflect: !0
15
+ })], e(this, null, s, {
16
+ kind: "accessor",
17
+ name: "imageAlignment",
18
+ static: !1,
19
+ private: !1,
20
+ access: {
21
+ has: (e) => "imageAlignment" in e,
22
+ get: (e) => e.imageAlignment,
23
+ set: (e, t) => {
24
+ e.imageAlignment = t;
25
+ }
26
+ },
27
+ metadata: t
28
+ }, c, l), t && Object.defineProperty(this, Symbol.metadata, {
29
+ enumerable: !0,
30
+ configurable: !0,
31
+ writable: !0,
32
+ value: t
33
+ });
34
+ }
35
+ #e = t(this, c, "after");
36
+ get imageAlignment() {
37
+ return this.#e;
38
+ }
39
+ set imageAlignment(e) {
40
+ this.#e = e;
41
+ }
42
+ renderTemplate() {
43
+ return n`
44
+ <div class="sbb-teaser-product__root">
45
+ <div class="sbb-teaser-product__image-container"><slot name="image"></slot></div>
46
+ <div class="sbb-teaser-product__container">
47
+ <span class="sbb-teaser-product__content">
48
+ <slot></slot>
49
+ </span>
50
+ <div class="sbb-teaser-product__footnote">
51
+ <slot name="footnote"></slot>
52
+ </div>
53
+ </div>
54
+ </div>
55
+ `;
56
+ }
57
+ constructor() {
58
+ super(...arguments), t(this, l);
59
+ }
60
+ };
61
+ })();
62
+ //#endregion
63
+ export { o as n, s as t };
package/{teaser-product.component-IyBPFzdf.js → teaser-product.component-Csj9pAne.js} RENAMED
@@ -5,7 +5,7 @@ import { html as r } from "lit/static-html.js";
5
5
  import "./screen-reader-only.js";
6
6
  import { SbbTeaserProductCommonElementMixin as i, teaserProductCommonStyle as a } from "./teaser-product/common/teaser-product-common.js";
7
7
  //#region src/elements/teaser-product/teaser-product/teaser-product.scss?inline
8
- var o = ":host{--sbb-teaser-product-border-radius: var(--sbb-border-radius-4x)}@media(forced-colors:active){:host{--sbb-title-text-color-normal-override: LinkText !important;--sbb-teaser-product-content-color: LinkText !important;--sbb-teaser-product-footer-color: LinkText !important}}.sbb-teaser-product__wrapper{position:relative}.sbb-teaser-product__root{pointer-events:none}@media(forced-colors:active){:host(:hover) .sbb-teaser-product__root:after{border-color:Highlight}}.sbb-teaser-product{position:absolute;inset:0}.sbb-teaser-product: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-teaser-product-border-radius)}", s = class extends i(t) {
8
+ var o = "@media(forced-colors:active){:host{--sbb-title-text-color-normal-override: LinkText !important;--sbb-teaser-product-content-color: LinkText !important;--sbb-teaser-product-footer-color: LinkText !important}}.sbb-teaser-product__wrapper{position:relative}.sbb-teaser-product__root{pointer-events:none}@media(forced-colors:active){:host(:hover) .sbb-teaser-product__root:after{border-color:Highlight}}.sbb-teaser-product{position:absolute;inset:0}.sbb-teaser-product: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-teaser-product-border-radius)}", s = class extends i(t) {
9
9
  static {
10
10
  this.elementName = "sbb-teaser-product";
11
11
  }
package/teaser-product.js CHANGED
@@ -1,6 +1,6 @@
1
- import { n as e, t } from "./teaser-product-common-qTPSq_o7.js";
1
+ import { n as e, t } from "./teaser-product-common-Ct19HzVX.js";
2
2
  import { SbbTeaserProductStaticElement as n } from "./teaser-product/teaser-product-static/teaser-product-static.component.js";
3
- import { t as r } from "./teaser-product.component-IyBPFzdf.js";
3
+ import { t as r } from "./teaser-product.component-Csj9pAne.js";
4
4
  import "./teaser-product.pure.js";
5
5
  r.define(), n.define();
6
6
  //#endregion
package/teaser-product.pure.js CHANGED
@@ -1,4 +1,4 @@
1
- import { n as e, t } from "./teaser-product-common-qTPSq_o7.js";
1
+ import { n as e, t } from "./teaser-product-common-Ct19HzVX.js";
2
2
  import { SbbTeaserProductStaticElement as n } from "./teaser-product/teaser-product-static/teaser-product-static.component.js";
3
- import { t as r } from "./teaser-product.component-IyBPFzdf.js";
3
+ import { t as r } from "./teaser-product.component-Csj9pAne.js";
4
4
  export { t as SbbTeaserProductCommonElementMixin, r as SbbTeaserProductElement, n as SbbTeaserProductStaticElement, e as teaserProductCommonStyle };
package/development/teaser-product-common-B_r7GkGw.js DELETED
@@ -1,78 +0,0 @@
1
- import { __esDecorate, __runInitializers } from "tslib";
2
- import { html, unsafeCSS } from "lit";
3
- import { property } from "lit/decorators.js";
4
- import { SbbNegativeMixin } from "./core/mixins.js";
5
- //#endregion
6
- //#region src/elements/teaser-product/common/teaser-product-common.ts
7
- var teaserProductCommonStyle = unsafeCSS(":host {\n display: block;\n --sbb-teaser-product-background-color: var(--sbb-color-cloud);\n --sbb-teaser-product-background-color: light-dark(\n var(--sbb-color-cloud),\n var(--sbb-color-midnight)\n );\n --sbb-teaser-product-background-gradient-direction: to right;\n --sbb-teaser-product-background: var(--sbb-teaser-product-background-color);\n --sbb-teaser-product-border-radius: var(--sbb-border-radius-4x);\n --sbb-teaser-product-content-color: var(--sbb-color-4);\n --sbb-teaser-product-footer-color: var(--sbb-color-anthracite);\n --sbb-teaser-product-footer-color: light-dark(\n var(--sbb-color-anthracite),\n var(--sbb-color-cloud)\n );\n --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-l);\n --sbb-teaser-product-min-height: 37.5rem;\n --sbb-teaser-product-background-gradient-start: 25%;\n --sbb-teaser-product-background-gradient-end: 75%;\n}\n@media (min-width: calc(64rem)) {\n :host {\n --sbb-teaser-product-background: linear-gradient(\n var(--sbb-teaser-product-background-gradient-direction),\n var(--sbb-teaser-product-background-color) var(--sbb-teaser-product-background-gradient-start),\n transparent var(--sbb-teaser-product-background-gradient-end)\n );\n }\n}\n\n:host([negative]) {\n --sbb-teaser-product-background-color: var(--sbb-background-color-1-negative);\n --sbb-teaser-product-content-color: var(--sbb-color-4-negative);\n --sbb-teaser-product-footer-color: var(--sbb-color-4-negative);\n --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);\n --sbb-title-text-color-normal-override: var(--sbb-color-3-negative);\n}\n\n:host([image-alignment=before]) {\n --sbb-teaser-product-background-gradient-direction: to left;\n}\n\n.sbb-teaser-product__image-container {\n overflow: hidden;\n border-radius: var(--sbb-teaser-product-border-radius) var(--sbb-teaser-product-border-radius) 0 0;\n}\n@media (min-width: calc(64rem)) {\n .sbb-teaser-product__image-container {\n position: absolute;\n inset: 0;\n border-radius: var(--sbb-teaser-product-border-radius);\n }\n}\n\n::slotted(p.sbb-teaser-product--spacing) {\n margin: 0;\n}\n\n::slotted(sbb-title.sbb-teaser-product--spacing) {\n margin-block-start: 0;\n}\n\n::slotted(:is(sbb-action-group, :is(:state(action),[state--action])).sbb-teaser-product--spacing) {\n margin-block-start: var(--sbb-spacing-responsive-xxs);\n}\n\n::slotted([slot=image]) {\n display: flex;\n width: 100%;\n height: 100%;\n}\n\n@media (forced-colors: active) {\n .sbb-teaser-product__root::after {\n content: \"\";\n position: absolute;\n display: block;\n inset: 0;\n pointer-events: none;\n border: var(--sbb-border-width-2x) solid CanvasText;\n border-radius: var(--sbb-teaser-product-border-radius);\n }\n}\n\n.sbb-action-base {\n display: block;\n position: relative;\n text-decoration: none;\n}\n\n.sbb-teaser-product__container {\n background: var(--sbb-teaser-product-background);\n border-radius: 0 0 var(--sbb-teaser-product-border-radius) var(--sbb-teaser-product-border-radius);\n padding: var(--sbb-spacing-responsive-s);\n}\n@media (min-width: calc(64rem)) {\n .sbb-teaser-product__container {\n display: grid;\n grid: \"content .\" 1fr \"footnote .\" auto/1fr 1fr;\n column-gap: var(--sbb-spacing-responsive-xxl);\n background: var(--sbb-teaser-product-background);\n border-radius: var(--sbb-teaser-product-border-radius);\n padding-block: var(--sbb-teaser-product-container-padding-block) 0;\n padding-inline: var(--sbb-spacing-responsive-xl);\n position: relative;\n }\n :host([image-alignment=before]) .sbb-teaser-product__container {\n grid-template-areas: \". content\" \". footnote\";\n }\n}\n\n.sbb-teaser-product__content {\n grid-area: content;\n align-self: center;\n margin: 0;\n color: var(--sbb-teaser-product-content-color);\n}\n@media (min-width: calc(64rem)) {\n .sbb-teaser-product__content {\n align-content: center;\n min-height: calc(var(--sbb-teaser-product-min-height) - 2 * var(--sbb-teaser-product-container-padding-block));\n }\n}\n\n.sbb-teaser-product__footnote {\n grid-area: footnote;\n padding-block-start: var(--sbb-spacing-responsive-s);\n color: var(--sbb-teaser-product-footer-color);\n --sbb-text-font-size: var(--sbb-text-font-size-xxs);\n font-family: var(--sbb-typo-font-family);\n font-weight: normal;\n line-height: var(--sbb-typo-line-height-text);\n letter-spacing: var(--sbb-typo-letter-spacing-text);\n font-size: var(--sbb-text-font-size);\n}\n:host(:not(:is(:state(slotted-footnote),[state--slotted-footnote]))) .sbb-teaser-product__footnote {\n padding-block-start: 0;\n}\n@media (min-width: calc(64rem)) {\n .sbb-teaser-product__footnote {\n min-height: var(--sbb-teaser-product-container-padding-block);\n padding-block: var(--sbb-spacing-responsive-xs);\n }\n}");
8
- var SbbTeaserProductCommonElementMixin = (superClass) => {
9
- return (() => {
10
- let _classSuper = SbbNegativeMixin(superClass);
11
- let _imageAlignment_decorators;
12
- let _imageAlignment_initializers = [];
13
- let _imageAlignment_extraInitializers = [];
14
- return class SbbTeaserProductCommonElement extends _classSuper {
15
- static {
16
- const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
17
- _imageAlignment_decorators = [property({
18
- attribute: "image-alignment",
19
- reflect: true
20
- })];
21
- __esDecorate(this, null, _imageAlignment_decorators, {
22
- kind: "accessor",
23
- name: "imageAlignment",
24
- static: false,
25
- private: false,
26
- access: {
27
- has: (obj) => "imageAlignment" in obj,
28
- get: (obj) => obj.imageAlignment,
29
- set: (obj, value) => {
30
- obj.imageAlignment = value;
31
- }
32
- },
33
- metadata: _metadata
34
- }, _imageAlignment_initializers, _imageAlignment_extraInitializers);
35
- if (_metadata) Object.defineProperty(this, Symbol.metadata, {
36
- enumerable: true,
37
- configurable: true,
38
- writable: true,
39
- value: _metadata
40
- });
41
- }
42
- #imageAlignment_accessor_storage = __runInitializers(this, _imageAlignment_initializers, "after");
43
- /**
44
- * Whether the fully visible part of the image is aligned 'before' or 'after' the content.
45
- * Only relevant starting from large breakpoint.
46
- */
47
- get imageAlignment() {
48
- return this.#imageAlignment_accessor_storage;
49
- }
50
- set imageAlignment(value) {
51
- this.#imageAlignment_accessor_storage = value;
52
- }
53
- renderTemplate() {
54
- return html`
55
- <div class="sbb-teaser-product__root">
56
- <div class="sbb-teaser-product__image-container"><slot name="image"></slot></div>
57
- <div class="sbb-teaser-product__container">
58
- <span class="sbb-teaser-product__content">
59
- <slot></slot>
60
- </span>
61
- <div class="sbb-teaser-product__footnote">
62
- <slot name="footnote"></slot>
63
- </div>
64
- </div>
65
- </div>
66
- `;
67
- }
68
- constructor() {
69
- super(...arguments);
70
- __runInitializers(this, _imageAlignment_extraInitializers);
71
- }
72
- };
73
- })();
74
- };
75
- //#endregion
76
- export { teaserProductCommonStyle as n, SbbTeaserProductCommonElementMixin as t };
77
-
78
- //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGVhc2VyLXByb2R1Y3QtY29tbW9uLUJfcjdHa0d3LmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy90ZWFzZXItcHJvZHVjdC9jb21tb24vdGVhc2VyLXByb2R1Y3QtY29tbW9uLnNjc3M/aW5saW5lIiwiLi4vLi4vLi4vc3JjL2VsZW1lbnRzL3RlYXNlci1wcm9kdWN0L2NvbW1vbi90ZWFzZXItcHJvZHVjdC1jb21tb24udHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vLi4vY29yZS9zdHlsZXMnIGFzIHNiYjtcblxuOmhvc3Qge1xuICBkaXNwbGF5OiBibG9jaztcblxuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWNvbG9yOiBsaWdodC1kYXJrKFxuICAgIHZhcigtLXNiYi1jb2xvci1jbG91ZCksXG4gICAgdmFyKC0tc2JiLWNvbG9yLW1pZG5pZ2h0KVxuICApO1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWdyYWRpZW50LWRpcmVjdGlvbjogdG8gcmlnaHQ7XG4gIC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQ6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWNvbG9yKTtcbiAgLS1zYmItdGVhc2VyLXByb2R1Y3QtYm9yZGVyLXJhZGl1czogdmFyKC0tc2JiLWJvcmRlci1yYWRpdXMtNHgpO1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1jb250ZW50LWNvbG9yOiB2YXIoLS1zYmItY29sb3ItNCk7XG4gIC0tc2JiLXRlYXNlci1wcm9kdWN0LWZvb3Rlci1jb2xvcjogbGlnaHQtZGFyayhcbiAgICB2YXIoLS1zYmItY29sb3ItYW50aHJhY2l0ZSksXG4gICAgdmFyKC0tc2JiLWNvbG9yLWNsb3VkKVxuICApO1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1jb250YWluZXItcGFkZGluZy1ibG9jazogdmFyKC0tc2JiLXNwYWNpbmctcmVzcG9uc2l2ZS1sKTtcbiAgLS1zYmItdGVhc2VyLXByb2R1Y3QtbWluLWhlaWdodDogI3tzYmIucHgtdG8tcmVtLWJ1aWxkKDYwMCl9O1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWdyYWRpZW50LXN0YXJ0OiAyNSU7XG4gIC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQtZ3JhZGllbnQtZW5kOiA3NSU7XG5cbiAgQGluY2x1ZGUgc2JiLm1xKCRmcm9tOiBsYXJnZSkge1xuICAgIC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudChcbiAgICAgIHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWdyYWRpZW50LWRpcmVjdGlvbiksXG4gICAgICB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtYmFja2dyb3VuZC1jb2xvcikgdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQtZ3JhZGllbnQtc3RhcnQpLFxuICAgICAgdHJhbnNwYXJlbnQgdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQtZ3JhZGllbnQtZW5kKVxuICAgICk7XG4gIH1cbn1cblxuOmhvc3QoW25lZ2F0aXZlXSkge1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1zYmItYmFja2dyb3VuZC1jb2xvci0xLW5lZ2F0aXZlKTtcbiAgLS1zYmItdGVhc2VyLXByb2R1Y3QtY29udGVudC1jb2xvcjogdmFyKC0tc2JiLWNvbG9yLTQtbmVnYXRpdmUpO1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1mb290ZXItY29sb3I6IHZhcigtLXNiYi1jb2xvci00LW5lZ2F0aXZlKTtcbiAgLS1zYmItZm9jdXMtb3V0bGluZS1jb2xvcjogdmFyKC0tc2JiLWZvY3VzLW91dGxpbmUtY29sb3ItZGFyayk7XG4gIC0tc2JiLXRpdGxlLXRleHQtY29sb3Itbm9ybWFsLW92ZXJyaWRlOiB2YXIoLS1zYmItY29sb3ItMy1uZWdhdGl2ZSk7XG59XG5cbjpob3N0KFtpbWFnZS1hbGlnbm1lbnQ9J2JlZm9yZSddKSB7XG4gIC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQtZ3JhZGllbnQtZGlyZWN0aW9uOiB0byBsZWZ0O1xufVxuXG4uc2JiLXRlYXNlci1wcm9kdWN0X19pbWFnZS1jb250YWluZXIge1xuICBvdmVyZmxvdzogaGlkZGVuO1xuXG4gIC8vIFdlIGhhdmUgdG8gcmVtb3ZlIHRoZSBpbWFnZSBib3R0b20gYm9yZGVyLXJhZGl1cyB3aGVuIHN0YWNrZWRcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJvcmRlci1yYWRpdXMpIHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1ib3JkZXItcmFkaXVzKSAwIDA7XG5cbiAgQGluY2x1ZGUgc2JiLm1xKCRmcm9tOiBsYXJnZSkge1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICBpbnNldDogMDtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtYm9yZGVyLXJhZGl1cyk7XG4gIH1cbn1cblxuOjpzbG90dGVkKHAuc2JiLXRlYXNlci1wcm9kdWN0LS1zcGFjaW5nKSB7XG4gIG1hcmdpbjogMDtcbn1cblxuOjpzbG90dGVkKHNiYi10aXRsZS5zYmItdGVhc2VyLXByb2R1Y3QtLXNwYWNpbmcpIHtcbiAgbWFyZ2luLWJsb2NrLXN0YXJ0OiAwO1xufVxuXG46OnNsb3R0ZWQoOmlzKHNiYi1hY3Rpb24tZ3JvdXAsIDpzdGF0ZShhY3Rpb24pKS5zYmItdGVhc2VyLXByb2R1Y3QtLXNwYWNpbmcpIHtcbiAgbWFyZ2luLWJsb2NrLXN0YXJ0OiB2YXIoLS1zYmItc3BhY2luZy1yZXNwb25zaXZlLXh4cyk7XG59XG5cbjo6c2xvdHRlZChbc2xvdD0naW1hZ2UnXSkge1xuICBkaXNwbGF5OiBmbGV4O1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xufVxuXG4uc2JiLXRlYXNlci1wcm9kdWN0X19yb290IHtcbiAgQGluY2x1ZGUgc2JiLmlmLWZvcmNlZC1jb2xvcnMge1xuICAgIC8vIEFwcGx5IGEgdmlzdWFsIGJvcmRlciBmb3IgZm9yY2VkIGNvbG9yIG1vZGVcbiAgICAmOjphZnRlciB7XG4gICAgICBjb250ZW50OiAnJztcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgaW5zZXQ6IDA7XG4gICAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgICAgIGJvcmRlcjogdmFyKC0tc2JiLWJvcmRlci13aWR0aC0yeCkgc29saWQgQ2FudmFzVGV4dDtcbiAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1ib3JkZXItcmFkaXVzKTtcbiAgICB9XG4gIH1cbn1cblxuLnNiYi1hY3Rpb24tYmFzZSB7XG4gIGRpc3BsYXk6IGJsb2NrO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcbn1cblxuLnNiYi10ZWFzZXItcHJvZHVjdF9fY29udGFpbmVyIHtcbiAgYmFja2dyb3VuZDogdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQpO1xuICBib3JkZXItcmFkaXVzOiAwIDAgdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWJvcmRlci1yYWRpdXMpIHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1ib3JkZXItcmFkaXVzKTtcbiAgcGFkZGluZzogdmFyKC0tc2JiLXNwYWNpbmctcmVzcG9uc2l2ZS1zKTtcblxuICBAaW5jbHVkZSBzYmIubXEoJGZyb206IGxhcmdlKSB7XG4gICAgZGlzcGxheTogZ3JpZDtcbiAgICBncmlkOlxuICAgICAgJ2NvbnRlbnQgLicgMWZyXG4gICAgICAnZm9vdG5vdGUgLicgYXV0byAvIDFmciAxZnI7XG4gICAgY29sdW1uLWdhcDogdmFyKC0tc2JiLXNwYWNpbmctcmVzcG9uc2l2ZS14eGwpO1xuICAgIGJhY2tncm91bmQ6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kKTtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtYm9yZGVyLXJhZGl1cyk7XG4gICAgcGFkZGluZy1ibG9jazogdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWNvbnRhaW5lci1wYWRkaW5nLWJsb2NrKSAwO1xuICAgIHBhZGRpbmctaW5saW5lOiB2YXIoLS1zYmItc3BhY2luZy1yZXNwb25zaXZlLXhsKTtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG5cbiAgICA6aG9zdChbaW1hZ2UtYWxpZ25tZW50PSdiZWZvcmUnXSkgJiB7XG4gICAgICBncmlkLXRlbXBsYXRlLWFyZWFzOlxuICAgICAgICAnLiBjb250ZW50J1xuICAgICAgICAnLiBmb290bm90ZSc7XG4gICAgfVxuICB9XG59XG5cbi5zYmItdGVhc2VyLXByb2R1Y3RfX2NvbnRlbnQge1xuICBncmlkLWFyZWE6IGNvbnRlbnQ7XG4gIGFsaWduLXNlbGY6IGNlbnRlcjtcbiAgbWFyZ2luOiAwO1xuICBjb2xvcjogdmFyKC0tc2JiLXRlYXNlci1wcm9kdWN0LWNvbnRlbnQtY29sb3IpO1xuXG4gIEBpbmNsdWRlIHNiYi5tcSgkZnJvbTogbGFyZ2UpIHtcbiAgICBhbGlnbi1jb250ZW50OiBjZW50ZXI7XG4gICAgbWluLWhlaWdodDogY2FsYyhcbiAgICAgIHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1taW4taGVpZ2h0KSAtIDIgKiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtY29udGFpbmVyLXBhZGRpbmctYmxvY2spXG4gICAgKTtcbiAgfVxufVxuXG4uc2JiLXRlYXNlci1wcm9kdWN0X19mb290bm90ZSB7XG4gIGdyaWQtYXJlYTogZm9vdG5vdGU7XG4gIHBhZGRpbmctYmxvY2stc3RhcnQ6IHZhcigtLXNiYi1zcGFjaW5nLXJlc3BvbnNpdmUtcyk7XG4gIGNvbG9yOiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtZm9vdGVyLWNvbG9yKTtcblxuICBAaW5jbHVkZSBzYmIudGV4dC14eHMtLXJlZ3VsYXI7XG5cbiAgOmhvc3QoOm5vdCg6c3RhdGUoc2xvdHRlZC1mb290bm90ZSkpKSAmIHtcbiAgICBwYWRkaW5nLWJsb2NrLXN0YXJ0OiAwO1xuICB9XG5cbiAgQGluY2x1ZGUgc2JiLm1xKCRmcm9tOiBsYXJnZSkge1xuICAgIG1pbi1oZWlnaHQ6IHZhcigtLXNiYi10ZWFzZXItcHJvZHVjdC1jb250YWluZXItcGFkZGluZy1ibG9jayk7XG4gICAgcGFkZGluZy1ibG9jazogdmFyKC0tc2JiLXNwYWNpbmctcmVzcG9uc2l2ZS14cyk7XG4gIH1cbn1cbiIsImltcG9ydCB7IGh0bWwsIHVuc2FmZUNTUywgdHlwZSBUZW1wbGF0ZVJlc3VsdCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBwcm9wZXJ0eSB9IGZyb20gJ2xpdC9kZWNvcmF0b3JzLmpzJztcblxuaW1wb3J0IHR5cGUgeyBTYmJBY3Rpb25CYXNlRWxlbWVudCB9IGZyb20gJy4uLy4uL2NvcmUvYmFzZS1lbGVtZW50cy50cyc7XG5pbXBvcnQgeyB0eXBlIEFic3RyYWN0Q29uc3RydWN0b3IsIFNiYk5lZ2F0aXZlTWl4aW4gfSBmcm9tICcuLi8uLi9jb3JlL21peGlucy50cyc7XG5cbmltcG9ydCB0ZWFzZXJQcm9kdWN0Q29tbW9uU3R5bGVTdHJpbmcgZnJvbSAnLi90ZWFzZXItcHJvZHVjdC1jb21tb24uc2Nzcz9pbmxpbmUnO1xuXG5leHBvcnQgY29uc3QgdGVhc2VyUHJvZHVjdENvbW1vblN0eWxlID0gdW5zYWZlQ1NTKHRlYXNlclByb2R1Y3RDb21tb25TdHlsZVN0cmluZyk7XG5cbmV4cG9ydCBkZWNsYXJlIGNsYXNzIFNiYlRlYXNlclByb2R1Y3RDb21tb25FbGVtZW50TWl4aW5UeXBlIGV4dGVuZHMgU2JiTmVnYXRpdmVNaXhpbihcbiAgU2JiQWN0aW9uQmFzZUVsZW1lbnQsXG4pIHtcbiAgcHVibGljIGFjY2Vzc29yIGltYWdlQWxpZ25tZW50OiAnYWZ0ZXInIHwgJ2JlZm9yZSc7XG59XG5cbi8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbmV4cG9ydCBjb25zdCBTYmJUZWFzZXJQcm9kdWN0Q29tbW9uRWxlbWVudE1peGluID0gPFxuICBUIGV4dGVuZHMgQWJzdHJhY3RDb25zdHJ1Y3RvcjxTYmJBY3Rpb25CYXNlRWxlbWVudD4sXG4+KFxuICBzdXBlckNsYXNzOiBULFxuKTogQWJzdHJhY3RDb25zdHJ1Y3RvcjxTYmJUZWFzZXJQcm9kdWN0Q29tbW9uRWxlbWVudE1peGluVHlwZT4gJiBUID0+IHtcbiAgYWJzdHJhY3QgY2xhc3MgU2JiVGVhc2VyUHJvZHVjdENvbW1vbkVsZW1lbnRcbiAgICBleHRlbmRzIFNiYk5lZ2F0aXZlTWl4aW4oc3VwZXJDbGFzcylcbiAgICBpbXBsZW1lbnRzIFNiYlRlYXNlclByb2R1Y3RDb21tb25FbGVtZW50TWl4aW5UeXBlXG4gIHtcbiAgICAvKipcbiAgICAgKiBXaGV0aGVyIHRoZSBmdWxseSB2aXNpYmxlIHBhcnQgb2YgdGhlIGltYWdlIGlzIGFsaWduZWQgJ2JlZm9yZScgb3IgJ2FmdGVyJyB0aGUgY29udGVudC5cbiAgICAgKiBPbmx5IHJlbGV2YW50IHN0YXJ0aW5nIGZyb20gbGFyZ2UgYnJlYWtwb2ludC5cbiAgICAgKi9cbiAgICBAcHJvcGVydHkoeyBhdHRyaWJ1dGU6ICdpbWFnZS1hbGlnbm1lbnQnLCByZWZsZWN0OiB0cnVlIH0pXG4gICAgcHVibGljIGFjY2Vzc29yIGltYWdlQWxpZ25tZW50OiAnYWZ0ZXInIHwgJ2JlZm9yZScgPSAnYWZ0ZXInO1xuXG4gICAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlclRlbXBsYXRlKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICAgIHJldHVybiBodG1sYFxuICAgICAgICA8ZGl2IGNsYXNzPVwic2JiLXRlYXNlci1wcm9kdWN0X19yb290XCI+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cInNiYi10ZWFzZXItcHJvZHVjdF9faW1hZ2UtY29udGFpbmVyXCI+PHNsb3QgbmFtZT1cImltYWdlXCI+PC9zbG90PjwvZGl2PlxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJzYmItdGVhc2VyLXByb2R1Y3RfX2NvbnRhaW5lclwiPlxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJzYmItdGVhc2VyLXByb2R1Y3RfX2NvbnRlbnRcIj5cbiAgICAgICAgICAgICAgPHNsb3Q+PC9zbG90PlxuICAgICAgICAgICAgPC9zcGFuPlxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNiYi10ZWFzZXItcHJvZHVjdF9fZm9vdG5vdGVcIj5cbiAgICAgICAgICAgICAgPHNsb3QgbmFtZT1cImZvb3Rub3RlXCI+PC9zbG90PlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvZGl2PlxuICAgICAgYDtcbiAgICB9XG4gIH1cbiAgcmV0dXJuIFNiYlRlYXNlclByb2R1Y3RDb21tb25FbGVtZW50IGFzIEFic3RyYWN0Q29uc3RydWN0b3I8U2JiVGVhc2VyUHJvZHVjdENvbW1vbkVsZW1lbnRNaXhpblR5cGU+ICZcbiAgICBUO1xufTtcbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FDUUEsSUFBYSwyQkFBMkIscXlKQUF5QztBQVNqRixJQUFhLHNDQUdYLGVBQ21FO0FBNEJuRSxlQTNCNEM7b0JBQ2xDLGlCQUFpQixXQUFXOzs7O2VBRHZCLHNDQUNMLFlBQTRCOzs7a0NBT25DLFNBQVM7S0FBRSxXQUFXO0tBQW1CLFNBQVM7S0FBTSxDQUFDLENBQUE7QUFDMUQsaUJBQUEsTUFBQSxNQUFBLDRCQUFBO0tBQUEsTUFBQTtLQUFBLE1BQUE7S0FBQSxRQUFBO0tBQUEsU0FBQTtLQUFBLFFBQUE7TUFBQSxNQUFBLFFBQUEsb0JBQUE7TUFBQSxNQUFBLFFBQUEsSUFBZ0I7TUFBYyxNQUFBLEtBQUEsVUFBQTtBQUFBLFdBQWQsaUJBQWM7O01BQUE7S0FBQSxVQUFBO0tBQUEsRUFBQSw4QkFBQSxrQ0FBQTs7Ozs7Ozs7R0FBOUIsbUNBQUEsa0JBQUEsTUFBQSw4QkFBcUQsUUFBTzs7Ozs7R0FBNUQsSUFBZ0IsaUJBQWM7QUFBQSxXQUFBLE1BQUE7O0dBQTlCLElBQWdCLGVBQWMsT0FBQTtBQUFBLFVBQUEsa0NBQUE7O0dBRVgsaUJBQWM7QUFDL0IsV0FBTyxJQUFJIn0=
package/development/teaser-product.component-DjAMYUmw.js DELETED
@@ -1,43 +0,0 @@
1
- import { unsafeCSS } from "lit";
2
- import { SbbLinkBaseElement } from "./core/base-elements.js";
3
- import { boxSizingStyles } from "./core/styles.js";
4
- import { html as html$1 } from "lit/static-html.js";
5
- import "./screen-reader-only.js";
6
- import { SbbTeaserProductCommonElementMixin, teaserProductCommonStyle } from "./teaser-product/common/teaser-product-common.js";
7
- //#region src/elements/teaser-product/teaser-product/teaser-product.scss?inline
8
- var teaser_product_default = ":host {\n --sbb-teaser-product-border-radius: var(--sbb-border-radius-4x);\n}\n@media (forced-colors: active) {\n :host {\n --sbb-title-text-color-normal-override: LinkText !important;\n --sbb-teaser-product-content-color: LinkText !important;\n --sbb-teaser-product-footer-color: LinkText !important;\n }\n}\n\n.sbb-teaser-product__wrapper {\n position: relative;\n}\n\n.sbb-teaser-product__root {\n pointer-events: none;\n}\n@media (forced-colors: active) {\n :host(:hover) .sbb-teaser-product__root::after {\n border-color: Highlight;\n }\n}\n\n.sbb-teaser-product {\n position: absolute;\n inset: 0;\n}\n.sbb-teaser-product: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-teaser-product-border-radius);\n}";
9
- //#endregion
10
- //#region src/elements/teaser-product/teaser-product/teaser-product.component.ts
11
- /**
12
- * Displays a text and a footnote, combined with an image, to tease a product
13
- *
14
- * @slot - Use this slot to provide the main content.
15
- * @slot image - Use this slot to provide an image or a `sbb-image` as a background.
16
- * @slot footnote - Use this slot to provide a footnote.
17
- * @cssprop [--sbb-teaser-product-background-gradient-start=25%] - At which percentage the background should start getting transparent.
18
- * @cssprop [--sbb-teaser-product-background-gradient-end=75%] - At which percentage the background should be fully transparent.
19
- */
20
- var SbbTeaserProductElement = class extends SbbTeaserProductCommonElementMixin(SbbLinkBaseElement) {
21
- static {
22
- this.elementName = "sbb-teaser-product";
23
- }
24
- static {
25
- this.styles = [
26
- boxSizingStyles,
27
- teaserProductCommonStyle,
28
- unsafeCSS(teaser_product_default)
29
- ];
30
- }
31
- render() {
32
- return html$1`
33
- <div class="sbb-teaser-product__wrapper">
34
- ${this.renderLink(html$1`<sbb-screen-reader-only>${this.accessibilityLabel}</sbb-screen-reader-only>`)}
35
- ${this.renderTemplate()}
36
- </div>
37
- `;
38
- }
39
- };
40
- //#endregion
41
- export { SbbTeaserProductElement as t };
42
-
43
- //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGVhc2VyLXByb2R1Y3QuY29tcG9uZW50LURqQU1ZVW13LmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy90ZWFzZXItcHJvZHVjdC90ZWFzZXItcHJvZHVjdC90ZWFzZXItcHJvZHVjdC5zY3NzP2lubGluZSIsIi4uLy4uLy4uL3NyYy9lbGVtZW50cy90ZWFzZXItcHJvZHVjdC90ZWFzZXItcHJvZHVjdC90ZWFzZXItcHJvZHVjdC5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vLi4vY29yZS9zdHlsZXMnIGFzIHNiYjtcblxuOmhvc3Qge1xuICAtLXNiYi10ZWFzZXItcHJvZHVjdC1ib3JkZXItcmFkaXVzOiB2YXIoLS1zYmItYm9yZGVyLXJhZGl1cy00eCk7XG5cbiAgLy8gU2ltdWxhdGUgbGluayBjb2xvciBvcHRpY2FsbHlcbiAgQGluY2x1ZGUgc2JiLmlmLWZvcmNlZC1jb2xvcnMge1xuICAgIC0tc2JiLXRpdGxlLXRleHQtY29sb3Itbm9ybWFsLW92ZXJyaWRlOiBMaW5rVGV4dCAhaW1wb3J0YW50O1xuICAgIC0tc2JiLXRlYXNlci1wcm9kdWN0LWNvbnRlbnQtY29sb3I6IExpbmtUZXh0ICFpbXBvcnRhbnQ7XG4gICAgLS1zYmItdGVhc2VyLXByb2R1Y3QtZm9vdGVyLWNvbG9yOiBMaW5rVGV4dCAhaW1wb3J0YW50O1xuICB9XG59XG5cbi5zYmItdGVhc2VyLXByb2R1Y3RfX3dyYXBwZXIge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG5cbi5zYmItdGVhc2VyLXByb2R1Y3RfX3Jvb3Qge1xuICBwb2ludGVyLWV2ZW50czogbm9uZTtcblxuICBAaW5jbHVkZSBzYmIuaWYtZm9yY2VkLWNvbG9ycyB7XG4gICAgJjo6YWZ0ZXIge1xuICAgICAgOmhvc3QoOmhvdmVyKSAmIHtcbiAgICAgICAgYm9yZGVyLWNvbG9yOiBIaWdobGlnaHQ7XG4gICAgICB9XG4gICAgfVxuICB9XG59XG5cbi5zYmItdGVhc2VyLXByb2R1Y3Qge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGluc2V0OiAwO1xuXG4gICY6Zm9jdXMtdmlzaWJsZSB7XG4gICAgQGluY2x1ZGUgc2JiLmZvY3VzLW91dGxpbmU7XG5cbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1zYmItdGVhc2VyLXByb2R1Y3QtYm9yZGVyLXJhZGl1cyk7XG4gIH1cbn1cbiIsImltcG9ydCB7IHR5cGUgQ1NTUmVzdWx0R3JvdXAsIHR5cGUgVGVtcGxhdGVSZXN1bHQsIHVuc2FmZUNTUyB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBodG1sIH0gZnJvbSAnbGl0L3N0YXRpYy1odG1sLmpzJztcblxuaW1wb3J0IHsgU2JiTGlua0Jhc2VFbGVtZW50IH0gZnJvbSAnLi4vLi4vY29yZS9iYXNlLWVsZW1lbnRzLnRzJztcbmltcG9ydCB7IGJveFNpemluZ1N0eWxlcyB9IGZyb20gJy4uLy4uL2NvcmUvc3R5bGVzLnRzJztcbmltcG9ydCB7XG4gIFNiYlRlYXNlclByb2R1Y3RDb21tb25FbGVtZW50TWl4aW4sXG4gIHRlYXNlclByb2R1Y3RDb21tb25TdHlsZSxcbn0gZnJvbSAnLi4vY29tbW9uL3RlYXNlci1wcm9kdWN0LWNvbW1vbi50cyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL3RlYXNlci1wcm9kdWN0LnNjc3M/aW5saW5lJztcblxuaW1wb3J0ICcuLi8uLi9zY3JlZW4tcmVhZGVyLW9ubHkudHMnO1xuXG4vKipcbiAqIERpc3BsYXlzIGEgdGV4dCBhbmQgYSBmb290bm90ZSwgY29tYmluZWQgd2l0aCBhbiBpbWFnZSwgdG8gdGVhc2UgYSBwcm9kdWN0XG4gKlxuICogQHNsb3QgLSBVc2UgdGhpcyBzbG90IHRvIHByb3ZpZGUgdGhlIG1haW4gY29udGVudC5cbiAqIEBzbG90IGltYWdlIC0gVXNlIHRoaXMgc2xvdCB0byBwcm92aWRlIGFuIGltYWdlIG9yIGEgYHNiYi1pbWFnZWAgYXMgYSBiYWNrZ3JvdW5kLlxuICogQHNsb3QgZm9vdG5vdGUgLSBVc2UgdGhpcyBzbG90IHRvIHByb3ZpZGUgYSBmb290bm90ZS5cbiAqIEBjc3Nwcm9wIFstLXNiYi10ZWFzZXItcHJvZHVjdC1iYWNrZ3JvdW5kLWdyYWRpZW50LXN0YXJ0PTI1JV0gLSBBdCB3aGljaCBwZXJjZW50YWdlIHRoZSBiYWNrZ3JvdW5kIHNob3VsZCBzdGFydCBnZXR0aW5nIHRyYW5zcGFyZW50LlxuICogQGNzc3Byb3AgWy0tc2JiLXRlYXNlci1wcm9kdWN0LWJhY2tncm91bmQtZ3JhZGllbnQtZW5kPTc1JV0gLSBBdCB3aGljaCBwZXJjZW50YWdlIHRoZSBiYWNrZ3JvdW5kIHNob3VsZCBiZSBmdWxseSB0cmFuc3BhcmVudC5cbiAqL1xuZXhwb3J0IGNsYXNzIFNiYlRlYXNlclByb2R1Y3RFbGVtZW50IGV4dGVuZHMgU2JiVGVhc2VyUHJvZHVjdENvbW1vbkVsZW1lbnRNaXhpbihcbiAgU2JiTGlua0Jhc2VFbGVtZW50LFxuKSB7XG4gIHB1YmxpYyBzdGF0aWMgb3ZlcnJpZGUgcmVhZG9ubHkgZWxlbWVudE5hbWU6IHN0cmluZyA9ICdzYmItdGVhc2VyLXByb2R1Y3QnO1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBbXG4gICAgYm94U2l6aW5nU3R5bGVzLFxuICAgIHRlYXNlclByb2R1Y3RDb21tb25TdHlsZSxcbiAgICB1bnNhZmVDU1Moc3R5bGUpLFxuICBdO1xuXG4gIHByb3RlY3RlZCBvdmVycmlkZSByZW5kZXIoKTogVGVtcGxhdGVSZXN1bHQge1xuICAgIC8vIFdlIHJlbmRlciB0aGUgY29udGVudCBvdXRzaWRlIHRoZSBhbmNob3IgdGFnIHRvIGFsbG93IHNjcmVlbiByZWFkZXJzIHRvIG5hdmlnYXRlIHRocm91Z2ggaXRcbiAgICByZXR1cm4gaHRtbGBcbiAgICAgIDxkaXYgY2xhc3M9XCJzYmItdGVhc2VyLXByb2R1Y3RfX3dyYXBwZXJcIj5cbiAgICAgICAgJHt0aGlzLnJlbmRlckxpbmsoXG4gICAgICAgICAgLy8gRm9yIFNFTywgd2UgYWRkIHRoZSBhY2Nlc3NpYmlsaXR5IGhpZGRlbiBhcyBoaWRkZW4gY29udGVudCBvZiB0aGUgbGlua1xuICAgICAgICAgIGh0bWxgPHNiYi1zY3JlZW4tcmVhZGVyLW9ubHk+JHt0aGlzLmFjY2Vzc2liaWxpdHlMYWJlbH08L3NiYi1zY3JlZW4tcmVhZGVyLW9ubHk+YCxcbiAgICAgICAgKX1cbiAgICAgICAgJHt0aGlzLnJlbmRlclRlbXBsYXRlKCl9XG4gICAgICA8L2Rpdj5cbiAgICBgO1xuICB9XG59XG5cbmRlY2xhcmUgZ2xvYmFsIHtcbiAgaW50ZXJmYWNlIEhUTUxFbGVtZW50VGFnTmFtZU1hcCB7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uYW1pbmctY29udmVudGlvblxuICAgICdzYmItdGVhc2VyLXByb2R1Y3QnOiBTYmJUZWFzZXJQcm9kdWN0RWxlbWVudDtcbiAgfVxufVxuIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FDdUJBLElBQWEsMEJBQWIsY0FBNkMsbUNBQzNDLG1CQUNELENBQUE7O0FBQ2lDLE9BQUEsY0FBc0I7OztBQUMvQixPQUFBLFNBQXlCO0dBQzlDO0dBQ0E7R0FDQSxVQUFVLHVCQUFBO0dBQ1g7O0NBRWtCLFNBQU07QUFFdkIsU0FBTyxNQUFJOztVQUVMLEtBQUssV0FFTCxNQUFJLDJCQUEyQixLQUFLLG1CQUFrQiwyQkFDdkQsQ0FBQTtVQUNDLEtBQUssZ0JBQWdCLENBQUEifQ==
package/teaser-product-common-qTPSq_o7.js DELETED
@@ -1,63 +0,0 @@
1
- import { __esDecorate as e, __runInitializers as t } from "tslib";
2
- import { html as n, unsafeCSS as r } from "lit";
3
- import { property as i } from "lit/decorators.js";
4
- import { SbbNegativeMixin as a } from "./core/mixins.js";
5
- //#endregion
6
- //#region src/elements/teaser-product/common/teaser-product-common.ts
7
- var o = r(":host{display:block;--sbb-teaser-product-background-color: var(--sbb-color-cloud);--sbb-teaser-product-background-color: light-dark( var(--sbb-color-cloud), var(--sbb-color-midnight) );--sbb-teaser-product-background-gradient-direction: to right;--sbb-teaser-product-background: var(--sbb-teaser-product-background-color);--sbb-teaser-product-border-radius: var(--sbb-border-radius-4x);--sbb-teaser-product-content-color: var(--sbb-color-4);--sbb-teaser-product-footer-color: var(--sbb-color-anthracite);--sbb-teaser-product-footer-color: light-dark( var(--sbb-color-anthracite), var(--sbb-color-cloud) );--sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-l);--sbb-teaser-product-min-height: 37.5rem;--sbb-teaser-product-background-gradient-start: 25%;--sbb-teaser-product-background-gradient-end: 75%}@media(min-width:64rem){:host{--sbb-teaser-product-background: linear-gradient( var(--sbb-teaser-product-background-gradient-direction), var(--sbb-teaser-product-background-color) var(--sbb-teaser-product-background-gradient-start), transparent var(--sbb-teaser-product-background-gradient-end) )}}:host([negative]){--sbb-teaser-product-background-color: var(--sbb-background-color-1-negative);--sbb-teaser-product-content-color: var(--sbb-color-4-negative);--sbb-teaser-product-footer-color: var(--sbb-color-4-negative);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-title-text-color-normal-override: var(--sbb-color-3-negative)}:host([image-alignment=before]){--sbb-teaser-product-background-gradient-direction: to left}.sbb-teaser-product__image-container{overflow:hidden;border-radius:var(--sbb-teaser-product-border-radius) var(--sbb-teaser-product-border-radius) 0 0}@media(min-width:64rem){.sbb-teaser-product__image-container{position:absolute;inset:0;border-radius:var(--sbb-teaser-product-border-radius)}}::slotted(p.sbb-teaser-product--spacing){margin:0}::slotted(sbb-title.sbb-teaser-product--spacing){margin-block-start:0}::slotted(:is(sbb-action-group,:is(:state(action),[state--action])).sbb-teaser-product--spacing){margin-block-start:var(--sbb-spacing-responsive-xxs)}::slotted([slot=image]){display:flex;width:100%;height:100%}@media(forced-colors:active){.sbb-teaser-product__root:after{content:\"\";position:absolute;display:block;inset:0;pointer-events:none;border:var(--sbb-border-width-2x) solid CanvasText;border-radius:var(--sbb-teaser-product-border-radius)}}.sbb-action-base{display:block;position:relative;text-decoration:none}.sbb-teaser-product__container{background:var(--sbb-teaser-product-background);border-radius:0 0 var(--sbb-teaser-product-border-radius) var(--sbb-teaser-product-border-radius);padding:var(--sbb-spacing-responsive-s)}@media(min-width:64rem){.sbb-teaser-product__container{display:grid;grid:\"content .\" 1fr \"footnote .\" auto/1fr 1fr;column-gap:var(--sbb-spacing-responsive-xxl);background:var(--sbb-teaser-product-background);border-radius:var(--sbb-teaser-product-border-radius);padding-block:var(--sbb-teaser-product-container-padding-block) 0;padding-inline:var(--sbb-spacing-responsive-xl);position:relative}:host([image-alignment=before]) .sbb-teaser-product__container{grid-template-areas:\". content\" \". footnote\"}}.sbb-teaser-product__content{grid-area:content;align-self:center;margin:0;color:var(--sbb-teaser-product-content-color)}@media(min-width:64rem){.sbb-teaser-product__content{align-content:center;min-height:calc(var(--sbb-teaser-product-min-height) - 2 * var(--sbb-teaser-product-container-padding-block))}}.sbb-teaser-product__footnote{grid-area:footnote;padding-block-start:var(--sbb-spacing-responsive-s);color:var(--sbb-teaser-product-footer-color);--sbb-text-font-size: var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}:host(:not(:is(:state(slotted-footnote),[state--slotted-footnote]))) .sbb-teaser-product__footnote{padding-block-start:0}@media(min-width:64rem){.sbb-teaser-product__footnote{min-height:var(--sbb-teaser-product-container-padding-block);padding-block:var(--sbb-spacing-responsive-xs)}}"), s = (r) => (() => {
8
- let o = a(r), s, c = [], l = [];
9
- return class extends o {
10
- static {
11
- let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
12
- s = [i({
13
- attribute: "image-alignment",
14
- reflect: !0
15
- })], e(this, null, s, {
16
- kind: "accessor",
17
- name: "imageAlignment",
18
- static: !1,
19
- private: !1,
20
- access: {
21
- has: (e) => "imageAlignment" in e,
22
- get: (e) => e.imageAlignment,
23
- set: (e, t) => {
24
- e.imageAlignment = t;
25
- }
26
- },
27
- metadata: t
28
- }, c, l), t && Object.defineProperty(this, Symbol.metadata, {
29
- enumerable: !0,
30
- configurable: !0,
31
- writable: !0,
32
- value: t
33
- });
34
- }
35
- #e = t(this, c, "after");
36
- get imageAlignment() {
37
- return this.#e;
38
- }
39
- set imageAlignment(e) {
40
- this.#e = e;
41
- }
42
- renderTemplate() {
43
- return n`
44
- <div class="sbb-teaser-product__root">
45
- <div class="sbb-teaser-product__image-container"><slot name="image"></slot></div>
46
- <div class="sbb-teaser-product__container">
47
- <span class="sbb-teaser-product__content">
48
- <slot></slot>
49
- </span>
50
- <div class="sbb-teaser-product__footnote">
51
- <slot name="footnote"></slot>
52
- </div>
53
- </div>
54
- </div>
55
- `;
56
- }
57
- constructor() {
58
- super(...arguments), t(this, l);
59
- }
60
- };
61
- })();
62
- //#endregion
63
- export { o as n, s as t };