@navikt/ds-react
Version:
React components from the Norwegian Labour and Welfare Administration.
21 lines • 1.49 kB
JavaScript
import React, { forwardRef } from "react";
import { BodyShort } from "../../typography/index.js";
import { omit, useId } from "../../utils-external/index.js";
import { cl } from "../../utils/helpers/index.js";
import { useRadio } from "./useRadio.js";
export const Radio = forwardRef((props, ref) => {
const { inputProps, size, hasError, readOnly } = useRadio(props);
const descriptionId = useId();
return (React.createElement("div", { className: cl(props.className, "aksel-radio", `aksel-radio--${size}`, {
"aksel-radio--error": hasError,
"aksel-radio--disabled": inputProps.disabled,
"aksel-radio--readonly": readOnly,
}), "data-color": hasError ? "danger" : props["data-color"] },
React.createElement("input", Object.assign({}, omit(props, ["children", "size", "description", "readOnly"]), omit(inputProps, ["aria-invalid", "aria-describedby"]), { "aria-describedby": cl(inputProps["aria-describedby"], {
[descriptionId]: props.description,
}) || undefined, className: "aksel-radio__input", ref: ref })),
React.createElement(BodyShort, { as: "label", htmlFor: inputProps.id, className: "aksel-radio__label", size: size }, props.children),
props.description && (React.createElement(BodyShort, { id: descriptionId, size: size, className: "aksel-form-field__subdescription aksel-radio__description" }, props.description))));
});
export default Radio;
//# sourceMappingURL=Radio.js.map