@progress/kendo-react-dropdowns 8.2.0-develop.8 → 8.2.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.
- package/ComboBox/ComboBox.js +1 -1
- package/ComboBox/ComboBox.mjs +216 -218
- package/MultiColumnComboBox/MultiColumnComboBox.js +1 -1
- package/MultiColumnComboBox/MultiColumnComboBox.mjs +79 -85
- package/common/utils.js +1 -1
- package/common/utils.mjs +25 -21
- package/dist/cdn/js/kendo-react-dropdowns.js +1 -1
- package/index.d.mts +1 -0
- package/index.d.ts +1 -0
- package/package-metadata.mjs +1 -1
- package/package.json +9 -9
package/ComboBox/ComboBox.mjs
CHANGED
|
@@ -8,37 +8,37 @@
|
|
|
8
8
|
"use client";
|
|
9
9
|
import * as h from "react";
|
|
10
10
|
import m from "prop-types";
|
|
11
|
-
import
|
|
12
|
-
import { Keys as I, validatePackage as
|
|
11
|
+
import B from "../common/DropDownBase.mjs";
|
|
12
|
+
import { Keys as I, validatePackage as ie, svgIconPropType as oe, canUseDOM as R, classNames as w, IconWrap as ae, createPropsContext as ne, withIdHOC as le, withPropsContext as re, kendoThemeMaps as pe } from "@progress/kendo-react-common";
|
|
13
13
|
import { FloatingLabel as de } from "@progress/kendo-react-labels";
|
|
14
|
-
import { getPlainDataDuplicates as
|
|
15
|
-
import
|
|
16
|
-
import
|
|
17
|
-
import
|
|
18
|
-
import
|
|
19
|
-
import
|
|
20
|
-
import { packageMetadata as
|
|
21
|
-
import
|
|
22
|
-
import { Button as
|
|
23
|
-
import { caretAltDownIcon as
|
|
24
|
-
import { comboArrowBtnAriaLabelExpand as
|
|
25
|
-
import { provideLocalizationService as
|
|
26
|
-
import { ActionSheet as
|
|
27
|
-
import { MOBILE_MEDIUM_DEVISE as
|
|
28
|
-
import
|
|
29
|
-
const
|
|
14
|
+
import { getPlainDataDuplicates as he, getFilteredData as y, areSame as C, getItemValue as D, isPresent as S, getItemIndexByText as A, suggestValue as ce, itemIndexStartsWith as K } from "../common/utils.mjs";
|
|
15
|
+
import ue from "../common/SearchBar.mjs";
|
|
16
|
+
import ge from "../common/ListContainer.mjs";
|
|
17
|
+
import me from "../common/List.mjs";
|
|
18
|
+
import ve from "../common/ListFilter.mjs";
|
|
19
|
+
import z from "../common/GroupStickyHeader.mjs";
|
|
20
|
+
import { packageMetadata as fe } from "../package-metadata.mjs";
|
|
21
|
+
import be from "../common/ClearButton.mjs";
|
|
22
|
+
import { Button as H } from "@progress/kendo-react-buttons";
|
|
23
|
+
import { caretAltDownIcon as xe, xIcon as Ie } from "@progress/kendo-svg-icons";
|
|
24
|
+
import { comboArrowBtnAriaLabelExpand as q, messages as $, comboArrowBtnAriaLabelCollapse as G } from "../messages/index.mjs";
|
|
25
|
+
import { provideLocalizationService as U } from "@progress/kendo-react-intl";
|
|
26
|
+
import { ActionSheet as ye, ActionSheetHeader as ke, ActionSheetContent as Se } from "@progress/kendo-react-layout";
|
|
27
|
+
import { MOBILE_MEDIUM_DEVISE as W, MOBILE_SMALL_DEVISE as j } from "../common/constants.mjs";
|
|
28
|
+
import Y from "../common/withCustomComponent.mjs";
|
|
29
|
+
const Ce = "Please enter a valid value!", { sizeMap: O, roundedMap: De } = pe, E = class E extends h.Component {
|
|
30
30
|
constructor(s) {
|
|
31
|
-
super(s), this.state = {}, this.base = new
|
|
31
|
+
super(s), this.state = {}, this.base = new B(this), this._element = null, this._suggested = "", this._skipBlur = !1, this._input = null, this._adaptiveFilterInput = null, this.itemHeight = 0, this.duplicates = [], this.hasDuplicates = !1, this.focus = () => {
|
|
32
32
|
this._input && this._input.focus();
|
|
33
33
|
}, this.checkForDuplicatePlainTextRecords = () => {
|
|
34
34
|
const e = this.props.textField !== void 0, t = this.props.dataItemKey !== void 0;
|
|
35
35
|
if (this.props.data && this.props.data.length > 0 && !e && !t) {
|
|
36
36
|
const o = this.props.data;
|
|
37
|
-
this.duplicates =
|
|
37
|
+
this.duplicates = he(o), this.hasDuplicates = this.duplicates.length > 0;
|
|
38
38
|
}
|
|
39
39
|
}, this.handleItemSelect = (e, t) => {
|
|
40
|
-
const {
|
|
41
|
-
this.triggerOnChange(
|
|
40
|
+
const { virtual: o, dataItemKey: n } = this.props, l = y(this.props), a = o ? o.skip : 0, r = l[e - a], p = this.hasDuplicates || !C(r, this.value, n);
|
|
41
|
+
this.triggerOnChange(r, t), this.state.text !== void 0 && (t.data.text = void 0), p && this.base.triggerPageChangeCornerItems(r, t);
|
|
42
42
|
}, this.onPopupOpened = () => {
|
|
43
43
|
setTimeout(() => {
|
|
44
44
|
this.mobileMode && this._adaptiveFilterInput && (this._skipBlur = !0, this._adaptiveFilterInput.focus(), this._skipBlur = !1);
|
|
@@ -46,21 +46,21 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
46
46
|
}, this.componentRef = (e) => {
|
|
47
47
|
this._element = e, this.base.wrapper = e;
|
|
48
48
|
}, this.toggleBtnClick = (e) => {
|
|
49
|
-
const {
|
|
50
|
-
if (
|
|
49
|
+
const { skipDisabledItems: t, textField: o } = this.props, n = y(this.props), l = this.getFocusedIndex(), a = this.getCurrentValueDisabledStatus(o, n, l), r = this.props.opened !== void 0 ? this.props.opened : this.state.opened, p = this.base.initState();
|
|
50
|
+
if (p.syntheticEvent = e, !t && o && a && this.clearValueOnToggleBtnClick(e), this.base.togglePopup(p), !r && this.mobileMode) {
|
|
51
51
|
const i = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text || null;
|
|
52
|
-
this.base.filterChanged(i,
|
|
52
|
+
this.base.filterChanged(i, p);
|
|
53
53
|
}
|
|
54
|
-
this.applyState(
|
|
54
|
+
this.applyState(p);
|
|
55
55
|
}, this.closeOpenedApplyStateNonMobileMode = (e, t) => {
|
|
56
56
|
t && !this.mobileMode && this.base.togglePopup(e);
|
|
57
57
|
}, this.renderMobileListFilter = () => {
|
|
58
|
-
const e = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text, t =
|
|
58
|
+
const e = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text, t = D(this.value, this.props.textField), o = S(e) ? e : t;
|
|
59
59
|
return /* @__PURE__ */ h.createElement(
|
|
60
|
-
|
|
60
|
+
ve,
|
|
61
61
|
{
|
|
62
62
|
value: o,
|
|
63
|
-
ref: (
|
|
63
|
+
ref: (n) => this._adaptiveFilterInput = n && n.element,
|
|
64
64
|
onChange: this.handleMobileFilterChange,
|
|
65
65
|
onKeyDown: this.onInputKeyDown,
|
|
66
66
|
size: "large",
|
|
@@ -74,15 +74,15 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
74
74
|
}, this.onScroll = (e) => {
|
|
75
75
|
const { vs: t, list: o } = this.base;
|
|
76
76
|
t.scrollHandler(e);
|
|
77
|
-
const { groupField:
|
|
78
|
-
let
|
|
79
|
-
if (!
|
|
77
|
+
const { groupField: n } = this.props;
|
|
78
|
+
let l = y(this.props);
|
|
79
|
+
if (!n || !l.length)
|
|
80
80
|
return;
|
|
81
|
-
const
|
|
82
|
-
this.props.groupMode === "modern" && (
|
|
83
|
-
let i =
|
|
84
|
-
for (let c = 1; c <
|
|
85
|
-
|
|
81
|
+
const a = this.itemHeight = this.itemHeight || (t.enabled ? t.itemHeight : o ? o.children[0].offsetHeight : 0), p = e.target.scrollTop - t.skip * a;
|
|
82
|
+
this.props.groupMode === "modern" && (l = this.base.getGroupedDataModernMode(l, n));
|
|
83
|
+
let i = l[0][n];
|
|
84
|
+
for (let c = 1; c < l.length && !(a * c > p); c++)
|
|
85
|
+
l[c] && l[c][n] && (i = l[c][n]);
|
|
86
86
|
i !== this.state.group && (this.setState({
|
|
87
87
|
group: i
|
|
88
88
|
}), this.props.onGroupScroll && this.props.onGroupScroll.call(void 0, { group: i }));
|
|
@@ -90,79 +90,79 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
90
90
|
this.navigationIndex = e, this.base.handleItemClick(e, t), this._valueDuringOnChange = void 0;
|
|
91
91
|
}, this.handleBlur = (e) => {
|
|
92
92
|
if (this.state.focused && !this._skipBlur) {
|
|
93
|
-
const t = this.base.initState(), { textField: o
|
|
94
|
-
t.data.focused = !1, t.events.push({ type: "onBlur" }), t.syntheticEvent = e, o &&
|
|
93
|
+
const t = this.base.initState(), { textField: o } = this.props, n = y(this.props), l = this.getFocusedIndex(), r = !(l === -1) && this.getCurrentValueDisabledStatus(o, n, l);
|
|
94
|
+
t.data.focused = !1, t.events.push({ type: "onBlur" }), t.syntheticEvent = e, o && r && this.clearValueOnBlur(e), this.applyValueOnRejectSuggestions(e.currentTarget.value, t);
|
|
95
95
|
}
|
|
96
96
|
}, this.onInputClick = (e) => {
|
|
97
97
|
const t = this.props.opened !== void 0 ? this.props.opened : this.state.opened, o = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text || null;
|
|
98
98
|
if (!t && this.mobileMode) {
|
|
99
|
-
const
|
|
100
|
-
|
|
99
|
+
const n = this.base.initState();
|
|
100
|
+
n.syntheticEvent = e, this.base.togglePopup(n), this.base.filterChanged(o, n), this.applyState(n);
|
|
101
101
|
}
|
|
102
102
|
}, this.onInputKeyDown = (e) => {
|
|
103
|
-
const {
|
|
104
|
-
if (
|
|
105
|
-
if (e.preventDefault(),
|
|
103
|
+
const { skipDisabledItems: t, textField: o, dataItemKey: n, groupField: l } = this.props, a = y(this.props), r = this.value, p = Math.max(0, a.findIndex((u) => C(u, r, n))), i = e.keyCode, c = this.props.opened !== void 0 ? this.props.opened : this.state.opened, d = this.base.initState();
|
|
104
|
+
if (d.syntheticEvent = e, !e.altKey && (i === I.up || i === I.down)) {
|
|
105
|
+
if (e.preventDefault(), l !== "" && o)
|
|
106
106
|
if (!this.props.skipDisabledItems && c)
|
|
107
|
-
this.onNavigate(
|
|
107
|
+
this.onNavigate(d, i);
|
|
108
108
|
else {
|
|
109
109
|
let u = 0;
|
|
110
110
|
if (i === I.down || i === I.right) {
|
|
111
|
-
const g =
|
|
112
|
-
u = g &&
|
|
111
|
+
const g = a.slice(p + 1 < a.length ? p + 1 : p).find((b) => !b.disabled && b[o]);
|
|
112
|
+
u = g && a.findIndex((b) => b[o] === g[o]);
|
|
113
113
|
} else if (i === I.up || i === I.left) {
|
|
114
114
|
let g;
|
|
115
|
-
if (
|
|
116
|
-
g =
|
|
115
|
+
if (p === 0)
|
|
116
|
+
g = a, u = a.findIndex((b) => !b.disabled && b[o]);
|
|
117
117
|
else {
|
|
118
|
-
g =
|
|
118
|
+
g = a.slice(0, p);
|
|
119
119
|
let b = g.pop();
|
|
120
120
|
for (; b && b.disabled; )
|
|
121
121
|
b = g.pop();
|
|
122
|
-
u = b &&
|
|
122
|
+
u = b && a.findIndex((M) => M[o] === b[o]);
|
|
123
123
|
}
|
|
124
124
|
}
|
|
125
125
|
if (u !== void 0) {
|
|
126
|
-
const g = u -
|
|
127
|
-
this.onNavigate(
|
|
126
|
+
const g = u - p;
|
|
127
|
+
this.onNavigate(d, i, g);
|
|
128
128
|
} else
|
|
129
|
-
u === void 0 &&
|
|
129
|
+
u === void 0 && a.findIndex((g) => g[o] === r[o]) === a.length - 1 && this.onNavigate(d, i);
|
|
130
130
|
}
|
|
131
131
|
else if (!this.props.skipDisabledItems && c)
|
|
132
|
-
this.onNavigate(
|
|
132
|
+
this.onNavigate(d, i);
|
|
133
133
|
else {
|
|
134
134
|
let u = null;
|
|
135
135
|
if (i === I.down || i === I.right)
|
|
136
|
-
u =
|
|
136
|
+
u = a.slice(p + 1).find((g) => !g.disabled);
|
|
137
137
|
else if (i === I.up || i === I.left) {
|
|
138
|
-
const g =
|
|
138
|
+
const g = a.slice(0, p);
|
|
139
139
|
for (u = g.pop(); u && u.disabled; )
|
|
140
140
|
u = g.pop();
|
|
141
141
|
}
|
|
142
142
|
if (u) {
|
|
143
|
-
const g = u.id -
|
|
144
|
-
this.onNavigate(
|
|
143
|
+
const g = u.id - p - 1;
|
|
144
|
+
this.onNavigate(d, i, g);
|
|
145
145
|
} else
|
|
146
|
-
this.onNavigate(
|
|
146
|
+
this.onNavigate(d, i);
|
|
147
147
|
}
|
|
148
|
-
this.applyState(
|
|
148
|
+
this.applyState(d);
|
|
149
149
|
}
|
|
150
150
|
const v = () => {
|
|
151
|
-
e.preventDefault(), this.base.togglePopup(
|
|
152
|
-
}, x = this.getFocusedIndex(), f = x === -1,
|
|
153
|
-
c ? i === I.pageUp ? (e.preventDefault(), this.base.scrollPopupByPageSize(-1)) : i === I.pageDown ? (e.preventDefault(), this.base.scrollPopupByPageSize(1)) : e.altKey && i === I.up ? v() : i === I.enter ? (e.preventDefault(), (
|
|
151
|
+
e.preventDefault(), this.base.togglePopup(d), this.applyState(d);
|
|
152
|
+
}, x = this.getFocusedIndex(), f = x === -1, k = !f && this.getCurrentValueDisabledStatus(o, a, x);
|
|
153
|
+
c ? i === I.pageUp ? (e.preventDefault(), this.base.scrollPopupByPageSize(-1)) : i === I.pageDown ? (e.preventDefault(), this.base.scrollPopupByPageSize(1)) : e.altKey && i === I.up ? v() : i === I.enter ? (e.preventDefault(), (o && !f && e.currentTarget.value ? a[x][o] : void 0) ? !t && o && k ? this.clearValueOnEnterOrEsc(e) : k || this.applyValueOnEnter(e.currentTarget.value, d) : this.applyValueOnEnter(e.currentTarget.value, d)) : i === I.esc && (!t && o && k && this.clearValueOnEnterOrEsc(e), this.applyValueOnRejectSuggestions(e.currentTarget.value, d)) : !c && i === I.esc ? this.clearValueOnEnterOrEsc(e) : e.altKey && i === I.down && v();
|
|
154
154
|
}, this.inputOnChange = (e) => {
|
|
155
155
|
const t = this.base.initState();
|
|
156
156
|
t.syntheticEvent = e;
|
|
157
|
-
const o = this.props.opened !== void 0 ? this.props.opened : this.state.opened,
|
|
157
|
+
const o = this.props.opened !== void 0 ? this.props.opened : this.state.opened, n = e.currentTarget, l = n.value;
|
|
158
158
|
if (this.props.suggest) {
|
|
159
|
-
const
|
|
160
|
-
let
|
|
161
|
-
|
|
162
|
-
const
|
|
163
|
-
|
|
159
|
+
const a = n.selectionEnd === l.length;
|
|
160
|
+
let r = this.props.filter !== void 0 ? this.props.filter : this.state.text;
|
|
161
|
+
S(r) || (r = D(this.value, this.props.textField) || "");
|
|
162
|
+
const p = r && r === l, i = r && r.length > l.length;
|
|
163
|
+
p || i || !a ? this._suggested = "" : this.suggestValue(l);
|
|
164
164
|
}
|
|
165
|
-
this.props.filter === void 0 && (t.data.text =
|
|
165
|
+
this.props.filter === void 0 && (t.data.text = l), this.state.focusedItem !== void 0 && (t.data.focusedItem = void 0), o || this.base.togglePopup(t), this.base.filterChanged(l, t), this.applyState(t), this.setState({ group: void 0 });
|
|
166
166
|
}, this.clearButtonClick = (e) => {
|
|
167
167
|
const t = this.base.initState();
|
|
168
168
|
t.syntheticEvent = e, e.stopPropagation(), this.clearValue();
|
|
@@ -177,15 +177,15 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
177
177
|
t.syntheticEvent = e, e.stopPropagation(), this.clearValue();
|
|
178
178
|
}, this.setValidity = () => {
|
|
179
179
|
this._input && this._input.setCustomValidity && this._input.setCustomValidity(
|
|
180
|
-
this.validity.valid ? "" : this.props.validationMessage ||
|
|
180
|
+
this.validity.valid ? "" : this.props.validationMessage || Ce
|
|
181
181
|
);
|
|
182
|
-
},
|
|
182
|
+
}, ie(fe);
|
|
183
183
|
}
|
|
184
184
|
get _inputId() {
|
|
185
185
|
return this.props.id;
|
|
186
186
|
}
|
|
187
187
|
get document() {
|
|
188
|
-
if (
|
|
188
|
+
if (R)
|
|
189
189
|
return this.element && this.element.ownerDocument || document;
|
|
190
190
|
}
|
|
191
191
|
/** @hidden */
|
|
@@ -196,7 +196,7 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
196
196
|
* The mobile mode of the ComboBox.
|
|
197
197
|
*/
|
|
198
198
|
get mobileMode() {
|
|
199
|
-
return !!(this.state.windowWidth && this.state.windowWidth <=
|
|
199
|
+
return !!(this.state.windowWidth && this.state.windowWidth <= W && this.props.adaptive);
|
|
200
200
|
}
|
|
201
201
|
/**
|
|
202
202
|
* The value of the ComboBox.
|
|
@@ -215,8 +215,8 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
215
215
|
* The index of the selected item.
|
|
216
216
|
*/
|
|
217
217
|
get index() {
|
|
218
|
-
const {
|
|
219
|
-
return
|
|
218
|
+
const { dataItemKey: s } = this.props, e = y(this.props), t = this.value;
|
|
219
|
+
return e.findIndex((o) => C(o, t, s));
|
|
220
220
|
}
|
|
221
221
|
/**
|
|
222
222
|
* Gets the `name` property of the ComboBox.
|
|
@@ -236,33 +236,33 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
236
236
|
};
|
|
237
237
|
}
|
|
238
238
|
get validityStyles() {
|
|
239
|
-
return this.props.validityStyles !== void 0 ? this.props.validityStyles :
|
|
239
|
+
return this.props.validityStyles !== void 0 ? this.props.validityStyles : E.defaultProps.validityStyles;
|
|
240
240
|
}
|
|
241
241
|
/** @hidden */
|
|
242
242
|
get required() {
|
|
243
|
-
return this.props.required !== void 0 ? this.props.required :
|
|
243
|
+
return this.props.required !== void 0 ? this.props.required : E.defaultProps.required;
|
|
244
244
|
}
|
|
245
245
|
/** @hidden */
|
|
246
246
|
componentDidUpdate(s, e) {
|
|
247
247
|
var v;
|
|
248
|
-
const { dataItemKey: t, virtual: o, groupField:
|
|
249
|
-
s.data !==
|
|
250
|
-
const c = !i &&
|
|
251
|
-
if (this._valueOnDidUpdate =
|
|
248
|
+
const { dataItemKey: t, virtual: o, groupField: n = "", textField: l } = this.props, a = y(this.props), r = s.virtual ? s.virtual.total : 0, p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, i = s.opened !== void 0 ? s.opened : e.opened;
|
|
249
|
+
s.data !== a && this.checkForDuplicatePlainTextRecords();
|
|
250
|
+
const c = !i && p, d = this.value;
|
|
251
|
+
if (this._valueOnDidUpdate = d, this.base.didUpdate(), o && o.total !== r)
|
|
252
252
|
this.base.vs.calcScrollElementHeight(), this.base.vs.reset();
|
|
253
253
|
else {
|
|
254
254
|
const x = s.value !== void 0 ? s.value : e.value;
|
|
255
|
-
let f = this.hasDuplicates ? this.navigationIndex || 0 :
|
|
256
|
-
this.props.groupMode === "modern" &&
|
|
257
|
-
const
|
|
258
|
-
c && o ? this.base.scrollToVirtualItem(o, f) : c && !o ? (this.onPopupOpened(),
|
|
255
|
+
let f = this.hasDuplicates ? this.navigationIndex || 0 : a.findIndex((u) => C(u, d, t));
|
|
256
|
+
this.props.groupMode === "modern" && l && d && (f = (v = this.base.getGroupedDataModernMode(a, n)) == null ? void 0 : v.map((u) => u[l]).indexOf(d[l]));
|
|
257
|
+
const k = !C(x, d, t);
|
|
258
|
+
c && o ? this.base.scrollToVirtualItem(o, f) : c && !o ? (this.onPopupOpened(), a && a.length !== 0 && this.base.resetGroupStickyHeader(a[0][n], this), this.base.scrollToItem(f)) : (this.hasDuplicates || p && i && d && k) && this.base.scrollToItem(f);
|
|
259
259
|
}
|
|
260
260
|
c && this._input && this._input.focus(), this.setValidity();
|
|
261
261
|
}
|
|
262
262
|
/** @hidden */
|
|
263
263
|
componentDidMount() {
|
|
264
264
|
var s;
|
|
265
|
-
this.observerResize =
|
|
265
|
+
this.observerResize = R && window.ResizeObserver && new window.ResizeObserver(this.calculateMedia.bind(this)), this.base.didMount(), this.setValidity(), (s = this.document) != null && s.body && this.observerResize && this.observerResize.observe(this.document.body), this.checkForDuplicatePlainTextRecords();
|
|
266
266
|
}
|
|
267
267
|
/** @hidden */
|
|
268
268
|
componentWillUnmount() {
|
|
@@ -271,151 +271,151 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
271
271
|
}
|
|
272
272
|
/** @hidden */
|
|
273
273
|
render() {
|
|
274
|
-
const s =
|
|
275
|
-
|
|
276
|
-
|
|
274
|
+
const s = U(this).toLanguageString(q, $[q]), e = U(this).toLanguageString(
|
|
275
|
+
G,
|
|
276
|
+
$[G]
|
|
277
277
|
), {
|
|
278
278
|
dir: t,
|
|
279
279
|
disabled: o,
|
|
280
|
-
clearButton:
|
|
281
|
-
label:
|
|
282
|
-
textField:
|
|
283
|
-
adaptive:
|
|
284
|
-
className:
|
|
280
|
+
clearButton: n = E.defaultProps.clearButton,
|
|
281
|
+
label: l,
|
|
282
|
+
textField: a,
|
|
283
|
+
adaptive: r,
|
|
284
|
+
className: p,
|
|
285
285
|
style: i,
|
|
286
286
|
loading: c,
|
|
287
|
-
iconClassName:
|
|
287
|
+
iconClassName: d,
|
|
288
288
|
virtual: v,
|
|
289
289
|
size: x,
|
|
290
290
|
rounded: f,
|
|
291
|
-
fillMode:
|
|
291
|
+
fillMode: k,
|
|
292
292
|
opened: u = this.state.opened,
|
|
293
293
|
placeholder: g,
|
|
294
294
|
svgIcon: b
|
|
295
|
-
} = this.props,
|
|
296
|
-
|
|
297
|
-
const [
|
|
295
|
+
} = this.props, M = !this.validityStyles || this.validity.valid, _ = this.props.filter !== void 0 ? this.props.filter : this.state.text, J = D(this.value, a), V = S(_) ? _ : J, Q = n && (!!V || S(this.value)), F = this.base.vs, N = this.props.id || this._inputId, P = this.mobileMode;
|
|
296
|
+
F.enabled = v !== void 0, v !== void 0 && (F.skip = v.skip, F.total = v.total, F.pageSize = v.pageSize);
|
|
297
|
+
const [X, Z] = Y(this.props.prefix || h.Fragment), [ee, te] = Y(this.props.suffix || h.Fragment), L = /* @__PURE__ */ h.createElement(h.Fragment, null, /* @__PURE__ */ h.createElement(
|
|
298
298
|
"span",
|
|
299
299
|
{
|
|
300
|
-
className:
|
|
300
|
+
className: w(
|
|
301
301
|
"k-combobox k-input",
|
|
302
302
|
{
|
|
303
|
-
[`k-input-${
|
|
304
|
-
[`k-rounded-${
|
|
305
|
-
[`k-input-${
|
|
306
|
-
"k-invalid": !
|
|
303
|
+
[`k-input-${O[x] || x}`]: x,
|
|
304
|
+
[`k-rounded-${De[f] || f}`]: f,
|
|
305
|
+
[`k-input-${k}`]: k,
|
|
306
|
+
"k-invalid": !M,
|
|
307
307
|
"k-loading": c,
|
|
308
308
|
"k-required": this.required,
|
|
309
309
|
"k-disabled": o
|
|
310
310
|
},
|
|
311
|
-
|
|
311
|
+
p
|
|
312
312
|
),
|
|
313
313
|
ref: this.componentRef,
|
|
314
|
-
style:
|
|
314
|
+
style: l ? { ...i, width: void 0 } : i,
|
|
315
315
|
dir: t
|
|
316
316
|
},
|
|
317
|
-
this.props.prefix && /* @__PURE__ */ h.createElement(
|
|
318
|
-
this.renderSearchBar(
|
|
319
|
-
|
|
317
|
+
this.props.prefix && /* @__PURE__ */ h.createElement(X, { ...Z }),
|
|
318
|
+
this.renderSearchBar(V || "", N, g),
|
|
319
|
+
Q && !c && /* @__PURE__ */ h.createElement(be, { onClick: this.clearButtonClick, key: "clearbutton" }),
|
|
320
320
|
c && /* @__PURE__ */ h.createElement(ae, { className: "k-input-loading-icon", name: "loading", key: "loading" }),
|
|
321
|
-
this.props.suffix && /* @__PURE__ */ h.createElement(
|
|
321
|
+
this.props.suffix && /* @__PURE__ */ h.createElement(ee, { ...te }),
|
|
322
322
|
/* @__PURE__ */ h.createElement(
|
|
323
|
-
|
|
323
|
+
H,
|
|
324
324
|
{
|
|
325
325
|
tabIndex: -1,
|
|
326
326
|
type: "button",
|
|
327
327
|
"aria-label": u ? e : s,
|
|
328
|
-
icon:
|
|
329
|
-
svgIcon: b ||
|
|
330
|
-
iconClass:
|
|
328
|
+
icon: d ? void 0 : "caret-alt-down",
|
|
329
|
+
svgIcon: b || xe,
|
|
330
|
+
iconClass: d,
|
|
331
331
|
size: x,
|
|
332
|
-
fillMode:
|
|
332
|
+
fillMode: k,
|
|
333
333
|
rounded: null,
|
|
334
334
|
themeColor: "base",
|
|
335
335
|
className: "k-input-button",
|
|
336
336
|
onClick: this.toggleBtnClick,
|
|
337
|
-
onMouseDown: (
|
|
337
|
+
onMouseDown: (se) => se.preventDefault()
|
|
338
338
|
}
|
|
339
339
|
),
|
|
340
|
-
!
|
|
341
|
-
),
|
|
342
|
-
return
|
|
340
|
+
!P && this.renderListContainer()
|
|
341
|
+
), P && this.renderAdaptiveListContainer());
|
|
342
|
+
return l ? /* @__PURE__ */ h.createElement(
|
|
343
343
|
de,
|
|
344
344
|
{
|
|
345
|
-
label:
|
|
346
|
-
editorId:
|
|
347
|
-
editorValue:
|
|
348
|
-
editorValid:
|
|
345
|
+
label: l,
|
|
346
|
+
editorId: N,
|
|
347
|
+
editorValue: V,
|
|
348
|
+
editorValid: M,
|
|
349
349
|
editorDisabled: o,
|
|
350
350
|
style: { width: i ? i.width : void 0 },
|
|
351
|
-
children:
|
|
351
|
+
children: L
|
|
352
352
|
}
|
|
353
|
-
) :
|
|
353
|
+
) : L;
|
|
354
354
|
}
|
|
355
355
|
/** @hidden */
|
|
356
356
|
onNavigate(s, e, t) {
|
|
357
|
-
const {
|
|
358
|
-
let
|
|
359
|
-
const
|
|
357
|
+
const { virtual: o = { skip: 0 } } = this.props, n = y(this.props), l = this.props.filter ? this.props.filter : this.state.text;
|
|
358
|
+
let a = -1, r;
|
|
359
|
+
const p = this.base.vs, i = this.value;
|
|
360
360
|
this._suggested = "";
|
|
361
361
|
const c = this.hasDuplicates && this.duplicates.indexOf(i) !== -1;
|
|
362
|
-
if (
|
|
363
|
-
this.handleItemSelect(
|
|
364
|
-
else if (
|
|
362
|
+
if (a = this.getFocusedIndex(c), a !== -1 && !S(i))
|
|
363
|
+
this.handleItemSelect(a, s);
|
|
364
|
+
else if (l === "")
|
|
365
365
|
this.handleItemSelect(0, s);
|
|
366
366
|
else {
|
|
367
|
-
const
|
|
368
|
-
|
|
367
|
+
const d = o.skip + a;
|
|
368
|
+
r = this.base.navigation.navigate({
|
|
369
369
|
keyCode: e,
|
|
370
|
-
current:
|
|
371
|
-
max: (
|
|
370
|
+
current: d,
|
|
371
|
+
max: (p.enabled ? p.total : n.length) - 1,
|
|
372
372
|
min: 0,
|
|
373
373
|
skipItems: t || void 0
|
|
374
|
-
}),
|
|
374
|
+
}), r !== void 0 && this.handleItemSelect(r, s);
|
|
375
375
|
}
|
|
376
|
-
this.navigationIndex =
|
|
376
|
+
this.navigationIndex = r;
|
|
377
377
|
}
|
|
378
378
|
getCurrentValueDisabledStatus(s, e, t) {
|
|
379
379
|
return s && e && e[t] && e[t].disabled;
|
|
380
380
|
}
|
|
381
381
|
applyValueOnEnter(s, e) {
|
|
382
|
-
const {
|
|
382
|
+
const { textField: t, allowCustom: o } = this.props, n = y(this.props), l = this.props.opened !== void 0 ? this.props.opened : this.state.opened, r = D(this.value, t) === s ? this.index : A(n, s, t), p = r !== -1;
|
|
383
383
|
let i;
|
|
384
|
-
if (this._suggested = "",
|
|
385
|
-
i =
|
|
386
|
-
else if (
|
|
387
|
-
i =
|
|
384
|
+
if (this._suggested = "", p)
|
|
385
|
+
i = n[r];
|
|
386
|
+
else if (o)
|
|
387
|
+
i = t !== void 0 ? { [t]: s } : s;
|
|
388
388
|
else
|
|
389
389
|
return this.selectFocusedItem(s, e);
|
|
390
|
-
this.triggerOnChange(i, e),
|
|
390
|
+
this.triggerOnChange(i, e), l && this.base.togglePopup(e), this.props.filter === void 0 && this.state.text !== void 0 && (e.data.text = void 0), this.applyState(e);
|
|
391
391
|
}
|
|
392
392
|
applyValueOnRejectSuggestions(s, e) {
|
|
393
|
-
const {
|
|
394
|
-
if (this._suggested = "", s ===
|
|
395
|
-
return this.closeOpenedApplyStateNonMobileMode(e,
|
|
396
|
-
const
|
|
393
|
+
const { textField: t, allowCustom: o } = this.props, n = y(this.props), l = this.props.opened !== void 0 ? this.props.opened : this.state.opened, a = D(this.value, t);
|
|
394
|
+
if (this._suggested = "", s === a || s === "" && !S(a))
|
|
395
|
+
return this.closeOpenedApplyStateNonMobileMode(e, l), this.applyState(e);
|
|
396
|
+
const r = A(n, s, t, !0), p = r !== -1;
|
|
397
397
|
let i = null;
|
|
398
|
-
|
|
398
|
+
p ? i = n[r] : o && (i = s ? t ? { [t]: s } : s : null), this.triggerOnChange(i, e), this.state.text !== void 0 && (e.data.text = void 0, this.base.filterChanged("", e)), this.closeOpenedApplyStateNonMobileMode(e, l), this.applyState(e);
|
|
399
399
|
}
|
|
400
400
|
selectFocusedItem(s, e) {
|
|
401
|
-
const t = this.props.opened !== void 0 ? this.props.opened : this.state.opened, {
|
|
402
|
-
return
|
|
401
|
+
const t = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { textField: o, virtual: n = { skip: 0 }, focusedItemIndex: l = K } = this.props, a = y(this.props), r = n.skip, p = s === "" && r === 0 ? 0 : l(a, s, o);
|
|
402
|
+
return p !== -1 ? this.handleItemSelect(p + r, e) : (this.triggerOnChange(null, e), this.state.text !== void 0 && (e.data.text = void 0)), t && this.base.togglePopup(e), this.applyState(e);
|
|
403
403
|
}
|
|
404
404
|
renderAdaptiveListContainer() {
|
|
405
|
-
const { windowWidth: s = 0 } = this.state, { header: e, footer: t, size: o,
|
|
405
|
+
const { windowWidth: s = 0 } = this.state, { header: e, footer: t, size: o, groupField: n, groupMode: l, list: a, virtual: r, adaptiveTitle: p, groupStickyHeaderItemRender: i } = this.props, c = y(this.props), d = this.props.opened !== void 0 ? this.props.opened : this.state.opened, v = this.base.getAdaptiveAnimation();
|
|
406
406
|
let { group: x } = this.state;
|
|
407
|
-
x === void 0 && n !== void 0 && (x =
|
|
407
|
+
x === void 0 && n !== void 0 && (x = D(c[0], n));
|
|
408
408
|
const f = {
|
|
409
409
|
navigatable: !1,
|
|
410
410
|
navigatableElements: [],
|
|
411
|
-
expand:
|
|
411
|
+
expand: d,
|
|
412
412
|
animation: v,
|
|
413
|
-
onClose: (
|
|
414
|
-
animationStyles: s <=
|
|
415
|
-
className: s <=
|
|
413
|
+
onClose: (k) => this.toggleBtnClick(k),
|
|
414
|
+
animationStyles: s <= j ? { top: 0, width: "100%", height: "100%" } : void 0,
|
|
415
|
+
className: s <= j ? "k-adaptive-actionsheet k-actionsheet-fullscreen" : "k-adaptive-actionsheet k-actionsheet-bottom k-actionsheet"
|
|
416
416
|
};
|
|
417
|
-
return /* @__PURE__ */ h.createElement(
|
|
418
|
-
|
|
417
|
+
return /* @__PURE__ */ h.createElement(ye, { ...f }, /* @__PURE__ */ h.createElement(ke, null, /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-title" }, /* @__PURE__ */ h.createElement("div", { className: "k-text-center" }, p), /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-subtitle k-text-center" })), /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-actions" }, /* @__PURE__ */ h.createElement(
|
|
418
|
+
H,
|
|
419
419
|
{
|
|
420
420
|
tabIndex: 0,
|
|
421
421
|
"aria-label": "Cancel",
|
|
@@ -426,47 +426,47 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
426
426
|
size: "large",
|
|
427
427
|
onClick: this.toggleBtnClick,
|
|
428
428
|
icon: "x",
|
|
429
|
-
svgIcon:
|
|
429
|
+
svgIcon: Ie
|
|
430
430
|
}
|
|
431
|
-
))), /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-titlebar-group k-actionsheet-filter" }, this.renderMobileListFilter())), /* @__PURE__ */ h.createElement(
|
|
431
|
+
))), /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-titlebar-group k-actionsheet-filter" }, this.renderMobileListFilter())), /* @__PURE__ */ h.createElement(Se, { className: "!k-overflow-hidden" }, /* @__PURE__ */ h.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ h.createElement("div", { className: w(
|
|
432
432
|
{
|
|
433
|
-
"k-list": !
|
|
433
|
+
"k-list": !a,
|
|
434
434
|
"k-list-lg": !0,
|
|
435
435
|
"k-virtual-list": r,
|
|
436
|
-
"k-data-table":
|
|
437
|
-
[`k-table-${
|
|
436
|
+
"k-data-table": a,
|
|
437
|
+
[`k-table-${O[o] || o}`]: a && o
|
|
438
438
|
}
|
|
439
|
-
) }, e && /* @__PURE__ */ h.createElement("div", { className: "k-table-header" }, e), !
|
|
439
|
+
) }, e && /* @__PURE__ */ h.createElement("div", { className: "k-table-header" }, e), !a && x && c.length !== 0 && /* @__PURE__ */ h.createElement(z, { group: x, groupMode: l, render: i }), this.renderList(), t && /* @__PURE__ */ h.createElement("div", { className: "k-list-footer" }, t)))));
|
|
440
440
|
}
|
|
441
441
|
renderListContainer() {
|
|
442
|
-
const s = this.base, { dir: e, header: t, footer: o,
|
|
442
|
+
const s = this.base, { dir: e, header: t, footer: o, groupField: n, groupMode: l, size: a, list: r, virtual: p, groupStickyHeaderItemRender: i } = this.props, c = y(this.props), d = this.props.opened !== void 0 ? this.props.opened : this.state.opened, v = s.getPopupSettings(), x = v.width !== void 0 ? v.width : s.popupWidth;
|
|
443
443
|
let { group: f } = this.state;
|
|
444
|
-
return f === void 0 && n !== void 0 && (f =
|
|
445
|
-
|
|
444
|
+
return f === void 0 && n !== void 0 && (f = D(c[0], n)), /* @__PURE__ */ h.createElement(
|
|
445
|
+
ge,
|
|
446
446
|
{
|
|
447
447
|
width: x,
|
|
448
448
|
popupSettings: {
|
|
449
449
|
...v,
|
|
450
450
|
anchor: v.anchor || this.element,
|
|
451
|
-
show:
|
|
452
|
-
popupClass:
|
|
451
|
+
show: d,
|
|
452
|
+
popupClass: w(
|
|
453
453
|
v.popupClass,
|
|
454
454
|
"k-list-container",
|
|
455
455
|
"k-combobox-popup"
|
|
456
456
|
)
|
|
457
457
|
},
|
|
458
458
|
dir: e !== void 0 ? e : this.base.dirCalculated,
|
|
459
|
-
itemsCount: [
|
|
459
|
+
itemsCount: [c.length]
|
|
460
460
|
},
|
|
461
|
-
/* @__PURE__ */ h.createElement("div", { className:
|
|
461
|
+
/* @__PURE__ */ h.createElement("div", { className: w(
|
|
462
462
|
{
|
|
463
463
|
"k-list": !r,
|
|
464
|
-
[`k-list-${
|
|
465
|
-
"k-virtual-list":
|
|
464
|
+
[`k-list-${O[a] || a}`]: !r && a,
|
|
465
|
+
"k-virtual-list": p,
|
|
466
466
|
"k-data-table": r,
|
|
467
|
-
[`k-table-${
|
|
467
|
+
[`k-table-${O[a] || a}`]: r && a
|
|
468
468
|
}
|
|
469
|
-
) }, t && /* @__PURE__ */ h.createElement("div", { className: "k-table-header" }, t), !r && f &&
|
|
469
|
+
) }, t && /* @__PURE__ */ h.createElement("div", { className: "k-table-header" }, t), !r && f && c.length !== 0 && /* @__PURE__ */ h.createElement(z, { group: f, groupMode: l, render: i }), this.renderList(), o && /* @__PURE__ */ h.createElement("div", { className: w(
|
|
470
470
|
{
|
|
471
471
|
"k-list-footer": !this.props.footerClassName
|
|
472
472
|
},
|
|
@@ -479,18 +479,17 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
479
479
|
textField: e,
|
|
480
480
|
dataItemKey: t,
|
|
481
481
|
listNoDataRender: o,
|
|
482
|
-
itemRender:
|
|
483
|
-
groupHeaderItemRender:
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
} = this.props, r = s.getPopupSettings(), i = s.vs, c = l.skip, p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, v = `translateY(${i.translate}px)`, x = p ? this.getFocusedIndex(this.hasDuplicates) : void 0, f = this.props.filter !== void 0 ? this.props.filter : this.state.text, y = C(this.value, e), u = k(f) && f !== y ? null : this.value, g = this.props.list || ge;
|
|
482
|
+
itemRender: n,
|
|
483
|
+
groupHeaderItemRender: l,
|
|
484
|
+
virtual: a = { skip: 0, total: void 0 }
|
|
485
|
+
} = this.props, r = y(this.props), p = s.getPopupSettings(), i = s.vs, c = a.skip, d = this.props.opened !== void 0 ? this.props.opened : this.state.opened, v = `translateY(${i.translate}px)`, x = d ? this.getFocusedIndex(this.hasDuplicates) : void 0, f = this.props.filter !== void 0 ? this.props.filter : this.state.text, k = D(this.value, e), u = S(f) && f !== k ? null : this.value, g = this.props.list || me;
|
|
487
486
|
return /* @__PURE__ */ h.createElement(
|
|
488
487
|
g,
|
|
489
488
|
{
|
|
490
489
|
id: s.listBoxId,
|
|
491
|
-
virtual: !!
|
|
492
|
-
show:
|
|
493
|
-
data:
|
|
490
|
+
virtual: !!a,
|
|
491
|
+
show: d,
|
|
492
|
+
data: r,
|
|
494
493
|
focusedIndex: x,
|
|
495
494
|
value: u,
|
|
496
495
|
textField: e,
|
|
@@ -503,57 +502,56 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
503
502
|
listRef: (b) => {
|
|
504
503
|
i.list = this.base.list = b, this.itemHeight = 0;
|
|
505
504
|
},
|
|
506
|
-
wrapperStyle: this.state.windowWidth && this.state.windowWidth >
|
|
507
|
-
wrapperCssClass:
|
|
505
|
+
wrapperStyle: this.state.windowWidth && this.state.windowWidth > W ? { maxHeight: p.height } : {},
|
|
506
|
+
wrapperCssClass: w(
|
|
508
507
|
"k-list-content",
|
|
509
508
|
{
|
|
510
|
-
"k-list-scroller": !
|
|
509
|
+
"k-list-scroller": !a
|
|
511
510
|
}
|
|
512
511
|
),
|
|
513
512
|
listStyle: i.enabled ? { transform: v } : void 0,
|
|
514
513
|
key: "listkey",
|
|
515
514
|
skip: c,
|
|
516
515
|
onClick: this.handleItemClick,
|
|
517
|
-
itemRender:
|
|
518
|
-
groupHeaderItemRender:
|
|
516
|
+
itemRender: n,
|
|
517
|
+
groupHeaderItemRender: l,
|
|
519
518
|
noDataRender: o,
|
|
520
519
|
onMouseDown: (b) => b.preventDefault(),
|
|
521
520
|
onScroll: this.onScroll,
|
|
522
521
|
wrapperRef: i.scrollerRef,
|
|
523
522
|
scroller: this.base.renderScrollElement(),
|
|
524
|
-
ariaSetSize:
|
|
523
|
+
ariaSetSize: a.total
|
|
525
524
|
}
|
|
526
525
|
);
|
|
527
526
|
}
|
|
528
527
|
renderSearchBar(s, e, t) {
|
|
529
528
|
const {
|
|
530
529
|
tabIndex: o,
|
|
531
|
-
disabled:
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
ce,
|
|
530
|
+
disabled: n,
|
|
531
|
+
dataItemKey: l,
|
|
532
|
+
virtual: a = { skip: 0 }
|
|
533
|
+
} = this.props, r = y(this.props), p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, i = this.value, c = Math.max(0, r.findIndex((d) => C(d, i, l)));
|
|
534
|
+
return this._suggested && !C(this._valueOnDidUpdate, i, l) && (this._suggested = ""), /* @__PURE__ */ h.createElement(
|
|
535
|
+
ue,
|
|
538
536
|
{
|
|
539
537
|
id: e,
|
|
540
|
-
readOnly:
|
|
538
|
+
readOnly: p && this.mobileMode,
|
|
541
539
|
placeholder: t,
|
|
542
540
|
tabIndex: o,
|
|
543
541
|
title: this.props.title,
|
|
544
542
|
accessKey: this.props.accessKey,
|
|
545
543
|
value: s + this._suggested,
|
|
546
544
|
suggestedText: this._suggested,
|
|
547
|
-
ref: (
|
|
545
|
+
ref: (d) => this._input = d && d.input,
|
|
548
546
|
onClick: this.onInputClick,
|
|
549
547
|
onKeyDown: this.onInputKeyDown,
|
|
550
548
|
onChange: this.inputOnChange,
|
|
551
549
|
onFocus: this.base.handleFocus,
|
|
552
550
|
onBlur: this.handleBlur,
|
|
553
|
-
disabled:
|
|
554
|
-
expanded:
|
|
551
|
+
disabled: n,
|
|
552
|
+
expanded: p,
|
|
555
553
|
owns: this.base.listBoxId,
|
|
556
|
-
activedescendant: `option-${this.base.guid}-${c +
|
|
554
|
+
activedescendant: `option-${this.base.guid}-${c + a.skip}`,
|
|
557
555
|
role: "combobox",
|
|
558
556
|
ariaLabelledBy: this.props.ariaLabelledBy,
|
|
559
557
|
ariaLabel: this.props.ariaLabel,
|
|
@@ -571,15 +569,15 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
571
569
|
}
|
|
572
570
|
triggerOnChange(s, e) {
|
|
573
571
|
const t = this.value;
|
|
574
|
-
!this.hasDuplicates && (!
|
|
572
|
+
!this.hasDuplicates && (!S(t) && !S(s) || C(t, s, this.props.dataItemKey)) || (this.props.value === void 0 && (e.data.value = s), this._valueDuringOnChange = s, e.events.push({ type: "onChange" }));
|
|
575
573
|
}
|
|
576
574
|
getFocusedIndex(s) {
|
|
577
|
-
const e = this.value, {
|
|
578
|
-
return s && this.navigationIndex !== void 0 ? this.navigationIndex :
|
|
575
|
+
const e = this.value, { textField: t, dataItemKey: o, virtual: n = { skip: 0 }, focusedItemIndex: l = K, skipDisabledItems: a } = this.props, r = y(this.props), p = this.props.filter ? this.props.filter : this.state.text;
|
|
576
|
+
return s && this.navigationIndex !== void 0 ? this.navigationIndex : S(e) && p === void 0 ? r.findIndex((i) => C(i, e, o)) : p ? l(r, p, t) : a && t && !p && n.skip === 0 ? r.findIndex((i) => !i.disabled && i[t]) : n.skip === 0 ? 0 : -1;
|
|
579
577
|
}
|
|
580
578
|
suggestValue(s) {
|
|
581
579
|
const { data: e, textField: t } = this.props;
|
|
582
|
-
this._suggested =
|
|
580
|
+
this._suggested = ce(s, e, t);
|
|
583
581
|
}
|
|
584
582
|
applyState(s) {
|
|
585
583
|
this.base.applyState(s), this._valueDuringOnChange = void 0;
|
|
@@ -589,8 +587,8 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
|
|
|
589
587
|
this.setState({ windowWidth: e.target.clientWidth });
|
|
590
588
|
}
|
|
591
589
|
};
|
|
592
|
-
|
|
593
|
-
...
|
|
590
|
+
E.displayName = "ComboBox", E.propTypes = {
|
|
591
|
+
...B.propTypes,
|
|
594
592
|
size: m.oneOf([null, "small", "medium", "large"]),
|
|
595
593
|
rounded: m.oneOf([null, "small", "medium", "large", "full"]),
|
|
596
594
|
fillMode: m.oneOf([null, "solid", "flat", "outline"]),
|
|
@@ -604,7 +602,7 @@ D.displayName = "ComboBox", D.propTypes = {
|
|
|
604
602
|
allowCustom: m.bool,
|
|
605
603
|
clearButton: m.bool,
|
|
606
604
|
iconClassName: m.string,
|
|
607
|
-
svgIcon:
|
|
605
|
+
svgIcon: oe,
|
|
608
606
|
validationMessage: m.string,
|
|
609
607
|
required: m.bool,
|
|
610
608
|
id: m.string,
|
|
@@ -614,8 +612,8 @@ D.displayName = "ComboBox", D.propTypes = {
|
|
|
614
612
|
list: m.any,
|
|
615
613
|
valueRender: m.func,
|
|
616
614
|
skipDisabledItems: m.bool
|
|
617
|
-
},
|
|
618
|
-
...
|
|
615
|
+
}, E.defaultProps = {
|
|
616
|
+
...B.defaultProps,
|
|
619
617
|
size: "medium",
|
|
620
618
|
rounded: "medium",
|
|
621
619
|
fillMode: "solid",
|
|
@@ -628,11 +626,11 @@ D.displayName = "ComboBox", D.propTypes = {
|
|
|
628
626
|
prefix: void 0,
|
|
629
627
|
suffix: void 0
|
|
630
628
|
};
|
|
631
|
-
let
|
|
632
|
-
const
|
|
633
|
-
|
|
629
|
+
let T = E;
|
|
630
|
+
const Ee = ne(), we = le(re(Ee, T));
|
|
631
|
+
we.displayName = "KendoReactComboBox";
|
|
634
632
|
export {
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
633
|
+
we as ComboBox,
|
|
634
|
+
Ee as ComboBoxPropsContext,
|
|
635
|
+
T as ComboBoxWithoutContext
|
|
638
636
|
};
|