@progress/kendo-react-inputs
Version:
React Inputs offer a customizable interface for users to enter and pick different information. KendoReact Input package
127 lines (126 loc) • 3.07 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 e from "react";
import a from "prop-types";
import { createPropsContext as U, usePropsContext as A, useUnstyled as G, useId as J, dispatchEvent as d, classNames as m, uRadioButton as b, getTabIndex as M } from "@progress/kendo-react-common";
const Q = U(), x = e.forwardRef((E, F) => {
const I = A(Q, E), {
ariaDescribedBy: P,
checked: p,
children: f,
className: k,
disabled: n,
id: g,
size: N = V.size,
label: o,
labelPlacement: z,
name: T,
style: q,
tabIndex: w,
value: r,
valid: D,
onChange: h,
onFocus: c,
onBlur: i,
required: H,
...j
} = I, y = G(), u = y && y.uRadioButton, l = e.useRef(null), C = e.useCallback(() => {
l.current && l.current.focus();
}, []), s = e.useCallback(
() => ({
element: l.current,
focus: C
}),
[C]
);
e.useImperativeHandle(F, s);
const B = J(), K = e.useCallback(
(t) => {
d(h, t, s(), {
value: r
});
},
[h, r, n]
), L = e.useCallback(
(t) => {
c && !n && d(
c,
t,
s(),
void 0
);
},
[c, n]
), O = e.useCallback(
(t) => {
i && !n && d(i, t, s(), void 0);
},
[i, n]
), S = {
type: "radio",
id: g || B,
name: T,
className: m(
b.input({
c: u,
size: N,
invalid: D === !1,
checked: p
}),
k
),
ref: l,
disabled: n,
tabIndex: M(w, n),
checked: p,
style: q,
"aria-describedby": P,
"aria-required": H,
value: r,
onChange: K,
onFocus: L,
onBlur: O,
...j
}, v = /* @__PURE__ */ e.createElement(e.Fragment, null, o !== void 0 ? /* @__PURE__ */ e.createElement(
"label",
{
className: m(b.label({ c: u })),
htmlFor: g || B,
style: { userSelect: "none" },
"aria-label": o
},
o
) : null), R = /* @__PURE__ */ e.createElement("span", { className: m(b.wrap({ c: u })) }, /* @__PURE__ */ e.createElement("input", { ...S }));
return z === "before" ? /* @__PURE__ */ e.createElement(e.Fragment, null, v, R, f) : /* @__PURE__ */ e.createElement(e.Fragment, null, R, v, f);
});
x.propTypes = {
ariaDescribedBy: a.string,
checked: a.bool,
className: a.string,
disabled: a.bool,
id: a.string,
size: a.oneOf([null, "small", "medium", "large"]),
label: a.string,
labelPlacement: a.string,
name: a.string,
style: a.object,
tabIndex: a.number,
value: a.any,
valid: a.bool,
onChange: a.func,
onFocus: a.func,
onBlur: a.func
};
const V = {
size: "medium"
};
x.displayName = "KendoRadioButton";
export {
x as RadioButton,
Q as RadioButtonPropsContext
};