mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2026-06-28 22:30:01 +00:00
[react-beautiful-dnd] Update type for react-beautiful-dnd 10.1 (#33791)
Release note: https://github.com/atlassian/react-beautiful-dnd/releases/tag/v10.1.0
This commit is contained in:
committed by
Wesley Wigham
parent
b1a104ea4f
commit
087cbdb2f7
5
types/react-beautiful-dnd/index.d.ts
vendored
5
types/react-beautiful-dnd/index.d.ts
vendored
@@ -1,4 +1,4 @@
|
||||
// Type definitions for react-beautiful-dnd 10.0
|
||||
// Type definitions for react-beautiful-dnd 10.1
|
||||
// Project: https://github.com/atlassian/react-beautiful-dnd
|
||||
// Definitions by: varHarrie <https://github.com/varHarrie>
|
||||
// Bradley Ayers <https://github.com/bradleyayers>
|
||||
@@ -6,6 +6,7 @@
|
||||
// Mark Nelissen <https://github.com/marknelissen>
|
||||
// Enrico Boccadifuoco <https://github.com/enricoboccadifuoco>
|
||||
// Taeheon Kim <https://github.com/lonyele>
|
||||
// Kanitkorn Sujautra <https://github.com/lukyth>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
// TypeScript Version: 2.8
|
||||
|
||||
@@ -111,6 +112,7 @@ export interface DroppableProvided {
|
||||
export interface DroppableStateSnapshot {
|
||||
isDraggingOver: boolean;
|
||||
draggingOverWith?: DraggableId;
|
||||
draggingFromThisWith?: DraggableId;
|
||||
}
|
||||
|
||||
export interface DroppableProps {
|
||||
@@ -205,6 +207,7 @@ export interface DraggableProps {
|
||||
disableInteractiveElementBlocking?: boolean;
|
||||
children(provided: DraggableProvided, snapshot: DraggableStateSnapshot): React.ReactElement;
|
||||
type?: TypeId;
|
||||
shouldRespectForceTouch?: boolean;
|
||||
}
|
||||
|
||||
export class Draggable extends React.Component<DraggableProps> { }
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as React from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import { DragDropContext, Draggable, Droppable, DropResult, DragStart, DragUpdate, ResponderProvided } from 'react-beautiful-dnd';
|
||||
import { DragDropContext, Draggable, Droppable, DropResult, DragStart, DragUpdate, ResponderProvided, DroppableStateSnapshot } from 'react-beautiful-dnd';
|
||||
|
||||
interface Item {
|
||||
id: string;
|
||||
@@ -30,8 +30,8 @@ const getItemStyle = (isDragging: boolean, draggableStyle: any) => ({
|
||||
...draggableStyle
|
||||
});
|
||||
|
||||
const getListStyle = (isDraggingOver: any) => ({
|
||||
background: isDraggingOver ? 'lightblue' : 'lightgrey',
|
||||
const getListStyle = (snapshot: DroppableStateSnapshot) => ({
|
||||
background: snapshot.draggingFromThisWith ? 'lightpink' : snapshot.isDraggingOver ? 'lightblue' : 'lightgrey',
|
||||
width: 250
|
||||
});
|
||||
|
||||
@@ -87,9 +87,9 @@ class App extends React.Component<{}, AppState> {
|
||||
<DragDropContext onBeforeDragStart={this.onBeforeDragStart} onDragStart={this.onDragStart} onDragUpdate={this.onDragUpdate} onDragEnd={this.onDragEnd}>
|
||||
<Droppable droppableId="droppable" ignoreContainerClipping={false} isCombineEnabled={true}>
|
||||
{(provided, snapshot) => (
|
||||
<div ref={provided.innerRef} style={getListStyle(snapshot.isDraggingOver)} {...provided.droppableProps}>
|
||||
<div ref={provided.innerRef} style={getListStyle(snapshot)} {...provided.droppableProps}>
|
||||
{this.state.items.map((item, index) => (
|
||||
<Draggable key={item.id} draggableId={item.id} index={index}>
|
||||
<Draggable key={item.id} draggableId={item.id} index={index} shouldRespectForceTouch={false}>
|
||||
{(provided, snapshot) => (
|
||||
<div>
|
||||
<div
|
||||
|
||||
Reference in New Issue
Block a user