@nutui/nutui 4.0.0-beta.2 → 4.0.0-beta.21

package/dist/packages/addresslist/style.mjs

@@ -1,2 +1,4 @@
-import './index.scss';
+import '../../styles/reset.css';
+import '../swipe/index.scss';
 import '../button/index.scss';
+import './index.scss';

package/dist/packages/animate/index.mjs

@@ -1,2 +1,4 @@
-import Animate from '../_es/Animate.js';
+import _Animate from '../_es/Animate.js';
+const treeshaking = (t) => t;
+const Animate = treeshaking(_Animate);
 export { Animate };

package/dist/packages/animate/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/audio/index.mjs

@@ -1,2 +1,4 @@
-import Audio from '../_es/Audio.js';
+import _Audio from '../_es/Audio.js';
+const treeshaking = (t) => t;
+const Audio = treeshaking(_Audio);
 export { Audio };

package/dist/packages/audio/index.scss

@@ -39,7 +39,7 @@
       height: 30px;
       background: #fff;
       border-radius: 50%;
-      box-shadow: 0 0 8px rgba($color: $text-color, $alpha: 0.5);
+      box-shadow: 0 0 8px rgba(#808080, 0.5);
       &.nut-audio__icon--stop {
         &::after {
           position: absolute;

package/dist/packages/audio/style.mjs

@@ -1,2 +1,3 @@
-import './index.scss';
+import '../../styles/reset.css';
 import '../range/index.scss';
+import './index.scss';

package/dist/packages/audiooperate/index.mjs

@@ -1,2 +1,4 @@
-import AudioOperate from '../_es/AudioOperate.js';
+import _AudioOperate from '../_es/AudioOperate.js';
+const treeshaking = (t) => t;
+const AudioOperate = treeshaking(_AudioOperate);
 export { AudioOperate };

package/dist/packages/audiooperate/style.mjs

@@ -1,2 +1,3 @@
-import './index.scss';
+import '../../styles/reset.css';
 import '../button/index.scss';
+import './index.scss';

package/dist/packages/avatar/index.mjs

@@ -1,2 +1,4 @@
-import Avatar from '../_es/Avatar.js';
+import _Avatar from '../_es/Avatar.js';
+const treeshaking = (t) => t;
+const Avatar = treeshaking(_Avatar);
 export { Avatar };

package/dist/packages/avatar/index.scss

@@ -6,7 +6,9 @@
   position: relative;
   flex: 0 0 auto; // 防止被压缩
   text-align: center;
+  vertical-align: top;
   img {
+    display: block;
     width: 100%;
     height: 100%;
   }
@@ -35,7 +37,7 @@
 }
 .nut-avatar-round {
   border-radius: 50%;
-  overflow: hidden;
+  // overflow: hidden;
 }
 .nut-avatar-square {
   border-radius: $avatar-square;

package/dist/packages/avatar/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/avatargroup/index.mjs

@@ -1,2 +1,4 @@
-import AvatarGroup from '../_es/AvatarGroup.js';
+import _AvatarGroup from '../_es/AvatarGroup.js';
+const treeshaking = (t) => t;
+const AvatarGroup = treeshaking(_AvatarGroup);
 export { AvatarGroup };

package/dist/packages/avatargroup/index.scss

@@ -2,7 +2,7 @@
   background-size: 100% 100%;
   background-repeat: no-repeat;
   background-position: center center;
-  display: inline-block;
+  display: flex;
   position: relative;
   flex: 0 0 auto; // 防止被压缩
   .nut-avatar {

package/dist/packages/avatargroup/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/backtop/index.mjs

@@ -1,2 +1,4 @@
-import Backtop from '../_es/Backtop.js';
+import _Backtop from '../_es/Backtop.js';
+const treeshaking = (t) => t;
+const Backtop = treeshaking(_Backtop);
 export { Backtop };

package/dist/packages/backtop/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/badge/index.mjs

@@ -1,2 +1,4 @@
-import Badge from '../_es/Badge.js';
+import _Badge from '../_es/Badge.js';
+const treeshaking = (t) => t;
+const Badge = treeshaking(_Badge);
 export { Badge };

package/dist/packages/badge/index.scss

@@ -10,16 +10,20 @@
   position: relative;
   display: inline-block;
   .nut-badge__icon {
+    display: flex;
+    align-items: center;
+    line-height: normal;
+    transform: $badge-content-transform;
     position: absolute;
     background: $badge-background-color;
-    top: -20%;
-    right: -20%;
-    padding: $badge-padding;
+    padding: $badge-icon-padding;
     text-align: center;
     border-radius: $badge-border-radius;
     z-index: $badge-z-index;
   }
   .nut-badge__content {
+    display: flex;
+    align-items: center;
     transform: $badge-content-transform;
     &--sup {
       position: absolute;

package/dist/packages/badge/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/barrage/index.mjs

@@ -1,2 +1,4 @@
-import Barrage from '../_es/Barrage.js';
+import _Barrage from '../_es/Barrage.js';
+const treeshaking = (t) => t;
+const Barrage = treeshaking(_Barrage);
 export { Barrage };

package/dist/packages/barrage/index.scss

@@ -6,7 +6,7 @@
   height: 100%;
   overflow: hidden;
   box-sizing: border-box;
-  background-color: #f7f8fa;
+  --move-distance: '300%';
   &__item {
     width: 100px;
     display: block;
@@ -25,6 +25,22 @@
       animation-timing-function: linear;
       animation-play-state: running;
     }
+    @keyframes moving {
+      from {
+        transform: translateX(100%);
+      }
+      to {
+        transform: translateX(var(--move-distance));
+      }
+    }
+    @-webkit-keyframes moving {
+      from {
+        -webkit-transform: translateX(100%);
+      }
+      to {
+        transform: translateX(var(--move-distance));
+      }
+    }
   }
 }
 .nut-theme-dark {

package/dist/packages/barrage/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/button/index.mjs

@@ -1,2 +1,4 @@
-import Button from '../_es/Button.js';
+import _Button from '../_es/Button.js';
+const treeshaking = (t) => t;
+const Button = treeshaking(_Button);
 export { Button };

package/dist/packages/button/index.scss

@@ -16,7 +16,6 @@
   user-select: none;
   touch-action: manipulation;
   vertical-align: bottom;
-
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   -webkit-tap-highlight-color: transparent;
 
@@ -174,3 +173,66 @@
     border-radius: 0;
   }
 }
+.nut-button--default:not([disabled]):active {
+  color: $button-default-color;
+  background: $button-default-bg-color;
+  border: $button-border-width solid $button-default-border-color;
+}
+.nut-button--primary:not([disabled]):active {
+  color: $button-primary-color;
+  background: $button-primary-background-color;
+  border: $button-border-width solid transparent;
+}
+
+.nut-button--info:not([disabled]):active {
+  color: $button-info-color;
+  background: $button-info-background-color;
+  border: $button-border-width solid transparent;
+}
+
+.nut-button--success:not([disabled]):active {
+  color: $button-success-color;
+  background: $button-success-background-color;
+  border: $button-border-width solid transparent;
+}
+
+.nut-button--danger:not([disabled]):active {
+  color: $button-danger-color;
+  background: $button-danger-background-color;
+  border: $button-border-width solid transparent;
+}
+
+.nut-button--warning:not([disabled]):active {
+  color: $button-warning-color;
+  background: $button-warning-background-color;
+  border: $button-border-width solid transparent;
+}
+.nut-button--plain:not([disabled]):active {
+  background: $button-plain-background-color;
+}
+.nut-button--plain {
+  &.nut-button--primary:not([disabled]):active {
+    color: $button-primary-border-color;
+    border-color: $button-primary-border-color;
+  }
+
+  &.nut-button--info:not([disabled]):active {
+    color: $button-info-border-color;
+    border-color: $button-info-border-color;
+  }
+
+  &.nut-button--success:not([disabled]):active {
+    color: $button-success-border-color;
+    border-color: $button-success-border-color;
+  }
+
+  &.nut-button--danger:not([disabled]):active {
+    color: $button-danger-border-color;
+    border-color: $button-danger-border-color;
+  }
+
+  &.nut-button--warning:not([disabled]):active {
+    color: $button-warning-border-color;
+    border-color: $button-warning-border-color;
+  }
+}

package/dist/packages/button/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/calendar/index.mjs

@@ -1,2 +1,4 @@
-import Calendar from '../_es/Calendar.js';
+import _Calendar from '../_es/Calendar.js';
+const treeshaking = (t) => t;
+const Calendar = treeshaking(_Calendar);
 export { Calendar };

package/dist/packages/calendar/index.scss

@@ -65,7 +65,7 @@
       line-height: 44px;
     }
     .nut-calendar__header-slot {
-      height: 24px;
+      min-height: 24px;
     }
     .nut-calendar__header-subtitle {
       padding: 7px 0;
@@ -145,8 +145,8 @@
         }
         .nut-calendar__day {
           float: left;
-          width: $calendar-day-width;
-          height: $calendar-day-height;
+          width: 14.28%;
+          height: 64px;
           font-weight: $calendar-day-font-weight;
           display: flex;
           align-items: center;
@@ -196,13 +196,22 @@
             }
           }
 
-          &-disabled {
+          &--disabled {
             color: $calendar-disable-color !important;
           }
 
           &--choose {
-            background-color: $calendar-choose-color;
             color: $calendar-choose-font-color;
+            &::after {
+              position: absolute;
+              top: 0;
+              right: 0;
+              bottom: 0;
+              left: 0;
+              background-color: $calendar-choose-color;
+              opacity: 0.09;
+              content: '';
+            }
           }
 
           .nut-calendar__day-value {

package/dist/packages/calendar/style.mjs

@@ -1,4 +1,5 @@
-import './index.scss';
-import '../popup/index.scss';
-import '../overlay/index.scss';
+import '../../styles/reset.css';
 import '../calendaritem/index.scss';
+import '../overlay/index.scss';
+import '../popup/index.scss';
+import './index.scss';

package/dist/packages/calendaritem/index.mjs

@@ -1,2 +1,4 @@
-import CalendarItem from '../_es/CalendarItem.js';
+import _CalendarItem from '../_es/CalendarItem.js';
+const treeshaking = (t) => t;
+const CalendarItem = treeshaking(_CalendarItem);
 export { CalendarItem };

package/dist/packages/calendaritem/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/card/index.mjs

@@ -1,2 +1,4 @@
-import Card from '../_es/Card.js';
+import _Card from '../_es/Card.js';
+const treeshaking = (t) => t;
+const Card = treeshaking(_Card);
 export { Card };

package/dist/packages/card/style.mjs

@@ -1,3 +1,4 @@
-import './index.scss';
-import '../price/index.scss';
+import '../../styles/reset.css';
 import '../tag/index.scss';
+import '../price/index.scss';
+import './index.scss';

package/dist/packages/cascader/index.mjs

@@ -1,2 +1,4 @@
-import Cascader from '../_es/Cascader.js';
+import _Cascader from '../_es/Cascader.js';
+const treeshaking = (t) => t;
+const Cascader = treeshaking(_Cascader);
 export { Cascader };

package/dist/packages/cascader/style.mjs

@@ -1,6 +1,7 @@
-import './index.scss';
-import '../popup/index.scss';
-import '../overlay/index.scss';
-import '../tabs/index.scss';
-import '../sticky/index.scss';
+import '../../styles/reset.css';
 import '../tabpane/index.scss';
+import '../sticky/index.scss';
+import '../tabs/index.scss';
+import '../overlay/index.scss';
+import '../popup/index.scss';
+import './index.scss';

package/dist/packages/category/index.mjs

@@ -1,2 +1,4 @@
-import Category from '../_es/Category.js';
+import _Category from '../_es/Category.js';
+const treeshaking = (t) => t;
+const Category = treeshaking(_Category);
 export { Category };

package/dist/packages/category/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/categorypane/index.mjs

@@ -1,2 +1,4 @@
-import CategoryPane from '../_es/CategoryPane.js';
+import _CategoryPane from '../_es/CategoryPane.js';
+const treeshaking = (t) => t;
+const CategoryPane = treeshaking(_CategoryPane);
 export { CategoryPane };

package/dist/packages/categorypane/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/cell/index.mjs

@@ -1,2 +1,4 @@
-import Cell from '../_es/Cell.js';
+import _Cell from '../_es/Cell.js';
+const treeshaking = (t) => t;
+const Cell = treeshaking(_Cell);
 export { Cell };

package/dist/packages/cell/index.scss

@@ -72,13 +72,15 @@
   &__icon {
     display: flex;
     flex-direction: row;
-    margin-right: $cell-default-icon-margin;
+    margin: $cell-default-icon-margin;
+    align-items: center;
   }
 
   &__title {
     display: flex;
     flex-direction: column;
     flex: 1;
+    min-width: 80px;
     &-desc {
       font-size: $cell-title-desc-font;
     }
@@ -86,6 +88,7 @@
   &__value {
     display: inline-block;
     text-align: right;
+    flex: 1;
     font-size: $cell-desc-font;
     color: $cell-desc-color;
     &--alone {
@@ -94,5 +97,6 @@
   }
   &__link {
     color: #979797;
+    align-self: center;
   }
 }

package/dist/packages/cell/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/cellgroup/index.mjs

@@ -1,2 +1,4 @@
-import CellGroup from '../_es/CellGroup.js';
+import _CellGroup from '../_es/CellGroup.js';
+const treeshaking = (t) => t;
+const CellGroup = treeshaking(_CellGroup);
 export { CellGroup };

package/dist/packages/cellgroup/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/checkbox/index.mjs

@@ -1,2 +1,4 @@
-import Checkbox from '../_es/Checkbox.js';
+import _Checkbox from '../_es/Checkbox.js';
+const treeshaking = (t) => t;
+const Checkbox = treeshaking(_Checkbox);
 export { Checkbox };

package/dist/packages/checkbox/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/checkboxgroup/index.mjs

@@ -1,2 +1,4 @@
-import CheckboxGroup from '../_es/CheckboxGroup.js';
+import _CheckboxGroup from '../_es/CheckboxGroup.js';
+const treeshaking = (t) => t;
+const CheckboxGroup = treeshaking(_CheckboxGroup);
 export { CheckboxGroup };

package/dist/packages/checkboxgroup/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/circleprogress/index.mjs

@@ -1,2 +1,4 @@
-import CircleProgress from '../_es/CircleProgress.js';
+import _CircleProgress from '../_es/CircleProgress.js';
+const treeshaking = (t) => t;
+const CircleProgress = treeshaking(_CircleProgress);
 export { CircleProgress };

package/dist/packages/circleprogress/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/col/index.mjs

@@ -1,2 +1,4 @@
-import Col from '../_es/Col.js';
+import _Col from '../_es/Col.js';
+const treeshaking = (t) => t;
+const Col = treeshaking(_Col);
 export { Col };

package/dist/packages/col/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/collapse/index.mjs

@@ -1,2 +1,4 @@
-import Collapse from '../_es/Collapse.js';
+import _Collapse from '../_es/Collapse.js';
+const treeshaking = (t) => t;
+const Collapse = treeshaking(_Collapse);
 export { Collapse };

package/dist/packages/collapse/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/collapseitem/index.mjs

@@ -1,2 +1,4 @@
-import CollapseItem from '../_es/CollapseItem.js';
+import _CollapseItem from '../_es/CollapseItem.js';
+const treeshaking = (t) => t;
+const CollapseItem = treeshaking(_CollapseItem);
 export { CollapseItem };

package/dist/packages/collapseitem/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/comment/index.mjs

@@ -1,2 +1,4 @@
-import Comment from '../_es/Comment.js';
+import _Comment from '../_es/Comment.js';
+const treeshaking = (t) => t;
+const Comment = treeshaking(_Comment);
 export { Comment };

package/dist/packages/comment/index.scss

@@ -91,13 +91,18 @@
       &-complex {
         display: flex;
         align-items: center;
-        font-weight: bold;
+        color: $comment-header-user-name-color;
 
         &-name {
           margin-right: 10px;
           @include text-ellipsis();
           max-width: 80px;
         }
+
+        image {
+          max-width: 50px;
+          height: 16px;
+        }
       }
 
       &-score {
@@ -208,9 +213,9 @@
       display: flex;
       align-items: center;
       justify-content: center;
-      width: 105px;
-      height: 105px;
-      line-height: 105px;
+      width: 100%;
+      height: 90px;
+      line-height: 90px;
       background: rgba(0, 0, 0, 0.5);
       font-size: 12px;
       color: rgba(255, 255, 255, 1);
@@ -221,14 +226,14 @@
     flex-wrap: wrap;
     justify-content: space-between;
     overflow: hidden;
-    width: 331px;
+    width: 100%;
     margin: 10px auto 15px;
 
     .nut-comment-images__item {
       margin: 8px 8px 0 0;
 
-      width: 105px;
-      height: 105px;
+      width: calc(34% - 8px);
+      height: 90px;
 
       img {
         width: 100%;

package/dist/packages/comment/style.mjs

@@ -1,2 +1,3 @@
-import './index.scss';
+import '../../styles/reset.css';
 import '../rate/index.scss';
+import './index.scss';

package/dist/packages/configprovider/index.mjs

@@ -1,2 +1,4 @@
-import ConfigProvider from '../_es/ConfigProvider.js';
+import _ConfigProvider from '../_es/ConfigProvider.js';
+const treeshaking = (t) => t;
+const ConfigProvider = treeshaking(_ConfigProvider);
 export { ConfigProvider };

package/dist/packages/configprovider/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/countdown/index.mjs

@@ -1,2 +1,4 @@
-import Countdown from '../_es/Countdown.js';
+import _Countdown from '../_es/Countdown.js';
+const treeshaking = (t) => t;
+const Countdown = treeshaking(_Countdown);
 export { Countdown };

package/dist/packages/countdown/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';

package/dist/packages/countup/index.mjs

@@ -1,2 +1,4 @@
-import Countup from '../_es/Countup.js';
+import _Countup from '../_es/Countup.js';
+const treeshaking = (t) => t;
+const Countup = treeshaking(_Countup);
 export { Countup };

package/dist/packages/countup/style.mjs

@@ -1 +1,2 @@
+import '../../styles/reset.css';
 import './index.scss';