mirror of
https://github.com/chenasraf/DefinitelyTyped.git
synced 2026-05-18 01:49:01 +00:00
🤖 Merge PR #65395 Update react-swipeable-views prop types with action prop by @shawngustaw
* Update react-swipeable-views prop types with action prop * Run prettier * Remove dependency --------- Co-authored-by: Shawn Gustaw <shawn@jump.com>
This commit is contained in:
17
types/react-swipeable-views/index.d.ts
vendored
17
types/react-swipeable-views/index.d.ts
vendored
@@ -13,9 +13,17 @@ export type OnTransitionEndCallback = () => void;
|
||||
|
||||
export type OnSwitchingCallback = (index: number, type: OnSwitchingCallbackTypeDescriptor) => void;
|
||||
|
||||
export type OnSwitchingCallbackTypeDescriptor = "move" | "end";
|
||||
export type OnSwitchingCallbackTypeDescriptor = 'move' | 'end';
|
||||
|
||||
export type AxisType = "x" | "x-reverse" | "y" | "y-reverse";
|
||||
export type AxisType = 'x' | 'x-reverse' | 'y' | 'y-reverse';
|
||||
|
||||
export interface Actions {
|
||||
updateHeight: UpdateHeightAction;
|
||||
}
|
||||
|
||||
export type ActionCallback = (actions: Actions) => void;
|
||||
|
||||
export type UpdateHeightAction = () => void;
|
||||
|
||||
export interface SpringConfig {
|
||||
duration: string;
|
||||
@@ -23,7 +31,7 @@ export interface SpringConfig {
|
||||
delay: string;
|
||||
}
|
||||
|
||||
export interface SwipeableViewsProps extends React.HTMLProps<HTMLDivElement> {
|
||||
export interface SwipeableViewsProps extends Omit<React.HTMLProps<HTMLDivElement>, 'action'> {
|
||||
animateHeight?: boolean | undefined;
|
||||
animateTransitions?: boolean | undefined;
|
||||
axis?: AxisType | undefined;
|
||||
@@ -46,6 +54,7 @@ export interface SwipeableViewsProps extends React.HTMLProps<HTMLDivElement> {
|
||||
springConfig?: SpringConfig | undefined;
|
||||
slideClassName?: string | undefined;
|
||||
threshold?: number | undefined;
|
||||
action?: ActionCallback;
|
||||
}
|
||||
|
||||
export interface SwipeableViewsState {
|
||||
@@ -57,4 +66,4 @@ export interface SwipeableViewsState {
|
||||
displaySameSlide?: boolean | undefined;
|
||||
}
|
||||
|
||||
export default class SwipeableViews extends React.Component<SwipeableViewsProps, SwipeableViewsState> { }
|
||||
export default class SwipeableViews extends React.Component<SwipeableViewsProps, SwipeableViewsState> {}
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
import * as React from 'react';
|
||||
import SwipeableViews,
|
||||
{
|
||||
import SwipeableViews, {
|
||||
OnChangeIndexCallback,
|
||||
OnSwitchingCallback,
|
||||
OnSwitchingCallbackTypeDescriptor,
|
||||
OnTransitionEndCallback,
|
||||
SpringConfig
|
||||
SpringConfig,
|
||||
ActionCallback,
|
||||
} from 'react-swipeable-views';
|
||||
|
||||
const onChangeIndex: OnChangeIndexCallback = (indexNew: number, indexLatest: number) => {
|
||||
@@ -17,17 +17,21 @@ const onSwitching: OnSwitchingCallback = (index: number, type: OnSwitchingCallba
|
||||
};
|
||||
|
||||
const onTransitionEnd: OnTransitionEndCallback = () => {
|
||||
console.log("Transition end.");
|
||||
console.log('Transition end.');
|
||||
};
|
||||
|
||||
const style: React.CSSProperties = {
|
||||
height: 300
|
||||
height: 300,
|
||||
};
|
||||
|
||||
const springConfig: SpringConfig = {
|
||||
duration: "0.5s",
|
||||
easeFunction: "cubic-bezier(0.1, 0.35, 0.2, 1)",
|
||||
delay: "0.5s",
|
||||
duration: '0.5s',
|
||||
easeFunction: 'cubic-bezier(0.1, 0.35, 0.2, 1)',
|
||||
delay: '0.5s',
|
||||
};
|
||||
|
||||
const action: ActionCallback = actions => {
|
||||
console.log('Receiving actions: ', Object.keys(actions).join(', '));
|
||||
};
|
||||
|
||||
React.createElement(SwipeableViews, {
|
||||
@@ -40,12 +44,13 @@ React.createElement(SwipeableViews, {
|
||||
slideStyle: style,
|
||||
style,
|
||||
threshold: 100,
|
||||
className: "swipable-view",
|
||||
title: "Carousel",
|
||||
className: 'swipable-view',
|
||||
title: 'Carousel',
|
||||
onTransitionEnd,
|
||||
axis: "x-reverse",
|
||||
axis: 'x-reverse',
|
||||
springConfig,
|
||||
disableLazyLoading: false
|
||||
disableLazyLoading: false,
|
||||
action,
|
||||
});
|
||||
|
||||
React.createElement(SwipeableViews, {});
|
||||
|
||||
Reference in New Issue
Block a user