fantasticit
/
think
mirror of https://github.com/fantasticit/think.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: format the code

pull/17/head
fantasticit 2022-03-27 15:43:06 +08:00
parent 1dd7cadfa0
commit 2dbdf3f3ee
128 changed files with 1878 additions and 924 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

110
.stylelintrc.js 100644
View File

@ -0,0 +1,110 @@
module.exports = {
processors: [],
plugins: ['stylelint-order'],
extends: ['stylelint-config-standard', 'stylelint-config-css-modules'],
rules: {
'selector-class-pattern': [
// 命名规范 -
'(.)+$',
{
message: 'Expected class selector to be kebab-case',
},
],
'string-quotes': 'single', // 单引号
'at-rule-empty-line-before': null,
'at-rule-no-unknown': null,
'at-rule-name-case': 'lower', // 指定@规则名的大小写
'length-zero-no-unit': true, // 禁止零长度的单位（可自动修复）
'shorthand-property-no-redundant-values': true, // 简写属性
'number-leading-zero': 'never', // 小数不带0
'declaration-block-no-duplicate-properties': true, // 禁止声明快重复属性
'no-descending-specificity': true, // 禁止在具有较高优先级的选择器后出现被其覆盖的较低优先级的选择器。
'selector-max-id': 3, // 限制一个选择器中 ID 选择器的数量
'max-nesting-depth': 5,
'indentation': [
2,
{
// 指定缩进 warning 提醒
severity: 'warning',
},
],
'order/properties-order': [
// 规则顺序
'position',
'top',
'right',
'bottom',
'left',
'z-index',
'display',
'float',
'width',
'height',
'max-width',
'max-height',
'min-width',
'min-height',
'padding',
'padding-top',
'padding-right',
'padding-bottom',
'padding-left',
'margin',
'margin-top',
'margin-right',
'margin-bottom',
'margin-left',
'margin-collapse',
'margin-top-collapse',
'margin-right-collapse',
'margin-bottom-collapse',
'margin-left-collapse',
'overflow',
'overflow-x',
'overflow-y',
'clip',
'clear',
'font',
'font-family',
'font-size',
'font-smoothing',
'osx-font-smoothing',
'font-style',
'font-weight',
'line-height',
'letter-spacing',
'word-spacing',
'color',
'text-align',
'text-decoration',
'text-indent',
'text-overflow',
'text-rendering',
'text-size-adjust',
'text-shadow',
'text-transform',
'word-break',
'word-wrap',
'white-space',
'vertical-align',
'list-style',
'list-style-type',
'list-style-position',
'list-style-image',
'pointer-events',
'cursor',
'background',
'background-color',
'border',
'border-radius',
'content',
'outline',
'outline-offset',
'opacity',
'filter',
'visibility',
'size',
'transform',
],
},
};

11
package.json
View File

@ -20,7 +20,9 @@
"pm2": "pnpm run pm2:server && pnpm run pm2:client",
"pm2:server": "pnpm run --dir packages/server pm2",
"pm2:client": "pnpm run --dir packages/client pm2",
"format": "prettier --write --parser typescript \"packages/**/*.ts?(x)\""
"format": "concurrently \"pnpm:format:*\"",
"format:ts": "prettier --write --parser typescript \"packages/**/*.ts?(x)\"",
"format:css": "stylelint --fix --formatter verbose --allow-empty-input \"packages/**/*.{css,scss,sass}\""
},
"dependencies": {
"concurrently": "^7.0.0",
@ -44,6 +46,13 @@
"eslint-plugin-react": "^7.29.3",
"eslint-plugin-react-hooks": "^4.3.0",
"prettier": "^2.3.2",
"stylelint": "^14.6.1",
"stylelint-config-css-modules": "^4.1.0",
"stylelint-config-prettier": "^9.0.3",
"stylelint-config-standard": "^25.0.0",
"stylelint-config-standard-scss": "^3.0.0",
"stylelint-order": "^5.0.0",
"stylelint-prettier": "^2.0.0",
"typescript": "^4.5.5"
}
}

4
packages/client/src/components/banner/index.tsx
View File

@ -1,7 +1,7 @@
import React, { useEffect, useRef } from 'react';
import { Banner as SemiBanner } from '@douyinfe/semi-ui';
import { BannerProps } from '@douyinfe/semi-ui/banner';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
interface IProps extends BannerProps {
duration?: number;
@ -26,5 +26,5 @@ export const Banner: React.FC<IProps> = ({ type, description, duration }) => {
if (!visible) return null;
return <SemiBanner type="success" description="以为您恢复上一次离线时编辑数据。 " />;
return <SemiBanner type={type} description={description} />;
};

2
packages/client/src/components/data-render/index.tsx
View File

@ -1,5 +1,5 @@
import React from 'react';
import { Empty, Spin, Typography } from '@douyinfe/semi-ui';
import { Spin, Typography } from '@douyinfe/semi-ui';
type RenderProps = React.ReactNode | (() => React.ReactNode);

4
packages/client/src/components/document-creator/index.tsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import { Button } from '@douyinfe/semi-ui';
import { useToggle } from 'hooks/useToggle';
import { useQuery } from 'hooks/useQuery';
import { useToggle } from 'hooks/use-toggle';
import { useQuery } from 'hooks/use-query';
import { DocumentCreator as DocumenCreatorForm } from 'components/document/create';
interface IProps {

2
packages/client/src/components/document/actions/index.tsx
View File

@ -5,7 +5,7 @@ import { DocumentLinkCopyer } from 'components/document/link';
import { DocumentDeletor } from 'components/document/delete';
import { DocumentCreator } from 'components/document/create';
import { DocumentStar } from 'components/document/star';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
interface IProps {
wikiId: string;

11
packages/client/src/components/document/card/index.module.scss
View File

@ -2,23 +2,22 @@
width: 100%;
> a {
margin: 8px 0;
display: flex;
flex-direction: column;
width: 100%;
max-height: 260px;
padding: 12px 16px 16px;
border-radius: 5px;
border: 1px solid var(--semi-color-border);
margin: 8px 0;
cursor: pointer;
border: 1px solid var(--semi-color-border);
border-radius: 5px;
flex-direction: column;
> header {
display: flex;
justify-content: space-between;
align-items: center;
color: var(--semi-color-primary);
margin-bottom: 12px;
color: var(--semi-color-primary);
.rightWrap {
opacity: 0;

2
packages/client/src/components/document/collaboration/index.tsx
View File

@ -18,7 +18,7 @@ import {
import { IconUserAdd, IconDelete } from '@douyinfe/semi-icons';
import { useUser } from 'data/user';
import { EventEmitter } from 'helpers/event-emitter';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { useCollaborationDocument } from 'data/document';
import { DataRender } from 'components/data-render';
import { DocumentLinkCopyer } from 'components/document/link';

13
packages/client/src/components/document/comments/comments/Item/index.module.scss
View File

@ -1,6 +1,6 @@
.wrap {
display: flex;
padding: 9px 0px 9px 0;
padding: 9px 0;
+ .wrap {
margin-top: 16px;
@ -17,20 +17,9 @@
}
> footer {
// height: 0;
// transition: all ease-in-out 0.3s;
span {
cursor: pointer;
}
}
}
// &:hover {
// .rightWrap {
// > footer {
// height: 40px;
// }
// }
// }
}

2
packages/client/src/components/document/comments/index.module.scss
View File

@ -10,8 +10,8 @@
}
.editorOuterWrap {
padding-top: 24px;
display: flex;
padding-top: 24px;
.rightWrap {
flex: 1;

2
packages/client/src/components/document/comments/index.tsx
View File

@ -1,7 +1,7 @@
import React, { useRef, useState } from 'react';
import { useEditor, EditorContent } from '@tiptap/react';
import { Avatar, Button, Space, Typography, Banner, Pagination } from '@douyinfe/semi-ui';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { DEFAULT_EXTENSION, Document, History, CommentMenuBar } from 'components/tiptap';
import { DataRender } from 'components/data-render';
import { useUser } from 'data/user';

2
packages/client/src/components/document/editor/editor.tsx
View File

@ -3,7 +3,7 @@ import cls from 'classnames';
import { useEditor, EditorContent } from '@tiptap/react';
import { BackTop } from '@douyinfe/semi-ui';
import { ILoginUser, IAuthority } from '@think/domains';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import {
MenuBar,
DEFAULT_EXTENSION,

14
packages/client/src/components/document/editor/index.module.scss
View File

@ -1,14 +1,14 @@
.wrap {
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
> header {
position: relative;
z-index: 110;
background-color: var(--semi-color-nav-bg);
height: 60px;
background-color: var(--semi-color-nav-bg);
user-select: none;
> div {
@ -18,27 +18,27 @@
> main {
height: calc(100% - 60px);
flex: 1;
overflow: hidden;
background-color: var(--semi-color-nav-bg);
flex: 1;
}
}
.editorWrap {
height: 100%;
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
> header {
position: relative;
z-index: 110;
display: flex;
height: 50px;
padding: 0 24px;
display: flex;
align-items: center;
overflow: hidden;
background-color: var(--semi-color-nav-bg);
align-items: center;
border-bottom: 1px solid var(--semi-color-border);
user-select: none;

4
packages/client/src/components/document/editor/index.tsx
View File

@ -4,7 +4,7 @@ import { Nav, Skeleton, Typography, Space, Button, Tooltip, Spin, Popover } from
import { IconChevronLeft, IconArticle } from '@douyinfe/semi-icons';
import { useUser } from 'data/user';
import { useDocumentDetail } from 'data/document';
import { useWindowSize } from 'hooks/useWindowSize';
import { useWindowSize } from 'hooks/use-window-size';
import { Seo } from 'components/seo';
import { Theme } from 'components/theme';
import { DataRender } from 'components/data-render';
@ -12,7 +12,7 @@ import { DocumentShare } from 'components/document/share';
import { DocumentStar } from 'components/document/star';
import { DocumentCollaboration } from 'components/document/collaboration';
import { DocumentStyle } from 'components/document/style';
import { useDocumentStyle } from 'hooks/useDocumentStyle';
import { useDocumentStyle } from 'hooks/use-document-style';
import { EventEmitter } from 'helpers/event-emitter';
import { Editor } from './editor';
import styles from './index.module.scss';

25
packages/client/src/components/document/reader/editor.tsx
View File

@ -2,7 +2,7 @@ import React, { useMemo, useEffect, useRef } from 'react';
import { useEditor, EditorContent } from '@tiptap/react';
import { Layout } from '@douyinfe/semi-ui';
import { IDocument, ILoginUser } from '@think/domains';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import {
DEFAULT_EXTENSION,
DocumentWithTitle,
@ -28,7 +28,6 @@ interface IProps {
export const Editor: React.FC<IProps> = ({ user, documentId, document }) => {
if (!user) return null;
const $ref = useRef();
const provider = useMemo(() => {
return getProvider({
targetId: documentId,
@ -70,18 +69,16 @@ export const Editor: React.FC<IProps> = ({ user, documentId, document }) => {
error={null}
normalContent={() => {
return (
<>
<Content className={styles.editorWrap}>
<div id="js-reader-container">
<ImageViewer containerSelector="#js-reader-container" />
<EditorContent editor={editor} />
</div>
<CreateUser
document={document}
container={() => window.document.querySelector('#js-reader-container .ProseMirror .title')}
/>
</Content>
</>
<Content className={styles.editorWrap}>
<div id="js-reader-container">
<ImageViewer containerSelector="#js-reader-container" />
<EditorContent editor={editor} />
</div>
<CreateUser
document={document}
container={() => window.document.querySelector('#js-reader-container .ProseMirror .title')}
/>
</Content>
);
}}
/>

2
packages/client/src/components/document/reader/index.module.scss
View File

@ -1,6 +1,6 @@
.wrap {
margin-top: -16px;
height: 100%;
margin-top: -16px;
.headerWrap {
position: sticky;

4
packages/client/src/components/document/reader/index.tsx
View File

@ -10,8 +10,8 @@ import { DocumentStar } from 'components/document/star';
import { DocumentCollaboration } from 'components/document/collaboration';
import { DocumentStyle } from 'components/document/style';
import { CommentEditor } from 'components/document/comments';
import { useDocumentStyle } from 'hooks/useDocumentStyle';
import { useWindowSize } from 'hooks/useWindowSize';
import { useDocumentStyle } from 'hooks/use-document-style';
import { useWindowSize } from 'hooks/use-window-size';
import { useUser } from 'data/user';
import { useDocumentDetail } from 'data/document';
import { DocumentSkeleton } from 'components/tiptap';

8
packages/client/src/components/document/reader/public/content.tsx
View File

@ -1,6 +1,5 @@
import React from 'react';
import { useEditor, EditorContent } from '@tiptap/react';
import { Layout } from '@douyinfe/semi-ui';
import { IDocument } from '@think/domains';
import { DEFAULT_EXTENSION, DocumentWithTitle } from 'components/tiptap';
import { safeJSONParse } from 'helpers/json';
@ -15,13 +14,6 @@ export const DocumentContent: React.FC<IProps> = ({ document, createUserContaine
const c = safeJSONParse(document.content);
let json = c.default || c;
// if (json && json.content) {
// json = {
// type: 'doc',
// content: json.content.slice(1),
// };
// }
const editor = useEditor({
editable: false,
extensions: [...DEFAULT_EXTENSION, DocumentWithTitle],

4
packages/client/src/components/document/reader/public/index.module.scss
View File

@ -1,7 +1,7 @@
.wrap {
height: 100%;
display: flex;
flex-direction: column;
height: 100%;
background-color: var(--semi-color-nav-bg);
.headerWrap {
@ -9,8 +9,8 @@
}
.contentWrap {
padding: 24px 24px 48px;
flex: 1;
padding: 24px 24px 48px;
overflow: auto;
.editorWrap {

6
packages/client/src/components/document/reader/public/index.tsx
View File

@ -9,15 +9,15 @@ import { DocumentStyle } from 'components/document/style';
import { User } from 'components/user';
import { Theme } from 'components/theme';
import { ImageViewer } from 'components/image-viewer';
import { useDocumentStyle } from 'hooks/useDocumentStyle';
import { useWindowSize } from 'hooks/useWindowSize';
import { useDocumentStyle } from 'hooks/use-document-style';
import { useWindowSize } from 'hooks/use-window-size';
import { usePublicDocument } from 'data/document';
import { DocumentSkeleton } from 'components/tiptap';
import { DocumentContent } from './content';
import styles from './index.module.scss';
const { Header, Content } = Layout;
const { Text, Title } = Typography;
const { Text } = Typography;
interface IProps {
documentId: string;

2
packages/client/src/components/document/share/index.tsx
View File

@ -5,7 +5,7 @@ import { isPublicDocument } from '@think/domains';
import { getDocumentShareURL } from 'helpers/url';
import { ShareIllustration } from 'illustrations/share';
import { DataRender } from 'components/data-render';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { useDocumentDetail } from 'data/document';
interface IProps {

4
packages/client/src/components/document/star/index.tsx
View File

@ -1,5 +1,5 @@
import React from 'react';
import { Typography, Tooltip, Button } from '@douyinfe/semi-ui';
import { Tooltip, Button } from '@douyinfe/semi-ui';
import { IconStar } from '@douyinfe/semi-icons';
import { useDocumentStar } from 'data/document';
@ -8,8 +8,6 @@ interface IProps {
render?: (arg: { star: boolean; text: string; toggleStar: () => Promise<void> }) => React.ReactNode;
}
const { Text } = Typography;
export const DocumentStar: React.FC<IProps> = ({ documentId, render }) => {
const { data, toggleStar } = useDocumentStar(documentId);
const text = data ? '取消收藏' : '收藏文档';

2
packages/client/src/components/document/style/index.tsx
View File

@ -1,6 +1,6 @@
import React from 'react';
import { RadioGroup, Radio, Typography, Slider } from '@douyinfe/semi-ui';
import { useDocumentStyle } from 'hooks/useDocumentStyle';
import { useDocumentStyle } from 'hooks/use-document-style';
import styles from './index.module.scss';
const { Text } = Typography;

8
packages/client/src/components/grid-select/grid-select.tsx
View File

@ -52,13 +52,6 @@ export const GridSelect = ({
const onClick = useCallback(
({ x, y, isCellDisabled }) => {
// if (isCellDisabled) {
// return null;
// }
// if (activeCell.x === x && activeCell.y === y) {
// return null;
// }
// setActiveCell({ x, y });
onSelect({
rows: y + 1,
cols: x + 1,
@ -67,7 +60,6 @@ export const GridSelect = ({
[onSelect]
);
// eslint-disable-next-line react-hooks/exhaustive-deps
const onHover = useCallback(
debounce(({ x, y, isCellDisabled }) => {
if (isCellDisabled) {

2
packages/client/src/components/icons/IconCodeBlock.tsx
View File

@ -6,7 +6,7 @@ export const IconCodeBlock: React.FC<{ style?: React.CSSProperties }> = ({ style
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="currentColor" fill-rule="evenodd">
<g fill="currentColor" fillRule="evenodd">
<path
d="M64 40c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L64 60H54a6 6 0 0 0-5.996 5.775L48 66v42.5a10 10 0 0 1-1.667 5.529l-.21.303L36.31 128l9.813 13.668a10 10 0 0 1 1.87 5.463l.007.369V190a6 6 0 0 0 5.775 5.996L54 196h10c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L64 216H54c-14.216 0-25.767-11.409-25.997-25.57L28 190v-39.281l-12.123-16.887a10 10 0 0 1-.179-11.407l.179-.257L28 105.28V66c0-14.216 11.409-25.767 25.57-25.997L54 40h10ZM192 40c-5.523 0-10 4.477-10 10 0 5.43 4.327 9.848 9.72 9.996L192 60h10a6 6 0 0 1 5.996 5.775L208 66v42.5a10 10 0 0 0 1.667 5.529l.21.303L219.69 128l-9.813 13.668a10 10 0 0 0-1.87 5.463l-.007.369V190a6 6 0 0 1-5.775 5.996L202 196h-10c-5.523 0-10 4.477-10 10 0 5.43 4.327 9.848 9.72 9.996l.28.004h10c14.216 0 25.767-11.409 25.997-25.57L228 190v-39.281l12.123-16.887a10 10 0 0 0 .179-11.407l-.179-.257L228 105.28V66c0-14.216-11.409-25.767-25.57-25.997L202 40h-10Z"
fillRule="nonzero"

2
packages/client/src/components/icons/IconHorizontalRule.tsx
View File

@ -6,7 +6,7 @@ export const IconHorizontalRule: React.FC<{ style?: React.CSSProperties }> = ({
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="none" fill-rule="evenodd">
<g fill="none" fillRule="evenodd">
<rect fill="currentColor" x="17" y="116" width="223" height="24" rx="12"></rect>
</g>
</svg>

4
packages/client/src/components/icons/IconList.tsx
View File

@ -6,8 +6,8 @@ export const IconList: React.FC<{ style?: React.CSSProperties }> = ({ style = {}
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="currentColor" fill-rule="evenodd">
<g fill-rule="nonzero">
<g fill="currentColor" fillRule="evenodd">
<g fillRule="nonzero">
<path d="M215 118c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L215 138H96c-5.523 0-10-4.477-10-10 0-5.43 4.327-9.848 9.72-9.996L96 118h119ZM215 35c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L215 55H96c-5.523 0-10-4.477-10-10 0-5.43 4.327-9.848 9.72-9.996L96 35h119ZM215 201c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L215 221H96c-5.523 0-10-4.477-10-10 0-5.43 4.327-9.848 9.72-9.996L96 201h119Z"></path>
</g>
<circle cx="44" cy="45" r="16"></circle>

2
packages/client/src/components/icons/IconMind.tsx
View File

@ -6,7 +6,7 @@ export const IconMind: React.FC<{ style?: React.CSSProperties }> = ({ style = {}
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="currentColor" fill-rule="nonzero">
<g fill="currentColor" fillRule="nonzero">
<path d="M214 35h-46c-14.36 0-26 11.64-26 26v10c0 14.36 11.64 26 26 26h46c14.36 0 26-11.64 26-26V61c0-14.36-11.64-26-26-26Zm-46 20h46a6 6 0 0 1 6 6v10a6 6 0 0 1-6 6h-46a6 6 0 0 1-6-6V61a6 6 0 0 1 6-6ZM214 159h-46c-14.36 0-26 11.64-26 26v10c0 14.36 11.64 26 26 26h46c14.36 0 26-11.64 26-26v-10c0-14.36-11.64-26-26-26Zm-46 20h46a6 6 0 0 1 6 6v10a6 6 0 0 1-6 6h-46a6 6 0 0 1-6-6v-10a6 6 0 0 1 6-6Z"></path>
<path d="M73.55 147.305c7.858 20.517 27.486 34.415 49.774 34.69L124 182h26.207v16H124c-28.957 0-54.586-17.747-65.078-44.17l-.313-.803 14.942-5.722ZM158 58v16h-34c-22.645 0-42.63 14.068-50.511 34.857l-.235.632-15.03-5.484c9.897-27.128 35.606-45.632 64.888-46L124 58h34Z"></path>
<path d="M88 97H42c-14.36 0-26 11.64-26 26v10c0 14.36 11.64 26 26 26h46c14.36 0 26-11.64 26-26v-10c0-14.36-11.64-26-26-26Zm-46 20h46a6 6 0 0 1 6 6v10a6 6 0 0 1-6 6H42a6 6 0 0 1-6-6v-10a6 6 0 0 1 6-6Z"></path>

2
packages/client/src/components/icons/IconOrderedList.tsx
View File

@ -6,7 +6,7 @@ export const IconOrderedList: React.FC<{ style?: React.CSSProperties }> = ({ sty
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="currentColor" fill-rule="nonzero">
<g fill="currentColor" fillRule="nonzero">
<path d="M215 118c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L215 138H101c-5.523 0-10-4.477-10-10 0-5.43 4.327-9.848 9.72-9.996L101 118h114ZM215 35c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L215 55H101c-5.523 0-10-4.477-10-10 0-5.43 4.327-9.848 9.72-9.996L101 35h114ZM215 201c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L215 221H101c-5.523 0-10-4.477-10-10 0-5.43 4.327-9.848 9.72-9.996L101 201h114ZM65.988 190.061l-.739.79-1.88 2.061-4.394 4.885-6.435 7.205h13.852a9 9 0 0 1 8.996 8.736l.004.265a9 9 0 0 1-8.735 8.996l-.265.004H32.5c-7.762 0-11.883-9.167-6.732-14.973l15.666-17.621 6.446-7.197 3.323-3.665 1.424-1.54.623-.653.408-.407.042-.039c1.203-1.106 1.855-2.536 1.855-4.05 0-3.128-2.87-5.855-6.637-5.855-3.681 0-6.508 2.607-6.632 5.647l-.004.208a9 9 0 1 1-18 0c0-13.281 11.13-23.855 24.636-23.855 13.507 0 24.637 10.574 24.637 23.855 0 6.497-2.703 12.572-7.355 17.003l-.212.2ZM43.206 25.413c5.694-5.302 14.934-1.363 15.13 6.337l.003.25v73a9 9 0 0 1-17.996.265L40.34 105V52.583c-3.556 2.568-8.513 2.208-11.653-.96l-.198-.207a9 9 0 0 1 .247-12.522l.206-.198 14.265-13.283Z"></path>
</g>
</svg>

6
packages/client/src/components/icons/IconQuote.tsx
View File

@ -6,12 +6,12 @@ export const IconQuote: React.FC<{ style?: React.CSSProperties }> = ({ style = {
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="none" fill-rule="evenodd">
<g fill="none" fillRule="evenodd">
<g fill="currentColor">
<path d="M36 143h44c6.627 0 12 5.373 12 12v44c0 6.627-5.373 12-12 12H36c-6.627 0-12-5.373-12-12v-44c0-6.627 5.373-12 12-12Z"></path>
<path
d="M84.144 53.257c5.502-.485 10.355 3.582 10.84 9.084.476 5.408-3.447 10.19-8.806 10.81l-.279.029c-23.384 2.06-41.533 21.544-41.894 45.105L44 119v41.723c0 5.523-4.477 10-10 10-5.43 0-9.848-4.326-9.996-9.72l-.004-.28V119c0-34.269 26.22-62.755 60.144-65.743Z"
fill-rule="nonzero"
fillRule="nonzero"
></path>
<path d="M43.272 120.769 38.56 142.58a9.567 9.567 0 0 0 13.93 10.42l11.401-6.216a2.015 2.015 0 0 0-.964-3.784h-2.933c-8.837 0-16-7.164-16-16v-6.155a.365.365 0 0 0-.722-.077Z"></path>
</g>
@ -19,7 +19,7 @@ export const IconQuote: React.FC<{ style?: React.CSSProperties }> = ({ style = {
<path d="M176 143h44c6.627 0 12 5.373 12 12v44c0 6.627-5.373 12-12 12h-44c-6.627 0-12-5.373-12-12v-44c0-6.627 5.373-12 12-12Z"></path>
<path
d="M224.144 53.257c5.502-.485 10.355 3.582 10.84 9.084.476 5.408-3.447 10.19-8.806 10.81l-.279.029c-23.384 2.06-41.533 21.544-41.894 45.105L184 119v41.723c0 5.523-4.477 10-10 10-5.43 0-9.848-4.326-9.996-9.72l-.004-.28V119c0-34.269 26.22-62.755 60.144-65.743Z"
fill-rule="nonzero"
fillRule="nonzero"
></path>
<path d="m183.272 120.769-4.712 21.812a9.567 9.567 0 0 0 13.93 10.42l11.401-6.216a2.015 2.015 0 0 0-.964-3.784h-2.933c-8.837 0-16-7.164-16-16v-6.155a.365.365 0 0 0-.722-.077Z"></path>
</g>

4
packages/client/src/components/icons/IconSearchReplace.tsx
View File

@ -6,8 +6,8 @@ export const IconSearchReplace: React.FC<{ style?: React.CSSProperties }> = ({ s
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="currentColor" fill-rule="evenodd">
<g fill-rule="nonzero">
<g fill="currentColor" fillRule="evenodd">
<g fillRule="nonzero">
<path d="M191.527 15c18.302 0 33.173 14.688 33.469 32.919l.004.554v65.424c0 5.523-4.477 10-10 10-5.43 0-9.848-4.327-9.996-9.72l-.004-.28V48.473c0-7.338-5.865-13.305-13.163-13.47l-.31-.003H64.473c-7.338 0-13.305 5.865-13.47 13.163l-.003.31v159.054c0 7.338 5.865 13.305 13.163 13.47l.31.003H99c5.523 0 10 4.477 10 10 0 5.43-4.327 9.848-9.72 9.996L99 241H64.473c-18.302 0-33.173-14.688-33.469-32.919l-.004-.554V48.473C31 30.17 45.688 15.3 63.919 15.004l.554-.004h127.054Z"></path>
<path d="M147.385 150.885c-17.964 17.964-17.964 47.09 0 65.054s47.09 17.964 65.054 0c17.964-17.965 17.964-47.09 0-65.054-17.965-17.964-47.09-17.964-65.054 0Zm14.142 14.142c10.154-10.154 26.616-10.154 36.77 0 10.153 10.154 10.153 26.616 0 36.77-10.154 10.153-26.616 10.153-36.77 0-10.154-10.154-10.154-26.616 0-36.77Z"></path>
<path d="M234.545 241.752c-3.839 3.84-10.023 3.904-13.941.196l-.2-.196-21.921-21.92c-3.905-3.905-3.905-10.237 0-14.142 3.839-3.84 10.023-3.904 13.941-.195l.2.195 21.921 21.92c3.905 3.905 3.905 10.237 0 14.142Z"></path>

4
packages/client/src/components/icons/IconStatus.tsx
View File

@ -6,10 +6,10 @@ export const IconStatus: React.FC<{ style?: React.CSSProperties }> = ({ style =
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g transform="rotate(-45 100.071 47.645)" fill="currentColor" fill-rule="evenodd">
<g transform="rotate(-45 100.071 47.645)" fill="currentColor" fillRule="evenodd">
<path
d="m44.625 4.22-47 46.951A26 26 0 0 0-10 69.566V190c0 14.36 11.64 26 26 26h94c14.36 0 26-11.64 26-26V69.566a26 26 0 0 0-7.625-18.395l-47-46.95c-10.151-10.14-26.599-10.14-36.75 0ZM67.24 18.37l47 46.95a6 6 0 0 1 1.76 4.246V190a6 6 0 0 1-6 6H16a6 6 0 0 1-6-6V69.566a6 6 0 0 1 1.76-4.245l47-46.95a6 6 0 0 1 8.48 0Z"
fill-rule="nonzero"
fillRule="nonzero"
></path>
<circle cx="63.172" cy="67.586" r="14"></circle>
</g>

2
packages/client/src/components/icons/IconSub.tsx
View File

@ -6,7 +6,7 @@ export const IconSub: React.FC<{ style?: React.CSSProperties }> = ({ style = {}
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g stroke="currentColor" fill="none" fill-rule="evenodd">
<g stroke="currentColor" fill="none" fillRule="evenodd">
<path stroke-width="20" stroke-linecap="round" d="m40 50 114 168M154 50 40 218"></path>
<path
d="M231.92 225.48c2.72 0 4.08-1.48 4.08-4.44 0-2.88-1.36-4.32-4.08-4.32H198.8c6.48-5.52 12.28-11.24 17.4-17.16 2.16-2.48 4.28-5.16 6.36-8.04 2.08-2.88 3.94-5.82 5.58-8.82 1.64-3 2.96-6.04 3.96-9.12 1-3.08 1.5-6.14 1.5-9.18 0-3.36-.48-6.42-1.44-9.18s-2.38-5.12-4.26-7.08-4.2-3.48-6.96-4.56c-2.76-1.08-5.9-1.62-9.42-1.62-7.92 0-13.8 2.26-17.64 6.78-3.84 4.52-5.76 10.66-5.76 18.42 0 2.24.32 3.74.96 4.5.64.76 1.96 1.14 3.96 1.14 1.76 0 2.98-.44 3.66-1.32.68-.88 1.02-2.32 1.02-4.32 0-4.8 1.04-8.74 3.12-11.82s5.4-4.62 9.96-4.62c4 0 7.16 1.32 9.48 3.96 2.32 2.64 3.48 6.12 3.48 10.44 0 3.2-.64 6.42-1.92 9.66-1.28 3.24-2.94 6.4-4.98 9.48a84.099 84.099 0 0 1-6.84 8.94c-2.52 2.88-5.04 5.6-7.56 8.16-2.52 2.56-4.92 4.94-7.2 7.14-2.28 2.2-4.18 4.1-5.7 5.7-.64 1.04-.96 2.04-.96 3-.56 1.04-.86 2.06-.9 3.06-.04 1 .1 1.88.42 2.64.32.76.8 1.38 1.44 1.86.64.48 1.36.72 2.16.72h40.2Z"

2
packages/client/src/components/icons/IconSup.tsx
View File

@ -6,7 +6,7 @@ export const IconSup: React.FC<{ style?: React.CSSProperties }> = ({ style = {}
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g stroke="currentColor" fill="none" fill-rule="evenodd">
<g stroke="currentColor" fill="none" fillRule="evenodd">
<path stroke-width="20" stroke-linecap="round" d="m40 50 114 168M154 50 40 218"></path>
<path
d="M231.92 103.48c2.72 0 4.08-1.48 4.08-4.44 0-2.88-1.36-4.32-4.08-4.32H198.8c6.48-5.52 12.28-11.24 17.4-17.16 2.16-2.48 4.28-5.16 6.36-8.04 2.08-2.88 3.94-5.82 5.58-8.82 1.64-3 2.96-6.04 3.96-9.12 1-3.08 1.5-6.14 1.5-9.18 0-3.36-.48-6.42-1.44-9.18s-2.38-5.12-4.26-7.08-4.2-3.48-6.96-4.56c-2.76-1.08-5.9-1.62-9.42-1.62-7.92 0-13.8 2.26-17.64 6.78-3.84 4.52-5.76 10.66-5.76 18.42 0 2.24.32 3.74.96 4.5.64.76 1.96 1.14 3.96 1.14 1.76 0 2.98-.44 3.66-1.32.68-.88 1.02-2.32 1.02-4.32 0-4.8 1.04-8.74 3.12-11.82s5.4-4.62 9.96-4.62c4 0 7.16 1.32 9.48 3.96 2.32 2.64 3.48 6.12 3.48 10.44 0 3.2-.64 6.42-1.92 9.66-1.28 3.24-2.94 6.4-4.98 9.48a84.099 84.099 0 0 1-6.84 8.94c-2.52 2.88-5.04 5.6-7.56 8.16-2.52 2.56-4.92 4.94-7.2 7.14-2.28 2.2-4.18 4.1-5.7 5.7-.64 1.04-.96 2.04-.96 3-.56 1.04-.86 2.06-.9 3.06-.04 1 .1 1.88.42 2.64.32.76.8 1.38 1.44 1.86.64.48 1.36.72 2.16.72h40.2Z"

2
packages/client/src/components/icons/IconTable.tsx
View File

@ -6,7 +6,7 @@ export const IconTable: React.FC<{ style?: React.CSSProperties }> = ({ style = {
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="currentColor" fill-rule="evenodd">
<g fill="currentColor" fillRule="evenodd">
<path
d="M208 40c17.673 0 32 14.327 32 32v112c0 17.673-14.327 32-32 32H48c-17.673 0-32-14.327-32-32V72c0-17.673 14.327-32 32-32h160Zm0 20H48c-6.525 0-11.834 5.209-11.996 11.695L36 72v112c0 6.525 5.209 11.834 11.695 11.996L48 196h160c6.525 0 11.834-5.209 11.996-11.695L220 184V72c0-6.525-5.209-11.834-11.695-11.996L208 60Z"
fillRule="nonzero"

6
packages/client/src/components/icons/IconTask.tsx
View File

@ -6,16 +6,16 @@ export const IconTask: React.FC<{ style?: React.CSSProperties }> = ({ style = {}
style={style}
svg={
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
<g fill="none" fill-rule="evenodd">
<g fill="none" fillRule="evenodd">
<path
d="M169.002 89.757c3.945-3.865 10.276-3.8 14.141.145 3.795 3.873 3.801 10.047.067 13.928l-.212.213-63.285 62a10 10 0 0 1-13.776.209l-.219-.208-32.715-32.041c-3.946-3.865-4.012-10.196-.147-14.142 3.794-3.873 9.966-4.007 13.924-.354l.217.207 25.717 25.187 56.288-55.144Z"
fill="currentColor"
fill-rule="nonzero"
fillRule="nonzero"
></path>
<path
d="M201 23c17.673 0 32 14.327 32 32v146c0 17.673-14.327 32-32 32H55c-17.673 0-32-14.327-32-32V55c0-17.673 14.327-32 32-32h146Zm0 20H55c-6.525 0-11.834 5.209-11.996 11.695L43 55v146c0 6.525 5.209 11.834 11.695 11.996L55 213h146c6.525 0 11.834-5.209 11.996-11.695L213 201V55c0-6.525-5.209-11.834-11.695-11.996L201 43Z"
fill="currentColor"
fill-rule="nonzero"
fillRule="nonzero"
></path>
</g>
</svg>

2
packages/client/src/components/locale-time/index.tsx
View File

@ -35,7 +35,7 @@ const getTimeago = (date: number | string | Date) => {
};
export const LocaleTime: React.FC<Props> = ({ date, timeago, format = 'yyyy-MM-dd HH:mm:ss' }) => {
const [_, setMinutesMounted] = useState(0); // eslint-disable-line no-unused-vars
const [, setMinutesMounted] = useState(0);
const callback = useRef<() => void>();
useEffect(() => {

2
packages/client/src/components/logo/index.module.scss
View File

@ -9,9 +9,9 @@
}
> span {
margin-left: 4px;
font-size: 1.2rem;
font-weight: 500;
margin-left: 4px;
}
}

11
packages/client/src/components/message/index.module.scss
View File

@ -11,25 +11,25 @@
border-radius: var(--semi-border-radius-small);
&:hover {
background-color: var(--semi-color-fill-0);
color: var(--semi-color-text-0);
background-color: var(--semi-color-fill-0);
}
.item {
display: flex;
align-items: center;
justify-content: space-between;
align-items: center;
width: 100%;
height: 32px;
padding: 4px 16px;
.leftWrap {
display: flex;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: var(--semi-color-primary);
text-overflow: ellipsis;
white-space: nowrap;
align-items: center;
> span {
word-break: break-all;
@ -51,5 +51,4 @@
.paginationWrap {
display: flex;
justify-content: center;
// padding: 16px 0 0;
}

2
packages/client/src/components/message/index.tsx
View File

@ -6,7 +6,7 @@ import { useAllMessages, useReadMessages, useUnreadMessages } from 'data/message
import { EmptyBoxIllustration } from 'illustrations/empty-box';
import { DataRender } from 'components/data-render';
import { Empty } from 'components/empty';
import { Placeholder } from './Placeholder';
import { Placeholder } from './placeholder';
import styles from './index.module.scss';
const { Text } = Typography;

12
packages/client/src/components/resizeable/style.module.scss
View File

@ -1,38 +1,38 @@
.resizable {
box-sizing: border-box;
position: relative;
display: inline-block;
width: 100px;
height: 100px;
max-width: 100%;
box-sizing: border-box;
.resizer {
box-sizing: border-box;
position: absolute;
z-index: 9999;
width: 10px;
height: 10px;
border-radius: 50%;
background: white;
border: 3px solid #4286f4;
border-radius: 50%;
opacity: 0;
box-sizing: border-box;
}
.resizer.topLeft {
left: -5px;
top: -5px;
left: -5px;
cursor: nwse-resize;
}
.resizer.topRight {
right: -5px;
top: -5px;
right: -5px;
cursor: nesw-resize;
}
.resizer.bottomLeft {
left: -5px;
bottom: -5px;
left: -5px;
cursor: nesw-resize;
}

13
packages/client/src/components/search/index.module.scss
View File

@ -1,29 +1,26 @@
.itemsWrap {
}
.itemWrap {
margin-top: 8px;
border-radius: var(--semi-border-radius-small);
&:hover {
background-color: var(--semi-color-fill-0);
color: var(--semi-color-text-0);
background-color: var(--semi-color-fill-0);
}
.item {
display: flex;
align-items: center;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 4px 8px;
.leftWrap {
display: flex;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: var(--semi-color-primary);
text-overflow: ellipsis;
white-space: nowrap;
align-items: center;
> span {
word-break: break-all;

4
packages/client/src/components/search/index.tsx
View File

@ -6,8 +6,8 @@ import { IconSearch as SemiIconSearch } from '@douyinfe/semi-icons';
import { IconSearch } from 'components/icons';
import { IDocument } from '@think/domains';
import { useRecentDocuments } from 'data/document';
import { useToggle } from 'hooks/useToggle';
import { useAsyncLoading } from 'hooks/useAsyncLoading';
import { useToggle } from 'hooks/use-toggle';
import { useAsyncLoading } from 'hooks/use-async-loading';
import { searchDocument } from 'services/document';
import { Empty } from 'components/empty';
import { DataRender } from 'components/data-render';

69
packages/client/src/components/template/card/index.module.scss
View File

@ -1,67 +1,64 @@
.cardWrap {
position: relative;
transform: translateZ(0);
margin: 8px 0;
display: flex;
flex-direction: column;
width: 100%;
height: 161px;
padding: 12px 16px 16px;
border-radius: var(--border-radius);
border: 1px solid var(--semi-color-border);
cursor: pointer;
margin: 8px 0;
overflow: hidden;
cursor: pointer;
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
transform: translateZ(0);
flex-direction: column;
header {
display: flex;
justify-content: space-between;
align-items: center;
color: var(--semi-color-primary);
margin-bottom: 12px;
color: var(--semi-color-primary);
.rightWrap {
opacity: 0;
}
}
.actions {
position: absolute;
bottom: -1px;
left: 0;
z-index: 10;
display: flex;
width: 100%;
padding: 8px;
background-color: var(--semi-color-fill-2);
border-radius: 0 0 var(--border-radius) var(--border-radius);
opacity: 0;
justify-content: space-around;
transition: all ease-in-out .2s;
button {
width: 40%;
}
}
&:hover {
box-shadow: var(--semi-color-shadow);
header .rightWrap {
opacity: 1;
}
}
footer {
margin-top: 12px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.actions {
position: absolute;
bottom: -1px;
left: 0;
z-index: 10;
transition: all ease-in-out 0.2s;
width: 100%;
display: flex;
justify-content: space-around;
padding: 8px;
border-radius: 0 0 var(--border-radius) var(--border-radius);
background-color: var(--semi-color-fill-2);
opacity: 0;
button {
width: 40%;
}
}
&:hover {
.actions {
opacity: 1;
}
}
footer {
margin-top: 12px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}

2
packages/client/src/components/template/card/index.tsx
View File

@ -6,9 +6,9 @@ import { Button, Space, Typography, Tooltip, Avatar, Skeleton, Modal } from '@do
import { IconEdit, IconUser, IconPlus } from '@douyinfe/semi-icons';
import { IconDocument } from 'components/icons/IconDocument';
import { TemplateReader } from 'components/template/reader';
import { useToggle } from 'hooks/use-toggle';
import { useUser } from 'data/user';
import styles from './index.module.scss';
import { useToggle } from 'hooks/useToggle';
const { Text } = Typography;

4
packages/client/src/components/template/editor/editor.tsx
View File

@ -28,8 +28,8 @@ import {
import { DataRender } from 'components/data-render';
import { User } from 'components/user';
import { DocumentStyle } from 'components/document/style';
import { useDocumentStyle } from 'hooks/useDocumentStyle';
import { useWindowSize } from 'hooks/useWindowSize';
import { useDocumentStyle } from 'hooks/use-document-style';
import { useWindowSize } from 'hooks/use-window-size';
import { safeJSONParse } from 'helpers/json';
import styles from './index.module.scss';

29
packages/client/src/components/template/editor/index.module.scss
View File

@ -1,14 +1,14 @@
.wrap {
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
> header {
position: relative;
z-index: 110;
background-color: var(--semi-color-nav-bg);
height: 60px;
background-color: var(--semi-color-nav-bg);
user-select: none;
> div {
@ -18,30 +18,37 @@
> main {
height: calc(100% - 60px);
flex: 1;
overflow: hidden;
background-color: var(--semi-color-nav-bg);
flex: 1;
}
}
.editorWrap {
height: 100%;
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
> header {
position: relative;
z-index: 110;
display: flex;
height: 50px;
padding: 0 24px;
display: flex;
align-items: center;
overflow: hidden;
background-color: var(--semi-color-nav-bg);
align-items: center;
border-bottom: 1px solid var(--semi-color-border);
user-select: none;
> div {
display: inline-flex;
align-items: center;
height: 100%;
overflow: auto;
}
&.isStandardWidth {
> div {
margin: 0 auto;
@ -53,14 +60,6 @@
margin: 0;
}
}
> div {
display: inline-flex;
align-items: center;
// width: 100%;
height: 100%;
overflow: auto;
}
}
> main {

2
packages/client/src/components/template/reader/editor.tsx
View File

@ -6,7 +6,7 @@ import { IUser, ITemplate } from '@think/domains';
import { DEFAULT_EXTENSION, DocumentWithTitle } from 'components/tiptap';
import { DataRender } from 'components/data-render';
import { ImageViewer } from 'components/image-viewer';
import { useDocumentStyle } from 'hooks/useDocumentStyle';
import { useDocumentStyle } from 'hooks/use-document-style';
import { safeJSONParse } from 'helpers/json';
import styles from './index.module.scss';

1
packages/client/src/components/template/reader/index.module.scss
View File

@ -1,7 +1,6 @@
.wrap {
display: flex;
flex-direction: column;
height: 100%;
.contentWrap {

4
packages/client/src/components/theme/index.tsx
View File

@ -1,7 +1,7 @@
import React, { useEffect, useState } from 'react';
import React from 'react';
import { Button, Tooltip } from '@douyinfe/semi-ui';
import { IconSun, IconMoon } from '@douyinfe/semi-icons';
import { useTheme } from 'hooks/useTheme';
import { useTheme } from 'hooks/use-theme';
export const Theme = () => {
const { theme, toggle } = useTheme();

10
packages/client/src/components/tiptap/menus/colorPicker/style.module.scss
View File

@ -6,28 +6,28 @@
.colorItem {
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
cursor: pointer;
border-radius: 4px;
border: 1px solid transparent;
border-radius: 4px;
justify-content: center;
align-items: center;
&:nth-of-type(n + 8) {
margin-top: 4px;
}
&:hover {
border-color: rgb(193, 199, 208);
border-color: rgb(193 199 208);
}
> span {
display: block;
width: 28px;
height: 28px;
border-radius: 2px;
border: 1px solid var(--semi-color-border);
border-radius: 2px;
}
}
}

14
packages/client/src/components/tiptap/menus/emoji/index.module.scss
View File

@ -5,22 +5,20 @@
.listWrap {
display: flex;
flex-wrap: wrap;
list-style: none;
width: 320px;
padding: 0;
margin: 0;
list-style: none;
flex-wrap: wrap;
> li {
display: flex;
justify-content: center;
align-items: center;
width: 32px;
height: 32px;
font-size: 24px;
display: flex;
align-items: center;
justify-content: center;
padding: 4px;
font-size: 24px;
cursor: pointer;
}
}

0
packages/client/src/components/tiptap/menus/search/index.module.scss
View File

2
packages/client/src/components/tiptap/wrappers/attachment/index.tsx
View File

@ -12,7 +12,7 @@ import {
IconClose,
} from '@douyinfe/semi-icons';
import { Tooltip } from 'components/tooltip';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { download } from '../../services/download';
import { uploadFile } from 'services/file';
import {

6
packages/client/src/components/tiptap/wrappers/banner/index.module.scss
View File

@ -1,10 +1,10 @@
.wrap {
line-height: 0;
border-radius: var(--border-radius);
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
p {
margin-top: 0.25em;
margin-top: .25em;
}
p:first-child {
@ -12,8 +12,8 @@
}
ul {
margin: 0;
padding-left: 1em;
margin: 0;
}
.handlerWrap {

2
packages/client/src/components/tiptap/wrappers/codeBlock/index.module.scss
View File

@ -5,8 +5,8 @@
display: flex;
justify-content: space-between;
padding: 6px 8px;
background-color: var(--semi-color-fill-0);
border-bottom: 1px solid var(--semi-color-border);
background-color: var(--semi-color-fill-0);
.selectorWrap {
margin-right: 8px;

36
packages/client/src/components/tiptap/wrappers/documentChildren/index.module.scss
View File

@ -1,38 +1,38 @@
.wrap {
margin-top: 0.75em;
padding: 12px;
margin-top: .75em;
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
&.isEditable {
.itemWrap {
pointer-events: none;
&:hover {
color: var(--semi-color-text-1);
border-color: var(--semi-color-border);
}
}
}
.itemWrap {
display: flex;
align-items: center;
margin-top: 12px;
padding: 6px;
text-decoration: none;
margin-top: 12px;
color: var(--semi-color-text-1);
border-radius: var(--border-radius);
border: 1px solid var(--semi-color-border);
text-decoration: none;
cursor: pointer;
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
align-items: center;
&:hover {
color: var(--semi-color-link);
border-color: var(--semi-color-link);
color: var(--semi-color-link);
}
span {
margin-left: 8px;
}
}
&.isEditable {
.itemWrap {
pointer-events: none;
&:hover {
border-color: var(--semi-color-border);
color: var(--semi-color-text-1);
}
}
}
}

44
packages/client/src/components/tiptap/wrappers/documentReference/index.module.scss
View File

@ -1,32 +1,19 @@
.wrap {
margin-top: 0.75em;
margin-top: .75em;
border-radius: var(--border-radius);
&.isEditable {
padding: 12px;
.itemWrap {
pointer-events: none;
margin-top: 12px;
}
.empty {
margin-top: 12px;
}
}
.itemWrap {
display: flex;
align-items: center;
padding: 8px;
color: var(--semi-color-text-1);
text-decoration: none;
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
text-decoration: none;
color: var(--semi-color-text-1);
align-items: center;
&:hover {
color: var(--semi-color-link);
border-color: var(--semi-color-link);
color: var(--semi-color-link);
}
span {
@ -36,12 +23,25 @@
.empty {
display: flex;
align-items: center;
padding: 8px;
color: var(--semi-color-text-1);
text-decoration: none;
cursor: not-allowed;
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
text-decoration: none;
color: var(--semi-color-text-1);
cursor: not-allowed;
align-items: center;
}
&.isEditable {
padding: 12px;
.itemWrap {
margin-top: 12px;
pointer-events: none;
}
.empty {
margin-top: 12px;
}
}
}

32
packages/client/src/components/tiptap/wrappers/emojiList/index.module.scss
View File

@ -1,38 +1,38 @@
.items {
border-radius: var(--border-radius);
background-color: var(--semi-color-bg-0);
box-shadow: rgb(9 30 66 / 31%) 0px 0px 1px, rgb(9 30 66 / 25%) 0px 4px 8px -2px;
width: 200px;
max-height: 380px;
overflow-x: hidden;
overflow-y: auto;
background-color: var(--semi-color-bg-0);
border-radius: var(--border-radius);
box-shadow: rgb(9 30 66 / 31%) 0 0 1px, rgb(9 30 66 / 25%) 0 4px 8px -2px;
}
.item {
align-items: center;
border-radius: 0px;
box-sizing: border-box;
cursor: pointer;
display: flex;
flex: 0 0 auto;
background-color: rgb(255, 255, 255);
color: rgb(9, 30, 66);
fill: rgb(255, 255, 255);
text-decoration: none;
padding: 12px 12px 11px;
width: 100%;
padding: 12px 12px 11px;
color: rgb(9 30 66);
text-decoration: none;
cursor: pointer;
background-color: rgb(255 255 255);
border: 0;
border-radius: 0;
outline: 0;
flex: 0 0 auto;
align-items: center;
box-sizing: border-box;
fill: rgb(255 255 255);
&:hover {
background-color: #f4f5f7;
}
&.is-selected {
background-color: rgb(222, 235, 255);
color: rgb(0, 82, 204);
fill: rgb(222, 235, 255);
color: rgb(0 82 204);
text-decoration: none;
background-color: rgb(222 235 255);
fill: rgb(222 235 255);
}
img {

20
packages/client/src/components/tiptap/wrappers/iframe/index.module.scss
View File

@ -1,15 +1,13 @@
.wrap {
max-width: 100%;
height: 100%;
line-height: 0;
border-radius: var(--border-radius);
border: 1px solid var(--semi-color-border);
background-color: var(--semi-color-fill-0);
overflow: visible;
display: flex;
flex-direction: column;
height: 100%;
max-width: 100%;
overflow: hidden;
line-height: 0;
background-color: var(--semi-color-fill-0);
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
flex-direction: column;
.handlerWrap {
display: flex;
@ -17,11 +15,11 @@
}
.innerWrap {
flex: 1;
position: relative;
width: 100%;
border-radius: var(--border-radius);
overflow: hidden;
border-radius: var(--border-radius);
flex: 1;
}
:global {

6
packages/client/src/components/tiptap/wrappers/image/index.module.scss
View File

@ -1,11 +1,11 @@
.wrap {
display: flex;
justify-content: space-between;
align-items: center;
padding: 8px 16px;
cursor: pointer;
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
cursor: pointer;
justify-content: space-between;
align-items: center;
&:hover {
border: 1px solid var(--semi-color-link);

2
packages/client/src/components/tiptap/wrappers/image/index.tsx
View File

@ -3,7 +3,7 @@ import { Resizeable } from 'components/resizeable';
import { useEffect, useRef } from 'react';
import cls from 'classnames';
import { Typography, Spin } from '@douyinfe/semi-ui';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { uploadFile } from 'services/file';
import { extractFileExtension, extractFilename } from '../../services/file';
import styles from './index.module.scss';

32
packages/client/src/components/tiptap/wrappers/menuList/index.module.scss
View File

@ -1,38 +1,38 @@
.items {
border-radius: var(--border-radius);
background-color: var(--semi-color-bg-0);
box-shadow: rgb(9 30 66 / 31%) 0px 0px 1px, rgb(9 30 66 / 25%) 0px 4px 8px -2px;
width: 200px;
max-height: 380px;
overflow-x: hidden;
overflow-y: auto;
background-color: var(--semi-color-bg-0);
border-radius: var(--border-radius);
box-shadow: rgb(9 30 66 / 31%) 0 0 1px, rgb(9 30 66 / 25%) 0 4px 8px -2px;
}
.item {
align-items: center;
border-radius: 0px;
box-sizing: border-box;
cursor: pointer;
display: flex;
flex: 0 0 auto;
background-color: rgb(255, 255, 255);
color: rgb(9, 30, 66);
fill: rgb(255, 255, 255);
text-decoration: none;
padding: 12px 12px 11px;
width: 100%;
padding: 12px 12px 11px;
color: rgb(9 30 66);
text-decoration: none;
cursor: pointer;
background-color: rgb(255 255 255);
border: 0;
border-radius: 0;
outline: 0;
flex: 0 0 auto;
align-items: center;
box-sizing: border-box;
fill: rgb(255 255 255);
&:hover {
background-color: #f4f5f7;
}
&.is-selected {
background-color: rgb(222, 235, 255);
color: rgb(0, 82, 204);
fill: rgb(222, 235, 255);
color: rgb(0 82 204);
text-decoration: none;
background-color: rgb(222 235 255);
fill: rgb(222 235 255);
}
img {

99
packages/client/src/components/tiptap/wrappers/mind/index.module.scss
View File

@ -1,35 +1,75 @@
.wrap {
position: relative;
max-width: 100%;
line-height: 0;
overflow: visible;
line-height: 0;
outline: none;
:global {
/* stylelint-disable-next-line selector-type-no-unknown */
jmnodes {
/* stylelint-disable-next-line selector-type-no-unknown */
jmnode {
color: var(--semi-color-text-1);
background-color: var(--semi-color-fill-2);
outline: 2px solid transparent;
box-shadow: none;
&:first-of-type {
color: #fff;
background-color: var(--semi-color-link);
}
&.selected {
outline: 2px solid var(--semi-color-link);
}
input {
width: 100px !important;
height: 100%;
background-color: #fff;
border: 0;
outline: none;
}
}
/* stylelint-disable-next-line selector-type-no-unknown */
jmexpander {
display: flex;
justify-content: center;
align-items: center;
width: 12px;
height: 12px;
border-color: var(--semi-color-border);
}
}
}
.jsmindWrap {
position: absolute;
bottom: 0;
left: 50%;
bottom: 0px;
z-index: 200;
max-width: 100%;
transform: translate(-50%, 0);
opacity: 0;
padding-bottom: 10px;
opacity: 0;
transform: translate(-50%, 0);
.jsmindInnerWrap {
padding: 6px;
background-color: var(--semi-color-bg-2);
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
border: 1px solid var(--semi-color-border);
background-color: var(--semi-color-bg-2);
}
}
.renderWrap {
position: relative;
min-height: 50px;
border-radius: var(--border-radius);
border: 1px solid var(--semi-color-border);
overflow: hidden;
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
outline: none;
> input {
@ -48,11 +88,11 @@
bottom: 20px;
z-index: 1000;
padding: 4px 8px;
border-radius: var(--border-radius);
box-shadow: var(--box-shadow);
border: 1px solid var(--semi-color-border);
background-color: var(--semi-color-bg-2);
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
opacity: 0;
box-shadow: var(--box-shadow);
}
}
@ -74,41 +114,4 @@
padding: 10px;
border-top: 1px solid var(--semi-color-border);
}
:global {
jmnodes {
jmnode {
outline: 2px solid transparent;
color: var(--semi-color-text-1);
background-color: var(--semi-color-fill-2);
box-shadow: none;
&:first-of-type {
color: #fff;
background-color: var(--semi-color-link);
}
&.selected {
outline: 2px solid var(--semi-color-link);
}
input {
width: 100px !important;
height: 100%;
border: 0;
outline: none;
background-color: #fff;
}
}
jmexpander {
display: flex;
align-items: center;
justify-content: center;
width: 12px;
height: 12px;
border-color: var(--semi-color-border);
}
}
}
}

2
packages/client/src/components/tiptap/wrappers/status/index.module.scss
View File

@ -1,6 +1,6 @@
.wrap {
display: inline-block;
vertical-align: middle;
font-size: 0;
vertical-align: middle;
cursor: pointer;
}

2
packages/client/src/components/tiptap/wrappers/taskItem/index.module.scss
View File

@ -1,5 +1,5 @@
.wrap {
margin: 8px 0;
display: inline-flex;
justify-content: center;
margin: 8px 0;
}

4
packages/client/src/components/tooltip/index.tsx
View File

@ -1,9 +1,7 @@
import React from 'react';
import { Tooltip as SemiTooltip } from '@douyinfe/semi-ui';
import { Position } from '@douyinfe/semi-ui/tooltip';
import { useToggle } from 'hooks/useToggle';
let id = 0;
import { useToggle } from 'hooks/use-toggle';
interface IProps {
content: React.ReactNode;

2
packages/client/src/components/upload/index.tsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import { Upload as SemiUpload, Button, Toast } from '@douyinfe/semi-ui';
import { IconUpload } from '@douyinfe/semi-icons';
import { useAsyncLoading } from 'hooks/useAsyncLoading';
import { useAsyncLoading } from 'hooks/use-async-loading';
import { uploadFile } from 'services/file';
interface IProps {

2
packages/client/src/components/user/index.tsx
View File

@ -2,7 +2,7 @@ import React from 'react';
import { Dropdown, Typography, Avatar, Button } from '@douyinfe/semi-ui';
import { IconSpin } from '@douyinfe/semi-icons';
import { useUser } from 'data/user';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { UserSetting } from './setting';
const { Text } = Typography;

2
packages/client/src/components/wiki-creator/index.tsx
View File

@ -1,6 +1,6 @@
import React from 'react';
import { Button } from '@douyinfe/semi-ui';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { WikiCreator as WikiCreatorForm } from 'components/wiki/create';
export const WikiCreator: React.FC = ({ children }) => {

4
packages/client/src/components/wiki-or-document-creator/index.tsx
View File

@ -1,8 +1,8 @@
import React from 'react';
import { Dropdown, Button } from '@douyinfe/semi-ui';
import { IconChevronDown } from '@douyinfe/semi-icons';
import { useToggle } from 'hooks/useToggle';
import { useQuery } from 'hooks/useQuery';
import { useToggle } from 'hooks/use-toggle';
import { useQuery } from 'hooks/use-query';
import { WikiCreator } from 'components/wiki/create';
import { DocumentCreator } from 'components/document/create';

11
packages/client/src/components/wiki/card/index.module.scss
View File

@ -2,23 +2,22 @@
width: 100%;
> a {
margin: 8px 0;
display: flex;
flex-direction: column;
width: 100%;
max-height: 260px;
padding: 12px 16px 16px;
border-radius: 5px;
border: 1px solid var(--semi-color-border);
margin: 8px 0;
cursor: pointer;
border: 1px solid var(--semi-color-border);
border-radius: 5px;
flex-direction: column;
> header {
display: flex;
justify-content: space-between;
align-items: center;
color: var(--semi-color-primary);
margin-bottom: 12px;
color: var(--semi-color-primary);
.rightWrap {
opacity: 0;

11
packages/client/src/components/wiki/pin-card/index.module.scss
View File

@ -2,23 +2,22 @@
width: 100%;
> a {
margin: 8px 0;
display: flex;
flex-direction: column;
width: 100%;
max-height: 260px;
padding: 12px 16px 16px;
border-radius: 5px;
border: 1px solid var(--semi-color-border);
margin: 8px 0;
cursor: pointer;
border: 1px solid var(--semi-color-border);
border-radius: 5px;
flex-direction: column;
> header {
display: flex;
justify-content: space-between;
align-items: center;
color: var(--semi-color-primary);
margin-bottom: 12px;
color: var(--semi-color-primary);
.rightWrap {
opacity: 0;

6
packages/client/src/components/wiki/setting/base/index.module.scss
View File

@ -8,14 +8,14 @@
img {
width: 104px;
height: 96px;
border-radius: 4px;
margin-bottom: 16px;
border-radius: 4px;
}
}
.right {
flex: 1;
display: flex;
flex: 1;
flex-direction: column;
justify-content: space-between;
overflow: auto;
@ -59,8 +59,8 @@
.placeholderWrapper {
width: 100%;
overflow: auto;
margin: 16px 0;
overflow: auto;
.coverPlaceholder {
flex-shrink: 0;

45
packages/client/src/components/wiki/setting/documents/index.module.scss
View File

@ -1,6 +1,7 @@
/* stylelint-disable */
.statusWrap {
margin-top: 16px;
padding: 10px 12px;
margin-top: 16px;
border: 1px solid var(--semi-color-border);
border-radius: 4px;
@ -9,30 +10,13 @@
}
}
.selectedItem {
:global {
.semi-icon-close {
visibility: hidden;
color: var(--semi-color-tertiary);
}
}
&:hover {
:global {
.semi-icon-close {
visibility: visible;
}
}
}
}
.selectedItem,
.sourceItem {
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
height: 36px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 12px;
&:hover {
@ -40,8 +24,8 @@
}
.info {
margin-left: 8px;
flex-grow: 1;
margin-left: 8px;
}
.name {
@ -56,6 +40,23 @@
}
}
.selectedItem {
:global {
.semi-icon-close {
color: var(--semi-color-tertiary);
visibility: hidden;
}
}
&:hover {
:global {
.semi-icon-close {
visibility: visible;
}
}
}
}
.transferWrap {
width: 100%;
overflow: auto;

2
packages/client/src/components/wiki/setting/users/index.tsx
View File

@ -5,7 +5,7 @@ import { useWikiUsers } from 'data/wiki';
import { DataRender } from 'components/data-render';
import { LocaleTime } from 'components/locale-time';
import { getWikiUserRoleText } from '@think/domains';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { Placeholder } from './placeholder';
import { AddUser } from './add';
import { EditUser } from './edit';

132
packages/client/src/components/wiki/tocs/index.module.scss
View File

@ -10,76 +10,11 @@
}
}
.navItemWrap {
display: flex;
align-items: center;
justify-content: space-between;
color: var(--semi-color-text-0);
&.hoverable {
&:hover {
background-color: var(--semi-color-fill-0);
color: var(--semi-color-text-0);
}
}
&.isActive {
background-color: var(--semi-color-primary-light-default);
color: var(--semi-color-primary);
}
.navItem {
display: flex;
align-items: center;
width: 100%;
padding: 12px 16px;
font-size: 14px;
border-radius: var(--semi-border-radius-small);
cursor: pointer;
> span {
display: flex;
align-items: center;
}
.icon {
display: flex;
align-items: center;
justify-content: center;
min-width: 24px;
min-height: 24px;
margin: 0 6px 0 0;
:global {
.semi-icon-default {
font-size: 24px;
}
}
}
.title {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: var(--semi-color-text-0);
}
}
.rightWrap {
padding-right: 4px;
}
}
.docListTitle {
margin: 12px 0.5rem;
}
.treeInnerWrap {
:global {
.semi-tree-option-list-block .semi-tree-option-selected {
background-color: var(--semi-color-primary-light-default);
color: var(--semi-color-primary);
background-color: var(--semi-color-primary-light-default);
}
}
@ -103,3 +38,68 @@
}
}
}
.navItemWrap {
display: flex;
justify-content: space-between;
align-items: center;
color: var(--semi-color-text-0);
&.hoverable {
&:hover {
color: var(--semi-color-text-0);
background-color: var(--semi-color-fill-0);
}
}
&.isActive {
color: var(--semi-color-primary);
background-color: var(--semi-color-primary-light-default);
}
.navItem {
display: flex;
width: 100%;
padding: 12px 16px;
font-size: 14px;
cursor: pointer;
border-radius: var(--semi-border-radius-small);
align-items: center;
> span {
display: flex;
align-items: center;
}
.icon {
display: flex;
justify-content: center;
align-items: center;
min-width: 24px;
min-height: 24px;
margin: 0 6px 0 0;
:global {
.semi-icon-default {
font-size: 24px;
}
}
}
.title {
overflow: hidden;
color: var(--semi-color-text-0);
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
}
}
.rightWrap {
padding-right: 4px;
}
}
.docListTitle {
margin: 12px .5rem;
}

2
packages/client/src/components/wiki/tocs/index.tsx
View File

@ -3,7 +3,7 @@ import { useEffect, useState } from 'react';
import { Avatar, Button, Typography, Skeleton } from '@douyinfe/semi-ui';
import { IconPlus } from '@douyinfe/semi-icons';
import { useWikiDetail, useWikiTocs } from 'data/wiki';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { Seo } from 'components/seo';
import { findParents } from 'components/wiki/tocs/utils';
import { IconDocument, IconSetting, IconOverview } from 'components/icons';

2
packages/client/src/components/wiki/tocs/manager/index.module.scss
View File

@ -3,9 +3,9 @@
.tocsWrap {
height: 420px;
overflow: auto;
border: 1px solid var(--semi-color-border);
border-radius: var(--border-radius);
overflow: auto;
}
.btnWrap {

2
packages/client/src/components/wiki/tocs/tree.tsx
View File

@ -2,7 +2,7 @@ import React, { useEffect, useState, useCallback } from 'react';
import Link from 'next/link';
import { Tree as SemiTree, Button, Typography } from '@douyinfe/semi-ui';
import { IconMore, IconPlus } from '@douyinfe/semi-icons';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { DocumentActions } from 'components/document/actions';
import { DocumentCreator as DocumenCreatorForm } from 'components/document/create';
import { EventEmitter } from 'helpers/event-emitter';

2
packages/client/src/data/document.ts
View File

@ -1,7 +1,7 @@
import type { IUser, IDocument } from '@think/domains';
import useSWR from 'swr';
import { useState, useCallback, useEffect } from 'react';
import { useAsyncLoading } from 'hooks/useAsyncLoading';
import { useAsyncLoading } from 'hooks/use-async-loading';
import { HttpClient } from 'services/HttpClient';
import { getPublicDocumentDetail } from 'services/document';

0
packages/client/src/hooks/useAsyncLoading.tsx → packages/client/src/hooks/use-async-loading.tsx
View File

0
packages/client/src/hooks/useDocumentStyle.ts → packages/client/src/hooks/use-document-style.ts
View File

2
packages/client/src/hooks/useDragableWidth.ts → packages/client/src/hooks/use-dragable-width.ts
View File

@ -1,6 +1,6 @@
import { useEffect, useRef } from 'react';
import useSWR from 'swr';
import { useWindowSize } from 'hooks/useWindowSize';
import { useWindowSize } from 'hooks/use-window-size';
import { setStorage, getStorage } from 'helpers/storage';
const key = 'dragable-menu-width';

0
packages/client/src/hooks/useMount.tsx → packages/client/src/hooks/use-mount.tsx
View File

0
packages/client/src/hooks/useQuery.tsx → packages/client/src/hooks/use-query.tsx
View File

0
packages/client/src/hooks/useTheme.tsx → packages/client/src/hooks/use-theme.tsx
View File

0
packages/client/src/hooks/useToggle.tsx → packages/client/src/hooks/use-toggle.tsx
View File

0
packages/client/src/hooks/useWindowSize.tsx → packages/client/src/hooks/use-window-size.tsx
View File

5
packages/client/src/hooks/useIsomorphicLayoutEffect.tsx
View File

@ -1,5 +0,0 @@
import { useEffect, useLayoutEffect } from 'react';
const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
export default useIsomorphicLayoutEffect;

7
packages/client/src/layouts/double-column/index.module.scss
View File

@ -1,13 +1,12 @@
.wrap {
display: flex;
flex-direction: column;
height: 100%;
background-color: var(--semi-color-nav-bg);
.contentWrap {
flex: 1;
display: flex;
flex: 1;
flex-wrap: nowrap;
overflow: hidden;
@ -32,11 +31,11 @@
.collapseBtn {
position: absolute;
z-index: 100;
top: 1rem;
right: 0;
transform: translate(50%);
z-index: 100;
opacity: 0;
transform: translate(50%);
&.isCollapsed {
opacity: 1;

2
packages/client/src/layouts/double-column/index.tsx
View File

@ -3,7 +3,7 @@ import cls from 'classnames';
import { Layout as SemiLayout, Button } from '@douyinfe/semi-ui';
import { IconChevronLeft, IconChevronRight } from '@douyinfe/semi-icons';
import SplitPane from 'react-split-pane';
import { useDragableWidth, MIN_WIDTH, MAX_WIDTH } from 'hooks/useDragableWidth';
import { useDragableWidth, MIN_WIDTH, MAX_WIDTH } from 'hooks/use-dragable-width';
import { RouterHeader } from '../router-header';
import styles from './index.module.scss';

4
packages/client/src/layouts/public-double-column/index.module.scss
View File

@ -23,11 +23,11 @@
.collapseBtn {
position: absolute;
z-index: 100;
top: 1rem;
right: 0;
transform: translate(50%);
z-index: 100;
opacity: 0;
transform: translate(50%);
&.isCollapsed {
opacity: 1;

2
packages/client/src/layouts/public-double-column/index.tsx
View File

@ -3,7 +3,7 @@ import cls from 'classnames';
import { Layout as SemiLayout, Button } from '@douyinfe/semi-ui';
import { IconChevronLeft, IconChevronRight } from '@douyinfe/semi-icons';
import SplitPane from 'react-split-pane';
import { useDragableWidth, MIN_WIDTH, MAX_WIDTH } from 'hooks/useDragableWidth';
import { useDragableWidth, MIN_WIDTH, MAX_WIDTH } from 'hooks/use-dragable-width';
import styles from './index.module.scss';
const { Sider, Content } = SemiLayout;

2
packages/client/src/layouts/router-header/Recent.tsx
View File

@ -8,7 +8,7 @@ import { DataRender } from 'components/data-render';
import { LocaleTime } from 'components/locale-time';
import { DocumentStar } from 'components/document/star';
import { IconDocumentFill } from 'components/icons/IconDocumentFill';
import { Placeholder } from './Placeholder';
import { Placeholder } from './placeholder';
import styles from './index.module.scss';
const { Text } = Typography;

2
packages/client/src/layouts/router-header/Wiki.tsx
View File

@ -7,7 +7,7 @@ import { useStaredWikis, useWikiDetail } from 'data/wiki';
import { Empty } from 'components/empty';
import { DataRender } from 'components/data-render';
import { WikiStar } from 'components/wiki/star';
import { Placeholder } from './Placeholder';
import { Placeholder } from './placeholder';
import styles from './index.module.scss';
const { Text } = Typography;

6
packages/client/src/layouts/router-header/index.module.scss
View File

@ -11,22 +11,22 @@
border-radius: var(--semi-border-radius-small);
&:hover {
background-color: var(--semi-color-fill-0);
color: var(--semi-color-text-0);
background-color: var(--semi-color-fill-0);
}
.item {
display: flex;
align-items: center;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 8px 16px;
.leftWrap {
display: flex;
align-items: center;
color: var(--semi-color-primary);
padding-left: 8px;
color: var(--semi-color-primary);
svg {
fill: var(--semi-color-primary);

132
packages/client/src/layouts/router-header/index.tsx
View File

@ -8,12 +8,75 @@ import { LogoImage, LogoText } from 'components/logo';
import { Theme } from 'components/theme';
import { Message } from 'components/message';
import { Search } from 'components/search';
import { useWindowSize } from 'hooks/useWindowSize';
import { Recent } from './Recent';
import { Wiki } from './Wiki';
import { useWindowSize } from 'hooks/use-window-size';
import { Recent } from './recent';
import { Wiki } from './wiki';
const { Header: SemiHeader } = SemiLayout;
const menus = [
{
itemKey: '/',
text: (
<Link href="/">
<a>主页</a>
</Link>
),
onClick: () => {
Router.push({
pathname: `/`,
});
},
},
{
itemKey: '/recent',
text: <Recent />,
},
{
itemKey: '/wiki',
text: <Wiki />,
},
{
itemKey: '/star',
text: (
<Link href="/star">
<a>收藏</a>
</Link>
),
onClick: () => {
Router.push({
pathname: `/star`,
});
},
},
{
itemKey: '/template',
text: (
<Link href="/template">
<a>模板</a>
</Link>
),
onClick: () => {
Router.push({
pathname: `/template`,
});
},
},
{
itemKey: '/find',
text: (
<Link href="/find">
<a>发现</a>
</Link>
),
onClick: () => {
Router.push({
pathname: `/find`,
});
},
},
];
export const RouterHeader: React.FC = () => {
const { pathname } = useRouter();
const windowSize = useWindowSize();
@ -30,68 +93,7 @@ export const RouterHeader: React.FC = () => {
</Space>
}
selectedKeys={[pathname || '/']}
items={[
{
itemKey: '/',
text: (
<Link href="/">
<a>主页</a>
</Link>
),
onClick: () => {
Router.push({
pathname: `/`,
});
},
},
{
itemKey: '/recent',
text: <Recent />,
},
{
itemKey: '/wiki',
text: <Wiki />,
},
{
itemKey: '/star',
text: (
<Link href="/star">
<a>收藏</a>
</Link>
),
onClick: () => {
Router.push({
pathname: `/star`,
});
},
},
{
itemKey: '/template',
text: (
<Link href="/template">
<a>模板</a>
</Link>
),
onClick: () => {
Router.push({
pathname: `/template`,
});
},
},
{
itemKey: '/find',
text: (
<Link href="/find">
<a>发现</a>
</Link>
),
onClick: () => {
Router.push({
pathname: `/find`,
});
},
},
]}
items={menus}
footer={
<Space>
<WikiOrDocumentCreator />

6
packages/client/src/pages/index.module.scss
View File

@ -1,9 +1,9 @@
.wikiItemWrap {
cursor: pointer;
border: 1px solid var(--semi-color-border) !important;
background-color: var(--semi-color-bg-2);
padding: 12px 16px !important;
margin: 8px 2px;
cursor: pointer;
background-color: var(--semi-color-bg-2);
border: 1px solid var(--semi-color-border) !important;
}
.titleWrap {

2
packages/client/src/pages/index.tsx
View File

@ -3,7 +3,7 @@ import type { IDocument } from '@think/domains';
import Link from 'next/link';
import React from 'react';
import { Typography, Button, Table, Spin, List } from '@douyinfe/semi-ui';
import { useToggle } from 'hooks/useToggle';
import { useToggle } from 'hooks/use-toggle';
import { Seo } from 'components/seo';
import { DataRender } from 'components/data-render';
import { SingleColumnLayout } from 'layouts/single-column';

Some files were not shown because too many files have changed in this diff Show More