1
0
mirror of https://gitlab.nic.cz/turris/reforis/foris-js.git synced 2024-12-26 00:21:36 +01:00

Add "inline" option to RadioSet

This commit is contained in:
Aleksandr Gumroian 2020-08-31 11:55:20 +02:00
parent 443f14d26c
commit 1903016f13
No known key found for this signature in database
GPG Key ID: 9E77849C64F0A733
2 changed files with 16 additions and 5 deletions

View File

@ -1,5 +1,5 @@
/* /*
* Copyright (C) 2019 CZ.NIC z.s.p.o. (http://www.nic.cz/) * Copyright (C) 2020 CZ.NIC z.s.p.o. (http://www.nic.cz/)
* *
* This is free software, licensed under the GNU General Public License v3. * This is free software, licensed under the GNU General Public License v3.
* See /LICENSE for more information. * See /LICENSE for more information.
@ -33,9 +33,18 @@ RadioSet.propTypes = {
value: PropTypes.string, value: PropTypes.string,
/** Help text message . */ /** Help text message . */
helpText: PropTypes.string, helpText: PropTypes.string,
inline: PropTypes.bool,
}; };
export function RadioSet({ name, label, choices, value, helpText, ...props }) { export function RadioSet({
name,
label,
choices,
value,
helpText,
inline,
...props
}) {
const uid = useUID(); const uid = useUID();
const radios = choices.map((choice, key) => { const radios = choices.map((choice, key) => {
const id = `${name}-${key}`; const id = `${name}-${key}`;
@ -48,6 +57,7 @@ export function RadioSet({ name, label, choices, value, helpText, ...props }) {
value={choice.value} value={choice.value}
helpText={choice.helpText} helpText={choice.helpText}
checked={choice.value === value} checked={choice.value === value}
inline={inline}
{...props} {...props}
/> />
); );
@ -76,15 +86,16 @@ Radio.propTypes = {
PropTypes.arrayOf(PropTypes.node), PropTypes.arrayOf(PropTypes.node),
]).isRequired, ]).isRequired,
id: PropTypes.string.isRequired, id: PropTypes.string.isRequired,
inline: PropTypes.bool,
helpText: PropTypes.string, helpText: PropTypes.string,
}; };
export function Radio({ label, id, helpText, ...props }) { export function Radio({ label, id, helpText, inline, ...props }) {
return ( return (
<> <>
<div <div
className={`custom-control custom-radio ${ className={`custom-control custom-radio ${
!helpText ? "custom-control-inline" : "" inline ? "custom-control-inline" : ""
}`.trim()} }`.trim()}
> >
<input <input

View File

@ -23,7 +23,7 @@ Switch.propTypes = {
export function Switch({ label, helpText, switchHeading, ...props }) { export function Switch({ label, helpText, switchHeading, ...props }) {
const uid = useUID(); const uid = useUID();
return ( return (
<div className="form-group custom-switch"> <div className="form-group switch">
<div <div
className={`custom-control custom-switch ${ className={`custom-control custom-switch ${
!helpText ? "custom-control-inline" : "" !helpText ? "custom-control-inline" : ""