@nutui/nutui-react 2.0.0-alpha.8 → 2.0.0-alpha.9

package/dist/style.mjs

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.0.0-alpha.8 Fri May 12 2023 19:08:00 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.9 Wed May 17 2023 18:23:19 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */

package/dist/styles/variables-jmapp.scss

@@ -673,22 +673,18 @@ $numberkeyboard-key-font-color: var(
   --nutui-numberkeyboard-key-font-color,
   #333
 ) !default;
-$numberkeyboard-key-finish-font-size: var(
-  --nutui-numberkeyboard-key-finish-font-size,
+$numberkeyboard-key-confirm-font-size: var(
+  --nutui-numberkeyboard-key-confirm-font-size,
   16px
 ) !default;
-$numberkeyboard-key-finish-font-color: var(
-  --nutui-numberkeyboard-key-finish-font-color,
+$numberkeyboard-key-confirm-font-color: var(
+  --nutui-numberkeyboard-key-confirm-font-color,
   #fff
 ) !default;
-$numberkeyboard-key-finish-background-color: var(
-  --nutui-numberkeyboard-key-finish-background-color,
+$numberkeyboard-key-confirm-background-color: var(
+  --nutui-numberkeyboard-key-confirm-background-color,
   #1989fa
 ) !default;
-$numberkeyboard-key-activeFinsh-background-color: var(
-  --nutui-numberkeyboard-key-activeFinsh-background-color,
-  #0570db
-) !default;
 
 // countdown（✅）
 $countdown-display: var(--nutui-countdown-display, flex) !default;
@@ -696,11 +692,17 @@ $countdown-color: var(--nutui-countdown-color, inherit) !default;
 $countdown-font-size: var(--nutui-countdown-font-size, initial) !default;
 
 //large price（✅）
+$price-symbol-padding-right: var(
+  --nutui-price-symbol-padding-right,
+  1px
+) !default;
 $price-symbol-big-size: var(--nutui-price-symbol-big-size, 18px) !default;
 $price-integer-big-size: var(--nutui-price-integer-big-size, 24px) !default;
 $price-decimal-big-size: var(--nutui-price-decimal-big-size, 18px) !default;
 
 //normal price（✅）
+$price-line-color: var(--nutui-price-line-color, $gray2) !default;
+$price-line-font-size: var(--nutui-price-line-font-size, 12px) !default;
 $price-symbol-medium-size: var(--nutui-price-symbol-medium-size, 14px) !default;
 $price-integer-medium-size: var(
   --nutui-price-integer-medium-size,
@@ -830,31 +832,31 @@ $notify-padding: var(--nutui-notify-padding, 12px 0) !default;
 $notify-font-size: var(--nutui-notify-font-size, 14px) !default;
 $notify-height: var(--nutui-notify-height, 44px) !default;
 $notify-line-height: var(--nutui-notify-line-height, auto) !default;
-$notify-base-background-color: linear-gradient(
-  135deg,
-  $primary-color 0%,
-  $primary-color-end 100%
+$notify-base-background-color: var(
+  --nutui-notify-base-background-color,
+  linear-gradient(135deg, $primary-color 0%, $primary-color-end 100%)
 ) !default;
-$notify-primary-background-color: linear-gradient(
-  315deg,
-  rgba(73, 143, 242, 1) 0%,
-  rgba(73, 101, 242, 1) 100%
+$notify-primary-background-color: var(
+  --nutui-notify-primary-background-color,
+  linear-gradient(315deg, rgba(73, 143, 242, 1) 0%, rgba(73, 101, 242, 1) 100%)
 ) !default;
-$notify-success-background-color: linear-gradient(
-  135deg,
-  rgba(38, 191, 38, 1) 0%,
-  rgba(39, 197, 48, 1) 45%,
-  rgba(40, 207, 63, 1) 83%,
-  rgba(41, 212, 70, 1) 100%
+$notify-success-background-color: var(
+  --nutui-notify-success-background-color,
+  linear-gradient(
+    135deg,
+    rgba(38, 191, 38, 1) 0%,
+    rgba(39, 197, 48, 1) 45%,
+    rgba(40, 207, 63, 1) 83%,
+    rgba(41, 212, 70, 1) 100%
+  )
 ) !default;
 $notify-danger-background-color: var(
   --nutui-notify-danger-background-color,
   rgba(250, 50, 25, 1)
 ) !default;
-$notify-warning-background-color: linear-gradient(
-  135deg,
-  rgba(255, 93, 13, 1) 0%,
-  rgba(255, 154, 13, 1) 100%
+$notify-warning-background-color: var(
+  --nutui-notify-warning-background-color,
+  linear-gradient(135deg, rgba(255, 93, 13, 1) 0%, rgba(255, 154, 13, 1) 100%)
 ) !default;
 
 // rate（✅）
@@ -916,22 +918,6 @@ $swiper-pagination-item-background-color: var(
   --nutui-swiper-pagination-item-background-color,
   #ddd
 ) !default;
-$swiper-pagination-item-width: var(
-  --nutui-swiper-pagination-item-width,
-  8px
-) !default;
-$swiper-pagination-item-height: var(
-  --nutui-swiper-pagination-item-height,
-  3px
-) !default;
-$swiper-pagination-item-margin-right: var(
-  --nutui-swiper-pagination-item-margin-right,
-  7px
-) !default;
-$swiper-pagination-item-border-radius: var(
-  --nutui-swiper-pagination-item-border-radius,
-  2px
-) !default;
 
 //address
 $address-region-tab-line: linear-gradient(
@@ -1226,6 +1212,26 @@ $radio-icon-disable-color2: var(
   --nutui-radio-icon-disable-color2,
   $gray3
 ) !default;
+$radiogroup-radio-margin: var(
+  --nutui-radiogroup-radio-margin,
+  0 20px 5px 0
+) !default;
+$radiogroup-radio-label-margin: var(
+  --nutui-radiogroup-radio-label-margin,
+  0 5px 0 5px
+) !default;
+$radio-button-disabled-active-background: var(
+  --nutui-radio-button-disabled-active-background,
+  rgba(0, 0, 0, 0.15)
+) !default;
+$radio-button-disabled-active-color: var(
+  --nutui-radio-button-disabled-active-color,
+  rgba(0, 0, 0, 0.25)
+) !default;
+$radio-button-disabled-active-border-color: var(
+  --nutui-radio-button-disabled-active-border-color,
+  rgba(211, 211, 211, 0.15)
+) !default;
 
 // signature（✅）
 $signature-border-color: #dadada;

package/dist/styles/variables.scss

@@ -656,20 +656,16 @@ $numberkeyboard-key-font-color: var(
   --nutui-numberkeyboard-key-font-color,
   #333
 ) !default;
-$numberkeyboard-key-finish-font-size: var(
-  --nutui-numberkeyboard-key-finish-font-size,
+$numberkeyboard-key-confirm-font-size: var(
+  --nutui-numberkeyboard-key-confirm-font-size,
   16px
 ) !default;
-$numberkeyboard-key-finish-font-color: var(
-  --nutui-numberkeyboard-key-finish-font-color,
+$numberkeyboard-key-confirm-font-color: var(
+  --nutui-numberkeyboard-key-confirm-font-color,
   #fff
 ) !default;
-$numberkeyboard-key-finish-background-color: var(
-  --nutui-numberkeyboard-key-finish-background-color,
-  $brand-color
-) !default;
-$numberkeyboard-key-activeFinsh-background-color: var(
-  --nutui-numberkeyboard-key-activeFinsh-background-color,
+$numberkeyboard-key-confirm-background-color: var(
+  --nutui-numberkeyboard-key-confirm-background-color,
   $brand-color
 ) !default;
 
@@ -679,11 +675,17 @@ $countdown-color: var(--nutui-countdown-color, inherit) !default;
 $countdown-font-size: var(--nutui-countdown-font-size, initial) !default;
 
 //large price（✅）
+$price-symbol-padding-right: var(
+  --nutui-price-symbol-padding-right,
+  1px
+) !default;
 $price-symbol-big-size: var(--nutui-price-symbol-big-size, 18px) !default;
 $price-integer-big-size: var(--nutui-price-integer-big-size, 24px) !default;
 $price-decimal-big-size: var(--nutui-price-decimal-big-size, 18px) !default;
 
 //normal price（✅）
+$price-line-color: var(--nutui-price-line-color, $gray2) !default;
+$price-line-font-size: var(--nutui-price-line-font-size, 12px) !default;
 $price-symbol-medium-size: var(--nutui-price-symbol-medium-size, 14px) !default;
 $price-integer-medium-size: var(
   --nutui-price-integer-medium-size,
@@ -814,33 +816,31 @@ $notify-padding: var(--nutui-notify-padding, 12px 0) !default;
 $notify-font-size: var(--nutui-notify-font-size, 14px) !default;
 $notify-height: var(--nutui-notify-height, 44px) !default;
 $notify-line-height: var(--nutui-notify-line-height, auto) !default;
-$notify-base-background-color: linear-gradient(
-  135deg,
-  rgba(250, 44, 25, 1) 0%,
-  rgba(250, 63, 25, 1) 45%,
-  rgba(250, 89, 25, 1) 83%,
-  rgba(250, 100, 25, 1) 100%
+$notify-base-background-color: var(
+  --nutui-notify-base-background-color,
+  linear-gradient(135deg, $primary-color 0%, $primary-color-end 100%)
 ) !default;
-$notify-primary-background-color: linear-gradient(
-  315deg,
-  rgba(73, 143, 242, 1) 0%,
-  rgba(73, 101, 242, 1) 100%
+$notify-primary-background-color: var(
+  --nutui-notify-primary-background-color,
+  linear-gradient(315deg, rgba(73, 143, 242, 1) 0%, rgba(73, 101, 242, 1) 100%)
 ) !default;
-$notify-success-background-color: linear-gradient(
-  135deg,
-  rgba(38, 191, 38, 1) 0%,
-  rgba(39, 197, 48, 1) 45%,
-  rgba(40, 207, 63, 1) 83%,
-  rgba(41, 212, 70, 1) 100%
+$notify-success-background-color: var(
+  --nutui-notify-success-background-color,
+  linear-gradient(
+    135deg,
+    rgba(38, 191, 38, 1) 0%,
+    rgba(39, 197, 48, 1) 45%,
+    rgba(40, 207, 63, 1) 83%,
+    rgba(41, 212, 70, 1) 100%
+  )
 ) !default;
 $notify-danger-background-color: var(
   --nutui-notify-danger-background-color,
   rgba(250, 50, 25, 1)
 ) !default;
-$notify-warning-background-color: linear-gradient(
-  135deg,
-  rgba(255, 93, 13, 1) 0%,
-  rgba(255, 154, 13, 1) 100%
+$notify-warning-background-color: var(
+  --nutui-notify-warning-background-color,
+  linear-gradient(135deg, rgba(255, 93, 13, 1) 0%, rgba(255, 154, 13, 1) 100%)
 ) !default;
 
 // rate（✅）
@@ -902,22 +902,6 @@ $swiper-pagination-item-background-color: var(
   --nutui-swiper-pagination-item-background-color,
   #ddd
 ) !default;
-$swiper-pagination-item-width: var(
-  --nutui-swiper-pagination-item-width,
-  8px
-) !default;
-$swiper-pagination-item-height: var(
-  --nutui-swiper-pagination-item-height,
-  3px
-) !default;
-$swiper-pagination-item-margin-right: var(
-  --nutui-swiper-pagination-item-margin-right,
-  7px
-) !default;
-$swiper-pagination-item-border-radius: var(
-  --nutui-swiper-pagination-item-border-radius,
-  2px
-) !default;
 
 //address
 $address-region-tab-line: linear-gradient(
@@ -1220,6 +1204,26 @@ $radio-icon-disable-color2: var(
   --nutui-radio-icon-disable-color2,
   $gray3
 ) !default;
+$radiogroup-radio-margin: var(
+  --nutui-radiogroup-radio-margin,
+  0 20px 5px 0
+) !default;
+$radiogroup-radio-label-margin: var(
+  --nutui-radiogroup-radio-label-margin,
+  0 5px 0 5px
+) !default;
+$radio-button-disabled-active-background: var(
+  --nutui-radio-button-disabled-active-background,
+  rgba(0, 0, 0, 0.15)
+) !default;
+$radio-button-disabled-active-color: var(
+  --nutui-radio-button-disabled-active-color,
+  rgba(0, 0, 0, 0.25)
+) !default;
+$radio-button-disabled-active-border-color: var(
+  --nutui-radio-button-disabled-active-border-color,
+  rgba(211, 211, 211, 0.15)
+) !default;
 
 // signature（✅）
 $signature-border-color: #dadada;

package/dist/types/index.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from 'react';
-import React__default, { CSSProperties, ReactNode, FunctionComponent, MouseEvent as MouseEvent$1, MouseEventHandler, HTMLInputTypeAttribute, ChangeEvent, FocusEvent, RefObject, ForwardRefExoticComponent, PropsWithChildren, Component, ReactEventHandler } from 'react';
+import React__default, { CSSProperties, ReactNode, FunctionComponent, MouseEvent as MouseEvent$1, HTMLInputTypeAttribute, ChangeEvent, FocusEvent, RefObject, ForwardRefExoticComponent, PropsWithChildren, Component, ReactEventHandler } from 'react';
 
 interface BasicComponent {
     className?: string;
@@ -299,6 +299,7 @@ interface ElevatorProps extends BasicComponent {
     sticky: boolean;
     spaceHeight: number;
     titleHeight: number;
+    showKeys: boolean;
     children: React__default.ReactNode;
     onClickItem: (key: string, item: ElevatorData) => void;
     onClickIndex: (key: string) => void;
@@ -630,7 +631,7 @@ interface RadioGroupOptionType {
     label: string;
     value: string;
     disabled?: boolean;
-    onChange?: MouseEventHandler<HTMLDivElement>;
+    onChange?: (checked: boolean) => void;
 }
 
 type CheckboxLabelPosition = 'left' | 'right';
@@ -892,22 +893,39 @@ interface MenuItemProps extends BasicComponent {
 }
 declare const MenuItem: React__default.ForwardRefExoticComponent<Partial<MenuItemProps> & React__default.RefAttributes<unknown>>;
 
-interface NumberKeyboardProps {
-    confirmText: string;
-    title: string;
-    visible: boolean;
+type Teleport = HTMLElement | (() => HTMLElement) | null;
+interface PopupProps extends OverlayProps {
+    position: string;
+    transition: string;
+    overlayStyle: React__default.CSSProperties;
+    overlayClassName: string;
+    closeable: boolean;
+    closeIconPosition: string;
+    closeIcon: React__default.ReactNode;
+    destroyOnClose: boolean;
+    portal: Teleport;
     overlay: boolean;
-    type: string;
-    customKey: Array<string>;
-    randomKeys: boolean;
-    popClass: string;
-    className: string;
-    style?: CSSProperties;
+    round: boolean;
+    onOpen: () => void;
+    onClose: () => void;
+    onClickOverlay: (e: MouseEvent$1) => boolean | void;
+    onClickCloseIcon: (e: MouseEvent$1) => boolean | void;
+}
+declare const Popup: FunctionComponent<Partial<PopupProps> & React__default.HTMLAttributes<HTMLDivElement>>;
+
+interface NumberKeyboardProps extends PopupProps {
+    visible: boolean;
+    title?: ReactNode;
+    confirmText?: string;
+    type: 'default' | 'rightColumn';
+    custom: Array<string>;
+    random: boolean;
     onChange?: (value: string) => void;
     onDelete?: () => void;
     onClose: () => void;
+    onConfirm?: () => void;
 }
-declare const NumberKeyboard: FunctionComponent<Partial<NumberKeyboardProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onChange'>>;
+declare const NumberKeyboard: FunctionComponent<Partial<NumberKeyboardProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onChange' | 'onClick' | 'title'>>;
 
 interface PickerOption {
     text: string | number;
@@ -935,31 +953,31 @@ declare const Picker: React__default.ForwardRefExoticComponent<Partial<PickerPro
 type Position$1 = 'left' | 'right';
 type Direction$1 = 'horizontal' | 'vertical';
 interface RadioGroupProps {
-    value: string | number | boolean | null;
-    textPosition: Position$1;
+    value?: string | number;
+    defaultValue?: string | number;
+    labelPosition: Position$1;
     direction: Direction$1;
-    onChange: (value: string | number | boolean) => void;
+    disabled?: boolean;
     options: RadioGroupOptionType[];
+    onChange: (value: string | number) => void;
 }
 declare const RadioGroup: React__default.ForwardRefExoticComponent<Partial<RadioGroupProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, "onChange"> & React__default.RefAttributes<unknown>>;
 
 type Shape = 'button' | 'round';
 type Position = 'right' | 'left';
 interface RadioProps extends BasicComponent {
-    className: string;
-    style: React__default.CSSProperties;
     disabled: boolean;
     checked: boolean;
+    defaultChecked: boolean;
     shape: Shape;
-    textPosition: Position;
-    value: string | number | boolean;
+    labelPosition: Position;
     icon: React__default.ReactNode;
-    checkedIcon: React__default.ReactNode;
-    iconSize: string | number;
-    onChange: MouseEventHandler<HTMLDivElement>;
+    activeIcon: React__default.ReactNode;
+    value: string | number;
+    onChange: (checked: boolean) => void;
 }
-declare const Radio: FunctionComponent<Partial<RadioProps> & React__default.HTMLAttributes<HTMLDivElement>> & {
-    RadioGroup: typeof RadioGroup;
+declare const Radio: FunctionComponent<Partial<RadioProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onChange'>> & {
+    Group: typeof RadioGroup;
 };
 
 type RangeValue = number | number[];
@@ -1348,24 +1366,20 @@ interface NoticeBarProps extends BasicComponent {
 }
 declare const NoticeBar: FunctionComponent<Partial<NoticeBarProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onClick'>>;
 
-interface NotifyProps {
+interface NotifyProps extends BasicComponent {
     id: string;
-    color?: string;
-    msg: string;
     duration: number;
-    className?: string;
-    background?: string;
     type: string;
     position: string;
     onClick: () => void;
-    onClosed: () => void;
+    onClose: () => void;
 }
 declare const _default$1: {
-    text(msg: string | React$1.ReactNode, option?: {}): void;
-    success(msg: string | React$1.ReactNode, option?: {}): void;
-    primary(msg: string | React$1.ReactNode, option?: {}): void;
-    danger(msg: string | React$1.ReactNode, option?: {}): void;
-    warn(msg: string | React$1.ReactNode, option?: {}): void;
+    text(message: string | React$1.ReactNode, option?: {}): void;
+    success(message: string | React$1.ReactNode, option?: {}): void;
+    primary(message: string | React$1.ReactNode, option?: {}): void;
+    danger(message: string | React$1.ReactNode, option?: {}): void;
+    warn(message: string | React$1.ReactNode, option?: {}): void;
     hide(): void;
 };
 
@@ -1391,9 +1405,7 @@ interface PopoverProps extends BasicComponent {
 declare const Popover: FunctionComponent<Partial<PopoverProps> & React__default.HTMLAttributes<HTMLDivElement>>;
 
 type PullStatus = 'pulling' | 'canRelease' | 'refreshing' | 'complete';
-interface PullToRefreshProps {
-    className: string;
-    style: React__default.CSSProperties;
+interface PullToRefreshProps extends BasicComponent {
     onRefresh: () => Promise<any>;
     pullingText: ReactNode;
     canReleaseText: ReactNode;
@@ -1404,7 +1416,6 @@ interface PullToRefreshProps {
     threshold: number;
     disabled: boolean;
     renderText: (status: PullStatus) => ReactNode;
-    children: React__default.ReactNode;
 }
 declare const PullToRefresh: FunctionComponent<Partial<PullToRefreshProps>>;
 
@@ -1465,26 +1476,6 @@ interface SwipeProps {
 }
 declare const Swipe: React__default.ForwardRefExoticComponent<Partial<SwipeProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, "onTouchEnd" | "onTouchMove" | "onTouchStart"> & React__default.RefAttributes<SwipeInstance>>;
 
-type Teleport = HTMLElement | (() => HTMLElement) | null;
-interface PopupProps extends OverlayProps {
-    position: string;
-    transition: string;
-    overlayStyle: React__default.CSSProperties;
-    overlayClassName: string;
-    closeable: boolean;
-    closeIconPosition: string;
-    closeIcon: React__default.ReactNode;
-    destroyOnClose: boolean;
-    portal: Teleport;
-    overlay: boolean;
-    round: boolean;
-    onOpen: () => void;
-    onClose: () => void;
-    onClickOverlay: (e: MouseEvent$1) => boolean | void;
-    onClickCloseIcon: (e: MouseEvent$1) => boolean | void;
-}
-declare const Popup: FunctionComponent<Partial<PopupProps> & React__default.HTMLAttributes<HTMLDivElement>>;
-
 interface ToastProps {
     id?: string;
     msg: string;
@@ -1551,7 +1542,7 @@ declare class AnimatingNumbers extends Component<AnimatingNumbersProps, Animatin
 interface AudioProps extends BasicComponent {
     src: string;
     muted: boolean;
-    autoplay: boolean;
+    autoPlay: boolean;
     loop: boolean;
     preload: string;
     type: string;
@@ -1675,10 +1666,10 @@ interface ImagePreviewProps {
         };
     }>;
     show: boolean;
-    autoplay: number | string;
+    autoPlay: number | string;
     initNo: number;
     contentClose: boolean;
-    paginationVisible: boolean;
+    indicator: boolean;
     style?: CSSProperties;
     paginationColor: string;
     onClose: () => void;
@@ -1729,16 +1720,14 @@ interface PaginationProps extends BasicComponent {
 }
 declare const Pagination: FunctionComponent<Partial<PaginationProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onChange'>>;
 
-interface PriceProps {
+interface PriceProps extends BasicComponent {
     price: number | string;
-    needSymbol: boolean;
     symbol: string;
-    decimalDigits: number;
+    digits: number;
     thousands: boolean;
     position: string;
     size: string;
-    className: string;
-    style: React__default.CSSProperties;
+    line: boolean;
 }
 declare const Price: FunctionComponent<Partial<PriceProps>>;
 
@@ -1780,25 +1769,20 @@ type SwiperRef = {
     next: () => void;
     prev: () => void;
 };
-interface SwiperProps {
+interface SwiperProps extends BasicComponent {
     width: number | string;
     height: number | string;
     duration: number | string;
-    initPage: number | string;
+    defaultValue: number | string;
     autoPlay: number | string;
     direction: 'horizontal' | 'vertical';
-    paginationColor: string;
-    paginationBgColor: string;
-    paginationVisible: boolean;
+    indicator: ReactNode;
     loop: boolean;
     touchable: boolean;
-    isPreventDefault: boolean;
-    isStopPropagation: boolean;
-    isCenter: boolean;
-    className?: string;
-    style?: React__default.CSSProperties;
-    pageContent?: React__default.ReactNode;
-    onChange?: (currPage: number) => void;
+    preventDefault: boolean;
+    stopPropagation: boolean;
+    center: boolean;
+    onChange?: (current: number) => void;
 }
 declare const Swiper: React__default.ForwardRefExoticComponent<Partial<SwiperProps> & Omit<React__default.HTMLAttributes<HTMLDivElement>, "onChange"> & React__default.RefAttributes<SwiperRef>>;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nutui/nutui-react",
-  "version": "2.0.0-alpha.8",
+  "version": "2.0.0-alpha.9",
   "style": "dist/style.css",
   "main": "dist/nutui.react.umd.js",
   "module": "dist/esm/nutui-react.es.js",