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

Merge branch 'dev' into 'master'

Release 1.1.1

See merge request turris/reforis/foris-js!26
This commit is contained in:
Maciej Lenartowicz 2019-10-24 11:24:57 +00:00
commit a137a0d4cf
8 changed files with 30 additions and 41 deletions

View File

@ -35,6 +35,8 @@ lint:
test: test:
npm test npm test
test-js-update-snapshots:
npm test -- -u
create-messages: create-messages:
pybabel extract -F babel.cfg -o ./translations/forisjs.pot . pybabel extract -F babel.cfg -o ./translations/forisjs.pot .

2
package-lock.json generated
View File

@ -1,6 +1,6 @@
{ {
"name": "foris", "name": "foris",
"version": "1.1.0", "version": "1.1.1",
"lockfileVersion": 1, "lockfileVersion": 1,
"requires": true, "requires": true,
"dependencies": { "dependencies": {

View File

@ -1,6 +1,6 @@
{ {
"name": "foris", "name": "foris",
"version": "1.1.0", "version": "1.1.1",
"description": "Set of components and utils for Foris and its plugins.", "description": "Set of components and utils for Foris and its plugins.",
"author": "CZ.NIC, z.s.p.o.", "author": "CZ.NIC, z.s.p.o.",
"repository": { "repository": {
@ -73,7 +73,6 @@
"test": "jest", "test": "jest",
"test:watch": "jest --watch", "test:watch": "jest --watch",
"test:coverage": "jest --coverage --colors", "test:coverage": "jest --coverage --colors",
"test:update-snapshots": "jest -u",
"docs": "npx styleguidist build ", "docs": "npx styleguidist build ",
"docs:watch": "styleguidist server" "docs:watch": "styleguidist server"
}, },

View File

@ -32,8 +32,8 @@ export function CheckBox({
}) { }) {
const uid = useUID(); const uid = useUID();
return ( return (
<div className={useDefaultSize ? formFieldsSize : ""} style={{ marginBottom: "1rem" }}> <div className={`form-group ${useDefaultSize ? formFieldsSize : ""}`.trim()}>
<div className="custom-control custom-checkbox" style={{ marginBottom: "0" }}> <div className="custom-control custom-checkbox ">
<input <input
className="custom-control-input" className="custom-control-input"
type="checkbox" type="checkbox"
@ -42,9 +42,9 @@ export function CheckBox({
{...props} {...props}
/> />
<label className="custom-control-label" htmlFor={uid} style={helpText ? { marginBottom: "0" } : null}>{label}</label> <label className="custom-control-label" htmlFor={uid}>{label}</label>
{helpText && <small className="form-text text-muted">{helpText}</small>}
</div> </div>
{helpText ? <small className="form-text text-muted">{helpText}</small> : null}
</div> </div>
); );
} }

View File

@ -52,16 +52,10 @@ export function RadioSet({
}); });
return ( return (
<div className={`form-group ${formFieldsSize}`} style={{ marginBottom: "1rem" }}> <div className={`form-group ${formFieldsSize}`}>
{label {label && <label htmlFor={uid} className="d-block">{label}</label>}
? (
<label className="col-12" htmlFor={uid} style={{ paddingLeft: "0" }}>
{label}
</label>
)
: null}
{radios} {radios}
{helpText ? <small className="form-text text-muted">{helpText}</small> : null} {helpText && <small className="form-text text-muted">{helpText}</small>}
</div> </div>
); );
} }
@ -77,7 +71,7 @@ function Radio({
}) { }) {
return ( return (
<> <>
<div className="custom-control custom-radio custom-control-inline"> <div className={`custom-control custom-radio ${!helpText ? "custom-control-inline" : ""}`.trim()}>
<input <input
id={id} id={id}
className="custom-control-input" className="custom-control-input"
@ -86,8 +80,8 @@ function Radio({
{...props} {...props}
/> />
<label className="custom-control-label" htmlFor={id}>{label}</label> <label className="custom-control-label" htmlFor={id}>{label}</label>
{helpText && <small className="form-text text-muted mt-0 mb-3">{helpText}</small>}
</div> </div>
{helpText ? <small className="form-text text-muted">{helpText}</small> : null}
</> </>
); );
} }

View File

@ -2,6 +2,8 @@ Set of radio Bootstrap component input with label and predefined sizes and struc
All additional `props` are passed to the `<input type="number">` HTML component. All additional `props` are passed to the `<input type="number">` HTML component.
Unless `helpText` is set for one of the options they are displayed inline.
```js ```js
import {useState} from 'react'; import {useState} from 'react';
const CHOICES=[ const CHOICES=[

View File

@ -2,12 +2,10 @@
exports[`<Checkbox/> Render checkbox 1`] = ` exports[`<Checkbox/> Render checkbox 1`] = `
<div <div
class="col-sm-12 offset-lg-1 col-lg-10" class="form-group col-sm-12 offset-lg-1 col-lg-10"
style="margin-bottom: 1rem;"
> >
<div <div
class="custom-control custom-checkbox" class="custom-control custom-checkbox "
style="margin-bottom: 0px;"
> >
<input <input
checked="" checked=""
@ -18,27 +16,24 @@ exports[`<Checkbox/> Render checkbox 1`] = `
<label <label
class="custom-control-label" class="custom-control-label"
for="1" for="1"
style="margin-bottom: 0px;"
> >
Test label Test label
</label> </label>
<small
class="form-text text-muted"
>
Some help text
</small>
</div> </div>
<small
class="form-text text-muted"
>
Some help text
</small>
</div> </div>
`; `;
exports[`<Checkbox/> Render uncheked checkbox 1`] = ` exports[`<Checkbox/> Render uncheked checkbox 1`] = `
<div <div
class="col-sm-12 offset-lg-1 col-lg-10" class="form-group col-sm-12 offset-lg-1 col-lg-10"
style="margin-bottom: 1rem;"
> >
<div <div
class="custom-control custom-checkbox" class="custom-control custom-checkbox "
style="margin-bottom: 0px;"
> >
<input <input
class="custom-control-input" class="custom-control-input"
@ -48,15 +43,14 @@ exports[`<Checkbox/> Render uncheked checkbox 1`] = `
<label <label
class="custom-control-label" class="custom-control-label"
for="1" for="1"
style="margin-bottom: 0px;"
> >
Test label Test label
</label> </label>
<small
class="form-text text-muted"
>
Some help text
</small>
</div> </div>
<small
class="form-text text-muted"
>
Some help text
</small>
</div> </div>
`; `;

View File

@ -3,12 +3,10 @@
exports[`<RadioSet/> Render radio set 1`] = ` exports[`<RadioSet/> Render radio set 1`] = `
<div <div
class="form-group col-sm-12 offset-lg-1 col-lg-10" class="form-group col-sm-12 offset-lg-1 col-lg-10"
style="margin-bottom: 1rem;"
> >
<label <label
class="col-12" class="d-block"
for="1" for="1"
style="padding-left: 0px;"
> >
Radios set label Radios set label
</label> </label>