@flowgram.ai/playground-react 0.2.14 → 0.2.15
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.
- package/dist/esm/index.js +2 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/package.json +7 -7
package/dist/esm/index.js
CHANGED
|
@@ -95,7 +95,8 @@ function createPlaygroundReactPreset(opts, plugins = []) {
|
|
|
95
95
|
return (ctx) => {
|
|
96
96
|
plugins = plugins.slice();
|
|
97
97
|
if (opts.background || opts.background === void 0) {
|
|
98
|
-
|
|
98
|
+
const backgroundOptions = typeof opts.background === "object" ? opts.background : {};
|
|
99
|
+
plugins.push(createBackgroundPlugin(backgroundOptions));
|
|
99
100
|
}
|
|
100
101
|
if (opts.shortcuts) {
|
|
101
102
|
plugins.push(
|
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 { 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"]}
|
|
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 const backgroundOptions = typeof opts.background === 'object' ? opts.background : {};\n plugins.push(createBackgroundPlugin(backgroundOptions));\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
|
@@ -121,7 +121,8 @@ function createPlaygroundReactPreset(opts, plugins = []) {
|
|
|
121
121
|
return (ctx) => {
|
|
122
122
|
plugins = plugins.slice();
|
|
123
123
|
if (opts.background || opts.background === void 0) {
|
|
124
|
-
|
|
124
|
+
const backgroundOptions = typeof opts.background === "object" ? opts.background : {};
|
|
125
|
+
plugins.push((0, import_background_plugin.createBackgroundPlugin)(backgroundOptions));
|
|
125
126
|
}
|
|
126
127
|
if (opts.shortcuts) {
|
|
127
128
|
plugins.push(
|
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 { 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"]}
|
|
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 const backgroundOptions = typeof opts.background === 'object' ? opts.background : {};\n plugins.push(createBackgroundPlugin(backgroundOptions));\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.
|
|
3
|
+
"version": "0.2.15",
|
|
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.
|
|
29
|
-
"@flowgram.ai/
|
|
30
|
-
"@flowgram.ai/
|
|
31
|
-
"@flowgram.ai/utils": "0.2.
|
|
28
|
+
"@flowgram.ai/background-plugin": "0.2.15",
|
|
29
|
+
"@flowgram.ai/core": "0.2.15",
|
|
30
|
+
"@flowgram.ai/shortcuts-plugin": "0.2.15",
|
|
31
|
+
"@flowgram.ai/utils": "0.2.15"
|
|
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.
|
|
46
|
-
"@flowgram.ai/ts-config": "0.2.
|
|
45
|
+
"@flowgram.ai/eslint-config": "0.2.15",
|
|
46
|
+
"@flowgram.ai/ts-config": "0.2.15"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
49
49
|
"react": ">=16.8",
|