@wordpress/keyboard-shortcuts 3.0.1 → 3.0.5

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/README.md CHANGED
@@ -10,12 +10,24 @@ Install the module
10
10
  npm install @wordpress/keyboard-shortcuts --save
11
11
  ```
12
12
 
13
- _This package assumes that your code will run in an **ES2015+** environment. If you're using an environment that has limited or no support for ES2015+ such as IE browsers then using [core-js](https://github.com/zloirock/core-js) will add polyfills for these methods._
13
+ _This package assumes that your code will run in an **ES2015+** environment. If you're using an environment that has limited or no support for such language features and APIs, you should include [the polyfill shipped in `@wordpress/babel-preset-default`](https://github.com/WordPress/gutenberg/tree/HEAD/packages/babel-preset-default#polyfill) in your code._
14
14
 
15
15
  ## API
16
16
 
17
17
  <!-- START TOKEN(Autogenerated API docs) -->
18
18
 
19
+ ### ShortcutProvider
20
+
21
+ Handles callbacks added to context by `useShortcut`.
22
+
23
+ _Parameters_
24
+
25
+ - _props_ `Object`: Props to pass to `div`.
26
+
27
+ _Returns_
28
+
29
+ - `import('@wordpress/element').WPElement`: Component.
30
+
19
31
  ### store
20
32
 
21
33
  Store definition for the keyboard shortcuts namespace.
@@ -37,6 +49,7 @@ _Parameters_
37
49
  - _name_ `string`: Shortcut name.
38
50
  - _callback_ `Function`: Shortcut callback.
39
51
  - _options_ `Object`: Shortcut options.
52
+ - _options.isDisabled_ `boolean`: Whether to disable to shortut.
40
53
 
41
54
  <!-- END TOKEN(Autogenerated API docs) -->
42
55
 
@@ -0,0 +1,54 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.ShortcutProvider = ShortcutProvider;
9
+
10
+ var _element = require("@wordpress/element");
11
+
12
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
+
14
+ var _context = require("../context");
15
+
16
+ /**
17
+ * WordPress dependencies
18
+ */
19
+
20
+ /**
21
+ * Internal dependencies
22
+ */
23
+ const {
24
+ Provider
25
+ } = _context.context;
26
+ /**
27
+ * Handles callbacks added to context by `useShortcut`.
28
+ *
29
+ * @param {Object} props Props to pass to `div`.
30
+ *
31
+ * @return {import('@wordpress/element').WPElement} Component.
32
+ */
33
+
34
+ function ShortcutProvider(props) {
35
+ const keyboardShortcuts = (0, _element.useRef)(new Set());
36
+
37
+ function onKeyDown(event) {
38
+ if (props.onKeyDown) props.onKeyDown(event);
39
+
40
+ for (const keyboardShortcut of keyboardShortcuts.current) {
41
+ keyboardShortcut(event);
42
+ }
43
+ }
44
+ /* eslint-disable jsx-a11y/no-static-element-interactions */
45
+
46
+
47
+ return (0, _element.createElement)(Provider, {
48
+ value: keyboardShortcuts
49
+ }, (0, _element.createElement)("div", (0, _extends2.default)({}, props, {
50
+ onKeyDown: onKeyDown
51
+ })));
52
+ /* eslint-enable jsx-a11y/no-static-element-interactions */
53
+ }
54
+ //# sourceMappingURL=shortcut-provider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/components/shortcut-provider.js"],"names":["Provider","context","ShortcutProvider","props","keyboardShortcuts","Set","onKeyDown","event","keyboardShortcut","current"],"mappings":";;;;;;;;;AAGA;;;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAM;AAAEA,EAAAA;AAAF,IAAeC,gBAArB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,gBAAT,CAA2BC,KAA3B,EAAmC;AACzC,QAAMC,iBAAiB,GAAG,qBAAQ,IAAIC,GAAJ,EAAR,CAA1B;;AAEA,WAASC,SAAT,CAAoBC,KAApB,EAA4B;AAC3B,QAAKJ,KAAK,CAACG,SAAX,EAAuBH,KAAK,CAACG,SAAN,CAAiBC,KAAjB;;AAEvB,SAAM,MAAMC,gBAAZ,IAAgCJ,iBAAiB,CAACK,OAAlD,EAA4D;AAC3DD,MAAAA,gBAAgB,CAAED,KAAF,CAAhB;AACA;AACD;AAED;;;AACA,SACC,4BAAC,QAAD;AAAU,IAAA,KAAK,EAAGH;AAAlB,KACC,8DAAUD,KAAV;AAAkB,IAAA,SAAS,EAAGG;AAA9B,KADD,CADD;AAKA;AACA","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"]}
@@ -0,0 +1,15 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.context = void 0;
7
+
8
+ var _element = require("@wordpress/element");
9
+
10
+ /**
11
+ * WordPress dependencies
12
+ */
13
+ const context = (0, _element.createContext)();
14
+ exports.context = context;
15
+ //# sourceMappingURL=context.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/context.js"],"names":["context"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAGO,MAAMA,OAAO,GAAG,6BAAhB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nexport const context = createContext();\n"]}
@@ -1,15 +1,17 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
3
5
  Object.defineProperty(exports, "__esModule", {
4
6
  value: true
5
7
  });
6
- exports.default = void 0;
8
+ exports.default = useShortcut;
7
9
 
8
- var _data = require("@wordpress/data");
10
+ var _element = require("@wordpress/element");
9
11
 
10
- var _compose = require("@wordpress/compose");
12
+ var _useShortcutEventMatch = _interopRequireDefault(require("./use-shortcut-event-match"));
11
13
 
12
- var _store = require("../store");
14
+ var _context = require("../context");
13
15
 
14
16
  /**
15
17
  * WordPress dependencies
@@ -22,17 +24,33 @@ var _store = require("../store");
22
24
  /**
23
25
  * Attach a keyboard shortcut handler.
24
26
  *
25
- * @param {string} name Shortcut name.
26
- * @param {Function} callback Shortcut callback.
27
- * @param {Object} options Shortcut options.
27
+ * @param {string} name Shortcut name.
28
+ * @param {Function} callback Shortcut callback.
29
+ * @param {Object} options Shortcut options.
30
+ * @param {boolean} options.isDisabled Whether to disable to shortut.
28
31
  */
29
- function useShortcut(name, callback, options) {
30
- const shortcuts = (0, _data.useSelect)(select => {
31
- return select(_store.store).getAllShortcutRawKeyCombinations(name);
32
- }, [name]);
33
- (0, _compose.useKeyboardShortcut)(shortcuts, callback, options);
32
+ function useShortcut(name, callback, {
33
+ isDisabled
34
+ } = {}) {
35
+ const shortcuts = (0, _element.useContext)(_context.context);
36
+ const isMatch = (0, _useShortcutEventMatch.default)();
37
+ const callbackRef = (0, _element.useRef)();
38
+ callbackRef.current = callback;
39
+ (0, _element.useEffect)(() => {
40
+ if (isDisabled) {
41
+ return;
42
+ }
43
+
44
+ function _callback(event) {
45
+ if (isMatch(name, event)) {
46
+ callbackRef.current(event);
47
+ }
48
+ }
49
+
50
+ shortcuts.current.add(_callback);
51
+ return () => {
52
+ shortcuts.current.delete(_callback);
53
+ };
54
+ }, [name, isDisabled]);
34
55
  }
35
-
36
- var _default = useShortcut;
37
- exports.default = _default;
38
56
  //# sourceMappingURL=use-shortcut.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/hooks/use-shortcut.js"],"names":["useShortcut","name","callback","options","shortcuts","select","keyboardShortcutsStore","getAllShortcutRawKeyCombinations"],"mappings":";;;;;;;AAGA;;AACA;;AAKA;;AATA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,WAAT,CAAsBC,IAAtB,EAA4BC,QAA5B,EAAsCC,OAAtC,EAAgD;AAC/C,QAAMC,SAAS,GAAG,qBACfC,MAAF,IAAc;AACb,WAAOA,MAAM,CACZC,YADY,CAAN,CAELC,gCAFK,CAE6BN,IAF7B,CAAP;AAGA,GALgB,EAMjB,CAAEA,IAAF,CANiB,CAAlB;AASA,oCAAqBG,SAArB,EAAgCF,QAAhC,EAA0CC,OAA1C;AACA;;eAEcH,W","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useKeyboardShortcut } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { store as keyboardShortcutsStore } from '../store';\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 */\nfunction useShortcut( name, callback, options ) {\n\tconst shortcuts = useSelect(\n\t\t( select ) => {\n\t\t\treturn select(\n\t\t\t\tkeyboardShortcutsStore\n\t\t\t).getAllShortcutRawKeyCombinations( name );\n\t\t},\n\t\t[ name ]\n\t);\n\n\tuseKeyboardShortcut( shortcuts, callback, options );\n}\n\nexport default useShortcut;\n"]}
1
+ {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/hooks/use-shortcut.js"],"names":["useShortcut","name","callback","isDisabled","shortcuts","context","isMatch","callbackRef","current","_callback","event","add","delete"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AATA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASA,WAAT,CAAsBC,IAAtB,EAA4BC,QAA5B,EAAsC;AAAEC,EAAAA;AAAF,IAAiB,EAAvD,EAA4D;AAC1E,QAAMC,SAAS,GAAG,yBAAYC,gBAAZ,CAAlB;AACA,QAAMC,OAAO,GAAG,qCAAhB;AACA,QAAMC,WAAW,GAAG,sBAApB;AACAA,EAAAA,WAAW,CAACC,OAAZ,GAAsBN,QAAtB;AAEA,0BAAW,MAAM;AAChB,QAAKC,UAAL,EAAkB;AACjB;AACA;;AAED,aAASM,SAAT,CAAoBC,KAApB,EAA4B;AAC3B,UAAKJ,OAAO,CAAEL,IAAF,EAAQS,KAAR,CAAZ,EAA8B;AAC7BH,QAAAA,WAAW,CAACC,OAAZ,CAAqBE,KAArB;AACA;AACD;;AAEDN,IAAAA,SAAS,CAACI,OAAV,CAAkBG,GAAlB,CAAuBF,SAAvB;AACA,WAAO,MAAM;AACZL,MAAAA,SAAS,CAACI,OAAV,CAAkBI,MAAlB,CAA0BH,SAA1B;AACA,KAFD;AAGA,GAfD,EAeG,CAAER,IAAF,EAAQE,UAAR,CAfH;AAgBA","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( name, callback, { isDisabled } = {} ) {\n\tconst shortcuts = useContext( context );\n\tconst isMatch = useShortcutEventMatch();\n\tconst callbackRef = useRef();\n\tcallbackRef.current = 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.current.add( _callback );\n\t\treturn () => {\n\t\t\tshortcuts.current.delete( _callback );\n\t\t};\n\t}, [ name, isDisabled ] );\n}\n"]}
package/build/index.js CHANGED
@@ -17,6 +17,12 @@ Object.defineProperty(exports, "useShortcut", {
17
17
  return _useShortcut.default;
18
18
  }
19
19
  });
20
+ Object.defineProperty(exports, "ShortcutProvider", {
21
+ enumerable: true,
22
+ get: function () {
23
+ return _shortcutProvider.ShortcutProvider;
24
+ }
25
+ });
20
26
  Object.defineProperty(exports, "__unstableUseShortcutEventMatch", {
21
27
  enumerable: true,
22
28
  get: function () {
@@ -28,5 +34,7 @@ var _store = require("./store");
28
34
 
29
35
  var _useShortcut = _interopRequireDefault(require("./hooks/use-shortcut"));
30
36
 
37
+ var _shortcutProvider = require("./components/shortcut-provider");
38
+
31
39
  var _useShortcutEventMatch = _interopRequireDefault(require("./hooks/use-shortcut-event-match"));
32
40
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA","sourcesContent":["export { store } from './store';\nexport { default as useShortcut } from './hooks/use-shortcut';\nexport { default as __unstableUseShortcutEventMatch } from './hooks/use-shortcut-event-match';\n"]}
1
+ {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA","sourcesContent":["export { store } from './store';\nexport { default as useShortcut } from './hooks/use-shortcut';\nexport { ShortcutProvider } from './components/shortcut-provider';\nexport { default as __unstableUseShortcutEventMatch } from './hooks/use-shortcut-event-match';\n"]}
@@ -0,0 +1,44 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
2
+ import { createElement } from "@wordpress/element";
3
+
4
+ /**
5
+ * WordPress dependencies
6
+ */
7
+ import { useRef } from '@wordpress/element';
8
+ /**
9
+ * Internal dependencies
10
+ */
11
+
12
+ import { context } from '../context';
13
+ const {
14
+ Provider
15
+ } = context;
16
+ /**
17
+ * Handles callbacks added to context by `useShortcut`.
18
+ *
19
+ * @param {Object} props Props to pass to `div`.
20
+ *
21
+ * @return {import('@wordpress/element').WPElement} Component.
22
+ */
23
+
24
+ export function ShortcutProvider(props) {
25
+ const keyboardShortcuts = useRef(new Set());
26
+
27
+ function onKeyDown(event) {
28
+ if (props.onKeyDown) props.onKeyDown(event);
29
+
30
+ for (const keyboardShortcut of keyboardShortcuts.current) {
31
+ keyboardShortcut(event);
32
+ }
33
+ }
34
+ /* eslint-disable jsx-a11y/no-static-element-interactions */
35
+
36
+
37
+ return createElement(Provider, {
38
+ value: keyboardShortcuts
39
+ }, createElement("div", _extends({}, props, {
40
+ onKeyDown: onKeyDown
41
+ })));
42
+ /* eslint-enable jsx-a11y/no-static-element-interactions */
43
+ }
44
+ //# sourceMappingURL=shortcut-provider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/components/shortcut-provider.js"],"names":["useRef","context","Provider","ShortcutProvider","props","keyboardShortcuts","Set","onKeyDown","event","keyboardShortcut","current"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,MAAT,QAAuB,oBAAvB;AAEA;AACA;AACA;;AACA,SAASC,OAAT,QAAwB,YAAxB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAeD,OAArB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASE,gBAAT,CAA2BC,KAA3B,EAAmC;AACzC,QAAMC,iBAAiB,GAAGL,MAAM,CAAE,IAAIM,GAAJ,EAAF,CAAhC;;AAEA,WAASC,SAAT,CAAoBC,KAApB,EAA4B;AAC3B,QAAKJ,KAAK,CAACG,SAAX,EAAuBH,KAAK,CAACG,SAAN,CAAiBC,KAAjB;;AAEvB,SAAM,MAAMC,gBAAZ,IAAgCJ,iBAAiB,CAACK,OAAlD,EAA4D;AAC3DD,MAAAA,gBAAgB,CAAED,KAAF,CAAhB;AACA;AACD;AAED;;;AACA,SACC,cAAC,QAAD;AAAU,IAAA,KAAK,EAAGH;AAAlB,KACC,kCAAUD,KAAV;AAAkB,IAAA,SAAS,EAAGG;AAA9B,KADD,CADD;AAKA;AACA","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"]}
@@ -0,0 +1,6 @@
1
+ /**
2
+ * WordPress dependencies
3
+ */
4
+ import { createContext } from '@wordpress/element';
5
+ export const context = createContext();
6
+ //# sourceMappingURL=context.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/context.js"],"names":["createContext","context"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,oBAA9B;AAEA,OAAO,MAAMC,OAAO,GAAGD,aAAa,EAA7B","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nexport const context = createContext();\n"]}
@@ -1,27 +1,44 @@
1
1
  /**
2
2
  * WordPress dependencies
3
3
  */
4
- import { useSelect } from '@wordpress/data';
5
- import { useKeyboardShortcut } from '@wordpress/compose';
4
+ import { useContext, useEffect, useRef } from '@wordpress/element';
6
5
  /**
7
6
  * Internal dependencies
8
7
  */
9
8
 
10
- import { store as keyboardShortcutsStore } from '../store';
9
+ import useShortcutEventMatch from './use-shortcut-event-match';
10
+ import { context } from '../context';
11
11
  /**
12
12
  * Attach a keyboard shortcut handler.
13
13
  *
14
- * @param {string} name Shortcut name.
15
- * @param {Function} callback Shortcut callback.
16
- * @param {Object} options Shortcut options.
14
+ * @param {string} name Shortcut name.
15
+ * @param {Function} callback Shortcut callback.
16
+ * @param {Object} options Shortcut options.
17
+ * @param {boolean} options.isDisabled Whether to disable to shortut.
17
18
  */
18
19
 
19
- function useShortcut(name, callback, options) {
20
- const shortcuts = useSelect(select => {
21
- return select(keyboardShortcutsStore).getAllShortcutRawKeyCombinations(name);
22
- }, [name]);
23
- useKeyboardShortcut(shortcuts, callback, options);
24
- }
20
+ export default function useShortcut(name, callback, {
21
+ isDisabled
22
+ } = {}) {
23
+ const shortcuts = useContext(context);
24
+ const isMatch = useShortcutEventMatch();
25
+ const callbackRef = useRef();
26
+ callbackRef.current = callback;
27
+ useEffect(() => {
28
+ if (isDisabled) {
29
+ return;
30
+ }
31
+
32
+ function _callback(event) {
33
+ if (isMatch(name, event)) {
34
+ callbackRef.current(event);
35
+ }
36
+ }
25
37
 
26
- export default useShortcut;
38
+ shortcuts.current.add(_callback);
39
+ return () => {
40
+ shortcuts.current.delete(_callback);
41
+ };
42
+ }, [name, isDisabled]);
43
+ }
27
44
  //# sourceMappingURL=use-shortcut.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/hooks/use-shortcut.js"],"names":["useSelect","useKeyboardShortcut","store","keyboardShortcutsStore","useShortcut","name","callback","options","shortcuts","select","getAllShortcutRawKeyCombinations"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,iBAA1B;AACA,SAASC,mBAAT,QAAoC,oBAApC;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,sBAAlB,QAAgD,UAAhD;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,WAAT,CAAsBC,IAAtB,EAA4BC,QAA5B,EAAsCC,OAAtC,EAAgD;AAC/C,QAAMC,SAAS,GAAGR,SAAS,CACxBS,MAAF,IAAc;AACb,WAAOA,MAAM,CACZN,sBADY,CAAN,CAELO,gCAFK,CAE6BL,IAF7B,CAAP;AAGA,GALyB,EAM1B,CAAEA,IAAF,CAN0B,CAA3B;AASAJ,EAAAA,mBAAmB,CAAEO,SAAF,EAAaF,QAAb,EAAuBC,OAAvB,CAAnB;AACA;;AAED,eAAeH,WAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useKeyboardShortcut } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { store as keyboardShortcutsStore } from '../store';\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 */\nfunction useShortcut( name, callback, options ) {\n\tconst shortcuts = useSelect(\n\t\t( select ) => {\n\t\t\treturn select(\n\t\t\t\tkeyboardShortcutsStore\n\t\t\t).getAllShortcutRawKeyCombinations( name );\n\t\t},\n\t\t[ name ]\n\t);\n\n\tuseKeyboardShortcut( shortcuts, callback, options );\n}\n\nexport default useShortcut;\n"]}
1
+ {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/hooks/use-shortcut.js"],"names":["useContext","useEffect","useRef","useShortcutEventMatch","context","useShortcut","name","callback","isDisabled","shortcuts","isMatch","callbackRef","current","_callback","event","add","delete"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAT,EAAqBC,SAArB,EAAgCC,MAAhC,QAA8C,oBAA9C;AAEA;AACA;AACA;;AACA,OAAOC,qBAAP,MAAkC,4BAAlC;AACA,SAASC,OAAT,QAAwB,YAAxB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,WAAT,CAAsBC,IAAtB,EAA4BC,QAA5B,EAAsC;AAAEC,EAAAA;AAAF,IAAiB,EAAvD,EAA4D;AAC1E,QAAMC,SAAS,GAAGT,UAAU,CAAEI,OAAF,CAA5B;AACA,QAAMM,OAAO,GAAGP,qBAAqB,EAArC;AACA,QAAMQ,WAAW,GAAGT,MAAM,EAA1B;AACAS,EAAAA,WAAW,CAACC,OAAZ,GAAsBL,QAAtB;AAEAN,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKO,UAAL,EAAkB;AACjB;AACA;;AAED,aAASK,SAAT,CAAoBC,KAApB,EAA4B;AAC3B,UAAKJ,OAAO,CAAEJ,IAAF,EAAQQ,KAAR,CAAZ,EAA8B;AAC7BH,QAAAA,WAAW,CAACC,OAAZ,CAAqBE,KAArB;AACA;AACD;;AAEDL,IAAAA,SAAS,CAACG,OAAV,CAAkBG,GAAlB,CAAuBF,SAAvB;AACA,WAAO,MAAM;AACZJ,MAAAA,SAAS,CAACG,OAAV,CAAkBI,MAAlB,CAA0BH,SAA1B;AACA,KAFD;AAGA,GAfQ,EAeN,CAAEP,IAAF,EAAQE,UAAR,CAfM,CAAT;AAgBA","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( name, callback, { isDisabled } = {} ) {\n\tconst shortcuts = useContext( context );\n\tconst isMatch = useShortcutEventMatch();\n\tconst callbackRef = useRef();\n\tcallbackRef.current = 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.current.add( _callback );\n\t\treturn () => {\n\t\t\tshortcuts.current.delete( _callback );\n\t\t};\n\t}, [ name, isDisabled ] );\n}\n"]}
@@ -1,4 +1,5 @@
1
1
  export { store } from './store';
2
2
  export { default as useShortcut } from './hooks/use-shortcut';
3
+ export { ShortcutProvider } from './components/shortcut-provider';
3
4
  export { default as __unstableUseShortcutEventMatch } from './hooks/use-shortcut-event-match';
4
5
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/index.js"],"names":["store","default","useShortcut","__unstableUseShortcutEventMatch"],"mappings":"AAAA,SAASA,KAAT,QAAsB,SAAtB;AACA,SAASC,OAAO,IAAIC,WAApB,QAAuC,sBAAvC;AACA,SAASD,OAAO,IAAIE,+BAApB,QAA2D,kCAA3D","sourcesContent":["export { store } from './store';\nexport { default as useShortcut } from './hooks/use-shortcut';\nexport { default as __unstableUseShortcutEventMatch } from './hooks/use-shortcut-event-match';\n"]}
1
+ {"version":3,"sources":["@wordpress/keyboard-shortcuts/src/index.js"],"names":["store","default","useShortcut","ShortcutProvider","__unstableUseShortcutEventMatch"],"mappings":"AAAA,SAASA,KAAT,QAAsB,SAAtB;AACA,SAASC,OAAO,IAAIC,WAApB,QAAuC,sBAAvC;AACA,SAASC,gBAAT,QAAiC,gCAAjC;AACA,SAASF,OAAO,IAAIG,+BAApB,QAA2D,kCAA3D","sourcesContent":["export { store } from './store';\nexport { default as useShortcut } from './hooks/use-shortcut';\nexport { ShortcutProvider } from './components/shortcut-provider';\nexport { default as __unstableUseShortcutEventMatch } from './hooks/use-shortcut-event-match';\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/keyboard-shortcuts",
3
- "version": "3.0.1",
3
+ "version": "3.0.5",
4
4
  "description": "Handling keyboard shortcuts.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -26,15 +26,15 @@
26
26
  "react-native": "src/index",
27
27
  "dependencies": {
28
28
  "@babel/runtime": "^7.13.10",
29
- "@wordpress/compose": "^5.0.1",
30
- "@wordpress/data": "^6.0.1",
31
- "@wordpress/element": "^4.0.0",
32
- "@wordpress/keycodes": "^3.2.1",
29
+ "@wordpress/compose": "^5.0.5",
30
+ "@wordpress/data": "^6.1.3",
31
+ "@wordpress/element": "^4.0.3",
32
+ "@wordpress/keycodes": "^3.2.3",
33
33
  "lodash": "^4.17.21",
34
34
  "rememo": "^3.0.0"
35
35
  },
36
36
  "publishConfig": {
37
37
  "access": "public"
38
38
  },
39
- "gitHead": "8b67fbd424bc67f81c2d825877f0fae726d6363a"
39
+ "gitHead": "393c2b5533837fd637e998d23f0124c081a10df0"
40
40
  }
@@ -0,0 +1,38 @@
1
+ /**
2
+ * WordPress dependencies
3
+ */
4
+ import { useRef } from '@wordpress/element';
5
+
6
+ /**
7
+ * Internal dependencies
8
+ */
9
+ import { context } from '../context';
10
+
11
+ const { Provider } = context;
12
+
13
+ /**
14
+ * Handles callbacks added to context by `useShortcut`.
15
+ *
16
+ * @param {Object} props Props to pass to `div`.
17
+ *
18
+ * @return {import('@wordpress/element').WPElement} Component.
19
+ */
20
+ export function ShortcutProvider( props ) {
21
+ const keyboardShortcuts = useRef( new Set() );
22
+
23
+ function onKeyDown( event ) {
24
+ if ( props.onKeyDown ) props.onKeyDown( event );
25
+
26
+ for ( const keyboardShortcut of keyboardShortcuts.current ) {
27
+ keyboardShortcut( event );
28
+ }
29
+ }
30
+
31
+ /* eslint-disable jsx-a11y/no-static-element-interactions */
32
+ return (
33
+ <Provider value={ keyboardShortcuts }>
34
+ <div { ...props } onKeyDown={ onKeyDown } />
35
+ </Provider>
36
+ );
37
+ /* eslint-enable jsx-a11y/no-static-element-interactions */
38
+ }
package/src/context.js ADDED
@@ -0,0 +1,6 @@
1
+ /**
2
+ * WordPress dependencies
3
+ */
4
+ import { createContext } from '@wordpress/element';
5
+
6
+ export const context = createContext();
@@ -1,32 +1,42 @@
1
1
  /**
2
2
  * WordPress dependencies
3
3
  */
4
- import { useSelect } from '@wordpress/data';
5
- import { useKeyboardShortcut } from '@wordpress/compose';
4
+ import { useContext, useEffect, useRef } from '@wordpress/element';
6
5
 
7
6
  /**
8
7
  * Internal dependencies
9
8
  */
10
- import { store as keyboardShortcutsStore } from '../store';
9
+ import useShortcutEventMatch from './use-shortcut-event-match';
10
+ import { context } from '../context';
11
11
 
12
12
  /**
13
13
  * Attach a keyboard shortcut handler.
14
14
  *
15
- * @param {string} name Shortcut name.
16
- * @param {Function} callback Shortcut callback.
17
- * @param {Object} options Shortcut options.
15
+ * @param {string} name Shortcut name.
16
+ * @param {Function} callback Shortcut callback.
17
+ * @param {Object} options Shortcut options.
18
+ * @param {boolean} options.isDisabled Whether to disable to shortut.
18
19
  */
19
- function useShortcut( name, callback, options ) {
20
- const shortcuts = useSelect(
21
- ( select ) => {
22
- return select(
23
- keyboardShortcutsStore
24
- ).getAllShortcutRawKeyCombinations( name );
25
- },
26
- [ name ]
27
- );
20
+ export default function useShortcut( name, callback, { isDisabled } = {} ) {
21
+ const shortcuts = useContext( context );
22
+ const isMatch = useShortcutEventMatch();
23
+ const callbackRef = useRef();
24
+ callbackRef.current = callback;
28
25
 
29
- useKeyboardShortcut( shortcuts, callback, options );
30
- }
26
+ useEffect( () => {
27
+ if ( isDisabled ) {
28
+ return;
29
+ }
30
+
31
+ function _callback( event ) {
32
+ if ( isMatch( name, event ) ) {
33
+ callbackRef.current( event );
34
+ }
35
+ }
31
36
 
32
- export default useShortcut;
37
+ shortcuts.current.add( _callback );
38
+ return () => {
39
+ shortcuts.current.delete( _callback );
40
+ };
41
+ }, [ name, isDisabled ] );
42
+ }
package/src/index.js CHANGED
@@ -1,3 +1,4 @@
1
1
  export { store } from './store';
2
2
  export { default as useShortcut } from './hooks/use-shortcut';
3
+ export { ShortcutProvider } from './components/shortcut-provider';
3
4
  export { default as __unstableUseShortcutEventMatch } from './hooks/use-shortcut-event-match';