first init

This commit is contained in:
Power BI Dev
2026-08-17 10:52:09 +07:00
commit 88c7c653c2
9281 changed files with 2156575 additions and 0 deletions
+105
View File
@@ -0,0 +1,105 @@
# @dnd-kit/accessibility
## 3.1.1
### Patch Changes
- [#1534](https://github.com/clauderic/dnd-kit/pull/1534) [`93602df`](https://github.com/clauderic/dnd-kit/commit/93602df08498b28749e8146e0f6143ab987bc178) Thanks [@duvallj](https://github.com/duvallj)! - Workaround `<LiveRegion>` layout bug by adding explicit `top` and `left`
attributes. Under sufficiently complex CSS conditions, the element would
overflow containers that it's not supposed to. See [this
post](https://blog.duvallj.pw/posts/2024-11-19-chrome-heisenbug-uncovered.html)
for a complete explanation.
## 3.1.0
### Minor Changes
- [#1229](https://github.com/clauderic/dnd-kit/pull/1229) [`aabb8bd`](https://github.com/clauderic/dnd-kit/commit/aabb8bd114cf1f0aed0f18e70b296d5905ff04d8) Thanks [@ayy-bc](https://github.com/ayy-bc)! - Introduce `ariaLiveType` prop on `<LiveRegion>` to allow consumers to configure the `aria-live` attribute to other values for announcements, such as `aria-live="polite"`.
## 3.0.1
### Patch Changes
- [#776](https://github.com/clauderic/dnd-kit/pull/776) [`3978c43`](https://github.com/clauderic/dnd-kit/commit/3978c43c6b045f10b75f47ad8bbea38a84437bd6) Thanks [@clauderic](https://github.com/clauderic)! - The ARIA live region element used for screen reader announcements is now positioned using `position: fixed` instead of `position: absolute`. As of `@dnd-kit/core^6.0.0`, the live region element is no longer portaled by default into the `document.body`. This change was introduced in order to fix issues with portaled live regions. However, this change can introduce visual regressions when using absolutely positioned elements, since the live region element is constrained to the stacking and position context of its closest positioned ancestor. Using fixed position ensures the element does not introduce visual regressions.
## 3.0.0
### Major Changes
- [`a9d92cf`](https://github.com/clauderic/dnd-kit/commit/a9d92cf1fa35dd957e6c5915a13dfd2af134c103) [#174](https://github.com/clauderic/dnd-kit/pull/174) Thanks [@clauderic](https://github.com/clauderic)! - Distributed assets now only target modern browsers. [Browserlist](https://github.com/browserslist/browserslist) config:
```
defaults
last 2 version
not IE 11
not dead
```
If you need to support older browsers, include the appropriate polyfills in your project's build process.
### Patch Changes
- [`b406cb9`](https://github.com/clauderic/dnd-kit/commit/b406cb9251beef8677d05c45ec42bab7581a86dc) [#187](https://github.com/clauderic/dnd-kit/pull/187) Thanks [@clauderic](https://github.com/clauderic)! - Introduced the `useDndMonitor` hook. The `useDndMonitor` hook can be used within components wrapped in a `DndContext` provider to monitor the different drag and drop events that happen for that `DndContext`.
Example usage:
```tsx
import {DndContext, useDndMonitor} from '@dnd-kit/core';
function App() {
return (
<DndContext>
<Component />
</DndContext>
);
}
function Component() {
useDndMonitor({
onDragStart(event) {},
onDragMove(event) {},
onDragOver(event) {},
onDragEnd(event) {},
onDragCancel(event) {},
});
}
```
## 2.0.0
### Major Changes
- [`2833337`](https://github.com/clauderic/dnd-kit/commit/2833337043719853902c3989dfcd5b55ae9ddc73) [#186](https://github.com/clauderic/dnd-kit/pull/186) Thanks [@clauderic](https://github.com/clauderic)! - Simplify `useAnnouncement` hook to only return a single `announcement` rather than `entries`. Similarly, the `LiveRegion` component now only accepts a single `announcement` rather than `entries.
- The current strategy used in the useAnnouncement hook is needlessly complex. It's not actually necessary to render multiple announcements at once within the LiveRegion component. It's sufficient to render a single announcement at a time. It's also un-necessary to clean up the announcements after they have been announced, especially now that the role="status" attribute has been added to LiveRegion, keeping the last announcement rendered means users can refer to the last status.
### Patch Changes
- [`c24bdb3`](https://github.com/clauderic/dnd-kit/commit/c24bdb3723f1e3e4c474439f837a19c6d48059fb) [#184](https://github.com/clauderic/dnd-kit/pull/184) Thanks [@clauderic](https://github.com/clauderic)! - Tweaked LiveRegion component:
- Entries are now rendered without wrapper `span` elements. Having wrapper `span` elements causes VoiceOver on macOS to try to move the VoiceOver cursor to the live region, which interferes with scrolling. This issue is not exhibited when rendering announcement entries as plain text without wrapper spans.
- Added the `role="status"` attribute to the LiveRegion wrapper element.
- Added the `white-space: no-wrap;` property to ensure that text does not wrap.
## 1.0.2
### Patch Changes
- [`423610c`](https://github.com/clauderic/dnd-kit/commit/423610ca48c5e5ca95545fdb5c5cfcfbd3d233ba) [#56](https://github.com/clauderic/dnd-kit/pull/56) Thanks [@clauderic](https://github.com/clauderic)! - Add MIT license to package.json and distributed files
## 1.0.1
### Patch Changes
- [`310bbd6`](https://github.com/clauderic/dnd-kit/commit/310bbd6370e85f8fb16cad149e6254600a5beb3a) [#37](https://github.com/clauderic/dnd-kit/pull/37) Thanks [@nickpresta](https://github.com/nickpresta)! - Fix typo in package.json repository URL
## 1.0.0
### Major Changes
- [`2912350`](https://github.com/clauderic/dnd-kit/commit/2912350c5008c2b0edda3bae30b5075a852dea63) Thanks [@clauderic](https://github.com/clauderic)! - Initial public release.
## 0.1.0
### Minor Changes
- [`7bd4568`](https://github.com/clauderic/dnd-kit/commit/7bd4568e9f339552fd73a9a4c888460b11195a5e) [#30](https://github.com/clauderic/dnd-kit/pull/30) - Initial beta release, authored by [@clauderic](https://github.com/clauderic).
+21
View File
@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2021, Claudéric Demers
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
+5
View File
@@ -0,0 +1,5 @@
# @dnd-kit/accessibility
[![Stable release](https://img.shields.io/npm/v/@dnd-kit/accessibility.svg)](https://npm.im/@dnd-kit/accessibility)
A generic set of components and hooks to help with live region announcements and screen reader instructions. This package is used internally by `@dnd-kit/core`.
@@ -0,0 +1,70 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
var React = require('react');
var React__default = _interopDefault(React);
const hiddenStyles = {
display: 'none'
};
function HiddenText(_ref) {
let {
id,
value
} = _ref;
return React__default.createElement("div", {
id: id,
style: hiddenStyles
}, value);
}
function LiveRegion(_ref) {
let {
id,
announcement,
ariaLiveType = "assertive"
} = _ref;
// Hide element visually but keep it readable by screen readers
const visuallyHidden = {
position: 'fixed',
top: 0,
left: 0,
width: 1,
height: 1,
margin: -1,
border: 0,
padding: 0,
overflow: 'hidden',
clip: 'rect(0 0 0 0)',
clipPath: 'inset(100%)',
whiteSpace: 'nowrap'
};
return React__default.createElement("div", {
id: id,
style: visuallyHidden,
role: "status",
"aria-live": ariaLiveType,
"aria-atomic": true
}, announcement);
}
function useAnnouncement() {
const [announcement, setAnnouncement] = React.useState('');
const announce = React.useCallback(value => {
if (value != null) {
setAnnouncement(value);
}
}, []);
return {
announce,
announcement
};
}
exports.HiddenText = HiddenText;
exports.LiveRegion = LiveRegion;
exports.useAnnouncement = useAnnouncement;
//# sourceMappingURL=accessibility.cjs.development.js.map
@@ -0,0 +1 @@
{"version":3,"file":"accessibility.cjs.development.js","sources":["../src/components/HiddenText/HiddenText.tsx","../src/components/LiveRegion/LiveRegion.tsx","../src/hooks/useAnnouncement.ts"],"sourcesContent":["import React from 'react';\n\ninterface Props {\n id: string;\n value: string;\n}\n\nconst hiddenStyles: React.CSSProperties = {\n display: 'none',\n};\n\nexport function HiddenText({id, value}: Props) {\n return (\n <div id={id} style={hiddenStyles}>\n {value}\n </div>\n );\n}\n","import React from 'react';\n\nexport interface Props {\n id: string;\n announcement: string;\n ariaLiveType?: \"polite\" | \"assertive\" | \"off\";\n}\n\nexport function LiveRegion({id, announcement, ariaLiveType = \"assertive\"}: Props) {\n // Hide element visually but keep it readable by screen readers\n const visuallyHidden: React.CSSProperties = {\n position: 'fixed',\n top: 0,\n left: 0,\n width: 1,\n height: 1,\n margin: -1,\n border: 0,\n padding: 0,\n overflow: 'hidden',\n clip: 'rect(0 0 0 0)',\n clipPath: 'inset(100%)',\n whiteSpace: 'nowrap',\n };\n \n return (\n <div\n id={id}\n style={visuallyHidden}\n role=\"status\"\n aria-live={ariaLiveType}\n aria-atomic\n >\n {announcement}\n </div>\n );\n}\n","import {useCallback, useState} from 'react';\n\nexport function useAnnouncement() {\n const [announcement, setAnnouncement] = useState('');\n const announce = useCallback((value: string | undefined) => {\n if (value != null) {\n setAnnouncement(value);\n }\n }, []);\n\n return {announce, announcement} as const;\n}\n"],"names":["hiddenStyles","display","HiddenText","id","value","React","style","LiveRegion","announcement","ariaLiveType","visuallyHidden","position","top","left","width","height","margin","border","padding","overflow","clip","clipPath","whiteSpace","role","useAnnouncement","setAnnouncement","useState","announce","useCallback"],"mappings":";;;;;;;;;AAOA,MAAMA,YAAY,GAAwB;EACxCC,OAAO,EAAE;AAD+B,CAA1C;SAIgBC;MAAW;IAACC,EAAD;IAAKC;;EAC9B,OACEC,4BAAA,MAAA;IAAKF,EAAE,EAAEA;IAAIG,KAAK,EAAEN;GAApB,EACGI,KADH,CADF;AAKD;;SCTeG;MAAW;IAACJ,EAAD;IAAKK,YAAL;IAAmBC,YAAY,GAAG;;;EAE3D,MAAMC,cAAc,GAAwB;IAC1CC,QAAQ,EAAE,OADgC;IAE1CC,GAAG,EAAE,CAFqC;IAG1CC,IAAI,EAAE,CAHoC;IAI1CC,KAAK,EAAE,CAJmC;IAK1CC,MAAM,EAAE,CALkC;IAM1CC,MAAM,EAAE,CAAC,CANiC;IAO1CC,MAAM,EAAE,CAPkC;IAQ1CC,OAAO,EAAE,CARiC;IAS1CC,QAAQ,EAAE,QATgC;IAU1CC,IAAI,EAAE,eAVoC;IAW1CC,QAAQ,EAAE,aAXgC;IAY1CC,UAAU,EAAE;GAZd;EAeA,OACEjB,4BAAA,MAAA;IACEF,EAAE,EAAEA;IACJG,KAAK,EAAEI;IACPa,IAAI,EAAC;iBACMd;;GAJb,EAOGD,YAPH,CADF;AAWD;;SClCegB;EACd,MAAM,CAAChB,YAAD,EAAeiB,eAAf,IAAkCC,cAAQ,CAAC,EAAD,CAAhD;EACA,MAAMC,QAAQ,GAAGC,iBAAW,CAAExB,KAAD;IAC3B,IAAIA,KAAK,IAAI,IAAb,EAAmB;MACjBqB,eAAe,CAACrB,KAAD,CAAf;;GAFwB,EAIzB,EAJyB,CAA5B;EAMA,OAAO;IAACuB,QAAD;IAAWnB;GAAlB;AACD;;;;;;"}
@@ -0,0 +1,2 @@
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e;const i={display:"none"};exports.HiddenText=function(e){let{id:t,value:r}=e;return n.createElement("div",{id:t,style:i},r)},exports.LiveRegion=function(e){let{id:t,announcement:i,ariaLiveType:r="assertive"}=e;return n.createElement("div",{id:t,style:{position:"fixed",top:0,left:0,width:1,height:1,margin:-1,border:0,padding:0,overflow:"hidden",clip:"rect(0 0 0 0)",clipPath:"inset(100%)",whiteSpace:"nowrap"},role:"status","aria-live":r,"aria-atomic":!0},i)},exports.useAnnouncement=function(){const[e,n]=t.useState("");return{announce:t.useCallback(e=>{null!=e&&n(e)},[]),announcement:e}};
//# sourceMappingURL=accessibility.cjs.production.min.js.map
@@ -0,0 +1 @@
{"version":3,"file":"accessibility.cjs.production.min.js","sources":["../src/components/HiddenText/HiddenText.tsx","../src/components/LiveRegion/LiveRegion.tsx","../src/hooks/useAnnouncement.ts"],"sourcesContent":["import React from 'react';\n\ninterface Props {\n id: string;\n value: string;\n}\n\nconst hiddenStyles: React.CSSProperties = {\n display: 'none',\n};\n\nexport function HiddenText({id, value}: Props) {\n return (\n <div id={id} style={hiddenStyles}>\n {value}\n </div>\n );\n}\n","import React from 'react';\n\nexport interface Props {\n id: string;\n announcement: string;\n ariaLiveType?: \"polite\" | \"assertive\" | \"off\";\n}\n\nexport function LiveRegion({id, announcement, ariaLiveType = \"assertive\"}: Props) {\n // Hide element visually but keep it readable by screen readers\n const visuallyHidden: React.CSSProperties = {\n position: 'fixed',\n top: 0,\n left: 0,\n width: 1,\n height: 1,\n margin: -1,\n border: 0,\n padding: 0,\n overflow: 'hidden',\n clip: 'rect(0 0 0 0)',\n clipPath: 'inset(100%)',\n whiteSpace: 'nowrap',\n };\n \n return (\n <div\n id={id}\n style={visuallyHidden}\n role=\"status\"\n aria-live={ariaLiveType}\n aria-atomic\n >\n {announcement}\n </div>\n );\n}\n","import {useCallback, useState} from 'react';\n\nexport function useAnnouncement() {\n const [announcement, setAnnouncement] = useState('');\n const announce = useCallback((value: string | undefined) => {\n if (value != null) {\n setAnnouncement(value);\n }\n }, []);\n\n return {announce, announcement} as const;\n}\n"],"names":["hiddenStyles","display","id","value","React","style","announcement","ariaLiveType","position","top","left","width","height","margin","border","padding","overflow","clip","clipPath","whiteSpace","role","setAnnouncement","useState","announce","useCallback"],"mappings":"oJAOA,MAAMA,EAAoC,CACxCC,QAAS,2CAGgBC,GAACA,EAADC,MAAKA,KAC9B,OACEC,uBAAKF,GAAIA,EAAIG,MAAOL,GACjBG,uCCNoBD,GAACA,EAADI,aAAKA,EAALC,aAAmBA,EAAe,eAiB3D,OACEH,uBACEF,GAAIA,EACJG,MAlBwC,CAC1CG,SAAU,QACVC,IAAK,EACLC,KAAM,EACNC,MAAO,EACPC,OAAQ,EACRC,QAAS,EACTC,OAAQ,EACRC,QAAS,EACTC,SAAU,SACVC,KAAM,gBACNC,SAAU,cACVC,WAAY,UAOVC,KAAK,qBACMb,oBAGVD,uCC9BL,MAAOA,EAAce,GAAmBC,WAAS,IAOjD,MAAO,CAACC,SANSC,cAAarB,IACf,MAATA,GACFkB,EAAgBlB,IAEjB,IAEeG,aAAAA"}
+61
View File
@@ -0,0 +1,61 @@
import React, { useState, useCallback } from 'react';
const hiddenStyles = {
display: 'none'
};
function HiddenText(_ref) {
let {
id,
value
} = _ref;
return React.createElement("div", {
id: id,
style: hiddenStyles
}, value);
}
function LiveRegion(_ref) {
let {
id,
announcement,
ariaLiveType = "assertive"
} = _ref;
// Hide element visually but keep it readable by screen readers
const visuallyHidden = {
position: 'fixed',
top: 0,
left: 0,
width: 1,
height: 1,
margin: -1,
border: 0,
padding: 0,
overflow: 'hidden',
clip: 'rect(0 0 0 0)',
clipPath: 'inset(100%)',
whiteSpace: 'nowrap'
};
return React.createElement("div", {
id: id,
style: visuallyHidden,
role: "status",
"aria-live": ariaLiveType,
"aria-atomic": true
}, announcement);
}
function useAnnouncement() {
const [announcement, setAnnouncement] = useState('');
const announce = useCallback(value => {
if (value != null) {
setAnnouncement(value);
}
}, []);
return {
announce,
announcement
};
}
export { HiddenText, LiveRegion, useAnnouncement };
//# sourceMappingURL=accessibility.esm.js.map
@@ -0,0 +1 @@
{"version":3,"file":"accessibility.esm.js","sources":["../src/components/HiddenText/HiddenText.tsx","../src/components/LiveRegion/LiveRegion.tsx","../src/hooks/useAnnouncement.ts"],"sourcesContent":["import React from 'react';\n\ninterface Props {\n id: string;\n value: string;\n}\n\nconst hiddenStyles: React.CSSProperties = {\n display: 'none',\n};\n\nexport function HiddenText({id, value}: Props) {\n return (\n <div id={id} style={hiddenStyles}>\n {value}\n </div>\n );\n}\n","import React from 'react';\n\nexport interface Props {\n id: string;\n announcement: string;\n ariaLiveType?: \"polite\" | \"assertive\" | \"off\";\n}\n\nexport function LiveRegion({id, announcement, ariaLiveType = \"assertive\"}: Props) {\n // Hide element visually but keep it readable by screen readers\n const visuallyHidden: React.CSSProperties = {\n position: 'fixed',\n top: 0,\n left: 0,\n width: 1,\n height: 1,\n margin: -1,\n border: 0,\n padding: 0,\n overflow: 'hidden',\n clip: 'rect(0 0 0 0)',\n clipPath: 'inset(100%)',\n whiteSpace: 'nowrap',\n };\n \n return (\n <div\n id={id}\n style={visuallyHidden}\n role=\"status\"\n aria-live={ariaLiveType}\n aria-atomic\n >\n {announcement}\n </div>\n );\n}\n","import {useCallback, useState} from 'react';\n\nexport function useAnnouncement() {\n const [announcement, setAnnouncement] = useState('');\n const announce = useCallback((value: string | undefined) => {\n if (value != null) {\n setAnnouncement(value);\n }\n }, []);\n\n return {announce, announcement} as const;\n}\n"],"names":["hiddenStyles","display","HiddenText","id","value","React","style","LiveRegion","announcement","ariaLiveType","visuallyHidden","position","top","left","width","height","margin","border","padding","overflow","clip","clipPath","whiteSpace","role","useAnnouncement","setAnnouncement","useState","announce","useCallback"],"mappings":";;AAOA,MAAMA,YAAY,GAAwB;EACxCC,OAAO,EAAE;AAD+B,CAA1C;SAIgBC;MAAW;IAACC,EAAD;IAAKC;;EAC9B,OACEC,mBAAA,MAAA;IAAKF,EAAE,EAAEA;IAAIG,KAAK,EAAEN;GAApB,EACGI,KADH,CADF;AAKD;;SCTeG;MAAW;IAACJ,EAAD;IAAKK,YAAL;IAAmBC,YAAY,GAAG;;;EAE3D,MAAMC,cAAc,GAAwB;IAC1CC,QAAQ,EAAE,OADgC;IAE1CC,GAAG,EAAE,CAFqC;IAG1CC,IAAI,EAAE,CAHoC;IAI1CC,KAAK,EAAE,CAJmC;IAK1CC,MAAM,EAAE,CALkC;IAM1CC,MAAM,EAAE,CAAC,CANiC;IAO1CC,MAAM,EAAE,CAPkC;IAQ1CC,OAAO,EAAE,CARiC;IAS1CC,QAAQ,EAAE,QATgC;IAU1CC,IAAI,EAAE,eAVoC;IAW1CC,QAAQ,EAAE,aAXgC;IAY1CC,UAAU,EAAE;GAZd;EAeA,OACEjB,mBAAA,MAAA;IACEF,EAAE,EAAEA;IACJG,KAAK,EAAEI;IACPa,IAAI,EAAC;iBACMd;;GAJb,EAOGD,YAPH,CADF;AAWD;;SClCegB;EACd,MAAM,CAAChB,YAAD,EAAeiB,eAAf,IAAkCC,QAAQ,CAAC,EAAD,CAAhD;EACA,MAAMC,QAAQ,GAAGC,WAAW,CAAExB,KAAD;IAC3B,IAAIA,KAAK,IAAI,IAAb,EAAmB;MACjBqB,eAAe,CAACrB,KAAD,CAAf;;GAFwB,EAIzB,EAJyB,CAA5B;EAMA,OAAO;IAACuB,QAAD;IAAWnB;GAAlB;AACD;;;;"}
@@ -0,0 +1,7 @@
/// <reference types="react" />
interface Props {
id: string;
value: string;
}
export declare function HiddenText({ id, value }: Props): JSX.Element;
export {};
@@ -0,0 +1 @@
export { HiddenText } from './HiddenText';
@@ -0,0 +1,7 @@
/// <reference types="react" />
export interface Props {
id: string;
announcement: string;
ariaLiveType?: "polite" | "assertive" | "off";
}
export declare function LiveRegion({ id, announcement, ariaLiveType }: Props): JSX.Element;
@@ -0,0 +1 @@
export { LiveRegion } from './LiveRegion';
@@ -0,0 +1,2 @@
export { HiddenText } from './HiddenText';
export { LiveRegion } from './LiveRegion';
+1
View File
@@ -0,0 +1 @@
export { useAnnouncement } from './useAnnouncement';
@@ -0,0 +1,4 @@
export declare function useAnnouncement(): {
readonly announce: (value: string | undefined) => void;
readonly announcement: string;
};
+2
View File
@@ -0,0 +1,2 @@
export { HiddenText, LiveRegion } from './components';
export { useAnnouncement } from './hooks';
+8
View File
@@ -0,0 +1,8 @@
'use strict'
if (process.env.NODE_ENV === 'production') {
module.exports = require('./accessibility.cjs.production.min.js')
} else {
module.exports = require('./accessibility.cjs.development.js')
}
+36
View File
@@ -0,0 +1,36 @@
{
"name": "@dnd-kit/accessibility",
"version": "3.1.1",
"description": "A generic toolkit to help with accessibility",
"author": "Claudéric Demers",
"license": "MIT",
"repository": {
"type": "git",
"url": "git+https://github.com/clauderic/dnd-kit.git",
"directory": "packages/accessibility"
},
"scripts": {
"start": "tsdx watch --tsconfig tsconfig.build.json --verbose --noClean",
"build": "tsdx build --tsconfig tsconfig.build.json",
"test": "tsdx test",
"lint": "tsdx lint",
"prepublish": "npm run build"
},
"main": "dist/index.js",
"module": "dist/accessibility.esm.js",
"typings": "dist/index.d.ts",
"files": [
"README.md",
"CHANGELOG.md",
"dist"
],
"peerDependencies": {
"react": ">=16.8.0"
},
"dependencies": {
"tslib": "^2.0.0"
},
"publishConfig": {
"access": "public"
}
}
+1215
View File
File diff suppressed because it is too large Load Diff
+21
View File
@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2021, Claudéric Demers
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
+17
View File
@@ -0,0 +1,17 @@
# @dnd-kit/core
[![Stable release](https://img.shields.io/npm/v/@dnd-kit/core.svg)](https://npm.im/@dnd-kit/core)
@dnd-kit a lightweight React library for building performant and accessible drag and drop experiences.
## Installation
To get started, install the `@dnd-kit/core` package via npm or yarn:
```
npm install @dnd-kit/core
```
## Usage
Visit [docs.dndkit.com](https://docs.dndkit.com) to learn how to get started with @dnd-kit.
@@ -0,0 +1,10 @@
/// <reference types="react" />
import type { Announcements, ScreenReaderInstructions } from './types';
interface Props {
announcements?: Announcements;
container?: Element;
screenReaderInstructions?: ScreenReaderInstructions;
hiddenTextDescribedById: string;
}
export declare function Accessibility({ announcements, container, hiddenTextDescribedById, screenReaderInstructions, }: Props): JSX.Element | null;
export {};
@@ -0,0 +1,5 @@
interface Props {
disabled: boolean;
}
export declare function RestoreFocus({ disabled }: Props): null;
export {};
@@ -0,0 +1 @@
export { RestoreFocus } from './RestoreFocus';
@@ -0,0 +1,3 @@
import type { Announcements, ScreenReaderInstructions } from './types';
export declare const defaultScreenReaderInstructions: ScreenReaderInstructions;
export declare const defaultAnnouncements: Announcements;
@@ -0,0 +1,4 @@
export { Accessibility } from './Accessibility';
export { RestoreFocus } from './components';
export { defaultAnnouncements, defaultScreenReaderInstructions, } from './defaults';
export type { Announcements, ScreenReaderInstructions } from './types';
@@ -0,0 +1,15 @@
import type { Active, Over } from '../../store';
export interface Arguments {
active: Active;
over: Over | null;
}
export interface Announcements {
onDragStart({ active }: Pick<Arguments, 'active'>): string | undefined;
onDragMove?({ active, over }: Arguments): string | undefined;
onDragOver({ active, over }: Arguments): string | undefined;
onDragEnd({ active, over }: Arguments): string | undefined;
onDragCancel({ active, over }: Arguments): string | undefined;
}
export interface ScreenReaderInstructions {
draggable: string;
}
@@ -0,0 +1,37 @@
import React from 'react';
import type { Transform } from '@dnd-kit/utilities';
import type { AutoScrollOptions } from '../../hooks/utilities';
import type { SensorDescriptor } from '../../sensors';
import { CollisionDetection } from '../../utilities';
import { Modifiers } from '../../modifiers';
import type { DragStartEvent, DragCancelEvent, DragEndEvent, DragMoveEvent, DragOverEvent, DragPendingEvent, DragAbortEvent } from '../../types';
import { Announcements, ScreenReaderInstructions } from '../Accessibility';
import type { MeasuringConfiguration } from './types';
export interface Props {
id?: string;
accessibility?: {
announcements?: Announcements;
container?: Element;
restoreFocus?: boolean;
screenReaderInstructions?: ScreenReaderInstructions;
};
autoScroll?: boolean | AutoScrollOptions;
cancelDrop?: CancelDrop;
children?: React.ReactNode;
collisionDetection?: CollisionDetection;
measuring?: MeasuringConfiguration;
modifiers?: Modifiers;
sensors?: SensorDescriptor<any>[];
onDragAbort?(event: DragAbortEvent): void;
onDragPending?(event: DragPendingEvent): void;
onDragStart?(event: DragStartEvent): void;
onDragMove?(event: DragMoveEvent): void;
onDragOver?(event: DragOverEvent): void;
onDragEnd?(event: DragEndEvent): void;
onDragCancel?(event: DragCancelEvent): void;
}
export interface CancelDropArguments extends DragEndEvent {
}
export declare type CancelDrop = (args: CancelDropArguments) => boolean | Promise<boolean>;
export declare const ActiveDraggableContext: React.Context<Transform>;
export declare const DndContext: React.NamedExoticComponent<Props>;
@@ -0,0 +1,13 @@
import type { DeepRequired } from '@dnd-kit/utilities';
import type { DataRef } from '../../store/types';
import { KeyboardSensor, PointerSensor } from '../../sensors';
import type { MeasuringConfiguration } from './types';
export declare const defaultSensors: ({
sensor: typeof PointerSensor;
options: {};
} | {
sensor: typeof KeyboardSensor;
options: {};
})[];
export declare const defaultData: DataRef;
export declare const defaultMeasuringConfiguration: DeepRequired<MeasuringConfiguration>;
@@ -0,0 +1,2 @@
export { useMeasuringConfiguration } from './useMeasuringConfiguration';
export { useLayoutShiftScrollCompensation } from './useLayoutShiftScrollCompensation';
@@ -0,0 +1,14 @@
import type { ClientRect } from '../../../types';
import type { DraggableNode } from '../../../store';
import type { MeasuringFunction } from '../types';
interface Options {
activeNode: DraggableNode | null | undefined;
config: boolean | {
x: boolean;
y: boolean;
} | undefined;
initialRect: ClientRect | null;
measure: MeasuringFunction;
}
export declare function useLayoutShiftScrollCompensation({ activeNode, measure, initialRect, config, }: Options): void;
export {};
@@ -0,0 +1,3 @@
import type { DeepRequired } from '@dnd-kit/utilities';
import type { MeasuringConfiguration } from '../types';
export declare function useMeasuringConfiguration(config: MeasuringConfiguration | undefined): DeepRequired<MeasuringConfiguration>;
@@ -0,0 +1,3 @@
export { ActiveDraggableContext, DndContext } from './DndContext';
export type { CancelDrop, Props as DndContextProps } from './DndContext';
export type { DraggableMeasuring, MeasuringConfiguration } from './types';
@@ -0,0 +1,16 @@
import type { ClientRect } from '../../types';
import type { DroppableMeasuring } from '../../hooks/utilities';
export declare type MeasuringFunction = (node: HTMLElement) => ClientRect;
interface Measuring {
measure: MeasuringFunction;
}
export interface DraggableMeasuring extends Measuring {
}
export interface DragOverlayMeasuring extends Measuring {
}
export interface MeasuringConfiguration {
draggable?: Partial<DraggableMeasuring>;
droppable?: Partial<DroppableMeasuring>;
dragOverlay?: Partial<DragOverlayMeasuring>;
}
export {};
@@ -0,0 +1,3 @@
/// <reference types="react" />
import type { RegisterListener } from './types';
export declare const DndMonitorContext: import("react").Context<RegisterListener | null>;
@@ -0,0 +1,4 @@
export { DndMonitorContext } from './context';
export type { DndMonitorListener, DndMonitorEvent } from './types';
export { useDndMonitor } from './useDndMonitor';
export { useDndMonitorProvider } from './useDndMonitorProvider';
@@ -0,0 +1,16 @@
import type { DragAbortEvent, DragPendingEvent, DragStartEvent, DragCancelEvent, DragEndEvent, DragMoveEvent, DragOverEvent } from '../../types';
export interface DndMonitorListener {
onDragAbort?(event: DragAbortEvent): void;
onDragPending?(event: DragPendingEvent): void;
onDragStart?(event: DragStartEvent): void;
onDragMove?(event: DragMoveEvent): void;
onDragOver?(event: DragOverEvent): void;
onDragEnd?(event: DragEndEvent): void;
onDragCancel?(event: DragCancelEvent): void;
}
export interface DndMonitorEvent {
type: keyof DndMonitorListener;
event: DragAbortEvent | DragPendingEvent | DragStartEvent | DragMoveEvent | DragOverEvent | DragEndEvent | DragCancelEvent;
}
export declare type UnregisterListener = () => void;
export declare type RegisterListener = (listener: DndMonitorListener) => UnregisterListener;
@@ -0,0 +1,2 @@
import type { DndMonitorListener } from './types';
export declare function useDndMonitor(listener: DndMonitorListener): void;
@@ -0,0 +1,2 @@
import type { DndMonitorEvent } from './types';
export declare function useDndMonitorProvider(): readonly [({ type, event }: DndMonitorEvent) => void, (listener: any) => () => boolean];
@@ -0,0 +1,11 @@
import React from 'react';
import { Modifiers } from '../../modifiers';
import type { PositionedOverlayProps } from './components';
import type { DropAnimation } from './hooks';
export interface Props extends Pick<PositionedOverlayProps, 'adjustScale' | 'children' | 'className' | 'style' | 'transition'> {
dropAnimation?: DropAnimation | null | undefined;
modifiers?: Modifiers;
wrapperElement?: keyof JSX.IntrinsicElements;
zIndex?: number;
}
export declare const DragOverlay: React.MemoExoticComponent<({ adjustScale, children, dropAnimation: dropAnimationConfig, style, transition, modifiers, wrapperElement, className, zIndex, }: Props) => JSX.Element>;
@@ -0,0 +1,8 @@
import React from 'react';
import type { UniqueIdentifier } from '../../../../types';
export declare type Animation = (key: UniqueIdentifier, node: HTMLElement) => Promise<void> | void;
export interface Props {
animation: Animation;
children: React.ReactElement | null;
}
export declare function AnimationManager({ animation, children }: Props): JSX.Element;
@@ -0,0 +1,2 @@
export { AnimationManager } from './AnimationManager';
export type { Animation } from './AnimationManager';
@@ -0,0 +1,6 @@
import React from 'react';
interface Props {
children: React.ReactNode;
}
export declare function NullifiedContextProvider({ children }: Props): JSX.Element;
export {};
@@ -0,0 +1 @@
export { NullifiedContextProvider } from './NullifiedContextProvider';
@@ -0,0 +1,18 @@
import React from 'react';
import type { Transform } from '@dnd-kit/utilities';
import type { ClientRect, UniqueIdentifier } from '../../../../types';
declare type TransitionGetter = (activatorEvent: Event | null) => React.CSSProperties['transition'] | undefined;
export interface Props {
as: keyof JSX.IntrinsicElements;
activatorEvent: Event | null;
adjustScale?: boolean;
children?: React.ReactNode;
className?: string;
id: UniqueIdentifier;
rect: ClientRect | null;
style?: React.CSSProperties;
transition?: string | TransitionGetter;
transform: Transform;
}
export declare const PositionedOverlay: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
export {};
@@ -0,0 +1,2 @@
export { PositionedOverlay } from './PositionedOverlay';
export type { Props as PositionedOverlayProps } from './PositionedOverlay';
@@ -0,0 +1,5 @@
export { AnimationManager } from './AnimationManager';
export type { Animation } from './AnimationManager';
export { NullifiedContextProvider } from './NullifiedContextProvider';
export { PositionedOverlay } from './PositionedOverlay';
export type { PositionedOverlayProps } from './PositionedOverlay';
@@ -0,0 +1,3 @@
export { useDropAnimation, defaultDropAnimationConfiguration as defaultDropAnimation, defaultDropAnimationSideEffects, } from './useDropAnimation';
export type { DropAnimation, DropAnimationFunction, DropAnimationFunctionArguments, KeyframeResolver as DropAnimationKeyframeResolver, DropAnimationSideEffects, } from './useDropAnimation';
export { useKey } from './useKey';
@@ -0,0 +1,65 @@
import type { DeepRequired, Transform } from '@dnd-kit/utilities';
import type { Active, DraggableNodes, DroppableContainers } from '../../../store';
import type { ClientRect, UniqueIdentifier } from '../../../types';
import type { MeasuringConfiguration } from '../../DndContext';
interface SharedParameters {
active: {
id: UniqueIdentifier;
data: Active['data'];
node: HTMLElement;
rect: ClientRect;
};
dragOverlay: {
node: HTMLElement;
rect: ClientRect;
};
draggableNodes: DraggableNodes;
droppableContainers: DroppableContainers;
measuringConfiguration: DeepRequired<MeasuringConfiguration>;
}
export interface KeyframeResolverParameters extends SharedParameters {
transform: {
initial: Transform;
final: Transform;
};
}
export declare type KeyframeResolver = (parameters: KeyframeResolverParameters) => Keyframe[];
export interface DropAnimationOptions {
keyframes?: KeyframeResolver;
duration?: number;
easing?: string;
sideEffects?: DropAnimationSideEffects | null;
}
export declare type DropAnimation = DropAnimationFunction | DropAnimationOptions;
interface Arguments {
draggableNodes: DraggableNodes;
droppableContainers: DroppableContainers;
measuringConfiguration: DeepRequired<MeasuringConfiguration>;
config?: DropAnimation | null;
}
export interface DropAnimationFunctionArguments extends SharedParameters {
transform: Transform;
}
export declare type DropAnimationFunction = (args: DropAnimationFunctionArguments) => Promise<void> | void;
declare type CleanupFunction = () => void;
export interface DropAnimationSideEffectsParameters extends SharedParameters {
}
export declare type DropAnimationSideEffects = (parameters: DropAnimationSideEffectsParameters) => CleanupFunction | void;
declare type ExtractStringProperties<T> = {
[K in keyof T]?: T[K] extends string ? string : never;
};
declare type Styles = ExtractStringProperties<CSSStyleDeclaration>;
interface DefaultDropAnimationSideEffectsOptions {
className?: {
active?: string;
dragOverlay?: string;
};
styles?: {
active?: Styles;
dragOverlay?: Styles;
};
}
export declare const defaultDropAnimationSideEffects: (options: DefaultDropAnimationSideEffectsOptions) => DropAnimationSideEffects;
export declare const defaultDropAnimationConfiguration: Required<DropAnimationOptions>;
export declare function useDropAnimation({ config, draggableNodes, droppableContainers, measuringConfiguration, }: Arguments): (...args: any) => any;
export {};
@@ -0,0 +1,2 @@
import type { UniqueIdentifier } from '../../../types';
export declare function useKey(id: UniqueIdentifier | undefined): number | undefined;
@@ -0,0 +1,4 @@
export { DragOverlay } from './DragOverlay';
export type { Props } from './DragOverlay';
export { defaultDropAnimation, defaultDropAnimationSideEffects } from './hooks';
export type { DropAnimation, DropAnimationFunction, DropAnimationFunctionArguments, DropAnimationKeyframeResolver, DropAnimationSideEffects, } from './hooks';
+8
View File
@@ -0,0 +1,8 @@
export { defaultAnnouncements, defaultScreenReaderInstructions, } from './Accessibility';
export type { Announcements, ScreenReaderInstructions } from './Accessibility';
export { DndContext } from './DndContext';
export type { CancelDrop, DndContextProps, DraggableMeasuring, MeasuringConfiguration, } from './DndContext';
export { useDndMonitor } from './DndMonitor';
export type { DndMonitorListener } from './DndMonitor';
export { DragOverlay, defaultDropAnimation, defaultDropAnimationSideEffects, } from './DragOverlay';
export type { DropAnimation, DropAnimationFunction, DropAnimationFunctionArguments, DropAnimationKeyframeResolver, DropAnimationSideEffects, Props as DragOverlayProps, } from './DragOverlay';
File diff suppressed because it is too large Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large Load Diff
File diff suppressed because one or more lines are too long
+8
View File
@@ -0,0 +1,8 @@
export { useDraggable } from './useDraggable';
export type { DraggableAttributes, DraggableSyntheticListeners, UseDraggableArguments, } from './useDraggable';
export { useDndContext } from './useDndContext';
export type { UseDndContextReturnValue } from './useDndContext';
export { useDroppable } from './useDroppable';
export type { UseDroppableArguments } from './useDroppable';
export { AutoScrollActivator, MeasuringStrategy, MeasuringFrequency, TraversalOrder, } from './utilities';
export type { AutoScrollOptions, DroppableMeasuring } from './utilities';
+4
View File
@@ -0,0 +1,4 @@
import { ContextType } from 'react';
import { PublicContext } from '../store';
export declare function useDndContext(): import("../store").PublicContextDescriptor;
export declare type UseDndContextReturnValue = ContextType<typeof PublicContext>;
+37
View File
@@ -0,0 +1,37 @@
/// <reference types="react" />
import { Transform } from '@dnd-kit/utilities';
import { Data } from '../store';
import type { UniqueIdentifier } from '../types';
import { SyntheticListenerMap } from './utilities';
export interface UseDraggableArguments {
id: UniqueIdentifier;
data?: Data;
disabled?: boolean;
attributes?: {
role?: string;
roleDescription?: string;
tabIndex?: number;
};
}
export interface DraggableAttributes {
role: string;
tabIndex: number;
'aria-disabled': boolean;
'aria-pressed': boolean | undefined;
'aria-roledescription': string;
'aria-describedby': string;
}
export declare type DraggableSyntheticListeners = SyntheticListenerMap | undefined;
export declare function useDraggable({ id, data, disabled, attributes, }: UseDraggableArguments): {
active: import("../store").Active | null;
activatorEvent: Event | null;
activeNodeRect: import("../types").ClientRect | null;
attributes: DraggableAttributes;
isDragging: boolean;
listeners: SyntheticListenerMap | undefined;
node: import("react").MutableRefObject<HTMLElement | null>;
over: import("../store").Over | null;
setNodeRef: (element: HTMLElement | null) => void;
setActivatorNodeRef: (element: HTMLElement | null) => void;
transform: Transform | null;
};
+29
View File
@@ -0,0 +1,29 @@
/// <reference types="react" />
import { Data } from '../store';
import type { ClientRect, UniqueIdentifier } from '../types';
interface ResizeObserverConfig {
/** Whether the ResizeObserver should be disabled entirely */
disabled?: boolean;
/** Resize events may affect the layout and position of other droppable containers.
* Specify an array of `UniqueIdentifier` of droppable containers that should also be re-measured
* when this droppable container resizes. Specifying an empty array re-measures all droppable containers.
*/
updateMeasurementsFor?: UniqueIdentifier[];
/** Represents the debounce timeout between when resize events are observed and when elements are re-measured */
timeout?: number;
}
export interface UseDroppableArguments {
id: UniqueIdentifier;
disabled?: boolean;
data?: Data;
resizeObserverConfig?: ResizeObserverConfig;
}
export declare function useDroppable({ data, disabled, id, resizeObserverConfig, }: UseDroppableArguments): {
active: import("../store").Active | null;
rect: import("react").MutableRefObject<ClientRect | null>;
isOver: boolean;
node: import("react").MutableRefObject<HTMLElement | null>;
over: import("../store").Over | null;
setNodeRef: (element: HTMLElement | null) => void;
};
export {};
+21
View File
@@ -0,0 +1,21 @@
export { AutoScrollActivator, TraversalOrder, useAutoScroller, } from './useAutoScroller';
export type { Options as AutoScrollOptions } from './useAutoScroller';
export { useCachedNode } from './useCachedNode';
export { useCombineActivators } from './useCombineActivators';
export { useDroppableMeasuring, MeasuringFrequency, MeasuringStrategy, } from './useDroppableMeasuring';
export type { DroppableMeasuring } from './useDroppableMeasuring';
export { useInitialValue } from './useInitialValue';
export { useInitialRect } from './useInitialRect';
export { useRect } from './useRect';
export { useRectDelta } from './useRectDelta';
export { useResizeObserver } from './useResizeObserver';
export { useScrollableAncestors } from './useScrollableAncestors';
export { useScrollIntoViewIfNeeded } from './useScrollIntoViewIfNeeded';
export { useScrollOffsets } from './useScrollOffsets';
export { useScrollOffsetsDelta } from './useScrollOffsetsDelta';
export { useSensorSetup } from './useSensorSetup';
export { useSyntheticListeners } from './useSyntheticListeners';
export type { SyntheticListener, SyntheticListeners, SyntheticListenerMap, } from './useSyntheticListeners';
export { useRects } from './useRects';
export { useWindowRect } from './useWindowRect';
export { useDragOverlayMeasuring } from './useDragOverlayMeasuring';
@@ -0,0 +1,37 @@
import type { Coordinates, ClientRect } from '../../types';
export declare type ScrollAncestorSortingFn = (ancestors: Element[]) => Element[];
export declare enum AutoScrollActivator {
Pointer = 0,
DraggableRect = 1
}
export interface Options {
acceleration?: number;
activator?: AutoScrollActivator;
canScroll?: CanScroll;
enabled?: boolean;
interval?: number;
layoutShiftCompensation?: boolean | {
x: boolean;
y: boolean;
};
order?: TraversalOrder;
threshold?: {
x: number;
y: number;
};
}
interface Arguments extends Options {
draggingRect: ClientRect | null;
enabled: boolean;
pointerCoordinates: Coordinates | null;
scrollableAncestors: Element[];
scrollableAncestorRects: ClientRect[];
delta: Coordinates;
}
export declare type CanScroll = (element: Element) => boolean;
export declare enum TraversalOrder {
TreeOrder = 0,
ReversedTreeOrder = 1
}
export declare function useAutoScroller({ acceleration, activator, canScroll, draggingRect, enabled, interval, order, pointerCoordinates, scrollableAncestors, scrollableAncestorRects, delta, threshold, }: Arguments): void;
export {};
@@ -0,0 +1,3 @@
import type { DraggableNode, DraggableNodes } from '../../store';
import type { UniqueIdentifier } from '../../types';
export declare function useCachedNode(draggableNodes: DraggableNodes, id: UniqueIdentifier | null): DraggableNode['node']['current'];
@@ -0,0 +1,3 @@
import type { SensorActivatorFunction, SensorDescriptor } from '../../sensors';
import type { SyntheticListener, SyntheticListeners } from './useSyntheticListeners';
export declare function useCombineActivators(sensors: SensorDescriptor<any>[], getSyntheticHandler: (handler: SensorActivatorFunction<any>, sensor: SensorDescriptor<any>) => SyntheticListener['handler']): SyntheticListeners;
@@ -0,0 +1,7 @@
import type { PublicContextDescriptor } from '../../store';
import type { ClientRect } from '../../types';
interface Arguments {
measure(element: HTMLElement): ClientRect;
}
export declare function useDragOverlayMeasuring({ measure, }: Arguments): PublicContextDescriptor['dragOverlay'];
export {};
@@ -0,0 +1,27 @@
import type { DroppableContainer, RectMap } from '../../store/types';
import type { ClientRect, UniqueIdentifier } from '../../types';
interface Arguments {
dragging: boolean;
dependencies: any[];
config: DroppableMeasuring;
}
export declare enum MeasuringStrategy {
Always = 0,
BeforeDragging = 1,
WhileDragging = 2
}
export declare enum MeasuringFrequency {
Optimized = "optimized"
}
declare type MeasuringFunction = (element: HTMLElement) => ClientRect;
export interface DroppableMeasuring {
measure: MeasuringFunction;
strategy: MeasuringStrategy;
frequency: MeasuringFrequency | number;
}
export declare function useDroppableMeasuring(containers: DroppableContainer[], { dragging, dependencies, config }: Arguments): {
droppableRects: RectMap;
measureDroppableContainers: (ids?: UniqueIdentifier[]) => void;
measuringScheduled: boolean;
};
export {};
@@ -0,0 +1,2 @@
import type { ClientRect } from '../../types';
export declare function useInitialRect(node: HTMLElement | null, measure: (node: HTMLElement) => ClientRect): ClientRect | null;
@@ -0,0 +1,3 @@
declare type AnyFunction = (...args: any) => any;
export declare function useInitialValue<T, U extends AnyFunction | undefined = undefined>(value: T | null, computeFn?: U): U extends AnyFunction ? ReturnType<U> | null : T | null;
export {};
@@ -0,0 +1,10 @@
interface Arguments {
callback: MutationCallback;
disabled?: boolean;
}
/**
* Returns a new MutationObserver instance.
* If `MutationObserver` is undefined in the execution environment, returns `undefined`.
*/
export declare function useMutationObserver({ callback, disabled }: Arguments): MutationObserver | undefined;
export {};
+2
View File
@@ -0,0 +1,2 @@
import type { ClientRect } from '../../types';
export declare function useRect(element: HTMLElement | null, measure?: (element: HTMLElement) => ClientRect, fallbackRect?: ClientRect | null): ClientRect | null;
@@ -0,0 +1,2 @@
import type { ClientRect } from '../../types';
export declare function useRectDelta(rect: ClientRect | null): import("@dnd-kit/utilities/dist/coordinates/types").Coordinates;
+2
View File
@@ -0,0 +1,2 @@
import type { ClientRect } from '../../types';
export declare function useRects(elements: Element[], measure?: (element: Element) => ClientRect): ClientRect[];
@@ -0,0 +1,10 @@
interface Arguments {
callback: ResizeObserverCallback;
disabled?: boolean;
}
/**
* Returns a new ResizeObserver instance bound to the `onResize` callback.
* If `ResizeObserver` is undefined in the execution environment, returns `undefined`.
*/
export declare function useResizeObserver({ callback, disabled }: Arguments): ResizeObserver | undefined;
export {};
@@ -0,0 +1 @@
export declare function useScrollIntoViewIfNeeded(element: HTMLElement | null | undefined): void;
@@ -0,0 +1,2 @@
import type { Coordinates } from '../../types';
export declare function useScrollOffsets(elements: Element[]): Coordinates;
@@ -0,0 +1,2 @@
import { Coordinates } from '@dnd-kit/utilities';
export declare function useScrollOffsetsDelta(scrollOffsets: Coordinates, dependencies?: any[]): Coordinates;
@@ -0,0 +1 @@
export declare function useScrollableAncestors(node: HTMLElement | null): Element[];
@@ -0,0 +1,2 @@
import type { SensorDescriptor } from '../../sensors';
export declare function useSensorSetup(sensors: SensorDescriptor<any>[]): void;
@@ -0,0 +1,9 @@
/// <reference types="react" />
import type { SyntheticEventName, UniqueIdentifier } from '../../types';
export declare type SyntheticListener = {
eventName: SyntheticEventName;
handler: (event: React.SyntheticEvent, id: UniqueIdentifier) => void;
};
export declare type SyntheticListeners = SyntheticListener[];
export declare type SyntheticListenerMap = Record<string, Function>;
export declare function useSyntheticListeners(listeners: SyntheticListeners, id: UniqueIdentifier): SyntheticListenerMap;
@@ -0,0 +1 @@
export declare function useWindowRect(element: typeof window | null): import("../..").ClientRect | null;
+12
View File
@@ -0,0 +1,12 @@
export { DndContext, DragOverlay, defaultAnnouncements, defaultScreenReaderInstructions, defaultDropAnimation, defaultDropAnimationSideEffects, useDndMonitor, } from './components';
export type { Announcements, CancelDrop, DndContextProps, DndMonitorListener, DndMonitorListener as DndMonitorArguments, DragOverlayProps, DropAnimation, DropAnimationFunction, DropAnimationFunctionArguments, DropAnimationKeyframeResolver, DropAnimationSideEffects, DraggableMeasuring, MeasuringConfiguration, ScreenReaderInstructions, } from './components';
export { AutoScrollActivator, MeasuringFrequency, MeasuringStrategy, TraversalOrder, useDraggable, useDndContext, useDroppable, } from './hooks';
export type { AutoScrollOptions, DraggableAttributes, DraggableSyntheticListeners, DroppableMeasuring, UseDndContextReturnValue, UseDraggableArguments, UseDroppableArguments, } from './hooks';
export { applyModifiers } from './modifiers';
export type { Modifier, Modifiers } from './modifiers';
export { KeyboardSensor, KeyboardCode, MouseSensor, PointerSensor, TouchSensor, defaultKeyboardCoordinateGetter, useSensors, useSensor, } from './sensors';
export type { Activator, Activators, PointerActivationConstraint, KeyboardCodes, KeyboardCoordinateGetter, KeyboardSensorOptions, KeyboardSensorProps, MouseSensorOptions, PointerEventHandlers, PointerSensorOptions, PointerSensorProps, Sensor, Sensors, SensorContext, SensorDescriptor, SensorHandler, SensorInstance, SensorOptions, SensorProps, SensorResponse, TouchSensorOptions, } from './sensors';
export type { Active, Data, DataRef, PublicContextDescriptor as DndContextDescriptor, DraggableNode, DroppableContainers, DroppableContainer, Over, } from './store';
export type { ClientRect, DistanceMeasurement, DragEndEvent, DragMoveEvent, DragOverEvent, DragStartEvent, DragPendingEvent, DragAbortEvent, DragCancelEvent, Translate, UniqueIdentifier, } from './types';
export { defaultCoordinates, getClientRect, getFirstCollision, getScrollableAncestors, closestCenter, closestCorners, rectIntersection, pointerWithin, } from './utilities';
export type { Collision, CollisionDescriptor, CollisionDetection, } from './utilities';
+8
View File
@@ -0,0 +1,8 @@
'use strict'
if (process.env.NODE_ENV === 'production') {
module.exports = require('./core.cjs.production.min.js')
} else {
module.exports = require('./core.cjs.development.js')
}
+3
View File
@@ -0,0 +1,3 @@
import type { FirstArgument, Transform } from '@dnd-kit/utilities';
import type { Modifiers, Modifier } from './types';
export declare function applyModifiers(modifiers: Modifiers | undefined, { transform, ...args }: FirstArgument<Modifier>): Transform;
+2
View File
@@ -0,0 +1,2 @@
export type { Modifier, Modifiers } from './types';
export { applyModifiers } from './applyModifiers';
+17
View File
@@ -0,0 +1,17 @@
import type { Transform } from '@dnd-kit/utilities';
import type { Active, Over } from '../store';
import type { ClientRect } from '../types';
export declare type Modifier = (args: {
activatorEvent: Event | null;
active: Active | null;
activeNodeRect: ClientRect | null;
draggingNodeRect: ClientRect | null;
containerNodeRect: ClientRect | null;
over: Over | null;
overlayNodeRect: ClientRect | null;
scrollableAncestors: Element[];
scrollableAncestorRects: ClientRect[];
transform: Transform;
windowRect: ClientRect | null;
}) => Transform;
export declare type Modifiers = Modifier[];
+11
View File
@@ -0,0 +1,11 @@
export declare enum EventName {
Click = "click",
DragStart = "dragstart",
Keydown = "keydown",
ContextMenu = "contextmenu",
Resize = "resize",
SelectionChange = "selectionchange",
VisibilityChange = "visibilitychange"
}
export declare function preventDefault(event: Event): void;
export declare function stopPropagation(event: Event): void;
+11
View File
@@ -0,0 +1,11 @@
export { useSensor } from './useSensor';
export { useSensors } from './useSensors';
export { AbstractPointerSensor, PointerSensor } from './pointer';
export type { AbstractPointerSensorOptions, AbstractPointerSensorProps, PointerActivationConstraint, PointerEventHandlers, PointerSensorOptions, PointerSensorProps, } from './pointer';
export { MouseSensor } from './mouse';
export type { MouseSensorOptions, MouseSensorProps } from './mouse';
export { TouchSensor } from './touch';
export type { TouchSensorOptions, TouchSensorProps } from './touch';
export { KeyboardSensor, KeyboardCode, defaultKeyboardCoordinateGetter, } from './keyboard';
export type { KeyboardCoordinateGetter, KeyboardSensorOptions, KeyboardSensorProps, KeyboardCodes, } from './keyboard';
export type { Activator, Activators, Response as SensorResponse, Sensor, Sensors, SensorActivatorFunction, SensorDescriptor, SensorContext, SensorHandler, SensorInstance, SensorOptions, SensorProps, } from './types';
@@ -0,0 +1,27 @@
import type { Activators, SensorInstance, SensorProps, SensorOptions } from '../types';
import { KeyboardCoordinateGetter, KeyboardCodes } from './types';
export interface KeyboardSensorOptions extends SensorOptions {
keyboardCodes?: KeyboardCodes;
coordinateGetter?: KeyboardCoordinateGetter;
scrollBehavior?: ScrollBehavior;
onActivation?({ event }: {
event: KeyboardEvent;
}): void;
}
export declare type KeyboardSensorProps = SensorProps<KeyboardSensorOptions>;
export declare class KeyboardSensor implements SensorInstance {
private props;
autoScrollEnabled: boolean;
private referenceCoordinates;
private listeners;
private windowListeners;
constructor(props: KeyboardSensorProps);
private attach;
private handleStart;
private handleKeyDown;
private handleMove;
private handleEnd;
private handleCancel;
private detach;
static activators: Activators<KeyboardSensorOptions>;
}
@@ -0,0 +1,3 @@
import { KeyboardCoordinateGetter, KeyboardCodes } from './types';
export declare const defaultKeyboardCodes: KeyboardCodes;
export declare const defaultKeyboardCoordinateGetter: KeyboardCoordinateGetter;
+5
View File
@@ -0,0 +1,5 @@
export { KeyboardSensor } from './KeyboardSensor';
export type { KeyboardSensorOptions, KeyboardSensorProps, } from './KeyboardSensor';
export type { KeyboardCoordinateGetter, KeyboardCodes } from './types';
export { KeyboardCode } from './types';
export { defaultKeyboardCoordinateGetter } from './defaults';
+22
View File
@@ -0,0 +1,22 @@
import type { Coordinates, UniqueIdentifier } from '../../types';
import type { SensorContext } from '../types';
export declare enum KeyboardCode {
Space = "Space",
Down = "ArrowDown",
Right = "ArrowRight",
Left = "ArrowLeft",
Up = "ArrowUp",
Esc = "Escape",
Enter = "Enter",
Tab = "Tab"
}
export declare type KeyboardCodes = {
start: KeyboardEvent['code'][];
cancel: KeyboardEvent['code'][];
end: KeyboardEvent['code'][];
};
export declare type KeyboardCoordinateGetter = (event: KeyboardEvent, args: {
active: UniqueIdentifier;
currentCoordinates: Coordinates;
context: SensorContext;
}) => Coordinates | void;
+13
View File
@@ -0,0 +1,13 @@
import type { MouseEvent } from 'react';
import type { SensorProps } from '../types';
import { AbstractPointerSensor, AbstractPointerSensorOptions } from '../pointer';
export interface MouseSensorOptions extends AbstractPointerSensorOptions {
}
export declare type MouseSensorProps = SensorProps<MouseSensorOptions>;
export declare class MouseSensor extends AbstractPointerSensor {
constructor(props: MouseSensorProps);
static activators: {
eventName: "onMouseDown";
handler: ({ nativeEvent: event }: MouseEvent, { onActivation }: MouseSensorOptions) => boolean;
}[];
}
+2
View File
@@ -0,0 +1,2 @@
export { MouseSensor } from './MouseSensor';
export type { MouseSensorOptions, MouseSensorProps } from './MouseSensor';
@@ -0,0 +1,51 @@
import type { SensorInstance, SensorProps, SensorOptions } from '../types';
import type { DistanceMeasurement } from '../../types';
interface DistanceConstraint {
distance: DistanceMeasurement;
tolerance?: DistanceMeasurement;
}
interface DelayConstraint {
delay: number;
tolerance: DistanceMeasurement;
}
interface EventDescriptor {
name: keyof DocumentEventMap;
passive?: boolean;
}
export interface PointerEventHandlers {
cancel?: EventDescriptor;
move: EventDescriptor;
end: EventDescriptor;
}
export declare type PointerActivationConstraint = DelayConstraint | DistanceConstraint | (DelayConstraint & DistanceConstraint);
export interface AbstractPointerSensorOptions extends SensorOptions {
activationConstraint?: PointerActivationConstraint;
bypassActivationConstraint?(props: Pick<AbstractPointerSensorProps, 'activeNode' | 'event' | 'options'>): boolean;
onActivation?({ event }: {
event: Event;
}): void;
}
export declare type AbstractPointerSensorProps = SensorProps<AbstractPointerSensorOptions>;
export declare class AbstractPointerSensor implements SensorInstance {
private props;
private events;
autoScrollEnabled: boolean;
private document;
private activated;
private initialCoordinates;
private timeoutId;
private listeners;
private documentListeners;
private windowListeners;
constructor(props: AbstractPointerSensorProps, events: PointerEventHandlers, listenerTarget?: Document | EventTarget);
private attach;
private detach;
private handlePending;
private handleStart;
private handleMove;
private handleEnd;
private handleCancel;
private handleKeydown;
private removeTextSelection;
}
export {};
@@ -0,0 +1,13 @@
import type { PointerEvent } from 'react';
import type { SensorProps } from '../types';
import { AbstractPointerSensor, AbstractPointerSensorOptions } from './AbstractPointerSensor';
export interface PointerSensorOptions extends AbstractPointerSensorOptions {
}
export declare type PointerSensorProps = SensorProps<PointerSensorOptions>;
export declare class PointerSensor extends AbstractPointerSensor {
constructor(props: PointerSensorProps);
static activators: {
eventName: "onPointerDown";
handler: ({ nativeEvent: event }: PointerEvent, { onActivation }: PointerSensorOptions) => boolean;
}[];
}
+4
View File
@@ -0,0 +1,4 @@
export { AbstractPointerSensor } from './AbstractPointerSensor';
export type { PointerActivationConstraint, PointerEventHandlers, AbstractPointerSensorOptions, AbstractPointerSensorProps, } from './AbstractPointerSensor';
export { PointerSensor } from './PointerSensor';
export type { PointerSensorOptions, PointerSensorProps } from './PointerSensor';
+14
View File
@@ -0,0 +1,14 @@
import type { TouchEvent } from 'react';
import { AbstractPointerSensor, PointerSensorProps, PointerSensorOptions } from '../pointer';
import type { SensorProps } from '../types';
export interface TouchSensorOptions extends PointerSensorOptions {
}
export declare type TouchSensorProps = SensorProps<TouchSensorOptions>;
export declare class TouchSensor extends AbstractPointerSensor {
constructor(props: PointerSensorProps);
static activators: {
eventName: "onTouchStart";
handler: ({ nativeEvent: event }: TouchEvent, { onActivation }: TouchSensorOptions) => boolean;
}[];
static setup(): () => void;
}

Some files were not shown because too many files have changed in this diff Show More