lucid-ui
Version:
A UI component library from Xandr.
109 lines • 4.05 kB
TypeScript
import React from 'react';
import PropTypes from 'prop-types';
import { StandardProps } from '../../util/component-types';
/** Slide Panel Slide */
export interface ISlidePanelSlideProps extends StandardProps {
description?: string;
}
declare class SlidePanelSlide extends React.Component<ISlidePanelSlideProps, {}, {}> {
static displayName: string;
static propName: string;
render(): null;
}
/** Slide Panel */
export interface ISlidePanelProps extends StandardProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
/** Max number of viewable slides to show simultaneously. */
slidesToShow: number;
/** The offset of the left-most rendered slide. */
offset: number;
/** Animate slides transitions from changes in `offset`. */
isAnimated: boolean;
/** Slides are rendered in a continuous loop, where the first slide repeats
* after the last slide and vice-versa. DOM elements are re-ordered and
* re-used. */
isLooped: boolean;
/** Called when a user's swipe would change the offset. Callback passes
* number of slides by the user (positive for forward swipes, negative for
* backwards swipes). */
onSwipe: (slidesSwiped: number, { event, props }: {
event: React.TouchEvent;
props: ISlidePanelProps;
}) => void;
}
interface ISlidePanelState {
translateXPixel: number;
startX: number;
isDragging: boolean;
isAnimated: boolean;
}
declare class SlidePanel extends React.Component<ISlidePanelProps, ISlidePanelState, {}> {
static _isPrivate: boolean;
static displayName: string;
static peek: {
description: string;
categories: string[];
};
static propTypes: {
/**
Appended to the component-specific class names set on the root element.
*/
className: PropTypes.Requireable<string>;
/**
SlidePanel.Slide elements are passed in as children.
*/
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
/**
This is the child component that will be displayed inside the SlidePanel.
*/
Slide: PropTypes.Requireable<any>;
/**
Max number of viewable slides to show simultaneously.
*/
slidesToShow: PropTypes.Requireable<number>;
/**
The offset of the left-most rendered slide.
*/
offset: PropTypes.Requireable<number>;
/**
Animate slides transitions from changes in \`offset\`.
*/
isAnimated: PropTypes.Requireable<boolean>;
/**
Slides are rendered in a continuous loop, where the first slide repeats
after the last slide and vice-versa. DOM elements are re-ordered and
re-used.
*/
isLooped: PropTypes.Requireable<boolean>;
/**
Called when a user's swipe would change the offset. Callback passes
number of slides by the user (positive for forward swipes, negative for
backwards swipes). Signature: \`(slidesSwiped, { event, props }) => {}\`
*/
onSwipe: PropTypes.Requireable<(...args: any[]) => any>;
};
private rootHTMLDivElement;
private slideStrip;
static Slide: typeof SlidePanelSlide;
offsetTranslate: number;
state: {
translateXPixel: number;
startX: number;
isAnimated: boolean;
isDragging: boolean;
};
static defaultProps: {
slidesToShow: number;
offset: number;
isAnimated: boolean;
onSwipe: (...args: any[]) => void;
isLooped: boolean;
};
handleTouchStart: (event: React.TouchEvent) => void;
handleTouchMove: (event: React.TouchEvent) => void;
handleTouchEnd: (event: React.TouchEvent) => void;
componentDidMount(): void;
componentDidUpdate(prevProps: ISlidePanelProps, prevState: ISlidePanelState): void;
render(): React.ReactNode;
}
export default SlidePanel;
//# sourceMappingURL=SlidePanel.d.ts.map