Browse Source

Revert "docs: fix debug demo style" (#41743)

* Revert "docs: fix debug demo style (#41738)"

This reverts commit d998c2fabc.

* chore: update
pull/41745/head
Wuxh 2 years ago
committed by GitHub
parent
commit
3ad2a34611
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 7
      .dumi/theme/builtins/DemoWrapper/index.tsx
  2. 10
      .dumi/theme/builtins/Previewer/CodePreviewer.tsx
  3. 4
      .dumi/theme/builtins/Previewer/DesignPreviewer.tsx
  4. 6
      .dumi/theme/builtins/Previewer/index.tsx

7
.dumi/theme/builtins/DemoWrapper/index.tsx

@ -35,6 +35,13 @@ const DemoWrapper: typeof DumiDemoGrid = ({ items }) => {
previewerProps: {
...previewerProps,
expand: expandAll,
// always override debug property, because dumi will hide debug demo in production
debug: false,
/**
* antd extra marker for the original debug
* @see https://github.com/ant-design/ant-design/pull/40130#issuecomment-1380208762
*/
originDebug: debug,
},
});
}, [] as typeof items),

10
.dumi/theme/builtins/Previewer/CodePreviewer.tsx

@ -8,7 +8,6 @@ import type { Project } from '@stackblitz/sdk';
import stackblitzSdk from '@stackblitz/sdk';
import { Alert, Badge, Space, Tooltip } from 'antd';
import classNames from 'classnames';
import type { IPreviewerProps } from 'dumi';
import { FormattedMessage, useSiteData } from 'dumi';
import toReactElement from 'jsonml-to-react-element';
import JsonML from 'jsonml.js/lib/utils';
@ -28,6 +27,7 @@ import RiddleIcon from '../../common/RiddleIcon';
import type { SiteContextProps } from '../../slots/SiteContext';
import SiteContext from '../../slots/SiteContext';
import { ping } from '../../utils';
import type { AntdPreviewerProps } from '.';
const { ErrorBoundary } = Alert;
@ -88,7 +88,7 @@ function useShowRiddleButton() {
return showRiddleButton;
}
const CodePreviewer: React.FC<IPreviewerProps> = (props) => {
const CodePreviewer: React.FC<AntdPreviewerProps> = (props) => {
const {
asset,
expand,
@ -97,7 +97,7 @@ const CodePreviewer: React.FC<IPreviewerProps> = (props) => {
children,
title,
description,
debug,
originDebug,
jsx,
style,
compact,
@ -189,7 +189,7 @@ const CodePreviewer: React.FC<IPreviewerProps> = (props) => {
const codeBoxClass = classNames('code-box', {
expand: codeExpand,
'code-box-debug': debug,
'code-box-debug': originDebug,
});
const localizedTitle = title;
@ -394,7 +394,7 @@ createRoot(document.getElementById('container')).render(<Demo />);
</section>
<section className="code-box-meta markdown">
<div className="code-box-title">
<Tooltip title={debug ? <FormattedMessage id="app.demo.debug" /> : ''}>
<Tooltip title={originDebug ? <FormattedMessage id="app.demo.debug" /> : ''}>
<a href={`#${asset.id}`} ref={anchorRef}>
{localizedTitle}
</a>

4
.dumi/theme/builtins/Previewer/DesignPreviewer.tsx

@ -1,11 +1,11 @@
import type { FC } from 'react';
import React, { useRef } from 'react';
import type { IPreviewerProps } from 'dumi';
import { createStyles, css } from 'antd-style';
import { CheckOutlined, SketchOutlined } from '@ant-design/icons';
import { nodeToGroup } from 'html2sketch';
import copy from 'copy-to-clipboard';
import { App } from 'antd';
import type { AntdPreviewerProps } from '.';
const useStyle = createStyles(({ token }) => ({
wrapper: css`
@ -52,7 +52,7 @@ const useStyle = createStyles(({ token }) => ({
`,
}));
const DesignPreviewer: FC<IPreviewerProps> = ({ children, title, description, tip, asset }) => {
const DesignPreviewer: FC<AntdPreviewerProps> = ({ children, title, description, tip, asset }) => {
const { styles } = useStyle();
const demoRef = useRef<HTMLDivElement>(null);
const [copied, setCopied] = React.useState<boolean>(false);

6
.dumi/theme/builtins/Previewer/index.tsx

@ -5,7 +5,11 @@ import { useTabMeta } from 'dumi';
import CodePreviewer from './CodePreviewer';
import DesignPreviewer from './DesignPreviewer';
const Previewer: FC<IPreviewerProps> = ({ ...props }) => {
export interface AntdPreviewerProps extends IPreviewerProps {
originDebug?: IPreviewerProps['debug'];
}
const Previewer: FC<AntdPreviewerProps> = ({ ...props }) => {
const tab = useTabMeta();
if (tab?.frontmatter.title === 'Design') {

Loading…
Cancel
Save