Last active
March 8, 2024 18:33
-
-
Save sakgoyal/701db76182e3f49a6bc709a1ead1461c to your computer and use it in GitHub Desktop.
Some people write some TS code. I updated it to work with TS v5. its not perfect. but i only spent 5 minutes on it...
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
declare class ReactTrelloBoard<CardMetaData extends object = {}> extends React.Component<ReactTrello.BoardProps<CardMetaData>> {} | |
declare module ReactTrello { | |
interface NewCardTemplateProps<CardMetaData extends object = {}> { | |
laneId: string; | |
onAdd: (card: Card<CardMetaData>) => void; | |
onCancel: () => void; | |
} | |
interface BoardData<CardMetaData extends object = {}> { | |
lanes: Lane<CardMetaData>[]; | |
} | |
type node = unknown & React.ReactNode; | |
type element = unknown & React.ReactElement<unknown>; | |
interface EventBus { | |
publish: (arg0 : any) => void; | |
} | |
export interface Card<CardMetaData extends object = {}> { | |
id ?: string; | |
title : string; | |
description : string; | |
label ?: string; | |
metadata ?: CardMetaData; | |
draggable ?: boolean; | |
tags ?: Tags[]; | |
} | |
interface Tags { | |
title: string; | |
color: string; | |
bgcolor: string; | |
} | |
interface Lane<CardMetaData extends object = {}>{ | |
id: string; | |
title?: string; | |
label?: string; | |
cards?: Card<CardMetaData>[]; | |
disallowAddingCard?: boolean; | |
} | |
interface BoardProps<CardMetaData extends object = {}> { | |
/** Makes all cards and lanes draggable. @default false */ | |
draggable?: boolean; | |
/** Set to false to disable lane dragging. @default true */ | |
laneDraggable?: boolean; | |
/** Set to false to disable card dragging. @default true */ | |
cardDraggable?: boolean; | |
/** Make the lanes with cards collapsible. @default false */ | |
collapsibleLanes?: boolean; | |
/** Makes the entire board editable. Allow cards to be added or deleted @default false */ | |
editable?: boolean; | |
/** Allows new lanes to be added to the board @default false */ | |
canAddLanes?: boolean; | |
/** Disable showing the delete icon to the top right corner of the card (when board is editable) */ | |
hideCardDeleteIcon?: boolean; | |
/** Allow inline lane title edit. Default: false */ | |
editLaneTitle?: boolean; | |
/** Callback triggered when the board data changes. */ | |
onDataChange?: (newData: object) => void; | |
/** Callback triggered when a card is clicked. */ | |
onCardClick?: (cardId: string, metadata: CardMetaData, laneId: string) => void; | |
/** Callback triggered when a new card is added. */ | |
onCardAdd?: (card: Card, laneId: string) => void; | |
/** Callback triggered before deleting a card. Call the callback() if confirming card deletion. */ | |
onBeforeCardDelete?: (callback: () => void) => void; | |
/** Callback triggered when a card is deleted. */ | |
onCardDelete?: (cardId: string, laneId: string) => void; | |
/** Callback triggered when a card is moved across lanes. */ | |
onCardMoveAcrossLanes?: (fromLaneId: string, toLaneId: string, cardId: string, index: number) => void; | |
/** Callback triggered when a new lane is added. */ | |
onLaneAdd?: (params: object) => void; | |
/** Callback triggered when a lane is deleted. */ | |
onLaneDelete?: (laneId: string) => void; | |
/** Callback triggered when a lane's attributes are updated. */ | |
onLaneUpdate?: (laneId: string, data: Lane) => void; | |
/** Callback triggered when a lane is clicked. */ | |
onLaneClick?: (laneId: string) => void; | |
/** Callback triggered when a lane is scrolled to the end. */ | |
onLaneScroll?: (requestedPage: number, laneId: string) => void; | |
/** Callback triggered when card drag is started. */ | |
handleDragStart?: (cardId: string, laneId: string) => void; | |
/** Callback triggered when card drag ends. Return false to cancel drop. */ | |
handleDragEnd?: ( | |
cardId: string, | |
sourceLaneId: string, | |
targetLaneId: string, | |
position: number, | |
cardDetails: object | |
) => boolean | void; | |
/** Callback triggered when lane drag is started. */ | |
handleLaneDragStart?: (laneId: string) => void; | |
/** Callback triggered when lane drag ends. */ | |
handleLaneDragEnd?: (removedIndex: number, addedIndex: number, payload: object) => void; | |
/** Special function providing a publishHook to pass new events to the board. */ | |
eventBusHandle?: (publishHook: Function) => void; | |
/** Used to specify the logic to sort cards on a lane. */ | |
laneSortFunction?: (card1: object, card2: object) => number; | |
/** Language of compiled texts ("en", "ru", "pt-br"). Default is "en". */ | |
lang?: string; | |
/** Translation function. Look into ./src/locales for keys list. */ | |
t?: (key: string) => string; | |
/** CSS class to be applied to Card when being dragged */ | |
cardDragClass?: string; | |
/** CSS class to be applied to Lane when being dragged */ | |
laneDragClass?: string; | |
/** Pass custom element to replace the Add Card link at the end of the lane (when board is editable) */ | |
components?: { | |
AddCardLink?: React.JSX.Element; | |
NewCardForm?: React.JSX.Element; | |
Card?: React.JSX.Element; | |
}; | |
addCardLink?: React.JSX.Element; | |
/** Pass a custom new card template to add new cards to a lane (when board is editable) */ | |
newCardTemplate?: node; | |
/** Pass a custom new lane template to add new lanes to a board (when board is editable) */ | |
newLaneTemplate?: node; | |
/** Pass css style props to board container */ | |
style?: React.CSSProperties; | |
/** Pass css style props to lane container */ | |
laneStyle?: React.CSSProperties; | |
/** Pass css style props to card container */ | |
cardStyle?: React.CSSProperties; | |
/** Boolean to indicate a custom card template will be specified. Add the card component as child to Board */ | |
customCardLayout?: boolean; | |
/** Pass custom lane header as react component to modify appearance */ | |
customLaneHeader?: element; | |
/** Actual board data in the form of json */ | |
data: BoardData<CardMetaData>; | |
/** If cards have tags, use this prop to modify their style */ | |
tagStyle?: object; | |
addLaneTitle?: string; | |
addCardTitle?: string; | |
} | |
} | |
declare module "react-trello" { | |
export default ReactTrelloBoard; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment