refactor: reorganize all components (#8303)

src/address-list/AddressList.tsx

@@ -1,4 +1,4 @@
-import { PropType } from 'vue';
+import { PropType, defineComponent } from 'vue';
 
 // Utils
 import { createNamespace } from '../utils';
@@ -6,22 +6,24 @@ import { createNamespace } from '../utils';
 // Components
 import Button from '../button';
 import RadioGroup from '../radio-group';
-import AddressItem, { AddressListItem } from './Item';
+import AddressListItem, { AddressListAddress } from './AddressListItem';
 
-const [createComponent, bem, t] = createNamespace('address-list');
+const [name, bem, t] = createNamespace('address-list');
+
+export default defineComponent({
+  name,
 
-export default createComponent({
   props: {
     modelValue: [Number, String],
     disabledText: String,
     addButtonText: String,
     defaultTagText: String,
     list: {
-      type: Array as PropType<AddressListItem[]>,
+      type: Array as PropType<AddressListAddress[]>,
       default: () => [],
     },
     disabledList: {
-      type: Array as PropType<AddressListItem[]>,
+      type: Array as PropType<AddressListAddress[]>,
       default: () => [],
     },
     switchable: {
@@ -42,7 +44,7 @@ export default createComponent({
 
   setup(props, { slots, emit }) {
     const renderItem = (
-      item: AddressListItem,
+      item: AddressListAddress,
       index: number,
       disabled?: boolean
     ) => {
@@ -63,7 +65,7 @@ export default createComponent({
       };
 
       return (
-        <AddressItem
+        <AddressListItem
           v-slots={{
             bottom: slots['item-bottom'],
           }}
@@ -79,7 +81,7 @@ export default createComponent({
       );
     };
 
-    const renderList = (list: AddressListItem[], disabled?: boolean) => {
+    const renderList = (list: AddressListAddress[], disabled?: boolean) => {
       if (list) {
         return list.map((item, index) => renderItem(item, index, disabled));
       }

src/address-list/AddressListItem.tsx

@@ -1,4 +1,4 @@
-import { PropType } from 'vue';
+import { PropType, defineComponent } from 'vue';
 
 // Utils
 import { createNamespace } from '../utils';
@@ -9,9 +9,9 @@ import Icon from '../icon';
 import Cell from '../cell';
 import Radio from '../radio';
 
-const [createComponent, bem] = createNamespace('address-item');
+const [name, bem] = createNamespace('address-item');
 
-export type AddressListItem = {
+export type AddressListAddress = {
   id: number | string;
   tel: number | string;
   name: string;
@@ -19,13 +19,15 @@ export type AddressListItem = {
   isDefault?: boolean;
 };
 
-export default createComponent({
+export default defineComponent({
+  name,
+
   props: {
     disabled: Boolean,
     switchable: Boolean,
     defaultTagText: String,
     address: {
-      type: Object as PropType<AddressListItem>,
+      type: Object as PropType<AddressListAddress>,
       required: true,
     },
   },

src/address-list/index.ts

@@ -0,0 +1,7 @@
+import { installable } from '../utils';
+import _AddressList from './AddressList';
+
+const AddressList = installable(_AddressList);
+
+export default AddressList;
+export { AddressList };