diff --git a/ui/src/workflow/common/NodeContainer.vue b/ui/src/workflow/common/NodeContainer.vue
index ba6e5e4c6..4c1ce15ba 100644
--- a/ui/src/workflow/common/NodeContainer.vue
+++ b/ui/src/workflow/common/NodeContainer.vue
@@ -123,4 +123,7 @@ const props = defineProps<{
 .outgoing-anchor {
   stroke: #82b366;
 }
+:deep(.el-card) {
+  overflow: visible;
+}
 </style>
diff --git a/ui/src/workflow/common/app-node.ts b/ui/src/workflow/common/app-node.ts
index 620ac1216..8a7c4bdad 100644
--- a/ui/src/workflow/common/app-node.ts
+++ b/ui/src/workflow/common/app-node.ts
@@ -1,12 +1,13 @@
 import Components from '@/components'
 import ElementPlus from 'element-plus'
 import * as ElementPlusIcons from '@element-plus/icons-vue'
-import { HtmlNode, HtmlNodeModel, BaseEdge } from '@logicflow/core'
+
+import { HtmlResize } from '@logicflow/extension'
 import { createApp, h } from 'vue'
 import directives from '@/directives'
 import i18n from '@/locales'
 
-class AppNode extends HtmlNode {
+class AppNode extends HtmlResize.view {
   isMounted
   r
   app
@@ -61,7 +62,7 @@ class AppNode extends HtmlNode {
   }
 }
 
-class AppNodeModel extends HtmlNodeModel {
+class AppNodeModel extends HtmlResize.model {
   getOutlineStyle() {
     const style = super.getOutlineStyle()
     style.stroke = 'none'