diff --git a/packages/react-resizable-panels/src/index.ts b/packages/react-resizable-panels/src/index.ts index c74fb6bb..39b33a02 100644 --- a/packages/react-resizable-panels/src/index.ts +++ b/packages/react-resizable-panels/src/index.ts @@ -3,6 +3,10 @@ import { PanelGroup } from "./PanelGroup"; import { PanelResizeHandle } from "./PanelResizeHandle"; import { assert } from "./utils/assert"; import { setNonce } from "./utils/csp"; +import { + enableGlobalCursorStyles, + disableGlobalCursorStyles, +} from "./utils/cursor"; import { getPanelElement } from "./utils/dom/getPanelElement"; import { getPanelElementsForGroup } from "./utils/dom/getPanelElementsForGroup"; import { getPanelGroupElement } from "./utils/dom/getPanelGroupElement"; @@ -66,6 +70,8 @@ export { getResizeHandleElementsForGroup, getResizeHandlePanelIds, - // CSP (see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce) + // Styles and CSP (see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce) + enableGlobalCursorStyles, + disableGlobalCursorStyles, setNonce, }; diff --git a/packages/react-resizable-panels/src/utils/cursor.ts b/packages/react-resizable-panels/src/utils/cursor.ts index 476854f5..de4f903a 100644 --- a/packages/react-resizable-panels/src/utils/cursor.ts +++ b/packages/react-resizable-panels/src/utils/cursor.ts @@ -9,8 +9,17 @@ import { getNonce } from "./csp"; type CursorState = "horizontal" | "intersection" | "vertical"; let currentCursorStyle: string | null = null; +let enabled: boolean = true; let styleElement: HTMLStyleElement | null = null; +export function disableGlobalCursorStyles() { + enabled = false; +} + +export function enableGlobalCursorStyles() { + enabled = true; +} + export function getCursorStyle( state: CursorState, constraintFlags: number @@ -67,6 +76,10 @@ export function setGlobalCursorStyle( state: CursorState, constraintFlags: number ) { + if (!enabled) { + return; + } + const style = getCursorStyle(state, constraintFlags); if (currentCursorStyle === style) {