@flowgram.ai/playground-react 0.2.12 → 0.2.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/esm/index.js +11 -10
  2. package/dist/esm/index.js.map +1 -1
  3. package/dist/index.js +11 -10
  4. package/dist/index.js.map +1 -1
  5. package/package.json +7 -7
package/dist/esm/index.js CHANGED
@@ -16,35 +16,29 @@ export * from "@flowgram.ai/core";
16
16
 
17
17
  // src/hooks/use-playground-tools.ts
18
18
  import { useCallback, useEffect, useState } from "react";
19
+ import { DisposableCollection } from "@flowgram.ai/utils";
19
20
  import {
20
21
  EditorState,
21
22
  EditorStateConfigEntity,
22
23
  useConfigEntity,
23
24
  usePlayground
24
25
  } from "@flowgram.ai/core";
25
- import { DisposableCollection } from "@flowgram.ai/utils";
26
26
  function usePlaygroundTools(props) {
27
- const { maxZoom = 2, minZoom = 0.25 } = props || {};
27
+ const { maxZoom, minZoom } = props || {};
28
28
  const playground = usePlayground();
29
29
  const editorState = useConfigEntity(EditorStateConfigEntity, true);
30
30
  const [zoom, setZoom] = useState(1);
31
31
  const handleZoomOut = useCallback(
32
32
  (easing) => {
33
- if (zoom < minZoom) {
34
- return;
35
- }
36
33
  playground.config.zoomout(easing);
37
34
  },
38
- [zoom, playground, minZoom]
35
+ [playground]
39
36
  );
40
37
  const handleZoomIn = useCallback(
41
38
  (easing) => {
42
- if (zoom > maxZoom) {
43
- return;
44
- }
45
39
  playground.config.zoomin(easing);
46
40
  },
47
- [zoom, playground, maxZoom]
41
+ [playground]
48
42
  );
49
43
  const handleUpdateZoom = useCallback(
50
44
  (value, easing, easingDuration) => {
@@ -64,6 +58,13 @@ function usePlaygroundTools(props) {
64
58
  dispose.push(playground.onZoom((z) => setZoom(z)));
65
59
  return () => dispose.dispose();
66
60
  }, [playground]);
61
+ useEffect(() => {
62
+ const config = playground.config.config;
63
+ playground.config.updateConfig({
64
+ maxZoom: maxZoom !== void 0 ? maxZoom : config.maxZoom,
65
+ minZoom: minZoom !== void 0 ? minZoom : config.minZoom
66
+ });
67
+ }, [playground, maxZoom, minZoom]);
67
68
  return {
68
69
  zoomin: handleZoomIn,
69
70
  zoomout: handleZoomOut,
package/dist/esm/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts","../../src/hooks/use-playground-tools.ts","../../src/components/playground-react.tsx","../../src/preset/playground-react-preset.ts","../../src/layers/playground-content-layer.tsx","../../src/components/playground-react-content.tsx"],"sourcesContent":["import 'reflect-metadata';\n\n/* 核心 模块导出 */\nexport { useRefresh, Emitter, Event, Disposable } from '@flowgram.ai/utils';\nexport * from '@flowgram.ai/core';\n\nexport { usePlaygroundTools } from './hooks';\nexport {\n PlaygroundReact,\n PlaygroundReactContent,\n PlaygroundReactContentProps,\n PlaygroundRef,\n} from './components';\nexport { PlaygroundReactProps, createPlaygroundReactPreset } from './preset';\n","import { useCallback, useEffect, useState } from 'react';\n\nimport {\n EditorState,\n EditorStateConfigEntity,\n PlaygroundInteractiveType,\n useConfigEntity,\n usePlayground,\n} from '@flowgram.ai/core';\nimport { DisposableCollection } from '@flowgram.ai/utils';\n\nexport interface PlaygroundToolsPropsType {\n /**\n * 最大缩放比，默认 2\n */\n maxZoom?: number;\n /**\n * 最小缩放比，默认 0.25\n */\n minZoom?: number;\n}\n\nexport interface PlaygroundTools {\n /**\n * 缩放 zoom 大小比例\n */\n zoom: number;\n /**\n * 放大\n */\n zoomin: (easing?: boolean) => void;\n /**\n * 缩小\n */\n zoomout: (easing?: boolean) => void;\n /**\n * 设置缩放比例\n * @param zoom\n */\n updateZoom: (newZoom: number, easing?: boolean, easingDuration?: number) => void;\n /**\n * 当前的交互模式, 鼠标友好模式 和 触摸板模式\n */\n interactiveType: PlaygroundInteractiveType;\n /**\n * 切换交互模式\n */\n toggleIneractiveType: () => void;\n}\n\nexport function usePlaygroundTools(props?: PlaygroundToolsPropsType): PlaygroundTools {\n const { maxZoom = 2, minZoom = 0.25 } = props || {};\n const playground = usePlayground();\n const editorState = useConfigEntity(EditorStateConfigEntity, true);\n\n const [zoom, setZoom] = useState(1);\n\n const handleZoomOut = useCallback(\n (easing?: boolean) => {\n if (zoom < minZoom) {\n return;\n }\n playground.config.zoomout(easing);\n },\n [zoom, playground, minZoom],\n );\n\n const handleZoomIn = useCallback(\n (easing?: boolean) => {\n if (zoom > maxZoom) {\n return;\n }\n playground.config.zoomin(easing);\n },\n [zoom, playground, maxZoom],\n );\n\n const handleUpdateZoom = useCallback(\n (value: number, easing?: boolean, easingDuration?: number) => {\n playground.config.updateZoom(value, easing, easingDuration);\n },\n [playground],\n );\n\n const handleToggleIneractiveType = useCallback(() => {\n if (editorState.isMouseFriendlyMode()) {\n editorState.changeState(EditorState.STATE_SELECT.id);\n } else {\n editorState.changeState(EditorState.STATE_MOUSE_FRIENDLY_SELECT.id);\n }\n }, [editorState]);\n\n useEffect(() => {\n const dispose = new DisposableCollection();\n dispose.push(playground.onZoom(z => setZoom(z)));\n return () => dispose.dispose();\n }, [playground]);\n\n return {\n zoomin: handleZoomIn,\n zoomout: handleZoomOut,\n updateZoom: handleUpdateZoom,\n zoom,\n interactiveType: editorState.isMouseFriendlyMode() ? 'MOUSE' : 'PAD',\n toggleIneractiveType: handleToggleIneractiveType,\n };\n}\n","import React, { useMemo, forwardRef } from 'react';\n\nimport {\n createPlaygroundPlugin,\n PlaygroundReactProvider,\n PlaygroundReactRenderer,\n PluginContext,\n} from '@flowgram.ai/core';\n\nimport { PlaygroundReactProps, createPlaygroundReactPreset } from '../preset';\nimport { PlaygroundContentLayer } from '../layers/playground-content-layer';\n\nexport type PlaygroundRef = PluginContext;\n\nexport const PlaygroundReact = forwardRef<PlaygroundRef, PlaygroundReactProps>(\n function PlaygroundReact(props, ref) {\n const { parentContainer, children, ...others } = props;\n const contentLoadPlugin = useMemo(\n () =>\n createPlaygroundPlugin({\n onInit(ctx) {\n ctx.playground.registerLayer(PlaygroundContentLayer);\n },\n }),\n [],\n );\n const preset = useMemo(() => createPlaygroundReactPreset(others, [contentLoadPlugin]), []);\n return (\n <PlaygroundReactProvider ref={ref} plugins={preset} parentContainer={parentContainer}>\n <PlaygroundReactRenderer>{children}</PlaygroundReactRenderer>\n </PlaygroundReactProvider>\n );\n },\n);\n","import { createShortcutsPlugin } from '@flowgram.ai/shortcuts-plugin';\nimport {\n PluginContext,\n PluginsProvider,\n Plugin,\n createPlaygroundPlugin,\n PlaygroundConfig,\n PlaygroundLayer,\n} from '@flowgram.ai/core';\nimport { createBackgroundPlugin } from '@flowgram.ai/background-plugin';\n\nimport { PlaygroundReactProps } from './playground-react-props';\n\nexport function createPlaygroundReactPreset<CTX extends PluginContext = PluginContext>(\n opts: PlaygroundReactProps<CTX>,\n plugins: Plugin[] = []\n): PluginsProvider<CTX> {\n return (ctx: CTX) => {\n plugins = plugins.slice();\n /**\n * 注册背景 (放前面插入), 默认打开\n */\n if (opts.background || opts.background === undefined) {\n plugins.push(createBackgroundPlugin(opts.background || {}));\n }\n /**\n * 注册快捷键\n */\n if (opts.shortcuts) {\n plugins.push(\n createShortcutsPlugin({\n registerShortcuts: (registry) => opts.shortcuts!(registry, ctx),\n })\n );\n }\n /**\n * 注册三方插件\n */\n if (opts.plugins) {\n plugins.push(...opts.plugins(ctx));\n }\n /**\n * 画布生命周期注册\n */\n plugins.push(\n createPlaygroundPlugin<CTX>({\n onBind: (bindConfig) => {\n opts.onBind?.(bindConfig);\n },\n onInit: (ctx) => {\n const playgroundConfig = ctx.get<PlaygroundConfig>(PlaygroundConfig);\n if (opts.playground) {\n if (opts.playground.autoFocus !== undefined) {\n playgroundConfig.autoFocus = opts.playground.autoFocus;\n }\n if (opts.playground.autoResize !== undefined) {\n playgroundConfig.autoResize = opts.playground.autoResize;\n }\n }\n playgroundConfig.autoFocus = false;\n ctx.playground.registerLayer(PlaygroundLayer, opts.playground);\n if (opts.layers) {\n ctx.playground.registerLayers(...opts.layers);\n }\n if (opts.onInit) opts.onInit(ctx);\n },\n onReady(ctx) {\n if (opts.onReady) opts.onReady(ctx);\n },\n onAllLayersRendered() {\n if (opts.onAllLayersRendered) opts.onAllLayersRendered(ctx);\n },\n onDispose() {\n if (opts.onDispose) opts.onDispose(ctx);\n },\n containerModules: opts.containerModules || [],\n })\n );\n return plugins;\n };\n}\n","import React from 'react';\n\nimport { injectable } from 'inversify';\nimport { Layer } from '@flowgram.ai/core';\nimport { domUtils } from '@flowgram.ai/utils';\n\nexport interface PlaygroundReactContentProps {\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n}\n\n@injectable()\nexport class PlaygroundContentLayer extends Layer<PlaygroundReactContentProps> {\n static type = 'PlaygroundContentLayer';\n\n readonly node = domUtils.createDivWithClass(\n 'gedit-playground-layer gedit-playground-content-layer',\n );\n\n onZoom(scale: number): void {\n this.node.style.transform = `scale(${scale})`;\n }\n\n onReady() {\n this.node.style.left = '0px';\n this.node.style.top = '0px';\n }\n\n updateOptions(opts: PlaygroundReactContentProps) {\n this.options = opts;\n this.render();\n }\n\n render(): JSX.Element {\n return (\n <div\n className={this.options.className}\n style={{ position: 'absolute', ...this.options.style }}\n >\n {this.options.children}\n </div>\n );\n }\n}\n","import React, { useMemo } from 'react';\n\nimport { usePlayground } from '@flowgram.ai/core';\n\nimport {\n PlaygroundContentLayer,\n PlaygroundReactContentProps,\n} from '../layers/playground-content-layer';\n\nexport { PlaygroundReactContentProps };\n\nexport const PlaygroundReactContent: React.FC<PlaygroundReactContentProps> = props => {\n const playground = usePlayground();\n useMemo(() => {\n const layer = playground.getLayer(PlaygroundContentLayer)!;\n layer.updateOptions(props);\n }, [props]);\n return <></>;\n};\n"],"mappings":"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","names":["React","createPlaygroundPlugin","ctx","PlaygroundReact","createPlaygroundPlugin","React","React","useMemo","usePlayground","usePlayground","useMemo","React"]}
1
+ {"version":3,"sources":["../../src/index.ts","../../src/hooks/use-playground-tools.ts","../../src/components/playground-react.tsx","../../src/preset/playground-react-preset.ts","../../src/layers/playground-content-layer.tsx","../../src/components/playground-react-content.tsx"],"sourcesContent":["import 'reflect-metadata';\n\n/* 核心 模块导出 */\nexport { useRefresh, Emitter, Event, Disposable } from '@flowgram.ai/utils';\nexport * from '@flowgram.ai/core';\n\nexport { usePlaygroundTools } from './hooks';\nexport {\n PlaygroundReact,\n PlaygroundReactContent,\n PlaygroundReactContentProps,\n PlaygroundRef,\n} from './components';\nexport { PlaygroundReactProps, createPlaygroundReactPreset } from './preset';\n","import { useCallback, useEffect, useState } from 'react';\n\nimport { DisposableCollection } from '@flowgram.ai/utils';\nimport {\n EditorState,\n EditorStateConfigEntity,\n PlaygroundInteractiveType,\n useConfigEntity,\n usePlayground,\n} from '@flowgram.ai/core';\n\nexport interface PlaygroundToolsPropsType {\n /**\n * 最大缩放比，默认 2\n */\n maxZoom?: number;\n /**\n * 最小缩放比，默认 0.25\n */\n minZoom?: number;\n}\n\nexport interface PlaygroundTools {\n /**\n * 缩放 zoom 大小比例\n */\n zoom: number;\n /**\n * 放大\n */\n zoomin: (easing?: boolean) => void;\n /**\n * 缩小\n */\n zoomout: (easing?: boolean) => void;\n /**\n * 设置缩放比例\n * @param zoom\n */\n updateZoom: (newZoom: number, easing?: boolean, easingDuration?: number) => void;\n /**\n * 当前的交互模式, 鼠标友好模式 和 触摸板模式\n */\n interactiveType: PlaygroundInteractiveType;\n /**\n * 切换交互模式\n */\n toggleIneractiveType: () => void;\n}\n\nexport function usePlaygroundTools(props?: PlaygroundToolsPropsType): PlaygroundTools {\n const { maxZoom, minZoom } = props || {};\n const playground = usePlayground();\n const editorState = useConfigEntity(EditorStateConfigEntity, true);\n\n const [zoom, setZoom] = useState(1);\n\n const handleZoomOut = useCallback(\n (easing?: boolean) => {\n playground.config.zoomout(easing);\n },\n [playground]\n );\n\n const handleZoomIn = useCallback(\n (easing?: boolean) => {\n playground.config.zoomin(easing);\n },\n [playground]\n );\n\n const handleUpdateZoom = useCallback(\n (value: number, easing?: boolean, easingDuration?: number) => {\n playground.config.updateZoom(value, easing, easingDuration);\n },\n [playground]\n );\n\n const handleToggleIneractiveType = useCallback(() => {\n if (editorState.isMouseFriendlyMode()) {\n editorState.changeState(EditorState.STATE_SELECT.id);\n } else {\n editorState.changeState(EditorState.STATE_MOUSE_FRIENDLY_SELECT.id);\n }\n }, [editorState]);\n\n useEffect(() => {\n const dispose = new DisposableCollection();\n dispose.push(playground.onZoom((z) => setZoom(z)));\n return () => dispose.dispose();\n }, [playground]);\n\n useEffect(() => {\n const config = playground.config.config;\n playground.config.updateConfig({\n maxZoom: maxZoom !== undefined ? maxZoom : config.maxZoom,\n minZoom: minZoom !== undefined ? minZoom : config.minZoom,\n });\n }, [playground, maxZoom, minZoom]);\n\n return {\n zoomin: handleZoomIn,\n zoomout: handleZoomOut,\n updateZoom: handleUpdateZoom,\n zoom,\n interactiveType: editorState.isMouseFriendlyMode() ? 'MOUSE' : 'PAD',\n toggleIneractiveType: handleToggleIneractiveType,\n };\n}\n","import React, { useMemo, forwardRef } from 'react';\n\nimport {\n createPlaygroundPlugin,\n PlaygroundReactProvider,\n PlaygroundReactRenderer,\n PluginContext,\n} from '@flowgram.ai/core';\n\nimport { PlaygroundReactProps, createPlaygroundReactPreset } from '../preset';\nimport { PlaygroundContentLayer } from '../layers/playground-content-layer';\n\nexport type PlaygroundRef = PluginContext;\n\nexport const PlaygroundReact = forwardRef<PlaygroundRef, PlaygroundReactProps>(\n function PlaygroundReact(props, ref) {\n const { parentContainer, children, ...others } = props;\n const contentLoadPlugin = useMemo(\n () =>\n createPlaygroundPlugin({\n onInit(ctx) {\n ctx.playground.registerLayer(PlaygroundContentLayer);\n },\n }),\n [],\n );\n const preset = useMemo(() => createPlaygroundReactPreset(others, [contentLoadPlugin]), []);\n return (\n <PlaygroundReactProvider ref={ref} plugins={preset} parentContainer={parentContainer}>\n <PlaygroundReactRenderer>{children}</PlaygroundReactRenderer>\n </PlaygroundReactProvider>\n );\n },\n);\n","import { createShortcutsPlugin } from '@flowgram.ai/shortcuts-plugin';\nimport {\n PluginContext,\n PluginsProvider,\n Plugin,\n createPlaygroundPlugin,\n PlaygroundConfig,\n PlaygroundLayer,\n} from '@flowgram.ai/core';\nimport { createBackgroundPlugin } from '@flowgram.ai/background-plugin';\n\nimport { PlaygroundReactProps } from './playground-react-props';\n\nexport function createPlaygroundReactPreset<CTX extends PluginContext = PluginContext>(\n opts: PlaygroundReactProps<CTX>,\n plugins: Plugin[] = []\n): PluginsProvider<CTX> {\n return (ctx: CTX) => {\n plugins = plugins.slice();\n /**\n * 注册背景 (放前面插入), 默认打开\n */\n if (opts.background || opts.background === undefined) {\n plugins.push(createBackgroundPlugin(opts.background || {}));\n }\n /**\n * 注册快捷键\n */\n if (opts.shortcuts) {\n plugins.push(\n createShortcutsPlugin({\n registerShortcuts: (registry) => opts.shortcuts!(registry, ctx),\n })\n );\n }\n /**\n * 注册三方插件\n */\n if (opts.plugins) {\n plugins.push(...opts.plugins(ctx));\n }\n /**\n * 画布生命周期注册\n */\n plugins.push(\n createPlaygroundPlugin<CTX>({\n onBind: (bindConfig) => {\n opts.onBind?.(bindConfig);\n },\n onInit: (ctx) => {\n const playgroundConfig = ctx.get<PlaygroundConfig>(PlaygroundConfig);\n if (opts.playground) {\n if (opts.playground.autoFocus !== undefined) {\n playgroundConfig.autoFocus = opts.playground.autoFocus;\n }\n if (opts.playground.autoResize !== undefined) {\n playgroundConfig.autoResize = opts.playground.autoResize;\n }\n }\n playgroundConfig.autoFocus = false;\n ctx.playground.registerLayer(PlaygroundLayer, opts.playground);\n if (opts.layers) {\n ctx.playground.registerLayers(...opts.layers);\n }\n if (opts.onInit) opts.onInit(ctx);\n },\n onReady(ctx) {\n if (opts.onReady) opts.onReady(ctx);\n },\n onAllLayersRendered() {\n if (opts.onAllLayersRendered) opts.onAllLayersRendered(ctx);\n },\n onDispose() {\n if (opts.onDispose) opts.onDispose(ctx);\n },\n containerModules: opts.containerModules || [],\n })\n );\n return plugins;\n };\n}\n","import React from 'react';\n\nimport { injectable } from 'inversify';\nimport { Layer } from '@flowgram.ai/core';\nimport { domUtils } from '@flowgram.ai/utils';\n\nexport interface PlaygroundReactContentProps {\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n}\n\n@injectable()\nexport class PlaygroundContentLayer extends Layer<PlaygroundReactContentProps> {\n static type = 'PlaygroundContentLayer';\n\n readonly node = domUtils.createDivWithClass(\n 'gedit-playground-layer gedit-playground-content-layer',\n );\n\n onZoom(scale: number): void {\n this.node.style.transform = `scale(${scale})`;\n }\n\n onReady() {\n this.node.style.left = '0px';\n this.node.style.top = '0px';\n }\n\n updateOptions(opts: PlaygroundReactContentProps) {\n this.options = opts;\n this.render();\n }\n\n render(): JSX.Element {\n return (\n <div\n className={this.options.className}\n style={{ position: 'absolute', ...this.options.style }}\n >\n {this.options.children}\n </div>\n );\n }\n}\n","import React, { useMemo } from 'react';\n\nimport { usePlayground } from '@flowgram.ai/core';\n\nimport {\n PlaygroundContentLayer,\n PlaygroundReactContentProps,\n} from '../layers/playground-content-layer';\n\nexport { PlaygroundReactContentProps };\n\nexport const PlaygroundReactContent: React.FC<PlaygroundReactContentProps> = props => {\n const playground = usePlayground();\n useMemo(() => {\n const layer = playground.getLayer(PlaygroundContentLayer)!;\n layer.updateOptions(props);\n }, [props]);\n return <></>;\n};\n"],"mappings":"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","names":["React","createPlaygroundPlugin","ctx","PlaygroundReact","createPlaygroundPlugin","React","React","useMemo","usePlayground","usePlayground","useMemo","React"]}
package/dist/index.js CHANGED
@@ -55,30 +55,24 @@ __reExport(src_exports, require("@flowgram.ai/core"), module.exports);
55
55
 
56
56
  // src/hooks/use-playground-tools.ts
57
57
  var import_react = require("react");
58
- var import_core = require("@flowgram.ai/core");
59
58
  var import_utils = require("@flowgram.ai/utils");
59
+ var import_core = require("@flowgram.ai/core");
60
60
  function usePlaygroundTools(props) {
61
- const { maxZoom = 2, minZoom = 0.25 } = props || {};
61
+ const { maxZoom, minZoom } = props || {};
62
62
  const playground = (0, import_core.usePlayground)();
63
63
  const editorState = (0, import_core.useConfigEntity)(import_core.EditorStateConfigEntity, true);
64
64
  const [zoom, setZoom] = (0, import_react.useState)(1);
65
65
  const handleZoomOut = (0, import_react.useCallback)(
66
66
  (easing) => {
67
- if (zoom < minZoom) {
68
- return;
69
- }
70
67
  playground.config.zoomout(easing);
71
68
  },
72
- [zoom, playground, minZoom]
69
+ [playground]
73
70
  );
74
71
  const handleZoomIn = (0, import_react.useCallback)(
75
72
  (easing) => {
76
- if (zoom > maxZoom) {
77
- return;
78
- }
79
73
  playground.config.zoomin(easing);
80
74
  },
81
- [zoom, playground, maxZoom]
75
+ [playground]
82
76
  );
83
77
  const handleUpdateZoom = (0, import_react.useCallback)(
84
78
  (value, easing, easingDuration) => {
@@ -98,6 +92,13 @@ function usePlaygroundTools(props) {
98
92
  dispose.push(playground.onZoom((z) => setZoom(z)));
99
93
  return () => dispose.dispose();
100
94
  }, [playground]);
95
+ (0, import_react.useEffect)(() => {
96
+ const config = playground.config.config;
97
+ playground.config.updateConfig({
98
+ maxZoom: maxZoom !== void 0 ? maxZoom : config.maxZoom,
99
+ minZoom: minZoom !== void 0 ? minZoom : config.minZoom
100
+ });
101
+ }, [playground, maxZoom, minZoom]);
101
102
  return {
102
103
  zoomin: handleZoomIn,
103
104
  zoomout: handleZoomOut,
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/hooks/use-playground-tools.ts","../src/components/playground-react.tsx","../src/preset/playground-react-preset.ts","../src/layers/playground-content-layer.tsx","../src/components/playground-react-content.tsx"],"sourcesContent":["import 'reflect-metadata';\n\n/* 核心 模块导出 */\nexport { useRefresh, Emitter, Event, Disposable } from '@flowgram.ai/utils';\nexport * from '@flowgram.ai/core';\n\nexport { usePlaygroundTools } from './hooks';\nexport {\n PlaygroundReact,\n PlaygroundReactContent,\n PlaygroundReactContentProps,\n PlaygroundRef,\n} from './components';\nexport { PlaygroundReactProps, createPlaygroundReactPreset } from './preset';\n","import { useCallback, useEffect, useState } from 'react';\n\nimport {\n EditorState,\n EditorStateConfigEntity,\n PlaygroundInteractiveType,\n useConfigEntity,\n usePlayground,\n} from '@flowgram.ai/core';\nimport { DisposableCollection } from '@flowgram.ai/utils';\n\nexport interface PlaygroundToolsPropsType {\n /**\n * 最大缩放比，默认 2\n */\n maxZoom?: number;\n /**\n * 最小缩放比，默认 0.25\n */\n minZoom?: number;\n}\n\nexport interface PlaygroundTools {\n /**\n * 缩放 zoom 大小比例\n */\n zoom: number;\n /**\n * 放大\n */\n zoomin: (easing?: boolean) => void;\n /**\n * 缩小\n */\n zoomout: (easing?: boolean) => void;\n /**\n * 设置缩放比例\n * @param zoom\n */\n updateZoom: (newZoom: number, easing?: boolean, easingDuration?: number) => void;\n /**\n * 当前的交互模式, 鼠标友好模式 和 触摸板模式\n */\n interactiveType: PlaygroundInteractiveType;\n /**\n * 切换交互模式\n */\n toggleIneractiveType: () => void;\n}\n\nexport function usePlaygroundTools(props?: PlaygroundToolsPropsType): PlaygroundTools {\n const { maxZoom = 2, minZoom = 0.25 } = props || {};\n const playground = usePlayground();\n const editorState = useConfigEntity(EditorStateConfigEntity, true);\n\n const [zoom, setZoom] = useState(1);\n\n const handleZoomOut = useCallback(\n (easing?: boolean) => {\n if (zoom < minZoom) {\n return;\n }\n playground.config.zoomout(easing);\n },\n [zoom, playground, minZoom],\n );\n\n const handleZoomIn = useCallback(\n (easing?: boolean) => {\n if (zoom > maxZoom) {\n return;\n }\n playground.config.zoomin(easing);\n },\n [zoom, playground, maxZoom],\n );\n\n const handleUpdateZoom = useCallback(\n (value: number, easing?: boolean, easingDuration?: number) => {\n playground.config.updateZoom(value, easing, easingDuration);\n },\n [playground],\n );\n\n const handleToggleIneractiveType = useCallback(() => {\n if (editorState.isMouseFriendlyMode()) {\n editorState.changeState(EditorState.STATE_SELECT.id);\n } else {\n editorState.changeState(EditorState.STATE_MOUSE_FRIENDLY_SELECT.id);\n }\n }, [editorState]);\n\n useEffect(() => {\n const dispose = new DisposableCollection();\n dispose.push(playground.onZoom(z => setZoom(z)));\n return () => dispose.dispose();\n }, [playground]);\n\n return {\n zoomin: handleZoomIn,\n zoomout: handleZoomOut,\n updateZoom: handleUpdateZoom,\n zoom,\n interactiveType: editorState.isMouseFriendlyMode() ? 'MOUSE' : 'PAD',\n toggleIneractiveType: handleToggleIneractiveType,\n };\n}\n","import React, { useMemo, forwardRef } from 'react';\n\nimport {\n createPlaygroundPlugin,\n PlaygroundReactProvider,\n PlaygroundReactRenderer,\n PluginContext,\n} from '@flowgram.ai/core';\n\nimport { PlaygroundReactProps, createPlaygroundReactPreset } from '../preset';\nimport { PlaygroundContentLayer } from '../layers/playground-content-layer';\n\nexport type PlaygroundRef = PluginContext;\n\nexport const PlaygroundReact = forwardRef<PlaygroundRef, PlaygroundReactProps>(\n function PlaygroundReact(props, ref) {\n const { parentContainer, children, ...others } = props;\n const contentLoadPlugin = useMemo(\n () =>\n createPlaygroundPlugin({\n onInit(ctx) {\n ctx.playground.registerLayer(PlaygroundContentLayer);\n },\n }),\n [],\n );\n const preset = useMemo(() => createPlaygroundReactPreset(others, [contentLoadPlugin]), []);\n return (\n <PlaygroundReactProvider ref={ref} plugins={preset} parentContainer={parentContainer}>\n <PlaygroundReactRenderer>{children}</PlaygroundReactRenderer>\n </PlaygroundReactProvider>\n );\n },\n);\n","import { createShortcutsPlugin } from '@flowgram.ai/shortcuts-plugin';\nimport {\n PluginContext,\n PluginsProvider,\n Plugin,\n createPlaygroundPlugin,\n PlaygroundConfig,\n PlaygroundLayer,\n} from '@flowgram.ai/core';\nimport { createBackgroundPlugin } from '@flowgram.ai/background-plugin';\n\nimport { PlaygroundReactProps } from './playground-react-props';\n\nexport function createPlaygroundReactPreset<CTX extends PluginContext = PluginContext>(\n opts: PlaygroundReactProps<CTX>,\n plugins: Plugin[] = []\n): PluginsProvider<CTX> {\n return (ctx: CTX) => {\n plugins = plugins.slice();\n /**\n * 注册背景 (放前面插入), 默认打开\n */\n if (opts.background || opts.background === undefined) {\n plugins.push(createBackgroundPlugin(opts.background || {}));\n }\n /**\n * 注册快捷键\n */\n if (opts.shortcuts) {\n plugins.push(\n createShortcutsPlugin({\n registerShortcuts: (registry) => opts.shortcuts!(registry, ctx),\n })\n );\n }\n /**\n * 注册三方插件\n */\n if (opts.plugins) {\n plugins.push(...opts.plugins(ctx));\n }\n /**\n * 画布生命周期注册\n */\n plugins.push(\n createPlaygroundPlugin<CTX>({\n onBind: (bindConfig) => {\n opts.onBind?.(bindConfig);\n },\n onInit: (ctx) => {\n const playgroundConfig = ctx.get<PlaygroundConfig>(PlaygroundConfig);\n if (opts.playground) {\n if (opts.playground.autoFocus !== undefined) {\n playgroundConfig.autoFocus = opts.playground.autoFocus;\n }\n if (opts.playground.autoResize !== undefined) {\n playgroundConfig.autoResize = opts.playground.autoResize;\n }\n }\n playgroundConfig.autoFocus = false;\n ctx.playground.registerLayer(PlaygroundLayer, opts.playground);\n if (opts.layers) {\n ctx.playground.registerLayers(...opts.layers);\n }\n if (opts.onInit) opts.onInit(ctx);\n },\n onReady(ctx) {\n if (opts.onReady) opts.onReady(ctx);\n },\n onAllLayersRendered() {\n if (opts.onAllLayersRendered) opts.onAllLayersRendered(ctx);\n },\n onDispose() {\n if (opts.onDispose) opts.onDispose(ctx);\n },\n containerModules: opts.containerModules || [],\n })\n );\n return plugins;\n };\n}\n","import React from 'react';\n\nimport { injectable } from 'inversify';\nimport { Layer } from '@flowgram.ai/core';\nimport { domUtils } from '@flowgram.ai/utils';\n\nexport interface PlaygroundReactContentProps {\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n}\n\n@injectable()\nexport class PlaygroundContentLayer extends Layer<PlaygroundReactContentProps> {\n static type = 'PlaygroundContentLayer';\n\n readonly node = domUtils.createDivWithClass(\n 'gedit-playground-layer gedit-playground-content-layer',\n );\n\n onZoom(scale: number): void {\n this.node.style.transform = `scale(${scale})`;\n }\n\n onReady() {\n this.node.style.left = '0px';\n this.node.style.top = '0px';\n }\n\n updateOptions(opts: PlaygroundReactContentProps) {\n this.options = opts;\n this.render();\n }\n\n render(): JSX.Element {\n return (\n <div\n className={this.options.className}\n style={{ position: 'absolute', ...this.options.style }}\n >\n {this.options.children}\n </div>\n );\n }\n}\n","import React, { useMemo } from 'react';\n\nimport { usePlayground } from '@flowgram.ai/core';\n\nimport {\n PlaygroundContentLayer,\n PlaygroundReactContentProps,\n} from '../layers/playground-content-layer';\n\nexport { PlaygroundReactContentProps };\n\nexport const PlaygroundReactContent: React.FC<PlaygroundReactContentProps> = props => {\n const playground = usePlayground();\n useMemo(() => {\n const layer = playground.getLayer(PlaygroundContentLayer)!;\n layer.updateOptions(props);\n }, [props]);\n return <></>;\n};\n"],"mappings":"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","names":["import_utils","import_react","import_core","import_core","ctx","import_react","import_core","import_utils","React","PlaygroundReact","React","import_react","import_core","React"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/hooks/use-playground-tools.ts","../src/components/playground-react.tsx","../src/preset/playground-react-preset.ts","../src/layers/playground-content-layer.tsx","../src/components/playground-react-content.tsx"],"sourcesContent":["import 'reflect-metadata';\n\n/* 核心 模块导出 */\nexport { useRefresh, Emitter, Event, Disposable } from '@flowgram.ai/utils';\nexport * from '@flowgram.ai/core';\n\nexport { usePlaygroundTools } from './hooks';\nexport {\n PlaygroundReact,\n PlaygroundReactContent,\n PlaygroundReactContentProps,\n PlaygroundRef,\n} from './components';\nexport { PlaygroundReactProps, createPlaygroundReactPreset } from './preset';\n","import { useCallback, useEffect, useState } from 'react';\n\nimport { DisposableCollection } from '@flowgram.ai/utils';\nimport {\n EditorState,\n EditorStateConfigEntity,\n PlaygroundInteractiveType,\n useConfigEntity,\n usePlayground,\n} from '@flowgram.ai/core';\n\nexport interface PlaygroundToolsPropsType {\n /**\n * 最大缩放比，默认 2\n */\n maxZoom?: number;\n /**\n * 最小缩放比，默认 0.25\n */\n minZoom?: number;\n}\n\nexport interface PlaygroundTools {\n /**\n * 缩放 zoom 大小比例\n */\n zoom: number;\n /**\n * 放大\n */\n zoomin: (easing?: boolean) => void;\n /**\n * 缩小\n */\n zoomout: (easing?: boolean) => void;\n /**\n * 设置缩放比例\n * @param zoom\n */\n updateZoom: (newZoom: number, easing?: boolean, easingDuration?: number) => void;\n /**\n * 当前的交互模式, 鼠标友好模式 和 触摸板模式\n */\n interactiveType: PlaygroundInteractiveType;\n /**\n * 切换交互模式\n */\n toggleIneractiveType: () => void;\n}\n\nexport function usePlaygroundTools(props?: PlaygroundToolsPropsType): PlaygroundTools {\n const { maxZoom, minZoom } = props || {};\n const playground = usePlayground();\n const editorState = useConfigEntity(EditorStateConfigEntity, true);\n\n const [zoom, setZoom] = useState(1);\n\n const handleZoomOut = useCallback(\n (easing?: boolean) => {\n playground.config.zoomout(easing);\n },\n [playground]\n );\n\n const handleZoomIn = useCallback(\n (easing?: boolean) => {\n playground.config.zoomin(easing);\n },\n [playground]\n );\n\n const handleUpdateZoom = useCallback(\n (value: number, easing?: boolean, easingDuration?: number) => {\n playground.config.updateZoom(value, easing, easingDuration);\n },\n [playground]\n );\n\n const handleToggleIneractiveType = useCallback(() => {\n if (editorState.isMouseFriendlyMode()) {\n editorState.changeState(EditorState.STATE_SELECT.id);\n } else {\n editorState.changeState(EditorState.STATE_MOUSE_FRIENDLY_SELECT.id);\n }\n }, [editorState]);\n\n useEffect(() => {\n const dispose = new DisposableCollection();\n dispose.push(playground.onZoom((z) => setZoom(z)));\n return () => dispose.dispose();\n }, [playground]);\n\n useEffect(() => {\n const config = playground.config.config;\n playground.config.updateConfig({\n maxZoom: maxZoom !== undefined ? maxZoom : config.maxZoom,\n minZoom: minZoom !== undefined ? minZoom : config.minZoom,\n });\n }, [playground, maxZoom, minZoom]);\n\n return {\n zoomin: handleZoomIn,\n zoomout: handleZoomOut,\n updateZoom: handleUpdateZoom,\n zoom,\n interactiveType: editorState.isMouseFriendlyMode() ? 'MOUSE' : 'PAD',\n toggleIneractiveType: handleToggleIneractiveType,\n };\n}\n","import React, { useMemo, forwardRef } from 'react';\n\nimport {\n createPlaygroundPlugin,\n PlaygroundReactProvider,\n PlaygroundReactRenderer,\n PluginContext,\n} from '@flowgram.ai/core';\n\nimport { PlaygroundReactProps, createPlaygroundReactPreset } from '../preset';\nimport { PlaygroundContentLayer } from '../layers/playground-content-layer';\n\nexport type PlaygroundRef = PluginContext;\n\nexport const PlaygroundReact = forwardRef<PlaygroundRef, PlaygroundReactProps>(\n function PlaygroundReact(props, ref) {\n const { parentContainer, children, ...others } = props;\n const contentLoadPlugin = useMemo(\n () =>\n createPlaygroundPlugin({\n onInit(ctx) {\n ctx.playground.registerLayer(PlaygroundContentLayer);\n },\n }),\n [],\n );\n const preset = useMemo(() => createPlaygroundReactPreset(others, [contentLoadPlugin]), []);\n return (\n <PlaygroundReactProvider ref={ref} plugins={preset} parentContainer={parentContainer}>\n <PlaygroundReactRenderer>{children}</PlaygroundReactRenderer>\n </PlaygroundReactProvider>\n );\n },\n);\n","import { createShortcutsPlugin } from '@flowgram.ai/shortcuts-plugin';\nimport {\n PluginContext,\n PluginsProvider,\n Plugin,\n createPlaygroundPlugin,\n PlaygroundConfig,\n PlaygroundLayer,\n} from '@flowgram.ai/core';\nimport { createBackgroundPlugin } from '@flowgram.ai/background-plugin';\n\nimport { PlaygroundReactProps } from './playground-react-props';\n\nexport function createPlaygroundReactPreset<CTX extends PluginContext = PluginContext>(\n opts: PlaygroundReactProps<CTX>,\n plugins: Plugin[] = []\n): PluginsProvider<CTX> {\n return (ctx: CTX) => {\n plugins = plugins.slice();\n /**\n * 注册背景 (放前面插入), 默认打开\n */\n if (opts.background || opts.background === undefined) {\n plugins.push(createBackgroundPlugin(opts.background || {}));\n }\n /**\n * 注册快捷键\n */\n if (opts.shortcuts) {\n plugins.push(\n createShortcutsPlugin({\n registerShortcuts: (registry) => opts.shortcuts!(registry, ctx),\n })\n );\n }\n /**\n * 注册三方插件\n */\n if (opts.plugins) {\n plugins.push(...opts.plugins(ctx));\n }\n /**\n * 画布生命周期注册\n */\n plugins.push(\n createPlaygroundPlugin<CTX>({\n onBind: (bindConfig) => {\n opts.onBind?.(bindConfig);\n },\n onInit: (ctx) => {\n const playgroundConfig = ctx.get<PlaygroundConfig>(PlaygroundConfig);\n if (opts.playground) {\n if (opts.playground.autoFocus !== undefined) {\n playgroundConfig.autoFocus = opts.playground.autoFocus;\n }\n if (opts.playground.autoResize !== undefined) {\n playgroundConfig.autoResize = opts.playground.autoResize;\n }\n }\n playgroundConfig.autoFocus = false;\n ctx.playground.registerLayer(PlaygroundLayer, opts.playground);\n if (opts.layers) {\n ctx.playground.registerLayers(...opts.layers);\n }\n if (opts.onInit) opts.onInit(ctx);\n },\n onReady(ctx) {\n if (opts.onReady) opts.onReady(ctx);\n },\n onAllLayersRendered() {\n if (opts.onAllLayersRendered) opts.onAllLayersRendered(ctx);\n },\n onDispose() {\n if (opts.onDispose) opts.onDispose(ctx);\n },\n containerModules: opts.containerModules || [],\n })\n );\n return plugins;\n };\n}\n","import React from 'react';\n\nimport { injectable } from 'inversify';\nimport { Layer } from '@flowgram.ai/core';\nimport { domUtils } from '@flowgram.ai/utils';\n\nexport interface PlaygroundReactContentProps {\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n}\n\n@injectable()\nexport class PlaygroundContentLayer extends Layer<PlaygroundReactContentProps> {\n static type = 'PlaygroundContentLayer';\n\n readonly node = domUtils.createDivWithClass(\n 'gedit-playground-layer gedit-playground-content-layer',\n );\n\n onZoom(scale: number): void {\n this.node.style.transform = `scale(${scale})`;\n }\n\n onReady() {\n this.node.style.left = '0px';\n this.node.style.top = '0px';\n }\n\n updateOptions(opts: PlaygroundReactContentProps) {\n this.options = opts;\n this.render();\n }\n\n render(): JSX.Element {\n return (\n <div\n className={this.options.className}\n style={{ position: 'absolute', ...this.options.style }}\n >\n {this.options.children}\n </div>\n );\n }\n}\n","import React, { useMemo } from 'react';\n\nimport { usePlayground } from '@flowgram.ai/core';\n\nimport {\n PlaygroundContentLayer,\n PlaygroundReactContentProps,\n} from '../layers/playground-content-layer';\n\nexport { PlaygroundReactContentProps };\n\nexport const PlaygroundReactContent: React.FC<PlaygroundReactContentProps> = props => {\n const playground = usePlayground();\n useMemo(() => {\n const layer = playground.getLayer(PlaygroundContentLayer)!;\n layer.updateOptions(props);\n }, [props]);\n return <></>;\n};\n"],"mappings":"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","names":["import_utils","import_react","import_core","import_core","ctx","import_react","import_core","import_utils","React","PlaygroundReact","React","import_react","import_core","React"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flowgram.ai/playground-react",
3
- "version": "0.2.12",
3
+ "version": "0.2.14",
4
4
  "homepage": "https://flowgram.ai/",
5
5
  "repository": "https://github.com/bytedance/flowgram.ai",
6
6
  "license": "MIT",
@@ -25,10 +25,10 @@
25
25
  "dependencies": {
26
26
  "inversify": "^6.0.1",
27
27
  "reflect-metadata": "~0.2.2",
28
- "@flowgram.ai/background-plugin": "0.2.12",
29
- "@flowgram.ai/core": "0.2.12",
30
- "@flowgram.ai/utils": "0.2.12",
31
- "@flowgram.ai/shortcuts-plugin": "0.2.12"
28
+ "@flowgram.ai/background-plugin": "0.2.14",
29
+ "@flowgram.ai/shortcuts-plugin": "0.2.14",
30
+ "@flowgram.ai/core": "0.2.14",
31
+ "@flowgram.ai/utils": "0.2.14"
32
32
  },
33
33
  "devDependencies": {
34
34
  "@types/bezier-js": "4.1.3",
@@ -42,8 +42,8 @@
42
42
  "tsup": "^8.0.1",
43
43
  "typescript": "^5.0.4",
44
44
  "vitest": "^0.34.6",
45
- "@flowgram.ai/eslint-config": "0.2.12",
46
- "@flowgram.ai/ts-config": "0.2.12"
45
+ "@flowgram.ai/eslint-config": "0.2.14",
46
+ "@flowgram.ai/ts-config": "0.2.14"
47
47
  },
48
48
  "peerDependencies": {
49
49
  "react": ">=16.8",