@xhsreds/reds-rn-next 0.2.7 → 0.2.8

package/lib/src/components/Image/hook/index.d.ts

@@ -0,0 +1,14 @@
+import { ImageSourcePropType } from "react-native";
+import { RedsImage } from "../interface";
+export declare const useAveColor: ({ source, defaultColor, loadingAve, }: {
+    source: ImageSourcePropType;
+    defaultColor: string;
+    loadingAve: boolean;
+}) => string;
+export declare const useImage: ({ src, source: _source, loadStyle }: RedsImage) => {
+    source: ImageSourcePropType;
+    aveColor: string;
+    blurSource: {
+        uri: string;
+    };
+};

package/lib/src/components/Image/index.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import * as ImageType from "./interface";
+declare const ImageComponent: import("react").MemoExoticComponent<{
+    ({ src, source: _source, width, height, borderRadius, errorStyle, loadStyle, style, ...props }: ImageType.RedsImage & Omit<import("react-native").ImageProps, keyof ImageType.RedsImage>): import("react").JSX.Element;
+    defaultProps: {
+        style: {};
+        loadStyle: ImageType.TLoadStyle;
+        loadMode: ImageType.TLoadMode;
+        errorStyle: ImageType.TErrorStyle;
+    };
+}>;
+export default ImageComponent;
+export { ImageComponent as Image, ImageType };

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

@@ -0,0 +1,42 @@
+import { AnimatableNumericValue, DimensionValue, GestureResponderEvent, ImageSourcePropType, ImageStyle } from "react-native";
+export declare enum TLoadStyle {
+    LOADING = "loading",
+    AVE = "ave",
+    BLUR = "blur",
+    NONE = "none"
+}
+export declare enum IMAGE_STATUS {
+    LOADING = 0,//加载中
+    LOADED = 1,//加载完成
+    LOADERROR = 2,// 加载失败
+    RELOAD = 3,// 重新加载
+    HIDE = 4
+}
+export declare enum TLoadMode {
+    LAZY = "lazy",
+    EAGER = "eager"
+}
+export declare enum TErrorStyle {
+    ERROR = "error",
+    RELOAD = "reload"
+}
+export interface RedsImage {
+    src?: string;
+    source?: ImageSourcePropType;
+    width?: number | DimensionValue;
+    height?: number | DimensionValue;
+    borderRadius?: number | AnimatableNumericValue;
+    style?: ImageStyle;
+    loadStyle?: TLoadStyle;
+    loadMode?: TLoadMode;
+    errorStyle?: TErrorStyle;
+    onReload?: (v: GestureResponderEvent) => void;
+}
+export interface RedsImageEvent {
+}
+export declare const ImageDefaultProps: {
+    style: {};
+    loadStyle: TLoadStyle;
+    loadMode: TLoadMode;
+    errorStyle: TErrorStyle;
+};

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

@@ -0,0 +1,10 @@
+declare const styles: {
+    imageContainer: {};
+    loadingContainer: {
+        alignItems: "center";
+        justifyContent: "center";
+        position: "absolute";
+        backgroundColor: string;
+    };
+};
+export default styles;

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

@@ -1,11 +1,11 @@
 import React, { ReactNode } from "react";
 import { ViewStyle, StyleProp } from "react-native";
 export interface RedsList {
-  headerText?: string;
-  footerText?: string;
-  type?: "grouped" | "plain";
-  containerStyle?: StyleProp<ViewStyle>;
-  children: ReactNode;
+    headerText?: string;
+    footerText?: string;
+    type?: "grouped" | "plain";
+    containerStyle?: StyleProp<ViewStyle>;
+    children: ReactNode;
 }
 declare const List: React.FC<RedsList>;
 export default List;

package/{types → lib}/src/components/List/ListItem/ListContext.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 interface ListContextProps {
-  registerChild: (child: any) => void;
-  unregisterChild: (child: any) => void;
+    registerChild: (child: any) => void;
+    unregisterChild: (child: any) => void;
 }
 export declare const ListContext: React.Context<ListContextProps>;
 export declare const useListContext: () => ListContextProps;

package/lib/src/components/List/ListItem/ListItem.d.ts

@@ -0,0 +1,12 @@
+import React, { ReactNode } from "react";
+export interface RedsListItem {
+    title: string;
+    subtitle?: string;
+    actionText?: string;
+    size?: "regular" | "expand";
+    arrow?: boolean;
+    prefix?: ReactNode;
+    action?: ReactNode;
+}
+declare const ListItem: React.FC<RedsListItem>;
+export default ListItem;

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

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import { ViewStyle } from "react-native";
+export interface RedsList {
+    headerText?: string;
+    footerText?: string;
+    type?: "grouped" | "plain";
+    containerStyle?: ViewStyle;
+    title?: string;
+    subtitle?: string;
+    actionText?: string;
+    size?: "regular" | "expand";
+    arrow?: boolean;
+    prefix?: React.ReactNode;
+    action?: React.ReactNode;
+}
+export interface RedsListEvent {
+}
+export declare const ListDefaultProps: {
+    type: string;
+    containerStyle: {};
+    size: string;
+    arrow: boolean;
+};

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

@@ -0,0 +1,112 @@
+declare const createStyles: () => {
+    list: {
+        paddingVertical: number;
+    };
+    headerText: {
+        color: string;
+        marginHorizontal: number;
+        marginBottom: number;
+        marginLeft: number;
+        fontSize: any;
+        lineHeight: any;
+    };
+    headerTextPlain: {
+        color: string;
+        marginHorizontal: number;
+        marginBottom: number;
+        fontSize: any;
+        lineHeight: any;
+    };
+    footerText: {
+        color: string;
+        marginHorizontal: number;
+        marginTop: number;
+        marginLeft: number;
+        fontSize: any;
+        fontWeight: any;
+        lineHeight: any;
+    };
+    footerTextPlain: {
+        color: string;
+        marginHorizontal: number;
+        marginTop: number;
+        fontSize: any;
+        fontWeight: any;
+        lineHeight: any;
+    };
+    listContainer: {
+        borderRadius: number;
+        marginHorizontal: number;
+        backgroundColor: string;
+    };
+    listContainerPlain: {
+        borderRadius: number;
+        marginHorizontal: number;
+        backgroundColor: string;
+    };
+    listItem: {
+        display: "flex";
+        flexDirection: "row";
+        alignItems: "center";
+        justifyContent: "flex-start";
+        paddingVertical: number;
+    };
+    expand: {};
+    prefix: {
+        marginLeft: number;
+    };
+    contentBox: {
+        flex: number;
+        marginLeft: number;
+    };
+    contentContainer: {
+        flexDirection: "row";
+        alignItems: "center";
+        justifyContent: "space-between";
+        width: "100%";
+    };
+    textContainer: {
+        flexDirection: "column";
+        justifyContent: "center";
+        flex: number;
+    };
+    tailContainer: {
+        flexDirection: "row";
+        alignItems: "center";
+    };
+    title: {
+        fontSize: any;
+        fontWeight: any;
+        lineHeight: any;
+        color: string;
+    };
+    subtitle: {
+        fontSize: any;
+        color: string;
+        lineHeight: any;
+        fontWeight: any;
+    };
+    tail: {
+        marginRight: number;
+        fontSize: any;
+        color: string;
+        display: "flex";
+        flexDirection: "row";
+        alignItems: "center";
+    };
+    tailText: {
+        color: string;
+    };
+    hr: {
+        borderTopWidth: number;
+        borderTopColor: string;
+        width: "100%";
+        alignSelf: "stretch";
+        position: "relative";
+    };
+    icon: {
+        width: number;
+        height: number;
+    };
+};
+export default createStyles;

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

@@ -0,0 +1,15 @@
+import React from "react";
+import { RedsNavigationBar, NavigationBarActionType, NavigationBarLayoutType, NavigationBarSize } from "./interface/index";
+declare const NavigationBar: {
+    (props: RedsNavigationBar): React.JSX.Element;
+    defaultProps: {
+        layout: NavigationBarLayoutType;
+        actionType: NavigationBarActionType;
+        leftActions: any[];
+        rightActions: any[];
+        size: NavigationBarSize; /**
+         * 设置icon size
+         */
+    };
+};
+export default NavigationBar;

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

@@ -0,0 +1,45 @@
+import { ReactNode } from "react";
+import { RedsIcon } from "../../Icon/interface";
+export declare const enum NavigationBarLayoutType {
+    LEFT = "left",
+    MIDDLE = "middle"
+}
+export declare const enum NavigationBarActionType {
+    Text = "text",
+    Icon = "icon",
+    BgIcon = "bgicon"
+}
+export declare const enum NavigationBarTextTheme {
+    primary = "primary",
+    normal = "normal"
+}
+export interface NavigationBarActionProps {
+    iconProps?: RedsIcon;
+    text?: string;
+    event: () => void;
+    textCustomStyle?: {};
+    textTheme?: NavigationBarTextTheme;
+}
+export declare const enum NavigationBarSize {
+    normal = "normal",
+    large = "large"
+}
+export interface RedsNavigationBar {
+    layout?: NavigationBarLayoutType;
+    actionType?: NavigationBarActionType;
+    leftActions?: NavigationBarActionProps[];
+    rightActions?: NavigationBarActionProps[];
+    size?: NavigationBarSize;
+    title?: string;
+    children?: ReactNode;
+    containerStyles?: {};
+}
+export interface RedsNavigationBarEvent {
+}
+export declare const NavigationBarDefaultProps: {
+    layout: NavigationBarLayoutType;
+    actionType: NavigationBarActionType;
+    leftActions: any[];
+    rightActions: any[];
+    size: NavigationBarSize;
+};

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

@@ -0,0 +1,89 @@
+import { RedsNavigationBar } from "./interface/index";
+declare const getStyles: (themeColor: any) => {
+    navigationBarContainer: {
+        width: "100%";
+        height: number;
+        display: "flex";
+        flexDirection: "row";
+        justifyContent: "center";
+        alignItems: "center";
+        backgroundColor: any;
+        paddingHorizontal: number;
+        position: "relative";
+    };
+    textPrimary: {
+        fontSize: any;
+        fontWeight: any;
+        color: any;
+    };
+    textNormal: {
+        fontSize: any;
+        fontWeight: any;
+        color: any;
+    };
+    title: {
+        fontSize: any;
+        fontWeight: any;
+        color: any;
+        maxWidth: number;
+    };
+    largeTitle: {
+        fontSize: any;
+        fontWeight: any;
+        color: any;
+        maxWidth: number;
+    };
+    largeTitleWrapper: {
+        backgroundColor: any;
+        color: any;
+        height: number;
+        paddingLeft: number;
+    };
+    leftActionStyle: {
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+    };
+    rightActionStyle: {
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+    };
+    flexCenter: {
+        display: "flex";
+        flexDirection: "row";
+        alignItems: "center";
+        justifyContent: "center";
+    };
+    flexStart: {
+        display: "flex";
+        flexDirection: "row";
+        alignItems: "center";
+        position: "absolute";
+        left: number;
+    };
+    titleLeftWrapper: {
+        display: "flex";
+        flexDirection: "row";
+        alignItems: "center";
+        justifyContent: "flex-start";
+        flex: number;
+    };
+    flexEnd: {
+        display: "flex";
+        flexDirection: "row";
+        alignItems: "center";
+        position: "absolute";
+        right: number;
+    };
+};
+export declare const getIconStyles: (props: RedsNavigationBar, item: any, themeColor: any, type: string) => {
+    width: number;
+    height: number;
+    display: "flex";
+    justifyContent: "center";
+    alignItems: "center";
+    marginRight: number;
+    marginLeft: number;
+};
+export default getStyles;

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

@@ -0,0 +1,14 @@
+import React from "react";
+import { RedsPicker } from "./interface/index";
+declare const Picker: {
+    (props: RedsPicker): React.JSX.Element;
+    defaultProps: {
+        onConfirm: () => void;
+        onCancel: () => void;
+        onChange: () => void;
+        columns: any[];
+        value: any[];
+        visible: boolean;
+    };
+};
+export default Picker;

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

@@ -0,0 +1,22 @@
+export interface Column {
+    label: string;
+    value: string;
+}
+export interface RedsPicker {
+    onConfirm: (val: string[]) => void;
+    onCancel: () => void;
+    onChange?: (val: string[]) => void;
+    columns: Column[][];
+    value: string[];
+    visible: boolean;
+}
+export interface RedsPickerEvent {
+}
+export declare const PickerDefaultProps: {
+    onConfirm: () => void;
+    onCancel: () => void;
+    onChange: () => void;
+    columns: any[];
+    value: any[];
+    visible: boolean;
+};

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

@@ -0,0 +1,20 @@
+declare const styles: {
+    PickerContainer: {
+        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/lib/src/components/PickerView/interface/index.d.ts

@@ -0,0 +1,39 @@
+export interface Column {
+    label: string;
+    value: string;
+}
+export interface RedsPickerView {
+    columns?: Column[][];
+    value?: string[];
+    loading?: boolean;
+    onChange?: (val: string[]) => void;
+}
+export interface RedsPickerViewEvent {
+}
+export declare const PickerViewDefaultProps: {
+    columns: any[];
+    value: any[];
+    loading: boolean;
+    onChange: () => void;
+};
+export type RedsWheel = {
+    /**
+     * 滚动的列
+     */
+    index: number;
+    /**
+     * 列数据
+     */
+    column: Column[];
+    /**
+     * 当前选中值
+     */
+    value?: string;
+    /**
+     * 变化函数
+     * @param value
+     * @param index
+     * @returns
+     */
+    onSelect: (value: string, index: number) => void;
+};

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

@@ -0,0 +1,54 @@
+declare const styles: {
+    wrapper: {
+        padding: number;
+        position: "relative";
+        overflow: "hidden";
+    };
+    wheel: {
+        fontSize: number;
+        fontWeight: "400" | "500" | "600" | "700";
+        width: "100%";
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+    };
+    wheelWrapper: {
+        flex: number;
+        display: "flex";
+        justifyContent: "center";
+        alignItems: "center";
+        flexDirection: "row";
+    };
+    mask: {
+        position: "absolute";
+        zIndex: number;
+        left: number;
+        top: number;
+        width: "100%";
+        height: "100%";
+        display: "flex";
+        flexDirection: "column";
+    };
+    maskTop: {
+        flex: number;
+        overflow: "hidden";
+        opacity: number;
+    };
+    maskMiddle: {
+        borderBottomWidth: number;
+        borderTopWidth: number;
+        borderStyle: "solid";
+    };
+    maskBottom: {
+        flex: number;
+        overflow: "hidden";
+        opacity: number;
+    };
+    progressIndicator: {
+        flex: number;
+        display: "flex";
+        alignItems: "center";
+        justifyContent: "center";
+    };
+};
+export default styles;

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

@@ -0,0 +1,4 @@
+import React from "react";
+import { RedsPopover } from "./interface/index";
+declare const _default: ({ mode, opacity, content, children, isControl, placement, closeOnClickAgain, trigger, zIndex, visible, onVisibleChange, onClickMask: _onClickMask, floatingPadding, popContainerStyle, floatingStyles: propsFloatingStyles, arrowStyles: propsArrowStyles, offset, }: RedsPopover) => React.JSX.Element;
+export default _default;

package/{types → lib}/src/components/Popover/component.d.ts

@@ -1,7 +1,6 @@
 import React, { ReactNode } from "react";
-import { Modal, GestureResponderEvent, Animated } from "react-native";
-export declare const ModalWrapper: React.ForwardRefExoticComponent<
-  {
+import { GestureResponderEvent, Animated } from "react-native";
+export declare const ModalWrapper: ({ needModal, visible, children, onClickMask, opacity, progress, zIndex, }: {
     needModal?: boolean;
     visible: boolean;
     children: ReactNode;
@@ -9,5 +8,4 @@ export declare const ModalWrapper: React.ForwardRefExoticComponent<
     opacity?: number;
     progress: Animated.Value | number;
     zIndex: number;
-  } & React.RefAttributes<Modal>
->;
+}) => React.JSX.Element;

package/lib/src/components/Popover/hook.d.ts

@@ -0,0 +1,68 @@
+/// <reference types="react" />
+import { Animated } from "react-native";
+import type { LayoutChangeEvent } from "react-native";
+import { RedsPopover } from "./interface";
+export declare const useFloating: ({ placement, needModal, floatingOffset, floatingPadding, }: {
+    placement: RedsPopover["placement"];
+    needModal: boolean;
+    floatingOffset?: number;
+    floatingPadding?: number;
+}) => {
+    scrollProps: {
+        onScroll: (event: {
+            nativeEvent: {
+                contentOffset: {
+                    x: number;
+                    y: number;
+                };
+            };
+        }) => void;
+        scrollEventThrottle: 16;
+    };
+    placement: import("@floating-ui/react-native").Placement;
+    strategy: import("@floating-ui/react-native").Strategy;
+    x: number;
+    y: number;
+    setFloatingRef: <T>(ref: T) => void;
+    setReferenceRef: <T_1>(ref: T_1) => void;
+    setOffsetParentRef: import("react").MutableRefObject<any>;
+    setArrowRef: import("react").MutableRefObject<any>;
+    onReferenceLayout: (event: {
+        nativeEvent: {
+            layout: {
+                x: any;
+                y: any;
+            };
+        };
+    }) => void;
+    onFloatingLayout: (event: LayoutChangeEvent) => void;
+    refs: {
+        reference: import("react").MutableRefObject<any>;
+        floating: import("react").MutableRefObject<any>;
+        offsetParent: import("react").MutableRefObject<any>;
+        setReference: (node: any) => void;
+        setFloating: (node: any) => void;
+        setOffsetParent: (node: any) => void;
+    };
+    elements: {
+        reference: any;
+        floating: any;
+        offsetParent: any;
+    };
+    middlewareData: import("@floating-ui/react-native").MiddlewareData;
+    renderCompleted: boolean;
+    floatingStyles: {
+        position: "absolute";
+        top: number;
+        left: number;
+    };
+    arrowStyles: {
+        position: string;
+        left: number;
+        top: number;
+        transform: {
+            rotate: string;
+        }[];
+    };
+};
+export declare const useMotionVisible: (defaultValue: boolean, motionType: "none" | "weak") => [boolean, (value: React.SetStateAction<boolean>) => void, Animated.Value | number];