docs(site): add demos Tiny prefix (#2436)

examples/sites/demos/mobile-first/app/action-sheet/action.vue

@@ -27,12 +27,12 @@
 </template>
 
 <script>
-import { ActionSheet, Button, Modal } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {
@@ -43,10 +43,10 @@ export default {
   },
   methods: {
     selectOption(option, index) {
-      Modal.message(`选择了第${index + 1}项 [${option}]`)
+      TinyModal.message(`选择了第${index + 1}项 [${option}]`)
     },
     close() {
-      Modal.message('点击取消了')
+      TinyModal.message('点击取消了')
     }
   }
 }

examples/sites/demos/mobile-first/app/action-sheet/basic-usage.vue

@@ -10,12 +10,12 @@
 </template>
 
 <script>
-import { ActionSheet, Button } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/action-sheet/before-close.vue

@@ -10,18 +10,18 @@
 </template>
 
 <script>
-import { ActionSheet, Button, Modal } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {
       boxVisibility: false,
       beforeCloseFn() {
-        Modal.message('已拦截关闭动作!')
+        TinyModal.message('已拦截关闭动作!')
         return false
       }
     }

examples/sites/demos/mobile-first/app/action-sheet/ellipsis.vue

@@ -33,12 +33,12 @@
 </template>
 
 <script>
-import { ActionSheet, Button } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/action-sheet/fullscreen.vue

@@ -10,18 +10,18 @@
 </template>
 
 <script>
-import { ActionSheet, Button, Modal } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {
       boxVisibility: false,
       beforeCloseFn() {
-        Modal.message('已拦截关闭动作!')
+        TinyModal.message('已拦截关闭动作!')
         return false
       }
     }

examples/sites/demos/mobile-first/app/action-sheet/mask-event.vue

@@ -11,12 +11,12 @@
 </template>
 
 <script>
-import { ActionSheet, Button } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/action-sheet/mask.vue

@@ -11,12 +11,12 @@
 </template>
 
 <script>
-import { ActionSheet, Button } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/action-sheet/multiple.vue

@@ -32,12 +32,12 @@
 </template>
 
 <script>
-import { ActionSheet, Button } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     const list = [

examples/sites/demos/mobile-first/app/action-sheet/show.vue

@@ -35,12 +35,12 @@
 </template>
 
 <script>
-import { ActionSheet, Button } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/action-sheet/slot.vue

@@ -65,12 +65,12 @@
 </template>
 
 <script>
-import { ActionSheet, Button } from '@opentiny/vue'
+import { TinyActionSheet, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyActionSheet: ActionSheet,
-    TinyButton: Button
+    TinyActionSheet,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/alert/base.vue

@@ -14,11 +14,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/center.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/closable.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/close-text.vue

@@ -6,15 +6,15 @@
 </template>
 
 <script>
-import { Alert, Modal } from '@opentiny/vue'
+import { TinyAlert, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   },
   methods: {
     close() {
-      Modal('关闭了')
+      TinyModal('关闭了')
     }
   }
 }

examples/sites/demos/mobile-first/app/alert/close.vue

@@ -3,15 +3,15 @@
 </template>
 
 <script>
-import { Alert, Modal } from '@opentiny/vue'
+import { TinyAlert, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   },
   methods: {
     close() {
-      Modal.message('关闭了')
+      TinyModal.message('关闭了')
     }
   }
 }

examples/sites/demos/mobile-first/app/alert/custom-class.vue

@@ -5,11 +5,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/custom-description.vue

@@ -9,11 +9,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/custom-icon.vue

@@ -5,12 +5,12 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 import { iconBoat } from '@opentiny/vue-icon'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/alert/feedback-of-result.vue

@@ -15,12 +15,12 @@
 </template>
 
 <script>
-import { Alert, Button } from '@opentiny/vue'
+import { TinyAlert, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert,
-    TinyButton: Button
+    TinyAlert,
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/icon.vue

@@ -9,12 +9,12 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 import { IconBoat } from '@opentiny/vue-icon'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/alert/show-foldable.vue

@@ -32,12 +32,12 @@
 </template>
 
 <script>
-import { Alert, Link } from '@opentiny/vue'
+import { TinyAlert, TinyLink } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert,
-    TinyLink: Link
+    TinyAlert,
+    TinyLink
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/alert/show-icon.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/size.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/slot-default.vue

@@ -38,12 +38,12 @@
 </template>
 
 <script>
-import { Alert, Button } from '@opentiny/vue'
+import { TinyAlert, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert,
-    TinyButton: Button
+    TinyAlert,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/alert/title.vue

@@ -9,11 +9,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/alert/type.vue

@@ -14,11 +14,11 @@
 </template>
 
 <script>
-import { Alert } from '@opentiny/vue'
+import { TinyAlert } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAlert: Alert
+    TinyAlert
   }
 }
 </script>

examples/sites/demos/mobile-first/app/amount/amount-disable.vue

@@ -6,12 +6,12 @@
 </template>
 
 <script>
-import { Amount, Button } from '@opentiny/vue'
+import { TinyAmount, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount,
-    TinyButton: Button
+    TinyAmount,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/basic-usage.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/custom-currency.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/custom-service.vue

@@ -8,11 +8,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/date-allow-empty.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount, Modal } from '@opentiny/vue'
+import { TinyAmount, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {
@@ -17,7 +17,7 @@ export default {
   },
   methods: {
     change(val) {
-      Modal.message({
+      TinyModal.message({
         message: `改变后的值：${JSON.stringify(val)}`,
         status: 'info'
       })

examples/sites/demos/mobile-first/app/amount/digits-maxlen.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount, Modal } from '@opentiny/vue'
+import { TinyAmount, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {
@@ -16,7 +16,7 @@ export default {
   },
   methods: {
     handleChange(value) {
-      Modal.message({ message: `当前值为 ${value.amount}`, status: 'info' })
+      TinyModal.message({ message: `当前值为 ${value.amount}`, status: 'info' })
     }
   }
 }

examples/sites/demos/mobile-first/app/amount/display-only.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/filter-box.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/filter-event.vue

@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import { Amount, Modal } from '@opentiny/vue'
+import { TinyAmount, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {
@@ -24,10 +24,10 @@ export default {
   },
   methods: {
     clearHander() {
-      Modal.message({ message: '清除 事件', status: 'info' })
+      TinyModal.message({ message: '清除 事件', status: 'info' })
     },
     changeHander(label) {
-      Modal.message({ message: 'change 事件' + label, status: 'info' })
+      TinyModal.message({ message: 'change 事件' + label, status: 'info' })
     }
   }
 }

examples/sites/demos/mobile-first/app/amount/filter.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/format.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/hide-currency.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/hide-icon.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/hold-zero.vue

@@ -10,11 +10,11 @@
 </template>
 
 <script>
-import { Amount, Modal } from '@opentiny/vue'
+import { TinyAmount, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {
@@ -23,7 +23,7 @@ export default {
   },
   methods: {
     handleChange(value) {
-      Modal.message({ message: `当前值为 ${value.amount}`, status: 'info' })
+      TinyModal.message({ message: `当前值为 ${value.amount}`, status: 'info' })
     }
   }
 }

examples/sites/demos/mobile-first/app/amount/negative.vue

@@ -12,13 +12,13 @@
 </template>
 
 <script>
-import { Amount, Form, FormItem } from '@opentiny/vue'
+import { TinyAmount, TinyForm, TinyFormItem } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount,
-    TinyForm: Form,
-    TinyFormItem: FormItem
+    TinyAmount,
+    TinyForm,
+    TinyFormItem
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/num-allow-empty.vue

@@ -13,11 +13,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/pop-up.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/set-date.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount, Modal } from '@opentiny/vue'
+import { TinyAmount, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {
@@ -17,7 +17,7 @@ export default {
   },
   methods: {
     change(val) {
-      Modal.message({
+      TinyModal.message({
         message: `改变后的值：${JSON.stringify(val)}`,
         status: 'info'
       })

examples/sites/demos/mobile-first/app/amount/size.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/amount/string-mode.vue

@@ -19,11 +19,11 @@
 </template>
 
 <script>
-import { Amount } from '@opentiny/vue'
+import { TinyAmount } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAmount: Amount
+    TinyAmount
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/anchor/basic-usage.vue

@@ -9,12 +9,12 @@
 </template>
 
 <script>
-import { Anchor, Switch } from '@opentiny/vue'
+import { TinyAnchor, TinySwitch } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAnchor: Anchor,
-    TinySwitch: Switch
+    TinyAnchor,
+    TinySwitch
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/anchor/change.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Anchor, Modal } from '@opentiny/vue'
+import { TinyAnchor, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAnchor: Anchor
+    TinyAnchor
   },
   data() {
     return {
@@ -49,7 +49,7 @@ export default {
   },
   methods: {
     handleChange(link) {
-      Modal.message({ message: `change${link}`, status: 'info' })
+      TinyModal.message({ message: `change${link}`, status: 'info' })
     }
   }
 }

examples/sites/demos/mobile-first/app/anchor/is-affix.vue

@@ -9,12 +9,12 @@
 </template>
 
 <script>
-import { Anchor, Switch } from '@opentiny/vue'
+import { TinyAnchor, TinySwitch } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAnchor: Anchor,
-    TinySwitch: Switch
+    TinyAnchor,
+    TinySwitch
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/anchor/set-container.vue

@@ -21,13 +21,13 @@
 </template>
 
 <script>
-import { Anchor, Row, Col } from '@opentiny/vue'
+import { TinyAnchor, TinyRow, TinyCol } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyAnchor: Anchor,
-    TinyRow: Row,
-    TinyCol: Col
+    TinyAnchor,
+    TinyRow,
+    TinyCol
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/badge/base.vue

@@ -40,16 +40,16 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
-import { UserHead } from '@opentiny/vue'
-import { UserContact } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
+import { TinyUserHead } from '@opentiny/vue'
+import { TinyUserContact } from '@opentiny/vue'
 import { IconSmile } from '@opentiny/vue-icon'
 
 export default {
   components: {
-    TinyBadge: Badge,
-    TinyUserHead: UserHead,
-    TinyUserContact: UserContact
+    TinyBadge,
+    TinyUserHead,
+    TinyUserContact
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/badge/dynamic-hidden.vue

@@ -7,12 +7,12 @@
 </template>
 
 <script>
-import { Badge, Button } from '@opentiny/vue'
+import { TinyBadge, TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge,
-    TinyButton: Button
+    TinyBadge,
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/badge/is-dot.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge
+    TinyBadge
   }
 }
 </script>

examples/sites/demos/mobile-first/app/badge/max.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge
+    TinyBadge
   }
 }
 </script>

examples/sites/demos/mobile-first/app/badge/props-content.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge
+    TinyBadge
   }
 }
 </script>

examples/sites/demos/mobile-first/app/badge/slot-content.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge
+    TinyBadge
   }
 }
 </script>

examples/sites/demos/mobile-first/app/badge/slot-default.vue

@@ -7,11 +7,11 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge
+    TinyBadge
   }
 }
 </script>

examples/sites/demos/mobile-first/app/badge/target.vue

@@ -7,11 +7,11 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge
+    TinyBadge
   }
 }
 </script>

examples/sites/demos/mobile-first/app/badge/type-left.vue

@@ -13,11 +13,11 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge
+    TinyBadge
   }
 }
 </script>

examples/sites/demos/mobile-first/app/badge/type.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { Badge } from '@opentiny/vue'
+import { TinyBadge } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyBadge: Badge
+    TinyBadge
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button-group/base.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { ButtonGroup } from '@opentiny/vue'
+import { TinyButtonGroup } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButtonGroup: ButtonGroup
+    TinyButtonGroup
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button-group/data.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { ButtonGroup } from '@opentiny/vue'
+import { TinyButtonGroup } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButtonGroup: ButtonGroup
+    TinyButtonGroup
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button-group/disabled.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { ButtonGroup } from '@opentiny/vue'
+import { TinyButtonGroup } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButtonGroup: ButtonGroup
+    TinyButtonGroup
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button-group/plain.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { ButtonGroup } from '@opentiny/vue'
+import { TinyButtonGroup } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButtonGroup: ButtonGroup
+    TinyButtonGroup
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button-group/size.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { ButtonGroup } from '@opentiny/vue'
+import { TinyButtonGroup } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButtonGroup: ButtonGroup
+    TinyButtonGroup
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button-group/slot-default.vue

@@ -7,12 +7,12 @@
 </template>
 
 <script>
-import { Button, ButtonGroup } from '@opentiny/vue'
+import { TinyButton, TinyButtonGroup } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button,
-    TinyButtonGroup: ButtonGroup
+    TinyButton,
+    TinyButtonGroup
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button-group/text-value-field.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { ButtonGroup } from '@opentiny/vue'
+import { TinyButtonGroup } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButtonGroup: ButtonGroup
+    TinyButtonGroup
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button/autofocus.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/banner.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/basic-usage.vue

@@ -20,14 +20,14 @@
 </template>
 
 <script>
-import { Button, Layout, Row } from '@opentiny/vue'
+import { TinyButton, TinyLayout, TinyRow } from '@opentiny/vue'
 import { IconDel, IconYes, IconEdit, IconMail, IconStarO, IconSearch } from '@opentiny/vue-icon'
 
 export default {
   components: {
-    TinyButton: Button,
-    TinyLayout: Layout,
-    TinyRow: Row
+    TinyButton,
+    TinyLayout,
+    TinyRow
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button/button-class.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/circle.vue

@@ -20,14 +20,14 @@
 </template>
 
 <script>
-import { Button, Layout, Row } from '@opentiny/vue'
+import { TinyButton, TinyLayout, TinyRow } from '@opentiny/vue'
 import { IconDel, IconYes, IconEdit, IconMail, IconStarO, IconSearch } from '@opentiny/vue-icon'
 
 export default {
   components: {
-    TinyButton: Button,
-    TinyLayout: Layout,
-    TinyRow: Row
+    TinyButton,
+    TinyLayout,
+    TinyRow
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button/click.vue

@@ -3,15 +3,15 @@
 </template>
 
 <script>
-import { Button, Modal } from '@opentiny/vue'
+import { TinyButton, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   },
   methods: {
     click() {
-      Modal.message('click')
+      TinyModal.message('click')
     }
   }
 }

examples/sites/demos/mobile-first/app/button/dynamic-disabled.vue

@@ -17,13 +17,13 @@
 </template>
 
 <script>
-import { Button, Layout, Row } from '@opentiny/vue'
+import { TinyButton, TinyLayout, TinyRow } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button,
-    TinyLayout: Layout,
-    TinyRow: Row
+    TinyButton,
+    TinyLayout,
+    TinyRow
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button/icon.vue

@@ -10,12 +10,12 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 import { IconDel, IconYes, IconEdit, IconMail, IconStarO, IconSearch } from '@opentiny/vue-icon'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button/image.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button/link.vue

@@ -5,11 +5,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/loading.vue

@@ -10,11 +10,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/plain.vue

@@ -10,11 +10,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/reset-time.vue

@@ -7,11 +7,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/round.vue

@@ -10,11 +10,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/size.vue

@@ -8,11 +8,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/slot-default.vue

@@ -13,13 +13,13 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 import { IconUpload } from '@opentiny/vue-icon'
 
 export default {
   components: {
     IconUpload: IconUpload(),
-    TinyButton: Button
+    TinyButton
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/button/text.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/button/type.vue

@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import { Button } from '@opentiny/vue'
+import { TinyButton } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyButton: Button
+    TinyButton
   }
 }
 </script>

examples/sites/demos/mobile-first/app/calendar-bar/basic-usage.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar } from '@opentiny/vue'
+import { TinyCalendarBar } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-bar/cascader-position.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar } from '@opentiny/vue'
+import { TinyCalendarBar } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-bar/disabled.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar } from '@opentiny/vue'
+import { TinyCalendarBar } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-bar/expand.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar, Modal } from '@opentiny/vue'
+import { TinyCalendarBar, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {
@@ -17,9 +17,9 @@ export default {
   methods: {
     expand(expanded) {
       if (expanded) {
-        Modal.message('处于展开状态')
+        TinyModal.message('处于展开状态')
       } else {
-        Modal.message('处于收起状态')
+        TinyModal.message('处于收起状态')
       }
     }
   }

examples/sites/demos/mobile-first/app/calendar-bar/marked.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar } from '@opentiny/vue'
+import { TinyCalendarBar } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-bar/render-current.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar } from '@opentiny/vue'
+import { TinyCalendarBar } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-bar/render-today.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar } from '@opentiny/vue'
+import { TinyCalendarBar } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-bar/week-first.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar } from '@opentiny/vue'
+import { TinyCalendarBar } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-bar/workday.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarBar } from '@opentiny/vue'
+import { TinyCalendarBar } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarBar: CalendarBar
+    TinyCalendarBar
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-view/basic-usage.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarView } from '@opentiny/vue'
+import { TinyCalendarView } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarView: CalendarView
+    TinyCalendarView
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-view/calendar-day-mark.vue

@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import { CalendarView } from '@opentiny/vue'
+import { TinyCalendarView } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarView: CalendarView
+    TinyCalendarView
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-view/calendar-disabled-day.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import { CalendarView } from '@opentiny/vue'
+import { TinyCalendarView } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarView: CalendarView
+    TinyCalendarView
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-view/calendar-event.vue

@@ -13,11 +13,11 @@
 </template>
 
 <script>
-import { CalendarView, Modal } from '@opentiny/vue'
+import { TinyCalendarView, TinyModal } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarView: CalendarView
+    TinyCalendarView
   },
   data() {
     return {
@@ -26,19 +26,19 @@ export default {
   },
   methods: {
     prevWeekClick(date) {
-      Modal.message({ message: `上一周按钮点击事件： ${date[0].value}`, status: 'info' })
+      TinyModal.message({ message: `上一周按钮点击事件： ${date[0].value}`, status: 'info' })
     },
     nextWeekClick(date) {
-      Modal.message({ message: `下一周按钮点击事件： ${date[0].value}`, status: 'info' })
+      TinyModal.message({ message: `下一周按钮点击事件： ${date[0].value}`, status: 'info' })
     },
     weekChange(weekDate) {
-      Modal.message({ message: `周改变事件： ${weekDate[0].value}`, status: 'info' })
+      TinyModal.message({ message: `周改变事件： ${weekDate[0].value}`, status: 'info' })
     },
     yearChange(newVal, oldVal) {
-      Modal.message({ message: `年改变事件: ${newVal}年, ${oldVal}年`, status: 'info' })
+      TinyModal.message({ message: `年改变事件: ${newVal}年, ${oldVal}年`, status: 'info' })
     },
     monthChange(newVal, oldVal) {
-      Modal.message({ message: `月改变事件: ${newVal}月, ${oldVal}月`, status: 'info' })
+      TinyModal.message({ message: `月改变事件: ${newVal}月, ${oldVal}月`, status: 'info' })
     }
   }
 }

examples/sites/demos/mobile-first/app/calendar-view/calendar-mode.vue

@@ -4,11 +4,11 @@
 </template>
 
 <script>
-import { CalendarView } from '@opentiny/vue'
+import { TinyCalendarView } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarView: CalendarView
+    TinyCalendarView
   },
   data() {
     return {

examples/sites/demos/mobile-first/app/calendar-view/calendar-schedule-slot.vue

@@ -24,11 +24,11 @@
 </template>
 
 <script>
-import { CalendarView } from '@opentiny/vue'
+import { TinyCalendarView } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyCalendarView: CalendarView
+    TinyCalendarView
   },
   data() {
     return {