@noriginmedia/norigin-spatial-navigation - npm Package Compare versions

Comparing version 1.1.2 to 1.1.3

dist/index.js

@@ -1,1 +0,1 @@
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("lodash/difference"),require("lodash/filter"),require("lodash/findKey"),require("lodash/first"),require("lodash/forEach"),require("lodash/forOwn"),require("lodash/noop"),require("lodash/sortBy"),require("lodash/throttle"),require("lodash/uniqueId"),require("react"));else if("function"==typeof define&&define.amd)define(["lodash/difference","lodash/filter","lodash/findKey","lodash/first","lodash/forEach","lodash/forOwn","lodash/noop","lodash/sortBy","lodash/throttle","lodash/uniqueId","react"],t);else{var o="object"==typeof exports?t(require("lodash/difference"),require("lodash/filter"),require("lodash/findKey"),require("lodash/first"),require("lodash/forEach"),require("lodash/forOwn"),require("lodash/noop"),require("lodash/sortBy"),require("lodash/throttle"),require("lodash/uniqueId"),require("react")):t(e["lodash/difference"],e["lodash/filter"],e["lodash/findKey"],e["lodash/first"],e["lodash/forEach"],e["lodash/forOwn"],e["lodash/noop"],e["lodash/sortBy"],e["lodash/throttle"],e["lodash/uniqueId"],e.react);for(var s in o)("object"==typeof exports?exports:e)[s]=o[s]}}(this,(function(e,t,o,s,n,i,r,a,u,c,l){return function(){"use strict";var d={654:function(e,t,o){var s,n=this&&this.__assign||function(){return n=Object.assign||function(e){for(var t,o=1,s=arguments.length;o<s;o++)for(var n in t=arguments[o])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e},n.apply(this,arguments)},i=this&&this.__spreadArray||function(e,t,o){if(o||2===arguments.length)for(var s,n=0,i=t.length;n<i;n++)!s&&n in t||(s||(s=Array.prototype.slice.call(t,0,n)),s[n]=t[n]);return e.concat(s||Array.prototype.slice.call(t))},r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.setKeyMap=t.destroy=t.init=t.SpatialNavigation=t.ROOT_FOCUS_KEY=void 0;var a=r(o(747)),u=r(o(842)),c=r(o(432)),l=r(o(23)),d=r(o(682)),f=r(o(784)),h=r(o(67)),p=r(o(117)),y=r(o(964)),v=r(o(35)),g="left",b="right",C="up",F="down",K="enter",m=((s={}).left=[37],s.up=[38],s.right=[39],s.down=[40],s.enter=[13],s);t.ROOT_FOCUS_KEY="SN:ROOT";var x=["#0FF","#FF0","#F0F"],w={leading:!0,trailing:!1},E=function(){function e(){this.focusableComponents={},this.focusKey=null,this.parentsHavingFocusedChild=[],this.enabled=!1,this.nativeMode=!1,this.throttle=0,this.throttleKeypresses=!1,this.pressedKeys={},this.paused=!1,this.keyDownEventListener=null,this.keyUpEventListener=null,this.keyMap=m,this.onKeyEvent=this.onKeyEvent.bind(this),this.pause=this.pause.bind(this),this.resume=this.resume.bind(this),this.setFocus=this.setFocus.bind(this),this.updateAllLayouts=this.updateAllLayouts.bind(this),this.navigateByDirection=this.navigateByDirection.bind(this),this.init=this.init.bind(this),this.setKeyMap=this.setKeyMap.bind(this),this.getCurrentFocusKey=this.getCurrentFocusKey.bind(this),this.debug=!1,this.visualDebugger=null,this.logIndex=0}return e.getCutoffCoordinate=function(e,t,o,s){var n=s.left,i=s.top,r=s.width,a=s.height,u=e?i:n,c=e?a:r;return t?o?u:u+c:o?u+c:u},e.getRefCorners=function(e,t,o){var s=o.left,n=o.top,i=o.width,r=o.height,a={a:{x:0,y:0},b:{x:0,y:0}};switch(e){case C:var u=t?n+r:n;a.a={x:s,y:u},a.b={x:s+i,y:u};break;case F:u=t?n:n+r,a.a={x:s,y:u},a.b={x:s+i,y:u};break;case g:var c=t?s+i:s;a.a={x:c,y:n},a.b={x:c,y:n+r};break;case b:c=t?s:s+i,a.a={x:c,y:n},a.b={x:c,y:n+r}}return a},e.isAdjacentSlice=function(e,t,o){var s=e.a,n=e.b,i=t.a,r=t.b,a=o?"x":"y",u=s[a],c=n[a],l=i[a],d=r[a],f=.2*(c-u);return Math.max(0,Math.min(c,d)-Math.max(u,l))>=f},e.getPrimaryAxisDistance=function(e,t,o){var s=e.a,n=t.a,i=o?"y":"x";return Math.abs(n[i]-s[i])},e.getSecondaryAxisDistance=function(e,t,o){var s=e.a,n=e.b,i=t.a,r=t.b,a=o?"x":"y",u=s[a],c=n[a],l=i[a],d=r[a],f=[];return f.push(Math.abs(l-u)),f.push(Math.abs(l-c)),f.push(Math.abs(d-u)),f.push(Math.abs(d-c)),Math.min.apply(Math,f)},e.prototype.sortSiblingsByPriority=function(t,o,s,n){var i=this,r=s===F||s===C,a=e.getRefCorners(s,!1,o);return(0,c.default)(t,(function(t){var o=e.getRefCorners(s,!0,t.layout),u=e.isAdjacentSlice(a,o,r),c=u?e.getPrimaryAxisDistance:e.getSecondaryAxisDistance,l=u?e.getSecondaryAxisDistance:e.getPrimaryAxisDistance,d=c(a,o,r),f=l(a,o,r),h=5*d+f,p=(h+1)/(u?5:1);return i.log("smartNavigate","distance (primary, secondary, total weighted) for ".concat(t.focusKey," relative to ").concat(n," is"),d,f,h),i.log("smartNavigate","priority for ".concat(t.focusKey," relative to ").concat(n," is"),p),i.visualDebugger&&(i.visualDebugger.drawPoint(o.a.x,o.a.y,"yellow",6),i.visualDebugger.drawPoint(o.b.x,o.b.y,"yellow",6)),p}))},e.prototype.init=function(e){var t=void 0===e?{}:e,o=t.debug,s=void 0!==o&&o,n=t.visualDebug,i=void 0!==n&&n,r=t.nativeMode,a=void 0!==r&&r,u=t.throttle,c=void 0===u?0:u,l=t.throttleKeypresses,d=void 0!==l&&l;this.enabled||(this.enabled=!0,this.nativeMode=a,this.throttleKeypresses=d,this.debug=s,this.nativeMode||(Number.isInteger(c)&&c>0&&(this.throttle=c),this.bindEventHandlers(),i&&(this.visualDebugger=new v.default,this.startDrawLayouts())))},e.prototype.startDrawLayouts=function(){var e=this,t=function(){requestAnimationFrame((function(){e.visualDebugger.clearLayouts(),(0,f.default)(e.focusableComponents,(function(t,o){e.visualDebugger.drawLayout(t.layout,o,t.parentFocusKey)})),t()}))};t()},e.prototype.destroy=function(){this.enabled&&(this.enabled=!1,this.nativeMode=!1,this.throttle=0,this.throttleKeypresses=!1,this.focusKey=null,this.parentsHavingFocusedChild=[],this.focusableComponents={},this.paused=!1,this.keyMap=m,this.unbindEventHandlers())},e.prototype.getEventType=function(e){return(0,l.default)(this.getKeyMap(),(function(t){return t.includes(e)}))},e.prototype.bindEventHandlers=function(){var e=this;"undefined"!=typeof window&&window.addEventListener&&(this.keyDownEventListener=function(t){if(!0!==e.paused){e.debug&&(e.logIndex+=1);var o=e.getEventType(t.keyCode);if(o){e.pressedKeys[o]=e.pressedKeys[o]?e.pressedKeys[o]+1:1,t.preventDefault(),t.stopPropagation();var s={pressedKeys:e.pressedKeys};o===K&&e.focusKey?e.onEnterPress(s):!1===e.onArrowPress(o,s)?(e.log("keyDownEventListener","default navigation prevented"),e.visualDebugger&&e.visualDebugger.clear()):e.onKeyEvent(t)}}},this.throttle&&(this.keyDownEventListenerThrottled=(0,h.default)(this.keyDownEventListener.bind(this),this.throttle,w)),this.keyUpEventListener=function(t){var o=e.getEventType(t.keyCode);Reflect.deleteProperty(e.pressedKeys,o),e.throttle&&!e.throttleKeypresses&&e.keyDownEventListenerThrottled.cancel(),o===K&&e.focusKey&&e.onEnterRelease()},window.addEventListener("keyup",this.keyUpEventListener),window.addEventListener("keydown",this.throttle?this.keyDownEventListenerThrottled:this.keyDownEventListener))},e.prototype.unbindEventHandlers=function(){"undefined"!=typeof window&&window.removeEventListener&&(window.removeEventListener("keydown",this.keyDownEventListener),this.keyDownEventListener=null,this.throttle&&(window.removeEventListener("keyup",this.keyUpEventListener),this.keyUpEventListener=null))},e.prototype.onEnterPress=function(e){var t=this.focusableComponents[this.focusKey];t?t.focusable?t.onEnterPress&&t.onEnterPress(e):this.log("onEnterPress","componentNotFocusable"):this.log("onEnterPress","noComponent")},e.prototype.onEnterRelease=function(){var e=this.focusableComponents[this.focusKey];e?e.focusable?e.onEnterRelease&&e.onEnterRelease():this.log("onEnterRelease","componentNotFocusable"):this.log("onEnterRelease","noComponent")},e.prototype.onArrowPress=function(e,t){var o=this.focusableComponents[this.focusKey];if(o)return o&&o.onArrowPress&&o.onArrowPress(e,t);this.log("onArrowPress","noComponent")},e.prototype.navigateByDirection=function(e,t){if(!0!==this.paused&&!this.nativeMode){var o=[F,C,g,b];o.includes(e)?(this.log("navigateByDirection","direction",e),this.smartNavigate(e,null,t)):this.log("navigateByDirection","Invalid direction. You passed: `".concat(e,"`, but you can use only these: "),o)}},e.prototype.onKeyEvent=function(e){this.visualDebugger&&this.visualDebugger.clear();var t=(0,l.default)(this.getKeyMap(),(function(t){return t.includes(e.keyCode)}));this.smartNavigate(t,null,{event:e})},e.prototype.smartNavigate=function(t,o,s){var n=this;if(!this.nativeMode){this.log("smartNavigate","direction",t),this.log("smartNavigate","fromParentFocusKey",o),this.log("smartNavigate","this.focusKey",this.focusKey),o||(0,f.default)(this.focusableComponents,(function(e){e.layoutUpdated=!1}));var i=this.focusableComponents[o||this.focusKey];if(this.log("smartNavigate","currentComponent",i?i.focusKey:void 0,i?i.node:void 0),i){this.updateLayout(i.focusKey);var r=i.parentFocusKey,c=i.focusKey,l=i.layout,d=t===F||t===C,h=t===F||t===b,p=e.getCutoffCoordinate(d,h,!1,l),y=(0,a.default)(this.focusableComponents,(function(t){if(t.parentFocusKey===r&&t.focusable){n.updateLayout(t.focusKey);var o=e.getCutoffCoordinate(d,h,!0,t.layout);return h?o>=p:o<=p}return!1}));if(this.debug&&(this.log("smartNavigate","currentCutoffCoordinate",p),this.log("smartNavigate","siblings","".concat(y.length," elements:"),y.map((function(e){return e.focusKey})).join(", "),y.map((function(e){return e.node})))),this.visualDebugger){var v=e.getRefCorners(t,!1,l);this.visualDebugger.drawPoint(v.a.x,v.a.y),this.visualDebugger.drawPoint(v.b.x,v.b.y)}var g=this.sortSiblingsByPriority(y,l,t,c),K=(0,u.default)(g);if(this.log("smartNavigate","nextComponent",K?K.focusKey:void 0,K?K.node:void 0),K)this.setFocus(K.focusKey,s);else{var m=this.focusableComponents[r];this.saveLastFocusedChildKey(m,c),m&&m.isFocusBoundary||this.smartNavigate(t,r,s)}}}},e.prototype.saveLastFocusedChildKey=function(e,t){e&&(this.log("saveLastFocusedChildKey","".concat(e.focusKey," lastFocusedChildKey set"),t),e.lastFocusedChildKey=t)},e.prototype.log=function(e,t){for(var o=[],s=2;s<arguments.length;s++)o[s-2]=arguments[s];this.debug&&console.log.apply(console,i(["%c".concat(e,"%c").concat(t),"background: ".concat(x[this.logIndex%x.length],"; color: black; padding: 1px 5px;"),"background: #333; color: #BADA55; padding: 1px 5px;"],o,!1))},e.prototype.getCurrentFocusKey=function(){return this.focusKey},e.prototype.getNextFocusKey=function(e){var t=this,o=this.focusableComponents[e];if(!o||this.nativeMode)return e;var s=(0,a.default)(this.focusableComponents,(function(t){return t.parentFocusKey===e&&t.focusable}));if(s.length>0){var n=o.lastFocusedChildKey,i=o.preferredChildFocusKey;if(this.log("getNextFocusKey","lastFocusedChildKey is",n),this.log("getNextFocusKey","preferredChildFocusKey is",i),n&&o.saveLastFocusedChild&&this.isParticipatingFocusableComponent(n))return this.log("getNextFocusKey","lastFocusedChildKey will be focused",n),this.getNextFocusKey(n);if(i&&this.isParticipatingFocusableComponent(i))return this.log("getNextFocusKey","preferredChildFocusKey will be focused",i),this.getNextFocusKey(i);s.forEach((function(e){return t.updateLayout(e.focusKey)}));var r=function(e){var t=(0,c.default)(e,(function(e){var t=e.layout;return Math.abs(t.left)+Math.abs(t.top)}));return(0,u.default)(t)}(s).focusKey;return this.log("getNextFocusKey","childKey will be focused",r),this.getNextFocusKey(r)}return this.log("getNextFocusKey","targetFocusKey",e),e},e.prototype.addFocusable=function(e){var t=e.focusKey,o=e.node,s=e.parentFocusKey,n=e.onEnterPress,i=e.onEnterRelease,r=e.onArrowPress,a=e.onFocus,u=e.onBlur,c=e.saveLastFocusedChild,l=e.trackChildren,d=e.onUpdateFocus,f=e.onUpdateHasFocusedChild,h=e.preferredChildFocusKey,p=e.autoRestoreFocus,y=e.focusable,v=e.isFocusBoundary;this.focusableComponents[t]={focusKey:t,node:o,parentFocusKey:s,onEnterPress:n,onEnterRelease:i,onArrowPress:r,onFocus:a,onBlur:u,onUpdateFocus:d,onUpdateHasFocusedChild:f,saveLastFocusedChild:c,trackChildren:l,preferredChildFocusKey:h,focusable:y,isFocusBoundary:v,autoRestoreFocus:p,lastFocusedChildKey:null,layout:{x:0,y:0,width:0,height:0,left:0,top:0,node:o},layoutUpdated:!1},this.nativeMode||(this.updateLayout(t),t===this.focusKey&&this.setFocus(t))},e.prototype.removeFocusable=function(e){var t=e.focusKey,o=this.focusableComponents[t];if(o){var s=o.parentFocusKey;Reflect.deleteProperty(this.focusableComponents,t);var n=this.focusableComponents[s],i=t===this.focusKey;if(n&&n.lastFocusedChildKey===t&&(n.lastFocusedChildKey=null),this.nativeMode)return;i&&n&&n.autoRestoreFocus&&this.setFocus(s)}},e.prototype.getNodeLayoutByFocusKey=function(e){var t=this.focusableComponents[e];return t?(this.updateLayout(t.focusKey),t.layout):null},e.prototype.setCurrentFocusedKey=function(e,t){if(this.isFocusableComponent(this.focusKey)&&e!==this.focusKey){var o=this.focusableComponents[this.focusKey],s=this.focusableComponents[o.parentFocusKey];this.saveLastFocusedChildKey(s,this.focusKey),o.onUpdateFocus(!1),o.onBlur(this.getNodeLayoutByFocusKey(this.focusKey),t)}if(this.focusKey=e,this.isFocusableComponent(this.focusKey)){var n=this.focusableComponents[this.focusKey];n.onUpdateFocus(!0),n.onFocus(this.getNodeLayoutByFocusKey(this.focusKey),t)}},e.prototype.updateParentsHasFocusedChild=function(e,t){for(var o=this,s=[],n=this.focusableComponents[e];n;){var i=n.parentFocusKey,r=this.focusableComponents[i];if(r){var a=r.focusKey;s.push(a)}n=r}var u=(0,p.default)(this.parentsHavingFocusedChild,s),c=(0,p.default)(s,this.parentsHavingFocusedChild);(0,d.default)(u,(function(e){var s=o.focusableComponents[e];s&&s.trackChildren&&s.onUpdateHasFocusedChild(!1),o.onIntermediateNodeBecameBlurred(e,t)})),(0,d.default)(c,(function(e){var s=o.focusableComponents[e];s&&s.trackChildren&&s.onUpdateHasFocusedChild(!0),o.onIntermediateNodeBecameFocused(e,t)})),this.parentsHavingFocusedChild=s},e.prototype.updateParentsLastFocusedChild=function(e){for(var t=this.focusableComponents[e];t;){var o=t.parentFocusKey,s=this.focusableComponents[o];s&&this.saveLastFocusedChildKey(s,t.focusKey),t=s}},e.prototype.getKeyMap=function(){return this.keyMap},e.prototype.setKeyMap=function(e){this.keyMap=n(n({},this.getKeyMap()),function(e){var t={};return Object.entries(e).forEach((function(e){var o=e[0],s=e[1];"number"==typeof s?t[o]=[s]:Array.isArray(s)&&(t[o]=s)})),t}(e))},e.prototype.isFocusableComponent=function(e){return!!this.focusableComponents[e]},e.prototype.isParticipatingFocusableComponent=function(e){return this.isFocusableComponent(e)&&this.focusableComponents[e].focusable},e.prototype.onIntermediateNodeBecameFocused=function(e,t){this.isParticipatingFocusableComponent(e)&&this.focusableComponents[e].onFocus(this.getNodeLayoutByFocusKey(e),t)},e.prototype.onIntermediateNodeBecameBlurred=function(e,t){this.isParticipatingFocusableComponent(e)&&this.focusableComponents[e].onBlur(this.getNodeLayoutByFocusKey(e),t)},e.prototype.pause=function(){this.paused=!0},e.prototype.resume=function(){this.paused=!1},e.prototype.setFocus=function(e,t){if(void 0===t&&(t={}),this.enabled){this.log("setFocus","focusKey",e);var o=this.focusKey,s=this.getNextFocusKey(e);this.log("setFocus","newFocusKey",s),this.setCurrentFocusedKey(s,t),this.updateParentsHasFocusedChild(s,t),this.updateParentsLastFocusedChild(o)}},e.prototype.updateAllLayouts=function(){var e=this;this.nativeMode||(0,f.default)(this.focusableComponents,(function(t,o){e.updateLayout(o)}))},e.prototype.updateLayout=function(e){var t=this.focusableComponents[e];if(t&&!this.nativeMode&&!t.layoutUpdated){var o=t.node;t.layout=n(n({},(0,y.default)(o)),{node:o})}},e.prototype.updateFocusable=function(e,t){var o=t.node,s=t.preferredChildFocusKey,n=t.focusable,i=t.isFocusBoundary,r=t.onEnterPress,a=t.onEnterRelease,u=t.onArrowPress,c=t.onFocus,l=t.onBlur;if(!this.nativeMode){var d=this.focusableComponents[e];d&&(d.preferredChildFocusKey=s,d.focusable=n,d.isFocusBoundary=i,d.onEnterPress=r,d.onEnterRelease=a,d.onArrowPress=u,d.onFocus=c,d.onBlur=l,o&&(d.node=o))}},e.prototype.isNativeMode=function(){return this.nativeMode},e}();t.SpatialNavigation=new E,t.init=t.SpatialNavigation.init,t.destroy=t.SpatialNavigation.destroy,t.setKeyMap=t.SpatialNavigation.setKeyMap},35:function(e,t){Object.defineProperty(t,"__esModule",{value:!0});var o="undefined"!=typeof window&&window.document,s=o?window.innerWidth:0,n=o?window.innerHeight:0,i=function(){function e(){o&&(this.debugCtx=e.createCanvas("sn-debug","1010"),this.layoutsCtx=e.createCanvas("sn-layouts","1000"))}return e.createCanvas=function(e,t){var o=document.querySelector("#".concat(e))||document.createElement("canvas");o.setAttribute("id",e);var i=o.getContext("2d");return o.style.zIndex=t,o.style.position="fixed",o.style.top="0",o.style.left="0",document.body.appendChild(o),o.width=s,o.height=n,i},e.prototype.clear=function(){o&&this.debugCtx.clearRect(0,0,s,n)},e.prototype.clearLayouts=function(){o&&this.layoutsCtx.clearRect(0,0,s,n)},e.prototype.drawLayout=function(e,t,s){o&&(this.layoutsCtx.strokeStyle="green",this.layoutsCtx.strokeRect(e.left,e.top,e.width,e.height),this.layoutsCtx.font="8px monospace",this.layoutsCtx.fillStyle="red",this.layoutsCtx.fillText(t,e.left,e.top+10),this.layoutsCtx.fillText(s,e.left,e.top+25),this.layoutsCtx.fillText("left: ".concat(e.left),e.left,e.top+40),this.layoutsCtx.fillText("top: ".concat(e.top),e.left,e.top+55))},e.prototype.drawPoint=function(e,t,s,n){void 0===s&&(s="blue"),void 0===n&&(n=10),o&&(this.debugCtx.strokeStyle=s,this.debugCtx.lineWidth=3,this.debugCtx.strokeRect(e-n/2,t-n/2,n,n))},e}();t.default=i},607:function(e,t,o){var s=this&&this.__createBinding||(Object.create?function(e,t,o,s){void 0===s&&(s=o);var n=Object.getOwnPropertyDescriptor(t,o);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(e,s,n)}:function(e,t,o,s){void 0===s&&(s=o),e[s]=t[o]}),n=this&&this.__exportStar||function(e,t){for(var o in e)"default"===o||Object.prototype.hasOwnProperty.call(t,o)||s(t,e,o)};Object.defineProperty(t,"__esModule",{value:!0}),n(o(79),t),n(o(893),t),n(o(654),t)},964:function(e,t){Object.defineProperty(t,"__esModule",{value:!0});var o=function(e){for(var t=e.offsetParent,o=e.offsetHeight,s=e.offsetWidth,n=e.offsetLeft,i=e.offsetTop;t&&1===t.nodeType;)n+=t.offsetLeft-t.scrollLeft,i+=t.offsetTop-t.scrollTop,t=t.offsetParent;return{height:o,left:n,top:i,width:s}};t.default=function(e){var t=e&&e.parentElement;if(e&&t){var s=o(t),n=o(e),i=n.height,r=n.left,a=n.top,u=n.width;return{x:r-s.left,y:a-s.top,width:u,height:i,left:r,top:a}}return{x:0,y:0,width:0,height:0,left:0,top:0}}},451:function(e,t,o){Object.defineProperty(t,"__esModule",{value:!0});var s=o(156);t.default=function(e){var t=(0,s.useRef)(e),o=(0,s.useRef)(),n=(0,s.useRef)(!1),i=(0,s.useRef)(!1),r=(0,s.useState)(0)[1];n.current&&(i.current=!0),(0,s.useEffect)((function(){return n.current||(o.current=t.current(),n.current=!0),r((function(e){return e+1})),function(){i.current&&o.current&&o.current()}}),[])}},79:function(e,t,o){var s=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.useFocusable=void 0;var n=o(156),i=s(o(604)),r=s(o(461)),a=o(654),u=o(893),c=s(o(451));t.useFocusable=function(e){var t=void 0===e?{}:e,o=t.focusable,s=void 0===o||o,l=t.saveLastFocusedChild,d=void 0===l||l,f=t.trackChildren,h=void 0!==f&&f,p=t.autoRestoreFocus,y=void 0===p||p,v=t.isFocusBoundary,g=void 0!==v&&v,b=t.focusKey,C=t.preferredChildFocusKey,F=t.onEnterPress,K=void 0===F?i.default:F,m=t.onEnterRelease,x=void 0===m?i.default:m,w=t.onArrowPress,E=void 0===w?function(){return!0}:w,P=t.onFocus,L=void 0===P?i.default:P,N=t.onBlur,M=void 0===N?i.default:N,k=t.extraProps,D=(0,n.useCallback)((function(e){K(k,e)}),[K,k]),B=(0,n.useCallback)((function(){x(k)}),[x,k]),_=(0,n.useCallback)((function(e,t){return E(e,k,t)}),[k,E]),R=(0,n.useCallback)((function(e,t){L(e,k,t)}),[k,L]),S=(0,n.useCallback)((function(e,t){M(e,k,t)}),[k,M]),A=(0,n.useRef)(null),O=(0,n.useState)(!1),q=O[0],j=O[1],U=(0,n.useState)(!1),H=U[0],T=U[1],I=(0,u.useFocusContext)(),Y=(0,n.useMemo)((function(){return b||(0,r.default)("sn:focusable-item-")}),[b]),W=(0,n.useCallback)((function(e){void 0===e&&(e={}),a.SpatialNavigation.setFocus(Y,e)}),[Y]);return(0,c.default)((function(){var e=A.current;return a.SpatialNavigation.addFocusable({focusKey:Y,node:e,parentFocusKey:I,preferredChildFocusKey:C,onEnterPress:D,onEnterRelease:B,onArrowPress:_,onFocus:R,onBlur:S,onUpdateFocus:function(e){return void 0===e&&(e=!1),j(e)},onUpdateHasFocusedChild:function(e){return void 0===e&&(e=!1),T(e)},saveLastFocusedChild:d,trackChildren:h,isFocusBoundary:g,autoRestoreFocus:y,focusable:s}),function(){a.SpatialNavigation.removeFocusable({focusKey:Y})}})),(0,n.useEffect)((function(){var e=A.current;a.SpatialNavigation.updateFocusable(Y,{node:e,preferredChildFocusKey:C,focusable:s,isFocusBoundary:g,onEnterPress:D,onEnterRelease:B,onArrowPress:_,onFocus:R,onBlur:S})}),[Y,C,s,g,D,B,_,R,S]),{ref:A,focusSelf:W,focused:q,hasFocusedChild:H,focusKey:Y,setFocus:a.SpatialNavigation.isNativeMode()?i.default:a.SpatialNavigation.setFocus,navigateByDirection:a.SpatialNavigation.navigateByDirection,pause:a.SpatialNavigation.pause,resume:a.SpatialNavigation.resume,updateAllLayouts:a.SpatialNavigation.updateAllLayouts,getCurrentFocusKey:a.SpatialNavigation.getCurrentFocusKey}}},893:function(e,t,o){Object.defineProperty(t,"__esModule",{value:!0}),t.useFocusContext=t.FocusContext=void 0;var s=o(156),n=o(654);t.FocusContext=(0,s.createContext)(n.ROOT_FOCUS_KEY),t.useFocusContext=function(){return(0,s.useContext)(t.FocusContext)}},117:function(t){t.exports=e},747:function(e){e.exports=t},23:function(e){e.exports=o},842:function(e){e.exports=s},682:function(e){e.exports=n},784:function(e){e.exports=i},604:function(e){e.exports=r},432:function(e){e.exports=a},67:function(e){e.exports=u},461:function(e){e.exports=c},156:function(e){e.exports=l}},f={};return function e(t){var o=f[t];if(void 0!==o)return o.exports;var s=f[t]={exports:{}};return d[t].call(s.exports,s,s.exports,e),s.exports}(607)}()}));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("lodash/difference"),require("lodash/filter"),require("lodash/findKey"),require("lodash/first"),require("lodash/forEach"),require("lodash/forOwn"),require("lodash/noop"),require("lodash/sortBy"),require("lodash/throttle"),require("lodash/uniqueId"),require("react"));else if("function"==typeof define&&define.amd)define(["lodash/difference","lodash/filter","lodash/findKey","lodash/first","lodash/forEach","lodash/forOwn","lodash/noop","lodash/sortBy","lodash/throttle","lodash/uniqueId","react"],t);else{var o="object"==typeof exports?t(require("lodash/difference"),require("lodash/filter"),require("lodash/findKey"),require("lodash/first"),require("lodash/forEach"),require("lodash/forOwn"),require("lodash/noop"),require("lodash/sortBy"),require("lodash/throttle"),require("lodash/uniqueId"),require("react")):t(e["lodash/difference"],e["lodash/filter"],e["lodash/findKey"],e["lodash/first"],e["lodash/forEach"],e["lodash/forOwn"],e["lodash/noop"],e["lodash/sortBy"],e["lodash/throttle"],e["lodash/uniqueId"],e.react);for(var s in o)("object"==typeof exports?exports:e)[s]=o[s]}}(this,(function(e,t,o,s,n,i,r,a,u,c,l){return function(){"use strict";var d={654:function(e,t,o){var s,n=this&&this.__assign||function(){return n=Object.assign||function(e){for(var t,o=1,s=arguments.length;o<s;o++)for(var n in t=arguments[o])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e},n.apply(this,arguments)},i=this&&this.__spreadArray||function(e,t,o){if(o||2===arguments.length)for(var s,n=0,i=t.length;n<i;n++)!s&&n in t||(s||(s=Array.prototype.slice.call(t,0,n)),s[n]=t[n]);return e.concat(s||Array.prototype.slice.call(t))},r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.setKeyMap=t.destroy=t.init=t.SpatialNavigation=t.ROOT_FOCUS_KEY=void 0;var a=r(o(747)),u=r(o(842)),c=r(o(432)),l=r(o(23)),d=r(o(682)),h=r(o(784)),f=r(o(67)),p=r(o(117)),y=r(o(964)),v=r(o(35)),g="left",b="right",C="up",F="down",K="enter",m=((s={}).left=[37],s.up=[38],s.right=[39],s.down=[40],s.enter=[13],s);t.ROOT_FOCUS_KEY="SN:ROOT";var x=["#0FF","#FF0","#F0F"],w={leading:!0,trailing:!1},E=function(){function e(){this.focusableComponents={},this.focusKey=null,this.parentsHavingFocusedChild=[],this.enabled=!1,this.nativeMode=!1,this.throttle=0,this.throttleKeypresses=!1,this.pressedKeys={},this.paused=!1,this.keyDownEventListener=null,this.keyUpEventListener=null,this.keyMap=m,this.onKeyEvent=this.onKeyEvent.bind(this),this.pause=this.pause.bind(this),this.resume=this.resume.bind(this),this.setFocus=this.setFocus.bind(this),this.updateAllLayouts=this.updateAllLayouts.bind(this),this.navigateByDirection=this.navigateByDirection.bind(this),this.init=this.init.bind(this),this.setKeyMap=this.setKeyMap.bind(this),this.getCurrentFocusKey=this.getCurrentFocusKey.bind(this),this.debug=!1,this.visualDebugger=null,this.logIndex=0}return e.getCutoffCoordinate=function(e,t,o,s){var n=s.left,i=s.top,r=s.width,a=s.height,u=e?i:n,c=e?a:r;return t?o?u:u+c:o?u+c:u},e.getRefCorners=function(e,t,o){var s=o.left,n=o.top,i=o.width,r=o.height,a={a:{x:0,y:0},b:{x:0,y:0}};switch(e){case C:var u=t?n+r:n;a.a={x:s,y:u},a.b={x:s+i,y:u};break;case F:u=t?n:n+r,a.a={x:s,y:u},a.b={x:s+i,y:u};break;case g:var c=t?s+i:s;a.a={x:c,y:n},a.b={x:c,y:n+r};break;case b:c=t?s:s+i,a.a={x:c,y:n},a.b={x:c,y:n+r}}return a},e.isAdjacentSlice=function(e,t,o){var s=e.a,n=e.b,i=t.a,r=t.b,a=o?"x":"y",u=s[a],c=n[a],l=i[a],d=r[a],h=.2*(c-u);return Math.max(0,Math.min(c,d)-Math.max(u,l))>=h},e.getPrimaryAxisDistance=function(e,t,o){var s=e.a,n=t.a,i=o?"y":"x";return Math.abs(n[i]-s[i])},e.getSecondaryAxisDistance=function(e,t,o){var s=e.a,n=e.b,i=t.a,r=t.b,a=o?"x":"y",u=s[a],c=n[a],l=i[a],d=r[a],h=[];return h.push(Math.abs(l-u)),h.push(Math.abs(l-c)),h.push(Math.abs(d-u)),h.push(Math.abs(d-c)),Math.min.apply(Math,h)},e.prototype.sortSiblingsByPriority=function(t,o,s,n){var i=this,r=s===F||s===C,a=e.getRefCorners(s,!1,o);return(0,c.default)(t,(function(t){var o=e.getRefCorners(s,!0,t.layout),u=e.isAdjacentSlice(a,o,r),c=u?e.getPrimaryAxisDistance:e.getSecondaryAxisDistance,l=u?e.getSecondaryAxisDistance:e.getPrimaryAxisDistance,d=c(a,o,r),h=l(a,o,r),f=5*d+h,p=(f+1)/(u?5:1);return i.log("smartNavigate","distance (primary, secondary, total weighted) for ".concat(t.focusKey," relative to ").concat(n," is"),d,h,f),i.log("smartNavigate","priority for ".concat(t.focusKey," relative to ").concat(n," is"),p),i.visualDebugger&&(i.visualDebugger.drawPoint(o.a.x,o.a.y,"yellow",6),i.visualDebugger.drawPoint(o.b.x,o.b.y,"yellow",6)),p}))},e.prototype.init=function(e){var t=void 0===e?{}:e,o=t.debug,s=void 0!==o&&o,n=t.visualDebug,i=void 0!==n&&n,r=t.nativeMode,a=void 0!==r&&r,u=t.throttle,c=void 0===u?0:u,l=t.throttleKeypresses,d=void 0!==l&&l;this.enabled||(this.enabled=!0,this.nativeMode=a,this.throttleKeypresses=d,this.debug=s,this.nativeMode||(Number.isInteger(c)&&c>0&&(this.throttle=c),this.bindEventHandlers(),i&&(this.visualDebugger=new v.default,this.startDrawLayouts())))},e.prototype.startDrawLayouts=function(){var e=this,t=function(){requestAnimationFrame((function(){e.visualDebugger.clearLayouts(),(0,h.default)(e.focusableComponents,(function(t,o){e.visualDebugger.drawLayout(t.layout,o,t.parentFocusKey)})),t()}))};t()},e.prototype.destroy=function(){this.enabled&&(this.enabled=!1,this.nativeMode=!1,this.throttle=0,this.throttleKeypresses=!1,this.focusKey=null,this.parentsHavingFocusedChild=[],this.focusableComponents={},this.paused=!1,this.keyMap=m,this.unbindEventHandlers())},e.prototype.getEventType=function(e){return(0,l.default)(this.getKeyMap(),(function(t){return t.includes(e)}))},e.prototype.bindEventHandlers=function(){var e=this;"undefined"!=typeof window&&window.addEventListener&&(this.keyDownEventListener=function(t){if(!0!==e.paused){e.debug&&(e.logIndex+=1);var o=e.getEventType(t.keyCode);if(o){e.pressedKeys[o]=e.pressedKeys[o]?e.pressedKeys[o]+1:1,t.preventDefault(),t.stopPropagation();var s={pressedKeys:e.pressedKeys};o===K&&e.focusKey?e.onEnterPress(s):!1===e.onArrowPress(o,s)?(e.log("keyDownEventListener","default navigation prevented"),e.visualDebugger&&e.visualDebugger.clear()):e.onKeyEvent(t)}}},this.throttle&&(this.keyDownEventListenerThrottled=(0,f.default)(this.keyDownEventListener.bind(this),this.throttle,w)),this.keyUpEventListener=function(t){var o=e.getEventType(t.keyCode);delete e.pressedKeys[o],e.throttle&&!e.throttleKeypresses&&e.keyDownEventListenerThrottled.cancel(),o===K&&e.focusKey&&e.onEnterRelease()},window.addEventListener("keyup",this.keyUpEventListener),window.addEventListener("keydown",this.throttle?this.keyDownEventListenerThrottled:this.keyDownEventListener))},e.prototype.unbindEventHandlers=function(){"undefined"!=typeof window&&window.removeEventListener&&(window.removeEventListener("keydown",this.keyDownEventListener),this.keyDownEventListener=null,this.throttle&&(window.removeEventListener("keyup",this.keyUpEventListener),this.keyUpEventListener=null))},e.prototype.onEnterPress=function(e){var t=this.focusableComponents[this.focusKey];t?t.focusable?t.onEnterPress&&t.onEnterPress(e):this.log("onEnterPress","componentNotFocusable"):this.log("onEnterPress","noComponent")},e.prototype.onEnterRelease=function(){var e=this.focusableComponents[this.focusKey];e?e.focusable?e.onEnterRelease&&e.onEnterRelease():this.log("onEnterRelease","componentNotFocusable"):this.log("onEnterRelease","noComponent")},e.prototype.onArrowPress=function(e,t){var o=this.focusableComponents[this.focusKey];if(o)return o&&o.onArrowPress&&o.onArrowPress(e,t);this.log("onArrowPress","noComponent")},e.prototype.navigateByDirection=function(e,t){if(!0!==this.paused&&!this.nativeMode){var o=[F,C,g,b];o.includes(e)?(this.log("navigateByDirection","direction",e),this.smartNavigate(e,null,t)):this.log("navigateByDirection","Invalid direction. You passed: `".concat(e,"`, but you can use only these: "),o)}},e.prototype.onKeyEvent=function(e){this.visualDebugger&&this.visualDebugger.clear();var t=(0,l.default)(this.getKeyMap(),(function(t){return t.includes(e.keyCode)}));this.smartNavigate(t,null,{event:e})},e.prototype.smartNavigate=function(t,o,s){var n=this;if(!this.nativeMode){this.log("smartNavigate","direction",t),this.log("smartNavigate","fromParentFocusKey",o),this.log("smartNavigate","this.focusKey",this.focusKey),o||(0,h.default)(this.focusableComponents,(function(e){e.layoutUpdated=!1}));var i=this.focusableComponents[o||this.focusKey];if(this.log("smartNavigate","currentComponent",i?i.focusKey:void 0,i?i.node:void 0),i){this.updateLayout(i.focusKey);var r=i.parentFocusKey,c=i.focusKey,l=i.layout,d=t===F||t===C,f=t===F||t===b,p=e.getCutoffCoordinate(d,f,!1,l),y=(0,a.default)(this.focusableComponents,(function(t){if(t.parentFocusKey===r&&t.focusable){n.updateLayout(t.focusKey);var o=e.getCutoffCoordinate(d,f,!0,t.layout);return f?o>=p:o<=p}return!1}));if(this.debug&&(this.log("smartNavigate","currentCutoffCoordinate",p),this.log("smartNavigate","siblings","".concat(y.length," elements:"),y.map((function(e){return e.focusKey})).join(", "),y.map((function(e){return e.node})))),this.visualDebugger){var v=e.getRefCorners(t,!1,l);this.visualDebugger.drawPoint(v.a.x,v.a.y),this.visualDebugger.drawPoint(v.b.x,v.b.y)}var g=this.sortSiblingsByPriority(y,l,t,c),K=(0,u.default)(g);if(this.log("smartNavigate","nextComponent",K?K.focusKey:void 0,K?K.node:void 0),K)this.setFocus(K.focusKey,s);else{var m=this.focusableComponents[r];this.saveLastFocusedChildKey(m,c),m&&m.isFocusBoundary||this.smartNavigate(t,r,s)}}}},e.prototype.saveLastFocusedChildKey=function(e,t){e&&(this.log("saveLastFocusedChildKey","".concat(e.focusKey," lastFocusedChildKey set"),t),e.lastFocusedChildKey=t)},e.prototype.log=function(e,t){for(var o=[],s=2;s<arguments.length;s++)o[s-2]=arguments[s];this.debug&&console.log.apply(console,i(["%c".concat(e,"%c").concat(t),"background: ".concat(x[this.logIndex%x.length],"; color: black; padding: 1px 5px;"),"background: #333; color: #BADA55; padding: 1px 5px;"],o,!1))},e.prototype.getCurrentFocusKey=function(){return this.focusKey},e.prototype.getNextFocusKey=function(e){var t=this,o=this.focusableComponents[e];if(!o||this.nativeMode)return e;var s=(0,a.default)(this.focusableComponents,(function(t){return t.parentFocusKey===e&&t.focusable}));if(s.length>0){var n=o.lastFocusedChildKey,i=o.preferredChildFocusKey;if(this.log("getNextFocusKey","lastFocusedChildKey is",n),this.log("getNextFocusKey","preferredChildFocusKey is",i),n&&o.saveLastFocusedChild&&this.isParticipatingFocusableComponent(n))return this.log("getNextFocusKey","lastFocusedChildKey will be focused",n),this.getNextFocusKey(n);if(i&&this.isParticipatingFocusableComponent(i))return this.log("getNextFocusKey","preferredChildFocusKey will be focused",i),this.getNextFocusKey(i);s.forEach((function(e){return t.updateLayout(e.focusKey)}));var r=function(e){var t=(0,c.default)(e,(function(e){var t=e.layout;return Math.abs(t.left)+Math.abs(t.top)}));return(0,u.default)(t)}(s).focusKey;return this.log("getNextFocusKey","childKey will be focused",r),this.getNextFocusKey(r)}return this.log("getNextFocusKey","targetFocusKey",e),e},e.prototype.addFocusable=function(e){var t=e.focusKey,o=e.node,s=e.parentFocusKey,n=e.onEnterPress,i=e.onEnterRelease,r=e.onArrowPress,a=e.onFocus,u=e.onBlur,c=e.saveLastFocusedChild,l=e.trackChildren,d=e.onUpdateFocus,h=e.onUpdateHasFocusedChild,f=e.preferredChildFocusKey,p=e.autoRestoreFocus,y=e.focusable,v=e.isFocusBoundary;this.focusableComponents[t]={focusKey:t,node:o,parentFocusKey:s,onEnterPress:n,onEnterRelease:i,onArrowPress:r,onFocus:a,onBlur:u,onUpdateFocus:d,onUpdateHasFocusedChild:h,saveLastFocusedChild:c,trackChildren:l,preferredChildFocusKey:f,focusable:y,isFocusBoundary:v,autoRestoreFocus:p,lastFocusedChildKey:null,layout:{x:0,y:0,width:0,height:0,left:0,top:0,node:o},layoutUpdated:!1},this.nativeMode||(this.updateLayout(t),t===this.focusKey&&this.setFocus(t))},e.prototype.removeFocusable=function(e){var t=e.focusKey,o=this.focusableComponents[t];if(o){var s=o.parentFocusKey;delete this.focusableComponents[t];var n=this.focusableComponents[s],i=t===this.focusKey;if(n&&n.lastFocusedChildKey===t&&(n.lastFocusedChildKey=null),this.nativeMode)return;i&&n&&n.autoRestoreFocus&&this.setFocus(s)}},e.prototype.getNodeLayoutByFocusKey=function(e){var t=this.focusableComponents[e];return t?(this.updateLayout(t.focusKey),t.layout):null},e.prototype.setCurrentFocusedKey=function(e,t){if(this.isFocusableComponent(this.focusKey)&&e!==this.focusKey){var o=this.focusableComponents[this.focusKey],s=this.focusableComponents[o.parentFocusKey];this.saveLastFocusedChildKey(s,this.focusKey),o.onUpdateFocus(!1),o.onBlur(this.getNodeLayoutByFocusKey(this.focusKey),t)}if(this.focusKey=e,this.isFocusableComponent(this.focusKey)){var n=this.focusableComponents[this.focusKey];n.onUpdateFocus(!0),n.onFocus(this.getNodeLayoutByFocusKey(this.focusKey),t)}},e.prototype.updateParentsHasFocusedChild=function(e,t){for(var o=this,s=[],n=this.focusableComponents[e];n;){var i=n.parentFocusKey,r=this.focusableComponents[i];if(r){var a=r.focusKey;s.push(a)}n=r}var u=(0,p.default)(this.parentsHavingFocusedChild,s),c=(0,p.default)(s,this.parentsHavingFocusedChild);(0,d.default)(u,(function(e){var s=o.focusableComponents[e];s&&s.trackChildren&&s.onUpdateHasFocusedChild(!1),o.onIntermediateNodeBecameBlurred(e,t)})),(0,d.default)(c,(function(e){var s=o.focusableComponents[e];s&&s.trackChildren&&s.onUpdateHasFocusedChild(!0),o.onIntermediateNodeBecameFocused(e,t)})),this.parentsHavingFocusedChild=s},e.prototype.updateParentsLastFocusedChild=function(e){for(var t=this.focusableComponents[e];t;){var o=t.parentFocusKey,s=this.focusableComponents[o];s&&this.saveLastFocusedChildKey(s,t.focusKey),t=s}},e.prototype.getKeyMap=function(){return this.keyMap},e.prototype.setKeyMap=function(e){this.keyMap=n(n({},this.getKeyMap()),function(e){var t={};return Object.entries(e).forEach((function(e){var o=e[0],s=e[1];"number"==typeof s?t[o]=[s]:Array.isArray(s)&&(t[o]=s)})),t}(e))},e.prototype.isFocusableComponent=function(e){return!!this.focusableComponents[e]},e.prototype.isParticipatingFocusableComponent=function(e){return this.isFocusableComponent(e)&&this.focusableComponents[e].focusable},e.prototype.onIntermediateNodeBecameFocused=function(e,t){this.isParticipatingFocusableComponent(e)&&this.focusableComponents[e].onFocus(this.getNodeLayoutByFocusKey(e),t)},e.prototype.onIntermediateNodeBecameBlurred=function(e,t){this.isParticipatingFocusableComponent(e)&&this.focusableComponents[e].onBlur(this.getNodeLayoutByFocusKey(e),t)},e.prototype.pause=function(){this.paused=!0},e.prototype.resume=function(){this.paused=!1},e.prototype.setFocus=function(e,t){if(void 0===t&&(t={}),this.enabled){this.log("setFocus","focusKey",e);var o=this.focusKey,s=this.getNextFocusKey(e);this.log("setFocus","newFocusKey",s),this.setCurrentFocusedKey(s,t),this.updateParentsHasFocusedChild(s,t),this.updateParentsLastFocusedChild(o)}},e.prototype.updateAllLayouts=function(){var e=this;this.nativeMode||(0,h.default)(this.focusableComponents,(function(t,o){e.updateLayout(o)}))},e.prototype.updateLayout=function(e){var t=this.focusableComponents[e];if(t&&!this.nativeMode&&!t.layoutUpdated){var o=t.node;t.layout=n(n({},(0,y.default)(o)),{node:o})}},e.prototype.updateFocusable=function(e,t){var o=t.node,s=t.preferredChildFocusKey,n=t.focusable,i=t.isFocusBoundary,r=t.onEnterPress,a=t.onEnterRelease,u=t.onArrowPress,c=t.onFocus,l=t.onBlur;if(!this.nativeMode){var d=this.focusableComponents[e];d&&(d.preferredChildFocusKey=s,d.focusable=n,d.isFocusBoundary=i,d.onEnterPress=r,d.onEnterRelease=a,d.onArrowPress=u,d.onFocus=c,d.onBlur=l,o&&(d.node=o))}},e.prototype.isNativeMode=function(){return this.nativeMode},e}();t.SpatialNavigation=new E,t.init=t.SpatialNavigation.init,t.destroy=t.SpatialNavigation.destroy,t.setKeyMap=t.SpatialNavigation.setKeyMap},35:function(e,t){Object.defineProperty(t,"__esModule",{value:!0});var o="undefined"!=typeof window&&window.document,s=o?window.innerWidth:0,n=o?window.innerHeight:0,i=function(){function e(){o&&(this.debugCtx=e.createCanvas("sn-debug","1010"),this.layoutsCtx=e.createCanvas("sn-layouts","1000"))}return e.createCanvas=function(e,t){var o=document.querySelector("#".concat(e))||document.createElement("canvas");o.setAttribute("id",e);var i=o.getContext("2d");return o.style.zIndex=t,o.style.position="fixed",o.style.top="0",o.style.left="0",document.body.appendChild(o),o.width=s,o.height=n,i},e.prototype.clear=function(){o&&this.debugCtx.clearRect(0,0,s,n)},e.prototype.clearLayouts=function(){o&&this.layoutsCtx.clearRect(0,0,s,n)},e.prototype.drawLayout=function(e,t,s){o&&(this.layoutsCtx.strokeStyle="green",this.layoutsCtx.strokeRect(e.left,e.top,e.width,e.height),this.layoutsCtx.font="8px monospace",this.layoutsCtx.fillStyle="red",this.layoutsCtx.fillText(t,e.left,e.top+10),this.layoutsCtx.fillText(s,e.left,e.top+25),this.layoutsCtx.fillText("left: ".concat(e.left),e.left,e.top+40),this.layoutsCtx.fillText("top: ".concat(e.top),e.left,e.top+55))},e.prototype.drawPoint=function(e,t,s,n){void 0===s&&(s="blue"),void 0===n&&(n=10),o&&(this.debugCtx.strokeStyle=s,this.debugCtx.lineWidth=3,this.debugCtx.strokeRect(e-n/2,t-n/2,n,n))},e}();t.default=i},607:function(e,t,o){var s=this&&this.__createBinding||(Object.create?function(e,t,o,s){void 0===s&&(s=o);var n=Object.getOwnPropertyDescriptor(t,o);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(e,s,n)}:function(e,t,o,s){void 0===s&&(s=o),e[s]=t[o]}),n=this&&this.__exportStar||function(e,t){for(var o in e)"default"===o||Object.prototype.hasOwnProperty.call(t,o)||s(t,e,o)};Object.defineProperty(t,"__esModule",{value:!0}),n(o(79),t),n(o(893),t),n(o(654),t)},964:function(e,t){Object.defineProperty(t,"__esModule",{value:!0});var o=function(e){for(var t=e.offsetParent,o=e.offsetHeight,s=e.offsetWidth,n=e.offsetLeft,i=e.offsetTop;t&&1===t.nodeType;)n+=t.offsetLeft-t.scrollLeft,i+=t.offsetTop-t.scrollTop,t=t.offsetParent;return{height:o,left:n,top:i,width:s}};t.default=function(e){var t=e&&e.parentElement;if(e&&t){var s=o(t),n=o(e),i=n.height,r=n.left,a=n.top,u=n.width;return{x:r-s.left,y:a-s.top,width:u,height:i,left:r,top:a}}return{x:0,y:0,width:0,height:0,left:0,top:0}}},451:function(e,t,o){Object.defineProperty(t,"__esModule",{value:!0});var s=o(156);t.default=function(e){var t=(0,s.useRef)(e),o=(0,s.useRef)(),n=(0,s.useRef)(!1),i=(0,s.useRef)(!1),r=(0,s.useState)(0)[1];n.current&&(i.current=!0),(0,s.useEffect)((function(){return n.current||(o.current=t.current(),n.current=!0),r((function(e){return e+1})),function(){i.current&&o.current&&o.current()}}),[])}},79:function(e,t,o){var s=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.useFocusable=void 0;var n=o(156),i=s(o(604)),r=s(o(461)),a=o(654),u=o(893),c=s(o(451));t.useFocusable=function(e){var t=void 0===e?{}:e,o=t.focusable,s=void 0===o||o,l=t.saveLastFocusedChild,d=void 0===l||l,h=t.trackChildren,f=void 0!==h&&h,p=t.autoRestoreFocus,y=void 0===p||p,v=t.isFocusBoundary,g=void 0!==v&&v,b=t.focusKey,C=t.preferredChildFocusKey,F=t.onEnterPress,K=void 0===F?i.default:F,m=t.onEnterRelease,x=void 0===m?i.default:m,w=t.onArrowPress,E=void 0===w?function(){return!0}:w,P=t.onFocus,L=void 0===P?i.default:P,N=t.onBlur,M=void 0===N?i.default:N,k=t.extraProps,D=(0,n.useCallback)((function(e){K(k,e)}),[K,k]),B=(0,n.useCallback)((function(){x(k)}),[x,k]),_=(0,n.useCallback)((function(e,t){return E(e,k,t)}),[k,E]),S=(0,n.useCallback)((function(e,t){L(e,k,t)}),[k,L]),R=(0,n.useCallback)((function(e,t){M(e,k,t)}),[k,M]),A=(0,n.useRef)(null),O=(0,n.useState)(!1),q=O[0],j=O[1],U=(0,n.useState)(!1),H=U[0],T=U[1],I=(0,u.useFocusContext)(),Y=(0,n.useMemo)((function(){return b||(0,r.default)("sn:focusable-item-")}),[b]),W=(0,n.useCallback)((function(e){void 0===e&&(e={}),a.SpatialNavigation.setFocus(Y,e)}),[Y]);return(0,c.default)((function(){var e=A.current;return a.SpatialNavigation.addFocusable({focusKey:Y,node:e,parentFocusKey:I,preferredChildFocusKey:C,onEnterPress:D,onEnterRelease:B,onArrowPress:_,onFocus:S,onBlur:R,onUpdateFocus:function(e){return void 0===e&&(e=!1),j(e)},onUpdateHasFocusedChild:function(e){return void 0===e&&(e=!1),T(e)},saveLastFocusedChild:d,trackChildren:f,isFocusBoundary:g,autoRestoreFocus:y,focusable:s}),function(){a.SpatialNavigation.removeFocusable({focusKey:Y})}})),(0,n.useEffect)((function(){var e=A.current;a.SpatialNavigation.updateFocusable(Y,{node:e,preferredChildFocusKey:C,focusable:s,isFocusBoundary:g,onEnterPress:D,onEnterRelease:B,onArrowPress:_,onFocus:S,onBlur:R})}),[Y,C,s,g,D,B,_,S,R]),{ref:A,focusSelf:W,focused:q,hasFocusedChild:H,focusKey:Y,setFocus:a.SpatialNavigation.isNativeMode()?i.default:a.SpatialNavigation.setFocus,navigateByDirection:a.SpatialNavigation.navigateByDirection,pause:a.SpatialNavigation.pause,resume:a.SpatialNavigation.resume,updateAllLayouts:a.SpatialNavigation.updateAllLayouts,getCurrentFocusKey:a.SpatialNavigation.getCurrentFocusKey}}},893:function(e,t,o){Object.defineProperty(t,"__esModule",{value:!0}),t.useFocusContext=t.FocusContext=void 0;var s=o(156),n=o(654);t.FocusContext=(0,s.createContext)(n.ROOT_FOCUS_KEY),t.useFocusContext=function(){return(0,s.useContext)(t.FocusContext)}},117:function(t){t.exports=e},747:function(e){e.exports=t},23:function(e){e.exports=o},842:function(e){e.exports=s},682:function(e){e.exports=n},784:function(e){e.exports=i},604:function(e){e.exports=r},432:function(e){e.exports=a},67:function(e){e.exports=u},461:function(e){e.exports=c},156:function(e){e.exports=l}},h={};return function e(t){var o=h[t];if(void 0!==o)return o.exports;var s=h[t]={exports:{}};return d[t].call(s.exports,s,s.exports,e),s.exports}(607)}()}));

package.json

 {
   "name": "@noriginmedia/norigin-spatial-navigation",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "description": "React hooks based Spatial Navigation solution",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

55716

decreased by-0.06%

No dependency changes