react-resizable-panels 2.1.9 → 3.0.0

package/dist/declarations/src/Panel.d.ts

@@ -51,20 +51,20 @@ export declare function PanelWithForwardedRef({ children, className: classNameFr
 export declare namespace PanelWithForwardedRef {
     var displayName: string;
 }
-export declare const Panel: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLObjectElement | HTMLElement | HTMLSlotElement | HTMLStyleElement | HTMLTitleElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableCaptionElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDivElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLInputElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLLinkElement | HTMLMapElement | HTMLMenuElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLPictureElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement>, "id" | "onResize"> & {
-    className?: string | undefined;
+export declare const Panel: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLObjectElement | HTMLElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableCaptionElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDivElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLInputElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLLinkElement | HTMLMapElement | HTMLMenuElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLPictureElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSlotElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement>, "id" | "onResize"> & {
+    className?: string;
     collapsedSize?: number | undefined;
     collapsible?: boolean | undefined;
     defaultSize?: number | undefined;
-    id?: string | undefined;
+    id?: string;
     maxSize?: number | undefined;
     minSize?: number | undefined;
-    onCollapse?: PanelOnCollapse | undefined;
-    onExpand?: PanelOnExpand | undefined;
-    onResize?: PanelOnResize | undefined;
-    order?: number | undefined;
-    style?: object | undefined;
+    onCollapse?: PanelOnCollapse;
+    onExpand?: PanelOnExpand;
+    onResize?: PanelOnResize;
+    order?: number;
+    style?: object;
     tagName?: keyof HTMLElementTagNameMap | undefined;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<ImperativePanelHandle>>;

package/dist/declarations/src/PanelGroup.d.ts

@@ -23,16 +23,16 @@ export type PanelGroupProps = Omit<HTMLAttributes<keyof HTMLElementTagNameMap>,
     dir?: "auto" | "ltr" | "rtl" | undefined;
 }>;
 export declare const PanelGroup: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<keyof HTMLElementTagNameMap>, "id"> & {
-    autoSaveId?: string | null | undefined;
-    className?: string | undefined;
+    autoSaveId?: string | null;
+    className?: string;
     direction: Direction;
-    id?: string | null | undefined;
-    keyboardResizeBy?: number | null | undefined;
-    onLayout?: PanelGroupOnLayout | null | undefined;
-    storage?: PanelGroupStorage | undefined;
-    style?: CSSProperties | undefined;
-    tagName?: keyof HTMLElementTagNameMap | undefined;
+    id?: string | null;
+    keyboardResizeBy?: number | null;
+    onLayout?: PanelGroupOnLayout | null;
+    storage?: PanelGroupStorage;
+    style?: CSSProperties;
+    tagName?: keyof HTMLElementTagNameMap;
     dir?: "auto" | "ltr" | "rtl" | undefined;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<ImperativePanelGroupHandle>>;

package/dist/declarations/src/hooks/usePanelGroupContext.d.ts

@@ -0,0 +1,4 @@
+export declare function usePanelGroupContext(): {
+    direction: "horizontal" | "vertical" | undefined;
+    groupId: string | undefined;
+};

package/dist/declarations/src/index.d.ts

@@ -2,6 +2,7 @@ import { Panel } from "./Panel.js";
 import { PanelGroup } from "./PanelGroup.js";
 import { PanelResizeHandle } from "./PanelResizeHandle.js";
 import { DATA_ATTRIBUTES } from "./constants.js";
+import { usePanelGroupContext } from "./hooks/usePanelGroupContext.js";
 import { assert } from "./utils/assert.js";
 import { setNonce } from "./utils/csp.js";
 import { disableGlobalCursorStyles, enableGlobalCursorStyles } from "./utils/cursor.js";
@@ -18,4 +19,4 @@ import type { ImperativePanelHandle, PanelOnCollapse, PanelOnExpand, PanelOnResi
 import type { ImperativePanelGroupHandle, PanelGroupOnLayout, PanelGroupProps, PanelGroupStorage } from "./PanelGroup.js";
 import type { PanelResizeHandleOnDragging, PanelResizeHandleProps } from "./PanelResizeHandle.js";
 import type { PointerHitAreaMargins } from "./PanelResizeHandleRegistry.js";
-export { ImperativePanelGroupHandle, ImperativePanelHandle, PanelGroupOnLayout, PanelGroupProps, PanelGroupStorage, PanelOnCollapse, PanelOnExpand, PanelOnResize, PanelProps, PanelResizeHandleOnDragging, PanelResizeHandleProps, PointerHitAreaMargins, Panel, PanelGroup, PanelResizeHandle, assert, getIntersectingRectangle, intersects, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, enableGlobalCursorStyles, disableGlobalCursorStyles, setNonce, DATA_ATTRIBUTES, };
+export { ImperativePanelGroupHandle, ImperativePanelHandle, PanelGroupOnLayout, PanelGroupProps, PanelGroupStorage, PanelOnCollapse, PanelOnExpand, PanelOnResize, PanelProps, PanelResizeHandleOnDragging, PanelResizeHandleProps, PointerHitAreaMargins, Panel, PanelGroup, PanelResizeHandle, usePanelGroupContext, assert, getIntersectingRectangle, intersects, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, enableGlobalCursorStyles, disableGlobalCursorStyles, setNonce, DATA_ATTRIBUTES, };

package/dist/{react-resizable-panels.browser.development.esm.js → react-resizable-panels.browser.development.js}

@@ -683,8 +683,13 @@ function updateListeners() {
         }
       });
     }
-    window.addEventListener("pointerup", handlePointerUp, options);
-    window.addEventListener("pointercancel", handlePointerUp, options);
+    ownerDocumentCounts.forEach((_, ownerDocument) => {
+      const {
+        body
+      } = ownerDocument;
+      body.addEventListener("pointerup", handlePointerUp, options);
+      body.addEventListener("pointercancel", handlePointerUp, options);
+    });
   } else {
     ownerDocumentCounts.forEach((count, ownerDocument) => {
       const {
@@ -2518,6 +2523,14 @@ function PanelResizeHandle({
 }
 PanelResizeHandle.displayName = "PanelResizeHandle";
 
+function usePanelGroupContext() {
+  const context = useContext(PanelGroupContext);
+  return {
+    direction: context === null || context === void 0 ? void 0 : context.direction,
+    groupId: context === null || context === void 0 ? void 0 : context.groupId
+  };
+}
+
 function getPanelElement(id, scope = document) {
   const element = scope.querySelector(`[data-panel-id="${id}"]`);
   if (element) {
@@ -2547,4 +2560,4 @@ function getIntersectingRectangle(rectOne, rectTwo, strict) {
   };
 }
 
-export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce };
+export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce, usePanelGroupContext };

package/dist/{react-resizable-panels.browser.esm.js → react-resizable-panels.browser.js}

@@ -677,8 +677,13 @@ function updateListeners() {
         }
       });
     }
-    window.addEventListener("pointerup", handlePointerUp, options);
-    window.addEventListener("pointercancel", handlePointerUp, options);
+    ownerDocumentCounts.forEach((_, ownerDocument) => {
+      const {
+        body
+      } = ownerDocument;
+      body.addEventListener("pointerup", handlePointerUp, options);
+      body.addEventListener("pointercancel", handlePointerUp, options);
+    });
   } else {
     ownerDocumentCounts.forEach((count, ownerDocument) => {
       const {
@@ -2412,6 +2417,14 @@ function PanelResizeHandle({
 }
 PanelResizeHandle.displayName = "PanelResizeHandle";
 
+function usePanelGroupContext() {
+  const context = useContext(PanelGroupContext);
+  return {
+    direction: context === null || context === void 0 ? void 0 : context.direction,
+    groupId: context === null || context === void 0 ? void 0 : context.groupId
+  };
+}
+
 function getPanelElement(id, scope = document) {
   const element = scope.querySelector(`[data-panel-id="${id}"]`);
   if (element) {
@@ -2441,4 +2454,4 @@ function getIntersectingRectangle(rectOne, rectTwo, strict) {
   };
 }
 
-export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce };
+export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce, usePanelGroupContext };

package/dist/react-resizable-panels.d.ts

@@ -0,0 +1,2 @@
+export * from "./declarations/src/index.js";
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVhY3QtcmVzaXphYmxlLXBhbmVscy5kLnRzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi9kZWNsYXJhdGlvbnMvc3JjL2luZGV4LmQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEifQ==

package/dist/{react-resizable-panels.development.esm.js → react-resizable-panels.development.js}

@@ -690,8 +690,13 @@ function updateListeners() {
         }
       });
     }
-    window.addEventListener("pointerup", handlePointerUp, options);
-    window.addEventListener("pointercancel", handlePointerUp, options);
+    ownerDocumentCounts.forEach((_, ownerDocument) => {
+      const {
+        body
+      } = ownerDocument;
+      body.addEventListener("pointerup", handlePointerUp, options);
+      body.addEventListener("pointercancel", handlePointerUp, options);
+    });
   } else {
     ownerDocumentCounts.forEach((count, ownerDocument) => {
       const {
@@ -2525,6 +2530,14 @@ function PanelResizeHandle({
 }
 PanelResizeHandle.displayName = "PanelResizeHandle";
 
+function usePanelGroupContext() {
+  const context = useContext(PanelGroupContext);
+  return {
+    direction: context === null || context === void 0 ? void 0 : context.direction,
+    groupId: context === null || context === void 0 ? void 0 : context.groupId
+  };
+}
+
 function getPanelElement(id, scope = document) {
   const element = scope.querySelector(`[data-panel-id="${id}"]`);
   if (element) {
@@ -2554,4 +2567,4 @@ function getIntersectingRectangle(rectOne, rectTwo, strict) {
   };
 }
 
-export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce };
+export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce, usePanelGroupContext };

package/dist/{react-resizable-panels.development.node.esm.js → react-resizable-panels.development.node.js}

@@ -653,8 +653,13 @@ function updateListeners() {
         }
       });
     }
-    window.addEventListener("pointerup", handlePointerUp, options);
-    window.addEventListener("pointercancel", handlePointerUp, options);
+    ownerDocumentCounts.forEach((_, ownerDocument) => {
+      const {
+        body
+      } = ownerDocument;
+      body.addEventListener("pointerup", handlePointerUp, options);
+      body.addEventListener("pointercancel", handlePointerUp, options);
+    });
   } else {
     ownerDocumentCounts.forEach((count, ownerDocument) => {
       const {
@@ -2291,6 +2296,14 @@ function PanelResizeHandle({
 }
 PanelResizeHandle.displayName = "PanelResizeHandle";
 
+function usePanelGroupContext() {
+  const context = useContext(PanelGroupContext);
+  return {
+    direction: context === null || context === void 0 ? void 0 : context.direction,
+    groupId: context === null || context === void 0 ? void 0 : context.groupId
+  };
+}
+
 function getPanelElement(id, scope = document) {
   const element = scope.querySelector(`[data-panel-id="${id}"]`);
   if (element) {
@@ -2320,4 +2333,4 @@ function getIntersectingRectangle(rectOne, rectTwo, strict) {
   };
 }
 
-export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce };
+export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce, usePanelGroupContext };

package/dist/{react-resizable-panels.esm.js → react-resizable-panels.js}

@@ -679,8 +679,13 @@ function updateListeners() {
         }
       });
     }
-    window.addEventListener("pointerup", handlePointerUp, options);
-    window.addEventListener("pointercancel", handlePointerUp, options);
+    ownerDocumentCounts.forEach((_, ownerDocument) => {
+      const {
+        body
+      } = ownerDocument;
+      body.addEventListener("pointerup", handlePointerUp, options);
+      body.addEventListener("pointercancel", handlePointerUp, options);
+    });
   } else {
     ownerDocumentCounts.forEach((count, ownerDocument) => {
       const {
@@ -2414,6 +2419,14 @@ function PanelResizeHandle({
 }
 PanelResizeHandle.displayName = "PanelResizeHandle";
 
+function usePanelGroupContext() {
+  const context = useContext(PanelGroupContext);
+  return {
+    direction: context === null || context === void 0 ? void 0 : context.direction,
+    groupId: context === null || context === void 0 ? void 0 : context.groupId
+  };
+}
+
 function getPanelElement(id, scope = document) {
   const element = scope.querySelector(`[data-panel-id="${id}"]`);
   if (element) {
@@ -2443,4 +2456,4 @@ function getIntersectingRectangle(rectOne, rectTwo, strict) {
   };
 }
 
-export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce };
+export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce, usePanelGroupContext };

package/dist/{react-resizable-panels.node.esm.js → react-resizable-panels.node.js}

@@ -642,8 +642,13 @@ function updateListeners() {
         }
       });
     }
-    window.addEventListener("pointerup", handlePointerUp, options);
-    window.addEventListener("pointercancel", handlePointerUp, options);
+    ownerDocumentCounts.forEach((_, ownerDocument) => {
+      const {
+        body
+      } = ownerDocument;
+      body.addEventListener("pointerup", handlePointerUp, options);
+      body.addEventListener("pointercancel", handlePointerUp, options);
+    });
   } else {
     ownerDocumentCounts.forEach((count, ownerDocument) => {
       const {
@@ -2190,6 +2195,14 @@ function PanelResizeHandle({
 }
 PanelResizeHandle.displayName = "PanelResizeHandle";
 
+function usePanelGroupContext() {
+  const context = useContext(PanelGroupContext);
+  return {
+    direction: context === null || context === void 0 ? void 0 : context.direction,
+    groupId: context === null || context === void 0 ? void 0 : context.groupId
+  };
+}
+
 function getPanelElement(id, scope = document) {
   const element = scope.querySelector(`[data-panel-id="${id}"]`);
   if (element) {
@@ -2219,4 +2232,4 @@ function getIntersectingRectangle(rectOne, rectTwo, strict) {
   };
 }
 
-export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce };
+export { DATA_ATTRIBUTES, Panel, PanelGroup, PanelResizeHandle, assert, disableGlobalCursorStyles, enableGlobalCursorStyles, getIntersectingRectangle, getPanelElement, getPanelElementsForGroup, getPanelGroupElement, getResizeHandleElement, getResizeHandleElementIndex, getResizeHandleElementsForGroup, getResizeHandlePanelIds, intersects, setNonce, usePanelGroupContext };

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "react-resizable-panels",
-  "version": "2.1.9",
+  "version": "3.0.0",
+  "type": "module",
   "description": "React components for resizable panel groups/layouts",
   "author": "Brian Vaughn <brian.david.vaughn@gmail.com>",
   "license": "MIT",
@@ -9,8 +10,6 @@
     "url": "git+https://github.com/bvaughn/react-resizable-panels.git"
   },
   "source": "src/index.ts",
-  "main": "dist/react-resizable-panels.cjs.js",
-  "module": "dist/react-resizable-panels.esm.js",
   "files": [
     "dist",
     "package.json",
@@ -19,38 +18,15 @@
   ],
   "exports": {
     ".": {
-      "types": {
-        "import": "./dist/react-resizable-panels.cjs.mjs",
-        "default": "./dist/react-resizable-panels.cjs.js"
-      },
+      "types": "./dist/react-resizable-panels.js",
       "development": {
-        "browser": {
-          "module": "./dist/react-resizable-panels.browser.development.esm.js",
-          "import": "./dist/react-resizable-panels.browser.development.cjs.mjs",
-          "default": "./dist/react-resizable-panels.browser.development.cjs.js"
-        },
-        "node": {
-          "module": "./dist/react-resizable-panels.development.node.esm.js",
-          "import": "./dist/react-resizable-panels.development.node.cjs.mjs",
-          "default": "./dist/react-resizable-panels.development.node.cjs.js"
-        },
-        "module": "./dist/react-resizable-panels.development.esm.js",
-        "import": "./dist/react-resizable-panels.development.cjs.mjs",
-        "default": "./dist/react-resizable-panels.development.cjs.js"
-      },
-      "browser": {
-        "module": "./dist/react-resizable-panels.browser.esm.js",
-        "import": "./dist/react-resizable-panels.browser.cjs.mjs",
-        "default": "./dist/react-resizable-panels.browser.cjs.js"
-      },
-      "node": {
-        "module": "./dist/react-resizable-panels.node.esm.js",
-        "import": "./dist/react-resizable-panels.node.cjs.mjs",
-        "default": "./dist/react-resizable-panels.node.cjs.js"
+        "browser": "./dist/react-resizable-panels.browser.development.js",
+        "node": "./dist/react-resizable-panels.development.node.js",
+        "default": "./dist/react-resizable-panels.development.js"
       },
-      "module": "./dist/react-resizable-panels.esm.js",
-      "import": "./dist/react-resizable-panels.cjs.mjs",
-      "default": "./dist/react-resizable-panels.cjs.js"
+      "browser": "./dist/react-resizable-panels.browser.js",
+      "node": "./dist/react-resizable-panels.node.js",
+      "default": "./dist/react-resizable-panels.js"
     },
     "./package.json": "./package.json"
   },
@@ -69,12 +45,14 @@
   "devDependencies": {
     "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6",
     "@babel/plugin-proposal-optional-chaining": "7.21.0",
+    "@vitest/ui": "^3.1.2",
     "eslint": "^8.37.0",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
+    "jsdom": "^26.1.0",
     "react": "experimental",
-    "react-dom": "experimental"
+    "react-dom": "experimental",
+    "save-dev": "0.0.1-security",
+    "vitest": "^3.1.2"
   },
   "peerDependencies": {
     "react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
@@ -88,8 +66,8 @@
     "clear:builds": "rm -rf ./packages/*/dist",
     "clear:node_modules": "rm -rf ./node_modules",
     "lint": "eslint \"src/**/*.{ts,tsx}\"",
-    "test": "jest --config=jest.config.js",
-    "test:watch": "jest --config=jest.config.js --watch",
+    "test:browser": "vitest",
+    "test:node": "vitest -c vitest.node.config.ts",
     "watch": "parcel watch --port=2345"
   }
 }