- <Example {...pageData} {...props} {...{"code":"/* eslint-disable no-console */\nimport React from 'react';\nimport { data } from '@patternfly/react-log-viewer/patternfly-docs/content/extensions/react-log-viewer/examples/realTestData.js';\nimport { LogViewer, LogViewerSearch } from '@patternfly/react-log-viewer';\nimport { Toolbar, ToolbarContent, ToolbarItem, Button, Checkbox } from '@patternfly/react-core';\n\nexport const CustomControlLogViewer = () => {\n const [isTextWrapped, setIsTextWrapped] = React.useState(false);\n const onActionClick = () => {\n console.log('clicked test action button');\n };\n\n const onPrintClick = () => {\n console.log('clicked console print button');\n };\n\n return (\n <LogViewer\n data={data.data}\n isTextWrapped={isTextWrapped}\n toolbar={\n <Toolbar>\n <ToolbarContent>\n <ToolbarItem>\n <Button onClick={onActionClick} variant=\"control\">\n Test Action\n </Button>\n </ToolbarItem>\n <ToolbarItem>\n <LogViewerSearch placeholder=\"Search\" />\n </ToolbarItem>\n <ToolbarItem>\n <Button onClick={onPrintClick} variant=\"control\">\n Print to Console\n </Button>\n </ToolbarItem>\n <ToolbarItem alignSelf='center'>\n <Checkbox label=\"Wrap text\" aria-label=\"wrap text checkbox\" isChecked={isTextWrapped} id=\"wrap-text-checkbox\" onChange={(_event, value) => setIsTextWrapped(value)} />\n </ToolbarItem>\n </ToolbarContent>\n </Toolbar>\n }\n />\n );\n};\n","title":"With complex toolbar","lang":"js","className":""}}>
0 commit comments