This commit is contained in:
abearxiong 2025-03-26 11:53:27 +08:00
parent bc02a11dc6
commit cc070a81a1
13 changed files with 4555 additions and 538 deletions

3
.gitignore vendored
View File

@ -25,4 +25,5 @@ dist-ssr
*.sw?
tsconfig.app.tsbuildinfo
tsconfig.node.tsbuildinfo
tsconfig.node.tsbuildinfo
.turbo

6
.gitmodules vendored Normal file
View File

@ -0,0 +1,6 @@
[submodule "submodules/store"]
path = submodules/store
url = git@git.xiongxiao.me:kevisual/store.git
[submodule "submodules/query-mark"]
path = submodules/query-mark
url = git@git.xiongxiao.me:kevisual/kevisual-query-mark.git

View File

@ -1,13 +1,30 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
<style>
html,
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
#root {
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

View File

@ -1,29 +1,39 @@
{
"name": "draw",
"name": "@kevisual/draw",
"version": "0.0.1",
"description": "",
"main": "index.js",
"basename": "/",
"basename": "/gh/draw",
"scripts": {
"dev": "vite",
"dev:web": "cross-env WEB_DEV=true vite --mode web",
"build": "vite build",
"lint": "eslint .",
"preview": "vite preview",
"pub": "envision deploy ./dist -k vite-react -v 0.0.1",
"ev": "npm run build && npm run deploy"
"pub": "envision deploy ./dist -k draw -v 0.0.1",
"ev": "npm run build && npm run deploy",
"dev:lib": "turbo run dev:lib --filter=./submodules/*"
},
"files": [
"dist"
],
"author": "abearxiong <xiongxiao@xiongxiao.me>",
"license": "MIT",
"dependencies": {
"@ant-design/icons": "^6.0.0",
"@emotion/react": "^11.14.0",
"@emotion/styled": "^11.14.0",
"@excalidraw/excalidraw": "^0.18.0",
"@kevisual/query": "0.0.15",
"@kevisual/router": "0.0.9",
"@kevisual/store": "workspace:*",
"@mui/material": "^6.4.8",
"antd": "^5.24.5",
"clsx": "^2.1.1",
"dayjs": "^1.11.13",
"immer": "^10.1.1",
"lodash-es": "^4.17.21",
"lucide-react": "^0.484.0",
"nanoid": "^5.1.5",
"react": "^19.0.0",
"react-dom": "^19.0.0",
@ -48,8 +58,10 @@
"tailwind-merge": "^3.0.2",
"tailwindcss": "^4.0.16",
"tailwindcss-animate": "^1.0.7",
"turbo": "^2.4.4",
"typescript": "^5.8.2",
"typescript-eslint": "^8.28.0",
"vite": "^6.2.3"
}
},
"packageManager": "pnpm@10.6.5"
}

4881
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

2
pnpm-workspace.yaml Normal file
View File

@ -0,0 +1,2 @@
packages:
- 'submodules/*'

View File

@ -1,12 +1,11 @@
import { basename } from './modules/basename';
import { Draw } from './pages/Draw';
console.log('basename', basename);
export const App = () => {
return (
<div className='bg-slate-200 w-full h-full border'>
<div className='test-loading bg-black'>
<div></div>
</div>
<div className='bg-slate-200 w-full h-full'>
<Draw />
</div>
);
};

64
src/pages/Draw.tsx Normal file
View File

@ -0,0 +1,64 @@
import { useEffect, useLayoutEffect, useRef, useState } from 'react';
import { createMarkStore, store } from '../store';
console.log('store', store);
import { StoreContextProvider, useStore } from '@kevisual/store/react';
import { LineChart } from 'lucide-react';
import { useShallow } from 'zustand/shallow';
import { Core } from './core/Excalidraw';
import { OrderedExcalidrawElement } from '@excalidraw/excalidraw/element/types';
export const DrawLayout = ({ children }: { children: React.ReactNode }) => {
return (
<StoreContextProvider id='draw'>
<div className='h-full w-full'>{children}</div>
<DrawHeader />
</StoreContextProvider>
);
};
export const Draw = () => {
useLayoutEffect(() => {
// @ts-ignore
window.EXCALIDRAW_ASSET_PATH = 'https://esm.sh/@excalidraw/excalidraw@0.18.0/dist/prod/';
// window.EXCALIDRAW_ASSET_PATH = '/';
}, []);
return (
<DrawLayout>
<ExcaliDrawComponent />
</DrawLayout>
);
};
export const DrawHeader = () => {
const store = useStore(
useShallow((value: any) => {
return {
mark: value.mark,
setMark: value.setMark,
setInfo: value.setInfo,
};
}),
);
console.log('store show', store);
const init = useRef(false);
useEffect(() => {
if (!init.current && store.mark) {
init.current = true;
store.setMark('1234');
setTimeout(() => {
store.setMark('info4');
}, 1000);
}
}, [store.mark]);
return (
<div className='fixed left-0 top-0 z-10 h-10 w-10 bg-red-500'>
<button>
<LineChart />
</button>
</div>
);
};
export const ExcaliDrawComponent = () => {
return (
<StoreContextProvider id='draw2' stateCreator={createMarkStore}>
<Core />
</StoreContextProvider>
);
};

View File

@ -0,0 +1,15 @@
import { Excalidraw } from '@excalidraw/excalidraw';
import '@excalidraw/excalidraw/index.css';
import { OrderedExcalidrawElement } from '@excalidraw/excalidraw/element/types';
import { useState } from 'react';
export const Core = () => {
return (
<Excalidraw
initialData={{ elements: [] }}
onChange={(elements) => {
console.log('elements', elements);
}}
/>
);
};

21
src/store/index.ts Normal file
View File

@ -0,0 +1,21 @@
import { StoreManager } from '@kevisual/store';
import { useContextKey } from '@kevisual/store/context';
import { StateCreator, StoreApi } from 'zustand';
export const store = useContextKey('store', () => {
return new StoreManager();
});
type MarkStore = {
mark: string;
setMark: (mark: string) => void;
info: string;
setInfo: (info: string) => void;
};
export const createMarkStore = (get: any, set: any, store: any): MarkStore => {
return {
mark: 'test',
setMark: (mark: string) => set(() => ({ mark })),
info: 'test info',
setInfo: (info: string) => set(() => ({ info })),
};
};

View File

@ -18,5 +18,4 @@
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["vite.config.ts"]
}

22
turbo.json Normal file
View File

@ -0,0 +1,22 @@
{
"$schema": "https://turbo.build/schema.json",
"tasks": {
"build": {
"dependsOn": [
"^build"
],
"outputs": [
"dist/**"
]
},
"dev:lib": {
"persistent": true,
"cache": true
},
"build:lib": {
"dependsOn": [
"^build:lib"
]
}
}
}

View File

@ -2,7 +2,7 @@ import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import path from 'path';
import tailwindcss from '@tailwindcss/vite';
import pkgs from './template/package.json' with { type: 'json' };
import pkgs from './package.json' with { type: 'json' };
import basicSsl from '@vitejs/plugin-basic-ssl';
const version = pkgs.version || '0.0.1';
@ -11,11 +11,7 @@ const isDev = process.env.NODE_ENV === 'development';
const basename = isDev ? '/' : pkgs?.basename || '/';
const plugins = []
const isWeb = false;
if(isWeb) {
// 在bolt.new的页面没有ssl
plugins.push(basicSsl())
}
plugins.push(basicSsl());
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react(), tailwindcss(), ...plugins],
@ -34,7 +30,7 @@ export default defineConfig({
target: 'esnext',
},
server: {
port: 6004,
port: 6006,
host: '0.0.0.0',
proxy: {
'/api': {