优化样式

src/form/button.wc

@@ -39,8 +39,7 @@
   }
 
   .icon {
-    width: 18px;
+    --size: 18px;
-    height: 18px;
     margin-right: 3px;
   }
 }
@@ -65,8 +64,7 @@
     font-size: 16px;
   }
   .icon {
-    width: 20px;
+    --size: 20px;
-    height: 20px;
   }
 }
 :host([size='large'][circle]) {
@@ -78,11 +76,6 @@
   button {
     min-width: 90px;
     height: 36px;
-    font-size: 14px;
-  }
-  .icon {
-    width: 18px;
-    height: 18px;
   }
 }
 :host([size='medium'][circle]) {
@@ -97,8 +90,7 @@
     font-size: 12px;
   }
   .icon {
-    width: 14px;
+    --size: 14px;
-    height: 14px;
   }
 }
 

src/form/checkbox.wc

@@ -8,6 +8,7 @@
 <style lang="scss">
 :host {
   display: inline-block;
+  line-height: 1;
   font-size: 14px;
 
   label {
@@ -36,31 +37,29 @@
 }
 
 :host([size='large']) {
+  font-size: 16px;
   label {
-    width: 58px;
+    height: 42px;
-    height: 32px;
-  }
-  .dot {
-    --size: 26px;
-  }
-}
-:host([size='medium']) {
-  label {
-    width: 50px;
-    height: 28px;
   }
   .dot {
     --size: 22px;
   }
 }
-:host([size='mini']) {
+:host([size='medium']) {
   label {
-    width: 22px;
+    height: 38px;
-    height: 14px;
-    padding: 2px;
   }
   .dot {
-    --size: 10px;
+    --size: 20px;
+  }
+}
+:host([size='mini']) {
+  font-size: 12px;
+  label {
+    height: 20px;
+  }
+  .dot {
+    --size: 14px;
   }
 }
 
@@ -157,8 +156,12 @@ export default class Checkbox {
   }
 
   set value(val) {
-    this.props.value = val
+    if (Array.isArray(val)) {
-    this.checked = this.props.value.includes(this.props.label)
+      this.props.value = val
+      this.checked = this.props.value.includes(this.props.label)
+    } else {
+      throw TypeError(':duplex指令需要传入一个数组, 当前为: ' + typeof val)
+    }
   }
 
   get checked() {

src/form/radio.wc

@@ -8,6 +8,7 @@
 <style lang="scss">
 :host {
   display: inline-block;
+  line-height: 1;
   font-size: 14px;
 
   label {

src/icon/index.wc

@@ -11,6 +11,7 @@
   display: none;
 }
 .icon {
+  display: block;
   width: var(--size, 32px);
   height: var(--size, 32px);
   fill: currentColor;