@noya-app/noya-designsystem 0.1.2 → 0.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@noya-app/noya-designsystem",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
@@ -13,7 +13,7 @@
     "@dnd-kit/core": "3.1.1",
     "@dnd-kit/modifiers": "3.0.0",
     "@dnd-kit/sortable": "4.0.0",
-    "@noya-app/noya-colorpicker": "0.1.1",
+    "@noya-app/noya-colorpicker": "0.1.2",
     "@noya-app/noya-utils": "0.1.0",
     "@noya-app/noya-geometry": "0.1.0",
     "@noya-app/noya-icons": "0.1.0",
@@ -36,7 +36,6 @@
     "@radix-ui/react-utils": "^0.0.5",
     "immer": "9.0.5",
     "kiwi.js": "^1.1.3",
-    "react-use-gesture": "9.1.3",
     "react-virtualized": "^9.22.3",
     "react-window": "^1.8.8",
     "styled-components": "5.3.0",

package/src/components/ListView.tsx

@@ -24,7 +24,6 @@ import { ListChildComponentProps, VariableSizeList } from "react-window";
 import styled from "styled-components";
 import { mergeEventHandlers } from "../hooks/mergeEventHandlers";
 import { useHover } from "../hooks/useHover";
-import { isLeftButtonClicked } from "../utils/mouseEvent";
 import { ContextMenu } from "./ContextMenu";
 import { InputField } from "./InputField";
 import { MenuItem } from "./internal/Menu";
@@ -386,7 +385,8 @@ const ListViewRow = forwardRef(function ListViewRow<
       // won't close (onPointerDownOutside won't fire).
       event.preventDefault();
 
-      if (!isLeftButtonClicked(event)) return;
+      // We only want to handle left clicks
+      if (event.button !== 0) return;
 
       onPress?.(event);
     },

package/src/hooks/__tests__/mergeEventHandlers.test.ts

@@ -1,9 +1,15 @@
 import { expect, test } from "bun:test";
-import { ReactEventHandlers } from "react-use-gesture/dist/types";
-import { mergeEventHandlers } from "../..";
+import { mergeEventHandlers } from "../mergeEventHandlers";
 
 const event = { defaultPrevented: false };
 
+type ReactEventHandlers = {
+  onClick?: React.MouseEventHandler;
+  onMouseDown?: React.MouseEventHandler;
+  onMouseMove?: React.MouseEventHandler;
+  onMouseUp?: React.MouseEventHandler;
+};
+
 test("merges handlers", () => {
   const out: [number, any][] = [];
 

package/src/hooks/mergeEventHandlers.ts

@@ -1,46 +1,19 @@
-import { KeyMap } from '@noya-app/noya-keymap';
-import { unique } from '@noya-app/noya-utils';
-import { composeEventHandlers } from '@radix-ui/primitive';
-import { useGesture } from 'react-use-gesture';
-import { RegularMenuItem } from '../components/internal/Menu';
-import { Optional } from '../utils/createSectionedMenu';
+import { unique } from "@noya-app/noya-utils";
+import { composeEventHandlers } from "@radix-ui/primitive";
 
 function composeAllEventHandlers<E>(...handlers: ((e: E) => void)[]) {
   const [first, ...rest] = handlers;
 
   return rest.reduce(
     (result, handler) => composeEventHandlers(result, handler),
-    first,
+    first
   );
 }
 
-export type ReactDOMEventHandlers = ReturnType<
-  ReturnType<typeof useGesture>
-> & {
-  onKeyDown?: (e: React.KeyboardEvent) => void;
-  onKeyDownCapture?: (e: React.KeyboardEvent) => void;
-  onKeyUp?: (e: React.KeyboardEvent) => void;
-  onKeyUpCapture?: (e: React.KeyboardEvent) => void;
-  onKeyPress?: (e: React.KeyboardEvent) => void;
-  onKeyPressCapture?: (e: React.KeyboardEvent) => void;
-
-  // Special
-  onBeforeInput?: (e: InputEvent) => void;
-};
-
-export type ReactEventHandlers<MenuItemType extends string = string> =
-  ReactDOMEventHandlers & {
-    onContributeMenuItems?: () => Optional<RegularMenuItem<MenuItemType>>[];
-    keyboardShortcuts?: KeyMap;
-    onSelectMenuItem?: (id: string) => void;
-  };
-
-export type EventName = keyof ReactEventHandlers;
-
-export function mergeEventHandlers(
-  ...handlerMaps: ReactEventHandlers[]
-): ReactEventHandlers {
-  const eventNames = unique(handlerMaps.map(Object.keys).flat() as EventName[]);
+export function mergeEventHandlers<
+  H extends Record<string, (...args: any[]) => any>,
+>(...handlerMaps: H[]): H {
+  const eventNames = unique(handlerMaps.map(Object.keys).flat() as (keyof H)[]);
 
   return Object.fromEntries(
     eventNames.map((eventName) => {
@@ -49,7 +22,7 @@ export function mergeEventHandlers(
         return value ? [value] : [];
       });
 
-      return [eventName, composeAllEventHandlers(...handlers)];
-    }),
-  );
+      return [eventName, composeAllEventHandlers(...handlers)] as const;
+    })
+  ) as H;
 }

package/src/index.tsx

@@ -61,7 +61,6 @@ export * from "./contexts/ImageDataContext";
 // Contexts
 export * from "./contexts/GlobalInputBlurContext";
 // Hooks
-export * from "./hooks/mergeEventHandlers";
 export * from "./hooks/useHover";
 export * from "./hooks/usePlatform";
 export * from "./mediaQuery";
@@ -70,7 +69,6 @@ export * as darkTheme from "./theme/dark";
 export * as lightTheme from "./theme/light";
 export * from "./utils/createSectionedMenu";
 export * from "./utils/getGradientBackground";
-export * from "./utils/mouseEvent";
 // Utils
 export * from "./utils/completions";
 export * from "./utils/fuzzyScorer";

package/src/utils/mouseEvent.ts

@@ -1,7 +0,0 @@
-export function isLeftButtonClicked(event: React.MouseEvent) {
-  return event.button === 0;
-}
-
-export function isRightButtonClicked(event: React.MouseEvent) {
-  return event.button === 2;
-}