@progress/kendo-react-dropdowns 11.4.0 → 12.0.0-develop.10
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 +166 -164
- package/MultiColumnComboBox/MultiColumnComboBox.js +1 -1
- package/MultiColumnComboBox/MultiColumnComboBox.mjs +13 -13
- package/dist/cdn/js/kendo-react-dropdowns.js +1 -1
- package/index.d.mts +43 -58
- package/index.d.ts +43 -58
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +10 -10
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ue=require("react"),ie=require("prop-types"),de=require("../common/MultiColumnList.js"),n=require("@progress/kendo-react-common"),j=require("../ComboBox/ComboBox.js"),ce=require("../common/utils.js"),K=require("../common/withCustomComponent.js");function pe(
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ue=require("react"),ie=require("prop-types"),de=require("../common/MultiColumnList.js"),n=require("@progress/kendo-react-common"),j=require("../ComboBox/ComboBox.js"),ce=require("../common/utils.js"),K=require("../common/withCustomComponent.js");function pe(a){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const e in a)if(e!=="default"){const d=Object.getOwnPropertyDescriptor(a,e);Object.defineProperty(i,e,d.get?d:{enumerable:!0,get:()=>a[e]})}}return i.default=a,Object.freeze(i)}const t=pe(ue),me=(a,i)=>a?typeof a=="number"?a+"px":a:i,G=n.createPropsContext(),y=t.forwardRef((a,i)=>{const e=n.usePropsContext(G,a),d=t.useRef(null),c=t.useRef(null),S=n.getScrollbarWidth(),{columns:l=u.columns,popupSettings:f=u.popupSettings,size:W=u.size,rounded:z=u.rounded,fillMode:L=u.fillMode,className:_,prefix:D=void 0,suffix:$=void 0,onOpen:w,onClose:M,onFocus:N,onBlur:E,onChange:F,onFilterChange:H,onPageChange:R,...V}=e;t.useImperativeHandle(d,()=>{var o;return{element:((o=c.current)==null?void 0:o.element)||null,focus(){c.current&&c.current.focus()},get value(){var r;return(r=c.current)==null?void 0:r.value},get name(){var r;return(r=c.current)==null?void 0:r.name},props:e}}),t.useImperativeHandle(i,()=>d.current);const g=t.useMemo(()=>{if(e.groupField!==void 0&&e.data)return ce.getItemValue(e.data[0],e.groupField)},[e.data,e.groupField]),[k,b]=t.useState(g),[q,B]=t.useState(!0),[A]=D?K(e.prefix||t.Fragment):[],[J]=$?K(e.suffix||t.Fragment):[],Q=t.useMemo(()=>{const o=t.createElement("th",{className:"k-table-th",colSpan:l.length},k);return t.createElement(t.Fragment,null,e.header,t.createElement("div",{className:"k-table-header-wrap k-table-scroller"},t.createElement("table",{className:"k-table",role:"presentation"},t.createElement("colgroup",null,l.map((r,p)=>t.createElement("col",{key:r.uniqueKey?r.uniqueKey:p,style:{width:r.width?r.width:u.width}}))),t.createElement("thead",{className:"k-table-thead"},t.createElement("tr",{className:"k-table-row"},l.map((r,p)=>t.createElement("th",{className:"k-table-th",key:r.uniqueKey?r.uniqueKey:p},r.header||" "))),k&&q&&t.createElement("tr",{className:"k-table-group-row"},e.groupStickyHeaderItemRender?e.groupStickyHeaderItemRender.call(void 0,o,{}):o)))))},[e.header,l,k,q]),U=t.useMemo(()=>`calc(${l.map(o=>me(o.width,u.width)).filter(Boolean).join(" + ")} + ${S}px + 4px)`,[l,S]),I=e.virtual?e.virtual.skip:0,X=t.useCallback((o,r)=>{const p=l.map((m,se)=>t.createElement("span",{className:e.itemRender?void 0:"k-table-td",style:e.itemRender?void 0:{width:m.width?m.width:u.width},key:m.uniqueKey?m.uniqueKey:se},m.field?String(n.getter(m.field)(r.dataItem)):""));let C,h,v,x,O=e.data||[];const P=r.index-I;e.groupField!==void 0&&(x=n.getter(e.groupField),h=x(O[P]),v=x(O[P-1]),h&&v&&h!==v&&(C=h)),C&&e.groupMode==="classic"&&p.push(t.createElement("div",{key:"group",className:"k-table-td k-table-group-td"},t.createElement("span",null,C)));const T=t.cloneElement(o,{...o.props,className:n.classNames("k-table-row",{"k-table-alt-row":r.index%2!==0,"k-focus":r.focused,"k-selected":r.selected,"k-first":!!C,"k-disabled":r.dataItem.disabled})},p);return e.itemRender?e.itemRender.call(void 0,T,r):T},[l,e.groupField,e.itemRender,e.data,I]),s=t.useCallback((o,r)=>{o&&o.call(void 0,{...r,target:d.current})},[]),Y=t.useCallback(o=>(e.virtual||b(g),s(w,o)),[s,w,e.virtual,g]),Z=t.useCallback(o=>s(M,o),[M]),ee=t.useCallback(o=>s(N,o),[N]),te=t.useCallback(o=>s(E,o),[E]),oe=t.useCallback(o=>s(F,o),[F]),re=t.useCallback(o=>s(R,o),[R]),ae=t.useCallback(o=>(b(g),s(H,{...o,mobileMode:o.target.mobileMode})),[H]),ne=t.useCallback(o=>{b(o.group)},[]);t.useEffect(()=>{n.setScrollbarWidth()}),t.useEffect(()=>{const o=e.data;b(g),o&&o.length!==0?B(!0):B(!1)},[e.data]);const le=t.useCallback(o=>t.createElement(de.MultiColumnList,{...o}),[]);return t.createElement(j.ComboBox,{...V,list:le,popupSettings:{...f,popupClass:n.classNames("k-dropdowngrid-popup",f.popupClass),width:f.width||U,className:f.className},ref:c,header:Q,itemRender:X,groupHeaderItemRender:e.groupHeaderItemRender,size:W,rounded:z,fillMode:L,groupMode:e.groupMode,groupField:e.groupField,isMultiColumn:!0,onOpen:Y,onClose:Z,onFocus:ee,onBlur:te,onChange:oe,onFilterChange:ae,onPageChange:re,onGroupScroll:ne,className:n.classNames("k-dropdowngrid",_),required:e.required,adaptive:e.adaptive,adaptiveFilter:e.adaptiveFilter,adaptiveTitle:e.adaptiveTitle,adaptiveSubtitle:e.adaptiveSubtitle,footer:e.footer,footerClassName:"k-table-footer",prefix:A,suffix:J})}),ge={...j.ComboBoxWithoutContext.propTypes,columns:ie.any.isRequired},u={columns:[],popupSettings:{},width:"200px",size:"medium",rounded:"medium",fillMode:"solid"};y.displayName="KendoMultiColumnComboBox";y.propTypes=ge;exports.MultiColumnComboBox=y;exports.MultiColumnComboBoxPropsContext=G;
|
|
@@ -12,9 +12,9 @@ import { createPropsContext as ue, usePropsContext as de, getScrollbarWidth as c
|
|
|
12
12
|
import { ComboBox as me, ComboBoxWithoutContext as fe } from "../ComboBox/ComboBox.mjs";
|
|
13
13
|
import { getItemValue as ge } from "../common/utils.mjs";
|
|
14
14
|
import W from "../common/withCustomComponent.mjs";
|
|
15
|
-
const he = (s, h) => s ? typeof s == "number" ? s + "px" : s : h,
|
|
15
|
+
const he = (s, h) => s ? typeof s == "number" ? s + "px" : s : h, be = ue(), P = e.forwardRef(
|
|
16
16
|
(s, h) => {
|
|
17
|
-
const t = de(
|
|
17
|
+
const t = de(be, s), b = e.useRef(null), i = e.useRef(null), y = ce(), {
|
|
18
18
|
columns: r = l.columns,
|
|
19
19
|
popupSettings: p = l.popupSettings,
|
|
20
20
|
size: z = l.size,
|
|
@@ -32,7 +32,7 @@ const he = (s, h) => s ? typeof s == "number" ? s + "px" : s : h, Ce = ue(), P =
|
|
|
32
32
|
onPageChange: M,
|
|
33
33
|
...A
|
|
34
34
|
} = t;
|
|
35
|
-
e.useImperativeHandle(
|
|
35
|
+
e.useImperativeHandle(b, () => {
|
|
36
36
|
var o;
|
|
37
37
|
return {
|
|
38
38
|
element: ((o = i.current) == null ? void 0 : o.element) || null,
|
|
@@ -51,21 +51,21 @@ const he = (s, h) => s ? typeof s == "number" ? s + "px" : s : h, Ce = ue(), P =
|
|
|
51
51
|
};
|
|
52
52
|
}), e.useImperativeHandle(
|
|
53
53
|
h,
|
|
54
|
-
() =>
|
|
54
|
+
() => b.current
|
|
55
55
|
);
|
|
56
56
|
const c = e.useMemo(() => {
|
|
57
57
|
if (t.groupField !== void 0 && t.data)
|
|
58
58
|
return ge(t.data[0], t.groupField);
|
|
59
|
-
}, [t.data, t.groupField]), [
|
|
60
|
-
const o = /* @__PURE__ */ e.createElement("th", { className: "k-table-th", colSpan: r.length },
|
|
61
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, t.header, /* @__PURE__ */ e.createElement("div", { className: "k-table-header-wrap" }, /* @__PURE__ */ e.createElement("table", { className: "k-table", role: "presentation" }, /* @__PURE__ */ e.createElement("colgroup", null, r.map((a, u) => /* @__PURE__ */ e.createElement(
|
|
59
|
+
}, [t.data, t.groupField]), [C, m] = e.useState(c), [R, B] = e.useState(!0), [D] = j ? W(t.prefix || e.Fragment) : [], [J] = V ? W(t.suffix || e.Fragment) : [], Q = e.useMemo(() => {
|
|
60
|
+
const o = /* @__PURE__ */ e.createElement("th", { className: "k-table-th", colSpan: r.length }, C);
|
|
61
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, t.header, /* @__PURE__ */ e.createElement("div", { className: "k-table-header-wrap k-table-scroller" }, /* @__PURE__ */ e.createElement("table", { className: "k-table", role: "presentation" }, /* @__PURE__ */ e.createElement("colgroup", null, r.map((a, u) => /* @__PURE__ */ e.createElement(
|
|
62
62
|
"col",
|
|
63
63
|
{
|
|
64
64
|
key: a.uniqueKey ? a.uniqueKey : u,
|
|
65
65
|
style: { width: a.width ? a.width : l.width }
|
|
66
66
|
}
|
|
67
|
-
))), /* @__PURE__ */ e.createElement("thead", { className: "k-table-thead" }, /* @__PURE__ */ e.createElement("tr", { className: "k-table-row" }, r.map((a, u) => /* @__PURE__ */ e.createElement("th", { className: "k-table-th", key: a.uniqueKey ? a.uniqueKey : u }, a.header || " "))),
|
|
68
|
-
}, [t.header, r,
|
|
67
|
+
))), /* @__PURE__ */ e.createElement("thead", { className: "k-table-thead" }, /* @__PURE__ */ e.createElement("tr", { className: "k-table-row" }, r.map((a, u) => /* @__PURE__ */ e.createElement("th", { className: "k-table-th", key: a.uniqueKey ? a.uniqueKey : u }, a.header || " "))), C && R && /* @__PURE__ */ e.createElement("tr", { className: "k-table-group-row" }, t.groupStickyHeaderItemRender ? t.groupStickyHeaderItemRender.call(void 0, o, {}) : o)))));
|
|
68
|
+
}, [t.header, r, C, R]), U = e.useMemo(
|
|
69
69
|
() => (
|
|
70
70
|
// These additional 4px are coming from the child elements side borders (fixes horizontal scrollbar)
|
|
71
71
|
`calc(${r.map((o) => he(o.width, l.width)).filter(Boolean).join(" + ")} + ${y}px + 4px)`
|
|
@@ -107,7 +107,7 @@ const he = (s, h) => s ? typeof s == "number" ? s + "px" : s : h, Ce = ue(), P =
|
|
|
107
107
|
), n = e.useCallback((o, a) => {
|
|
108
108
|
o && o.call(void 0, {
|
|
109
109
|
...a,
|
|
110
|
-
target:
|
|
110
|
+
target: b.current
|
|
111
111
|
});
|
|
112
112
|
}, []), Y = e.useCallback(
|
|
113
113
|
(o) => (t.virtual || m(c), n(w, o)),
|
|
@@ -170,7 +170,7 @@ const he = (s, h) => s ? typeof s == "number" ? s + "px" : s : h, Ce = ue(), P =
|
|
|
170
170
|
}
|
|
171
171
|
);
|
|
172
172
|
}
|
|
173
|
-
),
|
|
173
|
+
), Ce = {
|
|
174
174
|
...fe.propTypes,
|
|
175
175
|
columns: se.any.isRequired
|
|
176
176
|
}, l = {
|
|
@@ -182,8 +182,8 @@ const he = (s, h) => s ? typeof s == "number" ? s + "px" : s : h, Ce = ue(), P =
|
|
|
182
182
|
fillMode: "solid"
|
|
183
183
|
};
|
|
184
184
|
P.displayName = "KendoMultiColumnComboBox";
|
|
185
|
-
P.propTypes =
|
|
185
|
+
P.propTypes = Ce;
|
|
186
186
|
export {
|
|
187
187
|
P as MultiColumnComboBox,
|
|
188
|
-
|
|
188
|
+
be as MultiColumnComboBoxPropsContext
|
|
189
189
|
};
|