Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@interop-ui/react-lock

Package Overview
Dependencies
Maintainers
4
Versions
8
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@interop-ui/react-lock - npm Package Compare versions

Comparing version 0.0.1-1 to 0.0.1-2

2

dist/index.module.js

@@ -1,2 +0,2 @@

import{useDebugContext as e}from"@interop-ui/react-debug-context";import{arrayRemove as t}from"@interop-ui/utils";import{hideOthers as n}from"aria-hidden";import{tabbable as o}from"@interop-ui/tabbable";import{useComposedRefs as r}from"@interop-ui/react-utils";import*as c from"react";function i(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function u(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?i(Object(n),!0).forEach((function(t){a(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):i(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function a(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function s(e){let t=u({},e);const r={isActive:!1,isPaused:!1,elementFocusedBeforeActivation:void 0,beforeFocusTrapMarker:l("before"),afterFocusTrapMarker:l("after")};let c=()=>{},i=()=>{},a=()=>{},s=()=>{};const m={isActive:()=>r.isActive,activate:function(){if(r.isActive)return;r.isActive=!0,r.isPaused=!1,e=t.container,e.style.outline="none",e.tabIndex=-1,e.setAttribute("data-focus-trap-container","true"),function(){const e=t.container.parentNode;if(null===e)return;e.insertBefore(r.beforeFocusTrapMarker,t.container),e.insertBefore(r.afterFocusTrapMarker,t.container.nextSibling)}(),s=n(t.container),k.add(m),requestAnimationFrame(()=>{!function(){r.elementFocusedBeforeActivation=f();const e=v(t.container);p(t.elementToFocusWhenActivated||e,O,t.container)}(),F()});var e},deactivate:function({shouldPreventFocusControl:e=!1}={}){if(!r.isActive)return;r.isActive=!1,r.isPaused=!1,n=t.container,n.style.outline="",n.removeAttribute("tabIndex"),n.removeAttribute("data-focus-trap-container"),r.beforeFocusTrapMarker.remove(),r.afterFocusTrapMarker.remove(),s(),D(),k.remove(m),requestAnimationFrame(()=>{e||p(t.elementToFocusWhenDeactivated||r.elementFocusedBeforeActivation,h)});var n},pause:function(){if(r.isPaused||!r.isActive)return;r.isPaused=!0,D()},resume:function(){if(!r.isPaused||!r.isActive)return;r.isPaused=!1,F()},updateConfig:function(e){const n=(o="shouldPreventOutsideClick",o in e&&t[o]!==e[o]);var o;t=u(u({},t),e),r.isActive&&n&&(e.shouldPreventOutsideClick?A():a())}};return m;function y(e){const n=e.relatedTarget;n&&!t.container.contains(n)&&C(n)}function E(e){d(e,t.container)&&C(e.target)}function C(e){if(!(null==e?void 0:e.closest("[data-focus-trap-container=true]")))if(e===r.beforeFocusTrapMarker){p(function(e){const t=o(e,{includeContainer:!1});return t[t.length-1]}(t.container),"Could not focus last tabbable element",t.container)}else{p(v(t.container),"Could not focus first tabbable element",t.container)}}function P(e){t.shouldDeactivateOnEscape&&t.onEscape&&t.onEscape(e)}function g(e){var n;if(null===(n=e.target)||void 0===n?void 0:n.closest("[data-focus-trap-container=true]"))return;if("function"==typeof t.shouldDeactivateOnOutsideClick?t.shouldDeactivateOnOutsideClick(e):Boolean(t.shouldDeactivateOnOutsideClick)){const n=!t.shouldPreventOutsideClick;t.onOutsideClick&&t.onOutsideClick(e,n)}else e.preventDefault()}function A(){a(),a=function(e){const t=document.body.style.pointerEvents,n=e.style.pointerEvents;document.body.style.pointerEvents="none",e.style.pointerEvents="auto";const o=b(e,e=>{e.preventDefault()});return()=>{document.body.style.pointerEvents=t,e.style.pointerEvents=n,o()}}(t.container)}function F(){document.addEventListener("blur",y,{capture:!0}),document.addEventListener("focus",E,{capture:!0}),c=function(e){return document.addEventListener("keydown",t,{capture:!0}),()=>{document.removeEventListener("keydown",t,{capture:!0})};function t(t){"Escape"===t.key&&e(t)}}(P),i=b(t.container,g),t.shouldPreventOutsideClick&&A()}function D(){document.removeEventListener("blur",y,{capture:!0}),document.removeEventListener("focus",E,{capture:!0}),c(),i(),a()}}function l(e){const t=document.createElement("div");return t.setAttribute("data-focus-trap-marker",e),t.tabIndex=0,t}function d(e,t){return!t.contains(e.target)}function f(){return document.activeElement}function v(e){return o(e,{includeContainer:!1})[0]}function p(e,t,n){const o=m(e);(void 0===e||function(e){return e instanceof HTMLElement}(e)&&!o)&&(Boolean(t)&&console.warn(t),void 0!==n&&(console.info("Falling back to container focus"),m(n)))}function m(e){return e&&e.focus&&(e.focus({preventScroll:!0}),function(e){return e instanceof HTMLInputElement&&"select"in e}(e)&&e.select()),f()===e}function b(e,t){return document.addEventListener("mousedown",n,{capture:!0}),document.addEventListener("touchstart",n,{capture:!0}),()=>{document.removeEventListener("mousedown",n,{capture:!0}),document.removeEventListener("touchstart",n,{capture:!0})};function n(n){d(n,e)&&t(n)}}const O="Could not focus on an element inside the focus trap when activated (see details below).\n\n- your focus trap should contain at least one focusable element\n- or a focusable element should be provided to `elementToFocusWhenActivated`\n",h="Could not focus on an element outside the focus trap when deactivated (see details below).\n\n- the element that was focused before activating the trap should still exists\n- or a focusable element should be provided to `elementToFocusWhenDeactivated`\n",k=function(){let e=[];return{add:function(n){const o=e[0];n!==o&&(null==o||o.pause());e.includes(n)?(e=t(e,n),e.unshift(n)):e.unshift(n)},remove:function(n){var o;e=t(e,n),null===(o=e[0])||void 0===o||o.resume()}}}();function y(e,t){if(null==e)return{};var n,o,r=function(e,t){if(null==e)return{};var n,o,r={},c=Object.keys(e);for(o=0;o<c.length;o++)n=c[o],t.indexOf(n)>=0||(r[n]=e[n]);return r}(e,t);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(e);for(o=0;o<c.length;o++)n=c[o],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}const E=c.createContext({});E.displayName="LockContext";export function Lock(t){let{children:n}=t,o=y(t,["children"]);const r=e(),i=c.Children.only(n);return c.isValidElement(i)?r.disableLock?i:c.createElement(C,o,i):null}function C({children:e,onDeactivate:t=(()=>{}),refToFocusOnActivation:n,refToFocusOnDeactivation:o,shouldDeactivateOnEscape:i=!0,shouldDeactivateOnOutsideClick:u=!0,shouldPreventOutsideClick:a=!0}){const l=c.useRef(null),d=c.useRef(),f=c.useRef(!1),{deactivateParentLocks:v,shouldDeactivateOnOutsideClick:p}=c.useContext(E),m=c.useCallback(e=>{const n=void 0!==v;f.current=!!n||e,t(),v&&v(e)},[t,v]);c.useEffect(()=>(l.current&&(d.current=s({container:l.current}),d.current.activate()),()=>{var e;null===(e=d.current)||void 0===e||e.deactivate({shouldPreventFocusControl:f.current}),f.current=!1}),[]);const b=c.useCallback((e,n)=>{f.current=n,t(),a||v&&v(n)},[t,a,v]);c.useEffect(()=>{var e;null===(e=d.current)||void 0===e||e.updateConfig({elementToFocusWhenActivated:null==n?void 0:n.current,elementToFocusWhenDeactivated:null==o?void 0:o.current,shouldDeactivateOnEscape:i,onEscape:t,shouldDeactivateOnOutsideClick:null!=p?p:u,onOutsideClick:b,shouldPreventOutsideClick:a})},[n,o,i,t,u,p,b,a]);const O=r(e.ref,l);return c.createElement(E.Provider,{value:{containerRef:l,deactivateParentLocks:m,shouldDeactivateOnOutsideClick:null!=p?p:u}},c.cloneElement(e,{ref:O}))}export function useLockContext(){let{containerRef:e}=c.useContext(E);return c.useMemo(()=>({lockContainerRef:e}),[e])}
import{useDebugContext as e}from"@interop-ui/react-debug-context";import{arrayRemove as t}from"@interop-ui/utils";import{hideOthers as n}from"aria-hidden";import{tabbable as o}from"@interop-ui/tabbable";import{useComposedRefs as r}from"@interop-ui/react-utils";import*as c from"react";function i(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function u(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?i(Object(n),!0).forEach((function(t){a(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):i(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function a(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function s(e){let t=u({},e);const r={isActive:!1,isPaused:!1,elementFocusedBeforeActivation:void 0,beforeFocusTrapMarker:l("before"),afterFocusTrapMarker:l("after")};let c=()=>{},i=()=>{},a=()=>{},s=()=>{};const m={isActive:()=>r.isActive,activate:function(){if(r.isActive)return;r.isActive=!0,r.isPaused=!1,e=t.container,e.style.outline="none",e.tabIndex=-1,e.setAttribute("data-focus-trap-container","true"),function(){const e=t.container.parentNode;if(null===e)return;e.insertBefore(r.beforeFocusTrapMarker,t.container),e.insertBefore(r.afterFocusTrapMarker,t.container.nextSibling)}(),s=n(t.container),k.add(m),requestAnimationFrame(()=>{!function(){r.elementFocusedBeforeActivation=f();const e=v(t.container);p(t.elementToFocusWhenActivated||e,O,t.container)}(),F()});var e},deactivate:function({shouldPreventFocusControl:e=!1}={}){if(!r.isActive)return;r.isActive=!1,r.isPaused=!1,n=t.container,n.style.outline="",n.removeAttribute("tabIndex"),n.removeAttribute("data-focus-trap-container"),r.beforeFocusTrapMarker.remove(),r.afterFocusTrapMarker.remove(),s(),D(),k.remove(m),requestAnimationFrame(()=>{e||p(t.elementToFocusWhenDeactivated||r.elementFocusedBeforeActivation,h)});var n},pause:function(){if(r.isPaused||!r.isActive)return;r.isPaused=!0,D()},resume:function(){if(!r.isPaused||!r.isActive)return;r.isPaused=!1,F()},updateConfig:function(e){const n=(o="shouldPreventOutsideClick",o in e&&t[o]!==e[o]);var o;t=u(u({},t),e),r.isActive&&n&&(e.shouldPreventOutsideClick?A():a())}};return m;function y(e){const n=e.relatedTarget;n&&!t.container.contains(n)&&C(n)}function E(e){d(e,t.container)&&C(e.target)}function C(e){if(!(null==e?void 0:e.closest("[data-focus-trap-container=true]")))if(e===r.beforeFocusTrapMarker){p(function(e){const t=o(e,{includeContainer:!1});return t[t.length-1]}(t.container),"Could not focus last tabbable element",t.container)}else{p(v(t.container),"Could not focus first tabbable element",t.container)}}function P(e){t.shouldDeactivateOnEscape&&t.onEscape&&t.onEscape(e)}function g(e){var n;if(null===(n=e.target)||void 0===n?void 0:n.closest("[data-focus-trap-container=true]"))return;if("function"==typeof t.shouldDeactivateOnOutsideClick?t.shouldDeactivateOnOutsideClick(e):Boolean(t.shouldDeactivateOnOutsideClick)){const n=!t.shouldPreventOutsideClick;t.onOutsideClick&&t.onOutsideClick(e,n)}else e.preventDefault()}function A(){a(),a=function(e){const t=document.body.style.pointerEvents,n=e.style.pointerEvents;document.body.style.pointerEvents="none",e.style.pointerEvents="auto";const o=b(e,e=>{e.preventDefault()});return()=>{document.body.style.pointerEvents=t,e.style.pointerEvents=n,o()}}(t.container)}function F(){document.addEventListener("blur",y,{capture:!0}),document.addEventListener("focus",E,{capture:!0}),c=function(e){return document.addEventListener("keydown",t,{capture:!0}),()=>{document.removeEventListener("keydown",t,{capture:!0})};function t(t){"Escape"===t.key&&e(t)}}(P),i=b(t.container,g),t.shouldPreventOutsideClick&&A()}function D(){document.removeEventListener("blur",y,{capture:!0}),document.removeEventListener("focus",E,{capture:!0}),c(),i(),a()}}function l(e){const t=document.createElement("div");return t.setAttribute("data-focus-trap-marker",e),t.tabIndex=0,t}function d(e,t){return!t.contains(e.target)}function f(){return document.activeElement}function v(e){return o(e,{includeContainer:!1})[0]}function p(e,t,n){const o=m(e);(void 0===e||function(e){return e instanceof HTMLElement}(e)&&!o)&&(Boolean(t)&&console.warn(t),void 0!==n&&(console.info("Falling back to container focus"),m(n)))}function m(e){return e&&e.focus&&(e.focus({preventScroll:!0}),function(e){return e instanceof HTMLInputElement&&"select"in e}(e)&&e.select()),f()===e}function b(e,t){return document.addEventListener("mousedown",n,{capture:!0}),document.addEventListener("touchstart",n,{capture:!0}),()=>{document.removeEventListener("mousedown",n,{capture:!0}),document.removeEventListener("touchstart",n,{capture:!0})};function n(n){d(n,e)&&t(n)}}const O="Could not focus on an element inside the focus trap when activated (see details below).\n\n- your focus trap should contain at least one focusable element\n- or a focusable element should be provided to `elementToFocusWhenActivated`\n",h="Could not focus on an element outside the focus trap when deactivated (see details below).\n\n- the element that was focused before activating the trap should still exists\n- or a focusable element should be provided to `elementToFocusWhenDeactivated`\n",k=function(){let e=[];return{add:function(n){const o=e[0];n!==o&&(null==o||o.pause());e.includes(n)?(e=t(e,n),e.unshift(n)):e.unshift(n)},remove:function(n){var o;e=t(e,n),null===(o=e[0])||void 0===o||o.resume()}}}();function y(e,t){if(null==e)return{};var n,o,r=function(e,t){if(null==e)return{};var n,o,r={},c=Object.keys(e);for(o=0;o<c.length;o++)n=c[o],t.indexOf(n)>=0||(r[n]=e[n]);return r}(e,t);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(e);for(o=0;o<c.length;o++)n=c[o],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}const E=c.createContext({});E.displayName="LockContext";export function Lock(t){let{children:n}=t,o=y(t,["children"]);const r=e(),i=c.Children.only(n);return c.isValidElement(i)?r.disableLock?i:c.createElement(C,o,i):null}function C({children:e,onDeactivate:t=(()=>{}),refToFocusOnActivation:n,refToFocusOnDeactivation:o,shouldDeactivateOnEscape:i=!0,shouldDeactivateOnOutsideClick:u=!0,shouldPreventOutsideClick:a=!0}){const l=c.useRef(null),d=c.useRef(),f=c.useRef(!1),{deactivateParentLocks:v,shouldDeactivateOnOutsideClick:p}=c.useContext(E),m=c.useCallback(e=>{const n=void 0!==v;f.current=!!n||e,t(),v&&v(e)},[t,v]);c.useEffect(()=>(l.current&&(d.current=s({container:l.current}),d.current.activate()),()=>{var e;null===(e=d.current)||void 0===e||e.deactivate({shouldPreventFocusControl:f.current}),f.current=!1}),[]);const b=c.useCallback((e,n)=>{f.current=n,t(),a||v&&v(n)},[t,a,v]);c.useEffect(()=>{var e;null===(e=d.current)||void 0===e||e.updateConfig({elementToFocusWhenActivated:null==n?void 0:n.current,elementToFocusWhenDeactivated:null==o?void 0:o.current,shouldDeactivateOnEscape:i,onEscape:t,shouldDeactivateOnOutsideClick:null!=p?p:u,onOutsideClick:b,shouldPreventOutsideClick:a})},[n,o,i,t,u,p,b,a]);const O=r(e.ref,l);return c.createElement(E.Provider,{value:{containerRef:l,deactivateParentLocks:m,shouldDeactivateOnOutsideClick:null!=p?p:u}},c.cloneElement(e,{ref:O}))}export function useLockContext(){const{containerRef:e}=c.useContext(E);return c.useMemo(()=>({lockContainerRef:e}),[e])}
//# sourceMappingURL=index.module.js.map

8

package.json
{
"name": "@interop-ui/react-lock",
"version": "0.0.1-1",
"version": "0.0.1-2",
"license": "MIT",

@@ -19,5 +19,5 @@ "source": "src/index.ts",

"dependencies": {
"@interop-ui/react-debug-context": "0.0.1-1",
"@interop-ui/react-utils": "0.0.1-1",
"@interop-ui/tabbable": "0.0.1-0",
"@interop-ui/react-debug-context": "0.0.1-2",
"@interop-ui/react-utils": "0.0.1-2",
"@interop-ui/tabbable": "0.0.1-1",
"@interop-ui/utils": "0.0.1-1",

@@ -24,0 +24,0 @@ "aria-hidden": "^1.1.1"

dist/index.js.map

Sorry, the diff of this file is not supported yet

dist/index.module.js.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc