@nutui/nutui-react 3.1.0-beta.1 → 4.0.0-beta.1

package/dist/es/packages/toast/style-jmapp/style.css

@@ -42,8 +42,8 @@
   flex-direction: column;
   justify-content: center;
   align-items: center;
-  min-width: scale-px(96px);
-  max-width: 60%;
+  min-width: var(--nutui-toast-inner-min-width, scale-px(88px));
+  max-width: var(--nutui-toast-inner-max-width, scale-px(200px));
   box-sizing: border-box;
   font-size: var(--nutui-toast-text-font-size, 14px);
   text-align: var(--nutui-toast-inner-text-align, center);
@@ -53,8 +53,9 @@
   border-radius: var(--nutui-toast-inner-border-radius, var(--nutui-radius-xs));
   color: var(--nutui-toast-font-color, #ffffff);
 }
-.nut-toast-inner-descrption {
-  max-width: 68.2%;
+.nut-toast-has-icon .nut-toast-inner {
+  min-width: var(--nutui-toast-inner-has-icon-min-width, scale-px(97px));
+  max-width: var(--nutui-toast-inner-has-icon-max-width, scale-px(225px));
 }
 .nut-toast-inner-normal {
   word-break: normal;
@@ -80,8 +81,9 @@
   top: var(--nutui-toast-inner-top, 20%);
 }
 .nut-toast-text {
-  color: #ffffff;
+  color: var(--nutui-toast-font-color, var(--nutui-white, #ffffff));
   text-align: var(--nutui-toast-inner-text-align, center);
+  font-weight: var(--nutui-toast-text-font-weight, 400);
   /* #ifdef harmony dynamic*/
   line-height: normal;
   /* #endif */
@@ -91,9 +93,9 @@
   height: auto;
 }
 .nut-toast-title {
-  color: #ffffff;
+  color: var(--nutui-toast-font-color, var(--nutui-white, #ffffff));
   font-size: var(--nutui-toast-title-font-size, 16px);
-  font-weight: 600;
+  font-weight: var(--nutui-toast-title-font-weight, 600);
   text-align: var(--nutui-toast-inner-text-align, center);
   /* #ifdef harmony dynamic*/
   line-height: normal;
@@ -103,21 +105,22 @@
   /* #endif */
 }
 .nut-toast .nut-icon {
-  width: scale-px(24px);
-  height: scale-px(24px);
-  color: #ffffff;
+  width: scale-px(20px);
+  height: scale-px(20px);
+  color: var(--nutui-toast-icon-color, var(--nutui-toast-font-color, var(--nutui-white, #ffffff)));
 }
 .nut-toast-icon-wrapper {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
-  margin: scale-px(3px) 0 scale-px(5px);
-  color: #ffffff;
+  margin: 0;
+  padding: scale-px(10px) 0;
+  color: var(--nutui-toast-icon-color, var(--nutui-toast-font-color, var(--nutui-white, #ffffff)));
 }
 .nut-toast-icon-wrapper-icon {
-  width: scale-px(24px);
-  height: scale-px(24px);
+  width: scale-px(20px);
+  height: scale-px(20px);
 }
 .nut-toast-rtl {
   left: auto;

package/dist/es/packages/toast/style-jmapp/toast.scss

@@ -42,9 +42,8 @@
     flex-direction: column;
     justify-content: center;
     align-items: center;
-    min-width: scale-px(96px);
-    max-width: 60%;
-    // max-width: 224px;
+    min-width: var(--nutui-toast-inner-min-width, scale-px(88px));
+    max-width: var(--nutui-toast-inner-max-width, scale-px(200px));
     box-sizing: border-box;
     font-size: $toast-text-font-size;
     text-align: $toast-inner-text-align;
@@ -54,9 +53,9 @@
     border-radius: $toast-inner-border-radius;
     color: $toast-font-color;
 
-    &-descrption {
-      max-width: 68.2%;
-      // max-width: 256px;
+    .nut-toast-has-icon & {
+      min-width: var(--nutui-toast-inner-has-icon-min-width, scale-px(97px));
+      max-width: var(--nutui-toast-inner-has-icon-max-width, scale-px(225px));
     }
 
     &-normal {
@@ -91,8 +90,9 @@
   }
 
   &-text {
-    color: #ffffff;
+    color: var(--nutui-toast-font-color, var(--nutui-white, #ffffff));
     text-align: $toast-inner-text-align;
+    font-weight: var(--nutui-toast-text-font-weight, 400);
     /* #ifdef harmony dynamic*/
     line-height: normal;
     /* #endif */
@@ -103,9 +103,9 @@
   }
 
   &-title {
-    color: #ffffff;
+    color: var(--nutui-toast-font-color, var(--nutui-white, #ffffff));
     font-size: $toast-title-font-size;
-    font-weight: 600;
+    font-weight: var(--nutui-toast-title-font-weight, 600);
     text-align: $toast-inner-text-align;
     /* #ifdef harmony dynamic*/
     line-height: normal;
@@ -116,9 +116,12 @@
   }
 
   .nut-icon {
-    width: scale-px(24px);
-    height: scale-px(24px);
-    color: #ffffff;
+    width: scale-px(20px);
+    height: scale-px(20px);
+    color: var(
+      --nutui-toast-icon-color,
+      var(--nutui-toast-font-color, var(--nutui-white, #ffffff))
+    );
   }
 
   &-icon-wrapper {
@@ -126,12 +129,16 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    margin: scale-px(3px) 0 scale-px(5px);
-    color: #ffffff;
+    margin: 0;
+    padding: scale-px(10px) 0;
+    color: var(
+      --nutui-toast-icon-color,
+      var(--nutui-toast-font-color, var(--nutui-white, #ffffff))
+    );
 
     &-icon {
-      width: scale-px(24px);
-      height: scale-px(24px);
+      width: scale-px(20px);
+      height: scale-px(20px);
     }
   }
 

package/dist/es/packages/toast/style-jrkf/style.css

@@ -42,8 +42,8 @@
   flex-direction: column;
   justify-content: center;
   align-items: center;
-  min-width: scale-px(96px);
-  max-width: 60%;
+  min-width: var(--nutui-toast-inner-min-width, scale-px(88px));
+  max-width: var(--nutui-toast-inner-max-width, scale-px(200px));
   box-sizing: border-box;
   font-size: var(--nutui-toast-text-font-size, 14px);
   text-align: var(--nutui-toast-inner-text-align, center);
@@ -53,8 +53,9 @@
   border-radius: var(--nutui-toast-inner-border-radius, var(--nutui-radius-xs));
   color: var(--nutui-toast-font-color, #ffffff);
 }
-.nut-toast-inner-descrption {
-  max-width: 68.2%;
+.nut-toast-has-icon .nut-toast-inner {
+  min-width: var(--nutui-toast-inner-has-icon-min-width, scale-px(97px));
+  max-width: var(--nutui-toast-inner-has-icon-max-width, scale-px(225px));
 }
 .nut-toast-inner-normal {
   word-break: normal;
@@ -80,8 +81,9 @@
   top: var(--nutui-toast-inner-top, 20%);
 }
 .nut-toast-text {
-  color: #ffffff;
+  color: var(--nutui-toast-font-color, var(--nutui-white, #ffffff));
   text-align: var(--nutui-toast-inner-text-align, center);
+  font-weight: var(--nutui-toast-text-font-weight, 400);
   /* #ifdef harmony dynamic*/
   line-height: normal;
   /* #endif */
@@ -91,9 +93,9 @@
   height: auto;
 }
 .nut-toast-title {
-  color: #ffffff;
+  color: var(--nutui-toast-font-color, var(--nutui-white, #ffffff));
   font-size: var(--nutui-toast-title-font-size, 16px);
-  font-weight: 600;
+  font-weight: var(--nutui-toast-title-font-weight, 600);
   text-align: var(--nutui-toast-inner-text-align, center);
   /* #ifdef harmony dynamic*/
   line-height: normal;
@@ -103,21 +105,22 @@
   /* #endif */
 }
 .nut-toast .nut-icon {
-  width: scale-px(24px);
-  height: scale-px(24px);
-  color: #ffffff;
+  width: scale-px(20px);
+  height: scale-px(20px);
+  color: var(--nutui-toast-icon-color, var(--nutui-toast-font-color, var(--nutui-white, #ffffff)));
 }
 .nut-toast-icon-wrapper {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
-  margin: scale-px(3px) 0 scale-px(5px);
-  color: #ffffff;
+  margin: 0;
+  padding: scale-px(10px) 0;
+  color: var(--nutui-toast-icon-color, var(--nutui-toast-font-color, var(--nutui-white, #ffffff)));
 }
 .nut-toast-icon-wrapper-icon {
-  width: scale-px(24px);
-  height: scale-px(24px);
+  width: scale-px(20px);
+  height: scale-px(20px);
 }
 .nut-toast-rtl {
   left: auto;

package/dist/es/packages/toast/style-jrkf/toast.scss

@@ -42,9 +42,8 @@
     flex-direction: column;
     justify-content: center;
     align-items: center;
-    min-width: scale-px(96px);
-    max-width: 60%;
-    // max-width: 224px;
+    min-width: var(--nutui-toast-inner-min-width, scale-px(88px));
+    max-width: var(--nutui-toast-inner-max-width, scale-px(200px));
     box-sizing: border-box;
     font-size: $toast-text-font-size;
     text-align: $toast-inner-text-align;
@@ -54,9 +53,9 @@
     border-radius: $toast-inner-border-radius;
     color: $toast-font-color;
 
-    &-descrption {
-      max-width: 68.2%;
-      // max-width: 256px;
+    .nut-toast-has-icon & {
+      min-width: var(--nutui-toast-inner-has-icon-min-width, scale-px(97px));
+      max-width: var(--nutui-toast-inner-has-icon-max-width, scale-px(225px));
     }
 
     &-normal {
@@ -91,8 +90,9 @@
   }
 
   &-text {
-    color: #ffffff;
+    color: var(--nutui-toast-font-color, var(--nutui-white, #ffffff));
     text-align: $toast-inner-text-align;
+    font-weight: var(--nutui-toast-text-font-weight, 400);
     /* #ifdef harmony dynamic*/
     line-height: normal;
     /* #endif */
@@ -103,9 +103,9 @@
   }
 
   &-title {
-    color: #ffffff;
+    color: var(--nutui-toast-font-color, var(--nutui-white, #ffffff));
     font-size: $toast-title-font-size;
-    font-weight: 600;
+    font-weight: var(--nutui-toast-title-font-weight, 600);
     text-align: $toast-inner-text-align;
     /* #ifdef harmony dynamic*/
     line-height: normal;
@@ -116,9 +116,12 @@
   }
 
   .nut-icon {
-    width: scale-px(24px);
-    height: scale-px(24px);
-    color: #ffffff;
+    width: scale-px(20px);
+    height: scale-px(20px);
+    color: var(
+      --nutui-toast-icon-color,
+      var(--nutui-toast-font-color, var(--nutui-white, #ffffff))
+    );
   }
 
   &-icon-wrapper {
@@ -126,12 +129,16 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    margin: scale-px(3px) 0 scale-px(5px);
-    color: #ffffff;
+    margin: 0;
+    padding: scale-px(10px) 0;
+    color: var(
+      --nutui-toast-icon-color,
+      var(--nutui-toast-font-color, var(--nutui-white, #ffffff))
+    );
 
     &-icon {
-      width: scale-px(24px);
-      height: scale-px(24px);
+      width: scale-px(20px);
+      height: scale-px(20px);
     }
   }
 

package/dist/es/packages/toast/toast.js

@@ -13,7 +13,7 @@ var defaultProps = _object_spread_props(_object_spread({}, defaultOverlayProps),
     contentClassName: '',
     contentStyle: {},
     wordBreak: 'break-all',
-    duration: 2,
+    duration: 3,
     closeOnOverlayClick: false,
     lockScroll: false,
     zIndex: 1300,

package/dist/es/types/base/atoms.d.ts

@@ -1,9 +1,9 @@
 export type SimpleValue = string | number;
 export type SimpleValues = string[] | number[];
-export type UIType = 'default' | 'primary' | 'info' | 'success' | 'warning' | 'danger';
-export type UISize = 'xlarge' | 'large' | 'normal' | 'small' | 'mini';
+export type UIType = 'default' | 'primary' | 'info' | 'success' | 'warning' | 'danger' | 'service';
+export type UISize = 'xlarge' | 'large' | 'normal' | 'small' | 'mini' | '48' | '44' | '40' | '36' | '32' | '28' | '24';
 export type UIRound = 'square' | 'round';
-export type UIFill = 'solid' | 'outline' | 'dashed' | 'none';
+export type UIFill = 'solid' | 'outline' | 'dashed' | 'none' | 'light';
 export type UILayout = 'row' | 'col';
 export type UITheme = 'light' | 'dark';
 export type FlexAlign = 'flex-start' | 'center' | 'flex-end' | 'baseline';

package/dist/es/types/spec/button/base.d.ts

@@ -43,6 +43,7 @@ export interface BaseButton extends BaseProps {
     * 右侧按钮图标
     */
     rightIcon: ReactNode
+    description?: ReactNode;
     id: string;
     /**
     * 按钮原始类型

package/dist/es/utils/taro/get-system-info.d.ts

@@ -14,9 +14,4 @@ export declare const getDeviceInfo: () => IDeviceInfo;
  * @returns {Taro.getWindowInfo.Result} 窗口信息
  */
 export declare const getWindowInfo: () => Taro.getWindowInfo.Result;
-/**
- * 获取应用基础信息，兼容新旧 API
- * @returns {Taro.getAppBaseInfo.Result} 应用基础信息
- */
-export declare const getAppBaseInfo: () => Taro.getAppBaseInfo.Result;
 export {};

package/dist/es/utils/taro/get-system-info.js

@@ -13,10 +13,11 @@ import Taro from "@tarojs/taro";
  * @returns {Taro.getWindowInfo.Result} 窗口信息
  */ export var getWindowInfo = function() {
     return typeof Taro.getWindowInfo === 'function' ? Taro.getWindowInfo() : Taro.getSystemInfoSync();
-};
-/**
- * 获取应用基础信息，兼容新旧 API
- * @returns {Taro.getAppBaseInfo.Result} 应用基础信息
- */ export var getAppBaseInfo = function() {
-    return typeof Taro.getAppBaseInfo === 'function' ? Taro.getAppBaseInfo() : Taro.getSystemInfoSync();
-};
+} // /**
+ //  * 获取应用基础信息，兼容新旧 API
+ //  * @returns {Taro.getAppBaseInfo.Result} 应用基础信息
+ //  */
+ // export const getAppBaseInfo = (): Taro.getAppBaseInfo.Result => {
+ //   return canIUse('getAppBaseInfo') ? taroGetAppBaseInfo() : getSystemInfoSync()
+ // }
+;