diff options
| author | AAGaming <aa@mail.catvibers.me> | 2022-09-17 23:23:51 -0400 |
|---|---|---|
| committer | AAGaming <aa@mail.catvibers.me> | 2022-09-17 23:23:51 -0400 |
| commit | c4d6731401d3b6dc111a74d086df28704473070d (patch) | |
| tree | b8a1cff3ae32eac720300fd03093f9890ddf82cb /frontend/src/components/Markdown.tsx | |
| parent | fded2fa8bfc52ae29848a343483c68f6955feb0c (diff) | |
| download | decky-loader-c4d6731401d3b6dc111a74d086df28704473070d.tar.gz decky-loader-c4d6731401d3b6dc111a74d086df28704473070d.zip | |
fix updater for new installs, fix file picker patch, fix scrolling on patch notes, fix tasks dir
Diffstat (limited to 'frontend/src/components/Markdown.tsx')
| -rw-r--r-- | frontend/src/components/Markdown.tsx | 39 |
1 files changed, 36 insertions, 3 deletions
diff --git a/frontend/src/components/Markdown.tsx b/frontend/src/components/Markdown.tsx index 7b187f14..cefced91 100644 --- a/frontend/src/components/Markdown.tsx +++ b/frontend/src/components/Markdown.tsx @@ -1,9 +1,42 @@ -import { FunctionComponent } from 'react'; +import { Focusable } from 'decky-frontend-lib'; +import { FunctionComponent, useRef } from 'react'; import ReactMarkdown, { Options as ReactMarkdownOptions } from 'react-markdown'; import remarkGfm from 'remark-gfm'; -const Markdown: FunctionComponent<ReactMarkdownOptions> = (props) => { - return <ReactMarkdown remarkPlugins={[remarkGfm]} {...props} />; +interface MarkdownProps extends ReactMarkdownOptions { + onDismiss?: () => void; +} + +const Markdown: FunctionComponent<MarkdownProps> = (props) => { + return ( + <Focusable> + <ReactMarkdown + remarkPlugins={[remarkGfm]} + components={{ + div: (nodeProps) => <Focusable {...nodeProps.node.properties}>{nodeProps.children}</Focusable>, + a: (nodeProps) => { + console.log(nodeProps.node, nodeProps); + const aRef = useRef<HTMLAnchorElement>(null); + return ( + // TODO fix focus ring + <Focusable + onActivate={() => {}} + onOKButton={() => { + aRef?.current?.click(); + props.onDismiss?.(); + }} + > + <a ref={aRef} {...nodeProps.node.properties}> + {nodeProps.children} + </a> + </Focusable> + ); + }, + }} + {...props} + /> + </Focusable> + ); }; export default Markdown; |
