@flowgram.ai/panel-manager-plugin 1.0.7 → 1.0.9

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 (18) hide show
  1. package/.rush/temp/chunked-rush-logs/panel-manager-plugin.build.chunks.jsonl +9 -9
  2. package/.rush/temp/package-deps_build.json +7 -7
  3. package/.rush/temp/shrinkwrap-deps.json +5 -5
  4. package/CHANGELOG.json +3 -3
  5. package/CHANGELOG.md +3 -3
  6. package/dist/esm/index.js +53 -51
  7. package/dist/esm/index.js.map +1 -1
  8. package/dist/index.d.mts +7 -7
  9. package/dist/index.d.ts +7 -7
  10. package/dist/index.js +68 -66
  11. package/dist/index.js.map +1 -1
  12. package/package.json +6 -6
  13. package/rush-logs/panel-manager-plugin.build.log +9 -9
  14. package/src/components/panel-layer/docked-panel-layer.tsx +2 -0
  15. package/src/components/panel-layer/panel-layer.tsx +2 -0
  16. package/src/components/panel-layer/panel.tsx +17 -4
  17. package/src/components/resize-bar/index.tsx +3 -1
  18. package/tsconfig.json +3 -7
package/.rush/temp/chunked-rush-logs/panel-manager-plugin.build.chunks.jsonl CHANGED
@@ -9,13 +9,13 @@
9
9
  {"kind":"O","text":"\u001b[34mCLI\u001b[39m Target: es2020\n"}
10
10
  {"kind":"O","text":"\u001b[34mCJS\u001b[39m Build start\n"}
11
11
  {"kind":"O","text":"\u001b[34mESM\u001b[39m Build start\n"}
12
- {"kind":"O","text":"\u001b[32mCJS\u001b[39m \u001b[1mdist/index.js \u001b[22m\u001b[32m21.17 KB\u001b[39m\n"}
13
- {"kind":"O","text":"\u001b[32mCJS\u001b[39m \u001b[1mdist/index.js.map \u001b[22m\u001b[32m35.97 KB\u001b[39m\n"}
14
- {"kind":"O","text":"\u001b[32mCJS\u001b[39m ⚡️ Build success in 108ms\n"}
15
- {"kind":"O","text":"\u001b[32mESM\u001b[39m \u001b[1mdist/esm/index.js \u001b[22m\u001b[32m18.44 KB\u001b[39m\n"}
16
- {"kind":"O","text":"\u001b[32mESM\u001b[39m \u001b[1mdist/esm/index.js.map \u001b[22m\u001b[32m35.39 KB\u001b[39m\n"}
17
- {"kind":"O","text":"\u001b[32mESM\u001b[39m ⚡️ Build success in 112ms\n"}
12
+ {"kind":"O","text":"\u001b[32mCJS\u001b[39m \u001b[1mdist/index.js \u001b[22m\u001b[32m20.95 KB\u001b[39m\n"}
13
+ {"kind":"O","text":"\u001b[32mCJS\u001b[39m \u001b[1mdist/index.js.map \u001b[22m\u001b[32m36.67 KB\u001b[39m\n"}
14
+ {"kind":"O","text":"\u001b[32mCJS\u001b[39m ⚡️ Build success in 113ms\n"}
15
+ {"kind":"O","text":"\u001b[32mESM\u001b[39m \u001b[1mdist/esm/index.js \u001b[22m\u001b[32m18.67 KB\u001b[39m\n"}
16
+ {"kind":"O","text":"\u001b[32mESM\u001b[39m \u001b[1mdist/esm/index.js.map \u001b[22m\u001b[32m36.00 KB\u001b[39m\n"}
17
+ {"kind":"O","text":"\u001b[32mESM\u001b[39m ⚡️ Build success in 116ms\n"}
18
18
  {"kind":"O","text":"\u001b[34mDTS\u001b[39m Build start\n"}
19
- {"kind":"O","text":"\u001b[32mDTS\u001b[39m ⚡️ Build success in 3610ms\n"}
20
- {"kind":"O","text":"\u001b[32mDTS\u001b[39m \u001b[1mdist/index.d.ts \u001b[22m\u001b[32m5.10 KB\u001b[39m\n"}
21
- {"kind":"O","text":"\u001b[32mDTS\u001b[39m \u001b[1mdist/index.d.mts \u001b[22m\u001b[32m5.10 KB\u001b[39m\n"}
19
+ {"kind":"O","text":"\u001b[32mDTS\u001b[39m ⚡️ Build success in 3915ms\n"}
20
+ {"kind":"O","text":"\u001b[32mDTS\u001b[39m \u001b[1mdist/index.d.ts \u001b[22m\u001b[32m5.07 KB\u001b[39m\n"}
21
+ {"kind":"O","text":"\u001b[32mDTS\u001b[39m \u001b[1mdist/index.d.mts \u001b[22m\u001b[32m5.07 KB\u001b[39m\n"}
package/.rush/temp/package-deps_build.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "files": {
3
- "packages/plugins/panel-manager-plugin/.rush/temp/shrinkwrap-deps.json": "75dbadf340a3fdaa60befb137b12769e13b91282",
3
+ "packages/plugins/panel-manager-plugin/.rush/temp/shrinkwrap-deps.json": "1159c94db4b09a7f05036036ab86866fcd6196bd",
4
4
  "packages/plugins/panel-manager-plugin/eslint.config.js": "fc090051ebd4baacf22d6966ed4de1f236b9a73a",
5
- "packages/plugins/panel-manager-plugin/package.json": "cb0835394b1db5cfb167091ca40438cdbc571dbd",
5
+ "packages/plugins/panel-manager-plugin/package.json": "bf842678645faac40a291cd3e30b92786e2fee97",
6
6
  "packages/plugins/panel-manager-plugin/src/components/panel-layer/css.ts": "2cae7373567f0f293c9c802ea67515f1d9047d89",
7
- "packages/plugins/panel-manager-plugin/src/components/panel-layer/docked-panel-layer.tsx": "232cd8edbac3a8d8b17b2a5a07c463e57ee8f5c8",
7
+ "packages/plugins/panel-manager-plugin/src/components/panel-layer/docked-panel-layer.tsx": "bf8cea4403f5eb597de6213a4db0c993b7408b77",
8
8
  "packages/plugins/panel-manager-plugin/src/components/panel-layer/index.ts": "4c78ec72d6acde8f2192ac956436a870cccc583f",
9
- "packages/plugins/panel-manager-plugin/src/components/panel-layer/panel-layer.tsx": "d5a9464fa66a9819fa1b0055071990532fd819d9",
10
- "packages/plugins/panel-manager-plugin/src/components/panel-layer/panel.tsx": "b3d3567c664b32ef578620e6d60a97a44ea91bdc",
11
- "packages/plugins/panel-manager-plugin/src/components/resize-bar/index.tsx": "7712eb70c08b0826ac8940be64582287d279d564",
9
+ "packages/plugins/panel-manager-plugin/src/components/panel-layer/panel-layer.tsx": "36a22cbf570308e52c003070c88a16f503351605",
10
+ "packages/plugins/panel-manager-plugin/src/components/panel-layer/panel.tsx": "11c2d13d704c5532d146e84fca69b1bf7c2e113d",
11
+ "packages/plugins/panel-manager-plugin/src/components/resize-bar/index.tsx": "aaa6639bb92d39c12e6fce69ab8146172855c74f",
12
12
  "packages/plugins/panel-manager-plugin/src/contexts.ts": "21e828a3c16a060f92c62c52dd978224f2ab7436",
13
13
  "packages/plugins/panel-manager-plugin/src/create-panel-manager-plugin.ts": "660998495abbabc247370c3525e0009415e6f752",
14
14
  "packages/plugins/panel-manager-plugin/src/hooks/use-global-css.ts": "be94fd4759d691bdcc5eb8a03f90995956ce4bf0",
@@ -23,7 +23,7 @@
23
23
  "packages/plugins/panel-manager-plugin/src/services/panel-restore.ts": "c3151b5281cc35efb262654f8500556a23811829",
24
24
  "packages/plugins/panel-manager-plugin/src/types.ts": "938145cc6b7205d01cfb6a26c0be7da21127eaca",
25
25
  "packages/plugins/panel-manager-plugin/src/utils.ts": "4ceb7654f72dad582be35d0c48297bdc3a54b0e3",
26
- "packages/plugins/panel-manager-plugin/tsconfig.json": "4b7a4f197dc4f9c62c2938fb3b77780944ad7675"
26
+ "packages/plugins/panel-manager-plugin/tsconfig.json": "b8da61b7f031c954356d17b82669e982f82df5c5"
27
27
  },
28
28
  "arguments": "npm run build:fast -- --dts-resolve "
29
29
  }
package/.rush/temp/shrinkwrap-deps.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "../../packages/plugins/panel-manager-plugin": "../../packages/plugins/panel-manager-plugin:6NvHMKeGiIW3XkE78MP0g5Cr6dz80O0NqneafG0tgHE=:",
2
+ "../../packages/plugins/panel-manager-plugin": "../../packages/plugins/panel-manager-plugin:YGT/P/SxRNsJXTKUnQ6DrkNHtkbUdtbq5DyzfrvJK6c=:",
3
3
  "@esbuild/aix-ppc64@0.25.9": "sha512-OaGtL73Jck6pBKjNIe24BnFE6agGl+6KxDtTfHhy1HmhthfKouEcOhqpSL64K4/0WCtbKFLOdzD/44cJ4k9opA==",
4
4
  "@esbuild/android-arm64@0.25.9": "sha512-IDrddSmpSv51ftWslJMvl3Q2ZT98fUSL2/rlUXuVqRXHCs5EUF1/f+jbjF5+NG9UffUDMCiTyh8iec7u8RlTLg==",
5
5
  "@esbuild/android-arm@0.25.9": "sha512-5WNI1DaMtxQ7t7B6xa572XMXpHAaI/9Hnhk8lcxF4zVN4xstUgTlvuGDorBguKEnZO70qwEcLpfifMLoxiPqHQ==",
@@ -96,7 +96,7 @@
96
96
  "is-fullwidth-code-point@3.0.0": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
97
97
  "isexe@2.0.0": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
98
98
  "jackspeak@3.4.3": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
99
- "jiti@2.5.1": "sha512-twQoecYPiVA5K/h6SxtORw/Bs3ar+mLUtoPSc7iMXzQzK8d7eJ/R09wmTwAjiamETn1cXYPGfNnu7DMoHgu12w==",
99
+ "jiti@2.6.1": "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==",
100
100
  "joycon@3.1.1": "sha512-34wB/Y7MW7bzjKRjUKTa46I2Z7eV62Rkhva+KkopW7Qvv/OSWBqvkSY7vusOPrNuZcUG3tApvdVgNB8POj3SPw==",
101
101
  "js-tokens@4.0.0": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
102
102
  "lilconfig@3.1.3": "sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==",
@@ -122,7 +122,7 @@
122
122
  "picomatch@4.0.3": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
123
123
  "pirates@4.0.7": "sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==",
124
124
  "pkg-types@1.3.1": "sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==",
125
- "postcss-load-config@6.0.1(jiti@2.5.1)(postcss@8.5.6)(tsx@4.19.4)(yaml@2.8.1)": "sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==",
125
+ "postcss-load-config@6.0.1(jiti@2.6.1)(postcss@8.5.6)(tsx@4.19.4)(yaml@2.8.1)": "sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==",
126
126
  "postcss@8.5.6": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
127
127
  "punycode@2.3.1": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
128
128
  "react-dom@18.3.1(react@18.3.1)": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
@@ -151,7 +151,7 @@
151
151
  "tr46@1.0.1": "sha512-dTpowEjclQ7Kgx5SdBkqRzVhERQXov8/l9Ft9dVM9fmg0W0KQSVaXX9T4i6twCPNtYiZM53lpSSUAwJbFPOHxA==",
152
152
  "tree-kill@1.2.2": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
153
153
  "ts-interface-checker@0.1.13": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==",
154
- "tsup@8.5.0(jiti@2.5.1)(postcss@8.5.6)(tsx@4.19.4)(typescript@5.9.2)(yaml@2.8.1)": "sha512-VmBp77lWNQq6PfuMqCHD3xWl22vEoWsKajkF8t+yMBawlUS8JzEI+vOVMeuNZIuMML8qXRizFKi9oD5glKQVcQ==",
154
+ "tsup@8.5.0(jiti@2.6.1)(postcss@8.5.6)(tsx@4.19.4)(typescript@5.9.2)(yaml@2.8.1)": "sha512-VmBp77lWNQq6PfuMqCHD3xWl22vEoWsKajkF8t+yMBawlUS8JzEI+vOVMeuNZIuMML8qXRizFKi9oD5glKQVcQ==",
155
155
  "tsx@4.19.4": "sha512-gK5GVzDkJK1SI1zwHf32Mqxf2tSJkNx+eYcNly5+nHvWqXUJYUkWBQtKauoESz3ymezAI++ZwT855x5p5eop+Q==",
156
156
  "typescript@5.9.2": "sha512-CWBzXQrc/qOkhidw1OzBTQuYRbfyxDXJMVJ1XNwUHGROVmuaeiEm3OslpZ1RV96d7SKKjZKrSJu3+t/xlw3R9A==",
157
157
  "ufo@1.6.1": "sha512-9a4/uxlTWJ4+a5i0ooc1rU7C7YOw3wT+UGqdeNNHWnOF9qcMBgLRS+4IYUqbczewFx4mLEig6gawh7X6mFlEkA==",
@@ -162,5 +162,5 @@
162
162
  "wrap-ansi@7.0.0": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
163
163
  "wrap-ansi@8.1.0": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
164
164
  "yaml@2.8.1": "sha512-lcYcMxX2PO9XMGvAJkJ3OsNMw+/7FKes7/hgerGUYWIoWu5j/+YQqcZr5JnPZWzOsEBgMbSbiSTn/dv/69Mkpw==",
165
- "zustand@5.0.8(@types/react@18.3.24)(immer@10.1.3)(react@18.3.1)(use-sync-external-store@1.6.0(react@18.3.1))": "sha512-gyPKpIaxY9XcO2vSMrLbiER7QMAMGOQZVRdJ6Zi782jkbzZygq5GI9nG8g+sMgitRtndwaBSl7uiqC49o1SSiw=="
165
+ "zustand@4.5.7(@types/react@18.3.24)(immer@10.1.3)(react@18.3.1)": "sha512-CHOUy7mu3lbD6o6LJLfllpjkzhHXSBlX8B9+qPddUsIfeF5S/UZ5q0kmCsnRqT1UHFQZchNFDDzMbQsuesHWlw=="
166
166
  }
package/CHANGELOG.json CHANGED
@@ -2,9 +2,9 @@
2
2
  "name": "@flowgram.ai/panel-manager-plugin",
3
3
  "entries": [
4
4
  {
5
- "version": "1.0.7",
6
- "tag": "@flowgram.ai/panel-manager-plugin_v1.0.7",
7
- "date": "Tue, 20 Jan 2026 02:58:00 GMT",
5
+ "version": "1.0.9",
6
+ "tag": "@flowgram.ai/panel-manager-plugin_v1.0.9",
7
+ "date": "Mon, 23 Mar 2026 03:39:05 GMT",
8
8
  "comments": {}
9
9
  }
10
10
  ]
package/CHANGELOG.md CHANGED
@@ -1,9 +1,9 @@
1
1
  # Change Log - @flowgram.ai/panel-manager-plugin
2
2
 
3
- This log was last generated on Tue, 20 Jan 2026 02:58:00 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 23 Mar 2026 03:39:05 GMT and should not be manually modified.
4
4
 
5
- ## 1.0.7
6
- Tue, 20 Jan 2026 02:58:00 GMT
5
+ ## 1.0.9
6
+ Mon, 23 Mar 2026 03:39:05 GMT
7
7
 
8
8
  _Initial release_
9
9
 
package/dist/esm/index.js CHANGED
@@ -36,14 +36,14 @@ PanelRestoreImpl = __decorateClass([
36
36
  ], PanelRestoreImpl);
37
37
 
38
38
  // src/components/resize-bar/index.tsx
39
- import { useRef, useState } from "react";
40
- import { jsx } from "react/jsx-runtime";
39
+ import * as React from "react";
40
+ var { useRef, useState } = React;
41
41
  var ResizeBar = ({ onResize, size, direction }) => {
42
42
  const currentPoint = useRef(null);
43
43
  const [isDragging, setIsDragging] = useState(false);
44
44
  const [isHovered, setIsHovered] = useState(false);
45
45
  const isVertical = direction === "vertical";
46
- return /* @__PURE__ */ jsx(
46
+ return /* @__PURE__ */ React.createElement(
47
47
  "div",
48
48
  {
49
49
  onMouseDown: (e) => {
@@ -86,23 +86,23 @@ var ResizeBar = ({ onResize, size, direction }) => {
86
86
  marginTop: -5,
87
87
  height: 10
88
88
  }
89
- },
90
- children: /* @__PURE__ */ jsx(
91
- "div",
92
- {
93
- style: {
94
- ...isVertical ? {
95
- width: 3,
96
- height: "100%"
97
- } : {
98
- height: 3,
99
- width: "100%"
100
- },
101
- backgroundColor: isDragging || isHovered ? "var(--g-playground-line)" : "transparent"
102
- }
89
+ }
90
+ },
91
+ /* @__PURE__ */ React.createElement(
92
+ "div",
93
+ {
94
+ style: {
95
+ ...isVertical ? {
96
+ width: 3,
97
+ height: "100%"
98
+ } : {
99
+ height: 3,
100
+ width: "100%"
101
+ },
102
+ backgroundColor: isDragging || isHovered ? "var(--g-playground-line)" : "transparent"
103
103
  }
104
- )
105
- }
104
+ }
105
+ )
106
106
  );
107
107
  };
108
108
 
@@ -359,12 +359,13 @@ PanelManager = __decorateClass([
359
359
 
360
360
  // src/services/panel-layer.ts
361
361
  import ReactDOM from "react-dom";
362
- import { createElement } from "react";
362
+ import { createElement as createElement5 } from "react";
363
363
  import { injectable as injectable4, inject as inject3 } from "inversify";
364
364
  import { domUtils, Disposable } from "@flowgram.ai/utils";
365
365
  import { Layer, PluginContext } from "@flowgram.ai/core";
366
366
 
367
367
  // src/components/panel-layer/panel-layer.tsx
368
+ import * as React3 from "react";
368
369
  import clsx2 from "clsx";
369
370
 
370
371
  // src/hooks/use-global-css.ts
@@ -385,7 +386,7 @@ var useGlobalCSS = ({ cssText, id, cleanup }) => {
385
386
  };
386
387
 
387
388
  // src/components/panel-layer/panel.tsx
388
- import { useEffect as useEffect2, startTransition, useState as useState2, useRef as useRef2 } from "react";
389
+ import * as React2 from "react";
389
390
  import { clsx } from "clsx";
390
391
 
391
392
  // src/hooks/use-panel-manager.ts
@@ -409,7 +410,7 @@ var usePanelStore = (selector) => {
409
410
  };
410
411
 
411
412
  // src/components/panel-layer/panel.tsx
412
- import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
413
+ var { useEffect: useEffect2, useState: useState2, useRef: useRef2 } = React2;
413
414
  var PanelItem = ({ panel, hidden }) => {
414
415
  const panelManager = usePanelManager();
415
416
  const ref = useRef2(null);
@@ -452,44 +453,51 @@ var PanelItem = ({ panel, hidden }) => {
452
453
  observer.observe(layer);
453
454
  return () => observer.disconnect();
454
455
  }, [fullscreen]);
455
- return /* @__PURE__ */ jsxs(
456
+ return /* @__PURE__ */ React2.createElement(
456
457
  "div",
457
458
  {
458
459
  className: clsx(
459
460
  "gedit-flow-panel-wrap",
460
461
  isHorizontal ? "panel-horizontal" : "panel-vertical"
461
462
  ),
463
+ key: panel.id,
462
464
  ref,
463
465
  style: {
464
466
  display: hidden ? "none" : "block",
465
467
  ...panel.factory.style,
466
468
  ...panel.config.style,
467
469
  ...sizeStyle
468
- },
469
- children: [
470
- panel.resizable && panelManager.config.resizeBarRender({
471
- size,
472
- direction: isHorizontal ? "vertical" : "horizontal",
473
- onResize: handleResize
474
- }),
475
- panel.renderer
476
- ]
470
+ }
477
471
  },
478
- panel.id
472
+ panel.resizable && panelManager.config.resizeBarRender({
473
+ size,
474
+ direction: isHorizontal ? "vertical" : "horizontal",
475
+ onResize: handleResize
476
+ }),
477
+ panel.renderer
479
478
  );
480
479
  };
481
480
  var PanelArea = ({ area }) => {
482
481
  const panelManager = usePanelManager();
483
482
  const [panels, setPanels] = useState2(panelManager.getPanels(area));
484
483
  useEffect2(() => {
484
+ let pending;
485
+ function startTransition(fn) {
486
+ clearTimeout(pending);
487
+ pending = setTimeout(fn, 0);
488
+ }
485
489
  const dispose = panelManager.onPanelsChange(() => {
486
- startTransition(() => {
487
- setPanels(panelManager.getPanels(area));
488
- });
490
+ const r = { ...React2 };
491
+ const start = r["startTransition"];
492
+ if (typeof start === "function") {
493
+ start(() => setPanels(panelManager.getPanels(area)));
494
+ } else {
495
+ startTransition(() => setPanels(panelManager.getPanels(area)));
496
+ }
489
497
  });
490
498
  return () => dispose.dispose();
491
499
  }, []);
492
- return /* @__PURE__ */ jsx2(Fragment, { children: panels.map((panel) => /* @__PURE__ */ jsx2(PanelContext.Provider, { value: panel, children: /* @__PURE__ */ jsx2(PanelItem, { panel, hidden: panel.keepDOM && !panel.visible }) }, panel.id)) });
500
+ return /* @__PURE__ */ React2.createElement(React2.Fragment, null, panels.map((panel) => /* @__PURE__ */ React2.createElement(PanelContext.Provider, { value: panel, key: panel.id }, /* @__PURE__ */ React2.createElement(PanelItem, { panel, hidden: panel.keepDOM && !panel.visible }))));
493
501
  };
494
502
 
495
503
  // src/components/panel-layer/css.ts
@@ -558,7 +566,6 @@ var globalCSS = `
558
566
  `;
559
567
 
560
568
  // src/components/panel-layer/panel-layer.tsx
561
- import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
562
569
  var PanelLayer = ({
563
570
  mode = "floating",
564
571
  className,
@@ -569,7 +576,7 @@ var PanelLayer = ({
569
576
  cssText: globalCSS,
570
577
  id: "flow-panel-layer-css"
571
578
  });
572
- return /* @__PURE__ */ jsxs2(
579
+ return /* @__PURE__ */ React3.createElement(
573
580
  "div",
574
581
  {
575
582
  className: clsx2(
@@ -578,21 +585,16 @@ var PanelLayer = ({
578
585
  mode === "floating" && "gedit-flow-panel-layer-wrap-floating",
579
586
  className
580
587
  ),
581
- style,
582
- children: [
583
- /* @__PURE__ */ jsxs2("div", { className: "gedit-flow-panel-left-area", children: [
584
- /* @__PURE__ */ jsx3("div", { className: "gedit-flow-panel-main-area", children }),
585
- /* @__PURE__ */ jsx3("div", { className: "gedit-flow-panel-bottom-area", children: /* @__PURE__ */ jsx3(PanelArea, { area: mode === "docked" ? "docked-bottom" : "bottom" }) })
586
- ] }),
587
- /* @__PURE__ */ jsx3("div", { className: "gedit-flow-panel-right-area", children: /* @__PURE__ */ jsx3(PanelArea, { area: mode === "docked" ? "docked-right" : "right" }) })
588
- ]
589
- }
588
+ style
589
+ },
590
+ /* @__PURE__ */ React3.createElement("div", { className: "gedit-flow-panel-left-area" }, /* @__PURE__ */ React3.createElement("div", { className: "gedit-flow-panel-main-area" }, children), /* @__PURE__ */ React3.createElement("div", { className: "gedit-flow-panel-bottom-area" }, /* @__PURE__ */ React3.createElement(PanelArea, { area: mode === "docked" ? "docked-bottom" : "bottom" }))),
591
+ /* @__PURE__ */ React3.createElement("div", { className: "gedit-flow-panel-right-area" }, /* @__PURE__ */ React3.createElement(PanelArea, { area: mode === "docked" ? "docked-right" : "right" }))
590
592
  );
591
593
  };
592
594
 
593
595
  // src/components/panel-layer/docked-panel-layer.tsx
594
- import { jsx as jsx4 } from "react/jsx-runtime";
595
- var DockedPanelLayer = (props) => /* @__PURE__ */ jsx4(PanelLayer, { mode: "docked", ...props });
596
+ import * as React4 from "react";
597
+ var DockedPanelLayer = (props) => /* @__PURE__ */ React4.createElement(PanelLayer, { mode: "docked", ...props });
596
598
 
597
599
  // src/services/panel-layer.ts
598
600
  var PanelLayer2 = class extends Layer {
@@ -622,7 +624,7 @@ var PanelLayer2 = class extends Layer {
622
624
  render() {
623
625
  if (!this.layout) {
624
626
  const { children, ...layoutProps } = this.panelConfig.layerProps;
625
- this.layout = createElement(PanelLayer, layoutProps, children);
627
+ this.layout = createElement5(PanelLayer, layoutProps, children);
626
628
  }
627
629
  return ReactDOM.createPortal(this.layout, this.panelRoot);
628
630
  }
package/dist/esm/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/create-panel-manager-plugin.ts","../../src/services/panel-factory.ts","../../src/services/panel-restore.ts","../../src/components/resize-bar/index.tsx","../../src/services/panel-config.ts","../../src/utils.ts","../../src/services/panel-manager.ts","../../src/services/panel-layer.ts","../../src/components/panel-layer/panel-layer.tsx","../../src/hooks/use-global-css.ts","../../src/components/panel-layer/panel.tsx","../../src/hooks/use-panel-manager.ts","../../src/hooks/use-panel.ts","../../src/contexts.ts","../../src/components/panel-layer/css.ts","../../src/components/panel-layer/docked-panel-layer.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport {\n PanelEntityFactory,\n PanelEntity,\n PanelEntityFactoryConstant,\n PanelEntityConfigConstant,\n} from './services/panel-factory';\nimport { defineConfig } from './services/panel-config';\nimport {\n PanelManager,\n PanelManagerConfig,\n PanelLayer,\n PanelRestore,\n PanelRestoreImpl,\n} from './services';\n\nexport const createPanelManagerPlugin = definePluginCreator<Partial<PanelManagerConfig>>({\n onBind: ({ bind }, opt) => {\n bind(PanelManager).to(PanelManager).inSingletonScope();\n bind(PanelRestore).to(PanelRestoreImpl).inSingletonScope();\n bind(PanelManagerConfig).toConstantValue(defineConfig(opt));\n bind(PanelEntityFactory).toFactory(\n (context) =>\n ({\n factory,\n config,\n }: {\n factory: PanelEntityFactoryConstant;\n config: PanelEntityConfigConstant;\n }) => {\n const container = context.container.createChild();\n container.bind(PanelEntityFactoryConstant).toConstantValue(factory);\n container.bind(PanelEntityConfigConstant).toConstantValue(config);\n const panel = container.resolve(PanelEntity);\n panel.init();\n return panel;\n }\n );\n },\n onInit(ctx) {\n ctx.playground.registerLayer(PanelLayer);\n const panelManager = ctx.container.get<PanelManager>(PanelManager);\n panelManager.init();\n },\n});\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { createStore, StoreApi } from 'zustand/vanilla';\nimport { nanoid } from 'nanoid';\nimport { inject, injectable } from 'inversify';\n\nimport type { PanelFactory, PanelEntityConfig, Area } from '../types';\nimport { PanelRestore } from './panel-restore';\nimport { PanelManagerConfig } from './panel-config';\nimport { merge } from '../utils';\n\nexport const PanelEntityFactory = Symbol('PanelEntityFactory');\nexport type PanelEntityFactory = (options: {\n factory: PanelEntityFactoryConstant;\n config: PanelEntityConfigConstant;\n}) => PanelEntity;\n\nexport const PanelEntityFactoryConstant = Symbol('PanelEntityFactoryConstant');\nexport type PanelEntityFactoryConstant = PanelFactory<any>;\nexport const PanelEntityConfigConstant = Symbol('PanelEntityConfigConstant');\nexport type PanelEntityConfigConstant = PanelEntityConfig<any> & {\n area: Area;\n};\n\nconst PANEL_SIZE_DEFAULT = 400;\n\nexport interface PanelEntityState {\n size: number;\n fullscreen: boolean;\n visible: boolean;\n}\n\n@injectable()\nexport class PanelEntity {\n @inject(PanelRestore) restore: PanelRestore;\n\n /** 面板工厂 */\n @inject(PanelEntityFactoryConstant) public factory: PanelEntityFactoryConstant;\n\n @inject(PanelEntityConfigConstant) public config: PanelEntityConfigConstant;\n\n @inject(PanelManagerConfig) readonly globalConfig: PanelManagerConfig;\n\n private initialized = false;\n\n /** 实例唯一标识 */\n id: string = nanoid();\n\n /** 渲染缓存 */\n node: React.ReactNode = null;\n\n store: StoreApi<PanelEntityState>;\n\n get area() {\n return this.config.area;\n }\n\n get mode() {\n return this.config.area.startsWith('docked') ? 'docked' : 'floating';\n }\n\n get key() {\n return this.factory.key;\n }\n\n get renderer() {\n if (!this.node) {\n this.node = this.factory.render(this.config.props);\n }\n return this.node;\n }\n\n get fullscreen() {\n return this.store.getState().fullscreen;\n }\n\n set fullscreen(next: boolean) {\n this.store.setState({ fullscreen: next });\n }\n\n get resizable() {\n if (this.fullscreen) {\n return false;\n }\n return this.factory.resize !== undefined ? this.factory.resize : this.globalConfig.autoResize;\n }\n\n get keepDOM() {\n return this.factory.keepDOM;\n }\n\n get visible() {\n return this.store.getState().visible;\n }\n\n set visible(next: boolean) {\n this.store.setState({ visible: next });\n }\n\n get layer() {\n return document.querySelector(\n this.mode ? '.gedit-flow-panel-layer-wrap-docked' : '.gedit-flow-panel-layer-wrap-floating'\n );\n }\n\n init() {\n if (this.initialized) {\n return;\n }\n this.initialized = true;\n const cache = this.restore.restore<PanelEntityState>(this.key);\n\n const initialState = merge<PanelEntityState>(\n {\n size: this.config.defaultSize,\n fullscreen: this.config.fullscreen,\n },\n cache ? cache : {},\n {\n size: this.factory.defaultSize || PANEL_SIZE_DEFAULT,\n fullscreen: this.factory.fullscreen || false,\n ...(this.factory.keepDOM ? { visible: true } : {}),\n }\n );\n\n this.store = createStore<PanelEntityState>(() => initialState);\n }\n\n mergeState() {}\n\n dispose() {\n this.restore.store(this.key, this.store.getState());\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable } from 'inversify';\n\nexport const PanelRestore = Symbol('PanelRestore');\nexport interface PanelRestore {\n store: (k: string, v: any) => void;\n restore: <T>(k: string) => T | undefined;\n}\n\n@injectable()\nexport class PanelRestoreImpl implements PanelRestore {\n map = new Map<string, any>();\n\n store(k: string, v: any) {\n this.map.set(k, v);\n }\n\n restore<T>(k: string): T | undefined {\n return this.map.get(k) as T;\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport React, { useRef, useState } from 'react';\n\ninterface Props {\n size: number;\n direction?: 'vertical' | 'horizontal';\n onResize: (w: number) => void;\n}\n\nexport const ResizeBar: React.FC<Props> = ({ onResize, size, direction }) => {\n const currentPoint = useRef<null | number>(null);\n const [isDragging, setIsDragging] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n\n const isVertical = direction === 'vertical';\n\n return (\n <div\n onMouseDown={(e) => {\n currentPoint.current = isVertical ? e.clientX : e.clientY;\n e.stopPropagation();\n e.preventDefault();\n setIsDragging(true);\n const mouseUp = () => {\n currentPoint.current = null;\n document.body.removeEventListener('mouseup', mouseUp);\n document.body.removeEventListener('mousemove', mouseMove);\n setIsDragging(false);\n };\n const mouseMove = (e: MouseEvent) => {\n const delta = currentPoint.current! - (isVertical ? e.clientX : e.clientY);\n onResize(size + delta);\n };\n document.body.addEventListener('mouseup', mouseUp);\n document.body.addEventListener('mousemove', mouseMove);\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 999,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'auto',\n ...(isVertical\n ? {\n cursor: 'ew-resize',\n height: '100%',\n marginLeft: -5,\n width: 10,\n }\n : {\n cursor: 'ns-resize',\n width: '100%',\n marginTop: -5,\n height: 10,\n }),\n }}\n >\n <div\n style={{\n ...(isVertical\n ? {\n width: 3,\n height: '100%',\n }\n : {\n height: 3,\n width: '100%',\n }),\n backgroundColor: isDragging || isHovered ? 'var(--g-playground-line)' : 'transparent',\n }}\n />\n </div>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { PluginContext } from '@flowgram.ai/core';\n\nimport type { PanelFactory, PanelConfig } from '../types';\nimport { ResizeBar } from '../components/resize-bar';\nimport type { PanelLayerProps } from '../components/panel-layer';\n\nexport interface PanelManagerConfig {\n factories: PanelFactory<any>[];\n right: PanelConfig;\n bottom: PanelConfig;\n dockedRight: PanelConfig;\n dockedBottom: PanelConfig;\n /** Resizable, and multi-panel options mutually exclusive */\n autoResize: boolean;\n layerProps: PanelLayerProps;\n resizeBarRender: ({\n size,\n }: {\n size: number;\n direction?: 'vertical' | 'horizontal';\n onResize: (size: number) => void;\n }) => React.ReactNode;\n getPopupContainer: (ctx: PluginContext) => HTMLElement; // default playground.node.parentElement\n}\n\nexport const PanelManagerConfig = Symbol('PanelManagerConfig');\n\nexport const defineConfig = (config: Partial<PanelManagerConfig>) => {\n const defaultConfig: PanelManagerConfig = {\n right: {\n max: 1,\n },\n bottom: {\n max: 1,\n },\n dockedRight: {\n max: 1,\n },\n dockedBottom: {\n max: 1,\n },\n factories: [],\n autoResize: true,\n layerProps: {},\n resizeBarRender: ResizeBar,\n getPopupContainer: (ctx: PluginContext) => ctx.playground.node.parentNode as HTMLElement,\n };\n return {\n ...defaultConfig,\n ...config,\n };\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const merge = <T>(...objs: Partial<T>[]) => {\n const result: any = {};\n\n for (const obj of objs) {\n if (!obj || typeof obj !== 'object') continue;\n\n for (const key of Object.keys(obj)) {\n const value = (obj as any)[key];\n\n if (result[key] === undefined) {\n result[key] = value;\n }\n }\n }\n\n return result as T;\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable, inject } from 'inversify';\nimport { Emitter } from '@flowgram.ai/utils';\n\nimport { PanelManagerConfig } from './panel-config';\nimport type { Area, PanelEntityConfig, PanelFactory } from '../types';\nimport { PanelEntity, PanelEntityFactory } from './panel-factory';\n\n@injectable()\nexport class PanelManager {\n @inject(PanelManagerConfig) readonly config: PanelManagerConfig;\n\n @inject(PanelEntityFactory) readonly createPanel: PanelEntityFactory;\n\n readonly panelRegistry = new Map<string, PanelFactory<any>>();\n\n private panels = new Map<string, PanelEntity>();\n\n private onPanelsChangeEvent = new Emitter<void>();\n\n public onPanelsChange = this.onPanelsChangeEvent.event;\n\n init() {\n this.config.factories.forEach((factory) => this.register(factory));\n }\n\n /** registry panel factory */\n register<T extends any>(factory: PanelFactory<T>) {\n this.panelRegistry.set(factory.key, factory);\n }\n\n /** open panel */\n public open(key: string, area: Area = 'right', options?: PanelEntityConfig) {\n const factory = this.panelRegistry.get(key);\n if (!factory) {\n return;\n }\n\n const sameKeyPanels = this.getPanels(area).filter((p) => p.key === key);\n\n if (factory.keepDOM && sameKeyPanels.length) {\n const [panel] = sameKeyPanels;\n // move to last\n this.panels.delete(panel.id);\n this.panels.set(panel.id, panel);\n panel.visible = true;\n } else {\n if (!factory.allowDuplicates && sameKeyPanels.length) {\n sameKeyPanels.forEach((p) => this.remove(p.id));\n }\n const panel = this.createPanel({\n factory,\n config: {\n area,\n ...options,\n },\n });\n\n this.panels.set(panel.id, panel);\n }\n\n this.trim(area);\n this.onPanelsChangeEvent.fire();\n }\n\n /** close panel */\n public close(key?: string) {\n const panels = this.getPanels();\n const closedPanels = key ? panels.filter((p) => p.key === key) : panels;\n closedPanels.forEach((panel) => {\n this.remove(panel.id);\n });\n this.onPanelsChangeEvent.fire();\n }\n\n private trim(area: Area) {\n /** 1. general panel; 2. keepDOM visible panel */\n const panels = this.getPanels(area).filter((p) => !p.keepDOM || p.visible);\n const areaConfig = this.getAreaConfig(area);\n while (panels.length > areaConfig.max) {\n const removed = panels.shift();\n if (removed) {\n this.remove(removed.id);\n }\n }\n }\n\n private remove(id: string) {\n const panel = this.panels.get(id);\n if (!panel) {\n return;\n }\n if (panel.keepDOM) {\n panel.visible = false;\n } else {\n panel.dispose();\n this.panels.delete(id);\n }\n }\n\n getPanels(area?: Area) {\n const panels: PanelEntity[] = [];\n this.panels.forEach((panel) => {\n if (!area || panel.area === area) {\n panels.push(panel);\n }\n });\n return panels;\n }\n\n getAreaConfig(area: Area) {\n switch (area) {\n case 'docked-bottom':\n return this.config.dockedBottom;\n case 'docked-right':\n return this.config.dockedRight;\n case 'bottom':\n return this.config.bottom;\n case 'right':\n default:\n return this.config.right;\n }\n }\n\n dispose() {\n this.onPanelsChangeEvent.dispose();\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport ReactDOM from 'react-dom';\nimport { createElement } from 'react';\n\nimport { injectable, inject } from 'inversify';\nimport { domUtils, Disposable } from '@flowgram.ai/utils';\nimport { Layer, PluginContext } from '@flowgram.ai/core';\n\nimport { PanelLayer as PanelLayerComp } from '../components/panel-layer';\nimport { PanelManagerConfig } from './panel-config';\n\n@injectable()\nexport class PanelLayer extends Layer {\n @inject(PanelManagerConfig) private readonly panelConfig: PanelManagerConfig;\n\n @inject(PluginContext) private readonly pluginContext: PluginContext;\n\n readonly panelRoot = domUtils.createDivWithClass('gedit-flow-panel-layer');\n\n layout: JSX.Element | null = null;\n\n onReady(): void {\n this.panelConfig.getPopupContainer(this.pluginContext).appendChild(this.panelRoot);\n this.toDispose.push(\n Disposable.create(() => {\n // Remove from PopupContainer\n this.panelRoot.remove();\n })\n );\n const commonStyle = {\n pointerEvents: 'none',\n width: '100%',\n height: '100%',\n position: 'absolute',\n left: 0,\n top: 0,\n zIndex: 100,\n };\n domUtils.setStyle(this.panelRoot, commonStyle);\n }\n\n render(): JSX.Element {\n if (!this.layout) {\n const { children, ...layoutProps } = this.panelConfig.layerProps;\n this.layout = createElement(PanelLayerComp, layoutProps, children);\n }\n return ReactDOM.createPortal(this.layout, this.panelRoot);\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport clsx from 'clsx';\n\nimport { useGlobalCSS } from '../../hooks/use-global-css';\nimport { PanelArea } from './panel';\nimport { globalCSS } from './css';\n\nexport type PanelLayerProps = React.PropsWithChildren<{\n /** 模式：悬浮｜挤压 */\n mode?: 'floating' | 'docked';\n className?: string;\n style?: React.CSSProperties;\n}>;\n\nexport const PanelLayer: React.FC<PanelLayerProps> = ({\n mode = 'floating',\n className,\n style,\n children,\n}) => {\n useGlobalCSS({\n cssText: globalCSS,\n id: 'flow-panel-layer-css',\n });\n\n return (\n <div\n className={clsx(\n 'gedit-flow-panel-layer-wrap',\n mode === 'docked' && 'gedit-flow-panel-layer-wrap-docked',\n mode === 'floating' && 'gedit-flow-panel-layer-wrap-floating',\n className\n )}\n style={style}\n >\n <div className=\"gedit-flow-panel-left-area\">\n <div className=\"gedit-flow-panel-main-area\">{children}</div>\n <div className=\"gedit-flow-panel-bottom-area\">\n <PanelArea area={mode === 'docked' ? 'docked-bottom' : 'bottom'} />\n </div>\n </div>\n <div className=\"gedit-flow-panel-right-area\">\n <PanelArea area={mode === 'docked' ? 'docked-right' : 'right'} />\n </div>\n </div>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useEffect } from 'react';\n\ninterface UseGlobalCSSOptions {\n cssText: string;\n id: string;\n cleanup?: boolean;\n}\n\nexport const useGlobalCSS = ({ cssText, id, cleanup }: UseGlobalCSSOptions) => {\n useEffect(() => {\n /** SSR safe */\n if (typeof document === 'undefined') return;\n\n if (document.getElementById(id)) return;\n\n const style = document.createElement('style');\n style.id = id;\n style.textContent = cssText;\n document.head.appendChild(style);\n\n return () => {\n const existing = document.getElementById(id);\n if (existing && cleanup) existing.remove();\n };\n }, [id]);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useEffect, startTransition, useState, useRef } from 'react';\n\nimport { clsx } from 'clsx';\n\nimport { Area } from '../../types';\nimport { PanelEntity } from '../../services/panel-factory';\nimport { usePanelManager } from '../../hooks/use-panel-manager';\nimport { usePanelStore } from '../../hooks/use-panel';\nimport { PanelContext } from '../../contexts';\n\nconst PanelItem: React.FC<{ panel: PanelEntity; hidden?: boolean }> = ({ panel, hidden }) => {\n const panelManager = usePanelManager();\n const ref = useRef<HTMLDivElement>(null);\n\n const isHorizontal = ['right', 'docked-right'].includes(panel.area);\n\n const { size, fullscreen } = usePanelStore((s) => ({\n size: s.size,\n fullscreen: s.fullscreen,\n }));\n\n const [layerSize, setLayerSize] = useState(size);\n\n const currentSize = fullscreen ? layerSize : size;\n\n const sizeStyle = isHorizontal ? { width: currentSize } : { height: currentSize };\n const handleResize = (next: number) => {\n let nextSize = next;\n if (typeof panel.factory.maxSize === 'number' && nextSize > panel.factory.maxSize) {\n nextSize = panel.factory.maxSize;\n } else if (typeof panel.factory.minSize === 'number' && nextSize < panel.factory.minSize) {\n nextSize = panel.factory.minSize;\n }\n panel.store.setState({ size: nextSize });\n };\n\n useEffect(() => {\n /** The set size may be illegal and needs to be updated according to the real element rendered for the first time. */\n if (ref.current && !fullscreen) {\n const { width, height } = ref.current.getBoundingClientRect();\n const realSize = isHorizontal ? width : height;\n panel.store.setState({ size: realSize });\n }\n }, [fullscreen]);\n\n useEffect(() => {\n if (!fullscreen) {\n return;\n }\n const layer = panel.layer;\n if (!layer) {\n return;\n }\n const observer = new ResizeObserver(([entry]) => {\n const { width, height } = entry.contentRect;\n setLayerSize(isHorizontal ? width : height);\n });\n observer.observe(layer);\n return () => observer.disconnect();\n }, [fullscreen]);\n\n return (\n <div\n className={clsx(\n 'gedit-flow-panel-wrap',\n isHorizontal ? 'panel-horizontal' : 'panel-vertical'\n )}\n key={panel.id}\n ref={ref}\n style={{\n display: hidden ? 'none' : 'block',\n ...panel.factory.style,\n ...panel.config.style,\n ...sizeStyle,\n }}\n >\n {panel.resizable &&\n panelManager.config.resizeBarRender({\n size,\n direction: isHorizontal ? 'vertical' : 'horizontal',\n onResize: handleResize,\n })}\n {panel.renderer}\n </div>\n );\n};\n\nexport const PanelArea: React.FC<{ area: Area }> = ({ area }) => {\n const panelManager = usePanelManager();\n const [panels, setPanels] = useState(panelManager.getPanels(area));\n\n useEffect(() => {\n const dispose = panelManager.onPanelsChange(() => {\n startTransition(() => {\n setPanels(panelManager.getPanels(area));\n });\n });\n return () => dispose.dispose();\n }, []);\n\n return (\n <>\n {panels.map((panel) => (\n <PanelContext.Provider value={panel} key={panel.id}>\n <PanelItem panel={panel} hidden={panel.keepDOM && !panel.visible} />\n </PanelContext.Provider>\n ))}\n </>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useService } from '@flowgram.ai/core';\n\nimport { PanelManager } from '../services/panel-manager';\n\nexport const usePanelManager = () => useService<PanelManager>(PanelManager);\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useContext } from 'react';\n\nimport { useStoreWithEqualityFn } from 'zustand/traditional';\nimport { shallow } from 'zustand/shallow';\n\nimport { PanelEntityState } from '../services/panel-factory';\nimport { PanelContext } from '../contexts';\n\nexport const usePanel = () => useContext(PanelContext);\n\nexport const usePanelStore = <T>(selector: (s: PanelEntityState) => T) => {\n const panel = usePanel();\n return useStoreWithEqualityFn(panel.store, selector, shallow);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { createContext } from 'react';\n\nimport type { PanelEntity } from './services/panel-factory';\n\nexport const PanelContext = createContext({} as PanelEntity);\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const globalCSS = `\n .gedit-flow-panel-layer-wrap * {\n box-sizing: border-box;\n }\n .gedit-flow-panel-layer-wrap {\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n }\n .gedit-flow-panel-layer-wrap-docked {\n\n }\n .gedit-flow-panel-layer-wrap-floating {\n pointer-events: none;\n }\n\n .gedit-flow-panel-left-area {\n width: 100%;\n min-width: 0;\n flex-grow: 0;\n flex-shrink: 1;\n display: flex;\n flex-direction: column;\n }\n .gedit-flow-panel-right-area {\n height: 100%;\n flex-grow: 1;\n flex-shrink: 0;\n min-width: 0;\n display: flex;\n max-width: 100%;\n }\n\n .gedit-flow-panel-main-area {\n position: relative;\n overflow: hidden;\n flex-grow: 0;\n flex-shrink: 1;\n width: 100%;\n height: 100%;\n }\n .gedit-flow-panel-bottom-area {\n flex-grow: 1;\n flex-shrink: 0;\n width: 100%;\n min-height: 0;\n }\n .gedit-flow-panel-wrap {\n pointer-events: auto;\n overflow: auto;\n position: relative;\n }\n .gedit-flow-panel-wrap.panel-horizontal {\n height: 100%;\n }\n .gedit-flow-panel-wrap.panel-vertical {\n width: 100%;\n }\n`;\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { PanelLayer, PanelLayerProps } from './panel-layer';\n\nexport type DockedPanelLayerProps = Omit<PanelLayerProps, 'mode'>;\n\nexport const DockedPanelLayer: React.FC<DockedPanelLayerProps> = (props) => (\n <PanelLayer mode=\"docked\" {...props} />\n);\n"],"mappings":"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","names":["injectable","e","injectable","injectable","inject","inject","injectable","injectable","inject","clsx","useEffect","useState","useRef","jsx","useRef","useState","useEffect","jsx","jsxs","clsx","jsx","PanelLayer","inject","injectable","PanelLayer"]}
1
+ {"version":3,"sources":["../../src/create-panel-manager-plugin.ts","../../src/services/panel-factory.ts","../../src/services/panel-restore.ts","../../src/components/resize-bar/index.tsx","../../src/services/panel-config.ts","../../src/utils.ts","../../src/services/panel-manager.ts","../../src/services/panel-layer.ts","../../src/components/panel-layer/panel-layer.tsx","../../src/hooks/use-global-css.ts","../../src/components/panel-layer/panel.tsx","../../src/hooks/use-panel-manager.ts","../../src/hooks/use-panel.ts","../../src/contexts.ts","../../src/components/panel-layer/css.ts","../../src/components/panel-layer/docked-panel-layer.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport {\n PanelEntityFactory,\n PanelEntity,\n PanelEntityFactoryConstant,\n PanelEntityConfigConstant,\n} from './services/panel-factory';\nimport { defineConfig } from './services/panel-config';\nimport {\n PanelManager,\n PanelManagerConfig,\n PanelLayer,\n PanelRestore,\n PanelRestoreImpl,\n} from './services';\n\nexport const createPanelManagerPlugin = definePluginCreator<Partial<PanelManagerConfig>>({\n onBind: ({ bind }, opt) => {\n bind(PanelManager).to(PanelManager).inSingletonScope();\n bind(PanelRestore).to(PanelRestoreImpl).inSingletonScope();\n bind(PanelManagerConfig).toConstantValue(defineConfig(opt));\n bind(PanelEntityFactory).toFactory(\n (context) =>\n ({\n factory,\n config,\n }: {\n factory: PanelEntityFactoryConstant;\n config: PanelEntityConfigConstant;\n }) => {\n const container = context.container.createChild();\n container.bind(PanelEntityFactoryConstant).toConstantValue(factory);\n container.bind(PanelEntityConfigConstant).toConstantValue(config);\n const panel = container.resolve(PanelEntity);\n panel.init();\n return panel;\n }\n );\n },\n onInit(ctx) {\n ctx.playground.registerLayer(PanelLayer);\n const panelManager = ctx.container.get<PanelManager>(PanelManager);\n panelManager.init();\n },\n});\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { createStore, StoreApi } from 'zustand/vanilla';\nimport { nanoid } from 'nanoid';\nimport { inject, injectable } from 'inversify';\n\nimport type { PanelFactory, PanelEntityConfig, Area } from '../types';\nimport { PanelRestore } from './panel-restore';\nimport { PanelManagerConfig } from './panel-config';\nimport { merge } from '../utils';\n\nexport const PanelEntityFactory = Symbol('PanelEntityFactory');\nexport type PanelEntityFactory = (options: {\n factory: PanelEntityFactoryConstant;\n config: PanelEntityConfigConstant;\n}) => PanelEntity;\n\nexport const PanelEntityFactoryConstant = Symbol('PanelEntityFactoryConstant');\nexport type PanelEntityFactoryConstant = PanelFactory<any>;\nexport const PanelEntityConfigConstant = Symbol('PanelEntityConfigConstant');\nexport type PanelEntityConfigConstant = PanelEntityConfig<any> & {\n area: Area;\n};\n\nconst PANEL_SIZE_DEFAULT = 400;\n\nexport interface PanelEntityState {\n size: number;\n fullscreen: boolean;\n visible: boolean;\n}\n\n@injectable()\nexport class PanelEntity {\n @inject(PanelRestore) restore: PanelRestore;\n\n /** 面板工厂 */\n @inject(PanelEntityFactoryConstant) public factory: PanelEntityFactoryConstant;\n\n @inject(PanelEntityConfigConstant) public config: PanelEntityConfigConstant;\n\n @inject(PanelManagerConfig) readonly globalConfig: PanelManagerConfig;\n\n private initialized = false;\n\n /** 实例唯一标识 */\n id: string = nanoid();\n\n /** 渲染缓存 */\n node: React.ReactNode = null;\n\n store: StoreApi<PanelEntityState>;\n\n get area() {\n return this.config.area;\n }\n\n get mode() {\n return this.config.area.startsWith('docked') ? 'docked' : 'floating';\n }\n\n get key() {\n return this.factory.key;\n }\n\n get renderer() {\n if (!this.node) {\n this.node = this.factory.render(this.config.props);\n }\n return this.node;\n }\n\n get fullscreen() {\n return this.store.getState().fullscreen;\n }\n\n set fullscreen(next: boolean) {\n this.store.setState({ fullscreen: next });\n }\n\n get resizable() {\n if (this.fullscreen) {\n return false;\n }\n return this.factory.resize !== undefined ? this.factory.resize : this.globalConfig.autoResize;\n }\n\n get keepDOM() {\n return this.factory.keepDOM;\n }\n\n get visible() {\n return this.store.getState().visible;\n }\n\n set visible(next: boolean) {\n this.store.setState({ visible: next });\n }\n\n get layer() {\n return document.querySelector(\n this.mode ? '.gedit-flow-panel-layer-wrap-docked' : '.gedit-flow-panel-layer-wrap-floating'\n );\n }\n\n init() {\n if (this.initialized) {\n return;\n }\n this.initialized = true;\n const cache = this.restore.restore<PanelEntityState>(this.key);\n\n const initialState = merge<PanelEntityState>(\n {\n size: this.config.defaultSize,\n fullscreen: this.config.fullscreen,\n },\n cache ? cache : {},\n {\n size: this.factory.defaultSize || PANEL_SIZE_DEFAULT,\n fullscreen: this.factory.fullscreen || false,\n ...(this.factory.keepDOM ? { visible: true } : {}),\n }\n );\n\n this.store = createStore<PanelEntityState>(() => initialState);\n }\n\n mergeState() {}\n\n dispose() {\n this.restore.store(this.key, this.store.getState());\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable } from 'inversify';\n\nexport const PanelRestore = Symbol('PanelRestore');\nexport interface PanelRestore {\n store: (k: string, v: any) => void;\n restore: <T>(k: string) => T | undefined;\n}\n\n@injectable()\nexport class PanelRestoreImpl implements PanelRestore {\n map = new Map<string, any>();\n\n store(k: string, v: any) {\n this.map.set(k, v);\n }\n\n restore<T>(k: string): T | undefined {\n return this.map.get(k) as T;\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport * as React from 'react';\n\nconst { useRef, useState } = React;\n\ninterface Props {\n size: number;\n direction?: 'vertical' | 'horizontal';\n onResize: (w: number) => void;\n}\n\nexport const ResizeBar: React.FC<Props> = ({ onResize, size, direction }) => {\n const currentPoint = useRef<null | number>(null);\n const [isDragging, setIsDragging] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n\n const isVertical = direction === 'vertical';\n\n return (\n <div\n onMouseDown={(e) => {\n currentPoint.current = isVertical ? e.clientX : e.clientY;\n e.stopPropagation();\n e.preventDefault();\n setIsDragging(true);\n const mouseUp = () => {\n currentPoint.current = null;\n document.body.removeEventListener('mouseup', mouseUp);\n document.body.removeEventListener('mousemove', mouseMove);\n setIsDragging(false);\n };\n const mouseMove = (e: MouseEvent) => {\n const delta = currentPoint.current! - (isVertical ? e.clientX : e.clientY);\n onResize(size + delta);\n };\n document.body.addEventListener('mouseup', mouseUp);\n document.body.addEventListener('mousemove', mouseMove);\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 999,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'auto',\n ...(isVertical\n ? {\n cursor: 'ew-resize',\n height: '100%',\n marginLeft: -5,\n width: 10,\n }\n : {\n cursor: 'ns-resize',\n width: '100%',\n marginTop: -5,\n height: 10,\n }),\n }}\n >\n <div\n style={{\n ...(isVertical\n ? {\n width: 3,\n height: '100%',\n }\n : {\n height: 3,\n width: '100%',\n }),\n backgroundColor: isDragging || isHovered ? 'var(--g-playground-line)' : 'transparent',\n }}\n />\n </div>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { PluginContext } from '@flowgram.ai/core';\n\nimport type { PanelFactory, PanelConfig } from '../types';\nimport { ResizeBar } from '../components/resize-bar';\nimport type { PanelLayerProps } from '../components/panel-layer';\n\nexport interface PanelManagerConfig {\n factories: PanelFactory<any>[];\n right: PanelConfig;\n bottom: PanelConfig;\n dockedRight: PanelConfig;\n dockedBottom: PanelConfig;\n /** Resizable, and multi-panel options mutually exclusive */\n autoResize: boolean;\n layerProps: PanelLayerProps;\n resizeBarRender: ({\n size,\n }: {\n size: number;\n direction?: 'vertical' | 'horizontal';\n onResize: (size: number) => void;\n }) => React.ReactNode;\n getPopupContainer: (ctx: PluginContext) => HTMLElement; // default playground.node.parentElement\n}\n\nexport const PanelManagerConfig = Symbol('PanelManagerConfig');\n\nexport const defineConfig = (config: Partial<PanelManagerConfig>) => {\n const defaultConfig: PanelManagerConfig = {\n right: {\n max: 1,\n },\n bottom: {\n max: 1,\n },\n dockedRight: {\n max: 1,\n },\n dockedBottom: {\n max: 1,\n },\n factories: [],\n autoResize: true,\n layerProps: {},\n resizeBarRender: ResizeBar,\n getPopupContainer: (ctx: PluginContext) => ctx.playground.node.parentNode as HTMLElement,\n };\n return {\n ...defaultConfig,\n ...config,\n };\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const merge = <T>(...objs: Partial<T>[]) => {\n const result: any = {};\n\n for (const obj of objs) {\n if (!obj || typeof obj !== 'object') continue;\n\n for (const key of Object.keys(obj)) {\n const value = (obj as any)[key];\n\n if (result[key] === undefined) {\n result[key] = value;\n }\n }\n }\n\n return result as T;\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable, inject } from 'inversify';\nimport { Emitter } from '@flowgram.ai/utils';\n\nimport { PanelManagerConfig } from './panel-config';\nimport type { Area, PanelEntityConfig, PanelFactory } from '../types';\nimport { PanelEntity, PanelEntityFactory } from './panel-factory';\n\n@injectable()\nexport class PanelManager {\n @inject(PanelManagerConfig) readonly config: PanelManagerConfig;\n\n @inject(PanelEntityFactory) readonly createPanel: PanelEntityFactory;\n\n readonly panelRegistry = new Map<string, PanelFactory<any>>();\n\n private panels = new Map<string, PanelEntity>();\n\n private onPanelsChangeEvent = new Emitter<void>();\n\n public onPanelsChange = this.onPanelsChangeEvent.event;\n\n init() {\n this.config.factories.forEach((factory) => this.register(factory));\n }\n\n /** registry panel factory */\n register<T extends any>(factory: PanelFactory<T>) {\n this.panelRegistry.set(factory.key, factory);\n }\n\n /** open panel */\n public open(key: string, area: Area = 'right', options?: PanelEntityConfig) {\n const factory = this.panelRegistry.get(key);\n if (!factory) {\n return;\n }\n\n const sameKeyPanels = this.getPanels(area).filter((p) => p.key === key);\n\n if (factory.keepDOM && sameKeyPanels.length) {\n const [panel] = sameKeyPanels;\n // move to last\n this.panels.delete(panel.id);\n this.panels.set(panel.id, panel);\n panel.visible = true;\n } else {\n if (!factory.allowDuplicates && sameKeyPanels.length) {\n sameKeyPanels.forEach((p) => this.remove(p.id));\n }\n const panel = this.createPanel({\n factory,\n config: {\n area,\n ...options,\n },\n });\n\n this.panels.set(panel.id, panel);\n }\n\n this.trim(area);\n this.onPanelsChangeEvent.fire();\n }\n\n /** close panel */\n public close(key?: string) {\n const panels = this.getPanels();\n const closedPanels = key ? panels.filter((p) => p.key === key) : panels;\n closedPanels.forEach((panel) => {\n this.remove(panel.id);\n });\n this.onPanelsChangeEvent.fire();\n }\n\n private trim(area: Area) {\n /** 1. general panel; 2. keepDOM visible panel */\n const panels = this.getPanels(area).filter((p) => !p.keepDOM || p.visible);\n const areaConfig = this.getAreaConfig(area);\n while (panels.length > areaConfig.max) {\n const removed = panels.shift();\n if (removed) {\n this.remove(removed.id);\n }\n }\n }\n\n private remove(id: string) {\n const panel = this.panels.get(id);\n if (!panel) {\n return;\n }\n if (panel.keepDOM) {\n panel.visible = false;\n } else {\n panel.dispose();\n this.panels.delete(id);\n }\n }\n\n getPanels(area?: Area) {\n const panels: PanelEntity[] = [];\n this.panels.forEach((panel) => {\n if (!area || panel.area === area) {\n panels.push(panel);\n }\n });\n return panels;\n }\n\n getAreaConfig(area: Area) {\n switch (area) {\n case 'docked-bottom':\n return this.config.dockedBottom;\n case 'docked-right':\n return this.config.dockedRight;\n case 'bottom':\n return this.config.bottom;\n case 'right':\n default:\n return this.config.right;\n }\n }\n\n dispose() {\n this.onPanelsChangeEvent.dispose();\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport ReactDOM from 'react-dom';\nimport { createElement } from 'react';\n\nimport { injectable, inject } from 'inversify';\nimport { domUtils, Disposable } from '@flowgram.ai/utils';\nimport { Layer, PluginContext } from '@flowgram.ai/core';\n\nimport { PanelLayer as PanelLayerComp } from '../components/panel-layer';\nimport { PanelManagerConfig } from './panel-config';\n\n@injectable()\nexport class PanelLayer extends Layer {\n @inject(PanelManagerConfig) private readonly panelConfig: PanelManagerConfig;\n\n @inject(PluginContext) private readonly pluginContext: PluginContext;\n\n readonly panelRoot = domUtils.createDivWithClass('gedit-flow-panel-layer');\n\n layout: JSX.Element | null = null;\n\n onReady(): void {\n this.panelConfig.getPopupContainer(this.pluginContext).appendChild(this.panelRoot);\n this.toDispose.push(\n Disposable.create(() => {\n // Remove from PopupContainer\n this.panelRoot.remove();\n })\n );\n const commonStyle = {\n pointerEvents: 'none',\n width: '100%',\n height: '100%',\n position: 'absolute',\n left: 0,\n top: 0,\n zIndex: 100,\n };\n domUtils.setStyle(this.panelRoot, commonStyle);\n }\n\n render(): JSX.Element {\n if (!this.layout) {\n const { children, ...layoutProps } = this.panelConfig.layerProps;\n this.layout = createElement(PanelLayerComp, layoutProps, children);\n }\n return ReactDOM.createPortal(this.layout, this.panelRoot);\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport * as React from 'react';\n\nimport clsx from 'clsx';\n\nimport { useGlobalCSS } from '../../hooks/use-global-css';\nimport { PanelArea } from './panel';\nimport { globalCSS } from './css';\n\nexport type PanelLayerProps = React.PropsWithChildren<{\n /** 模式：悬浮｜挤压 */\n mode?: 'floating' | 'docked';\n className?: string;\n style?: React.CSSProperties;\n}>;\n\nexport const PanelLayer: React.FC<PanelLayerProps> = ({\n mode = 'floating',\n className,\n style,\n children,\n}) => {\n useGlobalCSS({\n cssText: globalCSS,\n id: 'flow-panel-layer-css',\n });\n\n return (\n <div\n className={clsx(\n 'gedit-flow-panel-layer-wrap',\n mode === 'docked' && 'gedit-flow-panel-layer-wrap-docked',\n mode === 'floating' && 'gedit-flow-panel-layer-wrap-floating',\n className\n )}\n style={style}\n >\n <div className=\"gedit-flow-panel-left-area\">\n <div className=\"gedit-flow-panel-main-area\">{children}</div>\n <div className=\"gedit-flow-panel-bottom-area\">\n <PanelArea area={mode === 'docked' ? 'docked-bottom' : 'bottom'} />\n </div>\n </div>\n <div className=\"gedit-flow-panel-right-area\">\n <PanelArea area={mode === 'docked' ? 'docked-right' : 'right'} />\n </div>\n </div>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useEffect } from 'react';\n\ninterface UseGlobalCSSOptions {\n cssText: string;\n id: string;\n cleanup?: boolean;\n}\n\nexport const useGlobalCSS = ({ cssText, id, cleanup }: UseGlobalCSSOptions) => {\n useEffect(() => {\n /** SSR safe */\n if (typeof document === 'undefined') return;\n\n if (document.getElementById(id)) return;\n\n const style = document.createElement('style');\n style.id = id;\n style.textContent = cssText;\n document.head.appendChild(style);\n\n return () => {\n const existing = document.getElementById(id);\n if (existing && cleanup) existing.remove();\n };\n }, [id]);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport * as React from 'react';\n\nconst { useEffect, useState, useRef } = React;\n\nimport { clsx } from 'clsx';\n\nimport { Area } from '../../types';\nimport { PanelEntity } from '../../services/panel-factory';\nimport { usePanelManager } from '../../hooks/use-panel-manager';\nimport { usePanelStore } from '../../hooks/use-panel';\nimport { PanelContext } from '../../contexts';\n\nconst PanelItem: React.FC<{ panel: PanelEntity; hidden?: boolean }> = ({ panel, hidden }) => {\n const panelManager = usePanelManager();\n const ref = useRef<HTMLDivElement>(null);\n\n const isHorizontal = ['right', 'docked-right'].includes(panel.area);\n\n const { size, fullscreen } = usePanelStore((s) => ({\n size: s.size,\n fullscreen: s.fullscreen,\n }));\n\n const [layerSize, setLayerSize] = useState(size);\n\n const currentSize = fullscreen ? layerSize : size;\n\n const sizeStyle = isHorizontal ? { width: currentSize } : { height: currentSize };\n const handleResize = (next: number) => {\n let nextSize = next;\n if (typeof panel.factory.maxSize === 'number' && nextSize > panel.factory.maxSize) {\n nextSize = panel.factory.maxSize;\n } else if (typeof panel.factory.minSize === 'number' && nextSize < panel.factory.minSize) {\n nextSize = panel.factory.minSize;\n }\n panel.store.setState({ size: nextSize });\n };\n\n useEffect(() => {\n /** The set size may be illegal and needs to be updated according to the real element rendered for the first time. */\n if (ref.current && !fullscreen) {\n const { width, height } = ref.current.getBoundingClientRect();\n const realSize = isHorizontal ? width : height;\n panel.store.setState({ size: realSize });\n }\n }, [fullscreen]);\n\n useEffect(() => {\n if (!fullscreen) {\n return;\n }\n const layer = panel.layer;\n if (!layer) {\n return;\n }\n const observer = new ResizeObserver(([entry]) => {\n const { width, height } = entry.contentRect;\n setLayerSize(isHorizontal ? width : height);\n });\n observer.observe(layer);\n return () => observer.disconnect();\n }, [fullscreen]);\n\n return (\n <div\n className={clsx(\n 'gedit-flow-panel-wrap',\n isHorizontal ? 'panel-horizontal' : 'panel-vertical'\n )}\n key={panel.id}\n ref={ref}\n style={{\n display: hidden ? 'none' : 'block',\n ...panel.factory.style,\n ...panel.config.style,\n ...sizeStyle,\n }}\n >\n {panel.resizable &&\n panelManager.config.resizeBarRender({\n size,\n direction: isHorizontal ? 'vertical' : 'horizontal',\n onResize: handleResize,\n })}\n {panel.renderer}\n </div>\n );\n};\n\nexport const PanelArea: React.FC<{ area: Area }> = ({ area }) => {\n const panelManager = usePanelManager();\n const [panels, setPanels] = useState(panelManager.getPanels(area));\n\n useEffect(() => {\n let pending: number;\n\n function startTransition(fn: () => void) {\n clearTimeout(pending);\n pending = setTimeout(fn, 0);\n }\n const dispose = panelManager.onPanelsChange(() => {\n const r: any = { ...React };\n\n const start = r['startTransition'] as undefined | ((cb: () => void) => void);\n if (typeof start === 'function') {\n start(() => setPanels(panelManager.getPanels(area)));\n } else {\n startTransition(() => setPanels(panelManager.getPanels(area)));\n }\n });\n return () => dispose.dispose();\n }, []);\n\n return (\n <>\n {panels.map((panel) => (\n <PanelContext.Provider value={panel} key={panel.id}>\n <PanelItem panel={panel} hidden={panel.keepDOM && !panel.visible} />\n </PanelContext.Provider>\n ))}\n </>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useService } from '@flowgram.ai/core';\n\nimport { PanelManager } from '../services/panel-manager';\n\nexport const usePanelManager = () => useService<PanelManager>(PanelManager);\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useContext } from 'react';\n\nimport { useStoreWithEqualityFn } from 'zustand/traditional';\nimport { shallow } from 'zustand/shallow';\n\nimport { PanelEntityState } from '../services/panel-factory';\nimport { PanelContext } from '../contexts';\n\nexport const usePanel = () => useContext(PanelContext);\n\nexport const usePanelStore = <T>(selector: (s: PanelEntityState) => T) => {\n const panel = usePanel();\n return useStoreWithEqualityFn(panel.store, selector, shallow);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { createContext } from 'react';\n\nimport type { PanelEntity } from './services/panel-factory';\n\nexport const PanelContext = createContext({} as PanelEntity);\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const globalCSS = `\n .gedit-flow-panel-layer-wrap * {\n box-sizing: border-box;\n }\n .gedit-flow-panel-layer-wrap {\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n }\n .gedit-flow-panel-layer-wrap-docked {\n\n }\n .gedit-flow-panel-layer-wrap-floating {\n pointer-events: none;\n }\n\n .gedit-flow-panel-left-area {\n width: 100%;\n min-width: 0;\n flex-grow: 0;\n flex-shrink: 1;\n display: flex;\n flex-direction: column;\n }\n .gedit-flow-panel-right-area {\n height: 100%;\n flex-grow: 1;\n flex-shrink: 0;\n min-width: 0;\n display: flex;\n max-width: 100%;\n }\n\n .gedit-flow-panel-main-area {\n position: relative;\n overflow: hidden;\n flex-grow: 0;\n flex-shrink: 1;\n width: 100%;\n height: 100%;\n }\n .gedit-flow-panel-bottom-area {\n flex-grow: 1;\n flex-shrink: 0;\n width: 100%;\n min-height: 0;\n }\n .gedit-flow-panel-wrap {\n pointer-events: auto;\n overflow: auto;\n position: relative;\n }\n .gedit-flow-panel-wrap.panel-horizontal {\n height: 100%;\n }\n .gedit-flow-panel-wrap.panel-vertical {\n width: 100%;\n }\n`;\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport * as React from 'react';\n\nimport { PanelLayer, PanelLayerProps } from './panel-layer';\n\nexport type DockedPanelLayerProps = Omit<PanelLayerProps, 'mode'>;\n\nexport const DockedPanelLayer: React.FC<DockedPanelLayerProps> = (props) => (\n <PanelLayer mode=\"docked\" {...props} />\n);\n"],"mappings":"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","names":["injectable","e","injectable","injectable","inject","inject","injectable","createElement","injectable","inject","React","clsx","React","useEffect","useState","useRef","React","clsx","React","PanelLayer","createElement","inject","injectable","PanelLayer"]}
package/dist/index.d.mts CHANGED
@@ -1,8 +1,7 @@
1
1
  import * as _flowgram_ai_core from '@flowgram.ai/core';
2
2
  import { PluginContext } from '@flowgram.ai/core';
3
+ import * as React$1 from 'react';
3
4
  import * as _flowgram_ai_utils from '@flowgram.ai/utils';
4
- import * as react from 'react';
5
- import react__default from 'react';
6
5
  import { StoreApi } from 'zustand/vanilla';
7
6
 
8
7
  /**
@@ -38,11 +37,12 @@ interface PanelEntityConfig<T extends any = any> {
38
37
  * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
39
38
  * SPDX-License-Identifier: MIT
40
39
  */
41
- type PanelLayerProps = React.PropsWithChildren<{
40
+
41
+ type PanelLayerProps = React$1.PropsWithChildren<{
42
42
  /** 模式：悬浮｜挤压 */
43
43
  mode?: 'floating' | 'docked';
44
44
  className?: string;
45
- style?: React.CSSProperties;
45
+ style?: React$1.CSSProperties;
46
46
  }>;
47
47
 
48
48
  /**
@@ -51,7 +51,7 @@ type PanelLayerProps = React.PropsWithChildren<{
51
51
  */
52
52
 
53
53
  type DockedPanelLayerProps = Omit<PanelLayerProps, 'mode'>;
54
- declare const DockedPanelLayer: React.FC<DockedPanelLayerProps>;
54
+ declare const DockedPanelLayer: React$1.FC<DockedPanelLayerProps>;
55
55
 
56
56
  /**
57
57
  * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
@@ -117,7 +117,7 @@ declare class PanelEntity {
117
117
  get area(): Area;
118
118
  get mode(): "docked" | "floating";
119
119
  get key(): string;
120
- get renderer(): react.ReactNode;
120
+ get renderer(): React$1.ReactNode;
121
121
  get fullscreen(): boolean;
122
122
  set fullscreen(next: boolean);
123
123
  get resizable(): boolean;
@@ -172,6 +172,6 @@ interface Props {
172
172
  direction?: 'vertical' | 'horizontal';
173
173
  onResize: (w: number) => void;
174
174
  }
175
- declare const ResizeBar: react__default.FC<Props>;
175
+ declare const ResizeBar: React$1.FC<Props>;
176
176
 
177
177
  export { type Area, DockedPanelLayer, type DockedPanelLayerProps, type PanelFactory, PanelManager, PanelManagerConfig, PanelRestore, ResizeBar, createPanelManagerPlugin, usePanel, usePanelManager };
package/dist/index.d.ts CHANGED
@@ -1,8 +1,7 @@
1
1
  import * as _flowgram_ai_core from '@flowgram.ai/core';
2
2
  import { PluginContext } from '@flowgram.ai/core';
3
+ import * as React$1 from 'react';
3
4
  import * as _flowgram_ai_utils from '@flowgram.ai/utils';
4
- import * as react from 'react';
5
- import react__default from 'react';
6
5
  import { StoreApi } from 'zustand/vanilla';
7
6
 
8
7
  /**
@@ -38,11 +37,12 @@ interface PanelEntityConfig<T extends any = any> {
38
37
  * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
39
38
  * SPDX-License-Identifier: MIT
40
39
  */
41
- type PanelLayerProps = React.PropsWithChildren<{
40
+
41
+ type PanelLayerProps = React$1.PropsWithChildren<{
42
42
  /** 模式：悬浮｜挤压 */
43
43
  mode?: 'floating' | 'docked';
44
44
  className?: string;
45
- style?: React.CSSProperties;
45
+ style?: React$1.CSSProperties;
46
46
  }>;
47
47
 
48
48
  /**
@@ -51,7 +51,7 @@ type PanelLayerProps = React.PropsWithChildren<{
51
51
  */
52
52
 
53
53
  type DockedPanelLayerProps = Omit<PanelLayerProps, 'mode'>;
54
- declare const DockedPanelLayer: React.FC<DockedPanelLayerProps>;
54
+ declare const DockedPanelLayer: React$1.FC<DockedPanelLayerProps>;
55
55
 
56
56
  /**
57
57
  * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
@@ -117,7 +117,7 @@ declare class PanelEntity {
117
117
  get area(): Area;
118
118
  get mode(): "docked" | "floating";
119
119
  get key(): string;
120
- get renderer(): react.ReactNode;
120
+ get renderer(): React$1.ReactNode;
121
121
  get fullscreen(): boolean;
122
122
  set fullscreen(next: boolean);
123
123
  get resizable(): boolean;
@@ -172,6 +172,6 @@ interface Props {
172
172
  direction?: 'vertical' | 'horizontal';
173
173
  onResize: (w: number) => void;
174
174
  }
175
- declare const ResizeBar: react__default.FC<Props>;
175
+ declare const ResizeBar: React$1.FC<Props>;
176
176
 
177
177
  export { type Area, DockedPanelLayer, type DockedPanelLayerProps, type PanelFactory, PanelManager, PanelManagerConfig, PanelRestore, ResizeBar, createPanelManagerPlugin, usePanel, usePanelManager };
package/dist/index.js CHANGED
@@ -75,14 +75,14 @@ PanelRestoreImpl = __decorateClass([
75
75
  ], PanelRestoreImpl);
76
76
 
77
77
  // src/components/resize-bar/index.tsx
78
- var import_react = require("react");
79
- var import_jsx_runtime = require("react/jsx-runtime");
78
+ var React = __toESM(require("react"));
79
+ var { useRef, useState } = React;
80
80
  var ResizeBar = ({ onResize, size, direction }) => {
81
- const currentPoint = (0, import_react.useRef)(null);
82
- const [isDragging, setIsDragging] = (0, import_react.useState)(false);
83
- const [isHovered, setIsHovered] = (0, import_react.useState)(false);
81
+ const currentPoint = useRef(null);
82
+ const [isDragging, setIsDragging] = useState(false);
83
+ const [isHovered, setIsHovered] = useState(false);
84
84
  const isVertical = direction === "vertical";
85
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
85
+ return /* @__PURE__ */ React.createElement(
86
86
  "div",
87
87
  {
88
88
  onMouseDown: (e) => {
@@ -125,23 +125,23 @@ var ResizeBar = ({ onResize, size, direction }) => {
125
125
  marginTop: -5,
126
126
  height: 10
127
127
  }
128
- },
129
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
130
- "div",
131
- {
132
- style: {
133
- ...isVertical ? {
134
- width: 3,
135
- height: "100%"
136
- } : {
137
- height: 3,
138
- width: "100%"
139
- },
140
- backgroundColor: isDragging || isHovered ? "var(--g-playground-line)" : "transparent"
141
- }
128
+ }
129
+ },
130
+ /* @__PURE__ */ React.createElement(
131
+ "div",
132
+ {
133
+ style: {
134
+ ...isVertical ? {
135
+ width: 3,
136
+ height: "100%"
137
+ } : {
138
+ height: 3,
139
+ width: "100%"
140
+ },
141
+ backgroundColor: isDragging || isHovered ? "var(--g-playground-line)" : "transparent"
142
142
  }
143
- )
144
- }
143
+ }
144
+ )
145
145
  );
146
146
  };
147
147
 
@@ -398,18 +398,19 @@ PanelManager = __decorateClass([
398
398
 
399
399
  // src/services/panel-layer.ts
400
400
  var import_react_dom = __toESM(require("react-dom"));
401
- var import_react6 = require("react");
401
+ var import_react4 = require("react");
402
402
  var import_inversify4 = require("inversify");
403
403
  var import_utils3 = require("@flowgram.ai/utils");
404
404
  var import_core2 = require("@flowgram.ai/core");
405
405
 
406
406
  // src/components/panel-layer/panel-layer.tsx
407
+ var React3 = __toESM(require("react"));
407
408
  var import_clsx2 = __toESM(require("clsx"));
408
409
 
409
410
  // src/hooks/use-global-css.ts
410
- var import_react2 = require("react");
411
+ var import_react = require("react");
411
412
  var useGlobalCSS = ({ cssText, id, cleanup }) => {
412
- (0, import_react2.useEffect)(() => {
413
+ (0, import_react.useEffect)(() => {
413
414
  if (typeof document === "undefined") return;
414
415
  if (document.getElementById(id)) return;
415
416
  const style = document.createElement("style");
@@ -424,7 +425,7 @@ var useGlobalCSS = ({ cssText, id, cleanup }) => {
424
425
  };
425
426
 
426
427
  // src/components/panel-layer/panel.tsx
427
- var import_react5 = require("react");
428
+ var React2 = __toESM(require("react"));
428
429
  var import_clsx = require("clsx");
429
430
 
430
431
  // src/hooks/use-panel-manager.ts
@@ -432,32 +433,32 @@ var import_core = require("@flowgram.ai/core");
432
433
  var usePanelManager = () => (0, import_core.useService)(PanelManager);
433
434
 
434
435
  // src/hooks/use-panel.ts
435
- var import_react4 = require("react");
436
+ var import_react3 = require("react");
436
437
  var import_traditional = require("zustand/traditional");
437
438
  var import_shallow = require("zustand/shallow");
438
439
 
439
440
  // src/contexts.ts
440
- var import_react3 = require("react");
441
- var PanelContext = (0, import_react3.createContext)({});
441
+ var import_react2 = require("react");
442
+ var PanelContext = (0, import_react2.createContext)({});
442
443
 
443
444
  // src/hooks/use-panel.ts
444
- var usePanel = () => (0, import_react4.useContext)(PanelContext);
445
+ var usePanel = () => (0, import_react3.useContext)(PanelContext);
445
446
  var usePanelStore = (selector) => {
446
447
  const panel = usePanel();
447
448
  return (0, import_traditional.useStoreWithEqualityFn)(panel.store, selector, import_shallow.shallow);
448
449
  };
449
450
 
450
451
  // src/components/panel-layer/panel.tsx
451
- var import_jsx_runtime2 = require("react/jsx-runtime");
452
+ var { useEffect: useEffect2, useState: useState2, useRef: useRef2 } = React2;
452
453
  var PanelItem = ({ panel, hidden }) => {
453
454
  const panelManager = usePanelManager();
454
- const ref = (0, import_react5.useRef)(null);
455
+ const ref = useRef2(null);
455
456
  const isHorizontal = ["right", "docked-right"].includes(panel.area);
456
457
  const { size, fullscreen } = usePanelStore((s) => ({
457
458
  size: s.size,
458
459
  fullscreen: s.fullscreen
459
460
  }));
460
- const [layerSize, setLayerSize] = (0, import_react5.useState)(size);
461
+ const [layerSize, setLayerSize] = useState2(size);
461
462
  const currentSize = fullscreen ? layerSize : size;
462
463
  const sizeStyle = isHorizontal ? { width: currentSize } : { height: currentSize };
463
464
  const handleResize = (next) => {
@@ -469,14 +470,14 @@ var PanelItem = ({ panel, hidden }) => {
469
470
  }
470
471
  panel.store.setState({ size: nextSize });
471
472
  };
472
- (0, import_react5.useEffect)(() => {
473
+ useEffect2(() => {
473
474
  if (ref.current && !fullscreen) {
474
475
  const { width, height } = ref.current.getBoundingClientRect();
475
476
  const realSize = isHorizontal ? width : height;
476
477
  panel.store.setState({ size: realSize });
477
478
  }
478
479
  }, [fullscreen]);
479
- (0, import_react5.useEffect)(() => {
480
+ useEffect2(() => {
480
481
  if (!fullscreen) {
481
482
  return;
482
483
  }
@@ -491,44 +492,51 @@ var PanelItem = ({ panel, hidden }) => {
491
492
  observer.observe(layer);
492
493
  return () => observer.disconnect();
493
494
  }, [fullscreen]);
494
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
495
+ return /* @__PURE__ */ React2.createElement(
495
496
  "div",
496
497
  {
497
498
  className: (0, import_clsx.clsx)(
498
499
  "gedit-flow-panel-wrap",
499
500
  isHorizontal ? "panel-horizontal" : "panel-vertical"
500
501
  ),
502
+ key: panel.id,
501
503
  ref,
502
504
  style: {
503
505
  display: hidden ? "none" : "block",
504
506
  ...panel.factory.style,
505
507
  ...panel.config.style,
506
508
  ...sizeStyle
507
- },
508
- children: [
509
- panel.resizable && panelManager.config.resizeBarRender({
510
- size,
511
- direction: isHorizontal ? "vertical" : "horizontal",
512
- onResize: handleResize
513
- }),
514
- panel.renderer
515
- ]
509
+ }
516
510
  },
517
- panel.id
511
+ panel.resizable && panelManager.config.resizeBarRender({
512
+ size,
513
+ direction: isHorizontal ? "vertical" : "horizontal",
514
+ onResize: handleResize
515
+ }),
516
+ panel.renderer
518
517
  );
519
518
  };
520
519
  var PanelArea = ({ area }) => {
521
520
  const panelManager = usePanelManager();
522
- const [panels, setPanels] = (0, import_react5.useState)(panelManager.getPanels(area));
523
- (0, import_react5.useEffect)(() => {
521
+ const [panels, setPanels] = useState2(panelManager.getPanels(area));
522
+ useEffect2(() => {
523
+ let pending;
524
+ function startTransition(fn) {
525
+ clearTimeout(pending);
526
+ pending = setTimeout(fn, 0);
527
+ }
524
528
  const dispose = panelManager.onPanelsChange(() => {
525
- (0, import_react5.startTransition)(() => {
526
- setPanels(panelManager.getPanels(area));
527
- });
529
+ const r = { ...React2 };
530
+ const start = r["startTransition"];
531
+ if (typeof start === "function") {
532
+ start(() => setPanels(panelManager.getPanels(area)));
533
+ } else {
534
+ startTransition(() => setPanels(panelManager.getPanels(area)));
535
+ }
528
536
  });
529
537
  return () => dispose.dispose();
530
538
  }, []);
531
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: panels.map((panel) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(PanelContext.Provider, { value: panel, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(PanelItem, { panel, hidden: panel.keepDOM && !panel.visible }) }, panel.id)) });
539
+ return /* @__PURE__ */ React2.createElement(React2.Fragment, null, panels.map((panel) => /* @__PURE__ */ React2.createElement(PanelContext.Provider, { value: panel, key: panel.id }, /* @__PURE__ */ React2.createElement(PanelItem, { panel, hidden: panel.keepDOM && !panel.visible }))));
532
540
  };
533
541
 
534
542
  // src/components/panel-layer/css.ts
@@ -597,7 +605,6 @@ var globalCSS = `
597
605
  `;
598
606
 
599
607
  // src/components/panel-layer/panel-layer.tsx
600
- var import_jsx_runtime3 = require("react/jsx-runtime");
601
608
  var PanelLayer = ({
602
609
  mode = "floating",
603
610
  className,
@@ -608,7 +615,7 @@ var PanelLayer = ({
608
615
  cssText: globalCSS,
609
616
  id: "flow-panel-layer-css"
610
617
  });
611
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
618
+ return /* @__PURE__ */ React3.createElement(
612
619
  "div",
613
620
  {
614
621
  className: (0, import_clsx2.default)(
@@ -617,21 +624,16 @@ var PanelLayer = ({
617
624
  mode === "floating" && "gedit-flow-panel-layer-wrap-floating",
618
625
  className
619
626
  ),
620
- style,
621
- children: [
622
- /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "gedit-flow-panel-left-area", children: [
623
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "gedit-flow-panel-main-area", children }),
624
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "gedit-flow-panel-bottom-area", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PanelArea, { area: mode === "docked" ? "docked-bottom" : "bottom" }) })
625
- ] }),
626
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "gedit-flow-panel-right-area", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(PanelArea, { area: mode === "docked" ? "docked-right" : "right" }) })
627
- ]
628
- }
627
+ style
628
+ },
629
+ /* @__PURE__ */ React3.createElement("div", { className: "gedit-flow-panel-left-area" }, /* @__PURE__ */ React3.createElement("div", { className: "gedit-flow-panel-main-area" }, children), /* @__PURE__ */ React3.createElement("div", { className: "gedit-flow-panel-bottom-area" }, /* @__PURE__ */ React3.createElement(PanelArea, { area: mode === "docked" ? "docked-bottom" : "bottom" }))),
630
+ /* @__PURE__ */ React3.createElement("div", { className: "gedit-flow-panel-right-area" }, /* @__PURE__ */ React3.createElement(PanelArea, { area: mode === "docked" ? "docked-right" : "right" }))
629
631
  );
630
632
  };
631
633
 
632
634
  // src/components/panel-layer/docked-panel-layer.tsx
633
- var import_jsx_runtime4 = require("react/jsx-runtime");
634
- var DockedPanelLayer = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(PanelLayer, { mode: "docked", ...props });
635
+ var React4 = __toESM(require("react"));
636
+ var DockedPanelLayer = (props) => /* @__PURE__ */ React4.createElement(PanelLayer, { mode: "docked", ...props });
635
637
 
636
638
  // src/services/panel-layer.ts
637
639
  var PanelLayer2 = class extends import_core2.Layer {
@@ -661,7 +663,7 @@ var PanelLayer2 = class extends import_core2.Layer {
661
663
  render() {
662
664
  if (!this.layout) {
663
665
  const { children, ...layoutProps } = this.panelConfig.layerProps;
664
- this.layout = (0, import_react6.createElement)(PanelLayer, layoutProps, children);
666
+ this.layout = (0, import_react4.createElement)(PanelLayer, layoutProps, children);
665
667
  }
666
668
  return import_react_dom.default.createPortal(this.layout, this.panelRoot);
667
669
  }
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/create-panel-manager-plugin.ts","../src/services/panel-factory.ts","../src/services/panel-restore.ts","../src/components/resize-bar/index.tsx","../src/services/panel-config.ts","../src/utils.ts","../src/services/panel-manager.ts","../src/services/panel-layer.ts","../src/components/panel-layer/panel-layer.tsx","../src/hooks/use-global-css.ts","../src/components/panel-layer/panel.tsx","../src/hooks/use-panel-manager.ts","../src/hooks/use-panel.ts","../src/contexts.ts","../src/components/panel-layer/css.ts","../src/components/panel-layer/docked-panel-layer.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\n/** create plugin function */\nexport { createPanelManagerPlugin } from './create-panel-manager-plugin';\n\n/** services */\nexport { PanelManager, PanelRestore, type PanelManagerConfig } from './services';\n\n/** react hooks */\nexport { usePanelManager } from './hooks/use-panel-manager';\nexport { usePanel } from './hooks/use-panel';\n\nexport { DockedPanelLayer, type DockedPanelLayerProps } from './components/panel-layer';\nexport { ResizeBar } from './components/resize-bar';\n\n/** types */\nexport type { Area, PanelFactory } from './types';\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport {\n PanelEntityFactory,\n PanelEntity,\n PanelEntityFactoryConstant,\n PanelEntityConfigConstant,\n} from './services/panel-factory';\nimport { defineConfig } from './services/panel-config';\nimport {\n PanelManager,\n PanelManagerConfig,\n PanelLayer,\n PanelRestore,\n PanelRestoreImpl,\n} from './services';\n\nexport const createPanelManagerPlugin = definePluginCreator<Partial<PanelManagerConfig>>({\n onBind: ({ bind }, opt) => {\n bind(PanelManager).to(PanelManager).inSingletonScope();\n bind(PanelRestore).to(PanelRestoreImpl).inSingletonScope();\n bind(PanelManagerConfig).toConstantValue(defineConfig(opt));\n bind(PanelEntityFactory).toFactory(\n (context) =>\n ({\n factory,\n config,\n }: {\n factory: PanelEntityFactoryConstant;\n config: PanelEntityConfigConstant;\n }) => {\n const container = context.container.createChild();\n container.bind(PanelEntityFactoryConstant).toConstantValue(factory);\n container.bind(PanelEntityConfigConstant).toConstantValue(config);\n const panel = container.resolve(PanelEntity);\n panel.init();\n return panel;\n }\n );\n },\n onInit(ctx) {\n ctx.playground.registerLayer(PanelLayer);\n const panelManager = ctx.container.get<PanelManager>(PanelManager);\n panelManager.init();\n },\n});\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { createStore, StoreApi } from 'zustand/vanilla';\nimport { nanoid } from 'nanoid';\nimport { inject, injectable } from 'inversify';\n\nimport type { PanelFactory, PanelEntityConfig, Area } from '../types';\nimport { PanelRestore } from './panel-restore';\nimport { PanelManagerConfig } from './panel-config';\nimport { merge } from '../utils';\n\nexport const PanelEntityFactory = Symbol('PanelEntityFactory');\nexport type PanelEntityFactory = (options: {\n factory: PanelEntityFactoryConstant;\n config: PanelEntityConfigConstant;\n}) => PanelEntity;\n\nexport const PanelEntityFactoryConstant = Symbol('PanelEntityFactoryConstant');\nexport type PanelEntityFactoryConstant = PanelFactory<any>;\nexport const PanelEntityConfigConstant = Symbol('PanelEntityConfigConstant');\nexport type PanelEntityConfigConstant = PanelEntityConfig<any> & {\n area: Area;\n};\n\nconst PANEL_SIZE_DEFAULT = 400;\n\nexport interface PanelEntityState {\n size: number;\n fullscreen: boolean;\n visible: boolean;\n}\n\n@injectable()\nexport class PanelEntity {\n @inject(PanelRestore) restore: PanelRestore;\n\n /** 面板工厂 */\n @inject(PanelEntityFactoryConstant) public factory: PanelEntityFactoryConstant;\n\n @inject(PanelEntityConfigConstant) public config: PanelEntityConfigConstant;\n\n @inject(PanelManagerConfig) readonly globalConfig: PanelManagerConfig;\n\n private initialized = false;\n\n /** 实例唯一标识 */\n id: string = nanoid();\n\n /** 渲染缓存 */\n node: React.ReactNode = null;\n\n store: StoreApi<PanelEntityState>;\n\n get area() {\n return this.config.area;\n }\n\n get mode() {\n return this.config.area.startsWith('docked') ? 'docked' : 'floating';\n }\n\n get key() {\n return this.factory.key;\n }\n\n get renderer() {\n if (!this.node) {\n this.node = this.factory.render(this.config.props);\n }\n return this.node;\n }\n\n get fullscreen() {\n return this.store.getState().fullscreen;\n }\n\n set fullscreen(next: boolean) {\n this.store.setState({ fullscreen: next });\n }\n\n get resizable() {\n if (this.fullscreen) {\n return false;\n }\n return this.factory.resize !== undefined ? this.factory.resize : this.globalConfig.autoResize;\n }\n\n get keepDOM() {\n return this.factory.keepDOM;\n }\n\n get visible() {\n return this.store.getState().visible;\n }\n\n set visible(next: boolean) {\n this.store.setState({ visible: next });\n }\n\n get layer() {\n return document.querySelector(\n this.mode ? '.gedit-flow-panel-layer-wrap-docked' : '.gedit-flow-panel-layer-wrap-floating'\n );\n }\n\n init() {\n if (this.initialized) {\n return;\n }\n this.initialized = true;\n const cache = this.restore.restore<PanelEntityState>(this.key);\n\n const initialState = merge<PanelEntityState>(\n {\n size: this.config.defaultSize,\n fullscreen: this.config.fullscreen,\n },\n cache ? cache : {},\n {\n size: this.factory.defaultSize || PANEL_SIZE_DEFAULT,\n fullscreen: this.factory.fullscreen || false,\n ...(this.factory.keepDOM ? { visible: true } : {}),\n }\n );\n\n this.store = createStore<PanelEntityState>(() => initialState);\n }\n\n mergeState() {}\n\n dispose() {\n this.restore.store(this.key, this.store.getState());\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable } from 'inversify';\n\nexport const PanelRestore = Symbol('PanelRestore');\nexport interface PanelRestore {\n store: (k: string, v: any) => void;\n restore: <T>(k: string) => T | undefined;\n}\n\n@injectable()\nexport class PanelRestoreImpl implements PanelRestore {\n map = new Map<string, any>();\n\n store(k: string, v: any) {\n this.map.set(k, v);\n }\n\n restore<T>(k: string): T | undefined {\n return this.map.get(k) as T;\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport React, { useRef, useState } from 'react';\n\ninterface Props {\n size: number;\n direction?: 'vertical' | 'horizontal';\n onResize: (w: number) => void;\n}\n\nexport const ResizeBar: React.FC<Props> = ({ onResize, size, direction }) => {\n const currentPoint = useRef<null | number>(null);\n const [isDragging, setIsDragging] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n\n const isVertical = direction === 'vertical';\n\n return (\n <div\n onMouseDown={(e) => {\n currentPoint.current = isVertical ? e.clientX : e.clientY;\n e.stopPropagation();\n e.preventDefault();\n setIsDragging(true);\n const mouseUp = () => {\n currentPoint.current = null;\n document.body.removeEventListener('mouseup', mouseUp);\n document.body.removeEventListener('mousemove', mouseMove);\n setIsDragging(false);\n };\n const mouseMove = (e: MouseEvent) => {\n const delta = currentPoint.current! - (isVertical ? e.clientX : e.clientY);\n onResize(size + delta);\n };\n document.body.addEventListener('mouseup', mouseUp);\n document.body.addEventListener('mousemove', mouseMove);\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 999,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'auto',\n ...(isVertical\n ? {\n cursor: 'ew-resize',\n height: '100%',\n marginLeft: -5,\n width: 10,\n }\n : {\n cursor: 'ns-resize',\n width: '100%',\n marginTop: -5,\n height: 10,\n }),\n }}\n >\n <div\n style={{\n ...(isVertical\n ? {\n width: 3,\n height: '100%',\n }\n : {\n height: 3,\n width: '100%',\n }),\n backgroundColor: isDragging || isHovered ? 'var(--g-playground-line)' : 'transparent',\n }}\n />\n </div>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { PluginContext } from '@flowgram.ai/core';\n\nimport type { PanelFactory, PanelConfig } from '../types';\nimport { ResizeBar } from '../components/resize-bar';\nimport type { PanelLayerProps } from '../components/panel-layer';\n\nexport interface PanelManagerConfig {\n factories: PanelFactory<any>[];\n right: PanelConfig;\n bottom: PanelConfig;\n dockedRight: PanelConfig;\n dockedBottom: PanelConfig;\n /** Resizable, and multi-panel options mutually exclusive */\n autoResize: boolean;\n layerProps: PanelLayerProps;\n resizeBarRender: ({\n size,\n }: {\n size: number;\n direction?: 'vertical' | 'horizontal';\n onResize: (size: number) => void;\n }) => React.ReactNode;\n getPopupContainer: (ctx: PluginContext) => HTMLElement; // default playground.node.parentElement\n}\n\nexport const PanelManagerConfig = Symbol('PanelManagerConfig');\n\nexport const defineConfig = (config: Partial<PanelManagerConfig>) => {\n const defaultConfig: PanelManagerConfig = {\n right: {\n max: 1,\n },\n bottom: {\n max: 1,\n },\n dockedRight: {\n max: 1,\n },\n dockedBottom: {\n max: 1,\n },\n factories: [],\n autoResize: true,\n layerProps: {},\n resizeBarRender: ResizeBar,\n getPopupContainer: (ctx: PluginContext) => ctx.playground.node.parentNode as HTMLElement,\n };\n return {\n ...defaultConfig,\n ...config,\n };\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const merge = <T>(...objs: Partial<T>[]) => {\n const result: any = {};\n\n for (const obj of objs) {\n if (!obj || typeof obj !== 'object') continue;\n\n for (const key of Object.keys(obj)) {\n const value = (obj as any)[key];\n\n if (result[key] === undefined) {\n result[key] = value;\n }\n }\n }\n\n return result as T;\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable, inject } from 'inversify';\nimport { Emitter } from '@flowgram.ai/utils';\n\nimport { PanelManagerConfig } from './panel-config';\nimport type { Area, PanelEntityConfig, PanelFactory } from '../types';\nimport { PanelEntity, PanelEntityFactory } from './panel-factory';\n\n@injectable()\nexport class PanelManager {\n @inject(PanelManagerConfig) readonly config: PanelManagerConfig;\n\n @inject(PanelEntityFactory) readonly createPanel: PanelEntityFactory;\n\n readonly panelRegistry = new Map<string, PanelFactory<any>>();\n\n private panels = new Map<string, PanelEntity>();\n\n private onPanelsChangeEvent = new Emitter<void>();\n\n public onPanelsChange = this.onPanelsChangeEvent.event;\n\n init() {\n this.config.factories.forEach((factory) => this.register(factory));\n }\n\n /** registry panel factory */\n register<T extends any>(factory: PanelFactory<T>) {\n this.panelRegistry.set(factory.key, factory);\n }\n\n /** open panel */\n public open(key: string, area: Area = 'right', options?: PanelEntityConfig) {\n const factory = this.panelRegistry.get(key);\n if (!factory) {\n return;\n }\n\n const sameKeyPanels = this.getPanels(area).filter((p) => p.key === key);\n\n if (factory.keepDOM && sameKeyPanels.length) {\n const [panel] = sameKeyPanels;\n // move to last\n this.panels.delete(panel.id);\n this.panels.set(panel.id, panel);\n panel.visible = true;\n } else {\n if (!factory.allowDuplicates && sameKeyPanels.length) {\n sameKeyPanels.forEach((p) => this.remove(p.id));\n }\n const panel = this.createPanel({\n factory,\n config: {\n area,\n ...options,\n },\n });\n\n this.panels.set(panel.id, panel);\n }\n\n this.trim(area);\n this.onPanelsChangeEvent.fire();\n }\n\n /** close panel */\n public close(key?: string) {\n const panels = this.getPanels();\n const closedPanels = key ? panels.filter((p) => p.key === key) : panels;\n closedPanels.forEach((panel) => {\n this.remove(panel.id);\n });\n this.onPanelsChangeEvent.fire();\n }\n\n private trim(area: Area) {\n /** 1. general panel; 2. keepDOM visible panel */\n const panels = this.getPanels(area).filter((p) => !p.keepDOM || p.visible);\n const areaConfig = this.getAreaConfig(area);\n while (panels.length > areaConfig.max) {\n const removed = panels.shift();\n if (removed) {\n this.remove(removed.id);\n }\n }\n }\n\n private remove(id: string) {\n const panel = this.panels.get(id);\n if (!panel) {\n return;\n }\n if (panel.keepDOM) {\n panel.visible = false;\n } else {\n panel.dispose();\n this.panels.delete(id);\n }\n }\n\n getPanels(area?: Area) {\n const panels: PanelEntity[] = [];\n this.panels.forEach((panel) => {\n if (!area || panel.area === area) {\n panels.push(panel);\n }\n });\n return panels;\n }\n\n getAreaConfig(area: Area) {\n switch (area) {\n case 'docked-bottom':\n return this.config.dockedBottom;\n case 'docked-right':\n return this.config.dockedRight;\n case 'bottom':\n return this.config.bottom;\n case 'right':\n default:\n return this.config.right;\n }\n }\n\n dispose() {\n this.onPanelsChangeEvent.dispose();\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport ReactDOM from 'react-dom';\nimport { createElement } from 'react';\n\nimport { injectable, inject } from 'inversify';\nimport { domUtils, Disposable } from '@flowgram.ai/utils';\nimport { Layer, PluginContext } from '@flowgram.ai/core';\n\nimport { PanelLayer as PanelLayerComp } from '../components/panel-layer';\nimport { PanelManagerConfig } from './panel-config';\n\n@injectable()\nexport class PanelLayer extends Layer {\n @inject(PanelManagerConfig) private readonly panelConfig: PanelManagerConfig;\n\n @inject(PluginContext) private readonly pluginContext: PluginContext;\n\n readonly panelRoot = domUtils.createDivWithClass('gedit-flow-panel-layer');\n\n layout: JSX.Element | null = null;\n\n onReady(): void {\n this.panelConfig.getPopupContainer(this.pluginContext).appendChild(this.panelRoot);\n this.toDispose.push(\n Disposable.create(() => {\n // Remove from PopupContainer\n this.panelRoot.remove();\n })\n );\n const commonStyle = {\n pointerEvents: 'none',\n width: '100%',\n height: '100%',\n position: 'absolute',\n left: 0,\n top: 0,\n zIndex: 100,\n };\n domUtils.setStyle(this.panelRoot, commonStyle);\n }\n\n render(): JSX.Element {\n if (!this.layout) {\n const { children, ...layoutProps } = this.panelConfig.layerProps;\n this.layout = createElement(PanelLayerComp, layoutProps, children);\n }\n return ReactDOM.createPortal(this.layout, this.panelRoot);\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport clsx from 'clsx';\n\nimport { useGlobalCSS } from '../../hooks/use-global-css';\nimport { PanelArea } from './panel';\nimport { globalCSS } from './css';\n\nexport type PanelLayerProps = React.PropsWithChildren<{\n /** 模式：悬浮｜挤压 */\n mode?: 'floating' | 'docked';\n className?: string;\n style?: React.CSSProperties;\n}>;\n\nexport const PanelLayer: React.FC<PanelLayerProps> = ({\n mode = 'floating',\n className,\n style,\n children,\n}) => {\n useGlobalCSS({\n cssText: globalCSS,\n id: 'flow-panel-layer-css',\n });\n\n return (\n <div\n className={clsx(\n 'gedit-flow-panel-layer-wrap',\n mode === 'docked' && 'gedit-flow-panel-layer-wrap-docked',\n mode === 'floating' && 'gedit-flow-panel-layer-wrap-floating',\n className\n )}\n style={style}\n >\n <div className=\"gedit-flow-panel-left-area\">\n <div className=\"gedit-flow-panel-main-area\">{children}</div>\n <div className=\"gedit-flow-panel-bottom-area\">\n <PanelArea area={mode === 'docked' ? 'docked-bottom' : 'bottom'} />\n </div>\n </div>\n <div className=\"gedit-flow-panel-right-area\">\n <PanelArea area={mode === 'docked' ? 'docked-right' : 'right'} />\n </div>\n </div>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useEffect } from 'react';\n\ninterface UseGlobalCSSOptions {\n cssText: string;\n id: string;\n cleanup?: boolean;\n}\n\nexport const useGlobalCSS = ({ cssText, id, cleanup }: UseGlobalCSSOptions) => {\n useEffect(() => {\n /** SSR safe */\n if (typeof document === 'undefined') return;\n\n if (document.getElementById(id)) return;\n\n const style = document.createElement('style');\n style.id = id;\n style.textContent = cssText;\n document.head.appendChild(style);\n\n return () => {\n const existing = document.getElementById(id);\n if (existing && cleanup) existing.remove();\n };\n }, [id]);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useEffect, startTransition, useState, useRef } from 'react';\n\nimport { clsx } from 'clsx';\n\nimport { Area } from '../../types';\nimport { PanelEntity } from '../../services/panel-factory';\nimport { usePanelManager } from '../../hooks/use-panel-manager';\nimport { usePanelStore } from '../../hooks/use-panel';\nimport { PanelContext } from '../../contexts';\n\nconst PanelItem: React.FC<{ panel: PanelEntity; hidden?: boolean }> = ({ panel, hidden }) => {\n const panelManager = usePanelManager();\n const ref = useRef<HTMLDivElement>(null);\n\n const isHorizontal = ['right', 'docked-right'].includes(panel.area);\n\n const { size, fullscreen } = usePanelStore((s) => ({\n size: s.size,\n fullscreen: s.fullscreen,\n }));\n\n const [layerSize, setLayerSize] = useState(size);\n\n const currentSize = fullscreen ? layerSize : size;\n\n const sizeStyle = isHorizontal ? { width: currentSize } : { height: currentSize };\n const handleResize = (next: number) => {\n let nextSize = next;\n if (typeof panel.factory.maxSize === 'number' && nextSize > panel.factory.maxSize) {\n nextSize = panel.factory.maxSize;\n } else if (typeof panel.factory.minSize === 'number' && nextSize < panel.factory.minSize) {\n nextSize = panel.factory.minSize;\n }\n panel.store.setState({ size: nextSize });\n };\n\n useEffect(() => {\n /** The set size may be illegal and needs to be updated according to the real element rendered for the first time. */\n if (ref.current && !fullscreen) {\n const { width, height } = ref.current.getBoundingClientRect();\n const realSize = isHorizontal ? width : height;\n panel.store.setState({ size: realSize });\n }\n }, [fullscreen]);\n\n useEffect(() => {\n if (!fullscreen) {\n return;\n }\n const layer = panel.layer;\n if (!layer) {\n return;\n }\n const observer = new ResizeObserver(([entry]) => {\n const { width, height } = entry.contentRect;\n setLayerSize(isHorizontal ? width : height);\n });\n observer.observe(layer);\n return () => observer.disconnect();\n }, [fullscreen]);\n\n return (\n <div\n className={clsx(\n 'gedit-flow-panel-wrap',\n isHorizontal ? 'panel-horizontal' : 'panel-vertical'\n )}\n key={panel.id}\n ref={ref}\n style={{\n display: hidden ? 'none' : 'block',\n ...panel.factory.style,\n ...panel.config.style,\n ...sizeStyle,\n }}\n >\n {panel.resizable &&\n panelManager.config.resizeBarRender({\n size,\n direction: isHorizontal ? 'vertical' : 'horizontal',\n onResize: handleResize,\n })}\n {panel.renderer}\n </div>\n );\n};\n\nexport const PanelArea: React.FC<{ area: Area }> = ({ area }) => {\n const panelManager = usePanelManager();\n const [panels, setPanels] = useState(panelManager.getPanels(area));\n\n useEffect(() => {\n const dispose = panelManager.onPanelsChange(() => {\n startTransition(() => {\n setPanels(panelManager.getPanels(area));\n });\n });\n return () => dispose.dispose();\n }, []);\n\n return (\n <>\n {panels.map((panel) => (\n <PanelContext.Provider value={panel} key={panel.id}>\n <PanelItem panel={panel} hidden={panel.keepDOM && !panel.visible} />\n </PanelContext.Provider>\n ))}\n </>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useService } from '@flowgram.ai/core';\n\nimport { PanelManager } from '../services/panel-manager';\n\nexport const usePanelManager = () => useService<PanelManager>(PanelManager);\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useContext } from 'react';\n\nimport { useStoreWithEqualityFn } from 'zustand/traditional';\nimport { shallow } from 'zustand/shallow';\n\nimport { PanelEntityState } from '../services/panel-factory';\nimport { PanelContext } from '../contexts';\n\nexport const usePanel = () => useContext(PanelContext);\n\nexport const usePanelStore = <T>(selector: (s: PanelEntityState) => T) => {\n const panel = usePanel();\n return useStoreWithEqualityFn(panel.store, selector, shallow);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { createContext } from 'react';\n\nimport type { PanelEntity } from './services/panel-factory';\n\nexport const PanelContext = createContext({} as PanelEntity);\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const globalCSS = `\n .gedit-flow-panel-layer-wrap * {\n box-sizing: border-box;\n }\n .gedit-flow-panel-layer-wrap {\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n }\n .gedit-flow-panel-layer-wrap-docked {\n\n }\n .gedit-flow-panel-layer-wrap-floating {\n pointer-events: none;\n }\n\n .gedit-flow-panel-left-area {\n width: 100%;\n min-width: 0;\n flex-grow: 0;\n flex-shrink: 1;\n display: flex;\n flex-direction: column;\n }\n .gedit-flow-panel-right-area {\n height: 100%;\n flex-grow: 1;\n flex-shrink: 0;\n min-width: 0;\n display: flex;\n max-width: 100%;\n }\n\n .gedit-flow-panel-main-area {\n position: relative;\n overflow: hidden;\n flex-grow: 0;\n flex-shrink: 1;\n width: 100%;\n height: 100%;\n }\n .gedit-flow-panel-bottom-area {\n flex-grow: 1;\n flex-shrink: 0;\n width: 100%;\n min-height: 0;\n }\n .gedit-flow-panel-wrap {\n pointer-events: auto;\n overflow: auto;\n position: relative;\n }\n .gedit-flow-panel-wrap.panel-horizontal {\n height: 100%;\n }\n .gedit-flow-panel-wrap.panel-vertical {\n width: 100%;\n }\n`;\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { PanelLayer, PanelLayerProps } from './panel-layer';\n\nexport type DockedPanelLayerProps = Omit<PanelLayerProps, 'mode'>;\n\nexport const DockedPanelLayer: React.FC<DockedPanelLayerProps> = (props) => (\n <PanelLayer mode=\"docked\" {...props} />\n);\n"],"mappings":"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","names":["import_core","import_inversify","e","import_inversify","import_utils","import_react","import_inversify","import_utils","import_core","import_clsx","import_react","import_react","import_react","import_react","import_jsx_runtime","import_jsx_runtime","clsx","import_jsx_runtime","PanelLayer","ReactDOM","PanelLayer"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/create-panel-manager-plugin.ts","../src/services/panel-factory.ts","../src/services/panel-restore.ts","../src/components/resize-bar/index.tsx","../src/services/panel-config.ts","../src/utils.ts","../src/services/panel-manager.ts","../src/services/panel-layer.ts","../src/components/panel-layer/panel-layer.tsx","../src/hooks/use-global-css.ts","../src/components/panel-layer/panel.tsx","../src/hooks/use-panel-manager.ts","../src/hooks/use-panel.ts","../src/contexts.ts","../src/components/panel-layer/css.ts","../src/components/panel-layer/docked-panel-layer.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\n/** create plugin function */\nexport { createPanelManagerPlugin } from './create-panel-manager-plugin';\n\n/** services */\nexport { PanelManager, PanelRestore, type PanelManagerConfig } from './services';\n\n/** react hooks */\nexport { usePanelManager } from './hooks/use-panel-manager';\nexport { usePanel } from './hooks/use-panel';\n\nexport { DockedPanelLayer, type DockedPanelLayerProps } from './components/panel-layer';\nexport { ResizeBar } from './components/resize-bar';\n\n/** types */\nexport type { Area, PanelFactory } from './types';\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport {\n PanelEntityFactory,\n PanelEntity,\n PanelEntityFactoryConstant,\n PanelEntityConfigConstant,\n} from './services/panel-factory';\nimport { defineConfig } from './services/panel-config';\nimport {\n PanelManager,\n PanelManagerConfig,\n PanelLayer,\n PanelRestore,\n PanelRestoreImpl,\n} from './services';\n\nexport const createPanelManagerPlugin = definePluginCreator<Partial<PanelManagerConfig>>({\n onBind: ({ bind }, opt) => {\n bind(PanelManager).to(PanelManager).inSingletonScope();\n bind(PanelRestore).to(PanelRestoreImpl).inSingletonScope();\n bind(PanelManagerConfig).toConstantValue(defineConfig(opt));\n bind(PanelEntityFactory).toFactory(\n (context) =>\n ({\n factory,\n config,\n }: {\n factory: PanelEntityFactoryConstant;\n config: PanelEntityConfigConstant;\n }) => {\n const container = context.container.createChild();\n container.bind(PanelEntityFactoryConstant).toConstantValue(factory);\n container.bind(PanelEntityConfigConstant).toConstantValue(config);\n const panel = container.resolve(PanelEntity);\n panel.init();\n return panel;\n }\n );\n },\n onInit(ctx) {\n ctx.playground.registerLayer(PanelLayer);\n const panelManager = ctx.container.get<PanelManager>(PanelManager);\n panelManager.init();\n },\n});\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { createStore, StoreApi } from 'zustand/vanilla';\nimport { nanoid } from 'nanoid';\nimport { inject, injectable } from 'inversify';\n\nimport type { PanelFactory, PanelEntityConfig, Area } from '../types';\nimport { PanelRestore } from './panel-restore';\nimport { PanelManagerConfig } from './panel-config';\nimport { merge } from '../utils';\n\nexport const PanelEntityFactory = Symbol('PanelEntityFactory');\nexport type PanelEntityFactory = (options: {\n factory: PanelEntityFactoryConstant;\n config: PanelEntityConfigConstant;\n}) => PanelEntity;\n\nexport const PanelEntityFactoryConstant = Symbol('PanelEntityFactoryConstant');\nexport type PanelEntityFactoryConstant = PanelFactory<any>;\nexport const PanelEntityConfigConstant = Symbol('PanelEntityConfigConstant');\nexport type PanelEntityConfigConstant = PanelEntityConfig<any> & {\n area: Area;\n};\n\nconst PANEL_SIZE_DEFAULT = 400;\n\nexport interface PanelEntityState {\n size: number;\n fullscreen: boolean;\n visible: boolean;\n}\n\n@injectable()\nexport class PanelEntity {\n @inject(PanelRestore) restore: PanelRestore;\n\n /** 面板工厂 */\n @inject(PanelEntityFactoryConstant) public factory: PanelEntityFactoryConstant;\n\n @inject(PanelEntityConfigConstant) public config: PanelEntityConfigConstant;\n\n @inject(PanelManagerConfig) readonly globalConfig: PanelManagerConfig;\n\n private initialized = false;\n\n /** 实例唯一标识 */\n id: string = nanoid();\n\n /** 渲染缓存 */\n node: React.ReactNode = null;\n\n store: StoreApi<PanelEntityState>;\n\n get area() {\n return this.config.area;\n }\n\n get mode() {\n return this.config.area.startsWith('docked') ? 'docked' : 'floating';\n }\n\n get key() {\n return this.factory.key;\n }\n\n get renderer() {\n if (!this.node) {\n this.node = this.factory.render(this.config.props);\n }\n return this.node;\n }\n\n get fullscreen() {\n return this.store.getState().fullscreen;\n }\n\n set fullscreen(next: boolean) {\n this.store.setState({ fullscreen: next });\n }\n\n get resizable() {\n if (this.fullscreen) {\n return false;\n }\n return this.factory.resize !== undefined ? this.factory.resize : this.globalConfig.autoResize;\n }\n\n get keepDOM() {\n return this.factory.keepDOM;\n }\n\n get visible() {\n return this.store.getState().visible;\n }\n\n set visible(next: boolean) {\n this.store.setState({ visible: next });\n }\n\n get layer() {\n return document.querySelector(\n this.mode ? '.gedit-flow-panel-layer-wrap-docked' : '.gedit-flow-panel-layer-wrap-floating'\n );\n }\n\n init() {\n if (this.initialized) {\n return;\n }\n this.initialized = true;\n const cache = this.restore.restore<PanelEntityState>(this.key);\n\n const initialState = merge<PanelEntityState>(\n {\n size: this.config.defaultSize,\n fullscreen: this.config.fullscreen,\n },\n cache ? cache : {},\n {\n size: this.factory.defaultSize || PANEL_SIZE_DEFAULT,\n fullscreen: this.factory.fullscreen || false,\n ...(this.factory.keepDOM ? { visible: true } : {}),\n }\n );\n\n this.store = createStore<PanelEntityState>(() => initialState);\n }\n\n mergeState() {}\n\n dispose() {\n this.restore.store(this.key, this.store.getState());\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable } from 'inversify';\n\nexport const PanelRestore = Symbol('PanelRestore');\nexport interface PanelRestore {\n store: (k: string, v: any) => void;\n restore: <T>(k: string) => T | undefined;\n}\n\n@injectable()\nexport class PanelRestoreImpl implements PanelRestore {\n map = new Map<string, any>();\n\n store(k: string, v: any) {\n this.map.set(k, v);\n }\n\n restore<T>(k: string): T | undefined {\n return this.map.get(k) as T;\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport * as React from 'react';\n\nconst { useRef, useState } = React;\n\ninterface Props {\n size: number;\n direction?: 'vertical' | 'horizontal';\n onResize: (w: number) => void;\n}\n\nexport const ResizeBar: React.FC<Props> = ({ onResize, size, direction }) => {\n const currentPoint = useRef<null | number>(null);\n const [isDragging, setIsDragging] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n\n const isVertical = direction === 'vertical';\n\n return (\n <div\n onMouseDown={(e) => {\n currentPoint.current = isVertical ? e.clientX : e.clientY;\n e.stopPropagation();\n e.preventDefault();\n setIsDragging(true);\n const mouseUp = () => {\n currentPoint.current = null;\n document.body.removeEventListener('mouseup', mouseUp);\n document.body.removeEventListener('mousemove', mouseMove);\n setIsDragging(false);\n };\n const mouseMove = (e: MouseEvent) => {\n const delta = currentPoint.current! - (isVertical ? e.clientX : e.clientY);\n onResize(size + delta);\n };\n document.body.addEventListener('mouseup', mouseUp);\n document.body.addEventListener('mousemove', mouseMove);\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n style={{\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 999,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'auto',\n ...(isVertical\n ? {\n cursor: 'ew-resize',\n height: '100%',\n marginLeft: -5,\n width: 10,\n }\n : {\n cursor: 'ns-resize',\n width: '100%',\n marginTop: -5,\n height: 10,\n }),\n }}\n >\n <div\n style={{\n ...(isVertical\n ? {\n width: 3,\n height: '100%',\n }\n : {\n height: 3,\n width: '100%',\n }),\n backgroundColor: isDragging || isHovered ? 'var(--g-playground-line)' : 'transparent',\n }}\n />\n </div>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { PluginContext } from '@flowgram.ai/core';\n\nimport type { PanelFactory, PanelConfig } from '../types';\nimport { ResizeBar } from '../components/resize-bar';\nimport type { PanelLayerProps } from '../components/panel-layer';\n\nexport interface PanelManagerConfig {\n factories: PanelFactory<any>[];\n right: PanelConfig;\n bottom: PanelConfig;\n dockedRight: PanelConfig;\n dockedBottom: PanelConfig;\n /** Resizable, and multi-panel options mutually exclusive */\n autoResize: boolean;\n layerProps: PanelLayerProps;\n resizeBarRender: ({\n size,\n }: {\n size: number;\n direction?: 'vertical' | 'horizontal';\n onResize: (size: number) => void;\n }) => React.ReactNode;\n getPopupContainer: (ctx: PluginContext) => HTMLElement; // default playground.node.parentElement\n}\n\nexport const PanelManagerConfig = Symbol('PanelManagerConfig');\n\nexport const defineConfig = (config: Partial<PanelManagerConfig>) => {\n const defaultConfig: PanelManagerConfig = {\n right: {\n max: 1,\n },\n bottom: {\n max: 1,\n },\n dockedRight: {\n max: 1,\n },\n dockedBottom: {\n max: 1,\n },\n factories: [],\n autoResize: true,\n layerProps: {},\n resizeBarRender: ResizeBar,\n getPopupContainer: (ctx: PluginContext) => ctx.playground.node.parentNode as HTMLElement,\n };\n return {\n ...defaultConfig,\n ...config,\n };\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const merge = <T>(...objs: Partial<T>[]) => {\n const result: any = {};\n\n for (const obj of objs) {\n if (!obj || typeof obj !== 'object') continue;\n\n for (const key of Object.keys(obj)) {\n const value = (obj as any)[key];\n\n if (result[key] === undefined) {\n result[key] = value;\n }\n }\n }\n\n return result as T;\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { injectable, inject } from 'inversify';\nimport { Emitter } from '@flowgram.ai/utils';\n\nimport { PanelManagerConfig } from './panel-config';\nimport type { Area, PanelEntityConfig, PanelFactory } from '../types';\nimport { PanelEntity, PanelEntityFactory } from './panel-factory';\n\n@injectable()\nexport class PanelManager {\n @inject(PanelManagerConfig) readonly config: PanelManagerConfig;\n\n @inject(PanelEntityFactory) readonly createPanel: PanelEntityFactory;\n\n readonly panelRegistry = new Map<string, PanelFactory<any>>();\n\n private panels = new Map<string, PanelEntity>();\n\n private onPanelsChangeEvent = new Emitter<void>();\n\n public onPanelsChange = this.onPanelsChangeEvent.event;\n\n init() {\n this.config.factories.forEach((factory) => this.register(factory));\n }\n\n /** registry panel factory */\n register<T extends any>(factory: PanelFactory<T>) {\n this.panelRegistry.set(factory.key, factory);\n }\n\n /** open panel */\n public open(key: string, area: Area = 'right', options?: PanelEntityConfig) {\n const factory = this.panelRegistry.get(key);\n if (!factory) {\n return;\n }\n\n const sameKeyPanels = this.getPanels(area).filter((p) => p.key === key);\n\n if (factory.keepDOM && sameKeyPanels.length) {\n const [panel] = sameKeyPanels;\n // move to last\n this.panels.delete(panel.id);\n this.panels.set(panel.id, panel);\n panel.visible = true;\n } else {\n if (!factory.allowDuplicates && sameKeyPanels.length) {\n sameKeyPanels.forEach((p) => this.remove(p.id));\n }\n const panel = this.createPanel({\n factory,\n config: {\n area,\n ...options,\n },\n });\n\n this.panels.set(panel.id, panel);\n }\n\n this.trim(area);\n this.onPanelsChangeEvent.fire();\n }\n\n /** close panel */\n public close(key?: string) {\n const panels = this.getPanels();\n const closedPanels = key ? panels.filter((p) => p.key === key) : panels;\n closedPanels.forEach((panel) => {\n this.remove(panel.id);\n });\n this.onPanelsChangeEvent.fire();\n }\n\n private trim(area: Area) {\n /** 1. general panel; 2. keepDOM visible panel */\n const panels = this.getPanels(area).filter((p) => !p.keepDOM || p.visible);\n const areaConfig = this.getAreaConfig(area);\n while (panels.length > areaConfig.max) {\n const removed = panels.shift();\n if (removed) {\n this.remove(removed.id);\n }\n }\n }\n\n private remove(id: string) {\n const panel = this.panels.get(id);\n if (!panel) {\n return;\n }\n if (panel.keepDOM) {\n panel.visible = false;\n } else {\n panel.dispose();\n this.panels.delete(id);\n }\n }\n\n getPanels(area?: Area) {\n const panels: PanelEntity[] = [];\n this.panels.forEach((panel) => {\n if (!area || panel.area === area) {\n panels.push(panel);\n }\n });\n return panels;\n }\n\n getAreaConfig(area: Area) {\n switch (area) {\n case 'docked-bottom':\n return this.config.dockedBottom;\n case 'docked-right':\n return this.config.dockedRight;\n case 'bottom':\n return this.config.bottom;\n case 'right':\n default:\n return this.config.right;\n }\n }\n\n dispose() {\n this.onPanelsChangeEvent.dispose();\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport ReactDOM from 'react-dom';\nimport { createElement } from 'react';\n\nimport { injectable, inject } from 'inversify';\nimport { domUtils, Disposable } from '@flowgram.ai/utils';\nimport { Layer, PluginContext } from '@flowgram.ai/core';\n\nimport { PanelLayer as PanelLayerComp } from '../components/panel-layer';\nimport { PanelManagerConfig } from './panel-config';\n\n@injectable()\nexport class PanelLayer extends Layer {\n @inject(PanelManagerConfig) private readonly panelConfig: PanelManagerConfig;\n\n @inject(PluginContext) private readonly pluginContext: PluginContext;\n\n readonly panelRoot = domUtils.createDivWithClass('gedit-flow-panel-layer');\n\n layout: JSX.Element | null = null;\n\n onReady(): void {\n this.panelConfig.getPopupContainer(this.pluginContext).appendChild(this.panelRoot);\n this.toDispose.push(\n Disposable.create(() => {\n // Remove from PopupContainer\n this.panelRoot.remove();\n })\n );\n const commonStyle = {\n pointerEvents: 'none',\n width: '100%',\n height: '100%',\n position: 'absolute',\n left: 0,\n top: 0,\n zIndex: 100,\n };\n domUtils.setStyle(this.panelRoot, commonStyle);\n }\n\n render(): JSX.Element {\n if (!this.layout) {\n const { children, ...layoutProps } = this.panelConfig.layerProps;\n this.layout = createElement(PanelLayerComp, layoutProps, children);\n }\n return ReactDOM.createPortal(this.layout, this.panelRoot);\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport * as React from 'react';\n\nimport clsx from 'clsx';\n\nimport { useGlobalCSS } from '../../hooks/use-global-css';\nimport { PanelArea } from './panel';\nimport { globalCSS } from './css';\n\nexport type PanelLayerProps = React.PropsWithChildren<{\n /** 模式：悬浮｜挤压 */\n mode?: 'floating' | 'docked';\n className?: string;\n style?: React.CSSProperties;\n}>;\n\nexport const PanelLayer: React.FC<PanelLayerProps> = ({\n mode = 'floating',\n className,\n style,\n children,\n}) => {\n useGlobalCSS({\n cssText: globalCSS,\n id: 'flow-panel-layer-css',\n });\n\n return (\n <div\n className={clsx(\n 'gedit-flow-panel-layer-wrap',\n mode === 'docked' && 'gedit-flow-panel-layer-wrap-docked',\n mode === 'floating' && 'gedit-flow-panel-layer-wrap-floating',\n className\n )}\n style={style}\n >\n <div className=\"gedit-flow-panel-left-area\">\n <div className=\"gedit-flow-panel-main-area\">{children}</div>\n <div className=\"gedit-flow-panel-bottom-area\">\n <PanelArea area={mode === 'docked' ? 'docked-bottom' : 'bottom'} />\n </div>\n </div>\n <div className=\"gedit-flow-panel-right-area\">\n <PanelArea area={mode === 'docked' ? 'docked-right' : 'right'} />\n </div>\n </div>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useEffect } from 'react';\n\ninterface UseGlobalCSSOptions {\n cssText: string;\n id: string;\n cleanup?: boolean;\n}\n\nexport const useGlobalCSS = ({ cssText, id, cleanup }: UseGlobalCSSOptions) => {\n useEffect(() => {\n /** SSR safe */\n if (typeof document === 'undefined') return;\n\n if (document.getElementById(id)) return;\n\n const style = document.createElement('style');\n style.id = id;\n style.textContent = cssText;\n document.head.appendChild(style);\n\n return () => {\n const existing = document.getElementById(id);\n if (existing && cleanup) existing.remove();\n };\n }, [id]);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport * as React from 'react';\n\nconst { useEffect, useState, useRef } = React;\n\nimport { clsx } from 'clsx';\n\nimport { Area } from '../../types';\nimport { PanelEntity } from '../../services/panel-factory';\nimport { usePanelManager } from '../../hooks/use-panel-manager';\nimport { usePanelStore } from '../../hooks/use-panel';\nimport { PanelContext } from '../../contexts';\n\nconst PanelItem: React.FC<{ panel: PanelEntity; hidden?: boolean }> = ({ panel, hidden }) => {\n const panelManager = usePanelManager();\n const ref = useRef<HTMLDivElement>(null);\n\n const isHorizontal = ['right', 'docked-right'].includes(panel.area);\n\n const { size, fullscreen } = usePanelStore((s) => ({\n size: s.size,\n fullscreen: s.fullscreen,\n }));\n\n const [layerSize, setLayerSize] = useState(size);\n\n const currentSize = fullscreen ? layerSize : size;\n\n const sizeStyle = isHorizontal ? { width: currentSize } : { height: currentSize };\n const handleResize = (next: number) => {\n let nextSize = next;\n if (typeof panel.factory.maxSize === 'number' && nextSize > panel.factory.maxSize) {\n nextSize = panel.factory.maxSize;\n } else if (typeof panel.factory.minSize === 'number' && nextSize < panel.factory.minSize) {\n nextSize = panel.factory.minSize;\n }\n panel.store.setState({ size: nextSize });\n };\n\n useEffect(() => {\n /** The set size may be illegal and needs to be updated according to the real element rendered for the first time. */\n if (ref.current && !fullscreen) {\n const { width, height } = ref.current.getBoundingClientRect();\n const realSize = isHorizontal ? width : height;\n panel.store.setState({ size: realSize });\n }\n }, [fullscreen]);\n\n useEffect(() => {\n if (!fullscreen) {\n return;\n }\n const layer = panel.layer;\n if (!layer) {\n return;\n }\n const observer = new ResizeObserver(([entry]) => {\n const { width, height } = entry.contentRect;\n setLayerSize(isHorizontal ? width : height);\n });\n observer.observe(layer);\n return () => observer.disconnect();\n }, [fullscreen]);\n\n return (\n <div\n className={clsx(\n 'gedit-flow-panel-wrap',\n isHorizontal ? 'panel-horizontal' : 'panel-vertical'\n )}\n key={panel.id}\n ref={ref}\n style={{\n display: hidden ? 'none' : 'block',\n ...panel.factory.style,\n ...panel.config.style,\n ...sizeStyle,\n }}\n >\n {panel.resizable &&\n panelManager.config.resizeBarRender({\n size,\n direction: isHorizontal ? 'vertical' : 'horizontal',\n onResize: handleResize,\n })}\n {panel.renderer}\n </div>\n );\n};\n\nexport const PanelArea: React.FC<{ area: Area }> = ({ area }) => {\n const panelManager = usePanelManager();\n const [panels, setPanels] = useState(panelManager.getPanels(area));\n\n useEffect(() => {\n let pending: number;\n\n function startTransition(fn: () => void) {\n clearTimeout(pending);\n pending = setTimeout(fn, 0);\n }\n const dispose = panelManager.onPanelsChange(() => {\n const r: any = { ...React };\n\n const start = r['startTransition'] as undefined | ((cb: () => void) => void);\n if (typeof start === 'function') {\n start(() => setPanels(panelManager.getPanels(area)));\n } else {\n startTransition(() => setPanels(panelManager.getPanels(area)));\n }\n });\n return () => dispose.dispose();\n }, []);\n\n return (\n <>\n {panels.map((panel) => (\n <PanelContext.Provider value={panel} key={panel.id}>\n <PanelItem panel={panel} hidden={panel.keepDOM && !panel.visible} />\n </PanelContext.Provider>\n ))}\n </>\n );\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useService } from '@flowgram.ai/core';\n\nimport { PanelManager } from '../services/panel-manager';\n\nexport const usePanelManager = () => useService<PanelManager>(PanelManager);\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { useContext } from 'react';\n\nimport { useStoreWithEqualityFn } from 'zustand/traditional';\nimport { shallow } from 'zustand/shallow';\n\nimport { PanelEntityState } from '../services/panel-factory';\nimport { PanelContext } from '../contexts';\n\nexport const usePanel = () => useContext(PanelContext);\n\nexport const usePanelStore = <T>(selector: (s: PanelEntityState) => T) => {\n const panel = usePanel();\n return useStoreWithEqualityFn(panel.store, selector, shallow);\n};\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { createContext } from 'react';\n\nimport type { PanelEntity } from './services/panel-factory';\n\nexport const PanelContext = createContext({} as PanelEntity);\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport const globalCSS = `\n .gedit-flow-panel-layer-wrap * {\n box-sizing: border-box;\n }\n .gedit-flow-panel-layer-wrap {\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n }\n .gedit-flow-panel-layer-wrap-docked {\n\n }\n .gedit-flow-panel-layer-wrap-floating {\n pointer-events: none;\n }\n\n .gedit-flow-panel-left-area {\n width: 100%;\n min-width: 0;\n flex-grow: 0;\n flex-shrink: 1;\n display: flex;\n flex-direction: column;\n }\n .gedit-flow-panel-right-area {\n height: 100%;\n flex-grow: 1;\n flex-shrink: 0;\n min-width: 0;\n display: flex;\n max-width: 100%;\n }\n\n .gedit-flow-panel-main-area {\n position: relative;\n overflow: hidden;\n flex-grow: 0;\n flex-shrink: 1;\n width: 100%;\n height: 100%;\n }\n .gedit-flow-panel-bottom-area {\n flex-grow: 1;\n flex-shrink: 0;\n width: 100%;\n min-height: 0;\n }\n .gedit-flow-panel-wrap {\n pointer-events: auto;\n overflow: auto;\n position: relative;\n }\n .gedit-flow-panel-wrap.panel-horizontal {\n height: 100%;\n }\n .gedit-flow-panel-wrap.panel-vertical {\n width: 100%;\n }\n`;\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport * as React from 'react';\n\nimport { PanelLayer, PanelLayerProps } from './panel-layer';\n\nexport type DockedPanelLayerProps = Omit<PanelLayerProps, 'mode'>;\n\nexport const DockedPanelLayer: React.FC<DockedPanelLayerProps> = (props) => (\n <PanelLayer mode=\"docked\" {...props} />\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACKA,IAAAA,eAAoC;;;ACApC,qBAAsC;AACtC,oBAAuB;AACvB,IAAAC,oBAAmC;;;ACFnC,uBAA2B;AAEpB,IAAM,eAAe,OAAO,cAAc;AAO1C,IAAM,mBAAN,MAA+C;AAAA,EAA/C;AACL,eAAM,oBAAI,IAAiB;AAAA;AAAA,EAE3B,MAAM,GAAW,GAAQ;AACvB,SAAK,IAAI,IAAI,GAAG,CAAC;AAAA,EACnB;AAAA,EAEA,QAAW,GAA0B;AACnC,WAAO,KAAK,IAAI,IAAI,CAAC;AAAA,EACvB;AACF;AAVa,mBAAN;AAAA,MADN,6BAAW;AAAA,GACC;;;ACTb,YAAuB;AAEvB,IAAM,EAAE,QAAQ,SAAS,IAAI;AAQtB,IAAM,YAA6B,CAAC,EAAE,UAAU,MAAM,UAAU,MAAM;AAC3E,QAAM,eAAe,OAAsB,IAAI;AAC/C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,QAAM,aAAa,cAAc;AAEjC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAa,CAAC,MAAM;AAClB,qBAAa,UAAU,aAAa,EAAE,UAAU,EAAE;AAClD,UAAE,gBAAgB;AAClB,UAAE,eAAe;AACjB,sBAAc,IAAI;AAClB,cAAM,UAAU,MAAM;AACpB,uBAAa,UAAU;AACvB,mBAAS,KAAK,oBAAoB,WAAW,OAAO;AACpD,mBAAS,KAAK,oBAAoB,aAAa,SAAS;AACxD,wBAAc,KAAK;AAAA,QACrB;AACA,cAAM,YAAY,CAACC,OAAkB;AACnC,gBAAM,QAAQ,aAAa,WAAY,aAAaA,GAAE,UAAUA,GAAE;AAClE,mBAAS,OAAO,KAAK;AAAA,QACvB;AACA,iBAAS,KAAK,iBAAiB,WAAW,OAAO;AACjD,iBAAS,KAAK,iBAAiB,aAAa,SAAS;AAAA,MACvD;AAAA,MACA,cAAc,MAAM,aAAa,IAAI;AAAA,MACrC,cAAc,MAAM,aAAa,KAAK;AAAA,MACtC,OAAO;AAAA,QACL,UAAU;AAAA,QACV,KAAK;AAAA,QACL,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,eAAe;AAAA,QACf,GAAI,aACA;AAAA,UACE,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,YAAY;AAAA,UACZ,OAAO;AAAA,QACT,IACA;AAAA,UACE,QAAQ;AAAA,UACR,OAAO;AAAA,UACP,WAAW;AAAA,UACX,QAAQ;AAAA,QACV;AAAA,MACN;AAAA;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,UACL,GAAI,aACA;AAAA,YACE,OAAO;AAAA,YACP,QAAQ;AAAA,UACV,IACA;AAAA,YACE,QAAQ;AAAA,YACR,OAAO;AAAA,UACT;AAAA,UACJ,iBAAiB,cAAc,YAAY,6BAA6B;AAAA,QAC1E;AAAA;AAAA,IACF;AAAA,EACF;AAEJ;;;ACtDO,IAAM,qBAAqB,OAAO,oBAAoB;AAEtD,IAAM,eAAe,CAAC,WAAwC;AACnE,QAAM,gBAAoC;AAAA,IACxC,OAAO;AAAA,MACL,KAAK;AAAA,IACP;AAAA,IACA,QAAQ;AAAA,MACN,KAAK;AAAA,IACP;AAAA,IACA,aAAa;AAAA,MACX,KAAK;AAAA,IACP;AAAA,IACA,cAAc;AAAA,MACZ,KAAK;AAAA,IACP;AAAA,IACA,WAAW,CAAC;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY,CAAC;AAAA,IACb,iBAAiB;AAAA,IACjB,mBAAmB,CAAC,QAAuB,IAAI,WAAW,KAAK;AAAA,EACjE;AACA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AACF;;;ACnDO,IAAM,QAAQ,IAAO,SAAuB;AACjD,QAAM,SAAc,CAAC;AAErB,aAAW,OAAO,MAAM;AACtB,QAAI,CAAC,OAAO,OAAO,QAAQ,SAAU;AAErC,eAAW,OAAO,OAAO,KAAK,GAAG,GAAG;AAClC,YAAM,QAAS,IAAY,GAAG;AAE9B,UAAI,OAAO,GAAG,MAAM,QAAW;AAC7B,eAAO,GAAG,IAAI;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;;;AJPO,IAAM,qBAAqB,OAAO,oBAAoB;AAMtD,IAAM,6BAA6B,OAAO,4BAA4B;AAEtE,IAAM,4BAA4B,OAAO,2BAA2B;AAK3E,IAAM,qBAAqB;AASpB,IAAM,cAAN,MAAkB;AAAA,EAAlB;AAUL,SAAQ,cAAc;AAGtB;AAAA,kBAAa,sBAAO;AAGpB;AAAA,gBAAwB;AAAA;AAAA,EAIxB,IAAI,OAAO;AACT,WAAO,KAAK,OAAO;AAAA,EACrB;AAAA,EAEA,IAAI,OAAO;AACT,WAAO,KAAK,OAAO,KAAK,WAAW,QAAQ,IAAI,WAAW;AAAA,EAC5D;AAAA,EAEA,IAAI,MAAM;AACR,WAAO,KAAK,QAAQ;AAAA,EACtB;AAAA,EAEA,IAAI,WAAW;AACb,QAAI,CAAC,KAAK,MAAM;AACd,WAAK,OAAO,KAAK,QAAQ,OAAO,KAAK,OAAO,KAAK;AAAA,IACnD;AACA,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,IAAI,aAAa;AACf,WAAO,KAAK,MAAM,SAAS,EAAE;AAAA,EAC/B;AAAA,EAEA,IAAI,WAAW,MAAe;AAC5B,SAAK,MAAM,SAAS,EAAE,YAAY,KAAK,CAAC;AAAA,EAC1C;AAAA,EAEA,IAAI,YAAY;AACd,QAAI,KAAK,YAAY;AACnB,aAAO;AAAA,IACT;AACA,WAAO,KAAK,QAAQ,WAAW,SAAY,KAAK,QAAQ,SAAS,KAAK,aAAa;AAAA,EACrF;AAAA,EAEA,IAAI,UAAU;AACZ,WAAO,KAAK,QAAQ;AAAA,EACtB;AAAA,EAEA,IAAI,UAAU;AACZ,WAAO,KAAK,MAAM,SAAS,EAAE;AAAA,EAC/B;AAAA,EAEA,IAAI,QAAQ,MAAe;AACzB,SAAK,MAAM,SAAS,EAAE,SAAS,KAAK,CAAC;AAAA,EACvC;AAAA,EAEA,IAAI,QAAQ;AACV,WAAO,SAAS;AAAA,MACd,KAAK,OAAO,wCAAwC;AAAA,IACtD;AAAA,EACF;AAAA,EAEA,OAAO;AACL,QAAI,KAAK,aAAa;AACpB;AAAA,IACF;AACA,SAAK,cAAc;AACnB,UAAM,QAAQ,KAAK,QAAQ,QAA0B,KAAK,GAAG;AAE7D,UAAM,eAAe;AAAA,MACnB;AAAA,QACE,MAAM,KAAK,OAAO;AAAA,QAClB,YAAY,KAAK,OAAO;AAAA,MAC1B;AAAA,MACA,QAAQ,QAAQ,CAAC;AAAA,MACjB;AAAA,QACE,MAAM,KAAK,QAAQ,eAAe;AAAA,QAClC,YAAY,KAAK,QAAQ,cAAc;AAAA,QACvC,GAAI,KAAK,QAAQ,UAAU,EAAE,SAAS,KAAK,IAAI,CAAC;AAAA,MAClD;AAAA,IACF;AAEA,SAAK,YAAQ,4BAA8B,MAAM,YAAY;AAAA,EAC/D;AAAA,EAEA,aAAa;AAAA,EAAC;AAAA,EAEd,UAAU;AACR,SAAK,QAAQ,MAAM,KAAK,KAAK,KAAK,MAAM,SAAS,CAAC;AAAA,EACpD;AACF;AAnGwB;AAAA,MAArB,0BAAO,YAAY;AAAA,GADT,YACW;AAGqB;AAAA,MAA1C,0BAAO,0BAA0B;AAAA,GAJvB,YAIgC;AAED;AAAA,MAAzC,0BAAO,yBAAyB;AAAA,GANtB,YAM+B;AAEL;AAAA,MAApC,0BAAO,kBAAkB;AAAA,GARf,YAQ0B;AAR1B,cAAN;AAAA,MADN,8BAAW;AAAA,GACC;;;AK/Bb,IAAAC,oBAAmC;AACnC,IAAAC,gBAAwB;AAOjB,IAAM,eAAN,MAAmB;AAAA,EAAnB;AAKL,SAAS,gBAAgB,oBAAI,IAA+B;AAE5D,SAAQ,SAAS,oBAAI,IAAyB;AAE9C,SAAQ,sBAAsB,IAAI,sBAAc;AAEhD,SAAO,iBAAiB,KAAK,oBAAoB;AAAA;AAAA,EAEjD,OAAO;AACL,SAAK,OAAO,UAAU,QAAQ,CAAC,YAAY,KAAK,SAAS,OAAO,CAAC;AAAA,EACnE;AAAA;AAAA,EAGA,SAAwB,SAA0B;AAChD,SAAK,cAAc,IAAI,QAAQ,KAAK,OAAO;AAAA,EAC7C;AAAA;AAAA,EAGO,KAAK,KAAa,OAAa,SAAS,SAA6B;AAC1E,UAAM,UAAU,KAAK,cAAc,IAAI,GAAG;AAC1C,QAAI,CAAC,SAAS;AACZ;AAAA,IACF;AAEA,UAAM,gBAAgB,KAAK,UAAU,IAAI,EAAE,OAAO,CAAC,MAAM,EAAE,QAAQ,GAAG;AAEtE,QAAI,QAAQ,WAAW,cAAc,QAAQ;AAC3C,YAAM,CAAC,KAAK,IAAI;AAEhB,WAAK,OAAO,OAAO,MAAM,EAAE;AAC3B,WAAK,OAAO,IAAI,MAAM,IAAI,KAAK;AAC/B,YAAM,UAAU;AAAA,IAClB,OAAO;AACL,UAAI,CAAC,QAAQ,mBAAmB,cAAc,QAAQ;AACpD,sBAAc,QAAQ,CAAC,MAAM,KAAK,OAAO,EAAE,EAAE,CAAC;AAAA,MAChD;AACA,YAAM,QAAQ,KAAK,YAAY;AAAA,QAC7B;AAAA,QACA,QAAQ;AAAA,UACN;AAAA,UACA,GAAG;AAAA,QACL;AAAA,MACF,CAAC;AAED,WAAK,OAAO,IAAI,MAAM,IAAI,KAAK;AAAA,IACjC;AAEA,SAAK,KAAK,IAAI;AACd,SAAK,oBAAoB,KAAK;AAAA,EAChC;AAAA;AAAA,EAGO,MAAM,KAAc;AACzB,UAAM,SAAS,KAAK,UAAU;AAC9B,UAAM,eAAe,MAAM,OAAO,OAAO,CAAC,MAAM,EAAE,QAAQ,GAAG,IAAI;AACjE,iBAAa,QAAQ,CAAC,UAAU;AAC9B,WAAK,OAAO,MAAM,EAAE;AAAA,IACtB,CAAC;AACD,SAAK,oBAAoB,KAAK;AAAA,EAChC;AAAA,EAEQ,KAAK,MAAY;AAEvB,UAAM,SAAS,KAAK,UAAU,IAAI,EAAE,OAAO,CAAC,MAAM,CAAC,EAAE,WAAW,EAAE,OAAO;AACzE,UAAM,aAAa,KAAK,cAAc,IAAI;AAC1C,WAAO,OAAO,SAAS,WAAW,KAAK;AACrC,YAAM,UAAU,OAAO,MAAM;AAC7B,UAAI,SAAS;AACX,aAAK,OAAO,QAAQ,EAAE;AAAA,MACxB;AAAA,IACF;AAAA,EACF;AAAA,EAEQ,OAAO,IAAY;AACzB,UAAM,QAAQ,KAAK,OAAO,IAAI,EAAE;AAChC,QAAI,CAAC,OAAO;AACV;AAAA,IACF;AACA,QAAI,MAAM,SAAS;AACjB,YAAM,UAAU;AAAA,IAClB,OAAO;AACL,YAAM,QAAQ;AACd,WAAK,OAAO,OAAO,EAAE;AAAA,IACvB;AAAA,EACF;AAAA,EAEA,UAAU,MAAa;AACrB,UAAM,SAAwB,CAAC;AAC/B,SAAK,OAAO,QAAQ,CAAC,UAAU;AAC7B,UAAI,CAAC,QAAQ,MAAM,SAAS,MAAM;AAChC,eAAO,KAAK,KAAK;AAAA,MACnB;AAAA,IACF,CAAC;AACD,WAAO;AAAA,EACT;AAAA,EAEA,cAAc,MAAY;AACxB,YAAQ,MAAM;AAAA,MACZ,KAAK;AACH,eAAO,KAAK,OAAO;AAAA,MACrB,KAAK;AACH,eAAO,KAAK,OAAO;AAAA,MACrB,KAAK;AACH,eAAO,KAAK,OAAO;AAAA,MACrB,KAAK;AAAA,MACL;AACE,eAAO,KAAK,OAAO;AAAA,IACvB;AAAA,EACF;AAAA,EAEA,UAAU;AACR,SAAK,oBAAoB,QAAQ;AAAA,EACnC;AACF;AArHuC;AAAA,MAApC,0BAAO,kBAAkB;AAAA,GADf,aAC0B;AAEA;AAAA,MAApC,0BAAO,kBAAkB;AAAA,GAHf,aAG0B;AAH1B,eAAN;AAAA,MADN,8BAAW;AAAA,GACC;;;ACRb,uBAAqB;AACrB,IAAAC,gBAA8B;AAE9B,IAAAC,oBAAmC;AACnC,IAAAC,gBAAqC;AACrC,IAAAC,eAAqC;;;ACLrC,IAAAC,SAAuB;AAEvB,IAAAC,eAAiB;;;ACFjB,mBAA0B;AAQnB,IAAM,eAAe,CAAC,EAAE,SAAS,IAAI,QAAQ,MAA2B;AAC7E,8BAAU,MAAM;AAEd,QAAI,OAAO,aAAa,YAAa;AAErC,QAAI,SAAS,eAAe,EAAE,EAAG;AAEjC,UAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,UAAM,KAAK;AACX,UAAM,cAAc;AACpB,aAAS,KAAK,YAAY,KAAK;AAE/B,WAAO,MAAM;AACX,YAAM,WAAW,SAAS,eAAe,EAAE;AAC3C,UAAI,YAAY,QAAS,UAAS,OAAO;AAAA,IAC3C;AAAA,EACF,GAAG,CAAC,EAAE,CAAC;AACT;;;ACzBA,IAAAC,SAAuB;AAIvB,kBAAqB;;;ACJrB,kBAA2B;AAIpB,IAAM,kBAAkB,UAAM,wBAAyB,YAAY;;;ACJ1E,IAAAC,gBAA2B;AAE3B,yBAAuC;AACvC,qBAAwB;;;ACHxB,IAAAC,gBAA8B;AAIvB,IAAM,mBAAe,6BAAc,CAAC,CAAgB;;;ADIpD,IAAM,WAAW,UAAM,0BAAW,YAAY;AAE9C,IAAM,gBAAgB,CAAI,aAAyC;AACxE,QAAM,QAAQ,SAAS;AACvB,aAAO,2CAAuB,MAAM,OAAO,UAAU,sBAAO;AAC9D;;;AFXA,IAAM,EAAE,WAAAC,YAAW,UAAAC,WAAU,QAAAC,QAAO,IAAIC;AAUxC,IAAM,YAAgE,CAAC,EAAE,OAAO,OAAO,MAAM;AAC3F,QAAM,eAAe,gBAAgB;AACrC,QAAM,MAAMD,QAAuB,IAAI;AAEvC,QAAM,eAAe,CAAC,SAAS,cAAc,EAAE,SAAS,MAAM,IAAI;AAElE,QAAM,EAAE,MAAM,WAAW,IAAI,cAAc,CAAC,OAAO;AAAA,IACjD,MAAM,EAAE;AAAA,IACR,YAAY,EAAE;AAAA,EAChB,EAAE;AAEF,QAAM,CAAC,WAAW,YAAY,IAAID,UAAS,IAAI;AAE/C,QAAM,cAAc,aAAa,YAAY;AAE7C,QAAM,YAAY,eAAe,EAAE,OAAO,YAAY,IAAI,EAAE,QAAQ,YAAY;AAChF,QAAM,eAAe,CAAC,SAAiB;AACrC,QAAI,WAAW;AACf,QAAI,OAAO,MAAM,QAAQ,YAAY,YAAY,WAAW,MAAM,QAAQ,SAAS;AACjF,iBAAW,MAAM,QAAQ;AAAA,IAC3B,WAAW,OAAO,MAAM,QAAQ,YAAY,YAAY,WAAW,MAAM,QAAQ,SAAS;AACxF,iBAAW,MAAM,QAAQ;AAAA,IAC3B;AACA,UAAM,MAAM,SAAS,EAAE,MAAM,SAAS,CAAC;AAAA,EACzC;AAEA,EAAAD,WAAU,MAAM;AAEd,QAAI,IAAI,WAAW,CAAC,YAAY;AAC9B,YAAM,EAAE,OAAO,OAAO,IAAI,IAAI,QAAQ,sBAAsB;AAC5D,YAAM,WAAW,eAAe,QAAQ;AACxC,YAAM,MAAM,SAAS,EAAE,MAAM,SAAS,CAAC;AAAA,IACzC;AAAA,EACF,GAAG,CAAC,UAAU,CAAC;AAEf,EAAAA,WAAU,MAAM;AACd,QAAI,CAAC,YAAY;AACf;AAAA,IACF;AACA,UAAM,QAAQ,MAAM;AACpB,QAAI,CAAC,OAAO;AACV;AAAA,IACF;AACA,UAAM,WAAW,IAAI,eAAe,CAAC,CAAC,KAAK,MAAM;AAC/C,YAAM,EAAE,OAAO,OAAO,IAAI,MAAM;AAChC,mBAAa,eAAe,QAAQ,MAAM;AAAA,IAC5C,CAAC;AACD,aAAS,QAAQ,KAAK;AACtB,WAAO,MAAM,SAAS,WAAW;AAAA,EACnC,GAAG,CAAC,UAAU,CAAC;AAEf,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA,eAAe,qBAAqB;AAAA,MACtC;AAAA,MACA,KAAK,MAAM;AAAA,MACX;AAAA,MACA,OAAO;AAAA,QACL,SAAS,SAAS,SAAS;AAAA,QAC3B,GAAG,MAAM,QAAQ;AAAA,QACjB,GAAG,MAAM,OAAO;AAAA,QAChB,GAAG;AAAA,MACL;AAAA;AAAA,IAEC,MAAM,aACL,aAAa,OAAO,gBAAgB;AAAA,MAClC;AAAA,MACA,WAAW,eAAe,aAAa;AAAA,MACvC,UAAU;AAAA,IACZ,CAAC;AAAA,IACF,MAAM;AAAA,EACT;AAEJ;AAEO,IAAM,YAAsC,CAAC,EAAE,KAAK,MAAM;AAC/D,QAAM,eAAe,gBAAgB;AACrC,QAAM,CAAC,QAAQ,SAAS,IAAIC,UAAS,aAAa,UAAU,IAAI,CAAC;AAEjE,EAAAD,WAAU,MAAM;AACd,QAAI;AAEJ,aAAS,gBAAgB,IAAgB;AACvC,mBAAa,OAAO;AACpB,gBAAU,WAAW,IAAI,CAAC;AAAA,IAC5B;AACA,UAAM,UAAU,aAAa,eAAe,MAAM;AAChD,YAAM,IAAS,EAAE,GAAGG,OAAM;AAE1B,YAAM,QAAQ,EAAE,iBAAiB;AACjC,UAAI,OAAO,UAAU,YAAY;AAC/B,cAAM,MAAM,UAAU,aAAa,UAAU,IAAI,CAAC,CAAC;AAAA,MACrD,OAAO;AACL,wBAAgB,MAAM,UAAU,aAAa,UAAU,IAAI,CAAC,CAAC;AAAA,MAC/D;AAAA,IACF,CAAC;AACD,WAAO,MAAM,QAAQ,QAAQ;AAAA,EAC/B,GAAG,CAAC,CAAC;AAEL,SACE,4DACG,OAAO,IAAI,CAAC,UACX,qCAAC,aAAa,UAAb,EAAsB,OAAO,OAAO,KAAK,MAAM,MAC9C,qCAAC,aAAU,OAAc,QAAQ,MAAM,WAAW,CAAC,MAAM,SAAS,CACpE,CACD,CACH;AAEJ;;;AI1HO,IAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ANelB,IAAM,aAAwC,CAAC;AAAA,EACpD,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,eAAa;AAAA,IACX,SAAS;AAAA,IACT,IAAI;AAAA,EACN,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,aAAAC;AAAA,QACT;AAAA,QACA,SAAS,YAAY;AAAA,QACrB,SAAS,cAAc;AAAA,QACvB;AAAA,MACF;AAAA,MACA;AAAA;AAAA,IAEA,qCAAC,SAAI,WAAU,gCACb,qCAAC,SAAI,WAAU,gCAA8B,QAAS,GACtD,qCAAC,SAAI,WAAU,kCACb,qCAAC,aAAU,MAAM,SAAS,WAAW,kBAAkB,UAAU,CACnE,CACF;AAAA,IACA,qCAAC,SAAI,WAAU,iCACb,qCAAC,aAAU,MAAM,SAAS,WAAW,iBAAiB,SAAS,CACjE;AAAA,EACF;AAEJ;;;AO/CA,IAAAC,SAAuB;AAMhB,IAAM,mBAAoD,CAAC,UAChE,qCAAC,cAAW,MAAK,UAAU,GAAG,OAAO;;;ARIhC,IAAMC,cAAN,cAAyB,mBAAM;AAAA,EAA/B;AAAA;AAKL,SAAS,YAAY,uBAAS,mBAAmB,wBAAwB;AAEzE,kBAA6B;AAAA;AAAA,EAE7B,UAAgB;AACd,SAAK,YAAY,kBAAkB,KAAK,aAAa,EAAE,YAAY,KAAK,SAAS;AACjF,SAAK,UAAU;AAAA,MACb,yBAAW,OAAO,MAAM;AAEtB,aAAK,UAAU,OAAO;AAAA,MACxB,CAAC;AAAA,IACH;AACA,UAAM,cAAc;AAAA,MAClB,eAAe;AAAA,MACf,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,MAAM;AAAA,MACN,KAAK;AAAA,MACL,QAAQ;AAAA,IACV;AACA,2BAAS,SAAS,KAAK,WAAW,WAAW;AAAA,EAC/C;AAAA,EAEA,SAAsB;AACpB,QAAI,CAAC,KAAK,QAAQ;AAChB,YAAM,EAAE,UAAU,GAAG,YAAY,IAAI,KAAK,YAAY;AACtD,WAAK,aAAS,6BAAc,YAAgB,aAAa,QAAQ;AAAA,IACnE;AACA,WAAO,iBAAAC,QAAS,aAAa,KAAK,QAAQ,KAAK,SAAS;AAAA,EAC1D;AACF;AAnC+C;AAAA,MAA5C,0BAAO,kBAAkB;AAAA,GADfD,YACkC;AAEL;AAAA,MAAvC,0BAAO,0BAAa;AAAA,GAHVA,YAG6B;AAH7BA,cAAN;AAAA,MADN,8BAAW;AAAA,GACCA;;;APMN,IAAM,+BAA2B,kCAAiD;AAAA,EACvF,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ;AACzB,SAAK,YAAY,EAAE,GAAG,YAAY,EAAE,iBAAiB;AACrD,SAAK,YAAY,EAAE,GAAG,gBAAgB,EAAE,iBAAiB;AACzD,SAAK,kBAAkB,EAAE,gBAAgB,aAAa,GAAG,CAAC;AAC1D,SAAK,kBAAkB,EAAE;AAAA,MACvB,CAAC,YACC,CAAC;AAAA,QACC;AAAA,QACA;AAAA,MACF,MAGM;AACJ,cAAM,YAAY,QAAQ,UAAU,YAAY;AAChD,kBAAU,KAAK,0BAA0B,EAAE,gBAAgB,OAAO;AAClE,kBAAU,KAAK,yBAAyB,EAAE,gBAAgB,MAAM;AAChE,cAAM,QAAQ,UAAU,QAAQ,WAAW;AAC3C,cAAM,KAAK;AACX,eAAO;AAAA,MACT;AAAA,IACJ;AAAA,EACF;AAAA,EACA,OAAO,KAAK;AACV,QAAI,WAAW,cAAcE,WAAU;AACvC,UAAM,eAAe,IAAI,UAAU,IAAkB,YAAY;AACjE,iBAAa,KAAK;AAAA,EACpB;AACF,CAAC;","names":["import_core","import_inversify","e","import_inversify","import_utils","import_react","import_inversify","import_utils","import_core","React","import_clsx","React","import_react","import_react","useEffect","useState","useRef","React","clsx","React","PanelLayer","ReactDOM","PanelLayer"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flowgram.ai/panel-manager-plugin",
3
- "version": "1.0.7",
3
+ "version": "1.0.9",
4
4
  "homepage": "https://flowgram.ai/",
5
5
  "repository": "https://github.com/bytedance/flowgram.ai",
6
6
  "license": "MIT",
@@ -16,10 +16,10 @@
16
16
  "inversify": "^6.0.1",
17
17
  "clsx": "^1.1.1",
18
18
  "nanoid": "^5.0.9",
19
- "zustand": "^5.0.8",
19
+ "zustand": "^4.5.5",
20
20
  "use-sync-external-store": "^1.6.0",
21
- "@flowgram.ai/core": "1.0.7",
22
- "@flowgram.ai/utils": "1.0.7"
21
+ "@flowgram.ai/core": "1.0.9",
22
+ "@flowgram.ai/utils": "1.0.9"
23
23
  },
24
24
  "devDependencies": {
25
25
  "react": "^18",
@@ -28,8 +28,8 @@
28
28
  "@types/react-dom": "^18",
29
29
  "tsup": "^8.0.1",
30
30
  "typescript": "^5.8.3",
31
- "@flowgram.ai/eslint-config": "1.0.7",
32
- "@flowgram.ai/ts-config": "1.0.7"
31
+ "@flowgram.ai/ts-config": "1.0.9",
32
+ "@flowgram.ai/eslint-config": "1.0.9"
33
33
  },
34
34
  "peerDependencies": {
35
35
  "react": ">=16.8",
package/rush-logs/panel-manager-plugin.build.log CHANGED
@@ -9,13 +9,13 @@ CLI tsup v8.5.0
9
9
  CLI Target: es2020
10
10
  CJS Build start
11
11
  ESM Build start
12
- CJS dist/index.js 21.17 KB
13
- CJS dist/index.js.map 35.97 KB
14
- CJS ⚡️ Build success in 108ms
15
- ESM dist/esm/index.js 18.44 KB
16
- ESM dist/esm/index.js.map 35.39 KB
17
- ESM ⚡️ Build success in 112ms
12
+ CJS dist/index.js 20.95 KB
13
+ CJS dist/index.js.map 36.67 KB
14
+ CJS ⚡️ Build success in 113ms
15
+ ESM dist/esm/index.js 18.67 KB
16
+ ESM dist/esm/index.js.map 36.00 KB
17
+ ESM ⚡️ Build success in 116ms
18
18
  DTS Build start
19
- DTS ⚡️ Build success in 3610ms
20
- DTS dist/index.d.ts 5.10 KB
21
- DTS dist/index.d.mts 5.10 KB
19
+ DTS ⚡️ Build success in 3915ms
20
+ DTS dist/index.d.ts 5.07 KB
21
+ DTS dist/index.d.mts 5.07 KB
package/src/components/panel-layer/docked-panel-layer.tsx CHANGED
@@ -3,6 +3,8 @@
3
3
  * SPDX-License-Identifier: MIT
4
4
  */
5
5
 
6
+ import * as React from 'react';
7
+
6
8
  import { PanelLayer, PanelLayerProps } from './panel-layer';
7
9
 
8
10
  export type DockedPanelLayerProps = Omit<PanelLayerProps, 'mode'>;
package/src/components/panel-layer/panel-layer.tsx CHANGED
@@ -3,6 +3,8 @@
3
3
  * SPDX-License-Identifier: MIT
4
4
  */
5
5
 
6
+ import * as React from 'react';
7
+
6
8
  import clsx from 'clsx';
7
9
 
8
10
  import { useGlobalCSS } from '../../hooks/use-global-css';
package/src/components/panel-layer/panel.tsx CHANGED
@@ -3,7 +3,9 @@
3
3
  * SPDX-License-Identifier: MIT
4
4
  */
5
5
 
6
- import { useEffect, startTransition, useState, useRef } from 'react';
6
+ import * as React from 'react';
7
+
8
+ const { useEffect, useState, useRef } = React;
7
9
 
8
10
  import { clsx } from 'clsx';
9
11
 
@@ -95,10 +97,21 @@ export const PanelArea: React.FC<{ area: Area }> = ({ area }) => {
95
97
  const [panels, setPanels] = useState(panelManager.getPanels(area));
96
98
 
97
99
  useEffect(() => {
100
+ let pending: number;
101
+
102
+ function startTransition(fn: () => void) {
103
+ clearTimeout(pending);
104
+ pending = setTimeout(fn, 0);
105
+ }
98
106
  const dispose = panelManager.onPanelsChange(() => {
99
- startTransition(() => {
100
- setPanels(panelManager.getPanels(area));
101
- });
107
+ const r: any = { ...React };
108
+
109
+ const start = r['startTransition'] as undefined | ((cb: () => void) => void);
110
+ if (typeof start === 'function') {
111
+ start(() => setPanels(panelManager.getPanels(area)));
112
+ } else {
113
+ startTransition(() => setPanels(panelManager.getPanels(area)));
114
+ }
102
115
  });
103
116
  return () => dispose.dispose();
104
117
  }, []);
package/src/components/resize-bar/index.tsx CHANGED
@@ -3,7 +3,9 @@
3
3
  * SPDX-License-Identifier: MIT
4
4
  */
5
5
 
6
- import React, { useRef, useState } from 'react';
6
+ import * as React from 'react';
7
+
8
+ const { useRef, useState } = React;
7
9
 
8
10
  interface Props {
9
11
  size: number;
package/tsconfig.json CHANGED
@@ -1,12 +1,8 @@
1
1
  {
2
2
  "extends": "@flowgram.ai/ts-config/tsconfig.flow.base.json",
3
3
  "compilerOptions": {
4
- "jsx": "react-jsx"
4
+ "jsx": "react"
5
5
  },
6
- "include": [
7
- "./src"
8
- ],
9
- "exclude": [
10
- "node_modules"
11
- ]
6
+ "include": ["./src"],
7
+ "exclude": ["node_modules"]
12
8
  }