@xhsreds/reds-rn-next 0.2.7 → 0.2.8

package/lib/src/components/TextView/styles.d.ts

@@ -0,0 +1,66 @@
+declare const createStyles: (disabled: boolean) => {
+    wrapper: {
+        display: "flex";
+        flexDirection: "column";
+        paddingVertical: number;
+        paddingHorizontal: number;
+        backgroundColor: string;
+    };
+    container: {
+        display: "flex";
+        flexDirection: "row";
+    };
+    input: {
+        flex: number;
+        borderWidth: number;
+        paddingTop: number;
+        fontSize: any;
+        fontWeight: any;
+        lineHeight: any;
+        color: string;
+        textAlignVertical: "top";
+    };
+    inputPlaceHolder: {
+        color: string;
+    };
+    inputSelectionColor: {
+        color: string;
+    };
+    clearIcon: {
+        color: string;
+        fontSize: any;
+        lineHeight: number;
+        fontWeight: any;
+        textAlign: "center";
+    };
+    clearIconContainer: {
+        width: number;
+        height: number;
+        borderRadius: number;
+        backgroundColor: string;
+    };
+    count: {
+        color: string;
+        fontSize: any;
+        fontWeight: any;
+        lineHeight: any;
+    };
+    centerItem: {
+        alignItems: "center";
+        justifyContent: "center";
+    };
+    rightItem: {
+        marginLeft: number;
+    };
+    leftItem: {
+        marginRight: number;
+    };
+    ButtomActionArea: {
+        flexDirection: "row";
+        height: number;
+        marginTop: number;
+        justifyContent: "flex-end";
+        alignItems: "center";
+    };
+};
+export default createStyles;

package/lib/src/components/Toast/api.d.ts

@@ -0,0 +1,10 @@
+import { RedsToast } from "./interface";
+declare const useToast: () => {
+    show: (props: RedsToast | string) => void;
+    remove: () => void;
+    error: (props: string | RedsToast) => void;
+    loading: (props: string | RedsToast) => void;
+    success: (props: string | RedsToast) => void;
+    progress: (props: string | RedsToast) => void;
+};
+export default useToast;

package/lib/src/components/Toast/interface/index.d.ts

@@ -0,0 +1,39 @@
+export declare const enum ToastBuiltInType {
+    SUCCESS = "success",
+    LOADING = "loading",
+    ERROR = "error",
+    PROGRESS = "progress",
+    TEXT = "text"
+}
+export declare const enum ToastPlacementType {
+    TOP = "top",
+    MIDDLE = "middle"
+}
+export interface RedsToast {
+    type?: ToastBuiltInType;
+    placement?: ToastPlacementType;
+    offset?: number[];
+    message?: string;
+    progressValue?: number;
+    mask?: boolean;
+    duration?: number;
+    zIndex?: string;
+    open?: boolean;
+    onCancel?: () => void;
+    onClick?: () => void;
+    onClose?: () => void;
+    icon?: any;
+}
+export interface RedsToastEvent {
+}
+export declare const ToastDefaultProps: {
+    type: ToastBuiltInType;
+    placement: ToastPlacementType;
+    offset: any[];
+    message: string;
+    progressValue: number;
+    mask: boolean;
+    duration: number;
+    zIndex: string;
+    open: boolean;
+};

package/lib/src/components/Toast/styles.d.ts

@@ -0,0 +1,73 @@
+import { RedsToast } from "./interface";
+export declare const animationStyle = "\n  opacity: 0;\n  animation: fade-in-out 2800ms ease-in-out;\n  @keyframes fade-in {\n    0% {\n      opacity: 0;\n    }\n    20% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n    }\n  }\n";
+export declare const getContainerStyle: (props: RedsToast) => {
+    borderRadius: number;
+    paddingVertical: number;
+    paddingHorizontal: number;
+    display: string;
+    justifyContent: string;
+    alignItems: string;
+    width: number;
+    height: number;
+} | {
+    borderRadius: number;
+    paddingVertical: number;
+    paddingHorizontal: number;
+    display: string;
+    justifyContent: string;
+    alignItems: string;
+    position: string;
+    top: number;
+    left: number;
+} | {
+    borderRadius: number;
+    paddingVertical: number;
+    paddingHorizontal: number;
+    display: string;
+    justifyContent: string;
+    alignItems: string;
+    position: string;
+    top: number;
+} | {
+    borderRadius: number;
+    paddingVertical: number;
+    paddingHorizontal: number;
+    display: string;
+    justifyContent: string;
+    alignItems: string;
+};
+declare const _default: {
+    ToastContainer: {
+        width: "100%";
+        height: "100%";
+        backgroundColor: string;
+        alignItems: "center";
+        justifyContent: "center";
+        position: "absolute";
+        top: number;
+        left: number;
+    };
+    message: {
+        fontSize: number;
+        color: string;
+    };
+    iconMessage: {
+        fontSize: number;
+        color: string;
+    };
+    btn: {
+        marginTop: number;
+        backgroundColor: string;
+        borderRadius: number;
+    };
+    center: {
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+    };
+    btnText: {
+        fontSize: number;
+        fontWeight: "400" | "500" | "600" | "700";
+    };
+};
+export default _default;

package/lib/src/components/Uploader/Uploader.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { RedsUploader, UploaderType } from "./interface/index";
+declare const Uploader: {
+    (props: RedsUploader): React.JSX.Element;
+    defaultProps: {
+        value: any[];
+        multiple: boolean;
+        accept: string;
+        maxSize: number;
+        type: UploaderType;
+        size: import("./interface/index").UploaderSize;
+        /**
+         * 身份证
+         */
+        disable: boolean;
+    };
+};
+export default Uploader;

package/lib/src/components/Uploader/interface/index.d.ts

@@ -0,0 +1,53 @@
+export declare const enum UploaderType {
+    IDENTITY = "identity",
+    NORMAL = "normal"
+}
+export declare const enum UploaderSize {
+    NORMAL = "normal",
+    LARGE = "large"
+}
+export type Status = "initial" | "uploading" | "failed" | "success";
+export type File = {
+    height: number;
+    mimeType: string;
+    path: string;
+    size: number;
+    width: number;
+};
+export type UploaderFileListItem = {
+    url?: string;
+    content?: string;
+    file?: File;
+    status?: Status;
+    message?: string;
+    statusNumber?: number;
+};
+export interface RedsUploader {
+    value?: UploaderFileListItem[];
+    multiple?: boolean;
+    accept?: string;
+    maxCount?: number;
+    maxSize?: number;
+    type?: UploaderType;
+    showDesc?: boolean;
+    description?: string;
+    size?: UploaderSize;
+    disable?: boolean;
+    onSuccess?: (file: UploaderFileListItem[]) => void;
+    onValidate?: (file: UploaderFileListItem[]) => boolean;
+    onFail?: (value: any) => void;
+    onChange: (value: UploaderFileListItem[]) => void;
+    onDelete?: (value: UploaderFileListItem, file: UploaderFileListItem[]) => void;
+    onOversize?: (value: UploaderFileListItem[]) => void;
+}
+export interface RedsUploaderEvent {
+}
+export declare const UploaderDefaultProps: {
+    value: any[];
+    multiple: boolean;
+    accept: string;
+    maxSize: number;
+    type: UploaderType;
+    size: UploaderSize;
+    disable: boolean;
+};

package/lib/src/components/Uploader/styles.d.ts

@@ -0,0 +1,173 @@
+import { RedsUploader } from "./interface";
+declare function getUploaderStyle(props: RedsUploader, themeColor: any): {
+    container: {
+        display: "flex";
+        flexDirection: "row";
+        alignItems: "center";
+        paddingHorizontal: number;
+        paddingBottom: number;
+        flexWrap: "wrap";
+    };
+    imageView: {
+        position: "relative";
+        width: number;
+        height: number;
+        marginRight: number;
+        marginTop: number;
+        borderRadius: number;
+    };
+    identityView: {
+        position: "relative";
+        width: number;
+        height: number;
+        marginRight: number;
+        marginTop: number;
+        borderRadius: number;
+    };
+    identityUpload: {
+        width: "100%";
+        height: "100%";
+        backgroundColor: any;
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+        borderRadius: number;
+    };
+    identityInput: {
+        position: "absolute";
+        top: number;
+        left: number;
+        width: number;
+        height: number;
+        borderWidth: number;
+        borderColor: string;
+        padding: number;
+        margin: number;
+        backgroundColor: string;
+        opacity: number;
+        zIndex: number;
+    };
+    identityImage: {
+        width: number;
+        height: number;
+        borderRadius: number;
+    };
+    image: {
+        width: "100%";
+        height: "100%";
+        borderRadius: number;
+    };
+    close: {
+        width: number;
+        height: number;
+        borderRadius: number;
+    };
+    closeImageContainer: {
+        width: number;
+        height: number;
+        borderRadius: number;
+        backgroundColor: any;
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+        position: "absolute";
+        top: number;
+        right: number;
+        zIndex: number;
+    };
+    upload: {
+        position: "relative";
+        width: number;
+        height: number;
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+        backgroundColor: any;
+        opacity: number;
+        borderRadius: number;
+        marginTop: number;
+    };
+    input: {
+        position: "absolute";
+        top: number;
+        left: number;
+        width: number;
+        height: number;
+        appearance: string;
+        background: string;
+        border: string;
+        boxShadow: string;
+        outline: string;
+        padding: number;
+        margin: number;
+        opacity: number;
+        zIndex: number;
+    };
+    add: {
+        width: number;
+        height: number;
+        color: any;
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+    };
+    identifyDesc: {
+        fontSize: number;
+        color: any;
+        marginTop: number;
+    };
+    descContainer: {
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+        width: "100%";
+        position: "absolute";
+        bottom: number;
+        left: number;
+    };
+    desc: {
+        fontSize: number;
+        color: any;
+    };
+    column: {
+        display: "flex";
+        flexDirection: "column";
+        justifyContent: "center";
+        alignItems: "center";
+        position: "relative";
+    };
+    progressIndicator: {
+        width: number;
+        height: number;
+        borderRadius: number;
+        position: "absolute";
+        top: number;
+        left: number;
+        zIndex: number;
+        display: "flex";
+        flexDirection: "column";
+        alignItems: "center";
+        justifyContent: "center";
+        backgroundColor: string;
+    };
+    identityProgressIndicator: {
+        width: number;
+        height: number;
+        borderRadius: number;
+        position: "absolute";
+        top: number;
+        left: number;
+        zIndex: number;
+        display: "flex";
+        flexDirection: "column";
+        alignItems: "center";
+        justifyContent: "center";
+        backgroundColor: string;
+    };
+    progressDesc: {
+        color: any;
+        fontSize: number;
+        marginTop: number;
+    };
+};
+export default getUploaderStyle;

package/{types → lib}/src/components/Uploader/utils.d.ts

@@ -2,22 +2,19 @@ import { File } from "./interface";
 export type UploaderResultType = "dataUrl" | "text" | "file";
 export type Status = "initial" | "uploading" | "failed" | "success";
 export type UploaderFileListItem = {
-  url?: string;
-  file?: File;
-  content?: string;
-  status?: Status;
-  message?: string;
+    url?: string;
+    file?: File;
+    content?: string;
+    status?: Status;
+    message?: string;
 };
 export declare const toArray: <T>(item: T | T[]) => T[];
 export declare const isFunction: (val: unknown) => boolean;
 export declare const isObject: (val: unknown) => val is Record<any, any>;
 export declare const isPromise: <T = any>(val: unknown) => val is Promise<T>;
 export declare function isOversize(items: UploaderFileListItem | UploaderFileListItem[], maxSize: number): boolean;
-export declare function filterFiles(
-  items: UploaderFileListItem[],
-  maxSize: number,
-): {
-  valid: UploaderFileListItem[];
-  invalid: UploaderFileListItem[];
+export declare function filterFiles(items: UploaderFileListItem[], maxSize: number): {
+    valid: UploaderFileListItem[];
+    invalid: UploaderFileListItem[];
 };
 export declare const validFileTypes: (file: UploaderFileListItem, acceptedFiles: string | string[]) => boolean;

package/lib/src/components/Video/Video.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import { RedsVideo } from "./interface/index";
+declare const Video: {
+    (props: RedsVideo): React.JSX.Element;
+    defaultProps: {
+        id: string;
+        url: string;
+        size: import("./interface/index").VideoSize;
+        type: import("./interface/index").VideoType;
+        reportCallback: () => void;
+        businessLine: string;
+        autoplay: boolean;
+        playsinline: boolean;
+        volume: number;
+        onError: () => void;
+        onProgress: () => void;
+        onLoadedMetaData: () => void;
+        onTimeUpdate: () => void;
+        onEnded: () => void;
+    };
+};
+export default Video;

package/lib/src/components/Video/interface/index.d.ts

@@ -0,0 +1,45 @@
+/// <reference types="react" />
+/// <reference types="node" />
+export declare const enum VideoSize {
+    VERTICAL = "vertical",
+    HORIZONTAL = "horizontal"
+}
+export declare const enum VideoType {
+    MP4 = "mp4",
+    HLS = "hls"
+}
+export interface RedsVideo {
+    id: string;
+    url: string;
+    size?: "vertical" | "horizontal";
+    type?: VideoType;
+    onPlay?: (value: Event) => any;
+    reportCallback?: () => void;
+    businessLine?: string;
+    autoplay?: boolean;
+    playsinline?: boolean;
+    volume?: number;
+    onError?: (event: any) => void;
+    onProgress?: (event: any) => void;
+    onLoadedMetaData?: (event: any) => void;
+    onTimeUpdate?: (event: any) => void;
+    onEnded?: (event: any) => void;
+}
+export interface RedsVideoEvent {
+}
+export declare const VideoDefaultProps: {
+    id: string;
+    url: string;
+    size: VideoSize;
+    type: VideoType;
+    reportCallback: () => void;
+    businessLine: string;
+    autoplay: boolean;
+    playsinline: boolean;
+    volume: number;
+    onError: () => void;
+    onProgress: () => void;
+    onLoadedMetaData: () => void;
+    onTimeUpdate: () => void;
+    onEnded: () => void;
+};

package/lib/src/components/Video/styles.d.ts

@@ -0,0 +1,20 @@
+declare const styles: {
+    VideoContainer: {
+        width: number;
+        height: number;
+        borderRadius: number;
+        justifyContent: "center";
+        alignItems: "center";
+    };
+    thumb: {
+        width: number;
+        height: number;
+        borderRadius: number;
+        backgroundColor: string;
+        justifyContent: "center";
+        alignItems: "center";
+        position: "absolute";
+        left: number;
+    };
+};
+export default styles;

package/{types → lib}/src/index.d.ts

@@ -27,7 +27,6 @@ export * from "./components/BottomBar";
 export * from "./components/List";
 export * from "./components/Skeleton";
 export * from "./components/ProgressIndicator";
-export * from "./components/ImagePreview";
 export * from "./components/Divider";
 export * from "./components/Portal";
 export * from "./components/Tag";

package/lib/types/components/Alert/styles.d.ts

@@ -76,7 +76,6 @@ export declare const style: (props: RedsAlert) => {
     };
     footerHorizontal: {
         flexDirection: "row";
-        height: number;
     };
     footerVertical: {
         flexDirection: "column-reverse";

package/lib/types/components/Avatar/Avatar.d.ts

@@ -10,5 +10,5 @@ export declare const images: {
     avatar: string;
     light: string;
 };
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<RedsAvatar & React.RefAttributes<unknown>>>;
+declare const _default: React.MemoExoticComponent<(props: RedsAvatar) => React.JSX.Element>;
 export default _default;

package/lib/types/components/AvatarGroup/AvatarGroup.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
 import { RedsAvatarGroup } from "./interface";
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<RedsAvatarGroup & React.RefAttributes<unknown>>>;
+declare const _default: React.MemoExoticComponent<(props: RedsAvatarGroup) => React.JSX.Element>;
 export default _default;

package/lib/types/components/Button/Button.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
 import { RedsButton } from "./interface";
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<RedsButton & React.RefAttributes<unknown>>>;
+declare const _default: React.MemoExoticComponent<(props: RedsButton) => React.JSX.Element>;
 export default _default;

package/lib/types/components/Carousel/interface/index.d.ts

@@ -24,10 +24,12 @@ export interface RedsCarousel {
     duration?: number;
     autoPlay?: boolean;
     displayNumbers?: boolean;
+    displayDots?: boolean;
     playingMode?: PLAYINGMODE;
     dotPlacement?: DOTPLACEMENT;
     numberPlacement?: NUMBERPLACEMENT;
     children?: ReactElement[];
+    distance?: number;
     onChange?: (value: any, index: number) => void;
     onClick?: (value: any, index: number) => void;
 }
@@ -41,8 +43,10 @@ export declare const CarouselDefaultProps: {
     duration: number;
     autoPlay: boolean;
     displayNumbers: boolean;
+    displayDots: boolean;
     playingMode: PLAYINGMODE;
     dotPlacement: DOTPLACEMENT;
     numberPlacement: NUMBERPLACEMENT;
     children: never[];
+    distance: number;
 };

package/lib/types/components/CheckBoxGroup/interface/index.d.ts

@@ -23,7 +23,7 @@ export declare const enum CheckedStatus {
     NONE = "none"
 }
 export interface RedsCheckBoxGroup {
-    value: string[] | number[];
+    value?: string[] | number[];
     options?: CheckBoxGroupOption[];
     disable?: boolean;
     full?: boolean;

package/lib/types/components/ConfigProvider/hooks/ConfigCache/interface.d.ts

@@ -10,7 +10,7 @@ export type ThemeTypography = {
     [key in TypographyToken]: any;
 };
 export type ColorMode = "light" | "dark" | string;
-export type Component = "Button" | "Popover" | "Icon" | "FAB" | "Tag" | "Switch" | "Text" | "Result" | "Empty" | "PullRefresh" | "Collapse" | "ProgressIndicator" | "Progress" | "Carousel" | "Checkbox" | "Form" | "Skeleton" | "Alert" | "ActionSheets" | "Sheets" | "MiniSnackbar" | "NoticeBar" | "Toast" | "Image" | "Avatar" | "DropdownMenu" | "AvatarStack" | "ImagePreview" | "Search" | "Divider" | "Slider" | "Stepper" | "Uploader" | "TextField" | "TextView" | "Badge" | "BottomBar" | "DatePicker" | "NavigationBar" | "Tab" | "TabBar" | "Picker" | "Radio" | "Rate" | "List" | "SnackBar";
+export type Component = "Button" | "Popover" | "Icon" | "FAB" | "Tag" | "Switch" | "Text" | "Result" | "Empty" | "PullRefresh" | "Collapse" | "ProgressIndicator" | "Progress" | "Carousel" | "Checkbox" | "Form" | "Skeleton" | "Alert" | "ActionSheets" | "Sheets" | "MiniSnackbar" | "NoticeBar" | "Toast" | "Image" | "Avatar" | "DropdownMenu" | "AvatarStack" | "Search" | "Divider" | "Slider" | "Stepper" | "Uploader" | "TextField" | "TextView" | "Badge" | "BottomBar" | "DatePicker" | "NavigationBar" | "Tab" | "TabBar" | "Picker" | "Radio" | "Rate" | "List" | "SnackBar";
 export type ComponentColor = {
     [key in Component]: ThemeColor;
 };

package/lib/types/components/ConfigProvider/hooks/themeToken/useThemeToken.d.ts

@@ -5,5 +5,5 @@ export interface IThemeInstance {
 export interface MyProxyConstructor {
     new <T, H extends Record<string, unknown>>(target: T, handler: ProxyHandler<H>): H;
 }
-export declare const useThemeColor: (component?: Component, staticColorType?: "lightColor" | "darkColor") => ThemeColor;
+export declare const useThemeColor: (component?: Component, staticColorType?: "lightColor" | "darkColor", id?: string) => ThemeColor;
 export declare const useThemeTypography: (component?: Component) => ThemeTypography;

package/lib/types/components/ConfigProvider/interface/index.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
 type ColorMode = "light" | "dark";
-type Component = "Button" | "Popover" | "Icon" | "FAB" | "Tag" | "Switch" | "Text" | "Result" | "Empty" | "PullRefresh" | "Collapse" | "ProgressIndicator" | "Progress" | "Carousel" | "Checkbox" | "Form" | "Skeleton" | "Alert" | "ActionSheets" | "Sheets" | "MiniSnackbar" | "NoticeBar" | "Toast" | "Image" | "Avatar" | "DropdownMenu" | "AvatarStack" | "ImagePreview" | "Search" | "Divider" | "Slider" | "Stepper" | "Uploader" | "TextField" | "TextView" | "Badge" | "BottomBar" | "DatePicker" | "NavigationBar" | "Tab" | "TabBar" | "Picker" | "Radio" | "Rate" | "List" | "SnackBar";
+type Component = "Button" | "Popover" | "Icon" | "FAB" | "Tag" | "Switch" | "Text" | "Result" | "Empty" | "PullRefresh" | "Collapse" | "ProgressIndicator" | "Progress" | "Carousel" | "Checkbox" | "Form" | "Skeleton" | "Alert" | "ActionSheets" | "Sheets" | "MiniSnackbar" | "NoticeBar" | "Toast" | "Image" | "Avatar" | "DropdownMenu" | "AvatarStack" | "Search" | "Divider" | "Slider" | "Stepper" | "Uploader" | "TextField" | "TextView" | "Badge" | "BottomBar" | "DatePicker" | "NavigationBar" | "Tab" | "TabBar" | "Picker" | "Radio" | "Rate" | "List" | "SnackBar";
 type ComponentsToken = {
     [K in Component]?: {
         lightColor?: Record<string, string>;

package/lib/types/components/Divider/Divider.d.ts

@@ -1,5 +1,4 @@
 import React from "react";
-import { View } from "react-native";
 import { RedsDivider } from "./interface";
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<RedsDivider & React.RefAttributes<View>>>;
+declare const _default: React.MemoExoticComponent<(props: RedsDivider) => React.JSX.Element>;
 export default _default;