@progress/kendo-react-grid 14.3.0-develop.1 → 14.3.0-develop.2
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/cdn/js/kendo-react-grid.js +1 -1
- package/index.js +1 -1
- package/index.mjs +8 -10
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +1 -1
- package/package.json +17 -17
- package/toolbar-tools/smartbox/SmartBox.js +1 -1
- package/toolbar-tools/smartbox/SmartBox.mjs +102 -94
- package/toolbar-tools/smartbox/hooks/useSmartBoxSegmentedControl.d.ts +12 -3
- package/toolbar-tools/smartbox/hooks/useSmartBoxSegmentedControl.js +1 -1
- package/toolbar-tools/smartbox/hooks/useSmartBoxSegmentedControl.mjs +42 -41
- package/toolbar-tools/smartbox/index.d.ts +0 -1
- package/toolbar-tools/smartbox/interfaces/index.d.ts +0 -1
- package/toolbar-tools/smartbox/SegmentedControl.d.ts +0 -13
- package/toolbar-tools/smartbox/SegmentedControl.js +0 -8
- package/toolbar-tools/smartbox/SegmentedControl.mjs +0 -109
- package/toolbar-tools/smartbox/interfaces/SegmentedControlTypes.d.ts +0 -66
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
-
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
-
*-------------------------------------------------------------------------------------------
|
|
7
|
-
*/
|
|
8
|
-
import * as e from "react";
|
|
9
|
-
import { kendoThemeMaps as x, classNames as g, IconWrap as T } from "@progress/kendo-react-common";
|
|
10
|
-
const $ = void 0, w = e.forwardRef((S, y) => {
|
|
11
|
-
const { buttons: v = [], size: b = $, stretched: E } = S, R = b ? x.sizeMap[b] : void 0, a = e.useRef(null), I = e.useRef(null), [N, m] = e.useState({}), r = e.useCallback(() => {
|
|
12
|
-
const t = a.current, s = I.current;
|
|
13
|
-
if (!t || !s)
|
|
14
|
-
return;
|
|
15
|
-
const o = t.querySelector(".k-segmented-control-button.k-selected");
|
|
16
|
-
if (!o)
|
|
17
|
-
return;
|
|
18
|
-
const d = t.offsetWidth, l = o.offsetWidth, i = o.offsetLeft;
|
|
19
|
-
s.style.left = `${i}px`, s.style.right = `${d - i - l}px`;
|
|
20
|
-
}, []);
|
|
21
|
-
return e.useLayoutEffect(() => {
|
|
22
|
-
r();
|
|
23
|
-
}, [v, r]), e.useEffect(() => {
|
|
24
|
-
const t = a.current;
|
|
25
|
-
if (!t)
|
|
26
|
-
return;
|
|
27
|
-
const s = new ResizeObserver(() => {
|
|
28
|
-
r();
|
|
29
|
-
});
|
|
30
|
-
return s.observe(t), () => {
|
|
31
|
-
s.disconnect();
|
|
32
|
-
};
|
|
33
|
-
}, [r]), e.useImperativeHandle(
|
|
34
|
-
y,
|
|
35
|
-
() => ({
|
|
36
|
-
element: a.current
|
|
37
|
-
}),
|
|
38
|
-
[]
|
|
39
|
-
), /* @__PURE__ */ e.createElement(
|
|
40
|
-
"div",
|
|
41
|
-
{
|
|
42
|
-
ref: a,
|
|
43
|
-
className: g("k-segmented-control", R && `k-segmented-control-${R}`, {
|
|
44
|
-
"k-segmented-control-stretched": E
|
|
45
|
-
})
|
|
46
|
-
},
|
|
47
|
-
/* @__PURE__ */ e.createElement("div", { className: "k-segmented-control-thumb", ref: I, "aria-hidden": "true" }),
|
|
48
|
-
v.map(
|
|
49
|
-
({
|
|
50
|
-
buttonId: t,
|
|
51
|
-
disabled: s,
|
|
52
|
-
text: o,
|
|
53
|
-
svgIcon: d,
|
|
54
|
-
selected: l,
|
|
55
|
-
accentIcon: i,
|
|
56
|
-
type: z = "button",
|
|
57
|
-
onClick: f,
|
|
58
|
-
onMouseEnter: u,
|
|
59
|
-
onMouseLeave: h,
|
|
60
|
-
onFocus: k,
|
|
61
|
-
onBlur: p,
|
|
62
|
-
...W
|
|
63
|
-
}) => /* @__PURE__ */ e.createElement(
|
|
64
|
-
"button",
|
|
65
|
-
{
|
|
66
|
-
key: t,
|
|
67
|
-
type: z,
|
|
68
|
-
className: g("k-segmented-control-button", {
|
|
69
|
-
"k-selected": l,
|
|
70
|
-
"k-hover": N.hoveredId === t && !s,
|
|
71
|
-
"k-focus": N.focusedId === t && !s,
|
|
72
|
-
"k-disabled": s
|
|
73
|
-
}),
|
|
74
|
-
disabled: s,
|
|
75
|
-
onClick: (n) => {
|
|
76
|
-
f == null || f(n), r();
|
|
77
|
-
},
|
|
78
|
-
onMouseEnter: (n) => {
|
|
79
|
-
m((c) => ({ ...c, hoveredId: t })), u == null || u(n);
|
|
80
|
-
},
|
|
81
|
-
onMouseLeave: (n) => {
|
|
82
|
-
m((c) => ({ ...c, hoveredId: void 0 })), h == null || h(n);
|
|
83
|
-
},
|
|
84
|
-
onFocus: (n) => {
|
|
85
|
-
m((c) => ({ ...c, focusedId: t })), k == null || k(n);
|
|
86
|
-
},
|
|
87
|
-
onBlur: (n) => {
|
|
88
|
-
m((c) => ({ ...c, focusedId: void 0 })), p == null || p(n);
|
|
89
|
-
},
|
|
90
|
-
...W
|
|
91
|
-
},
|
|
92
|
-
d && /* @__PURE__ */ e.createElement(
|
|
93
|
-
T,
|
|
94
|
-
{
|
|
95
|
-
className: g("k-segmented-control-button-icon", {
|
|
96
|
-
"k-accent-icon": l && i
|
|
97
|
-
}),
|
|
98
|
-
icon: d
|
|
99
|
-
}
|
|
100
|
-
),
|
|
101
|
-
/* @__PURE__ */ e.createElement("span", { className: "k-segmented-control-button-text" }, o)
|
|
102
|
-
)
|
|
103
|
-
)
|
|
104
|
-
);
|
|
105
|
-
});
|
|
106
|
-
w.displayName = "KendoReactSegmentedControl";
|
|
107
|
-
export {
|
|
108
|
-
w as SegmentedControl
|
|
109
|
-
};
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
-
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
-
*-------------------------------------------------------------------------------------------
|
|
7
|
-
*/
|
|
8
|
-
import { ButtonProps } from '@progress/kendo-react-buttons';
|
|
9
|
-
import { SVGIcon } from '@progress/kendo-svg-icons';
|
|
10
|
-
/**
|
|
11
|
-
* @hidden
|
|
12
|
-
*
|
|
13
|
-
* Defines the props for a Button inside the SegmentedControlComponent.
|
|
14
|
-
*/
|
|
15
|
-
export interface SegmentedButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
16
|
-
/**
|
|
17
|
-
* The unique identifier for the SegmentedButton.
|
|
18
|
-
*/
|
|
19
|
-
buttonId: number;
|
|
20
|
-
/**
|
|
21
|
-
* Sets an SVG icon to display inside the Button.
|
|
22
|
-
*/
|
|
23
|
-
svgIcon?: SVGIcon;
|
|
24
|
-
/**
|
|
25
|
-
* Specifies the text content of the Button.
|
|
26
|
-
*/
|
|
27
|
-
text?: string;
|
|
28
|
-
/**
|
|
29
|
-
* Specifies whether the button is selected.
|
|
30
|
-
*/
|
|
31
|
-
selected?: boolean;
|
|
32
|
-
/**
|
|
33
|
-
* Specifies whether the icon should use the accent color when the button is selected.
|
|
34
|
-
*
|
|
35
|
-
* @default false
|
|
36
|
-
*/
|
|
37
|
-
accentIcon?: boolean;
|
|
38
|
-
}
|
|
39
|
-
/**
|
|
40
|
-
* @hidden
|
|
41
|
-
*/
|
|
42
|
-
export interface SegmentedControlHandle {
|
|
43
|
-
/**
|
|
44
|
-
* The root DOM element of the SegmentedControl.
|
|
45
|
-
*/
|
|
46
|
-
element: HTMLDivElement | null;
|
|
47
|
-
}
|
|
48
|
-
/**
|
|
49
|
-
* @hidden
|
|
50
|
-
*/
|
|
51
|
-
export interface SegmentedControlProps {
|
|
52
|
-
/**
|
|
53
|
-
* Specifies the collection of buttons that will be rendered inside the SegmentedControl.
|
|
54
|
-
*/
|
|
55
|
-
buttons?: Array<SegmentedButtonProps>;
|
|
56
|
-
/**
|
|
57
|
-
* Sets the padding of the control.
|
|
58
|
-
*
|
|
59
|
-
*
|
|
60
|
-
*/
|
|
61
|
-
size?: ButtonProps['size'];
|
|
62
|
-
/**
|
|
63
|
-
* Specifies whether the SegmentedControl should stretch to fill the available horizontal space.
|
|
64
|
-
*/
|
|
65
|
-
stretched?: boolean;
|
|
66
|
-
}
|