@nutui/nutui-react 2.1.1-beta.0 → 2.2.0

package/dist/style.mjs

@@ -1,9 +1,5 @@
 /*!
-* @nutui/nutui-react v2.1.1-beta.0 Mon Nov 20 2023 10:20:01 GMT+0800 (中国标准时间)
+* @nutui/nutui-react v2.2.0 Fri Nov 24 2023 15:05:19 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
-const t = "";
-export {
-  t as default
-};

package/dist/styles/theme-dark.scss

@@ -1,5 +1,17 @@
 :root,
 page {
+  --nutui-gray-0: #000000;
+  --nutui-gray-1: #e6e6e6;
+  --nutui-gray-2: #828282;
+  --nutui-gray-3: #404040;
+  --nutui-gray-4: #0a0a0a;
+  --nutui-gray-5: #141414;
+  --nutui-gray-6: #1f1f1f;
+  --nutui-gray-7: rgba(0, 0, 0, 0.7);
+  --nutui-gray-8: rgba(0, 0, 0, 0.4);
+  --nutui-gray-9: rgba(0, 0, 0, 0.08);
+  --nutui-gray-10: rgba(0, 0, 0, 0.02);
+
   --nutui-brand-1: #403635; // 梯度1
   --nutui-brand-2: #665452; // 梯度2
   --nutui-brand-3: #99706b; // 梯度3
@@ -26,22 +38,22 @@ page {
   --nutui-color-primary-light-pressed: var(--nutui-brand-2);
   --nutui-color-text-link: #040608;
 
-  // 背景色
-  // 卡片背景色
-  --nutui-gray-1: #1f1f1f;
-  // 卡片内嵌背景色，用于卡片内部的信息包裹，感知较弱。
-  --nutui-gray-2: #141414;
-  // 页面基底色，用于卡片式页面的兜底，永远置于页面最底层。
-  --nutui-gray-3: #0a0a0a;
-  // 文字色
-  // 四级文字色，不可操作内容色，用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。
-  --nutui-gray-4: #666666;
-  // 三级文字色（次要）
-  --nutui-gray-5: #818181;
-  // 二级文字色（常规），用于次级标题、属性标示、非主要信息引导等。
-  --nutui-gray-6: #999999;
-  // 一级文字色（重要）主要内容用色，常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
-  --nutui-gray-7: #cccccc;
+  // // 背景色
+  // // 卡片背景色
+  // --nutui-gray-1: #1f1f1f;
+  // // 卡片内嵌背景色，用于卡片内部的信息包裹，感知较弱。
+  // --nutui-gray-2: #141414;
+  // // 页面基底色，用于卡片式页面的兜底，永远置于页面最底层。
+  // --nutui-gray-3: #0a0a0a;
+  // // 文字色
+  // // 四级文字色，不可操作内容色，用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。
+  // --nutui-gray-4: #666666;
+  // // 三级文字色（次要）
+  // --nutui-gray-5: #818181;
+  // // 二级文字色（常规），用于次级标题、属性标示、非主要信息引导等。
+  // --nutui-gray-6: #999999;
+  // // 一级文字色（重要）主要内容用色，常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
+  // --nutui-gray-7: #cccccc;
 
   --nutui-black-1: rgba(255, 255, 255, 0);
   // 蒙层色
@@ -79,7 +91,6 @@ page {
 
   --nutui-color-info: #1988fa;
   --nutui-color-text-disabled: var(--nutui-gray-4);
-
   // 字体
   --nutui-font-size-1: 10px;
   --nutui-font-size-2: 12px;

package/dist/styles/theme-default.scss

@@ -1,5 +1,27 @@
 :root,
 page {
+  --nutui-gray-0: #000000;
+  // 主要内容用色，常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
+  --nutui-gray-1: #1a1a1a;
+  // 次要文字色，用于次级标题、属性标示、非主要信息引导等。
+  --nutui-gray-2: #757575;
+  // 不可操作内容色，用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。
+  --nutui-gray-3: #bfbfbf;
+  // 页面基底色，用于卡片式页面的兜底，永远置于页面最底层。
+  --nutui-gray-4: #f4f4f4;
+  // 卡片内嵌背景色，用于卡片内部的信息包裹，感知较弱。
+  --nutui-gray-5: #f8f8f8;
+  // 卡片背景色
+  --nutui-gray-6: #ffffff;
+  // 页面全局蒙层，用于弹出层、弹窗、新功能引导出现的整页遮罩
+  --nutui-gray-7: rgba(0, 0, 0, 0.7);
+  // 局部蒙层，用于非整页遮罩
+  --nutui-gray-8: rgba(0, 0, 0, 0.4);
+  // 间隔线/容错线，用于结构或信息分割
+  --nutui-gray-9: rgba(0, 0, 0, 0.08);
+  // 图片容错蒙层
+  --nutui-gray-10: rgba(0, 0, 0, 0.02);
+
   --nutui-brand-1: #ffeae8; // 梯度1
   --nutui-brand-2: #fec3be; // 梯度2
   --nutui-brand-3: #fd9d94; // 梯度3
@@ -28,21 +50,21 @@ page {
   --nutui-color-text-link: #396acc;
 
   // 背景色
-  // 卡片背景色
-  --nutui-gray-1: #ffffff;
-  // 卡片内嵌背景色，用于卡片内部的信息包裹，感知较弱。
-  --nutui-gray-2: #f8f8f8;
-  // 页面基底色，用于卡片式页面的兜底，永远置于页面最底层。
-  --nutui-gray-3: #f6f6f6;
-  // 文字色
-  // 四级文字色，不可操作内容色，用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。
-  --nutui-gray-4: #bfbfbf;
-  // 三级文字色（次要）
-  --nutui-gray-5: #8c8c8c;
-  // 二级文字色（常规），用于次级标题、属性标示、非主要信息引导等。
-  --nutui-gray-6: #595959;
-  // 一级文字色（重要）主要内容用色，常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
-  --nutui-gray-7: #1a1a1a;
+  // // 卡片背景色
+  // --nutui-gray-1: #ffffff;
+  // // 卡片内嵌背景色，用于卡片内部的信息包裹，感知较弱。
+  // --nutui-gray-2: #f8f8f8;
+  // // 页面基底色，用于卡片式页面的兜底，永远置于页面最底层。
+  // --nutui-gray-3: #f6f6f6;
+  // // 文字色
+  // // 四级文字色，不可操作内容色，用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。
+  // --nutui-gray-4: #bfbfbf;
+  // // 三级文字色（次要）
+  // --nutui-gray-5: #8c8c8c;
+  // // 二级文字色（常规），用于次级标题、属性标示、非主要信息引导等。
+  // --nutui-gray-6: #595959;
+  // // 一级文字色（重要）主要内容用色，常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
+  // --nutui-gray-7: #1a1a1a;
 
   --nutui-black-1: rgba(0, 0, 0, 0);
   // 蒙层色

package/dist/styles/theme-jmapp.scss

@@ -1,5 +1,27 @@
 :root,
 page {
+  --nutui-gray-0: #000000;
+  // 主要内容用色，常用语常规标题内容、细文浏览、常规按钮文字以及图表引导。
+  --nutui-gray-1: #1a1a1a;
+  // 次要文字色，用于次级标题、属性标示、非主要信息引导等。
+  --nutui-gray-2: #757575;
+  // 不可操作内容色，用于预置内容、无效内容、特殊不可点击按钮、组件边框线等。
+  --nutui-gray-3: #bfbfbf;
+  // 页面基底色，用于卡片式页面的兜底，永远置于页面最底层。
+  --nutui-gray-4: #f4f4f4;
+  // 卡片内嵌背景色，用于卡片内部的信息包裹，感知较弱。
+  --nutui-gray-5: #f8f8f8;
+  // 卡片背景色
+  --nutui-gray-6: #ffffff;
+  // 页面全局蒙层，用于弹出层、弹窗、新功能引导出现的整页遮罩
+  --nutui-gray-7: rgba(0, 0, 0, 0.7);
+  // 局部蒙层，用于非整页遮罩
+  --nutui-gray-8: rgba(0, 0, 0, 0.4);
+  // 间隔线/容错线，用于结构或信息分割
+  --nutui-gray-9: rgba(0, 0, 0, 0.08);
+  // 图片容错蒙层
+  --nutui-gray-10: rgba(0, 0, 0, 0.02);
+
   --nutui-brand-1: #edf4ff; // 梯度1
   --nutui-brand-2: #dce9ff; // 梯度2
   --nutui-brand-3: #ccdefb; // 梯度3
@@ -26,23 +48,23 @@ page {
   --nutui-color-primary-light-pressed: var(--nutui-brand-2);
   --nutui-color-text-link: var(--nutui-brand-8);
 
-  --nutui-gray-0: #f4f4f4; // color-background
-  // 卡片背景色
-  --nutui-gray-1: #f7f7f7; // color-border-tint
-  // 通用背景色、轮廓描边色
-  --nutui-gray-2: #f0f0f0; // color-border-base
-  // 轮廓描边色（适中）
-  --nutui-gray-3: #ebebeb; // color-border-shade
-  // 轮廓描边色（深）
-  --nutui-gray-4: #e6e6e6;
-  --nutui-gray-5: ##d9d9d9;
-  --nutui-gray-6: #cccccc;
-  --nutui-gray-7: #b5b5b5;
-  --nutui-gray-8: #8c8c8c;
-  --nutui-gray-9: #666666;
-  --nutui-gray-10: #595959;
-  --nutui-gray-11: #333333;
-  --nutui-gray-12: #262626;
+  // --nutui-gray-0: #f4f4f4; // color-background
+  // // 卡片背景色
+  // --nutui-gray-1: #f7f7f7; // color-border-tint
+  // // 通用背景色、轮廓描边色
+  // --nutui-gray-2: #f0f0f0; // color-border-base
+  // // 轮廓描边色（适中）
+  // --nutui-gray-3: #ebebeb; // color-border-shade
+  // // 轮廓描边色（深）
+  // --nutui-gray-4: #e6e6e6;
+  // --nutui-gray-5: ##d9d9d9;
+  // --nutui-gray-6: #cccccc;
+  // --nutui-gray-7: #b5b5b5;
+  // --nutui-gray-8: #8c8c8c;
+  // --nutui-gray-9: #666666;
+  // --nutui-gray-10: #595959;
+  // --nutui-gray-11: #333333;
+  // --nutui-gray-12: #262626;
 
   --nutui-black-1: rgba(0, 0, 0, 0.02);
   --nutui-black-2: rgba(0, 0, 0, 0.05);
@@ -129,6 +151,7 @@ page {
 
   --nutui-color-info: var(--nutui-info-6);
   --nutui-color-text-disabled: var(--nutui-black-6);
+
   // 字体
   --nutui-font-size-1: 10px; // font-text-mini
   --nutui-font-size-2: 11px;