@progress/kendo-react-dropdowns
Version:
React DropDowns offer an interface for users to select different items from a list and more. KendoReact Dropdowns package
106 lines (105 loc) • 3.4 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import * as t from "react";
import T from "./ListItem.mjs";
import W from "./ListGroupItem.mjs";
import { areSame as b, getItemValue as k } from "./utils.mjs";
import { useLocalization as X } from "@progress/kendo-react-intl";
import { nodata as B, messages as Y } from "../messages/index.mjs";
import { useUnstyled as Z, classNames as v, uDropDownsBase as y } from "@progress/kendo-react-common";
const le = (e) => {
const L = X(), D = Z(), d = D && D.uDropDownsBase, { id: M, show: z, wrapperCssClass: $, wrapperStyle: x, listStyle: A, listRef: F, wrapperRef: G, listClassName: V, ariaSetSize: H } = e, I = (() => {
const {
textField: s,
valueField: a,
groupField: c,
groupMode: S,
isMultiColumn: j,
optionsGuid: h,
skip: C = 0,
virtual: E,
focusedIndex: w,
hasDuplicates: q,
highlightSelected: J = !0,
value: l,
data: N,
itemRender: K,
groupHeaderItemRender: O
} = e, R = Array.isArray(l);
let u = 0;
return N.map((r, o) => {
const m = C + o, f = C + o + u, P = q ? l ? w === o : !1 : r.disabled ? !1 : J && (!R && b(r, l, a) || R && l.findIndex((Q) => b(Q, r, a)) !== -1);
let n, i, g;
o > 0 && c !== void 0 && (i = k(r, c), g = k(N[o - 1], c), i && g && i !== g && (n = i));
const p = n !== void 0 && S === "modern";
return p ? u += 1 : u = 0, [
p && /* @__PURE__ */ t.createElement(
W,
{
id: `option-${h}-${f}`,
virtual: E,
key: m + "-group-item",
group: n,
isMultiColumn: j,
render: O
}
),
/* @__PURE__ */ t.createElement(
T,
{
id: `option-${h}-${p ? f + 1 : f}`,
virtual: E,
dataItem: r,
groupMode: S,
selected: P,
focused: w === o,
index: m,
key: m,
onClick: e.onClick,
textField: s,
group: n,
render: K,
disabled: r.disabled
}
)
];
});
})(), U = () => {
const s = e.noDataRender, a = /* @__PURE__ */ t.createElement("div", { className: v(y.noData({ c: d })) }, /* @__PURE__ */ t.createElement("div", null, L.toLanguageString(B, Y[B])));
return s ? s.call(void 0, a) : a;
};
return I.length ? /* @__PURE__ */ t.createElement(
"div",
{
className: $,
style: x,
ref: G,
onMouseDown: e.onMouseDown,
onBlur: e.onBlur,
onScroll: e.onScroll,
unselectable: "on"
},
/* @__PURE__ */ t.createElement(
"ul",
{
id: M,
role: "listbox",
"aria-hidden": z ? void 0 : !0,
"aria-setsize": H,
className: V || v(y.ul({ c: d })),
ref: F,
style: A
},
I
),
e.scroller && /* @__PURE__ */ t.createElement("div", { className: v(y.heightContainer({ c: d })) }, e.scroller)
) : U();
};
export {
le as default
};