react-focus-on 3.5.4 → 3.6.0

package/CHANGELOG.md

@@ -0,0 +1,240 @@
+# [3.6.0](https://github.com/theKashey/react-focus-on/compare/v3.5.4...v3.6.0) (2022-05-01)
+
+
+### Bug Fixes
+
+* update underlaying packages; brings React 18 and Shadow DOM support ([5bd7b5c](https://github.com/theKashey/react-focus-on/commit/5bd7b5c))
+
+
+
+## [3.5.4](https://github.com/theKashey/react-focus-on/compare/v3.5.3...v3.5.4) (2021-11-09)
+
+
+
+## [3.5.3](https://github.com/theKashey/react-focus-on/compare/v3.5.2...v3.5.3) (2021-11-09)
+
+
+### Bug Fixes
+
+* add tslib as dependency, fixes [#54](https://github.com/theKashey/react-focus-on/issues/54) ([ce204cd](https://github.com/theKashey/react-focus-on/commit/ce204cd))
+
+
+
+## [3.5.2](https://github.com/theKashey/react-focus-on/compare/v3.5.1...v3.5.2) (2021-03-28)
+
+
+
+## [3.5.1](https://github.com/theKashey/react-focus-on/compare/v3.5.0...v3.5.1) (2020-11-27)
+
+
+
+# [3.5.0](https://github.com/theKashey/react-focus-on/compare/v3.4.1...v3.5.0) (2020-08-13)
+
+
+### Features
+
+* add 'as' and 'style' props ([d1a79e4](https://github.com/theKashey/react-focus-on/commit/d1a79e4))
+* expose whitelist prop ([fa5fe87](https://github.com/theKashey/react-focus-on/commit/fa5fe87))
+
+
+
+## [3.4.1](https://github.com/theKashey/react-focus-on/compare/v3.4.0...v3.4.1) (2020-04-17)
+
+
+### Bug Fixes
+
+* update focus-lock, fixes [#35](https://github.com/theKashey/react-focus-on/issues/35) ([280d4a5](https://github.com/theKashey/react-focus-on/commit/280d4a5))
+
+
+
+# [3.4.0](https://github.com/theKashey/react-focus-on/compare/v3.3.0...v3.4.0) (2020-04-16)
+
+
+### Features
+
+* support CSP ([67739a4](https://github.com/theKashey/react-focus-on/commit/67739a4))
+
+
+
+# [3.3.0](https://github.com/theKashey/react-focus-on/compare/v3.2.0...v3.3.0) (2019-10-17)
+
+
+### Features
+
+* add allowPinchZoom ([ad396d7](https://github.com/theKashey/react-focus-on/commit/ad396d7))
+
+
+
+# [3.2.0](https://github.com/theKashey/react-focus-on/compare/v3.1.5...v3.2.0) (2019-10-13)
+
+
+### Features
+
+* allow ref forwarding ([d379b3c](https://github.com/theKashey/react-focus-on/commit/d379b3c))
+
+
+
+## [3.1.5](https://github.com/theKashey/react-focus-on/compare/v3.1.4...v3.1.5) (2019-10-06)
+
+
+
+## [3.1.4](https://github.com/theKashey/react-focus-on/compare/v3.1.3...v3.1.4) (2019-10-05)
+
+
+
+## [3.1.3](https://github.com/theKashey/react-focus-on/compare/v3.1.2...v3.1.3) (2019-10-01)
+
+
+### Bug Fixes
+
+* deactivation sequence, fixes [#24](https://github.com/theKashey/react-focus-on/issues/24) ([32ed7d7](https://github.com/theKashey/react-focus-on/commit/32ed7d7))
+
+
+
+## [3.1.2](https://github.com/theKashey/react-focus-on/compare/v3.1.1...v3.1.2) (2019-09-28)
+
+
+
+## [3.1.1](https://github.com/theKashey/react-focus-on/compare/v3.1.0...v3.1.1) (2019-09-21)
+
+
+### Bug Fixes
+
+* update hooks when users changes callbacks, fixes [#17](https://github.com/theKashey/react-focus-on/issues/17) ([127a303](https://github.com/theKashey/react-focus-on/commit/127a303))
+
+
+
+# [3.1.0](https://github.com/theKashey/react-focus-on/compare/v3.0.7...v3.1.0) (2019-09-13)
+
+
+### Features
+
+* support returnOption=preventScroll FocusLock option ([ff2dad3](https://github.com/theKashey/react-focus-on/commit/ff2dad3))
+
+
+
+## [3.0.7](https://github.com/theKashey/react-focus-on/compare/v3.0.6...v3.0.7) (2019-09-11)
+
+
+
+## [3.0.6](https://github.com/theKashey/react-focus-on/compare/v3.0.5...v3.0.6) (2019-08-15)
+
+
+### Bug Fixes
+
+* fixes onClickOutside on iOS devices. fixes [#13](https://github.com/theKashey/react-focus-on/issues/13) ([96d0756](https://github.com/theKashey/react-focus-on/commit/96d0756))
+
+
+
+## [3.0.5](https://github.com/theKashey/react-focus-on/compare/v3.0.4...v3.0.5) (2019-07-16)
+
+
+### Bug Fixes
+
+* handle Esc in IE compatible way, fixes [#10](https://github.com/theKashey/react-focus-on/issues/10) ([f897bea](https://github.com/theKashey/react-focus-on/commit/f897bea))
+
+
+
+## [3.0.4](https://github.com/theKashey/react-focus-on/compare/v3.0.3...v3.0.4) (2019-07-16)
+
+
+### Bug Fixes
+
+* expose returnFocus prop, fixes [#11](https://github.com/theKashey/react-focus-on/issues/11) ([b25b5b5](https://github.com/theKashey/react-focus-on/commit/b25b5b5))
+
+
+
+## [3.0.3](https://github.com/theKashey/react-focus-on/compare/v3.0.1...v3.0.3) (2019-07-03)
+
+
+
+## [3.0.1](https://github.com/theKashey/react-focus-on/compare/v3.0.0...v3.0.1) (2019-07-02)
+
+
+### Bug Fixes
+
+* aria-hidden broken in v3, fixes [#8](https://github.com/theKashey/react-focus-on/issues/8) ([f7570e5](https://github.com/theKashey/react-focus-on/commit/f7570e5))
+
+
+
+# [3.0.0](https://github.com/theKashey/react-focus-on/compare/v2.0.2...v3.0.0) (2019-06-29)
+
+
+### Features
+
+* introduce sidecar ([0588039](https://github.com/theKashey/react-focus-on/commit/0588039))
+
+
+
+## [2.0.2](https://github.com/theKashey/react-focus-on/compare/v2.0.1...v2.0.2) (2019-05-05)
+
+
+
+## [2.0.1](https://github.com/theKashey/react-focus-on/compare/v2.0.0...v2.0.1) (2019-04-10)
+
+
+### Bug Fixes
+
+* dont prevent internal clicks, fixes [#3](https://github.com/theKashey/react-focus-on/issues/3) ([229eaad](https://github.com/theKashey/react-focus-on/commit/229eaad))
+
+
+
+# [2.0.0](https://github.com/theKashey/react-focus-on/compare/v1.3.2...v2.0.0) (2019-03-11)
+
+
+### Features
+
+* shards and remove-scroll ([dbd4d5f](https://github.com/theKashey/react-focus-on/commit/dbd4d5f))
+* shards and remove-scroll ([0f5d421](https://github.com/theKashey/react-focus-on/commit/0f5d421))
+
+
+
+## [1.3.2](https://github.com/theKashey/react-focus-on/compare/v1.3.1...v1.3.2) (2019-01-21)
+
+
+### Bug Fixes
+
+* return focus by default ([a525b4c](https://github.com/theKashey/react-focus-on/commit/a525b4c))
+
+
+
+## [1.3.1](https://github.com/theKashey/react-focus-on/compare/v1.3.0...v1.3.1) (2018-12-31)
+
+
+### Bug Fixes
+
+* Escape on body ([e551925](https://github.com/theKashey/react-focus-on/commit/e551925))
+
+
+
+# [1.3.0](https://github.com/theKashey/react-focus-on/compare/v1.2.1...v1.3.0) (2018-11-13)
+
+
+### Features
+
+* expose gapMode ([0298cc8](https://github.com/theKashey/react-focus-on/commit/0298cc8))
+
+
+
+## [1.2.1](https://github.com/theKashey/react-focus-on/compare/v1.2.0...v1.2.1) (2018-11-13)
+
+
+
+# [1.2.0](https://github.com/theKashey/react-focus-on/compare/v1.1.0...v1.2.0) (2018-11-12)
+
+
+### Features
+
+* onEscapeKey ([7fb17d7](https://github.com/theKashey/react-focus-on/commit/7fb17d7))
+
+
+
+# [1.1.0](https://github.com/theKashey/react-focus-on/compare/ed4d62b...v1.1.0) (2018-11-07)
+
+
+### Features
+
+* onClickOutside event ([ed4d62b](https://github.com/theKashey/react-focus-on/commit/ed4d62b))
+
+
+

package/dist/es2015/Combination.js

@@ -1,8 +1,8 @@
-import * as tslib_1 from "tslib";
+import { __assign } from "tslib";
 import * as React from 'react';
 import { FocusOn as ReactFocusOn } from './UI';
 import SideCar from './sidecar';
 var RequireSideCar = function (props) {
-    return React.createElement(SideCar, tslib_1.__assign({}, props));
+    return React.createElement(SideCar, __assign({}, props));
 };
-export var FocusOn = React.forwardRef(function (props, ref) { return React.createElement(ReactFocusOn, tslib_1.__assign({}, props, { ref: ref, sideCar: RequireSideCar })); });
+export var FocusOn = React.forwardRef(function (props, ref) { return React.createElement(ReactFocusOn, __assign({}, props, { ref: ref, sideCar: RequireSideCar })); });

package/dist/es2015/Effect.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { EffectProps } from './types';
 export declare function Effect({ setLockProps, onEscapeKey, onClickOutside, shards, onActivation, onDeactivation, noIsolation }: EffectProps): JSX.Element;

package/dist/es2015/Effect.js

@@ -1,3 +1,4 @@
+import { __spreadArrays } from "tslib";
 import * as React from 'react';
 import { hideOthers } from 'aria-hidden';
 import { InteractivityDisabler } from './InteractivityDisabler';
@@ -77,7 +78,9 @@ export function Effect(_a) {
         var _undo = function () { return null; };
         var unmounted = false;
         var onNodeActivation = function (node) {
-            _undo = hideOthers([node].concat((shards || []).map(extractRef)), document.body, noIsolation ? undefined : focusHiddenMarker);
+            if (!noIsolation) {
+                _undo = hideOthers(__spreadArrays([node], (shards || []).map(extractRef)), document.body, focusHiddenMarker);
+            }
             setActiveNode(function () { return node; });
         };
         var onNodeDeactivation = function () {

package/dist/es2015/InteractivityDisabler.d.ts

@@ -1,2 +1,2 @@
 import * as React from 'react';
-export declare const InteractivityDisabler: React.SFC;
+export declare const InteractivityDisabler: React.FC;

package/dist/es2015/UI.js

@@ -1,20 +1,21 @@
-import * as tslib_1 from "tslib";
+import { __assign, __rest } from "tslib";
 import * as React from 'react';
 import { RemoveScroll } from 'react-remove-scroll/UI';
 import ReactFocusLock from 'react-focus-lock/UI';
 import { effectCar } from './medium';
 export var FocusOn = React.forwardRef(function (props, parentRef) {
     var _a = React.useState(false), lockProps = _a[0], setLockProps = _a[1];
-    var children = props.children, autoFocus = props.autoFocus, shards = props.shards, _b = props.enabled, enabled = _b === void 0 ? true : _b, _c = props.scrollLock, scrollLock = _c === void 0 ? true : _c, _d = props.focusLock, focusLock = _d === void 0 ? true : _d, _e = props.returnFocus, returnFocus = _e === void 0 ? true : _e, inert = props.inert, allowPinchZoom = props.allowPinchZoom, sideCar = props.sideCar, className = props.className, shouldIgnore = props.shouldIgnore, style = props.style, as = props.as, rest = tslib_1.__rest(props, ["children", "autoFocus", "shards", "enabled", "scrollLock", "focusLock", "returnFocus", "inert", "allowPinchZoom", "sideCar", "className", "shouldIgnore", "style", "as"]);
+    var children = props.children, autoFocus = props.autoFocus, shards = props.shards, _b = props.enabled, enabled = _b === void 0 ? true : _b, _c = props.scrollLock, scrollLock = _c === void 0 ? true : _c, _d = props.focusLock, focusLock = _d === void 0 ? true : _d, _e = props.returnFocus, returnFocus = _e === void 0 ? true : _e, inert = props.inert, allowPinchZoom = props.allowPinchZoom, sideCar = props.sideCar, className = props.className, shouldIgnore = props.shouldIgnore, style = props.style, as = props.as, rest = __rest(props, ["children", "autoFocus", "shards", "enabled", "scrollLock", "focusLock", "returnFocus", "inert", "allowPinchZoom", "sideCar", "className", "shouldIgnore", "style", "as"]);
     var SideCar = sideCar;
-    var onActivation = lockProps.onActivation, onDeactivation = lockProps.onDeactivation, restProps = tslib_1.__rest(lockProps, ["onActivation", "onDeactivation"]);
+    var onActivation = lockProps.onActivation, onDeactivation = lockProps.onDeactivation, restProps = __rest(lockProps, ["onActivation", "onDeactivation"]);
+    var appliedLockProps = __assign(__assign({}, restProps), { sideCar: sideCar,
+        shards: shards,
+        allowPinchZoom: allowPinchZoom,
+        as: as,
+        inert: inert,
+        style: style, enabled: enabled && scrollLock });
     return (React.createElement(React.Fragment, null,
-        React.createElement(ReactFocusLock, { ref: parentRef, sideCar: sideCar, disabled: !(lockProps && enabled && focusLock), returnFocus: returnFocus, autoFocus: autoFocus, shards: shards, onActivation: onActivation, onDeactivation: onDeactivation, className: className, as: RemoveScroll, whiteList: shouldIgnore, lockProps: tslib_1.__assign({}, restProps, { sideCar: sideCar,
-                shards: shards,
-                allowPinchZoom: allowPinchZoom,
-                as: as,
-                inert: inert,
-                style: style, enabled: enabled && scrollLock }) }, children),
-        enabled && (React.createElement(SideCar, tslib_1.__assign({}, rest, { sideCar: effectCar, setLockProps: setLockProps, shards: shards })))));
+        React.createElement(ReactFocusLock, { ref: parentRef, sideCar: sideCar, disabled: !(lockProps && enabled && focusLock), returnFocus: returnFocus, autoFocus: autoFocus, shards: shards, onActivation: onActivation, onDeactivation: onDeactivation, className: className, whiteList: shouldIgnore, lockProps: appliedLockProps, as: RemoveScroll }, children),
+        enabled && (React.createElement(SideCar, __assign({}, rest, { sideCar: effectCar, setLockProps: setLockProps, shards: shards })))));
 });
 export * from './reExports';

package/dist/es2015/medium.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-export declare const effectCar: Readonly<import("use-sidecar/dist/es5/types").SideMedium<import("react").ComponentType<{}>>>;
+import { EffectProps } from "./types";
+export declare const effectCar: Readonly<import("use-sidecar/dist/es5/types").SideCarMedium<EffectProps>>;
 export declare const focusHiddenMarker = "data-focus-on-hidden";

package/dist/es2015/reExports.js

@@ -1,4 +1,4 @@
-import * as tslib_1 from "tslib";
+import { __assign } from "tslib";
 import { RemoveScroll } from 'react-remove-scroll/UI';
 export { AutoFocusInside, MoveFocusInside, InFocusGuard } from 'react-focus-lock/UI';
-export var classNames = tslib_1.__assign({}, RemoveScroll.classNames);
+export var classNames = __assign({}, RemoveScroll.classNames);

package/dist/es2015/sidecar.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
 import 'react-focus-lock/sidecar';
 import 'react-remove-scroll/sidecar';
-declare const _default: import("react").FunctionComponent<import("./types").EffectProps & import("use-sidecar/dist/es5/types").SideCarHOC>;
+declare const _default: import("use-sidecar").SideCarComponent<import("./types").EffectProps>;
 export default _default;

package/dist/es2015/types.d.ts

@@ -2,90 +2,90 @@ import * as React from 'react';
 import ReactFocusLock from 'react-focus-lock/UI';
 import { ComponentProps } from "react";
 export interface LockProps {
-    onMouseDown?(e: React.MouseEvent): void;
-    onTouchStart?(e: React.TouchEvent): void;
-    onActivation?(node: HTMLElement): void;
-    onDeactivation?(): void;
+    onMouseDown?: ((e: React.MouseEvent) => void) | undefined;
+    onTouchStart?: ((e: React.TouchEvent) => void) | undefined;
+    onActivation?: ((node: HTMLElement) => void) | undefined;
+    onDeactivation?: (() => void) | undefined;
 }
 export interface CommonProps {
     /**
      * action to perform on Esc key press
      */
-    onEscapeKey?: (event: Event) => void;
+    onEscapeKey?: ((event: Event) => void) | undefined;
     /**
      * action to perform on click outside
      */
-    onClickOutside?: (event: MouseEvent | TouchEvent) => void;
+    onClickOutside?: ((event: MouseEvent | TouchEvent) => void) | undefined;
     /**
      * callback on lock activation
      * @param node the main node
      */
-    onActivation?: (node: HTMLElement) => void;
+    onActivation?: ((node: HTMLElement) => void) | undefined;
     /**
      * callback on lock deactivation
      */
-    onDeactivation?: () => void;
+    onDeactivation?: (() => void) | undefined;
     /**
      * [scroll-lock] control isolation
      * @see {@link https://github.com/theKashey/react-remove-scroll#usage}
      */
-    noIsolation?: boolean;
+    noIsolation?: boolean | undefined;
     /**
      * [scroll-lock] full page inert (event suppression)
      * @default false
      * @see {@link https://github.com/theKashey/react-remove-scroll#usage}
      */
-    inert?: boolean;
+    inert?: boolean | undefined;
     /**
      * [scroll-lock] allows scroll based zoom
      * @default false
      * @see https://github.com/theKashey/react-remove-scroll#usage
      */
-    allowPinchZoom?: boolean;
+    allowPinchZoom?: boolean | undefined;
     /**
      * a list of elements which should be considered as a part of the lock
      */
-    shards?: Array<React.RefObject<any> | HTMLElement>;
+    shards?: (Array<React.RefObject<any> | HTMLElement>) | undefined;
 }
 export interface ReactFocusOnProps extends CommonProps {
     /**
      * The main switch
      */
-    enabled?: boolean;
+    enabled?: boolean | undefined;
     /**
      * Controls scroll lock behavior
      */
-    scrollLock?: boolean;
+    scrollLock?: boolean | undefined;
     /**
      * Controls focus lock behavior
      */
-    focusLock?: boolean;
+    focusLock?: boolean | undefined;
     /**
      * [focus-lock] control autofocus
      * @default true
      */
-    autoFocus?: boolean;
+    autoFocus?: boolean | undefined;
     /**
      * [focus-lock] control returnFocus
      * @default true
      */
-    returnFocus?: ComponentProps<typeof ReactFocusLock>['returnFocus'];
+    returnFocus?: ComponentProps<typeof ReactFocusLock>['returnFocus'] | undefined;
     /**
      * [focus-lock] allows "ignoring" focus on some elements
      * @see {@link https://github.com/theKashey/react-focus-lock#api}
      */
-    shouldIgnore?: (candidate: HTMLElement) => boolean;
+    shouldIgnore?: ((candidate: HTMLElement) => boolean) | undefined;
     /**
      * allows replacement of the host node
      * @default div
      */
-    as?: string | React.ElementType;
-    style?: React.CSSProperties;
-    className?: string;
+    as?: string | React.ElementType | undefined;
+    style?: React.CSSProperties | undefined;
+    className?: string | undefined;
     children: React.ReactNode;
 }
 export interface ReactFocusOnSideProps extends ReactFocusOnProps {
-    sideCar: React.SFC<any>;
+    sideCar: React.FC<any>;
 }
 export interface EffectProps extends CommonProps {
     setLockProps(settings: LockProps): void;

package/dist/es5/Combination.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.FocusOn = void 0;
 var tslib_1 = require("tslib");
 var React = require("react");
 var UI_1 = require("./UI");

package/dist/es5/Effect.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { EffectProps } from './types';
 export declare function Effect({ setLockProps, onEscapeKey, onClickOutside, shards, onActivation, onDeactivation, noIsolation }: EffectProps): JSX.Element;

package/dist/es5/Effect.js

@@ -1,5 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Effect = void 0;
+var tslib_1 = require("tslib");
 var React = require("react");
 var aria_hidden_1 = require("aria-hidden");
 var InteractivityDisabler_1 = require("./InteractivityDisabler");
@@ -79,7 +81,9 @@ function Effect(_a) {
         var _undo = function () { return null; };
         var unmounted = false;
         var onNodeActivation = function (node) {
-            _undo = aria_hidden_1.hideOthers([node].concat((shards || []).map(extractRef)), document.body, noIsolation ? undefined : medium_1.focusHiddenMarker);
+            if (!noIsolation) {
+                _undo = aria_hidden_1.hideOthers(tslib_1.__spreadArrays([node], (shards || []).map(extractRef)), document.body, medium_1.focusHiddenMarker);
+            }
             setActiveNode(function () { return node; });
         };
         var onNodeDeactivation = function () {

package/dist/es5/InteractivityDisabler.d.ts

@@ -1,2 +1,2 @@
 import * as React from 'react';
-export declare const InteractivityDisabler: React.SFC;
+export declare const InteractivityDisabler: React.FC;

package/dist/es5/InteractivityDisabler.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.InteractivityDisabler = void 0;
 var React = require("react");
 var react_style_singleton_1 = require("react-style-singleton");
 var medium_1 = require("./medium");

package/dist/es5/UI.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.FocusOn = void 0;
 var tslib_1 = require("tslib");
 var React = require("react");
 var UI_1 = require("react-remove-scroll/UI");
@@ -10,13 +11,14 @@ exports.FocusOn = React.forwardRef(function (props, parentRef) {
     var children = props.children, autoFocus = props.autoFocus, shards = props.shards, _b = props.enabled, enabled = _b === void 0 ? true : _b, _c = props.scrollLock, scrollLock = _c === void 0 ? true : _c, _d = props.focusLock, focusLock = _d === void 0 ? true : _d, _e = props.returnFocus, returnFocus = _e === void 0 ? true : _e, inert = props.inert, allowPinchZoom = props.allowPinchZoom, sideCar = props.sideCar, className = props.className, shouldIgnore = props.shouldIgnore, style = props.style, as = props.as, rest = tslib_1.__rest(props, ["children", "autoFocus", "shards", "enabled", "scrollLock", "focusLock", "returnFocus", "inert", "allowPinchZoom", "sideCar", "className", "shouldIgnore", "style", "as"]);
     var SideCar = sideCar;
     var onActivation = lockProps.onActivation, onDeactivation = lockProps.onDeactivation, restProps = tslib_1.__rest(lockProps, ["onActivation", "onDeactivation"]);
+    var appliedLockProps = tslib_1.__assign(tslib_1.__assign({}, restProps), { sideCar: sideCar,
+        shards: shards,
+        allowPinchZoom: allowPinchZoom,
+        as: as,
+        inert: inert,
+        style: style, enabled: enabled && scrollLock });
     return (React.createElement(React.Fragment, null,
-        React.createElement(UI_2.default, { ref: parentRef, sideCar: sideCar, disabled: !(lockProps && enabled && focusLock), returnFocus: returnFocus, autoFocus: autoFocus, shards: shards, onActivation: onActivation, onDeactivation: onDeactivation, className: className, as: UI_1.RemoveScroll, whiteList: shouldIgnore, lockProps: tslib_1.__assign({}, restProps, { sideCar: sideCar,
-                shards: shards,
-                allowPinchZoom: allowPinchZoom,
-                as: as,
-                inert: inert,
-                style: style, enabled: enabled && scrollLock }) }, children),
+        React.createElement(UI_2.default, { ref: parentRef, sideCar: sideCar, disabled: !(lockProps && enabled && focusLock), returnFocus: returnFocus, autoFocus: autoFocus, shards: shards, onActivation: onActivation, onDeactivation: onDeactivation, className: className, whiteList: shouldIgnore, lockProps: appliedLockProps, as: UI_1.RemoveScroll }, children),
         enabled && (React.createElement(SideCar, tslib_1.__assign({}, rest, { sideCar: medium_1.effectCar, setLockProps: setLockProps, shards: shards })))));
 });
 tslib_1.__exportStar(require("./reExports"), exports);

package/dist/es5/index.js

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var Combination_1 = require("./Combination");
-exports.FocusOn = Combination_1.FocusOn;
+Object.defineProperty(exports, "FocusOn", { enumerable: true, get: function () { return Combination_1.FocusOn; } });
 tslib_1.__exportStar(require("./reExports"), exports);

package/dist/es5/medium.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-export declare const effectCar: Readonly<import("use-sidecar/dist/es5/types").SideMedium<import("react").ComponentType<{}>>>;
+import { EffectProps } from "./types";
+export declare const effectCar: Readonly<import("use-sidecar/dist/es5/types").SideCarMedium<EffectProps>>;
 export declare const focusHiddenMarker = "data-focus-on-hidden";

package/dist/es5/medium.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.focusHiddenMarker = exports.effectCar = void 0;
 var use_sidecar_1 = require("use-sidecar");
 exports.effectCar = use_sidecar_1.createSidecarMedium();
 exports.focusHiddenMarker = 'data-focus-on-hidden';

package/dist/es5/reExports.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.classNames = void 0;
 var tslib_1 = require("tslib");
 var UI_1 = require("react-remove-scroll/UI");
 var UI_2 = require("react-focus-lock/UI");
-exports.AutoFocusInside = UI_2.AutoFocusInside;
-exports.MoveFocusInside = UI_2.MoveFocusInside;
-exports.InFocusGuard = UI_2.InFocusGuard;
+Object.defineProperty(exports, "AutoFocusInside", { enumerable: true, get: function () { return UI_2.AutoFocusInside; } });
+Object.defineProperty(exports, "MoveFocusInside", { enumerable: true, get: function () { return UI_2.MoveFocusInside; } });
+Object.defineProperty(exports, "InFocusGuard", { enumerable: true, get: function () { return UI_2.InFocusGuard; } });
 exports.classNames = tslib_1.__assign({}, UI_1.RemoveScroll.classNames);

package/dist/es5/sidecar.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
 import 'react-focus-lock/sidecar';
 import 'react-remove-scroll/sidecar';
-declare const _default: import("react").FunctionComponent<import("./types").EffectProps & import("use-sidecar/dist/es5/types").SideCarHOC>;
+declare const _default: import("use-sidecar").SideCarComponent<import("./types").EffectProps>;
 export default _default;

package/dist/es5/types.d.ts

@@ -2,90 +2,90 @@ import * as React from 'react';
 import ReactFocusLock from 'react-focus-lock/UI';
 import { ComponentProps } from "react";
 export interface LockProps {
-    onMouseDown?(e: React.MouseEvent): void;
-    onTouchStart?(e: React.TouchEvent): void;
-    onActivation?(node: HTMLElement): void;
-    onDeactivation?(): void;
+    onMouseDown?: ((e: React.MouseEvent) => void) | undefined;
+    onTouchStart?: ((e: React.TouchEvent) => void) | undefined;
+    onActivation?: ((node: HTMLElement) => void) | undefined;
+    onDeactivation?: (() => void) | undefined;
 }
 export interface CommonProps {
     /**
      * action to perform on Esc key press
      */
-    onEscapeKey?: (event: Event) => void;
+    onEscapeKey?: ((event: Event) => void) | undefined;
     /**
      * action to perform on click outside
      */
-    onClickOutside?: (event: MouseEvent | TouchEvent) => void;
+    onClickOutside?: ((event: MouseEvent | TouchEvent) => void) | undefined;
     /**
      * callback on lock activation
      * @param node the main node
      */
-    onActivation?: (node: HTMLElement) => void;
+    onActivation?: ((node: HTMLElement) => void) | undefined;
     /**
      * callback on lock deactivation
      */
-    onDeactivation?: () => void;
+    onDeactivation?: (() => void) | undefined;
     /**
      * [scroll-lock] control isolation
      * @see {@link https://github.com/theKashey/react-remove-scroll#usage}
      */
-    noIsolation?: boolean;
+    noIsolation?: boolean | undefined;
     /**
      * [scroll-lock] full page inert (event suppression)
      * @default false
      * @see {@link https://github.com/theKashey/react-remove-scroll#usage}
      */
-    inert?: boolean;
+    inert?: boolean | undefined;
     /**
      * [scroll-lock] allows scroll based zoom
      * @default false
      * @see https://github.com/theKashey/react-remove-scroll#usage
      */
-    allowPinchZoom?: boolean;
+    allowPinchZoom?: boolean | undefined;
     /**
      * a list of elements which should be considered as a part of the lock
      */
-    shards?: Array<React.RefObject<any> | HTMLElement>;
+    shards?: (Array<React.RefObject<any> | HTMLElement>) | undefined;
 }
 export interface ReactFocusOnProps extends CommonProps {
     /**
      * The main switch
      */
-    enabled?: boolean;
+    enabled?: boolean | undefined;
     /**
      * Controls scroll lock behavior
      */
-    scrollLock?: boolean;
+    scrollLock?: boolean | undefined;
     /**
      * Controls focus lock behavior
      */
-    focusLock?: boolean;
+    focusLock?: boolean | undefined;
     /**
      * [focus-lock] control autofocus
      * @default true
      */
-    autoFocus?: boolean;
+    autoFocus?: boolean | undefined;
     /**
      * [focus-lock] control returnFocus
      * @default true
      */
-    returnFocus?: ComponentProps<typeof ReactFocusLock>['returnFocus'];
+    returnFocus?: ComponentProps<typeof ReactFocusLock>['returnFocus'] | undefined;
     /**
      * [focus-lock] allows "ignoring" focus on some elements
      * @see {@link https://github.com/theKashey/react-focus-lock#api}
      */
-    shouldIgnore?: (candidate: HTMLElement) => boolean;
+    shouldIgnore?: ((candidate: HTMLElement) => boolean) | undefined;
     /**
      * allows replacement of the host node
      * @default div
      */
-    as?: string | React.ElementType;
-    style?: React.CSSProperties;
-    className?: string;
+    as?: string | React.ElementType | undefined;
+    style?: React.CSSProperties | undefined;
+    className?: string | undefined;
     children: React.ReactNode;
 }
 export interface ReactFocusOnSideProps extends ReactFocusOnProps {
-    sideCar: React.SFC<any>;
+    sideCar: React.FC<any>;
 }
 export interface EffectProps extends CommonProps {
     setLockProps(settings: LockProps): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-focus-on",
-  "version": "3.5.4",
+  "version": "3.6.0",
   "description": "The final solution for WAI ARIA compatible modal dialogs or full-screen tasks.",
   "main": "dist/es5/index.js",
   "scripts": {
@@ -34,7 +34,7 @@
   "author": "Anton Korzunov <thekashey@gmail.com>",
   "license": "MIT",
   "devDependencies": {
-    "@types/react": "^16.8.19",
+    "@types/react": "^18.0.8",
     "conventional-changelog-cli": "^2.0.12",
     "enzyme": "^3.10.0",
     "enzyme-adapter-react-16": "^1.14.0",
@@ -45,12 +45,12 @@
   },
   "dependencies": {
     "aria-hidden": "^1.1.3",
-    "react-focus-lock": "^2.6.0",
-    "react-remove-scroll": "^2.4.1",
-    "react-style-singleton": "^2.1.1",
+    "react-focus-lock": "^2.9.0",
+    "react-remove-scroll": "^2.5.2",
+    "react-style-singleton": "^2.2.0",
     "tslib": "^2.3.1",
-    "use-callback-ref": "^1.2.5",
-    "use-sidecar": "^1.0.5"
+    "use-callback-ref": "^1.3.0",
+    "use-sidecar": "^1.1.2"
   },
   "engines": {
     "node": ">=8.5.0"
@@ -80,7 +80,7 @@
     "isolation"
   ],
   "resolutions": {
-    "typescript": "^3.0.0"
+    "typescript": "^3.8.0"
   },
   "homepage": "https://github.com/theKashey/react-focus-on#readme"
 }

package/sidecar/sidecar.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
 
-declare var sidecar: React.SFC;
+declare var sidecar: React.FC;
 
 export default sidecar;

package/dist/es2015/component.d.ts

@@ -1,2 +0,0 @@
-import { ReactFocusOnSideProps } from "./types";
-export declare function ReactFocusOn(props: ReactFocusOnSideProps): JSX.Element;

package/dist/es2015/component.js

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import { RemoveScroll } from 'react-remove-scroll/UI';
-import ReactFocusLock from 'react-focus-lock/UI';
-var extractRef = function (ref) { return (('current' in ref) ? ref.current : ref); };
-export function ReactFocusOn(props) {
-    var _a = React.useState(null), lockProps = _a[0], setLockProps = _a[1];
-    var _b = this.props, children = _b.children, autoFocus = _b.autoFocus, shards = _b.shards, _c = _b.enabled, enabled = _c === void 0 ? true : _c, _d = _b.scrollLock, scrollLock = _d === void 0 ? true : _d, _e = _b.focusLock, focusLock = _e === void 0 ? true : _e, sideCar = _b.sideCar;
-    return (React.createElement(React.Fragment, null,
-        React.createElement(RemoveScroll, { sideCar: enabled && sideCar, enabled: enabled && scrollLock, shards: shards },
-            enabled && React.createElement(Effect, null),
-            React.createElement(ReactFocusLock, { sideCar: enabled && sideCar, disabled: !(this.state.lockProps && enabled && focusLock), returnFocus: true, autoFocus: autoFocus, onActivation: this.onActivation, onDeactivation: this.onDeactivation, shards: shards, lockProps: lockProps }, children))));
-}

package/dist/es5/component.d.ts

@@ -1,2 +0,0 @@
-import { ReactFocusOnSideProps } from "./types";
-export declare function ReactFocusOn(props: ReactFocusOnSideProps): JSX.Element;

package/dist/es5/component.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var UI_1 = require("react-remove-scroll/UI");
-var UI_2 = require("react-focus-lock/UI");
-var InteractivityDisabler_1 = require("./InteractivityDisabler");
-var extractRef = function (ref) { return (('current' in ref) ? ref.current : ref); };
-function ReactFocusOn(props) {
-    var _a = React.useState(null), lockProps = _a[0], setLockProps = _a[1];
-    var _b = this.props, children = _b.children, autoFocus = _b.autoFocus, shards = _b.shards, _c = _b.enabled, enabled = _c === void 0 ? true : _c, _d = _b.scrollLock, scrollLock = _d === void 0 ? true : _d, _e = _b.focusLock, focusLock = _e === void 0 ? true : _e, sideCar = _b.sideCar;
-    return (React.createElement(React.Fragment, null,
-        React.createElement(UI_1.RemoveScroll, { sideCar: enabled && sideCar, enabled: enabled && scrollLock, shards: shards },
-            enabled && React.createElement(InteractivityDisabler_1.InteractivityDisabler, null),
-            React.createElement(UI_2.default, { sideCar: enabled && sideCar, disabled: !(this.state.lockProps && enabled && focusLock), returnFocus: true, autoFocus: autoFocus, onActivation: this.onActivation, onDeactivation: this.onDeactivation, shards: shards, lockProps: lockProps }, children))));
-}
-exports.ReactFocusOn = ReactFocusOn;