@react-fabric/core 1.0.0-beta.8 → 1.0.1

package/src/core/page/Page.tsx

@@ -1,101 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-import classNames from "classnames";
-import { Loading } from "../../components/animations/Animations";
-import { Icon } from "../../components/icon/Icon";
-import { type ChildrenProp, type IconProps, type TestProps } from "../../types";
-import classes from "./Page.module.css";
-
-export interface PageProps extends IconProps, ChildrenProp, TestProps {
-  /**
-   * page title
-   */
-  title?: string;
-  /**
-   * title element className
-   */
-  titleClassName?: string;
-  /**
-   * paper style drop shadow
-   */
-  paper?: boolean;
-  /**
-   * loading indicator
-   */
-  loading?: boolean;
-}
-
-/**
- * The page component used typically for routes, is a structured layout used within an application to organize and display content in a sectioned format, ensuring a consistent and intuitive user experience.
- */
-export const Page = ({
-  children,
-  paper,
-  title,
-  titleClassName,
-  icon,
-  rtlFlip,
-  iconBg,
-  iconColor,
-  loading,
-  "data-testid": testId,
-  "data-test-value": testValue,
-}: PageProps) => {
-  return (
-    <div
-      data-testid={testId}
-      data-test-value={testValue}
-      data-loading={loading}
-      className={classNames(
-        classes.page,
-        "overflow-hidden grid area-content",
-        paper && "shadow-paper m-[6px] rounded-capped",
-      )}
-    >
-      {title && (
-        <div
-          data-ref="pageTitle"
-          className={classNames(
-            classes.pageTitle,
-            "select-none flex gap-1 items-center justify-center px-1 py-0.5 font-medium text-center",
-            titleClassName,
-          )}
-        >
-          {icon && (
-            <Icon
-              icon={icon}
-              size="1.25em"
-              rtlFlip={rtlFlip}
-              bg={iconBg}
-              color={iconColor}
-            />
-          )}
-          {title}
-        </div>
-      )}
-      {loading && <Loading />}
-      {children}
-    </div>
-  );
-};

package/src/core/responsive/Responsive.module.css

@@ -1,85 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-@layer comp {
-  .row {
-    margin: calc(-0.5 * var(--gutter));
-
-    & + .row {
-      margin-top: calc(0.5 * var(--gutter));
-    }
-  }
-
-  .col {
-    flex: 0 0 auto;
-    max-width: calc((12 / 12) * 100% - var(--gutter, 0px));
-    margin: calc(0.5 * var(--gutter));
-
-    &.stretchContent > * {
-      min-width: 100%;
-      min-height: 100%;
-    }
-  }
-
-  [data-gutter="0"] {
-    &.container,
-    &.row {
-      --gutter: 0px;
-    }
-  }
-
-  [data-gutter="xs"] {
-    &.container,
-    &.row {
-      --gutter: 2px;
-    }
-  }
-
-  [data-gutter="sm"] {
-    &.container,
-    &.row {
-      --gutter: 0.25rem;
-    }
-  }
-
-  [data-gutter="md"] {
-    &.container,
-    &.row {
-      --gutter: 0.75rem;
-    }
-  }
-
-  [data-gutter="lg"] {
-    &.container,
-    &.row {
-      --gutter: 1rem;
-    }
-  }
-
-  [data-gutter="xl"] {
-    &.container,
-    &.row {
-      --gutter: 1.5rem;
-    }
-  }
-}

package/src/core/section/Section.module.css

@@ -1,28 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-@layer comp {
-  .section {
-    grid-template: "head head head" auto "side-s content side-e" 1fr "foot foot foot" auto / auto 1fr auto;
-  }
-}

package/src/core/section/Section.tsx

@@ -1,54 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-import classNames from "classnames";
-import { type ChildrenProp, type CssProp, type RefProp } from "../../types";
-import { ErrorBoundary } from "../boundary/ErrorBoundary";
-import classes from "./Section.module.css";
-
-/**
- * The section component provides a structured layout used within a page to organize and display content in a sectioned format, ensuring a consistent and intuitive user experience.
- */
-export const Section = ({
-  children,
-  className,
-  dir,
-  ref,
-}: ChildrenProp &
-  CssProp &
-  RefProp<HTMLDivElement> & { dir?: "ltr" | "rtl" }) => {
-  return (
-    <div
-      data-ref="section"
-      dir={dir}
-      ref={ref}
-      className={classNames(
-        classes.section,
-        className,
-        "grid area-content overflow-hidden",
-      )}
-    >
-      <ErrorBoundary>{children}</ErrorBoundary>
-    </div>
-  );
-};

package/src/core/theme/Theme.module.css

@@ -1,30 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-@layer comp {
-  .themeProvider {
-    & > * {
-      background-color: theme(backgroundColor.base);
-    }
-  }
-}

package/src/core/viewport/Viewport.module.css

@@ -1,32 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-@layer comp {
-  .viewport {
-    --fabric-viewport: color-mix(in lab, var(--fabric-bg) 76%, var(--tint));
-
-    grid-template: "head head head" auto "crumbbar crumbbar crumbbar" auto "side-s content side-e" 1fr "foot foot foot" auto / auto 1fr auto;
-    color: var(--fabric-text);
-    background-color: var(--fabric-viewport);
-  }
-}

package/src/hooks/useControlledValue.tsx

@@ -1,43 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-import { useDeferredValue, useState } from "react";
-import { useEffectDebugger } from "./useEffectDebugger";
-
-export const useControlledValue = <T extends AnyObject = string>(
-  value: T,
-  defaultValue: T,
-) => {
-  const [currentValue, updateValue] = useState<T>(defaultValue);
-  const deferred = useDeferredValue(value);
-
-  useEffectDebugger(
-    () => {
-      updateValue(deferred ?? defaultValue);
-    },
-    [deferred],
-    "useControlledValue change",
-  );
-
-  return { currentValue, updateValue };
-};

package/src/hotkeys/HotKey.tsx

@@ -1,39 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-import { useEffectDebugger } from "../hooks/useEffectDebugger";
-import { useHotKeys } from "./HotKeyWrapper";
-import { type HotKeyProps } from "./commons";
-
-export const HotKey = ({ keyCombo, global, handler }: HotKeyProps) => {
-  const { addHotKey, removeHotKey } = useHotKeys();
-  useEffectDebugger(
-    () => {
-      addHotKey?.(keyCombo, handler ?? (() => undefined), global);
-      return () => removeHotKey?.(keyCombo);
-    },
-    [addHotKey, global, handler, keyCombo, removeHotKey],
-    "HotKey add",
-  );
-  return null;
-};

package/src/hotkeys/HotKeyLabel.tsx

@@ -1,61 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-import { useMemoDebugger } from "../hooks/useEffectDebugger";
-import { reduceHotKey, type HotKeyProps } from "./commons";
-
-export const HotKeyLabel = ({
-  keyCombo,
-}: Omit<HotKeyProps, "global" | "handler">) => {
-  const label = useMemoDebugger(
-    () => {
-      const item = reduceHotKey({ keyCombo });
-
-      const label = [];
-      if (item.alt) label.push("ALT");
-      if (item.ctrl) label.push("CTRL");
-      if (item.meta) label.push("META");
-      if (item.shift) label.push("SHIFT");
-      if (item.key.toLowerCase() === "tab") label.push("TAB");
-      else if (item.key.toLowerCase() === "space") label.push("SPC");
-      else if (item.key.toLowerCase() === "arrowleft") label.push("LEFT");
-      else if (item.key.toLowerCase() === "arrowright") label.push("RIGHT");
-      else if (item.key.toLowerCase() === "arrowup") label.push("UP");
-      else if (item.key.toLowerCase() === "arrowdown") label.push("DOWN");
-      else if (item.key.toLowerCase() === "enter") label.push("ENTER");
-      else if (item.key.toLowerCase() === "delete") label.push("DEL");
-      else if (item.key.toLowerCase() === "escape") label.push("ESC");
-      else if (item.key.toLowerCase() === "backspace") label.push("BKSPC");
-      else label.push(item.key.toUpperCase());
-      return [<span key="label">{label.join(" ")}</span>];
-    },
-    [keyCombo],
-    "HotKey label",
-  );
-
-  return (
-    <kbd className="hotkey-label inline-flex gap-1 select-none self-center font-mono items-center text-[0.625rem] leading-4 bg-tint-500/10 text-base/50 whitespace-nowrap rounded px-2 mx-1">
-      {label}
-    </kbd>
-  );
-};

package/src/hotkeys/HotKeyWrapper.tsx

@@ -1,137 +0,0 @@
-/*
- * React Fabric
- * @version: 1.0.0
- *
- *
- * The MIT License (MIT)
- * Copyright (c) 2024 Adarsh Pastakia
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
- * and associated documentation files (the "Software"), to deal in the Software without restriction,
- * including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
- * and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
- * subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all copies or substantial
- * portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED
- * TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
- * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
- * TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-import {
-  createContext,
-  memo,
-  useCallback,
-  useContext,
-  useRef,
-  type FC,
-  type PropsWithChildren,
-} from "react";
-import { useEffectDebugger } from "../hooks/useEffectDebugger";
-import { reduceHotKey } from "./commons";
-
-/** @internal */
-export const HotKeysContext = createContext<{
-  addHotKey: (key: string, handler: () => void, global?: boolean) => void;
-  removeHotKey: (key: string) => void;
-}>({} as AnyObject);
-
-export const useHotKeys = () => useContext(HotKeysContext);
-
-export const HotKeyWrapper: FC<PropsWithChildren> = memo(
-  ({ children }: PropsWithChildren) => {
-    const refEl = useRef<HTMLDivElement>(null);
-    const keyList = useRef<KeyValue[]>([]);
-
-    const addHotKey = useCallback(
-      (keyCombo: string, handler: () => void, global = false) =>
-        (keyList.current = [
-          ...keyList.current.filter(({ _key }) => _key !== keyCombo),
-          reduceHotKey({ keyCombo, handler, global }),
-        ]),
-      [],
-    );
-    const removeHotKey = useCallback(
-      (key: string) =>
-        (keyList.current = [
-          ...keyList.current.filter(({ _key }) => _key !== key),
-        ]),
-      [],
-    );
-
-    const handler = useCallback((items: KeyValue[], event: KeyboardEvent) => {
-      if (items.length === 0) return;
-      const { key: keyCode, code, altKey, ctrlKey, metaKey, shiftKey } = event;
-      if (
-        keyCode !== "Enter" &&
-        keyCode !== "Esc" &&
-        ["INPUT", "TEXTAREA", "SELECT"].includes(
-          (event.target as HTMLElement).tagName,
-        )
-      )
-        return;
-      const find = items.find(
-        ({ key, alt, ctrl, meta, shift }: KeyValue) =>
-          (key.toLowerCase() === keyCode.toLowerCase() ||
-            key.toLowerCase() === code.toLowerCase()) &&
-          alt === altKey &&
-          ctrl === ctrlKey &&
-          meta === metaKey &&
-          shift === shiftKey,
-      );
-      if (find?.handler) {
-        find.handler();
-        event.preventDefault();
-        event.stopImmediatePropagation();
-      }
-    }, []);
-
-    const handleGlobal = useCallback(
-      (event: KeyboardEvent) => {
-        handler(
-          keyList.current.filter((i) => i.global),
-          event,
-        );
-      },
-      [handler],
-    );
-    const handleHotKey = useCallback(
-      (event: KeyboardEvent) => {
-        handler(
-          keyList.current.filter((i) => !i.global),
-          event,
-        );
-      },
-      [handler],
-    );
-
-    useEffectDebugger(
-      () => {
-        const el: HTMLElement | null | undefined = refEl.current?.parentElement;
-        if (el) {
-          el.tabIndex = 0;
-          el.addEventListener("keydown", handleHotKey);
-          document.addEventListener("keydown", handleGlobal);
-          return () => {
-            el.removeEventListener("keydown", handleHotKey);
-            document.removeEventListener("keydown", handleGlobal);
-          };
-        }
-      },
-      [handleGlobal, handleHotKey],
-      "HotKeyWrapper attach handlers",
-    );
-
-    return (
-      <HotKeysContext.Provider value={{ addHotKey, removeHotKey }}>
-        <div ref={refEl} style={{ display: "contents" }}>
-          {children}
-        </div>
-      </HotKeysContext.Provider>
-    );
-  },
-);
-HotKeyWrapper.displayName = "HotKeyProvider";