@cloudscape-design/components 3.0.423 → 3.0.425

package/app-layout/utils/use-drawer-focus-control.js

@@ -1,70 +0,0 @@
-// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
-// SPDX-License-Identifier: Apache-2.0
-import { useEffect, useRef, useCallback } from 'react';
-export function useDrawerFocusControl(dependencies, isOpen, restoreFocus = false) {
-    const refs = {
-        toggle: useRef(null),
-        close: useRef(null),
-        slider: useRef(null),
-    };
-    const previousFocusedElement = useRef();
-    const shouldFocus = useRef(false);
-    const lastInteraction = useRef(null);
-    useEffect(() => {
-        var _a, _b, _c, _d;
-        switch ((_a = lastInteraction.current) === null || _a === void 0 ? void 0 : _a.type) {
-            case 'open':
-                if (refs.slider.current) {
-                    (_b = refs.slider.current) === null || _b === void 0 ? void 0 : _b.focus();
-                }
-                else {
-                    (_c = refs.close.current) === null || _c === void 0 ? void 0 : _c.focus();
-                }
-                break;
-            case 'close':
-                (_d = refs.toggle.current) === null || _d === void 0 ? void 0 : _d.focus();
-                break;
-        }
-        lastInteraction.current = null;
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, dependencies);
-    const doFocus = () => {
-        var _a, _b;
-        if (!shouldFocus.current) {
-            return;
-        }
-        if (isOpen) {
-            previousFocusedElement.current =
-                document.activeElement !== document.body ? document.activeElement : undefined;
-            (_a = refs.close.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-        else {
-            if (restoreFocus && previousFocusedElement.current && document.contains(previousFocusedElement.current)) {
-                previousFocusedElement.current.focus();
-                previousFocusedElement.current = undefined;
-            }
-            else {
-                (_b = refs.toggle.current) === null || _b === void 0 ? void 0 : _b.focus();
-            }
-        }
-        shouldFocus.current = false;
-    };
-    // We explictly want this effect to run when only `isOpen` changes
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(doFocus, [isOpen]);
-    const loseFocus = useCallback(() => {
-        previousFocusedElement.current = undefined;
-    }, []);
-    return {
-        refs,
-        setFocus: force => {
-            shouldFocus.current = true;
-            if (force && isOpen) {
-                doFocus();
-            }
-        },
-        loseFocus,
-        setLastInteraction: (interaction) => (lastInteraction.current = interaction),
-    };
-}
-//# sourceMappingURL=use-drawer-focus-control.js.map

package/app-layout/utils/use-drawer-focus-control.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-drawer-focus-control.js","sourceRoot":"lib/default/","sources":["app-layout/utils/use-drawer-focus-control.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAA6B,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAkBlF,MAAM,UAAU,qBAAqB,CACnC,YAA4B,EAC5B,MAAe,EACf,YAAY,GAAG,KAAK;IAEpB,MAAM,IAAI,GAAG;QACX,MAAM,EAAE,MAAM,CAAkB,IAAI,CAAC;QACrC,KAAK,EAAE,MAAM,CAAkB,IAAI,CAAC;QACpC,MAAM,EAAE,MAAM,CAAiB,IAAI,CAAC;KACrC,CAAC;IACF,MAAM,sBAAsB,GAAG,MAAM,EAAe,CAAC;IACrD,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAClC,MAAM,eAAe,GAAG,MAAM,CAA+B,IAAI,CAAC,CAAC;IAEnE,SAAS,CAAC,GAAG,EAAE;;QACb,QAAQ,MAAA,eAAe,CAAC,OAAO,0CAAE,IAAI,EAAE;YACrC,KAAK,MAAM;gBACT,IAAI,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE;oBACvB,MAAA,IAAI,CAAC,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;iBAC9B;qBAAM;oBACL,MAAA,IAAI,CAAC,KAAK,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;iBAC7B;gBACD,MAAM;YACR,KAAK,OAAO;gBACV,MAAA,IAAI,CAAC,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;gBAC7B,MAAM;SACT;QACD,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;QAC/B,uDAAuD;IACzD,CAAC,EAAE,YAAY,CAAC,CAAC;IAEjB,MAAM,OAAO,GAAG,GAAG,EAAE;;QACnB,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE;YACxB,OAAO;SACR;QACD,IAAI,MAAM,EAAE;YACV,sBAAsB,CAAC,OAAO;gBAC5B,QAAQ,CAAC,aAAa,KAAK,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAE,QAAQ,CAAC,aAA6B,CAAC,CAAC,CAAC,SAAS,CAAC;YACjG,MAAA,IAAI,CAAC,KAAK,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;SAC7B;aAAM;YACL,IAAI,YAAY,IAAI,sBAAsB,CAAC,OAAO,IAAI,QAAQ,CAAC,QAAQ,CAAC,sBAAsB,CAAC,OAAO,CAAC,EAAE;gBACvG,sBAAsB,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;gBACvC,sBAAsB,CAAC,OAAO,GAAG,SAAS,CAAC;aAC5C;iBAAM;gBACL,MAAA,IAAI,CAAC,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;aAC9B;SACF;QACD,WAAW,CAAC,OAAO,GAAG,KAAK,CAAC;IAC9B,CAAC,CAAC;IAEF,kEAAkE;IAClE,uDAAuD;IACvD,SAAS,CAAC,OAAO,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAE7B,MAAM,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE;QACjC,sBAAsB,CAAC,OAAO,GAAG,SAAS,CAAC;IAC7C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,IAAI;QACJ,QAAQ,EAAE,KAAK,CAAC,EAAE;YAChB,WAAW,CAAC,OAAO,GAAG,IAAI,CAAC;YAC3B,IAAI,KAAK,IAAI,MAAM,EAAE;gBACnB,OAAO,EAAE,CAAC;aACX;QACH,CAAC;QACD,SAAS;QACT,kBAAkB,EAAE,CAAC,WAAkC,EAAE,EAAE,CAAC,CAAC,eAAe,CAAC,OAAO,GAAG,WAAW,CAAC;KACpG,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DependencyList, RefObject, useEffect, useRef, useCallback } from 'react';\nimport { ButtonProps } from '../../button/interfaces';\n\nexport type DrawerLastInteraction = { type: 'open' } | { type: 'close' };\n\nexport interface DrawerFocusControlRefs {\n  toggle: RefObject<ButtonProps.Ref>;\n  close: RefObject<ButtonProps.Ref>;\n  slider: RefObject<HTMLDivElement>;\n}\n\ninterface FocusControlState {\n  refs: DrawerFocusControlRefs;\n  setFocus: (force?: boolean) => void;\n  loseFocus: () => void;\n  setLastInteraction: (interaction: DrawerLastInteraction) => void;\n}\n\nexport function useDrawerFocusControl(\n  dependencies: DependencyList,\n  isOpen: boolean,\n  restoreFocus = false\n): FocusControlState {\n  const refs = {\n    toggle: useRef<ButtonProps.Ref>(null),\n    close: useRef<ButtonProps.Ref>(null),\n    slider: useRef<HTMLDivElement>(null),\n  };\n  const previousFocusedElement = useRef<HTMLElement>();\n  const shouldFocus = useRef(false);\n  const lastInteraction = useRef<DrawerLastInteraction | null>(null);\n\n  useEffect(() => {\n    switch (lastInteraction.current?.type) {\n      case 'open':\n        if (refs.slider.current) {\n          refs.slider.current?.focus();\n        } else {\n          refs.close.current?.focus();\n        }\n        break;\n      case 'close':\n        refs.toggle.current?.focus();\n        break;\n    }\n    lastInteraction.current = null;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, dependencies);\n\n  const doFocus = () => {\n    if (!shouldFocus.current) {\n      return;\n    }\n    if (isOpen) {\n      previousFocusedElement.current =\n        document.activeElement !== document.body ? (document.activeElement as HTMLElement) : undefined;\n      refs.close.current?.focus();\n    } else {\n      if (restoreFocus && previousFocusedElement.current && document.contains(previousFocusedElement.current)) {\n        previousFocusedElement.current.focus();\n        previousFocusedElement.current = undefined;\n      } else {\n        refs.toggle.current?.focus();\n      }\n    }\n    shouldFocus.current = false;\n  };\n\n  // We explictly want this effect to run when only `isOpen` changes\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(doFocus, [isOpen]);\n\n  const loseFocus = useCallback(() => {\n    previousFocusedElement.current = undefined;\n  }, []);\n\n  return {\n    refs,\n    setFocus: force => {\n      shouldFocus.current = true;\n      if (force && isOpen) {\n        doFocus();\n      }\n    },\n    loseFocus,\n    setLastInteraction: (interaction: DrawerLastInteraction) => (lastInteraction.current = interaction),\n  };\n}\n"]}