@polkadot/dev/rootJs/Jsx.js

A collection of shared CI scripts and development environment used by @polkadot projects

import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import React, { useCallback, useState } from 'react';
import { styled } from 'styled-components';
import Child from './JsxChild.js';
function Hidden({ children, className }) {
    const [isMessageVisible, setMessageVisibility] = useState(false);
    const onShow = useCallback((e) => setMessageVisibility(e.target.checked), []);
    return (_jsxs(StyledDiv, { className: className, children: [_jsx("label", { htmlFor: 'toggle', children: "Show Message" }), _jsx("input", { checked: isMessageVisible, id: 'toggle', onChange: onShow, type: 'checkbox' }), isMessageVisible && (_jsxs(_Fragment, { children: [children, _jsx(Child, { label: 'hello' })] }))] }));
}
const StyledDiv = styled.div `
  background: red;
`;
export default React.memo(Hidden);