@wordpress/keyboard-shortcuts 4.18.0 → 4.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +2 -0
- package/README.md +1 -1
- package/build/components/shortcut-provider.js +2 -0
- package/build/components/shortcut-provider.js.map +1 -1
- package/build/context.js +20 -1
- package/build/context.js.map +1 -1
- package/build/hooks/use-shortcut.js +7 -5
- package/build/hooks/use-shortcut.js.map +1 -1
- package/build-module/components/shortcut-provider.js +2 -0
- package/build-module/components/shortcut-provider.js.map +1 -1
- package/build-module/context.js +20 -1
- package/build-module/context.js.map +1 -1
- package/build-module/hooks/use-shortcut.js +7 -5
- package/build-module/hooks/use-shortcut.js.map +1 -1
- package/package.json +5 -5
- package/src/components/shortcut-provider.js +2 -0
- package/src/context.js +21 -1
- package/src/hooks/use-shortcut.js +12 -5
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
@@ -18,7 +18,7 @@ _This package assumes that your code will run in an **ES2015+** environment. If
|
|
18
18
|
|
19
19
|
### ShortcutProvider
|
20
20
|
|
21
|
-
Handles callbacks added to context by `useShortcut`.
|
21
|
+
Handles callbacks added to context by `useShortcut`. Adding a provider allows to register contextual shortcuts that are only active when a certain part of the UI is focused.
|
22
22
|
|
23
23
|
_Parameters_
|
24
24
|
|
@@ -20,6 +20,8 @@ const {
|
|
20
20
|
|
21
21
|
/**
|
22
22
|
* Handles callbacks added to context by `useShortcut`.
|
23
|
+
* Adding a provider allows to register contextual shortcuts
|
24
|
+
* that are only active when a certain part of the UI is focused.
|
23
25
|
*
|
24
26
|
* @param {Object} props Props to pass to `div`.
|
25
27
|
*
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_element","require","_context","Provider","context","ShortcutProvider","props","keyboardShortcuts","useRef","Set","onKeyDown","event","keyboardShortcut","current","createElement","value"],"sources":["@wordpress/keyboard-shortcuts/src/components/shortcut-provider.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { context } from '../context';\n\nconst { Provider } = context;\n\n/**\n * Handles callbacks added to context by `useShortcut`.\n *\n * @param {Object} props Props to pass to `div`.\n *\n * @return {import('@wordpress/element').WPElement} Component.\n */\nexport function ShortcutProvider( props ) {\n\tconst keyboardShortcuts = useRef( new Set() );\n\n\tfunction onKeyDown( event ) {\n\t\tif ( props.onKeyDown ) props.onKeyDown( event );\n\n\t\tfor ( const keyboardShortcut of keyboardShortcuts.current ) {\n\t\t\tkeyboardShortcut( event );\n\t\t}\n\t}\n\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<Provider value={ keyboardShortcuts }>\n\t\t\t<div { ...props } onKeyDown={ onKeyDown } />\n\t\t</Provider>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,MAAM;EAAEE;AAAS,CAAC,GAAGC,gBAAO;;AAE5B;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,gBAAgBA,CAAEC,KAAK,EAAG;EACzC,MAAMC,iBAAiB,GAAG,IAAAC,eAAM,EAAE,IAAIC,GAAG,CAAC,CAAE,CAAC;EAE7C,SAASC,SAASA,CAAEC,KAAK,EAAG;IAC3B,IAAKL,KAAK,CAACI,SAAS,EAAGJ,KAAK,CAACI,SAAS,CAAEC,KAAM,CAAC;IAE/C,KAAM,MAAMC,gBAAgB,IAAIL,iBAAiB,CAACM,OAAO,EAAG;MAC3DD,gBAAgB,CAAED,KAAM,CAAC;IAC1B;EACD;;EAEA;EACA,OACC,IAAAX,QAAA,CAAAc,aAAA,EAACX,QAAQ;IAACY,KAAK,EAAGR;EAAmB,GACpC,IAAAP,QAAA,CAAAc,aAAA;IAAA,GAAUR,KAAK;IAAGI,SAAS,EAAGA;EAAW,CAAE,CAClC,CAAC;EAEZ;AACD"}
|
1
|
+
{"version":3,"names":["_element","require","_context","Provider","context","ShortcutProvider","props","keyboardShortcuts","useRef","Set","onKeyDown","event","keyboardShortcut","current","createElement","value"],"sources":["@wordpress/keyboard-shortcuts/src/components/shortcut-provider.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { context } from '../context';\n\nconst { Provider } = context;\n\n/**\n * Handles callbacks added to context by `useShortcut`.\n * Adding a provider allows to register contextual shortcuts\n * that are only active when a certain part of the UI is focused.\n *\n * @param {Object} props Props to pass to `div`.\n *\n * @return {import('@wordpress/element').WPElement} Component.\n */\nexport function ShortcutProvider( props ) {\n\tconst keyboardShortcuts = useRef( new Set() );\n\n\tfunction onKeyDown( event ) {\n\t\tif ( props.onKeyDown ) props.onKeyDown( event );\n\n\t\tfor ( const keyboardShortcut of keyboardShortcuts.current ) {\n\t\t\tkeyboardShortcut( event );\n\t\t}\n\t}\n\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<Provider value={ keyboardShortcuts }>\n\t\t\t<div { ...props } onKeyDown={ onKeyDown } />\n\t\t</Provider>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,MAAM;EAAEE;AAAS,CAAC,GAAGC,gBAAO;;AAE5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,gBAAgBA,CAAEC,KAAK,EAAG;EACzC,MAAMC,iBAAiB,GAAG,IAAAC,eAAM,EAAE,IAAIC,GAAG,CAAC,CAAE,CAAC;EAE7C,SAASC,SAASA,CAAEC,KAAK,EAAG;IAC3B,IAAKL,KAAK,CAACI,SAAS,EAAGJ,KAAK,CAACI,SAAS,CAAEC,KAAM,CAAC;IAE/C,KAAM,MAAMC,gBAAgB,IAAIL,iBAAiB,CAACM,OAAO,EAAG;MAC3DD,gBAAgB,CAAED,KAAM,CAAC;IAC1B;EACD;;EAEA;EACA,OACC,IAAAX,QAAA,CAAAc,aAAA,EAACX,QAAQ;IAACY,KAAK,EAAGR;EAAmB,GACpC,IAAAP,QAAA,CAAAc,aAAA;IAAA,GAAUR,KAAK;IAAGI,SAAS,EAAGA;EAAW,CAAE,CAClC,CAAC;EAEZ;AACD"}
|
package/build/context.js
CHANGED
@@ -9,6 +9,25 @@ var _element = require("@wordpress/element");
|
|
9
9
|
* WordPress dependencies
|
10
10
|
*/
|
11
11
|
|
12
|
-
const
|
12
|
+
const globalShortcuts = new Set();
|
13
|
+
const globalListener = event => {
|
14
|
+
for (const keyboardShortcut of globalShortcuts) {
|
15
|
+
keyboardShortcut(event);
|
16
|
+
}
|
17
|
+
};
|
18
|
+
const context = (0, _element.createContext)({
|
19
|
+
add: shortcut => {
|
20
|
+
if (globalShortcuts.size === 0) {
|
21
|
+
document.addEventListener('keydown', globalListener);
|
22
|
+
}
|
23
|
+
globalShortcuts.add(shortcut);
|
24
|
+
},
|
25
|
+
delete: shortcut => {
|
26
|
+
globalShortcuts.delete(shortcut);
|
27
|
+
if (globalShortcuts.size === 0) {
|
28
|
+
document.removeEventListener('keydown', globalListener);
|
29
|
+
}
|
30
|
+
}
|
31
|
+
});
|
13
32
|
exports.context = context;
|
14
33
|
//# sourceMappingURL=context.js.map
|
package/build/context.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_element","require","context","createContext","exports"],"sources":["@wordpress/keyboard-shortcuts/src/context.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nexport const context = createContext();\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAHA;AACA;AACA;;
|
1
|
+
{"version":3,"names":["_element","require","globalShortcuts","Set","globalListener","event","keyboardShortcut","context","createContext","add","shortcut","size","document","addEventListener","delete","removeEventListener","exports"],"sources":["@wordpress/keyboard-shortcuts/src/context.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nconst globalShortcuts = new Set();\nconst globalListener = ( event ) => {\n\tfor ( const keyboardShortcut of globalShortcuts ) {\n\t\tkeyboardShortcut( event );\n\t}\n};\n\nexport const context = createContext( {\n\tadd: ( shortcut ) => {\n\t\tif ( globalShortcuts.size === 0 ) {\n\t\t\tdocument.addEventListener( 'keydown', globalListener );\n\t\t}\n\t\tglobalShortcuts.add( shortcut );\n\t},\n\tdelete: ( shortcut ) => {\n\t\tglobalShortcuts.delete( shortcut );\n\t\tif ( globalShortcuts.size === 0 ) {\n\t\t\tdocument.removeEventListener( 'keydown', globalListener );\n\t\t}\n\t},\n} );\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAGA,MAAMC,eAAe,GAAG,IAAIC,GAAG,CAAC,CAAC;AACjC,MAAMC,cAAc,GAAKC,KAAK,IAAM;EACnC,KAAM,MAAMC,gBAAgB,IAAIJ,eAAe,EAAG;IACjDI,gBAAgB,CAAED,KAAM,CAAC;EAC1B;AACD,CAAC;AAEM,MAAME,OAAO,GAAG,IAAAC,sBAAa,EAAE;EACrCC,GAAG,EAAIC,QAAQ,IAAM;IACpB,IAAKR,eAAe,CAACS,IAAI,KAAK,CAAC,EAAG;MACjCC,QAAQ,CAACC,gBAAgB,CAAE,SAAS,EAAET,cAAe,CAAC;IACvD;IACAF,eAAe,CAACO,GAAG,CAAEC,QAAS,CAAC;EAChC,CAAC;EACDI,MAAM,EAAIJ,QAAQ,IAAM;IACvBR,eAAe,CAACY,MAAM,CAAEJ,QAAS,CAAC;IAClC,IAAKR,eAAe,CAACS,IAAI,KAAK,CAAC,EAAG;MACjCC,QAAQ,CAACG,mBAAmB,CAAE,SAAS,EAAEX,cAAe,CAAC;IAC1D;EACD;AACD,CAAE,CAAC;AAACY,OAAA,CAAAT,OAAA,GAAAA,OAAA"}
|
@@ -25,12 +25,14 @@ var _context = require("../context");
|
|
25
25
|
* @param {boolean} options.isDisabled Whether to disable to shortut.
|
26
26
|
*/
|
27
27
|
function useShortcut(name, callback, {
|
28
|
-
isDisabled
|
28
|
+
isDisabled = false
|
29
29
|
} = {}) {
|
30
30
|
const shortcuts = (0, _element.useContext)(_context.context);
|
31
31
|
const isMatch = (0, _useShortcutEventMatch.default)();
|
32
32
|
const callbackRef = (0, _element.useRef)();
|
33
|
-
|
33
|
+
(0, _element.useEffect)(() => {
|
34
|
+
callbackRef.current = callback;
|
35
|
+
}, [callback]);
|
34
36
|
(0, _element.useEffect)(() => {
|
35
37
|
if (isDisabled) {
|
36
38
|
return;
|
@@ -40,10 +42,10 @@ function useShortcut(name, callback, {
|
|
40
42
|
callbackRef.current(event);
|
41
43
|
}
|
42
44
|
}
|
43
|
-
shortcuts.
|
45
|
+
shortcuts.add(_callback);
|
44
46
|
return () => {
|
45
|
-
shortcuts.
|
47
|
+
shortcuts.delete(_callback);
|
46
48
|
};
|
47
|
-
}, [name, isDisabled]);
|
49
|
+
}, [name, isDisabled, shortcuts]);
|
48
50
|
}
|
49
51
|
//# sourceMappingURL=use-shortcut.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_element","require","_useShortcutEventMatch","_interopRequireDefault","_context","useShortcut","name","callback","isDisabled","shortcuts","useContext","context","isMatch","useShortcutEventMatch","callbackRef","useRef","
|
1
|
+
{"version":3,"names":["_element","require","_useShortcutEventMatch","_interopRequireDefault","_context","useShortcut","name","callback","isDisabled","shortcuts","useContext","context","isMatch","useShortcutEventMatch","callbackRef","useRef","useEffect","current","_callback","event","add","delete"],"sources":["@wordpress/keyboard-shortcuts/src/hooks/use-shortcut.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useShortcutEventMatch from './use-shortcut-event-match';\nimport { context } from '../context';\n\n/**\n * Attach a keyboard shortcut handler.\n *\n * @param {string} name Shortcut name.\n * @param {Function} callback Shortcut callback.\n * @param {Object} options Shortcut options.\n * @param {boolean} options.isDisabled Whether to disable to shortut.\n */\nexport default function useShortcut(\n\tname,\n\tcallback,\n\t{ isDisabled = false } = {}\n) {\n\tconst shortcuts = useContext( context );\n\tconst isMatch = useShortcutEventMatch();\n\tconst callbackRef = useRef();\n\n\tuseEffect( () => {\n\t\tcallbackRef.current = callback;\n\t}, [ callback ] );\n\n\tuseEffect( () => {\n\t\tif ( isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfunction _callback( event ) {\n\t\t\tif ( isMatch( name, event ) ) {\n\t\t\t\tcallbackRef.current( event );\n\t\t\t}\n\t\t}\n\n\t\tshortcuts.add( _callback );\n\t\treturn () => {\n\t\t\tshortcuts.delete( _callback );\n\t\t};\n\t}, [ name, isDisabled, shortcuts ] );\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,sBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AATA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASI,WAAWA,CAClCC,IAAI,EACJC,QAAQ,EACR;EAAEC,UAAU,GAAG;AAAM,CAAC,GAAG,CAAC,CAAC,EAC1B;EACD,MAAMC,SAAS,GAAG,IAAAC,mBAAU,EAAEC,gBAAQ,CAAC;EACvC,MAAMC,OAAO,GAAG,IAAAC,8BAAqB,EAAC,CAAC;EACvC,MAAMC,WAAW,GAAG,IAAAC,eAAM,EAAC,CAAC;EAE5B,IAAAC,kBAAS,EAAE,MAAM;IAChBF,WAAW,CAACG,OAAO,GAAGV,QAAQ;EAC/B,CAAC,EAAE,CAAEA,QAAQ,CAAG,CAAC;EAEjB,IAAAS,kBAAS,EAAE,MAAM;IAChB,IAAKR,UAAU,EAAG;MACjB;IACD;IAEA,SAASU,SAASA,CAAEC,KAAK,EAAG;MAC3B,IAAKP,OAAO,CAAEN,IAAI,EAAEa,KAAM,CAAC,EAAG;QAC7BL,WAAW,CAACG,OAAO,CAAEE,KAAM,CAAC;MAC7B;IACD;IAEAV,SAAS,CAACW,GAAG,CAAEF,SAAU,CAAC;IAC1B,OAAO,MAAM;MACZT,SAAS,CAACY,MAAM,CAAEH,SAAU,CAAC;IAC9B,CAAC;EACF,CAAC,EAAE,CAAEZ,IAAI,EAAEE,UAAU,EAAEC,SAAS,CAAG,CAAC;AACrC"}
|
@@ -14,6 +14,8 @@ const {
|
|
14
14
|
|
15
15
|
/**
|
16
16
|
* Handles callbacks added to context by `useShortcut`.
|
17
|
+
* Adding a provider allows to register contextual shortcuts
|
18
|
+
* that are only active when a certain part of the UI is focused.
|
17
19
|
*
|
18
20
|
* @param {Object} props Props to pass to `div`.
|
19
21
|
*
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["useRef","context","Provider","ShortcutProvider","props","keyboardShortcuts","Set","onKeyDown","event","keyboardShortcut","current","createElement","value"],"sources":["@wordpress/keyboard-shortcuts/src/components/shortcut-provider.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { context } from '../context';\n\nconst { Provider } = context;\n\n/**\n * Handles callbacks added to context by `useShortcut`.\n *\n * @param {Object} props Props to pass to `div`.\n *\n * @return {import('@wordpress/element').WPElement} Component.\n */\nexport function ShortcutProvider( props ) {\n\tconst keyboardShortcuts = useRef( new Set() );\n\n\tfunction onKeyDown( event ) {\n\t\tif ( props.onKeyDown ) props.onKeyDown( event );\n\n\t\tfor ( const keyboardShortcut of keyboardShortcuts.current ) {\n\t\t\tkeyboardShortcut( event );\n\t\t}\n\t}\n\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<Provider value={ keyboardShortcuts }>\n\t\t\t<div { ...props } onKeyDown={ onKeyDown } />\n\t\t</Provider>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,oBAAoB;;AAE3C;AACA;AACA;AACA,SAASC,OAAO,QAAQ,YAAY;AAEpC,MAAM;EAAEC;AAAS,CAAC,GAAGD,OAAO;;AAE5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASE,gBAAgBA,CAAEC,KAAK,EAAG;EACzC,MAAMC,iBAAiB,GAAGL,MAAM,CAAE,IAAIM,GAAG,CAAC,CAAE,CAAC;EAE7C,SAASC,SAASA,CAAEC,KAAK,EAAG;IAC3B,IAAKJ,KAAK,CAACG,SAAS,EAAGH,KAAK,CAACG,SAAS,CAAEC,KAAM,CAAC;IAE/C,KAAM,MAAMC,gBAAgB,IAAIJ,iBAAiB,CAACK,OAAO,EAAG;MAC3DD,gBAAgB,CAAED,KAAM,CAAC;IAC1B;EACD;;EAEA;EACA,OACCG,aAAA,CAACT,QAAQ;IAACU,KAAK,EAAGP;EAAmB,GACpCM,aAAA;IAAA,GAAUP,KAAK;IAAGG,SAAS,EAAGA;EAAW,CAAE,CAClC,CAAC;EAEZ;AACD"}
|
1
|
+
{"version":3,"names":["useRef","context","Provider","ShortcutProvider","props","keyboardShortcuts","Set","onKeyDown","event","keyboardShortcut","current","createElement","value"],"sources":["@wordpress/keyboard-shortcuts/src/components/shortcut-provider.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { context } from '../context';\n\nconst { Provider } = context;\n\n/**\n * Handles callbacks added to context by `useShortcut`.\n * Adding a provider allows to register contextual shortcuts\n * that are only active when a certain part of the UI is focused.\n *\n * @param {Object} props Props to pass to `div`.\n *\n * @return {import('@wordpress/element').WPElement} Component.\n */\nexport function ShortcutProvider( props ) {\n\tconst keyboardShortcuts = useRef( new Set() );\n\n\tfunction onKeyDown( event ) {\n\t\tif ( props.onKeyDown ) props.onKeyDown( event );\n\n\t\tfor ( const keyboardShortcut of keyboardShortcuts.current ) {\n\t\t\tkeyboardShortcut( event );\n\t\t}\n\t}\n\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<Provider value={ keyboardShortcuts }>\n\t\t\t<div { ...props } onKeyDown={ onKeyDown } />\n\t\t</Provider>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,MAAM,QAAQ,oBAAoB;;AAE3C;AACA;AACA;AACA,SAASC,OAAO,QAAQ,YAAY;AAEpC,MAAM;EAAEC;AAAS,CAAC,GAAGD,OAAO;;AAE5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASE,gBAAgBA,CAAEC,KAAK,EAAG;EACzC,MAAMC,iBAAiB,GAAGL,MAAM,CAAE,IAAIM,GAAG,CAAC,CAAE,CAAC;EAE7C,SAASC,SAASA,CAAEC,KAAK,EAAG;IAC3B,IAAKJ,KAAK,CAACG,SAAS,EAAGH,KAAK,CAACG,SAAS,CAAEC,KAAM,CAAC;IAE/C,KAAM,MAAMC,gBAAgB,IAAIJ,iBAAiB,CAACK,OAAO,EAAG;MAC3DD,gBAAgB,CAAED,KAAM,CAAC;IAC1B;EACD;;EAEA;EACA,OACCG,aAAA,CAACT,QAAQ;IAACU,KAAK,EAAGP;EAAmB,GACpCM,aAAA;IAAA,GAAUP,KAAK;IAAGG,SAAS,EAAGA;EAAW,CAAE,CAClC,CAAC;EAEZ;AACD"}
|
package/build-module/context.js
CHANGED
@@ -2,5 +2,24 @@
|
|
2
2
|
* WordPress dependencies
|
3
3
|
*/
|
4
4
|
import { createContext } from '@wordpress/element';
|
5
|
-
|
5
|
+
const globalShortcuts = new Set();
|
6
|
+
const globalListener = event => {
|
7
|
+
for (const keyboardShortcut of globalShortcuts) {
|
8
|
+
keyboardShortcut(event);
|
9
|
+
}
|
10
|
+
};
|
11
|
+
export const context = createContext({
|
12
|
+
add: shortcut => {
|
13
|
+
if (globalShortcuts.size === 0) {
|
14
|
+
document.addEventListener('keydown', globalListener);
|
15
|
+
}
|
16
|
+
globalShortcuts.add(shortcut);
|
17
|
+
},
|
18
|
+
delete: shortcut => {
|
19
|
+
globalShortcuts.delete(shortcut);
|
20
|
+
if (globalShortcuts.size === 0) {
|
21
|
+
document.removeEventListener('keydown', globalListener);
|
22
|
+
}
|
23
|
+
}
|
24
|
+
});
|
6
25
|
//# sourceMappingURL=context.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["createContext","context"],"sources":["@wordpress/keyboard-shortcuts/src/context.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nexport const context = createContext();\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,oBAAoB;AAElD,
|
1
|
+
{"version":3,"names":["createContext","globalShortcuts","Set","globalListener","event","keyboardShortcut","context","add","shortcut","size","document","addEventListener","delete","removeEventListener"],"sources":["@wordpress/keyboard-shortcuts/src/context.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nconst globalShortcuts = new Set();\nconst globalListener = ( event ) => {\n\tfor ( const keyboardShortcut of globalShortcuts ) {\n\t\tkeyboardShortcut( event );\n\t}\n};\n\nexport const context = createContext( {\n\tadd: ( shortcut ) => {\n\t\tif ( globalShortcuts.size === 0 ) {\n\t\t\tdocument.addEventListener( 'keydown', globalListener );\n\t\t}\n\t\tglobalShortcuts.add( shortcut );\n\t},\n\tdelete: ( shortcut ) => {\n\t\tglobalShortcuts.delete( shortcut );\n\t\tif ( globalShortcuts.size === 0 ) {\n\t\t\tdocument.removeEventListener( 'keydown', globalListener );\n\t\t}\n\t},\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,oBAAoB;AAElD,MAAMC,eAAe,GAAG,IAAIC,GAAG,CAAC,CAAC;AACjC,MAAMC,cAAc,GAAKC,KAAK,IAAM;EACnC,KAAM,MAAMC,gBAAgB,IAAIJ,eAAe,EAAG;IACjDI,gBAAgB,CAAED,KAAM,CAAC;EAC1B;AACD,CAAC;AAED,OAAO,MAAME,OAAO,GAAGN,aAAa,CAAE;EACrCO,GAAG,EAAIC,QAAQ,IAAM;IACpB,IAAKP,eAAe,CAACQ,IAAI,KAAK,CAAC,EAAG;MACjCC,QAAQ,CAACC,gBAAgB,CAAE,SAAS,EAAER,cAAe,CAAC;IACvD;IACAF,eAAe,CAACM,GAAG,CAAEC,QAAS,CAAC;EAChC,CAAC;EACDI,MAAM,EAAIJ,QAAQ,IAAM;IACvBP,eAAe,CAACW,MAAM,CAAEJ,QAAS,CAAC;IAClC,IAAKP,eAAe,CAACQ,IAAI,KAAK,CAAC,EAAG;MACjCC,QAAQ,CAACG,mBAAmB,CAAE,SAAS,EAAEV,cAAe,CAAC;IAC1D;EACD;AACD,CAAE,CAAC"}
|
@@ -18,12 +18,14 @@ import { context } from '../context';
|
|
18
18
|
* @param {boolean} options.isDisabled Whether to disable to shortut.
|
19
19
|
*/
|
20
20
|
export default function useShortcut(name, callback, {
|
21
|
-
isDisabled
|
21
|
+
isDisabled = false
|
22
22
|
} = {}) {
|
23
23
|
const shortcuts = useContext(context);
|
24
24
|
const isMatch = useShortcutEventMatch();
|
25
25
|
const callbackRef = useRef();
|
26
|
-
|
26
|
+
useEffect(() => {
|
27
|
+
callbackRef.current = callback;
|
28
|
+
}, [callback]);
|
27
29
|
useEffect(() => {
|
28
30
|
if (isDisabled) {
|
29
31
|
return;
|
@@ -33,10 +35,10 @@ export default function useShortcut(name, callback, {
|
|
33
35
|
callbackRef.current(event);
|
34
36
|
}
|
35
37
|
}
|
36
|
-
shortcuts.
|
38
|
+
shortcuts.add(_callback);
|
37
39
|
return () => {
|
38
|
-
shortcuts.
|
40
|
+
shortcuts.delete(_callback);
|
39
41
|
};
|
40
|
-
}, [name, isDisabled]);
|
42
|
+
}, [name, isDisabled, shortcuts]);
|
41
43
|
}
|
42
44
|
//# sourceMappingURL=use-shortcut.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["useContext","useEffect","useRef","useShortcutEventMatch","context","useShortcut","name","callback","isDisabled","shortcuts","isMatch","callbackRef","current","_callback","event","add","delete"],"sources":["@wordpress/keyboard-shortcuts/src/hooks/use-shortcut.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useShortcutEventMatch from './use-shortcut-event-match';\nimport { context } from '../context';\n\n/**\n * Attach a keyboard shortcut handler.\n *\n * @param {string} name Shortcut name.\n * @param {Function} callback Shortcut callback.\n * @param {Object} options Shortcut options.\n * @param {boolean} options.isDisabled Whether to disable to shortut.\n */\nexport default function useShortcut(
|
1
|
+
{"version":3,"names":["useContext","useEffect","useRef","useShortcutEventMatch","context","useShortcut","name","callback","isDisabled","shortcuts","isMatch","callbackRef","current","_callback","event","add","delete"],"sources":["@wordpress/keyboard-shortcuts/src/hooks/use-shortcut.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useContext, useEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useShortcutEventMatch from './use-shortcut-event-match';\nimport { context } from '../context';\n\n/**\n * Attach a keyboard shortcut handler.\n *\n * @param {string} name Shortcut name.\n * @param {Function} callback Shortcut callback.\n * @param {Object} options Shortcut options.\n * @param {boolean} options.isDisabled Whether to disable to shortut.\n */\nexport default function useShortcut(\n\tname,\n\tcallback,\n\t{ isDisabled = false } = {}\n) {\n\tconst shortcuts = useContext( context );\n\tconst isMatch = useShortcutEventMatch();\n\tconst callbackRef = useRef();\n\n\tuseEffect( () => {\n\t\tcallbackRef.current = callback;\n\t}, [ callback ] );\n\n\tuseEffect( () => {\n\t\tif ( isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfunction _callback( event ) {\n\t\t\tif ( isMatch( name, event ) ) {\n\t\t\t\tcallbackRef.current( event );\n\t\t\t}\n\t\t}\n\n\t\tshortcuts.add( _callback );\n\t\treturn () => {\n\t\t\tshortcuts.delete( _callback );\n\t\t};\n\t}, [ name, isDisabled, shortcuts ] );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;;AAElE;AACA;AACA;AACA,OAAOC,qBAAqB,MAAM,4BAA4B;AAC9D,SAASC,OAAO,QAAQ,YAAY;;AAEpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,WAAWA,CAClCC,IAAI,EACJC,QAAQ,EACR;EAAEC,UAAU,GAAG;AAAM,CAAC,GAAG,CAAC,CAAC,EAC1B;EACD,MAAMC,SAAS,GAAGT,UAAU,CAAEI,OAAQ,CAAC;EACvC,MAAMM,OAAO,GAAGP,qBAAqB,CAAC,CAAC;EACvC,MAAMQ,WAAW,GAAGT,MAAM,CAAC,CAAC;EAE5BD,SAAS,CAAE,MAAM;IAChBU,WAAW,CAACC,OAAO,GAAGL,QAAQ;EAC/B,CAAC,EAAE,CAAEA,QAAQ,CAAG,CAAC;EAEjBN,SAAS,CAAE,MAAM;IAChB,IAAKO,UAAU,EAAG;MACjB;IACD;IAEA,SAASK,SAASA,CAAEC,KAAK,EAAG;MAC3B,IAAKJ,OAAO,CAAEJ,IAAI,EAAEQ,KAAM,CAAC,EAAG;QAC7BH,WAAW,CAACC,OAAO,CAAEE,KAAM,CAAC;MAC7B;IACD;IAEAL,SAAS,CAACM,GAAG,CAAEF,SAAU,CAAC;IAC1B,OAAO,MAAM;MACZJ,SAAS,CAACO,MAAM,CAAEH,SAAU,CAAC;IAC9B,CAAC;EACF,CAAC,EAAE,CAAEP,IAAI,EAAEE,UAAU,EAAEC,SAAS,CAAG,CAAC;AACrC"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@wordpress/keyboard-shortcuts",
|
3
|
-
"version": "4.
|
3
|
+
"version": "4.19.0",
|
4
4
|
"description": "Handling keyboard shortcuts.",
|
5
5
|
"author": "The WordPress Contributors",
|
6
6
|
"license": "GPL-2.0-or-later",
|
@@ -26,9 +26,9 @@
|
|
26
26
|
"react-native": "src/index",
|
27
27
|
"dependencies": {
|
28
28
|
"@babel/runtime": "^7.16.0",
|
29
|
-
"@wordpress/data": "^9.
|
30
|
-
"@wordpress/element": "^5.
|
31
|
-
"@wordpress/keycodes": "^3.
|
29
|
+
"@wordpress/data": "^9.12.0",
|
30
|
+
"@wordpress/element": "^5.19.0",
|
31
|
+
"@wordpress/keycodes": "^3.42.0",
|
32
32
|
"rememo": "^4.0.2"
|
33
33
|
},
|
34
34
|
"peerDependencies": {
|
@@ -37,5 +37,5 @@
|
|
37
37
|
"publishConfig": {
|
38
38
|
"access": "public"
|
39
39
|
},
|
40
|
-
"gitHead": "
|
40
|
+
"gitHead": "cc35f517ed017ab7131319af3e87c359e8de175d"
|
41
41
|
}
|
@@ -12,6 +12,8 @@ const { Provider } = context;
|
|
12
12
|
|
13
13
|
/**
|
14
14
|
* Handles callbacks added to context by `useShortcut`.
|
15
|
+
* Adding a provider allows to register contextual shortcuts
|
16
|
+
* that are only active when a certain part of the UI is focused.
|
15
17
|
*
|
16
18
|
* @param {Object} props Props to pass to `div`.
|
17
19
|
*
|
package/src/context.js
CHANGED
@@ -3,4 +3,24 @@
|
|
3
3
|
*/
|
4
4
|
import { createContext } from '@wordpress/element';
|
5
5
|
|
6
|
-
|
6
|
+
const globalShortcuts = new Set();
|
7
|
+
const globalListener = ( event ) => {
|
8
|
+
for ( const keyboardShortcut of globalShortcuts ) {
|
9
|
+
keyboardShortcut( event );
|
10
|
+
}
|
11
|
+
};
|
12
|
+
|
13
|
+
export const context = createContext( {
|
14
|
+
add: ( shortcut ) => {
|
15
|
+
if ( globalShortcuts.size === 0 ) {
|
16
|
+
document.addEventListener( 'keydown', globalListener );
|
17
|
+
}
|
18
|
+
globalShortcuts.add( shortcut );
|
19
|
+
},
|
20
|
+
delete: ( shortcut ) => {
|
21
|
+
globalShortcuts.delete( shortcut );
|
22
|
+
if ( globalShortcuts.size === 0 ) {
|
23
|
+
document.removeEventListener( 'keydown', globalListener );
|
24
|
+
}
|
25
|
+
},
|
26
|
+
} );
|
@@ -17,11 +17,18 @@ import { context } from '../context';
|
|
17
17
|
* @param {Object} options Shortcut options.
|
18
18
|
* @param {boolean} options.isDisabled Whether to disable to shortut.
|
19
19
|
*/
|
20
|
-
export default function useShortcut(
|
20
|
+
export default function useShortcut(
|
21
|
+
name,
|
22
|
+
callback,
|
23
|
+
{ isDisabled = false } = {}
|
24
|
+
) {
|
21
25
|
const shortcuts = useContext( context );
|
22
26
|
const isMatch = useShortcutEventMatch();
|
23
27
|
const callbackRef = useRef();
|
24
|
-
|
28
|
+
|
29
|
+
useEffect( () => {
|
30
|
+
callbackRef.current = callback;
|
31
|
+
}, [ callback ] );
|
25
32
|
|
26
33
|
useEffect( () => {
|
27
34
|
if ( isDisabled ) {
|
@@ -34,9 +41,9 @@ export default function useShortcut( name, callback, { isDisabled } = {} ) {
|
|
34
41
|
}
|
35
42
|
}
|
36
43
|
|
37
|
-
shortcuts.
|
44
|
+
shortcuts.add( _callback );
|
38
45
|
return () => {
|
39
|
-
shortcuts.
|
46
|
+
shortcuts.delete( _callback );
|
40
47
|
};
|
41
|
-
}, [ name, isDisabled ] );
|
48
|
+
}, [ name, isDisabled, shortcuts ] );
|
42
49
|
}
|