ink-checkbox
Version:
Checkbox component for Ink
32 lines • 1.55 kB
JavaScript
import React, { useEffect, useState } from 'react';
import { render, Box, Text, useApp } from 'ink';
import { Checkbox } from '../source/index.js';
import { preparePlayground } from '../source/utils.js';
import BigText from 'ink-big-text';
preparePlayground();
const DefaultValueExample = () => {
const [checked, setChecked] = useState(true);
const [checkedOnSubmitted, setCheckedOnSubmitted] = useState();
const { exit } = useApp();
useEffect(() => {
setTimeout(() => setChecked(false), 1000);
}, []);
useEffect(() => {
checkedOnSubmitted !== undefined && exit();
}, [checkedOnSubmitted]);
return (React.createElement(Box, { flexDirection: "column", margin: 1 },
React.createElement(BigText, { text: "Demo: State Binding", font: "tiny", colors: ['blue'] }),
React.createElement(Checkbox, { label: "Checkbox", focused: true, checked: checked, onSubmitted: props => {
setCheckedOnSubmitted(props.checked);
}, onChanged: props => setChecked(props.checked) }),
React.createElement(Box, { flexDirection: "column", marginTop: 1 },
React.createElement(Text, { color: "green" },
"Changed as: ",
String(checked)),
React.createElement(Text, { color: "green" },
"Submitted as:",
' ',
checkedOnSubmitted !== undefined && String(checkedOnSubmitted)))));
};
render(React.createElement(DefaultValueExample, null));
//# sourceMappingURL=default-value.js.map