@knime/kds-components 0.28.8 → 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.
- package/dist/index.css +16 -11
- package/dist/index.js +97 -32
- package/dist/index.js.map +1 -1
- package/dist/src/accessories/MissingValueIcon/KdsMissingValueIcon.vue.d.ts +7 -0
- package/dist/src/accessories/MissingValueIcon/KdsMissingValueIcon.vue.d.ts.map +1 -0
- package/dist/src/accessories/MissingValueIcon/index.d.ts +2 -0
- package/dist/src/accessories/MissingValueIcon/index.d.ts.map +1 -0
- package/dist/src/accessories/index.d.ts +1 -0
- package/dist/src/accessories/index.d.ts.map +1 -1
- package/dist/src/buttons/KdsMenuButton/KdsMenuButton.vue.d.ts +29 -19
- package/dist/src/buttons/KdsMenuButton/KdsMenuButton.vue.d.ts.map +1 -1
- package/dist/src/buttons/KdsSplitButton/KdsSplitButton.vue.d.ts +15 -15
- package/dist/src/containers/Menu/KdsMenu.vue.d.ts +30 -30
- package/dist/src/containers/MenuContainer/KdsMenuItem.vue.d.ts.map +1 -1
- package/dist/src/containers/MenuContainer/types.d.ts +5 -0
- package/dist/src/containers/MenuContainer/types.d.ts.map +1 -1
- package/dist/src/forms/_helper/InfoPopover/KdsInfoToggleButton.vue.d.ts +30 -30
- package/dist/src/forms/_helper/VariablePopover/KdsVariableToggleButton.vue.d.ts +30 -30
- package/dist/src/forms/inputs/ColorInput/KdsColorInput.vue.d.ts +15 -15
- package/dist/src/forms/inputs/DateInput/KdsDateInput.vue.d.ts +15 -15
- package/dist/src/forms/inputs/DateTimeFormatInput/KdsDateTimeFormatInput.vue.d.ts +15 -15
- package/dist/src/forms/inputs/IntervalInput/KdsIntervalInput.vue.d.ts +15 -15
- package/dist/src/forms/inputs/SearchInput/KdsSearchInput.vue.d.ts +15 -15
- package/dist/src/forms/inputs/TextInput/KdsTextInput.vue.d.ts +15 -15
- package/dist/src/forms/inputs/TimeInput/KdsTimeInput.vue.d.ts +15 -15
- package/dist/src/forms/selects/Dropdown/BaseDropdown.vue.d.ts +3 -1
- package/dist/src/forms/selects/Dropdown/BaseDropdown.vue.d.ts.map +1 -1
- package/dist/src/forms/selects/Dropdown/KdsDropdown.vue.d.ts +46 -16
- package/dist/src/forms/selects/Dropdown/KdsDropdown.vue.d.ts.map +1 -1
- package/dist/src/forms/selects/Dropdown/KdsMultiSelectDropdown.vue.d.ts +46 -16
- package/dist/src/forms/selects/Dropdown/KdsMultiSelectDropdown.vue.d.ts.map +1 -1
- package/dist/src/overlays/index.d.ts +2 -0
- package/dist/src/overlays/index.d.ts.map +1 -1
- package/dist/src/patterns/ResponsiveButtonGroup/KdsResponsiveButtonGroup.vue.d.ts +30 -19
- package/dist/src/patterns/ResponsiveButtonGroup/KdsResponsiveButtonGroup.vue.d.ts.map +1 -1
- 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-
|
|
1135
|
+
.kds-menu-item-link[data-v-677d6ca6] {
|
|
1131
1136
|
display: block;
|
|
1132
1137
|
color: inherit;
|
|
1133
1138
|
text-decoration: none;
|
|
@@ -2492,7 +2497,7 @@ textarea[data-v-36211819]::-webkit-scrollbar {
|
|
|
2492
2497
|
}
|
|
2493
2498
|
|
|
2494
2499
|
.kds-dropdown-trigger-button {
|
|
2495
|
-
&[data-v-
|
|
2500
|
+
&[data-v-1bb2d375] {
|
|
2496
2501
|
display: flex;
|
|
2497
2502
|
align-items: center;
|
|
2498
2503
|
width: 100%;
|
|
@@ -2506,24 +2511,24 @@ textarea[data-v-36211819]::-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-
|
|
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-
|
|
2518
|
+
&.error[data-v-1bb2d375] {
|
|
2514
2519
|
border: var(--kds-border-action-error);
|
|
2515
2520
|
}
|
|
2516
|
-
&[data-v-
|
|
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-
|
|
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-
|
|
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-36211819]::-webkit-scrollbar {
|
|
|
2532
2537
|
margin-left: var(--kds-spacing-container-0-12x);
|
|
2533
2538
|
}
|
|
2534
2539
|
.text {
|
|
2535
|
-
&[data-v-
|
|
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-36211819]::-webkit-scrollbar {
|
|
|
2541
2546
|
text-align: left;
|
|
2542
2547
|
white-space: nowrap;
|
|
2543
2548
|
}
|
|
2544
|
-
&.placeholder[data-v-
|
|
2549
|
+
&.placeholder[data-v-1bb2d375] {
|
|
2545
2550
|
color: var(--kds-color-text-and-icon-subtle);
|
|
2546
2551
|
}
|
|
2547
|
-
&.missing[data-v-
|
|
2552
|
+
&.missing[data-v-1bb2d375] {
|
|
2548
2553
|
color: var(--kds-color-text-and-icon-danger);
|
|
2549
2554
|
}
|
|
2550
2555
|
}
|
|
2551
|
-
.trailing[data-v-
|
|
2556
|
+
.trailing[data-v-1bb2d375] {
|
|
2552
2557
|
display: flex;
|
|
2553
2558
|
flex-shrink: 0;
|
|
2554
2559
|
align-items: center;
|
package/dist/index.js
CHANGED
|
@@ -16,7 +16,7 @@ const _hoisted_3$t = {
|
|
|
16
16
|
class: "kds-avatar-initials",
|
|
17
17
|
"aria-hidden": "true"
|
|
18
18
|
};
|
|
19
|
-
const _sfc_main$
|
|
19
|
+
const _sfc_main$1A = /* @__PURE__ */ defineComponent({
|
|
20
20
|
__name: "KdsAvatar",
|
|
21
21
|
props: {
|
|
22
22
|
initials: {},
|
|
@@ -96,7 +96,7 @@ const _export_sfc = (sfc, props) => {
|
|
|
96
96
|
return target;
|
|
97
97
|
};
|
|
98
98
|
|
|
99
|
-
const KdsAvatar = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
99
|
+
const KdsAvatar = /* @__PURE__ */ _export_sfc(_sfc_main$1A, [["__scopeId", "data-v-9e1a5abe"]]);
|
|
100
100
|
|
|
101
101
|
const _hoisted_1$$ = ["aria-label"];
|
|
102
102
|
const _hoisted_2$B = { class: "avatars" };
|
|
@@ -105,7 +105,7 @@ const _hoisted_3$s = {
|
|
|
105
105
|
class: "more-count",
|
|
106
106
|
"aria-hidden": "true"
|
|
107
107
|
};
|
|
108
|
-
const _sfc_main$
|
|
108
|
+
const _sfc_main$1z = /* @__PURE__ */ defineComponent({
|
|
109
109
|
__name: "KdsAvatarCounter",
|
|
110
110
|
props: {
|
|
111
111
|
moreCount: { default: 0 },
|
|
@@ -145,7 +145,7 @@ const _sfc_main$1y = /* @__PURE__ */ defineComponent({
|
|
|
145
145
|
}
|
|
146
146
|
});
|
|
147
147
|
|
|
148
|
-
const KdsAvatarCounter = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
148
|
+
const KdsAvatarCounter = /* @__PURE__ */ _export_sfc(_sfc_main$1z, [["__scopeId", "data-v-1aef516d"]]);
|
|
149
149
|
|
|
150
150
|
const __variableDynamicImportRuntimeHelper = (glob$1, path$13, segs) => {
|
|
151
151
|
const v = glob$1[path$13];
|
|
@@ -202,7 +202,7 @@ function useIcon({
|
|
|
202
202
|
};
|
|
203
203
|
}
|
|
204
204
|
|
|
205
|
-
const _sfc_main$
|
|
205
|
+
const _sfc_main$1y = /* @__PURE__ */ defineComponent({
|
|
206
206
|
__name: "KdsIcon",
|
|
207
207
|
props: {
|
|
208
208
|
name: {},
|
|
@@ -232,7 +232,7 @@ const _sfc_main$1x = /* @__PURE__ */ defineComponent({
|
|
|
232
232
|
}
|
|
233
233
|
});
|
|
234
234
|
|
|
235
|
-
const KdsIcon = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
235
|
+
const KdsIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1y, [["__scopeId", "data-v-bff4f419"]]);
|
|
236
236
|
|
|
237
237
|
const ID_TO_ICON_MAP = {
|
|
238
238
|
// Flow Variables
|
|
@@ -576,7 +576,7 @@ const kdsDataTypeSize = {
|
|
|
576
576
|
const kdsDataTypeSizes = Object.values(kdsDataTypeSize);
|
|
577
577
|
|
|
578
578
|
const _hoisted_1$_ = ["title"];
|
|
579
|
-
const _sfc_main$
|
|
579
|
+
const _sfc_main$1x = /* @__PURE__ */ defineComponent({
|
|
580
580
|
__name: "KdsDataType",
|
|
581
581
|
props: {
|
|
582
582
|
iconName: { default: "unknown-datatype" },
|
|
@@ -622,7 +622,7 @@ const _sfc_main$1w = /* @__PURE__ */ defineComponent({
|
|
|
622
622
|
}
|
|
623
623
|
});
|
|
624
624
|
|
|
625
|
-
const KdsDataType = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
625
|
+
const KdsDataType = /* @__PURE__ */ _export_sfc(_sfc_main$1x, [["__scopeId", "data-v-38e9537f"]]);
|
|
626
626
|
|
|
627
627
|
const kdsBadgeVariant = {
|
|
628
628
|
NEUTRAL: "neutral",
|
|
@@ -640,7 +640,7 @@ const kdsBadgeSize = {
|
|
|
640
640
|
const kdsBadgeSizes = Object.values(kdsBadgeSize);
|
|
641
641
|
|
|
642
642
|
const _hoisted_1$Z = { class: "label-wrapper" };
|
|
643
|
-
const _sfc_main$
|
|
643
|
+
const _sfc_main$1w = /* @__PURE__ */ defineComponent({
|
|
644
644
|
__name: "KdsBadge",
|
|
645
645
|
props: {
|
|
646
646
|
label: {},
|
|
@@ -668,7 +668,7 @@ const _sfc_main$1v = /* @__PURE__ */ defineComponent({
|
|
|
668
668
|
}
|
|
669
669
|
});
|
|
670
670
|
|
|
671
|
-
const KdsBadge = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
671
|
+
const KdsBadge = /* @__PURE__ */ _export_sfc(_sfc_main$1w, [["__scopeId", "data-v-df64f7cf"]]);
|
|
672
672
|
|
|
673
673
|
const kdsColorSwatchType = {
|
|
674
674
|
LEARNER: "learner",
|
|
@@ -694,7 +694,7 @@ const ALPHA_NIBBLE_INDEX = 3;
|
|
|
694
694
|
const ALPHA_BYTE_START = 6;
|
|
695
695
|
const RGB_SHORT_HEX_LENGTH = 3;
|
|
696
696
|
const RGB_LONG_HEX_LENGTH = 6;
|
|
697
|
-
const _sfc_main$
|
|
697
|
+
const _sfc_main$1v = /* @__PURE__ */ defineComponent({
|
|
698
698
|
__name: "KdsColorSwatch",
|
|
699
699
|
props: {
|
|
700
700
|
color: {},
|
|
@@ -774,7 +774,7 @@ const _sfc_main$1u = /* @__PURE__ */ defineComponent({
|
|
|
774
774
|
}
|
|
775
775
|
});
|
|
776
776
|
|
|
777
|
-
const KdsColorSwatch = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
777
|
+
const KdsColorSwatch = /* @__PURE__ */ _export_sfc(_sfc_main$1v, [["__scopeId", "data-v-91e0130d"]]);
|
|
778
778
|
|
|
779
779
|
const kdsDarkModeType = {
|
|
780
780
|
LIGHT: "light",
|
|
@@ -896,7 +896,7 @@ function useKdsIsTruncated(elementRef) {
|
|
|
896
896
|
|
|
897
897
|
const _hoisted_1$X = ["title", "aria-label"];
|
|
898
898
|
const _hoisted_2$A = ["title"];
|
|
899
|
-
const _sfc_main$
|
|
899
|
+
const _sfc_main$1u = /* @__PURE__ */ defineComponent({
|
|
900
900
|
__name: "KdsLiveStatus",
|
|
901
901
|
props: {
|
|
902
902
|
status: { default: "red" },
|
|
@@ -931,7 +931,7 @@ const _sfc_main$1t = /* @__PURE__ */ defineComponent({
|
|
|
931
931
|
}
|
|
932
932
|
});
|
|
933
933
|
|
|
934
|
-
const KdsLiveStatus = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
934
|
+
const KdsLiveStatus = /* @__PURE__ */ _export_sfc(_sfc_main$1u, [["__scopeId", "data-v-01555495"]]);
|
|
935
935
|
|
|
936
936
|
const kdsLiveStatusStatus = {
|
|
937
937
|
RED: "red",
|
|
@@ -948,7 +948,7 @@ const kdsLiveStatusSize = {
|
|
|
948
948
|
const kdsLiveStatusSizes = Object.values(kdsLiveStatusSize);
|
|
949
949
|
|
|
950
950
|
const _hoisted_1$W = ["data-style"];
|
|
951
|
-
const _sfc_main$
|
|
951
|
+
const _sfc_main$1t = /* @__PURE__ */ defineComponent({
|
|
952
952
|
__name: "KdsLoadingSpinner",
|
|
953
953
|
props: {
|
|
954
954
|
size: { default: "medium" },
|
|
@@ -978,7 +978,7 @@ const _sfc_main$1s = /* @__PURE__ */ defineComponent({
|
|
|
978
978
|
}
|
|
979
979
|
});
|
|
980
980
|
|
|
981
|
-
const KdsLoadingSpinner = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
981
|
+
const KdsLoadingSpinner = /* @__PURE__ */ _export_sfc(_sfc_main$1t, [["__scopeId", "data-v-54835dc0"]]);
|
|
982
982
|
|
|
983
983
|
const kdsLoadingSpinnerVariant = {
|
|
984
984
|
ON_PRIMARY: "onPrimary",
|
|
@@ -995,7 +995,7 @@ const _hoisted_4$n = {
|
|
|
995
995
|
key: 0,
|
|
996
996
|
class: "body"
|
|
997
997
|
};
|
|
998
|
-
const _sfc_main$
|
|
998
|
+
const _sfc_main$1s = /* @__PURE__ */ defineComponent({
|
|
999
999
|
__name: "KdsInlineMessage",
|
|
1000
1000
|
props: {
|
|
1001
1001
|
headline: {},
|
|
@@ -1040,7 +1040,7 @@ const _sfc_main$1r = /* @__PURE__ */ defineComponent({
|
|
|
1040
1040
|
}
|
|
1041
1041
|
});
|
|
1042
1042
|
|
|
1043
|
-
const KdsInlineMessage = /* @__PURE__ */ _export_sfc(_sfc_main$
|
|
1043
|
+
const KdsInlineMessage = /* @__PURE__ */ _export_sfc(_sfc_main$1s, [["__scopeId", "data-v-af14056f"]]);
|
|
1044
1044
|
|
|
1045
1045
|
const kdsInlineMessageVariant = {
|
|
1046
1046
|
ERROR: "error",
|
|
@@ -1050,6 +1050,24 @@ const kdsInlineMessageVariant = {
|
|
|
1050
1050
|
};
|
|
1051
1051
|
const kdsInlineMessageVariants = Object.values(kdsInlineMessageVariant);
|
|
1052
1052
|
|
|
1053
|
+
const _sfc_main$1r = /* @__PURE__ */ defineComponent({
|
|
1054
|
+
__name: "KdsMissingValueIcon",
|
|
1055
|
+
props: {
|
|
1056
|
+
size: {}
|
|
1057
|
+
},
|
|
1058
|
+
setup(__props) {
|
|
1059
|
+
return (_ctx, _cache) => {
|
|
1060
|
+
return openBlock(), createBlock(KdsIcon, {
|
|
1061
|
+
name: "circle-question",
|
|
1062
|
+
size: __props.size,
|
|
1063
|
+
class: "kds-missing-value-icon"
|
|
1064
|
+
}, null, 8, ["size"]);
|
|
1065
|
+
};
|
|
1066
|
+
}
|
|
1067
|
+
});
|
|
1068
|
+
|
|
1069
|
+
const KdsMissingValueIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["__scopeId", "data-v-df682150"]]);
|
|
1070
|
+
|
|
1053
1071
|
const _hoisted_1$U = { class: "donut-container" };
|
|
1054
1072
|
const _hoisted_2$y = ["height", "width", "viewBox"];
|
|
1055
1073
|
const _hoisted_3$q = ["r", "stroke-width"];
|
|
@@ -2337,11 +2355,12 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
|
|
|
2337
2355
|
active: __props.activeId === __props.item.id,
|
|
2338
2356
|
variant: __props.variant,
|
|
2339
2357
|
badge: __props.item.badge,
|
|
2358
|
+
"trailing-icon": __props.item.trailingIcon,
|
|
2340
2359
|
shortcut: __props.item.shortcut,
|
|
2341
2360
|
role: "menuitem"
|
|
2342
2361
|
}, _ctx.$attrs, {
|
|
2343
2362
|
onClick: _cache[2] || (_cache[2] = ($event) => !__props.item.disabled && _ctx.$emit("click", $event))
|
|
2344
|
-
}), null, 16, ["id", "accessory", "text", "sub-text", "disabled", "active", "variant", "badge", "shortcut"])),
|
|
2363
|
+
}), null, 16, ["id", "accessory", "text", "sub-text", "disabled", "active", "variant", "badge", "trailing-icon", "shortcut"])),
|
|
2345
2364
|
__props.item.separator && !__props.isLast ? (openBlock(), createBlock(unref(KdsDivider), {
|
|
2346
2365
|
key: 3,
|
|
2347
2366
|
class: "kds-list-item-divider",
|
|
@@ -2353,7 +2372,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
|
|
|
2353
2372
|
}
|
|
2354
2373
|
});
|
|
2355
2374
|
|
|
2356
|
-
const KdsMenuItem = /* @__PURE__ */ _export_sfc(_sfc_main$1f, [["__scopeId", "data-v-
|
|
2375
|
+
const KdsMenuItem = /* @__PURE__ */ _export_sfc(_sfc_main$1f, [["__scopeId", "data-v-677d6ca6"]]);
|
|
2357
2376
|
|
|
2358
2377
|
const _hoisted_1$N = ["id", "aria-label", "aria-activedescendant"];
|
|
2359
2378
|
const _sfc_main$1e = /* @__PURE__ */ defineComponent({
|
|
@@ -2467,10 +2486,24 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
|
|
|
2467
2486
|
const KdsMenuContainer = /* @__PURE__ */ _export_sfc(_sfc_main$1e, [["__scopeId", "data-v-cce3fc40"]]);
|
|
2468
2487
|
|
|
2469
2488
|
const kdsPopoverPlacement = {
|
|
2489
|
+
TOP_LEFT: "top-left",
|
|
2490
|
+
TOP_RIGHT: "top-right",
|
|
2491
|
+
BOTTOM_LEFT: "bottom-left",
|
|
2492
|
+
BOTTOM_RIGHT: "bottom-right",
|
|
2470
2493
|
CUSTOM: "custom"
|
|
2471
2494
|
};
|
|
2495
|
+
const kdsPopoverPlacements = Object.values(kdsPopoverPlacement);
|
|
2496
|
+
const kdsPopoverRole = {
|
|
2497
|
+
DIALOG: "dialog",
|
|
2498
|
+
MENU: "menu",
|
|
2499
|
+
LISTBOX: "listbox"
|
|
2500
|
+
};
|
|
2501
|
+
const kdsPopoverRoles = Object.values(kdsPopoverRole);
|
|
2472
2502
|
const kdsPopoverType = {
|
|
2473
|
-
AUTO: "auto"
|
|
2503
|
+
AUTO: "auto",
|
|
2504
|
+
MANUAL: "manual"
|
|
2505
|
+
};
|
|
2506
|
+
const kdsPopoverTypes = Object.values(kdsPopoverType);
|
|
2474
2507
|
|
|
2475
2508
|
const _hoisted_1$M = ["id", "popover", "role"];
|
|
2476
2509
|
const _hoisted_2$t = {
|
|
@@ -2554,7 +2587,7 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
|
|
|
2554
2587
|
inheritAttrs: false
|
|
2555
2588
|
},
|
|
2556
2589
|
__name: "KdsMenuButton",
|
|
2557
|
-
props: {
|
|
2590
|
+
props: /* @__PURE__ */ mergeModels({
|
|
2558
2591
|
dataTestId: {},
|
|
2559
2592
|
size: {},
|
|
2560
2593
|
disabled: { type: Boolean },
|
|
@@ -2566,8 +2599,11 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
|
|
|
2566
2599
|
ariaLabel: {},
|
|
2567
2600
|
items: {},
|
|
2568
2601
|
menuMaxHeight: {}
|
|
2569
|
-
},
|
|
2570
|
-
|
|
2602
|
+
}, {
|
|
2603
|
+
"modelValue": { type: Boolean, ...{ default: false } },
|
|
2604
|
+
"modelModifiers": {}
|
|
2605
|
+
}),
|
|
2606
|
+
emits: /* @__PURE__ */ mergeModels(["itemClick"], ["update:modelValue"]),
|
|
2571
2607
|
setup(__props, { expose: __expose, emit: __emit }) {
|
|
2572
2608
|
const props = createPropsRestProxy(__props, ["variant", "menuMaxHeight"]);
|
|
2573
2609
|
const attrs = useAttrs();
|
|
@@ -2581,7 +2617,7 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
|
|
|
2581
2617
|
} = attrs;
|
|
2582
2618
|
return { ...safeAttrs, ...rest, variant: __props.variant };
|
|
2583
2619
|
});
|
|
2584
|
-
const isMenuOpen =
|
|
2620
|
+
const isMenuOpen = useModel(__props, "modelValue");
|
|
2585
2621
|
const popoverEl = useTemplateRef("popover");
|
|
2586
2622
|
const menuContainerEl = useTemplateRef("menuContainer");
|
|
2587
2623
|
const menuButtonEl = useTemplateRef("menuButton");
|
|
@@ -13547,6 +13583,7 @@ const _hoisted_4$a = {
|
|
|
13547
13583
|
class: "trailing",
|
|
13548
13584
|
"aria-hidden": "true"
|
|
13549
13585
|
};
|
|
13586
|
+
const TRIGGER_REF = "triggerEl";
|
|
13550
13587
|
const _sfc_main$A = /* @__PURE__ */ defineComponent({
|
|
13551
13588
|
__name: "BaseDropdown",
|
|
13552
13589
|
props: /* @__PURE__ */ mergeModels({
|
|
@@ -13567,10 +13604,17 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
|
|
|
13567
13604
|
"openModifiers": {}
|
|
13568
13605
|
}),
|
|
13569
13606
|
emits: /* @__PURE__ */ mergeModels(["click", "keydown"], ["update:open"]),
|
|
13570
|
-
setup(__props, { emit: __emit }) {
|
|
13607
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
13571
13608
|
const props = createPropsRestProxy(__props, ["disabled", "error", "missing", "ariaInvalid"]);
|
|
13572
13609
|
const open = useModel(__props, "open");
|
|
13573
13610
|
const valueTextId = useId();
|
|
13611
|
+
const triggerEl = useTemplateRef(TRIGGER_REF);
|
|
13612
|
+
__expose({
|
|
13613
|
+
/**
|
|
13614
|
+
* Focuses the trigger button
|
|
13615
|
+
*/
|
|
13616
|
+
focus: () => triggerEl.value?.focus()
|
|
13617
|
+
});
|
|
13574
13618
|
const ariaLabelledby = computed(() => {
|
|
13575
13619
|
if (props.ariaLabel) {
|
|
13576
13620
|
return void 0;
|
|
@@ -13606,6 +13650,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
|
|
|
13606
13650
|
return (_ctx, _cache) => {
|
|
13607
13651
|
return openBlock(), createElementBlock("button", {
|
|
13608
13652
|
id: props.id,
|
|
13653
|
+
ref: TRIGGER_REF,
|
|
13609
13654
|
class: normalizeClass(["kds-dropdown-trigger-button", { error: __props.error }]),
|
|
13610
13655
|
type: "button",
|
|
13611
13656
|
"aria-expanded": open.value,
|
|
@@ -13643,7 +13688,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
|
|
|
13643
13688
|
}
|
|
13644
13689
|
});
|
|
13645
13690
|
|
|
13646
|
-
const BaseDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["__scopeId", "data-v-
|
|
13691
|
+
const BaseDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["__scopeId", "data-v-1bb2d375"]]);
|
|
13647
13692
|
|
|
13648
13693
|
const DROPDOWN_SEARCH_THRESHOLD = 12;
|
|
13649
13694
|
|
|
@@ -13791,12 +13836,13 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
|
|
|
13791
13836
|
"modelModifiers": {}
|
|
13792
13837
|
}),
|
|
13793
13838
|
emits: ["update:modelValue"],
|
|
13794
|
-
setup(__props) {
|
|
13839
|
+
setup(__props, { expose: __expose }) {
|
|
13795
13840
|
const props = createPropsRestProxy(__props, ["placeholder", "disabled", "loading", "error", "validating", "preserveSubTextSpace"]);
|
|
13796
13841
|
const modelValue = useModel(__props, "modelValue");
|
|
13797
13842
|
const open = ref(false);
|
|
13798
13843
|
const popoverEl = useTemplateRef("popoverEl");
|
|
13799
13844
|
const dropdownContainerEl = useTemplateRef("dropdownContainerEl");
|
|
13845
|
+
const baseDropdownEl = useTemplateRef("baseDropdownEl");
|
|
13800
13846
|
const selectedOption = computed(
|
|
13801
13847
|
() => props.possibleValues.find((o) => o.id === modelValue.value)
|
|
13802
13848
|
);
|
|
@@ -13808,6 +13854,12 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
|
|
|
13808
13854
|
const closeDropdown = () => {
|
|
13809
13855
|
open.value = false;
|
|
13810
13856
|
};
|
|
13857
|
+
__expose({
|
|
13858
|
+
/**
|
|
13859
|
+
* Focuses the trigger button
|
|
13860
|
+
*/
|
|
13861
|
+
focus: () => baseDropdownEl.value?.focus()
|
|
13862
|
+
});
|
|
13811
13863
|
return (_ctx, _cache) => {
|
|
13812
13864
|
return openBlock(), createBlock(BaseFormFieldWrapper, {
|
|
13813
13865
|
id: props.id,
|
|
@@ -13820,7 +13872,10 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
|
|
|
13820
13872
|
"preserve-sub-text-space": __props.preserveSubTextSpace
|
|
13821
13873
|
}, {
|
|
13822
13874
|
default: withCtx((slotProps) => [
|
|
13823
|
-
createVNode(BaseDropdown, mergeProps(
|
|
13875
|
+
createVNode(BaseDropdown, mergeProps({
|
|
13876
|
+
ref_key: "baseDropdownEl",
|
|
13877
|
+
ref: baseDropdownEl
|
|
13878
|
+
}, slotProps, {
|
|
13824
13879
|
open: open.value,
|
|
13825
13880
|
"onUpdate:open": _cache[0] || (_cache[0] = ($event) => open.value = $event),
|
|
13826
13881
|
text: modelValue.value && !selectedOption.value ? `(Missing) ${modelValue.value}` : selectedOption.value?.text,
|
|
@@ -14102,12 +14157,13 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
|
|
|
14102
14157
|
"modelModifiers": {}
|
|
14103
14158
|
}),
|
|
14104
14159
|
emits: ["update:modelValue"],
|
|
14105
|
-
setup(__props) {
|
|
14160
|
+
setup(__props, { expose: __expose }) {
|
|
14106
14161
|
const props = createPropsRestProxy(__props, ["placeholder", "disabled", "loading", "allowNewValues", "error", "validating", "preserveSubTextSpace"]);
|
|
14107
14162
|
const modelValue = useModel(__props, "modelValue");
|
|
14108
14163
|
const open = ref(false);
|
|
14109
14164
|
const dropdownContainerEl = useTemplateRef("dropdownContainerEl");
|
|
14110
14165
|
const popoverEl = useTemplateRef("popoverEl");
|
|
14166
|
+
const baseDropdownEl = useTemplateRef("baseDropdownEl");
|
|
14111
14167
|
watchEffect(() => {
|
|
14112
14168
|
if (open.value) {
|
|
14113
14169
|
nextTick(() => dropdownContainerEl.value?.focus());
|
|
@@ -14146,6 +14202,12 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
|
|
|
14146
14202
|
addedOptions.value = [...addedOptions.value, { id: text, text }];
|
|
14147
14203
|
modelValue.value = [...modelValue.value, text];
|
|
14148
14204
|
};
|
|
14205
|
+
__expose({
|
|
14206
|
+
/**
|
|
14207
|
+
* Focuses the trigger button
|
|
14208
|
+
*/
|
|
14209
|
+
focus: () => baseDropdownEl.value?.focus()
|
|
14210
|
+
});
|
|
14149
14211
|
return (_ctx, _cache) => {
|
|
14150
14212
|
return openBlock(), createBlock(BaseFormFieldWrapper, {
|
|
14151
14213
|
id: props.id,
|
|
@@ -14158,7 +14220,10 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
|
|
|
14158
14220
|
"preserve-sub-text-space": __props.preserveSubTextSpace
|
|
14159
14221
|
}, {
|
|
14160
14222
|
default: withCtx((slotProps) => [
|
|
14161
|
-
createVNode(BaseDropdown, mergeProps(
|
|
14223
|
+
createVNode(BaseDropdown, mergeProps({
|
|
14224
|
+
ref_key: "baseDropdownEl",
|
|
14225
|
+
ref: baseDropdownEl
|
|
14226
|
+
}, slotProps, {
|
|
14162
14227
|
open: open.value,
|
|
14163
14228
|
"onUpdate:open": _cache[0] || (_cache[0] = ($event) => open.value = $event),
|
|
14164
14229
|
text: summary.value,
|
|
@@ -18001,5 +18066,5 @@ const kdsResponsiveButtonGroupAlignments = Object.values(
|
|
|
18001
18066
|
kdsResponsiveButtonGroupAlignment
|
|
18002
18067
|
);
|
|
18003
18068
|
|
|
18004
|
-
export { KdsAccordion, KdsAvatar, KdsAvatarCounter, KdsBadge, KdsBreadcrumb, _sfc_main$1n as KdsButton, _sfc_main$g as KdsCard, _sfc_main$12 as KdsCheckbox, KdsCheckboxGroup, KdsClickableCard, _sfc_main$R as KdsColorInput, KdsColorSwatch, _sfc_main$17 as KdsContextMenu, KdsDataType, _sfc_main$K as KdsDateInput, _sfc_main$I as KdsDateTimeFormatInput, KdsDivider, KdsDonutChart, _sfc_main$y as KdsDropdown, KdsDynamicModalProvider, KdsEmptyState, KdsIcon, KdsInfoToggleButton, KdsInlineMessage, _sfc_main$B as KdsIntervalInput, KdsLabel, KdsLink, _sfc_main$1m as KdsLinkButton, KdsLinkCard, KdsListContainer, KdsLiveStatus, KdsLoadingSkeleton, KdsLoadingSpinner, _sfc_main$18 as KdsMenu, _sfc_main$1c as KdsMenuButton, KdsModal, KdsModalLayout, _sfc_main$v as KdsMultiSelectDropdown, KdsNavItem, KdsNavigation, _sfc_main$V as KdsNumberInput, KdsPanel, _sfc_main$Q as KdsPasswordInput, _sfc_main$H as KdsPatternInput, KdsPreviewList, KdsProgressButton, KdsRadioButton, KdsRadioButtonGroup, KdsResponsiveButtonGroup, KdsSearchInput, KdsSelectableCard, KdsSortableListBox, KdsSplitButton, KdsSubText, KdsTabBar, KdsTextInput, KdsTextarea, _sfc_main$D as KdsTimeInput, _sfc_main$1k as KdsToggleButton, KdsTwinList, _sfc_main$P as KdsUsernameInput, KdsValueSwitch, KdsVariableToggleButton, kdsAvatarSize, kdsAvatarSizes, kdsBadgeSize, kdsBadgeSizes, kdsBadgeVariant, kdsBadgeVariants, kdsButtonSize, kdsButtonSizes, kdsButtonVariant, kdsButtonVariants, kdsCardVariant, kdsCardVariants, kdsCheckboxGroupAlignment, kdsCheckboxGroupAlignments, kdsCheckboxValue, kdsCheckboxValues, kdsColorSwatchSize, kdsColorSwatchSizes, kdsColorSwatchType, kdsColorSwatchTypes, kdsDarkModeType, kdsDarkModeTypes, kdsDataTypeSize, kdsDataTypeSizes, kdsDateFormatCategories, kdsDateFormatCategory, kdsIconName, iconNames as kdsIconNames, kdsIconSize, kdsIconSizes, kdsInlineMessageVariant, kdsInlineMessageVariants, kdsIntervalDirectionalities, kdsIntervalDirectionality, kdsIntervalInputFormat, kdsIntervalInputFormats, kdsLiveStatusSize, kdsLiveStatusSizes, kdsLiveStatusStatus, kdsLiveStatusStatuses, kdsLoadingSkeletonVariant, kdsLoadingSkeletonVariants, kdsLoadingSpinnerVariant, kdsLoadingSpinnerVariants, kdsModalClosedBy, kdsModalClosedByOptions, kdsModalHeight, kdsModalHeightSizes, kdsModalVariant, kdsModalVariants, kdsModalWidth, kdsModalWidthSizes, kdsPanelBodyOverflow, kdsPanelBodyOverflows, kdsPanelBodyVariant, kdsPanelBodyVariants, kdsPasswordInputAutocomplete, kdsPasswordInputAutocompletes, kdsPasswordInputVariant, kdsPasswordInputVariants, kdsProgressButtonState, kdsProgressButtonStates, kdsRadioButtonGroupAlignment, kdsRadioButtonGroupAlignments, kdsResponsiveButtonGroupAlignment, kdsResponsiveButtonGroupAlignments, kdsTabBarSize, kdsTabBarSizes, kdsTemporalType, kdsTemporalTypes, kdsTimeInputGranularities, kdsTimeInputGranularity, kdsToggleButtonVariant, kdsToggleButtonVariants, kdsTwinListSearchMode, kdsTwinListSearchModes, kdsTypeIconName, typeIconNames as kdsTypeIconNames, kdsUsernameInputAutocomplete, kdsUsernameInputAutocompletes, kdsValueSwitchSize, kdsValueSwitchSizes, kdsValueSwitchVariant, kdsValueSwitchVariants, useKdsDarkMode, useKdsDynamicModal, useKdsIsTruncated, useKdsLegacyMode };
|
|
18069
|
+
export { KdsAccordion, KdsAvatar, KdsAvatarCounter, KdsBadge, KdsBreadcrumb, _sfc_main$1n as KdsButton, _sfc_main$g as KdsCard, _sfc_main$12 as KdsCheckbox, KdsCheckboxGroup, KdsClickableCard, _sfc_main$R as KdsColorInput, KdsColorSwatch, _sfc_main$17 as KdsContextMenu, KdsDataType, _sfc_main$K as KdsDateInput, _sfc_main$I as KdsDateTimeFormatInput, KdsDivider, KdsDonutChart, _sfc_main$y as KdsDropdown, KdsDynamicModalProvider, KdsEmptyState, KdsIcon, KdsInfoToggleButton, KdsInlineMessage, _sfc_main$B as KdsIntervalInput, KdsLabel, KdsLink, _sfc_main$1m as KdsLinkButton, KdsLinkCard, KdsListContainer, KdsLiveStatus, KdsLoadingSkeleton, KdsLoadingSpinner, _sfc_main$18 as KdsMenu, _sfc_main$1c as KdsMenuButton, KdsMissingValueIcon, KdsModal, KdsModalLayout, _sfc_main$v as KdsMultiSelectDropdown, KdsNavItem, KdsNavigation, _sfc_main$V as KdsNumberInput, KdsPanel, _sfc_main$Q as KdsPasswordInput, _sfc_main$H as KdsPatternInput, KdsPopover, KdsPreviewList, KdsProgressButton, KdsRadioButton, KdsRadioButtonGroup, KdsResponsiveButtonGroup, KdsSearchInput, KdsSelectableCard, KdsSortableListBox, KdsSplitButton, KdsSubText, KdsTabBar, KdsTextInput, KdsTextarea, _sfc_main$D as KdsTimeInput, _sfc_main$1k as KdsToggleButton, KdsTwinList, _sfc_main$P as KdsUsernameInput, KdsValueSwitch, KdsVariableToggleButton, kdsAvatarSize, kdsAvatarSizes, kdsBadgeSize, kdsBadgeSizes, kdsBadgeVariant, kdsBadgeVariants, kdsButtonSize, kdsButtonSizes, kdsButtonVariant, kdsButtonVariants, kdsCardVariant, kdsCardVariants, kdsCheckboxGroupAlignment, kdsCheckboxGroupAlignments, kdsCheckboxValue, kdsCheckboxValues, kdsColorSwatchSize, kdsColorSwatchSizes, kdsColorSwatchType, kdsColorSwatchTypes, kdsDarkModeType, kdsDarkModeTypes, kdsDataTypeSize, kdsDataTypeSizes, kdsDateFormatCategories, kdsDateFormatCategory, kdsIconName, iconNames as kdsIconNames, kdsIconSize, kdsIconSizes, kdsInlineMessageVariant, kdsInlineMessageVariants, kdsIntervalDirectionalities, kdsIntervalDirectionality, kdsIntervalInputFormat, kdsIntervalInputFormats, kdsLiveStatusSize, kdsLiveStatusSizes, kdsLiveStatusStatus, kdsLiveStatusStatuses, kdsLoadingSkeletonVariant, kdsLoadingSkeletonVariants, kdsLoadingSpinnerVariant, kdsLoadingSpinnerVariants, kdsModalClosedBy, kdsModalClosedByOptions, kdsModalHeight, kdsModalHeightSizes, kdsModalVariant, kdsModalVariants, kdsModalWidth, kdsModalWidthSizes, kdsPanelBodyOverflow, kdsPanelBodyOverflows, kdsPanelBodyVariant, kdsPanelBodyVariants, kdsPasswordInputAutocomplete, kdsPasswordInputAutocompletes, kdsPasswordInputVariant, kdsPasswordInputVariants, kdsPopoverPlacement, kdsPopoverPlacements, kdsPopoverRole, kdsPopoverRoles, kdsPopoverType, kdsPopoverTypes, kdsProgressButtonState, kdsProgressButtonStates, kdsRadioButtonGroupAlignment, kdsRadioButtonGroupAlignments, kdsResponsiveButtonGroupAlignment, kdsResponsiveButtonGroupAlignments, kdsTabBarSize, kdsTabBarSizes, kdsTemporalType, kdsTemporalTypes, kdsTimeInputGranularities, kdsTimeInputGranularity, kdsToggleButtonVariant, kdsToggleButtonVariants, kdsTwinListSearchMode, kdsTwinListSearchModes, kdsTypeIconName, typeIconNames as kdsTypeIconNames, kdsUsernameInputAutocomplete, kdsUsernameInputAutocompletes, kdsValueSwitchSize, kdsValueSwitchSizes, kdsValueSwitchVariant, kdsValueSwitchVariants, useKdsDarkMode, useKdsDynamicModal, useKdsIsTruncated, useKdsLegacyMode };
|
|
18005
18070
|
//# sourceMappingURL=index.js.map
|