Skip to content

Commit 5120292

Browse files
LouisBrunnerLouisBrunner
committed
deploy: 1763835 
0 parents  commit 5120292

File tree

106 files changed

+16352
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

106 files changed

+16352
-0
lines changed

‎.gitattributes

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
package-lock.json -diff

‎.gitignore

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
# OS files
2+
.DS_Store
3+
4+
# npm
5+
node_modules
6+
*-debug.log
7+
8+
# Code coverage
9+
/coverage
10+
11+
# Output
12+
packages/*/dist
13+
webpack-stats.json
14+
15+
# IDE
16+
.vscode

‎.jest-setup.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import '@testing-library/jest-dom'
2+
import React from 'react'
3+
global.React = React

‎.npmignore

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
# OS files
2+
.DS_Store
3+
4+
# esbuild
5+
/esbuild
6+
7+
# Output
8+
/examples
9+
10+
# npm
11+
node_modules
12+
npm-debug.log
13+
14+
# Config
15+
biome.json
16+
.jest.config.js
17+
.github
18+
lerna.json
19+
tsconfig.*json
20+
21+
# Code coverage
22+
coverage

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2016-2022 Louis Brunner
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
# DnD Multi Backend [![NPM Version][npm-image]][npm-url] ![Build Status][ci-image] [![Coverage Status][coveralls-image]][coveralls-url]
2+
3+
This project is a Drag'n'Drop backend compatible with [DnD Core](https://github.com/react-dnd/react-dnd).
4+
5+
It enables your application to use different DnD backends depending on the situation. Different packages are available depending on your front-end framework:
6+
7+
- React: [`react-dnd-multi-backend`](packages/react-dnd-multi-backend)
8+
- Angular: [`angular-skyhook`](https://github.com/cormacrelf/angular-skyhook) (see [documentation](https://cormacrelf.github.io/angular-skyhook/angular-skyhook-multi-backend/) for more information)
9+
- Any: [`dnd-multi-backend`](packages/dnd-multi-backend)
10+
11+
This project also contains some helpers (available standalone or included in other packages):
12+
13+
- React DnD Preview: [`react-dnd-preview`](packages/react-dnd-preview) (included in `react-dnd-multi-backend`)
14+
15+
[Try them here!](https://louisbrunner.github.io/dnd-multi-backend/examples)
16+
17+
18+
## Thanks
19+
20+
Thanks to the [React DnD HTML5 Backend](https://github.com/react-dnd/react-dnd) maintainers which obviously greatly inspired this project.
21+
22+
23+
## License
24+
25+
MIT, Copyright (c) 2016-2022 Louis Brunner
26+
27+
28+
29+
[npm-image]: https://img.shields.io/npm/v/dnd-multi-backend.svg
30+
[npm-url]: https://npmjs.org/package/dnd-multi-backend
31+
[ci-image]: https://github.com/LouisBrunner/dnd-multi-backend/workflows/Build/badge.svg
32+
[coveralls-image]: https://coveralls.io/repos/github/LouisBrunner/dnd-multi-backend/badge.svg?branch=master
33+
[coveralls-url]: https://coveralls.io/github/LouisBrunner/dnd-multi-backend?branch=master

‎__mocks__/mocks.ts

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import type {MultiBackendSwitcher, PreviewList} from 'dnd-multi-backend'
2+
import type {DragLayerMonitor} from 'react-dnd'
3+
4+
export const MockDragMonitor = <DragObject = unknown>(item: DragObject): jest.Mocked<DragLayerMonitor<DragObject>> => {
5+
return {
6+
isDragging: jest.fn(() => {
7+
return false
8+
}),
9+
getItemType: jest.fn(() => {
10+
return null
11+
}),
12+
// FIXME: why is it failing to get the type correct?
13+
getItem: jest.fn(() => {
14+
return item
15+
}) as jest.MockInstance<DragObject, []> & (<T = DragObject>() => T),
16+
getClientOffset: jest.fn(() => {
17+
return null
18+
}),
19+
getInitialClientOffset: jest.fn(() => {
20+
return null
21+
}),
22+
getInitialSourceClientOffset: jest.fn(() => {
23+
return null
24+
}),
25+
getDifferenceFromInitialOffset: jest.fn(() => {
26+
return null
27+
}),
28+
getSourceClientOffset: jest.fn(() => {
29+
return null
30+
}),
31+
}
32+
}
33+
34+
type OmitThisParameters<T> = {
35+
[P in keyof T]: OmitThisParameter<T[P]>
36+
}
37+
38+
export type MockedPreviewList = OmitThisParameters<jest.Mocked<PreviewList>>
39+
40+
export const MockPreviewList = (): MockedPreviewList => {
41+
return {
42+
register: jest.fn(),
43+
unregister: jest.fn(),
44+
backendChanged: jest.fn(),
45+
}
46+
}
47+
48+
export type MockedMultiBackend = jest.Mocked<MultiBackendSwitcher>
49+
50+
export const MockMultiBackend = (): MockedMultiBackend => {
51+
return {
52+
backendsList: jest.fn(),
53+
previewsList: jest.fn(),
54+
previewEnabled: jest.fn(),
55+
setup: jest.fn(),
56+
teardown: jest.fn(),
57+
connectDragSource: jest.fn(),
58+
connectDragPreview: jest.fn(),
59+
connectDropTarget: jest.fn(),
60+
profile: jest.fn(),
61+
}
62+
}

‎__mocks__/pipeline.ts

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import type {Backend} from 'dnd-core'
2+
import {type MultiBackendOptions, createTransition} from 'dnd-multi-backend'
3+
4+
const createBackend = () => {
5+
return {
6+
setup: jest.fn(),
7+
teardown: jest.fn(),
8+
connectDragSource: jest.fn(),
9+
connectDragPreview: jest.fn(),
10+
connectDropTarget: jest.fn(),
11+
profile: jest.fn(),
12+
}
13+
}
14+
15+
export const TestBackends = [createBackend(), createBackend()]
16+
17+
export const TestPipeline: MultiBackendOptions = {
18+
backends: [
19+
{
20+
id: 'back1',
21+
backend: jest.fn((): Backend => {
22+
return TestBackends[0]
23+
}),
24+
},
25+
{
26+
id: 'back2',
27+
backend: jest.fn((): Backend => {
28+
return TestBackends[1]
29+
}),
30+
options: {abc: 123},
31+
preview: true,
32+
transition: createTransition(
33+
'touchstart',
34+
jest.fn((event) => {
35+
return event.type === 'touchstart'
36+
}),
37+
),
38+
},
39+
],
40+
}
41+
42+
export const TestPipelineWithSkip: MultiBackendOptions = {
43+
backends: [
44+
TestPipeline.backends[0],
45+
{
46+
...TestPipeline.backends[1],
47+
skipDispatchOnTransition: true,
48+
},
49+
],
50+
}

‎__mocks__/react-dnd-preview.ts

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import {MockDragMonitor} from '@mocks/mocks'
2+
import type {PreviewProps, PreviewState, usePreviewState} from 'react-dnd-preview'
3+
4+
import type {JSX} from 'react'
5+
6+
const preview = jest.createMockFromModule<Record<string, unknown>>('react-dnd-preview')
7+
8+
const state: PreviewState = {
9+
ref: {current: null},
10+
itemType: 'abc',
11+
item: {},
12+
style: {},
13+
monitor: MockDragMonitor<unknown>(null),
14+
}
15+
16+
const Preview = (props: PreviewProps): JSX.Element | null => {
17+
if ('children' in props) {
18+
return null
19+
}
20+
return props.generator(state)
21+
}
22+
23+
export const usePreview = (): usePreviewState => {
24+
return {
25+
display: true,
26+
...state,
27+
}
28+
}
29+
30+
module.exports = {
31+
...preview,
32+
Preview,
33+
usePreview,
34+
}

‎__mocks__/react-dnd.ts

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import type {DragLayerMonitor} from 'react-dnd'
2+
3+
const dnd = jest.requireActual<Record<string, unknown>>('react-dnd')
4+
5+
let mockMonitor: DragLayerMonitor
6+
export const __setMockMonitor = (monitor: DragLayerMonitor): void => {
7+
mockMonitor = monitor
8+
}
9+
10+
export const useDragLayer = <CollectedProps>(collect: (monitor: DragLayerMonitor) => CollectedProps): CollectedProps => {
11+
return collect(mockMonitor)
12+
}
13+
14+
export const DndProvider = dnd.DndProvider
15+
export const useDrag = dnd.useDrag
16+
export const useDrop = dnd.useDrop
17+
export const DndContext = dnd.DndContext

‎babel.config.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"presets": ["@babel/preset-typescript"]
3+
}

‎biome.json

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
{
2+
"$schema": "https://biomejs.dev/schemas/1.8.1/schema.json",
3+
"organizeImports": {
4+
"enabled": true
5+
},
6+
"linter": {
7+
"enabled": true,
8+
"rules": {
9+
"recommended": true
10+
}
11+
},
12+
"formatter": {
13+
"enabled": true,
14+
"indentStyle": "space",
15+
"indentWidth": 2,
16+
"lineWidth": 200
17+
},
18+
"javascript": {
19+
"formatter": {
20+
"trailingCommas": "all",
21+
"semicolons": "asNeeded",
22+
"quoteStyle": "single",
23+
"bracketSpacing": false
24+
}
25+
},
26+
"files": {
27+
"ignore": ["examples/*.js", "coverage", "packages/*/dist"]
28+
}
29+
}

‎esbuild/build.js

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import esbuild from 'esbuild'
2+
import {nodeExternalsPlugin} from 'esbuild-node-externals'
3+
import tsConfig from '../tsconfig.json' with {type: 'json'}
4+
5+
esbuild.build({
6+
entryPoints: ['./src/index.ts'],
7+
format: 'esm',
8+
bundle: true,
9+
outfile: 'dist/index.js',
10+
minify: true,
11+
plugins: [nodeExternalsPlugin()],
12+
target: tsConfig.compilerOptions.target,
13+
})

‎esbuild/common.js

+30
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
// Note: this is not a technically a esbuild-related script.
2+
import {execSync, spawnSync} from 'node:child_process'
3+
4+
export const getCommandOutput = (...args) => {
5+
const stdout = execSync(args.join(' '), {
6+
encoding: 'utf8',
7+
})
8+
return stdout.toString()
9+
}
10+
11+
export const getWorkspaces = () => {
12+
const workspacesJSON = getCommandOutput('npm', 'query', '.workspace')
13+
const workspaces = JSON.parse(workspacesJSON)
14+
return workspaces.toSorted((a, b) => {
15+
if (Object.keys(a.dependencies ?? {}).includes(b.name)) {
16+
return 1
17+
}
18+
if (Object.keys(b.dependencies ?? {}).includes(a.name)) {
19+
return -1
20+
}
21+
return 0
22+
})
23+
}
24+
25+
export const executeCommand = (command, args, options) => {
26+
spawnSync(command, args, {
27+
stdio: 'inherit',
28+
...options,
29+
})
30+
}

‎esbuild/config.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
export const examples = {
2+
entryPoints: {
3+
'examples_dnd-multi-backend.min': './packages/dnd-multi-backend/examples/index.ts',
4+
'examples_react-dnd-multi-backend.min': './packages/react-dnd-multi-backend/examples/index.tsx',
5+
'examples_react-dnd-preview_main.min': './packages/react-dnd-preview/examples/main/index.tsx',
6+
'examples_react-dnd-preview_offset.min': './packages/react-dnd-preview/examples/offset/index.tsx',
7+
},
8+
bundle: true,
9+
minify: true,
10+
}

‎esbuild/dev.js

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import esbuild from 'esbuild'
2+
import {examples} from './config.js'
3+
4+
const baseDir = 'examples/'
5+
6+
const context = await esbuild.context({
7+
...examples,
8+
outdir: baseDir,
9+
})
10+
11+
const server = await context.serve({
12+
servedir: baseDir,
13+
port: 4001,
14+
})
15+
console.log(`Server available at http://${server.host}:${server.port}`)

‎esbuild/examples.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import esbuild from 'esbuild'
2+
import {examples} from './config.js'
3+
4+
esbuild.build({
5+
...examples,
6+
outdir: 'examples/',
7+
})

0 commit comments

Comments
 (0)