admin/flowgram.ai
1
0
Fork 0
mirror of https://gitee.com/ByteDance/flowgram.ai.git synced 2025-07-07 17:43:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #38 from dragooncjw/fix/resource

Browse Source 
fix: static resource
This commit is contained in:
chenjiawei.inizio 2025-03-07 15:11:33 +08:00 committed by GitHub
commit a78d25e30d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
13 changed files with 67 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
apps/docs/src/en/examples/fixed-layout/fixed-feature-overview.mdx
View File

@ -26,7 +26,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
<td>Minimap</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/minimap.gif" />
<img loading="lazy" src="/fixed-layout/minimap.gif" />
</div>
</td>
</tr>
@ -34,7 +34,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
<td>Undo/Redo</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/redo-undo.gif" />
<img loading="lazy" src="/fixed-layout/redo-undo.gif" />
</div>
</td>
</tr>
@ -42,7 +42,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
<td>Copy/Paste (Support Shortcut)</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/copypaste.gif" />
<img loading="lazy" src="/fixed-layout/copypaste.gif" />
</div>
</td>
</tr>
@ -55,7 +55,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
<td>
<div className="rs-center">
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/dragdrop.gif" />
<img loading="lazy" src="/fixed-layout/dragdrop.gif" />
</div>
</div>
</td>
@ -66,7 +66,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/layout-change.gif" />
<img loading="lazy" src="/fixed-layout/layout-change.gif" />
</div>
</td>
</tr>
@ -76,7 +76,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/fold.gif" />
<img loading="lazy" src="/fixed-layout/fold.gif" />
</div>
</td>
</tr>
@ -86,7 +86,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/group.gif" />
<img loading="lazy" src="/fixed-layout/group.gif" />
</div>
</td>
</tr>

4
apps/docs/src/en/examples/free-layout/free-feature-overview.mdx
View File

@ -29,7 +29,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-free-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/autolayout.gif" />
<img loading="lazy" src="/free-layout/autolayout.gif" />
</div>
</td>
</tr>
@ -39,7 +39,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-free-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/snap.gif" />
<img loading="lazy" src="/free-layout/snap.gif" />
</div>
</td>
</tr>

6
apps/docs/src/en/guide/advanced/form.mdx
View File

@ -130,7 +130,7 @@ The following example shows:
3. How to display the error of the array item
<div className="rs-center" >
<img loading="lazy" src="@/public/field-array.gif" style={{ maxWidth: 600 }}/>
<img loading="lazy" src="/field-array.gif" style={{ maxWidth: 600 }}/>
</div>
```tsx pure
@ -203,7 +203,7 @@ export const arrayMeta: FormMeta = {
Validation logic is configured globally, and the validation logic is declared by the form item path
<div className="rs-center" >
<img loading="lazy" src="@/public/form-validate.gif" style={{ maxWidth: 600 }}/>
<img loading="lazy" src="/form-validate.gif" style={{ maxWidth: 600 }}/>
</div>
```tsx pure
@ -304,7 +304,7 @@ The following example shows:
- onArrayDelete
<div className="rs-center" >
<img loading="lazy" src="@/public/form-effect.gif" style={{ maxWidth: 600 }}/>
<img loading="lazy" src="/form-effect.gif" style={{ maxWidth: 600 }}/>
</div>
```tsx pure

4
apps/docs/src/en/guide/concepts/reactflow.mdx
View File

@ -26,11 +26,11 @@ Compared to ReactFlow, FlowGram aims to provide a complete out-of-the-box soluti
<tr>
<td>
<div className="rs-tip">Since events are bound to SVG, it's difficult to click on elements when zoomed out</div>
<img loading="lazy" src="@/public/reactflow/reactflow-render.gif"/>
<img loading="lazy" src="/reactflow/reactflow-render.gif"/>
</td>
<td>
<div className="rs-tip">FlowGram's events use global mousemove monitoring and calculate positions with Threshold, allowing clicks even when zoomed out, while also supporting edge reconnection</div>
<img loading="lazy" src="@/public/reactflow/reactflow-interaction.gif"/>
<img loading="lazy" src="/reactflow/reactflow-interaction.gif"/>
</td>
</tr>
</table>

4
apps/docs/src/en/guide/index/introduction.mdx
View File

@ -5,8 +5,8 @@ See: https://reactflow.dev/examples/nodes/custom-node
- ReactFlow's interaction customization cost is high. As shown below, it's difficult to select points when the canvas is zoomed out, and it doesn't support drag-and-drop line reconnection
<table>
<tr>
<td><img loading="lazy" src="@/public/reactflow/reactflow-render.gif"/></td>
<td><img loading="lazy" src="@/public/reactflow/reactflow-interaction.gif"/></td>
<td><img loading="lazy" src="/reactflow/reactflow-render.gif"/></td>
<td><img loading="lazy" src="/reactflow/reactflow-interaction.gif"/></td>
</tr>
</table>

34
apps/docs/src/en/guide/introduction.mdx
View File

@ -23,7 +23,7 @@ In today's AI-driven era, we are focusing more on how to empower workflows with
Fixed layout with nodes/branches supporting specified position drag and drop, offering compound nodes like branches and loops
</div>
<div>
<img loading="lazy" src="@/public/fixed-layout/fixed-layout-demo.gif"/>
<img loading="lazy" src="/fixed-layout/fixed-layout-demo.gif"/>
</div>
</div>
<div>
@ -36,7 +36,7 @@ In today's AI-driven era, we are focusing more on how to empower workflows with
Free layout where nodes can be moved to any position and connected through free connections
</div>
<div>
<img loading="lazy" src="@/public/free-layout/free-layout-demo.gif"/>
<img loading="lazy" src="/free-layout/free-layout-demo.gif"/>
</div>
</div>
</div>
@ -53,7 +53,7 @@ Providing a set of interactive best practices for smoother workflow operations
Motion animations in web applications can be traced back to Material Design, which suggests that element changes in width, height, or position need a transition process. The canvas engine separates the drawing of lines and nodes, greatly reducing the cost of implementing motion transitions
</p>
<div className="rs-center">
<img loading="lazy" src="@/public/common/motion.gif" />
<img loading="lazy" src="/common/motion.gif" />
</div>
</td>
</tr>
@ -64,7 +64,7 @@ Providing a set of interactive best practices for smoother workflow operations
Gestures refer to Mac touchpad two-finger spread/pinch for canvas zoom in/out, or holding space to drag the canvas, interactions inspired by Sketch and Figma
</p>
<div className="rs-center">
<img loading="lazy" src="@/public/common/touch-pad.gif" />
<img loading="lazy" src="/common/touch-pad.gif" />
</div>
</td>
</tr>
@ -72,7 +72,7 @@ Providing a set of interactive best practices for smoother workflow operations
<td>Minimap</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/minimap.gif" />
<img loading="lazy" src="/fixed-layout/minimap.gif" />
</div>
</td>
</tr>
@ -80,7 +80,7 @@ Providing a set of interactive best practices for smoother workflow operations
<td>Undo/Redo</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/redo-undo.gif" />
<img loading="lazy" src="/fixed-layout/redo-undo.gif" />
</div>
</td>
</tr>
@ -88,7 +88,7 @@ Providing a set of interactive best practices for smoother workflow operations
<td>Copy/Paste (Shortcut Support)</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/copypaste.gif" />
<img loading="lazy" src="/fixed-layout/copypaste.gif" />
</div>
</td>
</tr>
@ -102,7 +102,7 @@ Providing a set of interactive best practices for smoother workflow operations
<td>
<div className="rs-center">
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/dragdrop.gif" />
<img loading="lazy" src="/fixed-layout/dragdrop.gif" />
</div>
</div>
</td>
@ -114,7 +114,7 @@ Providing a set of interactive best practices for smoother workflow operations
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/layout-change.gif" />
<img loading="lazy" src="/fixed-layout/layout-change.gif" />
</div>
</td>
</tr>
@ -125,7 +125,7 @@ Providing a set of interactive best practices for smoother workflow operations
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/fold.gif" />
<img loading="lazy" src="/fixed-layout/fold.gif" />
</div>
</td>
</tr>
@ -136,7 +136,7 @@ Providing a set of interactive best practices for smoother workflow operations
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/group.gif" />
<img loading="lazy" src="/fixed-layout/group.gif" />
</div>
</td>
</tr>
@ -147,7 +147,7 @@ Providing a set of interactive best practices for smoother workflow operations
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/autolayout.gif" />
<img loading="lazy" src="/free-layout/autolayout.gif" />
</div>
</td>
</tr>
@ -158,7 +158,7 @@ Providing a set of interactive best practices for smoother workflow operations
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/snap.gif" />
<img loading="lazy" src="/free-layout/snap.gif" />
</div>
</td>
</tr>
@ -169,7 +169,7 @@ Providing a set of interactive best practices for smoother workflow operations
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/loop.gif" />
<img loading="lazy" src="/free-layout/loop.gif" />
</div>
</td>
</tr>
@ -185,7 +185,7 @@ Providing a set of interactive best practices for smoother workflow operations
</a>
</div>
<div>
<img loading="lazy" src="@/public/ref-coze-en.png"/>
<img loading="lazy" src="/ref-coze-en.png"/>
</div>
</div>
<div>
@ -193,7 +193,7 @@ Providing a set of interactive best practices for smoother workflow operations
Lark Low-code Platform Workflow
</a>
<div>
<img loading="lazy" src="@/public/ref-apaas-en.png"/>
<img loading="lazy" src="/ref-apaas-en.png"/>
</div>
</div>
<div>
@ -201,7 +201,7 @@ Providing a set of interactive best practices for smoother workflow operations
Lark Base Workflow
</a>
<div>
<img loading="lazy" src="@/public/ref-bitable-en.png"/>
<img loading="lazy" src="/ref-bitable-en.png"/>
</div>
</div>
</div>

14
apps/docs/src/zh/examples/fixed-layout/fixed-feature-overview.mdx
View File

@ -26,7 +26,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
<td>缩略图</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/minimap.gif" />
<img loading="lazy" src="/fixed-layout/minimap.gif" />
</div>
</td>
</tr>
@ -34,7 +34,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
<td>撤销/重做</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/redo-undo.gif" />
<img loading="lazy" src="/fixed-layout/redo-undo.gif" />
</div>
</td>
</tr>
@ -42,7 +42,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
<td>复制/粘贴(支持快捷键)</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/copypaste.gif" />
<img loading="lazy" src="/fixed-layout/copypaste.gif" />
</div>
</td>
</tr>
@ -55,7 +55,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
<td>
<div className="rs-center">
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/dragdrop.gif" />
<img loading="lazy" src="/fixed-layout/dragdrop.gif" />
</div>
</div>
</td>
@ -66,7 +66,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/layout-change.gif" />
<img loading="lazy" src="/fixed-layout/layout-change.gif" />
</div>
</td>
</tr>
@ -76,7 +76,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/fold.gif" />
<img loading="lazy" src="/fixed-layout/fold.gif" />
</div>
</td>
</tr>
@ -86,7 +86,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-fixed-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/group.gif" />
<img loading="lazy" src="/fixed-layout/group.gif" />
</div>
</td>
</tr>

4
apps/docs/src/zh/examples/free-layout/free-feature-overview.mdx
View File

@ -29,7 +29,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-free-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/autolayout.gif" />
<img loading="lazy" src="/free-layout/autolayout.gif" />
</div>
</td>
</tr>
@ -39,7 +39,7 @@ https://github.com/bytedance/flowgram.ai/tree/main/apps/demo-free-layout
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/snap.gif" />
<img loading="lazy" src="/free-layout/snap.gif" />
</div>
</td>
</tr>

6
apps/docs/src/zh/guide/advanced/form.mdx
View File

@ -130,7 +130,7 @@ const render = () => (
3. 数组项错误的展示
<div className="rs-center" >
<img loading="lazy" src="@/public/field-array.gif" style={{ maxWidth: 600 }}/>
<img loading="lazy" src="/field-array.gif" style={{ maxWidth: 600 }}/>
</div>
```tsx pure
@ -203,7 +203,7 @@ export const arrayMeta: FormMeta = {
校验逻辑配置在全局，通过表单项路径声明校验逻辑
<div className="rs-center" >
<img loading="lazy" src="@/public/form-validate.gif" style={{ maxWidth: 600 }}/>
<img loading="lazy" src="/form-validate.gif" style={{ maxWidth: 600 }}/>
</div>
```tsx pure
@ -304,7 +304,7 @@ export const VALIDATE_EXAMPLE: FormMeta = {
- onArrayDelete
<div className="rs-center" >
<img loading="lazy" src="@/public/form-effect.gif" style={{ maxWidth: 600 }}/>
<img loading="lazy" src="/form-effect.gif" style={{ maxWidth: 600 }}/>
</div>
```tsx pure

2
apps/docs/src/zh/guide/concepts/ecs.mdx
View File

@ -7,7 +7,7 @@
:::
<img loading="lazy" style={{filter: 'invert(0.9)'}} src="@/public/ecs.png"/>
<img loading="lazy" style={{filter: 'invert(0.9)'}} src="/ecs.png"/>
ReduxStore 伪代码
```jsx pure

4
apps/docs/src/zh/guide/concepts/reactflow.mdx
View File

@ -27,11 +27,11 @@
<tr>
<td>
<div className="rs-tip">由于 事件是绑定在 svg 上，svg 在缩放后很容易点不到</div>
<img loading="lazy" src="@/public/reactflow/reactflow-render.gif"/>
<img loading="lazy" src="/reactflow/reactflow-render.gif"/>
</td>
<td>
<div className="rs-tip">FlowGram 的事件是一种全局监听 mousemove 变化，并通过计算及 Threshold 大致确定位置，即使缩放很小也能点到, 同时支持线条重连</div>
<img loading="lazy" src="@/public/reactflow/reactflow-interaction.gif"/>
<img loading="lazy" src="/reactflow/reactflow-interaction.gif"/>
</td>
</tr>
</table>

4
apps/docs/src/zh/guide/concepts/variable-engine.mdx
View File

@ -69,8 +69,8 @@
:::
<table>
<tr>
<td><img loading="lazy" src="@/public/variable-type1.png"/></td>
<td><img loading="lazy" src="@/public/variable-type2.png"/></td>
<td><img loading="lazy" src="/variable-type1.png"/></td>
<td><img loading="lazy" src="/variable-type2.png"/></td>
</tr>
</table>

34
apps/docs/src/zh/guide/introduction.mdx
View File

@ -23,7 +23,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
固定的排版，节点/分支支持指定位置拖拽移动，并提供分支、循环等复合节点
</div>
<div>
<img loading="lazy" src="@/public/fixed-layout/fixed-layout-demo.gif"/>
<img loading="lazy" src="/fixed-layout/fixed-layout-demo.gif"/>
</div>
</div>
<div>
@ -36,7 +36,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
自由的排版，节点支持任意位置移动，通过自由连线连接节点
</div>
<div>
<img loading="lazy" src="@/public/free-layout/free-layout-demo.gif"/>
<img loading="lazy" src="/free-layout/free-layout-demo.gif"/>
</div>
</div>
</div>
@ -53,7 +53,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
Motion 动画在 Web 端应用可追溯到 Material Design，里边提到元素的变化如宽高或位置需要一个过渡过程，画布引擎会把线条和节点拆分单独绘制，使实现 Motion 过渡动画成本大大降低
</p>
<div className="rs-center">
<img loading="lazy" src="@/public/common/motion.gif" />
<img loading="lazy" src="/common/motion.gif" />
</div>
</td>
</tr>
@ -64,7 +64,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
手势指在 Mac 触摸板两指展开/合并可以实现画布放大/缩小，或者按住空格拖动画布，交互借鉴 Sketch、Figma
</p>
<div className="rs-center">
<img loading="lazy" src="@/public/common/touch-pad.gif" />
<img loading="lazy" src="/common/touch-pad.gif" />
</div>
</td>
</tr>
@ -72,7 +72,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
<td>缩略图</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/minimap.gif" />
<img loading="lazy" src="/fixed-layout/minimap.gif" />
</div>
</td>
</tr>
@ -80,7 +80,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
<td>撤销/重做</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/redo-undo.gif" />
<img loading="lazy" src="/fixed-layout/redo-undo.gif" />
</div>
</td>
</tr>
@ -88,7 +88,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
<td>复制/粘贴(支持快捷键)</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/copypaste.gif" />
<img loading="lazy" src="/fixed-layout/copypaste.gif" />
</div>
</td>
</tr>
@ -102,7 +102,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
<td>
<div className="rs-center">
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/dragdrop.gif" />
<img loading="lazy" src="/fixed-layout/dragdrop.gif" />
</div>
</div>
</td>
@ -114,7 +114,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/layout-change.gif" />
<img loading="lazy" src="/fixed-layout/layout-change.gif" />
</div>
</td>
</tr>
@ -125,7 +125,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/fold.gif" />
<img loading="lazy" src="/fixed-layout/fold.gif" />
</div>
</td>
</tr>
@ -136,7 +136,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/fixed-layout/group.gif" />
<img loading="lazy" src="/fixed-layout/group.gif" />
</div>
</td>
</tr>
@ -147,7 +147,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/autolayout.gif" />
<img loading="lazy" src="/free-layout/autolayout.gif" />
</div>
</td>
</tr>
@ -158,7 +158,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/snap.gif" />
<img loading="lazy" src="/free-layout/snap.gif" />
</div>
</td>
</tr>
@ -169,7 +169,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
</td>
<td>
<div className="rs-center">
<img loading="lazy" src="@/public/free-layout/loop.gif" />
<img loading="lazy" src="/free-layout/loop.gif" />
</div>
</td>
</tr>
@ -185,7 +185,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
</a>
</div>
<div>
<img loading="lazy" src="@/public/ref-coze.png"/>
<img loading="lazy" src="/ref-coze.png"/>
</div>
</div>
<div>
@ -193,7 +193,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
飞书低代码平台工作流
</a>
<div>
<img loading="lazy" src="@/public/ref-apaas.png"/>
<img loading="lazy" src="/ref-apaas.png"/>
</div>
</div>
<div>
@ -201,7 +201,7 @@ FlowGram 是一套基于节点编辑的流程搭建引擎，帮助开发者快
飞书多维表格工作流
</a>
<div>
<img loading="lazy" src="@/public/ref-bitable.png"/>
<img loading="lazy" src="/ref-bitable.png"/>
</div>
</div>
</div>