@principal-ade/panels 1.0.53 → 1.0.54

package/dist/components/ConfigurablePanelLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConfigurablePanelLayout.d.ts","sourceRoot":"","sources":["../../src/components/ConfigurablePanelLayout.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ConfigurablePanelLayout.d.ts","sourceRoot":"","sources":["../../src/components/ConfigurablePanelLayout.tsx"],"names":[],"mappings":"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"}

package/dist/hooks/usePanelBounds.d.ts

@@ -0,0 +1,67 @@
+import { default as React, ReactNode } from 'react';
+import { PanelBounds, PanelSlotPosition } from '../types';
+/**
+ * Props for the PanelBoundsProvider component
+ */
+export interface PanelBoundsProviderProps {
+    /** The slot position this provider is for */
+    slot: PanelSlotPosition;
+    /** Child components that will have access to panel bounds */
+    children: ReactNode;
+}
+/**
+ * Provider component that tracks and provides panel bounds to children
+ *
+ * This component wraps each panel slot's content in ConfigurablePanelLayout.
+ * It uses ResizeObserver and scroll/resize listeners to keep bounds up to date.
+ */
+export declare const PanelBoundsProvider: React.FC<PanelBoundsProviderProps>;
+/**
+ * Return type for usePanelBounds hook
+ */
+export interface UsePanelBoundsReturn {
+    /** The current slot this panel is in (null if not in a panel) */
+    slot: PanelSlotPosition | null;
+    /** The bounds of this panel relative to the viewport */
+    bounds: PanelBounds;
+    /** Whether this hook is being used within a PanelBoundsProvider */
+    isInPanel: boolean;
+}
+/**
+ * Hook to access the current panel's viewport-relative bounds
+ *
+ * @example
+ * ```tsx
+ * const MyCanvasPanel: React.FC = () => {
+ *   const { bounds, isInPanel } = usePanelBounds();
+ *
+ *   // Use bounds.x and bounds.y to offset a viewport-sized canvas
+ *   const canvasStyle = {
+ *     position: 'absolute' as const,
+ *     top: 0,
+ *     left: 0,
+ *     width: '100dvw',
+ *     height: '100dvh',
+ *     transform: `translate(${-bounds.x}px, ${-bounds.y}px)`,
+ *   };
+ *
+ *   return <canvas style={canvasStyle} />;
+ * };
+ * ```
+ */
+export declare function usePanelBounds(): UsePanelBoundsReturn;
+/**
+ * Hook to get just the panel offset (x, y) for convenience
+ *
+ * @example
+ * ```tsx
+ * const { offsetX, offsetY } = usePanelOffset();
+ * // Use to position a viewport-sized element at the viewport origin
+ * const style = { transform: `translate(${-offsetX}px, ${-offsetY}px)` };
+ * ```
+ */
+export declare function usePanelOffset(): {
+    offsetX: number;
+    offsetY: number;
+};
+//# sourceMappingURL=usePanelBounds.d.ts.map

package/dist/hooks/usePanelBounds.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePanelBounds.d.ts","sourceRoot":"","sources":["../../src/hooks/usePanelBounds.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,EAAE,EAOZ,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,WAAW,EACX,iBAAiB,EAElB,MAAM,UAAU,CAAC;AAelB;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACvC,6CAA6C;IAC7C,IAAI,EAAE,iBAAiB,CAAC;IACxB,6DAA6D;IAC7D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA8DlE,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,iEAAiE;IACjE,IAAI,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC/B,wDAAwD;IACxD,MAAM,EAAE,WAAW,CAAC;IACpB,mEAAmE;IACnE,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,cAAc,IAAI,oBAAoB,CAgBrD;AAED;;;;;;;;;GASG;AACH,wBAAgB,cAAc,IAAI;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,CAMrE"}

package/dist/index.d.ts

@@ -6,8 +6,9 @@ export { EditableConfigurablePanelLayout, type EditableConfigurablePanelLayoutPr
 export { PanelConfigurator, type PanelConfiguratorProps, type PanelDefinition, type PanelLayout, type PanelSlot, type PanelGroup, type TabsConfig, type TilesConfig } from './components/PanelConfigurator';
 export { TabGroup, type TabGroupProps } from './components/TabGroup';
 export { SnapCarousel, type SnapCarouselProps, type SnapCarouselRef } from './components/SnapCarousel';
-export type { PanelOrientation, CollapsibleSide, ThemeMode, AnimationConfig, CollapseButtonConfig, PanelCallbacks, } from './types';
+export type { PanelOrientation, CollapsibleSide, ThemeMode, AnimationConfig, CollapseButtonConfig, PanelCallbacks, PanelSlotPosition, PanelBounds, PanelBoundsContextValue, } from './types';
 export { type Theme } from '@principal-ade/industry-theme';
 export { mapThemeToPanelVars, mapThemeToTabVars } from './utils/themeMapping';
 export { useMediaQuery } from './hooks/useMediaQuery';
+export { PanelBoundsProvider, usePanelBounds, usePanelOffset, type PanelBoundsProviderProps, type UsePanelBoundsReturn, } from './hooks/usePanelBounds';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,KAAK,4BAA4B,EAAE,MAAM,sCAAsC,CAAC;AAClH,OAAO,EAAE,sBAAsB,EAAE,KAAK,2BAA2B,EAAE,MAAM,qCAAqC,CAAC;AAC/G,OAAO,EAAE,uBAAuB,EAAE,KAAK,4BAA4B,EAAE,KAAK,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AACnJ,OAAO,EAAE,iCAAiC,EAAE,KAAK,sCAAsC,EAAE,MAAM,gDAAgD,CAAC;AAChJ,OAAO,EAAE,+BAA+B,EAAE,KAAK,oCAAoC,EAAE,MAAM,8CAA8C,CAAC;AAC1I,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,KAAK,eAAe,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,UAAU,EAAE,KAAK,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC5M,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAGvG,YAAY,EACV,gBAAgB,EAChB,eAAe,EACf,SAAS,EACT,eAAe,EACf,oBAAoB,EACpB,cAAc,GACf,MAAM,SAAS,CAAC;AAGjB,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9E,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,KAAK,4BAA4B,EAAE,MAAM,sCAAsC,CAAC;AAClH,OAAO,EAAE,sBAAsB,EAAE,KAAK,2BAA2B,EAAE,MAAM,qCAAqC,CAAC;AAC/G,OAAO,EAAE,uBAAuB,EAAE,KAAK,4BAA4B,EAAE,KAAK,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AACnJ,OAAO,EAAE,iCAAiC,EAAE,KAAK,sCAAsC,EAAE,MAAM,gDAAgD,CAAC;AAChJ,OAAO,EAAE,+BAA+B,EAAE,KAAK,oCAAoC,EAAE,MAAM,8CAA8C,CAAC;AAC1I,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,KAAK,eAAe,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,UAAU,EAAE,KAAK,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC5M,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAGvG,YAAY,EACV,gBAAgB,EAChB,eAAe,EACf,SAAS,EACT,eAAe,EACf,oBAAoB,EACpB,cAAc,EAEd,iBAAiB,EACjB,WAAW,EACX,uBAAuB,GACxB,MAAM,SAAS,CAAC;AAGjB,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9E,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAGtD,OAAO,EACL,mBAAmB,EACnB,cAAc,EACd,cAAc,EACd,KAAK,wBAAwB,EAC7B,KAAK,oBAAoB,GAC1B,MAAM,wBAAwB,CAAC"}

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import React, { useState, useRef, useCallback, useEffect, forwardRef, useImperativeHandle, useMemo, useLayoutEffect, createContext, memo, useReducer, useContext } from "react";
+import React, { useState, useRef, useCallback, useEffect, createContext, useContext, forwardRef, useImperativeHandle, useMemo, useLayoutEffect, memo, useReducer } from "react";
 import { PanelGroup, Panel, PanelResizeHandle } from "react-resizable-panels";
 import { flushSync, unstable_batchedUpdates, createPortal } from "react-dom";
 import { useTheme } from "@principal-ade/industry-theme";
@@ -653,6 +653,85 @@ const TabGroup = ({
     !hideTabList && (tabPosition === "bottom" || tabPosition === "right") && tabList
   ] });
 };
+const DEFAULT_BOUNDS = {
+  x: 0,
+  y: 0,
+  width: 0,
+  height: 0
+};
+const PanelBoundsContext = createContext(null);
+const PanelBoundsProvider = ({
+  slot,
+  children
+}) => {
+  const containerRef = useRef(null);
+  const [bounds, setBounds] = useState(DEFAULT_BOUNDS);
+  const updateBounds = useCallback(() => {
+    if (containerRef.current) {
+      const rect = containerRef.current.getBoundingClientRect();
+      setBounds({
+        x: rect.left,
+        y: rect.top,
+        width: rect.width,
+        height: rect.height
+      });
+    }
+  }, []);
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    updateBounds();
+    const resizeObserver = new ResizeObserver(() => {
+      updateBounds();
+    });
+    resizeObserver.observe(container);
+    window.addEventListener("resize", updateBounds);
+    window.addEventListener("scroll", updateBounds, true);
+    return () => {
+      resizeObserver.disconnect();
+      window.removeEventListener("resize", updateBounds);
+      window.removeEventListener("scroll", updateBounds, true);
+    };
+  }, [updateBounds]);
+  const contextValue = {
+    slot,
+    bounds
+  };
+  return /* @__PURE__ */ jsx(PanelBoundsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: containerRef,
+      className: "panel-bounds-container",
+      style: {
+        width: "100%",
+        height: "100%"
+      },
+      children
+    }
+  ) });
+};
+function usePanelBounds() {
+  const context = useContext(PanelBoundsContext);
+  if (!context) {
+    return {
+      slot: null,
+      bounds: DEFAULT_BOUNDS,
+      isInPanel: false
+    };
+  }
+  return {
+    slot: context.slot,
+    bounds: context.bounds,
+    isInPanel: true
+  };
+}
+function usePanelOffset() {
+  const { bounds } = usePanelBounds();
+  return {
+    offsetX: bounds.x,
+    offsetY: bounds.y
+  };
+}
 const ConfigurablePanelLayout = ({
   panels,
   layout,
@@ -1390,7 +1469,7 @@ const ConfigurablePanelLayout = ({
               opacity: leftCollapsed ? 0 : 1,
               transition: leftAnimating ? `opacity ${animationDuration * 0.5}ms ${animationEasing}` : "none"
             },
-            children: leftPanel
+            children: /* @__PURE__ */ jsx(PanelBoundsProvider, { slot: "left", children: leftPanel })
           }
         )
       }
@@ -1435,7 +1514,7 @@ const ConfigurablePanelLayout = ({
               opacity: middleCollapsed ? 0 : 1,
               transition: middleAnimating ? `opacity ${animationDuration * 0.5}ms ${animationEasing}` : "none"
             },
-            children: middlePanel
+            children: /* @__PURE__ */ jsx(PanelBoundsProvider, { slot: "middle", children: middlePanel })
           }
         )
       }
@@ -1480,7 +1559,7 @@ const ConfigurablePanelLayout = ({
               opacity: rightCollapsed ? 0 : 1,
               transition: rightAnimating ? `opacity ${animationDuration * 0.5}ms ${animationEasing}` : "none"
             },
-            children: rightPanel
+            children: /* @__PURE__ */ jsx(PanelBoundsProvider, { slot: "right", children: rightPanel })
           }
         )
       }
@@ -3737,9 +3816,9 @@ function useResizeObserver(_ref) {
         return void 0;
       }
       const {
-        ResizeObserver
+        ResizeObserver: ResizeObserver2
       } = window;
-      return new ResizeObserver(handleResize);
+      return new ResizeObserver2(handleResize);
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [disabled]
@@ -5604,12 +5683,15 @@ export {
   AnimatedVerticalLayout,
   ConfigurablePanelLayout,
   EditableConfigurablePanelLayout,
+  PanelBoundsProvider,
   PanelConfigurator,
   ResponsiveConfigurablePanelLayout,
   SnapCarousel,
   TabGroup,
   mapThemeToPanelVars,
   mapThemeToTabVars,
-  useMediaQuery
+  useMediaQuery,
+  usePanelBounds,
+  usePanelOffset
 };
 //# sourceMappingURL=index.esm.js.map