@siemens/ix 1.1.0 → 1.1.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 (73) hide show
  1. package/dist/cjs/ix-application-header.cjs.entry.js +2 -2
  2. package/dist/cjs/ix-event-list_2.cjs.entry.js +3 -3
  3. package/dist/cjs/ix-map-navigation_2.cjs.entry.js +4 -4
  4. package/dist/cjs/ix-select_2.cjs.entry.js +45 -22
  5. package/dist/cjs/loader.cjs.js +1 -1
  6. package/dist/cjs/siemens-ix.cjs.js +1 -1
  7. package/dist/collection/components/animated-tabs/animated-tabs.js +3 -3
  8. package/dist/collection/components/application-header/application-header.css +1 -0
  9. package/dist/collection/components/application-header/application-header.js +1 -1
  10. package/dist/collection/components/category-filter/category-filter.js +3 -3
  11. package/dist/collection/components/date-picker/date-picker.js +2 -2
  12. package/dist/collection/components/dropdown/dropdown.js +3 -3
  13. package/dist/collection/components/event-list/event-list.css +0 -3
  14. package/dist/collection/components/event-list-item/event-list-item.css +2 -3
  15. package/dist/collection/components/event-list-item/event-list-item.js +2 -2
  16. package/dist/collection/components/icon-button/icon-button.js +1 -1
  17. package/dist/collection/components/map-navigation/map-navigation.css +1 -19
  18. package/dist/collection/components/map-navigation/map-navigation.js +5 -5
  19. package/dist/collection/components/menu-item/menu-item.js +1 -1
  20. package/dist/collection/components/select/select.js +48 -24
  21. package/dist/collection/components/split-button/split-button.js +3 -3
  22. package/dist/collection/components/time-picker/time-picker.js +2 -2
  23. package/dist/collection/components/toggle/toggle.js +2 -2
  24. package/dist/components/application-header.js +2 -2
  25. package/dist/components/ix-event-list-item.js +2 -2
  26. package/dist/components/ix-event-list.js +1 -1
  27. package/dist/components/ix-map-navigation.js +11 -5
  28. package/dist/components/ix-select.js +47 -23
  29. package/dist/esm/ix-application-header.entry.js +2 -2
  30. package/dist/esm/ix-event-list_2.entry.js +3 -3
  31. package/dist/esm/ix-map-navigation_2.entry.js +4 -4
  32. package/dist/esm/ix-select_2.entry.js +45 -22
  33. package/dist/esm/loader.js +1 -1
  34. package/dist/esm/siemens-ix.js +1 -1
  35. package/dist/siemens-ix/p-0a85cdff.entry.js +1 -0
  36. package/dist/siemens-ix/p-0e3aab52.entry.js +1 -0
  37. package/dist/siemens-ix/p-25fda9f7.entry.js +1 -0
  38. package/dist/siemens-ix/p-a8b6454f.entry.js +1 -0
  39. package/dist/siemens-ix/siemens-ix.css +44 -31
  40. package/dist/siemens-ix/siemens-ix.esm.js +1 -1
  41. package/dist/types/components/animated-tabs/animated-tabs.d.ts +1 -1
  42. package/dist/types/components/category-filter/category-filter.d.ts +2 -2
  43. package/dist/types/components/date-picker/date-picker.d.ts +2 -2
  44. package/dist/types/components/dropdown/dropdown.d.ts +1 -1
  45. package/dist/types/components/event-list-item/event-list-item.d.ts +1 -1
  46. package/dist/types/components/icon-button/icon-button.d.ts +1 -1
  47. package/dist/types/components/map-navigation/map-navigation.d.ts +2 -2
  48. package/dist/types/components/menu-item/menu-item.d.ts +1 -1
  49. package/dist/types/components/select/select.d.ts +8 -5
  50. package/dist/types/components/split-button/split-button.d.ts +1 -1
  51. package/dist/types/components/time-picker/time-picker.d.ts +1 -1
  52. package/dist/types/components/toggle/toggle.d.ts +1 -1
  53. package/dist/types/components.d.ts +21 -35
  54. package/package.json +1 -1
  55. package/scss/components/_button-group.scss +2 -0
  56. package/scss/components/_buttons.scss +5 -0
  57. package/scss/components/_checkboxes.scss +19 -16
  58. package/scss/components/_radiobuttons.scss +12 -12
  59. package/src/components/animated-tabs/readme.md +4 -5
  60. package/src/components/category-filter/readme.md +13 -14
  61. package/src/components/date-picker/readme.md +2 -2
  62. package/src/components/dropdown/readme.md +11 -11
  63. package/src/components/event-list-item/readme.md +7 -7
  64. package/src/components/icon-button/readme.md +1 -1
  65. package/src/components/map-navigation/readme.md +2 -2
  66. package/src/components/menu-item/readme.md +8 -8
  67. package/src/components/split-button/readme.md +11 -11
  68. package/src/components/time-picker/readme.md +12 -12
  69. package/src/components/toggle/readme.md +10 -10
  70. package/dist/siemens-ix/p-1686ce8c.entry.js +0 -1
  71. package/dist/siemens-ix/p-a2e33741.entry.js +0 -1
  72. package/dist/siemens-ix/p-a3760331.entry.js +0 -1
  73. package/dist/siemens-ix/p-ca8a41ea.entry.js +0 -1
@@ -32,9 +32,6 @@ export namespace Components {
32
32
  "icon": string;
33
33
  }
34
34
  interface IxAnimatedTabs {
35
- /**
36
- * @deprecated - For debugging purposes only
37
- */
38
35
  "disableAnimations": boolean;
39
36
  /**
40
37
  * Current selected tab index
@@ -154,7 +151,7 @@ export namespace Components {
154
151
  "icon": string;
155
152
  /**
156
153
  * When set this will initially populate the component with the provided search criteria. This will trigger all input events accordingly.
157
- * @deprecated will get removed with next major release (7.0.0). Use the member filterState instead.
154
+ * @deprecated Will be removed with 2.0.0. Use the member filterState instead.
158
155
  */
159
156
  "initialState": FilterState;
160
157
  /**
@@ -179,9 +176,6 @@ export namespace Components {
179
176
  * A list of strings that will be supplied as typeahead suggestions not tied to any categories.
180
177
  */
181
178
  "suggestions": string[];
182
- /**
183
- * @deprecated For debugging purposes only!
184
- */
185
179
  "tmpDisableScrollIntoView": boolean;
186
180
  }
187
181
  interface IxChip {
@@ -274,7 +268,7 @@ export namespace Components {
274
268
  */
275
269
  "getCurrentDate": () => Promise<{ start: string; end: string; }>;
276
270
  /**
277
- * @deprecated - will get removed with next major release
271
+ * @deprecated Will be removed in 2.0.0
278
272
  */
279
273
  "individual": boolean;
280
274
  /**
@@ -422,7 +416,7 @@ export namespace Components {
422
416
  "adjustDropdownWidthToReferenceWidth": boolean;
423
417
  /**
424
418
  * Adjust dropdown width to the parent width
425
- * @deprecated - property has a typo and will get removed in the next major version. Use `adjustDropdownWidthToReferenceWidth` instead.
419
+ * @deprecated Will be removed in 2.0.0. Property has a typo use `adjustDropdownWidthToReferenceWidth` instead.
426
420
  */
427
421
  "adjustDropdownWidthToReferenceWith": boolean;
428
422
  /**
@@ -517,7 +511,7 @@ export namespace Components {
517
511
  "disabled": boolean;
518
512
  /**
519
513
  * Opacity of the status indicator. Defaults to 1.0
520
- * @deprecated Will be removed in 7.0.0. Use color with alpha value.
514
+ * @deprecated Will be removed in 2.0.0
521
515
  */
522
516
  "opacity": number;
523
517
  /**
@@ -660,7 +654,7 @@ export namespace Components {
660
654
  "icon": string;
661
655
  /**
662
656
  * Button invisible
663
- * @deprecated use ghost property
657
+ * @deprecated Use ghost property
664
658
  */
665
659
  "invisible": boolean;
666
660
  /**
@@ -704,7 +698,7 @@ export namespace Components {
704
698
  "applicationName": string;
705
699
  /**
706
700
  * Close current shown overlay
707
- * @deprecated will get removed with next major release in favor of slot based approach
701
+ * @deprecated Will be removed in 2.0.0. Use slot based approach
708
702
  */
709
703
  "closeOverlay": () => Promise<void>;
710
704
  /**
@@ -717,7 +711,7 @@ export namespace Components {
717
711
  "navigationTitle": string;
718
712
  /**
719
713
  * Open a overlay inside content area
720
- * @deprecated will get removed with next major release in favor of slot based approach
714
+ * @deprecated Will be removed in 2.0.0. Use slot based approach
721
715
  * @param name
722
716
  * @param component
723
717
  * @param icon
@@ -874,7 +868,7 @@ export namespace Components {
874
868
  "active": boolean;
875
869
  /**
876
870
  * Caution: this is no longer working. Please use slot="bottom" instead. Place tab on bottom
877
- * @deprecated - replaced by slot based implementation
871
+ * @deprecated Will be removed in 2.0.0. Replaced by slot based implementation
878
872
  */
879
873
  "bottom": boolean;
880
874
  /**
@@ -1122,7 +1116,7 @@ export namespace Components {
1122
1116
  "icon": string;
1123
1117
  /**
1124
1118
  * Button invisible
1125
- * @deprecated use ghost property
1119
+ * @deprecated Will be removed in 2.0.0. Use ghost property
1126
1120
  */
1127
1121
  "invisible": boolean;
1128
1122
  /**
@@ -1233,7 +1227,7 @@ export namespace Components {
1233
1227
  */
1234
1228
  "getCurrentTime": () => Promise<string>;
1235
1229
  /**
1236
- * @deprecated - will get removed with next major release
1230
+ * @deprecated Will be removed in 2.0.0
1237
1231
  */
1238
1232
  "individual": boolean;
1239
1233
  /**
@@ -1311,7 +1305,7 @@ export namespace Components {
1311
1305
  "checked": boolean;
1312
1306
  /**
1313
1307
  * Basic and status colors from color palette
1314
- * @deprecated - Has no effect on the rendered control
1308
+ * @deprecated Will be removed in 2.0.0
1315
1309
  */
1316
1310
  "color": string;
1317
1311
  /**
@@ -2100,10 +2094,6 @@ declare namespace LocalJSX {
2100
2094
  "icon"?: string;
2101
2095
  }
2102
2096
  interface IxAnimatedTabs {
2103
- /**
2104
- * @deprecated - For debugging purposes only
2105
- */
2106
- "disableAnimations"?: boolean;
2107
2097
  /**
2108
2098
  * Tab navigated
2109
2099
  */
@@ -2238,7 +2228,7 @@ declare namespace LocalJSX {
2238
2228
  "icon"?: string;
2239
2229
  /**
2240
2230
  * When set this will initially populate the component with the provided search criteria. This will trigger all input events accordingly.
2241
- * @deprecated will get removed with next major release (7.0.0). Use the member filterState instead.
2231
+ * @deprecated Will be removed with 2.0.0. Use the member filterState instead.
2242
2232
  */
2243
2233
  "initialState"?: FilterState;
2244
2234
  /**
@@ -2271,10 +2261,6 @@ declare namespace LocalJSX {
2271
2261
  * A list of strings that will be supplied as typeahead suggestions not tied to any categories.
2272
2262
  */
2273
2263
  "suggestions"?: string[];
2274
- /**
2275
- * @deprecated For debugging purposes only!
2276
- */
2277
- "tmpDisableScrollIntoView"?: boolean;
2278
2264
  }
2279
2265
  interface IxChip {
2280
2266
  /**
@@ -2366,7 +2352,7 @@ declare namespace LocalJSX {
2366
2352
  */
2367
2353
  "from"?: string;
2368
2354
  /**
2369
- * @deprecated - will get removed with next major release
2355
+ * @deprecated Will be removed in 2.0.0
2370
2356
  */
2371
2357
  "individual"?: boolean;
2372
2358
  /**
@@ -2396,7 +2382,7 @@ declare namespace LocalJSX {
2396
2382
  "onDateSelect"?: (event: IxDatePickerCustomEvent<DateChangeEvent>) => void;
2397
2383
  /**
2398
2384
  * Date selection confirmed via button action
2399
- * @deprecated Use `dateSelect`
2385
+ * @deprecated Will be removed in 2.0.0. Use `dateSelect`
2400
2386
  */
2401
2387
  "onDone"?: (event: IxDatePickerCustomEvent<string>) => void;
2402
2388
  /**
@@ -2556,7 +2542,7 @@ declare namespace LocalJSX {
2556
2542
  "adjustDropdownWidthToReferenceWidth"?: boolean;
2557
2543
  /**
2558
2544
  * Adjust dropdown width to the parent width
2559
- * @deprecated - property has a typo and will get removed in the next major version. Use `adjustDropdownWidthToReferenceWidth` instead.
2545
+ * @deprecated Will be removed in 2.0.0. Property has a typo use `adjustDropdownWidthToReferenceWidth` instead.
2560
2546
  */
2561
2547
  "adjustDropdownWidthToReferenceWith"?: boolean;
2562
2548
  /**
@@ -2655,7 +2641,7 @@ declare namespace LocalJSX {
2655
2641
  "onItemClick"?: (event: IxEventListItemCustomEvent<any>) => void;
2656
2642
  /**
2657
2643
  * Opacity of the status indicator. Defaults to 1.0
2658
- * @deprecated Will be removed in 7.0.0. Use color with alpha value.
2644
+ * @deprecated Will be removed in 2.0.0
2659
2645
  */
2660
2646
  "opacity"?: number;
2661
2647
  /**
@@ -2822,7 +2808,7 @@ declare namespace LocalJSX {
2822
2808
  "icon"?: string;
2823
2809
  /**
2824
2810
  * Button invisible
2825
- * @deprecated use ghost property
2811
+ * @deprecated Use ghost property
2826
2812
  */
2827
2813
  "invisible"?: boolean;
2828
2814
  /**
@@ -3042,7 +3028,7 @@ declare namespace LocalJSX {
3042
3028
  "active"?: boolean;
3043
3029
  /**
3044
3030
  * Caution: this is no longer working. Please use slot="bottom" instead. Place tab on bottom
3045
- * @deprecated - replaced by slot based implementation
3031
+ * @deprecated Will be removed in 2.0.0. Replaced by slot based implementation
3046
3032
  */
3047
3033
  "bottom"?: boolean;
3048
3034
  /**
@@ -3298,7 +3284,7 @@ declare namespace LocalJSX {
3298
3284
  "icon"?: string;
3299
3285
  /**
3300
3286
  * Button invisible
3301
- * @deprecated use ghost property
3287
+ * @deprecated Will be removed in 2.0.0. Use ghost property
3302
3288
  */
3303
3289
  "invisible"?: boolean;
3304
3290
  /**
@@ -3413,7 +3399,7 @@ declare namespace LocalJSX {
3413
3399
  */
3414
3400
  "format"?: string;
3415
3401
  /**
3416
- * @deprecated - will get removed with next major release
3402
+ * @deprecated Will be removed in 2.0.0
3417
3403
  */
3418
3404
  "individual"?: boolean;
3419
3405
  /**
@@ -3498,7 +3484,7 @@ declare namespace LocalJSX {
3498
3484
  "checked"?: boolean;
3499
3485
  /**
3500
3486
  * Basic and status colors from color palette
3501
- * @deprecated - Has no effect on the rendered control
3487
+ * @deprecated Will be removed in 2.0.0
3502
3488
  */
3503
3489
  "color"?: string;
3504
3490
  /**
package/package.json CHANGED
@@ -7,7 +7,7 @@
7
7
  "url": "https://github.com/siemens/ix",
8
8
  "directory": "packages/core"
9
9
  },
10
- "version": "1.1.0",
10
+ "version": "1.1.1",
11
11
  "license": "MIT",
12
12
  "description": "Siemens iX Web Components",
13
13
  "main": "dist/index.cjs.js",
@@ -11,6 +11,7 @@
11
11
  ix-button:first-child .btn {
12
12
  border-top-right-radius: 0px;
13
13
  border-bottom-right-radius: 0px;
14
+ border-right: 0px;
14
15
  }
15
16
 
16
17
  ix-button:last-child .btn {
@@ -20,5 +21,6 @@
20
21
 
21
22
  ix-button:not(:first-child):not(:last-child) .btn {
22
23
  border-radius: 0px;
24
+ border-right: 0px;
23
25
  }
24
26
  }
@@ -46,6 +46,11 @@ $button-categories: (primary, secondary);
46
46
  border-radius: var(--theme-btn--border-radius);
47
47
  }
48
48
 
49
+ @if $enable-border == false {
50
+ --bs-btn-border-width: 0px;
51
+ --bs-btn-active-border-color: none;
52
+ }
53
+
49
54
  &,
50
55
  &.focus,
51
56
  &:focus-visible {
@@ -8,13 +8,14 @@
8
8
  */
9
9
 
10
10
  @mixin checkbox-basic() {
11
- $size: $large-space;
11
+ $size: 1.125rem;
12
12
 
13
13
  /* Base for label styling */
14
14
  [type='checkbox']:not(:checked),
15
15
  [type='checkbox']:checked {
16
16
  position: absolute;
17
17
  opacity: 0;
18
+ pointer-events: none;
18
19
  }
19
20
 
20
21
  .ag-checkbox-input-wrapper {
@@ -28,7 +29,9 @@
28
29
  [type='checkbox']:not(:checked) + label,
29
30
  [type='checkbox']:checked + label {
30
31
  position: relative;
31
- line-height: $size;
32
+ display: flex;
33
+ align-items: center;
34
+ line-height: $default-space;
32
35
  user-select: none;
33
36
 
34
37
  color: var(--theme-checkbox-label--color);
@@ -52,14 +55,14 @@
52
55
 
53
56
  [type='checkbox'] + label:focus-visible {
54
57
  &:before {
55
- outline: 1px solid var(--focus--border-color);
58
+ outline: 0.0625rem solid var(--focus--border-color);
56
59
  outline-offset: var(--theme-checkbox--focus--outline-offset);
57
60
  }
58
61
  }
59
62
 
60
63
  [type='checkbox']:focus-visible + label {
61
64
  &:before {
62
- outline: 1px solid var(--focus--border-color);
65
+ outline: 0.0625rem solid var(--focus--border-color);
63
66
  outline-offset: var(--theme-checkbox--focus--outline-offset);
64
67
  }
65
68
  }
@@ -99,17 +102,17 @@
99
102
 
100
103
  & + label:after {
101
104
  content: '';
102
- width: 9px;
103
- height: 4px;
105
+ width: 0.45rem;
106
+ height: 0.25rem;
104
107
  display: block;
105
108
  border-top: none;
106
109
  border-right: none;
107
- border-bottom: 1px solid var(--theme-checkbox-checked--color);
108
- border-left: 1px solid var(--theme-checkbox-checked--color);
110
+ border-bottom: 0.0625rem solid var(--theme-checkbox-checked--color);
111
+ border-left: 0.0625rem solid var(--theme-checkbox-checked--color);
109
112
  position: absolute;
110
- top: 8px;
111
- left: 8px;
112
- transform: rotate(-45deg) scale(2);
113
+ top: 0.3rem;
114
+ left: 0.35rem;
115
+ transform: rotate(-53deg) scale(2);
113
116
  }
114
117
 
115
118
  &:hover + label:before {
@@ -144,12 +147,12 @@
144
147
  & + label:after {
145
148
  content: '';
146
149
  display: block;
147
- width: 14px;
148
- height: 1px;
149
- border-bottom: 2px solid var(--theme-checkbox-mixed--color);
150
+ width: 0.625rem;
151
+ height: 0.125rem;
152
+ border-bottom: 0.125rem solid var(--theme-checkbox-mixed--color);
150
153
  position: absolute;
151
- top: 11px;
152
- left: 5px;
154
+ top: $small-space;
155
+ left: $tiny-space;
153
156
  }
154
157
 
155
158
  & + label:before {
@@ -8,13 +8,14 @@
8
8
  */
9
9
 
10
10
  @mixin radio-basic() {
11
- $size: $large-space;
11
+ $size: 1.25rem;
12
12
 
13
13
  /* Base for label styling */
14
14
  [type='radio']:not(:checked),
15
15
  [type='radio']:checked {
16
16
  position: absolute;
17
17
  opacity: 0;
18
+ pointer-events: none;
18
19
  }
19
20
 
20
21
  [type='radio']:not(:checked) + label,
@@ -47,14 +48,14 @@
47
48
 
48
49
  [type='radio'] + label:focus-visible {
49
50
  &:before {
50
- outline: 1px solid var(--focus--border-color);
51
+ outline: 0.0625rem solid var(--focus--border-color);
51
52
  outline-offset: var(--theme-radiobtn--focus--outline-offset);
52
53
  }
53
54
  }
54
55
 
55
56
  [type='radio']:focus-visible + label {
56
57
  &:before {
57
- outline: 1px solid var(--focus--border-color);
58
+ outline: 0.0625rem solid var(--focus--border-color);
58
59
  outline-offset: var(--theme-radiobtn--focus--outline-offset);
59
60
  }
60
61
  }
@@ -94,15 +95,14 @@
94
95
 
95
96
  & + label:after {
96
97
  content: '';
97
- width: 10px;
98
- height: 10px;
98
+ width: 0.625rem;
99
+ height: 0.625rem;
99
100
  display: block;
100
101
  background-color: var(--theme-radiobtn-checked--color);
101
102
  border-radius: 100%;
102
- transform: scale(1.5);
103
103
  position: absolute;
104
- top: 7px;
105
- left: 7px;
104
+ top: 0.3125rem;
105
+ left: 0.3125rem;
106
106
  }
107
107
 
108
108
  &:hover + label:before {
@@ -138,10 +138,10 @@
138
138
  content: '';
139
139
  position: relative;
140
140
  display: block;
141
- width: 14px;
142
- height: 1px;
143
- border-bottom: 2px solid var(--theme-radiobtn-mixed--color);
144
- transform: translateX(5px) translateY(-0.8rem);
141
+ width: 0.875rem;
142
+ height: 0.0625rem;
143
+ border-bottom: 0.125rem solid var(--theme-radiobtn-mixed--color);
144
+ transform: translateX(0.3125rem) translateY(-0.8rem);
145
145
  }
146
146
 
147
147
  & + label:before {
@@ -13,11 +13,10 @@ SPDX-License-Identifier: MIT
13
13
 
14
14
  ## Properties
15
15
 
16
- | Property | Attribute | Description | Type | Default |
17
- | ------------------- | -------------------- | --------------------------------------------------------------------------------------- | ------------------- | ------- |
18
- | `disableAnimations` | `disable-animations` | <span style="color:red">**[DEPRECATED]**</span> - For debugging purposes only<br/><br/> | `boolean` | `false` |
19
- | `selectedIndex` | `selected-index` | Current selected tab index | `number` | `0` |
20
- | `tabPlacement` | `tab-placement` | Placement of the tabs | `"bottom" \| "top"` | `'top'` |
16
+ | Property | Attribute | Description | Type | Default |
17
+ | --------------- | ---------------- | -------------------------- | ------------------- | ------- |
18
+ | `selectedIndex` | `selected-index` | Current selected tab index | `number` | `0` |
19
+ | `tabPlacement` | `tab-placement` | Placement of the tabs | `"bottom" \| "top"` | `'top'` |
21
20
 
22
21
 
23
22
  ## Events
@@ -11,20 +11,19 @@ SPDX-License-Identifier: MIT
11
11
 
12
12
  ## Properties
13
13
 
14
- | Property | Attribute | Description | Type | Default |
15
- | -------------------------- | ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------- | ------------------ |
16
- | `categories` | -- | Configuration object hash used to populate the dropwdown menu for typeahead and quick selection functionality. Each ID maps to an object with a label and an array of options to select from. | `{ [id: string]: { label: string; options: string[]; }; }` | `undefined` |
17
- | `filterState` | -- | A set of search criteria to populate the component with. | `FilterState` | `undefined` |
18
- | `hideIcon` | `hide-icon` | Allows to hide the icon inside the text input. Defaults to false | `boolean` | `undefined` |
19
- | `i18nPlainText` | `i-1-8n-plain-text` | i18n | `string` | `'Filter by text'` |
20
- | `icon` | `icon` | The icon next to the actual text input Defaults to 'search' | `string` | `'search'` |
21
- | `initialState` | -- | <span style="color:red">**[DEPRECATED]**</span> will get removed with next major release (7.0.0). Use the member filterState instead.<br/><br/>When set this will initially populate the component with the provided search criteria. This will trigger all input events accordingly. | `FilterState` | `undefined` |
22
- | `labelCategories` | `label-categories` | i18n | `string` | `'Categories'` |
23
- | `nonSelectableCategories` | -- | In certain use cases some categories are not available for selection any more. To allow proper display of set filters with these categories this ID to label mapping can be populated. Configuration object hash used to supply labels to the filter chips in the input field. Each ID maps to a string representing the label to display. | `{ [id: string]: string; }` | `{}` |
24
- | `placeholder` | `placeholder` | Placeholder text to be displayed in an empty input field. | `string` | `undefined` |
25
- | `repeatCategories` | `repeat-categories` | If set to true allows that a single category can be set more than once. An already set category will not appear in the category dropdown if set to false. Defaults to true | `boolean` | `true` |
26
- | `suggestions` | -- | A list of strings that will be supplied as typeahead suggestions not tied to any categories. | `string[]` | `undefined` |
27
- | `tmpDisableScrollIntoView` | `tmp-disable-scroll-into-view` | <span style="color:red">**[DEPRECATED]**</span> For debugging purposes only!<br/><br/> | `boolean` | `true` |
14
+ | Property | Attribute | Description | Type | Default |
15
+ | ------------------------- | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------- | ------------------ |
16
+ | `categories` | -- | Configuration object hash used to populate the dropwdown menu for typeahead and quick selection functionality. Each ID maps to an object with a label and an array of options to select from. | `{ [id: string]: { label: string; options: string[]; }; }` | `undefined` |
17
+ | `filterState` | -- | A set of search criteria to populate the component with. | `FilterState` | `undefined` |
18
+ | `hideIcon` | `hide-icon` | Allows to hide the icon inside the text input. Defaults to false | `boolean` | `undefined` |
19
+ | `i18nPlainText` | `i-1-8n-plain-text` | i18n | `string` | `'Filter by text'` |
20
+ | `icon` | `icon` | The icon next to the actual text input Defaults to 'search' | `string` | `'search'` |
21
+ | `initialState` | -- | <span style="color:red">**[DEPRECATED]**</span> Will be removed with 2.0.0. Use the member filterState instead.<br/><br/>When set this will initially populate the component with the provided search criteria. This will trigger all input events accordingly. | `FilterState` | `undefined` |
22
+ | `labelCategories` | `label-categories` | i18n | `string` | `'Categories'` |
23
+ | `nonSelectableCategories` | -- | In certain use cases some categories are not available for selection any more. To allow proper display of set filters with these categories this ID to label mapping can be populated. Configuration object hash used to supply labels to the filter chips in the input field. Each ID maps to a string representing the label to display. | `{ [id: string]: string; }` | `{}` |
24
+ | `placeholder` | `placeholder` | Placeholder text to be displayed in an empty input field. | `string` | `undefined` |
25
+ | `repeatCategories` | `repeat-categories` | If set to true allows that a single category can be set more than once. An already set category will not appear in the category dropdown if set to false. Defaults to true | `boolean` | `true` |
26
+ | `suggestions` | -- | A list of strings that will be supplied as typeahead suggestions not tied to any categories. | `string[]` | `undefined` |
28
27
 
29
28
 
30
29
  ## Events
@@ -17,7 +17,7 @@ SPDX-License-Identifier: MIT
17
17
  | `eventDelimiter` | `event-delimiter` | Default behavior of the done event is to join the two events (date and time) into one combined string output. This combination can be configured over the delimiter | `string` | `' - '` |
18
18
  | `format` | `format` | Date format string. See @link https://moment.github.io/luxon/#/formatting?id=table-of-tokens for all available tokens. | `string` | `'yyyy/LL/dd'` |
19
19
  | `from` | `from` | Picker date. If the picker is in range mode this property is the start date. Format is based on `format` | `string` | `DateTime.now().toFormat(this.format)` |
20
- | `individual` | `individual` | <span style="color:red">**[DEPRECATED]**</span> - will get removed with next major release<br/><br/> | `boolean` | `true` |
20
+ | `individual` | `individual` | <span style="color:red">**[DEPRECATED]**</span> Will be removed in 2.0.0<br/><br/> | `boolean` | `true` |
21
21
  | `maxDate` | `max-date` | The latest date that can be selected by the date picker. If not set there will be no restriction. | `string` | `undefined` |
22
22
  | `minDate` | `min-date` | The earliest date that can be selected by the date picker. If not set there will be no restriction. | `string` | `undefined` |
23
23
  | `range` | `range` | If true a range of dates can be selected. | `boolean` | `true` |
@@ -32,7 +32,7 @@ SPDX-License-Identifier: MIT
32
32
  | `dateChange` | Date change event If datepicker is in range mode the event detail will be sperated with a `-` e.g. `2022/10/22 - 2022/10/24` (start and end). If range mode is choosen consider to use `dateRangeChange`. | `CustomEvent<DateChangeEvent \| string>` |
33
33
  | `dateRangeChange` | Date range change. Only triggered if datepicker is in range mode | `CustomEvent<DateChangeEvent>` |
34
34
  | `dateSelect` | Date selection confirmed via button action | `CustomEvent<DateChangeEvent>` |
35
- | `done` | <span style="color:red">**[DEPRECATED]**</span> Use `dateSelect`<br/><br/>Date selection confirmed via button action | `CustomEvent<string>` |
35
+ | `done` | <span style="color:red">**[DEPRECATED]**</span> Will be removed in 2.0.0. Use `dateSelect`<br/><br/>Date selection confirmed via button action | `CustomEvent<string>` |
36
36
 
37
37
 
38
38
  ## Methods
@@ -11,17 +11,17 @@ SPDX-License-Identifier: MIT
11
11
 
12
12
  ## Properties
13
13
 
14
- | Property | Attribute | Description | Type | Default |
15
- | ------------------------------------- | ------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------- |
16
- | `adjustDropdownWidthToReferenceWidth` | `adjust-dropdown-width-to-reference-width` | Adjust dropdown width to the parent width | `boolean` | `false` |
17
- | `adjustDropdownWidthToReferenceWith` | `adjust-dropdown-width-to-reference-with` | <span style="color:red">**[DEPRECATED]**</span> - property has a typo and will get removed in the next major version. Use `adjustDropdownWidthToReferenceWidth` instead.<br/><br/>Adjust dropdown width to the parent width | `boolean` | `false` |
18
- | `anchor` | `anchor` | Define an anchor element | `HTMLElement \| string` | `undefined` |
19
- | `closeBehavior` | `close-behavior` | Close behavior | `"both" \| "inside" \| "outside" \| boolean` | `'both'` |
20
- | `header` | `header` | An optional header shown at the top of the dropdown | `string` | `undefined` |
21
- | `placement` | `placement` | Placement of the dropdown | `"auto" \| "auto-end" \| "auto-start" \| "bottom" \| "bottom-end" \| "bottom-start" \| "left" \| "left-end" \| "left-start" \| "right" \| "right-end" \| "right-start" \| "top" \| "top-end" \| "top-start"` | `'bottom-end'` |
22
- | `positioningStrategy` | `positioning-strategy` | Position strategy | `"absolute" \| "fixed"` | `'fixed'` |
23
- | `show` | `show` | Show dropdown | `boolean` | `false` |
24
- | `trigger` | `trigger` | Define an element that triggers the dropdown. A trigger can either be a string that will be interprated as id attribute or a DOM element. | `HTMLElement \| string` | `undefined` |
14
+ | Property | Attribute | Description | Type | Default |
15
+ | ------------------------------------- | ------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------- |
16
+ | `adjustDropdownWidthToReferenceWidth` | `adjust-dropdown-width-to-reference-width` | Adjust dropdown width to the parent width | `boolean` | `false` |
17
+ | `adjustDropdownWidthToReferenceWith` | `adjust-dropdown-width-to-reference-with` | <span style="color:red">**[DEPRECATED]**</span> Will be removed in 2.0.0. Property has a typo use `adjustDropdownWidthToReferenceWidth` instead.<br/><br/>Adjust dropdown width to the parent width | `boolean` | `false` |
18
+ | `anchor` | `anchor` | Define an anchor element | `HTMLElement \| string` | `undefined` |
19
+ | `closeBehavior` | `close-behavior` | Close behavior | `"both" \| "inside" \| "outside" \| boolean` | `'both'` |
20
+ | `header` | `header` | An optional header shown at the top of the dropdown | `string` | `undefined` |
21
+ | `placement` | `placement` | Placement of the dropdown | `"auto" \| "auto-end" \| "auto-start" \| "bottom" \| "bottom-end" \| "bottom-start" \| "left" \| "left-end" \| "left-start" \| "right" \| "right-end" \| "right-start" \| "top" \| "top-end" \| "top-start"` | `'bottom-end'` |
22
+ | `positioningStrategy` | `positioning-strategy` | Position strategy | `"absolute" \| "fixed"` | `'fixed'` |
23
+ | `show` | `show` | Show dropdown | `boolean` | `false` |
24
+ | `trigger` | `trigger` | Define an element that triggers the dropdown. A trigger can either be a string that will be interprated as id attribute or a DOM element. | `HTMLElement \| string` | `undefined` |
25
25
 
26
26
 
27
27
  ## Events
@@ -11,13 +11,13 @@ SPDX-License-Identifier: MIT
11
11
 
12
12
  ## Properties
13
13
 
14
- | Property | Attribute | Description | Type | Default |
15
- | ---------- | ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------- | ----------- |
16
- | `chevron` | `chevron` | Show chevron on right side of the event list item | `boolean` | `undefined` |
17
- | `color` | `color` | Color of the status indicator. Allowed values are all Core UI color names. | `string` | `undefined` |
18
- | `disabled` | `disabled` | Disable event list item | `boolean` | `undefined` |
19
- | `opacity` | `opacity` | <span style="color:red">**[DEPRECATED]**</span> Will be removed in 7.0.0. Use color with alpha value.<br/><br/>Opacity of the status indicator. Defaults to 1.0 | `number` | `1` |
20
- | `selected` | `selected` | Show event list item as selected | `boolean` | `undefined` |
14
+ | Property | Attribute | Description | Type | Default |
15
+ | ---------- | ---------- | ---------------------------------------------------------------------------------------------------------------------------------- | --------- | ----------- |
16
+ | `chevron` | `chevron` | Show chevron on right side of the event list item | `boolean` | `undefined` |
17
+ | `color` | `color` | Color of the status indicator. Allowed values are all Core UI color names. | `string` | `undefined` |
18
+ | `disabled` | `disabled` | Disable event list item | `boolean` | `undefined` |
19
+ | `opacity` | `opacity` | <span style="color:red">**[DEPRECATED]**</span> Will be removed in 2.0.0<br/><br/>Opacity of the status indicator. Defaults to 1.0 | `number` | `1` |
20
+ | `selected` | `selected` | Show event list item as selected | `boolean` | `undefined` |
21
21
 
22
22
 
23
23
  ## Events
@@ -17,7 +17,7 @@ SPDX-License-Identifier: MIT
17
17
  | `disabled` | `disabled` | Disabled | `boolean` | `false` |
18
18
  | `ghost` | `ghost` | Button invisible | `boolean` | `undefined` |
19
19
  | `icon` | `icon` | Button icon | `string` | `undefined` |
20
- | `invisible` | `invisible` | <span style="color:red">**[DEPRECATED]**</span> use ghost property<br/><br/>Button invisible | `boolean` | `undefined` |
20
+ | `invisible` | `invisible` | <span style="color:red">**[DEPRECATED]**</span> Use ghost property<br/><br/>Button invisible | `boolean` | `undefined` |
21
21
  | `outline` | `outline` | Button outline | `boolean` | `undefined` |
22
22
  | `oval` | `oval` | Button in oval shape | `boolean` | `undefined` |
23
23
  | `selected` | `selected` | Selected state only working with outline or invisible | `boolean` | `false` |
@@ -30,7 +30,7 @@ SPDX-License-Identifier: MIT
30
30
 
31
31
  ### `closeOverlay() => Promise<void>`
32
32
 
33
- <span style="color:red">**[DEPRECATED]**</span> will get removed with next major release in favor of slot based approach<br/><br/>Close current shown overlay
33
+ <span style="color:red">**[DEPRECATED]**</span> Will be removed in 2.0.0. Use slot based approach<br/><br/>Close current shown overlay
34
34
 
35
35
  #### Returns
36
36
 
@@ -40,7 +40,7 @@ Type: `Promise<void>`
40
40
 
41
41
  ### `openOverlay(name: string, component: HTMLElement, icon?: string, color?: string) => Promise<void>`
42
42
 
43
- <span style="color:red">**[DEPRECATED]**</span> will get removed with next major release in favor of slot based approach<br/><br/>Open a overlay inside content area
43
+ <span style="color:red">**[DEPRECATED]**</span> Will be removed in 2.0.0. Use slot based approach<br/><br/>Open a overlay inside content area
44
44
 
45
45
  #### Returns
46
46