@progress/kendo-react-layout 8.1.0-develop.8 → 8.1.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/bottomnavigation/BottomNavigation.js +1 -1
- package/bottomnavigation/BottomNavigation.mjs +36 -37
- package/bottomnavigation/BottomNavigationItem.js +1 -1
- package/bottomnavigation/BottomNavigationItem.mjs +33 -34
- package/breadcrumb/Breadcrumb.js +1 -1
- package/breadcrumb/Breadcrumb.mjs +34 -35
- package/card/Card.js +1 -1
- package/card/Card.mjs +28 -20
- package/dist/cdn/js/kendo-react-layout.js +1 -1
- package/drawer/Drawer.js +1 -1
- package/drawer/Drawer.mjs +65 -65
- package/gridlayout/GridLayout.js +1 -1
- package/gridlayout/GridLayout.mjs +11 -12
- package/index.d.mts +16 -9
- package/index.d.ts +16 -9
- package/package-metadata.mjs +1 -1
- package/package.json +6 -6
- package/splitter/SplitterBar.js +1 -1
- package/splitter/SplitterBar.mjs +72 -46
- package/stacklayout/StackLayout.js +1 -1
- package/stacklayout/StackLayout.mjs +13 -14
- package/stepper/Step.js +1 -1
- package/stepper/Step.mjs +68 -72
- package/stepper/Stepper.js +1 -1
- package/stepper/Stepper.mjs +179 -163
- package/tabstrip/TabStrip.js +1 -1
- package/tabstrip/TabStrip.mjs +94 -111
- package/tabstrip/TabStripContent.js +1 -1
- package/tabstrip/TabStripContent.mjs +2 -1
- package/tabstrip/TabStripNavigationItem.js +1 -1
- package/tabstrip/TabStripNavigationItem.mjs +36 -24
package/drawer/Drawer.js
CHANGED
|
@@ -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 client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react"),e=require("prop-types"),I=require("./context/DrawerContext.js"),M=require("./DrawerNavigation.js"),u=require("@progress/kendo-react-common"),T=require("../package-metadata.js");function W(a){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const t in a)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(a,t);Object.defineProperty(o,t,i.get?i:{enumerable:!0,get:()=>a[t]})}}return o.default=a,Object.freeze(o)}const n=W(R),m=n.forwardRef((a,o)=>{u.validatePackage(T.packageMetadata);const{expanded:t=r.expanded,mode:i=r.mode,position:v=r.position,className:b,children:w,style:y,animation:g=r.animation,mini:p=r.mini,width:h=r.width,miniWidth:k=r.miniWidth,dir:D=r.dir,items:s,item:x,tabIndex:N,onOverlayClick:C,onSelect:l}=a,c=n.useRef(null),O=n.useCallback(()=>{c.current&&c.current.focus()},[]);n.useImperativeHandle(o,()=>({element:c.current,focus:O}));const S=n.useCallback((P,j,d)=>{if(s&&l){const q={itemTarget:P,itemIndex:j,syntheticEvent:d,nativeEvent:d&&d.nativeEvent,target:void 0};l.call(void 0,q)}},[s,l]),f=u.useDir(c,D),E=u.classNames({"k-drawer-container":!0,"k-drawer-expanded":t,"k-drawer-overlay":i==="overlay","k-drawer-push":i==="push","k-drawer-mini":p&&!t},b);return n.createElement(I.DrawerContext.Provider,{value:{animation:g,expanded:t,mode:i,position:v,mini:p,dir:f,items:s,item:x,width:h,miniWidth:k,onOverlayClick:C,onSelect:S}},n.createElement("div",{className:E,ref:c,dir:f,style:y,tabIndex:N},s&&n.createElement(M.DrawerNavigation,null),w))});m.propTypes={animation:e.any,expanded:e.bool,children:e.any,className:e.string,dir:e.string,mode:e.string,position:e.string,mini:e.bool,style:e.object,tabIndex:e.number,width:e.number,miniWidth:e.number,selected:e.number,onSelect:e.func,onOverlayClick:e.func};const r={animation:!0,expanded:!1,mode:"overlay",position:"start",mini:!1,dir:"ltr",width:240,miniWidth:48};m.displayName="KendoDrawer";exports.Drawer=m;
|
package/drawer/Drawer.mjs
CHANGED
|
@@ -8,95 +8,96 @@
|
|
|
8
8
|
"use client";
|
|
9
9
|
import * as t from "react";
|
|
10
10
|
import e from "prop-types";
|
|
11
|
-
import { DrawerContext as
|
|
12
|
-
import { DrawerNavigation as
|
|
13
|
-
import { validatePackage as
|
|
14
|
-
import { packageMetadata as
|
|
15
|
-
const
|
|
16
|
-
|
|
11
|
+
import { DrawerContext as W } from "./context/DrawerContext.mjs";
|
|
12
|
+
import { DrawerNavigation as O } from "./DrawerNavigation.mjs";
|
|
13
|
+
import { validatePackage as T, useDir as j, classNames as H } from "@progress/kendo-react-common";
|
|
14
|
+
import { packageMetadata as K } from "../package-metadata.mjs";
|
|
15
|
+
const c = t.forwardRef((p, u) => {
|
|
16
|
+
T(K);
|
|
17
17
|
const {
|
|
18
|
-
expanded:
|
|
19
|
-
mode: i,
|
|
20
|
-
position:
|
|
21
|
-
className:
|
|
22
|
-
children:
|
|
23
|
-
style:
|
|
24
|
-
animation: y,
|
|
25
|
-
mini:
|
|
26
|
-
width:
|
|
27
|
-
miniWidth:
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
18
|
+
expanded: a = i.expanded,
|
|
19
|
+
mode: o = i.mode,
|
|
20
|
+
position: f = i.position,
|
|
21
|
+
className: v,
|
|
22
|
+
children: w,
|
|
23
|
+
style: h,
|
|
24
|
+
animation: y = i.animation,
|
|
25
|
+
mini: l = i.mini,
|
|
26
|
+
width: b = i.width,
|
|
27
|
+
miniWidth: k = i.miniWidth,
|
|
28
|
+
dir: x = i.dir,
|
|
29
|
+
items: r,
|
|
30
|
+
item: g,
|
|
31
|
+
tabIndex: E,
|
|
32
|
+
onOverlayClick: N,
|
|
33
|
+
onSelect: s
|
|
34
|
+
} = p, n = t.useRef(null), C = t.useCallback(
|
|
34
35
|
() => {
|
|
35
|
-
|
|
36
|
+
n.current && n.current.focus();
|
|
36
37
|
},
|
|
37
38
|
[]
|
|
38
39
|
);
|
|
39
40
|
t.useImperativeHandle(u, () => ({
|
|
40
|
-
element:
|
|
41
|
-
focus:
|
|
41
|
+
element: n.current,
|
|
42
|
+
focus: C
|
|
42
43
|
}));
|
|
43
|
-
const
|
|
44
|
-
(
|
|
45
|
-
if (
|
|
46
|
-
const
|
|
47
|
-
itemTarget:
|
|
48
|
-
itemIndex:
|
|
49
|
-
syntheticEvent:
|
|
50
|
-
nativeEvent:
|
|
44
|
+
const D = t.useCallback(
|
|
45
|
+
(P, R, d) => {
|
|
46
|
+
if (r && s) {
|
|
47
|
+
const S = {
|
|
48
|
+
itemTarget: P,
|
|
49
|
+
itemIndex: R,
|
|
50
|
+
syntheticEvent: d,
|
|
51
|
+
nativeEvent: d && d.nativeEvent,
|
|
51
52
|
target: void 0
|
|
52
53
|
};
|
|
53
|
-
|
|
54
|
+
s.call(void 0, S);
|
|
54
55
|
}
|
|
55
56
|
},
|
|
56
|
-
[
|
|
57
|
-
),
|
|
57
|
+
[r, s]
|
|
58
|
+
), m = j(n, x), I = H(
|
|
58
59
|
{
|
|
59
60
|
"k-drawer-container": !0,
|
|
60
|
-
"k-drawer-expanded":
|
|
61
|
-
"k-drawer-overlay":
|
|
62
|
-
"k-drawer-push":
|
|
63
|
-
"k-drawer-mini":
|
|
61
|
+
"k-drawer-expanded": a,
|
|
62
|
+
"k-drawer-overlay": o === "overlay",
|
|
63
|
+
"k-drawer-push": o === "push",
|
|
64
|
+
"k-drawer-mini": l && !a
|
|
64
65
|
},
|
|
65
|
-
|
|
66
|
+
v
|
|
66
67
|
);
|
|
67
68
|
return /* @__PURE__ */ t.createElement(
|
|
68
|
-
|
|
69
|
+
W.Provider,
|
|
69
70
|
{
|
|
70
71
|
value: {
|
|
71
72
|
animation: y,
|
|
72
|
-
expanded:
|
|
73
|
-
mode:
|
|
74
|
-
position:
|
|
75
|
-
mini:
|
|
76
|
-
dir:
|
|
77
|
-
items:
|
|
78
|
-
item:
|
|
79
|
-
width:
|
|
80
|
-
miniWidth:
|
|
81
|
-
onOverlayClick:
|
|
82
|
-
onSelect:
|
|
73
|
+
expanded: a,
|
|
74
|
+
mode: o,
|
|
75
|
+
position: f,
|
|
76
|
+
mini: l,
|
|
77
|
+
dir: m,
|
|
78
|
+
items: r,
|
|
79
|
+
item: g,
|
|
80
|
+
width: b,
|
|
81
|
+
miniWidth: k,
|
|
82
|
+
onOverlayClick: N,
|
|
83
|
+
onSelect: D
|
|
83
84
|
}
|
|
84
85
|
},
|
|
85
86
|
/* @__PURE__ */ t.createElement(
|
|
86
87
|
"div",
|
|
87
88
|
{
|
|
88
|
-
className:
|
|
89
|
-
ref:
|
|
90
|
-
dir:
|
|
91
|
-
style:
|
|
92
|
-
tabIndex:
|
|
89
|
+
className: I,
|
|
90
|
+
ref: n,
|
|
91
|
+
dir: m,
|
|
92
|
+
style: h,
|
|
93
|
+
tabIndex: E
|
|
93
94
|
},
|
|
94
|
-
|
|
95
|
-
|
|
95
|
+
r && /* @__PURE__ */ t.createElement(O, null),
|
|
96
|
+
w
|
|
96
97
|
)
|
|
97
98
|
);
|
|
98
99
|
});
|
|
99
|
-
|
|
100
|
+
c.propTypes = {
|
|
100
101
|
animation: e.any,
|
|
101
102
|
expanded: e.bool,
|
|
102
103
|
children: e.any,
|
|
@@ -113,7 +114,7 @@ l.propTypes = {
|
|
|
113
114
|
onSelect: e.func,
|
|
114
115
|
onOverlayClick: e.func
|
|
115
116
|
};
|
|
116
|
-
const
|
|
117
|
+
const i = {
|
|
117
118
|
animation: !0,
|
|
118
119
|
expanded: !1,
|
|
119
120
|
mode: "overlay",
|
|
@@ -123,8 +124,7 @@ const H = {
|
|
|
123
124
|
width: 240,
|
|
124
125
|
miniWidth: 48
|
|
125
126
|
};
|
|
126
|
-
|
|
127
|
-
l.displayName = "KendoDrawer";
|
|
127
|
+
c.displayName = "KendoDrawer";
|
|
128
128
|
export {
|
|
129
|
-
|
|
129
|
+
c as Drawer
|
|
130
130
|
};
|
package/gridlayout/GridLayout.js
CHANGED
|
@@ -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 client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react"),t=require("prop-types"),T=require("../package-metadata.js"),
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react"),t=require("prop-types"),T=require("../package-metadata.js"),g=require("@progress/kendo-react-common");function R(e){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const c=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(l,a,c.get?c:{enumerable:!0,get:()=>e[a]})}}return l.default=e,Object.freeze(l)}const n=R(O),d=n.forwardRef((e,l)=>{g.validatePackage(T.packageMetadata);const a=n.useRef(null),c=n.useCallback(()=>({element:a.current}),[]);n.useImperativeHandle(l,c);const{className:m,style:y,id:f,children:h,gap:i=u.gap}=e,p=g.useId(),o=n.useMemo(()=>e.align&&e.align.horizontal?e.align.horizontal:u.hAlign,[e.align]),r=n.useMemo(()=>e.align&&e.align.vertical?e.align.vertical:u.vAlign,[e.align]),b=n.useMemo(()=>g.classNames("k-grid-layout",{"k-justify-items-start":o==="start","k-justify-items-center":o==="center","k-justify-items-end":o==="end","k-justify-items-stretch":o==="stretch","k-align-items-start":r==="top","k-align-items-center":r==="middle","k-align-items-end":r==="bottom","k-align-items-stretch":r==="stretch"},m),[o,r,m]),k=i?`${typeof i.rows=="number"?i.rows+"px":i.rows} ${typeof i.cols=="number"?i.cols+"px":i.cols}`:void 0,v=e.rows&&e.rows.map(s=>`${typeof s.height=="number"?s.height+"px":s.height}`).join(" "),j=e.cols&&e.cols.map(s=>`${typeof s.width=="number"?s.width+"px":s.width}`).join(" "),w={gap:k,gridTemplateColumns:j,gridTemplateRows:v,...y};return n.createElement("div",{ref:a,className:b,style:w,id:f||p},h)}),u={hAlign:"stretch",vAlign:"stretch",gap:void 0};d.propTypes={className:t.string,style:t.object,children:t.any,id:t.string,gap:t.shape({rows:t.oneOfType([t.string,t.number]),columns:t.oneOfType([t.string,t.number])}),align:t.shape({vertical:t.oneOf(["top","middle","bottom","stretch"]),horizontal:t.oneOf(["start","center","end","stretch"])})};d.displayName="KendoReactGridLayout";exports.GridLayout=d;
|
|
@@ -10,16 +10,16 @@ import * as i from "react";
|
|
|
10
10
|
import e from "prop-types";
|
|
11
11
|
import { packageMetadata as T } from "../package-metadata.mjs";
|
|
12
12
|
import { validatePackage as j, useId as R, classNames as A } from "@progress/kendo-react-common";
|
|
13
|
-
const
|
|
13
|
+
const c = i.forwardRef((t, g) => {
|
|
14
14
|
j(T);
|
|
15
|
-
const
|
|
15
|
+
const r = i.useRef(null), d = i.useCallback(
|
|
16
16
|
() => ({
|
|
17
|
-
element:
|
|
17
|
+
element: r.current
|
|
18
18
|
}),
|
|
19
19
|
[]
|
|
20
20
|
);
|
|
21
21
|
i.useImperativeHandle(g, d);
|
|
22
|
-
const { className:
|
|
22
|
+
const { className: m, style: u, id: h, children: y, gap: a = o.gap } = t, f = R(), n = i.useMemo(
|
|
23
23
|
() => t.align && t.align.horizontal ? t.align.horizontal : o.hAlign,
|
|
24
24
|
[t.align]
|
|
25
25
|
), l = i.useMemo(
|
|
@@ -38,10 +38,10 @@ const r = i.forwardRef((t, g) => {
|
|
|
38
38
|
"k-align-items-end": l === "bottom",
|
|
39
39
|
"k-align-items-stretch": l === "stretch"
|
|
40
40
|
},
|
|
41
|
-
|
|
41
|
+
m
|
|
42
42
|
),
|
|
43
|
-
[n, l,
|
|
44
|
-
), k =
|
|
43
|
+
[n, l, m]
|
|
44
|
+
), k = a ? `${typeof a.rows == "number" ? a.rows + "px" : a.rows} ${typeof a.cols == "number" ? a.cols + "px" : a.cols}` : void 0, v = t.rows && t.rows.map((s) => `${typeof s.height == "number" ? s.height + "px" : s.height}`).join(" "), b = t.cols && t.cols.map((s) => `${typeof s.width == "number" ? s.width + "px" : s.width}`).join(" "), w = {
|
|
45
45
|
gap: k,
|
|
46
46
|
gridTemplateColumns: b,
|
|
47
47
|
gridTemplateRows: v,
|
|
@@ -50,7 +50,7 @@ const r = i.forwardRef((t, g) => {
|
|
|
50
50
|
return /* @__PURE__ */ i.createElement(
|
|
51
51
|
"div",
|
|
52
52
|
{
|
|
53
|
-
ref:
|
|
53
|
+
ref: r,
|
|
54
54
|
className: p,
|
|
55
55
|
style: w,
|
|
56
56
|
id: h || f
|
|
@@ -62,7 +62,7 @@ const r = i.forwardRef((t, g) => {
|
|
|
62
62
|
vAlign: "stretch",
|
|
63
63
|
gap: void 0
|
|
64
64
|
};
|
|
65
|
-
|
|
65
|
+
c.propTypes = {
|
|
66
66
|
className: e.string,
|
|
67
67
|
style: e.object,
|
|
68
68
|
children: e.any,
|
|
@@ -76,8 +76,7 @@ r.propTypes = {
|
|
|
76
76
|
horizontal: e.oneOf(["start", "center", "end", "stretch"])
|
|
77
77
|
})
|
|
78
78
|
};
|
|
79
|
-
|
|
80
|
-
r.displayName = "KendoReactGridLayout";
|
|
79
|
+
c.displayName = "KendoReactGridLayout";
|
|
81
80
|
export {
|
|
82
|
-
|
|
81
|
+
c as GridLayout
|
|
83
82
|
};
|
package/index.d.mts
CHANGED
|
@@ -2944,7 +2944,7 @@ export declare interface PanelBarItemProps {
|
|
|
2944
2944
|
/**
|
|
2945
2945
|
* Can be any of PanelBar items, an array of PanelBar items, or a custom component.
|
|
2946
2946
|
*/
|
|
2947
|
-
children?:
|
|
2947
|
+
children?: any;
|
|
2948
2948
|
/**
|
|
2949
2949
|
* The class name that is set to the PanelBarItem component.
|
|
2950
2950
|
*/
|
|
@@ -3232,10 +3232,14 @@ export declare class Splitter extends React_2.Component<SplitterProps, SplitterS
|
|
|
3232
3232
|
*/
|
|
3233
3233
|
export declare class SplitterBar extends React_2.Component<SplitterBarProps, SplitterBarState> {
|
|
3234
3234
|
private draggable;
|
|
3235
|
+
private spliterBarRef;
|
|
3236
|
+
private navigation?;
|
|
3235
3237
|
private get isStatic();
|
|
3236
3238
|
private get isDraggable();
|
|
3237
3239
|
private get isHorizontal();
|
|
3238
3240
|
constructor(props: SplitterBarProps);
|
|
3241
|
+
/** @hidden */
|
|
3242
|
+
componentDidMount(): void;
|
|
3239
3243
|
render(): JSX_2.Element;
|
|
3240
3244
|
private onDrag;
|
|
3241
3245
|
private onFocus;
|
|
@@ -3815,12 +3819,16 @@ export declare class TabStripClassComponent extends React_2.Component<TabStripPr
|
|
|
3815
3819
|
mouseScrollSpeed: number;
|
|
3816
3820
|
renderAllContent: boolean;
|
|
3817
3821
|
};
|
|
3818
|
-
private
|
|
3822
|
+
private tabStripRef;
|
|
3819
3823
|
private get contentPanelId();
|
|
3820
3824
|
private get navItemId();
|
|
3821
3825
|
private showLicenseWatermark;
|
|
3822
|
-
private
|
|
3826
|
+
private navigation?;
|
|
3823
3827
|
constructor(props: TabStripProps);
|
|
3828
|
+
/** @hidden */
|
|
3829
|
+
componentDidMount(): void;
|
|
3830
|
+
/** @hidden */
|
|
3831
|
+
componentWillUnmount(): void;
|
|
3824
3832
|
/**
|
|
3825
3833
|
* @hidden
|
|
3826
3834
|
*/
|
|
@@ -3828,17 +3836,16 @@ export declare class TabStripClassComponent extends React_2.Component<TabStripPr
|
|
|
3828
3836
|
/**
|
|
3829
3837
|
* @hidden
|
|
3830
3838
|
*/
|
|
3831
|
-
onKeyDown: (event:
|
|
3839
|
+
onKeyDown: (event: React_2.KeyboardEvent<HTMLElement>) => void;
|
|
3840
|
+
/**
|
|
3841
|
+
* @hidden
|
|
3842
|
+
*/
|
|
3843
|
+
onKeyboardSelect: (index: number) => void;
|
|
3832
3844
|
/**
|
|
3833
3845
|
* @hidden
|
|
3834
3846
|
*/
|
|
3835
3847
|
render(): JSX_2.Element;
|
|
3836
3848
|
private renderContent;
|
|
3837
|
-
private invertKeys;
|
|
3838
|
-
private firstNavigatableTab;
|
|
3839
|
-
private lastNavigatableTab;
|
|
3840
|
-
private prevNavigatableTab;
|
|
3841
|
-
private nextNavigatableTab;
|
|
3842
3849
|
private children;
|
|
3843
3850
|
}
|
|
3844
3851
|
|
package/index.d.ts
CHANGED
|
@@ -2944,7 +2944,7 @@ export declare interface PanelBarItemProps {
|
|
|
2944
2944
|
/**
|
|
2945
2945
|
* Can be any of PanelBar items, an array of PanelBar items, or a custom component.
|
|
2946
2946
|
*/
|
|
2947
|
-
children?:
|
|
2947
|
+
children?: any;
|
|
2948
2948
|
/**
|
|
2949
2949
|
* The class name that is set to the PanelBarItem component.
|
|
2950
2950
|
*/
|
|
@@ -3232,10 +3232,14 @@ export declare class Splitter extends React_2.Component<SplitterProps, SplitterS
|
|
|
3232
3232
|
*/
|
|
3233
3233
|
export declare class SplitterBar extends React_2.Component<SplitterBarProps, SplitterBarState> {
|
|
3234
3234
|
private draggable;
|
|
3235
|
+
private spliterBarRef;
|
|
3236
|
+
private navigation?;
|
|
3235
3237
|
private get isStatic();
|
|
3236
3238
|
private get isDraggable();
|
|
3237
3239
|
private get isHorizontal();
|
|
3238
3240
|
constructor(props: SplitterBarProps);
|
|
3241
|
+
/** @hidden */
|
|
3242
|
+
componentDidMount(): void;
|
|
3239
3243
|
render(): JSX_2.Element;
|
|
3240
3244
|
private onDrag;
|
|
3241
3245
|
private onFocus;
|
|
@@ -3815,12 +3819,16 @@ export declare class TabStripClassComponent extends React_2.Component<TabStripPr
|
|
|
3815
3819
|
mouseScrollSpeed: number;
|
|
3816
3820
|
renderAllContent: boolean;
|
|
3817
3821
|
};
|
|
3818
|
-
private
|
|
3822
|
+
private tabStripRef;
|
|
3819
3823
|
private get contentPanelId();
|
|
3820
3824
|
private get navItemId();
|
|
3821
3825
|
private showLicenseWatermark;
|
|
3822
|
-
private
|
|
3826
|
+
private navigation?;
|
|
3823
3827
|
constructor(props: TabStripProps);
|
|
3828
|
+
/** @hidden */
|
|
3829
|
+
componentDidMount(): void;
|
|
3830
|
+
/** @hidden */
|
|
3831
|
+
componentWillUnmount(): void;
|
|
3824
3832
|
/**
|
|
3825
3833
|
* @hidden
|
|
3826
3834
|
*/
|
|
@@ -3828,17 +3836,16 @@ export declare class TabStripClassComponent extends React_2.Component<TabStripPr
|
|
|
3828
3836
|
/**
|
|
3829
3837
|
* @hidden
|
|
3830
3838
|
*/
|
|
3831
|
-
onKeyDown: (event:
|
|
3839
|
+
onKeyDown: (event: React_2.KeyboardEvent<HTMLElement>) => void;
|
|
3840
|
+
/**
|
|
3841
|
+
* @hidden
|
|
3842
|
+
*/
|
|
3843
|
+
onKeyboardSelect: (index: number) => void;
|
|
3832
3844
|
/**
|
|
3833
3845
|
* @hidden
|
|
3834
3846
|
*/
|
|
3835
3847
|
render(): JSX_2.Element;
|
|
3836
3848
|
private renderContent;
|
|
3837
|
-
private invertKeys;
|
|
3838
|
-
private firstNavigatableTab;
|
|
3839
|
-
private lastNavigatableTab;
|
|
3840
|
-
private prevNavigatableTab;
|
|
3841
|
-
private nextNavigatableTab;
|
|
3842
3849
|
private children;
|
|
3843
3850
|
}
|
|
3844
3851
|
|
package/package-metadata.mjs
CHANGED
|
@@ -10,7 +10,7 @@ const e = {
|
|
|
10
10
|
name: "@progress/kendo-react-layout",
|
|
11
11
|
productName: "KendoReact",
|
|
12
12
|
productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
|
|
13
|
-
publishDate:
|
|
13
|
+
publishDate: 1719467345,
|
|
14
14
|
version: "",
|
|
15
15
|
licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
16
16
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-layout",
|
|
3
|
-
"version": "8.1.0
|
|
3
|
+
"version": "8.1.0",
|
|
4
4
|
"description": "React Layout components enable you to create a perceptive and intuitive layout of web projects. KendoReact Layout package",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
@@ -23,11 +23,11 @@
|
|
|
23
23
|
"sideEffects": false,
|
|
24
24
|
"peerDependencies": {
|
|
25
25
|
"@progress/kendo-licensing": "^1.3.4",
|
|
26
|
-
"@progress/kendo-react-animation": "8.1.0
|
|
27
|
-
"@progress/kendo-react-common": "8.1.0
|
|
28
|
-
"@progress/kendo-react-intl": "8.1.0
|
|
29
|
-
"@progress/kendo-react-popup": "8.1.0
|
|
30
|
-
"@progress/kendo-react-progressbars": "8.1.0
|
|
26
|
+
"@progress/kendo-react-animation": "8.1.0",
|
|
27
|
+
"@progress/kendo-react-common": "8.1.0",
|
|
28
|
+
"@progress/kendo-react-intl": "8.1.0",
|
|
29
|
+
"@progress/kendo-react-popup": "8.1.0",
|
|
30
|
+
"@progress/kendo-react-progressbars": "8.1.0",
|
|
31
31
|
"@progress/kendo-svg-icons": "^3.0.0",
|
|
32
32
|
"react": "^16.8.2 || ^17.0.0 || ^18.0.0",
|
|
33
33
|
"react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0"
|
package/splitter/SplitterBar.js
CHANGED
|
@@ -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 client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react"),p=require("@progress/kendo-react-common"),l=require("@progress/kendo-svg-icons");function b(c){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const s in c)if(s!=="default"){const e=Object.getOwnPropertyDescriptor(c,s);Object.defineProperty(a,s,e.get?e:{enumerable:!0,get:()=>c[s]})}}return a.default=c,Object.freeze(a)}const r=b(h);class d extends r.Component{constructor(a){super(a),this.draggable=null,this.spliterBarRef=r.createRef(),this.onDrag=(s,e,o)=>{const{event:i}=s,{onDrag:n,index:t}=this.props,g=this.draggable&&this.draggable.element;g&&!this.isStatic&&this.isDraggable&&n(i,g,t,e,o)},this.onFocus=()=>{this.setState({focused:!0})},this.onBlur=()=>{this.setState({focused:!1})},this.onToggle=s=>{const{onToggle:e,index:o,prev:i,next:n}=this.props;(i.collapsible||n.collapsible)&&e(i.collapsible?o:o+1,s)},this.onPrevToggle=s=>{const{onToggle:e,index:o,prev:i}=this.props;i.collapsible&&e(o,s)},this.onNextToggle=s=>{const{onToggle:e,index:o,next:i}=this.props;i.collapsible&&e(o+1,s)},this.onKeyDown=s=>{this.navigation.triggerKeyboardEvent(s)},this.state={focused:!1}}get isStatic(){const{prev:a,next:s}=this.props,e=a.resizable&&s.resizable,o=a.collapsible||s.collapsible;return!e&&!o}get isDraggable(){const{prev:a,next:s}=this.props,e=a.resizable&&s.resizable,o=a.collapsed||s.collapsed;return!!e&&!o}get isHorizontal(){return this.props.orientation==="horizontal"}componentDidMount(){const a=this.draggable&&this.draggable.element,{index:s,onKeyboardResize:e}=this.props,o=this.isHorizontal;a&&(this.navigation=new p.Navigation({tabIndex:0,root:this.spliterBarRef,selectors:[".k-splitter .k-splitbar"],keyboardEvents:{keydown:{ArrowLeft:(i,n,t)=>{o&&(t.preventDefault(),this.isDraggable&&e(a,s,-10,t),(t.metaKey||t.ctrlKey)&&(e(a,s,0,t),this.isDraggable?this.onPrevToggle(t):this.onNextToggle(t)))},ArrowRight:(i,n,t)=>{o&&(t.preventDefault(),this.isDraggable&&e(a,s,10,t),(t.metaKey||t.ctrlKey)&&(e(a,s,0,t),this.isDraggable?this.onNextToggle(t):this.onPrevToggle(t)))},ArrowDown:(i,n,t)=>{o||(t.preventDefault(),this.isDraggable&&e(a,s,10,t),(t.metaKey||t.ctrlKey)&&(e(a,s,0,t),this.isDraggable?this.onNextToggle(t):this.onPrevToggle(t)))},ArrowUp:(i,n,t)=>{o||(t.preventDefault(),this.isDraggable&&e(a,s,-10,t),(t.metaKey||t.ctrlKey)&&(e(a,s,0,t),this.isDraggable?this.onPrevToggle(t):this.onNextToggle(t)))},Enter:(i,n,t)=>{t.preventDefault(),this.onToggle(t)}}}}))}render(){const a=this.isDraggable,s=this.isStatic,e=this.isHorizontal,o=p.classNames("k-splitbar",{"k-focus":this.state.focused,"k-splitbar-horizontal":e,"k-splitbar-vertical":!e,"k-splitbar-draggable-horizontal":e&&a,"k-splitbar-draggable-vertical":!e&&a,"k-splitbar-static-horizontal":e&&s,"k-splitbar-static-vertical":!e&&s});return r.createElement(p.Draggable,{onPress:i=>this.onDrag(i,!0,!1),onDrag:i=>this.onDrag(i,!1,!1),onRelease:i=>this.onDrag(i,!1,!0),ref:i=>{this.draggable=i}},r.createElement("div",{ref:this.spliterBarRef,tabIndex:s?-1:0,role:"separator","aria-valuenow":0,"aria-label":this.props.ariaLabel,"aria-orientation":e?"vertical":void 0,className:o,style:{touchAction:"none"},onFocus:this.onFocus,onBlur:this.onBlur,onDoubleClick:this.onToggle,onKeyDown:this.onKeyDown},this.props.prev.collapsible&&r.createElement("div",{className:"k-collapse-prev",onClick:this.onPrevToggle},r.createElement(p.IconWrap,{name:this.props.prev.collapsible?e?this.props.prev.collapsed?this.props.isRtl?"caret-alt-left":"caret-alt-right":this.props.isRtl?"caret-alt-right":"caret-alt-left":this.props.prev.collapsed?"caret-alt-down":"caret-alt-up":void 0,icon:this.props.prev.collapsible?e?this.props.prev.collapsed?this.props.isRtl?l.caretAltLeftIcon:l.caretAltRightIcon:this.props.isRtl?l.caretAltRightIcon:l.caretAltLeftIcon:this.props.prev.collapsed?l.caretAltDownIcon:l.caretAltUpIcon:void 0,size:"xsmall"})),r.createElement("div",{className:"k-resize-handle"}),this.props.next.collapsible&&r.createElement("div",{className:"k-collapse-next",onClick:this.onNextToggle},r.createElement(p.IconWrap,{name:this.props.next.collapsible?e?this.props.next.collapsed?this.props.isRtl?"caret-alt-right":"caret-alt-left":this.props.isRtl?"caret-alt-left":"caret-alt-right":this.props.next.collapsed?"caret-alt-up":"caret-alt-down":void 0,icon:this.props.next.collapsible?e?this.props.next.collapsed?this.props.isRtl?l.caretAltRightIcon:l.caretAltLeftIcon:this.props.isRtl?l.caretAltLeftIcon:l.caretAltRightIcon:this.props.next.collapsed?l.caretAltUpIcon:l.caretAltDownIcon:void 0,size:"xsmall"}))))}}exports.SplitterBar=d;
|