SYMBOL INDEX (1663 symbols across 512 files)
FILE: packages/auto-scroll/__tests__/unit/_util.ts
function getDefaultInput (line 15) | function getDefaultInput(overrides: Partial = {}): Input {
function appendToBody (line 38) | function appendToBody(...elements: Element[]): CleanupFn {
function getEmptyHistory (line 50) | function getEmptyHistory(input: Input = getDefaultInput()): DragLocation...
function getInitialHistory (line 65) | function getInitialHistory(
function setBoundingClientRect (line 83) | function setBoundingClientRect(el: HTMLElement, rect: DOMRect): CleanupFn {
function tryGetRect (line 92) | function tryGetRect(box: Partial[0]>): DOMRect {
function getRect (line 102) | function getRect(box: {
function getElements (line 125) | function getElements(tagName: keyof HTMLElementTagNameMap = 'div'): Iter...
function getBubbleOrderedTree (line 144) | function getBubbleOrderedTree(
method lift (line 170) | lift(target: HTMLElement, input?: Partial): void {
method drop (line 183) | drop(target: Element): void {
method cancel (line 186) | cancel(target: Element = document.body): void {
method leaveWindow (line 192) | leaveWindow(): void {
method startExternalDrag (line 195) | startExternalDrag({
method rougePointerMoves (line 213) | rougePointerMoves(): void {
function reset (line 223) | async function reset(): Promise {
function getBubbleOrderedPath (line 231) | function getBubbleOrderedPath(path: Element[]): Element[] {
function setElementFromPointWithPath (line 245) | function setElementFromPointWithPath(path: Element[]): CleanupFn {
function setElementFromPoint (line 258) | function setElementFromPoint(element: Element | null): CleanupFn {
function stepScrollBy (line 264) | function stepScrollBy(): void {
function setStartSystemTime (line 275) | function setStartSystemTime(): void {
function advanceTimersToNextFrame (line 284) | function advanceTimersToNextFrame(): void {
type BasicElementArgs (line 297) | type BasicElementArgs = {
function setupNestedScrollContainers (line 304) | function setupNestedScrollContainers(bubbleOrdered: BasicElementArgs[]):...
function setupBasicScrollContainer (line 425) | function setupBasicScrollContainer({
type Point (line 439) | type Point = Position & { label: string };
function getInsidePoints (line 440) | function getInsidePoints(rect: DOMRect): Point[] {
function getOutsidePoints (line 454) | function getOutsidePoints(rect: DOMRect): Point[] {
type AxisScroll (line 474) | type AxisScroll = Record;
type AxisMovement (line 475) | type AxisMovement = Record;
type Event (line 476) | type Event = { type: string } & Partial;
type Scenario (line 477) | type Scenario = {
function getScenarios (line 484) | function getScenarios(rect: DOMRect, offset: number = 0): Scenario[] {
function getAxisScroll (line 585) | function getAxisScroll(container: HTMLElement): AxisScroll {
function hasAxisScrolled (line 592) | function hasAxisScrolled(container: HTMLElement, previousScroll: AxisScr...
function isExpectingScrollEvent (line 599) | function isExpectingScrollEvent(movement: AxisMovement): boolean {
function getExpectedEvents (line 603) | function getExpectedEvents(movement: AxisMovement): Event[] {
type TTarget (line 615) | type TTarget = Element | Window | Document;
function makeDispatch (line 616) | function makeDispatch(eventName: string) {
FILE: packages/auto-scroll/__tests__/unit/over-element/distance-dampening.spec.ts
type Scenario (line 42) | type Scenario = {
method listener (line 101) | listener() {
FILE: packages/auto-scroll/__tests__/unit/over-element/hitbox.spec.ts
type Scenario (line 29) | type Scenario = {
type Group (line 35) | type Group = {
method listener (line 245) | listener() {
method listener (line 321) | listener() {
FILE: packages/auto-scroll/__tests__/unit/over-element/max-speed.spec.ts
function stepFrame (line 34) | function stepFrame({ frameDuration }: { frameDuration: number }) {
function stepScrollBy (line 40) | function stepScrollBy() {
method listener (line 77) | listener() {
method listener (line 170) | listener() {
method listener (line 268) | listener() {
FILE: packages/auto-scroll/__tests__/unit/over-element/registration.spec.ts
method listener (line 56) | listener() {
method listener (line 112) | listener() {
method listener (line 181) | listener() {
FILE: packages/auto-scroll/__tests__/unit/over-element/start.spec.ts
method listener (line 46) | listener() {
FILE: packages/auto-scroll/__tests__/unit/over-element/stop.spec.ts
method listener (line 54) | listener() {
method listener (line 131) | listener() {
FILE: packages/auto-scroll/__tests__/unit/over-element/time-dampening.spec.ts
method listener (line 73) | listener() {
method listener (line 224) | listener() {
method listener (line 373) | listener() {
method listener (line 522) | listener() {
method listener (line 681) | listener() {
method listener (line 924) | listener() {
function execute (line 957) | function execute() {
method listener (line 1281) | listener() {
method listener (line 1717) | listener() {
method listener (line 1805) | listener() {
function dragOperation (line 1909) | function dragOperation() {
method listener (line 1994) | listener(event) {
FILE: packages/auto-scroll/__tests__/unit/over-element/window-scrolling.spec.ts
function canScrollOnBottom (line 42) | function canScrollOnBottom(element: HTMLElement): boolean {
FILE: packages/auto-scroll/__tests__/unit/overflow/allowed-axis.spec.ts
constant OUTSIDE_OFFSET (line 40) | const OUTSIDE_OFFSET = 10;
FILE: packages/auto-scroll/__tests__/unit/overflow/cross-axis-hitbox.spec.ts
type Scenario (line 54) | type Scenario = {
function getOverElementMainHitboxSize (line 89) | function getOverElementMainHitboxSize(edge: Edge) {
FILE: packages/auto-scroll/__tests__/unit/overflow/main-axis-hitbox.spec.ts
type Scenario (line 52) | type Scenario = {
FILE: packages/auto-scroll/__tests__/unit/overflow/over-element-should-not-scroll.spec.ts
method listener (line 92) | listener() {
FILE: packages/auto-scroll/__tests__/unit/overflow/provided-hitbox-spacing-type.spec.ts
type GetOverflowFn (line 7) | type GetOverflowFn = Parameters;
FILE: packages/auto-scroll/__tests__/unit/shared/_util.ts
function findHoneyPot (line 5) | function findHoneyPot(): Element | null {
function getHoneyPot (line 9) | function getHoneyPot(): HTMLElement {
FILE: packages/auto-scroll/__tests__/unit/shared/ignore-honey-pot.spec.ts
method listener (line 50) | listener() {
FILE: packages/auto-scroll/__tests__/unit/shared/time-dampening-handover.spec.ts
method listener (line 70) | listener() {
function dragBelowParent (line 113) | function dragBelowParent() {
function dragOntoParentBottomEdge (line 123) | function dragOntoParentBottomEdge() {
function isInTimeDampeningPeriod (line 137) | function isInTimeDampeningPeriod() {
FILE: packages/auto-scroll/examples/axis-locking.tsx
function AxisLocking (line 5) | function AxisLocking(): React.JSX.Element {
FILE: packages/auto-scroll/examples/lazy-loaded.tsx
function LazyLoaded (line 5) | function LazyLoaded(): React.JSX.Element {
FILE: packages/auto-scroll/examples/nested-scroll.tsx
type ItemType (line 33) | type ItemType = {
function Item (line 47) | function Item({ item }: { item: ItemType }) {
function getItems (line 68) | function getItems({ listId, count }: { listId: string; count: number }):...
function List (line 80) | function List({ listId, children }: { listId: string; children?: ReactEl...
function WindowScroll (line 104) | function WindowScroll(): React.JSX.Element {
FILE: packages/auto-scroll/examples/over-element.tsx
function OverElement (line 13) | function OverElement(): React.JSX.Element {
FILE: packages/auto-scroll/examples/pieces/board-context.ts
type TBoardContext (line 5) | type TBoardContext = {
FILE: packages/auto-scroll/examples/pieces/board.tsx
function useRequiredContext (line 14) | function useRequiredContext(
type TItem (line 22) | type TItem = { id: string };
type TColumn (line 23) | type TColumn = {
function Column (line 40) | function Column({ column }: { column: TColumn }) {
function getColumns (line 76) | function getColumns({ count }: { count: number }): TColumn[] {
function Board (line 92) | function Board(): React.JSX.Element {
FILE: packages/auto-scroll/examples/pieces/card.tsx
type TItem (line 34) | type TItem = { id: string };
type CardState (line 36) | type CardState =
function Card (line 57) | function Card({ item }: { item: TItem }): React.JSX.Element {
function CardPreview (line 113) | function CardPreview({ rect }: { rect: DOMRect }) {
FILE: packages/auto-scroll/examples/pieces/lazy-loaded-board.tsx
type TItem (line 13) | type TItem = { id: string };
type TColumn (line 14) | type TColumn = {
function Column (line 31) | function Column({ column }: { column: TColumn }) {
type LoadingState (line 92) | type LoadingState = 'pending' | 'loading' | 'loaded';
function getColumns (line 106) | function getColumns({ count }: { count: number }): TColumn[] {
function Board (line 122) | function Board(): React.JSX.Element {
FILE: packages/auto-scroll/examples/pieces/table.tsx
type TItem (line 14) | type TItem = { id: string };
constant COLUMN_COUNT (line 16) | const COLUMN_COUNT = 8;
function getItems (line 19) | function getItems({ count }: { count: number }): TItem[] {
function Cell (line 25) | function Cell({ isSticky, children }: PropsWithChildren<{ isSticky?: boo...
function Row (line 33) | function Row({ item }: { item: TItem }) {
function Table (line 49) | function Table(): React.JSX.Element {
FILE: packages/auto-scroll/examples/unsafe-overflow-box.tsx
function getHugeContent (line 12) | function getHugeContent(): string {
function Example (line 43) | function Example(): React.JSX.Element {
FILE: packages/auto-scroll/examples/unsafe-overflow-only.tsx
function UnsafeOverflowOnly (line 62) | function UnsafeOverflowOnly(): React.JSX.Element {
FILE: packages/auto-scroll/examples/unsafe-overflow.tsx
function UnsafeOverflow (line 70) | function UnsafeOverflow(): React.JSX.Element {
FILE: packages/auto-scroll/examples/window-scroll-with-scroll-container.tsx
type ItemType (line 33) | type ItemType = {
function Item (line 47) | function Item({ item }: { item: ItemType }) {
function WindowScroll (line 83) | function WindowScroll(): React.JSX.Element {
FILE: packages/auto-scroll/examples/window-scroll.tsx
type ItemType (line 33) | type ItemType = {
function Item (line 47) | function Item({ item }: { item: ItemType }) {
function WindowScroll (line 79) | function WindowScroll(): React.JSX.Element {
FILE: packages/auto-scroll/src/internal-types.ts
type ElementGetFeedbackArgs (line 3) | type ElementGetFeedbackArgs = {
type WindowGetFeedbackArgs (line 18) | type WindowGetFeedbackArgs = Omit<
type Spacing (line 23) | type Spacing = {
type Edge (line 30) | type Edge = keyof Spacing;
type EngagementHistoryEntry (line 32) | type EngagementHistoryEntry = {
type InternalConfig (line 36) | type InternalConfig = {
type PublicConfig (line 44) | type PublicConfig = Partial<{
type ElementAutoScrollArgs (line 48) | type ElementAutoScrollArgs = {
type WindowAutoScrollArgs (line 55) | type WindowAutoScrollArgs = {
type Side (line 61) | type Side = 'start' | 'end';
type Axis (line 62) | type Axis = 'vertical' | 'horizontal';
type AllowedAxis (line 63) | type AllowedAxis = Axis | 'all';
FILE: packages/auto-scroll/src/over-element/data-attributes.ts
function addScrollableAttribute (line 6) | function addScrollableAttribute(element: Element): CleanupFn {
FILE: packages/auto-scroll/src/over-element/get-scroll-by.ts
type ScrollableEdge (line 17) | type ScrollableEdge = {
function getRectDefault (line 22) | function getRectDefault(element: Element) {
function getScrollBy (line 26) | function getScrollBy({
FILE: packages/auto-scroll/src/over-element/make-api.ts
function makeApi (line 16) | function makeApi({
FILE: packages/auto-scroll/src/over-element/try-scroll.ts
type AvailableScrollDirection (line 17) | type AvailableScrollDirection = { top: boolean; left: boolean };
function isScrollingAvailable (line 19) | function isScrollingAvailable(value: AvailableScrollDirection): boolean {
function tryScrollElements (line 23) | function tryScrollElements({
function tryScrollWindow (line 125) | function tryScrollWindow({
function tryScroll (line 191) | function tryScroll({
FILE: packages/auto-scroll/src/shared/configuration.ts
function getInternalConfig (line 47) | function getInternalConfig(provided?: PublicConfig | undefined): Interna...
FILE: packages/auto-scroll/src/shared/engagement-history.ts
function markAndGetEngagement (line 6) | function markAndGetEngagement(element: Element): EngagementHistoryEntry {
function markEngagement (line 20) | function markEngagement(element: Element): void {
function clearUnusedEngagements (line 24) | function clearUnusedEngagements(fn: () => void): void {
function clearEngagementHistory (line 42) | function clearEngagementHistory(): void {
FILE: packages/auto-scroll/src/shared/get-over-element-hitbox.ts
function makeGetHitbox (line 6) | function makeGetHitbox({ edge, axis }: { edge: Edge; axis: Axis }) {
FILE: packages/auto-scroll/src/shared/get-percentage-in-range.ts
function getPercentageInRange (line 1) | function getPercentageInRange({
FILE: packages/auto-scroll/src/shared/get-scroll-change.ts
function getMaxScrollChange (line 10) | function getMaxScrollChange({
function getDistanceDampening (line 32) | function getDistanceDampening({
function getScrollChange (line 74) | function getScrollChange({
FILE: packages/auto-scroll/src/shared/is-axis-allowed.ts
function isAxisAllowed (line 3) | function isAxisAllowed(axis: Axis, allowedAxis: AllowedAxis): boolean {
FILE: packages/auto-scroll/src/shared/is-within.ts
function isWithin (line 3) | function isWithin({
FILE: packages/auto-scroll/src/shared/scheduler.ts
type State (line 11) | type State =
type OnFrameFn (line 32) | type OnFrameFn = (args: {
type Scheduler (line 41) | type Scheduler = {
function getScheduler (line 53) | function getScheduler(
function makeScheduler (line 67) | function makeScheduler(
FILE: packages/auto-scroll/src/unsafe-overflow/get-scroll-by.ts
type HitboxForEdge (line 18) | type HitboxForEdge = {
function getIsDistanceDampeningEnabled (line 26) | function getIsDistanceDampeningEnabled(value: HitboxForEdge): boolean {
function getSpacingFromProvided (line 30) | function getSpacingFromProvided(value: Partial | undefined): Sp...
function getHitboxSpacing (line 39) | function getHitboxSpacing(provided: ProvidedHitboxSpacing): HitboxSpacing {
function getScrollBy (line 48) | function getScrollBy({
FILE: packages/auto-scroll/src/unsafe-overflow/hitbox.ts
function makeGetHitbox (line 10) | function makeGetHitbox({ axis, side }: { axis: Axis; side: Side }) {
FILE: packages/auto-scroll/src/unsafe-overflow/make-api.ts
function makeApi (line 13) | function makeApi({
FILE: packages/auto-scroll/src/unsafe-overflow/try-overflow-scroll.ts
function tryOverflowScrollElements (line 9) | function tryOverflowScrollElements({
FILE: packages/auto-scroll/src/unsafe-overflow/types.ts
type VerticalEdges (line 5) | type VerticalEdges = ['top' | 'bottom'];
type HorizontalEdges (line 6) | type HorizontalEdges = ['left' | 'right'];
type CrossAxisEdges (line 7) | type CrossAxisEdges = T extends VerticalEdges[number]
type HitboxSpacing (line 12) | type HitboxSpacing = {
type ProvidedHitboxSpacing (line 17) | type ProvidedHitboxSpacing = {
type UnsafeOverflowAutoScrollArgs (line 31) | type UnsafeOverflowAutoScrollArgs =
FILE: packages/core/__tests__/playwright/external-files.spec.ts
function getElement (line 8) | async function getElement(page: Page, selector: string) {
FILE: packages/core/__tests__/playwright/honey-pot.spec.ts
type Data (line 5) | type Data = {
method toContainData (line 14) | async toContainData(locator: Locator, expected: Partial) {
FILE: packages/core/__tests__/playwright/iframe.spec.ts
function center (line 5) | function center(box: { x: number; y: number; height: number; width: numb...
function realisticDragTo (line 30) | async function realisticDragTo({ page, start, end }: { page: Page; start...
function setup (line 50) | async function setup({ page }: { page: Page }) {
FILE: packages/core/__tests__/playwright/scroll-just-enough-into-view.spec.ts
function getScrollTop (line 5) | async function getScrollTop(locator: Locator) {
FILE: packages/core/__tests__/unit/_util.ts
function getDefaultInput (line 13) | function getDefaultInput(overrides: Partial = {}): Input {
function appendToBody (line 36) | function appendToBody(...elements: Element[]): CleanupFn {
function getEmptyHistory (line 48) | function getEmptyHistory(input: Input = getDefaultInput()): DragLocation...
function getInitialHistory (line 63) | function getInitialHistory(
function setBoundingClientRect (line 81) | function setBoundingClientRect(el: HTMLElement, rect: DOMRect): CleanupFn {
function getRect (line 90) | function getRect(box: {
function getBubbleOrderedPath (line 112) | function getBubbleOrderedPath(path: Element[]): Element[] {
function setElementFromPointWithPath (line 126) | function setElementFromPointWithPath(path: Element[]): CleanupFn {
function setElementFromPoint (line 139) | function setElementFromPoint(element: Element | null): CleanupFn {
function getElements (line 148) | function getElements(
function getBubbleOrderedTree (line 170) | function getBubbleOrderedTree(
type SimpleItem (line 195) | type SimpleItem = { data: string; type: NativeMediaType } | File;
function addItemsToEvent (line 196) | function addItemsToEvent({ event, items }: { event: DragEvent; items: Si...
method startExternal (line 207) | startExternal({
method startInternal (line 224) | startInternal({ items, target }: { items: SimpleItem[]; target: Element ...
method startTextSelectionDrag (line 234) | startTextSelectionDrag({ element = document.body }: { element: Element }...
method drop (line 256) | drop({
function isTextNode (line 270) | function isTextNode(node: Node): node is Text {
function getFirstTextNode (line 274) | function getFirstTextNode(element: Element): Text {
function withDefaults (line 297) | function withDefaults(input?: Partial): Input {
method lift (line 305) | lift(target: HTMLElement, input?: Partial): void {
method drop (line 312) | drop(target: Element, input?: Partial): void {
method cancel (line 315) | cancel(target: Element = document.body, input?: Partial): void {
method leaveWindow (line 322) | leaveWindow(): void {
method rougePointerMoves (line 325) | rougePointerMoves(): void {
function reset (line 335) | function reset(): void {
function makeDispatch (line 349) | function makeDispatch(eventName: string) {
function clearSelection (line 376) | function clearSelection(): void {
function select (line 380) | function select(element: HTMLElement): CleanupFn {
FILE: packages/core/__tests__/unit/android/is-android.spec.ts
function setAndroidUserAgent (line 18) | function setAndroidUserAgent(): CleanupFn {
method listener (line 53) | listener(event) {
method listener (line 89) | listener(event) {
method listener (line 127) | listener(event) {
method onDrop (line 200) | onDrop({ source }) {
FILE: packages/core/__tests__/unit/android/not-android.spec.ts
method listener (line 38) | listener(event) {
method onDrop (line 79) | onDrop({ source }) {
FILE: packages/core/__tests__/unit/element/changes-during-a-drag.spec.ts
function getLabel (line 400) | function getLabel({
function add (line 412) | function add({ id, eventName }: { id: string; eventName: string }) {
FILE: packages/core/__tests__/unit/element/dragleave-should-not-update-input.spec.ts
function getEntry (line 23) | function getEntry(label: string, current: { clientX: number; clientY: nu...
FILE: packages/core/__tests__/unit/element/drop-target/drop-effect.spec.ts
function getChangingEffects (line 144) | function getChangingEffects(...effects: DropTargetAllowedDropEffect[]) {
FILE: packages/core/__tests__/unit/element/drop-target/lift.spec.ts
type Args (line 369) | type Args = Parameters[0];
type GetDataArgs (line 370) | type GetDataArgs = Parameters>[0];
FILE: packages/core/__tests__/unit/element/previous-location-should-match-last-current.spec.ts
function getLookup (line 16) | function getLookup() {
FILE: packages/core/__tests__/unit/element/public-utils/block-dragging-to-iframes.spec.ts
function isPointerEventsBlocked (line 18) | function isPointerEventsBlocked(iframe: HTMLIFrameElement): boolean {
FILE: packages/core/__tests__/unit/element/public-utils/center-under-pointer.spec.ts
function makeMock (line 29) | function makeMock(
method onGenerateDragPreview (line 42) | onGenerateDragPreview({ nativeSetDragImage }) {
FILE: packages/core/__tests__/unit/element/public-utils/pointer-outside-of-preview.spec.ts
function makeMock (line 21) | function makeMock(
method onGenerateDragPreview (line 34) | onGenerateDragPreview({ nativeSetDragImage }) {
function makeMock (line 98) | function makeMock(
method onGenerateDragPreview (line 111) | onGenerateDragPreview({ nativeSetDragImage }) {
FILE: packages/core/__tests__/unit/element/public-utils/preserve-offset-on-source.spec.ts
function makeMock (line 49) | function makeMock(
method render (line 71) | render({ container }) {
function makeMock (line 119) | function makeMock(
method render (line 141) | render({ container }) {
FILE: packages/core/__tests__/unit/element/public-utils/set-custom-native-drag-preview.spec.ts
method onGenerateDragPreview (line 38) | onGenerateDragPreview({ nativeSetDragImage }) {
method onGenerateDragPreview (line 76) | onGenerateDragPreview({ nativeSetDragImage }) {
function makeMock (line 126) | function makeMock(
method onGenerateDragPreview (line 140) | onGenerateDragPreview({ nativeSetDragImage }) {
function makeMock (line 180) | function makeMock(
method onGenerateDragPreview (line 193) | onGenerateDragPreview({ nativeSetDragImage }) {
function makeMock (line 237) | function makeMock(
method onGenerateDragPreview (line 250) | onGenerateDragPreview({ nativeSetDragImage }) {
FILE: packages/core/__tests__/unit/element/resiliant-against-consumers-stopping-events-during-a-drag.spec.ts
function onEvent (line 13) | function onEvent(event: DragEvent) {
function onEvent (line 114) | function onEvent(event: DragEvent) {
FILE: packages/core/__tests__/unit/external/adapter/exposing-data.spec.ts
function sort (line 26) | function sort(array: readonly Value[]): Value[] {
function getKeys (line 42) | function getKeys>(obj: Obj): (keyof ...
function addFakeDataToEvent (line 46) | function addFakeDataToEvent(event: DragEvent) {
FILE: packages/core/__tests__/unit/external/adapter/get-string-data.spec.ts
function getBucket (line 18) | function getBucket() {
FILE: packages/core/__tests__/unit/external/adapter/leaving-the-window.spec.ts
method onDragStart (line 20) | onDragStart(args) {
method onDrop (line 24) | onDrop(args) {
FILE: packages/core/__tests__/unit/external/adapter/starting-an-external-drag.spec.ts
method onDragStart (line 81) | onDragStart(args) {
FILE: packages/core/__tests__/unit/external/utils/url/firefox-fix.spec.ts
type Scenario (line 86) | type Scenario = {
FILE: packages/core/__tests__/unit/external/utils/url/url.spec.ts
type Scenario (line 71) | type Scenario = {
FILE: packages/core/__tests__/unit/honey-pot-fix/_util.ts
function findHoneyPot (line 5) | function findHoneyPot(): Element | null {
function getHoneyPot (line 9) | function getHoneyPot(): HTMLElement {
FILE: packages/core/__tests__/unit/honey-pot-fix/event-listeners.spec.ts
function clearMocks (line 16) | function clearMocks() {
FILE: packages/core/__tests__/unit/honey-pot-fix/finishing.spec.ts
type Item (line 12) | type Item = {
FILE: packages/core/__tests__/unit/public-utils/once.spec.ts
type Person (line 48) | type Person = {
function getAge (line 51) | function getAge(this: Person): number {
function add (line 74) | function add(a: number, b: number): number {
FILE: packages/core/__tests__/unit/public-utils/prevent-unhandled.spec.ts
function cancel (line 13) | function cancel(target: Element): DragEvent {
function drop (line 20) | function drop(target: Element): DragEvent {
method onDragStart (line 34) | onDragStart() {
method onDrop (line 38) | onDrop() {
method onDragStart (line 66) | onDragStart() {
method onDrop (line 70) | onDrop() {
method onDragStart (line 119) | onDragStart() {
method onDrop (line 123) | onDrop() {
method onDragStart (line 155) | onDragStart() {
method onDrop (line 159) | onDrop() {
method onDragStart (line 193) | onDragStart() {
method onDrop (line 199) | onDrop() {
method onDragStart (line 286) | onDragStart() {
method onDrop (line 290) | onDrop() {
method onDragStart (line 383) | onDragStart() {
method onDrop (line 389) | onDrop() {
FILE: packages/core/__tests__/unit/react/adding-monitors-during-events.spec.tsx
function add (line 19) | function add({ label, isDragging }: { label: string; isDragging: boolean...
function App (line 23) | function App() {
function add (line 98) | function add({ label, isDragging }: { label: string; isDragging: boolean...
function App (line 102) | function App() {
FILE: packages/core/__tests__/unit/test-environment-guardrail.spec.ts
method onGenerateDragPreview (line 22) | onGenerateDragPreview() {
method onDragStart (line 25) | onDragStart() {
method onDragStart (line 53) | onDragStart() {
method onDragStart (line 87) | onDragStart() {
FILE: packages/core/__tests__/unit/text-selection/adapter/event-ordering.spec.ts
type Entry (line 20) | type Entry = {
function getDropTargets (line 26) | function getDropTargets(location: TextSelectionEventBasePayload['locatio...
FILE: packages/core/__tests__/unit/text-selection/adapter/leaving-the-window.spec.ts
method onDragStart (line 14) | onDragStart() {
method onDrop (line 17) | onDrop() {
FILE: packages/core/examples/_util/global-styles.tsx
function GlobalStyles (line 19) | function GlobalStyles(): React.JSX.Element {
FILE: packages/core/examples/drag-preview-with-transparency.tsx
function FakeText (line 21) | function FakeText() {
function Preview (line 37) | function Preview() {
type ItemState (line 46) | type ItemState =
function ItemNoOffset (line 51) | function ItemNoOffset() {
function ItemOffsetFromPointer (line 83) | function ItemOffsetFromPointer() {
function ItemCenter (line 116) | function ItemCenter() {
function ItemPreserveOffsetOnSource (line 149) | function ItemPreserveOffsetOnSource() {
function Example (line 185) | function Example(): React.JSX.Element {
FILE: packages/core/examples/element-adapter.tsx
function Example (line 1) | function Example() {
FILE: packages/core/examples/file.tsx
function FileList (line 54) | function FileList({ uploads }: { uploads: File[] }) {
function Uploader (line 67) | function Uploader() {
function Example (line 120) | function Example(): React.JSX.Element {
FILE: packages/core/examples/iframe.tsx
function IframeOuter (line 40) | function IframeOuter(): React.JSX.Element {
FILE: packages/core/examples/native.tsx
type DragState (line 74) | type DragState =
function CurrentlyDragging (line 91) | function CurrentlyDragging() {
function DropTarget (line 169) | function DropTarget() {
function App (line 301) | function App() {
function Example (line 313) | function Example(): React.JSX.Element {
FILE: packages/core/examples/native/activity-log.tsx
function ActivityLog (line 10) | function ActivityLog(): React.JSX.Element {
FILE: packages/core/examples/native/app.tsx
function App (line 24) | function App(): React.JSX.Element {
FILE: packages/core/examples/native/content.tsx
type CardState (line 33) | type CardState = 'idle' | 'generate-preview' | 'dragging';
function Card (line 47) | function Card() {
function CardWithExternal (line 75) | function CardWithExternal() {
function DraggableAnchor (line 109) | function DraggableAnchor() {
function DraggableAnchorWithNewUrl (line 126) | function DraggableAnchorWithNewUrl() {
function DraggableAnchorWithCustomPreview (line 147) | function DraggableAnchorWithCustomPreview() {
function DraggableImage (line 178) | function DraggableImage() {
function DraggableImageWithCustomPreview (line 192) | function DraggableImageWithCustomPreview() {
function Content (line 220) | function Content(): React.JSX.Element {
FILE: packages/core/examples/native/drop-target.tsx
type State (line 47) | type State = 'idle' | 'potential' | 'over';
function DropTarget (line 55) | function DropTarget(): React.JSX.Element {
FILE: packages/core/examples/post-drop-bug-fix-simple.tsx
function Card (line 60) | function Card({ cardId }: { cardId: string }) {
type Card (line 126) | type Card = {
function getCards (line 129) | function getCards() {
function DropTest (line 139) | function DropTest() {
function Example (line 186) | function Example(): React.JSX.Element {
FILE: packages/core/examples/post-drop-bug-fix.tsx
function Card (line 101) | function Card({
type Card (line 200) | type Card = {
function getCards (line 203) | function getCards() {
function DropTest (line 215) | function DropTest({ layout }: { layout: 'vertical' | 'horizontal' }) {
function DragEndTest (line 256) | function DragEndTest() {
function Example (line 302) | function Example(): React.JSX.Element {
FILE: packages/core/examples/preserve-offset-on-source.tsx
type CardDragState (line 16) | type CardDragState = 'idle' | 'preview' | 'dragging';
function Card (line 30) | function Card({ id, isPreview = false }: { id: string; isPreview?: boole...
function CardList (line 96) | function CardList({ cardIds }: { cardIds: string[] }) {
function Example (line 108) | function Example(): React.JSX.Element {
FILE: packages/core/examples/scroll-just-enough-into-view.tsx
function Draggable (line 52) | function Draggable({ testId }: { testId: string }) {
function DropTarget (line 79) | function DropTarget({ children, testId }: { children: ReactNode; testId:...
function Example (line 98) | function Example(): React.JSX.Element {
FILE: packages/core/examples/stickiness.tsx
type ItemData (line 11) | type ItemData = {
function ListItem (line 83) | function ListItem({ itemData, index }: { itemData: ItemData; index: numb...
function StickinessExample (line 122) | function StickinessExample(): React.JSX.Element {
FILE: packages/core/examples/text-selection.tsx
type DropTargetState (line 20) | type DropTargetState = 'idle' | 'potential' | 'over';
function DropTarget (line 44) | function DropTarget() {
function TextSelectionDragging (line 97) | function TextSelectionDragging(): React.JSX.Element {
FILE: packages/core/examples/url.tsx
function App (line 51) | function App() {
function Example (line 115) | function Example(): React.JSX.Element {
FILE: packages/core/src/adapter/element-adapter.ts
type DraggableGetFeedbackArgs (line 32) | type DraggableGetFeedbackArgs = {
type DraggableArgs (line 47) | type DraggableArgs = {
function addToRegistry (line 76) | function addToRegistry(args: DraggableArgs): CleanupFn {
method mount (line 89) | mount(api: AdapterAPI): CleanupFn {
function draggable (line 335) | function draggable(args: DraggableArgs): CleanupFn {
type ElementEventBasePayload (line 374) | type ElementEventBasePayload = BaseEventPayload;
type ElementEventPayloadMap (line 377) | type ElementEventPayloadMap = EventPayloadMap;
type ElementDropTargetEventBasePayload (line 380) | type ElementDropTargetEventBasePayload = DropTargetEventBasePayload): CleanupFn {
type StripEventsForDropTargets (line 190) | type StripEventsForDropTargets = Omit = Omit;
function dropTargetForExternal (line 193) | function dropTargetForExternal(
function monitorForExternal (line 200) | function monitorForExternal(
type State (line 218) | type State =
function clear (line 234) | function clear() {
function bindEndEvents (line 243) | function bindEndEvents() {
method listener (line 263) | listener() {
type ExternalEventBasePayload (line 283) | type ExternalEventBasePayload = BaseEventPayload;
type ExternalEventPayloadMap (line 286) | type ExternalEventPayloadMap = StripEventsForMonitors): CleanupFn {
type StripPreviewEvent (line 170) | type StripPreviewEvent = Omit;
function dropTargetForTextSelection (line 172) | function dropTargetForTextSelection(
function monitorForTextSelection (line 188) | function monitorForTextSelection(
type TextSelectionEventBasePayload (line 196) | type TextSelectionEventBasePayload = BaseEventPayload void;
function mountHoneyPot (line 141) | function mountHoneyPot({ initial }: { initial: Position }): FinishHoneyP...
function makeHoneyPotFix (line 240) | function makeHoneyPotFix(): {
FILE: packages/core/src/internal-types.ts
type CleanupFn (line 1) | type CleanupFn = () => void;
type DropTargetAllowedDropEffect (line 9) | type DropTargetAllowedDropEffect = Exclude = {
type Input (line 154) | type Input = {
type DragLocation (line 169) | type DragLocation = {
type DragLocationHistory (line 184) | type DragLocationHistory = {
type BaseEventPayload (line 212) | type BaseEventPayload = {
type EventPayloadMap (line 223) | type EventPayloadMap = {
type AllEvents (line 261) | type AllEvents = {
type MonitorGetFeedbackArgs (line 267) | type MonitorGetFeedbackArgs = {
type MonitorArgs (line 278) | type MonitorArgs = Partial = {
type DropTargetLocalizedData (line 297) | type DropTargetLocalizedData = {
type DropTargetEventBasePayload (line 305) | type DropTargetEventBasePayload = BaseEve...
type DropTargetEventPayloadMap (line 310) | type DropTargetEventPayloadMap = {
type DropTargetArgs (line 332) | type DropTargetArgs = {
type DropTargetAPI (line 380) | type DropTargetAPI = {
FILE: packages/core/src/ledger/dispatch-consumer-event.ts
function schedule (line 15) | function schedule(fn: () => void) {
function flush (line 25) | function flush() {
function makeDispatch (line 36) | function makeDispatch({
FILE: packages/core/src/ledger/lifecycle-manager.ts
function canStart (line 23) | function canStart(): boolean {
function getNativeSetDragImage (line 27) | function getNativeSetDragImage(event: DragEvent): DataTransfer['setDragI...
function hasHierarchyChanged (line 36) | function hasHierarchyChanged({
function start (line 56) | function start({
function setDropEffectOnEvent (line 339) | function setDropEffectOnEvent({
function getStartLocation (line 353) | function getStartLocation({
FILE: packages/core/src/ledger/usage-ledger.ts
type Entry (line 3) | type Entry = {
type Ledger (line 10) | interface Ledger extends Map({
function register (line 41) | function register(args: {
FILE: packages/core/src/make-adapter/make-adapter.ts
function makeAdapter (line 16) | function makeAdapter({
FILE: packages/core/src/make-adapter/make-drop-target.ts
function copyReverse (line 16) | function copyReverse(array: Value[]): Value[] {
function makeDropTarget (line 20) | function makeDropTarget({
FILE: packages/core/src/make-adapter/make-monitor.ts
type DraggingState (line 10) | type DraggingState = {
function makeMonitor (line 15) | function makeMonitor(): {
FILE: packages/core/src/public-utils/combine.ts
function combine (line 4) | function combine(...fns: CleanupFn[]): CleanupFn {
FILE: packages/core/src/public-utils/element/block-dragging-to-iframes.ts
function setStyle (line 10) | function setStyle(
function tryStart (line 31) | function tryStart(): void {
function blockDraggingToIFrames (line 74) | function blockDraggingToIFrames({ element }: { element: HTMLElement }): ...
FILE: packages/core/src/public-utils/element/custom-native-drag-preview/pointer-outside-of-preview.ts
type CSSValue (line 10) | type CSSValue = string;
function pointerOutsideOfPreview (line 34) | function pointerOutsideOfPreview(point: { x: CSSValue; y: CSSValue }): G...
FILE: packages/core/src/public-utils/element/custom-native-drag-preview/preserve-offset-on-source.ts
function preserveOffsetOnSource (line 5) | function preserveOffsetOnSource({
FILE: packages/core/src/public-utils/element/custom-native-drag-preview/set-custom-native-drag-preview.ts
type CleanupFn (line 11) | type CleanupFn = () => void;
type RenderFn (line 14) | type RenderFn = ({
function defaultOffset (line 25) | function defaultOffset(): Position {
function setCustomNativeDragPreview (line 44) | function setCustomNativeDragPreview({
FILE: packages/core/src/public-utils/element/custom-native-drag-preview/types.ts
type GetOffsetFn (line 15) | type GetOffsetFn = (args: { container: HTMLElement }) => Position;
FILE: packages/core/src/public-utils/element/disable-native-drag-preview.ts
function disableNativeDragPreview (line 27) | function disableNativeDragPreview({
FILE: packages/core/src/public-utils/element/format-urls-for-external.ts
function formatURLsForExternal (line 31) | function formatURLsForExternal(urls: string[]): string {
FILE: packages/core/src/public-utils/element/scroll-just-enough-into-view.ts
function scrollJustEnoughIntoView (line 5) | function scrollJustEnoughIntoView({ element }: { element: Element }): vo...
FILE: packages/core/src/public-utils/external/file.ts
function containsFiles (line 3) | function containsFiles({ source }: ContainsSource): boolean {
function getFiles (line 8) | function getFiles({ source }: ContainsSource): File[] {
FILE: packages/core/src/public-utils/external/html.ts
function containsHTML (line 5) | function containsHTML({ source }: ContainsSource): boolean {
function getHTML (line 9) | function getHTML({ source }: ContainsSource): string | null {
FILE: packages/core/src/public-utils/external/native-types.ts
type ContainsSource (line 10) | type ContainsSource = { source: ExternalDragPayload };
type PredicateFn (line 11) | type PredicateFn = (args: ContainsSource) => boolean;
FILE: packages/core/src/public-utils/external/some.ts
function some (line 21) | function some(...predicates: PredicateFn[]): PredicateFn {
FILE: packages/core/src/public-utils/external/text.ts
function containsText (line 5) | function containsText({ source }: ContainsSource): boolean {
function getText (line 10) | function getText({ source }: ContainsSource): string | null {
FILE: packages/core/src/public-utils/external/url.ts
function containsURLs (line 16) | function containsURLs({ source }: ContainsSource): boolean {
function getURLs (line 20) | function getURLs({ source }: ContainsSource): string[] {
FILE: packages/core/src/public-utils/once.ts
function once (line 2) | function once any>(
FILE: packages/core/src/public-utils/prevent-unhandled.ts
function acceptDrop (line 6) | function acceptDrop(event: DragEvent) {
function start (line 28) | function start(): void {
function cleanup (line 66) | function cleanup() {
function stop (line 81) | function stop(): void {
FILE: packages/core/src/public-utils/reorder.ts
function reorder (line 6) | function reorder({
FILE: packages/core/src/util/add-attribute.ts
function addAttribute (line 3) | function addAttribute(
FILE: packages/core/src/util/changing-window/count-events-for-safari.ts
function isEnteringWindowInSafari (line 19) | function isEnteringWindowInSafari({ dragEnter }: { dragEnter: DragEvent ...
function isLeavingWindowInSafari (line 26) | function isLeavingWindowInSafari({ dragLeave }: { dragLeave: DragEvent }...
type State (line 49) | type State = {
function getInitialState (line 54) | function getInitialState(): State {
function resetState (line 63) | function resetState() {
FILE: packages/core/src/util/changing-window/is-entering-window.ts
function isEnteringWindow (line 7) | function isEnteringWindow({ dragEnter }: { dragEnter: DragEvent }): bool...
FILE: packages/core/src/util/changing-window/is-from-another-window.ts
function isNodeLike (line 7) | function isNodeLike(target: EventTarget): target is Node {
function isFromAnotherWindow (line 14) | function isFromAnotherWindow(eventTarget: EventTarget): boolean {
FILE: packages/core/src/util/changing-window/is-leaving-window.ts
function isLeavingWindow (line 7) | function isLeavingWindow({ dragLeave }: { dragLeave: DragEvent }): boole...
FILE: packages/core/src/util/detect-broken-drag.ts
function getBindingsForBrokenDrags (line 1) | function getBindingsForBrokenDrags({ onDragEnd }: { onDragEnd: () => voi...
FILE: packages/core/src/util/get-input.ts
function getInput (line 3) | function getInput(event: DragEvent): Input {
FILE: packages/documentation/__tests__/playwright/board.spec.ts
function getColumnHeader (line 6) | function getColumnHeader(page: Page, columnId: string) {
function getItem (line 10) | function getItem(page: Page, itemId: string) {
function getColumnOrder (line 14) | async function getColumnOrder(page: Page): Promise {
function getCardOrder (line 20) | function getCardOrder(page: Page, columnId: string): Promise<(string | n...
FILE: packages/documentation/__tests__/playwright/tree.spec.ts
type TScenario (line 7) | type TScenario = {
FILE: packages/documentation/constellation/09-accessibility-guidelines/pattern-table.tsx
type PatternTableProps (line 3) | type PatternTableProps = {
FILE: packages/documentation/constellation/assets/check-icon.tsx
function CheckIcon (line 6) | function CheckIcon() {
FILE: packages/documentation/constellation/assets/cross-icon.tsx
function CheckIcon (line 6) | function CheckIcon() {
FILE: packages/documentation/constellation/assets/question-icon.tsx
function CheckIcon (line 6) | function CheckIcon() {
FILE: packages/documentation/constellation/assets/result-text.tsx
function ResultText (line 16) | function ResultText({ children }: { children: string }) {
FILE: packages/documentation/constellation/assets/warning-icon.tsx
function CheckIcon (line 6) | function CheckIcon() {
FILE: packages/documentation/constellation/index/assets/hero.tsx
type State (line 19) | type State = { type: 'idle' } | { type: 'preview'; container: HTMLElemen...
function Hero (line 40) | function Hero() {
FILE: packages/documentation/constellation/index/assets/logo.tsx
type Mode (line 9) | type Mode = 'standard' | 'alternative';
function Logo (line 28) | function Logo({ mode }: { mode: Mode }) {
FILE: packages/documentation/examples/board-with-multi-drag.tsx
type SortUserIdsArgs (line 95) | type SortUserIdsArgs = {
type MultiDragReorderArgs (line 128) | type MultiDragReorderArgs = {
function BoardExample (line 188) | function BoardExample(): React.JSX.Element {
FILE: packages/documentation/examples/board-with-overflow-scroll.tsx
function BoardExample (line 16) | function BoardExample(): React.JSX.Element {
FILE: packages/documentation/examples/board.tsx
type Outcome (line 20) | type Outcome =
type Trigger (line 40) | type Trigger = 'pointer' | 'keyboard';
type Operation (line 42) | type Operation = {
type BoardState (line 47) | type BoardState = {
function BoardExample (line 53) | function BoardExample(): React.JSX.Element {
FILE: packages/documentation/examples/chess.tsx
type coord (line 15) | type coord = [number, number];
type PieceRecord (line 17) | type PieceRecord = {
method onDrop (line 67) | onDrop({ source, location }) {
FILE: packages/documentation/examples/data/pages.ts
type Page (line 1) | type Page = {
FILE: packages/documentation/examples/data/people/index.tsx
type Person (line 39) | type Person = {
function getPerson (line 103) | function getPerson(): Person {
function getPersonFromPosition (line 108) | function getPersonFromPosition({ position }: { position: number }): Pers...
function getPeopleFromPosition (line 121) | function getPeopleFromPosition({
function getPeople (line 131) | function getPeople({ amount }: { amount: number }): Person[] {
type ColumnType (line 135) | type ColumnType = {
type ColumnMap (line 140) | type ColumnMap = { [columnId: string]: ColumnType };
function getData (line 142) | function getData({
function getBasicData (line 168) | function getBasicData() {
FILE: packages/documentation/examples/data/presidents.tsx
type President (line 1) | type President = {
type RowOrder (line 71) | type RowOrder = number[];
function getInitialRowOrder (line 73) | function getInitialRowOrder(): RowOrder {
type Column (line 77) | type Column = 'name' | 'party' | 'term';
type ColumnOrder (line 79) | type ColumnOrder = Column[];
function getInitialColumnOrder (line 87) | function getInitialColumnOrder(): ColumnOrder {
FILE: packages/documentation/examples/data/quotes/data.ts
constant BMO (line 22) | const BMO: Author = {
FILE: packages/documentation/examples/data/quotes/types.ts
type Position (line 1) | type Position = {
type Author (line 6) | type Author = {
type Quote (line 17) | type Quote = {
type AuthorQuoteMap (line 23) | type AuthorQuoteMap = {
FILE: packages/documentation/examples/data/table.tsx
type TableRowData (line 6) | type TableRowData = {
type TableColumnData (line 19) | type TableColumnData = { id: string; label: string };
FILE: packages/documentation/examples/data/tasks.ts
type Item (line 1) | type Item = {
type ColumnType (line 5) | type ColumnType = {
type ColumnMap (line 10) | type ColumnMap = { [columnId: string]: ColumnType };
function getItems (line 12) | function getItems({ count, startColumnId }: { count: number; startColumn...
function getInitialData (line 21) | function getInitialData() {
FILE: packages/documentation/examples/data/tree-legacy.ts
type TreeItem (line 5) | type TreeItem = {
type TreeState (line 12) | type TreeState = {
function getInitialTreeState (line 17) | function getInitialTreeState(): TreeState {
function getInitialData (line 21) | function getInitialData(): TreeItem[] {
type TreeAction (line 71) | type TreeAction =
method remove (line 93) | remove(data: TreeItem[], id: string): TreeItem[] {
method insertBefore (line 106) | insertBefore(data: TreeItem[], targetId: string, newItem: TreeItem): Tre...
method insertAfter (line 120) | insertAfter(data: TreeItem[], targetId: string, newItem: TreeItem): Tree...
method insertChild (line 136) | insertChild(data: TreeItem[], targetId: string, newItem: TreeItem): Tree...
method find (line 158) | find(data: TreeItem[], itemId: string): TreeItem | undefined {
method getPathToItem (line 172) | getPathToItem({
method hasChildren (line 195) | hasChildren(item: TreeItem): boolean {
function treeStateReducer (line 200) | function treeStateReducer(state: TreeState, action: TreeAction): TreeSta...
function toggle (line 258) | function toggle(item: TreeItem): TreeItem {
function getChildItems (line 328) | function getChildItems(data: TreeItem[], targetId: string) {
FILE: packages/documentation/examples/data/tree.ts
type TreeItem (line 5) | type TreeItem = {
type TreeState (line 12) | type TreeState = {
function getInitialTreeState (line 17) | function getInitialTreeState(): TreeState {
function getInitialData (line 21) | function getInitialData(): TreeItem[] {
type TreeAction (line 71) | type TreeAction =
method remove (line 93) | remove(data: TreeItem[], id: string): TreeItem[] {
method insertBefore (line 106) | insertBefore(data: TreeItem[], targetId: string, newItem: TreeItem): Tre...
method insertAfter (line 120) | insertAfter(data: TreeItem[], targetId: string, newItem: TreeItem): Tree...
method insertChild (line 136) | insertChild(data: TreeItem[], targetId: string, newItem: TreeItem): Tree...
method find (line 158) | find(data: TreeItem[], itemId: string): TreeItem | undefined {
method getPathToItem (line 172) | getPathToItem({
method hasChildren (line 195) | hasChildren(item: TreeItem): boolean {
function treeStateReducer (line 200) | function treeStateReducer(state: TreeState, action: TreeAction): TreeSta...
function toggle (line 251) | function toggle(item: TreeItem): TreeItem {
function getChildItems (line 321) | function getChildItems(data: TreeItem[], targetId: string) {
FILE: packages/documentation/examples/deferred.tsx
function FileList (line 50) | function FileList({ uploads }: { uploads: File[] }) {
function Uploader (line 63) | function Uploader() {
function Example (line 171) | function Example(): React.JSX.Element {
FILE: packages/documentation/examples/drag-handle-button.tsx
function Item (line 47) | function Item({
type ItemData (line 138) | type ItemData = { label: string };
type ReorderItem (line 142) | type ReorderItem = (args: { item: ItemData; direction: 'up' | 'down' }) ...
type ExampleContextProps (line 144) | type ExampleContextProps = {
function getItemPosition (line 152) | function getItemPosition({ index, itemCount }: { index: number; itemCoun...
function DragHandleButtonExample (line 172) | function DragHandleButtonExample(): React.JSX.Element {
FILE: packages/documentation/examples/drawing.tsx
type SwatchColor (line 78) | type SwatchColor = keyof typeof swatchColorMap;
function Swatch (line 80) | function Swatch({
function DrawingExample (line 118) | function DrawingExample(): React.JSX.Element {
FILE: packages/documentation/examples/file-drop-without-pragmatic.tsx
function Example (line 79) | function Example(): React.JSX.Element {
FILE: packages/documentation/examples/file.tsx
type UserUpload (line 81) | type UserUpload = {
function Uploader (line 182) | function Uploader() {
function Example (line 340) | function Example(): React.JSX.Element {
FILE: packages/documentation/examples/flash-prototype.tsx
function isDurationKey (line 16) | function isDurationKey(value: unknown): value is Durations {
function isEasingKey (line 28) | function isEasingKey(value: unknown): value is keyof typeof easingMap {
function PostDropFlashPrototype (line 38) | function PostDropFlashPrototype(): React.JSX.Element {
function OptionLabel (line 86) | function OptionLabel({ children, description }: { children: ReactNode; d...
function FlashParameterForm (line 202) | function FlashParameterForm({ onChange }: { onChange: React.FormEventHan...
FILE: packages/documentation/examples/grid.tsx
function getInstanceId (line 29) | function getInstanceId() {
type State (line 48) | type State = 'idle' | 'dragging' | 'over';
function Grid (line 110) | function Grid(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines.tsx
function GuidelinesExample (line 15) | function GuidelinesExample(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/action-menu-variants.tsx
function ActionMenuVariants (line 10) | function ActionMenuVariants(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/all-drag-handle-variants.tsx
function AllDragHandleVariants (line 12) | function AllDragHandleVariants(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/delayed-cursor-change.tsx
function DelayedCursorChange (line 56) | function DelayedCursorChange(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/entire-entity-is-draggable-with-drag-handle-button.tsx
function EntireEntityIsDraggableWithDragHandleButton (line 38) | function EntireEntityIsDraggableWithDragHandleButton(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/entire-entity-is-draggable-with-grouped-items.tsx
function GroupedActionMenu (line 21) | function GroupedActionMenu() {
function EntireEntityIsDraggableWithGroupedItems (line 98) | function EntireEntityIsDraggableWithGroupedItems(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/entire-entity-is-draggable.tsx
function EntireEntityIsDraggable (line 39) | function EntireEntityIsDraggable(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/hover-drag-handle-outside-bounds.tsx
function HoverDragHandleOutsideBounds (line 76) | function HoverDragHandleOutsideBounds(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/hover-drag-handle.tsx
function HoverDragHandle (line 65) | function HoverDragHandle(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/only-draggable-from-drag-handle.tsx
function OnlyDraggableFromDragHandle (line 41) | function OnlyDraggableFromDragHandle(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/shared/action-menu.tsx
function ActionMenu (line 7) | function ActionMenu(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/shared/drag-preview.tsx
function DragPreview (line 15) | function DragPreview(): React.JSX.Element {
FILE: packages/documentation/examples/guidelines/shared/types.ts
type DraggableState (line 1) | type DraggableState =
FILE: packages/documentation/examples/guidelines/standalone-card.tsx
function ImpliedDraggable (line 18) | function ImpliedDraggable(): React.JSX.Element {
FILE: packages/documentation/examples/iframe-board.tsx
function LinkToProject (line 31) | function LinkToProject() {
function IFrameBoard (line 45) | function IFrameBoard(): React.JSX.Element {
FILE: packages/documentation/examples/iframe-column.tsx
function IFrameColumn (line 5) | function IFrameColumn(): React.JSX.Element {
FILE: packages/documentation/examples/list-comparison.tsx
function Item (line 52) | function Item({
function ItemPreview (line 83) | function ItemPreview({ children }: { children: ReactNode }) {
type Solution (line 87) | type Solution = 'pdnd' | 'rbd';
function ItemCaption (line 140) | function ItemCaption({
function Section (line 198) | function Section({ children, backgroundColor }: { children: ReactNode; b...
function SectionHeader (line 216) | function SectionHeader({
function SubSectionHeader (line 260) | function SubSectionHeader({ title, description }: { title: ReactNode; de...
function TabPanel (line 288) | function TabPanel({ children, ...props }: TabPanelProps) {
function ListComparison (line 296) | function ListComparison(): React.JSX.Element {
FILE: packages/documentation/examples/list.tsx
type ItemPosition (line 45) | type ItemPosition = 'first' | 'last' | 'middle' | 'only';
type CleanupFn (line 47) | type CleanupFn = () => void;
type ItemEntry (line 49) | type ItemEntry = { itemId: string; element: HTMLElement };
type ListContextValue (line 51) | type ListContextValue = {
function useListContext (line 64) | function useListContext() {
type Item (line 70) | type Item = {
type ItemData (line 76) | type ItemData = {
function getItemData (line 83) | function getItemData({
function isItemData (line 100) | function isItemData(data: Record): data is Ite...
function getItemPosition (line 104) | function getItemPosition({ index, items }: { index: number; items: Item[...
type DraggableState (line 140) | type DraggableState =
function DropDownContent (line 166) | function DropDownContent({ position, index }: { position: ItemPosition; ...
function ListItem (line 222) | function ListItem({
function getItemRegistry (line 414) | function getItemRegistry() {
type ListState (line 432) | type ListState = {
function ListExample (line 442) | function ListExample(): React.JSX.Element {
FILE: packages/documentation/examples/manual-focus-restoration.tsx
type TeamId (line 34) | type TeamId = 'blue' | 'red';
function TeamArea (line 48) | function TeamArea({
type State (line 79) | type State = {
function getInstanceId (line 92) | function getInstanceId() {
function ManualFocusRestoration (line 98) | function ManualFocusRestoration(): React.JSX.Element {
function Player (line 176) | function Player() {
FILE: packages/documentation/examples/nested-draggables.tsx
function Item (line 48) | function Item({
function DropTarget (line 121) | function DropTarget() {
function Example (line 160) | function Example(): React.JSX.Element {
FILE: packages/documentation/examples/nested-drop-targets.tsx
function DropTarget (line 40) | function DropTarget({ targetId, children }: { targetId: string; children...
function Draggable (line 114) | function Draggable() {
function Example (line 132) | function Example(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/backlog/container.tsx
function BacklogContainer (line 18) | function BacklogContainer({ children }: { children: ReactNode }): React....
function BacklogHeader (line 43) | function BacklogHeader() {
FILE: packages/documentation/examples/pieces/backlog/context.tsx
type ItemPosition (line 9) | type ItemPosition = 'first' | 'last' | 'middle' | 'only';
type CleanupFn (line 11) | type CleanupFn = () => void;
type ListContextProps (line 13) | type ListContextProps = {
function useListContext (line 26) | function useListContext() {
FILE: packages/documentation/examples/pieces/backlog/data.tsx
type ItemData (line 1) | type ItemData = {
FILE: packages/documentation/examples/pieces/backlog/index.tsx
function BacklogPrototype (line 6) | function BacklogPrototype(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/backlog/list-item.tsx
type DraggableState (line 80) | type DraggableState =
function ListItem (line 108) | function ListItem({ itemData }: { itemData: ItemData }): React.JSX.Eleme...
FILE: packages/documentation/examples/pieces/backlog/list.tsx
type ListState (line 63) | type ListState = {
function ListExample (line 73) | function ListExample(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/board-with-multi-drag/board.tsx
function Board (line 24) | function Board({ children }: { children: ReactNode }): React.JSX.Element {
FILE: packages/documentation/examples/pieces/board-with-multi-drag/card.tsx
type DraggableState (line 35) | type DraggableState =
type CardPrimitiveProps (line 89) | type CardPrimitiveProps = {
type CardProps (line 147) | type CardProps = {
method getOffset (line 180) | getOffset() {
method render (line 192) | render({ container }) {
FILE: packages/documentation/examples/pieces/board-with-multi-drag/column.tsx
type State (line 60) | type State =
type ColumnProps (line 100) | type ColumnProps = {
function SafariColumnPreview (line 257) | function SafariColumnPreview({ column }: { column: ColumnType }) {
FILE: packages/documentation/examples/pieces/board-with-overflow-scroll/board.tsx
function Board (line 45) | function Board({ children }: { children: ReactNode }): React.JSX.Element {
FILE: packages/documentation/examples/pieces/board-with-overflow-scroll/card.tsx
type DraggableState (line 35) | type DraggableState =
type CardPrimitiveProps (line 69) | type CardPrimitiveProps = {
method getOffset (line 122) | getOffset() {
method render (line 134) | render({ container }) {
FILE: packages/documentation/examples/pieces/board-with-overflow-scroll/column.tsx
type State (line 76) | type State =
function SafariColumnPreview (line 278) | function SafariColumnPreview({ column }: { column: ColumnType }) {
FILE: packages/documentation/examples/pieces/board/board-context.tsx
type BoardContextValue (line 9) | type BoardContextValue = {
function useBoardContext (line 43) | function useBoardContext(): BoardContextValue {
FILE: packages/documentation/examples/pieces/board/board.tsx
type BoardProps (line 9) | type BoardProps = {
FILE: packages/documentation/examples/pieces/board/card.tsx
type State (line 47) | type State =
type CardPrimitiveProps (line 87) | type CardPrimitiveProps = {
function MoveToOtherColumnItem (line 94) | function MoveToOtherColumnItem({
function LazyDropdownItems (line 115) | function LazyDropdownItems({ userId }: { userId: string }) {
method render (line 264) | render({ container }) {
FILE: packages/documentation/examples/pieces/board/column-context.tsx
type ColumnContextProps (line 5) | type ColumnContextProps = {
function useColumnContext (line 13) | function useColumnContext(): ColumnContextProps {
FILE: packages/documentation/examples/pieces/board/column.tsx
type State (line 94) | type State =
method onDrop (line 192) | onDrop() {
function SafariColumnPreview (line 329) | function SafariColumnPreview({ column }: { column: ColumnType }) {
function ActionMenu (line 339) | function ActionMenu() {
function ActionMenuItems (line 347) | function ActionMenuItems() {
function DropdownMenuTrigger (line 383) | function DropdownMenuTrigger({ triggerRef, ...triggerProps }: CustomTrig...
FILE: packages/documentation/examples/pieces/board/registry.ts
type CardEntry (line 5) | type CardEntry = {
type ColumnEntry (line 10) | type ColumnEntry = {
function createRegistry (line 18) | function createRegistry() {
FILE: packages/documentation/examples/pieces/chess/piece.tsx
type PieceType (line 23) | type PieceType = 'king' | 'pawn';
FILE: packages/documentation/examples/pieces/chess/square.tsx
type SquareProps (line 22) | interface SquareProps {
type State (line 43) | type State =
method onDragStart (line 94) | onDragStart({ source }) {
method onDrop (line 123) | onDrop() {
FILE: packages/documentation/examples/pieces/drawing/line-overlay.tsx
type Point (line 13) | type Point = { x: number; y: number };
type LineOverlayHandle (line 15) | type LineOverlayHandle = {
function setPoints (line 47) | function setPoints(
function createLine (line 69) | function createLine() {
FILE: packages/documentation/examples/pieces/drawing/shape.tsx
type ShapeType (line 20) | type ShapeType = (typeof shapes)[number];
method canDrag (line 95) | canDrag() {
method getInitialData (line 98) | getInitialData() {
method onDrag (line 101) | onDrag({ location, source }) {
method onGenerateDragPreview (line 111) | onGenerateDragPreview() {
method onDragStart (line 116) | onDragStart() {
method getData (line 124) | getData() {
method canDrop (line 127) | canDrop({ source }) {
FILE: packages/documentation/examples/pieces/getting-started/chessboard-colored-drop-targets.tsx
type Coord (line 13) | type Coord = [number, number];
type PieceRecord (line 15) | type PieceRecord = {
type PieceType (line 20) | type PieceType = 'king' | 'pawn';
function isCoord (line 22) | function isCoord(token: unknown): token is Coord {
function isPieceType (line 30) | function isPieceType(value: unknown): value is PieceType {
function isEqualCoord (line 34) | function isEqualCoord(c1: Coord, c2: Coord): boolean {
function canMove (line 45) | function canMove(
function renderSquares (line 68) | function renderSquares(pieces: PieceRecord[]) {
function Chessboard (line 86) | function Chessboard(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/chessboard-draggable.tsx
type Coord (line 12) | type Coord = [number, number];
type PieceRecord (line 14) | type PieceRecord = {
type PieceType (line 19) | type PieceType = 'king' | 'pawn';
function isEqualCoord (line 21) | function isEqualCoord(c1: Coord, c2: Coord): boolean {
function renderSquares (line 32) | function renderSquares(pieces: PieceRecord[]) {
function Chessboard (line 52) | function Chessboard(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/chessboard-drop-target.tsx
type Coord (line 13) | type Coord = [number, number];
type PieceRecord (line 15) | type PieceRecord = {
type PieceType (line 20) | type PieceType = 'king' | 'pawn';
function isEqualCoord (line 22) | function isEqualCoord(c1: Coord, c2: Coord): boolean {
function renderSquares (line 33) | function renderSquares(pieces: PieceRecord[]) {
function Chessboard (line 47) | function Chessboard(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/chessboard-drop-targets-can-drop.tsx
type Coord (line 13) | type Coord = [number, number];
type PieceRecord (line 15) | type PieceRecord = {
type PieceType (line 20) | type PieceType = 'king' | 'pawn';
function isCoord (line 22) | function isCoord(token: unknown): token is Coord {
function isPieceType (line 30) | function isPieceType(value: unknown): value is PieceType {
function isEqualCoord (line 34) | function isEqualCoord(c1: Coord, c2: Coord): boolean {
function canMove (line 45) | function canMove(
function renderSquares (line 68) | function renderSquares(pieces: PieceRecord[]) {
function Chessboard (line 86) | function Chessboard(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/chessboard-monitor.tsx
type Coord (line 15) | type Coord = [number, number];
type PieceRecord (line 17) | type PieceRecord = {
type PieceType (line 22) | type PieceType = 'king' | 'pawn';
function isCoord (line 24) | function isCoord(token: unknown): token is Coord {
function isPieceType (line 32) | function isPieceType(value: unknown): value is PieceType {
function isEqualCoord (line 36) | function isEqualCoord(c1: Coord, c2: Coord): boolean {
function canMove (line 47) | function canMove(
function renderSquares (line 70) | function renderSquares(pieces: PieceRecord[]) {
function Chessboard (line 88) | function Chessboard(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/chessboard-starter-code.tsx
type Coord (line 13) | type Coord = [number, number];
type PieceRecord (line 15) | type PieceRecord = {
type PieceType (line 20) | type PieceType = 'king' | 'pawn';
type PieceProps (line 22) | type PieceProps = {
function isEqualCoord (line 27) | function isEqualCoord(c1: Coord, c2: Coord): boolean {
function renderSquares (line 38) | function renderSquares(pieces: PieceRecord[]) {
function Chessboard (line 58) | function Chessboard(): React.JSX.Element {
function Piece (line 67) | function Piece({ image, alt }: PieceProps) {
function King (line 71) | function King(): React.JSX.Element {
function Pawn (line 75) | function Pawn(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/draggable-piece-in-place.tsx
type PieceType (line 16) | type PieceType = 'king' | 'pawn';
type PieceProps (line 18) | type PieceProps = {
function Piece (line 23) | function Piece({ image, alt }: PieceProps) {
function King (line 38) | function King(): React.JSX.Element {
function Pawn (line 42) | function Pawn(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/draggable-piece-with-data.tsx
type PieceType (line 18) | type PieceType = 'king' | 'pawn';
type PieceProps (line 20) | type PieceProps = {
function King (line 55) | function King({ location }: { location: [number, number] }): React.JSX.E...
function Pawn (line 59) | function Pawn({ location }: { location: [number, number] }): React.JSX.E...
FILE: packages/documentation/examples/pieces/getting-started/draggable-piece-with-state.tsx
type PieceType (line 16) | type PieceType = 'king' | 'pawn';
type PieceProps (line 18) | type PieceProps = {
function Piece (line 23) | function Piece({ image, alt }: PieceProps) {
function King (line 50) | function King(): React.JSX.Element {
function Pawn (line 54) | function Pawn(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/square-drop-target.tsx
type SquareProps (line 16) | interface SquareProps {
function getColor (line 29) | function getColor(isDraggedOver: boolean, isDark: boolean): string {
function Square (line 36) | function Square({ location, children }: SquareProps): React.JSX.Element {
FILE: packages/documentation/examples/pieces/getting-started/square-with-can-drop.tsx
type SquareProps (line 23) | interface SquareProps {
type HoveredState (line 29) | type HoveredState = 'idle' | 'validMove' | 'invalidMove';
function getColor (line 39) | function getColor(state: HoveredState, isDark: boolean): string {
function Square (line 48) | function Square({ pieces, location, children }: SquareProps): React.JSX....
FILE: packages/documentation/examples/pieces/getting-started/square-with-data.tsx
type SquareProps (line 23) | interface SquareProps {
type HoveredState (line 29) | type HoveredState = 'idle' | 'validMove' | 'invalidMove';
function getColor (line 39) | function getColor(state: HoveredState, isDark: boolean): string {
function Square (line 48) | function Square({ pieces, location, children }: SquareProps): React.JSX....
FILE: packages/documentation/examples/pieces/getting-started/square-with-hovering-coloring.tsx
type SquareProps (line 22) | interface SquareProps {
type HoveredState (line 28) | type HoveredState = 'idle' | 'validMove' | 'invalidMove';
function getColor (line 38) | function getColor(state: HoveredState, isDark: boolean): string {
function Square (line 47) | function Square({ pieces, location, children }: SquareProps): React.JSX....
FILE: packages/documentation/examples/pieces/hooks/use-flash-on-drop.tsx
function useFlashOnDrop (line 9) | function useFlashOnDrop({
FILE: packages/documentation/examples/pieces/hooks/use-prevent-scrolling-from-arrow-keys.tsx
function usePreventScrollingFromArrowKeys (line 11) | function usePreventScrollingFromArrowKeys({
FILE: packages/documentation/examples/pieces/hooks/use-sortable-field.tsx
type ShouldHideDropIndicatorArgs (line 18) | type ShouldHideDropIndicatorArgs = {
type UseSortableFieldArgs (line 24) | type UseSortableFieldArgs = {
function shouldHideDropIndicator (line 48) | function shouldHideDropIndicator({
type DragState (line 60) | type DragState = 'idle' | 'preview' | 'dragging';
function useSortableField (line 62) | function useSortableField({
FILE: packages/documentation/examples/pieces/hooks/use-top-level-wiring.tsx
type UseToplevelWiringArgs (line 11) | type UseToplevelWiringArgs = {
type ReorderItem (line 18) | type ReorderItem = (args: { id: string; action: 'up' | 'down' }) => void;
function dispatchAfterDropEvent (line 20) | function dispatchAfterDropEvent(detail: { id: string; type: string }) {
function useTopLevelWiring (line 38) | function useTopLevelWiring({
FILE: packages/documentation/examples/pieces/iframe-board/card.tsx
type State (line 39) | type State =
type CardPrimitiveProps (line 75) | type CardPrimitiveProps = {
method render (line 136) | render({ container }) {
FILE: packages/documentation/examples/pieces/iframe-board/column.tsx
type State (line 63) | type State = { type: 'idle' } | { type: 'is-card-over' };
function getPeopleFromSharedPool (line 83) | function getPeopleFromSharedPool(): Person[] {
function Column (line 104) | function Column({ columnId }: { columnId: string }): React.JSX.Element {
FILE: packages/documentation/examples/pieces/iframe-board/data.ts
type TCard (line 6) | type TCard = {
function getCard (line 12) | function getCard({ cardId, columnId }: { cardId: string; columnId: strin...
function isCard (line 20) | function isCard(data: Record): data is TCard {
type TColumnDropTarget (line 25) | type TColumnDropTarget = {
function getColumnDropTarget (line 30) | function getColumnDropTarget({ columnId }: { columnId: string }): TColum...
function isColumnDropTarget (line 37) | function isColumnDropTarget(
type TCardDropTarget (line 44) | type TCardDropTarget = {
function getCardDropTarget (line 50) | function getCardDropTarget({
function isCardDropTarget (line 64) | function isCardDropTarget(data: Record): data ...
function getCardDataForExternal (line 71) | function getCardDataForExternal(person: Person) {
function isAndroid (line 93) | function isAndroid(): boolean {
function isDraggingExternalCard (line 97) | function isDraggingExternalCard({ source }: { source: ExternalDragPayloa...
function getDroppedExternalCardId (line 108) | function getDroppedExternalCardId({
FILE: packages/documentation/examples/pieces/menu-button/index.tsx
type ChildrenRenderFn (line 24) | type ChildrenRenderFn = (args: { children: ReactElement; isSelected: boo...
function MenuButton (line 28) | function MenuButton({
type MenuButtonTriggerOwnProps (line 84) | type MenuButtonTriggerOwnProps = {
type MenuButtonTriggerProps (line 90) | type MenuButtonTriggerProps = CustomTriggerProps & MenuButtonTriggerOwnP...
function MenuButtonTrigger (line 92) | function MenuButtonTrigger({
FILE: packages/documentation/examples/pieces/pinned-fields/data.tsx
type DataItem (line 20) | type DataItem = {
FILE: packages/documentation/examples/pieces/pinned-fields/experience/asana-native-preview.tsx
function DraggableField (line 15) | function DraggableField({ index, item }: DraggableFieldProps) {
function AsanaFieldsWithNativePreview (line 54) | function AsanaFieldsWithNativePreview(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/experience/asana.tsx
function DragPreview (line 15) | function DragPreview({
function DraggableField (line 76) | function DraggableField({ index, item }: DraggableFieldProps) {
function AsanaFields (line 107) | function AsanaFields(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/experience/current-guidelines-a11y-always-visible.tsx
function DraggableField (line 25) | function DraggableField({
function PinnedFieldsWithCurrentGuidelinesA11yAlwaysVisible (line 83) | function PinnedFieldsWithCurrentGuidelinesA11yAlwaysVisible(): React.JSX...
FILE: packages/documentation/examples/pieces/pinned-fields/experience/current-guidelines-a11y-keyboard-only.tsx
function DraggableField (line 44) | function DraggableField({
function PinnedFieldsWithCurrentGuidelinesA11yKeyboardOnly (line 94) | function PinnedFieldsWithCurrentGuidelinesA11yKeyboardOnly(): React.JSX....
FILE: packages/documentation/examples/pieces/pinned-fields/experience/current-guidelines.tsx
function DraggableField (line 23) | function DraggableField({
function PinnedFieldsWithCurrentGuidelines (line 52) | function PinnedFieldsWithCurrentGuidelines(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/experience/enhanced-drag-handle.tsx
function DraggableFieldPreview (line 37) | function DraggableFieldPreview({ children }: { children: ReactNode }) {
function DraggableField (line 51) | function DraggableField({ index, item, data, reorderItem }: DraggableFie...
function PinnedFieldsEnhancedDragHandle (line 135) | function PinnedFieldsEnhancedDragHandle(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/experience/migration-layer.tsx
function PinnedFieldReactBeautifulDnd (line 12) | function PinnedFieldReactBeautifulDnd(): React.JSX.Element {
function PinnedFieldReactBeautifulDndNoDraggingOutline (line 24) | function PinnedFieldReactBeautifulDndNoDraggingOutline(): React.JSX.Elem...
function PinnedFieldReactBeautifulDndSubtle (line 36) | function PinnedFieldReactBeautifulDndSubtle(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/experience/rdr-prototype.tsx
function DraggableFieldPreview (line 37) | function DraggableFieldPreview({ children }: { children: ReactNode }) {
function DraggableField (line 51) | function DraggableField({ index, item, data, reorderItem }: DraggableFie...
function PinnedFieldsPrototype (line 135) | function PinnedFieldsPrototype(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/experience/react-beautiful-dnd.tsx
function PinnedFieldReactBeautifulDnd (line 8) | function PinnedFieldReactBeautifulDnd(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/hooks/use-sortable-field.tsx
type UseSortableFieldArgs (line 18) | type UseSortableFieldArgs = {
function shouldHideDropIndicator (line 33) | function shouldHideDropIndicator({
function useSortableField (line 49) | function useSortableField({
FILE: packages/documentation/examples/pieces/pinned-fields/index.tsx
function FieldLabel (line 73) | function FieldLabel({ children }: { children: ReactNode }): React.JSX.El...
type FieldProps (line 91) | type FieldProps = HTMLAttributes & {
function PinnedFieldsContainer (line 137) | function PinnedFieldsContainer({ children }: { children: ReactNode }): R...
function FieldContentWithIcon (line 165) | function FieldContentWithIcon({
FILE: packages/documentation/examples/pieces/pinned-fields/major-priority-icon.tsx
function MajorPriorityIcon (line 3) | function MajorPriorityIcon(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/primitives/asana/drop-indicator.tsx
function DropIndicator (line 54) | function DropIndicator({ edge }: { edge: Edge }): React.JSX.Element {
FILE: packages/documentation/examples/pieces/pinned-fields/primitives/asana/field.tsx
type FieldProps (line 48) | type FieldProps = {
function FieldPreview (line 86) | function FieldPreview({ children }: { children: ReactNode }): React.JSX....
FILE: packages/documentation/examples/pieces/pinned-fields/primitives/droppable-area-overlay.tsx
type DroppableAreaOverlayAppearance (line 51) | type DroppableAreaOverlayAppearance = 'default' | 'borderless' | 'subtle';
type DroppableAreaOverlayProps (line 53) | type DroppableAreaOverlayProps = {
function DroppableAreaOverlay (line 67) | function DroppableAreaOverlay({
FILE: packages/documentation/examples/pieces/pinned-fields/templates/asana.tsx
type DataItem (line 13) | type DataItem = {
type DraggableFieldProps (line 57) | type DraggableFieldProps = { index: number; item: DataItem };
type AsanaFieldsTemplateProps (line 59) | type AsanaFieldsTemplateProps = {
function AsanaFieldsTemplate (line 64) | function AsanaFieldsTemplate({
FILE: packages/documentation/examples/pieces/pinned-fields/templates/atlassian.tsx
type DraggableFieldProps (line 7) | type DraggableFieldProps = {
type PinnedFieldsAtlassianTemplateProps (line 14) | type PinnedFieldsAtlassianTemplateProps = {
function PinnedFieldsAtlassianTemplate (line 19) | function PinnedFieldsAtlassianTemplate({
FILE: packages/documentation/examples/pieces/pinned-fields/templates/react-beautiful-dnd.tsx
function DraggableField (line 23) | function DraggableField({
type TemplateProps (line 50) | type TemplateProps = {
function PinnedFieldsReactBeautifulDndTemplate (line 60) | function PinnedFieldsReactBeautifulDndTemplate({
FILE: packages/documentation/examples/pieces/pinned-fields/use-drag-observer.tsx
type DragObserverState (line 7) | type DragObserverState =
type DragObserver (line 16) | type DragObserver = {
function createDragObserver (line 23) | function createDragObserver() {
function useDragObserver (line 51) | function useDragObserver(): DragObserver {
FILE: packages/documentation/examples/pieces/post-drop-flash/list.tsx
type ItemPosition (line 43) | type ItemPosition = 'first' | 'last' | 'middle' | 'only';
type CleanupFn (line 45) | type CleanupFn = () => void;
type ListContextProps (line 47) | type ListContextProps = {
function useListContext (line 61) | function useListContext() {
type ItemData (line 67) | type ItemData = {
type DraggableState (line 92) | type DraggableState =
function ListItem (line 118) | function ListItem({ itemData }: { itemData: ItemData }) {
function LazyDropdownContent (line 261) | function LazyDropdownContent({ itemData }: { itemData: ItemData }) {
type ListState (line 341) | type ListState = {
function ListExample (line 351) | function ListExample({
FILE: packages/documentation/examples/pieces/rdr-board/board-context.tsx
type BoardContextProps (line 7) | type BoardContextProps = {
function useBoardContext (line 32) | function useBoardContext(): BoardContextProps {
FILE: packages/documentation/examples/pieces/rdr-board/board.tsx
type BoardProps (line 13) | type BoardProps = {
FILE: packages/documentation/examples/pieces/rdr-board/card-stack.tsx
function CardStack (line 56) | function CardStack({
FILE: packages/documentation/examples/pieces/rdr-board/card.tsx
type DraggableState (line 54) | type DraggableState =
type CardPrimitiveProps (line 111) | type CardPrimitiveProps = {
function MoveToOtherColumnItem (line 120) | function MoveToOtherColumnItem({
function LazyDropdownItems (line 141) | function LazyDropdownItems({ item }: { item: CardData }) {
method getOffset (line 312) | getOffset() {
method render (line 324) | render({ container }) {
FILE: packages/documentation/examples/pieces/rdr-board/column-context.tsx
type ColumnContextProps (line 5) | type ColumnContextProps = {
function useColumnContext (line 13) | function useColumnContext(): ColumnContextProps {
FILE: packages/documentation/examples/pieces/rdr-board/column.tsx
type IdleState (line 81) | type IdleState = { type: 'idle' };
type DropTargetState (line 83) | type DropTargetState =
type DraggableState (line 88) | type DraggableState =
method onDrop (line 147) | onDrop() {
function ColumnPreview (line 262) | function ColumnPreview({ column }: { column: ColumnType }) {
function ActionMenu (line 272) | function ActionMenu() {
function ActionMenuItems (line 280) | function ActionMenuItems() {
function DropdownMenuTrigger (line 316) | function DropdownMenuTrigger({ triggerRef, ...triggerProps }: CustomTrig...
FILE: packages/documentation/examples/pieces/rdr-board/data.tsx
type Epic (line 1) | type Epic = 'forms' | 'accounts' | 'billing';
type CardData (line 3) | type CardData = {
type ColumnType (line 9) | type ColumnType = {
type ColumnMap (line 14) | type ColumnMap = { [columnId: string]: ColumnType };
function getInitialData (line 16) | function getInitialData() {
FILE: packages/documentation/examples/pieces/rdr-board/epic-lozenge.tsx
function EpicLozenge (line 13) | function EpicLozenge({ epic }: { epic: Epic }): React.JSX.Element {
FILE: packages/documentation/examples/pieces/rdr-board/index.tsx
type Operation (line 18) | type Operation =
type BoardState (line 38) | type BoardState = {
function createRegistry (line 48) | function createRegistry() {
function BoardPrototype (line 76) | function BoardPrototype(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/container.tsx
function FieldsContainer (line 33) | function FieldsContainer({
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/context.tsx
type ItemPosition (line 9) | type ItemPosition = 'first' | 'last' | 'middle' | 'only';
type CleanupFn (line 11) | type CleanupFn = () => void;
type ListContextProps (line 13) | type ListContextProps = {
function useListContext (line 26) | function useListContext() {
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/data.tsx
type ItemData (line 19) | type ItemData = {
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/drag-handle-button.tsx
type DragHandleButtonProps (line 45) | type DragHandleButtonProps = Omit;
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/field.tsx
function FieldContentWithIcon (line 29) | function FieldContentWithIcon({
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/index.tsx
function PinnedFieldsPrototype (line 9) | function PinnedFieldsPrototype(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/list-item.tsx
type DraggableState (line 63) | type DraggableState =
function ListItem (line 98) | function ListItem({
function LazyDropdownContent (line 244) | function LazyDropdownContent({ itemData }: { itemData: ItemData }) {
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/list.tsx
type ListState (line 27) | type ListState = {
function ListExample (line 37) | function ListExample({
FILE: packages/documentation/examples/pieces/rdr-pinned-fields/major-priority-icon.tsx
function MajorPriorityIcon (line 3) | function MajorPriorityIcon(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/rdr-subtasks/container.tsx
function BacklogContainer (line 18) | function BacklogContainer({ children }: { children: ReactNode }): React....
function BacklogHeader (line 43) | function BacklogHeader() {
FILE: packages/documentation/examples/pieces/rdr-subtasks/context.tsx
type ItemPosition (line 9) | type ItemPosition = 'first' | 'last' | 'middle' | 'only';
type CleanupFn (line 11) | type CleanupFn = () => void;
type ListContextProps (line 13) | type ListContextProps = {
function useListContext (line 26) | function useListContext() {
FILE: packages/documentation/examples/pieces/rdr-subtasks/data.tsx
type ItemData (line 1) | type ItemData = {
FILE: packages/documentation/examples/pieces/rdr-subtasks/drag-handle-button.tsx
type DragHandleButtonProps (line 51) | type DragHandleButtonProps = Omit;
FILE: packages/documentation/examples/pieces/rdr-subtasks/index.tsx
function SubtasksPrototype (line 5) | function SubtasksPrototype(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/rdr-subtasks/list-item.tsx
type DraggableState (line 60) | type DraggableState =
function ListItem (line 108) | function ListItem({ itemData }: { itemData: ItemData }): React.JSX.Eleme...
function LazyDropdownContent (line 271) | function LazyDropdownContent({ itemData }: { itemData: ItemData }) {
FILE: packages/documentation/examples/pieces/rdr-subtasks/list.tsx
type ListState (line 27) | type ListState = {
function ListExample (line 37) | function ListExample(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/rdr-subtasks/subtask-icon.tsx
function SubtaskIcon (line 3) | function SubtaskIcon(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/data.tsx
type DataItem (line 1) | type DataItem = {
FILE: packages/documentation/examples/pieces/subtasks/demo/current-guidelines-a11y-always-visible.tsx
type DraggableSubtaskProps (line 21) | type DraggableSubtaskProps = SubtaskProps & {
function DraggableSubtask (line 33) | function DraggableSubtask({
function SubtasksCurrentGuidelinesA11yAlwaysVisible (line 71) | function SubtasksCurrentGuidelinesA11yAlwaysVisible(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/demo/current-guidelines-a11y-keyboard-only.tsx
type DraggableSubtaskProps (line 22) | type DraggableSubtaskProps = SubtaskProps & {
function DraggableSubtask (line 52) | function DraggableSubtask({
function SubtasksCurrentGuidelinesA11yKeyboardOnly (line 99) | function SubtasksCurrentGuidelinesA11yKeyboardOnly(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/demo/current-guidelines.tsx
type DraggableSubtaskProps (line 20) | type DraggableSubtaskProps = SubtaskProps & {
function DraggableSubtask (line 32) | function DraggableSubtask({ index, id, ...subtaskProps }: DraggableSubta...
function SubtaskCurrentGuidelines (line 55) | function SubtaskCurrentGuidelines(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/demo/enhancements.tsx
function DraggableSubtaskPreview (line 41) | function DraggableSubtaskPreview({ children }: { children: ReactNode }) {
type DraggableSubtaskProps (line 50) | type DraggableSubtaskProps = SubtaskProps & {
function DraggableSubtask (line 101) | function DraggableSubtask({
function SubtaskEnhanced (line 195) | function SubtaskEnhanced(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/demo/linear-native-preview.tsx
function DragPreview (line 35) | function DragPreview({
function DraggableSubtask (line 43) | function DraggableSubtask({ index, item }: DraggableSubtaskProps) {
function LinearTaskReorderingNativePreview (line 84) | function LinearTaskReorderingNativePreview(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/demo/linear.tsx
function DragPreview (line 42) | function DragPreview({
function DraggableSubtask (line 181) | function DraggableSubtask({ index, item }: DraggableSubtaskProps) {
function LinearTaskReordering (line 214) | function LinearTaskReordering(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/demo/migration-layer.tsx
type DraggableSubtaskProps (line 15) | type DraggableSubtaskProps = SubtaskProps & {
function DraggableSubtask (line 19) | function DraggableSubtask({ index, ...subtaskProps }: DraggableSubtaskPr...
function SubtasksMigrationLayer (line 40) | function SubtasksMigrationLayer(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/demo/notion.tsx
type DraggableSubtaskProps (line 20) | type DraggableSubtaskProps = Omit & {
function DraggableSubtask (line 32) | function DraggableSubtask({ index, id, ...subtaskProps }: DraggableSubta...
function SubtasksNotion (line 62) | function SubtasksNotion(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/demo/react-beautiful-dnd.tsx
type DraggableSubtaskProps (line 16) | type DraggableSubtaskProps = SubtaskProps & {
function DraggableSubtask (line 20) | function DraggableSubtask({ index, ...subtaskProps }: DraggableSubtaskPr...
function SubtaskReactBeautifulDnd (line 36) | function SubtaskReactBeautifulDnd(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/hooks/use-sortable-field.tsx
type UseSortableFieldArgs (line 18) | type UseSortableFieldArgs = {
function shouldHideDropIndicator (line 33) | function shouldHideDropIndicator({
type DragState (line 49) | type DragState = 'idle' | 'preview' | 'dragging';
function useSortableField (line 51) | function useSortableField({
FILE: packages/documentation/examples/pieces/subtasks/hooks/use-top-level-wiring.tsx
type UseToplevelWiringArgs (line 11) | type UseToplevelWiringArgs = {
type ReorderItem (line 21) | type ReorderItem = (args: { id: string; action: 'up' | 'down' }) => void;
function useTopLevelWiring (line 31) | function useTopLevelWiring({
FILE: packages/documentation/examples/pieces/subtasks/primitives/linear/in-progress-icon.tsx
function LinearInProgressIcon (line 5) | function LinearInProgressIcon(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/primitives/linear/priority-icon.tsx
function LinearPriorityIcon (line 3) | function LinearPriorityIcon({
FILE: packages/documentation/examples/pieces/subtasks/primitives/linear/subtask-container.tsx
type SubtaskContainerProps (line 21) | type SubtaskContainerProps = HTMLAttributes & {
FILE: packages/documentation/examples/pieces/subtasks/primitives/linear/subtask.tsx
function SubtaskGroup (line 61) | function SubtaskGroup({ children }: { children: ReactNode }) {
type SubtaskAppearance (line 65) | type SubtaskAppearance = 'default' | 'overlay' | 'disabled';
type SubtaskProps (line 95) | type SubtaskProps = HTMLAttributes & {
FILE: packages/documentation/examples/pieces/subtasks/primitives/major-priority-icon.tsx
function MajorPriorityIcon (line 3) | function MajorPriorityIcon(): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/primitives/notion/drop-indicator.tsx
function DropIndicator (line 35) | function DropIndicator({ edge, gap }: { edge: Edge; gap: string }): Reac...
FILE: packages/documentation/examples/pieces/subtasks/primitives/notion/subtask-container.tsx
type SubtaskContainerProps (line 23) | type SubtaskContainerProps = HTMLAttributes & {
function Heading (line 45) | function Heading({ children }: { children: ReactNode }) {
FILE: packages/documentation/examples/pieces/subtasks/primitives/notion/subtask.tsx
type SubtaskAppearance (line 33) | type SubtaskAppearance = 'default' | 'overlay' | 'disabled';
type SubtaskProps (line 64) | type SubtaskProps = HTMLAttributes & {
function Cell (line 85) | function Cell({ children }: { children: ReactNode }) {
FILE: packages/documentation/examples/pieces/subtasks/primitives/subtask-container.tsx
type SubtaskContainerProps (line 25) | type SubtaskContainerProps = HTMLAttributes & {
FILE: packages/documentation/examples/pieces/subtasks/primitives/subtask-drag-handle.tsx
type SubtaskDragHandleProps (line 84) | type SubtaskDragHandleProps = {
function SubtaskDragHandleTrigger (line 89) | function SubtaskDragHandleTrigger({
FILE: packages/documentation/examples/pieces/subtasks/primitives/subtask-icon.tsx
function SubtaskObjectIcon (line 5) | function SubtaskObjectIcon(): React.JSX.Element {
function SubtaskIcon (line 40) | function SubtaskIcon({ isIconHidden = false }): React.JSX.Element {
FILE: packages/documentation/examples/pieces/subtasks/primitives/subtask.tsx
function SubtaskGroup (line 49) | function SubtaskGroup({ children }: { children: ReactNode }) {
type SubtaskAppearance (line 64) | type SubtaskAppearance = 'default' | 'overlay' | 'disabled';
type SubtaskProps (line 91) | type SubtaskProps = HTMLAttributes & {
FILE: packages/documentation/examples/pieces/subtasks/templates/_base.tsx
type DraggableSubtaskProps (line 6) | type DraggableSubtaskProps = { index: number; item: DataItem };
type SubtasksBaseTemplateProps (line 8) | type SubtasksBaseTemplateProps = {
function SubtasksBaseTemplate (line 14) | function SubtasksBaseTemplate({
FILE: packages/documentation/examples/pieces/subtasks/templates/linear.tsx
type LinearTemplateProps (line 7) | type LinearTemplateProps = Omit;
function LinearTemplate (line 9) | function LinearTemplate({
FILE: packages/documentation/examples/pieces/table/data.ts
function getStableValues (line 11) | function getStableValues({
function getItems (line 37) | function getItems({ amount }: { amount: number }): Item[] {
FILE: packages/documentation/examples/pieces/table/render-pieces.tsx
function getField (line 18) | function getField({ item, property }: { item: Item; property: keyof Item...
function getProperty (line 43) | function getProperty(value: keyof Item): string {
function getStatus (line 53) | function getStatus(value: Status): ReactElement {
FILE: packages/documentation/examples/pieces/table/row.tsx
type State (line 49) | type State =
method getInitialData (line 102) | getInitialData() {
method onGenerateDragPreview (line 105) | onGenerateDragPreview({ nativeSetDragImage }) {
method canDrop (line 122) | canDrop({ source }) {
method getData (line 129) | getData({ input, element }) {
method onDragEnter (line 137) | onDragEnter(args) {
method onDrag (line 143) | onDrag(args) {
method onDragLeave (line 160) | onDragLeave() {
method onDrop (line 163) | onDrop() {
function Preview (line 226) | function Preview({ item, properties }: { item: Item; properties: (keyof ...
FILE: packages/documentation/examples/pieces/table/table-context.ts
type UnregisterFn (line 5) | type UnregisterFn = () => void;
type ItemContextValue (line 7) | type ItemContextValue = {
FILE: packages/documentation/examples/pieces/table/table-header.tsx
type HeaderState (line 37) | type HeaderState =
function clamp (line 84) | function clamp({ value, min, max }: { value: number; min: number; max: n...
type ColumnType (line 93) | type ColumnType = 'first-of-many' | 'middle-of-many' | 'last-of-many' | ...
function getColumnType (line 189) | function getColumnType({
function TableHeader (line 208) | function TableHeader({
function ColumnPreview (line 481) | function ColumnPreview({ property }: { property: keyof Item }) {
FILE: packages/documentation/examples/pieces/table/types.ts
type Status (line 5) | type Status = 'todo' | 'in-progress' | 'done';
type Item (line 7) | type Item = {
type ItemRegistration (line 14) | type ItemRegistration = {
type ReorderFunction (line 20) | type ReorderFunction = (args: {
FILE: packages/documentation/examples/pieces/tree-legacy/move-dialog.tsx
type FormData (line 19) | type FormData = {
function MoveDialog (line 24) | function MoveDialog({
function PositionSelectField (line 127) | function PositionSelectField({
FILE: packages/documentation/examples/pieces/tree-legacy/tree-context.tsx
type TreeContextValue (line 11) | type TreeContextValue = {
type DependencyContext (line 33) | type DependencyContext = {
FILE: packages/documentation/examples/pieces/tree-legacy/tree-item.tsx
function ChildIcon (line 46) | function ChildIcon() {
function GroupIcon (line 54) | function GroupIcon({ isOpen }: { isOpen: boolean }) {
function Icon (line 59) | function Icon({ item }: { item: TreeItemType }) {
function Preview (line 139) | function Preview({ item }: { item: TreeItemType }) {
function getParentLevelOfInstruction (line 147) | function getParentLevelOfInstruction(instruction: Instruction): number {
function delay (line 157) | function delay({ waitMs: timeMs, fn }: { waitMs: number; fn: () => void ...
function updateIsParentOfInstruction (line 245) | function updateIsParentOfInstruction({ location }: { location: DragLocat...
function onChange (line 253) | function onChange({ self, source }: ElementDropTargetEventBasePayload) {
method onDrop (line 348) | onDrop() {
FILE: packages/documentation/examples/pieces/tree/move-dialog.tsx
type FormData (line 19) | type FormData = {
function MoveDialog (line 24) | function MoveDialog({
function PositionSelectField (line 127) | function PositionSelectField({
FILE: packages/documentation/examples/pieces/tree/tree-context.tsx
type TreeContextValue (line 11) | type TreeContextValue = {
type DependencyContext (line 33) | type DependencyContext = {
FILE: packages/documentation/examples/pieces/tree/tree-item.tsx
function ChildIcon (line 42) | function ChildIcon() {
function GroupIcon (line 50) | function GroupIcon({ isOpen }: { isOpen: boolean }) {
function Icon (line 55) | function Icon({ item }: { item: TreeItemType }) {
function Preview (line 137) | function Preview({ item }: { item: TreeItemType }) {
function delay (line 141) | function delay({ waitMs: timeMs, fn }: { waitMs: number; fn: () => void ...
function onChange (line 196) | function onChange({ self }: ElementDropTargetEventBasePayload) {
function onChange (line 306) | function onChange({ location, self }: ElementDropTargetEventBasePayload) {
FILE: packages/documentation/examples/resizing.tsx
function Icon (line 34) | function Icon({ src, alt }: { src: string; alt: string }) {
type State (line 133) | type State =
function getProposedWidth (line 147) | function getProposedWidth({
function Sidebar (line 161) | function Sidebar() {
function Item (line 238) | function Item({ itemId }: { itemId: string }) {
function Content (line 255) | function Content() {
function Container (line 280) | function Container(): React.JSX.Element {
FILE: packages/documentation/examples/table.tsx
function extractIndex (line 62) | function extractIndex(data: Record) {
type Operation (line 70) | type Operation =
function Table (line 80) | function Table(): React.JSX.Element {
FILE: packages/documentation/examples/text-selection.tsx
function TextSelection (line 14) | function TextSelection(): React.JSX.Element {
FILE: packages/documentation/examples/tree-legacy.tsx
type CleanupFn (line 52) | type CleanupFn = () => void;
function createTreeItemRegistry (line 54) | function createTreeItemRegistry() {
function Tree (line 75) | function Tree(): React.JSX.Element {
FILE: packages/documentation/examples/tree.tsx
type CleanupFn (line 50) | type CleanupFn = () => void;
function createTreeItemRegistry (line 52) | function createTreeItemRegistry() {
function TreeLegacy (line 73) | function TreeLegacy(): React.JSX.Element {
FILE: packages/documentation/examples/trello-like-board-iframe.tsx
function TrelloLikeBoardIframe (line 19) | function TrelloLikeBoardIframe(): React.JSX.Element {
FILE: packages/documentation/examples/util/global-styles.tsx
function GlobalStyles (line 19) | function GlobalStyles(): React.JSX.Element {
FILE: packages/documentation/examples/virtual-list.tsx
type ItemPosition (line 48) | type ItemPosition = 'first' | 'last' | 'middle' | 'only';
type CleanupFn (line 50) | type CleanupFn = () => void;
type ItemEntry (line 52) | type ItemEntry = { itemId: string; element: HTMLElement };
type ListContextValue (line 54) | type ListContextValue = {
function useListContext (line 67) | function useListContext() {
type Item (line 73) | type Item = {
type ItemData (line 79) | type ItemData = {
function getItemData (line 86) | function getItemData({
function isItemData (line 103) | function isItemData(data: Record): data is Ite...
function getItemPosition (line 107) | function getItemPosition({ index, items }: { index: number; items: Item[...
type ItemState (line 157) | type ItemState =
function DropDownContent (line 184) | function DropDownContent({ position, index }: { position: ItemPosition; ...
function predicate (line 264) | function predicate({ source }: { source: ElementDragPayload }): boolean {
method onGenerateDragPreview (line 280) | onGenerateDragPreview({ nativeSetDragImage }) {
method onDragStart (line 294) | onDragStart() {
method onDrop (line 297) | onDrop() {
method getData (line 305) | getData({ input }) {
method onDrag (line 312) | onDrag({ self }) {
method onDragLeave (line 322) | onDragLeave() {
method onDrop (line 325) | onDrop() {
function getItems (line 424) | function getItems({ amount }: { amount: number }): Item[] {
function getItemRegistry (line 443) | function getItemRegistry() {
type ListState (line 468) | type ListState = {
function ListExample (line 478) | function ListExample(): React.JSX.Element {
FILE: packages/documentation/scripts/codegen.ts
function generateSVGDataURIs (line 8) | async function generateSVGDataURIs() {
FILE: packages/flourish/examples/basic.tsx
function BasicExample (line 17) | function BasicExample(): React.JSX.Element {
FILE: packages/flourish/src/trigger-post-move-flash.tsx
function triggerPostMoveFlash (line 10) | function triggerPostMoveFlash(element: HTMLElement): void {
FILE: packages/hitbox/__tests__/unit/_util.ts
function getDefaultInput (line 3) | function getDefaultInput(overrides: Partial = {}): Input {
function getRect (line 26) | function getRect(box: {
function between (line 47) | function between(inner: number, outer: number): number {
FILE: packages/hitbox/__tests__/unit/closest-edge.spec.ts
type Scenario (line 17) | type Scenario = {
FILE: packages/hitbox/__tests__/unit/list-item.spec.ts
type TOperationArgs (line 10) | type TOperationArgs = Parameters[1]['operation...
type Axis (line 24) | type Axis = (typeof axis)[number];
function getInputs (line 43) | function getInputs(axis: Axis) {
function block (line 120) | function block(args: TOperationArgs): TOperationArgs {
type TExpectationMap (line 139) | type TExpectationMap = {
FILE: packages/hitbox/__tests__/unit/tree-item.spec.ts
type Scenario (line 12) | type Scenario = {
type Point (line 37) | type Point = Position & { label: string };
function getPoints (line 39) | function getPoints(rect: DOMRect): Point[] {
function createPullBackScenario (line 209) | function createPullBackScenario({
FILE: packages/hitbox/src/closest-edge.ts
type Edge (line 5) | type Edge = EdgeRaw;
function attachClosestEdge (line 22) | function attachClosestEdge(
function extractClosestEdge (line 61) | function extractClosestEdge(userData: Record):...
FILE: packages/hitbox/src/get-reorder-destination-index.ts
function getReorderDestinationIndex (line 3) | function getReorderDestinationIndex({
FILE: packages/hitbox/src/internal/memoize.ts
type TData (line 1) | type TData = Record;
function isShallowEqual (line 3) | function isShallowEqual(a: Record, b: Record(isEqual: (a: T, b: T) => boolean = isSh...
FILE: packages/hitbox/src/list-item.ts
type Operation (line 5) | type Operation = 'reorder-before' | 'reorder-after' | 'combine';
type Axis (line 7) | type Axis = 'horizontal' | 'vertical';
type Instruction (line 9) | type Instruction = {
type AxisDefinition (line 35) | type AxisDefinition = (typeof axisLookup)[keyof typeof axisLookup];
function reorderAndCombine (line 37) | function reorderAndCombine({
function reorder (line 61) | function reorder({
type Availability (line 84) | type Availability = 'available' | 'not-available' | 'blocked';
function isPossible (line 86) | function isPossible(...values: Availability[]): boolean {
function isNotAvailable (line 90) | function isNotAvailable(...values: Availability[]): boolean {
function attachInstruction (line 126) | function attachInstruction(
function extractInstruction (line 229) | function extractInstruction(userData: Record):...
FILE: packages/hitbox/src/reorder-with-edge.ts
function reorderWithEdge (line 6) | function reorderWithEdge({
FILE: packages/hitbox/src/tree-item.ts
type ItemMode (line 5) | type ItemMode = 'standard' | 'expanded' | 'last-in-group';
type Instruction (line 7) | type Instruction =
function getCenter (line 36) | function getCenter(rect: DOMRect): Position {
function standardHitbox (line 43) | function standardHitbox({
function getInstruction (line 65) | function getInstruction({
function areInstructionsEqual (line 136) | function areInstructionsEqual(a: Instruction, b: Instruction): boolean {
function applyInstructionBlock (line 151) | function applyInstructionBlock({
function attachInstruction (line 169) | function attachInstruction(
function extractInstruction (line 191) | function extractInstruction(userData: Record):...
FILE: packages/hitbox/src/types.ts
type Edge (line 1) | type Edge = 'top' | 'right' | 'bottom' | 'left';
FILE: packages/live-region/examples/00-basic.tsx
function BasicExample (line 5) | function BasicExample(): React.JSX.Element {
FILE: packages/live-region/examples/01-list-with-inline-buttons.tsx
type ItemData (line 20) | type ItemData = { id: string; label: string };
type Action (line 22) | type Action = { type: 'MOVE_UP' | 'MOVE_DOWN'; id: string };
function App (line 122) | function App(): React.JSX.Element {
FILE: packages/live-region/src/index.tsx
function createNode (line 29) | function createNode(): HTMLElement {
function getNode (line 47) | function getNode(): HTMLElement {
function tryClearTimer (line 56) | function tryClearTimer() {
function announce (line 66) | function announce(message: string): void {
function cleanup (line 93) | function cleanup(): void {
FILE: packages/react-accessibility/examples/drag-handle-button-small.tsx
function DragHandleButtonSmallExample (line 5) | function DragHandleButtonSmallExample(): React.JSX.Element {
FILE: packages/react-accessibility/examples/drag-handle-button.tsx
function DragHandleButtonExample (line 5) | function DragHandleButtonExample(): React.JSX.Element {
FILE: packages/react-accessibility/examples/drag-handle-dropdown-menu.tsx
function DragHandleDropdownMenuExample (line 9) | function DragHandleDropdownMenuExample(): React.JSX.Element {
FILE: packages/react-accessibility/src/drag-handle-button-base.tsx
type DragHandleButtonAppearance (line 30) | type DragHandleButtonAppearance = 'default' | 'subtle' | 'selected';
FILE: packages/react-accessibility/src/types.tsx
type DragHandleButtonAppearance (line 3) | type DragHandleButtonAppearance = 'default' | 'subtle' | 'selected';
type DragHandleButtonProps (line 5) | type DragHandleButtonProps = ButtonHTMLAttributes & {
type DragHandleIconProps (line 26) | type DragHandleIconProps = {
FILE: packages/react-beautiful-dnd-autoscroll/__tests__/unit/_util.tsx
function getDefaultInput (line 3) | function getDefaultInput(overrides: Partial = {}): Input {
function getRect (line 26) | function getRect(box: {
function getElements (line 49) | function getElements(tagName: keyof HTMLElementTagNameMap = 'div'): Iter...
FILE: packages/react-beautiful-dnd-autoscroll/__tests__/unit/get-scroll/get-value.spec.ts
type Args (line 20) | type Args = {
FILE: packages/react-beautiful-dnd-autoscroll/src/index.ts
type WhileDragging (line 6) | type WhileDragging = {
function tryScroll (line 25) | function tryScroll(fakeScrollCallback?: () => void) {
function loop (line 44) | function loop() {
function updateInput (line 82) | function updateInput({ input }: { input: Input }): void {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/can-scroll.ts
type CanPartiallyScrollArgs (line 8) | type CanPartiallyScrollArgs = {
type GetRemainderArgs (line 21) | type GetRemainderArgs = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-closest-scrollable-element.ts
type Overflow (line 3) | type Overflow = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-max-scroll.ts
type Args (line 5) | type Args = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-percentage.ts
type Args (line 3) | type Args = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-scroll/get-scroll-on-axis/get-distance-thresholds.ts
type DistanceThresholds (line 8) | type DistanceThresholds = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-scroll/get-scroll-on-axis/get-value.ts
type Args (line 9) | type Args = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-scroll/get-scroll-on-axis/index.ts
type GetOnAxisArgs (line 10) | type GetOnAxisArgs = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-scroll/index.ts
type Args (line 16) | type Args = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-scrollable-scroll-change.ts
type Args (line 9) | type Args = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/get-window-scroll-change.ts
type Args (line 9) | type Args = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/scroll.ts
type Args (line 11) | type Args = {
FILE: packages/react-beautiful-dnd-autoscroll/src/internal/types.ts
type AxisDirection (line 5) | type AxisDirection = 'horizontal' | 'vertical';
type VerticalAxis (line 7) | type VerticalAxis = {
type HorizontalAxis (line 15) | type HorizontalAxis = {
type Axis (line 23) | type Axis = VerticalAxis | HorizontalAxis;
type Spacing (line 25) | type Spacing = {
type ScrollSize (line 32) | type ScrollSize = {
type ScrollDetails (line 37) | type ScrollDetails = {
type Scrollable (line 43) | type Scrollable = {
type Viewport (line 48) | type Viewport = {
type ScrollBehavior (line 53) | type ScrollBehavior =
FILE: packages/react-beautiful-dnd-migration/__tests__/informational-vr-tests/drop-indicator.vr.tsx
function getDropTargetPoint (line 26) | function getDropTargetPoint({
function dragToElement (line 54) | async function dragToElement({
FILE: packages/react-beautiful-dnd-migration/__tests__/informational-vr-tests/smoke.vr.tsx
function dragAndDrop (line 23) | async function dragAndDrop({
FILE: packages/react-beautiful-dnd-migration/__tests__/playwright/virtual.spec.tsx
function getDraggableSelector (line 7) | function getDraggableSelector(draggableId: string) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/_util.tsx
function setElementFromPoint (line 8) | function setElementFromPoint(el: Element | null): CleanupFn {
function getDroppable (line 21) | function getDroppable(droppableId: DroppableId, container: HTMLElement):...
function findPlaceholderInDroppable (line 27) | function findPlaceholderInDroppable(
function getPlaceholder (line 35) | function getPlaceholder(): HTMLElement {
function hasPlaceholderInDroppable (line 41) | function hasPlaceholderInDroppable(
function findDropIndicator (line 48) | function findDropIndicator(
function hasDropIndicator (line 57) | function hasDropIndicator(droppableId: DroppableId, container: HTMLEleme...
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/_utils/board.tsx
type BoardProps (line 13) | type BoardProps = Partial;
function noop (line 15) | function noop() {}
function Board (line 17) | function Board({ onDragEnd = noop, ...responders }: BoardProps): React.J...
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/_utils/setup.tsx
function setup (line 1) | function setup(): void {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/_utils/with-set-element-from-point.tsx
function withSetElementFromPoint (line 3) | function withSetElementFromPoint(dragHandle: HTMLElement, callback: Func...
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/abort.test.tsx
function App (line 21) | function App(props: Partial) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/batch-updates-for-react-18.test.tsx
type BatchFunction (line 1) | type BatchFunction = (callback: () => void) => void;
function setupMocks (line 3) | async function setupMocks({
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/destination.test.tsx
function dragAndDrop (line 37) | function dragAndDrop({
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/draggable/_utils.tsx
type Item (line 12) | type Item = {
function renderApp (line 23) | function renderApp(items: Item[] = defaultItems) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/draggable/find-drag-handle.test.tsx
function App (line 15) | function App({ children }: { children: ReactNode }) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/draggable/keyboard.test.tsx
function liftNode (line 387) | function liftNode(): Event {
function dropNode (line 402) | function dropNode(): Event {
function CrossAxisApp (line 436) | function CrossAxisApp() {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/draggable/placeholder.test.tsx
function Board (line 23) | function Board() {
function getAllColumnDroppableIds (line 68) | function getAllColumnDroppableIds() {
function isOver (line 74) | function isOver(element: HTMLElement) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/draggable/timing.test.tsx
function getRect (line 12) | function getRect({ x = 0, y = 0, width = 0, height = 0 }: DOMRectInit): ...
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/droppable/auto-scroll.test.tsx
function List (line 13) | function List() {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/droppable/closest-edge.test.tsx
function List (line 13) | function List({ direction, onDragEnd }: { direction: Direction; onDragEn...
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/droppable/drop-indicator.test.tsx
function Board (line 37) | function Board({ mode = 'standard', columnSpy }: { mode?: DroppableMode;...
function getAllColumnDroppableIds (line 85) | function getAllColumnDroppableIds() {
function isOver (line 91) | function isOver(element: HTMLElement) {
function findDropIndicator (line 95) | function findDropIndicator(droppableId: DroppableId, container: HTMLElem...
function hasDropIndicator (line 101) | function hasDropIndicator(droppableId: DroppableId, container: HTMLEleme...
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/droppable/gap/calculate-gap.test.tsx
function App (line 10) | function App({ direction }: { direction?: Direction }) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/droppable/gap/get-distance.test.tsx
function getRects (line 10) | function getRects({ dx, dy }: { dx: number; dy: number }): [DOMRect, DOM...
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/droppable/is-drop-disabled.test.tsx
type AppProps (line 31) | type AppProps = {
function AppInner (line 37) | function AppInner(droppableProvided: DroppableProvided) {
function OuterDroppable (line 57) | function OuterDroppable({ children }: { children: ReactNode }) {
function App (line 70) | function App({ onDragStart, onDragUpdate, onDragEnd }: AppProps) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/droppable/resting.test.tsx
function App (line 8) | function App({ spy }: { spy?: jest.Mock }) {
function getSnapshots (line 21) | function getSnapshots(spy: jest.Mock): DroppableStateSnapshot[] {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/error-handling.test.tsx
type AppProps (line 17) | type AppProps = Partial & {
function getRuntimeError (line 21) | function getRuntimeError(): Event {
function App (line 28) | function App({ shouldThrow = false, ...props }: AppProps) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/multi-context.test.tsx
type ItemData (line 22) | type ItemData = { id: string }[];
function noop (line 29) | function noop() {}
function VerticalList (line 31) | function VerticalList({
function App (line 70) | function App({
function getResponders (line 91) | function getResponders() {
method onPendingDragStart (line 270) | onPendingDragStart(args) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/_utils/cause-runtime-error.tsx
function getRuntimeError (line 1) | function getRuntimeError(): Event {
function causeRuntimeError (line 8) | function causeRuntimeError(): void {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/_utils/console.tsx
function noop (line 1) | function noop() {}
type ConsoleFunction (line 3) | type ConsoleFunction = 'warn' | 'error';
function withConsole (line 5) | function withConsole(type: ConsoleFunction, fn: () => void, message?: st...
function withoutConsole (line 22) | function withoutConsole(type: ConsoleFunction, fn: () => void) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/_utils/app.tsx
function noop (line 20) | function noop() {}
type Item (line 22) | type Item = {
type RenderItem (line 32) | type RenderItem = (
type Props (line 57) | type Props = {
function getItems (line 75) | function getItems() {
function withDefaultBool (line 86) | function withDefaultBool(value: boolean | null | undefined, defaultValue...
function App (line 94) | function App(props: Props): React.JSX.Element {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/_utils/controls.tsx
type Control (line 14) | type Control = {
function simpleLift (line 23) | function simpleLift(control: Control, handle: HTMLElement): void {
function getTransitionEnd (line 28) | function getTransitionEnd(propertyName: string = 'transform'): Event {
function mouseLiftExtended (line 39) | function mouseLiftExtended(
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/_utils/helpers.tsx
function getOffset (line 16) | function getOffset(el: HTMLElement): Position {
function getDropReason (line 35) | function getDropReason(onDragEnd: jest.Mock): DropReason {
function isDragging (line 42) | function isDragging(el: HTMLElement): boolean {
function isDropAnimating (line 46) | function isDropAnimating(el: HTMLElement): boolean {
function isCombining (line 50) | function isCombining(el: HTMLElement): boolean {
function isCombineTarget (line 54) | function isCombineTarget(el: HTMLElement): boolean {
function isClone (line 58) | function isClone(el: HTMLElement): boolean {
function isOver (line 62) | function isOver(el: HTMLElement): string | null {
type Call (line 81) | type Call = [DraggableProvided, DraggableStateSnapshot, DraggableRubric];
function getLast (line 108) | function getLast(values: T[]): T | null {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/disable-on-start.test.tsx
type AppProps (line 27) | type AppProps = {
function App (line 33) | function App(props: AppProps) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/drag-drop-context/error-handling/error-on-window.test.tsx
function getRuntimeError (line 20) | function getRuntimeError(): Event {
function getRbdErrorEvent (line 27) | function getRbdErrorEvent(): Event {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/drag-drop-context/on-before-capture/additions.test.tsx
function AnotherChunk (line 27) | function AnotherChunk() {
function Root (line 50) | function Root() {
function getIndex (line 75) | function getIndex(el: HTMLElement): number {
function Root (line 88) | function Root() {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/drag-drop-context/on-before-capture/removals.test.tsx
function getIndex (line 16) | function getIndex(el: HTMLElement): number {
function Root (line 26) | function Root() {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/drag-handle/shared-behaviors/cleanup.test.tsx
function getCallCount (line 14) | function getCallCount(mySpy: jest.SpyInstance): number {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/drag-handle/shared-behaviors/nested-handles.test.tsx
function Board (line 21) | function Board() {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/draggable/validation.test.tsx
function App (line 22) | function App() {
function App (line 52) | function App() {
function App (line 82) | function App() {
function App (line 112) | function App() {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/reorder-render-sync.test.tsx
type Task (line 20) | type Task = {
type TaskItemProps (line 25) | type TaskItemProps = {
function TaskItem (line 30) | function TaskItem({ task, provided }: TaskItemProps) {
type InnerListProps (line 44) | type InnerListProps = {
function App (line 74) | function App() {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/responders-integration.test.tsx
type Props (line 31) | type Props = {
function App (line 35) | function App({ responders }: Props) {
function getHandle (line 97) | function getHandle(): HTMLElement {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/responders-timing.test.tsx
type ItemProps (line 20) | type ItemProps = {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/integration/server-side-rendering/client-hydration.test.tsx
function noop (line 11) | function noop() {}
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/state/middleware/responders/abort.test.tsx
function App (line 23) | function App(props: Partial) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/state/middleware/responders/announcements.test.tsx
type Case (line 33) | type Case = {
function getDragStart (line 40) | function getDragStart(): DragStart {
method [current.responder] (line 138) | [current.responder]() {}
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/state/middleware/responders/flushing.test.tsx
function App (line 16) | function App(props: Partial) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/state/middleware/responders/repeated-use.test.tsx
function App (line 19) | function App(props: Partial) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/state/middleware/responders/start.test.tsx
function App (line 21) | function App(props: Partial) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/state/middleware/responders/update.test.tsx
function App (line 25) | function App() {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/ported-from-react-beautiful-dnd/unit/view/style-marshal/style-marshal.test.tsx
function getStyleTagSelector (line 21) | function getStyleTagSelector(contextId: ContextId) {
function App (line 32) | function App({ nonce }: { nonce?: string }) {
function renderApp (line 57) | function renderApp(args?: { nonce?: string }) {
FILE: packages/react-beautiful-dnd-migration/__tests__/unit/virtual.test.tsx
function noop (line 24) | function noop() {}
type Item (line 26) | type Item = { id: string };
function FakeVirtualRenderer (line 36) | function FakeVirtualRenderer({
function DraggableContent (line 63) | function DraggableContent({ provided, item }: { provided: DraggableProvi...
function VirtualList (line 82) | function VirtualList({
function getResponders (line 110) | function getResponders() {
FILE: packages/react-beautiful-dnd-migration/codemods/__tests__/migration/migrate-12-to-13.test.tsx
function getExpectedMessage (line 14) | function getExpectedMessage({ indent }: { indent: number }) {
FILE: packages/react-beautiful-dnd-migration/codemods/__tests__/migration/warn-about-removed-exports.test.tsx
function getExpectedComment (line 17) | function getExpectedComment({ indent }: { indent: number }) {
FILE: packages/react-beautiful-dnd-migration/codemods/migrations/migrate-12-to-13.tsx
method DragDropContext (line 13) | DragDropContext(j: JSCodeshift, path: ASTPath) {
method Draggable (line 19) | Draggable(j: JSCodeshift, path: ASTPath) {
method Droppable (line 33) | Droppable(j: JSCodeshift, path: ASTPath) {
function migrate12to13 (line 39) | function migrate12to13(j: JSCodeshift, source: Collection): void {
FILE: packages/react-beautiful-dnd-migration/codemods/migrations/update-imports.tsx
function updateImports (line 10) | function updateImports(j: core.JSCodeshift, source: Collection): v...
FILE: packages/react-beautiful-dnd-migration/codemods/migrations/warn-about-react-beautiful-dnd-next.tsx
function warnAboutReactBeautifulDndNext (line 8) | function warnAboutReactBeautifulDndNext(j: JSCodeshift, source: Collecti...
FILE: packages/react-beautiful-dnd-migration/codemods/migrations/warn-about-removed-exports.tsx
function warnAboutRemovedExports (line 19) | function warnAboutRemovedExports(j: core.JSCodeshift, source: Collection...
FILE: packages/react-beautiful-dnd-migration/codemods/migrations/warn-about-unsupported-props.tsx
function getWarningMessage (line 25) | function getWarningMessage(reason: string) {
function warnAboutUnsupportedProps (line 37) | function warnAboutUnsupportedProps(j: JSCodeshift, source: Collection...
type ComponentName (line 30) | type ComponentName = (typeof componentNameList)[number];
function isComponentName (line 32) | function isComponentName(str: string): str is ComponentName {
function getImportedRbdComponentNames (line 36) | function getImportedRbdComponentNames(
function getJSXElementName (line 57) | function getJSXElementName(node: JSXElement): string | null {
function getRbdElementsInFile (line 65) | function getRbdElementsInFile(
type CallbackArgs (line 78) | type CallbackArgs = {
function forEachRbdElementInFile (line 84) | function forEachRbdElementInFile(
FILE: packages/react-beautiful-dnd-migration/examples/00-vertical-list.tsx
type ItemData (line 16) | type ItemData = {
function Card (line 37) | function Card({ quote, index }: { quote: ItemData; index: number }) {
function List (line 56) | function List({ items }: { items: ItemData[] }) {
function App (line 77) | function App() {
function VerticalListExample (line 110) | function VerticalListExample(): React.JSX.Element {
FILE: packages/react-beautiful-dnd-migration/examples/01-board.tsx
function BoardExample (line 25) | function BoardExample() {
FILE: packages/react-beautiful-dnd-migration/examples/02-react-window.tsx
function BoardExample (line 25) | function BoardExample() {
FILE: packages/react-beautiful-dnd-migration/examples/03-react-virtualized.tsx
function BoardExample (line 25) | function BoardExample() {
FILE: packages/react-beautiful-dnd-migration/examples/04-multi-context.tsx
function VerticalList (line 15) | function VerticalList() {
function MultiContextExample (line 49) | function MultiContextExample(): React.JSX.Element {
FILE: packages/react-beautiful-dnd-migration/examples/05-scroll-container.tsx
type ItemData (line 18) | type ItemData = {
function Card (line 39) | function Card({ quote, index }: { quote: ItemData; index: number }) {
function List (line 60) | function List({ items }: { items: ItemData[] }) {
function App (line 81) | function App(): React.JSX.Element {
function VerticalListExample (line 140) | function VerticalListExample(): React.JSX.Element {
FILE: packages/react-beautiful-dnd-migration/examples/data/tasks.ts
type Item (line 5) | type Item = {
type ColumnType (line 9) | type ColumnType = {
type ColumnMap (line 14) | type ColumnMap = { [columnId: string]: ColumnType };
function getItems (line 16) | function getItems({ count, startColumnId }: { count: number; startColumn...
type Data (line 25) | type Data = {
function getInitialData (line 30) | function getInitialData(): Data {
function reorderColumn (line 51) | function reorderColumn(data: Data, { source, destination }: DropResult):...
function reorderCard (line 72) | function reorderCard(data: Data, { source, destination }: DropResult): D...
function moveCard (line 99) | function moveCard(data: Data, { source, destination, draggableId }: Drop...
function clearColumn (line 135) | function clearColumn(data: Data, columnId: string): Data {
FILE: packages/react-beautiful-dnd-migration/examples/pieces/card.tsx
function DragIcon (line 47) | function DragIcon({ state }: { state: DraggableState }) {
type DraggableState (line 62) | type DraggableState = 'idle' | 'generate-preview' | 'dragging';
function CardText (line 76) | function CardText({ state }: { state: DraggableState }) {
type CardProps (line 84) | type CardProps = {
function CardInner (line 90) | function CardInner({
FILE: packages/react-beautiful-dnd-migration/examples/pieces/column.tsx
type ColumnProps (line 70) | type ColumnProps = {
FILE: packages/react-beautiful-dnd-migration/examples/pieces/example-wrapper.tsx
type SwitcherProps (line 27) | type SwitcherProps = {
type Library (line 33) | type Library = 'migration' | 'rbd';
function ExampleWrapper (line 45) | function ExampleWrapper({ children }: SwitcherProps): React.JSX.Element {
type Components (line 65) | type Components = {
function useDependency (line 76) | function useDependency(): Components {
FILE: packages/react-beautiful-dnd-migration/examples/pieces/global-styles.tsx
function GlobalStyles (line 15) | function GlobalStyles(): React.JSX.Element {
FILE: packages/react-beautiful-dnd-migration/examples/pieces/react-virtualized/column.tsx
type ColumnProps (line 47) | type ColumnProps = {
constant GUTTER_SIZE (line 53) | const GUTTER_SIZE = 8;
FILE: packages/react-beautiful-dnd-migration/examples/pieces/react-window/column.tsx
type ColumnProps (line 46) | type ColumnProps = {
constant GUTTER_SIZE (line 52) | const GUTTER_SIZE = 8;
FILE: packages/react-beautiful-dnd-migration/src/dev-warning.tsx
function noop (line 4) | function noop() {}
type Log (line 6) | type Log = (type: 'error' | 'warn', message: string) => void;
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/cancel-drag.tsx
function cancelPointerDrag (line 9) | function cancelPointerDrag(): void {
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/draggable-location.tsx
function getDraggableLocationFromDraggableData (line 16) | function getDraggableLocationFromDraggableData({
function getDraggableLocationFromDroppableData (line 58) | function getDraggableLocationFromDroppableData({
function getDraggableLocation (line 104) | function getDraggableLocation(location: DragLocation): DraggableLocation...
function isSameLocation (line 133) | function isSameLocation(a: DraggableLocation | null, b: DraggableLocatio...
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/droppable-registry.tsx
type DroppableRegistryEntry (line 7) | type DroppableRegistryEntry = {
type Register (line 17) | type Register = (entry: DroppableRegistryEntry) => CleanupFn;
type GetEntry (line 19) | type GetEntry = ({
type UpdateListener (line 25) | type UpdateListener = (entry: DroppableRegistryEntry) => void;
type SetUpdateListener (line 27) | type SetUpdateListener = (updateListener: UpdateListener) => void;
type DroppableRegistry (line 29) | type DroppableRegistry = {
function createDroppableRegistry (line 35) | function createDroppableRegistry() {
function useDroppableRegistry (line 60) | function useDroppableRegistry(): DroppableRegistry {
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/error-boundary.tsx
type ErrorBoundaryProps (line 14) | type ErrorBoundaryProps = {
function ErrorBoundaryInner (line 23) | function ErrorBoundaryInner({ children, dragController }: ErrorBoundaryP...
class ErrorBoundary (line 85) | class ErrorBoundary extends React.Component {
method componentDidCatch (line 86) | componentDidCatch(err: Error): void {
method getDerivedStateFromError (line 98) | static getDerivedStateFromError(): void {
method render (line 102) | render(): React.JSX.Element {
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/get-destination.tsx
function getActualDestination (line 11) | function getActualDestination({
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/hooks/use-hidden-text-element.tsx
function getHiddenTextElementId (line 5) | function getHiddenTextElementId(contextId: string) {
type UseHiddenTextElementArgs (line 9) | type UseHiddenTextElementArgs = {
function useHiddenTextElement (line 14) | function useHiddenTextElement({ contextId, text }: UseHiddenTextElementA...
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/hooks/use-keyboard-controls.tsx
type KeyHandlerData (line 18) | type KeyHandlerData = {
type KeyHandler (line 24) | type KeyHandler = (event: KeyboardEvent, data: KeyHandlerData) => void;
function scrollToTop (line 36) | function scrollToTop(element: HTMLElement): void {
method prev (line 46) | prev(event: KeyboardEvent, { dragController }: KeyHandlerData) {
method next (line 90) | next(event: KeyboardEvent, { dragController, contextId }: KeyHandlerData) {
method prev (line 151) | prev(event: KeyboardEvent, { dragController, droppableRegistry, contextI...
method next (line 187) | next(event: KeyboardEvent, { dragController, droppableRegistry, contextI...
function preventDefault (line 226) | function preventDefault(event: Event) {
function useKeyboardControls (line 264) | function useKeyboardControls({
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/hooks/use-pointer-controls.tsx
function usePointerControls (line 17) | function usePointerControls({
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/hooks/use-style-marshal.tsx
function getRuleString (line 25) | function getRuleString({ selector, styles }: { selector: string; styles:...
function getDragHandleRuleString (line 35) | function getDragHandleRuleString(contextId: ContextId): string {
type ContextIdAndNonce (line 56) | type ContextIdAndNonce = {
function createStyleEl (line 61) | function createStyleEl({ contextId, nonce }: ContextIdAndNonce): HTMLSty...
function createStyleManager (line 71) | function createStyleManager({ contextId, nonce }: ContextIdAndNonce): Cl...
function useStyleMarshal (line 84) | function useStyleMarshal({ contextId, nonce }: ContextIdAndNonce): void {
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/index.tsx
function resetServerContext (line 53) | function resetServerContext(): void {
function getContextId (line 57) | function getContextId() {
function getOffset (line 61) | function getOffset(args: { element: HTMLElement; mode: DroppableMode }) {
function DragDropContext (line 69) | function DragDropContext({
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/internal-context.tsx
type DragDropContextValue (line 7) | type DragDropContextValue = {
function useDragDropContext (line 28) | function useDragDropContext() {
function DragDropContextProvider (line 34) | function DragDropContextProvider({
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/lifecycle-context.tsx
type DispatchData (line 25) | type DispatchData = {
type LifecycleResponders (line 42) | type LifecycleResponders = {
type LifecycleEvent (line 46) | type LifecycleEvent = keyof LifecycleResponders;
type Registry (line 48) | type Registry = {
type AddResponder (line 52) | type AddResponder = (
type Dispatch (line 57) | type Dispatch = (event: Event, data: Dispa...
type LifecycleManager (line 59) | type LifecycleManager = {
function createRegistry (line 64) | function createRegistry(): Registry {
function createLifecycleManager (line 73) | function createLifecycleManager(): LifecycleManager {
function useLifecycle (line 99) | function useLifecycle(): LifecycleManager {
type MonitorForLifecycle (line 105) | type MonitorForLifecycle = (args: Partial) => Clean...
function LifecycleContextProvider (line 109) | function LifecycleContextProvider({
function useMonitorForLifecycle (line 142) | function useMonitorForLifecycle(): MonitorForLifecycle {
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/live-region.tsx
function createNode (line 39) | function createNode(): HTMLElement {
function getNode (line 50) | function getNode(): HTMLElement {
function announce (line 60) | function announce(message: string): void {
function cleanup (line 68) | function cleanup(): void {
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/rbd-invariant.tsx
class RbdInvariant (line 4) | class RbdInvariant extends Error {
method constructor (line 5) | constructor(message: string) {
method toString (line 10) | toString(): string {
function rbdInvariant (line 17) | function rbdInvariant(condition: unknown, message?: string): asserts con...
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/screen-reader.tsx
function getPosition (line 11) | function getPosition(location: DraggableLocation) {
method onDragStart (line 16) | onDragStart({ source }: DragStart): string {
method onDragUpdate (line 21) | onDragUpdate({ source, destination }: DragUpdate): string {
method onDragEnd (line 37) | onDragEnd({ source, destination, reason }: DropResult): string {
type EventName (line 59) | type EventName = keyof typeof defaultMessage;
type EventData (line 60) | type EventData = Parameters<(typeof defaultMess...
function getDefaultMessage (line 62) | function getDefaultMessage(
function getProvided (line 70) | function getProvided(
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/types.tsx
type DragState (line 5) | type DragState =
type DragController (line 29) | type DragController = {
type StartKeyboardDrag (line 45) | type StartKeyboardDrag = (args: {
FILE: packages/react-beautiful-dnd-migration/src/drag-drop-context/use-scheduler.tsx
type Callback (line 5) | type Callback = () => void;
type Scheduler (line 7) | type Scheduler = {
type Queue (line 19) | type Queue =
function createScheduler (line 29) | function createScheduler(): Scheduler {
function useScheduler (line 85) | function useScheduler(): Scheduler {
FILE: packages/react-beautiful-dnd-migration/src/draggable/data.tsx
type DraggableData (line 14) | type DraggableData = {
function isDraggableData (line 45) | function isDraggableData(data: Record): data i...
function useDraggableData (line 54) | function useDraggableData({
FILE: packages/react-beautiful-dnd-migration/src/draggable/get-draggable-provided-style.tsx
function getDraggingStyle (line 31) | function getDraggingStyle({
function getDraggableProvidedStyle (line 57) | function getDraggableProvidedStyle({
FILE: packages/react-beautiful-dnd-migration/src/draggable/index.tsx
function Draggable (line 43) | function Draggable({
FILE: packages/react-beautiful-dnd-migration/src/draggable/is-event-in-interactive-element.tsx
type TagNameMap (line 11) | type TagNameMap = {
function isAnInteractiveElement (line 26) | function isAnInteractiveElement(parent: Element, current: Element | null...
function isEventInInteractiveElement (line 60) | function isEventInInteractiveElement(draggable: Element, event: Event): ...
FILE: packages/react-beautiful-dnd-migration/src/draggable/state.tsx
type DraggableIdleState (line 26) | type DraggableIdleState = {
type PointerLocation (line 31) | type PointerLocation = {
type DraggablePreviewOffset (line 40) | type DraggablePreviewOffset = {
type DraggableDraggingState (line 49) | type DraggableDraggingState = {
type DraggableHidingState (line 63) | type DraggableHidingState = {
type DraggableState (line 69) | type DraggableState = DraggableIdleState | DraggableDraggingState | Drag...
type UpdateKeyboardPayload (line 71) | type UpdateKeyboardPayload = {
type DraggableAction (line 79) | type DraggableAction =
function getHidingState (line 113) | function getHidingState(mode: MovementMode): DraggableHidingState {
type GetKeyboardPreviewOffsetData (line 117) | type GetKeyboardPreviewOffsetData = {
method initial (line 125) | initial({
method home (line 149) | home({
method away (line 189) | away({
function updateKeyboardPreview (line 240) | function updateKeyboardPreview(
function startDrag (line 276) | function startDrag(
function reducer (line 297) | function reducer(state: DraggableState, action: DraggableAction): Dragga...
FILE: packages/react-beautiful-dnd-migration/src/draggable/use-draggable-state-snapshot.tsx
function useDraggableStateSnapshot (line 5) | function useDraggableStateSnapshot({
FILE: packages/react-beautiful-dnd-migration/src/droppable/data.tsx
type DroppableData (line 13) | type DroppableData = {
function isDroppableData (line 35) | function isDroppableData(data: Record): data i...
function useDroppableData (line 44) | function useDroppableData({
FILE: packages/react-beautiful-dnd-migration/src/droppable/draggable-clone.tsx
function getBody (line 32) | function getBody() {
function DraggableCloneInner (line 41) | function DraggableCloneInner({
function DraggableClone (line 136) | function DraggableClone({
FILE: packages/react-beautiful-dnd-migration/src/droppable/drop-indicator/get-dimensions.tsx
function measureDraggable (line 20) | function measureDraggable({
function measurePlaceholder (line 65) | function measurePlaceholder({
function getDroppableOffset (line 95) | function getDroppableOffset({
function measureDroppable (line 124) | function measureDroppable({
function getIndicatorSizeAndOffset (line 148) | function getIndicatorSizeAndOffset({
FILE: packages/react-beautiful-dnd-migration/src/droppable/drop-indicator/index.tsx
type DropIndicatorProps (line 25) | type DropIndicatorProps = {
function getDynamicStyles (line 84) | function getDynamicStyles({
method onPrePendingDragUpdate (line 185) | onPrePendingDragUpdate({ update, targetLocation }) {
FILE: packages/react-beautiful-dnd-migration/src/droppable/drop-indicator/types.tsx
type IndicatorSizeAndOffset (line 1) | type IndicatorSizeAndOffset = {
FILE: packages/react-beautiful-dnd-migration/src/droppable/droppable-context.tsx
type DroppableContextProps (line 7) | type DroppableContextProps = {
function useDroppableContext (line 23) | function useDroppableContext() {
function useParentDroppableId (line 35) | function useParentDroppableId() {
FILE: packages/react-beautiful-dnd-migration/src/droppable/gap/get-distance.tsx
function getDistance (line 23) | function getDistance({
FILE: packages/react-beautiful-dnd-migration/src/droppable/gap/index.tsx
function getDroppableId (line 9) | function getDroppableId(element: HTMLElement) {
function getIndex (line 13) | function getIndex(element: HTMLElement): number {
function calculateGap (line 25) | function calculateGap({
function getGapOffset (line 71) | function getGapOffset({
FILE: packages/react-beautiful-dnd-migration/src/droppable/index.tsx
function Droppable (line 34) | function Droppable({
FILE: packages/react-beautiful-dnd-migration/src/droppable/state.tsx
type DroppableState (line 5) | type DroppableState = {
type DroppableAction (line 11) | type DroppableAction =
function reducer (line 22) | function reducer(state: DroppableState, action: DroppableAction): Droppa...
FILE: packages/react-beautiful-dnd-migration/src/droppable/virtual-placeholder.tsx
function VirtualPlaceholder (line 24) | function VirtualPlaceholder({
FILE: packages/react-beautiful-dnd-migration/src/hooks/use-captured-dimensions.tsx
type DraggableDimensions (line 3) | type DraggableDimensions = {
function getDraggableDimensions (line 8) | function getDraggableDimensions(element: HTMLElement): DraggableDimensio...
function useDraggableDimensions (line 17) | function useDraggableDimensions(): DraggableDimensions | null {
FILE: packages/react-beautiful-dnd-migration/src/hooks/use-cleanup-fn.tsx
function createCleanupManager (line 7) | function createCleanupManager() {
function useCleanupFn (line 22) | function useCleanupFn() {
FILE: packages/react-beautiful-dnd-migration/src/hooks/use-drop-target-for-draggable.tsx
function useDropTargetForDraggable (line 11) | function useDropTargetForDraggable({
FILE: packages/react-beautiful-dnd-migration/src/hooks/use-keyboard-context.tsx
function useKeyboardContext (line 3) | function useKeyboardContext() {
FILE: packages/react-beautiful-dnd-migration/src/internal-types.tsx
type DragSource (line 4) | type DragSource = {
type Action (line 10) | type Action = Payload extends ...
type CleanupFn (line 14) | type CleanupFn = () => void;
FILE: packages/react-beautiful-dnd-migration/src/utils/attributes.tsx
type LeafOf (line 35) | type LeafOf