mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2026-10-04 14:57:10 +00:00
react-alice-carousel: Provides its own types (#39503)
This commit is contained in:
Alexander T
committed by
Jesse Trinity
Jesse Trinity
parent
244b82ca60
commit
b0d33e68ae
@@ -3252,6 +3252,12 @@
|
||||
"sourceRepoURL": "https://github.com/uhop/node-re2",
|
||||
"asOfVersion": "1.10.3"
|
||||
},
|
||||
{
|
||||
"libraryName": "react-alice-carousel",
|
||||
"typingsPackageName": "react-alice-carousel",
|
||||
"sourceRepoURL": "https://github.com/maxmarinich/react-alice-carousel",
|
||||
"asOfVersion": "1.15.3"
|
||||
},
|
||||
{
|
||||
"libraryName": "react-chartjs-2",
|
||||
"typingsPackageName": "react-chartjs-2",
|
||||
|
||||
-184
@@ -1,184 +0,0 @@
|
||||
// Type definitions for react-alice-carousel 1.15
|
||||
// Project: https://github.com/maxmarinich/react-alice-carousel
|
||||
// Definitions by: endigo <https://github.com/endigo>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
// TypeScript Version: 2.8
|
||||
|
||||
import * as React from "react";
|
||||
|
||||
export interface EventObject {
|
||||
item: number;
|
||||
slide: number;
|
||||
itemsInSlide: number;
|
||||
}
|
||||
|
||||
export interface Props {
|
||||
/**
|
||||
* Gallery items, preferable to use this property instead of children
|
||||
*
|
||||
* Default: [].
|
||||
*/
|
||||
items?: Array<{}>;
|
||||
/**
|
||||
* Number of items in the slide.
|
||||
*
|
||||
* Default: {}.
|
||||
*/
|
||||
responsive?: {};
|
||||
/**
|
||||
* Padding left and right on the stage
|
||||
*
|
||||
* Default: {}.
|
||||
*/
|
||||
stagePadding?: {};
|
||||
/**
|
||||
* Disable keys controls (left, right, space)
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
keysControlDisabled?: boolean;
|
||||
/**
|
||||
* Disable play/pause button
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
playButtonEnabled?: boolean;
|
||||
/**
|
||||
* Disable buttons control
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
buttonsDisabled?: boolean;
|
||||
/**
|
||||
* Disable dots navigation
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
dotsDisabled?: boolean;
|
||||
/**
|
||||
* Disable swipe handlers
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
swipeDisabled?: boolean;
|
||||
/**
|
||||
* Duration of slides transition (milliseconds)
|
||||
*
|
||||
* Default: 250.
|
||||
*/
|
||||
duration?: number;
|
||||
/**
|
||||
* The starting index of the carousel
|
||||
*
|
||||
* Default: 0.
|
||||
*/
|
||||
startIndex?: number;
|
||||
/**
|
||||
* Sets the carousel at the specified position
|
||||
*
|
||||
* Default: 0.
|
||||
*/
|
||||
slideToIndex?: number;
|
||||
/**
|
||||
* Set auto play mode
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
autoPlay?: boolean;
|
||||
/**
|
||||
* Disable infinite mode
|
||||
*
|
||||
* Default: true.
|
||||
*/
|
||||
infinite?: boolean;
|
||||
/**
|
||||
* Enable mouse drag animation
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
mouseDragEnabled?: boolean;
|
||||
/**
|
||||
* Enable fadeout animation. Fired when 1 item is in the slide
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
fadeOutAnimation?: boolean;
|
||||
/**
|
||||
* Interval of auto play animation (milliseconds). If specified, a larger value will be taken from comparing this property and the duration one
|
||||
*
|
||||
* Default: 250.
|
||||
*/
|
||||
autoPlayInterval?: number;
|
||||
/**
|
||||
* To run auto play in the left direction specify rtl value
|
||||
*
|
||||
* Default: 'ltr'.
|
||||
*/
|
||||
autoPlayDirection?: string;
|
||||
/**
|
||||
* If this property is identified as true auto play animation will be stopped after clicking user on any gallery button
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
disableAutoPlayOnAction?: boolean;
|
||||
/**
|
||||
* If this property is identified as true auto play animation will be stopped after clicking user on any gallery button
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
autoPlayActionDisabled?: boolean;
|
||||
/**
|
||||
* If this property is identified as false auto play animation won't stopped on hover
|
||||
*
|
||||
* Default: true.
|
||||
*/
|
||||
stopAutoPlayOnHover?: boolean;
|
||||
/**
|
||||
* Show slide info
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
showSlideInfo?: boolean;
|
||||
/**
|
||||
* Prevent the browser's touchmove event when carousel is swiping
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
preventEventOnTouchMove?: boolean;
|
||||
/**
|
||||
* Set auto height for the stage
|
||||
*
|
||||
* Default: false.
|
||||
*/
|
||||
autoHeight?: boolean;
|
||||
/**
|
||||
* Fired when the event object is changing / returns event object
|
||||
*/
|
||||
onSlideChange?: (e: EventObject) => void;
|
||||
/**
|
||||
* Fired when the event object was changed / returns event object
|
||||
*/
|
||||
onSlideChanged?: (e: EventObject) => void;
|
||||
/**
|
||||
* Fired when the gallery was initialized / returns event object
|
||||
*/
|
||||
onInitialized?: (e: EventObject) => void;
|
||||
/**
|
||||
* Fired when the gallery was resized / returns event object
|
||||
*/
|
||||
onResized?: (e: EventObject) => void;
|
||||
/**
|
||||
* Fired during resize event to determine whether the event handler should be called / return boolean
|
||||
*/
|
||||
shouldHandleResizeEvent?: (e: any) => boolean;
|
||||
}
|
||||
|
||||
export function slideTo(index: number): void;
|
||||
export function slidePrev(): void;
|
||||
export function slideNext(): void;
|
||||
|
||||
export default class ReactAliceCarousel extends React.PureComponent<Props> {
|
||||
slideTo(index: number): void;
|
||||
slidePrev(): void;
|
||||
slideNext(): void;
|
||||
}
|
||||
@@ -1,60 +0,0 @@
|
||||
import * as React from 'react';
|
||||
import AliceCarousel, { Props, EventObject } from 'react-alice-carousel';
|
||||
|
||||
class SimpleAliceCarousel extends React.Component<Props> {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<AliceCarousel/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class Gallery extends React.Component<Props> {
|
||||
onSlideChange(e: EventObject) {
|
||||
// console.log('Item`s position during a change: ', e.item);
|
||||
// console.log('Slide`s position during a change: ', e.slide);
|
||||
}
|
||||
|
||||
onSlideChanged(e: EventObject) {
|
||||
// console.log('Item`s position after changes: ', e.item);
|
||||
// console.log('Slide`s position after changes: ', e.slide);
|
||||
}
|
||||
|
||||
render() {
|
||||
const responsive = {
|
||||
0: {
|
||||
items: 1
|
||||
},
|
||||
600: {
|
||||
items: 2
|
||||
},
|
||||
1024: {
|
||||
items: 3
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<AliceCarousel
|
||||
duration={400}
|
||||
autoPlay={true}
|
||||
startIndex = {1}
|
||||
fadeOutAnimation={true}
|
||||
mouseDragEnabled={true}
|
||||
playButtonEnabled={true}
|
||||
responsive={responsive}
|
||||
autoPlayInterval={2000}
|
||||
autoPlayDirection="rtl"
|
||||
onSlideChange={this.onSlideChange}
|
||||
onSlideChanged={this.onSlideChanged}
|
||||
>
|
||||
<div className="yours-custom-class"><h2>1</h2></div>
|
||||
<div className="yours-custom-class"><h2>2</h2></div>
|
||||
<div className="yours-custom-class"><h2>3</h2></div>
|
||||
<div className="yours-custom-class"><h2>4</h2></div>
|
||||
<div className="yours-custom-class"><h2>5</h2></div>
|
||||
</AliceCarousel>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,24 +0,0 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"module": "commonjs",
|
||||
"lib": [
|
||||
"es6"
|
||||
],
|
||||
"noImplicitAny": true,
|
||||
"noImplicitThis": true,
|
||||
"strictNullChecks": true,
|
||||
"strictFunctionTypes": true,
|
||||
"baseUrl": "../",
|
||||
"typeRoots": [
|
||||
"../"
|
||||
],
|
||||
"types": [],
|
||||
"noEmit": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"jsx": "react"
|
||||
},
|
||||
"files": [
|
||||
"index.d.ts",
|
||||
"react-alice-carousel-tests.tsx"
|
||||
]
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
{ "extends": "dtslint/dt.json" }
|
||||
Reference in New Issue
Block a user