mirror of
				https://gitlab.nic.cz/turris/reforis/foris-js.git
				synced 2025-11-03 23:00:31 +01:00 
			
		
		
		
	docs: Refactor RadioSet & ignore Radio component
This commit is contained in:
		
							
								
								
									
										48
									
								
								src/bootstrap/Radio.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										48
									
								
								src/bootstrap/Radio.js
									
									
									
									
									
										Normal file
									
								
							@@ -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;
 | 
			
		||||
@@ -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;
 | 
			
		||||
 
 | 
			
		||||
@@ -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";
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user