Socket
Socket
Sign inDemoInstall

@radix-ui/react-focus-scope

Package Overview
Dependencies
Maintainers
8
Versions
175
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@radix-ui/react-focus-scope - npm Package Compare versions

Comparing version 0.0.13 to 0.0.14

17

dist/index.d.ts

@@ -1,8 +0,4 @@

import * as React from "react";
type FocusScopeProps = {
children: (args: {
ref: React.RefCallback<any>;
tabIndex: number;
onKeyDown: React.KeyboardEventHandler;
}) => React.ReactElement;
import { Primitive } from "@radix-ui/react-primitive";
import * as Polymorphic from "@radix-ui/react-polymorphic";
type FocusScopeOwnProps = Polymorphic.Merge<Polymorphic.OwnProps<typeof Primitive>, {
/**

@@ -23,6 +19,7 @@ * Whether focus should be trapped within the FocusScope

onUnmountAutoFocus?: (event: Event) => void;
};
export function FocusScope(props: FocusScopeProps): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)>;
export const Root: typeof FocusScope;
}>;
type FocusScopePrimitive = Polymorphic.ForwardRefComponent<Polymorphic.IntrinsicElement<typeof Primitive>, FocusScopeOwnProps>;
export const FocusScope: FocusScopePrimitive;
export const Root: FocusScopePrimitive;
//# sourceMappingURL=index.d.ts.map

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

var e,t,n=require("@radix-ui/react-use-callback-ref").useCallbackRef,u=(e={},t=require("react"),Object.keys(t).forEach((function(n){"default"!==n&&"__esModule"!==n&&Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[n]}})})),e);const o={bubbles:!1,cancelable:!0};function c(e){const{children:t,trapped:c=!1}=e,[i,f]=u.useState(null),l=n(e.onMountAutoFocus),p=n(e.onUnmountAutoFocus),m=u.useRef(null),v=c,E=c,b=u.useRef({paused:!1,pause(){this.paused=!0},resume(){this.paused=!1}}).current;u.useEffect((()=>{if(i){d.add(b);const e=document.activeElement;i.addEventListener("focusScope.autoFocusOnMount",l),i.addEventListener("focusScope.autoFocusOnUnmount",p);const t=new Event("focusScope.autoFocusOnMount",o);return i.dispatchEvent(t),t.defaultPrevented||(!function(e,{select:t=!1}={}){const n=document.activeElement;for(const u of e)if(a(u,{select:t}),document.activeElement!==n)return}(r(i),{select:!0}),document.activeElement===e&&a(i)),()=>{i.removeEventListener("focusScope.autoFocusOnMount",l),setTimeout((()=>{const t=new Event("focusScope.autoFocusOnUnmount",o);i.dispatchEvent(t),t.defaultPrevented||a(null!=e?e:document.body,{select:!0}),i.removeEventListener("focusScope.autoFocusOnUnmount",p),d.remove(b)}),0)}}}),[i,l,p,b]);const F=u.useCallback((e=>{if(!v&&!E)return;if(b.paused)return;const t="Tab"===e.key&&!e.altKey&&!e.ctrlKey&&!e.metaKey,n=document.activeElement;if(t&&n){const t=e.currentTarget,[u,o]=function(e){const t=r(e),n=s(t,e),u=s(t.reverse(),e);return[n,u]}(t);u&&o?e.shiftKey||n!==o?e.shiftKey&&n===u&&(e.preventDefault(),v&&a(o,{select:!0})):(e.preventDefault(),v&&a(u,{select:!0})):n===t&&e.preventDefault()}}),[v,E,b.paused]);return u.useEffect((()=>{if(E){function e(e){if(b.paused||!i)return;const t=e.target;i.contains(t)?m.current=t:a(m.current,{select:!0})}function t(e){!b.paused&&i&&(i.contains(e.relatedTarget)||a(m.current,{select:!0}))}return document.addEventListener("focusin",e),document.addEventListener("focusout",t),()=>{document.removeEventListener("focusin",e),document.removeEventListener("focusout",t)}}}),[E,i,b.paused]),t({ref:u.useCallback((e=>f(e)),[]),tabIndex:-1,onKeyDown:F})}function r(e){const t=[],n=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,{acceptNode:e=>{const t="INPUT"===e.tagName&&"hidden"===e.type;return e.disabled||e.hidden||t?NodeFilter.FILTER_SKIP:e.tabIndex>=0?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_SKIP}});for(;n.nextNode();)t.push(n.currentNode);return t}function s(e,t){for(const n of e)if(!i(n,{upTo:t}))return n}function i(e,{upTo:t}){if("hidden"===getComputedStyle(e).visibility)return!0;for(;e;){if(void 0!==t&&e===t)return!1;if("none"===getComputedStyle(e).display)return!0;e=e.parentElement}return!1}function a(e,{select:t=!1}={}){if(e&&e.focus){const n=document.activeElement;e.focus({preventScroll:!0}),e!==n&&function(e){return e instanceof HTMLInputElement&&"select"in e}(e)&&t&&e.select()}}exports.FocusScope=c;const d=function(){let e=[];return{add(t){const n=e[0];t!==n&&(null==n||n.pause()),e=f(e,t),e.unshift(t)},remove(t){var n;e=f(e,t),null===(n=e[0])||void 0===n||n.resume()}}}();function f(e,t){const n=[...e],u=n.indexOf(t);return-1!==u&&n.splice(u,1),n}const l=c;exports.Root=l;
var e,t,n,u=require("@radix-ui/react-use-callback-ref").useCallbackRef,o=require("@radix-ui/react-primitive").Primitive,r=require("@radix-ui/react-compose-refs").useComposedRefs,c=(e={},t=require("react"),Object.keys(t).forEach((function(n){"default"!==n&&"__esModule"!==n&&Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[n]}})})),e),s=(n=require("@babel/runtime/helpers/extends"))&&n.__esModule?n.default:n;const i={bubbles:!1,cancelable:!0},a=/*#__PURE__*/c.forwardRef(((e,t)=>{const{trapped:n=!1,onMountAutoFocus:a,onUnmountAutoFocus:l,...v}=e,[E,b]=c.useState(null),F=u(a),y=u(l),S=c.useRef(null),T=r(t,(e=>b(e))),h=n,L=n,x=c.useRef({paused:!1,pause(){this.paused=!0},resume(){this.paused=!1}}).current;c.useEffect((()=>{if(L){function e(e){if(x.paused||!E)return;const t=e.target;E.contains(t)?S.current=t:m(S.current,{select:!0})}function t(e){!x.paused&&E&&(E.contains(e.relatedTarget)||m(S.current,{select:!0}))}return document.addEventListener("focusin",e),document.addEventListener("focusout",t),()=>{document.removeEventListener("focusin",e),document.removeEventListener("focusout",t)}}}),[L,E,x.paused]),c.useEffect((()=>{if(E){p.add(x);const e=document.activeElement;E.addEventListener("focusScope.autoFocusOnMount",F),E.addEventListener("focusScope.autoFocusOnUnmount",y);const t=new Event("focusScope.autoFocusOnMount",i);return E.dispatchEvent(t),t.defaultPrevented||(!function(e,{select:t=!1}={}){const n=document.activeElement;for(const u of e)if(m(u,{select:t}),document.activeElement!==n)return}(d(E),{select:!0}),document.activeElement===e&&m(E)),()=>{E.removeEventListener("focusScope.autoFocusOnMount",F),setTimeout((()=>{const t=new Event("focusScope.autoFocusOnUnmount",i);E.dispatchEvent(t),t.defaultPrevented||m(null!=e?e:document.body,{select:!0}),E.removeEventListener("focusScope.autoFocusOnUnmount",y),p.remove(x)}),0)}}}),[E,F,y,x]);const N=c.useCallback((e=>{if(!h&&!L)return;if(x.paused)return;const t="Tab"===e.key&&!e.altKey&&!e.ctrlKey&&!e.metaKey,n=document.activeElement;if(t&&n){const t=e.currentTarget,[u,o]=function(e){const t=d(e),n=f(t,e),u=f(t.reverse(),e);return[n,u]}(t);u&&o?e.shiftKey||n!==o?e.shiftKey&&n===u&&(e.preventDefault(),h&&m(o,{select:!0})):(e.preventDefault(),h&&m(u,{select:!0})):n===t&&e.preventDefault()}}),[h,L,x.paused]);/*#__PURE__*/return c.createElement(o,s({tabIndex:-1},v,{ref:T,onKeyDown:N}))}));function d(e){const t=[],n=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,{acceptNode:e=>{const t="INPUT"===e.tagName&&"hidden"===e.type;return e.disabled||e.hidden||t?NodeFilter.FILTER_SKIP:e.tabIndex>=0?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_SKIP}});for(;n.nextNode();)t.push(n.currentNode);return t}function f(e,t){for(const n of e)if(!l(n,{upTo:t}))return n}function l(e,{upTo:t}){if("hidden"===getComputedStyle(e).visibility)return!0;for(;e;){if(void 0!==t&&e===t)return!1;if("none"===getComputedStyle(e).display)return!0;e=e.parentElement}return!1}function m(e,{select:t=!1}={}){if(e&&e.focus){const n=document.activeElement;e.focus({preventScroll:!0}),e!==n&&function(e){return e instanceof HTMLInputElement&&"select"in e}(e)&&t&&e.select()}}exports.FocusScope=a;const p=function(){let e=[];return{add(t){const n=e[0];t!==n&&(null==n||n.pause()),e=v(e,t),e.unshift(t)},remove(t){var n;e=v(e,t),null===(n=e[0])||void 0===n||n.resume()}}}();function v(e,t){const n=[...e],u=n.indexOf(t);return-1!==u&&n.splice(u,1),n}const E=a;exports.Root=E;
//# sourceMappingURL=index.js.map

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

import{useCallbackRef as e}from"@radix-ui/react-use-callback-ref";import*as t from"react";const n={bubbles:!1,cancelable:!0};export function FocusScope(c){const{children:i,trapped:a=!1}=c,[d,f]=t.useState(null),l=e(c.onMountAutoFocus),m=e(c.onUnmountAutoFocus),p=t.useRef(null),v=a,E=a,F=t.useRef({paused:!1,pause(){this.paused=!0},resume(){this.paused=!1}}).current;t.useEffect((()=>{if(d){s.add(F);const e=document.activeElement;d.addEventListener("focusScope.autoFocusOnMount",l),d.addEventListener("focusScope.autoFocusOnUnmount",m);const t=new Event("focusScope.autoFocusOnMount",n);return d.dispatchEvent(t),t.defaultPrevented||(!function(e,{select:t=!1}={}){const n=document.activeElement;for(const o of e)if(r(o,{select:t}),document.activeElement!==n)return}(o(d),{select:!0}),document.activeElement===e&&r(d)),()=>{d.removeEventListener("focusScope.autoFocusOnMount",l),setTimeout((()=>{const t=new Event("focusScope.autoFocusOnUnmount",n);d.dispatchEvent(t),t.defaultPrevented||r(null!=e?e:document.body,{select:!0}),d.removeEventListener("focusScope.autoFocusOnUnmount",m),s.remove(F)}),0)}}}),[d,l,m,F]);const S=t.useCallback((e=>{if(!v&&!E)return;if(F.paused)return;const t="Tab"===e.key&&!e.altKey&&!e.ctrlKey&&!e.metaKey,n=document.activeElement;if(t&&n){const t=e.currentTarget,[c,s]=function(e){const t=o(e),n=u(t,e),c=u(t.reverse(),e);return[n,c]}(t);c&&s?e.shiftKey||n!==s?e.shiftKey&&n===c&&(e.preventDefault(),v&&r(s,{select:!0})):(e.preventDefault(),v&&r(c,{select:!0})):n===t&&e.preventDefault()}}),[v,E,F.paused]);return t.useEffect((()=>{if(E){function e(e){if(F.paused||!d)return;const t=e.target;d.contains(t)?p.current=t:r(p.current,{select:!0})}function t(e){!F.paused&&d&&(d.contains(e.relatedTarget)||r(p.current,{select:!0}))}return document.addEventListener("focusin",e),document.addEventListener("focusout",t),()=>{document.removeEventListener("focusin",e),document.removeEventListener("focusout",t)}}}),[E,d,F.paused]),i({ref:t.useCallback((e=>f(e)),[]),tabIndex:-1,onKeyDown:S})}function o(e){const t=[],n=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,{acceptNode:e=>{const t="INPUT"===e.tagName&&"hidden"===e.type;return e.disabled||e.hidden||t?NodeFilter.FILTER_SKIP:e.tabIndex>=0?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_SKIP}});for(;n.nextNode();)t.push(n.currentNode);return t}function u(e,t){for(const n of e)if(!c(n,{upTo:t}))return n}function c(e,{upTo:t}){if("hidden"===getComputedStyle(e).visibility)return!0;for(;e;){if(void 0!==t&&e===t)return!1;if("none"===getComputedStyle(e).display)return!0;e=e.parentElement}return!1}function r(e,{select:t=!1}={}){if(e&&e.focus){const n=document.activeElement;e.focus({preventScroll:!0}),e!==n&&function(e){return e instanceof HTMLInputElement&&"select"in e}(e)&&t&&e.select()}}const s=function(){let e=[];return{add(t){const n=e[0];t!==n&&(null==n||n.pause()),e=i(e,t),e.unshift(t)},remove(t){var n;e=i(e,t),null===(n=e[0])||void 0===n||n.resume()}}}();function i(e,t){const n=[...e],o=n.indexOf(t);return-1!==o&&n.splice(o,1),n}export const Root=FocusScope;
import{useCallbackRef as e}from"@radix-ui/react-use-callback-ref";import{Primitive as t}from"@radix-ui/react-primitive";import{useComposedRefs as n}from"@radix-ui/react-compose-refs";import*as o from"react";import u from"@babel/runtime/helpers/esm/extends";const c={bubbles:!1,cancelable:!0};export const FocusScope=/*#__PURE__*/o.forwardRef(((i,f)=>{const{trapped:l=!1,onMountAutoFocus:m,onUnmountAutoFocus:p,...v}=i,[E,F]=o.useState(null),S=e(m),b=e(p),T=o.useRef(null),y=n(f,(e=>F(e))),L=l,h=l,x=o.useRef({paused:!1,pause(){this.paused=!0},resume(){this.paused=!1}}).current;o.useEffect((()=>{if(h){function e(e){if(x.paused||!E)return;const t=e.target;E.contains(t)?T.current=t:a(T.current,{select:!0})}function t(e){!x.paused&&E&&(E.contains(e.relatedTarget)||a(T.current,{select:!0}))}return document.addEventListener("focusin",e),document.addEventListener("focusout",t),()=>{document.removeEventListener("focusin",e),document.removeEventListener("focusout",t)}}}),[h,E,x.paused]),o.useEffect((()=>{if(E){d.add(x);const e=document.activeElement;E.addEventListener("focusScope.autoFocusOnMount",S),E.addEventListener("focusScope.autoFocusOnUnmount",b);const t=new Event("focusScope.autoFocusOnMount",c);return E.dispatchEvent(t),t.defaultPrevented||(!function(e,{select:t=!1}={}){const n=document.activeElement;for(const o of e)if(a(o,{select:t}),document.activeElement!==n)return}(r(E),{select:!0}),document.activeElement===e&&a(E)),()=>{E.removeEventListener("focusScope.autoFocusOnMount",S),setTimeout((()=>{const t=new Event("focusScope.autoFocusOnUnmount",c);E.dispatchEvent(t),t.defaultPrevented||a(null!=e?e:document.body,{select:!0}),E.removeEventListener("focusScope.autoFocusOnUnmount",b),d.remove(x)}),0)}}}),[E,S,b,x]);const N=o.useCallback((e=>{if(!L&&!h)return;if(x.paused)return;const t="Tab"===e.key&&!e.altKey&&!e.ctrlKey&&!e.metaKey,n=document.activeElement;if(t&&n){const t=e.currentTarget,[o,u]=function(e){const t=r(e),n=s(t,e),o=s(t.reverse(),e);return[n,o]}(t);o&&u?e.shiftKey||n!==u?e.shiftKey&&n===o&&(e.preventDefault(),L&&a(u,{select:!0})):(e.preventDefault(),L&&a(o,{select:!0})):n===t&&e.preventDefault()}}),[L,h,x.paused]);/*#__PURE__*/return o.createElement(t,u({tabIndex:-1},v,{ref:y,onKeyDown:N}))}));/*#__PURE__*/function r(e){const t=[],n=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,{acceptNode:e=>{const t="INPUT"===e.tagName&&"hidden"===e.type;return e.disabled||e.hidden||t?NodeFilter.FILTER_SKIP:e.tabIndex>=0?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_SKIP}});for(;n.nextNode();)t.push(n.currentNode);return t}function s(e,t){for(const n of e)if(!i(n,{upTo:t}))return n}function i(e,{upTo:t}){if("hidden"===getComputedStyle(e).visibility)return!0;for(;e;){if(void 0!==t&&e===t)return!1;if("none"===getComputedStyle(e).display)return!0;e=e.parentElement}return!1}function a(e,{select:t=!1}={}){if(e&&e.focus){const n=document.activeElement;e.focus({preventScroll:!0}),e!==n&&function(e){return e instanceof HTMLInputElement&&"select"in e}(e)&&t&&e.select()}}const d=function(){let e=[];return{add(t){const n=e[0];t!==n&&(null==n||n.pause()),e=f(e,t),e.unshift(t)},remove(t){var n;e=f(e,t),null===(n=e[0])||void 0===n||n.resume()}}}();function f(e,t){const n=[...e],o=n.indexOf(t);return-1!==o&&n.splice(o,1),n}export const Root=FocusScope;
//# sourceMappingURL=index.module.js.map
{
"name": "@radix-ui/react-focus-scope",
"version": "0.0.13",
"version": "0.0.14",
"license": "MIT",

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

"@babel/runtime": "^7.13.10",
"@radix-ui/react-compose-refs": "0.0.5",
"@radix-ui/react-polymorphic": "0.0.12",
"@radix-ui/react-primitive": "0.0.14",
"@radix-ui/react-use-callback-ref": "0.0.5"

@@ -23,0 +26,0 @@ },

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

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

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc