@hypothesis/frontend-shared
Version:
Shared components, styles and utilities for Hypothesis projects
55 lines • 1.72 kB
JavaScript
var _jsxFileName = "/home/runner/work/frontend-shared/frontend-shared/src/pattern-library/examples/radio-button-custom-icons.tsx";
import { useCallback, useState } from 'preact/hooks';
import { HideIcon, RadioButton, ShowIcon } from '../..';
import { jsxDEV as _jsxDEV } from "preact/jsx-dev-runtime";
export default function App() {
const [value, setSelected] = useState('first');
const onChange = useCallback(e => {
setSelected(e.target.value);
}, []);
return _jsxDEV("form", {
className: "w-64 m-auto flex flex-col",
children: [_jsxDEV(RadioButton, {
name: "option",
icon: HideIcon,
checkedIcon: ShowIcon,
value: "first",
checked: value === 'first',
onChange: onChange,
children: ["First ", value === 'first' && _jsxDEV("i", {
children: "(checked)"
}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 21,
columnNumber: 37
}, this)]
}, void 0, true, {
fileName: _jsxFileName,
lineNumber: 13,
columnNumber: 7
}, this), _jsxDEV(RadioButton, {
name: "option",
icon: HideIcon,
checkedIcon: ShowIcon,
value: "second",
checked: value === 'second',
onChange: onChange,
children: ["Second ", value === 'second' && _jsxDEV("i", {
children: "(checked)"
}, void 0, false, {
fileName: _jsxFileName,
lineNumber: 31,
columnNumber: 39
}, this)]
}, void 0, true, {
fileName: _jsxFileName,
lineNumber: 23,
columnNumber: 7
}, this)]
}, void 0, true, {
fileName: _jsxFileName,
lineNumber: 12,
columnNumber: 5
}, this);
}
//# sourceMappingURL=radio-button-custom-icons.js.map