diff --git a/src/app/connection/left/item/left_item.ts b/src/app/connection/left/item/left_item.ts
index ef29d2e..e4b7335 100644
--- a/src/app/connection/left/item/left_item.ts
+++ b/src/app/connection/left/item/left_item.ts
@@ -10,7 +10,7 @@ const Widget: WidgetType = {
     title: '',
     id: '',
     creator: '',
-    baseCls: 'dec-webui-dcm-connection-left-item',
+    baseCls: 'dec-webui-dcm-connection-left-item bi-list-item-active',
   },
   _store() {
     return BI.Models.getModel(Model);
@@ -20,7 +20,6 @@ const Widget: WidgetType = {
     
     return {
       type: LeftRightVerticalAdapt,
-      cls: 'bi-list-item-active',
       height: 24,
       items: {
         left: [
diff --git a/src/app/connection/right/right_edit/right_edit.ts b/src/app/connection/right/right_edit/right_edit.ts
index b2c80fd..4ae86f6 100644
--- a/src/app/connection/right/right_edit/right_edit.ts
+++ b/src/app/connection/right/right_edit/right_edit.ts
@@ -88,8 +88,7 @@ const Widget: WidgetType = {
                 type: FormItem,
                 text: BI.i18nText('Dec-Dcm_Connection_Form_URL'),
                 form: {
-                  type: Editor,
-                  cls: 'bi-border',
+                  type: TextEditor,
                   watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
                   width: 300,
                   value: linkSelected.url,
@@ -133,8 +132,7 @@ const Widget: WidgetType = {
                 type: FormItem,
                 text: BI.i18nText('Dec-Dcm_Connection_Form_UserName'),
                 form: {
-                  type: Editor,
-                  cls: 'bi-border',
+                  type: TextEditor,
                   allowBlank: true,
                   watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
                   width: 300,
@@ -154,8 +152,7 @@ const Widget: WidgetType = {
                 type: FormItem,
                 text: BI.i18nText('Dec-Dcm_Connection_Form_Password'),
                 form: {
-                  type: Editor,
-                  cls: 'bi-border',
+                  type: TextEditor,
                   inputType: 'password',
                   allowBlank: true,
                   watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
@@ -182,7 +179,6 @@ const Widget: WidgetType = {
                 height: 100,
                 form: {
                   type: TextAreaEditor,
-                  cls: 'bi-border',
                   allowBlank: true,
                   watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
                   width: 300,
@@ -222,8 +218,7 @@ const Widget: WidgetType = {
                 type: FormItem,
                 text: BI.i18nText('Dec-Dcm_Connection_Form_Connection_Max_Number'),
                 form: {
-                  type: Editor,
-                  cls: 'bi-border',
+                  type: TextEditor,
                   allowBlank: true,
                   watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
                   width: 60,
@@ -261,8 +256,7 @@ const Widget: WidgetType = {
             type: FormItem,
             text: BI.i18nText('Dec-Dcm_Connection_Form_Pattern'),
             form: {
-              type: Editor,
-              cls: 'bi-border',
+              type: TextEditor,
               width: 300,
               disabled: true,
             },
diff --git a/src/app/connection/right/right_edit/right_edit_jndi.ts b/src/app/connection/right/right_edit/right_edit_jndi.ts
index aad12e3..4a789d9 100644
--- a/src/app/connection/right/right_edit/right_edit_jndi.ts
+++ b/src/app/connection/right/right_edit/right_edit_jndi.ts
@@ -1,4 +1,4 @@
-import {Vertical, Editor, TextValueCombo, TextButton, Label} from '@ui';
+import {Vertical, Editor, TextValueCombo, TextButton, Label, TextEditor} from '@ui';
 import FormItem from '@shared/components/form_item';
 import {JNDI_FACTORYS, OTHER_ATTRIBUTES, CONNECT_CHARSET} from '@private/constants';
 import {AttributeType} from '../right.typing';
@@ -29,8 +29,7 @@ const Widget = BI.inherit(BI.Widget, {
           type: FormItem,
           text: BI.i18nText('Dec-Dcm_Connection_JNDI_Form_ConnectionName'),
           form: {
-            type: Editor,
-            cls: 'bi-border',
+            type: TextEditor,
             width: 300,
             allowBlank: true,
             value: connectionName,
@@ -68,8 +67,7 @@ const Widget = BI.inherit(BI.Widget, {
                 text: 'PROVIDER_URL',
                 width: 180,
                 form: {
-                  type: Editor,
-                  cls: 'bi-border',
+                  type: TextEditor,
                   width: 300,
                   allowBlank: true,
                   value: url,
@@ -80,8 +78,7 @@ const Widget = BI.inherit(BI.Widget, {
                 text: 'SECURITY_PRINCIPAL',
                 width: 180,
                 form: {
-                  type: Editor,
-                  cls: 'bi-border',
+                  type: TextEditor,
                   width: 300,
                   allowBlank: true,
                   value: principal,
@@ -92,8 +89,7 @@ const Widget = BI.inherit(BI.Widget, {
                 text: 'SECURITY_CREDENTIALS',
                 width: 180,
                 form: {
-                  type: Editor,
-                  cls: 'bi-border',
+                  type: TextEditor,
                   width: 300,
                   allowBlank: true,
                   value: credentials,
@@ -127,8 +123,7 @@ const Widget = BI.inherit(BI.Widget, {
                     text: item.text,
                     width: 180,
                     form: {
-                      type: Editor,
-                      cls: 'bi-border',
+                      type: TextEditor,
                       width: 300,
                       allowBlank: true,
                       value: this.options[item.name],
diff --git a/src/app/connection/right/right_edit/right_edit_mysql.ts b/src/app/connection/right/right_edit/right_edit_mysql.ts
index ab3fe3e..03da872 100644
--- a/src/app/connection/right/right_edit/right_edit_mysql.ts
+++ b/src/app/connection/right/right_edit/right_edit_mysql.ts
@@ -1,4 +1,4 @@
-import {WidgetType, Vertical, MultiSelectItem, TextAreaEditor, Editor, Button, TextValueCombo} from '@ui/index';
+import {WidgetType, Vertical, MultiSelectItem, TextAreaEditor, Button, TextValueCombo, TextEditor} from '@ui/index';
 import {LinkType} from '@ui/type';
 import {CONNECT_CHARSET} from '@private/constants';
 import Model from '../../link_set.model';
@@ -23,8 +23,7 @@ const Widget: WidgetType = {
           text: BI.i18nText('Dec-Dcm_Connection_Form_ConnectionName'),
           hint: BI.i18nText('Dec-Dcm_Connection_Form_ConnectionName-Change-Confirm'),
           form: {
-            type: Editor,
-            cls: 'bi-border',
+            type: TextEditor,
             width: 300,
             value: linkSelected.connectionName,
             listeners: [{
@@ -61,8 +60,7 @@ const Widget: WidgetType = {
           type: FormItem,
           text: BI.i18nText('Dec-Dcm_Connection_Form_URL'),
           form: {
-            type: Editor,
-            cls: 'bi-border',
+            type: TextEditor,
             watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
             width: 300,
             value: linkSelected.url,
@@ -106,8 +104,7 @@ const Widget: WidgetType = {
           type: FormItem,
           text: BI.i18nText('Dec-Dcm_Connection_Form_UserName'),
           form: {
-            type: Editor,
-            cls: 'bi-border',
+            type: TextEditor,
             allowBlank: true,
             watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
             width: 300,
@@ -127,8 +124,7 @@ const Widget: WidgetType = {
           type: FormItem,
           text: BI.i18nText('Dec-Dcm_Connection_Form_Password'),
           form: {
-            type: Editor,
-            cls: 'bi-border',
+            type: TextEditor,
             inputType: 'password',
             allowBlank: true,
             watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
@@ -155,7 +151,6 @@ const Widget: WidgetType = {
           height: 100,
           form: {
             type: TextAreaEditor,
-            cls: 'bi-border',
             allowBlank: true,
             watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
             width: 300,
@@ -195,8 +190,7 @@ const Widget: WidgetType = {
           type: FormItem,
           text: BI.i18nText('Dec-Dcm_Connection_Form_Connection_Max_Number'),
           form: {
-            type: Editor,
-            cls: 'bi-border',
+            type: TextEditor,
             allowBlank: true,
             watermark: BI.i18nText('Dec-Dcm_Connection_Form_Place_Input'),
             width: 60,
diff --git a/src/app/title/title.ts b/src/app/title/title.ts
index 7647265..924065d 100644
--- a/src/app/title/title.ts
+++ b/src/app/title/title.ts
@@ -6,14 +6,13 @@ import {TAB_LINK_SET, TAB_LINK_POOL} from '@private/constants';
 const className = 'dec.dcm.title';
 const Widget: WidgetType = {
   props: {
-    baseCls: 'dec-webui-dcm-title',
+    baseCls: 'dec-webui-dcm-title bi-card bi-border-bottom',
   },
   render() {
     const hideCloseButton = isDesigner();
     
     return {
       type: LeftRightVerticalAdapt,
-      cls: 'bi-card bi-border-bottom',
       items: {
         left: [
           {
diff --git a/src/demo/plugin.redis.edit.ts b/src/demo/plugin.redis.edit.ts
index c010093..8824963 100644
--- a/src/demo/plugin.redis.edit.ts
+++ b/src/demo/plugin.redis.edit.ts
@@ -1,4 +1,5 @@
 import './style.scss';
+import {TextEditor, Vertical, Left, Label} from '@ui/index';
 const RedisConstantName = 'dec.constant.database.conf.connect.form.redis.value';
 const form = {
   url: '192.168.1.22',
@@ -10,24 +11,23 @@ const classNameEdit = 'dec.dcm.plugin.redis.edit';
 const Widget = BI.inherit(BI.Widget, {
   render() {
     return {
-      type: 'bi.vertical',
+      type: Vertical,
       cls: 'bi-plugin-redis',
       bgap: 10,
       items: [
         {
-          type: 'bi.left',
+          type: Left,
           height: 30,
           items: [
             {
-              type: 'bi.label',
+              type: Label,
               text: BI.i18nText('Dec-Dcm_Connection_Form_Database_Addr'),
               height: 24,
               width: 115,
               textAlign: 'left',
             },
             {
-              type: 'bi.editor',
-              cls: 'bi-border',
+              type: TextEditor,
               watermark: BI.i18nText('Dec-Dcm_Connection_Form_Database_Addr'),
               value: form.url,
               allowBlank: true,
@@ -36,19 +36,18 @@ const Widget = BI.inherit(BI.Widget, {
             }],
         },
         {
-          type: 'bi.left',
+          type: Left,
           height: 30,
           items: [
             {
-              type: 'bi.label',
+              type: Label,
               text: BI.i18nText('Dec-Dcm_Connection_Form_Database_Port'),
               height: 24,
               width: 115,
               textAlign: 'left',
             },
             {
-              type: 'bi.editor',
-              cls: 'bi-border',
+              type: TextEditor,
               watermark: BI.i18nText('Dec-Dcm_Connection_Form_Database_Port'),
               allowBlank: true,
               width: 300,
@@ -61,19 +60,18 @@ const Widget = BI.inherit(BI.Widget, {
             }],
         },
         {
-          type: 'bi.left',
+          type: Left,
           height: 30,
           items: [
             {
-              type: 'bi.label',
+              type: Label,
               text: BI.i18nText('Dec-Dcm_Connection_Form_Password'),
               height: 24,
               width: 115,
               textAlign: 'left',
             },
             {
-              type: 'bi.editor',
-              cls: 'bi-border',
+              type: TextEditor,
               inputType: 'password',
               value: form.password,
               allowBlank: true,