@knime/kds-components 0.28.7 → 0.28.9

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 (58) hide show
  1. package/dist/index.css +53 -48
  2. package/dist/index.js +113 -48
  3. package/dist/index.js.map +1 -1
  4. package/dist/src/accessories/MissingValueIcon/KdsMissingValueIcon.vue.d.ts +7 -0
  5. package/dist/src/accessories/MissingValueIcon/KdsMissingValueIcon.vue.d.ts.map +1 -0
  6. package/dist/src/accessories/MissingValueIcon/index.d.ts +2 -0
  7. package/dist/src/accessories/MissingValueIcon/index.d.ts.map +1 -0
  8. package/dist/src/accessories/index.d.ts +1 -0
  9. package/dist/src/accessories/index.d.ts.map +1 -1
  10. package/dist/src/buttons/KdsMenuButton/KdsMenuButton.vue.d.ts +29 -19
  11. package/dist/src/buttons/KdsMenuButton/KdsMenuButton.vue.d.ts.map +1 -1
  12. package/dist/src/buttons/KdsSplitButton/KdsSplitButton.vue.d.ts +15 -15
  13. package/dist/src/containers/Menu/KdsMenu.vue.d.ts +30 -30
  14. package/dist/src/containers/MenuContainer/KdsMenuItem.vue.d.ts.map +1 -1
  15. package/dist/src/containers/MenuContainer/types.d.ts +5 -0
  16. package/dist/src/containers/MenuContainer/types.d.ts.map +1 -1
  17. package/dist/src/forms/_helper/InfoPopover/KdsInfoToggleButton.vue.d.ts +30 -30
  18. package/dist/src/forms/_helper/VariablePopover/KdsVariableToggleButton.vue.d.ts +30 -30
  19. package/dist/src/forms/inputs/BaseInput.vue.d.ts +1 -1
  20. package/dist/src/forms/inputs/BaseInput.vue.d.ts.map +1 -1
  21. package/dist/src/forms/inputs/ColorInput/KdsColorInput.vue.d.ts +15 -15
  22. package/dist/src/forms/inputs/DateInput/KdsDateInput.vue.d.ts +18 -18
  23. package/dist/src/forms/inputs/DateInput/KdsDateInput.vue.d.ts.map +1 -1
  24. package/dist/src/forms/inputs/DateTimeFormatInput/KdsDateTimeFormatInput.vue.d.ts +15 -15
  25. package/dist/src/forms/inputs/IntervalInput/KdsIntervalInput.vue.d.ts +17 -17
  26. package/dist/src/forms/inputs/NumberInput/KdsNumberInput.vue.d.ts +3 -3
  27. package/dist/src/forms/inputs/NumberInput/KdsNumberInput.vue.d.ts.map +1 -1
  28. package/dist/src/forms/inputs/PasswordInput/KdsPasswordInput.vue.d.ts +3 -3
  29. package/dist/src/forms/inputs/PasswordInput/KdsPasswordInput.vue.d.ts.map +1 -1
  30. package/dist/src/forms/inputs/PatternInput/KdsPatternInput.vue.d.ts +3 -3
  31. package/dist/src/forms/inputs/PatternInput/KdsPatternInput.vue.d.ts.map +1 -1
  32. package/dist/src/forms/inputs/SearchInput/KdsSearchInput.vue.d.ts +18 -18
  33. package/dist/src/forms/inputs/SearchInput/KdsSearchInput.vue.d.ts.map +1 -1
  34. package/dist/src/forms/inputs/TextInput/KdsTextInput.vue.d.ts +18 -18
  35. package/dist/src/forms/inputs/TextInput/KdsTextInput.vue.d.ts.map +1 -1
  36. package/dist/src/forms/inputs/Textarea/KdsTextarea.vue.d.ts +1 -1
  37. package/dist/src/forms/inputs/Textarea/KdsTextarea.vue.d.ts.map +1 -1
  38. package/dist/src/forms/inputs/TimeInput/KdsTimeInput.vue.d.ts +30 -30
  39. package/dist/src/forms/inputs/TimeInput/KdsTimeInput.vue.d.ts.map +1 -1
  40. package/dist/src/forms/inputs/TimeInput/TimePicker.vue.d.ts +12 -12
  41. package/dist/src/forms/inputs/TimeInput/TimePicker.vue.d.ts.map +1 -1
  42. package/dist/src/forms/inputs/UsernameInput/KdsUsernameInput.vue.d.ts +3 -3
  43. package/dist/src/forms/inputs/UsernameInput/KdsUsernameInput.vue.d.ts.map +1 -1
  44. package/dist/src/forms/selects/Dropdown/BaseDropdown.vue.d.ts +3 -1
  45. package/dist/src/forms/selects/Dropdown/BaseDropdown.vue.d.ts.map +1 -1
  46. package/dist/src/forms/selects/Dropdown/DropdownContainer.vue.d.ts +2 -2
  47. package/dist/src/forms/selects/Dropdown/KdsDropdown.vue.d.ts +48 -18
  48. package/dist/src/forms/selects/Dropdown/KdsDropdown.vue.d.ts.map +1 -1
  49. package/dist/src/forms/selects/Dropdown/KdsMultiSelectDropdown.vue.d.ts +48 -18
  50. package/dist/src/forms/selects/Dropdown/KdsMultiSelectDropdown.vue.d.ts.map +1 -1
  51. package/dist/src/forms/selects/Dropdown/MultiSelectDropdownContainer.vue.d.ts +2 -2
  52. package/dist/src/forms/types.d.ts +1 -1
  53. package/dist/src/forms/types.d.ts.map +1 -1
  54. package/dist/src/overlays/index.d.ts +2 -0
  55. package/dist/src/overlays/index.d.ts.map +1 -1
  56. package/dist/src/patterns/ResponsiveButtonGroup/KdsResponsiveButtonGroup.vue.d.ts +30 -19
  57. package/dist/src/patterns/ResponsiveButtonGroup/KdsResponsiveButtonGroup.vue.d.ts.map +1 -1
  58. package/package.json +2 -2
package/dist/index.css CHANGED
@@ -536,6 +536,11 @@ to {
536
536
  }
537
537
  }
538
538
 
539
+ .kds-missing-value-icon[data-v-df682150] {
540
+ color: var(--kds-color-text-and-icon-danger);
541
+ stroke-width: var(--kds-border-width-icon-stroke-s);
542
+ }
543
+
539
544
  .donut-container {
540
545
  &[data-v-f5faf61c] {
541
546
  display: flex;
@@ -1127,7 +1132,7 @@ html.kds-legacy {
1127
1132
  }
1128
1133
  }
1129
1134
 
1130
- .kds-menu-item-link[data-v-00c46d78] {
1135
+ .kds-menu-item-link[data-v-677d6ca6] {
1131
1136
  display: block;
1132
1137
  color: inherit;
1133
1138
  text-decoration: none;
@@ -1863,7 +1868,7 @@ html.kds-legacy {
1863
1868
  }
1864
1869
 
1865
1870
  .container {
1866
- &[data-v-b8ccb955] {
1871
+ &[data-v-93daa14e] {
1867
1872
  display: flex;
1868
1873
  align-items: center;
1869
1874
  width: 100%;
@@ -1875,46 +1880,46 @@ html.kds-legacy {
1875
1880
  border: var(--kds-border-action-input);
1876
1881
  border-radius: var(--kds-border-radius-container-0-37x);
1877
1882
  }
1878
- &[data-v-b8ccb955]:has(input:focus:not(:disabled)) {
1883
+ &[data-v-93daa14e]:has(input:focus:not(:disabled)) {
1879
1884
  outline: var(--kds-border-action-focused);
1880
1885
  outline-offset: var(--kds-spacing-offset-focus);
1881
1886
  }
1882
- &[data-v-b8ccb955]:has(.input-field:hover:not(:disabled, :focus)) {
1887
+ &[data-v-93daa14e]:has(.input-field:hover:not(:disabled, :focus)) {
1883
1888
  background: var(--kds-color-background-input-hover);
1884
1889
  }
1885
- &.error[data-v-b8ccb955] {
1890
+ &.error[data-v-93daa14e] {
1886
1891
  border: var(--kds-border-action-error);
1887
1892
  }
1888
- &.disabled[data-v-b8ccb955] {
1893
+ &.disabled[data-v-93daa14e] {
1889
1894
  cursor: default;
1890
1895
  border: var(--kds-border-action-disabled);
1891
1896
  border-color: var(--kds-color-border-disabled);
1892
1897
  }
1893
1898
  }
1894
1899
  .icon-wrapper {
1895
- &[data-v-b8ccb955] {
1900
+ &[data-v-93daa14e] {
1896
1901
  display: flex;
1897
1902
  flex-shrink: 0;
1898
1903
  align-items: center;
1899
1904
  color: var(--kds-color-text-and-icon-subtle);
1900
1905
  }
1901
- &.leading[data-v-b8ccb955] {
1906
+ &.leading[data-v-93daa14e] {
1902
1907
  padding-left: var(--kds-spacing-container-0-12x);
1903
1908
  }
1904
- &.trailing[data-v-b8ccb955] {
1909
+ &.trailing[data-v-93daa14e] {
1905
1910
  padding-right: var(--kds-spacing-container-0-12x);
1906
1911
  }
1907
- .container.disabled &[data-v-b8ccb955] {
1912
+ .container.disabled &[data-v-93daa14e] {
1908
1913
  color: var(--kds-color-text-and-icon-disabled);
1909
1914
  cursor: default;
1910
1915
  }
1911
- .container:focus-within &[data-v-b8ccb955],
1912
- .container:has(.input-field.has-value) &[data-v-b8ccb955] {
1916
+ .container:focus-within &[data-v-93daa14e],
1917
+ .container:has(.input-field.has-value) &[data-v-93daa14e] {
1913
1918
  color: var(--kds-color-text-and-icon-neutral);
1914
1919
  }
1915
1920
  }
1916
1921
  .input-field {
1917
- &[data-v-b8ccb955] {
1922
+ &[data-v-93daa14e] {
1918
1923
  flex: 1 0 0;
1919
1924
  min-width: 0;
1920
1925
  height: var(--kds-dimension-component-height-1-75x);
@@ -1933,36 +1938,36 @@ html.kds-legacy {
1933
1938
  /* hide native search cancel button on Safari/WebKit, we provide our own clearable button */
1934
1939
  }
1935
1940
  &[type="number"] {
1936
- &[data-v-b8ccb955] {
1941
+ &[data-v-93daa14e] {
1937
1942
  appearance: textfield;
1938
1943
  }
1939
- &[data-v-b8ccb955]::-webkit-outer-spin-button,
1940
- &[data-v-b8ccb955]::-webkit-inner-spin-button {
1944
+ &[data-v-93daa14e]::-webkit-outer-spin-button,
1945
+ &[data-v-93daa14e]::-webkit-inner-spin-button {
1941
1946
  margin: 0;
1942
1947
  appearance: none;
1943
1948
  }
1944
1949
  }
1945
- &[type="search"][data-v-b8ccb955]::-webkit-search-cancel-button {
1950
+ &[type="search"][data-v-93daa14e]::-webkit-search-cancel-button {
1946
1951
  appearance: none;
1947
1952
  }
1948
- &[data-v-b8ccb955]::placeholder {
1953
+ &[data-v-93daa14e]::placeholder {
1949
1954
  color: var(--kds-color-text-and-icon-subtle);
1950
1955
  }
1951
- &.empty-mask[data-v-b8ccb955] {
1956
+ &.empty-mask[data-v-93daa14e] {
1952
1957
  color: var(--kds-color-text-and-icon-subtle);
1953
1958
  }
1954
1959
  &:disabled {
1955
- &[data-v-b8ccb955] {
1960
+ &[data-v-93daa14e] {
1956
1961
  color: var(--kds-color-text-and-icon-disabled);
1957
1962
  cursor: default;
1958
1963
  }
1959
- &[data-v-b8ccb955]::placeholder {
1964
+ &[data-v-93daa14e]::placeholder {
1960
1965
  color: var(--kds-color-text-and-icon-disabled);
1961
1966
  }
1962
1967
  }
1963
1968
  }
1964
1969
  .unit {
1965
- &[data-v-b8ccb955] {
1970
+ &[data-v-93daa14e] {
1966
1971
  flex-shrink: 0;
1967
1972
  min-width: 0;
1968
1973
  margin: 0 var(--kds-spacing-container-0-12x);
@@ -1972,26 +1977,26 @@ html.kds-legacy {
1972
1977
  color: var(--kds-color-text-and-icon-neutral);
1973
1978
  white-space: nowrap;
1974
1979
  }
1975
- &.placeholder[data-v-b8ccb955] {
1980
+ &.placeholder[data-v-93daa14e] {
1976
1981
  color: var(--kds-color-text-and-icon-subtle);
1977
1982
  }
1978
- &.disabled[data-v-b8ccb955] {
1983
+ &.disabled[data-v-93daa14e] {
1979
1984
  color: var(--kds-color-text-and-icon-disabled);
1980
1985
  }
1981
- .container:focus-within &[data-v-b8ccb955] {
1986
+ .container:focus-within &[data-v-93daa14e] {
1982
1987
  color: var(--kds-color-text-and-icon-neutral);
1983
1988
  }
1984
1989
  }
1985
- .clear-button[data-v-b8ccb955] {
1990
+ .clear-button[data-v-93daa14e] {
1986
1991
  margin-left: var(--kds-spacing-container-0-12x);
1987
1992
  }
1988
- .leading-slot[data-v-b8ccb955] {
1993
+ .leading-slot[data-v-93daa14e] {
1989
1994
  display: flex;
1990
1995
  flex-shrink: 0;
1991
1996
  gap: var(--kds-spacing-container-0-12x);
1992
1997
  align-items: center;
1993
1998
  }
1994
- .trailing-slot[data-v-b8ccb955] {
1999
+ .trailing-slot[data-v-93daa14e] {
1995
2000
  display: flex;
1996
2001
  flex-shrink: 0;
1997
2002
  gap: var(--kds-spacing-container-0-12x);
@@ -1999,7 +2004,7 @@ html.kds-legacy {
1999
2004
  margin-left: var(--kds-spacing-container-0-12x);
2000
2005
  }
2001
2006
 
2002
- .kds-text-input-suggestions[data-v-c9f1be40] {
2007
+ .kds-text-input-suggestions[data-v-83f45d15] {
2003
2008
  max-height: var(--kds-dimension-component-height-12x);
2004
2009
  background-color: var(--kds-color-surface-default);
2005
2010
  border-radius: var(--kds-border-radius-container-0-50x);
@@ -2359,14 +2364,14 @@ html.kds-legacy {
2359
2364
  height: var(--kds-dimension-component-height-12x);
2360
2365
  }
2361
2366
 
2362
- .kds-search-results-container[data-v-3e274ed2] {
2367
+ .kds-search-results-container[data-v-aec3e3d0] {
2363
2368
  background-color: var(--kds-color-surface-default);
2364
2369
  border-radius: var(--kds-border-radius-container-0-50x);
2365
2370
  box-shadow: var(--kds-elevation-level-3);
2366
2371
  }
2367
2372
 
2368
2373
  textarea {
2369
- &[data-v-8e5a54cf] {
2374
+ &[data-v-36211819] {
2370
2375
  box-sizing: border-box;
2371
2376
  width: 100%;
2372
2377
  padding: calc(
@@ -2383,32 +2388,32 @@ textarea {
2383
2388
  border-radius: var(--kds-border-radius-container-0-37x);
2384
2389
  -ms-overflow-style: none;
2385
2390
  }
2386
- &.invalid[data-v-8e5a54cf] {
2391
+ &.invalid[data-v-36211819] {
2387
2392
  border: var(--kds-border-action-error);
2388
2393
  }
2389
- &[data-v-8e5a54cf]::placeholder {
2394
+ &[data-v-36211819]::placeholder {
2390
2395
  color: var(--kds-color-text-and-icon-subtle);
2391
2396
  }
2392
2397
  &:disabled {
2393
- &[data-v-8e5a54cf] {
2398
+ &[data-v-36211819] {
2394
2399
  color: var(--kds-color-text-and-icon-disabled);
2395
2400
  cursor: default;
2396
2401
  border: var(--kds-border-action-disabled);
2397
2402
  border-color: var(--kds-color-border-disabled);
2398
2403
  }
2399
- &[data-v-8e5a54cf]::placeholder {
2404
+ &[data-v-36211819]::placeholder {
2400
2405
  color: var(--kds-color-text-and-icon-disabled);
2401
2406
  }
2402
2407
  }
2403
- &[data-v-8e5a54cf]:hover:not(:disabled, :focus) {
2408
+ &[data-v-36211819]:hover:not(:disabled, :focus) {
2404
2409
  background: var(--kds-color-background-input-hover);
2405
2410
  }
2406
- &[data-v-8e5a54cf]:focus:not(:disabled) {
2411
+ &[data-v-36211819]:focus:not(:disabled) {
2407
2412
  outline: var(--kds-border-action-focused);
2408
2413
  outline-offset: var(--kds-spacing-offset-focus);
2409
2414
  }
2410
2415
  }
2411
- textarea[data-v-8e5a54cf]::-webkit-scrollbar {
2416
+ textarea[data-v-36211819]::-webkit-scrollbar {
2412
2417
  display: none;
2413
2418
  }
2414
2419
 
@@ -2492,7 +2497,7 @@ textarea[data-v-8e5a54cf]::-webkit-scrollbar {
2492
2497
  }
2493
2498
 
2494
2499
  .kds-dropdown-trigger-button {
2495
- &[data-v-0f4de8fb] {
2500
+ &[data-v-1bb2d375] {
2496
2501
  display: flex;
2497
2502
  align-items: center;
2498
2503
  width: 100%;
@@ -2506,24 +2511,24 @@ textarea[data-v-8e5a54cf]::-webkit-scrollbar {
2506
2511
  border: var(--kds-border-action-input);
2507
2512
  border-radius: var(--kds-border-radius-container-0-37x);
2508
2513
  }
2509
- &[data-v-0f4de8fb]:focus-visible {
2514
+ &[data-v-1bb2d375]:focus-visible {
2510
2515
  outline: var(--kds-border-action-focused);
2511
2516
  outline-offset: var(--kds-spacing-offset-focus);
2512
2517
  }
2513
- &.error[data-v-0f4de8fb] {
2518
+ &.error[data-v-1bb2d375] {
2514
2519
  border: var(--kds-border-action-error);
2515
2520
  }
2516
- &[data-v-0f4de8fb]:disabled {
2521
+ &[data-v-1bb2d375]:disabled {
2517
2522
  color: var(--kds-color-text-and-icon-disabled);
2518
2523
  cursor: default;
2519
2524
  border: var(--kds-border-action-disabled);
2520
2525
  border-color: var(--kds-color-border-disabled);
2521
2526
  }
2522
- &[data-v-0f4de8fb]:not(:disabled, :focus):hover {
2527
+ &[data-v-1bb2d375]:not(:disabled, :focus):hover {
2523
2528
  background: var(--kds-color-background-input-hover);
2524
2529
  }
2525
2530
  }
2526
- .leading[data-v-0f4de8fb] {
2531
+ .leading[data-v-1bb2d375] {
2527
2532
  display: flex;
2528
2533
  flex-shrink: 0;
2529
2534
  align-items: center;
@@ -2532,7 +2537,7 @@ textarea[data-v-8e5a54cf]::-webkit-scrollbar {
2532
2537
  margin-left: var(--kds-spacing-container-0-12x);
2533
2538
  }
2534
2539
  .text {
2535
- &[data-v-0f4de8fb] {
2540
+ &[data-v-1bb2d375] {
2536
2541
  flex: 1 0 0;
2537
2542
  min-width: 0;
2538
2543
  padding: var(--kds-spacing-container-0-25x);
@@ -2541,14 +2546,14 @@ textarea[data-v-8e5a54cf]::-webkit-scrollbar {
2541
2546
  text-align: left;
2542
2547
  white-space: nowrap;
2543
2548
  }
2544
- &.placeholder[data-v-0f4de8fb] {
2549
+ &.placeholder[data-v-1bb2d375] {
2545
2550
  color: var(--kds-color-text-and-icon-subtle);
2546
2551
  }
2547
- &.missing[data-v-0f4de8fb] {
2552
+ &.missing[data-v-1bb2d375] {
2548
2553
  color: var(--kds-color-text-and-icon-danger);
2549
2554
  }
2550
2555
  }
2551
- .trailing[data-v-0f4de8fb] {
2556
+ .trailing[data-v-1bb2d375] {
2552
2557
  display: flex;
2553
2558
  flex-shrink: 0;
2554
2559
  align-items: center;