From 3a4380ef91148e5a68283d66c6b020723375187f Mon Sep 17 00:00:00 2001
From: vv13 <zwhvv13@gmail.com>
Date: Sat, 18 May 2024 12:42:00 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(draggable-panel):=20?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=B1=95=E5=BC=80=E5=8F=97=E6=8E=A7=E6=A8=A1?=
 =?UTF-8?q?=E5=BC=8F=E7=9A=84=E9=AB=98=E5=BA=A6=E5=A1=8C=E9=99=B7=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98=20(#127)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/DraggablePanel/FixMode.tsx            |  2 +-
 src/DraggablePanel/demos/controlFixed.tsx | 29 +++++++++++++++++++++++
 src/DraggablePanel/index.en-US.md         |  2 ++
 src/DraggablePanel/index.zh-CN.md         |  2 ++
 4 files changed, 34 insertions(+), 1 deletion(-)
 create mode 100644 src/DraggablePanel/demos/controlFixed.tsx

diff --git a/src/DraggablePanel/FixMode.tsx b/src/DraggablePanel/FixMode.tsx
index d3997151..ebeff70b 100644
--- a/src/DraggablePanel/FixMode.tsx
+++ b/src/DraggablePanel/FixMode.tsx
@@ -190,7 +190,7 @@ const FixMode: FC<FixModePanelProps> = memo<FixModePanelProps>(
           maxHeight: typeof maxHeight === 'number' ? Math.max(maxHeight, 0) : undefined,
           maxWidth: typeof maxWidth === 'number' ? Math.max(maxWidth, 0) : undefined,
           defaultSize,
-          size: size as Size,
+          size: (size || { height: 'auto' }) as Size,
           style,
         }
       : {
diff --git a/src/DraggablePanel/demos/controlFixed.tsx b/src/DraggablePanel/demos/controlFixed.tsx
new file mode 100644
index 00000000..ca9a7900
--- /dev/null
+++ b/src/DraggablePanel/demos/controlFixed.tsx
@@ -0,0 +1,29 @@
+/**
+ * compact: false
+ */
+import { DraggablePanel } from '@ant-design/pro-editor';
+import { useState } from 'react';
+
+export default () => {
+  const [open, setOpen] = useState(false);
+  return (
+    <div
+      style={{
+        height: 300,
+        display: 'flex',
+        overflow: 'hidden',
+        maxWidth: '100%',
+      }}
+    >
+      <div style={{ flex: 1, padding: 12 }}>Content</div>
+      <DraggablePanel
+        style={{ padding: 12 }}
+        maxWidth={600}
+        isExpand={open}
+        onExpandChange={setOpen}
+      >
+        Right Panel
+      </DraggablePanel>
+    </div>
+  );
+};
diff --git a/src/DraggablePanel/index.en-US.md b/src/DraggablePanel/index.en-US.md
index 0d77d9cf..effa72a9 100644
--- a/src/DraggablePanel/index.en-US.md
+++ b/src/DraggablePanel/index.en-US.md
@@ -18,6 +18,8 @@ Used for panels that need to be stretched or dragged and moved.
 
 <code src="./demos/top.tsx" title="Fixed Panel at the Top" description="The panel at the top is fixed and can be dragged up and down"></code>
 
+<code src="./demos/controlFixed.tsx" title="Fixed Panel expandable controlled" description="The panel  is fixed and expand can be controlled"></code>
+
 <code src="./demos/float.tsx" compact="true" title="Floating Draggable Panel" description="Set `mode` to `float`"></code>
 
 <code src="./demos/controlFloat.tsx" compact="true" title="Floating Controlled Mode" description="The position of the floating panel is controlled"></code>
diff --git a/src/DraggablePanel/index.zh-CN.md b/src/DraggablePanel/index.zh-CN.md
index e5d8edcc..13e78bab 100644
--- a/src/DraggablePanel/index.zh-CN.md
+++ b/src/DraggablePanel/index.zh-CN.md
@@ -18,6 +18,8 @@ group: 面板模块
 
 <code src="./demos/top.tsx" title="顶部面板固定" description="顶部面板固定，上下拖动"></code>
 
+<code src="./demos/controlFixed.tsx" title="面板展开受控" description="右侧面板固定，展开状态受控模式"></code>
+
 <code src="./demos/float.tsx" compact="true" title="悬浮可拖拽面板" description="设置 `mode` 为 `float`"></code>
 
 <code src="./demos/controlFloat.tsx" compact="true" title="悬浮受控模式" description="悬浮框位置受控"></code>