react-native-ui-lib 8.0.1 → 8.1.0

package/src/components/drawer/Swipeable.d.ts

@@ -1,94 +0,0 @@
-import React, { Component } from 'react';
-import { Animated } from 'react-native';
-import { State } from 'react-native-gesture-handler';
-type Props = {
-    children: any;
-    friction: number;
-    leftThreshold?: number;
-    rightThreshold?: number;
-    fullLeftThreshold?: number;
-    fullSwipeLeft?: boolean;
-    fullRightThreshold?: number;
-    fullSwipeRight?: boolean;
-    overshootLeft?: boolean;
-    overshootRight?: boolean;
-    overshootFriction?: number;
-    onSwipeableLeftOpen?: Function;
-    onSwipeableRightOpen?: Function;
-    onSwipeableOpen?: Function;
-    onSwipeableClose?: Function;
-    onSwipeableLeftWillOpen?: Function;
-    onSwipeableRightWillOpen?: Function;
-    onSwipeableWillOpen?: Function;
-    onSwipeableWillClose?: Function;
-    onFullSwipeLeft?: Function;
-    onToggleSwipeLeft?: Function;
-    onWillFullSwipeLeft?: Function;
-    onFullSwipeRight?: Function;
-    onWillFullSwipeRight?: Function;
-    onDragStart?: Function;
-    renderLeftActions?: (progressAnimatedValue: any, dragAnimatedValue: any) => any;
-    renderRightActions?: (progressAnimatedValue: any, dragAnimatedValue: any) => any;
-    leftActionsContainerStyle: any;
-    rightActionsContainerStyle: any;
-    useNativeAnimations: boolean;
-    animationOptions?: Object;
-    containerStyle?: Object;
-    childrenContainerStyle?: Object;
-    disableHaptic?: boolean;
-};
-type State = {
-    dragX: Animated.Value;
-    rowTranslation: Animated.Value;
-    leftWidth: number | typeof undefined;
-    rightOffset: number | typeof undefined;
-    rowWidth: number | typeof undefined;
-};
-export type SwipeableProps = Props;
-declare class Swipeable extends Component<Props, State> {
-    static displayName: string;
-    static defaultProps: {
-        friction: number;
-        overshootFriction: number;
-        useNativeAnimations: boolean;
-        fullLeftThreshold: number;
-        fullRightThreshold: number;
-    };
-    constructor(props: Props);
-    _triggerHaptic: () => false | void;
-    _handleDrag: (e: any) => void;
-    getTransX: () => Animated.AnimatedInterpolation<string | number>;
-    getShowLeftAction: () => Animated.Value | Animated.AnimatedInterpolation<string | number>;
-    getLeftActionTranslate: () => Animated.AnimatedInterpolation<string | number>;
-    getShowRightAction: () => Animated.Value | Animated.AnimatedInterpolation<string | number>;
-    getRightActionTranslate: () => Animated.AnimatedInterpolation<string | number>;
-    _onTapHandlerStateChange: ({ nativeEvent }: {
-        nativeEvent: any;
-    }) => void;
-    _onHandlerStateChange: ({ nativeEvent }: {
-        nativeEvent: any;
-    }) => void;
-    _hasLeftActions: boolean;
-    _hasRightActions: boolean;
-    _handleRelease: (nativeEvent: any) => void;
-    _animateRow: (fromValue: any, toValue: any, velocityX: any) => void;
-    _currentOffset: () => number;
-    close: () => void;
-    openLeft: () => void;
-    openLeftFull: () => void;
-    toggleLeft: () => void;
-    openRight: () => void;
-    openRightFull: () => void;
-    _onRowLayout: ({ nativeEvent }: {
-        nativeEvent: any;
-    }) => void;
-    _onLeftLayout: ({ nativeEvent }: {
-        nativeEvent: any;
-    }) => void;
-    _onRightLayout: ({ nativeEvent }: {
-        nativeEvent: any;
-    }) => void;
-    handleMeasure: (name: any, nativeEvent: any) => void;
-    render(): React.JSX.Element;
-}
-export default Swipeable;

package/src/components/drawer/index.d.ts

@@ -1,161 +0,0 @@
-import React, { PureComponent, ReactNode, RefObject } from 'react';
-import { Animated, ViewStyle, TextStyle } from 'react-native';
-import Swipeable, { SwipeableProps } from './Swipeable';
-interface DrawerItemProps {
-    width?: number;
-    background?: string;
-    text?: string;
-    textColor?: string;
-    icon?: number;
-    iconColor?: string;
-    onPress?: Function;
-    keepOpen?: boolean;
-    style?: ViewStyle;
-    testID?: string;
-    customElement?: ReactNode;
-}
-interface DrawerProps {
-    /**
-     * The drawer animation bounciness
-     */
-    bounciness?: number;
-    /**
-     * OnDragStart handler
-     */
-    onDragStart?: Function;
-    /**
-     * The bottom layer's items to appear when opened from the right
-     */
-    rightItems?: DrawerItemProps[];
-    /**
-     * The bottom layer's item to appear when opened from the left (a single item)
-     */
-    leftItem?: DrawerItemProps;
-    /**
-     * Set a different minimum width
-     */
-    itemsMinWidth?: number;
-    /**
-     * The color for the text and icon tint of the items
-     */
-    itemsTintColor?: string;
-    /**
-     * The items' icon size
-     */
-    itemsIconSize?: number;
-    /**
-     * The items' text style
-     */
-    itemsTextStyle?: TextStyle;
-    /**
-     * Perform the animation in natively
-     */
-    useNativeAnimations?: boolean;
-    /**
-     * Whether to allow a full left swipe
-     */
-    fullSwipeLeft?: boolean;
-    /**
-     * Threshold for a left full swipe (0-1)
-     */
-    fullLeftThreshold?: number;
-    /**
-     * Callback for left item full swipe
-     */
-    onFullSwipeLeft?: Function;
-    /**
-     * Callback for left item toggle swipe
-     */
-    onToggleSwipeLeft?: Function;
-    /**
-     * Callback for just before left item full swipe
-     */
-    onWillFullSwipeLeft?: Function;
-    /**
-     * Whether to allow a full right swipe
-     */
-    fullSwipeRight?: boolean;
-    /**
-     * Threshold for a right full swipe (0-1)
-     */
-    fullRightThreshold?: number;
-    /**
-     * Callback for right item full swipe
-     */
-    onFullSwipeRight?: Function;
-    /**
-     * Callback for just before right item full swipe
-     */
-    onWillFullSwipeRight?: Function;
-    /**
-     * Whether to disable the haptic
-     */
-    disableHaptic?: boolean;
-    /**
-     * Style
-     */
-    style?: ViewStyle;
-    /**
-     * Callback for open action
-     */
-    onSwipeableWillOpen?: Function;
-    /**
-     * Callback for close action
-     */
-    onSwipeableWillClose?: Function;
-    /**
-     * Custom value of any type to pass on to the component and receive back in the action callbacks
-     */
-    customValue?: any;
-    /**
-     * Used as testing identifier
-     */
-    testID?: string;
-    children?: React.ReactNode;
-}
-/**
- * @description: Drawer Component
- * @importantLink: https://docs.swmansion.com/react-native-gesture-handler/docs/installation/
- * @gif: https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Drawer/Drawer.gif?raw=true
- */
-declare class Drawer extends PureComponent<DrawerProps> {
-    static displayName: string;
-    static defaultProps: {
-        itemsTintColor: string;
-        itemsIconSize: number;
-    };
-    leftRender: SwipeableProps['renderLeftActions'];
-    rightRender: SwipeableProps['renderLeftActions'];
-    _swipeableRow: RefObject<Swipeable>;
-    animationOptions: SwipeableProps['animationOptions'];
-    leftActionX: Animated.Value;
-    constructor(props: DrawerProps);
-    private getLeftActionsContainerStyle;
-    private getRightActionsContainerStyle;
-    private getActionsContainerStyle;
-    /** Actions */
-    closeDrawer: () => void;
-    openLeft: () => void;
-    openLeftFull: () => void;
-    toggleLeft: () => void;
-    openRight: () => void;
-    openRightFull: () => void;
-    /** Events */
-    private onActionPress;
-    private onSwipeableWillOpen;
-    private onSwipeableWillClose;
-    private onToggleSwipeLeft;
-    private animateItem;
-    /** Accessability */
-    private getAccessibilityActions;
-    private onAccessibilityAction;
-    /** Renders */
-    private renderLeftActions;
-    private renderRightActions;
-    private renderActions;
-    private renderAction;
-    render(): React.JSX.Element;
-}
-export { DrawerProps, DrawerItemProps };
-declare const _default: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<any>> & typeof Drawer;
-export default _default;

package/src/components/expandableSection/index.d.ts

@@ -1,40 +0,0 @@
-import React from 'react';
-export type ExpandableSectionProps = {
-    /**
-     * expandableSection header element
-     */
-    sectionHeader?: JSX.Element;
-    /**
-     * expandableSection expandable children
-     */
-    children?: React.ReactNode;
-    /**
-     * should the expandableSection be expanded
-     */
-    expanded?: boolean;
-    /**
-     * should the expandableSection open above the sectionHeader
-     */
-    top?: boolean;
-    /**
-     * action for when pressing the header of the expandableSection
-     */
-    onPress?: () => void;
-    /**
-     * Set a minimum height for the expandableSection
-     * If the children height is less than the minHeight, the expandableSection will collapse to that height
-     * If the children height is greater than the minHeight, the expandableSection will result with only the children rendered (sectionHeader will not be rendered)
-     */
-    minHeight?: number;
-    /**
-     * Testing identifier
-     */
-    testID?: string;
-};
-/**
- * @description: ExpandableSection component to render expanded section below or above the sectionHeader
- * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/ExpandableSectionScreen.tsx
- * @gif: https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/ExpandableSection/ExpandableSection.gif?raw=true
- */
-declare function ExpandableSection(props: ExpandableSectionProps): React.JSX.Element;
-export default ExpandableSection;

package/src/components/fadedScrollView/index.d.ts

@@ -1,59 +0,0 @@
-import React from 'react';
-import { ScrollViewProps } from 'react-native';
-import { FaderProps } from '../fader';
-import { ComponentStatics } from '../../typings/common';
-export type FadedScrollViewProps = ScrollViewProps & {
-    /**
-     * Show a fader at the start of the scroll
-     */
-    showStartFader?: boolean;
-    /**
-     * Additional props for the start fader
-     */
-    startFaderProps?: Omit<FaderProps, 'visible' | 'position'>;
-    /**
-     * Show a fader at the end of the scroll
-     */
-    showEndFader?: boolean;
-    /**
-     * Additional props for the end fader
-     */
-    endFaderProps?: Omit<FaderProps, 'visible' | 'position'>;
-    /**
-     * Use the react-native-gesture-handler version, useful when using react-native-reanimated
-     */
-    useGesture?: boolean;
-    children?: React.ReactNode | React.ReactNode[];
-};
-export interface FadedScrollViewRef {
-    scrollTo(y?: number | {
-        x?: number | undefined;
-        y?: number | undefined;
-        animated?: boolean | undefined;
-    }, x?: number, animated?: boolean): void;
-    isScrollEnabled: () => boolean;
-}
-declare const _default: React.ForwardRefExoticComponent<ScrollViewProps & {
-    /**
-     * Show a fader at the start of the scroll
-     */
-    showStartFader?: boolean | undefined;
-    /**
-     * Additional props for the start fader
-     */
-    startFaderProps?: Omit<FaderProps, "visible" | "position"> | undefined;
-    /**
-     * Show a fader at the end of the scroll
-     */
-    showEndFader?: boolean | undefined;
-    /**
-     * Additional props for the end fader
-     */
-    endFaderProps?: Omit<FaderProps, "visible" | "position"> | undefined;
-    /**
-     * Use the react-native-gesture-handler version, useful when using react-native-reanimated
-     */
-    useGesture?: boolean | undefined;
-    children?: React.ReactNode | React.ReactNode[];
-} & React.RefAttributes<FadedScrollViewRef>> & ComponentStatics<FadedScrollViewProps>;
-export default _default;

package/src/components/fader/index.d.ts

@@ -1,37 +0,0 @@
-import React from 'react';
-import { ImageProps } from '../image';
-export declare enum FaderPosition {
-    START = "START",
-    END = "END",
-    TOP = "TOP",
-    BOTTOM = "BOTTOM"
-}
-export type FaderProps = Pick<ImageProps, 'supportRTL'> & {
-    /**
-     * Whether the fader is visible (default is true)
-     */
-    visible?: boolean;
-    /**
-     * The position of the fader (the image is different), defaults to Fader.position.END
-     */
-    position?: FaderPosition | `${FaderPosition}`;
-    /**
-     * Set to change from the default size (50) of the fade view.
-     */
-    size?: number;
-    /**
-     * Change the default tint color of the fade view.
-     */
-    tintColor?: string;
-};
-/**
- * @description: A gradient fading overlay to render on top of overflowing content (like scroll component)
- * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/FaderScreen.tsx
- * @gif: https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Fader/Fader.gif?raw=true
- */
-declare function Fader(props: FaderProps): React.JSX.Element;
-declare namespace Fader {
-    var displayName: string;
-    var position: typeof FaderPosition;
-}
-export default Fader;

package/src/components/featureHighlight/index.d.ts

@@ -1,147 +0,0 @@
-import React, { Component, ElementRef } from 'react';
-import { Animated, StyleProp, TextStyle, TouchableWithoutFeedbackProps, LayoutChangeEvent } from 'react-native';
-import { ButtonProps } from '../button';
-import { PageControlProps } from '../pageControl';
-export type HighlightFrame = {
-    x: number;
-    y: number;
-    width: number;
-    height: number;
-};
-type RectSize = {
-    width: number;
-    height: number;
-};
-type Position = {
-    left: number;
-    top: number;
-    width: number;
-    height: number;
-};
-export type FeatureHighlightProps = {
-    /**
-     * Boolean to determine if to present the feature highlight component
-     */
-    visible: boolean;
-    /**
-     * Frame of the area to highlight {x, y, width, height}
-     */
-    highlightFrame?: HighlightFrame;
-    /**
-     * Callback that extract the ref of the element to be highlighted
-     */
-    getTarget?: () => any;
-    /**
-     * Title of the content to be displayed
-     */
-    title?: string;
-    /**
-     * Message to be displayed
-     */
-    message?: string;
-    /**
-     * Title text style
-     */
-    titleStyle?: StyleProp<TextStyle>;
-    /**
-     * Message text style
-     */
-    messageStyle?: StyleProp<TextStyle>;
-    /**
-     * Title's max number of lines
-     */
-    titleNumberOfLines?: number;
-    /**
-     * Message's max number of lines
-     */
-    messageNumberOfLines?: number;
-    /**
-     * Props that will be passed to the dismiss button
-     */
-    confirmButtonProps?: ButtonProps;
-    /**
-     * Callback for the background press
-     */
-    onBackgroundPress?: TouchableWithoutFeedbackProps['onPress'];
-    /**
-     * Color of the content's background (usually includes alpha for transparency)
-     */
-    overlayColor?: string;
-    /**
-     * Color of the content's text
-     */
-    textColor?: string;
-    /**
-     * Color of the border around the highlighted element
-     */
-    borderColor?: string;
-    /**
-     * Width of the border around the highlighted element
-     */
-    borderWidth?: number;
-    /**
-     * Border radius for the border corners around the highlighted element
-     */
-    borderRadius?: number;
-    /**
-     * The minimum size of the highlighted component (Android API 21+, and only when passing a ref in 'getTarget')
-     */
-    minimumRectSize?: RectSize;
-    /**
-     * The padding of the highlight frame around the highlighted element's frame (only when passing ref in 'getTarget')
-     */
-    innerPadding?: number;
-    /**
-     * PageControl component's props
-     */
-    pageControlProps?: PageControlProps;
-    testID?: string;
-};
-interface State {
-    fadeAnim: Animated.Value;
-    contentTopPosition?: number;
-    node?: number;
-    getTarget?: () => any;
-}
-/**
- * @description: FeatureHighlight component for feature discovery
- * @notes: 1) FeatureHighlight component must be a direct child of the root view returned in render().; 2) If the element to be highlighted doesn't have a style attribute add 'style={{opacity: 1}}' so the Android OS can detect it.
- * @important: FeatureHighlight uses a native library. You MUST add and link the native library to both iOS and Android projects. For instruction please see
- * @importantLink: https://facebook.github.io/react-native/docs/linking-libraries-ios.html
- * @gif: https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/FeatureHighlight/FeatureHighlight.gif?raw=true
- * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/FeatureHighlightScreen.tsx
- */
-declare class FeatureHighlight extends Component<FeatureHighlightProps, State> {
-    static displayName: string;
-    contentHeight: number;
-    targetPosition?: Position;
-    viewRef?: ElementRef<any>;
-    constructor(props: FeatureHighlightProps);
-    static defaultProps: {
-        minimumRectSize: {
-            width: number;
-            height: number;
-        };
-        innerPadding: number;
-    };
-    componentDidMount(): void;
-    static getDerivedStateFromProps(nextProps: FeatureHighlightProps, prevState: State): {
-        getTarget: (() => any) | undefined;
-        node: number;
-    } | null;
-    shouldSetTargetPosition: (nextProps: FeatureHighlightProps) => boolean;
-    componentDidUpdate(nextProps: FeatureHighlightProps): void;
-    setAccessibilityFocus(ref: any): void;
-    static findTargetNode(target: Component): number | null;
-    animate(toValue: number): void;
-    setTargetPosition(props?: Readonly<FeatureHighlightProps>): void;
-    getContentPosition(): number;
-    setContentPosition(): void;
-    getComponentDimensions(event: LayoutChangeEvent): void;
-    onPress: () => void;
-    renderHighlightMessage(): React.JSX.Element;
-    render(): React.JSX.Element | null;
-}
-export { FeatureHighlight };
-declare const _default: React.ForwardRefExoticComponent<FeatureHighlightProps & React.RefAttributes<any>> & typeof FeatureHighlight;
-export default _default;

package/src/components/floatingButton/index.d.ts

@@ -1,85 +0,0 @@
-import React, { PropsWithChildren, PureComponent } from 'react';
-import { Animated } from 'react-native';
-import { ButtonProps } from '../button';
-export declare enum FloatingButtonLayouts {
-    VERTICAL = "Vertical",
-    HORIZONTAL = "Horizontal"
-}
-export interface FloatingButtonProps {
-    /**
-     * Whether the button is visible
-     */
-    visible?: boolean;
-    /**
-     * Button element (all Button's component's props)
-     */
-    button?: PropsWithChildren<ButtonProps>;
-    /**
-     * Secondary button element (all Button's component's props)
-     */
-    secondaryButton?: PropsWithChildren<ButtonProps>;
-    /**
-     * The bottom margin of the button, or secondary button if passed
-     */
-    bottomMargin?: number;
-    /**
-     * Whether the buttons get the container's full with (vertical layout only)
-     */
-    fullWidth?: boolean;
-    /**
-     * Button layout direction: vertical or horizontal
-     */
-    buttonLayout?: FloatingButtonLayouts | `${FloatingButtonLayouts}`;
-    /**
-     * The duration of the button's animations (show/hide)
-     */
-    duration?: number;
-    /**
-     * Whether to show/hide the button without animation
-     */
-    withoutAnimation?: boolean;
-    /**
-     * Whether to show background overlay
-     */
-    hideBackgroundOverlay?: boolean;
-    /**
-     * Used as testing identifier
-     * <TestID> - the floatingButton container
-     * <TestID>.button - the floatingButton main button
-     * <TestID>.secondaryButton - the floatingButton secondaryButton
-     */
-    testID?: string;
-}
-/**
- * @description: Hovering button with gradient background
- * @modifiers: margin, background, color
- * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/FloatingButtonScreen.tsx
- * @gif: https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/FloatingButton/FloatingButton.gif?raw=true
- */
-declare class FloatingButton extends PureComponent<FloatingButtonProps> {
-    static displayName: string;
-    static floatingButtonLayouts: typeof FloatingButtonLayouts;
-    static defaultProps: {
-        duration: number;
-        buttonLayout: FloatingButtonLayouts;
-    };
-    initialVisibility?: boolean;
-    firstLoad: boolean;
-    visibleAnimated: Animated.Value;
-    constructor(props: FloatingButtonProps);
-    componentDidUpdate(prevProps: FloatingButtonProps): void;
-    getAnimatedStyle: () => {
-        opacity: Animated.Value;
-        transform: {
-            translateY: Animated.AnimatedInterpolation<string | number>;
-        }[];
-    };
-    get isSecondaryHorizontal(): boolean | undefined;
-    get isSecondaryVertical(): boolean | undefined;
-    renderButton(): React.JSX.Element;
-    renderOverlay: () => React.JSX.Element | undefined;
-    renderSecondaryButton(): React.JSX.Element;
-    render(): false | React.JSX.Element;
-}
-declare const _default: React.ForwardRefExoticComponent<FloatingButtonProps & React.RefAttributes<any>> & typeof FloatingButton;
-export default _default;

package/src/components/gradient/index.d.ts

@@ -1,19 +0,0 @@
-import tinycolor from 'tinycolor2';
-import React from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
-export declare enum GradientTypes {
-    HUE = "hue",
-    LIGHTNESS = "lightness",
-    SATURATION = "saturation"
-}
-export interface GradientProps {
-    color?: string | tinycolor.ColorFormats.HSLA;
-    type?: GradientTypes | `${GradientTypes}`;
-    numberOfSteps: number;
-    style?: StyleProp<ViewStyle>;
-}
-declare const Gradient: {
-    (props: GradientProps): React.JSX.Element;
-    types: typeof GradientTypes;
-};
-export default Gradient;

package/src/components/gridList/index.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { GridListProps, GridListBaseProps } from './types';
-declare function GridList<T = any>(props: GridListProps<T>): React.JSX.Element;
-export { GridListBaseProps, GridListProps };
-export default GridList;

package/src/components/gridList/types.d.ts

@@ -1,29 +0,0 @@
-import { FlatListProps } from 'react-native';
-export interface GridListBaseProps extends Pick<FlatListProps<any>, 'style' | 'contentContainerStyle' | 'columnWrapperStyle'> {
-    /**
-     * Allow a responsive item width to the maximum item width
-     */
-    maxItemWidth?: number;
-    /**
-     * Number of items to show in a row (ignored when passing maxItemWidth)
-     */
-    numColumns?: number;
-    /**
-     * Spacing between each item
-     */
-    itemSpacing?: number;
-    /**
-     * List padding (used for item size calculation)
-     */
-    listPadding?: number;
-    /**
-     * whether to keep the items initial size when orientation changes,
-     * in which case the apt number of columns will be calculated automatically.
-     */
-    keepItemSize?: boolean;
-    /**
-     * Pass when you want to use a custom container width for calculation
-     */
-    containerWidth?: number;
-}
-export type GridListProps<T = any> = GridListBaseProps & FlatListProps<T>;