@db-ux/core-components 4.5.4 → 4.6.0

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 (57) hide show
  1. package/CHANGELOG.md +17 -0
  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 +453 -566
  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 +4 -38
  20. package/build/components/drawer/drawer.scss +4 -4
  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 +3 -95
  28. package/build/components/notification/notification.css +741 -868
  29. package/build/components/page/page.css +0 -34
  30. package/build/components/popover/popover.css +0 -34
  31. package/build/components/radio/radio.css +6 -100
  32. package/build/components/section/section.css +0 -34
  33. package/build/components/select/select.css +306 -416
  34. package/build/components/stack/stack-web-component.css +0 -34
  35. package/build/components/stack/stack.css +0 -34
  36. package/build/components/switch/switch.css +9 -106
  37. package/build/components/tab-item/tab-item.css +0 -88
  38. package/build/components/tab-list/tab-list.css +3 -94
  39. package/build/components/tab-panel/tab-panel.css +0 -34
  40. package/build/components/tabs/tabs.css +0 -88
  41. package/build/components/tag/tag.css +741 -854
  42. package/build/components/textarea/textarea.css +12 -116
  43. package/build/components/tooltip/tooltip.css +3 -94
  44. package/build/styles/absolute.css +1641 -1669
  45. package/build/styles/absolute.scss +2 -4
  46. package/build/styles/bundle.css +1989 -0
  47. package/build/styles/bundle.scss +15 -0
  48. package/build/styles/dialog-init.css +1 -1
  49. package/build/styles/index.css +487 -515
  50. package/build/styles/relative.css +1641 -1669
  51. package/build/styles/relative.scss +2 -15
  52. package/build/styles/rollup.css +1641 -1669
  53. package/build/styles/rollup.scss +2 -4
  54. package/build/styles/visually-hidden.css +1 -1
  55. package/build/styles/webpack.css +1641 -1669
  56. package/build/styles/webpack.scss +2 -4
  57. package/package.json +6 -6
package/build/components/textarea/textarea.css CHANGED
@@ -18,141 +18,37 @@
18
18
  }
19
19
 
20
20
  /* Variants for adaptive components like input, select, notification, ... */
21
- @layer variables {}
22
-
23
- @layer variables {}
24
-
25
- @layer variables {}
26
-
27
- @layer variables {}
28
-
29
- @layer variables {}
30
-
31
- @layer variables {}
32
-
33
- @layer variables {}
34
-
35
- @layer variables {}
36
-
37
- @layer variables {}
38
-
39
- @layer variables {}
40
-
41
- @layer variables {}
42
-
43
- @layer variables {}
44
-
45
- @layer variables {}
46
-
47
- @layer variables {}
48
-
49
- @layer variables {}
50
-
51
- @layer variables {}
52
-
53
- @layer variables {}
54
-
55
- @layer variables {}
56
-
57
- @layer variables {}
58
-
59
- @layer variables {}
60
-
61
- @layer variables {}
62
-
63
- @layer variables {}
64
-
65
- @layer variables {}
66
-
67
- @layer variables {}
68
-
69
- @layer variables {}
70
-
71
- @layer variables {}
72
-
73
- @layer variables {}
74
-
75
- @layer variables {}
76
-
77
- @layer variables {}
78
-
79
- @layer variables {}
80
-
81
21
  .db-textarea[data-variant=floating] > label, .db-textarea textarea {
82
22
  font: var(--db-type-body-md);
83
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
23
+ /* Those variables are only for components to calculate heights and change icons */
24
+ --db-icon-font-weight: var(--db-base-body-icon-weight-md);
25
+ --db-icon-font-size: var(--db-base-body-icon-font-size-md);
84
26
  }
85
- @layer variables {
86
- .db-textarea[data-variant=floating] > label, .db-textarea textarea {
87
- /* Those variables are only for components to calculate heights and change icons */
88
- --db-icon-font-weight: var(--db-base-body-icon-weight-md);
89
- --db-icon-font-size: var(--db-base-body-icon-font-size-md);
90
- }
91
- }
92
-
93
- @layer variables {}
94
-
95
- @layer variables {}
96
27
 
97
28
  .db-textarea, .db-textarea[data-variant=floating] [id$=-placeholder], .db-textarea[data-variant=floating] textarea {
98
29
  font: var(--db-type-body-sm);
99
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
30
+ /* Those variables are only for components to calculate heights and change icons */
31
+ --db-icon-font-weight: var(--db-base-body-icon-weight-sm);
32
+ --db-icon-font-size: var(--db-base-body-icon-font-size-sm);
100
33
  }
101
- @layer variables {
102
- .db-textarea, .db-textarea[data-variant=floating] [id$=-placeholder], .db-textarea[data-variant=floating] textarea {
103
- /* Those variables are only for components to calculate heights and change icons */
104
- --db-icon-font-weight: var(--db-base-body-icon-weight-sm);
105
- --db-icon-font-size: var(--db-base-body-icon-font-size-sm);
106
- }
107
- }
108
-
109
- @layer variables {}
110
-
111
- @layer variables {}
112
34
 
113
35
  .db-textarea > label {
114
36
  font: var(--db-type-body-xs);
115
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
116
- }
117
- @layer variables {
118
- .db-textarea > label {
119
- /* Those variables are only for components to calculate heights and change icons */
120
- --db-icon-font-weight: var(--db-base-body-icon-weight-xs);
121
- --db-icon-font-size: var(--db-base-body-icon-font-size-xs);
122
- }
37
+ /* Those variables are only for components to calculate heights and change icons */
38
+ --db-icon-font-weight: var(--db-base-body-icon-weight-xs);
39
+ --db-icon-font-size: var(--db-base-body-icon-font-size-xs);
123
40
  }
124
41
 
125
- @layer variables {}
126
-
127
- @layer variables {}
128
-
129
42
  .db-textarea[data-variant=floating]:has(textarea:focus-within,
130
43
  textarea:is(input, textarea):not(:placeholder-shown),
131
44
  > select option:checked:not(.placeholder),
132
45
  input[type=checkbox]:checked,
133
46
  input[type=radio]:checked) > label {
134
47
  font: var(--db-type-body-2xs);
135
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
48
+ /* Those variables are only for components to calculate heights and change icons */
49
+ --db-icon-font-weight: var(--db-base-body-icon-weight-2xs);
50
+ --db-icon-font-size: var(--db-base-body-icon-font-size-2xs);
136
51
  }
137
- @layer variables {
138
- .db-textarea[data-variant=floating]:has(textarea:focus-within,
139
- textarea:is(input, textarea):not(:placeholder-shown),
140
- > select option:checked:not(.placeholder),
141
- input[type=checkbox]:checked,
142
- input[type=radio]:checked) > label {
143
- /* Those variables are only for components to calculate heights and change icons */
144
- --db-icon-font-weight: var(--db-base-body-icon-weight-2xs);
145
- --db-icon-font-size: var(--db-base-body-icon-font-size-2xs);
146
- }
147
- }
148
-
149
- @layer variables {}
150
-
151
- @layer variables {}
152
-
153
- @layer variables {}
154
-
155
- @layer variables {}
156
52
 
157
53
  .db-textarea textarea {
158
54
  border: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-100-default);
package/build/components/tooltip/tooltip.css CHANGED
@@ -1,102 +1,11 @@
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
- @layer variables {}
37
-
38
- @layer variables {}
39
-
40
- @layer variables {}
41
-
42
- @layer variables {}
43
-
44
- @layer variables {}
45
-
46
- @layer variables {}
47
-
48
- @layer variables {}
49
-
50
- @layer variables {}
51
-
52
- @layer variables {}
53
-
54
- @layer variables {}
55
-
56
- @layer variables {}
57
-
58
- @layer variables {}
59
-
60
- @layer variables {}
61
-
62
- @layer variables {}
63
-
64
- @layer variables {}
65
-
66
- @layer variables {}
67
-
68
2
  .db-tooltip {
69
3
  font: var(--db-type-body-sm);
70
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
71
- }
72
- @layer variables {
73
- .db-tooltip {
74
- /* Those variables are only for components to calculate heights and change icons */
75
- --db-icon-font-weight: var(--db-base-body-icon-weight-sm);
76
- --db-icon-font-size: var(--db-base-body-icon-font-size-sm);
77
- }
4
+ /* Those variables are only for components to calculate heights and change icons */
5
+ --db-icon-font-weight: var(--db-base-body-icon-weight-sm);
6
+ --db-icon-font-size: var(--db-base-body-icon-font-size-sm);
78
7
  }
79
8
 
80
- @layer variables {}
81
-
82
- @layer variables {}
83
-
84
- @layer variables {}
85
-
86
- @layer variables {}
87
-
88
- @layer variables {}
89
-
90
- @layer variables {}
91
-
92
- @layer variables {}
93
-
94
- @layer variables {}
95
-
96
- @layer variables {}
97
-
98
- @layer variables {}
99
-
100
9
  @keyframes popover-animation {
101
10
  0% {
102
11
  pointer-events: none;