docs: Refactor RadioSet & ignore Radio component

src/bootstrap/Radio.js

@@ -0,0 +1,48 @@
+/*
+ * Copyright (C) 2024 CZ.NIC z.s.p.o. (https://www.nic.cz/)
+ *
+ * This is free software, licensed under the GNU General Public License v3.
+ * See /LICENSE for more information.
+ */
+
+import React from "react";
+
+import PropTypes from "prop-types";
+
+Radio.propTypes = {
+    label: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.element,
+        PropTypes.node,
+        PropTypes.arrayOf(PropTypes.node),
+    ]).isRequired,
+    id: PropTypes.string.isRequired,
+    inline: PropTypes.bool,
+    helpText: PropTypes.string,
+    className: PropTypes.string,
+};
+
+function Radio({ label, id, helpText, inline, className, ...props }) {
+    return (
+        <div
+            className={`${className || "mb-3"} ${inline ? "form-check form-check-inline" : ""}`.trim()}
+        >
+            <input
+                id={id}
+                className="form-check-input me-2"
+                type="radio"
+                {...props}
+            />
+            <label className="form-check-label" htmlFor={id}>
+                {label}
+                {helpText && (
+                    <div className="form-text">
+                        <small>{helpText}</small>
+                    </div>
+                )}
+            </label>
+        </div>
+    );
+}
+
+export default Radio;

src/bootstrap/RadioSet.js

@@ -10,6 +10,8 @@ import React from "react";
 import PropTypes from "prop-types";
 import { useUID } from "react-uid";
 
+import Radio from "./Radio";
+
 RadioSet.propTypes = {
     /** Name attribute of the input HTML tag. */
     name: PropTypes.string.isRequired,
@@ -73,40 +75,4 @@ function RadioSet({ name, label, choices, value, helpText, inline, ...props }) {
     );
 }
 
-Radio.propTypes = {
-    label: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.element,
-        PropTypes.node,
-        PropTypes.arrayOf(PropTypes.node),
-    ]).isRequired,
-    id: PropTypes.string.isRequired,
-    inline: PropTypes.bool,
-    helpText: PropTypes.string,
-    className: PropTypes.string,
-};
-
-export function Radio({ label, id, helpText, inline, className, ...props }) {
-    return (
-        <div
-            className={`${className || "mb-3"} ${inline ? "form-check form-check-inline" : ""}`.trim()}
-        >
-            <input
-                id={id}
-                className="form-check-input me-2"
-                type="radio"
-                {...props}
-            />
-            <label className="form-check-label" htmlFor={id}>
-                {label}
-                {helpText && (
-                    <div className="form-text">
-                        <small>{helpText}</small>
-                    </div>
-                )}
-            </label>
-        </div>
-    );
-}
-
 export default RadioSet;

src/index.js

@@ -28,7 +28,8 @@ export { default as FileInput } from "./bootstrap/FileInput";
 export { default as Input } from "./bootstrap/Input";
 export { default as NumberInput } from "./bootstrap/NumberInput";
 export { default as PasswordInput } from "./bootstrap/PasswordInput";
-export { default as RadioSet, Radio } from "./bootstrap/RadioSet";
+export { default as Radio } from "./bootstrap/Radio";
+export { default as RadioSet } from "./bootstrap/RadioSet";
 export { default as Select } from "./bootstrap/Select";
 export { default as TextInput } from "./bootstrap/TextInput";
 export { formFieldsSize, buttonFormFieldsSize } from "./bootstrap/constants";

styleguide.config.js

@@ -65,7 +65,7 @@ module.exports = {
             components: "src/bootstrap/*.js",
             exampleMode: "expand",
             usageMode: "expand",
-            ignore: ["src/bootstrap/constants.js"],
+            ignore: ["src/bootstrap/constants.js", "src/bootstrap/Radio.js"],
             sectionDepth: 0,
         },
     ],