@db-ux/core-components 4.5.4 → 4.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/CHANGELOG.md +38 -15
  2. package/README.md +44 -19
  3. package/agent/Best-Practise_Common-AI-Mistakes.md +83 -1
  4. package/agent/_instructions.md +19 -0
  5. package/build/components/accordion/accordion.css +0 -34
  6. package/build/components/accordion-item/accordion-item.css +3 -94
  7. package/build/components/badge/badge.css +6 -102
  8. package/build/components/brand/brand.css +3 -94
  9. package/build/components/button/button.css +6 -100
  10. package/build/components/card/card.css +0 -34
  11. package/build/components/checkbox/checkbox.css +6 -100
  12. package/build/components/custom-button/custom-button.css +6 -100
  13. package/build/components/custom-select/custom-select.css +459 -572
  14. package/build/components/custom-select-dropdown/custom-select-dropdown.css +147 -238
  15. package/build/components/custom-select-form-field/custom-select-form-field.css +0 -88
  16. package/build/components/custom-select-list/custom-select-list.css +0 -88
  17. package/build/components/custom-select-list-item/custom-select-list-item.css +3 -94
  18. package/build/components/divider/divider.css +0 -34
  19. package/build/components/drawer/drawer.css +10 -44
  20. package/build/components/drawer/drawer.scss +4 -10
  21. package/build/components/header/header.css +255 -373
  22. package/build/components/icon/icon.css +0 -34
  23. package/build/components/infotext/infotext.css +6 -100
  24. package/build/components/input/input.css +306 -416
  25. package/build/components/link/link.css +6 -100
  26. package/build/components/navigation/navigation.css +0 -88
  27. package/build/components/navigation-item/navigation-item.css +21 -101
  28. package/build/components/navigation-item/navigation-item.scss +9 -12
  29. package/build/components/notification/notification.css +741 -868
  30. package/build/components/page/page.css +0 -34
  31. package/build/components/popover/popover.css +0 -34
  32. package/build/components/radio/radio.css +6 -100
  33. package/build/components/section/section.css +0 -34
  34. package/build/components/select/select.css +306 -416
  35. package/build/components/stack/stack-web-component.css +0 -34
  36. package/build/components/stack/stack.css +0 -34
  37. package/build/components/switch/switch.css +9 -106
  38. package/build/components/tab-item/tab-item.css +0 -88
  39. package/build/components/tab-list/tab-list.css +3 -94
  40. package/build/components/tab-panel/tab-panel.css +0 -34
  41. package/build/components/tabs/tabs.css +0 -88
  42. package/build/components/tag/tag.css +741 -854
  43. package/build/components/textarea/textarea.css +12 -116
  44. package/build/components/tooltip/tooltip.css +3 -94
  45. package/build/styles/absolute.css +1641 -1669
  46. package/build/styles/absolute.scss +2 -4
  47. package/build/styles/bundle.css +1989 -0
  48. package/build/styles/bundle.scss +15 -0
  49. package/build/styles/dialog-init.css +1 -1
  50. package/build/styles/dialog-init.scss +1 -1
  51. package/build/styles/index.css +487 -515
  52. package/build/styles/relative.css +1641 -1669
  53. package/build/styles/relative.scss +2 -15
  54. package/build/styles/rollup.css +1641 -1669
  55. package/build/styles/rollup.scss +2 -4
  56. package/build/styles/visually-hidden.css +1 -1
  57. package/build/styles/webpack.css +1641 -1669
  58. package/build/styles/webpack.scss +2 -4
  59. package/package.json +7 -7
package/build/components/divider/divider.css CHANGED
@@ -1,38 +1,4 @@
1
1
  /* Variants for adaptive components like input, select, notification, ... */
2
- @layer variables {}
3
-
4
- @layer variables {}
5
-
6
- @layer variables {}
7
-
8
- @layer variables {}
9
-
10
- @layer variables {}
11
-
12
- @layer variables {}
13
-
14
- @layer variables {}
15
-
16
- @layer variables {}
17
-
18
- @layer variables {}
19
-
20
- @layer variables {}
21
-
22
- @layer variables {}
23
-
24
- @layer variables {}
25
-
26
- @layer variables {}
27
-
28
- @layer variables {}
29
-
30
- @layer variables {}
31
-
32
- @layer variables {}
33
-
34
- @layer variables {}
35
-
36
2
  .db-divider:is(:not([data-margin]), [data-margin=small]) {
37
3
  margin: var(--db-spacing-fixed-sm) 0;
38
4
  }
package/build/components/drawer/drawer.css CHANGED
@@ -1,38 +1,4 @@
1
1
  /* Variants for adaptive components like input, select, notification, ... */
2
- @layer variables {}
3
-
4
- @layer variables {}
5
-
6
- @layer variables {}
7
-
8
- @layer variables {}
9
-
10
- @layer variables {}
11
-
12
- @layer variables {}
13
-
14
- @layer variables {}
15
-
16
- @layer variables {}
17
-
18
- @layer variables {}
19
-
20
- @layer variables {}
21
-
22
- @layer variables {}
23
-
24
- @layer variables {}
25
-
26
- @layer variables {}
27
-
28
- @layer variables {}
29
-
30
- @layer variables {}
31
-
32
- @layer variables {}
33
-
34
- @layer variables {}
35
-
36
2
  @keyframes popover-animation {
37
3
  0% {
38
4
  pointer-events: none;
@@ -50,30 +16,30 @@
50
16
  transform: rotate(1turn);
51
17
  }
52
18
  }
53
- dialog {
19
+ dialog[class^=db-] {
54
20
  padding: 0;
55
21
  margin: 0;
56
22
  border: 0;
57
23
  z-index: 9996;
58
24
  color: inherit;
59
25
  }
60
- dialog:not([data-position=absolute])[data-variant], dialog:not([data-position=absolute])[data-backdrop] {
26
+ dialog[class^=db-]:not([data-position=absolute])[data-variant], dialog[class^=db-]:not([data-position=absolute])[data-backdrop] {
61
27
  position: fixed;
62
28
  inset: 0;
63
29
  z-index: 9995;
64
30
  }
65
- dialog:not([data-position=absolute])[data-variant=inside]:not([data-backdrop=none])::before {
31
+ dialog[class^=db-]:not([data-position=absolute])[data-variant=inside]:not([data-backdrop=none])::before {
66
32
  content: "";
67
33
  position: fixed;
68
34
  inset: 0;
69
35
  }
70
- dialog:not([data-backdrop=none])::backdrop, dialog:not([data-backdrop=none])::before {
36
+ dialog[class^=db-]:not([data-backdrop=none])::backdrop, dialog[class^=db-]:not([data-backdrop=none])::before {
71
37
  background-color: color(from var(--db-adaptive-on-bg-basic-emphasis-100-default) srgb r g b/var(--db-opacity-lg));
72
38
  }
73
- dialog:not([data-backdrop=none])[data-backdrop=invisible]::backdrop, dialog:not([data-backdrop=none])[data-backdrop=invisible]::before {
39
+ dialog[class^=db-]:not([data-backdrop=none])[data-backdrop=invisible]::backdrop, dialog[class^=db-]:not([data-backdrop=none])[data-backdrop=invisible]::before {
74
40
  background-color: transparent;
75
41
  }
76
- dialog:not([data-backdrop=none])[data-backdrop=weak]::backdrop, dialog:not([data-backdrop=none])[data-backdrop=weak]::before {
42
+ dialog[class^=db-]:not([data-backdrop=none])[data-backdrop=weak]::backdrop, dialog[class^=db-]:not([data-backdrop=none])[data-backdrop=weak]::before {
77
43
  background-color: color(from var(--db-adaptive-on-bg-basic-emphasis-100-default) srgb r g b/var(--db-opacity-sm));
78
44
  }
79
45
 
@@ -99,7 +65,7 @@ dialog:not([data-backdrop=none])[data-backdrop=weak]::backdrop, dialog:not([data
99
65
  /* stylelint-disable-next-line db-ux/use-sizing */
100
66
  max-block-size: var(--db-drawer-max-height, calc(100% - var(--db-spacing-fixed-xl)));
101
67
  /* stylelint-disable-next-line db-ux/use-sizing */
102
- min-block-size: var(--db-drawer-min-height, calc(100% - var(--db-spacing-fixed-xl)));
68
+ min-block-size: var(--db-drawer-min-height, auto);
103
69
  max-inline-size: none;
104
70
  }
105
71
 
@@ -220,7 +186,7 @@ dialog:not([data-backdrop=none])[data-backdrop=weak]::backdrop, dialog:not([data
220
186
  /* stylelint-disable-next-line db-ux/use-sizing */
221
187
  max-inline-size: var(--db-drawer-max-width, calc(100% - var(--db-spacing-fixed-xl)));
222
188
  /* stylelint-disable-next-line db-ux/use-sizing */
223
- min-inline-size: var(--db-drawer-min-width, calc(100% - var(--db-spacing-fixed-xl)));
189
+ min-inline-size: var(--db-drawer-min-width, auto);
224
190
  }
225
191
  .db-drawer .db-drawer-container:not([data-width=full]):not([data-direction]), .db-drawer .db-drawer-container:not([data-width=full])[data-direction=right] {
226
192
  border-inline-start: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
@@ -302,10 +268,10 @@ dialog:not([data-backdrop=none])[data-backdrop=weak]::backdrop, dialog:not([data
302
268
  position: relative;
303
269
  }
304
270
  .db-drawer[open] .db-drawer-container[data-transition=open]:not([data-direction]), .db-drawer[open] .db-drawer-container[data-transition=open][data-direction=right], .db-drawer[open] .db-drawer-container[data-transition=open][data-direction=left] {
305
- transform: translateX(0%);
271
+ transform: none;
306
272
  }
307
273
  .db-drawer[open] .db-drawer-container[data-transition=open][data-direction=up], .db-drawer[open] .db-drawer-container[data-transition=open][data-direction=down] {
308
- transform: translateY(0%);
274
+ transform: none;
309
275
  }
310
276
  @media (prefers-reduced-motion: no-preference) {
311
277
  .db-drawer[open] .db-drawer-container[data-transition=close] {
package/build/components/drawer/drawer.scss CHANGED
@@ -38,10 +38,7 @@
38
38
  calc(100% - #{variables.$db-spacing-fixed-xl})
39
39
  );
40
40
  /* stylelint-disable-next-line db-ux/use-sizing */
41
- min-block-size: var(
42
- --db-drawer-min-height,
43
- calc(100% - #{variables.$db-spacing-fixed-xl})
44
- );
41
+ min-block-size: var(--db-drawer-min-height, auto);
45
42
  max-inline-size: none;
46
43
  }
47
44
  }
@@ -171,10 +168,7 @@ $spacings: (
171
168
  calc(100% - #{variables.$db-spacing-fixed-xl})
172
169
  );
173
170
  /* stylelint-disable-next-line db-ux/use-sizing */
174
- min-inline-size: var(
175
- --db-drawer-min-width,
176
- calc(100% - #{variables.$db-spacing-fixed-xl})
177
- );
171
+ min-inline-size: var(--db-drawer-min-width, auto);
178
172
 
179
173
  &:not([data-direction]),
180
174
  &[data-direction="right"] {
@@ -287,12 +281,12 @@ $spacings: (
287
281
  &:not([data-direction]),
288
282
  &[data-direction="right"],
289
283
  &[data-direction="left"] {
290
- transform: translateX(0%);
284
+ transform: none;
291
285
  }
292
286
 
293
287
  &[data-direction="up"],
294
288
  &[data-direction="down"] {
295
- transform: translateY(0%);
289
+ transform: none;
296
290
  }
297
291
  }
298
292