Set modules.

src/bootstrap/RadioSet.js

@@ -0,0 +1,80 @@
+/*
+ * Copyright (C) 2019 CZ.NIC z.s.p.o. (http://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';
+import {useUID} from 'react-uid';
+
+import {formFieldsSize} from './constants';
+
+
+RadioSet.propTypes = {
+    /** Name attribute of the input HTML tag.*/
+    name: PropTypes.string.isRequired,
+    /** RadioSet label .*/
+    label: PropTypes.string,
+    /** Choices .*/
+    choices: PropTypes.arrayOf(PropTypes.shape({
+        /** Choice lable .*/
+        label: PropTypes.string.isRequired,
+        /** Choice value .*/
+        value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+    })).isRequired,
+    /** Initial value .*/
+    value: PropTypes.string,
+    /** Help text message .*/
+    helpText: PropTypes.string,
+};
+
+export function RadioSet({name, label, choices, value, helpText, ...props}) {
+    const uid = useUID();
+    const radios = choices.map((choice, key) =>
+        <Radio
+            id={`${name}-${key}`}
+            key={key}
+            name={name}
+            label={choice.label}
+            value={choice.value}
+            helpText={choice.helpText}
+            checked={choice.value === value}
+
+            {...props}
+        />
+    );
+
+    return <div className={`form-group ${formFieldsSize}`} style={{marginBottom: '1rem'}}>
+        {label ?
+            <label className='col-12' htmlFor={uid} style={{paddingLeft: '0'}}>
+                {label}
+            </label>
+            : null}
+        {radios}
+        {helpText ? <small className="form-text text-muted">{helpText}</small> : null}
+    </div>;
+}
+
+Radio.propTypes = {
+    label: PropTypes.string.isRequired,
+    id: PropTypes.string.isRequired,
+    helpText: PropTypes.string
+};
+
+function Radio({label, id, helpText, ...props}) {
+    return <>
+        <div className='custom-control custom-radio custom-control-inline'>
+            <input
+                id={id}
+                className='custom-control-input'
+                type='radio'
+
+                {...props}
+            />
+            <label className='custom-control-label' htmlFor={id}>{label}</label>
+        </div>
+        {helpText ? <small className="form-text text-muted">{helpText}</small> : null}
+    </>
+}