docs: fix ssr warning (#41776)

* docs: fix ssr warning when click anchor

* docs: fix demoWrapper SSR

* chore: try

* Revert "chore: try"

This reverts commit a6e0fe0906.
This commit is contained in:
MadCcc 2023-04-13 18:13:13 +08:00 committed by GitHub
parent dedbdfddaf
commit d43c15f2f4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 37 additions and 4 deletions

View File

@ -1,8 +1,9 @@
import type { ReactNode } from 'react';
import React, { useMemo } from 'react';
import type { MenuProps } from 'antd';
import { Link, useFullSidebarData, useSidebarData } from 'dumi';
import { useFullSidebarData, useSidebarData } from 'dumi';
import useLocation from './useLocation';
import Link from '../theme/common/Link';
export type UseMenuOptions = {
before?: ReactNode;

View File

@ -1,14 +1,15 @@
import React, { useContext, useState } from 'react';
import React, { useContext } from 'react';
import { DumiDemoGrid, FormattedMessage } from 'dumi';
import { Tooltip } from 'antd';
import { BugFilled, BugOutlined, CodeFilled, CodeOutlined } from '@ant-design/icons';
import classNames from 'classnames';
import DemoContext from '../../slots/DemoContext';
import useLayoutState from '../../../hooks/useLayoutState';
const DemoWrapper: typeof DumiDemoGrid = ({ items }) => {
const { showDebug, setShowDebug } = useContext(DemoContext);
const [expandAll, setExpandAll] = useState(false);
const [expandAll, setExpandAll] = useLayoutState(false);
const expandTriggerClass = classNames('code-box-expand-trigger', {
'code-box-expand-trigger-active': expandAll,

View File

@ -0,0 +1,30 @@
import type { MouseEvent } from 'react';
import React, { forwardRef, startTransition } from 'react';
import { useNavigate } from 'dumi';
export type LinkProps = {
to?: string;
children?: React.ReactNode;
};
const Link = forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {
const { to, children } = props;
const navigate = useNavigate();
const handleClick = (e: MouseEvent<HTMLAnchorElement>) => {
if (!to.startsWith('http')) {
e.preventDefault();
startTransition(() => {
navigate(to);
});
}
};
return (
<a ref={ref} href={to} onClick={handleClick}>
{children}
</a>
);
});
export default Link;

View File

@ -15,6 +15,7 @@ import type { DemoContextProps } from '../DemoContext';
import DemoContext from '../DemoContext';
import Footer from '../Footer';
import SiteContext from '../SiteContext';
import useLayoutState from '../../../hooks/useLayoutState';
const useStyle = () => {
const { token } = useSiteToken();
@ -141,7 +142,7 @@ const Content: React.FC<{ children: ReactNode }> = ({ children }) => {
const { token } = useSiteToken();
const { direction } = useContext(SiteContext);
const [showDebug, setShowDebug] = useState(false);
const [showDebug, setShowDebug] = useLayoutState(false);
const debugDemos = useMemo(
() => meta.toc?.filter((item) => item._debug_demo).map((item) => item.id) || [],
[meta],