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

src/packages/__VUE/addresslist/components/ItemContents.vue

@@ -12,8 +12,8 @@
       </div>
       <div class="nut-address-list-item__info-handle">
         <slot name="contentIcon">
-          <nut-icon name="del" class="nut-address-list-item__info-handle-del" @click="delClick"></nut-icon>
-          <nut-icon name="edit" class="nut-address-list-item__info-handle-edit" @click="editClick"></nut-icon>
+          <Del name="del" class="nut-address-list-item__info-handle-del" @click="delClick"></Del>
+          <Edit name="edit" class="nut-address-list-item__info-handle-edit" @click="editClick"></Edit>
         </slot>
       </div>
     </div>
@@ -28,8 +28,9 @@
 import { createComponent } from '@/packages/utils/create';
 const { create } = createComponent('addresslist-item');
 const { translate } = createComponent('addresslist');
-
+import { Del, Edit } from '@nutui/icons-vue';
 export default create({
+  components: { Del, Edit },
   props: {
     item: {
       type: Object,

src/packages/__VUE/addresslist/doc.en-US.md

@@ -8,11 +8,10 @@ It is mainly used to display and operate the address list. Dependent components:
 
 ```javascript
 import { createApp } from "vue";
-import { AddressList, Icon, Swipe, Button } from "@nutui/nutui";
+import { AddressList, Swipe, Button } from "@nutui/nutui";
 
 const app = createApp();
 app.use(AddressList);
-app.use(Icon);
 app.use(Swipe);
 app.use(Button);
 ```

src/packages/__VUE/addresslist/doc.md

@@ -8,11 +8,10 @@
 
 ```javascript
 import { createApp } from "vue";
-import { AddressList, Icon, Swipe, Button } from "@nutui/nutui";
+import { AddressList, Swipe, Button } from "@nutui/nutui";
 
 const app = createApp();
 app.use(AddressList);
-app.use(Icon);
 app.use(Swipe);
 app.use(Button);
 ```

src/packages/__VUE/addresslist/doc.taro.md

@@ -8,11 +8,10 @@
 
 ```javascript
 import { createApp } from "vue";
-import { AddressList, Icon, Swipe, Button } from "@nutui/nutui";
+import { AddressList, Swipe, Button } from "@nutui/nutui";
 
 const app = createApp();
 app.use(AddressList);
-app.use(Icon);
 app.use(Swipe);
 app.use(Button);
 ```

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

@@ -19,9 +19,7 @@
     <comment-images :images="images" :videos="videos" :type="imagesRows" @clickImages="clickImages"></comment-images>
 
     <view class="nut-comment__follow" v-if="follow && follow.days > 0" @click="handleClick">
-      <view class="nut-comment__follow-title"
-        >购买{{ follow.days }}天后追评</view
-      >
+      <view class="nut-comment__follow-title">购买{{ follow.days }}天后追评</view>
       <view class="nut-comment__follow-com">{{ follow.content }}</view>
       <view class="nut-comment__follow-img" v-if="follow.images && follow.images.length > 0"
         >{{ follow.images.length }} 张追评图片 <Right width="12px"></Right

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

@@ -22,7 +22,8 @@
 
     <view class="nut-image-preview-index" v-if="showIndex"> {{ active + 1 }} / {{ images.length }} </view>
     <view class="nut-image-preview-close-icon" @click="onClose" :style="styles" v-if="closeable"
-      ><CircleClose color="#ffffff"></CircleClose></view>
+      ><CircleClose color="#ffffff"></CircleClose
+    ></view>
   </nut-popup>
 </template>
 <script lang="ts">

src/packages/__VUE/navbar/doc.en-US.md

@@ -155,9 +155,6 @@ export default {
         <nut-tab-pane title="Title3"> </nut-tab-pane>
       </nut-tabs>
     </template>
-    <template #icons>
-        <nut-icon class="icon" name="share"></nut-icon>
-      </template>
 
     <template #right>
       <HorizontalN class="right" width="16px"></HorizontalN>

src/packages/__VUE/navbar/doc.taro.md

@@ -27,7 +27,7 @@ app.use(TabPane);
       <div>返回</div>
     </template>
     <template #right>
-      <nut-icon class="right" name="share-n"></nut-icon>
+      <ShareN width="16px"></ShareN>
     </template>
   </nut-navbar>
 
@@ -46,18 +46,23 @@ app.use(TabPane);
     @on-click-icon="icon"
     @on-click-right="rightClick"
     title="购物车"
-    titleIcon="cart2"
+    :titleIcon="true"
     desc="编辑"
   >
+    <template #titleIcon>
+      <Cart2 width="16px"></Cart2>
+    </template>
     <template #right>
-      <nut-icon class="right" name="more-x"></nut-icon>
+      <MoreX class="right" width="16px"></MoreX>
     </template>
   </nut-navbar>
 </template>
 
 <script lang="ts">
   import { ref } from 'vue';
+  import { ShareN, Cart2, MoreX } from '@nutui/icons-vue';
   export default {
+  components: { ShareN, Cart2, MoreX },
   setup() {
     const methods = {
       back() {
@@ -100,14 +105,16 @@ app.use(TabPane);
     </template>
 
     <template #right>
-      <nut-icon class="right" name="more-x"></nut-icon>
+      <MoreX class="right" width="16px"></MoreX>
     </template>
   </nut-navbar>
 </template>
 
 <script lang="ts">
 import { ref } from 'vue';
+import { MoreX } from '@nutui/icons-vue';
 export default {
+  components: { MoreX },
   setup() {
     const tab1value = ref(0);
     const methods = {
@@ -148,19 +155,18 @@ export default {
         <nut-tab-pane title="标题3"> </nut-tab-pane>
       </nut-tabs>
     </template>
-    <template #icons>
-      <nut-icon class="icon" name="share"></nut-icon>
-    </template>
 
     <template #right>
-      <nut-icon class="right" name="horizontal-n"></nut-icon>
+      <HorizontalN class="right" width="16px"></HorizontalN>
     </template>
   </nut-navbar>
 </template>
 
 <script lang="ts">
   import { ref } from 'vue';
+  import { HorizontalN } from '@nutui/icons-vue';
   export default {
+    components: { HorizontalN },
     setup() {
     const tab2value = ref(0);
     const methods = {
@@ -190,7 +196,7 @@ export default {
 | left-text       | 左侧文案                                                 | String  | -       |
 | desc            | 右侧描述                                                 | String  | -       |
 | left-show       | 是否展示左侧箭头                                          | Boolean | false   |
-| title-icon        | 标题中插入icon                                           | String  | -       |
+| title-icon        | 标题中是否展示icon                                        | Boolean  | false      |
 | border          | 是否显示下边框                                            | Boolean  | false  |
 | fixed           | 是否固定到顶部                                            | Boolean  | false    |
 | placeholder     | 固定在顶部时，是否在标签位置生成一个等高的占位元素              | Boolean  | false   |
@@ -212,6 +218,8 @@ export default {
 | left | 自定义左侧内容 |  |
 | right | 自定义右侧内容 |  |
 | content |  自定义导航栏中间内容 |  |
+| leftShow  | 左侧箭头自定义图标 |
+| titleIcon  | 标题中自定义图标 |
 
 ## 主题定制
 
@@ -232,4 +240,4 @@ export default {
 | --nut-navbar-title-font-weight| _0_ | -  |
 | --nut-navbar-title-font-color| _var(--nut-navbar-color)_ | -  |
 | --nut-navbar-title-width| _100px_ | -  |
-| --nut-navbar-title-icon-margin| _0 0 0 13px_ | -  |
+| --nut-navbar-title-icon-margin| _0 0 0 13px_ | -  |

src/packages/__VUE/noticebar/doc.taro.md

@@ -255,6 +255,7 @@ app.use(Noticebar);
 | click | 外层点击事件回调 | event: Event |
 | close | 关闭通知栏时触发 | event: Event |
 
+
 ## 主题定制
 
 ### 样式变量
@@ -274,3 +275,4 @@ app.use(Noticebar);
 | --nut-noticebar-wrapable-padding| _16px_ | -  |
 | --nut-noticebar-lefticon-margin| _0px 10px_ | -  |
 | --nut-noticebar-righticon-margin| _0px 10px_ | -  |
+

src/packages/__VUE/pullrefresh/doc.en-US.md

@@ -7,12 +7,11 @@ Used to provide interactive operations for pull-down refresh.
 ### Install
 
 ```javascript
-  import { createApp } from 'vue';
-  import { PullRefresh,Icon } from '@nutui/nutui';
+import { createApp } from 'vue';
+import { PullRefresh } from '@nutui/nutui';
 
-  const app = createApp();
-  app.use(PullRefresh);
-  app.use(Icon);
+const app = createApp();
+app.use(PullRefresh);
 
 ```
 

src/packages/__VUE/pullrefresh/doc.md

@@ -7,13 +7,11 @@
 ### 安装
 
 ```javascript
-  import { createApp } from 'vue';
-  import { PullRefresh,Icon } from '@nutui/nutui';
-
-  const app = createApp();
-  app.use(PullRefresh);
-  app.use(Icon);
+import { createApp } from 'vue';
+import { PullRefresh } from '@nutui/nutui';
 
+const app = createApp();
+app.use(PullRefresh);
 ```
 
 ### 基础用法

src/packages/__VUE/rate/doc.taro.md

@@ -8,11 +8,10 @@
 
 ``` javascript
 import { createApp } from 'vue';
-import { Rate,Icon } from '@nutui/nutui-taro';
+import { Rate } from '@nutui/nutui-taro';
 
 const app = createApp();
 app.use(Rate);
-app.use(Icon);
 ```
 
 

src/packages/__VUE/searchbar/doc.taro.md

@@ -8,12 +8,10 @@
     
 ```javascript
 import { createApp } from 'vue';
-import { Searchbar, Icon } from '@nutui/nutui-taro';
+import { Searchbar } from '@nutui/nutui-taro';
 
 const app = createApp();
 app.use(Searchbar);
-app.use(Icon);
-
 ```    
     
 ### 基础用法

src/packages/__VUE/timeselect/doc.en-US.md

@@ -8,14 +8,13 @@ For delivery time selection
 
 ``` javascript
 import { createApp } from 'vue';
-import { TimeSelect, TimePannel, TimeDetail, Popup, Icon, Overlay } from '@nutui/nutui';
+import { TimeSelect, TimePannel, TimeDetail, Popup, Overlay } from '@nutui/nutui';
 
 const app = createApp();
 app.use(TimeSelect);
 app.use(TimePannel);
 app.use(TimeDetail);
 app.use(Popup);
-app.use(Icon);
 app.use(Overlay);
 ```
 

src/packages/__VUE/timeselect/doc.md

@@ -8,14 +8,13 @@
 
 ``` javascript
 import { createApp } from 'vue';
-import { TimeSelect, TimePannel, TimeDetail, Popup, Icon, Overlay } from '@nutui/nutui';
+import { TimeSelect, TimePannel, TimeDetail, Popup, Overlay } from '@nutui/nutui';
 
 const app = createApp();
 app.use(TimeSelect);
 app.use(TimePannel);
 app.use(TimeDetail);
 app.use(Popup);
-app.use(Icon);
 app.use(Overlay);
 ```
 

src/packages/__VUE/timeselect/doc.taro.md

@@ -8,14 +8,13 @@
 
 ``` javascript
 import { createApp } from 'vue';
-import { TimeSelect, TimePannel, TimeDetail, Popup, Icon, Overlay } from '@nutui/nutui-taro';
+import { TimeSelect, TimePannel, TimeDetail, Popup, Overlay } from '@nutui/nutui-taro';
 
 const app = createApp();
 app.use(TimeSelect);
 app.use(TimePannel);
 app.use(TimeDetail);
 app.use(Popup);
-app.use(Icon);
 app.use(Overlay);
 ```
 

src/sites/mobile-taro/vue/src/exhibition/pages/noticebar/index.vue

@@ -110,7 +110,7 @@
         :color="`#D9500B`"
       >
         <template v-slot:rightIcon>
-          <nut-icon name="fabulous" color="#f0250f"> </nut-icon>
+          <Fabulous />
         </template>
       </nut-noticebar>
     </div>
@@ -119,9 +119,10 @@
 
 <script lang="ts">
 import { reactive, toRefs } from 'vue';
+import { Fabulous } from '@nutui/icons-vue-taro';
 
 export default {
-  props: {},
+  components: { Fabulous },
   setup() {
     const state = reactive({
       horseLamp1: ['惊喜红包免费领', '爆款准点秒', '买超值优惠', '赢百万京豆'],

src/sites/mobile-taro/vue/src/nav/pages/navbar/index.vue

@@ -61,9 +61,6 @@
           <nut-tab-pane title="推荐"> </nut-tab-pane>
         </nut-tabs>
       </template>
-      <template #icons>
-        <nut-icon class="icon" name="share"></nut-icon>
-      </template>
 
       <template #right>
         <HorizontalN class="right" width="16px"></HorizontalN>