@yamada-ui/radio
Version:
Yamada UI radio component
113 lines (112 loc) • 3.63 kB
JavaScript
"use client"
;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/use-radio-group.ts
var use_radio_group_exports = {};
__export(use_radio_group_exports, {
useRadioGroup: () => useRadioGroup
});
module.exports = __toCommonJS(use_radio_group_exports);
var import_use_controllable_state = require("@yamada-ui/use-controllable-state");
var import_utils = require("@yamada-ui/utils");
var import_react = require("react");
var isEvent = (value) => value && (0, import_utils.isObject)(value) && (0, import_utils.isObject)(value.target);
var useRadioGroup = ({
id,
name,
defaultValue,
isNative,
value: valueProp,
onChange: onChangeProp,
...props
}) => {
const uuid = (0, import_react.useId)();
id != null ? id : id = uuid;
name != null ? name : name = `radio-${id}`;
const containerRef = (0, import_react.useRef)(null);
const onChangeRef = (0, import_utils.useCallbackRef)(onChangeProp);
const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
defaultValue,
value: valueProp,
onChange: onChangeRef
});
const onFocus = (0, import_react.useCallback)(() => {
const container = containerRef.current;
if (!container) return;
let query = `input:not(:disabled):checked`;
let firstInput = container.querySelector(query);
if (firstInput) {
firstInput.focus();
} else {
query = `input:not(:disabled)`;
firstInput = container.querySelector(query);
firstInput == null ? void 0 : firstInput.focus();
}
}, []);
const onChange = (0, import_react.useCallback)(
(evOrValue) => {
const nextValue = isEvent(evOrValue) ? evOrValue.target.value : evOrValue;
setValue(nextValue);
},
[setValue]
);
const getContainerProps = (0, import_react.useCallback)(
(props2 = {}, ref = null) => ({
role: "radiogroup",
...props2,
ref: (0, import_utils.mergeRefs)(ref, containerRef)
}),
[]
);
const getRadioProps = (0, import_react.useCallback)(
(props2 = {}, ref = null) => {
const checked = props2.value === value;
return {
...props2,
ref,
name,
"aria-checked": checked,
[isNative ? "checked" : "isChecked"]: (
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
value != null ? checked : void 0
),
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
...!isNative ? { checked: value != null ? checked : void 0 } : {},
onChange
};
},
[name, value, onChange, isNative]
);
return {
id,
name,
props,
setValue,
value,
getContainerProps,
getRadioProps,
onChange,
onFocus
};
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
useRadioGroup
});
//# sourceMappingURL=use-radio-group.js.map