Merge branch 'v4' of https://github.com/jdf2e/nutui into v4

jd/generate-nutui-taro-vue.cjs

@@ -31,7 +31,7 @@ let installFunction = `function install(app: any) {
 let fileStrBuild = `${importStr}
 ${installFunction}
 const version = '${packageConfig.version}';
-export { install, version, Locale };
+export { install, version, Locale, ${packages.join(',')} };
 export default { install, version, Locale};`;
 
 fs.outputFile(path.resolve(__dirname, '../src/packages/nutui.taro.vue.build.ts'), fileStrBuild, 'utf8', (error) => {

jd/generate-style-deps.cjs

@@ -13,7 +13,7 @@ config.nav.forEach((item) => {
   });
 });
 styleMap.forEach((value) => {
-  if (value.chilren?.length !== 0) {
+  if (value.children && value.children.length > 0) {
     value.children.forEach((item, index) => {
       value.children[index] = styleMap.get(item);
     });

jd/generate-types-taro.cjs

@@ -6,6 +6,10 @@ const sourceDir = path.resolve(__dirname, './../tsc/type/src/packages') // 拷
 
 const toDir = path.resolve(__dirname, './../dist/types'); // ./../dist
 
+if(fs.existsSync(toDir)) {
+  fs.rmdirSync(toDir); //先删除文件夹
+}
+
 const basePath = path.join(toDir, '__VUE');
 
 const fileList = [];

jd/generate-types.cjs

@@ -6,6 +6,10 @@ const sourceDir = path.resolve(__dirname, './../tsc/type/src/packages'); // 拷
 
 const toDir = path.resolve(__dirname, './../dist/types'); // ./../dist
 
+if(fs.existsSync(toDir)) {
+  fs.rmdirSync(toDir); //先删除文件夹
+}
+
 const basePath = path.join(toDir, '__VUE');
 
 const fileList = [];

package.json

@@ -41,16 +41,16 @@
   "scripts": {
     "checked": "npm run generate:file && tsc",
     "checked:taro:vue": "npm run generate:file:taro:vue",
-    "dev": "npm run checked && vite --open --force",
-    "dev:taro:weapp": "npm run createTaroConfig && npm run checked:taro:vue && cd src/sites/mobile-taro/vue/ && npm run dev:weapp",
-    "dev:taro:alipay": "npm run createTaroConfig && npm run checked:taro:vue && cd src/sites/mobile-taro/vue/ && npm run dev:alipay",
-    "dev:taro:jd": "npm run createTaroConfig && npm run checked:taro:vue && cd src/sites/mobile-taro/vue/ && npm run dev:jd",
-    "dev:taro:h5": "npm run createTaroConfig && npm run checked:taro:vue && cd src/sites/mobile-taro/vue/ && npm run dev:h5",
+    "dev": "npm run checked && npm run dts && vite --open --force",
+    "dev:taro:weapp": "npm run createTaroConfig && npm run checked:taro:vue && npm run dts && cd src/sites/mobile-taro/vue/ && npm run dev:weapp",
+    "dev:taro:alipay": "npm run createTaroConfig && npm run checked:taro:vue && npm run dts && cd src/sites/mobile-taro/vue/ && npm run dev:alipay",
+    "dev:taro:jd": "npm run createTaroConfig && npm run checked:taro:vue && npm run dts && cd src/sites/mobile-taro/vue/ && npm run dev:jd",
+    "dev:taro:h5": "npm run createTaroConfig && npm run checked:taro:vue && npm run dts && cd src/sites/mobile-taro/vue/ && npm run dev:h5",
     "build:site": "npm run checked && vite build",
     "build:site-jdt": "npm run checked && vite build --config vite.config.jdt.ts ",
     "build:site:oss": "npm run checked && vite build --base=/nutui/4x/",
-    "build": "npm run checked && vite build --config vite.config.build.ts && vite build --config vite.config.build.disperse.ts && npm run generate:themes && vite build --config vite.config.build.css.ts && vite build --config vite.config.build.locale.ts && npm run dts && npm run attrs",
-    "build:taro:vue": "npm run checked:taro:vue && vite build --config vite.config.build.taro.vue.ts && vite build --config vite.config.build.taro.vue.disperse.ts && npm run generate:themes && vite build --config vite.config.build.css.ts && vite build --config vite.config.build.locale.ts && npm run dts:taro && npm run attrs",
+    "build": "npm run checked && vite build --config vite.config.build.ts && vite build --config vite.config.build.disperse.ts && npm run generate:themes && vite build --config vite.config.build.css.ts && vite build --config vite.config.build.locale.ts && npm run dts && npm run attrs && npm run generate:style:deps",
+    "build:taro:vue": "npm run checked:taro:vue && vite build --config vite.config.build.taro.vue.ts && vite build --config vite.config.build.taro.vue.disperse.ts && npm run generate:themes && vite build --config vite.config.build.css.ts && vite build --config vite.config.build.locale.ts && npm run dts:taro && npm run attrs&& npm run generate:style:deps",
     "serve": "vite preview",
     "upload": "yarn build:site:oss && node ./jd/upload.js",
     "add": "node jd/createComponentMode.js",
@@ -61,6 +61,7 @@
     "generate:types": "node jd/generate-types.cjs",
     "generate:types:taro": "node jd/generate-types-taro.cjs",
     "generate:themes": "node jd/generate-themes.cjs",
+    "generate:style:deps": "node jd/generate-style-deps.cjs",
     "prepare": "husky install",
     "test": "jest",
     "release": "standard-version -a",

src/config.json

@@ -341,7 +341,7 @@
           "exportEmptyTaro": true,
           "desc": "标签栏子组件",
           "author": "Drjingfubo",
-          "styleDeps": []
+          "styleDeps": ["Badge"]
         },
         {
           "version": "3.0.0",
@@ -1202,7 +1202,8 @@
           "show": true,
           "tarodoc": false,
           "type": "component",
-          "author": "yangxiaolu"
+          "author": "yangxiaolu",
+          "styleDeps": ["Popover"]
         }
       ]
     },
@@ -1364,7 +1365,7 @@
           "tarodoc": false,
           "type": "component",
           "author": "yangxiaolu",
-          "styleDeps": []
+          "styleDeps": ["Rate"]
         },
         {
           "version": "3.0.0",

src/packages/__VUE/address/index.taro.vue

@@ -315,8 +315,6 @@ export default create({
 
     // 手动关闭 点击叉号(cross)，或者蒙层(mask)
     const handClose = (type = 'self') => {
-      if (!props.closeBtnIcon) return;
-
       closeWay.value = type == 'cross' ? 'cross' : 'self';
 
       showPopup.value = false;

src/packages/__VUE/address/index.vue

@@ -123,11 +123,21 @@ import { reactive, ref, toRefs, watch, nextTick, computed, Ref, h, PropType } fr
 import { createComponent } from '@/packages/utils/create';
 import { RegionData, CustomRegionData, existRegionData } from './type';
 import { popupProps } from '../popup/props';
+import Popup from '../popup/index.vue';
+import Elevator from '../elevator/index.vue';
 const { componentName, create, translate } = createComponent('address');
 import { Location, Location2, Check, Close, Left } from '@nutui/icons-vue';
 
 export default create({
-  components: { Location, Location2, Check, Close, Left },
+  components: {
+    Location,
+    Location2,
+    Check,
+    Close,
+    Left,
+    [Popup.name]: Popup,
+    [Elevator.name]: Elevator
+  },
   inheritAttrs: false,
   props: {
     ...popupProps,

src/packages/__VUE/audio/index.vue

@@ -63,6 +63,7 @@
 import { toRefs, ref, onMounted, reactive, watch, provide } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 import { Service } from '@nutui/icons-vue';
+import Range from '../range/index.vue';
 const { componentName, create } = createComponent('audio');
 
 export default create({
@@ -106,7 +107,8 @@ export default create({
     }
   },
   components: {
-    Service
+    Service,
+    [Range.name]: Range
   },
   emits: ['fastBack', 'play', 'forward', 'ended', 'changeProgress', 'mute', 'can-play'],
 

src/packages/__VUE/button/index.taro.vue

@@ -14,6 +14,7 @@
 import { PropType, CSSProperties, toRefs, computed } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 import { Loading } from '@nutui/icons-vue-taro';
+// import { ButtonShape, ButtonType, ButtonSize } from './type';
 const { componentName, create } = createComponent('button');
 export default create({
   components: { Loading },

src/packages/__VUE/button/index.vue

@@ -13,14 +13,15 @@
 <script lang="ts">
 import { PropType, CSSProperties, toRefs, computed } from 'vue';
 import { createComponent } from '@/packages/utils/create';
+import { ButtonShape, ButtonType, ButtonSize } from './type';
 import { Loading } from '@nutui/icons-vue';
 const { componentName, create } = createComponent('button');
 export default create({
   components: { Loading },
   props: {
     color: String,
     shape: {
-      type: String as PropType<import('./type').ButtonShape>,
+      type: String as PropType<ButtonShape>,
       default: 'round'
     },
     plain: {
@@ -36,11 +37,11 @@ export default create({
       default: false
     },
     type: {
-      type: String as PropType<import('./type').ButtonType>,
+      type: String as PropType<ButtonType>,
       default: 'default'
     },
     size: {
-      type: String as PropType<import('./type').ButtonSize>,
+      type: String as PropType<ButtonSize>,
       default: 'normal'
     },
     block: {

src/packages/__VUE/checkbox/__tests__/__snapshots__/checkbox.spec.ts.snap

@@ -1,8 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`basic usage 1`] = `
-"<view class=\\"nut-checkbox \\">
-  <!---->
+"<view class=\\"nut-checkbox \\"><svg class=\\"nut-checkbox__icon nut-icon\\" xmlns=\\"http://www.w3.org/2000/svg\\" color=\\"\\" viewBox=\\"0 0 1024 1024\\" aria-labelledby=\\"\\" role=\\"presentation\\">
+    <path d=\\"M512 0C230.4 0 0 230.4 0 512s230.4 512 512 512 512-230.4 512-512S793.6 0 512 0zm281.6 369.778C779.378 381.156 600.178 500.622 472.178 691.2c0 0 0 2.844-2.845 2.844-8.533 5.69-48.355 36.978-88.177-8.533-39.823-51.2-62.578-99.555-142.223-142.222-2.844 0-2.844-2.845-2.844-2.845-8.533-11.377-39.822-56.888 19.911-56.888 45.511 0 91.022 11.377 162.133 73.955 5.69 5.689 14.223 5.689 17.067 0C469.333 517.69 608.711 366.933 768 318.578c0 0 19.911-2.845 31.289 14.222 5.689 11.378 11.378 22.756-5.689 36.978z\\" fill=\\"currentColor\\" fill-opacity=\\"0.9\\"></path>
+  </svg>
   <view class=\\"nut-checkbox__label \\"></view>
 </view>"
 `;

src/packages/__VUE/checkbox/__tests__/checkbox.spec.ts

@@ -83,56 +83,8 @@ test('checkbox icon-size test', () => {
   });
 
   const items = wrapper.findAll('.nut-checkbox');
-  expect((items[0].findAll('i') as any)[0].element.style.fontSize).toEqual('25px');
-  expect((items[1].findAll('i') as any)[0].element.style.fontSize).toEqual('10px');
-});
-
-test('checkbox icon-name test', () => {
-  const wrapper = mount({
-    components: {
-      'nut-checkbox': Checkbox
-    },
-    template: `
-      <template>
-        <nut-checkbox v-model="checkbox5"  icon-name="checklist" icon-active-name="checklist">自定义图标</nut-checkbox>
-        <nut-checkbox v-model="checkbox6">auxiliary</nut-checkbox>
-      </template>
-    `,
-    setup() {
-      const state = reactive({
-        checkbox5: true,
-        checkbox6: true
-      });
-      return { ...toRefs(state) };
-    }
-  });
-
-  const items = wrapper.findAll('.nut-checkbox');
-  expect((items[0].findAll('i') as any)[0].classes()).toContain('nut-icon-checklist');
-});
-
-test('checkbox label test', () => {
-  const wrapper = mount({
-    components: {
-      'nut-checkbox': Checkbox
-    },
-    template: `
-      <template>
-        <nut-checkbox v-model="checkbox5" label="testlabel"></nut-checkbox>
-        <nut-checkbox v-model="checkbox6">auxiliary</nut-checkbox>
-      </template>
-    `,
-    setup() {
-      const state = reactive({
-        checkbox5: true,
-        checkbox6: true
-      });
-      return { ...toRefs(state) };
-    }
-  });
-
-  const items = wrapper.findAll('.nut-checkbox');
-  expect((items[0].findAll('i') as any)[0].find('testlabel')).toBeTruthy();
+  expect((items[0].findAll('svg') as any)[0].element.style.width).toEqual('25px');
+  expect((items[1].findAll('svg') as any)[0].element.style.height).toEqual('10px');
 });
 
 test('should emit "update:modelValue" event when checkbox is clicked', async () => {

src/packages/__VUE/checkbox/common.ts

@@ -1,10 +1,9 @@
-import { h, computed, inject, getCurrentInstance, onMounted, reactive, watch } from 'vue';
+import { h, computed, inject, getCurrentInstance, onMounted, reactive, watch, Component } from 'vue';
+import { pxCheck } from '@/packages/utils/pxCheck';
 
-export const component = (componentName: string, nutIcon: object) => {
+export const component = (componentName: string, components: Record<string, Component>): any => {
   return {
-    components: {
-      nutIcon
-    },
+    components: components,
     props: {
       modelValue: {
         type: Boolean,
@@ -22,30 +21,10 @@ export const component = (componentName: string, nutIcon: object) => {
         type: [String, Number],
         default: ''
       },
-      iconName: {
-        type: String,
-        default: 'check-normal'
-      },
-      iconActiveName: {
-        type: String,
-        default: 'checked'
-      },
-      iconIndeterminateName: {
-        type: String,
-        default: 'check-disabled'
-      },
       label: {
         type: String,
         default: ''
       },
-      iconClassPrefix: {
-        type: String,
-        default: 'nut-icon'
-      },
-      iconFontClassName: {
-        type: String,
-        default: 'nutui-iconfont'
-      },
       indeterminate: {
         type: Boolean,
         default: false
@@ -104,13 +83,23 @@ export const component = (componentName: string, nutIcon: object) => {
       );
 
       const renderIcon = () => {
-        const { iconName, iconSize, iconActiveName, iconClassPrefix, iconFontClassName, iconIndeterminateName } = props;
-        return h(nutIcon, {
-          name: !pValue.value ? iconName : state.partialSelect ? iconIndeterminateName : iconActiveName,
-          size: iconSize,
-          class: color.value,
-          classPrefix: iconClassPrefix,
-          fontClassName: iconFontClassName
+        const { iconSize } = props;
+        const iconNodeMap = {
+          CheckNormal: slots.icon ? slots.icon : components.CheckNormal,
+          Checked: slots.checkedIcon ? slots.checkedIcon : components.Checked,
+          CheckDisabled: slots.indeterminate ? slots.indeterminate : components.CheckDisabled
+        };
+        const iconNode = !pValue.value
+          ? iconNodeMap.CheckNormal
+          : state.partialSelect
+          ? iconNodeMap.CheckDisabled
+          : iconNodeMap.Checked;
+        const size = pxCheck(iconSize);
+        return h(iconNode, {
+          width: size,
+          height: size,
+          size: size,
+          class: color.value
         });
       };
 
@@ -133,9 +122,9 @@ export const component = (componentName: string, nutIcon: object) => {
         }
         emitChange(!checked.value, slots.default?.()[0].children as string);
         if (hasParent.value) {
-          let value = parent.value.value;
-          let max = parent.max.value;
-          let { label } = props;
+          const value = parent.value.value;
+          const max = parent.max.value;
+          const { label } = props;
           const index = value.indexOf(label);
           if (index > -1) {
             value.splice(index, 1);