@odx/ui 4.6.3 → 4.6.4

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 (5) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/core-theme.css +10 -1
  3. package/package.json +1 -1
  4. package/scss/components/area-header.component.scss +2 -0
  5. package/scss/components/select.component.scss +6 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @odx/ui
2
2
 
3
+ ## 4.6.4
4
+
5
+ ### Patch Changes
6
+
7
+ - 9431992: feat: Implemented a clearable input option for the select component, allowing users to easily reset the selected value
8
+
3
9
  ## 4.6.3
4
10
 
5
11
  ### Patch Changes
package/core-theme.css CHANGED
@@ -2785,6 +2785,7 @@ html body .odx-fs-italic {
2785
2785
  }
2786
2786
  .odx-area-header__title {
2787
2787
  color: var(--odx-area-header-title-color);
2788
+ font-weight: 600;
2788
2789
  }
2789
2790
  .odx-area-header__subtitle {
2790
2791
  overflow: clip;
@@ -2841,6 +2842,10 @@ html body .odx-fs-italic {
2841
2842
  padding-top: calc(var(--odx-vertical-rythm-base-size) * 1);
2842
2843
  }
2843
2844
  }
2845
+ .odx-area-header--xlarge .odx-area-header__title {
2846
+ font-weight: var(--odx-typography-font-weight-medium);
2847
+ letter-spacing: var(--odx-typography-font-weight-medium-letter-spacing);
2848
+ }
2844
2849
  @media (min-width: 768px) {
2845
2850
  .odx-area-header--xlarge .odx-avatar {
2846
2851
  margin-top: calc(var(--odx-vertical-rythm-base-size) * -0.5);
@@ -6142,7 +6147,7 @@ html body .odx-fs-italic {
6142
6147
  align-items: center;
6143
6148
  cursor: pointer;
6144
6149
  flex: 1 1 100%;
6145
- gap: calc(var(--odx-vertical-rythm-base-size) * 0.25);
6150
+ gap: calc(var(--odx-vertical-rythm-base-size) * 0.3334);
6146
6151
  height: 100%;
6147
6152
  max-width: var(--odx-select-max-width);
6148
6153
  width: 100%;
@@ -6153,12 +6158,16 @@ html body .odx-fs-italic {
6153
6158
  -moz-user-select: unset;
6154
6159
  user-select: unset;
6155
6160
  }
6161
+ .odx-select__clear {
6162
+ margin-inline-start: auto;
6163
+ }
6156
6164
  .odx-select__placeholder, .odx-select__value {
6157
6165
  padding-top: calc(var(--odx-vertical-rythm-base-size) * 0.1667);
6158
6166
  padding-bottom: calc(var(--odx-vertical-rythm-base-size) * 0.1667);
6159
6167
  overflow: clip;
6160
6168
  text-overflow: ellipsis;
6161
6169
  white-space: nowrap;
6170
+ display: flex;
6162
6171
  flex: 1 1 auto;
6163
6172
  gap: calc(var(--odx-vertical-rythm-base-size) * 0.1667);
6164
6173
  overflow: hidden;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@odx/ui",
3
- "version": "4.6.3",
3
+ "version": "4.6.4",
4
4
  "author": "Drägerwerk AG & Co.KGaA",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "peerDependencies": {
package/scss/components/area-header.component.scss CHANGED
@@ -55,6 +55,7 @@
55
55
  @extend .odx-title-6;
56
56
 
57
57
  color: var(--odx-area-header-title-color);
58
+ font-weight: 600;
58
59
  }
59
60
 
60
61
  &__subtitle {
@@ -137,6 +138,7 @@
137
138
 
138
139
  .odx-area-header__title {
139
140
  @extend .odx-title-2;
141
+ @include typography.font-weight(medium);
140
142
  }
141
143
 
142
144
  .odx-area-header__subtitle {
package/scss/components/select.component.scss CHANGED
@@ -17,7 +17,7 @@
17
17
 
18
18
  cursor: pointer;
19
19
  flex: 1 1 100%;
20
- gap: dimensions.get-size(math.div(6, 24));
20
+ gap: dimensions.get-size(math.div(1, 3));
21
21
  height: 100%;
22
22
  max-width: var(--odx-select-max-width);
23
23
  width: 100%;
@@ -30,11 +30,16 @@
30
30
  }
31
31
  }
32
32
 
33
+ &__clear {
34
+ margin-inline-start: auto;
35
+ }
36
+
33
37
  &__placeholder,
34
38
  &__value {
35
39
  @include dimensions.padding-y(math.div(4, 24));
36
40
  @include typography.prevent-text-overflow();
37
41
 
42
+ display: flex;
38
43
  flex: 1 1 auto;
39
44
  gap: dimensions.get-size(math.div(4, 24));
40
45
  overflow: hidden;