react-native-ui-lib 8.1.1 → 8.1.5

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

@@ -0,0 +1,88 @@
+import React, { Component } from 'react';
+import { Animated, FlatListProps, ImageSourcePropType, NativeSyntheticEvent, NativeScrollEvent, LayoutChangeEvent } from 'react-native';
+import { ForwardRefInjectedProps } from '../../commons/new';
+import { ComponentStatics } from '../../typings/common';
+export interface ScrollBarProps extends FlatListProps<any> {
+    /**
+     * Whether to use a FlatList. NOTE: you must pass 'data' and 'renderItem' props as well
+     */
+    useList?: boolean;
+    /**
+     * The element to use as a container, instead of a View
+     */
+    containerView?: React.ComponentClass;
+    /**
+     * The props to pass the container
+     */
+    containerProps?: object;
+    /**
+     * The component's height
+     */
+    height?: number;
+    /**
+     * The gradient's height, defaults to the component's height
+     */
+    gradientHeight?: number;
+    /**
+     * The gradient's width
+     */
+    gradientWidth?: number;
+    /**
+     * The gradient's margins for the edge
+     */
+    gradientMargins?: number;
+    /**
+     * The gradient's tint color
+     */
+    gradientColor?: string;
+    /**
+     * The gradient's image, instead of the default image.
+     * NOTE: pass an image for the right-hand side and it will be flipped to match the left-hand side
+     */
+    gradientImage?: ImageSourcePropType;
+    /**
+     * The index to currently focus on
+     */
+    focusIndex?: number;
+}
+type Props = ScrollBarProps & ForwardRefInjectedProps;
+type State = {
+    gradientOpacity: Animated.Value;
+    gradientOpacityLeft: Animated.Value;
+};
+/**
+ * @description: Scrollable container with animated gradient overlay for horizontal scroll
+ * @extends: ScrollView / FlatList
+ */
+declare class ScrollBar extends Component<Props, State> {
+    static displayName: string;
+    static defaultProps: {
+        gradientWidth: number;
+        gradientMargins: number;
+        gradientColor: string;
+        focusIndex: number;
+    };
+    static Item: typeof Item;
+    constructor(props: Props);
+    private scrollbar;
+    private itemsLayouts;
+    private contentOffset;
+    private scrollContentWidth;
+    private containerWidth;
+    componentDidUpdate(prevProps: Props): void;
+    focusIndex: (index?: number) => void;
+    animateGradientOpacity: (offsetX: number, contentWidth: number, containerWidth: number) => void;
+    onScroll: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
+    onContentSizeChange: (contentWidth: number, contentHeight: number) => void;
+    onLayout: (event: LayoutChangeEvent) => void;
+    onItemLayout: ({ layout, index }: any) => void;
+    renderScrollable(): React.JSX.Element;
+    renderGradient(left: boolean): React.JSX.Element;
+    render(): React.JSX.Element;
+}
+declare const Item: {
+    ({ children, index, onLayout }: any): React.JSX.Element;
+    displayName: string;
+};
+declare const _default: React.ForwardRefExoticComponent<ScrollBarProps & React.RefAttributes<any>> & ComponentStatics<typeof ScrollBar>;
+export default _default;

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

@@ -0,0 +1,37 @@
+import React from 'react';
+import { SearchInputPresets, SearchInputProps, SearchInputRef } from './types';
+declare const SearchInput: React.ForwardRefExoticComponent<import("react-native").TextInputProps & {
+    onClear?: (() => void) | undefined;
+    onDismiss?: (() => void) | undefined;
+    cancelButtonProps?: import("../button").ButtonProps | undefined;
+    customRightElement?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
+    showLoader?: boolean | undefined;
+    loaderProps?: import("react-native").ActivityIndicatorProps | undefined;
+    customLoader?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
+    invertColors?: boolean | undefined;
+    inaccessible?: boolean | undefined;
+    useSafeArea?: boolean | undefined;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    containerStyle?: import("react-native").StyleProp<import("react-native").TextStyle | import("react-native").ViewStyle>;
+    preset?: "default" | "prominent" | SearchInputPresets | undefined;
+} & React.RefAttributes<any>>;
+interface StaticMembers {
+    presets: typeof SearchInputPresets;
+}
+export { SearchInput, SearchInputProps, SearchInputRef, SearchInputPresets };
+declare const _default: React.ForwardRefExoticComponent<import("react-native").TextInputProps & {
+    onClear?: (() => void) | undefined;
+    onDismiss?: (() => void) | undefined;
+    cancelButtonProps?: import("../button").ButtonProps | undefined;
+    customRightElement?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
+    showLoader?: boolean | undefined;
+    loaderProps?: import("react-native").ActivityIndicatorProps | undefined;
+    customLoader?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
+    invertColors?: boolean | undefined;
+    inaccessible?: boolean | undefined;
+    useSafeArea?: boolean | undefined;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    containerStyle?: import("react-native").StyleProp<import("react-native").TextStyle | import("react-native").ViewStyle>;
+    preset?: "default" | "prominent" | SearchInputPresets | undefined;
+} & React.RefAttributes<any>> & StaticMembers;
+export default _default;

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

@@ -0,0 +1,66 @@
+/// <reference types="react" />
+import { TextInputProps, StyleProp, ViewStyle, TextStyle, ActivityIndicatorProps } from 'react-native';
+import { ButtonProps } from '../button';
+export declare enum SearchInputPresets {
+    DEFAULT = "default",
+    PROMINENT = "prominent"
+}
+export interface SearchInputRef {
+    blur: () => void;
+    clear: () => void;
+    focus: () => void;
+}
+export type SearchInputProps = TextInputProps & {
+    /**
+     * On clear button callback.
+     */
+    onClear?: () => void;
+    /**
+     * callback for dismiss action
+     */
+    onDismiss?: () => void;
+    /**
+     * Props for the cancel button
+     */
+    cancelButtonProps?: ButtonProps;
+    /**
+     * Custom right element
+     */
+    customRightElement?: React.ReactElement;
+    /**
+     * Whether to show a loader instead of the left search icon
+     */
+    showLoader?: boolean;
+    /**
+     * Loader props
+     */
+    loaderProps?: ActivityIndicatorProps;
+    /**
+     * custom loader element
+     */
+    customLoader?: React.ReactElement;
+    /**
+     * converts the colors of the search's input elements, icons and button to white
+     */
+    invertColors?: boolean;
+    /**
+     * Turn off accessibility for this view and its nested children
+     */
+    inaccessible?: boolean;
+    /**
+     * in case the SearchInput is rendered in a safe area (top of the screen)
+     */
+    useSafeArea?: boolean;
+    /**
+     * Override styles for container
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Override styles for the input
+     */
+    containerStyle?: StyleProp<ViewStyle | TextStyle>;
+    /**
+     * The preset for the search input: default or prominent
+     */
+    preset?: SearchInputPresets | `${SearchInputPresets}`;
+};

package/src/components/sectionsWheelPicker/SectionsWheelPicker.driver.d.ts

@@ -0,0 +1,25 @@
+import type { ReactTestInstance } from 'react-test-renderer';
+import { ComponentProps } from '../../testkit/new/Component.driver';
+export declare const SectionsWheelPickerDriver: (props: ComponentProps) => {
+    sections: import("../WheelPicker").WheelPickerProps<import("../WheelPicker").WheelPickerItemValue>[] | undefined;
+    sectionsDrivers: {
+        getListHeight: () => any;
+        moveToItem: (index: number, itemHeight?: number, numberOfRows?: number) => void;
+        getLabel: () => string | (string | ReactTestInstance)[];
+        scroll: (contentOffset: Partial<import("react-native/types").NativeScrollPoint>, options?: {
+            contentInset: import("react-native/types").NativeScrollRectangle;
+            zoomScale: number;
+            layoutMeasurement: import("react-native/types").NativeScrollSize;
+            contentSize: import("react-native/types").NativeScrollSize;
+            velocity?: import("react-native/types").NativeScrollVelocity | undefined;
+            targetContentOffset?: import("react-native/types").NativeScrollPoint | undefined;
+        } | undefined) => void;
+        triggerEvent: (eventName?: string | undefined, event?: Partial<import("react-native/types").NativeScrollEvent> | undefined) => void;
+        getElement: () => ReactTestInstance;
+        queryElement: () => ReactTestInstance | undefined;
+        exists: () => boolean;
+    }[];
+    getElement: () => ReactTestInstance;
+    queryElement: () => ReactTestInstance | undefined;
+    exists: () => boolean;
+};

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

@@ -0,0 +1,43 @@
+import React, { PropsWithChildren } from 'react';
+import { TextStyle } from 'react-native';
+import { WheelPickerProps, WheelPickerItemValue } from '../WheelPicker';
+export type SectionsWheelPickerProps<T = WheelPickerItemValue> = PropsWithChildren<{
+    /**
+     * Array of sections.
+     */
+    sections?: WheelPickerProps<T>[];
+    /**
+     * Describe the height of each item in the WheelPicker
+     * default value: 44
+     */
+    itemHeight?: number;
+    /**
+     * Describe the number of rows visible
+     * default value: 5
+     */
+    numberOfVisibleRows?: number;
+    /**
+     * Text color for the focused row
+     */
+    activeTextColor?: string;
+    /**
+     * Text color for other, non-focused rows
+     */
+    inactiveTextColor?: string;
+    /**
+     * Row text style
+     */
+    textStyle?: TextStyle;
+    disableRTL?: boolean;
+    testID?: string;
+}>;
+/**
+ * @description: SectionsWheelPicker component for presenting set of wheelPickers
+ * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/SectionsWheelPickerScreen.tsx
+ * @gif: https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/SectionsWheelPicker/SectionsWheelPicker.gif?raw=true
+ */
+declare const SectionsWheelPicker: {
+    <T extends WheelPickerItemValue>(props: SectionsWheelPickerProps<T>): React.JSX.Element;
+    displayName: string;
+};
+export default SectionsWheelPicker;

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

@@ -0,0 +1,90 @@
+import React from 'react';
+import { StyleProp, ViewStyle, TextStyle } from 'react-native';
+import { SegmentedControlItemProps } from './segment';
+import { TextProps } from '../text';
+export declare enum SegmentedControlPreset {
+    DEFAULT = "default",
+    FORM = "form"
+}
+export { SegmentedControlItemProps };
+export type SegmentedControlProps = {
+    /**
+     * Array on segments.
+     */
+    segments: SegmentedControlItemProps[];
+    /**
+     * The color of the active segment label.
+     */
+    activeColor?: string;
+    /**
+     * The color of the inactive segments (label).
+     */
+    inactiveColor?: string;
+    /**
+     * Callback for when index has change.
+     */
+    onChangeIndex?: (index: number) => void;
+    /**
+     * Initial index to be active.
+     */
+    initialIndex?: number;
+    /**
+     * The segmentedControl borderRadius
+     */
+    borderRadius?: number;
+    /**
+     * The background color of the inactive segments
+     */
+    backgroundColor?: string;
+    /**
+     * The background color of the active segment
+     */
+    activeBackgroundColor?: string;
+    /**
+     * The color of the active segment outline
+     */
+    outlineColor?: string;
+    /**
+     * The width of the active segment outline
+     */
+    outlineWidth?: number;
+    /**
+     * Should the icon be on right of the label
+     */
+    iconOnRight?: boolean;
+    /**
+     * Trailing throttle time of changing index in ms.
+     */
+    throttleTime?: number;
+    /**
+     * Additional style for the segment
+     */
+    segmentsStyle?: StyleProp<ViewStyle>;
+    /**
+     * Segment label style
+     */
+    segmentLabelStyle?: StyleProp<TextStyle>;
+    /**
+     * Additional spacing styles for the container
+     */
+    containerStyle?: StyleProp<ViewStyle>;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+    /**
+     * Preset type
+     */
+    preset?: SegmentedControlPreset | `${SegmentedControlPreset}`;
+    /**
+     * SegmentedControl label
+     */
+    label?: string;
+    /**
+     * Pass props for the SegmentedControl label
+     */
+    labelProps?: TextProps;
+};
+interface StaticMembers {
+    presets: typeof SegmentedControlPreset;
+}
+declare const _default: React.ForwardRefExoticComponent<SegmentedControlProps & React.RefAttributes<any>> & StaticMembers;
+export default _default;

package/src/components/segmentedControl/segment.d.ts

@@ -0,0 +1,111 @@
+import React from 'react';
+import { LayoutChangeEvent, ImageStyle, StyleProp, ViewStyle } from 'react-native';
+import Reanimated from 'react-native-reanimated';
+import { SegmentedControlProps } from './index';
+import { IconProps } from '../icon';
+export type SegmentedControlItemProps = Pick<SegmentedControlProps, 'segmentLabelStyle'> & {
+    /**
+     * The label of the segment.
+     */
+    label?: string;
+    /**
+     * An icon for the segment.
+     */
+    iconSource?: IconProps['source'];
+    /**
+     * An icon for the segment.
+     */
+    iconStyle?: StyleProp<ImageStyle>;
+    /**
+     * Should the icon be on right of the label
+     */
+    iconOnRight?: boolean;
+    /**
+     * Icon tint color
+     */
+    iconTintColor?: string;
+};
+export type SegmentProps = SegmentedControlItemProps & {
+    /**
+     * Shared value of the current selected index.
+     */
+    selectedIndex?: Reanimated.SharedValue<number>;
+    /**
+     * The color of the active segment (label and outline).
+     */
+    activeColor?: string;
+    /**
+     * The color of the inactive segment (label).
+     */
+    inactiveColor?: string;
+    /**
+     * Callback for when segment has pressed.
+     */
+    onPress?: (index: number) => void;
+    /**
+     * The index of the segment.
+     */
+    index: number;
+    /**
+     * onLayout function.
+     */
+    onLayout?: (index: number, event: LayoutChangeEvent) => void;
+    /**
+     * Additional style for the segment.
+     */
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+};
+declare const _default: React.ForwardRefExoticComponent<Pick<SegmentedControlProps, "segmentLabelStyle"> & {
+    /**
+     * The label of the segment.
+     */
+    label?: string | undefined;
+    /**
+     * An icon for the segment.
+     */
+    iconSource?: import("../image").ImageSourceType;
+    /**
+     * An icon for the segment.
+     */
+    iconStyle?: StyleProp<ImageStyle>;
+    /**
+     * Should the icon be on right of the label
+     */
+    iconOnRight?: boolean | undefined;
+    /**
+     * Icon tint color
+     */
+    iconTintColor?: string | undefined;
+} & {
+    /**
+     * Shared value of the current selected index.
+     */
+    selectedIndex?: Reanimated.SharedValue<number> | undefined;
+    /**
+     * The color of the active segment (label and outline).
+     */
+    activeColor?: string | undefined;
+    /**
+     * The color of the inactive segment (label).
+     */
+    inactiveColor?: string | undefined;
+    /**
+     * Callback for when segment has pressed.
+     */
+    onPress?: ((index: number) => void) | undefined;
+    /**
+     * The index of the segment.
+     */
+    index: number;
+    /**
+     * onLayout function.
+     */
+    onLayout?: ((index: number, event: LayoutChangeEvent) => void) | undefined;
+    /**
+     * Additional style for the segment.
+     */
+    style?: StyleProp<ViewStyle>;
+    testID?: string | undefined;
+} & React.RefAttributes<any>>;
+export default _default;

package/src/components/segmentedControl/useSegmentedControlPreset.d.ts

@@ -0,0 +1,10 @@
+import type { SegmentedControlProps } from './';
+import { SegmentProps } from './segment';
+import type { ColorValue } from 'react-native';
+interface useSegmentedControlPresetProps extends SegmentedControlProps, Partial<SegmentProps> {
+    segmentDividerWidth: number;
+    segmentDividerColor: ColorValue;
+    iconTintColor?: string;
+}
+declare const useSegmentedControlPreset: (props: SegmentedControlProps) => useSegmentedControlPresetProps;
+export default useSegmentedControlPreset;

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

@@ -0,0 +1,163 @@
+import React, { Component } from 'react';
+import { Animated, StyleProp, ViewStyle, AccessibilityProps } from 'react-native';
+import { AlignmentModifiers, PaddingModifiers, MarginModifiers } from '../../commons/new';
+export declare enum Template {
+    LIST_ITEM = "listItem",
+    TEXT_CONTENT = "content"
+}
+export declare enum Size {
+    SMALL = "small",
+    LARGE = "large"
+}
+export declare enum ContentType {
+    AVATAR = "avatar",
+    THUMBNAIL = "thumbnail"
+}
+export interface SkeletonListProps {
+    /**
+     * The size of the skeleton view.
+     * Types: SMALL and LARGE (using SkeletonView.sizes.###)
+     */
+    size?: Size | `${Size}`;
+    /**
+     * Add content to the skeleton.
+     * Types: AVATAR and THUMBNAIL (using SkeletonView.contentTypes.###)
+     */
+    contentType?: ContentType | `${ContentType}`;
+    /**
+     * Whether to hide the list item template separator
+     */
+    hideSeparator?: boolean;
+    /**
+     * Whether to show the last list item template separator
+     */
+    showLastSeparator?: boolean;
+    /**
+     * Extra content to be rendered on the end of the list item
+     */
+    renderEndContent?: () => React.ReactElement | undefined;
+}
+export interface SkeletonViewProps extends AccessibilityProps, AlignmentModifiers, PaddingModifiers, MarginModifiers {
+    /**
+     * The content has been loaded, start fading out the skeleton and fading in the content
+     */
+    showContent?: boolean;
+    /**
+     * A function that will render the content once the content is ready (i.e. showContent is true).
+     * The method will be called with the Skeleton's customValue (i.e. renderContent(props?.customValue))
+     */
+    renderContent?: (customValue?: any) => React.ReactNode;
+    /**
+     * Custom value of any type to pass on to SkeletonView and receive back in the renderContent callback.
+     */
+    customValue?: any;
+    /**
+     * The type of the skeleton view.
+     * Types: LIST_ITEM and TEXT_CONTENT (using SkeletonView.templates.###)
+     */
+    template?: Template | `${Template}`;
+    /**
+     * Props that are available when using template={SkeletonView.templates.LIST_ITEM}
+     */
+    listProps?: SkeletonListProps;
+    /**
+     * An object that holds the number of times the skeleton will appear, and (optionally) the key.
+     * The key will actually be `${key}-${index}` if a key is given or `${index}` if no key is given.
+     * IMPORTANT: your data (i.e. children \ renderContent) will NOT be duplicated.
+     * Note: testID will be `${testID}-${index}`
+     */
+    times?: number;
+    /**
+     * A key for the duplicated SkeletonViews.
+     * This is needed because the `key` prop is not accessible.
+     */
+    timesKey?: string;
+    /**
+     * The height of the skeleton view
+     */
+    height?: number;
+    /**
+     * The width of the skeleton view
+     */
+    width?: number;
+    /**
+     * The colors of the skeleton view, the array length has to be >=2
+     * default: [Colors.grey70, Colors.grey60, Colors.grey70]
+     */
+    colors?: string[];
+    /**
+     * The border radius of the skeleton view
+     */
+    borderRadius?: number;
+    /**
+     * Whether the skeleton is a circle (will override the borderRadius)
+     */
+    circle?: boolean;
+    /**
+     * Additional style to the skeleton view
+     */
+    shimmerStyle?: StyleProp<ViewStyle>;
+    /**
+     * Override container styles
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Used to locate this view in end-to-end tests
+     */
+    testID?: string;
+    children?: React.ReactNode;
+}
+interface SkeletonState {
+    isAnimating: boolean;
+    opacity: Animated.Value;
+}
+/**
+ * @description: Allows showing a temporary skeleton view while your real view is loading.
+ * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/SkeletonViewScreen.tsx
+ * @image: https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Skeleton/Skeleton.gif?raw=true
+ * @notes: View requires installing the 'react-native-shimmer-placeholder' and 'react-native-linear-gradient' library
+ */
+declare class SkeletonView extends Component<SkeletonViewProps, SkeletonState> {
+    static displayName: string;
+    static defaultProps: {
+        size: Size;
+        borderRadius: number;
+    };
+    static templates: typeof Template;
+    static sizes: typeof Size;
+    static contentTypes: typeof ContentType;
+    fadeInAnimation?: Animated.CompositeAnimation;
+    contentAccessibilityProps?: AccessibilityProps;
+    listItemAccessibilityProps?: AccessibilityProps;
+    setAccessibilityProps(template?: SkeletonViewProps['template']): void;
+    constructor(props: SkeletonViewProps);
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: SkeletonViewProps): void;
+    fade(isFadeIn: boolean, onAnimationEnd?: Animated.EndCallback): Animated.CompositeAnimation;
+    showChildren: () => void;
+    getDefaultSkeletonProps: (input?: {
+        circleOverride: boolean;
+        style: StyleProp<ViewStyle>;
+    }) => {
+        shimmerColors: string[];
+        isReversed: boolean;
+        style: StyleProp<ViewStyle>[];
+        width: number | undefined;
+        height: number;
+        shimmerStyle: StyleProp<ViewStyle>;
+    };
+    get contentSize(): 40 | 48;
+    renderListItemLeftContent: () => React.JSX.Element | undefined;
+    renderStrip: (isMain: boolean, length: number, marginTop: number) => React.JSX.Element;
+    renderListItemContentStrips: () => React.JSX.Element;
+    getListItemStyle: (this: any, style: any) => any[];
+    renderListItemTemplate: () => React.JSX.Element;
+    renderTextContentTemplate: () => React.JSX.Element;
+    renderTemplate: () => React.JSX.Element;
+    renderAdvanced: () => React.JSX.Element;
+    renderWithFading: (skeleton: any) => string | number | boolean | React.JSX.Element | Iterable<React.ReactNode> | null | undefined;
+    renderSkeleton(): string | number | boolean | React.JSX.Element | Iterable<React.ReactNode> | null | undefined;
+    renderNothing: () => null;
+    render(): string | number | boolean | React.JSX.Element | Iterable<React.ReactNode> | null | undefined;
+}
+export default SkeletonView;

package/src/components/slider/ColorSliderGroup.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="tinycolor2" />
+import React from 'react';
+import { ColorSliderGroupProps } from './types';
+/**
+ * @description: A Gradient Slider component
+ * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/SliderScreen.tsx
+ * @gif: https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/ColorSliderGroup/ColorSliderGroup.gif?raw=true
+ */
+declare const ColorSliderGroup: {
+    <T extends string | import("tinycolor2").ColorFormats.HSLA = string>(props: ColorSliderGroupProps<T>): React.JSX.Element;
+    displayName: string;
+};
+export default ColorSliderGroup;

package/src/components/slider/GradientSlider.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="tinycolor2" />
+import React from 'react';
+import { ForwardRefInjectedProps } from '../../commons/new';
+import { ComponentStatics } from '../../typings/common';
+import { GradientSliderProps, GradientSliderTypes } from './types';
+type Props<T> = GradientSliderProps<T> & ForwardRefInjectedProps;
+declare const _default: React.ForwardRefExoticComponent<Omit<import("./types").SliderProps, "onValueChange"> & {
+    color?: string | import("tinycolor2").ColorFormats.HSLA | undefined;
+    type?: "default" | "hue" | "saturation" | "lightness" | GradientSliderTypes | undefined;
+    gradientSteps?: number | undefined;
+    onValueChange?: ((value: string, alfa: number) => void) | undefined;
+    accessible?: boolean | undefined;
+    containerStyle?: import("react-native/types").StyleProp<import("react-native/types").ViewStyle>;
+    disabled?: boolean | undefined;
+} & React.RefAttributes<any>> & ComponentStatics<{
+    <T extends string | import("tinycolor2").ColorFormats.HSLA = string>(props: Props<T>): React.JSX.Element;
+    displayName: string;
+    types: typeof GradientSliderTypes;
+}>;
+export default _default;

package/src/components/slider/SliderContext.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { HSLA } from './types';
+export interface SliderContextType {
+    value?: HSLA;
+    setValue?: (value: HSLA) => void;
+}
+declare const SliderContext: React.Context<SliderContextType>;
+export default SliderContext;