Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Socket
Sign inDemoInstall

@hello-pangea/dnd

Package Overview
Dependencies
Maintainers
2
Versions
10
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@hello-pangea/dnd - npm Package Compare versions

Comparing version 15.0.0 to 16.0.0

30

dist/dnd.d.ts

@@ -10,3 +10,3 @@ import { Position } from 'css-box-model';

declare type ElementId = Id;
declare type DroppableMode = "standard" | "virtual";
declare type DroppableMode = 'standard' | 'virtual';
interface DraggableOptions {

@@ -17,3 +17,3 @@ canDragInteractiveElements: boolean;

}
declare type Direction = "horizontal" | "vertical";
declare type Direction = 'horizontal' | 'vertical';
interface DraggableLocation {

@@ -27,3 +27,3 @@ droppableId: DroppableId;

}
declare type MovementMode = "FLUID" | "SNAP";
declare type MovementMode = 'FLUID' | 'SNAP';
interface DraggableRubric {

@@ -45,3 +45,3 @@ draggableId: DraggableId;

}
declare type DropReason = "DROP" | "CANCEL";
declare type DropReason = 'DROP' | 'CANCEL';
interface DropResult extends DragUpdate {

@@ -116,6 +116,6 @@ reason: DropReason;

interface DraggingStyle {
position: "fixed";
position: 'fixed';
top: number;
left: number;
boxSizing: "border-box";
boxSizing: 'border-box';
width: number;

@@ -127,7 +127,7 @@ height: number;

opacity?: number;
pointerEvents: "none";
pointerEvents: 'none';
}
interface NotDraggingStyle {
transform?: string;
transition?: "none";
transition?: 'none';
}

@@ -137,11 +137,11 @@ declare type DraggableStyle = DraggingStyle | NotDraggingStyle;

style?: DraggableStyle;
"data-rfd-draggable-context-id": ContextId;
"data-rfd-draggable-id": DraggableId;
'data-rfd-draggable-context-id': ContextId;
'data-rfd-draggable-id': DraggableId;
onTransitionEnd?: TransitionEventHandler;
}
interface DraggableProvidedDragHandleProps {
"data-rfd-drag-handle-draggable-id": DraggableId;
"data-rfd-drag-handle-context-id": ContextId;
'data-rfd-drag-handle-draggable-id': DraggableId;
'data-rfd-drag-handle-context-id': ContextId;
role: string;
"aria-describedby": ElementId;
'aria-describedby': ElementId;
tabIndex: number;

@@ -186,4 +186,4 @@ draggable: boolean;

interface DroppableProvidedProps {
"data-rfd-droppable-context-id": ContextId;
"data-rfd-droppable-id": DroppableId;
'data-rfd-droppable-context-id': ContextId;
'data-rfd-droppable-id': DroppableId;
}

@@ -190,0 +190,0 @@ interface DroppableProvided {

114

package.json
{
"name": "@hello-pangea/dnd",
"version": "15.0.0",
"version": "16.0.0",
"private": false,

@@ -8,4 +8,4 @@ "description": "Beautiful and accessible drag and drop for lists with React",

"maintainers": [
"Reece Carolan <reece@hellopangea.com>",
"Gabriel Santerre <gab@100terres.com>"
"Gabriel Santerre <gab@100terres.com>",
"Reece Carolan <reece@hellopangea.com>"
],

@@ -29,3 +29,3 @@ "keywords": [

"bugs": {
"url": "https://github.com/react-forked/dnd/issues"
"url": "https://github.com/hello-pangea/dnd/issues"
},

@@ -40,2 +40,5 @@ "main": "dist/dnd.cjs.js",

],
"publishConfig": {
"access": "public"
},
"config": {

@@ -45,20 +48,27 @@ "prettier_target": "*.{js,jsx,ts,tsx,md,json} src/**/*.{js,jsx,ts,tsx,md,json} test/**/*.{js,jsx,ts,tsx,md,json} docs/**/*.{js,jsx,ts,tsx,md,json} stories/**/*.{js,jsx,ts,tsx,md,json} cypress/**/*.{js,jsx,ts,tsx,md,json} csp-server/**/*.{js,jsx,ts,tsx,md,json}"

"scripts": {
"release": "cross-env release-it",
"commit": "cz",
"chromatic": "chromatic --project-token=f92123f238de",
"prepare": "husky install",
"release": "release-it",
"release:test": "release-it --dry-run",
"test:accessibility": "lighthouse http://localhost:9002/iframe.html?id=examples-single-vertical-list--basic --no-enable-error-reporting --config-path=lighthouse.config.js --chrome-flags='--headless' --output=json --output=html --output-path=./test-reports/lighthouse/a11y.json && node a11y-audit-parse.js",
"test": "jest --config ./jest.config.js",
"test": "jest --config ./jest.config.ts",
"test:react-16": "cross-env REACT_MAJOR_VERSION=16 pnpm test",
"test:react-17": "cross-env REACT_MAJOR_VERSION=17 pnpm test",
"test:react-18": "cross-env REACT_MAJOR_VERSION=18 pnpm test",
"test:browser": "cypress open",
"test:browser:ci": "cypress run",
"test:coverage": "npm run test --coverage --coveragePathIgnorePatterns=/debug",
"validate": "prettier:check && npm run lint:eslint && npm run lint:css && npm run typecheck",
"prettier:check": "prettier --debug-check $npm_package_config_prettier_target",
"prettier:write": "prettier --write $npm_package_config_prettier_target",
"lint:eslint": "eslint \"./**/*.{js,jsx,ts,tsx}\"",
"test:coverage": "pnpm test --coverage --coveragePathIgnorePatterns=/debug",
"validate": "pnpm prettier:check && pnpm lint:eslint && pnpm lint:css && pnpm typecheck",
"prettier:check": "pnpm prettier --debug-check $npm_package_config_prettier_target",
"prettier:write": "pnpm prettier --write $npm_package_config_prettier_target",
"lint:eslint": "pnpm eslint \"./**/*.{js,jsx,ts,tsx}\"",
"lint:css": "stylelint \"stories/**/*.{js,jsx,ts,tsx}\"",
"typecheck": "npm run typecheck:lib && npm run typecheck:test && npm run typecheck:storybook",
"typecheck:lib": "tsc --project tsconfig.json",
"typecheck:storybook": "tsc --project stories/tsconfig.json && tsc --project .storybook/tsconfig.json",
"typecheck:test": "tsc --project test/tsconfig.json && tsc --project csp-server/tsconfig.json && tsc --project cypress/tsconfig.json",
"bundle-size:check": "cross-env SNAPSHOT=match npm run bundle-size:update",
"bundle-size:update": "npm run build:clean && npm run build:dist && npm run build:clean",
"build": "npm run build:clean && npm run build:dist",
"typecheck": "pnpm typecheck:lib && pnpm typecheck:test && pnpm typecheck:storybook",
"typecheck:lib": "pnpm tsc --project tsconfig.json",
"typecheck:storybook": "pnpm tsc --project stories/tsconfig.json && pnpm tsc --project .storybook/tsconfig.json",
"typecheck:test": "pnpm tsc --project test/tsconfig.json && pnpm tsc --project csp-server/tsconfig.json && pnpm tsc --project cypress/tsconfig.json",
"bundle-size:check": "cross-env SNAPSHOT=match pnpm bundle-size:update",
"bundle-size:update": "pnpm build:clean && pnpm build:dist && pnpm build:clean",
"build": "pnpm build:clean && pnpm build:dist",
"build:clean": "rimraf dist",

@@ -68,3 +78,3 @@ "build:dist": "cross-env NODE_ENV=production rollup -c",

"build-storybook": "build-storybook -c .storybook -o site",
"prepublishOnly": "npm run build"
"prepublishOnly": "pnpm build"
},

@@ -94,2 +104,5 @@ "dependencies": {

"@babel/preset-typescript": "7.18.6",
"@commitlint/cli": "17.0.3",
"@commitlint/config-conventional": "17.0.3",
"@commitlint/cz-commitlint": "17.0.3",
"@emotion/babel-preset-css-prop": "11.10.0",

@@ -100,3 +113,3 @@ "@emotion/eslint-plugin": "11.10.0",

"@jest/environment": "28.1.3",
"@release-it/conventional-changelog": "4.3.0",
"@release-it/conventional-changelog": "5.1.0",
"@rollup/plugin-babel": "5.3.1",

@@ -108,7 +121,7 @@ "@rollup/plugin-commonjs": "22.0.2",

"@rollup/plugin-strip": "2.1.0",
"@storybook/addon-docs": "6.5.10",
"@storybook/addon-essentials": "6.5.10",
"@storybook/addon-storysource": "6.5.10",
"@storybook/addons": "6.5.10",
"@storybook/builder-webpack5": "^6.5.10",
"@storybook/core": "6.5.10",
"@storybook/manager-webpack5": "^6.5.10",
"@storybook/react": "6.5.10",

@@ -119,17 +132,21 @@ "@storybook/theming": "6.5.10",

"@testing-library/react": "13.3.0",
"@testing-library/react-16-17": "npm:@testing-library/react@12.1.5",
"@types/enzyme": "3.10.12",
"@types/express": "4.17.13",
"@types/fs-extra": "9.0.13",
"@types/jest": "28.1.6",
"@types/jest": "28.1.7",
"@types/jest-axe": "3.5.4",
"@types/jsdom": "20.0.0",
"@types/jsdom": "16.2.15",
"@types/markdown-it": "12.2.3",
"@types/node": "16.11.48",
"@types/node": "16.11.52",
"@types/raf-schd": "4.0.1",
"@types/react": "18.0.17",
"@types/react-dom": "18.0.6",
"@types/react-redux": "7.1.24",
"@types/react-virtualized": "9.21.21",
"@types/react-window": "1.8.5",
"@types/seedrandom": "3.0.2",
"@typescript-eslint/eslint-plugin": "5.33.0",
"@typescript-eslint/parser": "5.33.0",
"@types/testing-library__jest-dom": "5.14.5",
"@typescript-eslint/eslint-plugin": "5.33.1",
"@typescript-eslint/parser": "5.33.1",
"babel-jest": "28.1.3",

@@ -139,14 +156,19 @@ "babel-loader": "8.2.5",

"babel-plugin-module-resolver": "4.1.0",
"commitizen": "4.2.5",
"cross-env": "7.0.3",
"csstype": "3.1.0",
"cypress": "9.7.0",
"cypress": "10.6.0",
"dotenv": "16.0.1",
"eslint": "8.21.0",
"emotion-theming": "11.0.0",
"eslint": "8.22.0",
"eslint-config-airbnb": "19.0.4",
"eslint-config-prettier": "8.5.0",
"eslint-import-resolver-typescript": "3.4.0",
"eslint-import-resolver-typescript": "3.4.2",
"eslint-plugin-cypress": "2.12.1",
"eslint-plugin-es5": "1.5.0",
"eslint-plugin-import": "2.26.0",
"eslint-plugin-jest": "26.8.2",
"eslint-plugin-jest": "26.8.7",
"eslint-plugin-jsx-a11y": "6.6.1",
"eslint-plugin-node": "11.1.0",
"eslint-plugin-prettier": "4.2.1",
"eslint-plugin-react": "7.30.1",

@@ -158,3 +180,3 @@ "eslint-plugin-react-hooks": "4.6.0",

"fs-extra": "10.1.0",
"html-webpack-plugin": "^5.5.0",
"husky": "8.0.1",
"jest": "28.1.3",

@@ -165,5 +187,5 @@ "jest-axe": "6.0.0",

"jest-watch-typeahead": "2.0.0",
"jsdom": "20.0.0",
"lighthouse": "9.6.5",
"markdown-it": "12.3.2",
"jsdom": "19.0.0",
"lighthouse": "9.6.6",
"markdown-it": "13.0.1",
"memory-fs": "0.5.0",

@@ -173,9 +195,13 @@ "prettier": "2.7.1",

"react": "18.2.0",
"react-16": "npm:react@16.14.0",
"react-17": "npm:react@17.0.2",
"react-dom": "18.2.0",
"react-dom-16": "npm:react-dom@16.14.0",
"react-dom-17": "npm:react-dom@17.0.2",
"react-virtualized": "9.22.3",
"react-window": "1.8.7",
"release-it": "14.14.3",
"release-it": "15.3.0",
"require-from-string": "2.0.2",
"rimraf": "3.0.2",
"rollup": "2.77.3",
"rollup": "2.78.1",
"rollup-plugin-dts": "4.2.2",

@@ -185,11 +211,10 @@ "rollup-plugin-size-snapshot": "0.12.0",

"seedrandom": "3.0.5",
"storybook-addon-performance": "0.16.1",
"styled-components": "5.3.5",
"stylelint": "14.10.0",
"stylelint": "14.11.0",
"stylelint-config-prettier": "9.0.3",
"stylelint-config-recommended": "9.0.0",
"stylelint-config-standard": "27.0.0",
"stylelint-config-standard": "28.0.0",
"stylelint-config-styled-components": "0.1.1",
"stylelint-processor-styled-components": "1.10.0",
"ts-jest": "28.0.7",
"ts-jest": "28.0.8",
"typescript": "4.7.4",

@@ -200,4 +225,4 @@ "wait-on": "6.0.1",

"peerDependencies": {
"react": "^17.0.0 || ^18.0.0",
"react-dom": "^17.0.0 || ^18.0.0"
"react": "^16.8.5 || ^17.0.0 || ^18.0.0",
"react-dom": "^16.8.5 || ^17.0.0 || ^18.0.0"
},

@@ -207,6 +232,3 @@ "license": "Apache-2.0",

"output": "test-reports/junit/js-test-results.xml"
},
"publishConfig": {
"access": "public"
}
}

16

README.md
<p align="center">
<img src="https://user-images.githubusercontent.com/2182637/53611918-54c1ff80-3c24-11e9-9917-66ac3cef513d.png" alt="react beautiful dnd logo" />
</p>
<h1 align="center">Pangea DnD</h1>
<h1 align="center">@hello-pangea/dnd</h1>
<div align="center">
<small>@hello-pangea/dnd</small>
**Beautiful** and **accessible** drag and drop for lists with [`React`](https://facebook.github.io/react/)
[![CircleCI branch](https://img.shields.io/circleci/project/github/hello-pangea/dnd/main.svg)](https://circleci.com/gh/hello-pangea/dnd/tree/main)
[![npm](https://img.shields.io/npm/v/@hello-pangea/dnd.svg)](https://www.npmjs.com/package/@hello-pangea/dnd)
[![Discord](https://img.shields.io/discord/1007763479010234398?color=blue)](https://discord.gg/zKhPpmvCEv)
[![Conventional Commits](https://img.shields.io/badge/Conventional%20Commits-1.0.0-blue.svg)](https://conventionalcommits.org)
[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-blue.svg)](http://commitizen.github.io/cz-cli/)
![quote application example](https://user-images.githubusercontent.com/2182637/53614150-efbed780-3c2c-11e9-9204-a5d2e746faca.gif)
[Play with this example if you want!](https://react-forked-dnd.netlify.app/?path=/story/examples-board--simple)
[Play with this example if you want!](https://dnd.hellopangea.com/?path=/story/examples-board--simple)

@@ -156,7 +158,7 @@ </div>

## Maintainer 🛠️
## Maintainers 🛠️
- Gabriel Santerre [@100terres](https://github.com/100terres)
- Reece Carolan [@Xhale1](https://github.com/Xhale1)
- Gabriel Santerre [@100terres](https://github.com/100terres)
- Many other [@Atlassian](https://twitter.com/Atlassian)'s!
- Many [@Atlassian](https://twitter.com/Atlassian)'s have contributed to the original [`react-beautiful-dnd`](https://github.com/atlassian/react-beautiful-dnd). _Atlassian is no longer involved with this project._

@@ -163,0 +165,0 @@ ## Collaborators 🤝

8

src/animation.ts

@@ -1,7 +0,7 @@

import type { Position } from "css-box-model";
import { isEqual, origin } from "./state/position";
import type { Position } from 'css-box-model';
import { isEqual, origin } from './state/position';
export const curves = {
outOfTheWay: "cubic-bezier(0.2, 0, 0, 1)",
drop: "cubic-bezier(.2,1,.1,1)",
outOfTheWay: 'cubic-bezier(0.2, 0, 0, 1)',
drop: 'cubic-bezier(.2,1,.1,1)',
};

@@ -8,0 +8,0 @@

8

src/debug/middleware/action-timing-average.ts
/* eslint-disable no-console */
import type { Action } from "../../state/store-types";
import type { Action } from '../../state/store-types';

@@ -11,3 +11,3 @@ interface Bucket {

(previous: number, current: number) => previous + current,
0
0,
);

@@ -18,3 +18,3 @@ return sum / values.length;

export default (groupSize: number) => {
console.log("Starting average action timer middleware");
console.log('Starting average action timer middleware');
console.log(`Will take an average every ${groupSize} actions`);

@@ -47,3 +47,3 @@ const bucket: Bucket = {};

`Average time for ${action.type}`,
average(bucket[action.type])
average(bucket[action.type]),
);

@@ -50,0 +50,0 @@

4

src/debug/middleware/action-timing.ts
/* eslint-disable no-console */
import * as timings from "../timings";
import type { Action } from "../../state/store-types";
import * as timings from '../timings';
import type { Action } from '../../state/store-types';

@@ -5,0 +5,0 @@ export default () =>

16

src/debug/middleware/log.ts
/* eslint-disable no-console */
import type { Action, Store } from "../../state/store-types";
import type { Action, Store } from '../../state/store-types';
type Mode = "verbose" | "light";
type Mode = 'verbose' | 'light';
export default (mode: Mode = "verbose") =>
export default (mode: Mode = 'verbose') =>
(store: Store) =>
(next: (a: Action) => unknown) =>
(action: Action): any => {
if (mode === "light") {
console.log("🏃‍ Action:", action.type);
if (mode === 'light') {
console.log('🏃‍ Action:', action.type);
return next(action);

@@ -16,9 +16,9 @@ }

console.group(`action: ${action.type}`);
console.log("action payload", action.payload);
console.log('action payload', action.payload);
console.log("state before", store.getState());
console.log('state before', store.getState());
const result: unknown = next(action);
console.log("state after", store.getState());
console.log('state after', store.getState());
console.groupEnd();

@@ -25,0 +25,0 @@

2

src/debug/middleware/user-timing.ts

@@ -1,2 +0,2 @@

import type { Action } from "../../state/store-types";
import type { Action } from '../../state/store-types';

@@ -3,0 +3,0 @@ export default () =>

24

src/debug/timings.ts

@@ -20,3 +20,3 @@ interface Records {

// draw back: can only do timings in dev env (which seems to be fine for now)
if (process.env.NODE_ENV !== "production") {
if (process.env.NODE_ENV !== 'production') {
if (!isTimingsEnabled()) {

@@ -37,3 +37,3 @@ return;

export const finish = (key: string) => {
if (process.env.NODE_ENV !== "production") {
if (process.env.NODE_ENV !== 'production') {
if (!isTimingsEnabled()) {

@@ -48,3 +48,3 @@ return;

// eslint-disable-next-line no-console
console.warn("cannot finish timing as no previous time found", key);
console.warn('cannot finish timing as no previous time found', key);
return;

@@ -59,4 +59,4 @@ }

return {
textColor: "green",
symbol: "✅",
textColor: 'green',
symbol: '✅',
};

@@ -66,9 +66,9 @@ }

return {
textColor: "orange",
symbol: "⚠️",
textColor: 'orange',
symbol: '⚠️',
};
}
return {
textColor: "red",
symbol: "❌",
textColor: 'red',
symbol: '❌',
};

@@ -81,11 +81,11 @@ })();

// title
"color: blue; font-weight: bold;",
'color: blue; font-weight: bold;',
// result
`color: ${style.textColor}; font-size: 1.1em;`,
// ms
"color: grey;",
'color: grey;',
// key
"color: purple; font-weight: bold;"
'color: purple; font-weight: bold;',
);
}
};

20

src/dev-warning.ts

@@ -1,2 +0,2 @@

const isProduction: boolean = process.env.NODE_ENV === "production";
const isProduction: boolean = process.env.NODE_ENV === 'production';

@@ -9,3 +9,3 @@ // not replacing newlines (which \s does)

const clean = (value: string): string =>
value.replace(spacesAndTabs, " ").replace(lineStartWithSpaces, "").trim();
value.replace(spacesAndTabs, ' ').replace(lineStartWithSpaces, '').trim();

@@ -24,12 +24,12 @@ const getDevMessage = (message: string): string =>

// title (green400)
"color: #00C584; font-size: 1.2em; font-weight: bold;",
'color: #00C584; font-size: 1.2em; font-weight: bold;',
// message
"line-height: 1.5",
'line-height: 1.5',
// footer (purple300)
"color: #723874;",
'color: #723874;',
];
const isDisabledFlag = "__@hello-pangea/dnd-disable-dev-warnings";
const isDisabledFlag = '__@hello-pangea/dnd-disable-dev-warnings';
export function log(type: "error" | "warn", message: string): void {
export function log(type: 'error' | 'warn', message: string): void {
// no warnings in production

@@ -41,3 +41,3 @@ if (isProduction) {

// manual opt out of warnings
if (typeof window !== "undefined" && window[isDisabledFlag]) {
if (typeof window !== 'undefined' && window[isDisabledFlag]) {
return;

@@ -50,3 +50,3 @@ }

export const warning = log.bind(null, "warn");
export const error = log.bind(null, "error");
export const warning = log.bind(null, 'warn');
export const error = log.bind(null, 'error');

4

src/global.d.ts

@@ -6,3 +6,3 @@ declare type AnimationFrameID = number;

interface ProcessEnv {
NODE_ENV: "development" | "production";
NODE_ENV: 'development' | 'production';
}

@@ -17,3 +17,3 @@

declare interface Window {
"__@hello-pangea/dnd-disable-dev-warnings"?: boolean;
'__@hello-pangea/dnd-disable-dev-warnings'?: boolean;
}

@@ -20,0 +20,0 @@

18

src/index.ts

@@ -28,10 +28,10 @@ // Public types

TryGetLockOptions,
} from "./types";
} from './types';
// DragDropContext
export { default as DragDropContext } from "./view/drag-drop-context";
export type { DragDropContextProps } from "./view/drag-drop-context";
export { default as DragDropContext } from './view/drag-drop-context';
export type { DragDropContextProps } from './view/drag-drop-context';
// Draggable
export { default as Draggable } from "./view/draggable";
export { default as Draggable } from './view/draggable';
export type {

@@ -48,6 +48,6 @@ DraggableChildrenFn,

NotDraggingStyle,
} from "./view/draggable/draggable-types";
} from './view/draggable/draggable-types';
// Droppable
export { default as Droppable } from "./view/droppable";
export { default as Droppable } from './view/droppable';
export type {

@@ -58,3 +58,3 @@ DroppableProps,

DroppableStateSnapshot,
} from "./view/droppable/droppable-types";
} from './view/droppable/droppable-types';

@@ -66,5 +66,5 @@ // Sensors

useKeyboardSensor,
} from "./view/use-sensor-marshal";
} from './view/use-sensor-marshal';
// Utils
export { resetServerContext } from "./view/drag-drop-context";
export { resetServerContext } from './view/drag-drop-context';

8

src/invariant.ts
/* eslint-disable no-restricted-syntax */
const isProduction: boolean = process.env.NODE_ENV === "production";
const prefix = "Invariant failed";
const isProduction: boolean = process.env.NODE_ENV === 'production';
const prefix = 'Invariant failed';

@@ -18,3 +18,3 @@ export class RbdInvariant extends Error {}

condition: unknown,
message?: string
message?: string,
): asserts condition {

@@ -31,4 +31,4 @@ if (condition) {

// *This block will be removed in production builds*
throw new RbdInvariant(`${prefix}: ${message || ""}`);
throw new RbdInvariant(`${prefix}: ${message || ''}`);
}
}

2

src/query-selector-all.ts
export function querySelectorAll(
parentNode: ParentNode,
selector: string
selector: string,
): HTMLElement[] {
return Array.from(parentNode.querySelectorAll(selector));
}

10

src/screen-reader-message-preset.ts

@@ -8,3 +8,3 @@ import type {

Combine,
} from "./types";
} from './types';

@@ -34,3 +34,3 @@ export interface MessagePreset {

source: DraggableLocation,
destination: DraggableLocation
destination: DraggableLocation,
) => {

@@ -60,3 +60,3 @@ const isInHomeList: boolean = source.droppableId === destination.droppableId;

source: DraggableLocation,
combine: Combine
combine: Combine,
): string => {

@@ -90,3 +90,3 @@ const inHomeList: boolean = source.droppableId === combine.droppableId;

return "You are over an area that cannot be dropped on";
return 'You are over an area that cannot be dropped on';
};

@@ -100,3 +100,3 @@

const onDragEnd = (result: DropResult): string => {
if (result.reason === "CANCEL") {
if (result.reason === 'CANCEL') {
return `

@@ -103,0 +103,0 @@ Movement cancelled.

106

src/state/action-creators.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -12,3 +12,3 @@ Critical,

Published,
} from "../types";
} from '../types';

@@ -21,3 +21,3 @@ export interface BeforeInitialCaptureArgs {

export interface BeforeInitialCaptureAction {
type: "BEFORE_INITIAL_CAPTURE";
type: 'BEFORE_INITIAL_CAPTURE';
payload: BeforeInitialCaptureArgs;

@@ -29,5 +29,5 @@ }

export const beforeInitialCapture = (
args: BeforeInitialCaptureArgs
args: BeforeInitialCaptureArgs,
): BeforeInitialCaptureAction => ({
type: "BEFORE_INITIAL_CAPTURE",
type: 'BEFORE_INITIAL_CAPTURE',
payload: args,

@@ -45,3 +45,3 @@ });

export interface LiftAction {
type: "LIFT";
type: 'LIFT';
payload: LiftArgs;

@@ -53,3 +53,3 @@ }

export const lift = (args: LiftArgs): LiftAction => ({
type: "LIFT",
type: 'LIFT',
payload: args,

@@ -67,3 +67,3 @@ });

export interface InitialPublishAction {
type: "INITIAL_PUBLISH";
type: 'INITIAL_PUBLISH';
payload: InitialPublishArgs;

@@ -75,5 +75,5 @@ }

export const initialPublish = (
args: InitialPublishArgs
args: InitialPublishArgs,
): InitialPublishAction => ({
type: "INITIAL_PUBLISH",
type: 'INITIAL_PUBLISH',
payload: args,

@@ -83,3 +83,3 @@ });

export interface PublishWhileDraggingAction {
type: "PUBLISH_WHILE_DRAGGING";
type: 'PUBLISH_WHILE_DRAGGING';
payload: Published;

@@ -93,5 +93,5 @@ }

export const publishWhileDragging = (
args: PublishWhileDraggingArgs
args: PublishWhileDraggingArgs,
): PublishWhileDraggingAction => ({
type: "PUBLISH_WHILE_DRAGGING",
type: 'PUBLISH_WHILE_DRAGGING',
payload: args,

@@ -101,3 +101,3 @@ });

export interface CollectionStartingAction {
type: "COLLECTION_STARTING";
type: 'COLLECTION_STARTING';
payload: null;

@@ -109,3 +109,3 @@ }

export const collectionStarting = (): CollectionStartingAction => ({
type: "COLLECTION_STARTING",
type: 'COLLECTION_STARTING',
payload: null,

@@ -120,3 +120,3 @@ });

export interface UpdateDroppableScrollAction {
type: "UPDATE_DROPPABLE_SCROLL";
type: 'UPDATE_DROPPABLE_SCROLL';
payload: UpdateDroppableScrollArgs;

@@ -128,5 +128,5 @@ }

export const updateDroppableScroll = (
args: UpdateDroppableScrollArgs
args: UpdateDroppableScrollArgs,
): UpdateDroppableScrollAction => ({
type: "UPDATE_DROPPABLE_SCROLL",
type: 'UPDATE_DROPPABLE_SCROLL',
payload: args,

@@ -141,3 +141,3 @@ });

export interface UpdateDroppableIsEnabledAction {
type: "UPDATE_DROPPABLE_IS_ENABLED";
type: 'UPDATE_DROPPABLE_IS_ENABLED';
payload: UpdateDroppableIsEnabledArgs;

@@ -150,5 +150,5 @@ }

export const updateDroppableIsEnabled = (
args: UpdateDroppableIsEnabledArgs
args: UpdateDroppableIsEnabledArgs,
): UpdateDroppableIsEnabledAction => ({
type: "UPDATE_DROPPABLE_IS_ENABLED",
type: 'UPDATE_DROPPABLE_IS_ENABLED',
payload: args,

@@ -163,3 +163,3 @@ });

export interface UpdateDroppableIsCombineEnabledAction {
type: "UPDATE_DROPPABLE_IS_COMBINE_ENABLED";
type: 'UPDATE_DROPPABLE_IS_COMBINE_ENABLED';
payload: UpdateDroppableIsCombineEnabledArgs;

@@ -172,5 +172,5 @@ }

export const updateDroppableIsCombineEnabled = (
args: UpdateDroppableIsCombineEnabledArgs
args: UpdateDroppableIsCombineEnabledArgs,
): UpdateDroppableIsCombineEnabledAction => ({
type: "UPDATE_DROPPABLE_IS_COMBINE_ENABLED",
type: 'UPDATE_DROPPABLE_IS_COMBINE_ENABLED',
payload: args,

@@ -184,3 +184,3 @@ });

export interface MoveAction {
type: "MOVE";
type: 'MOVE';
payload: MoveArgs;

@@ -192,3 +192,3 @@ }

export const move = (args: MoveArgs): MoveAction => ({
type: "MOVE",
type: 'MOVE',
payload: args,

@@ -202,3 +202,3 @@ });

export interface MoveByWindowScrollAction {
type: "MOVE_BY_WINDOW_SCROLL";
type: 'MOVE_BY_WINDOW_SCROLL';
payload: MoveByWindowScrollArgs;

@@ -210,5 +210,5 @@ }

export const moveByWindowScroll = (
args: MoveByWindowScrollArgs
args: MoveByWindowScrollArgs,
): MoveByWindowScrollAction => ({
type: "MOVE_BY_WINDOW_SCROLL",
type: 'MOVE_BY_WINDOW_SCROLL',
payload: args,

@@ -222,3 +222,3 @@ });

export interface UpdateViewportMaxScrollAction {
type: "UPDATE_VIEWPORT_MAX_SCROLL";
type: 'UPDATE_VIEWPORT_MAX_SCROLL';
payload: UpdateViewportMaxScrollArgs;

@@ -231,5 +231,5 @@ }

export const updateViewportMaxScroll = (
args: UpdateViewportMaxScrollArgs
args: UpdateViewportMaxScrollArgs,
): UpdateViewportMaxScrollAction => ({
type: "UPDATE_VIEWPORT_MAX_SCROLL",
type: 'UPDATE_VIEWPORT_MAX_SCROLL',
payload: args,

@@ -239,3 +239,3 @@ });

export interface MoveUpAction {
type: "MOVE_UP";
type: 'MOVE_UP';
payload: null;

@@ -247,3 +247,3 @@ }

export const moveUp = (): MoveUpAction => ({
type: "MOVE_UP",
type: 'MOVE_UP',
payload: null,

@@ -253,3 +253,3 @@ });

export interface MoveDownAction {
type: "MOVE_DOWN";
type: 'MOVE_DOWN';
payload: null;

@@ -261,3 +261,3 @@ }

export const moveDown = (): MoveDownAction => ({
type: "MOVE_DOWN",
type: 'MOVE_DOWN',
payload: null,

@@ -267,3 +267,3 @@ });

export interface MoveRightAction {
type: "MOVE_RIGHT";
type: 'MOVE_RIGHT';
payload: null;

@@ -275,3 +275,3 @@ }

export const moveRight = (): MoveRightAction => ({
type: "MOVE_RIGHT",
type: 'MOVE_RIGHT',
payload: null,

@@ -281,3 +281,3 @@ });

export interface MoveLeftAction {
type: "MOVE_LEFT";
type: 'MOVE_LEFT';
payload: null;

@@ -289,3 +289,3 @@ }

export const moveLeft = (): MoveLeftAction => ({
type: "MOVE_LEFT",
type: 'MOVE_LEFT',
payload: null,

@@ -295,3 +295,3 @@ });

export interface FlushAction {
type: "FLUSH";
type: 'FLUSH';
payload: null;

@@ -303,3 +303,3 @@ }

export const flush = (): FlushAction => ({
type: "FLUSH",
type: 'FLUSH',
payload: null,

@@ -315,3 +315,3 @@ });

export interface DropAnimateAction {
type: "DROP_ANIMATE";
type: 'DROP_ANIMATE';
payload: AnimateDropArgs;

@@ -323,3 +323,3 @@ }

export const animateDrop = (args: AnimateDropArgs): DropAnimateAction => ({
type: "DROP_ANIMATE",
type: 'DROP_ANIMATE',
payload: args,

@@ -333,3 +333,3 @@ });

export interface DropCompleteAction {
type: "DROP_COMPLETE";
type: 'DROP_COMPLETE';
payload: DropCompleteArgs;

@@ -341,3 +341,3 @@ }

export const completeDrop = (args: DropCompleteArgs): DropCompleteAction => ({
type: "DROP_COMPLETE",
type: 'DROP_COMPLETE',
payload: args,

@@ -351,3 +351,3 @@ });

export interface DropAction {
type: "DROP";
type: 'DROP';
payload: DropArgs;

@@ -359,3 +359,3 @@ }

export const drop = (args: DropArgs): DropAction => ({
type: "DROP",
type: 'DROP',
payload: args,

@@ -366,6 +366,6 @@ });

export const cancel = () => drop({ reason: "CANCEL" });
export const cancel = () => drop({ reason: 'CANCEL' });
export interface DropPendingAction {
type: "DROP_PENDING";
type: 'DROP_PENDING';
payload: DropArgs;

@@ -377,3 +377,3 @@ }

export const dropPending = (args: DropArgs): DropPendingAction => ({
type: "DROP_PENDING",
type: 'DROP_PENDING',
payload: args,

@@ -383,3 +383,3 @@ });

export interface DropAnimationFinishedAction {
type: "DROP_ANIMATION_FINISHED";
type: 'DROP_ANIMATION_FINISHED';
payload: null;

@@ -391,3 +391,3 @@ }

export const dropAnimationFinished = (): DropAnimationFinishedAction => ({
type: "DROP_ANIMATION_FINISHED",
type: 'DROP_ANIMATION_FINISHED',
payload: null,

@@ -394,0 +394,0 @@ });

2

src/state/auto-scroller/auto-scroller-types.ts

@@ -1,2 +0,2 @@

import type { State, DraggingState } from "../../types";
import type { State, DraggingState } from '../../types';

@@ -3,0 +3,0 @@ export interface AutoScroller {

14

src/state/auto-scroller/can-scroll.ts

@@ -1,4 +0,4 @@

import type { Position } from "css-box-model";
import { add, apply, isEqual, origin } from "../position";
import type { DroppableDimension, Viewport, Scrollable } from "../../types";
import type { Position } from 'css-box-model';
import { add, apply, isEqual, origin } from '../position';
import type { DroppableDimension, Viewport, Scrollable } from '../../types';

@@ -96,3 +96,3 @@ interface CanPartiallyScrollArgs {

viewport: Viewport,
change: Position
change: Position,
): boolean =>

@@ -107,3 +107,3 @@ canPartiallyScroll({

viewport: Viewport,
change: Position
change: Position,
): Position | null => {

@@ -126,3 +126,3 @@ if (!canScrollWindow(viewport, change)) {

droppable: DroppableDimension,
change: Position
change: Position,
): boolean => {

@@ -145,3 +145,3 @@ const frame: Scrollable | null = droppable.frame;

droppable: DroppableDimension,
change: Position
change: Position,
): Position | null => {

@@ -148,0 +148,0 @@ const frame: Scrollable | null = droppable.frame;

24

src/state/auto-scroller/fluid-scroller/get-best-scrollable-droppable.ts

@@ -1,3 +0,3 @@

import memoizeOne from "memoize-one";
import type { Position } from "css-box-model";
import memoizeOne from 'memoize-one';
import type { Position } from 'css-box-model';
import type {

@@ -7,6 +7,6 @@ DroppableDimension,

DroppableId,
} from "../../../types";
import { invariant } from "../../../invariant";
import isPositionInFrame from "../../visibility/is-position-in-frame";
import { toDroppableList } from "../../dimension-structures";
} from '../../../types';
import { invariant } from '../../../invariant';
import isPositionInFrame from '../../visibility/is-position-in-frame';
import { toDroppableList } from '../../dimension-structures';

@@ -28,4 +28,4 @@ const getScrollableDroppables = memoizeOne(

return true;
}
)
},
),
);

@@ -35,3 +35,3 @@

target: Position,
droppables: DroppableDimensionMap
droppables: DroppableDimensionMap,
): DroppableDimension | null => {

@@ -41,6 +41,6 @@ const maybe =

(droppable: DroppableDimension): boolean => {
invariant(droppable.frame, "Invalid result");
invariant(droppable.frame, 'Invalid result');
return isPositionInFrame(droppable.frame.pageMarginBox)(target);
}
},
) || null;

@@ -76,3 +76,3 @@

center,
droppables
droppables,
);

@@ -79,0 +79,0 @@

8

src/state/auto-scroller/fluid-scroller/get-droppable-scroll-change.ts

@@ -1,5 +0,5 @@

import type { Position, Rect } from "css-box-model";
import type { Scrollable, DroppableDimension } from "../../../types";
import getScroll from "./get-scroll";
import { canScrollDroppable } from "../can-scroll";
import type { Position, Rect } from 'css-box-model';
import type { Scrollable, DroppableDimension } from '../../../types';
import getScroll from './get-scroll';
import { canScrollDroppable } from '../can-scroll';

@@ -6,0 +6,0 @@ interface Args {

2

src/state/auto-scroller/fluid-scroller/get-percentage.ts

@@ -1,2 +0,2 @@

import { warning } from "../../../dev-warning";
import { warning } from '../../../dev-warning';

@@ -3,0 +3,0 @@ interface Args {

2

src/state/auto-scroller/fluid-scroller/get-scroll/adjust-for-size-limits.ts

@@ -1,2 +0,2 @@

import type { Rect, Position } from "css-box-model";
import type { Rect, Position } from 'css-box-model';

@@ -3,0 +3,0 @@ interface Args {

6

src/state/auto-scroller/fluid-scroller/get-scroll/get-scroll-on-axis/dampen-value-by-time.ts

@@ -1,4 +0,4 @@

import getPercentage from "../../get-percentage";
import config from "../../config";
import minScroll from "./min-scroll";
import getPercentage from '../../get-percentage';
import config from '../../config';
import minScroll from './min-scroll';

@@ -5,0 +5,0 @@ const accelerateAt: number = config.durationDampening.accelerateAt;

6

src/state/auto-scroller/fluid-scroller/get-scroll/get-scroll-on-axis/get-distance-thresholds.ts

@@ -1,4 +0,4 @@

import type { Rect } from "css-box-model";
import config from "../../config";
import type { Axis } from "../../../../../types";
import type { Rect } from 'css-box-model';
import config from '../../config';
import type { Axis } from '../../../../../types';

@@ -5,0 +5,0 @@ // all in pixels

10

src/state/auto-scroller/fluid-scroller/get-scroll/get-scroll-on-axis/get-value-from-distance.ts

@@ -1,9 +0,9 @@

import type { DistanceThresholds } from "./get-distance-thresholds";
import getPercentage from "../../get-percentage";
import config from "../../config";
import minScroll from "./min-scroll";
import type { DistanceThresholds } from './get-distance-thresholds';
import getPercentage from '../../get-percentage';
import config from '../../config';
import minScroll from './min-scroll';
export default (
distanceToEdge: number,
thresholds: DistanceThresholds
thresholds: DistanceThresholds,
): number => {

@@ -10,0 +10,0 @@ /*

8

src/state/auto-scroller/fluid-scroller/get-scroll/get-scroll-on-axis/get-value.ts

@@ -1,5 +0,5 @@

import type { DistanceThresholds } from "./get-distance-thresholds";
import getValueFromDistance from "./get-value-from-distance";
import dampenValueByTime from "./dampen-value-by-time";
import minScroll from "./min-scroll";
import type { DistanceThresholds } from './get-distance-thresholds';
import getValueFromDistance from './get-value-from-distance';
import dampenValueByTime from './dampen-value-by-time';
import minScroll from './min-scroll';

@@ -6,0 +6,0 @@ interface Args {

10

src/state/auto-scroller/fluid-scroller/get-scroll/get-scroll-on-axis/index.ts

@@ -1,6 +0,6 @@

import type { Rect, Spacing } from "css-box-model";
import getDistanceThresholds from "./get-distance-thresholds";
import type { DistanceThresholds } from "./get-distance-thresholds";
import type { Axis } from "../../../../../types";
import getValue from "./get-value";
import type { Rect, Spacing } from 'css-box-model';
import getDistanceThresholds from './get-distance-thresholds';
import type { DistanceThresholds } from './get-distance-thresholds';
import type { Axis } from '../../../../../types';
import getValue from './get-value';

@@ -7,0 +7,0 @@ interface GetOnAxisArgs {

10

src/state/auto-scroller/fluid-scroller/get-scroll/index.ts

@@ -1,6 +0,6 @@

import type { Position, Rect, Spacing } from "css-box-model";
import { apply, isEqual, origin } from "../../../position";
import getScrollOnAxis from "./get-scroll-on-axis";
import adjustForSizeLimits from "./adjust-for-size-limits";
import { horizontal, vertical } from "../../../axis";
import type { Position, Rect, Spacing } from 'css-box-model';
import { apply, isEqual, origin } from '../../../position';
import getScrollOnAxis from './get-scroll-on-axis';
import adjustForSizeLimits from './adjust-for-size-limits';
import { horizontal, vertical } from '../../../axis';

@@ -7,0 +7,0 @@ // will replace -0 and replace with +0

8

src/state/auto-scroller/fluid-scroller/get-window-scroll-change.ts

@@ -1,5 +0,5 @@

import type { Position, Rect } from "css-box-model";
import type { Viewport } from "../../../types";
import getScroll from "./get-scroll";
import { canScrollWindow } from "../can-scroll";
import type { Position, Rect } from 'css-box-model';
import type { Viewport } from '../../../types';
import getScroll from './get-scroll';
import { canScrollWindow } from '../can-scroll';

@@ -6,0 +6,0 @@ interface Args {

20

src/state/auto-scroller/fluid-scroller/index.ts

@@ -1,7 +0,7 @@

import rafSchd from "raf-schd";
import type { Position } from "css-box-model";
import type { DraggingState, DroppableId } from "../../../types";
import scroll from "./scroll";
import { invariant } from "../../../invariant";
import * as timings from "../../../debug/timings";
import rafSchd from 'raf-schd';
import type { Position } from 'css-box-model';
import type { DraggingState, DroppableId } from '../../../types';
import scroll from './scroll';
import { invariant } from '../../../invariant';
import * as timings from '../../../debug/timings';

@@ -33,3 +33,3 @@ export interface PublicArgs {

const tryScroll = (state: DraggingState): void => {
invariant(dragging, "Cannot fluid scroll if not dragging");
invariant(dragging, 'Cannot fluid scroll if not dragging');
const { shouldUseTimeDampening, dragStartTime } = dragging;

@@ -47,4 +47,4 @@

const start = (state: DraggingState) => {
timings.start("starting fluid scroller");
invariant(!dragging, "Cannot start auto scrolling when already started");
timings.start('starting fluid scroller');
invariant(!dragging, 'Cannot start auto scrolling when already started');
const dragStartTime: number = Date.now();

@@ -68,3 +68,3 @@

};
timings.finish("starting fluid scroller");
timings.finish('starting fluid scroller');

@@ -71,0 +71,0 @@ // we know an auto scroll is needed - let's do it!

12

src/state/auto-scroller/fluid-scroller/scroll.ts

@@ -1,2 +0,2 @@

import type { Position, Rect } from "css-box-model";
import type { Position, Rect } from 'css-box-model';
import type {

@@ -8,7 +8,7 @@ DraggingState,

Viewport,
} from "../../../types";
import getBestScrollableDroppable from "./get-best-scrollable-droppable";
import whatIsDraggedOver from "../../droppable/what-is-dragged-over";
import getWindowScrollChange from "./get-window-scroll-change";
import getDroppableScrollChange from "./get-droppable-scroll-change";
} from '../../../types';
import getBestScrollableDroppable from './get-best-scrollable-droppable';
import whatIsDraggedOver from '../../droppable/what-is-dragged-over';
import getWindowScrollChange from './get-window-scroll-change';
import getDroppableScrollChange from './get-droppable-scroll-change';

@@ -15,0 +15,0 @@ interface Args {

20

src/state/auto-scroller/index.ts

@@ -1,9 +0,9 @@

import type { Position } from "css-box-model";
import createFluidScroller from "./fluid-scroller";
import type { FluidScroller } from "./fluid-scroller";
import createJumpScroller from "./jump-scroller";
import type { JumpScroller } from "./jump-scroller";
import type { AutoScroller } from "./auto-scroller-types";
import type { DroppableId, State } from "../../types";
import type { MoveArgs } from "../action-creators";
import type { Position } from 'css-box-model';
import createFluidScroller from './fluid-scroller';
import type { FluidScroller } from './fluid-scroller';
import createJumpScroller from './jump-scroller';
import type { JumpScroller } from './jump-scroller';
import type { AutoScroller } from './auto-scroller-types';
import type { DroppableId, State } from '../../types';
import type { MoveArgs } from '../action-creators';

@@ -34,7 +34,7 @@ export interface Args {

// Only allowing auto scrolling in the DRAGGING phase
if (state.phase !== "DRAGGING") {
if (state.phase !== 'DRAGGING') {
return;
}
if (state.movementMode === "FLUID") {
if (state.movementMode === 'FLUID') {
fluidScroller.scroll(state);

@@ -41,0 +41,0 @@ return;

24

src/state/auto-scroller/jump-scroller.ts

@@ -1,4 +0,4 @@

import type { Position } from "css-box-model";
import { invariant } from "../../invariant";
import { add, subtract } from "../position";
import type { Position } from 'css-box-model';
import { invariant } from '../../invariant';
import { add, subtract } from '../position';
import {

@@ -9,5 +9,5 @@ canScrollWindow,

getDroppableOverlap,
} from "./can-scroll";
import whatIsDraggedOver from "../droppable/what-is-dragged-over";
import type { MoveArgs } from "../action-creators";
} from './can-scroll';
import whatIsDraggedOver from '../droppable/what-is-dragged-over';
import type { MoveArgs } from '../action-creators';
import type {

@@ -18,3 +18,3 @@ DroppableDimension,

DroppableId,
} from "../../types";
} from '../../types';

@@ -43,3 +43,3 @@ interface Args {

droppable: DroppableDimension,
change: Position
change: Position,
): Remainder | null => {

@@ -70,3 +70,3 @@ // Droppable cannot absorb any of the scroll

viewport: Viewport,
change: Position
change: Position,
): Position | null => {

@@ -108,3 +108,3 @@ if (!isWindowScrollAllowed) {

destination,
"Cannot perform a jump scroll when there is no destination"
'Cannot perform a jump scroll when there is no destination',
);

@@ -117,3 +117,3 @@

state.dimensions.droppables[destination],
request
request,
);

@@ -130,3 +130,3 @@

viewport,
droppableRemainder
droppableRemainder,
);

@@ -133,0 +133,0 @@

38

src/state/axis.ts

@@ -1,25 +0,25 @@

import type { HorizontalAxis, VerticalAxis } from "../types";
import type { HorizontalAxis, VerticalAxis } from '../types';
export const vertical: VerticalAxis = {
direction: "vertical",
line: "y",
crossAxisLine: "x",
start: "top",
end: "bottom",
size: "height",
crossAxisStart: "left",
crossAxisEnd: "right",
crossAxisSize: "width",
direction: 'vertical',
line: 'y',
crossAxisLine: 'x',
start: 'top',
end: 'bottom',
size: 'height',
crossAxisStart: 'left',
crossAxisEnd: 'right',
crossAxisSize: 'width',
};
export const horizontal: HorizontalAxis = {
direction: "horizontal",
line: "x",
crossAxisLine: "y",
start: "left",
end: "right",
size: "width",
crossAxisStart: "top",
crossAxisEnd: "bottom",
crossAxisSize: "height",
direction: 'horizontal',
line: 'x',
crossAxisLine: 'y',
start: 'left',
end: 'right',
size: 'width',
crossAxisStart: 'top',
crossAxisEnd: 'bottom',
crossAxisSize: 'height',
};

20

src/state/calculate-drag-impact/calculate-reorder-impact.ts

@@ -8,7 +8,7 @@ import type {

DisplacedBy,
} from "../../types";
import removeDraggableFromList from "../remove-draggable-from-list";
import isHomeOf from "../droppable/is-home-of";
import { emptyGroups } from "../no-impact";
import getDisplacementGroups from "../get-displacement-groups";
} from '../../types';
import removeDraggableFromList from '../remove-draggable-from-list';
import isHomeOf from '../droppable/is-home-of';
import { emptyGroups } from '../no-impact';
import getDisplacementGroups from '../get-displacement-groups';

@@ -30,3 +30,3 @@ interface Args {

inHomeList: boolean;
}
},
): number {

@@ -65,3 +65,3 @@ if (!draggables.length) {

at: {
type: "REORDER",
type: 'REORDER',
destination: {

@@ -99,3 +99,3 @@ droppableId: destination.descriptor.id,

const match = insideDestination.find(
(item: DraggableDimension) => item.descriptor.index === index
(item: DraggableDimension) => item.descriptor.index === index,
);

@@ -113,3 +113,3 @@

draggable,
insideDestination
insideDestination,
);

@@ -133,3 +133,3 @@

at: {
type: "REORDER",
type: 'REORDER',
destination: {

@@ -136,0 +136,0 @@ droppableId: destination.descriptor.id,

8

src/state/can-start-drag.ts

@@ -1,6 +0,6 @@

import type { State, DraggableId } from "../types";
import type { State, DraggableId } from '../types';
export default (state: State, id: DraggableId): boolean => {
// Ready to go!
if (state.phase === "IDLE") {
if (state.phase === 'IDLE') {
return true;

@@ -10,3 +10,3 @@ }

// Can lift depending on the type of drop animation
if (state.phase !== "DROP_ANIMATING") {
if (state.phase !== 'DROP_ANIMATING') {
return false;

@@ -28,3 +28,3 @@ }

// if cancelling - disallow lifting
return state.completed.result.reason === "DROP";
return state.completed.result.reason === 'DROP';
};

50

src/state/create-store.ts
/* eslint-disable no-underscore-dangle */
import { applyMiddleware, compose, createStore, StoreEnhancer } from "redux";
import type { Announce, Responders } from "../types";
import type { FocusMarshal } from "../view/use-focus-marshal/focus-marshal-types";
import type { StyleMarshal } from "../view/use-style-marshal/style-marshal-types";
import type { AutoScroller } from "./auto-scroller/auto-scroller-types";
import type { DimensionMarshal } from "./dimension-marshal/dimension-marshal-types";
import autoScroll from "./middleware/auto-scroll";
import dimensionMarshalStopper from "./middleware/dimension-marshal-stopper";
import dropAnimationFinish from "./middleware/drop/drop-animation-finish-middleware";
import dropAnimationFlushOnScroll from "./middleware/drop/drop-animation-flush-on-scroll-middleware";
import drop from "./middleware/drop/drop-middleware";
import focus from "./middleware/focus";
import lift from "./middleware/lift";
import pendingDrop from "./middleware/pending-drop";
import responders from "./middleware/responders/responders-middleware";
import scrollListener from "./middleware/scroll-listener";
import style from "./middleware/style";
import reducer from "./reducer";
import type { Store } from "./store-types";
import { applyMiddleware, createStore, compose, StoreEnhancer } from 'redux';
import reducer from './reducer';
import lift from './middleware/lift';
import style from './middleware/style';
import drop from './middleware/drop/drop-middleware';
import scrollListener from './middleware/scroll-listener';
import responders from './middleware/responders/responders-middleware';
import dropAnimationFinish from './middleware/drop/drop-animation-finish-middleware';
import dropAnimationFlushOnScroll from './middleware/drop/drop-animation-flush-on-scroll-middleware';
import dimensionMarshalStopper from './middleware/dimension-marshal-stopper';
import focus from './middleware/focus';
import autoScroll from './middleware/auto-scroll';
import pendingDrop from './middleware/pending-drop';
import type { DimensionMarshal } from './dimension-marshal/dimension-marshal-types';
import type { FocusMarshal } from '../view/use-focus-marshal/focus-marshal-types';
import type { StyleMarshal } from '../view/use-style-marshal/style-marshal-types';
import type { AutoScroller } from './auto-scroller/auto-scroller-types';
import type { Responders, Announce } from '../types';
import type { Store } from './store-types';

@@ -41,7 +41,7 @@ // For more config

const composeEnhancers =
process.env.NODE_ENV !== "production" &&
typeof window !== "undefined" &&
process.env.NODE_ENV !== 'production' &&
typeof window !== 'undefined' &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
name: "@hello-pangea/dnd",
name: '@hello-pangea/dnd',
})

@@ -109,5 +109,5 @@ : compose;

// Fire responders for consumers (after update to store)
responders(getResponders, announce)
)
)
responders(getResponders, announce),
),
),
);

4

src/state/did-start-after-critical.ts

@@ -1,8 +0,8 @@

import type { DraggableId, LiftEffect } from "../types";
import type { DraggableId, LiftEffect } from '../types';
export default function didStartAfterCritical(
draggableId: DraggableId,
afterCritical: LiftEffect
afterCritical: LiftEffect,
): boolean {
return Boolean(afterCritical.effected[draggableId]);
}

8

src/state/dimension-marshal/dimension-marshal-types.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -8,3 +8,3 @@ CollectionStartingActionCreator,

UpdateDroppableIsCombineEnabledActionCreator,
} from "../action-creators";
} from '../action-creators';
import type {

@@ -16,3 +16,3 @@ DroppableId,

Viewport,
} from "../../types";
} from '../../types';

@@ -31,3 +31,3 @@ export interface StartPublishingResult {

id: DroppableId,
isEnabled: boolean
isEnabled: boolean,
) => void;

@@ -34,0 +34,0 @@ updateDroppableScroll: (id: DroppableId, newScroll: Position) => void;

46

src/state/dimension-marshal/dimension-marshal.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { invariant } from "../../invariant";
import type { Position } from 'css-box-model';
import { invariant } from '../../invariant';
import type {

@@ -7,6 +7,6 @@ DimensionMarshal,

StartPublishingResult,
} from "./dimension-marshal-types";
import createPublisher from "./while-dragging-publisher";
import type { WhileDraggingPublisher } from "./while-dragging-publisher";
import getInitialPublish from "./get-initial-publish";
} from './dimension-marshal-types';
import createPublisher from './while-dragging-publisher';
import type { WhileDraggingPublisher } from './while-dragging-publisher';
import getInitialPublish from './get-initial-publish';
import type {

@@ -19,3 +19,3 @@ Registry,

RegistryEvent,
} from "../registry/registry-types";
} from '../registry/registry-types';
import type {

@@ -27,4 +27,4 @@ DroppableId,

DraggableDescriptor,
} from "../../types";
import { warning } from "../../dev-warning";
} from '../../types';
import { warning } from '../../dev-warning';

@@ -39,3 +39,3 @@ interface Collection {

dragging: DraggableDescriptor,
entry: DraggableEntry
entry: DraggableEntry,
): boolean {

@@ -52,6 +52,6 @@ // do not publish updates for the critical draggable

const home: DroppableEntry = registry.droppable.getById(
entry.descriptor.droppableId
entry.descriptor.droppableId,
);
if (home.descriptor.mode !== "virtual") {
if (home.descriptor.mode !== 'virtual') {
warning(`

@@ -61,3 +61,3 @@ You are attempting to add or remove a Draggable [id: ${entry.descriptor.id}]

See https://github.com/react-forked/dnd/blob/main/docs/patterns/virtual-lists.md
See https://github.com/hello-pangea/dnd/blob/main/docs/patterns/virtual-lists.md
`);

@@ -84,3 +84,3 @@ return false;

registry.droppable.exists(id),
`Cannot update is enabled flag of Droppable ${id} as it is not registered`
`Cannot update is enabled flag of Droppable ${id} as it is not registered`,
);

@@ -101,3 +101,3 @@

id: DroppableId,
isCombineEnabled: boolean
isCombineEnabled: boolean,
) => {

@@ -111,3 +111,3 @@ // no need to update

registry.droppable.exists(id),
`Cannot update isCombineEnabled flag of Droppable ${id} as it is not registered`
`Cannot update isCombineEnabled flag of Droppable ${id} as it is not registered`,
);

@@ -126,3 +126,3 @@

registry.droppable.exists(id),
`Cannot update the scroll on Droppable ${id} as it is not registered`
`Cannot update the scroll on Droppable ${id} as it is not registered`,
);

@@ -164,3 +164,3 @@

collection,
"Should only be subscribed when a collection is occurring"
'Should only be subscribed when a collection is occurring',
);

@@ -171,3 +171,3 @@ // The dragging item can be add and removed when using a clone

if (event.type === "ADDITION") {
if (event.type === 'ADDITION') {
if (shouldPublishUpdate(registry, dragging, event.value)) {

@@ -177,3 +177,3 @@ publisher.add(event.value);

}
if (event.type === "REMOVAL") {
if (event.type === 'REMOVAL') {
if (shouldPublishUpdate(registry, dragging, event.value)) {

@@ -188,9 +188,9 @@ publisher.remove(event.value);

!collection,
"Cannot start capturing critical dimensions as there is already a collection"
'Cannot start capturing critical dimensions as there is already a collection',
);
const entry: DraggableEntry = registry.draggable.getById(
request.draggableId
request.draggableId,
);
const home: DroppableEntry = registry.droppable.getById(
entry.descriptor.droppableId
entry.descriptor.droppableId,
);

@@ -197,0 +197,0 @@

20

src/state/dimension-marshal/get-initial-publish.ts

@@ -1,4 +0,4 @@

import type { Position } from "css-box-model";
import * as timings from "../../debug/timings";
import type { StartPublishingResult } from "./dimension-marshal-types";
import type { Position } from 'css-box-model';
import * as timings from '../../debug/timings';
import type { StartPublishingResult } from './dimension-marshal-types';
import type {

@@ -8,4 +8,4 @@ Registry,

DroppableEntry,
} from "../registry/registry-types";
import { toDraggableMap, toDroppableMap } from "../dimension-structures";
} from '../registry/registry-types';
import { toDraggableMap, toDroppableMap } from '../dimension-structures';
import type {

@@ -19,4 +19,4 @@ DroppableDescriptor,

Viewport,
} from "../../types";
import getViewport from "../../view/window/get-viewport";
} from '../../types';
import getViewport from '../../view/window/get-viewport';

@@ -34,3 +34,3 @@ interface Args {

}: Args): StartPublishingResult => {
const timingKey = "Initial collection from DOM";
const timingKey = 'Initial collection from DOM';
timings.start(timingKey);

@@ -46,3 +46,3 @@ const viewport: Viewport = getViewport();

(entry: DroppableEntry): DroppableDimension =>
entry.callbacks.getDimensionAndWatchScroll(windowScroll, scrollOptions)
entry.callbacks.getDimensionAndWatchScroll(windowScroll, scrollOptions),
);

@@ -54,3 +54,3 @@

(entry: DraggableEntry): DraggableDimension =>
entry.getDimension(windowScroll)
entry.getDimension(windowScroll),
);

@@ -57,0 +57,0 @@

18

src/state/dimension-marshal/while-dragging-publisher.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -11,3 +11,3 @@ DraggableId,

DraggableIdMap,
} from "../../types";
} from '../../types';
import type {

@@ -18,5 +18,5 @@ DroppableEntry,

DraggableEntryMap,
} from "../registry/registry-types";
import * as timings from "../../debug/timings";
import { origin } from "../position";
} from '../registry/registry-types';
import * as timings from '../../debug/timings';
import { origin } from '../position';

@@ -51,3 +51,3 @@ export interface WhileDraggingPublisher {

const timingKey = "Publish collection from DOM";
const timingKey = 'Publish collection from DOM';

@@ -77,3 +77,3 @@ export default function createPublisher({

(id: DraggableId): DraggableDimension =>
registry.draggable.getById(id).getDimension(origin)
registry.draggable.getById(id).getDimension(origin),
)

@@ -84,3 +84,3 @@ // Dimensions are not guarenteed to be ordered in the same order as keys

(a: DraggableDimension, b: DraggableDimension): number =>
a.descriptor.index - b.descriptor.index
a.descriptor.index - b.descriptor.index,
);

@@ -97,3 +97,3 @@

};
}
},
);

@@ -100,0 +100,0 @@

12

src/state/dimension-structures.ts

@@ -1,2 +0,2 @@

import memoizeOne from "memoize-one";
import memoizeOne from 'memoize-one';
import type {

@@ -7,3 +7,3 @@ DroppableDimension,

DraggableDimensionMap,
} from "../types";
} from '../types';

@@ -14,3 +14,3 @@ export const toDroppableMap = memoizeOne((droppables: DroppableDimension[]) =>

return previous;
}, {})
}, {}),
);

@@ -22,3 +22,3 @@

return previous;
}, {})
}, {}),
);

@@ -28,3 +28,3 @@

(droppables: DroppableDimensionMap): DroppableDimension[] =>
Object.values(droppables)
Object.values(droppables),
);

@@ -34,3 +34,3 @@

(draggables: DraggableDimensionMap): DraggableDimension[] =>
Object.values(draggables)
Object.values(draggables),
);

16

src/state/droppable/get-droppable.ts

@@ -1,2 +0,2 @@

import type { BoxModel, Position } from "css-box-model";
import type { BoxModel, Position } from 'css-box-model';
import type {

@@ -9,7 +9,7 @@ Axis,

ScrollSize,
} from "../../types";
import { vertical, horizontal } from "../axis";
import { origin } from "../position";
import getMaxScroll from "../get-max-scroll";
import getSubject from "./util/get-subject";
} from '../../types';
import { vertical, horizontal } from '../axis';
import { origin } from '../position';
import getMaxScroll from '../get-max-scroll';
import getSubject from './util/get-subject';

@@ -29,3 +29,3 @@ export interface Closest {

isFixedOnPage: boolean;
direction: "vertical" | "horizontal";
direction: 'vertical' | 'horizontal';
client: BoxModel;

@@ -80,3 +80,3 @@ // is null when in a fixed container

const axis: Axis = direction === "vertical" ? vertical : horizontal;
const axis: Axis = direction === 'vertical' ? vertical : horizontal;

@@ -83,0 +83,0 @@ const subject: DroppableSubject = getSubject({

4

src/state/droppable/is-home-of.ts

@@ -1,6 +0,6 @@

import type { DraggableDimension, DroppableDimension } from "../../types";
import type { DraggableDimension, DroppableDimension } from '../../types';
export default (
draggable: DraggableDimension,
destination: DroppableDimension
destination: DroppableDimension,
): boolean => draggable.descriptor.droppableId === destination.descriptor.id;

12

src/state/droppable/scroll-droppable.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { invariant } from "../../invariant";
import type { Position } from 'css-box-model';
import { invariant } from '../../invariant';
import type {

@@ -7,9 +7,9 @@ DroppableDimension,

DroppableSubject,
} from "../../types";
import { negate, subtract } from "../position";
import getSubject from "./util/get-subject";
} from '../../types';
import { negate, subtract } from '../position';
import getSubject from './util/get-subject';
export default (
droppable: DroppableDimension,
newScroll: Position
newScroll: Position,
): DroppableDimension => {

@@ -16,0 +16,0 @@ invariant(droppable.frame);

4

src/state/droppable/should-use-placeholder.ts

@@ -1,3 +0,3 @@

import type { DraggableDescriptor, DragImpact } from "../../types";
import whatIsDraggedOver from "./what-is-dragged-over";
import type { DraggableDescriptor, DragImpact } from '../../types';
import whatIsDraggedOver from './what-is-dragged-over';

@@ -4,0 +4,0 @@ // use placeholder if dragged over

4

src/state/droppable/util/clip.ts

@@ -1,4 +0,4 @@

import { getRect } from "css-box-model";
import { getRect } from 'css-box-model';
import type { Rect, Spacing } from "css-box-model";
import type { Rect, Spacing } from 'css-box-model';

@@ -5,0 +5,0 @@ export default (frame: Spacing, subject: Spacing): Rect | null => {

12

src/state/droppable/util/get-subject.ts

@@ -1,3 +0,3 @@

import { getRect } from "css-box-model";
import type { Rect, Spacing, BoxModel } from "css-box-model";
import { getRect } from 'css-box-model';
import type { Rect, Spacing, BoxModel } from 'css-box-model';
import type {

@@ -8,5 +8,5 @@ Axis,

PlaceholderInSubject,
} from "../../../types";
import executeClip from "./clip";
import { offsetByPosition } from "../../spacing";
} from '../../../types';
import executeClip from './clip';
import { offsetByPosition } from '../../spacing';

@@ -24,3 +24,3 @@ const scroll = (target: Spacing, frame?: Scrollable | null): Spacing => {

axis: Axis,
withPlaceholder?: PlaceholderInSubject | null
withPlaceholder?: PlaceholderInSubject | null,
): Spacing => {

@@ -27,0 +27,0 @@ if (withPlaceholder && withPlaceholder.increasedBy) {

2

src/state/droppable/what-is-dragged-over-from-result.ts

@@ -1,2 +0,2 @@

import type { DroppableId, DropResult } from "../../types";
import type { DroppableId, DropResult } from '../../types';

@@ -3,0 +3,0 @@ export default (result: DropResult): DroppableId | null => {

4

src/state/droppable/what-is-dragged-over.ts

@@ -1,2 +0,2 @@

import type { ImpactLocation, DroppableId, DragImpact } from "../../types";
import type { ImpactLocation, DroppableId, DragImpact } from '../../types';

@@ -10,3 +10,3 @@ export default (impact: DragImpact): DroppableId | null => {

if (at.type === "REORDER") {
if (at.type === 'REORDER') {
return at.destination.droppableId;

@@ -13,0 +13,0 @@ }

40

src/state/droppable/with-placeholder.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { invariant } from "../../invariant";
import type { Position } from 'css-box-model';
import { invariant } from '../../invariant';
import type {

@@ -11,8 +11,8 @@ Axis,

PlaceholderInSubject,
} from "../../types";
import getDraggablesInsideDroppable from "../get-draggables-inside-droppable";
import { add, patch } from "../position";
import getSubject from "./util/get-subject";
import isHomeOf from "./is-home-of";
import getDisplacedBy from "../get-displaced-by";
} from '../../types';
import getDraggablesInsideDroppable from '../get-draggables-inside-droppable';
import { add, patch } from '../position';
import getSubject from './util/get-subject';
import isHomeOf from './is-home-of';
import getDisplacedBy from '../get-displaced-by';

@@ -22,3 +22,3 @@ const getRequiredGrowthForPlaceholder = (

placeholderSize: Position,
draggables: DraggableDimensionMap
draggables: DraggableDimensionMap,
): Position | null => {

@@ -29,3 +29,3 @@ const axis: Axis = droppable.axis;

// so counting them does not help.
if (droppable.descriptor.mode === "virtual") {
if (droppable.descriptor.mode === 'virtual') {
return patch(axis.line, placeholderSize[axis.line]);

@@ -39,3 +39,3 @@ }

droppable.descriptor.id,
draggables
draggables,
);

@@ -45,3 +45,3 @@ const spaceUsed: number = insideDroppable.reduce(

sum + dimension.client.marginBox[axis.size],
0
0,
);

@@ -71,3 +71,3 @@ const requiredSpace: number = spaceUsed + placeholderSize[axis.line];

draggable: DraggableDimension,
draggables: DraggableDimensionMap
draggables: DraggableDimensionMap,
): DroppableDimension => {

@@ -78,3 +78,3 @@ const frame: Scrollable | null = droppable.frame;

!isHomeOf(draggable, droppable),
"Should not add placeholder space to home list"
'Should not add placeholder space to home list',
);

@@ -84,3 +84,3 @@

!droppable.subject.withPlaceholder,
"Cannot add placeholder size to a subject when it already has one"
'Cannot add placeholder size to a subject when it already has one',
);

@@ -90,3 +90,3 @@

droppable.axis,
draggable.displaceBy
draggable.displaceBy,
).point;

@@ -97,3 +97,3 @@

placeholderSize,
draggables
draggables,
);

@@ -140,3 +140,3 @@

export const removePlaceholder = (
droppable: DroppableDimension
droppable: DroppableDimension,
): DroppableDimension => {

@@ -146,3 +146,3 @@ const added: PlaceholderInSubject | null = droppable.subject.withPlaceholder;

added,
"Cannot remove placeholder form subject when there was none"
'Cannot remove placeholder form subject when there was none',
);

@@ -169,3 +169,3 @@

oldMaxScroll,
"Expected droppable with frame to have old max frame scroll when removing placeholder"
'Expected droppable with frame to have old max frame scroll when removing placeholder',
);

@@ -172,0 +172,0 @@

12

src/state/get-center-from-impact/get-client-border-box-center/get-client-from-page-border-box-center.ts

@@ -1,5 +0,5 @@

import type { Position } from "css-box-model";
import type { Viewport, DraggableDimension } from "../../../types";
import { add, subtract } from "../../position";
import withViewportDisplacement from "../../with-scroll-change/with-viewport-displacement";
import type { Position } from 'css-box-model';
import type { Viewport, DraggableDimension } from '../../../types';
import { add, subtract } from '../../position';
import withViewportDisplacement from '../../with-scroll-change/with-viewport-displacement';

@@ -19,3 +19,3 @@ interface Args {

viewport,
pageBorderBoxCenter
pageBorderBoxCenter,
);

@@ -25,3 +25,3 @@

withoutPageScrollChange,
draggable.page.borderBox.center
draggable.page.borderBox.center,
);

@@ -28,0 +28,0 @@

8

src/state/get-center-from-impact/get-client-border-box-center/index.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -9,5 +9,5 @@ DroppableDimension,

LiftEffect,
} from "../../../types";
import getPageBorderBoxCenterFromImpact from "../get-page-border-box-center";
import getClientFromPageBorderBoxCenter from "./get-client-from-page-border-box-center";
} from '../../../types';
import getPageBorderBoxCenterFromImpact from '../get-page-border-box-center';
import getClientFromPageBorderBoxCenter from './get-client-from-page-border-box-center';

@@ -14,0 +14,0 @@ interface Args {

12

src/state/get-center-from-impact/get-page-border-box-center/index.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -9,6 +9,6 @@ DragImpact,

LiftEffect,
} from "../../../types";
import whenCombining from "./when-combining";
import whenReordering from "./when-reordering";
import withDroppableDisplacement from "../../with-scroll-change/with-droppable-displacement";
} from '../../../types';
import whenCombining from './when-combining';
import whenReordering from './when-reordering';
import withDroppableDisplacement from '../../with-scroll-change/with-droppable-displacement';

@@ -41,3 +41,3 @@ interface Args {

if (at.type === "REORDER") {
if (at.type === 'REORDER') {
return whenReordering({

@@ -44,0 +44,0 @@ impact,

12

src/state/get-center-from-impact/get-page-border-box-center/when-combining.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { invariant } from "../../../invariant";
import type { Position } from 'css-box-model';
import { invariant } from '../../../invariant';
import type {

@@ -9,6 +9,6 @@ DraggableDimensionMap,

DragImpact,
} from "../../../types";
import { add } from "../../position";
import getCombinedItemDisplacement from "../../get-combined-item-displacement";
import { tryGetCombine } from "../../get-impact-location";
} from '../../../types';
import { add } from '../../position';
import getCombinedItemDisplacement from '../../get-combined-item-displacement';
import { tryGetCombine } from '../../get-impact-location';

@@ -15,0 +15,0 @@ interface Args {

18

src/state/get-center-from-impact/get-page-border-box-center/when-reordering.ts

@@ -1,3 +0,3 @@

import { offset } from "css-box-model";
import type { Position, BoxModel } from "css-box-model";
import { offset } from 'css-box-model';
import type { Position, BoxModel } from 'css-box-model';
import type {

@@ -11,7 +11,7 @@ Axis,

LiftEffect,
} from "../../../types";
import { goBefore, goAfter, goIntoStart } from "../move-relative-to";
import getDraggablesInsideDroppable from "../../get-draggables-inside-droppable";
import { negate } from "../../position";
import didStartAfterCritical from "../../did-start-after-critical";
} from '../../../types';
import { goBefore, goAfter, goIntoStart } from '../move-relative-to';
import getDraggablesInsideDroppable from '../../get-draggables-inside-droppable';
import { negate } from '../../position';
import didStartAfterCritical from '../../did-start-after-critical';

@@ -37,3 +37,3 @@ interface NewHomeArgs {

droppable.descriptor.id,
draggables
draggables,
);

@@ -99,3 +99,3 @@

last.page,
negate(afterCritical.displacedBy.point)
negate(afterCritical.displacedBy.point),
);

@@ -102,0 +102,0 @@ return goAfter({

16

src/state/get-center-from-impact/move-relative-to.ts

@@ -1,4 +0,4 @@

import type { Position, BoxModel, Rect } from "css-box-model";
import { patch } from "../position";
import type { Axis } from "../../types";
import type { Position, BoxModel, Rect } from 'css-box-model';
import { patch } from '../position';
import type { Axis } from '../../types';

@@ -13,3 +13,3 @@ interface Args {

axis: Axis,
box: BoxModel
box: BoxModel,
): number => box.margin[axis.start] + box.borderBox[axis.size] / 2;

@@ -26,3 +26,3 @@

target: Rect,
isMoving: BoxModel
isMoving: BoxModel,
): number =>

@@ -39,3 +39,3 @@ target[axis.crossAxisStart] +

distanceFromStartToBorderBoxCenter(axis, isMoving),
getCrossAxisBorderBoxCenter(axis, moveRelativeTo.marginBox, isMoving)
getCrossAxisBorderBoxCenter(axis, moveRelativeTo.marginBox, isMoving),
);

@@ -49,3 +49,3 @@

distanceFromEndToBorderBoxCenter(axis, isMoving),
getCrossAxisBorderBoxCenter(axis, moveRelativeTo.marginBox, isMoving)
getCrossAxisBorderBoxCenter(axis, moveRelativeTo.marginBox, isMoving),
);

@@ -69,3 +69,3 @@

distanceFromStartToBorderBoxCenter(axis, isMoving),
getCrossAxisBorderBoxCenter(axis, moveInto.contentBox, isMoving)
getCrossAxisBorderBoxCenter(axis, moveInto.contentBox, isMoving),
);

10

src/state/get-combined-item-displacement.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -7,5 +7,5 @@ DisplacementGroups,

DisplacedBy,
} from "../types";
import { origin, negate } from "./position";
import didStartAfterCritical from "./did-start-after-critical";
} from '../types';
import { origin, negate } from './position';
import didStartAfterCritical from './did-start-after-critical';

@@ -26,3 +26,3 @@ interface Args {

const isDisplaced = Boolean(
displaced.visible[combineWith] || displaced.invisible[combineWith]
displaced.visible[combineWith] || displaced.invisible[combineWith],
);

@@ -29,0 +29,0 @@

10

src/state/get-displaced-by.ts

@@ -1,5 +0,5 @@

import memoizeOne from "memoize-one";
import type { Position } from "css-box-model";
import type { Axis, DisplacedBy } from "../types";
import { patch } from "./position";
import memoizeOne from 'memoize-one';
import type { Position } from 'css-box-model';
import type { Axis, DisplacedBy } from '../types';
import { patch } from './position';

@@ -9,3 +9,3 @@ // TODO: memoization needed?

axis: Axis,
displaceBy: Position
displaceBy: Position,
): DisplacedBy {

@@ -12,0 +12,0 @@ const displacement: number = displaceBy[axis.line];

20

src/state/get-displacement-groups.ts

@@ -1,3 +0,3 @@

import { expand, getRect } from "css-box-model";
import type { Rect, Spacing } from "css-box-model";
import { expand, getRect } from 'css-box-model';
import type { Rect, Spacing } from 'css-box-model';
import type {

@@ -10,4 +10,4 @@ DraggableId,

DisplacedBy,
} from "../types";
import { isPartiallyVisible } from "./visibility/is-visible";
} from '../types';
import { isPartiallyVisible } from './visibility/is-visible';

@@ -26,6 +26,6 @@ interface Args {

last?: DisplacementGroups | null,
forceShouldAnimate?: boolean | null
forceShouldAnimate?: boolean | null,
) => {
// Use a forced value if provided
if (typeof forceShouldAnimate === "boolean") {
if (typeof forceShouldAnimate === 'boolean') {
return forceShouldAnimate;

@@ -57,3 +57,3 @@ }

draggable: DraggableDimension,
displacedBy: DisplacedBy
displacedBy: DisplacedBy,
): Rect {

@@ -92,3 +92,3 @@ const marginBox: Rect = draggable.page.marginBox;

groups: DisplacementGroups,
draggable: DraggableDimension
draggable: DraggableDimension,
): DisplacementGroups {

@@ -117,3 +117,3 @@ const target: Rect = getTarget(draggable, displacedBy);

last,
forceShouldAnimate
forceShouldAnimate,
);

@@ -133,4 +133,4 @@

invisible: {},
}
},
);
}

20

src/state/get-drag-impact/get-combine-impact.ts

@@ -1,2 +0,2 @@

import type { Rect } from "css-box-model";
import type { Rect } from 'css-box-model';
import type {

@@ -10,7 +10,7 @@ DraggableId,

DisplacedBy,
} from "../../types";
import getDidStartAfterCritical from "../did-start-after-critical";
import getDisplacedBy from "../get-displaced-by";
import getIsDisplaced from "../get-is-displaced";
import removeDraggableFromList from "../remove-draggable-from-list";
} from '../../types';
import getDidStartAfterCritical from '../did-start-after-critical';
import getDisplacedBy from '../get-displaced-by';
import getIsDisplaced from '../get-is-displaced';
import removeDraggableFromList from '../remove-draggable-from-list';

@@ -43,3 +43,3 @@ interface Args {

destination.axis,
draggable.displaceBy
draggable.displaceBy,
);

@@ -53,3 +53,3 @@ const displacement: number = displacedBy.value;

draggable,
insideDestination
insideDestination,
);

@@ -65,3 +65,3 @@

id,
afterCritical
afterCritical,
);

@@ -121,3 +121,3 @@

at: {
type: "COMBINE",
type: 'COMBINE',
combine: {

@@ -124,0 +124,0 @@ draggableId: combineWith.descriptor.id,

22

src/state/get-drag-impact/get-reorder-impact.ts

@@ -1,2 +0,2 @@

import type { Rect } from "css-box-model";
import type { Rect } from 'css-box-model';
import type {

@@ -12,9 +12,9 @@ DraggableId,

LiftEffect,
} from "../../types";
import getDisplacedBy from "../get-displaced-by";
import removeDraggableFromList from "../remove-draggable-from-list";
import isHomeOf from "../droppable/is-home-of";
import getDidStartAfterCritical from "../did-start-after-critical";
import calculateReorderImpact from "../calculate-drag-impact/calculate-reorder-impact";
import getIsDisplaced from "../get-is-displaced";
} from '../../types';
import getDisplacedBy from '../get-displaced-by';
import removeDraggableFromList from '../remove-draggable-from-list';
import isHomeOf from '../droppable/is-home-of';
import getDidStartAfterCritical from '../did-start-after-critical';
import calculateReorderImpact from '../calculate-drag-impact/calculate-reorder-impact';
import getIsDisplaced from '../get-is-displaced';

@@ -69,3 +69,3 @@ interface Args {

destination.axis,
draggable.displaceBy
draggable.displaceBy,
);

@@ -79,3 +79,3 @@ const displacement: number = displacedBy.value;

draggable,
insideDestination
insideDestination,
);

@@ -90,3 +90,3 @@

id,
afterCritical
afterCritical,
);

@@ -93,0 +93,0 @@

24

src/state/get-drag-impact/index.ts

@@ -1,2 +0,2 @@

import type { Position, Rect } from "css-box-model";
import type { Position, Rect } from 'css-box-model';
import type {

@@ -11,10 +11,10 @@ DroppableId,

LiftEffect,
} from "../../types";
import getDroppableOver from "../get-droppable-over";
import getDraggablesInsideDroppable from "../get-draggables-inside-droppable";
import withDroppableScroll from "../with-scroll-change/with-droppable-scroll";
import getReorderImpact from "./get-reorder-impact";
import getCombineImpact from "./get-combine-impact";
import noImpact from "../no-impact";
import { offsetRectByPosition } from "../rect";
} from '../../types';
import getDroppableOver from '../get-droppable-over';
import getDraggablesInsideDroppable from '../get-draggables-inside-droppable';
import withDroppableScroll from '../with-scroll-change/with-droppable-scroll';
import getReorderImpact from './get-reorder-impact';
import getCombineImpact from './get-combine-impact';
import noImpact from '../no-impact';
import { offsetRectByPosition } from '../rect';

@@ -43,3 +43,3 @@ interface Args {

draggable.page.borderBox,
pageOffset
pageOffset,
);

@@ -64,3 +64,3 @@

destination.descriptor.id,
draggables
draggables,
);

@@ -72,3 +72,3 @@

destination,
pageBorderBox
pageBorderBox,
);

@@ -75,0 +75,0 @@

14

src/state/get-draggables-inside-droppable.ts

@@ -1,3 +0,3 @@

import memoizeOne from "memoize-one";
import { toDraggableList } from "./dimension-structures";
import memoizeOne from 'memoize-one';
import { toDraggableList } from './dimension-structures';
import type {

@@ -7,3 +7,3 @@ DraggableDimension,

DraggableDimensionMap,
} from "../types";
} from '../types';

@@ -15,3 +15,3 @@ export default memoizeOne(

droppableId: DroppableId,
draggables: DraggableDimensionMap
draggables: DraggableDimensionMap,
): DraggableDimension[] => {

@@ -21,3 +21,3 @@ const result = toDraggableList(draggables)

(draggable: DraggableDimension): boolean =>
droppableId === draggable.descriptor.droppableId
droppableId === draggable.descriptor.droppableId,
)

@@ -28,7 +28,7 @@ // Dimensions are not guarenteed to be ordered in the same order as keys

(a: DraggableDimension, b: DraggableDimension): number =>
a.descriptor.index - b.descriptor.index
a.descriptor.index - b.descriptor.index,
);
return result;
}
},
);

18

src/state/get-droppable-over.ts

@@ -1,2 +0,2 @@

import type { Position, Rect } from "css-box-model";
import type { Position, Rect } from 'css-box-model';
import type {

@@ -8,7 +8,7 @@ DroppableDimension,

Axis,
} from "../types";
import { toDroppableList } from "./dimension-structures";
import isPositionInFrame from "./visibility/is-position-in-frame";
import { distance, patch } from "./position";
import isWithin from "./is-within";
} from '../types';
import { toDroppableList } from './dimension-structures';
import isPositionInFrame from './visibility/is-position-in-frame';
import { distance, patch } from './position';
import isWithin from './is-within';

@@ -64,3 +64,3 @@ // https://stackoverflow.com/questions/306316/determine-if-two-rectangles-overlap-each-other

// use the center of the list on the cross axis
candidate.page.borderBox.center[axis.crossAxisLine]
candidate.page.borderBox.center[axis.crossAxisLine],
);

@@ -119,3 +119,3 @@

active[axis.crossAxisStart],
active[axis.crossAxisEnd]
active[axis.crossAxisEnd],
);

@@ -140,3 +140,3 @@

return crossAxisEnd > childCenter;
}
},
);

@@ -143,0 +143,0 @@

6

src/state/get-frame.ts

@@ -1,9 +0,9 @@

import { invariant } from "../invariant";
import { invariant } from '../invariant';
import type { DroppableDimension, Scrollable } from "../types";
import type { DroppableDimension, Scrollable } from '../types';
export default (droppable: DroppableDimension): Scrollable => {
const frame: Scrollable | null = droppable.frame;
invariant(frame, "Expected Droppable to have a frame");
invariant(frame, 'Expected Droppable to have a frame');
return frame;
};

2

src/state/get-home-location.ts

@@ -1,2 +0,2 @@

import type { DraggableDescriptor, DraggableLocation } from "../types";
import type { DraggableDescriptor, DraggableLocation } from '../types';

@@ -3,0 +3,0 @@ export default (descriptor: DraggableDescriptor): DraggableLocation => ({

8

src/state/get-impact-location.ts

@@ -1,7 +0,7 @@

import type { DragImpact, DraggableLocation, Combine } from "../types";
import type { DragImpact, DraggableLocation, Combine } from '../types';
export function tryGetDestination(
impact: DragImpact
impact: DragImpact,
): DraggableLocation | null {
if (impact.at && impact.at.type === "REORDER") {
if (impact.at && impact.at.type === 'REORDER') {
return impact.at.destination;

@@ -13,3 +13,3 @@ }

export function tryGetCombine(impact: DragImpact): Combine | null {
if (impact.at && impact.at.type === "COMBINE") {
if (impact.at && impact.at.type === 'COMBINE') {
return impact.at.combine;

@@ -16,0 +16,0 @@ }

2

src/state/get-is-displaced.ts

@@ -1,2 +0,2 @@

import type { DisplacementGroups, DraggableId } from "../types";
import type { DisplacementGroups, DraggableId } from '../types';

@@ -3,0 +3,0 @@ interface Args {

24

src/state/get-lift-effect.ts

@@ -1,3 +0,3 @@

import { invariant } from "../invariant";
import getHomeLocation from "./get-home-location";
import { invariant } from '../invariant';
import getHomeLocation from './get-home-location';
import type {

@@ -13,6 +13,6 @@ DraggableDimension,

LiftEffect,
} from "../types";
import getDraggablesInsideDroppable from "./get-draggables-inside-droppable";
import getDisplacedBy from "./get-displaced-by";
import getDisplacementGroups from "./get-displacement-groups";
} from '../types';
import getDraggablesInsideDroppable from './get-draggables-inside-droppable';
import getDisplacedBy from './get-displaced-by';
import getDisplacementGroups from './get-displacement-groups';

@@ -34,3 +34,3 @@ interface Args {

home.axis,
draggable.displaceBy
draggable.displaceBy,
);

@@ -40,3 +40,3 @@

home.descriptor.id,
draggables
draggables,
);

@@ -47,3 +47,3 @@

const rawIndex: number = insideHome.indexOf(draggable);
invariant(rawIndex !== -1, "Expected draggable to be inside home list");
invariant(rawIndex !== -1, 'Expected draggable to be inside home list');

@@ -56,6 +56,6 @@ const afterDragging: DraggableDimension[] = insideHome.slice(rawIndex + 1);

},
{}
{},
);
const afterCritical: LiftEffect = {
inVirtualList: home.descriptor.mode === "virtual",
inVirtualList: home.descriptor.mode === 'virtual',
displacedBy,

@@ -81,3 +81,3 @@ effected,

at: {
type: "REORDER",
type: 'REORDER',
destination: getHomeLocation(draggable.descriptor),

@@ -84,0 +84,0 @@ },

6

src/state/get-max-scroll.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { subtract } from "./position";
import type { Position } from 'css-box-model';
import { subtract } from './position';

@@ -21,3 +21,3 @@ interface Args {

// viewport size
{ x: width, y: height }
{ x: width, y: height },
);

@@ -24,0 +24,0 @@

6

src/state/is-dragging.ts

@@ -6,8 +6,8 @@ import type {

DropPendingState,
} from "../types";
} from '../types';
export default function isDragging(
state: State
state: State,
): state is DraggingState | CollectingState | DropPendingState {
if (state.phase === "IDLE" || state.phase === "DROP_ANIMATING") {
if (state.phase === 'IDLE' || state.phase === 'DROP_ANIMATING') {
return false;

@@ -14,0 +14,0 @@ }

6

src/state/is-movement-allowed.ts

@@ -1,7 +0,7 @@

import type { State, StateWhenUpdatesAllowed } from "../types";
import type { State, StateWhenUpdatesAllowed } from '../types';
// Using function declaration as arrow function does not play well with the %checks syntax
export default function isMovementAllowed(
state: State
state: State,
): state is StateWhenUpdatesAllowed {
return state.phase === "DRAGGING" || state.phase === "COLLECTING";
return state.phase === 'DRAGGING' || state.phase === 'COLLECTING';
}

2

src/state/is-within.ts

@@ -5,5 +5,5 @@ // is a value between two other values

lowerBound: number,
upperBound: number
upperBound: number,
): ((a: number) => boolean) =>
(value: number): boolean =>
lowerBound <= value && value <= upperBound;

22

src/state/middleware/auto-scroll.ts

@@ -1,3 +0,3 @@

import { invariant } from "../../invariant";
import type { AutoScroller } from "../auto-scroller/auto-scroller-types";
import { invariant } from '../../invariant';
import type { AutoScroller } from '../auto-scroller/auto-scroller-types';
import type {

@@ -9,11 +9,11 @@ Action,

FlushAction,
} from "../store-types";
import type { State } from "../../types";
} from '../store-types';
import type { State } from '../../types';
const shouldStop = (
action: Action
action: Action,
): action is DropCompleteAction | DropAnimateAction | FlushAction =>
action.type === "DROP_COMPLETE" ||
action.type === "DROP_ANIMATE" ||
action.type === "FLUSH";
action.type === 'DROP_COMPLETE' ||
action.type === 'DROP_ANIMATE' ||
action.type === 'FLUSH';

@@ -30,3 +30,3 @@ export default (autoScroller: AutoScroller): Middleware =>

if (action.type === "INITIAL_PUBLISH") {
if (action.type === 'INITIAL_PUBLISH') {
// letting the action go first to hydrate the state

@@ -36,4 +36,4 @@ next(action);

invariant(
state.phase === "DRAGGING",
"Expected phase to be DRAGGING after INITIAL_PUBLISH"
state.phase === 'DRAGGING',
'Expected phase to be DRAGGING after INITIAL_PUBLISH',
);

@@ -40,0 +40,0 @@ autoScroller.start(state);

10

src/state/middleware/dimension-marshal-stopper.ts

@@ -1,3 +0,3 @@

import type { Action, Dispatch } from "../store-types";
import type { DimensionMarshal } from "../dimension-marshal/dimension-marshal-types";
import type { Action, Dispatch } from '../store-types';
import type { DimensionMarshal } from '../dimension-marshal/dimension-marshal-types';

@@ -11,6 +11,6 @@ export default (marshal: DimensionMarshal) =>

// drag is finished
action.type === "DROP_COMPLETE" ||
action.type === "FLUSH" ||
action.type === 'DROP_COMPLETE' ||
action.type === 'FLUSH' ||
// no longer accepting changes once the drop has started
action.type === "DROP_ANIMATE"
action.type === 'DROP_ANIMATE'
) {

@@ -17,0 +17,0 @@ marshal.stopPublishing();

14

src/state/middleware/drop/drop-animation-finish-middleware.ts

@@ -1,9 +0,9 @@

import { invariant } from "../../../invariant";
import { completeDrop } from "../../action-creators";
import type { State } from "../../../types";
import type { Middleware } from "../../store-types";
import { invariant } from '../../../invariant';
import { completeDrop } from '../../action-creators';
import type { State } from '../../../types';
import type { Middleware } from '../../store-types';
const dropAnimationFinishMiddleware: Middleware =
(store) => (next) => (action) => {
if (action.type !== "DROP_ANIMATION_FINISHED") {
if (action.type !== 'DROP_ANIMATION_FINISHED') {
next(action);

@@ -15,4 +15,4 @@ return;

invariant(
state.phase === "DROP_ANIMATING",
"Cannot finish a drop animating when no drop is occurring"
state.phase === 'DROP_ANIMATING',
'Cannot finish a drop animating when no drop is occurring',
);

@@ -19,0 +19,0 @@ store.dispatch(completeDrop({ completed: state.completed }));

22

src/state/middleware/drop/drop-animation-flush-on-scroll-middleware.ts

@@ -1,6 +0,6 @@

import { dropAnimationFinished } from "../../action-creators";
import type { State } from "../../../types";
import type { Middleware } from "../../store-types";
import type { EventBinding } from "../../../view/event-bindings/event-types";
import bindEvents from "../../../view/event-bindings/bind-events";
import { dropAnimationFinished } from '../../action-creators';
import type { State } from '../../../types';
import type { Middleware } from '../../store-types';
import type { EventBinding } from '../../../view/event-bindings/event-types';
import bindEvents from '../../../view/event-bindings/bind-events';

@@ -25,5 +25,5 @@ const dropAnimationFlushOnScrollMiddleware: Middleware = (store) => {

if (
action.type === "FLUSH" ||
action.type === "DROP_COMPLETE" ||
action.type === "DROP_ANIMATION_FINISHED"
action.type === 'FLUSH' ||
action.type === 'DROP_COMPLETE' ||
action.type === 'DROP_ANIMATION_FINISHED'
) {

@@ -35,3 +35,3 @@ clear();

if (action.type !== "DROP_ANIMATE") {
if (action.type !== 'DROP_ANIMATE') {
return;

@@ -41,3 +41,3 @@ }

const binding: EventBinding = {
eventName: "scroll",
eventName: 'scroll',
// capture: true will catch all scroll events, event from scroll containers

@@ -48,3 +48,3 @@ // once: just in case, we only want to ever fire one

const state: State = store.getState();
if (state.phase === "DROP_ANIMATING") {
if (state.phase === 'DROP_ANIMATING') {
store.dispatch(dropAnimationFinished());

@@ -51,0 +51,0 @@ }

38

src/state/middleware/drop/drop-middleware.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { invariant } from "../../../invariant";
import type { Position } from 'css-box-model';
import { invariant } from '../../../invariant';
import type {

@@ -13,12 +13,12 @@ State,

DraggableDimension,
} from "../../../types";
import type { Middleware } from "../../store-types";
import { animateDrop, completeDrop, dropPending } from "../../action-creators";
import type { AnimateDropArgs } from "../../action-creators";
import { isEqual } from "../../position";
import getDropDuration from "./get-drop-duration";
import getNewHomeClientOffset from "./get-new-home-client-offset";
import getDropImpact from "./get-drop-impact";
import type { Result } from "./get-drop-impact";
import { tryGetCombine, tryGetDestination } from "../../get-impact-location";
} from '../../../types';
import type { Middleware } from '../../store-types';
import { animateDrop, completeDrop, dropPending } from '../../action-creators';
import type { AnimateDropArgs } from '../../action-creators';
import { isEqual } from '../../position';
import getDropDuration from './get-drop-duration';
import getNewHomeClientOffset from './get-new-home-client-offset';
import getDropImpact from './get-drop-impact';
import type { Result } from './get-drop-impact';
import { tryGetCombine, tryGetDestination } from '../../get-impact-location';

@@ -29,3 +29,3 @@ const dropMiddleware: Middleware =

(action) => {
if (action.type !== "DROP") {
if (action.type !== 'DROP') {
next(action);

@@ -40,3 +40,3 @@ return;

// We are now shifting the application into the 'DROP_PENDING' phase
if (state.phase === "COLLECTING") {
if (state.phase === 'COLLECTING') {
dispatch(dropPending({ reason }));

@@ -47,3 +47,3 @@ return;

// Could have occurred in response to an error
if (state.phase === "IDLE") {
if (state.phase === 'IDLE') {
return;

@@ -55,11 +55,11 @@ }

const isWaitingForDrop: boolean =
state.phase === "DROP_PENDING" && state.isWaiting;
state.phase === 'DROP_PENDING' && state.isWaiting;
invariant(
!isWaitingForDrop,
"A DROP action occurred while DROP_PENDING and still waiting"
'A DROP action occurred while DROP_PENDING and still waiting',
);
invariant(
state.phase === "DRAGGING" || state.phase === "DROP_PENDING",
`Cannot drop in phase: ${state.phase}`
state.phase === 'DRAGGING' || state.phase === 'DROP_PENDING',
`Cannot drop in phase: ${state.phase}`,
);

@@ -66,0 +66,0 @@ // We are now in the DRAGGING or DROP_PENDING phase

10

src/state/middleware/drop/get-drop-duration.ts

@@ -1,5 +0,5 @@

import type { Position } from "css-box-model";
import { distance as getDistance } from "../../position";
import { timings } from "../../../animation";
import type { DropReason } from "../../../types";
import type { Position } from 'css-box-model';
import { distance as getDistance } from '../../position';
import { timings } from '../../../animation';
import type { DropReason } from '../../../types';

@@ -43,5 +43,5 @@ interface GetDropDurationArgs {

const withDuration: number =
reason === "CANCEL" ? duration * cancelDropModifier : duration;
reason === 'CANCEL' ? duration * cancelDropModifier : duration;
// To two decimal points by converting to string and back
return Number(withDuration.toFixed(2));
};

10

src/state/middleware/drop/get-drop-impact.ts

@@ -8,5 +8,5 @@ import type {

LiftEffect,
} from "../../../types";
import recompute from "../../update-displacement-visibility/recompute";
import { emptyGroups } from "../../no-impact";
} from '../../../types';
import recompute from '../../update-displacement-visibility/recompute';
import { emptyGroups } from '../../no-impact';

@@ -36,3 +36,3 @@ interface Args {

}: Args): Result => {
if (!lastImpact.at || reason !== "DROP") {
if (!lastImpact.at || reason !== 'DROP') {
// Dropping outside of a list or the drag was cancelled

@@ -60,3 +60,3 @@

// use the existing impact
if (lastImpact.at.type === "REORDER") {
if (lastImpact.at.type === 'REORDER') {
return {

@@ -63,0 +63,0 @@ impact: lastImpact,

12

src/state/middleware/drop/get-new-home-client-offset.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -10,6 +10,6 @@ DroppableDimension,

LiftEffect,
} from "../../../types";
import whatIsDraggedOver from "../../droppable/what-is-dragged-over";
import { subtract } from "../../position";
import getClientBorderBoxCenter from "../../get-center-from-impact/get-client-border-box-center";
} from '../../../types';
import whatIsDraggedOver from '../../droppable/what-is-dragged-over';
import { subtract } from '../../position';
import getClientBorderBoxCenter from '../../get-center-from-impact/get-client-border-box-center';

@@ -50,3 +50,3 @@ interface Args {

newClientCenter,
draggable.client.borderBox.center
draggable.client.borderBox.center,
);

@@ -53,0 +53,0 @@

2

src/state/middleware/drop/index.ts

@@ -1,1 +0,1 @@

export { default } from "./drop-middleware";
export { default } from './drop-middleware';

14

src/state/middleware/focus.ts

@@ -1,4 +0,4 @@

import type { DropResult } from "../../types";
import type { Action, Dispatch } from "../store-types";
import type { FocusMarshal } from "../../view/use-focus-marshal/focus-marshal-types";
import type { DropResult } from '../../types';
import type { Action, Dispatch } from '../store-types';
import type { FocusMarshal } from '../../view/use-focus-marshal/focus-marshal-types';

@@ -11,3 +11,3 @@ export default (marshal: FocusMarshal) => {

(action: Action): any => {
if (action.type === "INITIAL_PUBLISH") {
if (action.type === 'INITIAL_PUBLISH') {
isWatching = true;

@@ -27,3 +27,3 @@

if (action.type === "FLUSH") {
if (action.type === 'FLUSH') {
isWatching = false;

@@ -34,3 +34,3 @@ marshal.tryRestoreFocusRecorded();

if (action.type === "DROP_COMPLETE") {
if (action.type === 'DROP_COMPLETE') {
isWatching = false;

@@ -43,3 +43,3 @@ const result: DropResult = action.payload.completed.result;

result.draggableId,
result.combine.draggableId
result.combine.draggableId,
);

@@ -46,0 +46,0 @@ }

22

src/state/middleware/lift.ts

@@ -1,5 +0,5 @@

import { invariant } from "../../invariant";
import type { DimensionMarshal } from "../dimension-marshal/dimension-marshal-types";
import type { State, ScrollOptions, LiftRequest } from "../../types";
import type { Middleware } from "../store-types";
import { invariant } from '../../invariant';
import type { DimensionMarshal } from '../dimension-marshal/dimension-marshal-types';
import type { State, ScrollOptions, LiftRequest } from '../../types';
import type { Middleware } from '../store-types';
import {

@@ -10,4 +10,4 @@ completeDrop,

beforeInitialCapture,
} from "../action-creators";
import validateDimensions from "./util/validate-dimensions";
} from '../action-creators';
import validateDimensions from './util/validate-dimensions';

@@ -18,3 +18,3 @@ export default (marshal: DimensionMarshal): Middleware =>

(action) => {
if (action.type !== "LIFT") {
if (action.type !== 'LIFT') {
next(action);

@@ -30,7 +30,7 @@ return;

if (initial.phase === "DROP_ANIMATING") {
if (initial.phase === 'DROP_ANIMATING') {
dispatch(completeDrop({ completed: initial.completed }));
}
invariant(getState().phase === "IDLE", "Unexpected phase to start a drag");
invariant(getState().phase === 'IDLE', 'Unexpected phase to start a drag');

@@ -47,3 +47,3 @@ // Removing any placeholders before we capture any starting dimensions

const scrollOptions: ScrollOptions = {
shouldPublishImmediately: movementMode === "SNAP",
shouldPublishImmediately: movementMode === 'SNAP',
};

@@ -67,4 +67,4 @@ const request: LiftRequest = {

viewport,
})
}),
);
};

12

src/state/middleware/pending-drop.ts

@@ -1,4 +0,4 @@

import { drop } from "../action-creators";
import type { State } from "../../types";
import type { Middleware } from "../store-types";
import { drop } from '../action-creators';
import type { State } from '../../types';
import type { Middleware } from '../store-types';

@@ -9,3 +9,3 @@ const pendingDrop: Middleware = (store) => (next) => (action) => {

if (action.type !== "PUBLISH_WHILE_DRAGGING") {
if (action.type !== 'PUBLISH_WHILE_DRAGGING') {
return;

@@ -21,3 +21,3 @@ }

// no pending drop after the publish
if (postActionState.phase !== "DROP_PENDING") {
if (postActionState.phase !== 'DROP_PENDING') {
return;

@@ -34,3 +34,3 @@ }

reason: postActionState.reason,
})
}),
);

@@ -37,0 +37,0 @@ };

6

src/state/middleware/responders/async-marshal.ts

@@ -1,2 +0,2 @@

import { invariant } from "../../../invariant";
import { invariant } from '../../../invariant';

@@ -18,5 +18,5 @@ interface Entry {

const index: number = entries.findIndex(
(item): boolean => item.timerId === timerId
(item): boolean => item.timerId === timerId,
);
invariant(index !== -1, "Could not find timer");
invariant(index !== -1, 'Could not find timer');
// delete in place

@@ -23,0 +23,0 @@ const [entry] = entries.splice(index, 1);

6

src/state/middleware/responders/expiring-announce.ts

@@ -1,3 +0,3 @@

import type { Announce } from "../../../types";
import { warning } from "../../../dev-warning";
import type { Announce } from '../../../types';
import { warning } from '../../../dev-warning';

@@ -19,3 +19,3 @@ export type ExpiringAnnounce = Announce & {

if (wasCalled) {
warning("Announcement already made. Not making a second announcement");
warning('Announcement already made. Not making a second announcement');

@@ -22,0 +22,0 @@ return;

2

src/state/middleware/responders/index.ts

@@ -1,1 +0,1 @@

export { default } from "./responders-middleware";
export { default } from './responders-middleware';

6

src/state/middleware/responders/is-equal.ts

@@ -1,6 +0,6 @@

import type { Critical, DraggableLocation, Combine } from "../../../types";
import type { Critical, DraggableLocation, Combine } from '../../../types';
export const areLocationsEqual = (
first?: DraggableLocation | null,
second?: DraggableLocation | null
second?: DraggableLocation | null,
): boolean => {

@@ -25,3 +25,3 @@ // if both are null - we are equal

first?: Combine | null,
second?: Combine | null
second?: Combine | null,
): boolean => {

@@ -28,0 +28,0 @@ // if both are null - we are equal

66

src/state/middleware/responders/publisher.ts

@@ -1,8 +0,8 @@

import { invariant } from "../../../invariant";
import messagePreset from "../../../screen-reader-message-preset";
import * as timings from "../../../debug/timings";
import getExpiringAnnounce from "./expiring-announce";
import type { ExpiringAnnounce } from "./expiring-announce";
import getAsyncMarshal from "./async-marshal";
import type { AsyncMarshal } from "./async-marshal";
import { invariant } from '../../../invariant';
import messagePreset from '../../../screen-reader-message-preset';
import * as timings from '../../../debug/timings';
import getExpiringAnnounce from './expiring-announce';
import type { ExpiringAnnounce } from './expiring-announce';
import getAsyncMarshal from './async-marshal';
import type { AsyncMarshal } from './async-marshal';
import type {

@@ -24,5 +24,5 @@ DropResult,

OnBeforeDragStartResponder,
} from "../../../types";
import { isCombineEqual, isCriticalEqual, areLocationsEqual } from "./is-equal";
import { tryGetDestination, tryGetCombine } from "../../get-impact-location";
} from '../../../types';
import { isCombineEqual, isCriticalEqual, areLocationsEqual } from './is-equal';
import { tryGetDestination, tryGetCombine } from '../../get-impact-location';

@@ -51,7 +51,7 @@ const withTimings = (key: string, fn: () => void) => {

data: TData,
provided: ResponderProvided
provided: ResponderProvided,
) => unknown;
type GetDefaultMessage<TData extends AnyResponderData> = (
data: TData
data: TData,
) => string;

@@ -64,3 +64,3 @@

// eslint-disable-next-line no-shadow
getDefaultMessage: GetDefaultMessage<TData>
getDefaultMessage: GetDefaultMessage<TData>,
) {

@@ -99,5 +99,5 @@ if (!responder) {

!dragging,
"Cannot fire onBeforeCapture as a drag start has already been published"
'Cannot fire onBeforeCapture as a drag start has already been published',
);
withTimings("onBeforeCapture", () => {
withTimings('onBeforeCapture', () => {
// No use of screen reader for this responder

@@ -119,5 +119,5 @@ const fn: OnBeforeCaptureResponder | undefined =

!dragging,
"Cannot fire onBeforeDragStart as a drag start has already been published"
'Cannot fire onBeforeDragStart as a drag start has already been published',
);
withTimings("onBeforeDragStart", () => {
withTimings('onBeforeDragStart', () => {
// No use of screen reader for this responder

@@ -135,3 +135,3 @@ const fn: OnBeforeDragStartResponder | undefined =

!dragging,
"Cannot fire onBeforeDragStart as a drag start has already been published"
'Cannot fire onBeforeDragStart as a drag start has already been published',
);

@@ -148,3 +148,3 @@ const data: DragStart = getDragStart(critical, mode);

asyncMarshal.add(() => {
withTimings("onDragStart", () =>
withTimings('onDragStart', () =>
execute(

@@ -154,4 +154,4 @@ getResponders().onDragStart,

announce,
messagePreset.onDragStart
)
messagePreset.onDragStart,
),
);

@@ -168,3 +168,3 @@ });

dragging,
"Cannot fire onDragMove when onDragStart has not been called"
'Cannot fire onDragMove when onDragStart has not been called',
);

@@ -175,3 +175,3 @@

critical,
dragging.lastCritical
dragging.lastCritical,
);

@@ -185,3 +185,3 @@ if (hasCriticalChanged) {

dragging.lastLocation,
location
location,
);

@@ -208,3 +208,3 @@ if (hasLocationChanged) {

asyncMarshal.add(() => {
withTimings("onDragUpdate", () =>
withTimings('onDragUpdate', () =>
execute(

@@ -214,4 +214,4 @@ getResponders().onDragUpdate,

announce,
messagePreset.onDragUpdate
)
messagePreset.onDragUpdate,
),
);

@@ -222,3 +222,3 @@ });

const flush = () => {
invariant(dragging, "Can only flush responders while dragging");
invariant(dragging, 'Can only flush responders while dragging');
asyncMarshal.flush();

@@ -230,3 +230,3 @@ };

dragging,
"Cannot fire onDragEnd when there is no matching onDragStart"
'Cannot fire onDragEnd when there is no matching onDragStart',
);

@@ -236,3 +236,3 @@ dragging = null;

// we also want the consumers reorder logic to be in the same render pass
withTimings("onDragEnd", () =>
withTimings('onDragEnd', () =>
execute(

@@ -242,4 +242,4 @@ getResponders().onDragEnd,

announce,
messagePreset.onDragEnd
)
messagePreset.onDragEnd,
),
);

@@ -259,3 +259,3 @@ };

destination: null,
reason: "CANCEL",
reason: 'CANCEL',
};

@@ -262,0 +262,0 @@ drop(result);

22

src/state/middleware/responders/responders-middleware.ts

@@ -1,2 +0,2 @@

import getPublisher from "./publisher";
import getPublisher from './publisher';
import type {

@@ -8,19 +8,19 @@ State,

Announce,
} from "../../../types";
import type { Middleware } from "../../store-types";
} from '../../../types';
import type { Middleware } from '../../store-types';
export default (
getResponders: () => Responders,
announce: Announce
announce: Announce,
): Middleware => {
const publisher = getPublisher(
getResponders as () => Responders,
announce as Announce
announce as Announce,
);
return (store) => (next) => (action) => {
if (action.type === "BEFORE_INITIAL_CAPTURE") {
if (action.type === 'BEFORE_INITIAL_CAPTURE') {
publisher.beforeCapture(
action.payload.draggableId,
action.payload.movementMode
action.payload.movementMode,
);

@@ -30,3 +30,3 @@ return;

if (action.type === "INITIAL_PUBLISH") {
if (action.type === 'INITIAL_PUBLISH') {
const critical: Critical = action.payload.critical;

@@ -40,3 +40,3 @@ publisher.beforeStart(critical, action.payload.movementMode);

// Drag end
if (action.type === "DROP_COMPLETE") {
if (action.type === 'DROP_COMPLETE') {
// it is important that we use the result and not the last impact

@@ -57,3 +57,3 @@ // the last impact might be different to the result for visual reasons

// we should fire a onDragEnd responder
if (action.type === "FLUSH") {
if (action.type === 'FLUSH') {
publisher.abort();

@@ -67,3 +67,3 @@ return;

const state: State = store.getState();
if (state.phase === "DRAGGING") {
if (state.phase === 'DRAGGING') {
publisher.update(state.critical, state.impact);

@@ -70,0 +70,0 @@ }

18

src/state/middleware/scroll-listener.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { moveByWindowScroll } from "../action-creators";
import type { Position } from 'css-box-model';
import { moveByWindowScroll } from '../action-creators';
import type {

@@ -9,12 +9,12 @@ Middleware,

FlushAction,
} from "../store-types";
import getScrollListener from "../../view/scroll-listener";
} from '../store-types';
import getScrollListener from '../../view/scroll-listener';
// TODO: this is taken from auto-scroll. Let's make it a util
const shouldEnd = (
action: Action
action: Action,
): action is DropAnimateAction | DropCompleteAction | FlushAction =>
action.type === "DROP_COMPLETE" ||
action.type === "DROP_ANIMATE" ||
action.type === "FLUSH";
action.type === 'DROP_COMPLETE' ||
action.type === 'DROP_ANIMATE' ||
action.type === 'FLUSH';

@@ -29,3 +29,3 @@ const scrollListener: Middleware = (store) => {

return (next) => (action) => {
if (!listener.isActive() && action.type === "INITIAL_PUBLISH") {
if (!listener.isActive() && action.type === 'INITIAL_PUBLISH') {
listener.start();

@@ -32,0 +32,0 @@ }

10

src/state/middleware/style.ts

@@ -1,3 +0,3 @@

import type { Action, Dispatch } from "../store-types";
import type { StyleMarshal } from "../../view/use-style-marshal/style-marshal-types";
import type { Action, Dispatch } from '../store-types';
import type { StyleMarshal } from '../../view/use-style-marshal/style-marshal-types';

@@ -8,7 +8,7 @@ export default (marshal: StyleMarshal) =>

(action: Action): any => {
if (action.type === "INITIAL_PUBLISH") {
if (action.type === 'INITIAL_PUBLISH') {
marshal.dragging();
}
if (action.type === "DROP_ANIMATE") {
if (action.type === 'DROP_ANIMATE') {
marshal.dropping(action.payload.completed.result.reason);

@@ -18,3 +18,3 @@ }

// this will clear any styles immediately before a reorder
if (action.type === "FLUSH" || action.type === "DROP_COMPLETE") {
if (action.type === 'FLUSH' || action.type === 'DROP_COMPLETE') {
marshal.resting();

@@ -21,0 +21,0 @@ }

16

src/state/middleware/util/validate-dimensions.ts

@@ -5,5 +5,5 @@ import type {

DraggableDimension,
} from "../../../types";
import getDraggablesInsideDroppable from "../../get-draggables-inside-droppable";
import { warning } from "../../../dev-warning";
} from '../../../types';
import getDraggablesInsideDroppable from '../../get-draggables-inside-droppable';
import { warning } from '../../../dev-warning';

@@ -21,3 +21,3 @@ interface ErrorMap {

const indexes: number[] = insideDestination.map(
(d: DraggableDimension): number => d.descriptor.index
(d: DraggableDimension): number => d.descriptor.index,
);

@@ -49,3 +49,3 @@

})
.join(", ");
.join(', ');

@@ -63,10 +63,10 @@ warning(`

critical: Critical,
dimensions: DimensionMap
dimensions: DimensionMap,
): void {
// wrapping entire block for better minification
if (process.env.NODE_ENV !== "production") {
if (process.env.NODE_ENV !== 'production') {
const insideDestination: DraggableDimension[] =
getDraggablesInsideDroppable(
critical.droppable.id,
dimensions.draggables
dimensions.draggables,
);

@@ -73,0 +73,0 @@ checkIndexes(insideDestination);

28

src/state/move-in-direction/index.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import type { PublicResult } from "./move-in-direction-types";
import type { Position } from 'css-box-model';
import type { PublicResult } from './move-in-direction-types';
import type {

@@ -11,10 +11,10 @@ DroppableId,

DragImpact,
} from "../../types";
import moveToNextPlace from "./move-to-next-place";
import moveCrossAxis from "./move-cross-axis";
import whatIsDraggedOver from "../droppable/what-is-dragged-over";
} from '../../types';
import moveToNextPlace from './move-to-next-place';
import moveCrossAxis from './move-cross-axis';
import whatIsDraggedOver from '../droppable/what-is-dragged-over';
interface Args {
state: DraggingState;
type: "MOVE_UP" | "MOVE_RIGHT" | "MOVE_DOWN" | "MOVE_LEFT";
type: 'MOVE_UP' | 'MOVE_RIGHT' | 'MOVE_DOWN' | 'MOVE_LEFT';
}

@@ -24,3 +24,3 @@

impact: DragImpact,
droppables: DroppableDimensionMap
droppables: DroppableDimensionMap,
): DroppableDimension | null => {

@@ -34,3 +34,3 @@ const id: DroppableId | null = whatIsDraggedOver(impact);

state.impact,
state.dimensions.droppables
state.dimensions.droppables,
);

@@ -45,6 +45,6 @@ const isMainAxisMovementAllowed = Boolean(isActuallyOver);

const isMovingOnMainAxis: boolean =
(direction === "vertical" &&
(type === "MOVE_UP" || type === "MOVE_DOWN")) ||
(direction === "horizontal" &&
(type === "MOVE_LEFT" || type === "MOVE_RIGHT"));
(direction === 'vertical' &&
(type === 'MOVE_UP' || type === 'MOVE_DOWN')) ||
(direction === 'horizontal' &&
(type === 'MOVE_LEFT' || type === 'MOVE_RIGHT'));

@@ -57,3 +57,3 @@ // This movement is not permitted right now

const isMovingForward: boolean =
type === "MOVE_DOWN" || type === "MOVE_RIGHT";
type === 'MOVE_DOWN' || type === 'MOVE_RIGHT';

@@ -60,0 +60,0 @@ const draggable: DraggableDimension =

38

src/state/move-in-direction/move-cross-axis/get-best-cross-axis-droppable.ts

@@ -1,8 +0,8 @@

import type { Position, Rect } from "css-box-model";
import { invariant } from "../../../invariant";
import { closest } from "../../position";
import isWithin from "../../is-within";
import { getCorners } from "../../spacing";
import isPartiallyVisibleThroughFrame from "../../visibility/is-partially-visible-through-frame";
import { toDroppableList } from "../../dimension-structures";
import type { Position, Rect } from 'css-box-model';
import { invariant } from '../../../invariant';
import { closest } from '../../position';
import isWithin from '../../is-within';
import { getCorners } from '../../spacing';
import isPartiallyVisibleThroughFrame from '../../visibility/is-partially-visible-through-frame';
import { toDroppableList } from '../../dimension-structures';
import type {

@@ -13,3 +13,3 @@ Axis,

Viewport,
} from "../../../types";
} from '../../../types';

@@ -30,3 +30,3 @@ interface GetBestDroppableArgs {

invariant(rect, "Cannot get clipped area from droppable");
invariant(rect, 'Cannot get clipped area from droppable');

@@ -58,7 +58,7 @@ return rect;

.filter((droppable: DroppableDimension): boolean =>
Boolean(droppable.subject.active)
Boolean(droppable.subject.active),
)
// Remove any that are not visible in the window
.filter((droppable: DroppableDimension): boolean =>
isPartiallyVisibleThroughFrame(viewport.frame)(getKnownActive(droppable))
isPartiallyVisibleThroughFrame(viewport.frame)(getKnownActive(droppable)),
)

@@ -81,3 +81,3 @@ .filter((droppable: DroppableDimension): boolean => {

activeOfTarget[axis.start],
activeOfTarget[axis.end]
activeOfTarget[axis.end],
);

@@ -107,6 +107,6 @@

index: number,
array: DroppableDimension[]
array: DroppableDimension[],
): boolean =>
getKnownActive(droppable)[axis.crossAxisStart] ===
getKnownActive(array[0])[axis.crossAxisStart]
getKnownActive(array[0])[axis.crossAxisStart],
);

@@ -132,6 +132,6 @@

getKnownActive(droppable)[axis.start],
getKnownActive(droppable)[axis.end]
getKnownActive(droppable)[axis.end],
);
return isWithinDroppable(pageBorderBoxCenter[axis.line]);
}
},
);

@@ -148,3 +148,3 @@

(a: DroppableDimension, b: DroppableDimension): number =>
getKnownActive(a)[axis.start] - getKnownActive(b)[axis.start]
getKnownActive(a)[axis.start] - getKnownActive(b)[axis.start],
)[0];

@@ -161,3 +161,3 @@ }

pageBorderBoxCenter,
getCorners(getKnownActive(b))
getCorners(getKnownActive(b)),
);

@@ -173,4 +173,4 @@

return getKnownActive(a)[axis.start] - getKnownActive(b)[axis.start];
}
},
)[0];
};

24

src/state/move-in-direction/move-cross-axis/get-closest-draggable.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -7,10 +7,10 @@ Viewport,

LiftEffect,
} from "../../../types";
import { distance } from "../../position";
import { isTotallyVisible } from "../../visibility/is-visible";
import withDroppableDisplacement from "../../with-scroll-change/with-droppable-displacement";
} from '../../../types';
import { distance } from '../../position';
import { isTotallyVisible } from '../../visibility/is-visible';
import withDroppableDisplacement from '../../with-scroll-change/with-droppable-displacement';
import {
getCurrentPageBorderBox,
getCurrentPageBorderBoxCenter,
} from "./without-starting-displacement";
} from './without-starting-displacement';

@@ -37,3 +37,3 @@ interface Args {

(
draggable: DraggableDimension
draggable: DraggableDimension,
): boolean => // Allowing movement to draggables that are not visible in the viewport

@@ -47,3 +47,3 @@ // but must be visible in the droppable

withDroppableDisplacement: true,
})
}),
)

@@ -56,4 +56,4 @@ .sort((a: DraggableDimension, b: DraggableDimension): number => {

destination,
getCurrentPageBorderBoxCenter(a, afterCritical)
)
getCurrentPageBorderBoxCenter(a, afterCritical),
),
);

@@ -64,4 +64,4 @@ const distanceToB = distance(

destination,
getCurrentPageBorderBoxCenter(b, afterCritical)
)
getCurrentPageBorderBoxCenter(b, afterCritical),
),
);

@@ -68,0 +68,0 @@

20

src/state/move-in-direction/move-cross-axis/index.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import type { PublicResult } from "../move-in-direction-types";
import type { Position } from 'css-box-model';
import type { PublicResult } from '../move-in-direction-types';
import type {

@@ -11,10 +11,10 @@ DroppableDimension,

LiftEffect,
} from "../../../types";
import getBestCrossAxisDroppable from "./get-best-cross-axis-droppable";
import getClosestDraggable from "./get-closest-draggable";
} from '../../../types';
import getBestCrossAxisDroppable from './get-best-cross-axis-droppable';
import getClosestDraggable from './get-closest-draggable';
// import moveToNewDroppable from './move-to-new-droppable';
import getDraggablesInsideDroppable from "../../get-draggables-inside-droppable";
import getClientFromPageBorderBoxCenter from "../../get-center-from-impact/get-client-border-box-center/get-client-from-page-border-box-center";
import getPageBorderBoxCenter from "../../get-center-from-impact/get-page-border-box-center";
import moveToNewDroppable from "./move-to-new-droppable";
import getDraggablesInsideDroppable from '../../get-draggables-inside-droppable';
import getClientFromPageBorderBoxCenter from '../../get-center-from-impact/get-client-border-box-center/get-client-from-page-border-box-center';
import getPageBorderBoxCenter from '../../get-center-from-impact/get-page-border-box-center';
import moveToNewDroppable from './move-to-new-droppable';

@@ -64,3 +64,3 @@ interface Args {

destination.descriptor.id,
draggables
draggables,
);

@@ -67,0 +67,0 @@

24

src/state/move-in-direction/move-cross-axis/move-to-new-droppable.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -10,10 +10,10 @@ DragImpact,

LiftEffect,
} from "../../../types";
import getDisplacedBy from "../../get-displaced-by";
import { emptyGroups, noDisplacedBy } from "../../no-impact";
import getPageBorderBoxCenter from "../../get-center-from-impact/get-page-border-box-center";
import isTotallyVisibleInNewLocation from "../move-to-next-place/is-totally-visible-in-new-location";
import { addPlaceholder } from "../../droppable/with-placeholder";
import isHomeOf from "../../droppable/is-home-of";
import calculateReorderImpact from "../../calculate-drag-impact/calculate-reorder-impact";
} from '../../../types';
import getDisplacedBy from '../../get-displaced-by';
import { emptyGroups, noDisplacedBy } from '../../no-impact';
import getPageBorderBoxCenter from '../../get-center-from-impact/get-page-border-box-center';
import isTotallyVisibleInNewLocation from '../move-to-next-place/is-totally-visible-in-new-location';
import { addPlaceholder } from '../../droppable/with-placeholder';
import isHomeOf from '../../droppable/is-home-of';
import calculateReorderImpact from '../../calculate-drag-impact/calculate-reorder-impact';

@@ -52,3 +52,3 @@ interface Args {

at: {
type: "REORDER",
type: 'REORDER',
destination: {

@@ -90,3 +90,3 @@ droppableId: destination.descriptor.id,

previousPageBorderBoxCenter[destination.axis.line] <=
moveRelativeTo.page.borderBox.center[destination.axis.line]
moveRelativeTo.page.borderBox.center[destination.axis.line],
);

@@ -110,3 +110,3 @@

destination.axis,
draggable.displaceBy
draggable.displaceBy,
);

@@ -113,0 +113,0 @@

14

src/state/move-in-direction/move-cross-axis/without-starting-displacement.ts

@@ -1,10 +0,10 @@

import type { Position, Rect, Spacing } from "css-box-model";
import type { DraggableDimension, LiftEffect } from "../../../types";
import { negate, subtract } from "../../position";
import { offsetByPosition } from "../../spacing";
import didStartAfterCritical from "../../did-start-after-critical";
import type { Position, Rect, Spacing } from 'css-box-model';
import type { DraggableDimension, LiftEffect } from '../../../types';
import { negate, subtract } from '../../position';
import { offsetByPosition } from '../../spacing';
import didStartAfterCritical from '../../did-start-after-critical';
export const getCurrentPageBorderBoxCenter = (
draggable: DraggableDimension,
afterCritical: LiftEffect
afterCritical: LiftEffect,
): Position => {

@@ -21,3 +21,3 @@ // If an item started displaced it is now resting

draggable: DraggableDimension,
afterCritical: LiftEffect
afterCritical: LiftEffect,
): Spacing => {

@@ -24,0 +24,0 @@ // If an item started displaced it is now resting

4

src/state/move-in-direction/move-in-direction-types.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import type { DragImpact } from "../../types";
import type { Position } from 'css-box-model';
import type { DragImpact } from '../../types';

@@ -4,0 +4,0 @@ export interface PublicResult {

28

src/state/move-in-direction/move-to-next-place/index.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -9,13 +9,13 @@ DroppableDimension,

LiftEffect,
} from "../../../types";
import type { PublicResult } from "../move-in-direction-types";
import getDraggablesInsideDroppable from "../../get-draggables-inside-droppable";
import moveToNextCombine from "./move-to-next-combine";
import moveToNextIndex from "./move-to-next-index";
import isHomeOf from "../../droppable/is-home-of";
import getPageBorderBoxCenter from "../../get-center-from-impact/get-page-border-box-center";
import speculativelyIncrease from "../../update-displacement-visibility/speculatively-increase";
import getClientFromPageBorderBoxCenter from "../../get-center-from-impact/get-client-border-box-center/get-client-from-page-border-box-center";
import { subtract } from "../../position";
import isTotallyVisibleInNewLocation from "./is-totally-visible-in-new-location";
} from '../../../types';
import type { PublicResult } from '../move-in-direction-types';
import getDraggablesInsideDroppable from '../../get-draggables-inside-droppable';
import moveToNextCombine from './move-to-next-combine';
import moveToNextIndex from './move-to-next-index';
import isHomeOf from '../../droppable/is-home-of';
import getPageBorderBoxCenter from '../../get-center-from-impact/get-page-border-box-center';
import speculativelyIncrease from '../../update-displacement-visibility/speculatively-increase';
import getClientFromPageBorderBoxCenter from '../../get-center-from-impact/get-client-border-box-center/get-client-from-page-border-box-center';
import { subtract } from '../../position';
import isTotallyVisibleInNewLocation from './is-totally-visible-in-new-location';

@@ -51,3 +51,3 @@ interface Args {

destination.descriptor.id,
draggables
draggables,
);

@@ -117,3 +117,3 @@ const isInHomeList: boolean = isHomeOf(draggable, destination);

pageBorderBoxCenter,
previousPageBorderBoxCenter
previousPageBorderBoxCenter,
);

@@ -120,0 +120,0 @@

16

src/state/move-in-direction/move-to-next-place/is-totally-visible-in-new-location.ts

@@ -1,10 +0,10 @@

import type { Position, Rect, Spacing } from "css-box-model";
import { subtract } from "../../position";
import { offsetByPosition } from "../../spacing";
import type { Position, Rect, Spacing } from 'css-box-model';
import { subtract } from '../../position';
import { offsetByPosition } from '../../spacing';
import {
isTotallyVisible,
isTotallyVisibleOnAxis,
} from "../../visibility/is-visible";
import type { Args as IsVisibleArgs } from "../../visibility/is-visible";
import type { DraggableDimension, DroppableDimension } from "../../../types";
} from '../../visibility/is-visible';
import type { Args as IsVisibleArgs } from '../../visibility/is-visible';
import type { DraggableDimension, DroppableDimension } from '../../../types';

@@ -35,7 +35,7 @@ interface Args {

newPageBorderBoxCenter,
draggable.page.borderBox.center
draggable.page.borderBox.center,
);
const shifted: Spacing = offsetByPosition(
draggable.page.borderBox,
changeNeeded
changeNeeded,
);

@@ -42,0 +42,0 @@

16

src/state/move-in-direction/move-to-next-place/move-to-next-combine/index.ts

@@ -1,2 +0,2 @@

import { invariant } from "../../../../invariant";
import { invariant } from '../../../../invariant';
import type {

@@ -9,5 +9,5 @@ DraggableDimension,

DraggableId,
} from "../../../../types";
import { tryGetDestination } from "../../../get-impact-location";
import removeDraggableFromList from "../../../remove-draggable-from-list";
} from '../../../../types';
import { tryGetDestination } from '../../../get-impact-location';
import removeDraggableFromList from '../../../remove-draggable-from-list';

@@ -41,3 +41,3 @@ export interface Args {

const at: CombineImpact = {
type: "COMBINE",
type: 'COMBINE',
combine: {

@@ -63,3 +63,3 @@ draggableId: target,

draggable,
insideDestination
insideDestination,
);

@@ -84,5 +84,5 @@

const indexOfClosest: number = withoutDraggable.findIndex(
(d) => d.descriptor.id === closestId
(d) => d.descriptor.id === closestId,
);
invariant(indexOfClosest !== -1, "Could not find displaced item in set");
invariant(indexOfClosest !== -1, 'Could not find displaced item in set');

@@ -89,0 +89,0 @@ const proposedIndex: number = indexOfClosest - 1;

6

src/state/move-in-direction/move-to-next-place/move-to-next-index/from-combine.ts

@@ -9,4 +9,4 @@ import type {

LiftEffect,
} from "../../../../types";
import didStartAfterCritical from "../../../did-start-after-critical";
} from '../../../../types';
import didStartAfterCritical from '../../../did-start-after-critical';

@@ -37,3 +37,3 @@ interface Args {

combineId,
afterCritical
afterCritical,
);

@@ -40,0 +40,0 @@

2

src/state/move-in-direction/move-to-next-place/move-to-next-index/from-reorder.ts

@@ -1,2 +0,2 @@

import type { DraggableDimension, DraggableLocation } from "../../../../types";
import type { DraggableDimension, DraggableLocation } from '../../../../types';

@@ -3,0 +3,0 @@ interface Args {

14

src/state/move-in-direction/move-to-next-place/move-to-next-index/index.ts

@@ -1,2 +0,2 @@

import { invariant } from "../../../../invariant";
import { invariant } from '../../../../invariant';
import type {

@@ -10,6 +10,6 @@ DraggableDimension,

ImpactLocation,
} from "../../../../types";
import calculateReorderImpact from "../../../calculate-drag-impact/calculate-reorder-impact";
import fromCombine from "./from-combine";
import fromReorder from "./from-reorder";
} from '../../../../types';
import calculateReorderImpact from '../../../calculate-drag-impact/calculate-reorder-impact';
import fromCombine from './from-combine';
import fromReorder from './from-reorder';

@@ -40,5 +40,5 @@ export interface Args {

const wasAt: ImpactLocation | null = previousImpact.at;
invariant(wasAt, "Cannot move in direction without previous impact location");
invariant(wasAt, 'Cannot move in direction without previous impact location');
if (wasAt.type === "REORDER") {
if (wasAt.type === 'REORDER') {
const newIndex: number | null = fromReorder({

@@ -45,0 +45,0 @@ isMovingForward,

4

src/state/no-impact.ts

@@ -6,4 +6,4 @@ import type {

LiftEffect,
} from "../types";
import { origin } from "./position";
} from '../types';
import { origin } from './position';

@@ -10,0 +10,0 @@ export const noDisplacedBy: DisplacedBy = {

6

src/state/patch-dimension-map.ts

@@ -1,7 +0,7 @@

import type { DimensionMap, DroppableDimension } from "../types";
import patchDroppableMap from "./patch-droppable-map";
import type { DimensionMap, DroppableDimension } from '../types';
import patchDroppableMap from './patch-droppable-map';
export default (
dimensions: DimensionMap,
updated: DroppableDimension
updated: DroppableDimension,
): DimensionMap => ({

@@ -8,0 +8,0 @@ draggables: dimensions.draggables,

4

src/state/patch-droppable-map.ts

@@ -1,6 +0,6 @@

import type { DroppableDimension, DroppableDimensionMap } from "../types";
import type { DroppableDimension, DroppableDimensionMap } from '../types';
export default (
droppables: DroppableDimensionMap,
updated: DroppableDimension
updated: DroppableDimension,
): DroppableDimensionMap => ({

@@ -7,0 +7,0 @@ ...droppables,

8

src/state/position.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';

@@ -30,7 +30,7 @@ export const origin: Position = { x: 0, y: 0 };

export const patch = (
line: "x" | "y",
line: 'x' | 'y',
value: number,
otherValue = 0
otherValue = 0,
): Position => {
if (line === "x") {
if (line === 'x') {
return {

@@ -37,0 +37,0 @@ x: value,

18

src/state/post-reducer/when-moving/refresh-snap.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { invariant } from "../../../invariant";
import type { Position } from 'css-box-model';
import { invariant } from '../../../invariant';
import type {

@@ -11,7 +11,7 @@ DroppableDimension,

Viewport,
} from "../../../types";
import whatIsDraggedOver from "../../droppable/what-is-dragged-over";
import recomputeDisplacementVisibility from "../../update-displacement-visibility/recompute";
import getClientBorderBoxCenter from "../../get-center-from-impact/get-client-border-box-center";
import update from "./update";
} from '../../../types';
import whatIsDraggedOver from '../../droppable/what-is-dragged-over';
import recomputeDisplacementVisibility from '../../update-displacement-visibility/recompute';
import getClientBorderBoxCenter from '../../get-center-from-impact/get-client-border-box-center';
import update from './update';

@@ -30,3 +30,3 @@ interface Args {

Args): StateWhenUpdatesAllowed => {
invariant(state.movementMode === "SNAP");
invariant(state.movementMode === 'SNAP');

@@ -40,3 +40,3 @@ const needsVisibilityCheck: DragImpact = state.impact;

const isOver: DroppableId | null = whatIsDraggedOver(needsVisibilityCheck);
invariant(isOver, "Must be over a destination in SNAP movement mode");
invariant(isOver, 'Must be over a destination in SNAP movement mode');
const destination: DroppableDimension = droppables[isOver];

@@ -43,0 +43,0 @@

14

src/state/post-reducer/when-moving/update.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -12,6 +12,6 @@ DraggableDimension,

DroppableDimensionMap,
} from "../../../types";
import getDragImpact from "../../get-drag-impact";
import { add, subtract } from "../../position";
import recomputePlaceholders from "../../recompute-placeholders";
} from '../../../types';
import getDragImpact from '../../get-drag-impact';
import { add, subtract } from '../../position';
import recomputePlaceholders from '../../recompute-placeholders';

@@ -47,3 +47,3 @@ interface Args<TState extends StateWhenUpdatesAllowed> {

clientSelection,
state.initial.client.selection
state.initial.client.selection,
);

@@ -69,3 +69,3 @@

// Not updating impact while bulk collecting
if (state.phase === "COLLECTING") {
if (state.phase === 'COLLECTING') {
return {

@@ -72,0 +72,0 @@ ...state,

12

src/state/publish-while-dragging-in-virtual/adjust-additions-for-scroll-changes.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -9,6 +9,6 @@ Viewport,

DroppableId,
} from "../../types";
import { add } from "../position";
import offsetDraggable from "./offset-draggable";
import getFrame from "../get-frame";
} from '../../types';
import { add } from '../position';
import offsetDraggable from './offset-draggable';
import getFrame from '../get-frame';

@@ -47,3 +47,3 @@ interface Args {

windowScrollChange,
droppableScrollChange
droppableScrollChange,
);

@@ -50,0 +50,0 @@

30

src/state/publish-while-dragging-in-virtual/index.ts

@@ -15,10 +15,10 @@ import type {

DroppableId,
} from "../../types";
import * as timings from "../../debug/timings";
import getDragImpact from "../get-drag-impact";
import adjustAdditionsForScrollChanges from "./adjust-additions-for-scroll-changes";
import { toDraggableMap, toDroppableMap } from "../dimension-structures";
import getLiftEffect from "../get-lift-effect";
import scrollDroppable from "../droppable/scroll-droppable";
import whatIsDraggedOver from "../droppable/what-is-dragged-over";
} from '../../types';
import * as timings from '../../debug/timings';
import getDragImpact from '../get-drag-impact';
import adjustAdditionsForScrollChanges from './adjust-additions-for-scroll-changes';
import { toDraggableMap, toDroppableMap } from '../dimension-structures';
import getLiftEffect from '../get-lift-effect';
import scrollDroppable from '../droppable/scroll-droppable';
import whatIsDraggedOver from '../droppable/what-is-dragged-over';

@@ -30,3 +30,3 @@ interface Args {

const timingsKey = "Processing dynamic changes";
const timingsKey = 'Processing dynamic changes';

@@ -53,6 +53,6 @@ export default ({

existing,
update.scroll
update.scroll,
);
return scrolled;
}
},
);

@@ -70,3 +70,3 @@

viewport: state.viewport,
})
}),
);

@@ -130,3 +130,3 @@

// eslint-disable-next-line
phase: "DRAGGING",
phase: 'DRAGGING',
impact,

@@ -140,3 +140,3 @@ onLiftImpact,

if (state.phase === "COLLECTING") {
if (state.phase === 'COLLECTING') {
return draggingState;

@@ -152,3 +152,3 @@ }

// eslint-disable-next-line
phase: "DROP_PENDING",
phase: 'DROP_PENDING',
// No longer waiting

@@ -155,0 +155,0 @@ reason: state.reason,

6

src/state/publish-while-dragging-in-virtual/offset-draggable.ts

@@ -1,4 +0,4 @@

import { withScroll, offset as offsetBox } from "css-box-model";
import type { Position, BoxModel } from "css-box-model";
import type { DraggableDimension } from "../../types";
import { withScroll, offset as offsetBox } from 'css-box-model';
import type { Position, BoxModel } from 'css-box-model';
import type { DraggableDimension } from '../../types';

@@ -5,0 +5,0 @@ interface Args {

12

src/state/recompute-placeholders.ts
import {
addPlaceholder,
removePlaceholder,
} from "./droppable/with-placeholder";
import whatIsDraggedOver from "./droppable/what-is-dragged-over";
} from './droppable/with-placeholder';
import whatIsDraggedOver from './droppable/what-is-dragged-over';
import type {

@@ -13,5 +13,5 @@ DroppableDimension,

DroppableId,
} from "../types";
import patchDroppableMap from "./patch-droppable-map";
import isHomeOf from "./droppable/is-home-of";
} from '../types';
import patchDroppableMap from './patch-droppable-map';
import isHomeOf from './droppable/is-home-of';

@@ -95,3 +95,3 @@ interface ClearArgs {

draggable,
draggables
draggables,
);

@@ -98,0 +98,0 @@

6

src/state/rect.ts

@@ -1,6 +0,6 @@

import { getRect } from "css-box-model";
import type { Rect, Position } from "css-box-model";
import { offsetByPosition } from "./spacing";
import { getRect } from 'css-box-model';
import type { Rect, Position } from 'css-box-model';
import { offsetByPosition } from './spacing';
export const offsetRectByPosition = (rect: Rect, point: Position): Rect =>
getRect(offsetByPosition(rect, point));

148

src/state/reducer.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { invariant } from "../invariant";
import type { Position } from 'css-box-model';
import { invariant } from '../invariant';
import type {

@@ -18,19 +18,19 @@ DimensionMap,

DropReason,
} from "../types";
import type { Action } from "./store-types";
import type { PublicResult as MoveInDirectionResult } from "./move-in-direction/move-in-direction-types";
import scrollDroppable from "./droppable/scroll-droppable";
import moveInDirection from "./move-in-direction";
import { add, isEqual, origin } from "./position";
import scrollViewport from "./scroll-viewport";
import isMovementAllowed from "./is-movement-allowed";
import { toDroppableList } from "./dimension-structures";
import update from "./post-reducer/when-moving/update";
import refreshSnap from "./post-reducer/when-moving/refresh-snap";
import getLiftEffect from "./get-lift-effect";
import patchDimensionMap from "./patch-dimension-map";
import publishWhileDraggingInVirtual from "./publish-while-dragging-in-virtual";
} from '../types';
import type { Action } from './store-types';
import type { PublicResult as MoveInDirectionResult } from './move-in-direction/move-in-direction-types';
import scrollDroppable from './droppable/scroll-droppable';
import moveInDirection from './move-in-direction';
import { add, isEqual, origin } from './position';
import scrollViewport from './scroll-viewport';
import isMovementAllowed from './is-movement-allowed';
import { toDroppableList } from './dimension-structures';
import update from './post-reducer/when-moving/update';
import refreshSnap from './post-reducer/when-moving/refresh-snap';
import getLiftEffect from './get-lift-effect';
import patchDimensionMap from './patch-dimension-map';
import publishWhileDraggingInVirtual from './publish-while-dragging-in-virtual';
const isSnapping = (state: StateWhenUpdatesAllowed): boolean =>
state.movementMode === "SNAP";
state.movementMode === 'SNAP';

@@ -40,3 +40,3 @@ const postDroppableChange = (

updated: DroppableDimension,
isEnabledChanging: boolean
isEnabledChanging: boolean,
): StateWhenUpdatesAllowed => {

@@ -60,5 +60,5 @@ const dimensions: DimensionMap = patchDimensionMap(state.dimensions, updated);

function removeScrollJumpRequest(
state: DraggingState | CollectingState | DropPendingState
state: DraggingState | CollectingState | DropPendingState,
): DraggingState | CollectingState | DropPendingState {
if (state.isDragging && state.movementMode === "SNAP") {
if (state.isDragging && state.movementMode === 'SNAP') {
return {

@@ -72,7 +72,7 @@ ...state,

const idle: IdleState = { phase: "IDLE", completed: null, shouldFlush: false };
const idle: IdleState = { phase: 'IDLE', completed: null, shouldFlush: false };
// eslint-disable-next-line default-param-last
export default (state: State = idle, action: Action): State => {
if (action.type === "FLUSH") {
if (action.type === 'FLUSH') {
return {

@@ -84,6 +84,6 @@ ...idle,

if (action.type === "INITIAL_PUBLISH") {
if (action.type === 'INITIAL_PUBLISH') {
invariant(
state.phase === "IDLE",
"INITIAL_PUBLISH must come after a IDLE phase"
state.phase === 'IDLE',
'INITIAL_PUBLISH must come after a IDLE phase',
);

@@ -115,3 +115,3 @@ const { critical, clientSelection, viewport, dimensions, movementMode } =

const isWindowScrollAllowed: boolean = toDroppableList(
dimensions.droppables
dimensions.droppables,
).every((item: DroppableDimension) => !item.isFixedOnPage);

@@ -127,3 +127,3 @@

const result: DraggingState = {
phase: "DRAGGING",
phase: 'DRAGGING',
isDragging: true,

@@ -147,6 +147,6 @@ critical,

if (action.type === "COLLECTION_STARTING") {
if (action.type === 'COLLECTION_STARTING') {
// A collection might have restarted. We do not care as we are already in the right phase
// TODO: remove?
if (state.phase === "COLLECTING" || state.phase === "DROP_PENDING") {
if (state.phase === 'COLLECTING' || state.phase === 'DROP_PENDING') {
return state;

@@ -156,4 +156,4 @@ }

invariant(
state.phase === "DRAGGING",
`Collection cannot start from phase ${state.phase}`
state.phase === 'DRAGGING',
`Collection cannot start from phase ${state.phase}`,
);

@@ -163,3 +163,3 @@

...state,
phase: "COLLECTING",
phase: 'COLLECTING',
};

@@ -170,7 +170,7 @@

if (action.type === "PUBLISH_WHILE_DRAGGING") {
if (action.type === 'PUBLISH_WHILE_DRAGGING') {
// Unexpected bulk publish
invariant(
state.phase === "COLLECTING" || state.phase === "DROP_PENDING",
`Unexpected ${action.type} received in phase ${state.phase}`
state.phase === 'COLLECTING' || state.phase === 'DROP_PENDING',
`Unexpected ${action.type} received in phase ${state.phase}`,
);

@@ -184,5 +184,5 @@

if (action.type === "MOVE") {
if (action.type === 'MOVE') {
// Not allowing any more movements
if (state.phase === "DROP_PENDING") {
if (state.phase === 'DROP_PENDING') {
return state;

@@ -193,3 +193,3 @@ }

isMovementAllowed(state),
`${action.type} not permitted in phase ${state.phase}`
`${action.type} not permitted in phase ${state.phase}`,
);

@@ -212,7 +212,7 @@

if (action.type === "UPDATE_DROPPABLE_SCROLL") {
if (action.type === 'UPDATE_DROPPABLE_SCROLL') {
// Not allowing changes while a drop is pending
// Cannot get this during a DROP_ANIMATING as the dimension
// marshal will cancel any pending scroll updates
if (state.phase === "DROP_PENDING") {
if (state.phase === 'DROP_PENDING') {
return removeScrollJumpRequest(state);

@@ -223,3 +223,3 @@ }

// manually on the droppable so we can ignore this change
if (state.phase === "COLLECTING") {
if (state.phase === 'COLLECTING') {
return removeScrollJumpRequest(state);

@@ -230,3 +230,3 @@ }

isMovementAllowed(state),
`${action.type} not permitted in phase ${state.phase}`
`${action.type} not permitted in phase ${state.phase}`,
);

@@ -247,5 +247,5 @@

if (action.type === "UPDATE_DROPPABLE_IS_ENABLED") {
if (action.type === 'UPDATE_DROPPABLE_IS_ENABLED') {
// Things are locked at this point
if (state.phase === "DROP_PENDING") {
if (state.phase === 'DROP_PENDING') {
return state;

@@ -256,3 +256,3 @@ }

isMovementAllowed(state),
`Attempting to move in an unsupported phase ${state.phase}`
`Attempting to move in an unsupported phase ${state.phase}`,
);

@@ -265,3 +265,3 @@

target,
`Cannot find Droppable[id: ${id}] to toggle its enabled state`
`Cannot find Droppable[id: ${id}] to toggle its enabled state`,
);

@@ -272,3 +272,3 @@

`Trying to set droppable isEnabled to ${String(isEnabled)}
but it is already ${String(target.isEnabled)}`
but it is already ${String(target.isEnabled)}`,
);

@@ -284,5 +284,5 @@

if (action.type === "UPDATE_DROPPABLE_IS_COMBINE_ENABLED") {
if (action.type === 'UPDATE_DROPPABLE_IS_COMBINE_ENABLED') {
// Things are locked at this point
if (state.phase === "DROP_PENDING") {
if (state.phase === 'DROP_PENDING') {
return state;

@@ -293,3 +293,3 @@ }

isMovementAllowed(state),
`Attempting to move in an unsupported phase ${state.phase}`
`Attempting to move in an unsupported phase ${state.phase}`,
);

@@ -302,3 +302,3 @@

target,
`Cannot find Droppable[id: ${id}] to toggle its isCombineEnabled state`
`Cannot find Droppable[id: ${id}] to toggle its isCombineEnabled state`,
);

@@ -309,3 +309,3 @@

`Trying to set droppable isCombineEnabled to ${String(isCombineEnabled)}
but it is already ${String(target.isCombineEnabled)}`
but it is already ${String(target.isCombineEnabled)}`,
);

@@ -321,5 +321,5 @@

if (action.type === "MOVE_BY_WINDOW_SCROLL") {
if (action.type === 'MOVE_BY_WINDOW_SCROLL') {
// No longer accepting changes
if (state.phase === "DROP_PENDING" || state.phase === "DROP_ANIMATING") {
if (state.phase === 'DROP_PENDING' || state.phase === 'DROP_ANIMATING') {
return state;

@@ -330,3 +330,3 @@ }

isMovementAllowed(state),
`Cannot move by window in phase ${state.phase}`
`Cannot move by window in phase ${state.phase}`,
);

@@ -336,3 +336,3 @@

state.isWindowScrollAllowed,
"Window scrolling is currently not supported for fixed lists"
'Window scrolling is currently not supported for fixed lists',
);

@@ -362,3 +362,3 @@

if (action.type === "UPDATE_VIEWPORT_MAX_SCROLL") {
if (action.type === 'UPDATE_VIEWPORT_MAX_SCROLL') {
// Could occur if a transitionEnd occurs after a drag ends

@@ -390,9 +390,9 @@ if (!isMovementAllowed(state)) {

if (
action.type === "MOVE_UP" ||
action.type === "MOVE_DOWN" ||
action.type === "MOVE_LEFT" ||
action.type === "MOVE_RIGHT"
action.type === 'MOVE_UP' ||
action.type === 'MOVE_DOWN' ||
action.type === 'MOVE_LEFT' ||
action.type === 'MOVE_RIGHT'
) {
// Not doing keyboard movements during these phases
if (state.phase === "COLLECTING" || state.phase === "DROP_PENDING") {
if (state.phase === 'COLLECTING' || state.phase === 'DROP_PENDING') {
return state;

@@ -402,4 +402,4 @@ }

invariant(
state.phase === "DRAGGING",
`${action.type} received while not in DRAGGING phase`
state.phase === 'DRAGGING',
`${action.type} received while not in DRAGGING phase`,
);

@@ -425,7 +425,7 @@

if (action.type === "DROP_PENDING") {
if (action.type === 'DROP_PENDING') {
const reason: DropReason = action.payload.reason;
invariant(
state.phase === "COLLECTING",
"Can only move into the DROP_PENDING phase from the COLLECTING phase"
state.phase === 'COLLECTING',
'Can only move into the DROP_PENDING phase from the COLLECTING phase',
);

@@ -435,3 +435,3 @@

...state,
phase: "DROP_PENDING",
phase: 'DROP_PENDING',
isWaiting: true,

@@ -443,7 +443,7 @@ reason,

if (action.type === "DROP_ANIMATE") {
if (action.type === 'DROP_ANIMATE') {
const { completed, dropDuration, newHomeClientOffset } = action.payload;
invariant(
state.phase === "DRAGGING" || state.phase === "DROP_PENDING",
`Cannot animate drop from phase ${state.phase}`
state.phase === 'DRAGGING' || state.phase === 'DROP_PENDING',
`Cannot animate drop from phase ${state.phase}`,
);

@@ -453,3 +453,3 @@

const result: DropAnimatingState = {
phase: "DROP_ANIMATING",
phase: 'DROP_ANIMATING',
completed,

@@ -466,7 +466,7 @@ dropDuration,

// We can simply return to the idle state
if (action.type === "DROP_COMPLETE") {
if (action.type === 'DROP_COMPLETE') {
const { completed } = action.payload;
return {
phase: "IDLE",
phase: 'IDLE',
completed,

@@ -473,0 +473,0 @@ shouldFlush: false,

26

src/state/registry/create-registry.ts

@@ -1,15 +0,15 @@

import { invariant } from "../../invariant";
import type { DraggableId, DroppableId, TypeId } from "../../types";
import { invariant } from '../../invariant';
import type { TypeId, DraggableId, DroppableId } from '../../types';
import type {
Registry,
DraggableAPI,
DroppableAPI,
DraggableEntry,
DraggableEntryMap,
DroppableAPI,
DroppableEntry,
DroppableEntryMap,
Registry,
RegistryEvent,
Subscriber,
Unsubscribe,
} from "./registry-types";
DraggableEntryMap,
DroppableEntryMap,
} from './registry-types';

@@ -63,3 +63,3 @@ interface EntryMap {

entries.draggables[entry.descriptor.id] = entry;
notify({ type: "ADDITION", value: entry });
notify({ type: 'ADDITION', value: entry });
},

@@ -100,5 +100,5 @@ update: (entry: DraggableEntry, last: DraggableEntry) => {

// Hack to get react 18 double useEffects to not cause errors when finding unregistered droppables
// make sure the entry exists before removal
if (entries.droppables[entry.descriptor.droppableId]) {
notify({ type: "REMOVAL", value: entry });
notify({ type: 'REMOVAL', value: entry });
}

@@ -111,3 +111,3 @@ },

Object.values(entries.draggables).filter(
(entry: DraggableEntry): boolean => entry.descriptor.type === type
(entry: DraggableEntry): boolean => entry.descriptor.type === type,
),

@@ -132,3 +132,3 @@ };

const current: DroppableEntry | null = findDroppableById(
entry.descriptor.id
entry.descriptor.id,
);

@@ -153,3 +153,3 @@

Object.values(entries.droppables).filter(
(entry: DroppableEntry): boolean => entry.descriptor.type === type
(entry: DroppableEntry): boolean => entry.descriptor.type === type,
),

@@ -156,0 +156,0 @@ };

12

src/state/registry/registry-types.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -13,6 +13,6 @@ Id,

TypeId,
} from "../../types";
} from '../../types';
export type GetDraggableDimensionFn = (
windowScroll: Position
windowScroll: Position,
) => DraggableDimension;

@@ -39,3 +39,3 @@

windowScroll: Position,
options: ScrollOptions
options: ScrollOptions,
) => DroppableDimension;

@@ -83,7 +83,7 @@

| {
type: "ADDITION";
type: 'ADDITION';
value: DraggableEntry;
}
| {
type: "REMOVAL";
type: 'REMOVAL';
value: DraggableEntry;

@@ -90,0 +90,0 @@ };

34

src/state/registry/use-registry.ts

@@ -1,5 +0,5 @@

import { useMemo } from "use-memo-one";
import useEffectOnce from "../../use-effect-once";
import createRegistry from "./create-registry";
import type { Registry } from "./registry-types";
import React, { useEffect } from 'react';
import { useMemo } from 'use-memo-one';
import type { Registry } from './registry-types';
import createRegistry from './create-registry';

@@ -9,13 +9,25 @@ export default function useRegistry(): Registry {

// Hack to get around react 18 double render in useEffect hook
useEffectOnce(() => {
useEffect(() => {
// clean up the registry to avoid any leaks
return function unmount() {
// clean up the registry to avoid any leaks
// doing it after an animation frame so that other things unmounting
// can continue to interact with the registry
requestAnimationFrame(registry.clean);
// FIXME: we do not know if this is still needed, but to make sure we do not
// break any existing existing code using react 16 and 17 we'll
// continue to clean up after an animation frame
//
// The requestAnimationFrame polyfill was added in this commit:
// https://github.com/atlassian/react-beautiful-dnd/pull/1487/commits/8bdffb9d077b0009400620d9cf6575bba7af13dc#diff-b3b2de485fa432e394aebc8abf54be40ad7fac9b39a2ed818fddfd56f1786c53
if (React.version.startsWith('16') || React.version.startsWith('17')) {
// doing it after an animation frame so that other things unmounting
// can continue to interact with the registry
requestAnimationFrame(registry.clean);
} else {
// starting with react v18, we must invoke clean immediately
// we won't be able to access the registry after the unmount
// more details here: https://beta.reactjs.org/learn/synchronizing-with-effects#how-to-handle-the-effect-firing-twice-in-development
registry.clean();
}
};
});
}, [registry]);
return registry;
}

10

src/state/remove-draggable-from-list.ts

@@ -1,3 +0,3 @@

import memoizeOne from "memoize-one";
import type { DraggableDimension } from "../types";
import memoizeOne from 'memoize-one';
import type { DraggableDimension } from '../types';

@@ -7,7 +7,7 @@ export default memoizeOne(

remove: DraggableDimension,
list: DraggableDimension[]
list: DraggableDimension[],
): DraggableDimension[] =>
list.filter(
(item: DraggableDimension) => item.descriptor.id !== remove.descriptor.id
)
(item: DraggableDimension) => item.descriptor.id !== remove.descriptor.id,
),
);

8

src/state/scroll-viewport.ts

@@ -1,6 +0,6 @@

import { getRect } from "css-box-model";
import type { Rect, Position } from "css-box-model";
import { getRect } from 'css-box-model';
import type { Rect, Position } from 'css-box-model';
import { subtract, negate } from "./position";
import type { Viewport } from "../types";
import { subtract, negate } from './position';
import type { Viewport } from '../types';

@@ -7,0 +7,0 @@ export default (viewport: Viewport, newScroll: Position): Viewport => {

6

src/state/spacing.ts

@@ -1,2 +0,2 @@

import type { Spacing, Position } from "css-box-model";
import type { Spacing, Position } from 'css-box-model';

@@ -12,3 +12,3 @@ // TODO add test

spacing: Spacing,
point: Position
point: Position,
): Spacing => ({

@@ -23,3 +23,3 @@ top: spacing.top + point.y,

spacing: Spacing,
position: Position
position: Position,
): Spacing => ({

@@ -26,0 +26,0 @@ // pulling back to increase size

8

src/state/store-types.ts
// This file exists to avoid a circular dependency between types.js and action-creators.js
import type { Store as ReduxStore, Dispatch as ReduxDispatch } from "redux";
import type { Action } from "./action-creators";
import type { State } from "../types";
import type { Store as ReduxStore, Dispatch as ReduxDispatch } from 'redux';
import type { Action } from './action-creators';
import type { State } from '../types';

@@ -54,3 +54,3 @@ export type {

DropAnimationFinishedActionCreator,
} from "./action-creators";
} from './action-creators';

@@ -57,0 +57,0 @@ export type Dispatch = ReduxDispatch<Action>;

8

src/state/update-displacement-visibility/recompute.ts

@@ -9,4 +9,4 @@ import type {

DisplacementGroups,
} from "../../types";
import getDisplacementGroups from "../get-displacement-groups";
} from '../../types';
import getDisplacementGroups from '../get-displacement-groups';

@@ -23,3 +23,3 @@ interface RecomputeArgs {

ids: DraggableId[],
draggables: DraggableDimensionMap
draggables: DraggableDimensionMap,
): DraggableDimension[] {

@@ -39,3 +39,3 @@ return ids.map((id: DraggableId): DraggableDimension => draggables[id]);

last.all,
draggables
draggables,
);

@@ -42,0 +42,0 @@

20

src/state/update-displacement-visibility/speculatively-increase.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -13,7 +13,7 @@ DraggableId,

Viewport,
} from "../../types";
import scrollViewport from "../scroll-viewport";
import scrollDroppable from "../droppable/scroll-droppable";
import { add } from "../position";
import getDisplacementGroups from "../get-displacement-groups";
} from '../../types';
import scrollViewport from '../scroll-viewport';
import scrollDroppable from '../droppable/scroll-droppable';
import { add } from '../position';
import getDisplacementGroups from '../get-displacement-groups';

@@ -30,3 +30,3 @@ interface SpeculativeArgs {

ids: DraggableId[],
draggables: DraggableDimensionMap
draggables: DraggableDimensionMap,
): DraggableDimension[] {

@@ -38,3 +38,3 @@ return ids.map((id: DraggableId): DraggableDimension => draggables[id]);

id: DraggableId,
groups: DisplacementGroups[]
groups: DisplacementGroups[],
): Displacement | null {

@@ -59,3 +59,3 @@ for (let i = 0; i < groups.length; i++) {

viewport,
add(viewport.scroll.current, maxScrollChange)
add(viewport.scroll.current, maxScrollChange),
);

@@ -65,3 +65,3 @@ const scrolledDroppable: DroppableDimension = destination.frame

destination,
add(destination.frame.scroll.current, maxScrollChange)
add(destination.frame.scroll.current, maxScrollChange),
)

@@ -68,0 +68,0 @@ : destination;

4

src/state/visibility/is-partially-visible-through-frame.ts

@@ -1,3 +0,3 @@

import type { Spacing } from "css-box-model";
import isWithin from "../is-within";
import type { Spacing } from 'css-box-model';
import isWithin from '../is-within';

@@ -4,0 +4,0 @@ export default (frame: Spacing) => {

4

src/state/visibility/is-position-in-frame.ts

@@ -1,3 +0,3 @@

import type { Position, Spacing } from "css-box-model";
import isWithin from "../is-within";
import type { Position, Spacing } from 'css-box-model';
import isWithin from '../is-within';

@@ -4,0 +4,0 @@ export default function isPositionInFrame(frame: Spacing) {

8

src/state/visibility/is-totally-visible-through-frame-on-axis.ts

@@ -1,5 +0,5 @@

import type { Spacing } from "css-box-model";
import type { Axis } from "../../types";
import isWithin from "../is-within";
import { vertical } from "../axis";
import type { Spacing } from 'css-box-model';
import type { Axis } from '../../types';
import isWithin from '../is-within';
import { vertical } from '../axis';

@@ -6,0 +6,0 @@ export default (axis: Axis) => (frame: Spacing) => {

4

src/state/visibility/is-totally-visible-through-frame.ts

@@ -1,3 +0,3 @@

import type { Spacing } from "css-box-model";
import isWithin from "../is-within";
import type { Spacing } from 'css-box-model';
import isWithin from '../is-within';

@@ -4,0 +4,0 @@ export default (frame: Spacing) => {

26

src/state/visibility/is-visible.ts

@@ -1,8 +0,8 @@

import type { Position, Spacing, Rect } from "css-box-model";
import type { DroppableDimension } from "../../types";
import isPartiallyVisibleThroughFrame from "./is-partially-visible-through-frame";
import isTotallyVisibleThroughFrame from "./is-totally-visible-through-frame";
import isTotallyVisibleThroughFrameOnAxis from "./is-totally-visible-through-frame-on-axis";
import { offsetByPosition } from "../spacing";
import { origin } from "../position";
import type { Position, Spacing, Rect } from 'css-box-model';
import type { DroppableDimension } from '../../types';
import isPartiallyVisibleThroughFrame from './is-partially-visible-through-frame';
import isTotallyVisibleThroughFrame from './is-totally-visible-through-frame';
import isTotallyVisibleThroughFrameOnAxis from './is-totally-visible-through-frame-on-axis';
import { offsetByPosition } from '../spacing';
import { origin } from '../position';

@@ -19,3 +19,3 @@ export interface Args {

type IsVisibleThroughFrameFn = (
frame: Spacing
frame: Spacing,
) => (subject: Spacing) => boolean;

@@ -29,3 +29,3 @@

target: Spacing,
destination: DroppableDimension
destination: DroppableDimension,
): Spacing => {

@@ -42,3 +42,3 @@ const displacement: Position = destination.frame

destination: DroppableDimension,
isVisibleThroughFrameFn: IsVisibleThroughFrameFn
isVisibleThroughFrameFn: IsVisibleThroughFrameFn,
): boolean => {

@@ -62,3 +62,3 @@ // destination subject is totally hidden by frame

viewport: Rect,
isVisibleThroughFrameFn: IsVisibleThroughFrameFn
isVisibleThroughFrameFn: IsVisibleThroughFrameFn,
): boolean => isVisibleThroughFrameFn(viewport)(target);

@@ -81,3 +81,3 @@

destination,
isVisibleThroughFrameFn
isVisibleThroughFrameFn,
) && isVisibleInViewport(displacedTarget, viewport, isVisibleThroughFrameFn)

@@ -103,4 +103,4 @@ );

isVisibleThroughFrameFn: isTotallyVisibleThroughFrameOnAxis(
args.destination.axis
args.destination.axis,
),
});

12

src/state/with-scroll-change/with-all-displacement.ts

@@ -1,5 +0,5 @@

import type { Position } from "css-box-model";
import type { DroppableDimension, Viewport } from "../../types";
import withDroppableDisplacement from "./with-droppable-displacement";
import withViewportDisplacement from "./with-viewport-displacement";
import type { Position } from 'css-box-model';
import type { DroppableDimension, Viewport } from '../../types';
import withDroppableDisplacement from './with-droppable-displacement';
import withViewportDisplacement from './with-viewport-displacement';

@@ -9,7 +9,7 @@ export default (

droppable: DroppableDimension,
viewport: Viewport
viewport: Viewport,
): Position =>
withDroppableDisplacement(
droppable,
withViewportDisplacement(viewport, page)
withViewportDisplacement(viewport, page),
);

6

src/state/with-scroll-change/with-droppable-displacement.ts

@@ -1,4 +0,4 @@

import type { Position } from "css-box-model";
import { add } from "../position";
import type { Scrollable, DroppableDimension } from "../../types";
import type { Position } from 'css-box-model';
import { add } from '../position';
import type { Scrollable, DroppableDimension } from '../../types';

@@ -5,0 +5,0 @@ export default (droppable: DroppableDimension, point: Position): Position => {

6

src/state/with-scroll-change/with-droppable-scroll.ts

@@ -1,4 +0,4 @@

import type { Rect } from "css-box-model";
import type { Scrollable, DroppableDimension } from "../../types";
import { offsetRectByPosition } from "../rect";
import type { Rect } from 'css-box-model';
import type { Scrollable, DroppableDimension } from '../../types';
import { offsetRectByPosition } from '../rect';

@@ -5,0 +5,0 @@ export default (droppable: DroppableDimension, area: Rect): Rect => {

6

src/state/with-scroll-change/with-viewport-displacement.ts

@@ -1,6 +0,6 @@

import type { Position } from "css-box-model";
import type { Viewport } from "../../types";
import { add } from "../position";
import type { Position } from 'css-box-model';
import type { Viewport } from '../../types';
import { add } from '../position';
export default (viewport: Viewport, point: Position): Position =>
add(viewport.scroll.diff.displacement, point);

70

src/types.ts

@@ -1,2 +0,2 @@

import type { BoxModel, Rect, Position } from "css-box-model";
import type { BoxModel, Rect, Position } from 'css-box-model';

@@ -10,3 +10,3 @@ export type Id = string;

export type DroppableMode = "standard" | "virtual";
export type DroppableMode = 'standard' | 'virtual';

@@ -35,26 +35,26 @@ export interface DroppableDescriptor {

export type Direction = "horizontal" | "vertical";
export type Direction = 'horizontal' | 'vertical';
export interface VerticalAxis {
direction: "vertical";
line: "y";
start: "top";
end: "bottom";
size: "height";
crossAxisLine: "x";
crossAxisStart: "left";
crossAxisEnd: "right";
crossAxisSize: "width";
direction: 'vertical';
line: 'y';
start: 'top';
end: 'bottom';
size: 'height';
crossAxisLine: 'x';
crossAxisStart: 'left';
crossAxisEnd: 'right';
crossAxisSize: 'width';
}
export interface HorizontalAxis {
direction: "horizontal";
line: "x";
start: "left";
end: "right";
size: "width";
crossAxisLine: "y";
crossAxisStart: "top";
crossAxisEnd: "bottom";
crossAxisSize: "height";
direction: 'horizontal';
line: 'x';
start: 'left';
end: 'right';
size: 'width';
crossAxisLine: 'y';
crossAxisStart: 'top';
crossAxisEnd: 'bottom';
crossAxisSize: 'height';
}

@@ -203,3 +203,3 @@

export interface ReorderImpact {
type: "REORDER";
type: 'REORDER';
destination: DraggableLocation;

@@ -209,3 +209,3 @@ }

export interface CombineImpact {
type: "COMBINE";
type: 'COMBINE';
combine: Combine;

@@ -248,3 +248,3 @@ }

// SNAP: items move in response to commands (eg keyboard);
export type MovementMode = "FLUID" | "SNAP";
export type MovementMode = 'FLUID' | 'SNAP';

@@ -282,3 +282,3 @@ export interface DragPositions {

export type DropReason = "DROP" | "CANCEL";
export type DropReason = 'DROP' | 'CANCEL';

@@ -346,3 +346,3 @@ // published when a drag finishes

export interface IdleState {
phase: "IDLE";
phase: 'IDLE';
completed: CompletedDrag | null;

@@ -372,3 +372,3 @@ shouldFlush: boolean;

export interface DraggingState extends BaseState {
phase: "DRAGGING";
phase: 'DRAGGING';
}

@@ -382,3 +382,3 @@

export interface CollectingState extends BaseState {
phase: "COLLECTING";
phase: 'COLLECTING';
}

@@ -391,3 +391,3 @@

export interface DropPendingState extends BaseState {
phase: "DROP_PENDING";
phase: 'DROP_PENDING';
isWaiting: boolean;

@@ -399,3 +399,3 @@ reason: DropReason;

export interface DropAnimatingState {
phase: "DROP_ANIMATING";
phase: 'DROP_ANIMATING';
completed: CompletedDrag;

@@ -419,3 +419,3 @@ newHomeClientOffset: Position;

export type InOutAnimationMode = "none" | "open" | "close";
export type InOutAnimationMode = 'none' | 'open' | 'close';

@@ -432,3 +432,3 @@ export interface ResponderProvided {

start: DragStart,
provided: ResponderProvided
provided: ResponderProvided,
) => void;

@@ -438,3 +438,3 @@

update: DragUpdate,
provided: ResponderProvided
provided: ResponderProvided,
) => void;

@@ -444,3 +444,3 @@

result: DropResult,
provided: ResponderProvided
provided: ResponderProvided,
) => void;

@@ -499,3 +499,3 @@

forceStop?: () => void,
options?: TryGetLockOptions
options?: TryGetLockOptions,
) => PreDragActions | null;

@@ -502,0 +502,0 @@

2

src/view/animate-in-out/index.ts

@@ -1,1 +0,1 @@

export { default } from "./animate-in-out";
export { default } from './animate-in-out';

8

src/view/check-is-valid-inner-ref.ts

@@ -1,3 +0,3 @@

import { invariant } from "../invariant";
import isHtmlElement from "./is-type-of-element/is-html-element";
import { invariant } from '../invariant';
import isHtmlElement from './is-type-of-element/is-html-element';

@@ -11,5 +11,5 @@ export default function checkIsValidInnerRef(el?: HTMLElement | null) {

You can find a guide on using the innerRef callback functions at:
https://github.com/react-forked/dnd/blob/main/docs/guides/using-inner-ref.md
`
https://github.com/hello-pangea/dnd/blob/main/docs/guides/using-inner-ref.md
`,
);
}

10

src/view/context/app-context.ts

@@ -1,6 +0,6 @@

import React from "react";
import type { DraggableId, ContextId, ElementId } from "../../types";
import type { DimensionMarshal } from "../../state/dimension-marshal/dimension-marshal-types";
import type { FocusMarshal } from "../use-focus-marshal/focus-marshal-types";
import type { Registry } from "../../state/registry/registry-types";
import React from 'react';
import type { DraggableId, ContextId, ElementId } from '../../types';
import type { DimensionMarshal } from '../../state/dimension-marshal/dimension-marshal-types';
import type { FocusMarshal } from '../use-focus-marshal/focus-marshal-types';
import type { Registry } from '../../state/registry/registry-types';

@@ -7,0 +7,0 @@ export interface AppContextValue {

4

src/view/context/droppable-context.ts

@@ -1,3 +0,3 @@

import React from "react";
import type { DraggableId, DroppableId, TypeId } from "../../types";
import React from 'react';
import type { DraggableId, DroppableId, TypeId } from '../../types';

@@ -4,0 +4,0 @@ export interface DroppableContextValue {

8

src/view/context/store-context.ts

@@ -1,5 +0,5 @@

import React from "react";
import type { ReactReduxContextValue } from "react-redux";
import type { Action } from "../../state/store-types";
import type { State } from "../../types";
import React from 'react';
import type { ReactReduxContextValue } from 'react-redux';
import type { Action } from '../../state/store-types';
import type { State } from '../../types';

@@ -6,0 +6,0 @@ type StoreContextValue = ReactReduxContextValue<State, Action>;

2

src/view/data-attributes.ts

@@ -1,2 +0,2 @@

export const prefix = "data-rfd";
export const prefix = 'data-rfd';
export const dragHandle = (() => {

@@ -3,0 +3,0 @@ const base = `${prefix}-drag-handle`;

8

src/view/drag-drop-context/check-doctype.ts

@@ -1,2 +0,2 @@

import { warning } from "../../dev-warning";
import { warning } from '../../dev-warning';

@@ -7,3 +7,3 @@ const suffix = `

More information: https://github.com/react-forked/dnd/blob/main/docs/guides/doctype.md
More information: https://github.com/hello-pangea/dnd/blob/main/docs/guides/doctype.md
`;

@@ -23,3 +23,3 @@

if (doctype.name.toLowerCase() !== "html") {
if (doctype.name.toLowerCase() !== 'html') {
warning(`

@@ -32,3 +32,3 @@ Unexpected <!doctype> found: (${doctype.name})

if (doctype.publicId !== "") {
if (doctype.publicId !== '') {
warning(`

@@ -35,0 +35,0 @@ Unexpected <!doctype> publicId found: (${doctype.publicId})

4

src/view/drag-drop-context/check-react-version.ts

@@ -1,3 +0,3 @@

import { invariant } from "../../invariant";
import { warning } from "../../dev-warning";
import { invariant } from '../../invariant';
import { warning } from '../../dev-warning';

@@ -4,0 +4,0 @@ interface Version {

4

src/view/drag-drop-context/index.ts

@@ -1,2 +0,2 @@

export type { DragDropContextProps } from "./drag-drop-context";
export { default, resetServerContext } from "./drag-drop-context";
export type { DragDropContextProps } from './drag-drop-context';
export { default, resetServerContext } from './drag-drop-context';

10

src/view/drag-drop-context/use-startup-validation.ts

@@ -1,6 +0,6 @@

import React from "react";
import { peerDependencies } from "../../../package.json";
import checkReactVersion from "./check-react-version";
import checkDoctype from "./check-doctype";
import useDevSetupWarning from "../use-dev-setup-warning";
import React from 'react';
import { peerDependencies } from '../../../package.json';
import checkReactVersion from './check-react-version';
import checkDoctype from './check-doctype';
import useDevSetupWarning from '../use-dev-setup-warning';

@@ -7,0 +7,0 @@ export default function useStartupValidation(): void {

4

src/view/drag-drop-context/use-unique-context-id.ts

@@ -1,3 +0,3 @@

import { useMemo } from "use-memo-one";
import type { ContextId } from "../../types";
import { useMemo } from 'use-memo-one';
import type { ContextId } from '../../types';

@@ -4,0 +4,0 @@ let count = 0;

112

src/view/draggable/connected-draggable.ts

@@ -1,37 +0,37 @@

import type { Position } from "css-box-model";
import memoizeOne from "memoize-one";
import type { FunctionComponent } from "react";
import { connect } from "react-redux";
import * as animation from "../../animation";
import { dropAnimationFinished as dropAnimationFinishedAction } from "../../state/action-creators";
import whatIsDraggedOver from "../../state/droppable/what-is-dragged-over";
import whatIsDraggedOverFromResult from "../../state/droppable/what-is-dragged-over-from-result";
import { tryGetCombine } from "../../state/get-impact-location";
import isDragging from "../../state/is-dragging";
import { negate, origin } from "../../state/position";
import type { Position } from 'css-box-model';
import memoizeOne from 'memoize-one';
import type { FunctionComponent } from 'react';
import { connect } from 'react-redux';
import Draggable from './draggable';
import isDragging from '../../state/is-dragging';
import { origin, negate } from '../../state/position';
import isStrictEqual from '../is-strict-equal';
import * as animation from '../../animation';
import { dropAnimationFinished as dropAnimationFinishedAction } from '../../state/action-creators';
import type {
Combine,
State,
DraggableId,
DroppableId,
DraggableDimension,
Displacement,
CompletedDrag,
Displacement,
DraggableDimension,
DraggableId,
DragImpact,
DroppableId,
MovementMode,
DropResult,
LiftEffect,
MovementMode,
State,
} from "../../types";
import StoreContext from "../context/store-context";
import isStrictEqual from "../is-strict-equal";
import Draggable from "./draggable";
Combine,
} from '../../types';
import type {
DispatchProps,
DraggableProps,
DraggableStateSnapshot,
DropAnimation,
MapProps,
OwnProps,
DispatchProps,
Selector,
} from "./draggable-types";
DraggableStateSnapshot,
DropAnimation,
} from './draggable-types';
import whatIsDraggedOver from '../../state/droppable/what-is-dragged-over';
import StoreContext from '../context/store-context';
import whatIsDraggedOverFromResult from '../../state/droppable/what-is-dragged-over-from-result';
import { tryGetCombine } from '../../state/get-impact-location';

@@ -43,3 +43,3 @@ const getCombineWithFromResult = (result: DropResult): DraggableId | null => {

const getCombineWithFromImpact = (impact: DragImpact): DraggableId | null => {
return impact.at && impact.at.type === "COMBINE"
return impact.at && impact.at.type === 'COMBINE'
? impact.at.combine.draggableId

@@ -56,3 +56,3 @@ : null;

y,
})
}),
);

@@ -66,3 +66,3 @@

combineWith: DraggableId | null = null,
dropping: DropAnimation | null = null
dropping: DropAnimation | null = null,
): DraggableStateSnapshot => ({

@@ -77,3 +77,3 @@ isDragging: true,

combineTargetFor: null,
})
}),
);

@@ -91,6 +91,6 @@

combineWith: DraggableId | null = null,
forceShouldAnimate: boolean | null = null
forceShouldAnimate: boolean | null = null,
): MapProps => ({
mapped: {
type: "DRAGGING",
type: 'DRAGGING',
dropping: null,

@@ -108,6 +108,6 @@ draggingOver,

combineWith,
null
null,
),
},
})
}),
);

@@ -117,3 +117,3 @@

state: State,
ownProps: OwnProps
ownProps: OwnProps,
): MapProps | null => {

@@ -133,3 +133,3 @@ // Dragging

const combineWith: DraggableId | null = getCombineWithFromImpact(
state.impact
state.impact,
);

@@ -145,3 +145,3 @@ const forceShouldAnimate: boolean | null = state.forceShouldAnimate;

combineWith,
forceShouldAnimate
forceShouldAnimate,
);

@@ -151,3 +151,3 @@ }

// Dropping
if (state.phase === "DROP_ANIMATING") {
if (state.phase === 'DROP_ANIMATING') {
const completed: CompletedDrag = state.completed;

@@ -180,3 +180,3 @@ if (completed.result.draggableId !== ownProps.draggableId) {

mapped: {
type: "DRAGGING",
type: 'DRAGGING',
offset: state.newHomeClientOffset,

@@ -194,3 +194,3 @@ dimension,

combineWith,
dropping
dropping,
),

@@ -208,3 +208,3 @@ },

function getSecondarySnapshot(
combineTargetFor: DraggableId | null = null
combineTargetFor: DraggableId | null = null,
): DraggableStateSnapshot {

@@ -225,3 +225,3 @@ return {

mapped: {
type: "SECONDARY",
type: 'SECONDARY',
offset: origin,

@@ -239,3 +239,3 @@ combineTargetFor: null,

y,
})
}),
);

@@ -250,6 +250,6 @@

combineTargetFor: DraggableId | null = null,
shouldAnimateDisplacement: boolean
shouldAnimateDisplacement: boolean,
): MapProps => ({
mapped: {
type: "SECONDARY",
type: 'SECONDARY',
offset,

@@ -260,3 +260,3 @@ combineTargetFor,

},
})
}),
);

@@ -267,3 +267,3 @@

const getFallback = (
combineTargetFor?: DraggableId | null
combineTargetFor?: DraggableId | null,
): MapProps | null => {

@@ -279,3 +279,3 @@ return combineTargetFor

impact: DragImpact,
afterCritical: LiftEffect
afterCritical: LiftEffect,
): MapProps | null => {

@@ -285,3 +285,3 @@ const visualDisplacement: Displacement | null =

const isAfterCriticalInVirtualList = Boolean(
afterCritical.inVirtualList && afterCritical.effected[ownId]
afterCritical.inVirtualList && afterCritical.effected[ownId],
);

@@ -327,3 +327,3 @@

combineTargetFor,
visualDisplacement.shouldAnimate
visualDisplacement.shouldAnimate,
);

@@ -334,3 +334,3 @@ };

state: State,
ownProps: OwnProps
ownProps: OwnProps,
): MapProps | null => {

@@ -348,3 +348,3 @@ // Dragging

state.impact,
state.afterCritical
state.afterCritical,
);

@@ -354,3 +354,3 @@ }

// Dropping
if (state.phase === "DROP_ANIMATING") {
if (state.phase === 'DROP_ANIMATING') {
const completed: CompletedDrag = state.completed;

@@ -365,3 +365,3 @@ // do nothing if this was the dragging item

completed.impact,
completed.afterCritical
completed.afterCritical,
);

@@ -408,7 +408,7 @@ }

context: StoreContext as any,
// When pure, compares the result of mapStateToProps to its previous value.
// Default value: shallowEqual
// Switching to a strictEqual as we return a memoized object on changes
areStatePropsEqual: isStrictEqual,
}
},
// FIXME: Typings are really complexe

@@ -415,0 +415,0 @@ )(Draggable) as unknown as FunctionComponent<DraggableProps>;

32

src/view/draggable/draggable-types.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
import type {

@@ -6,3 +6,3 @@ ReactNode,

TransitionEventHandler,
} from "react";
} from 'react';
import type {

@@ -17,10 +17,10 @@ DraggableId,

DraggableRubric,
} from "../../types";
import { dropAnimationFinished } from "../../state/action-creators";
} from '../../types';
import { dropAnimationFinished } from '../../state/action-creators';
export interface DraggingStyle {
position: "fixed";
position: 'fixed';
top: number;
left: number;
boxSizing: "border-box";
boxSizing: 'border-box';
width: number;

@@ -38,3 +38,3 @@ height: number;

// It is also a minor performance optimisation
pointerEvents: "none";
pointerEvents: 'none';
}

@@ -46,3 +46,3 @@

// none: skip animation (used in certain displacement situations)
transition?: "none";
transition?: 'none';
}

@@ -62,5 +62,5 @@

// used for shared global styles
"data-rfd-draggable-context-id": ContextId;
'data-rfd-draggable-context-id': ContextId;
// used for lookups
"data-rfd-draggable-id": DraggableId;
'data-rfd-draggable-id': DraggableId;
// used to know when a transition ends

@@ -72,5 +72,5 @@ onTransitionEnd?: TransitionEventHandler;

// what draggable the handle belongs to
"data-rfd-drag-handle-draggable-id": DraggableId;
'data-rfd-drag-handle-draggable-id': DraggableId;
// What DragDropContext the drag handle is in
"data-rfd-drag-handle-context-id": ContextId;
'data-rfd-drag-handle-context-id': ContextId;
// We need a drag handle to be a widget in order to correctly set accessibility properties

@@ -86,3 +86,3 @@ // Note: JAWS and VoiceOver don't need the element to be a 'widget' to read the accessibility properties, but NVDA does

// Using the description property of the drag handle to provide usage instructions
"aria-describedby": ElementId;
'aria-describedby': ElementId;
// Allow tabbing to this element

@@ -132,3 +132,3 @@ // Adding a tab index marks the element as interactive content: https://www.w3.org/TR/html51/dom.html#kinds-of-content-interactive-content

export interface DraggingMapProps {
type: "DRAGGING";
type: 'DRAGGING';
offset: Position;

@@ -145,3 +145,3 @@ mode: MovementMode;

export interface SecondaryMapProps {
type: "SECONDARY";
type: 'SECONDARY';
offset: Position;

@@ -166,3 +166,3 @@ combineTargetFor: DraggableId | null;

snapshot: DraggableStateSnapshot,
rubic: DraggableRubric
rubic: DraggableRubric,
) => ReactNode | null;

@@ -169,0 +169,0 @@

24

src/view/draggable/get-style.ts

@@ -1,4 +0,4 @@

import type { BoxModel } from "css-box-model";
import { combine, transforms, transitions } from "../../animation";
import type { DraggableDimension } from "../../types";
import type { BoxModel } from 'css-box-model';
import { combine, transforms, transitions } from '../../animation';
import type { DraggableDimension } from '../../types';
import type {

@@ -13,3 +13,3 @@ DraggingStyle,

MappedProps,
} from "./draggable-types";
} from './draggable-types';

@@ -23,3 +23,3 @@ export const zIndexOptions: ZIndexOptions = {

shouldAnimateDragMovement: boolean,
dropping?: DropAnimation | null
dropping?: DropAnimation | null,
): string => {

@@ -37,3 +37,3 @@ if (dropping) {

isCombining: boolean,
isDropAnimating: boolean
isDropAnimating: boolean,
): number | undefined => {

@@ -52,3 +52,3 @@ // if not combining: no not impact opacity

}
return dragging.mode === "SNAP";
return dragging.mode === 'SNAP';
};

@@ -72,3 +72,3 @@

// ## Placement
position: "fixed",
position: 'fixed',
// As we are applying the margins we need to align to the start of the marginBox

@@ -80,3 +80,3 @@ top: box.marginBox.top,

// Locking these down as pulling the node out of the DOM could cause it to change size
boxSizing: "border-box",
boxSizing: 'border-box',
width: box.borderBox.width,

@@ -97,3 +97,3 @@ height: box.borderBox.height,

// global styles on cover while dragging
pointerEvents: "none",
pointerEvents: 'none',
};

@@ -107,3 +107,3 @@ return style;

// transition style is applied in the head
transition: secondary.shouldAnimateDisplacement ? undefined : "none",
transition: secondary.shouldAnimateDisplacement ? undefined : 'none',
};

@@ -113,5 +113,5 @@ }

export default function getStyle(mapped: MappedProps): DraggableStyle {
return mapped.type === "DRAGGING"
return mapped.type === 'DRAGGING'
? getDraggingStyle(mapped)
: getSecondaryStyle(mapped);
}

2

src/view/draggable/index.ts

@@ -1,1 +0,1 @@

export { PublicDraggable as default } from "./draggable-api";
export { PublicDraggable as default } from './draggable-api';

32

src/view/draggable/use-validation.ts

@@ -1,9 +0,9 @@

import { useRef } from "react";
import { invariant } from "../../invariant";
import type { DraggableId, ContextId } from "../../types";
import type { Props } from "./draggable-types";
import checkIsValidInnerRef from "../check-is-valid-inner-ref";
import findDragHandle from "../get-elements/find-drag-handle";
import useDevSetupWarning from "../use-dev-setup-warning";
import useDev from "../use-dev";
import { useRef } from 'react';
import { invariant } from '../../invariant';
import type { DraggableId, ContextId } from '../../types';
import type { Props } from './draggable-types';
import checkIsValidInnerRef from '../check-is-valid-inner-ref';
import findDragHandle from '../get-elements/find-drag-handle';
import useDevSetupWarning from '../use-dev-setup-warning';
import useDev from '../use-dev';

@@ -13,3 +13,3 @@ export function useValidation(

contextId: ContextId,
getRef: () => HTMLElement | null
getRef: () => HTMLElement | null,
) {

@@ -24,7 +24,7 @@ // running after every update in development

const id: DraggableId | null = props.draggableId;
invariant(id, "Draggable requires a draggableId");
invariant(id, 'Draggable requires a draggableId');
invariant(
typeof id === "string",
typeof id === 'string',
`Draggable requires a [string] draggableId.
Provided: [type: ${typeof id}] (value: ${id})`
Provided: [type: ${typeof id}] (value: ${id})`,
);

@@ -34,6 +34,6 @@

Number.isInteger(props.index),
`${prefix(id)} requires an integer index prop`
`${prefix(id)} requires an integer index prop`,
);
if (props.mapped.type === "DRAGGING") {
if (props.mapped.type === 'DRAGGING') {
return;

@@ -51,3 +51,3 @@ }

findDragHandle(contextId, id),
`${prefix(id)} Unable to find drag handle`
`${prefix(id)} Unable to find drag handle`,
);

@@ -68,3 +68,3 @@ }

isClone === initialRef.current,
"Draggable isClone prop value changed during component life"
'Draggable isClone prop value changed during component life',
);

@@ -71,0 +71,0 @@ }, [isClone]);

84

src/view/droppable/connected-droppable.ts

@@ -1,35 +0,35 @@

import memoizeOne from "memoize-one";
import { FunctionComponent } from "react";
import { connect } from "react-redux";
import { invariant } from "../../invariant";
import { updateViewportMaxScroll as updateViewportMaxScrollAction } from "../../state/action-creators";
import whatIsDraggedOver from "../../state/droppable/what-is-dragged-over";
import whatIsDraggedOverFromResult from "../../state/droppable/what-is-dragged-over-from-result";
import isDragging from "../../state/is-dragging";
import { connect } from 'react-redux';
import memoizeOne from 'memoize-one';
import { FunctionComponent } from 'react';
import { invariant } from '../../invariant';
import type {
State,
DroppableId,
DraggableId,
CompletedDrag,
DraggableDimension,
DimensionMap,
TypeId,
Critical,
DimensionMap,
DraggableRubric,
DraggableDescriptor,
DraggableDimension,
DraggableId,
DraggableRubric,
DroppableId,
State,
TypeId,
} from "../../types";
import StoreContext from "../context/store-context";
import isStrictEqual from "../is-strict-equal";
import Droppable from "./droppable";
} from '../../types';
import type {
MapProps,
InternalOwnProps,
DroppableProps,
DefaultProps,
Selector,
DispatchProps,
DraggableChildrenFn,
DroppableProps,
DroppableStateSnapshot,
InternalOwnProps,
MapProps,
Selector,
UseClone,
} from "./droppable-types";
DraggableChildrenFn,
} from './droppable-types';
import Droppable from './droppable';
import isStrictEqual from '../is-strict-equal';
import whatIsDraggedOver from '../../state/droppable/what-is-dragged-over';
import { updateViewportMaxScroll as updateViewportMaxScrollAction } from '../../state/action-creators';
import isDragging from '../../state/is-dragging';
import StoreContext from '../context/store-context';
import whatIsDraggedOverFromResult from '../../state/droppable/what-is-dragged-over-from-result';

@@ -41,3 +41,3 @@ const isMatchingType = (type: TypeId, critical: Critical): boolean =>

critical: Critical,
dimensions: DimensionMap
dimensions: DimensionMap,
): DraggableDimension => dimensions.draggables[critical.draggable.id];

@@ -74,3 +74,3 @@

},
})
}),
);

@@ -86,3 +86,3 @@

// snapshot: StateSnapshot,
renderClone?: DraggableChildrenFn | null
renderClone?: DraggableChildrenFn | null,
): MapProps => {

@@ -138,3 +138,3 @@ const draggableId: DraggableId = dragging.descriptor.id;

};
}
},
);

@@ -158,3 +158,3 @@

critical,
state.dimensions
state.dimensions,
);

@@ -169,7 +169,7 @@ const isDraggingOver: boolean = whatIsDraggedOver(state.impact) === id;

dragging,
renderClone
renderClone,
);
}
if (state.phase === "DROP_ANIMATING") {
if (state.phase === 'DROP_ANIMATING') {
const completed: CompletedDrag = state.completed;

@@ -182,3 +182,3 @@ if (!isMatchingType(type, completed.critical)) {

completed.critical,
state.dimensions
state.dimensions,
);

@@ -195,7 +195,7 @@

dragging,
renderClone
renderClone,
);
}
if (state.phase === "IDLE" && state.completed && !state.shouldFlush) {
if (state.phase === 'IDLE' && state.completed && !state.shouldFlush) {
const completed: CompletedDrag = state.completed;

@@ -209,3 +209,3 @@ if (!isMatchingType(type, completed.critical)) {

const wasCombining = Boolean(
completed.impact.at && completed.impact.at.type === "COMBINE"
completed.impact.at && completed.impact.at.type === 'COMBINE',
);

@@ -241,3 +241,3 @@ const isHome: boolean = completed.critical.droppable.id === id;

function getBody(): HTMLElement {
invariant(document.body, "document.body is not ready");
invariant(document.body, 'document.body is not ready');
return document.body;

@@ -247,5 +247,5 @@ }

const defaultProps: DefaultProps = {
mode: "standard",
type: "DEFAULT",
direction: "vertical",
mode: 'standard',
type: 'DEFAULT',
direction: 'vertical',
isDropDisabled: false,

@@ -280,7 +280,7 @@ isCombineEnabled: false,

context: StoreContext as any,
// When pure, compares the result of mapStateToProps to its previous value.
// Default value: shallowEqual
// Switching to a strictEqual as we return a memoized object on changes
areStatePropsEqual: isStrictEqual,
}
},
// FIXME: Typings are really complexe

@@ -287,0 +287,0 @@ )(Droppable) as unknown as FunctionComponent<DroppableProps>;

16

src/view/droppable/droppable-types.ts

@@ -1,2 +0,2 @@

import type { ReactNode } from "react";
import type { ReactNode } from 'react';
import type {

@@ -12,13 +12,13 @@ DraggableId,

DroppableMode,
} from "../../types";
import type { DraggableChildrenFn } from "../draggable/draggable-types";
import { updateViewportMaxScroll } from "../../state/action-creators";
} from '../../types';
import type { DraggableChildrenFn } from '../draggable/draggable-types';
import { updateViewportMaxScroll } from '../../state/action-creators';
export type { DraggableChildrenFn } from "../draggable/draggable-types";
export type { DraggableChildrenFn } from '../draggable/draggable-types';
export interface DroppableProvidedProps {
// used for shared global styles
"data-rfd-droppable-context-id": ContextId;
'data-rfd-droppable-context-id': ContextId;
// Used to lookup. Currently not used for drag and drop lifecycle
"data-rfd-droppable-id": DroppableId;
'data-rfd-droppable-id': DroppableId;
}

@@ -79,3 +79,3 @@

provided: DroppableProvided,
snapshot: DroppableStateSnapshot
snapshot: DroppableStateSnapshot,
) => ReactNode;

@@ -82,0 +82,0 @@ droppableId: DroppableId;

2

src/view/droppable/index.ts

@@ -1,1 +0,1 @@

export { default } from "./connected-droppable";
export { default } from './connected-droppable';

34

src/view/droppable/use-validation.ts

@@ -1,6 +0,6 @@

import { invariant } from "../../invariant";
import type { Props } from "./droppable-types";
import { warning } from "../../dev-warning";
import checkIsValidInnerRef from "../check-is-valid-inner-ref";
import useDevSetupWarning from "../use-dev-setup-warning";
import { invariant } from '../../invariant';
import type { Props } from './droppable-types';
import { warning } from '../../dev-warning';
import checkIsValidInnerRef from '../check-is-valid-inner-ref';
import useDevSetupWarning from '../use-dev-setup-warning';

@@ -16,3 +16,3 @@ interface Args {

function isBoolean(value: unknown): boolean {
return typeof value === "boolean";
return typeof value === 'boolean';
}

@@ -26,6 +26,6 @@

function required({ props }: Args) {
invariant(props.droppableId, "A Droppable requires a droppableId prop");
invariant(props.droppableId, 'A Droppable requires a droppableId prop');
invariant(
typeof props.droppableId === "string",
`A Droppable requires a [string] droppableId. Provided: [${typeof props.droppableId}]`
typeof props.droppableId === 'string',
`A Droppable requires a [string] droppableId. Provided: [${typeof props.droppableId}]`,
);

@@ -36,11 +36,11 @@ },

isBoolean(props.isDropDisabled),
"isDropDisabled must be a boolean"
'isDropDisabled must be a boolean',
);
invariant(
isBoolean(props.isCombineEnabled),
"isCombineEnabled must be a boolean"
'isCombineEnabled must be a boolean',
);
invariant(
isBoolean(props.ignoreContainerClipping),
"ignoreContainerClipping must be a boolean"
'ignoreContainerClipping must be a boolean',
);

@@ -70,3 +70,3 @@ },

Please be sure to add the {provided.placeholder} React Node as a child of your Droppable.
More information: https://github.com/react-forked/dnd/blob/main/docs/api/droppable.md
More information: https://github.com/hello-pangea/dnd/blob/main/docs/api/droppable.md
`);

@@ -80,3 +80,3 @@ },

props.renderClone,
"Must provide a clone render function (renderClone) for virtual lists"
'Must provide a clone render function (renderClone) for virtual lists',
);

@@ -87,3 +87,3 @@ },

!getPlaceholderRef(),
"Expected virtual list to not have a placeholder"
'Expected virtual list to not have a placeholder',
);

@@ -98,7 +98,7 @@ },

if (args.props.mode === "standard") {
if (args.props.mode === 'standard') {
runChecks(args, standard);
}
if (args.props.mode === "virtual") {
if (args.props.mode === 'virtual') {
runChecks(args, virtual);

@@ -105,0 +105,0 @@ }

8

src/view/event-bindings/bind-events.ts

@@ -5,3 +5,3 @@ import type {

EventOptions,
} from "./event-types";
} from './event-types';

@@ -12,3 +12,3 @@ type UnbindFn = () => void;

shared?: EventOptions,
fromBinding?: EventOptions | null
fromBinding?: EventOptions | null,
): EventOptions {

@@ -24,3 +24,3 @@ return {

bindings: AnyEventBinding[],
sharedOptions?: EventOptions
sharedOptions?: EventOptions,
): () => void {

@@ -36,3 +36,3 @@ const unbindings: UnbindFn[] = (bindings as EventBinding[]).map(

};
}
},
);

@@ -39,0 +39,0 @@

4

src/view/event-bindings/event-types.ts

@@ -1,3 +0,3 @@

import type { Position } from "css-box-model";
import { BeforeCapture } from "../../types";
import type { Position } from 'css-box-model';
import { BeforeCapture } from '../../types';

@@ -4,0 +4,0 @@ export interface EventOptions {

4

src/view/get-body-element.ts

@@ -1,7 +0,7 @@

import { invariant } from "../invariant";
import { invariant } from '../invariant';
export default (): HTMLBodyElement => {
const body = document.body;
invariant(body, "Cannot find document.body");
invariant(body, 'Cannot find document.body');
return body as HTMLBodyElement;
};

4

src/view/get-border-box-center-position.ts

@@ -1,6 +0,6 @@

import { getRect } from "css-box-model";
import { getRect } from 'css-box-model';
import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';
export default (el: HTMLElement): Position =>
getRect(el.getBoundingClientRect()).center;

4

src/view/get-document-element.ts

@@ -1,7 +0,7 @@

import { invariant } from "../invariant";
import { invariant } from '../invariant';
export default (): HTMLElement => {
const doc: HTMLElement | null = document.documentElement;
invariant(doc, "Cannot find document.documentElement");
invariant(doc, 'Cannot find document.documentElement');
return doc;
};

16

src/view/get-elements/find-drag-handle.ts

@@ -1,10 +0,10 @@

import type { DraggableId, ContextId } from "../../types";
import { dragHandle as dragHandleAttr } from "../data-attributes";
import { warning } from "../../dev-warning";
import { querySelectorAll } from "../../query-selector-all";
import isHtmlElement from "../is-type-of-element/is-html-element";
import type { DraggableId, ContextId } from '../../types';
import { dragHandle as dragHandleAttr } from '../data-attributes';
import { warning } from '../../dev-warning';
import { querySelectorAll } from '../../query-selector-all';
import isHtmlElement from '../is-type-of-element/is-html-element';
export default function findDragHandle(
contextId: ContextId,
draggableId: DraggableId
draggableId: DraggableId,
): HTMLElement | null {

@@ -26,3 +26,3 @@ // cannot create a selector with the draggable id as it might not be a valid attribute selector

warning(
`Unable to find drag handle with id "${draggableId}" as no handle with a matching id was found`
`Unable to find drag handle with id "${draggableId}" as no handle with a matching id was found`,
);

@@ -33,3 +33,3 @@ return null;

if (!isHtmlElement(handle)) {
warning("drag handle needs to be a HTMLElement");
warning('drag handle needs to be a HTMLElement');
return null;

@@ -36,0 +36,0 @@ }

14

src/view/get-elements/find-draggable.ts

@@ -1,10 +0,10 @@

import type { DraggableId, ContextId } from "../../types";
import * as attributes from "../data-attributes";
import { querySelectorAll } from "../../query-selector-all";
import { warning } from "../../dev-warning";
import isHtmlElement from "../is-type-of-element/is-html-element";
import type { DraggableId, ContextId } from '../../types';
import * as attributes from '../data-attributes';
import { querySelectorAll } from '../../query-selector-all';
import { warning } from '../../dev-warning';
import isHtmlElement from '../is-type-of-element/is-html-element';
export default function findDraggable(
contextId: ContextId,
draggableId: DraggableId
draggableId: DraggableId,
): HTMLElement | null {

@@ -24,3 +24,3 @@ // cannot create a selector with the draggable id as it might not be a valid attribute selector

if (!isHtmlElement(draggable)) {
warning("Draggable element is not a HTMLElement");
warning('Draggable element is not a HTMLElement');
return null;

@@ -27,0 +27,0 @@ }

2

src/view/is-type-of-element/is-element.ts

@@ -1,2 +0,2 @@

import getWindowFromEl from "../window/get-window-from-el";
import getWindowFromEl from '../window/get-window-from-el';

@@ -3,0 +3,0 @@ export default function isElement(el: any): el is Element {

2

src/view/is-type-of-element/is-html-element.ts

@@ -1,2 +0,2 @@

import getWindowFromEl from "../window/get-window-from-el";
import getWindowFromEl from '../window/get-window-from-el';

@@ -3,0 +3,0 @@ export default function isHtmlElement(el: any): el is HTMLElement {

2

src/view/is-type-of-element/is-svg-element.ts

@@ -1,2 +0,2 @@

import getWindowFromEl from "../window/get-window-from-el";
import getWindowFromEl from '../window/get-window-from-el';

@@ -3,0 +3,0 @@ export default function isSvgElement(el: any): boolean {

2

src/view/placeholder/index.ts

@@ -1,1 +0,1 @@

export { default } from "./placeholder";
export { default } from './placeholder';

8

src/view/placeholder/placeholder-types.ts
export interface PlaceholderStyle {
display: string;
boxSizing: "border-box";
boxSizing: 'border-box';
width: number;

@@ -10,6 +10,6 @@ height: number;

marginLeft: number;
flexShrink: "0";
flexGrow: "0";
pointerEvents: "none";
flexShrink: '0';
flexGrow: '0';
pointerEvents: 'none';
transition: string;
}

20

src/view/scroll-listener.ts

@@ -1,8 +0,8 @@

import type { Position } from "css-box-model";
import rafSchd from "raf-schd";
import { invariant } from "../invariant";
import bindEvents from "./event-bindings/bind-events";
import type { UIEventBinding } from "./event-bindings/event-types";
import getWindowScroll from "./window/get-window-scroll";
import { noop } from "../empty";
import type { Position } from 'css-box-model';
import rafSchd from 'raf-schd';
import { invariant } from '../invariant';
import bindEvents from './event-bindings/bind-events';
import type { UIEventBinding } from './event-bindings/event-types';
import getWindowScroll from './window/get-window-scroll';
import { noop } from '../empty';

@@ -23,3 +23,3 @@ type OnWindowScroll = (newScroll: Position) => void;

return {
eventName: "scroll",
eventName: 'scroll',
// ## Passive: true

@@ -61,7 +61,7 @@ // Eventual consistency is fine because we use position: fixed on the item

function start() {
invariant(!isActive(), "Cannot start scroll listener when already active");
invariant(!isActive(), 'Cannot start scroll listener when already active');
unbind = bindEvents(window, [binding]);
}
function stop() {
invariant(isActive(), "Cannot stop scroll listener when not active");
invariant(isActive(), 'Cannot stop scroll listener when not active');
scheduled.cancel();

@@ -68,0 +68,0 @@ unbind();

8

src/view/throw-if-invalid-inner-ref.ts

@@ -1,3 +0,3 @@

import { invariant } from "../invariant";
import isHtmlElement from "./is-type-of-element/is-html-element";
import { invariant } from '../invariant';
import isHtmlElement from './is-type-of-element/is-html-element';

@@ -11,5 +11,5 @@ export default (ref?: unknown | null) => {

You can find a guide on using the innerRef callback functions at:
https://github.com/react-forked/dnd/blob/main/docs/guides/using-inner-ref.md
`
https://github.com/hello-pangea/dnd/blob/main/docs/guides/using-inner-ref.md
`,
);
};

2

src/view/use-announcer/index.ts

@@ -1,1 +0,1 @@

export { default } from "./use-announcer";
export { default } from './use-announcer';

20

src/view/use-announcer/use-announcer.ts

@@ -1,7 +0,7 @@

import { useRef, useEffect } from "react";
import { useMemo, useCallback } from "use-memo-one";
import type { Announce, ContextId } from "../../types";
import { warning } from "../../dev-warning";
import getBodyElement from "../get-body-element";
import visuallyHidden from "../visually-hidden-style";
import { useRef, useEffect } from 'react';
import { useMemo, useCallback } from 'use-memo-one';
import type { Announce, ContextId } from '../../types';
import { warning } from '../../dev-warning';
import getBodyElement from '../get-body-element';
import visuallyHidden from '../visually-hidden-style';

@@ -17,3 +17,3 @@ export const getId = (contextId: ContextId): string =>

function setup() {
const el: HTMLElement = document.createElement("div");
const el: HTMLElement = document.createElement('div');
// storing reference for usage in announce

@@ -28,5 +28,5 @@ ref.current = el;

// will force itself to be read
el.setAttribute("aria-live", "assertive");
el.setAttribute('aria-live', 'assertive');
// must read the whole thing every time
el.setAttribute("aria-atomic", "true");
el.setAttribute('aria-atomic', 'true');

@@ -58,3 +58,3 @@ // hide the element visually

},
[id]
[id],
);

@@ -61,0 +61,0 @@

6

src/view/use-dev-setup-warning.ts

@@ -1,4 +0,4 @@

import { useEffect } from "react";
import { error } from "../dev-warning";
import useDev from "./use-dev";
import { useEffect } from 'react';
import { error } from '../dev-warning';
import useDev from './use-dev';

@@ -5,0 +5,0 @@ export default function useDevSetupWarning(fn: () => void, inputs?: unknown[]) {

2

src/view/use-dev.ts
export default function useDev(useHook: () => void) {
// Don't run any validation in production
if (process.env.NODE_ENV !== "production") {
if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line react-hooks/rules-of-hooks

@@ -5,0 +5,0 @@ useHook();

10

src/view/use-draggable-publisher/get-dimension.ts

@@ -1,3 +0,3 @@

import { calculateBox, withScroll } from "css-box-model";
import type { BoxModel, Position } from "css-box-model";
import { calculateBox, withScroll } from 'css-box-model';
import type { BoxModel, Position } from 'css-box-model';
import type {

@@ -7,4 +7,4 @@ DraggableDescriptor,

Placeholder,
} from "../../types";
import { origin } from "../../state/position";
} from '../../types';
import { origin } from '../../state/position';

@@ -14,3 +14,3 @@ export default function getDimension(

el: HTMLElement,
windowScroll: Position = origin
windowScroll: Position = origin,
): DraggableDimension {

@@ -17,0 +17,0 @@ const computedStyles: CSSStyleDeclaration = window.getComputedStyle(el);

2

src/view/use-draggable-publisher/index.ts

@@ -1,1 +0,1 @@

export { default } from "./use-draggable-publisher";
export { default } from './use-draggable-publisher';

28

src/view/use-draggable-publisher/use-draggable-publisher.ts

@@ -1,5 +0,5 @@

import type { Position } from "css-box-model";
import { useMemo, useCallback } from "use-memo-one";
import { useRef } from "react";
import { invariant } from "../../invariant";
import type { Position } from 'css-box-model';
import { useMemo, useCallback } from 'use-memo-one';
import { useRef } from 'react';
import { invariant } from '../../invariant';
import type {

@@ -10,10 +10,10 @@ DraggableDescriptor,

DraggableOptions,
} from "../../types";
} from '../../types';
import type {
Registry,
DraggableEntry,
} from "../../state/registry/registry-types";
import makeDimension from "./get-dimension";
import useLayoutEffect from "../use-isomorphic-layout-effect";
import useUniqueId from "../use-unique-id";
} from '../../state/registry/registry-types';
import makeDimension from './get-dimension';
import useLayoutEffect from '../use-isomorphic-layout-effect';
import useUniqueId from '../use-unique-id';

@@ -27,3 +27,3 @@ export interface Args extends DraggableOptions {

export default function useDraggablePublisher(args: Args) {
const uniqueId: Id = useUniqueId("draggable");
const uniqueId: Id = useUniqueId('draggable');

@@ -45,3 +45,3 @@ const {

}),
[canDragInteractiveElements, isEnabled, shouldRespectForcePress]
[canDragInteractiveElements, isEnabled, shouldRespectForcePress],
);

@@ -52,6 +52,6 @@

const el: HTMLElement | null = getDraggableRef();
invariant(el, "Cannot get dimension when no ref is set");
invariant(el, 'Cannot get dimension when no ref is set');
return makeDimension(descriptor, el, windowScroll);
},
[descriptor, getDraggableRef]
[descriptor, getDraggableRef],
);

@@ -66,3 +66,3 @@

}),
[descriptor, getDimension, options, uniqueId]
[descriptor, getDimension, options, uniqueId],
);

@@ -69,0 +69,0 @@

6

src/view/use-droppable-publisher/check-for-nested-scroll-container.ts

@@ -1,3 +0,3 @@

import getClosestScrollable from "./get-closest-scrollable";
import { warning } from "../../dev-warning";
import getClosestScrollable from './get-closest-scrollable';
import { warning } from '../../dev-warning';

@@ -12,3 +12,3 @@ // We currently do not support nested scroll containers

const anotherScrollParent: Element | null = getClosestScrollable(
scrollable.parentElement
scrollable.parentElement,
);

@@ -15,0 +15,0 @@

16

src/view/use-droppable-publisher/get-closest-scrollable.ts

@@ -1,4 +0,4 @@

import { invariant } from "../../invariant";
import { warning } from "../../dev-warning";
import getBodyElement from "../get-body-element";
import { invariant } from '../../invariant';
import { warning } from '../../dev-warning';
import getBodyElement from '../get-body-element';

@@ -14,5 +14,5 @@ interface Overflow {

base === value;
const isScroll = isEqual("scroll");
const isAuto = isEqual("auto");
const isVisible = isEqual("visible");
const isScroll = isEqual('scroll');
const isAuto = isEqual('auto');
const isVisible = isEqual('visible');
const isEither = (overflow: Overflow, fn: (value: string) => boolean) =>

@@ -37,3 +37,3 @@ fn(overflow.overflowX) || fn(overflow.overflowY);

// Because we always return false for now, we can skip any actual processing in production
if (process.env.NODE_ENV === "production") {
if (process.env.NODE_ENV === 'production') {
return false;

@@ -69,3 +69,3 @@ }

More information: https://github.com/react-forked/dnd/blob/main/docs/guides/how-we-detect-scroll-containers.md
More information: https://github.com/hello-pangea/dnd/blob/main/docs/guides/how-we-detect-scroll-containers.md
`);

@@ -72,0 +72,0 @@ return false;

16

src/view/use-droppable-publisher/get-dimension.ts

@@ -1,6 +0,6 @@

import { getBox, withScroll, createBox, expand } from "css-box-model";
import type { BoxModel, Position, Spacing } from "css-box-model";
import getDroppableDimension from "../../state/droppable/get-droppable";
import type { Closest } from "../../state/droppable/get-droppable";
import type { Env } from "./get-env";
import { getBox, withScroll, createBox, expand } from 'css-box-model';
import type { BoxModel, Position, Spacing } from 'css-box-model';
import getDroppableDimension from '../../state/droppable/get-droppable';
import type { Closest } from '../../state/droppable/get-droppable';
import type { Env } from './get-env';
import type {

@@ -11,8 +11,8 @@ DroppableDimension,

ScrollSize,
} from "../../types";
import getScroll from "./get-scroll";
} from '../../types';
import getScroll from './get-scroll';
const getClient = (
targetRef: HTMLElement,
closestScrollable?: Element | null
closestScrollable?: Element | null,
): BoxModel => {

@@ -19,0 +19,0 @@ const base: BoxModel = getBox(targetRef);

4

src/view/use-droppable-publisher/get-env.ts

@@ -1,2 +0,2 @@

import getClosestScrollable from "./get-closest-scrollable";
import getClosestScrollable from './get-closest-scrollable';

@@ -16,3 +16,3 @@ export interface Env {

const style: CSSStyleDeclaration = window.getComputedStyle(el);
if (style.position === "fixed") {
if (style.position === 'fixed') {
return true;

@@ -19,0 +19,0 @@ }

2

src/view/use-droppable-publisher/get-listener-options.ts

@@ -1,2 +0,2 @@

import type { ScrollOptions } from "../../types";
import type { ScrollOptions } from '../../types';

@@ -3,0 +3,0 @@ const immediate = {

2

src/view/use-droppable-publisher/get-scroll.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';

@@ -3,0 +3,0 @@ export default (el: Element): Position => ({

2

src/view/use-droppable-publisher/index.ts

@@ -1,1 +0,1 @@

export { default } from "./use-droppable-publisher";
export { default } from './use-droppable-publisher';

2

src/view/use-droppable-publisher/is-in-fixed-container.ts
const isElementFixed = (el: Element): boolean =>
window.getComputedStyle(el).position === "fixed";
window.getComputedStyle(el).position === 'fixed';

@@ -4,0 +4,0 @@ const find = (el?: Element | null): boolean => {

94

src/view/use-droppable-publisher/use-droppable-publisher.ts

@@ -1,17 +0,17 @@

import { useRef } from "react";
import type { Position } from "css-box-model";
import rafSchedule from "raf-schd";
import { useMemo, useCallback } from "use-memo-one";
import memoizeOne from "memoize-one";
import { invariant } from "../../invariant";
import checkForNestedScrollContainers from "./check-for-nested-scroll-container";
import * as dataAttr from "../data-attributes";
import { origin } from "../../state/position";
import getScroll from "./get-scroll";
import { useRef } from 'react';
import type { Position } from 'css-box-model';
import rafSchedule from 'raf-schd';
import { useMemo, useCallback } from 'use-memo-one';
import memoizeOne from 'memoize-one';
import { invariant } from '../../invariant';
import checkForNestedScrollContainers from './check-for-nested-scroll-container';
import * as dataAttr from '../data-attributes';
import { origin } from '../../state/position';
import getScroll from './get-scroll';
import type {
DroppableEntry,
DroppableCallbacks,
} from "../../state/registry/registry-types";
import getEnv from "./get-env";
import type { Env } from "./get-env";
} from '../../state/registry/registry-types';
import getEnv from './get-env';
import type { Env } from './get-env';
import type {

@@ -26,12 +26,12 @@ Id,

DroppableMode,
} from "../../types";
import getDimension from "./get-dimension";
import AppContext from "../context/app-context";
import type { AppContextValue } from "../context/app-context";
import { warning } from "../../dev-warning";
import getListenerOptions from "./get-listener-options";
import useRequiredContext from "../use-required-context";
import usePreviousRef from "../use-previous-ref";
import useLayoutEffect from "../use-isomorphic-layout-effect";
import useUniqueId from "../use-unique-id";
} from '../../types';
import getDimension from './get-dimension';
import AppContext from '../context/app-context';
import type { AppContextValue } from '../context/app-context';
import { warning } from '../../dev-warning';
import getListenerOptions from './get-listener-options';
import useRequiredContext from '../use-required-context';
import usePreviousRef from '../use-previous-ref';
import useLayoutEffect from '../use-isomorphic-layout-effect';
import useUniqueId from '../use-unique-id';

@@ -57,3 +57,3 @@ interface Props {

const getClosestScrollableFromDrag = (
dragging?: WhileDragging | null
dragging?: WhileDragging | null,
): HTMLElement | null => (dragging && dragging.env.closestScrollable) || null;

@@ -64,3 +64,3 @@

const appContext: AppContextValue = useRequiredContext(AppContext);
const uniqueId: Id = useUniqueId("droppable");
const uniqueId: Id = useUniqueId('droppable');
const { registry, marshal } = appContext;

@@ -75,3 +75,3 @@ const previousRef = usePreviousRef(args);

}),
[args.droppableId, args.mode, args.type]
[args.droppableId, args.mode, args.type],
);

@@ -85,3 +85,3 @@ const publishedDescriptorRef = useRef<DroppableDescriptor>(descriptor);

whileDraggingRef.current,
"Can only update scroll when dragging"
'Can only update scroll when dragging',
);

@@ -91,3 +91,3 @@ const scroll: Position = { x, y };

}),
[descriptor.id, marshal]
[descriptor.id, marshal],
);

@@ -112,3 +112,3 @@

() => rafSchedule(updateScroll),
[updateScroll]
[updateScroll],
);

@@ -122,3 +122,3 @@

dragging && closest,
"Could not find scroll options while scrolling"
'Could not find scroll options while scrolling',
);

@@ -137,7 +137,7 @@ const options: ScrollOptions = dragging.scrollOptions;

!whileDraggingRef.current,
"Cannot collect a droppable while a drag is occurring"
'Cannot collect a droppable while a drag is occurring',
);
const previous: Props = previousRef.current;
const ref: HTMLElement | null = previous.getDroppableRef();
invariant(ref, "Cannot collect without a droppable ref");
invariant(ref, 'Cannot collect without a droppable ref');
const env: Env = getEnv(ref);

@@ -170,3 +170,3 @@

dataAttr.scrollContainer.contextId,
appContext.contextId
appContext.contextId,
);

@@ -176,8 +176,8 @@

scrollable.addEventListener(
"scroll",
'scroll',
onClosestScroll,
getListenerOptions(dragging.scrollOptions)
getListenerOptions(dragging.scrollOptions),
);
// print a debug warning if using an unsupported nested scroll container setup
if (process.env.NODE_ENV !== "production") {
if (process.env.NODE_ENV !== 'production') {
checkForNestedScrollContainers(scrollable);

@@ -189,3 +189,3 @@ }

},
[appContext.contextId, descriptor, onClosestScroll, previousRef]
[appContext.contextId, descriptor, onClosestScroll, previousRef],
);

@@ -198,3 +198,3 @@

dragging && closest,
"Can only recollect Droppable client for Droppables that have a scroll container"
'Can only recollect Droppable client for Droppables that have a scroll container',
);

@@ -207,3 +207,3 @@

const dragging: WhileDragging | null = whileDraggingRef.current;
invariant(dragging, "Cannot stop drag when no active drag");
invariant(dragging, 'Cannot stop drag when no active drag');
const closest = getClosestScrollableFromDrag(dragging);

@@ -222,7 +222,7 @@

closest.removeEventListener(
"scroll",
'scroll',
onClosestScroll,
// See: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/removeEventListener
// eslint-disable-next-line @typescript-eslint/no-explicit-any
getListenerOptions(dragging.scrollOptions) as any
getListenerOptions(dragging.scrollOptions) as any,
);

@@ -234,5 +234,5 @@ }, [onClosestScroll, scheduleScrollUpdate]);

const dragging: WhileDragging | null = whileDraggingRef.current;
invariant(dragging, "Cannot scroll when there is no drag");
invariant(dragging, 'Cannot scroll when there is no drag');
const closest: Element | null = getClosestScrollableFromDrag(dragging);
invariant(closest, "Cannot scroll a droppable with no closest scrollable");
invariant(closest, 'Cannot scroll a droppable with no closest scrollable');

@@ -259,3 +259,3 @@ // act

}),
[callbacks, descriptor, uniqueId]
[callbacks, descriptor, uniqueId],
);

@@ -273,3 +273,3 @@

warning(
"Unsupported: changing the droppableId or type of a Droppable during a drag"
'Unsupported: changing the droppableId or type of a Droppable during a drag',
);

@@ -291,3 +291,3 @@ dragStopped();

publishedDescriptorRef.current.id,
!args.isDropDisabled
!args.isDropDisabled,
);

@@ -304,5 +304,5 @@ }, [args.isDropDisabled, marshal]);

publishedDescriptorRef.current.id,
args.isCombineEnabled
args.isCombineEnabled,
);
}, [args.isCombineEnabled, marshal]);
}

2

src/view/use-focus-marshal/focus-marshal-types.ts

@@ -1,2 +0,2 @@

import type { DraggableId } from "../../types";
import type { DraggableId } from '../../types';

@@ -3,0 +3,0 @@ export type Unregister = () => void;

2

src/view/use-focus-marshal/index.ts

@@ -1,1 +0,1 @@

export { default } from "./use-focus-marshal";
export { default } from './use-focus-marshal';

26

src/view/use-focus-marshal/use-focus-marshal.ts

@@ -1,8 +0,8 @@

import { useRef } from "react";
import { useMemo, useCallback } from "use-memo-one";
import type { DraggableId, ContextId } from "../../types";
import type { FocusMarshal, Unregister } from "./focus-marshal-types";
import { dragHandle as dragHandleAttr } from "../data-attributes";
import useLayoutEffect from "../use-isomorphic-layout-effect";
import findDragHandle from "../get-elements/find-drag-handle";
import { useRef } from 'react';
import { useMemo, useCallback } from 'use-memo-one';
import type { DraggableId, ContextId } from '../../types';
import type { FocusMarshal, Unregister } from './focus-marshal-types';
import { dragHandle as dragHandleAttr } from '../data-attributes';
import useLayoutEffect from '../use-isomorphic-layout-effect';
import findDragHandle from '../get-elements/find-drag-handle';

@@ -26,3 +26,3 @@ interface Entry {

id: DraggableId,
focus: () => void
focus: () => void,
): Unregister {

@@ -47,3 +47,3 @@ const entry: Entry = { id, focus };

contextId,
tryGiveFocusTo
tryGiveFocusTo,
);

@@ -55,3 +55,3 @@

},
[contextId]
[contextId],
);

@@ -61,3 +61,3 @@

previous: DraggableId,
redirectTo: DraggableId
redirectTo: DraggableId,
) {

@@ -91,3 +91,3 @@ if (recordRef.current === previous) {

},
[tryGiveFocus]
[tryGiveFocus],
);

@@ -132,3 +132,3 @@

}),
[register, tryRecordFocus, tryRestoreFocusRecorded, tryShiftRecord]
[register, tryRecordFocus, tryRestoreFocusRecorded, tryShiftRecord],
);

@@ -135,0 +135,0 @@

2

src/view/use-hidden-text-element/index.ts

@@ -1,1 +0,1 @@

export { default } from "./use-hidden-text-element";
export { default } from './use-hidden-text-element';

20

src/view/use-hidden-text-element/use-hidden-text-element.ts

@@ -1,6 +0,6 @@

import { useEffect } from "react";
import { useMemo } from "use-memo-one";
import type { ContextId, ElementId } from "../../types";
import getBodyElement from "../get-body-element";
import useUniqueId from "../use-unique-id";
import { useEffect } from 'react';
import { useMemo } from 'use-memo-one';
import type { ContextId, ElementId } from '../../types';
import getBodyElement from '../get-body-element';
import useUniqueId from '../use-unique-id';

@@ -25,6 +25,6 @@ interface GetIdArgs {

}: Args): ElementId {
const uniqueId: string = useUniqueId("hidden-text", { separator: "-" });
const uniqueId: string = useUniqueId('hidden-text', { separator: '-' });
const id: ElementId = useMemo(
() => getElementId({ contextId, uniqueId }),
[uniqueId, contextId]
[uniqueId, contextId],
);

@@ -34,3 +34,3 @@

function mount() {
const el: HTMLElement = document.createElement("div");
const el: HTMLElement = document.createElement('div');

@@ -44,3 +44,3 @@ // identifier

// Using `display: none` prevent screen readers from reading this element in the document flow
el.style.display = "none";
el.style.display = 'none';

@@ -58,3 +58,3 @@ // Add to body

},
[id, text]
[id, text],
);

@@ -61,0 +61,0 @@

8

src/view/use-isomorphic-layout-effect.ts
// eslint-disable-next-line no-restricted-imports
import { useLayoutEffect, useEffect } from "react";
import { useLayoutEffect, useEffect } from 'react';

@@ -11,5 +11,5 @@ // https://github.com/reduxjs/react-redux/blob/v7-beta/src/components/connectAdvanced.js#L35

const useIsomorphicLayoutEffect =
typeof window !== "undefined" &&
typeof window.document !== "undefined" &&
typeof window.document.createElement !== "undefined"
typeof window !== 'undefined' &&
typeof window.document !== 'undefined' &&
typeof window.document.createElement !== 'undefined'
? useLayoutEffect

@@ -16,0 +16,0 @@ : useEffect;

2

src/view/use-previous-ref.ts

@@ -1,2 +0,2 @@

import { useRef, useEffect } from "react";
import { useRef, useEffect } from 'react';

@@ -3,0 +3,0 @@ export default function usePrevious<T>(current: T): {

10

src/view/use-required-context.ts

@@ -1,11 +0,11 @@

import { useContext } from "react";
import type { Context as ContextType } from "react";
import { invariant } from "../invariant";
import { useContext } from 'react';
import type { Context as ContextType } from 'react';
import { invariant } from '../invariant';
export default function useRequiredContext<T>(
Context: ContextType<T | null>
Context: ContextType<T | null>,
): T {
const result: T | null = useContext(Context);
invariant(result, "Could not find required context");
invariant(result, 'Could not find required context');
return result;
}

16

src/view/use-sensor-marshal/closest.ts
const supportedMatchesName:
| "matches"
| "msMatchesSelector"
| "webkitMatchesSelector" = (() => {
const base = "matches" as const;
| 'matches'
| 'msMatchesSelector'
| 'webkitMatchesSelector' = (() => {
const base = 'matches' as const;
// Server side rendering
if (typeof document === "undefined") {
if (typeof document === 'undefined') {
return base;

@@ -15,4 +15,4 @@ }

base,
"msMatchesSelector" as const,
"webkitMatchesSelector" as const,
'msMatchesSelector' as const,
'webkitMatchesSelector' as const,
];

@@ -32,3 +32,3 @@

// https://caniuse.com/#feat=matchesselector
if (el[supportedMatchesName as "matches"](selector)) {
if (el[supportedMatchesName as 'matches'](selector)) {
return el;

@@ -35,0 +35,0 @@ }

22

src/view/use-sensor-marshal/find-closest-draggable-id-from-event.ts

@@ -1,7 +0,7 @@

import type { ContextId, DraggableId } from "../../types";
import * as attributes from "../data-attributes";
import isElement from "../is-type-of-element/is-element";
import isHtmlElement from "../is-type-of-element/is-html-element";
import closest from "./closest";
import { warning } from "../../dev-warning";
import type { ContextId, DraggableId } from '../../types';
import * as attributes from '../data-attributes';
import isElement from '../is-type-of-element/is-element';
import isHtmlElement from '../is-type-of-element/is-html-element';
import closest from './closest';
import { warning } from '../../dev-warning';

@@ -14,3 +14,3 @@ function getSelector(contextId: ContextId): string {

contextId: ContextId,
event: Event
event: Event,
): Element | null {

@@ -20,3 +20,3 @@ const target = event.target;

if (!isElement(target)) {
warning("event.target must be a Element");
warning('event.target must be a Element');
return null;

@@ -33,3 +33,3 @@ }

if (!isHtmlElement(handle)) {
warning("drag handle must be a HTMLElement");
warning('drag handle must be a HTMLElement');
return null;

@@ -43,7 +43,7 @@ }

contextId: ContextId,
event: Event
event: Event,
): DraggableId | null {
const handle: Element | null = findClosestDragHandleFromEvent(
contextId,
event
event,
);

@@ -50,0 +50,0 @@

8

src/view/use-sensor-marshal/index.ts

@@ -1,4 +0,4 @@

export { default } from "./use-sensor-marshal";
export { default as useMouseSensor } from "./sensors/use-mouse-sensor";
export { default as useTouchSensor } from "./sensors/use-touch-sensor";
export { default as useKeyboardSensor } from "./sensors/use-keyboard-sensor";
export { default } from './use-sensor-marshal';
export { default as useMouseSensor } from './sensors/use-mouse-sensor';
export { default as useTouchSensor } from './sensors/use-touch-sensor';
export { default as useKeyboardSensor } from './sensors/use-keyboard-sensor';

26

src/view/use-sensor-marshal/is-event-in-interactive-element.ts

@@ -1,2 +0,2 @@

import isHtmlElement from "../is-type-of-element/is-html-element";
import isHtmlElement from '../is-type-of-element/is-html-element';

@@ -7,10 +7,10 @@ export type InteractiveTagNames = typeof interactiveTagNames;

export const interactiveTagNames = [
"input",
"button",
"textarea",
"select",
"option",
"optgroup",
"video",
"audio",
'input',
'button',
'textarea',
'select',
'option',
'optgroup',
'video',
'audio',
] as const;

@@ -20,3 +20,3 @@

parent: Element,
current?: Element | null
current?: Element | null,
): boolean {

@@ -44,4 +44,4 @@ if (current == null) {

// https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/contenteditable
const attribute: string | null = current.getAttribute("contenteditable");
if (attribute === "true" || attribute === "") {
const attribute: string | null = current.getAttribute('contenteditable');
if (attribute === 'true' || attribute === '') {
return true;

@@ -61,3 +61,3 @@ }

draggable: Element,
event: Event
event: Event,
): boolean {

@@ -64,0 +64,0 @@ const target = event.target;

6

src/view/use-sensor-marshal/lock.ts

@@ -1,2 +0,2 @@

import { invariant } from "../../invariant";
import { invariant } from '../../invariant';

@@ -27,3 +27,3 @@ export interface Lock {

function claim(abandon: () => void): Lock {
invariant(!lock, "Cannot claim lock as it is already claimed");
invariant(!lock, 'Cannot claim lock as it is already claimed');
const newLock: Lock = { abandon };

@@ -36,3 +36,3 @@ // update singleton

function release() {
invariant(lock, "Cannot release lock when there is no lock");
invariant(lock, 'Cannot release lock when there is no lock');
lock = null;

@@ -39,0 +39,0 @@ }

52

src/view/use-sensor-marshal/sensors/use-keyboard-sensor.ts

@@ -1,4 +0,4 @@

import { useRef } from "react";
import { useMemo, useCallback } from "use-memo-one";
import { invariant } from "../../../invariant";
import { useRef } from 'react';
import { useMemo, useCallback } from 'use-memo-one';
import { invariant } from '../../../invariant';
import type {

@@ -9,3 +9,3 @@ SensorAPI,

DraggableId,
} from "../../../types";
} from '../../../types';
import type {

@@ -15,8 +15,8 @@ KeyboardEventBinding,

EventOptions,
} from "../../event-bindings/event-types";
import * as keyCodes from "../../key-codes";
import bindEvents from "../../event-bindings/bind-events";
import preventStandardKeyEvents from "./util/prevent-standard-key-events";
import supportedPageVisibilityEventName from "./util/supported-page-visibility-event-name";
import useLayoutEffect from "../../use-isomorphic-layout-effect";
} from '../../event-bindings/event-types';
import * as keyCodes from '../../key-codes';
import bindEvents from '../../event-bindings/bind-events';
import preventStandardKeyEvents from './util/prevent-standard-key-events';
import supportedPageVisibilityEventName from './util/supported-page-visibility-event-name';
import useLayoutEffect from '../../use-isomorphic-layout-effect';

@@ -38,3 +38,3 @@ function noop() {}

actions: SnapDragActions,
stop: () => void
stop: () => void,
): AnyEventBinding[] {

@@ -53,3 +53,3 @@ function cancel() {

{
eventName: "keydown",
eventName: 'keydown',
fn: (event: KeyboardEvent) => {

@@ -107,15 +107,15 @@ if (event.keyCode === keyCodes.escape) {

{
eventName: "mousedown",
eventName: 'mousedown',
fn: cancel,
},
{
eventName: "mouseup",
eventName: 'mouseup',
fn: cancel,
},
{
eventName: "click",
eventName: 'click',
fn: cancel,
},
{
eventName: "touchstart",
eventName: 'touchstart',
fn: cancel,

@@ -125,3 +125,3 @@ },

{
eventName: "resize",
eventName: 'resize',
fn: cancel,

@@ -132,3 +132,3 @@ },

{
eventName: "wheel",
eventName: 'wheel',
fn: cancel,

@@ -153,3 +153,3 @@ // chrome says it is a violation for this to not be passive

() => ({
eventName: "keydown",
eventName: 'keydown',
fn: function onKeyDown(event: KeyboardEvent) {

@@ -178,3 +178,3 @@ // Event already used

stop,
{ sourceEvent: event }
{ sourceEvent: event },
);

@@ -202,3 +202,3 @@

isCapturing,
"Cannot stop capturing a keyboard drag when not capturing"
'Cannot stop capturing a keyboard drag when not capturing',
);

@@ -218,3 +218,3 @@ isCapturing = false;

getDraggingBindings(actions, stop),
{ capture: true, passive: false }
{ capture: true, passive: false },
);

@@ -225,3 +225,3 @@ },

// eslint-disable-next-line react-hooks/exhaustive-deps
[api]
[api],
);

@@ -239,6 +239,6 @@

[startCaptureBinding],
options
options,
);
},
[startCaptureBinding]
[startCaptureBinding],
);

@@ -255,4 +255,4 @@

},
[listenForCapture]
[listenForCapture],
);
}

96

src/view/use-sensor-marshal/sensors/use-mouse-sensor.ts

@@ -1,5 +0,5 @@

import { useRef } from "react";
import { useCallback, useMemo } from "use-memo-one";
import type { Position } from "css-box-model";
import { invariant } from "../../../invariant";
import { useRef } from 'react';
import { useCallback, useMemo } from 'use-memo-one';
import type { Position } from 'css-box-model';
import { invariant } from '../../../invariant';
import type {

@@ -11,3 +11,3 @@ PreDragActions,

DraggableOptions,
} from "../../../types";
} from '../../../types';
import type {

@@ -18,9 +18,9 @@ AnyEventBinding,

MouseEventBinding,
} from "../../event-bindings/event-types";
import bindEvents from "../../event-bindings/bind-events";
import * as keyCodes from "../../key-codes";
import preventStandardKeyEvents from "./util/prevent-standard-key-events";
import supportedPageVisibilityEventName from "./util/supported-page-visibility-event-name";
import useLayoutEffect from "../../use-isomorphic-layout-effect";
import { noop } from "../../../empty";
} from '../../event-bindings/event-types';
import bindEvents from '../../event-bindings/bind-events';
import * as keyCodes from '../../key-codes';
import preventStandardKeyEvents from './util/prevent-standard-key-events';
import supportedPageVisibilityEventName from './util/supported-page-visibility-event-name';
import useLayoutEffect from '../../use-isomorphic-layout-effect';
import { noop } from '../../../empty';

@@ -33,3 +33,3 @@ // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button

original: Position,
current: Position
current: Position,
): boolean {

@@ -43,7 +43,7 @@ return (

interface Idle {
type: "IDLE";
type: 'IDLE';
}
interface Pending {
type: "PENDING";
type: 'PENDING';
point: Position;

@@ -54,3 +54,3 @@ actions: PreDragActions;

interface Dragging {
type: "DRAGGING";
type: 'DRAGGING';
actions: FluidDragActions;

@@ -61,3 +61,3 @@ }

const idle: Idle = { type: "IDLE" };
const idle: Idle = { type: 'IDLE' };

@@ -79,3 +79,3 @@ interface GetCaptureArgs {

{
eventName: "mousemove",
eventName: 'mousemove',
fn: (event: MouseEvent) => {

@@ -95,3 +95,3 @@ const { button, clientX, clientY } = event;

// Already dragging
if (phase.type === "DRAGGING") {
if (phase.type === 'DRAGGING') {
// preventing default as we are using this event

@@ -104,3 +104,3 @@ event.preventDefault();

// There should be a pending drag at this point
invariant(phase.type === "PENDING", "Cannot be IDLE");
invariant(phase.type === 'PENDING', 'Cannot be IDLE');
const pending: Position = phase.point;

@@ -121,3 +121,3 @@

setPhase({
type: "DRAGGING",
type: 'DRAGGING',
actions,

@@ -128,7 +128,7 @@ });

{
eventName: "mouseup",
eventName: 'mouseup',
fn: (event: MouseEvent) => {
const phase: Phase = getPhase();
if (phase.type !== "DRAGGING") {
if (phase.type !== 'DRAGGING') {
cancel();

@@ -145,7 +145,7 @@ return;

{
eventName: "mousedown",
eventName: 'mousedown',
fn: (event: MouseEvent) => {
// this can happen during a drag when the user clicks a button
// other than the primary mouse button
if (getPhase().type === "DRAGGING") {
if (getPhase().type === 'DRAGGING') {
event.preventDefault();

@@ -158,7 +158,7 @@ }

{
eventName: "keydown",
eventName: 'keydown',
fn: (event: KeyboardEvent) => {
const phase: Phase = getPhase();
// Abort if any keystrokes while a drag is pending
if (phase.type === "PENDING") {
if (phase.type === 'PENDING') {
cancel();

@@ -179,11 +179,11 @@ return;

{
eventName: "resize",
eventName: 'resize',
fn: cancel,
},
{
eventName: "scroll",
eventName: 'scroll',
// kill a pending drag if there is a window scroll
options: { passive: true, capture: false },
fn: () => {
if (getPhase().type === "PENDING") {
if (getPhase().type === 'PENDING') {
cancel();

@@ -198,3 +198,3 @@ }

{
eventName: "webkitmouseforcedown",
eventName: 'webkitmouseforcedown',
// it is considered a indirect cancel so we do not

@@ -204,3 +204,3 @@ // prevent default in any situation.

const phase: Phase = getPhase();
invariant(phase.type !== "IDLE", "Unexpected phase");
invariant(phase.type !== 'IDLE', 'Unexpected phase');

@@ -233,3 +233,3 @@ if (phase.actions.shouldRespectForcePress()) {

() => ({
eventName: "mousedown",
eventName: 'mousedown',
fn: function onMouseDown(event: MouseEvent) {

@@ -262,3 +262,3 @@ // Event already used

stop,
{ sourceEvent: event }
{ sourceEvent: event },
);

@@ -287,3 +287,3 @@

// eslint-disable-next-line react-hooks/exhaustive-deps
[api]
[api],
);

@@ -293,3 +293,3 @@

() => ({
eventName: "webkitmouseforcewillbegin",
eventName: 'webkitmouseforcewillbegin',
fn: (event: Event) => {

@@ -324,3 +324,3 @@ if (event.defaultPrevented) {

}),
[api]
[api],
);

@@ -338,6 +338,6 @@

[preventForcePressBinding, startCaptureBinding],
options
options,
);
},
[preventForcePressBinding, startCaptureBinding]
[preventForcePressBinding, startCaptureBinding],
);

@@ -347,3 +347,3 @@

const current: Phase = phaseRef.current;
if (current.type === "IDLE") {
if (current.type === 'IDLE') {
return;

@@ -361,6 +361,6 @@ }

stop();
if (phase.type === "DRAGGING") {
if (phase.type === 'DRAGGING') {
phase.actions.cancel({ shouldBlockNextClick: true });
}
if (phase.type === "PENDING") {
if (phase.type === 'PENDING') {
phase.actions.abort();

@@ -384,3 +384,3 @@ }

},
[cancel, stop]
[cancel, stop],
);

@@ -391,7 +391,7 @@

invariant(
phaseRef.current.type === "IDLE",
"Expected to move from IDLE to PENDING drag"
phaseRef.current.type === 'IDLE',
'Expected to move from IDLE to PENDING drag',
);
phaseRef.current = {
type: "PENDING",
type: 'PENDING',
point,

@@ -402,3 +402,3 @@ actions,

},
[bindCapturingEvents]
[bindCapturingEvents],
);

@@ -415,4 +415,4 @@

},
[listenForCapture]
[listenForCapture],
);
}

102

src/view/use-sensor-marshal/sensors/use-touch-sensor.ts

@@ -1,5 +0,5 @@

import { useRef } from "react";
import { useCallback, useMemo } from "use-memo-one";
import type { Position } from "css-box-model";
import { invariant } from "../../../invariant";
import { useRef } from 'react';
import { useCallback, useMemo } from 'use-memo-one';
import type { Position } from 'css-box-model';
import { invariant } from '../../../invariant';
import type {

@@ -10,3 +10,3 @@ DraggableId,

FluidDragActions,
} from "../../../types";
} from '../../../types';
import type {

@@ -16,8 +16,8 @@ AnyEventBinding,

TouchEventBinding,
} from "../../event-bindings/event-types";
import bindEvents from "../../event-bindings/bind-events";
import * as keyCodes from "../../key-codes";
import supportedPageVisibilityEventName from "./util/supported-page-visibility-event-name";
import { noop } from "../../../empty";
import useLayoutEffect from "../../use-isomorphic-layout-effect";
} from '../../event-bindings/event-types';
import bindEvents from '../../event-bindings/bind-events';
import * as keyCodes from '../../key-codes';
import supportedPageVisibilityEventName from './util/supported-page-visibility-event-name';
import { noop } from '../../../empty';
import useLayoutEffect from '../../use-isomorphic-layout-effect';

@@ -29,7 +29,7 @@ type TouchWithForce = Touch & {

interface Idle {
type: "IDLE";
type: 'IDLE';
}
interface Pending {
type: "PENDING";
type: 'PENDING';
point: Position;

@@ -41,3 +41,3 @@ actions: PreDragActions;

interface Dragging {
type: "DRAGGING";
type: 'DRAGGING';
actions: FluidDragActions;

@@ -49,3 +49,3 @@ hasMoved: boolean;

const idle: Idle = { type: "IDLE" };
const idle: Idle = { type: 'IDLE' };
// Decreased from 150 as a work around for an issue for forcepress on iOS

@@ -70,3 +70,3 @@ // https://github.com/atlassian/react-beautiful-dnd/issues/1401

{
eventName: "orientationchange",
eventName: 'orientationchange',
fn: cancel,

@@ -76,3 +76,3 @@ },

{
eventName: "resize",
eventName: 'resize',
fn: cancel,

@@ -83,3 +83,3 @@ },

{
eventName: "contextmenu",
eventName: 'contextmenu',
fn: (event: Event) => {

@@ -93,5 +93,5 @@ // always opting out of context menu events

{
eventName: "keydown",
eventName: 'keydown',
fn: (event: KeyboardEvent) => {
if (getPhase().type !== "DRAGGING") {
if (getPhase().type !== 'DRAGGING') {
cancel();

@@ -128,3 +128,3 @@ return;

{
eventName: "touchmove",
eventName: 'touchmove',
// Opting out of passive touchmove (default) so as to prevent scrolling while moving

@@ -137,3 +137,3 @@ // Not worried about performance as effect of move is throttled in requestAnimationFrame

// Drag has not yet started and we are waiting for a long press.
if (phase.type !== "DRAGGING") {
if (phase.type !== 'DRAGGING') {
cancel();

@@ -161,7 +161,7 @@ return;

{
eventName: "touchend",
eventName: 'touchend',
fn: (event: TouchEvent) => {
const phase: Phase = getPhase();
// drag had not started yet - do not prevent the default action
if (phase.type !== "DRAGGING") {
if (phase.type !== 'DRAGGING') {
cancel();

@@ -178,6 +178,6 @@ return;

{
eventName: "touchcancel",
eventName: 'touchcancel',
fn: (event: TouchEvent) => {
// drag had not started yet - do not prevent the default action
if (getPhase().type !== "DRAGGING") {
if (getPhase().type !== 'DRAGGING') {
cancel();

@@ -196,3 +196,3 @@ return;

{
eventName: "touchforcechange",
eventName: 'touchforcechange',
fn: (event: TouchEvent) => {

@@ -202,3 +202,3 @@ const phase: Phase = getPhase();

// needed to use phase.actions
invariant(phase.type !== "IDLE");
invariant(phase.type !== 'IDLE');

@@ -224,3 +224,3 @@ // This is not fantastic logic, but it is done to account for

if (phase.type === "PENDING") {
if (phase.type === 'PENDING') {
if (shouldRespect) {

@@ -276,3 +276,3 @@ cancel();

() => ({
eventName: "touchstart",
eventName: 'touchstart',
fn: function onTouchStart(event: TouchEvent) {

@@ -299,3 +299,3 @@ // Event already used by something else

stop,
{ sourceEvent: event }
{ sourceEvent: event },
);

@@ -324,3 +324,3 @@

// eslint-disable-next-line react-hooks/exhaustive-deps
[api]
[api],
);

@@ -338,6 +338,6 @@

[startCaptureBinding],
options
options,
);
},
[startCaptureBinding]
[startCaptureBinding],
);

@@ -347,3 +347,3 @@

const current: Phase = phaseRef.current;
if (current.type === "IDLE") {
if (current.type === 'IDLE') {
return;

@@ -353,3 +353,3 @@ }

// aborting any pending drag
if (current.type === "PENDING") {
if (current.type === 'PENDING') {
clearTimeout(current.longPressTimerId);

@@ -367,6 +367,6 @@ }

stop();
if (phase.type === "DRAGGING") {
if (phase.type === 'DRAGGING') {
phase.actions.cancel({ shouldBlockNextClick: true });
}
if (phase.type === "PENDING") {
if (phase.type === 'PENDING') {
phase.actions.abort();

@@ -401,3 +401,3 @@ }

},
[cancel, getPhase, stop]
[cancel, getPhase, stop],
);

@@ -409,4 +409,4 @@

invariant(
phase.type === "PENDING",
`Cannot start dragging from phase ${phase.type}`
phase.type === 'PENDING',
`Cannot start dragging from phase ${phase.type}`,
);

@@ -417,3 +417,3 @@

setPhase({
type: "DRAGGING",
type: 'DRAGGING',
actions,

@@ -423,3 +423,3 @@ hasMoved: false,

},
[getPhase, setPhase]
[getPhase, setPhase],
);

@@ -430,4 +430,4 @@

invariant(
getPhase().type === "IDLE",
"Expected to move from IDLE to PENDING drag"
getPhase().type === 'IDLE',
'Expected to move from IDLE to PENDING drag',
);

@@ -437,7 +437,7 @@

startDragging,
timeForLongPress
timeForLongPress,
);
setPhase({
type: "PENDING",
type: 'PENDING',
point,

@@ -450,3 +450,3 @@ actions,

},
[bindCapturingEvents, getPhase, setPhase, startDragging]
[bindCapturingEvents, getPhase, setPhase, startDragging],
);

@@ -464,3 +464,3 @@

const phase: Phase = getPhase();
if (phase.type === "PENDING") {
if (phase.type === 'PENDING') {
clearTimeout(phase.longPressTimerId);

@@ -471,3 +471,3 @@ setPhase(idle);

},
[getPhase, listenForCapture, setPhase]
[getPhase, listenForCapture, setPhase],
);

@@ -483,3 +483,3 @@

{
eventName: "touchmove",
eventName: 'touchmove',
// using a new noop function for each usage as a single `removeEventListener()`

@@ -486,0 +486,0 @@ // call will remove all handlers with the same reference

2

src/view/use-sensor-marshal/sensors/util/prevent-standard-key-events.ts

@@ -1,2 +0,2 @@

import * as keyCodes from "../../../key-codes";
import * as keyCodes from '../../../key-codes';

@@ -3,0 +3,0 @@ interface KeyMap {

6

src/view/use-sensor-marshal/sensors/util/supported-page-visibility-event-name.ts
const supportedEventName: string = ((): string => {
const base = "visibilitychange";
const base = 'visibilitychange';
// Server side rendering
if (typeof document === "undefined") {
if (typeof document === 'undefined') {
return base;

@@ -19,3 +19,3 @@ }

const supported = candidates.find(
(eventName: string): boolean => `on${eventName}` in document
(eventName: string): boolean => `on${eventName}` in document,
);

@@ -22,0 +22,0 @@

104

src/view/use-sensor-marshal/use-sensor-marshal.ts

@@ -1,6 +0,6 @@

import rafSchd from "raf-schd";
import { useState } from "react";
import { useCallback, useMemo } from "use-memo-one";
import type { Position } from "css-box-model";
import { invariant } from "../../invariant";
import rafSchd from 'raf-schd';
import { useState } from 'react';
import { useCallback, useMemo } from 'use-memo-one';
import type { Position } from 'css-box-model';
import { invariant } from '../../invariant';
import type {

@@ -19,7 +19,7 @@ ContextId,

DraggableOptions,
} from "../../types";
import create from "./lock";
import type { Lock, LockAPI } from "./lock";
import type { Store, Action } from "../../state/store-types";
import canStartDrag from "../../state/can-start-drag";
} from '../../types';
import create from './lock';
import type { Lock, LockAPI } from './lock';
import type { Store, Action } from '../../state/store-types';
import canStartDrag from '../../state/can-start-drag';
import {

@@ -34,21 +34,21 @@ move as moveAction,

flush,
} from "../../state/action-creators";
import type { LiftArgs as LiftActionArgs } from "../../state/action-creators";
import isDragging from "../../state/is-dragging";
} from '../../state/action-creators';
import type { LiftArgs as LiftActionArgs } from '../../state/action-creators';
import isDragging from '../../state/is-dragging';
import type {
Registry,
DraggableEntry,
} from "../../state/registry/registry-types";
import useMouseSensor from "./sensors/use-mouse-sensor";
import useKeyboardSensor from "./sensors/use-keyboard-sensor";
import useTouchSensor from "./sensors/use-touch-sensor";
import useValidateSensorHooks from "./use-validate-sensor-hooks";
import isEventInInteractiveElement from "./is-event-in-interactive-element";
import getBorderBoxCenterPosition from "../get-border-box-center-position";
import { warning } from "../../dev-warning";
import useLayoutEffect from "../use-isomorphic-layout-effect";
import { noop } from "../../empty";
import findClosestDraggableIdFromEvent from "./find-closest-draggable-id-from-event";
import findDraggable from "../get-elements/find-draggable";
import bindEvents from "../event-bindings/bind-events";
} from '../../state/registry/registry-types';
import useMouseSensor from './sensors/use-mouse-sensor';
import useKeyboardSensor from './sensors/use-keyboard-sensor';
import useTouchSensor from './sensors/use-touch-sensor';
import useValidateSensorHooks from './use-validate-sensor-hooks';
import isEventInInteractiveElement from './is-event-in-interactive-element';
import getBorderBoxCenterPosition from '../get-border-box-center-position';
import { warning } from '../../dev-warning';
import useLayoutEffect from '../use-isomorphic-layout-effect';
import { noop } from '../../empty';
import findClosestDraggableIdFromEvent from './find-closest-draggable-id-from-event';
import findDraggable from '../get-elements/find-draggable';
import bindEvents from '../event-bindings/bind-events';

@@ -59,3 +59,3 @@ function preventDefault(event: Event) {

type LockPhase = "PRE_DRAG" | "DRAGGING" | "COMPLETED";
type LockPhase = 'PRE_DRAG' | 'DRAGGING' | 'COMPLETED';

@@ -197,3 +197,3 @@ interface IsActiveArgs {

const lock: Lock = lockAPI.claim(forceSensorStop || noop);
let phase: LockPhase = "PRE_DRAG";
let phase: LockPhase = 'PRE_DRAG';

@@ -215,3 +215,3 @@ function getShouldRespectForcePress(): boolean {

const tryDispatchWhenDragging = tryDispatch.bind(null, "DRAGGING");
const tryDispatchWhenDragging = tryDispatch.bind(null, 'DRAGGING');

@@ -227,6 +227,6 @@ interface LiftArgs {

lockAPI.release();
phase = "COMPLETED";
phase = 'COMPLETED';
}
// Double lift = bad
if (phase !== "PRE_DRAG") {
if (phase !== 'PRE_DRAG') {
completed();

@@ -239,7 +239,7 @@ invariant(false, `Cannot lift in phase ${phase}`);

// We are now in the DRAGGING phase
phase = "DRAGGING";
phase = 'DRAGGING';
function finish(
reason: "CANCEL" | "DROP",
options: StopDragOptions = { shouldBlockNextClick: false }
reason: 'CANCEL' | 'DROP',
options: StopDragOptions = { shouldBlockNextClick: false },
) {

@@ -252,3 +252,3 @@ args.cleanup();

{
eventName: "click",
eventName: 'click',
fn: preventDefault,

@@ -277,3 +277,3 @@ options: {

isActive({
expected: "DRAGGING",
expected: 'DRAGGING',
phase,

@@ -285,4 +285,4 @@ isLockActive,

shouldRespectForcePress: getShouldRespectForcePress,
drop: (options?: StopDragOptions) => finish("DROP", options),
cancel: (options?: StopDragOptions) => finish("CANCEL", options),
drop: (options?: StopDragOptions) => finish('DROP', options),
cancel: (options?: StopDragOptions) => finish('CANCEL', options),
...args.actions,

@@ -301,3 +301,3 @@ };

clientSelection,
movementMode: "FLUID",
movementMode: 'FLUID',
},

@@ -326,3 +326,3 @@ cleanup: () => move.cancel(),

clientSelection: getBorderBoxCenterPosition(el as HTMLElement),
movementMode: "SNAP",
movementMode: 'SNAP',
},

@@ -336,3 +336,3 @@ cleanup: noop,

const shouldRelease: boolean = isActive({
expected: "PRE_DRAG",
expected: 'PRE_DRAG',
phase,

@@ -351,3 +351,3 @@ isLockActive,

isActive({
expected: "PRE_DRAG",
expected: 'PRE_DRAG',
phase,

@@ -401,3 +401,3 @@ isLockActive,

},
[lockAPI]
[lockAPI],
);

@@ -418,3 +418,3 @@

},
[lockAPI, store, tryAbandonLock]
[lockAPI, store, tryAbandonLock],
);

@@ -436,3 +436,3 @@

},
[lockAPI, registry, store]
[lockAPI, registry, store],
);

@@ -444,3 +444,3 @@

forceStop?: () => void,
options?: TryGetLockOptions
options?: TryGetLockOptions,
): PreDragActions | null =>

@@ -457,3 +457,3 @@ tryStart({

}),
[contextId, lockAPI, registry, store]
[contextId, lockAPI, registry, store],
);

@@ -464,3 +464,3 @@

findClosestDraggableIdFromEvent(contextId, event),
[contextId]
[contextId],
);

@@ -473,3 +473,3 @@

},
[registry.draggable]
[registry.draggable],
);

@@ -485,7 +485,7 @@

if (store.getState().phase !== "IDLE") {
if (store.getState().phase !== 'IDLE') {
store.dispatch(flush());
}
},
[lockAPI, store]
[lockAPI, store],
);

@@ -510,3 +510,3 @@ const isLockClaimed = useCallback(() => lockAPI.isClaimed(), [lockAPI]);

isLockClaimed,
]
],
);

@@ -513,0 +513,0 @@

12

src/view/use-sensor-marshal/use-validate-sensor-hooks.ts
/* eslint-disable react-hooks/rules-of-hooks */
import { invariant } from "../../invariant";
import type { Sensor } from "../../types";
import usePreviousRef from "../use-previous-ref";
import useDevSetupWarning from "../use-dev-setup-warning";
import useDev from "../use-dev";
import { invariant } from '../../invariant';
import type { Sensor } from '../../types';
import usePreviousRef from '../use-previous-ref';
import useDevSetupWarning from '../use-dev-setup-warning';
import useDev from '../use-dev';

@@ -15,3 +15,3 @@ export default function useValidateSensorHooks(sensorHooks: Sensor[]) {

previousRef.current.length === sensorHooks.length,
"Cannot change the amount of sensor hooks after mounting"
'Cannot change the amount of sensor hooks after mounting',
);

@@ -18,0 +18,0 @@ });

26

src/view/use-style-marshal/get-styles.ts

@@ -1,4 +0,4 @@

import type { ContextId } from "../../types";
import { transitions } from "../../animation";
import * as attributes from "../data-attributes";
import type { ContextId } from '../../types';
import { transitions } from '../../animation';
import * as attributes from '../data-attributes';

@@ -27,3 +27,3 @@ export interface Styles {

const getStyles = (rules: Rule[], property: keyof Rule["styles"]): string =>
const getStyles = (rules: Rule[], property: keyof Rule['styles']): string =>
rules

@@ -33,3 +33,3 @@ .map((rule: Rule): string => {

if (!value) {
return "";
return '';
}

@@ -39,5 +39,5 @@

})
.join(" ");
.join(' ');
const noPointerEvents = "pointer-events: none;";
const noPointerEvents = 'pointer-events: none;';

@@ -149,3 +149,3 @@ export default (contextId: ContextId): Styles => {

const body: Rule = {
selector: "body",
selector: 'body',
styles: {

@@ -167,8 +167,8 @@ dragging: `

return {
always: getStyles(rules, "always"),
resting: getStyles(rules, "resting"),
dragging: getStyles(rules, "dragging"),
dropAnimating: getStyles(rules, "dropAnimating"),
userCancel: getStyles(rules, "userCancel"),
always: getStyles(rules, 'always'),
resting: getStyles(rules, 'resting'),
dragging: getStyles(rules, 'dragging'),
dropAnimating: getStyles(rules, 'dropAnimating'),
userCancel: getStyles(rules, 'userCancel'),
};
};

2

src/view/use-style-marshal/index.ts

@@ -1,1 +0,1 @@

export { default } from "./use-style-marshal";
export { default } from './use-style-marshal';

2

src/view/use-style-marshal/style-marshal-types.ts

@@ -1,2 +0,2 @@

import type { DropReason } from "../../types";
import type { DropReason } from '../../types';

@@ -3,0 +3,0 @@ export interface StyleMarshal {

48

src/view/use-style-marshal/use-style-marshal.ts

@@ -1,15 +0,15 @@

import { useRef, MutableRefObject } from "react";
import memoizeOne from "memoize-one";
import { useMemo, useCallback } from "use-memo-one";
import { invariant } from "../../invariant";
import type { StyleMarshal } from "./style-marshal-types";
import type { ContextId, DropReason } from "../../types";
import getStyles from "./get-styles";
import type { Styles } from "./get-styles";
import { prefix } from "../data-attributes";
import useLayoutEffect from "../use-isomorphic-layout-effect";
import { useRef, MutableRefObject } from 'react';
import memoizeOne from 'memoize-one';
import { useMemo, useCallback } from 'use-memo-one';
import { invariant } from '../../invariant';
import type { StyleMarshal } from './style-marshal-types';
import type { ContextId, DropReason } from '../../types';
import getStyles from './get-styles';
import type { Styles } from './get-styles';
import { prefix } from '../data-attributes';
import useLayoutEffect from '../use-isomorphic-layout-effect';
const getHead = (): HTMLHeadElement => {
const head: HTMLHeadElement | null = document.querySelector("head");
invariant(head, "Cannot find the head to append a style to");
const head: HTMLHeadElement | null = document.querySelector('head');
invariant(head, 'Cannot find the head to append a style to');
return head;

@@ -19,7 +19,7 @@ };

const createStyleEl = (nonce?: string): HTMLStyleElement => {
const el: HTMLStyleElement = document.createElement("style");
const el: HTMLStyleElement = document.createElement('style');
if (nonce) {
el.setAttribute("nonce", nonce);
el.setAttribute('nonce', nonce);
}
el.type = "text/css";
el.type = 'text/css';
return el;

@@ -38,6 +38,6 @@ };

const el: HTMLStyleElement | null = dynamicRef.current;
invariant(el, "Cannot set dynamic style element if it is not set");
invariant(el, 'Cannot set dynamic style element if it is not set');
el.textContent = proposed;
}),
[]
[],
);

@@ -47,3 +47,3 @@

const el: HTMLStyleElement | null = alwaysRef.current;
invariant(el, "Cannot set dynamic style element if it is not set");
invariant(el, 'Cannot set dynamic style element if it is not set');
el.textContent = proposed;

@@ -56,3 +56,3 @@ }, []);

!alwaysRef.current && !dynamicRef.current,
"style elements already mounted"
'style elements already mounted',
);

@@ -82,3 +82,3 @@

const current: HTMLStyleElement | null = ref.current;
invariant(current, "Cannot unmount ref as it is not set");
invariant(current, 'Cannot unmount ref as it is not set');
getHead().removeChild(current);

@@ -102,7 +102,7 @@ ref.current = null;

() => setDynamicStyle(styles.dragging),
[setDynamicStyle, styles.dragging]
[setDynamicStyle, styles.dragging],
);
const dropping = useCallback(
(reason: DropReason) => {
if (reason === "DROP") {
if (reason === 'DROP') {
setDynamicStyle(styles.dropAnimating);

@@ -113,3 +113,3 @@ return;

},
[setDynamicStyle, styles.dropAnimating, styles.userCancel]
[setDynamicStyle, styles.dropAnimating, styles.userCancel],
);

@@ -130,3 +130,3 @@ const resting = useCallback(() => {

}),
[dragging, dropping, resting]
[dragging, dropping, resting],
);

@@ -133,0 +133,0 @@

10

src/view/use-unique-id.ts

@@ -1,3 +0,3 @@

import { useMemo } from "use-memo-one";
import type { Id } from "../types";
import { useMemo } from 'use-memo-one';
import type { Id } from '../types';

@@ -10,3 +10,3 @@ let count = 0;

const defaults: Options = { separator: "::" };
const defaults: Options = { separator: '::' };

@@ -19,8 +19,8 @@ export function reset() {

prefix: string,
options: Options = defaults
options: Options = defaults,
): Id {
return useMemo(
() => `${prefix}${options.separator}${count++}`,
[options.separator, prefix]
[options.separator, prefix],
);
}

18

src/view/visually-hidden-style.ts
// https://allyjs.io/tutorials/hiding-elements.html
// Element is visually hidden but is readable by screen readers
const visuallyHidden: any = {
position: "absolute",
width: "1px",
height: "1px",
margin: "-1px",
border: "0",
padding: "0",
overflow: "hidden",
clip: "rect(0 0 0 0)",
"clip-path": "inset(100%)",
position: 'absolute',
width: '1px',
height: '1px',
margin: '-1px',
border: '0',
padding: '0',
overflow: 'hidden',
clip: 'rect(0 0 0 0)',
'clip-path': 'inset(100%)',
};
export default visuallyHidden;

6

src/view/window/get-max-window-scroll.ts

@@ -1,4 +0,4 @@

import type { Position } from "css-box-model";
import getMaxScroll from "../../state/get-max-scroll";
import getDocumentElement from "../get-document-element";
import type { Position } from 'css-box-model';
import getMaxScroll from '../../state/get-max-scroll';
import getDocumentElement from '../get-document-element';

@@ -5,0 +5,0 @@ export default (): Position => {

14

src/view/window/get-viewport.ts

@@ -1,8 +0,8 @@

import { getRect } from "css-box-model";
import type { Rect, Position } from "css-box-model";
import type { Viewport } from "../../types";
import { origin } from "../../state/position";
import getWindowScroll from "./get-window-scroll";
import getMaxWindowScroll from "./get-max-window-scroll";
import getDocumentElement from "../get-document-element";
import { getRect } from 'css-box-model';
import type { Rect, Position } from 'css-box-model';
import type { Viewport } from '../../types';
import { origin } from '../../state/position';
import getWindowScroll from './get-window-scroll';
import getMaxWindowScroll from './get-max-window-scroll';
import getDocumentElement from '../get-document-element';

@@ -9,0 +9,0 @@ export default (): Viewport => {

2

src/view/window/get-window-scroll.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';

@@ -3,0 +3,0 @@ // The browsers update document.documentElement.scrollTop and window.pageYOffset

2

src/view/window/scroll-window.ts

@@ -1,2 +0,2 @@

import type { Position } from "css-box-model";
import type { Position } from 'css-box-model';

@@ -3,0 +3,0 @@ // Not guarenteed to scroll by the entire amount

src/use-effect-once.ts
dist/dnd.cjs.js

Sorry, the diff of this file is too big to display

dist/dnd.esm.js

Sorry, the diff of this file is too big to display

dist/dnd.js

Sorry, the diff of this file is too big to display

dist/dnd.min.js

Sorry, the diff of this file is too big to display

LICENSE

Sorry, the diff of this file is not supported yet

src/view/animate-in-out/animate-in-out.tsx

Sorry, the diff of this file is not supported yet

src/view/drag-drop-context/app.tsx

Sorry, the diff of this file is not supported yet

src/view/drag-drop-context/drag-drop-context.tsx

Sorry, the diff of this file is not supported yet

src/view/drag-drop-context/error-boundary.tsx

Sorry, the diff of this file is not supported yet

src/view/draggable/draggable-api.tsx

Sorry, the diff of this file is not supported yet

src/view/draggable/draggable.tsx

Sorry, the diff of this file is not supported yet

src/view/droppable/droppable.tsx

Sorry, the diff of this file is not supported yet

src/view/placeholder/placeholder.tsx

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc