diff --git a/src/meditor/helper.js b/src/meditor/helper.js
index 12446dd..b2c33c7 100644
--- a/src/meditor/helper.js
+++ b/src/meditor/helper.js
@@ -4,7 +4,8 @@
  * @date 2020/10/12 18:23:23
  */
 
-import ICONS from './svg'
+import { html } from 'wkit'
+import ICONS from './svg.js'
 
 const ELEMS = {
   a: function (str, attr, inner) {
@@ -63,7 +64,7 @@ const ELEMS = {
   hr: '\n\n---\n\n'
 }
 
-const DEFAULT_TOOLS = [
+export const DEFAULT_TOOLS = [
   'header',
   'quote',
   'bold',
@@ -128,15 +129,16 @@ function tagExp(tag, open) {
 /**
  * 渲染工具栏图标
  */
-export function renderToolbar(list, tag = 'span', dict = {}, showText = false) {
-  return (list || DEFAULT_TOOLS)
-    .map(it => {
-      var title = showText ? '' : `title="${dict[it] || ''}"`
-      var text = showText ? dict[it] || '' : ''
+export function renderToolbar(list = [], dict = {}, showText = false) {
+  return list.map(it => {
+    let title = showText ? '' : dict[it]
+    let text = showText ? dict[it] || '' : ''
 
-      return `<${tag} data-act="${it}" ${title}><svg class="icon" viewBox="0 0 1024 1024"><path d="${ICONS[it]}"/></svg>${text}</${tag}>`
-    })
-    .join('')
+    return html`<section data-act=${it} title=${title}>
+      <svg class="icon" viewBox="0 0 1024 1024"><path d=${ICONS[it]} /></svg>
+      ${text}
+    </section>`
+  })
 }
 
 /**
diff --git a/src/meditor/index.js b/src/meditor/index.js
index 661f251..fe0b455 100644
--- a/src/meditor/index.js
+++ b/src/meditor/index.js
@@ -17,44 +17,12 @@ import {
   outsideClick,
   clearOutsideClick
 } from 'wkit'
-import ICONS from './svg.js'
+
+import { renderToolbar, DEFAULT_TOOLS } from './helper.js'
+
 import '../form/input.js'
 import '../form/button.js'
 
-const ACTTION = {
-  bold: 'bold',
-  italic: 'italic',
-  under: 'underline',
-  delete: 'strikeThrough',
-  left: 'justifyLeft',
-  center: 'justifyCenter',
-  right: 'justifyRight',
-  image: 'insertImage',
-  font: 'fontSize',
-  color: 'foreColor',
-  link: 'createLink',
-  ordered: 'insertOrderedList',
-  unordered: 'insertUnorderedList'
-}
-
-const DEFAULT_TOOLS = [
-  'font',
-  'color',
-  'bold',
-  'italic',
-  'under',
-  'delete',
-  'ordered',
-  'unordered',
-  'table',
-  'left',
-  'center',
-  'right',
-  'link',
-  'image',
-  'fullscreen'
-]
-
 const COLORS = [
   '#f3f5fb',
   '#dae1e9',
@@ -84,20 +52,24 @@ function getIndex(x, y) {
 }
 
 class MEditor extends Component {
+  static watches = ['value']
+
   static props = {
     toolbar: {
       type: String,
-      default: '',
+      default: null,
       attribute: false,
       observer(v) {
         if (v === null) {
           this.#toolbar = [...DEFAULT_TOOLS]
-        } else if (v) {
-          this.#toolbar = v.split(',').map(it => it.trim())
+        } else {
+          this.#toolbar = v
+            .split(',')
+            .filter(it => it)
+            .map(it => it.trim())
         }
       }
     },
-    value: 'str!',
     readonly: false,
     disabled: false
   }
@@ -141,7 +113,7 @@ class MEditor extends Component {
         line-height: 24px;
         border-bottom: 1px solid var(--color-grey-1);
 
-        span {
+        section {
           position: relative;
           overflow: hidden;
           display: flex;
@@ -432,7 +404,24 @@ class MEditor extends Component {
     `
   ]
 
-  #toolbar = []
+  get value() {
+    try {
+      return this.$refs.editor.value
+    } catch (err) {
+      console.log(err)
+      return ''
+    }
+  }
+
+  set value(val) {
+    if (this.$refs.editor) {
+      this.$refs.editor.value = val
+    } else {
+      nextTick(_ => (this.value = val))
+    }
+  }
+
+  #toolbar = [...DEFAULT_TOOLS]
   #value = ''
   #cache = { bar: 0, y: 0 }
   #gridx = 0
@@ -709,24 +698,24 @@ class MEditor extends Component {
   unmounted() {}
 
   render() {
-    // toolbar = [
-    //   ...(this.#toolbar.length ? this.#toolbar : DEFAULT_TOOLS),
-    //   'copy'
-    // ]
+    // console.log(this.#toolbar, this.value)
 
     return html`
       <div class="meditor">
-        <section class="toolbar"></section>
+        <header
+          class=${classMap({ toolbar: true, active: this.#toolbar.length })}
+        >
+          ${renderToolbar(this.#toolbar)}
+        </header>
         <div class="editor-outbox">
           <textarea
             ref="editor"
             class="editor"
             spellcheck="false"
-            :value=${this.value}
             :readOnly=${this.readOnly}
             :disabled=${this.disabled}
             @input=${function (ev) {
-              this.value = ev.target.value
+              // this.value = ev.target.value
             }}
           ></textarea>
           <wc-markd class="preview"></wc-markd>
diff --git a/src/meditor/svg.js b/src/meditor/svg.js
index 5e10e4f..5a1a59d 100644
--- a/src/meditor/svg.js
+++ b/src/meditor/svg.js
@@ -18,20 +18,20 @@ export default {
   code: 'M686.87 681.71c-2.86 0-5.73-0.45-8.5-1.38-8.85-2.96-15.33-10.29-16.91-19.12-1.6-8.91 2-17.92 9.4-23.53L829.48 513.1 670.76 388.8c-5.33-4.28-8.57-10.3-9.12-16.94-0.55-6.57 1.61-12.96 6.08-17.97 9.08-10.2 24.78-11.64 35.74-3.29l0.08 0.06 183.01 143.31c6 4.7 9.44 11.66 9.44 19.08 0 7.43-3.43 14.39-9.43 19.09l-182.94 143.7c-4.72 3.84-10.7 5.87-16.75 5.87zM356.91 865.09c-3.4 0-6.86-0.65-10.16-2.01-6.53-2.7-11.49-7.7-13.96-14.08-2.37-6.12-2.13-12.77 0.67-18.72l308.99-656.84c5.75-12.23 20.9-17.85 33.78-12.53 6.53 2.7 11.49 7.7 13.96 14.09 2.37 6.12 2.13 12.77-0.67 18.72L380.54 850.56c-4.28 9.09-13.75 14.53-23.63 14.53zM339 682.25c-5.93 0-11.73-1.98-16.32-5.58L137.47 531.83c-6.02-4.71-9.47-11.67-9.47-19.11 0-7.44 3.45-14.41 9.47-19.11L322.7 348.77c6.94-5.51 16.59-7.13 25.13-4.21 8.73 2.99 15.15 10.27 16.74 19.01 1.61 8.84-1.93 17.84-9.24 23.47L194.59 512.72l160.78 125.72c8.53 6.67 11.7 17.8 7.87 27.69-3.73 9.64-13.46 16.12-24.21 16.12H339z',
   quote:
     'M328.25 527.53h120.17V896H128V617.21C128 312.66 234.77 149.55 448.42 128v138.19c-80.08 25.76-120.17 99.55-120.17 221.61v39.73z m447.62 0H896V896H575.58V617.21c0-304.55 106.74-467.66 320.32-489.21v138.19c-80.05 25.76-120.13 99.55-120.13 221.61v39.72h0.1z',
-  bold: 'M573.71 758.85h-192V594.28h192c45.53 0 82.29 36.76 82.29 82.29 0 45.53-36.76 82.28-82.29 82.28m-192-493.71h164.57c45.53 0 82.29 36.75 82.29 82.29s-36.75 82.29-82.29 82.29H381.71m307.21 70.76c53.21-37.3 90.51-98.19 90.51-153.05 0-123.98-96-219.43-219.43-219.43H217.14v768h386.19c115.2 0 203.52-93.26 203.52-207.91 0.01-83.38-47.17-154.7-117.93-187.61z',
+  bold: 'M584.81777778 724.57443555H414.91000889v-145.63555556H584.81777778c40.29212445 0 72.81777778 32.52565333 72.81777777 72.81777778 0 40.29326222-32.52565333 72.81777778-72.81777777 72.81777778m-169.90776889-436.90666667h145.63555556c40.29212445 0 72.81777778 32.52565333 72.81777777 72.81777778 0 40.29326222-32.52565333 72.81777778-72.81777777 72.81777778h-145.63555556m271.85265778 62.62328889C733.85187555 462.91626666 766.86222222 409.03111111 766.86222222 360.48554666c0-109.71136-84.95445333-194.17998222-194.18112-194.17998222H269.27445333V845.93777777H611.03217778c101.94488889 0 180.10225778-82.52643555 180.10225777-183.98663111 0-73.78830222-41.74848-136.89742222-104.37176888-166.02453333z',
   image:
     'M550.34 397.58h210.87L550.34 186.71v210.87M281.96 129.2h306.72l230.04 230.04v460.08c0 42.17-34.51 76.68-76.68 76.68H281.96c-42.56 0-76.68-34.51-76.68-76.68V205.88a76.406 76.406 0 0 1 22.38-54.3 76.406 76.406 0 0 1 54.3-22.38m0 690.12h460.08V512.6L588.68 665.96 512 589.28 281.96 819.32m76.68-421.74c-42.17 0-76.68 34.51-76.68 76.68s34.51 76.68 76.68 76.68 76.68-34.51 76.68-76.68-34.51-76.68-76.68-76.68z',
   attach:
     'M821.2 466.43L501.65 785.98c-63.92 63.92-168.48 63.92-232.4 0-63.91-63.91-63.91-168.48 0-232.4l334.07-334.07c40.67-40.67 104.58-40.67 145.25 0s40.67 104.58 0 145.25L414.5 698.83c-15.97 15.97-42.13 15.97-58.1 0-15.97-15.97-15.97-42.13 0-58.1l275.97-275.97-43.57-43.57-275.98 275.96c-40.66 40.67-40.67 104.58 0 145.25s104.58 40.67 145.25 0l334.07-334.07c63.91-63.91 63.92-168.48 0-232.4s-168.49-63.91-232.4 0L225.68 510c-88.6 88.6-88.6 230.95 0 319.55s230.95 88.6 319.55 0L864.78 510l-43.58-43.57z',
   link: 'M338.96 895.99c-27.5 0-53.33-10.68-72.73-30.08L158.08 757.76c-19.4-19.4-30.08-45.24-30.08-72.74 0-27.5 10.68-53.33 30.08-72.71l135.97-135.97c12.84-12.84 33.74-12.84 46.58 0 6.22 6.22 9.65 14.5 9.65 23.3s-3.43 17.07-9.65 23.29L204.66 658.88c-14.41 14.41-14.41 37.87 0 52.29l108.15 108.15c14.41 14.42 37.87 14.42 52.31 0l216.29-216.3c6.94-6.94 10.75-16.22 10.75-26.14 0-9.92-3.82-19.21-10.75-26.15l-59.47-59.49c-6.22-6.22-9.65-14.49-9.65-23.29 0-8.8 3.43-17.07 9.65-23.29 12.84-12.84 33.74-12.84 46.58 0L628 504.14c19.38 19.36 30.06 45.19 30.06 72.73 0 27.54-10.67 53.37-30.06 72.73L411.71 865.9c-19.39 19.41-45.23 30.09-72.75 30.09zM478.8 588.96c-8.8 0-17.07-3.43-23.29-9.65l-59.49-59.48c-19.38-19.37-30.06-45.2-30.06-72.73s10.67-53.37 30.06-72.75l216.31-216.3c19.36-19.37 45.19-30.04 72.73-30.04 27.51 0 53.34 10.66 72.73 30.03L865.94 266.2c19.38 19.38 30.06 45.21 30.06 72.74 0 27.53-10.68 53.37-30.06 72.74L729.98 547.64c-6.22 6.22-14.49 9.65-23.29 9.65s-17.07-3.43-23.29-9.65c-6.22-6.22-9.65-14.49-9.65-23.29 0-8.8 3.43-17.07 9.65-23.29l135.96-135.97c6.93-6.95 10.76-16.23 10.76-26.15 0-9.92-3.82-19.21-10.76-26.15L711.2 204.64c-6.59-6.58-16.12-10.36-26.15-10.36h-0.02c-10.03 0-19.55 3.78-26.12 10.36L442.6 420.94c-6.94 6.94-10.76 16.23-10.76 26.15 0 9.92 3.82 19.2 10.76 26.14l59.49 59.49c12.84 12.85 12.84 33.74 0 46.58-6.22 6.23-14.49 9.66-23.29 9.66z',
   order:
-    'M320 215v82h576v-82M320 553h576v-82H320m0 338h576v-82H320m-192 9h85.33v16h-42.67v32h42.67v16H128v32h128V704H128v32z m0-256h76.8L128 547.2V576h128v-32h-76.8l76.8-67.2V448H128m64-128h42V192h-84v32h42',
+    'M298.667 554.667H896v-85.334H298.667m0 341.334H896v-85.334H298.667m0-426.666H896v-85.334H298.667m-213.334 256h76.8l-76.8 89.6v38.4h128v-42.666h-76.8l76.8-89.6v-38.4h-128M128 341.333h42.667V170.667H85.333v42.666H128m-42.667 512h85.334v21.334H128v42.666h42.667v21.334H85.333v42.666h128V682.667h-128v42.666z',
   italic:
-    'M391.7 128c0.67 38.67 1.33 77.33 2 116h146c-58 169.14-115.99 338.28-173.99 507.42-67.14 0.17-134.28 0.33-201.42 0.5 0.06 47.64 0.11 95.28 0.17 142.92 176.19 0.39 352.39 0.77 528.58 1.16V751.42H510.29C571.1 581.95 631.9 412.47 692.7 243h167V128h-468z',
+    'M414.91000889 163.63889777v145.63555555h107.28448L356.16995555 697.63555555H220.72888889v145.63555555h388.36110222V697.63555555H501.80551111l166.02453334-388.36110222H803.27111111v-145.63555556H414.91000889z',
   through:
     'M896 514.38v69.72H742.75c34.91 74.61 33.16 278.89-217.48 278.89-290.79 1.74-279.62-226.6-279.62-226.6l138.59 1.74c1.05 117.48 110.31 117.48 131.96 116.09 22.34-1.74 105.77-1.39 112.41-82.97 2.79-38-35.61-66.93-77.5-87.15H128v-69.72h768M770.68 371.1l-138.94-1.04s5.93-96.57-114.5-96.92c-120.44-0.7-109.96 76.69-109.96 86.45 1.4 9.77 11.87 57.88 104.73 80.88H292.42S170.59 205.85 468.01 165.75c304.06-41.82 303.36 206.04 302.67 205.35z',
 
-  list: 'M320 215v82h576v-82M320 553h576v-82H320m0 338h576v-82H320m-64-215c0 35.35-28.65 64-64 64s-64-28.65-64-64 28.65-64 64-64 64 28.65 64 64z m0 256c0 35.35-28.65 64-64 64s-64-28.65-64-64 28.65-64 64-64 64 28.65 64 64z m0-512c0 35.35-28.65 64-64 64s-64-28.65-64-64 28.65-64 64-64 64 28.65 64 64z',
+  list: 'M298.667 213.333v85.334H896v-85.334M298.667 554.667H896v-85.334H298.667m0 341.334H896v-85.334H298.667m-128-14.08c-31.574 0-56.747 25.6-56.747 56.747s25.6 56.747 56.747 56.747c31.146 0 56.746-25.6 56.746-56.747s-25.173-56.747-56.746-56.747m0-519.253c-35.414 0-64 28.587-64 64s28.586 64 64 64c35.413 0 64-28.587 64-64s-28.587-64-64-64m0 256c-35.414 0-64 28.587-64 64s28.586 64 64 64c35.413 0 64-28.587 64-64s-28.587-64-64-64z',
   line: 'M868.29 539.71H155.71c-15.28 0-27.71-12.43-27.71-27.71s12.43-27.71 27.71-27.71h712.58c15.28 0 27.71 12.43 27.71 27.71s-12.43 27.71-27.71 27.71z',
   preview:
     'M512 253.14c-174.51 0-322.97 106.97-384 258.86 61.03 151.89 209.49 258.86 384 258.86S834.97 663.89 896 512c-61.03-151.89-209.49-258.86-384-258.86z m0 431.49c-96 0-174.51-77.66-174.51-172.63S416 339.37 512 339.37 686.51 417.03 686.51 512 608 684.63 512 684.63z m0-276.17c-57.6 0-104.74 46.63-104.74 103.54S454.4 615.54 512 615.54 616.74 568.91 616.74 512 569.6 408.46 512 408.46z',