@sbb-esta/lyne-elements 4.0.1 → 4.0.3

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 (27) hide show
  1. package/autocomplete/autocomplete-base-element.d.ts.map +1 -1
  2. package/autocomplete/autocomplete-base-element.js +6 -5
  3. package/autocomplete/autocomplete.component.d.ts.map +1 -1
  4. package/autocomplete/autocomplete.component.js +8 -9
  5. package/calendar/calendar.component.d.ts +3 -0
  6. package/calendar/calendar.component.d.ts.map +1 -1
  7. package/calendar/calendar.component.js +89 -86
  8. package/core/styles/core.scss +7 -9
  9. package/core/styles/mixins/link.scss +4 -7
  10. package/core/styles/mixins/lists.scss +3 -3
  11. package/core/styles/mixins/pearl-chain-bullet.scss +3 -8
  12. package/core/styles/mixins/scrollbar.scss +1 -0
  13. package/core/styles/mixins/table.scss +15 -17
  14. package/custom-elements.json +1022 -1003
  15. package/development/autocomplete/autocomplete-base-element.d.ts.map +1 -1
  16. package/development/autocomplete/autocomplete-base-element.js +7 -6
  17. package/development/autocomplete/autocomplete.component.d.ts.map +1 -1
  18. package/development/autocomplete/autocomplete.component.js +13 -15
  19. package/development/calendar/calendar.component.d.ts +3 -0
  20. package/development/calendar/calendar.component.d.ts.map +1 -1
  21. package/development/calendar/calendar.component.js +44 -35
  22. package/development/notification/notification.component.js +9 -11
  23. package/development/option/option/option-base-element.js +2 -2
  24. package/loading-indicator-circle/loading-indicator-circle.component.js +1 -1
  25. package/notification/notification.component.js +1 -1
  26. package/option/option/option-base-element.js +1 -1
  27. package/package.json +1 -1
package/core/styles/core.scss CHANGED
@@ -269,15 +269,13 @@ html {
269
269
  :where(textarea) {
270
270
  @include scrollbar.scrollbar;
271
271
 
272
- & {
273
- position: relative;
274
- resize: none;
275
-
276
- // White-space break needed for Firefox
277
- white-space: break-spaces;
278
- overflow-y: auto;
279
- min-height: calc((var(--sbb-typo-line-height-text) * 1em));
280
- }
272
+ position: relative;
273
+ resize: none;
274
+
275
+ // White-space break needed for Firefox
276
+ white-space: break-spaces;
277
+ overflow-y: auto;
278
+ min-height: calc((var(--sbb-typo-line-height-text) * 1em));
281
279
  }
282
280
 
283
281
  &[size='l'] :where(textarea) {
package/core/styles/mixins/link.scss CHANGED
@@ -107,14 +107,11 @@
107
107
  @mixin link-consolidation {
108
108
  @include typo.text-inherit;
109
109
  @include link-base;
110
+ @include link-focus-visible;
111
+ @include link-hover;
110
112
 
111
- & {
112
- @include link-focus-visible;
113
- @include link-hover;
114
-
115
- // Active definitions have to be after :hover definitions
116
- @include link-active;
117
- }
113
+ // Active definitions have to be after :hover definitions
114
+ @include link-active;
118
115
  }
119
116
 
120
117
  @mixin link {
package/core/styles/mixins/lists.scss CHANGED
@@ -14,7 +14,7 @@
14
14
  @mixin list {
15
15
  // Support both top level usage (& is empty / falsy)
16
16
  // and applied to a selector usage.
17
- #{if(&, '&:where(ol, ul)', ':is(ol, ul)')} {
17
+ #{if(sass(&): "&:where(ol, ul)"; else: ":is(ol, ul)")} {
18
18
  --sbb-list-vertical-gap: 0.75em;
19
19
  --sbb-list-padding-inline-start: 1.5em;
20
20
 
@@ -48,7 +48,7 @@
48
48
 
49
49
  // Support both top level usage (& is empty / falsy)
50
50
  // and applied to a selector usage.
51
- #{if(&, '&:where(ul)', 'ul')} {
51
+ #{if(sass(&): "&:where(ul)"; else: "ul")} {
52
52
  &,
53
53
  ul {
54
54
  list-style-type: none;
@@ -79,7 +79,7 @@
79
79
  @mixin description-list {
80
80
  // Support both top level usage (& is empty / falsy)
81
81
  // and applied to a selector usage.
82
- #{if(&, '&:where(dl)', 'dl')} {
82
+ #{if(sass(&): "&:where(dl)"; else: "dl")} {
83
83
  @include typo.text-s--regular;
84
84
 
85
85
  margin: 0;
package/core/styles/mixins/pearl-chain-bullet.scss CHANGED
@@ -107,10 +107,7 @@
107
107
  @mixin pearl-chain-bullet-position {
108
108
  @include pearl-chain-bullet-start-end;
109
109
  @include pearl-chain-bullet;
110
-
111
- & {
112
- @include pearl-chain-bullet-disruption;
113
- }
110
+ @include pearl-chain-bullet-disruption;
114
111
 
115
112
  @keyframes pearl-chain-bullet-position-pulse {
116
113
  0% {
@@ -131,8 +128,6 @@
131
128
  }
132
129
  }
133
130
 
134
- & {
135
- animation: pearl-chain-bullet-position-pulse var(--sbb-pearl-chain-bullet-animation-duration)
136
- var(--sbb-pearl-chain-bullet-animation-easing) infinite;
137
- }
131
+ animation: pearl-chain-bullet-position-pulse var(--sbb-pearl-chain-bullet-animation-duration)
132
+ var(--sbb-pearl-chain-bullet-animation-easing) infinite;
138
133
  }
package/core/styles/mixins/scrollbar.scss CHANGED
@@ -40,6 +40,7 @@
40
40
  // We have to use the `not` selector as Chrome supports both, the -webkit-* and the following properties.
41
41
  // As long as possible we use the -webkit-* approach as we have more styling possibilities there.
42
42
  @supports not selector(::-webkit-scrollbar) {
43
+ // stylelint-disable-next-line block-no-redundant-nested-style-rules
43
44
  & {
44
45
  scrollbar-width: var(--sbb-scrollbar-width-firefox);
45
46
  scrollbar-color: var(--sbb-scrollbar-color, currentcolor)
package/core/styles/mixins/table.scss CHANGED
@@ -8,23 +8,21 @@
8
8
  @include table--m;
9
9
  @include table--striped;
10
10
 
11
- & {
12
- --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
13
- --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
14
- --sbb-table-background-color: var(--sbb-background-color-1);
15
- --sbb-table-row-striped-color: var(--sbb-background-color-3);
16
- --sbb-table-color: var(--sbb-color-1);
17
- --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
18
- --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
19
- --sbb-table-sticky-shadow-width: 3rem;
20
- --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
21
- --sbb-table-sticky-shadow-transition-duration: var(--sbb-animation-duration-6x);
22
-
23
- border-spacing: 0;
24
- caption-side: bottom;
25
- color: var(--sbb-table-color);
26
- table-layout: auto;
27
- }
11
+ --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
12
+ --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
13
+ --sbb-table-background-color: var(--sbb-background-color-1);
14
+ --sbb-table-row-striped-color: var(--sbb-background-color-3);
15
+ --sbb-table-color: var(--sbb-color-1);
16
+ --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
17
+ --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
18
+ --sbb-table-sticky-shadow-width: 3rem;
19
+ --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
20
+ --sbb-table-sticky-shadow-transition-duration: var(--sbb-animation-duration-6x);
21
+
22
+ border-spacing: 0;
23
+ caption-side: bottom;
24
+ color: var(--sbb-table-color);
25
+ table-layout: auto;
28
26
 
29
27
  thead {
30
28
  & > tr {