Browse Source

chore: eslint fix

SyMind 2 years ago
parent
commit
9b82b7e001
30 changed files with 132 additions and 136 deletions
  1. 6 7
      packages/semi-foundation/carousel/foundation.ts
  2. 3 3
      packages/semi-foundation/dropdown/menuFoundation.ts
  3. 1 1
      packages/semi-foundation/image/previewFoundation.ts
  4. 3 3
      packages/semi-foundation/modal/modalContentFoundation.ts
  5. 2 2
      packages/semi-foundation/sideSheet/sideSheetFoundation.ts
  6. 2 2
      packages/semi-foundation/tabs/foundation.ts
  7. 6 6
      packages/semi-foundation/utils/a11y.ts
  8. 1 1
      packages/semi-icons/webpack.config.js
  9. 1 1
      packages/semi-illustrations/webpack.config.js
  10. 1 1
      packages/semi-ui/carousel/interface.ts
  11. 1 1
      packages/semi-ui/datePicker/quickControl.tsx
  12. 2 5
      packages/semi-ui/form/_story/DynamicField/nestArrayField.jsx
  13. 1 1
      packages/semi-ui/layout/Sider.tsx
  14. 1 1
      packages/semi-ui/slider/_story/Demo.tsx
  15. 1 1
      packages/semi-ui/typography/numeral.tsx
  16. 1 1
      src/components/ComponentOverview/index.jsx
  17. 2 2
      src/components/DesignPageAnchor/index.jsx
  18. 11 11
      src/components/DesignToken/index.tsx
  19. 2 2
      src/components/IconList/IconCategory.jsx
  20. 3 3
      src/components/example.js
  21. 1 1
      src/components/header.js
  22. 2 2
      src/pages/en-US/index.js
  23. 2 2
      src/pages/zh-CN/index.js
  24. 1 1
      src/sitePages/newHome/components/theme/components/topBar/index.jsx
  25. 1 1
      src/sitePages/newHome/components/theme/cutsomCssVariable.js
  26. 24 24
      src/sitePages/newHome/utils/compileScss.js
  27. 15 15
      src/sitePages/newHome/utils/componentsScssContent.js
  28. 6 6
      src/sitePages/newHome/utils/loadSassCompiler.js
  29. 5 5
      src/sitePages/newHome/utils/themeDefaultScssContent.js
  30. 24 24
      src/templates/toUEDUtils/toUED.ts

+ 6 - 7
packages/semi-foundation/carousel/foundation.ts

@@ -1,7 +1,6 @@
 import { isObject, get } from 'lodash';
 import BaseFoundation, { DefaultAdapter } from '../base/foundation';
 import { numbers } from './constants';
-import { throttle } from 'lodash';
 
 export interface CarouselAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     notifyChange: (activeIndex: number, preIndex: number) => void;
@@ -34,7 +33,7 @@ class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> exten
     }
 
     stop(): void {
-        if (this._interval){
+        if (this._interval) {
             clearInterval(this._interval);
         }
     }
@@ -93,7 +92,7 @@ class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> exten
 
     _notifyChange(activeIndex: number): void {
         const { activeIndex: stateActiveIndex, isInit } = this.getStates();
-        if (isInit){
+        if (isInit) {
             this._adapter.setIsInit(false);
         }
         if (stateActiveIndex !== activeIndex) {
@@ -110,10 +109,10 @@ class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> exten
     getSwitchingTime(): number {
         const { autoPlay, speed } = this.getProps(); 
         const autoPlayType = typeof autoPlay;
-        if (autoPlayType === 'boolean'){ 
+        if (autoPlayType === 'boolean') { 
             return numbers.DEFAULT_INTERVAL + speed;
         }
-        if (isObject(autoPlay)){
+        if (isObject(autoPlay)) {
             return get(autoPlay, 'interval', numbers.DEFAULT_INTERVAL) + speed;
         }
         return speed;
@@ -127,12 +126,12 @@ class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> exten
         const { autoPlay } = this.getProps(); 
         const autoPlayType = typeof autoPlay;
         // when user manually call the play function, force play
-        if ((autoPlayType === 'boolean' && autoPlay) || isObject(autoPlay) || this._forcePlay){
+        if ((autoPlayType === 'boolean' && autoPlay) || isObject(autoPlay) || this._forcePlay) {
             this.play(this.getSwitchingTime());
         }
     }
 
-    handleKeyDown(event: any): void{
+    handleKeyDown(event: any): void {
         if (event.key === 'ArrowLeft') {
             this.prev();
         }

+ 3 - 3
packages/semi-foundation/dropdown/menuFoundation.ts

@@ -8,7 +8,7 @@ export default class DropdownMenuFoundation extends BaseFoundation<Partial<Defau
 
     handleEscape(menu: Element): void {
         const trigger = this._adapter.getContext('trigger');
-        if (trigger === 'custom'){
+        if (trigger === 'custom') {
             const menuButton = menu && getMenuButton(document.querySelectorAll(`[data-popupid]`), menu.id); 
             menuButton.focus();
         }
@@ -25,11 +25,11 @@ export default class DropdownMenuFoundation extends BaseFoundation<Partial<Defau
     onMenuKeydown(event: any): void {
         const menu = getAncestorNodeByRole(event.target, 'tooltip');
         
-        if (!this.menuItemNodes){
+        if (!this.menuItemNodes) {
             this.menuItemNodes = [...(event.target.parentNode).getElementsByTagName('li')].filter(item => item.ariaDisabled !== "true");
         }
 
-        if (this.firstChars.length === 0){
+        if (this.firstChars.length === 0) {
             this.menuItemNodes.forEach((item: Element) => {
                 // the menuItemNodes can be an component and not exit textContent
                 this.firstChars.push(item.textContent.trim()[0]?.toLowerCase());

+ 1 - 1
packages/semi-foundation/image/previewFoundation.ts

@@ -2,7 +2,7 @@ import BaseFoundation, { DefaultAdapter } from "../base/foundation";
 
 export default class PreviewFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<Partial<DefaultAdapter>> {
     
-    handleVisibleChange = (newVisible : boolean) => {
+    handleVisibleChange = (newVisible: boolean) => {
         const { visible, onVisibleChange } = this.getProps();
         if (!(visible in this.getProps())) {
             this.setState({

+ 3 - 3
packages/semi-foundation/modal/modalContentFoundation.ts

@@ -8,9 +8,9 @@ export interface ModalContentProps extends ModalProps {
     isFullScreen?: boolean;
     contentClassName?: string;
     maskClassName?: string;
-    onAnimationEnd?: (e:any) => void;
-    maskExtraProps?:Record<string, any>;
-    contentExtraProps?:Record<string, any>
+    onAnimationEnd?: (e: any) => void;
+    maskExtraProps?: Record<string, any>;
+    contentExtraProps?: Record<string, any>
 }
 
 export interface ModalContentState {

+ 2 - 2
packages/semi-foundation/sideSheet/sideSheetFoundation.ts

@@ -1,5 +1,5 @@
 import BaseFoundation, { DefaultAdapter } from '../base/foundation';
-import { get, noop } from 'lodash';
+import { noop } from 'lodash';
 import KeyCode from '../utils/keyCode';
 
 
@@ -95,7 +95,7 @@ export default class SideSheetFoundation extends BaseFoundation<SideSheetAdapter
     }
 
 
-    toggleDisplayNone = (displayNone:boolean)=>{
+    toggleDisplayNone = (displayNone: boolean)=>{
         this._adapter.toggleDisplayNone(displayNone);
     }
 

+ 2 - 2
packages/semi-foundation/tabs/foundation.ts

@@ -128,14 +128,14 @@ class TabsFoundation<P = Record<string, any>, S = Record<string, any>> extends B
         }
     }
 
-    handleDeleteKeyDown(event:any, tabs: HTMLElement[], itemKey: string, closable: boolean): void {
+    handleDeleteKeyDown(event: any, tabs: HTMLElement[], itemKey: string, closable: boolean): void {
         const { preventScroll } = this.getProps();
         if (closable) {
             this.handleTabDelete(itemKey);
             const index = tabs.indexOf(event.target);
             // Move focus to next element after deletion
             // If the element is the last removable tab, focus to its previous tab
-            if (tabs.length !== 1 ){
+            if (tabs.length !== 1 ) {
                 tabs[index + 1 >= tabs.length ? index - 1 : index + 1].focus({ preventScroll });
             }
         }

+ 6 - 6
packages/semi-foundation/utils/a11y.ts

@@ -35,7 +35,7 @@ export function setFocusToLastItem(itemNodes: HTMLElement[]): void {
 export function setFocusToPreviousMenuItem (itemNodes: HTMLElement[], currentItem: HTMLElement): void {
     let newMenuItem: HTMLElement, index: number;
 
-    if (itemNodes.length > 0){
+    if (itemNodes.length > 0) {
         if (currentItem === itemNodes[0]) {
             newMenuItem = itemNodes[itemNodes.length-1];
         } else {
@@ -50,7 +50,7 @@ export function setFocusToPreviousMenuItem (itemNodes: HTMLElement[], currentIte
 export function setFocusToNextMenuitem (itemNodes: HTMLElement[], currentItem: HTMLElement): void {
     let newMenuItem: HTMLElement, index: number;
 
-    if (itemNodes.length > 0){
+    if (itemNodes.length > 0) {
         if (currentItem === itemNodes[itemNodes.length-1]) {
             newMenuItem = itemNodes[0];
         } else {
@@ -91,17 +91,17 @@ export function getAncestorNodeByRole(curElement: Element, role: string): Elemen
     if (!curElement) {
         return null;
     }
-    while (curElement.parentElement && get(curElement.parentElement, 'attributes.role.value', '') !== role){
+    while (curElement.parentElement && get(curElement.parentElement, 'attributes.role.value', '') !== role) {
         curElement = curElement.parentElement;
     }
     return curElement.parentElement;
 }
 
 // According to the Id, find the corresponding data-popupid element
-export function getMenuButton(focusableEle: NodeListOf<HTMLElement>, Id: string): HTMLElement{
-    for (let i = 0; i < focusableEle.length; i++){
+export function getMenuButton(focusableEle: NodeListOf<HTMLElement>, Id: string): HTMLElement {
+    for (let i = 0; i < focusableEle.length; i++) {
         const curAriDescribedby = focusableEle[i].attributes['data-popupid'];
-        if (curAriDescribedby && curAriDescribedby.value === Id){
+        if (curAriDescribedby && curAriDescribedby.value === Id) {
             return focusableEle[i];
         }
     }

+ 1 - 1
packages/semi-icons/webpack.config.js

@@ -4,7 +4,7 @@ const TerserPlugin = require('terser-webpack-plugin');
 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 
-module.exports = function getWebpackConfig({ minimize }){
+module.exports = function getWebpackConfig({ minimize }) {
     return {
         mode: 'production',
         bail: true,

+ 1 - 1
packages/semi-illustrations/webpack.config.js

@@ -3,7 +3,7 @@ const webpack = require('webpack');
 const TerserPlugin = require('terser-webpack-plugin');
 const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 
-module.exports = function getWebpackConfig({ minimize }){
+module.exports = function getWebpackConfig({ minimize }) {
     return {
         mode: 'production',
         bail: true,

+ 1 - 1
packages/semi-ui/carousel/interface.ts

@@ -37,7 +37,7 @@ export interface CarouselIndicatorProps {
     defaultActiveIndex?: number;
     position?: typeof strings.POSITION_MAP[number];
     size?: typeof strings.SIZE[number];
-    total?:number;
+    total?: number;
     theme?: typeof strings.THEME_MAP[number];
     type?: typeof strings.TYPE_MAP[number];
     onIndicatorChange?: (activeIndex: number) => void;

+ 1 - 1
packages/semi-ui/datePicker/quickControl.tsx

@@ -17,7 +17,7 @@ export interface QuickControlProps {
     presetPosition: typeof strings.PRESET_POSITION_SET[number];
     onPresetClick: (preset: PresetType, e: React.MouseEvent) => void;
     type: string;
-    insetInput: DateInputFoundationProps['insetInput']
+    insetInput: DateInputFoundationProps['insetInput'];
     locale: any
 }
 

+ 2 - 5
packages/semi-ui/form/_story/DynamicField/nestArrayField.jsx

@@ -10,9 +10,6 @@ import { Button, Modal, TreeSelect, Row, Col, Avatar, Select as BasicSelect,
     withFormApi,
     withField,
     ArrayField,
-    AutoComplete,
-    Collapse,
-    Icon,
 } from '../../../index';
 import { format } from 'date-fns';
 import { ComponentUsingFormState } from '../Hook/hookDemo';
@@ -120,7 +117,7 @@ class NestArrayField extends React.Component {
 
 
 class Child extends React.Component {
-    constructor(props){
+    constructor(props) {
         super(props);
         this.state = {
             ts: format(new Date(), 'yyyy-MM-dd HH:mm:ss')
@@ -134,7 +131,7 @@ class Child extends React.Component {
 }
 
 class Parent extends React.Component {
-    constructor(props){
+    constructor(props) {
         super(props);
         this.click = this.click.bind(this);
     }

+ 1 - 1
packages/semi-ui/layout/Sider.tsx

@@ -42,7 +42,7 @@ export interface SiderProps {
     breakpoint?: Array<keyof ResponsiveMap>;
     onBreakpoint?: (screen: keyof ResponsiveMap, match: boolean) => void;
     'aria-label'?: React.AriaAttributes['aria-label'];
-    'role'?:React.AriaRole
+    'role'?: React.AriaRole
 }
 
 class Sider extends React.PureComponent<SiderProps> {

+ 1 - 1
packages/semi-ui/slider/_story/Demo.tsx

@@ -7,7 +7,7 @@ const Demo = () => {
         <div>
             <div>
                 <div>tipFormatter</div>
-                <Slider showBoundary={true} tipFormatter={ (val:any) => `=====${val}=====` }></Slider>
+                <Slider showBoundary={true} tipFormatter={ (val: any) => `=====${val}=====` }></Slider>
             </div>
             <br/>
             <br/>

+ 1 - 1
packages/semi-ui/typography/numeral.tsx

@@ -33,7 +33,7 @@ export interface NumeralProps extends Omit<React.HTMLAttributes<HTMLSpanElement>
     strong?: boolean;
     style?: React.CSSProperties;
     type?: TypographyBaseType;
-    underline?: boolean;
+    underline?: boolean
 }
 
 export default class Numeral extends PureComponent<NumeralProps> {

+ 1 - 1
src/components/ComponentOverview/index.jsx

@@ -4,7 +4,7 @@ import Card from './card';
 const ComponentList = props => {
     const list = props.code.split(',');
     return (
-        <div className="semi-overview-list" style={{ backgroundColor:`var(--semi-color-bg-0)` }}>
+        <div className="semi-overview-list" style={{ backgroundColor: `var(--semi-color-bg-0)` }}>
             {list.map((item, index) => (
                 <Card name={item} key={item + index} />
             ))}

+ 2 - 2
src/components/DesignPageAnchor/index.jsx

@@ -34,7 +34,7 @@ const PageAnchor = props => {
                     <Anchor.Link href={"#" + makeAnchorId(item.title)} title={item.title} key={item.title}>
                         {getAnchorLink(item.items, currentLayer + 1)}
                     </Anchor.Link>
-                </span>
+                </span>;
 
             } else {
                 return <span onClickCapture={(e)=>{
@@ -45,7 +45,7 @@ const PageAnchor = props => {
                     dom?.scrollIntoView();
                 }}>
                     <Anchor.Link href={"#" + makeAnchorId(item.title)} title={item.title} key={item.title} />
-                </span>
+                </span>;
             }
         }
         );

+ 11 - 11
src/components/DesignToken/index.tsx

@@ -15,7 +15,7 @@ interface Token {
     key: string;
     value: string;
     category: string;
-    raw: string;
+    raw: string
 }
 
 interface DesignToken {
@@ -24,22 +24,22 @@ interface DesignToken {
     global: {
         global: {
             light: Token[];
-            dark: Token[];
+            dark: Token[]
         };
         palette: {
             light: Token[];
-            dark: Token[];
+            dark: Token[]
         };
         normal: Token[];
-        animation: Token[];
+        animation: Token[]
     };
-    [key: string]: Token[];
+    [key: string]: Token[]
 
 }
 
 
 interface TokenMayWithColor extends Token {
-    color?: string;
+    color?: string
 }
 
 
@@ -59,7 +59,7 @@ const JumpLink = ({ value, availableKeySet }: { value: string; availableKeySet:
     }
 };
 
-const TokenTable = ({ tokenList, designToken, currentTab, mode = 'light' }: { mode?: 'light' | 'dark', tokenList: TokenMayWithColor[]; designToken: DesignToken; currentTab?: string; }): React.ReactElement => {
+const TokenTable = ({ tokenList, designToken, currentTab, mode = 'light' }: { mode?: 'light' | 'dark'; tokenList: TokenMayWithColor[]; designToken: DesignToken; currentTab?: string }): React.ReactElement => {
     const intl = useIntl();
     const globalTokenJumpAvailableSet = useMemo(() => {
         const global = designToken?.global;
@@ -169,7 +169,7 @@ const GlobalAnimationToken = ({ designToken }: { designToken: DesignToken }) =>
         animationList.forEach(token => {
             const tab = token['key'].match(/--semi-transition_([\w\W]+)-/)?.[1] ?? "other";
             tokenMap[tab] = [...(tokenMap[tab] ?? []), token];
-        })
+        });
         return tokenMap;
     }, [animationList]);
 
@@ -180,15 +180,15 @@ const GlobalAnimationToken = ({ designToken }: { designToken: DesignToken }) =>
             {Object.entries(tokenMap).map(([category, tokenList]) => {
                 return <Tabs.TabPane tab={category} itemKey={category} key={category}>
                     <TokenTable designToken={designToken} tokenList={tokenList} />
-                </Tabs.TabPane>
+                </Tabs.TabPane>;
             })}
         </Tabs>
-    </>
+    </>;
 
 
 
 
-}
+};
 
 
 const DesignToken = (props: Props): React.ReactElement => {

+ 2 - 2
src/components/IconList/IconCategory.jsx

@@ -16,13 +16,13 @@ const IconCategory = props => {
 
     const handleToggle = (i) => {
         $categorySet((c)=>{
-            if(c.has(i)){
+            if (c.has(i)) {
                 c.delete(i);
             } else {
                 c.add(i);
             }
             return new Set(Array.from(c));
-        })
+        });
     };
     return groups.map((g, i) => (
         <article key={i} className="semi-icons-category">

+ 3 - 3
src/components/example.js

@@ -1,7 +1,7 @@
-import React from 'react'
+import React from 'react';
 
 const ExampleContainer = ({ children }) => {
     return <div className="example-container">{ children }</div>;
-}
+};
 
-export default ExampleContainer
+export default ExampleContainer;

+ 1 - 1
src/components/header.js

@@ -12,7 +12,7 @@ const Header = ({ location, localeCode, style }) => (
                 const iframeDOM=document.querySelector('iframe');
                 try {
                     iframeDOM?.contentWindow?.semidoc?.setDarkmode(mode==='dark');
-                } catch (e){
+                } catch (e) {
 
                 }
             }}

+ 2 - 2
src/pages/en-US/index.js

@@ -14,8 +14,8 @@ const IndexPage = ({ location }) => {
     useEffect(() => {
         setTimeout(()=>{
             window?.__semi__?.Tea?.userVisited();
-            window?.__semi__?.Tea?.eventHappened("refer",document?.referrer ?? 'empty');
-        },3000);
+            window?.__semi__?.Tea?.eventHappened("refer", document?.referrer ?? 'empty');
+        }, 3000);
     }, []);
 
 

+ 2 - 2
src/pages/zh-CN/index.js

@@ -7,8 +7,8 @@ const IndexPage = ({ location }) => {
     useEffect(() => {
         setTimeout(()=>{
             window?.__semi__?.Tea?.userVisited();
-            window?.__semi__?.Tea?.eventHappened("refer",document?.referrer ?? 'empty');
-        },3000);
+            window?.__semi__?.Tea?.eventHappened("refer", document?.referrer ?? 'empty');
+        }, 3000);
     }, []);
 
     return (

+ 1 - 1
src/sitePages/newHome/components/theme/components/topBar/index.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import styles from './index.module.scss'
+import styles from './index.module.scss';
 
 function TopBar() {
     return (

+ 1 - 1
src/sitePages/newHome/components/theme/cutsomCssVariable.js

@@ -38,5 +38,5 @@ export const customCssVariables = {
         'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue',
         Helvetica, Arial, sans-serif`
     }
-}
+};
 

+ 24 - 24
src/sitePages/newHome/utils/compileScss.js

@@ -1,30 +1,30 @@
 import loadSassCompiler from "./loadSassCompiler";
-import {themeScssContent} from './themeDefaultScssContent'
+import { themeScssContent } from './themeDefaultScssContent';
 import { componentsScssContent } from "./componentsScssContent";
 
 export async function compile(customVariables) {
     if (!customVariables) {
-        return ''
+        return '';
     }
-    const compiler = await loadSassCompiler()
+    const compiler = await loadSassCompiler();
 
-    const customVariablesString  = Object.entries(customVariables).reduce((acc, cur) => {
+    const customVariablesString = Object.entries(customVariables).reduce((acc, cur) => {
         const [key, value] = cur;
-        acc += `${key}: ${value};\n`
+        acc += `${key}: ${value};\n`;
         return acc;
-    }, '')
+    }, '');
 
     await compiler.writeFilePromisify({
         'custom.scss': customVariablesString,
-    })
+    });
 
-    const modifiedComponentScssFiles = insertCustomVariables('../custom.scss')
+    const modifiedComponentScssFiles = insertCustomVariables('../custom.scss');
 
     await compiler.writeFilePromisify({
         ...themeScssContent,
         ...componentsScssContent,
         ...modifiedComponentScssFiles
-    })
+    });
 
     return new Promise(resolve => {
         // hack sass.js write file bug
@@ -32,20 +32,20 @@ export async function compile(customVariables) {
 
             const componentScssEntry = Object.keys(componentsScssContent).filter(path => path.includes('index.scss'));
             const entryString = componentScssEntry.reduce((acc, path) => {
-                acc += `@import '${path}';`
+                acc += `@import '${path}';`;
                 return acc;
-            }, '')
+            }, '');
 
             compiler.compile(`@import 'theme/index.scss';${entryString}`, (res) => {
                 if (res.status === 0) {
-                    console.log(res)
+                    console.log(res);
                     resolve(res.text);
                 } else {
                     console.dir(res);
                     resolve("");
                 }
-            })
-        })
+            });
+        });
     }).finally(() => {
         compiler.clearFiles();
     });
@@ -67,7 +67,7 @@ function insertCustomVariablesTo(source, customVariablesPath) {
             fileStr = fileSplit.join('');
         }
     } catch (error) {}
-    return fileStr
+    return fileStr;
 }
 
 export function insertCustomVariables(customVariablesPath) {
@@ -76,13 +76,13 @@ export function insertCustomVariables(customVariablesPath) {
 
     const modifiedFiles = componentScssEntry.reduce((acc, cur) => {
         const content = componentsScssContent[cur];
-        const newContent = insertCustomVariablesTo(content, customVariablesPath)
-        acc[cur] = newContent
+        const newContent = insertCustomVariablesTo(content, customVariablesPath);
+        acc[cur] = newContent;
         return acc;
-    }, {})
+    }, {});
 
-    const themeVariableContent = themeScssContent['theme/variables.scss']
-    const newThemeVariableContent = themeVariableContent + `\n@import "${customVariablesPath}";`
+    const themeVariableContent = themeScssContent['theme/variables.scss'];
+    const newThemeVariableContent = themeVariableContent + `\n@import "${customVariablesPath}";`;
 
     return {
         ...modifiedFiles,
@@ -91,16 +91,16 @@ export function insertCustomVariables(customVariablesPath) {
 } 
 
 export function insertStyleToDocument(css) {
-    let styleEle = document.querySelector('#customStyle')
+    let styleEle = document.querySelector('#customStyle');
     if (!styleEle) {
         styleEle = document.createElement("style");
         styleEle.setAttribute('id', 'customStyle');
         document.head.appendChild(styleEle);
     }
-    styleEle.textContent = `${css}`
+    styleEle.textContent = `${css}`;
 }
 
 export function removeStyleFromDocument() {
-    let styleEle = document.querySelector('#customStyle')
-    styleEle && styleEle.remove()
+    let styleEle = document.querySelector('#customStyle');
+    styleEle && styleEle.remove();
 }

+ 15 - 15
src/sitePages/newHome/utils/componentsScssContent.js

@@ -146,7 +146,7 @@ $module: #{$prefix}-descriptions;
         }
     }
 }
-`
+`;
 
 const DESCRIPTIONS_VARIABLES = `$font-descriptions-lineHeight: 20px; // 文字行高
 $font-descriptions_value-fontWeight: $font-weight-bold; // 双行显示 value 文字字重
@@ -163,7 +163,7 @@ $color-descriptions_value-text-default: var(--semi-color-text-0); // value 文
 
 $spacing-descriptions_value_plain-paddingLeft: 8px; // 普通显示 plain 模式下 value 左侧内边距
 $spacing-descriptions_item_double-padding: 0; // 双行显示右侧 item 内边距
-`
+`;
 
 export const TYPOGRAPHY_CONTENT = `@import "./variables.scss";
 
@@ -381,7 +381,7 @@ p.#{$module}-extended,
 .#{$module}-paragraph.#{$module}-extended {
     line-height: $font-typography_paragraph_extended-lineHeight;
 }
-`
+`;
 
 const TYPOGRAPHY_VARIABLES = `$color-typography_default-text-default: var(--semi-color-text-0); // 默认文本颜色
 $color-typography_secondary-text-default: var(--semi-color-text-1); // 稍次要文本颜色
@@ -428,7 +428,7 @@ $width-typography_code-border: 1px; // 代码文本描边宽度
 $width-typography_link-border: 1px; // 链接文本下划线宽度
 
 $radius-typography_code: 2px; // 代码文本圆角
-`
+`;
 
 const INPUT_CONTENT = `@import "./variables.scss";
 
@@ -616,7 +616,7 @@ $module: #{$prefix}-input;
         }
     }
 }
-`
+`;
 
 const INPUT_VARIABLES = `$color-input_default-border-default: transparent; // 输入框描边颜色 - 默认
 
@@ -727,7 +727,7 @@ $width-textarea-icon: $width-icon-medium + $spacing-tight; // clear 图标最小
 $height-textarea-default: 32px; // 多行文本 clear 图标的高度
 $spacing-textarea_withShowClear-paddingRight: 36px; // 多行文本设置 showClear 后的右内边距
 $spacing-textarea-icon-right: $spacing-extra-tight;// 多行文本 clear 图标的右边距
-`
+`;
 
 const SELECT_CONTENT = `//@import '../theme/variables.scss';
 @import './variables.scss';
@@ -1149,7 +1149,7 @@ $multiple: #{$module}-multiple;
     cursor: not-allowed;
 }
 
-`
+`;
 
 const SELECT_VARIABLES = `// Color
 $color-select-bg-default: var(--semi-color-fill-0); // 选择器输入框背景色 - 默认态
@@ -1251,14 +1251,14 @@ $font-select_keyword-fontWeight: 600; // 选择器搜索结果命关键词中文
 // Other
 $opacity-select_selection_text_inactive: .4;
 
-`
+`;
 
 const SELECT_MIXIN = `// Mixin
 @mixin select-tag-margin {
     margin-top: $spacing-select_tag-marginTop;
     margin-right: $spacing-select_tag-marginRight;
     margin-bottom: $spacing-select_tag-marginBottom;
-}`
+}`;
 
 const TABLE_CONTENT = `@import "./variables.scss";
 @import "./mixin.scss";
@@ -1787,7 +1787,7 @@ $module: #{$prefix}-table;
         justify-content: center;
     }
 }
-`
+`;
 
 const TABLE_VARIABLES = `// Spacing
 $spacing-table-paddingY: $spacing-base; // 表格单元格垂直内边距
@@ -1872,7 +1872,7 @@ $shadow-table_left: -3px 0 0 0 $color-table_shadow-bg-default; // 表格滚动
 $shadow-table_right: 3px 0 0 0 $color-table_shadow-bg-default; // 表格滚动阴影 - 右侧
 $border-table: #{$width-table_base_border} #{$border-table_base-borderStyle} $color-table-border-default; // 表格默认描边
 $border-table_resizer: $width-table_resizer_border solid $color-table_resizer-bg-default; // 表格拉伸标识描边
-`
+`;
 
 const TABLE_MIXIN = `@mixin genResizing() {
     border-right: $border-table_resizer;
@@ -1883,7 +1883,7 @@ const TABLE_MIXIN = `@mixin genResizing() {
             background-color: unset;
         }
     }
-}`
+}`;
 
 const PAGINATION_CONTENT = `//@import '../theme/variables.scss';
 @import "./variables.scss";
@@ -2041,7 +2041,7 @@ $module: #{$prefix}-page;
         }
     }
 }
-`
+`;
 
 const PAGINATION_VARIABLES = `// Color
 $color-pagination-text-default: var(--semi-color-text-2); // 翻页器总页数文本颜色
@@ -2094,7 +2094,7 @@ $font-pagination_small-fontWeight: $font-weight-regular; // 迷你翻页器字
 $font-pagination_item-fontWeight: $font-weight-regular; // 翻页器页码字重
 $font-pagination_item_active-fontWeight: $font-weight-bold; // 翻页器页码选中态字重
 $font-pagination_quickjump_fontWeight: $font-weight-regular; // 快速跳转输入框字重
-`
+`;
 
 export const componentsScssContent= {
     'descriptions/index.scss': DESCRIPTIONS_CONTENT,
@@ -2111,4 +2111,4 @@ export const componentsScssContent= {
     'table/mixin.scss': TABLE_MIXIN,
     'pagination/index.scss': PAGINATION_CONTENT,
     'pagination/variables.scss': PAGINATION_VARIABLES
-}
+};

+ 6 - 6
src/sitePages/newHome/utils/loadSassCompiler.js

@@ -10,22 +10,22 @@ const loadSassCompiler = () => new Promise((resolve) => {
     scriptEle.src = "/sass.js";
     scriptEle.onload = () => {
         // @ts-ignore
-        const {Sass} = window;
+        const { Sass } = window;
         compiler = new Sass();
         compiler.writeFilePromisify = (...args) => {
             return new Promise((resolve, reject) => {
                 compiler.writeFile(...args, (result) => {
                     if (result) {
-                        console.log("writed", args)
+                        console.log("writed", args);
                         resolve();
                     } else {
                         reject();
                     }
-                })
-            })
-        }
+                });
+            });
+        };
         resolve(compiler);
-    }
+    };
     document.head.appendChild(scriptEle);
 });
 

+ 5 - 5
src/sitePages/newHome/utils/themeDefaultScssContent.js

@@ -1,6 +1,6 @@
 const ENTRY_CONTENT = `@import './mixin.scss';
 @import './variables.scss';
-@import './_font.scss';`
+@import './_font.scss';`;
 
 const MIXIN_CONTENT = `/* shadow */
 @mixin shadow-elevated {
@@ -75,7 +75,7 @@ const MIXIN_CONTENT = `/* shadow */
         }
     }
 }
-`
+`;
 
 const VARIABLES_CONTENT = `$prefix: 'semi';
 
@@ -137,7 +137,7 @@ $font-size-header-1: 32px; // 一级标题字号
 $font-weight-light: 200; // 字重 - 轻
 $font-weight-regular: 400; // 字重 - 常规
 $font-weight-bold: 600; // 字重 - 加粗
-`
+`;
 
 const FONT_CONTENT = `// font-size line-height绑定
 @mixin font-size-small {
@@ -187,11 +187,11 @@ const FONT_CONTENT = `// font-size line-height绑定
     line-height: 44px;
     font-family: $font-family-regular;
 }
-`
+`;
 
 export const themeScssContent = {
     'theme/index.scss': ENTRY_CONTENT,
     'theme/variables.scss': VARIABLES_CONTENT,
     'theme/_font.scss': FONT_CONTENT,
     'theme/mixin.scss': MIXIN_CONTENT
-}
+};

+ 24 - 24
src/templates/toUEDUtils/toUED.ts

@@ -8,11 +8,11 @@ const getSite=()=>{
 
 
 
-const getAnotherSideUrl=(site:'design'|'main')=>{
+const getAnotherSideUrl=(site: 'design'|'main')=>{
     const currentUrlSplit=window.location.pathname.split('/').filter(s=>s);
     const url=currentUrlSplit.slice(currentUrlSplit.length-2);
     const locale=/zh-CN/.test(window.location.pathname)?'zh-CN':'en-US';
-    if (site==='main'){
+    if (site==='main') {
         return `${window.location.origin}/${locale}/${url[0]}/${url[1]}`;
     } else {
         return `${window.location.origin}/design/${locale}/${url[0]}/${url[1]}`;
@@ -20,48 +20,48 @@ const getAnotherSideUrl=(site:'design'|'main')=>{
 };
 
 
-const cache={ scrollHeight:null };
+const cache={ scrollHeight: null };
 
-const transContent=(site:'main'|'design')=>{
+const transContent=(site: 'main'|'design')=>{
     const url=`${getAnotherSideUrl('design')}?concisemode=true`;
     const mainSiteContentDOM= document.querySelector('.main-article') as HTMLDivElement;
-    if (site==='design'){
+    if (site==='design') {
         mainSiteContentDOM.style['display']='none';
         let iframeContainer=document.querySelector('#iframeContainer') as HTMLDivElement;
-        if (iframeContainer){
+        if (iframeContainer) {
             iframeContainer.style['display']='block';
             iframeContainer.style['margin-bottom']='120px';
             const iframeDOM=iframeContainer.querySelector('iframe');
-            if (iframeDOM.getAttribute('src')!==url){
-                iframeDOM.setAttribute('src',url);
+            if (iframeDOM.getAttribute('src')!==url) {
+                iframeDOM.setAttribute('src', url);
             }
-            if (cache.scrollHeight){
+            if (cache.scrollHeight) {
                 iframeContainer.style['height']=cache['scrollHeight'];
                 iframeDOM.style['height']=cache['scrollHeight'];
             }
         } else {
             iframeContainer=document.createElement('div') as HTMLDivElement;
-            iframeContainer.setAttribute('class','iframeContainer');
-            iframeContainer.setAttribute('id','iframeContainer');
+            iframeContainer.setAttribute('class', 'iframeContainer');
+            iframeContainer.setAttribute('id', 'iframeContainer');
             const iframeDOM=document.createElement('iframe');
-            iframeDOM.setAttribute('src',url);
-            iframeDOM.setAttribute('scrolling','no');
-            window.addEventListener('message',e=>{
-                console.log('message',e.data);
+            iframeDOM.setAttribute('src', url);
+            iframeDOM.setAttribute('scrolling', 'no');
+            window.addEventListener('message', e=>{
+                console.log('message', e.data);
                 try {
                     const data=JSON.parse(e.data);
-                    if (data['scrollHeight']){
+                    if (data['scrollHeight']) {
                         // @ts-ignore
                         window.syncThemeToIframe && window.syncThemeToIframe();
                         iframeDOM.style['height']=`${data['scrollHeight']}px`;
                         iframeContainer.style['height']=`${data['scrollHeight']}px`;
-                        console.log('height===>',data['scrollHeight']);
+                        console.log('height===>', data['scrollHeight']);
                         cache['scrollHeight']=`${data['scrollHeight']}px`;
                         // @ts-ignore
                         iframeDOM?.contentWindow?.semidoc?.setDarkmode(document.body.getAttribute('theme-mode')==='dark');
                     }
-                } catch (e){
-                    console.log('getMessage ====>',e);
+                } catch (e) {
+                    console.log('getMessage ====>', e);
                 }
             });
             iframeContainer.prepend(iframeDOM);
@@ -80,9 +80,9 @@ const transContent=(site:'main'|'design')=>{
     }
 };
 
-const isHaveUedDocs=(pathName:string)=>{
+const isHaveUedDocs=(pathName: string)=>{
 
-    if (pathName){
+    if (pathName) {
         const urlSplitArray=pathName.split('/').filter(v=>v);
         const componentName=urlSplitArray[urlSplitArray.length-1];
         return haveUedDocComponents.includes(componentName);
@@ -90,9 +90,9 @@ const isHaveUedDocs=(pathName:string)=>{
     return false;
 };
 
-const isJumpToDesignSite=(pathName:string)=>{
-    const components=['toast','popconfirm','scrolllist','popover','select','dropdown','treeselect'];
-    if (pathName){
+const isJumpToDesignSite=(pathName: string)=>{
+    const components=['toast', 'popconfirm', 'scrolllist', 'popover', 'select', 'dropdown', 'treeselect'];
+    if (pathName) {
         const urlSplitArray=pathName.split('/').filter(v=>v);
         const componentName=urlSplitArray[urlSplitArray.length-1];
         return components.includes(componentName);