1
0
Fork 0

🚧 More work on React components

This commit is contained in:
Joost De Cock 2019-04-25 16:51:15 +02:00
parent 66b42967dc
commit e2b5ba2ee7
10 changed files with 10841 additions and 73 deletions

View file

@ -6,6 +6,7 @@ import OptionPreamble from "../OptionPreamble";
const PatternOptionPctDegCount = props => {
const [value, setValue] = useState(props.dflt);
const [previousValue, setPreviousValue] = useState(props.dflt);
const [expanded, setExpanded] = useState(false);
const round = val => Math.round(val * 10) / 10;
@ -28,6 +29,8 @@ const PatternOptionPctDegCount = props => {
props.updateValue(props.name, props.dflt);
};
const toggleExpanded = () => setExpanded(!expanded);
const styles = {
container: {
display: "flex",
@ -45,7 +48,7 @@ const PatternOptionPctDegCount = props => {
if (props.type === "deg") unit = "°";
return (
<div className={"pattern-option " + props.type}>
<li>
<OptionPreamble
dflt={props.dflt}
value={value}
@ -54,6 +57,8 @@ const PatternOptionPctDegCount = props => {
id={"po-" + props.type + "-" + props.name}
displayValue={value + unit}
reset={reset}
toggleExpanded={toggleExpanded}
expanded={expanded}
showHelp={() =>
props.triggerAction("showHelp", {
type: "patternOption",
@ -61,17 +66,19 @@ const PatternOptionPctDegCount = props => {
})
}
/>
<FormFieldSlider
name={props.name}
value={value}
min={props.min}
max={props.max}
step={props.type === "count" ? 1 : props.step}
onChange={update}
label={"po-" + props.type + "-" + props.name}
updateValue={update}
/>
</div>
{!expanded ? null : (
<FormFieldSlider
name={props.name}
value={value}
min={props.min}
max={props.max}
step={props.type === "count" ? 1 : props.step}
onChange={update}
label={"po-" + props.type + "-" + props.name}
updateValue={update}
/>
)}
</li>
);
};