@nutui/nutui-react 3.0.0-beta.10 → 3.0.0-beta.12

package/dist/style.scss

@@ -2,109 +2,109 @@
 @import './styles/variables.scss';
 @import './styles/mixins/index.scss';
 @import './styles/animation/index.scss';
+@import './es/packages/virtuallist/style/virtuallist.scss';
 @import './es/packages/watermark/style/watermark.scss';
 @import './es/packages/video/style/video.scss';
-@import './es/packages/virtuallist/style/virtuallist.scss';
-@import './es/packages/trendarrow/style/trendarrow.scss';
 @import './es/packages/uploader/style/uploader.scss';
+@import './es/packages/trendarrow/style/trendarrow.scss';
 @import './es/packages/tour/style/tour.scss';
 @import './es/packages/toast/style/toast.scss';
 @import './es/packages/timeselect/style/timeselect.scss';
 @import './es/packages/timedetail/style/timedetail.scss';
-@import './es/packages/tabpane/style/tabpane.scss';
 @import './es/packages/tag/style/tag.scss';
+@import './es/packages/tabs/style/tabs.scss';
+@import './es/packages/table/style/table.scss';
 @import './es/packages/textarea/style/textarea.scss';
-@import './es/packages/tabbaritem/style/tabbaritem.scss';
+@import './es/packages/tabpane/style/tabpane.scss';
 @import './es/packages/tabbar/style/tabbar.scss';
-@import './es/packages/table/style/table.scss';
-@import './es/packages/tabs/style/tabs.scss';
+@import './es/packages/switch/style/switch.scss';
+@import './es/packages/tabbaritem/style/tabbaritem.scss';
 @import './es/packages/swiper/style/swiper.scss';
 @import './es/packages/swiperitem/style/swiperitem.scss';
-@import './es/packages/switch/style/switch.scss';
 @import './es/packages/swipe/style/swipe.scss';
-@import './es/packages/sticky/style/sticky.scss';
 @import './es/packages/subsidenavbar/style/subsidenavbar.scss';
-@import './es/packages/step/style/step.scss';
 @import './es/packages/steps/style/steps.scss';
+@import './es/packages/sticky/style/sticky.scss';
+@import './es/packages/step/style/step.scss';
 @import './es/packages/space/style/space.scss';
-@import './es/packages/sidenavbaritem/style/sidenavbaritem.scss';
 @import './es/packages/skeleton/style/skeleton.scss';
-@import './es/packages/sidebaritem/style/sidebaritem.scss';
-@import './es/packages/sidenavbar/style/sidenavbar.scss';
 @import './es/packages/signature/style/signature.scss';
+@import './es/packages/sidenavbaritem/style/sidenavbaritem.scss';
+@import './es/packages/sidenavbar/style/sidenavbar.scss';
+@import './es/packages/sidebaritem/style/sidebaritem.scss';
+@import './es/packages/shortpassword/style/shortpassword.scss';
 @import './es/packages/sidebar/style/sidebar.scss';
+@import './es/packages/segmented/style/segmented.scss';
 @import './es/packages/searchbar/style/searchbar.scss';
 @import './es/packages/safearea/style/safearea.scss';
-@import './es/packages/segmented/style/segmented.scss';
-@import './es/packages/shortpassword/style/shortpassword.scss';
-@import './es/packages/resultpage/style/resultpage.scss';
 @import './es/packages/row/style/row.scss';
-@import './es/packages/range/style/range.scss';
+@import './es/packages/resultpage/style/resultpage.scss';
 @import './es/packages/rate/style/rate.scss';
+@import './es/packages/range/style/range.scss';
+@import './es/packages/radiogroup/style/radiogroup.scss';
 @import './es/packages/radio/style/radio.scss';
 @import './es/packages/pulltorefresh/style/pulltorefresh.scss';
+@import './es/packages/progress/style/progress.scss';
 @import './es/packages/price/style/price.scss';
-@import './es/packages/radiogroup/style/radiogroup.scss';
 @import './es/packages/popup/style/popup.scss';
-@import './es/packages/popover/style/popover.scss';
 @import './es/packages/picker/style/picker.scss';
-@import './es/packages/progress/style/progress.scss';
-@import './es/packages/numberkeyboard/style/numberkeyboard.scss';
+@import './es/packages/popover/style/popover.scss';
 @import './es/packages/pagination/style/pagination.scss';
-@import './es/packages/notify/style/notify.scss';
 @import './es/packages/overlay/style/overlay.scss';
 @import './es/packages/noticebar/style/noticebar.scss';
+@import './es/packages/notify/style/notify.scss';
+@import './es/packages/numberkeyboard/style/numberkeyboard.scss';
 @import './es/packages/navbar/style/navbar.scss';
-@import './es/packages/menu/style/menu.scss';
 @import './es/packages/menuitem/style/menuitem.scss';
-@import './es/packages/layout/style/layout.scss';
 @import './es/packages/lottie/style/lottie.scss';
-@import './es/packages/loading/style/loading.scss';
+@import './es/packages/menu/style/menu.scss';
 @import './es/packages/input/style/input.scss';
+@import './es/packages/layout/style/layout.scss';
+@import './es/packages/loading/style/loading.scss';
 @import './es/packages/inputnumber/style/inputnumber.scss';
-@import './es/packages/infiniteloading/style/infiniteloading.scss';
-@import './es/packages/indicator/style/indicator.scss';
-@import './es/packages/hoverbuttonitem/style/hoverbuttonitem.scss';
 @import './es/packages/imagepreview/style/imagepreview.scss';
+@import './es/packages/indicator/style/indicator.scss';
+@import './es/packages/infiniteloading/style/infiniteloading.scss';
 @import './es/packages/image/style/image.scss';
-@import './es/packages/hoverbutton/style/hoverbutton.scss';
 @import './es/packages/griditem/style/griditem.scss';
-@import './es/packages/empty/style/empty.scss';
-@import './es/packages/form/style/form.scss';
+@import './es/packages/hoverbuttonitem/style/hoverbuttonitem.scss';
+@import './es/packages/hoverbutton/style/hoverbutton.scss';
+@import './es/packages/grid/style/grid.scss';
 @import './es/packages/formitem/style/formitem.scss';
 @import './es/packages/fixednav/style/fixednav.scss';
+@import './es/packages/form/style/form.scss';
+@import './es/packages/empty/style/empty.scss';
+@import './es/packages/elevator/style/elevator.scss';
 @import './es/packages/ellipsis/style/ellipsis.scss';
 @import './es/packages/drag/style/drag.scss';
 @import './es/packages/divider/style/divider.scss';
-@import './es/packages/grid/style/grid.scss';
 @import './es/packages/dialog/style/dialog.scss';
-@import './es/packages/elevator/style/elevator.scss';
 @import './es/packages/datepicker/style/datepicker.scss';
 @import './es/packages/countup/style/countup.scss';
 @import './es/packages/countdown/style/countdown.scss';
 @import './es/packages/configprovider/style/configprovider.scss';
+@import './es/packages/collapse/style/collapse.scss';
 @import './es/packages/collapseitem/style/collapseitem.scss';
 @import './es/packages/col/style/col.scss';
-@import './es/packages/collapse/style/collapse.scss';
-@import './es/packages/checkboxgroup/style/checkboxgroup.scss';
 @import './es/packages/circleprogress/style/circleprogress.scss';
-@import './es/packages/cell/style/cell.scss';
 @import './es/packages/cellgroup/style/cellgroup.scss';
-@import './es/packages/card/style/card.scss';
+@import './es/packages/checkboxgroup/style/checkboxgroup.scss';
 @import './es/packages/checkbox/style/checkbox.scss';
+@import './es/packages/cell/style/cell.scss';
+@import './es/packages/cascader/style/cascader.scss';
 @import './es/packages/calendaritem/style/calendaritem.scss';
+@import './es/packages/card/style/card.scss';
 @import './es/packages/calendarcard/style/calendarcard.scss';
-@import './es/packages/cascader/style/cascader.scss';
-@import './es/packages/barrage/style/barrage.scss';
-@import './es/packages/badge/style/badge.scss';
 @import './es/packages/button/style/button.scss';
+@import './es/packages/barrage/style/barrage.scss';
 @import './es/packages/calendar/style/calendar.scss';
-@import './es/packages/avatar/style/avatar.scss';
+@import './es/packages/badge/style/badge.scss';
 @import './es/packages/backtop/style/backtop.scss';
-@import './es/packages/avatarcropper/style/avatarcropper.scss';
 @import './es/packages/avatargroup/style/avatargroup.scss';
+@import './es/packages/avatar/style/avatar.scss';
+@import './es/packages/avatarcropper/style/avatarcropper.scss';
+@import './es/packages/address/style/address.scss';
 @import './es/packages/animate/style/animate.scss';
 @import './es/packages/audio/style/audio.scss';
-@import './es/packages/animatingnumbers/style/animatingnumbers.scss';
-@import './es/packages/address/style/address.scss';
-@import './es/packages/actionsheet/style/actionsheet.scss';
+@import './es/packages/actionsheet/style/actionsheet.scss';
+@import './es/packages/animatingnumbers/style/animatingnumbers.scss';

package/dist/styles/variables.scss

@@ -1,20 +1,32 @@
 // ----------------------------------------------------
 // 主色调 // done
-$color-primary: var(--nutui-brand-6) !default;
+$color-primary: var(--nutui-color-primary, #ff0f23) !default;
 $color-primary-stop-1: var(--nutui-color-primary-stop-1, #ff475d) !default;
 $color-primary-stop-2: var(--nutui-color-primary-stop-2, #ff0f23) !default;
 $color-primary-pressed: var(--nutui-color-primary-pressed, #e53029) !default;
 $color-primary-disabled: var(--nutui-color-primary-disabled, #c2c4cc) !default;
-$color-primary-disabled-special: var(--nutui-brand-3) !default;
-$color-primary-light-pressed: var(--nutui-brand-1) !default;
+$color-primary-disabled-special: var(
+  --nutui-color-primary-disabled-special,
+  #ffadbe
+) !default;
+$color-primary-light-pressed: var(
+  --nutui-color-primary-light-pressed,
+  #ffebf1
+) !default;
 $color-primary-gradient-1: linear-gradient(
   135deg,
   $color-primary-stop-1 0%,
   $color-primary-stop-2 100%
 ) !default;
-$color-primary-icon: var(--nutui-red-6) !default;
-$color-primary-icon-disabled: var(--nutui-gray-8) !default;
-$color-primary-specialdisabled: var(--nutui-red-3) !default;
+$color-primary-icon: var(--nutui-color-primary-icon, #ff3333) !default;
+$color-primary-icon-disabled: var(
+  --nutui-color-primary-icon-disabled,
+  #dadce0
+) !default;
+$color-primary-specialdisabled: var(
+  --nutui-color-primary-specialdisabled,
+  #ffadbe
+) !default;
 
 // 默认色
 $color-default: var(--nutui-color-default) !default;
@@ -34,61 +46,91 @@ $color-info-background: var(
 $color-info-text: var(--nutui-color-info, #0073ff) !default; // done
 
 // 成功色
-$color-success: var(--nutui-green-2) !default; // done
-$color-success-pressed: var(--nutui-green-3) !default; // done
+$color-success: var(--nutui-color-success, #00d900) !default; // done
+$color-success-pressed: var(
+  --nutui-color-success-pressed,
+  #2aa32a
+) !default; // done
 $color-success-disabled: var(--nutui-color-success-disabled, #b2f0ae) !default;
-$color-success-light: var(--nutui-green-1) !default; // done
-$color-success-background: var(--nutui-green-2) !default; // done
-$color-success-text: var(--nutui-green-3) !default; // done
+$color-success-light: var(
+  --nutui-color-success-light,
+  #ebfbeb
+) !default; // done
+$color-success-background: var(
+  --nutui-color-success-background,
+  #00d900
+) !default; // done
+$color-success-text: var(--nutui-color-success-text, #2aa32a) !default; // done
 
 // 警告色
-$color-warning: var(--nutui-yellow-2) !default; // done
-$color-warning-pressed: var(--nutui-yellow-3) !default; // done
+$color-warning: var(--nutui-color-warning, #ffbf00) !default; // done
+$color-warning-pressed: var(
+  --nutui-color-warning-pressed,
+  #c47600
+) !default; // done
 $color-warning-disabled: var(--nutui-color-warning-disabled, #fdd3b9) !default;
-$color-warning-light: var(--nutui-yellow-1) !default; // done
-$color-warning-background: var(--nutui-yellow-2) !default; // done
-$color-warning-text: var(--nutui-yellow-3) !default; // done
+$color-warning-light: var(
+  --nutui-color-warning-light,
+  #fff5cc
+) !default; // done
+$color-warning-background: var(
+  --nutui-color-warning-background,
+  #ffbf00
+) !default; // done
+$color-warning-text: var(--nutui-color-warning-text, #c47600) !default; // done
 
 // 危险色
-$color-danger: var(--nutui-red-2) !default; //done
-$color-danger-pressed: var(--nutui-color-danger-pressed) !default;
+$color-danger: var(--nutui-color-danger, #ff0f23) !default; //done
+$color-danger-pressed: var(--nutui-color-danger-pressed, #ff3333) !default;
 $color-danger-disabled: var(
   --nutui-color-danger-disabled,
   $color-primary-disabled-special
 ) !default;
-$color-danger-light: var(--nutui-red-1) !default; //done
-$color-danger-background: var(--nutui-color-danger-background) !default; //done
-$color-danger-text: var(--nutui-red-2) !default; //done
+$color-danger-light: var(--nutui-color-danger-light, #ffebef) !default; //done
+$color-danger-background: var(
+  --nutui-color-danger-background,
+  #ff0f23
+) !default; //done
+$color-danger-text: var(--nutui-color-danger-text, #ff0f23) !default; //done
 
 // 背景色
-$color-background: var(--nutui-gray-3) !default; //done
+$color-background: var(--nutui-color-background, #f2f3f5) !default; //done
 // 卡片背景色
-$color-background-overlay: var(--nutui-gray-1) !default;
+$color-background-overlay: var(
+  --nutui-color-background-overlay,
+  #ffffff
+) !default;
 // 卡片内嵌背景色
 $color-background-sunken: var(
   --nutui-color-background-sunken,
-  var(--nutui-gray-2)
+  #f7f8fc
 ) !default;
 
 // 蒙层颜色
 // 页面全局蒙层
-$color-mask: var(--nutui-black-10) !default;
+$color-mask: var(--nutui-color-mask, rgba(0, 0, 0, 0.7)) !default;
 // 局部蒙层
-$color-mask-part: var(--nutui-black-7) !default;
+$color-mask-part: var(--nutui-color-mask-part, rgba(0, 0, 0, 0.4)) !default;
 // 容错蒙层
-$color-mask-fault-toleran: var(--nutui-black-2) !default;
+$color-mask-fault-toleran: var(
+  --nutui-color-mask-fault-toleran,
+  rgba(0, 0, 0, 0.02)
+) !default;
 
 // 边框色
-$color-border: var(--nutui-black-3) !default;
-$color-border-disabled: var(--nutui-gray-4) !default;
+$color-border: var(--nutui-color-border, rgba(0, 0, 0, 0.06)) !default;
+$color-border-disabled: var(--nutui-color-border-disabled, #c2c4cc) !default;
 
 // 文本色
-$color-title: var(--nutui-gray-7) !default;
-$color-text: var(--nutui-gray-6) !default;
-$color-text-help: var(--nutui-gray-5) !default;
-$color-text-disabled: var(--nutui-gray-4) !default;
-$color-text-dark: var(--nutui-white-12) !default;
-$color-text-link: var(--nutui-blue-2) !default;
+$color-title: var(--nutui-color-title, #1a1a1a) !default;
+$color-text: var(--nutui-color-text, #505259) !default;
+$color-text-help: var(--nutui-color-text-help, #888b94) !default;
+$color-text-disabled: var(--nutui-color-text-disabled, #c2c4cc) !default;
+$color-text-dark: var(
+  --nutui-color-text-dark,
+  rgba(255, 255, 255, 0.9)
+) !default;
+$color-text-link: var(--nutui-color-text-link, #0073ff) !default;
 
 // 与品牌色一起使用，默认为白色，不区分暗黑与明亮模式。
 $color-primary-text: #ffffff !default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nutui/nutui-react",
-  "version": "3.0.0-beta.10",
+  "version": "3.0.0-beta.12",
   "style": "dist/style.css",
   "main": "dist/nutui.react.umd.js",
   "module": "dist/es/packages/nutui.react.build.js",
@@ -61,7 +61,7 @@
     "@use-gesture/react": "10.2.20",
     "async-validator": "^4.2.5",
     "classnames": "^2.5.1",
-    "lodash.isequal": "^4.5.0",
+    "react-fast-compare": "^3.2.2",
     "lodash.kebabcase": "^4.1.1",
     "lottie-miniprogram": "^1.0.12",
     "lottie-react": "^2.4.0",

package/dist/cjs/packages/dialog/config.d.ts

@@ -1,50 +0,0 @@
-import { ReactNode, ForwardRefExoticComponent, PropsWithChildren } from 'react';
-import type { MouseEvent } from 'react';
-import { BasicComponent } from "../../utils/typings";
-export type DialogConfigType = {
-    prefixCls?: string;
-    simple?: boolean;
-};
-export type DialogCloseIconPosition = 'top-right' | 'top-left' | 'bottom';
-export interface DialogBasicProps extends BasicComponent {
-    visible?: boolean;
-    title?: ReactNode;
-    content?: ReactNode;
-    header?: ReactNode;
-    footer?: ReactNode;
-    confirmText?: ReactNode;
-    cancelText?: ReactNode;
-    overlay?: boolean;
-    hideConfirmButton?: boolean;
-    hideCancelButton?: boolean;
-    disableConfirmButton?: boolean;
-    closeOnOverlayClick?: boolean;
-    footerDirection?: string;
-    lockScroll?: boolean;
-    closeIconPosition?: DialogCloseIconPosition;
-    closeIcon?: boolean | ReactNode;
-    beforeClose?: () => boolean;
-    beforeCancel?: () => boolean;
-    onClose?: () => void;
-    onConfirm?: (e?: MouseEvent<HTMLButtonElement>) => PromiseLike<any> | void;
-    onCancel?: () => void;
-    onClick?: () => void;
-    onOverlayClick?: () => void;
-}
-export type DialogReturnProps = {
-    update: (newConfig: DialogConfirmProps) => void;
-    close: () => void;
-};
-export interface DialogConfirmProps extends DialogBasicProps {
-    content?: ReactNode;
-    icon?: ReactNode | null;
-    isNotice?: boolean;
-    noticeType?: string;
-}
-export interface DialogComponent extends ForwardRefExoticComponent<PropsWithChildren<DialogBasicProps>> {
-    confirm: (props: DialogConfirmProps) => DialogReturnProps;
-    alert: (props: DialogConfirmProps) => DialogReturnProps;
-    config: (config: DialogConfigType) => void;
-    destroyAll: () => void;
-}
-export declare const destroyList: Array<() => void>;

package/dist/es/packages/dialog/config.d.ts

@@ -1,50 +0,0 @@
-import { ReactNode, ForwardRefExoticComponent, PropsWithChildren } from 'react';
-import type { MouseEvent } from 'react';
-import { BasicComponent } from "../../utils/typings";
-export type DialogConfigType = {
-    prefixCls?: string;
-    simple?: boolean;
-};
-export type DialogCloseIconPosition = 'top-right' | 'top-left' | 'bottom';
-export interface DialogBasicProps extends BasicComponent {
-    visible?: boolean;
-    title?: ReactNode;
-    content?: ReactNode;
-    header?: ReactNode;
-    footer?: ReactNode;
-    confirmText?: ReactNode;
-    cancelText?: ReactNode;
-    overlay?: boolean;
-    hideConfirmButton?: boolean;
-    hideCancelButton?: boolean;
-    disableConfirmButton?: boolean;
-    closeOnOverlayClick?: boolean;
-    footerDirection?: string;
-    lockScroll?: boolean;
-    closeIconPosition?: DialogCloseIconPosition;
-    closeIcon?: boolean | ReactNode;
-    beforeClose?: () => boolean;
-    beforeCancel?: () => boolean;
-    onClose?: () => void;
-    onConfirm?: (e?: MouseEvent<HTMLButtonElement>) => PromiseLike<any> | void;
-    onCancel?: () => void;
-    onClick?: () => void;
-    onOverlayClick?: () => void;
-}
-export type DialogReturnProps = {
-    update: (newConfig: DialogConfirmProps) => void;
-    close: () => void;
-};
-export interface DialogConfirmProps extends DialogBasicProps {
-    content?: ReactNode;
-    icon?: ReactNode | null;
-    isNotice?: boolean;
-    noticeType?: string;
-}
-export interface DialogComponent extends ForwardRefExoticComponent<PropsWithChildren<DialogBasicProps>> {
-    confirm: (props: DialogConfirmProps) => DialogReturnProps;
-    alert: (props: DialogConfirmProps) => DialogReturnProps;
-    config: (config: DialogConfigType) => void;
-    destroyAll: () => void;
-}
-export declare const destroyList: Array<() => void>;