@cube-dev/ui-kit 0.194.0 → 0.194.1

package/dist/components/content/Layout/LayoutPane.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
@@ -32,10 +32,10 @@ const PaneElement = tasty({
 		flexGrow: 0,
 		width: {
 			"": "auto",
-			"edge=right": "2x $pane-size $pane-size"
+			"edge=right": "($pane-min-size, 2x) $pane-size $pane-size"
 		},
 		height: {
-			"": "2x $pane-size $pane-size",
+			"": "($pane-min-size, 2x) $pane-size $pane-size",
 			"edge=right": "auto"
 		},
 		boxSizing: "content-box",
@@ -305,11 +305,16 @@ function LayoutPane(props, ref) {
 	} else t6 = $[8];
 	const clampValue = t6;
 	let t7;
-	if ($[9] !== clampValue || $[10] !== isHorizontal || $[11] !== isResizable || $[12] !== onSizeChange) {
+	if ($[9] !== clampValue || $[10] !== combinedRef || $[11] !== isHorizontal || $[12] !== isResizable || $[13] !== onSizeChange) {
 		t7 = {
 			onMoveStart() {
 				if (!isResizable) return;
 				setIsDragging(true);
+				const pane = combinedRef.current;
+				if (!pane) return;
+				const style = getComputedStyle(pane);
+				const drawn = Math.round(parseFloat(isHorizontal ? style.width : style.height));
+				setSize((current) => Number.isFinite(drawn) && Math.abs(drawn - current) >= 1 ? drawn : current);
 			},
 			onMove(e) {
 				if (!isResizable) return;
@@ -330,15 +335,16 @@ function LayoutPane(props, ref) {
 			}
 		};
 		$[9] = clampValue;
-		$[10] = isHorizontal;
-		$[11] = isResizable;
-		$[12] = onSizeChange;
-		$[13] = t7;
-	} else t7 = $[13];
+		$[10] = combinedRef;
+		$[11] = isHorizontal;
+		$[12] = isResizable;
+		$[13] = onSizeChange;
+		$[14] = t7;
+	} else t7 = $[14];
 	const { moveProps } = useMove(t7);
 	let t8;
 	let t9;
-	if ($[14] !== clampValue || $[15] !== isDragging || $[16] !== providedSize) {
+	if ($[15] !== clampValue || $[16] !== isDragging || $[17] !== providedSize) {
 		t8 = () => {
 			if (prevProvidedSizeRef.current !== providedSize) {
 				prevProvidedSizeRef.current = providedSize;
@@ -350,44 +356,44 @@ function LayoutPane(props, ref) {
 			isDragging,
 			clampValue
 		];
-		$[14] = clampValue;
-		$[15] = isDragging;
-		$[16] = providedSize;
-		$[17] = t8;
-		$[18] = t9;
+		$[15] = clampValue;
+		$[16] = isDragging;
+		$[17] = providedSize;
+		$[18] = t8;
+		$[19] = t9;
 	} else {
-		t8 = $[17];
-		t9 = $[18];
+		t8 = $[18];
+		t9 = $[19];
 	}
 	useEffect(t8, t9);
 	let t10;
-	if ($[19] !== clampValue || $[20] !== defaultSize || $[21] !== onSizeChange) {
+	if ($[20] !== clampValue || $[21] !== defaultSize || $[22] !== onSizeChange) {
 		t10 = () => {
 			const clampedSize = clampValue((typeof defaultSize === "number" ? defaultSize : parseInt(defaultSize, 10)) || 200);
 			setSize(clampedSize);
 			onSizeChange?.(clampedSize);
 		};
-		$[19] = clampValue;
-		$[20] = defaultSize;
-		$[21] = onSizeChange;
-		$[22] = t10;
-	} else t10 = $[22];
+		$[20] = clampValue;
+		$[21] = defaultSize;
+		$[22] = onSizeChange;
+		$[23] = t10;
+	} else t10 = $[23];
 	const handleResetSize = t10;
 	let t11;
-	if ($[23] !== handleHStyle || $[24] !== handleVStyle || $[25] !== isTinyScrollbar) {
+	if ($[24] !== handleHStyle || $[25] !== handleVStyle || $[26] !== isTinyScrollbar) {
 		t11 = isTinyScrollbar ? {
 			...handleVStyle,
 			...handleHStyle
 		} : {};
-		$[23] = handleHStyle;
-		$[24] = handleVStyle;
-		$[25] = isTinyScrollbar;
-		$[26] = t11;
-	} else t11 = $[26];
+		$[24] = handleHStyle;
+		$[25] = handleVStyle;
+		$[26] = isTinyScrollbar;
+		$[27] = t11;
+	} else t11 = $[27];
 	const scrollbarStyle = t11;
 	const t12 = !isResizable;
 	let t13;
-	if ($[27] !== debouncedHandlerHovered || $[28] !== isDragging || $[29] !== isHandlerFocused || $[30] !== isHovered || $[31] !== isScrolling || $[32] !== mods || $[33] !== resizeEdge || $[34] !== scrollbar || $[35] !== t12) {
+	if ($[28] !== debouncedHandlerHovered || $[29] !== isDragging || $[30] !== isHandlerFocused || $[31] !== isHovered || $[32] !== isScrolling || $[33] !== mods || $[34] !== resizeEdge || $[35] !== scrollbar || $[36] !== t12) {
 		t13 = {
 			scrollbar,
 			hovered: isHovered,
@@ -399,75 +405,72 @@ function LayoutPane(props, ref) {
 			drag: isDragging,
 			...mods
 		};
-		$[27] = debouncedHandlerHovered;
-		$[28] = isDragging;
-		$[29] = isHandlerFocused;
-		$[30] = isHovered;
-		$[31] = isScrolling;
-		$[32] = mods;
-		$[33] = resizeEdge;
-		$[34] = scrollbar;
-		$[35] = t12;
-		$[36] = t13;
-	} else t13 = $[36];
+		$[28] = debouncedHandlerHovered;
+		$[29] = isDragging;
+		$[30] = isHandlerFocused;
+		$[31] = isHovered;
+		$[32] = isScrolling;
+		$[33] = mods;
+		$[34] = resizeEdge;
+		$[35] = scrollbar;
+		$[36] = t12;
+		$[37] = t13;
+	} else t13 = $[37];
 	const paneMods = t13;
 	const finalStyles = mergeStyles(styles, outerStyles, innerStyles ? { Inner: innerStyles } : null);
 	const t14 = `${size}px`;
-	const t15 = typeof minSize === "number" ? `${minSize}px` : minSize;
-	const t16 = typeof maxSize === "number" ? `${maxSize}px` : maxSize;
-	let t17;
-	if ($[37] !== scrollbarStyle || $[38] !== t14 || $[39] !== t15 || $[40] !== t16) {
-		t17 = {
+	const t15 = minSize == null ? "initial" : typeof minSize === "number" ? `${minSize}px` : minSize;
+	let t16;
+	if ($[38] !== scrollbarStyle || $[39] !== t14 || $[40] !== t15) {
+		t16 = {
 			...scrollbarStyle,
 			"--pane-size": t14,
-			"--min-size": t15,
-			"--max-size": t16
+			"--pane-min-size": t15
 		};
-		$[37] = scrollbarStyle;
-		$[38] = t14;
-		$[39] = t15;
-		$[40] = t16;
-		$[41] = t17;
-	} else t17 = $[41];
-	const paneStyle = t17;
+		$[38] = scrollbarStyle;
+		$[39] = t14;
+		$[40] = t15;
+		$[41] = t16;
+	} else t16 = $[41];
+	const paneStyle = t16;
 	const T0 = PaneElement;
-	const t18 = filterBaseProps(otherProps, { eventProps: true });
-	let t19;
+	const t17 = filterBaseProps(otherProps, { eventProps: true });
+	let t18;
 	if ($[42] !== children) {
-		t19 = /* @__PURE__ */ jsx(LayoutContextReset, { children });
+		t18 = /* @__PURE__ */ jsx(LayoutContextReset, { children });
 		$[42] = children;
-		$[43] = t19;
-	} else t19 = $[43];
-	let t20;
-	if ($[44] !== combinedInnerRef || $[45] !== innerProps || $[46] !== t19) {
-		t20 = /* @__PURE__ */ jsx("div", {
+		$[43] = t18;
+	} else t18 = $[43];
+	let t19;
+	if ($[44] !== combinedInnerRef || $[45] !== innerProps || $[46] !== t18) {
+		t19 = /* @__PURE__ */ jsx("div", {
 			ref: combinedInnerRef,
 			"data-element": "Inner",
 			...innerProps,
-			children: t19
+			children: t18
 		});
 		$[44] = combinedInnerRef;
 		$[45] = innerProps;
-		$[46] = t19;
-		$[47] = t20;
-	} else t20 = $[47];
-	let t21;
+		$[46] = t18;
+		$[47] = t19;
+	} else t19 = $[47];
+	let t20;
 	if ($[48] !== hasOverflowY || $[49] !== isTinyScrollbar) {
-		t21 = isTinyScrollbar && hasOverflowY && /* @__PURE__ */ jsx("div", { "data-element": "ScrollbarV" });
+		t20 = isTinyScrollbar && hasOverflowY && /* @__PURE__ */ jsx("div", { "data-element": "ScrollbarV" });
 		$[48] = hasOverflowY;
 		$[49] = isTinyScrollbar;
-		$[50] = t21;
-	} else t21 = $[50];
-	let t22;
+		$[50] = t20;
+	} else t20 = $[50];
+	let t21;
 	if ($[51] !== hasOverflowX || $[52] !== isTinyScrollbar) {
-		t22 = isTinyScrollbar && hasOverflowX && /* @__PURE__ */ jsx("div", { "data-element": "ScrollbarH" });
+		t21 = isTinyScrollbar && hasOverflowX && /* @__PURE__ */ jsx("div", { "data-element": "ScrollbarH" });
 		$[51] = hasOverflowX;
 		$[52] = isTinyScrollbar;
-		$[53] = t22;
-	} else t22 = $[53];
-	let t23;
+		$[53] = t21;
+	} else t21 = $[53];
+	let t22;
 	if ($[54] !== handleResetSize || $[55] !== isResizable || $[56] !== moveProps || $[57] !== resizeEdge || $[58] !== setIsHandlerFocused || $[59] !== setIsHandlerHovered) {
-		t23 = isResizable && /* @__PURE__ */ jsx(PaneResizeHandler, {
+		t22 = isResizable && /* @__PURE__ */ jsx(PaneResizeHandler, {
 			edge: resizeEdge,
 			isDisabled: !isResizable,
 			moveProps,
@@ -481,22 +484,22 @@ function LayoutPane(props, ref) {
 		$[57] = resizeEdge;
 		$[58] = setIsHandlerFocused;
 		$[59] = setIsHandlerHovered;
-		$[60] = t23;
-	} else t23 = $[60];
-	let t24;
-	if ($[61] !== T0 || $[62] !== combinedRef || $[63] !== finalStyles || $[64] !== hoverProps || $[65] !== paneMods || $[66] !== paneStyle || $[67] !== t18 || $[68] !== t20 || $[69] !== t21 || $[70] !== t22 || $[71] !== t23) {
-		t24 = /* @__PURE__ */ jsxs(T0, {
+		$[60] = t22;
+	} else t22 = $[60];
+	let t23;
+	if ($[61] !== T0 || $[62] !== combinedRef || $[63] !== finalStyles || $[64] !== hoverProps || $[65] !== paneMods || $[66] !== paneStyle || $[67] !== t17 || $[68] !== t19 || $[69] !== t20 || $[70] !== t21 || $[71] !== t22) {
+		t23 = /* @__PURE__ */ jsxs(T0, {
 			ref: combinedRef,
-			...t18,
+			...t17,
 			...hoverProps,
 			mods: paneMods,
 			styles: finalStyles,
 			style: paneStyle,
 			children: [
+				t19,
 				t20,
 				t21,
-				t22,
-				t23
+				t22
 			]
 		});
 		$[61] = T0;
@@ -505,14 +508,14 @@ function LayoutPane(props, ref) {
 		$[64] = hoverProps;
 		$[65] = paneMods;
 		$[66] = paneStyle;
-		$[67] = t18;
-		$[68] = t20;
-		$[69] = t21;
-		$[70] = t22;
-		$[71] = t23;
-		$[72] = t24;
-	} else t24 = $[72];
-	return t24;
+		$[67] = t17;
+		$[68] = t19;
+		$[69] = t20;
+		$[70] = t21;
+		$[71] = t22;
+		$[72] = t23;
+	} else t23 = $[72];
+	return t23;
 }
 const _LayoutPane = forwardRef(LayoutPane);
 _LayoutPane.displayName = "Layout.Pane";

package/dist/components/content/Layout/LayoutPane.js.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutPane.js","names":["BaseProps","ContainerStyleProps","filterBaseProps","INNER_STYLES","mergeStyles","OUTER_STYLES","Styles","tasty","ForwardedRef","forwardRef","HTMLAttributes","ReactNode","useCallback","useEffect","useRef","useState","useFocusRing","useHover","useMove","useDebouncedValue","useI18n","mergeProps","useCombinedRefs","extractStyles","useTinyScrollbar","ScrollbarType","LayoutContextReset","clampSize","HANDLER_WIDTH","HANDLER_RESERVED","PaneElement","as","qa","styles","container","position","display","gridColumns","gridRows","placeContent","placeItems","placeSelf","flexShrink","flexGrow","width","height","boxSizing","Inner","$","flow","padding","paddingRight","paddingBottom","overflow","scrollbar","ScrollbarV","right","top","radius","fill","opacity","transition","pointerEvents","ScrollbarH","bottom","left","ResizeHandler","cursor","disabled","outline","Drag","gap","border","transform","outlineOffset","DragPart","ResizeEdge","CubeLayoutPaneProps","resizeEdge","isResizable","size","defaultSize","minSize","maxSize","onSizeChange","children","innerRef","HTMLDivElement","innerProps","PaneResizeHandlerProps","edge","isDisabled","moveProps","ReturnType","onDoubleClick","onHoverChange","isHovered","onFocusChange","isFocused","PaneResizeHandler","props","_c","t","t0","hoverProps","focusProps","isFocusVisible","isHorizontal","t1","t2","t3","tabIndex","undefined","role","t4","t5","LayoutPane","ref","providedSize","mods","innerRefProp","otherProps","combinedRef","internalInnerRef","combinedInnerRef","prevProvidedSizeRef","isDragging","setIsDragging","isHandlerHovered","setIsHandlerHovered","isHandlerFocused","setIsHandlerFocused","debouncedHandlerHovered","initialSize","setSize","outerStyles","innerStyles","isTinyScrollbar","Symbol","for","handleVStyle","handleHStyle","hasOverflowY","hasOverflowX","isScrolling","t6","value","clampValue","t7","onMoveStart","onMove","e","delta","pointerType","step","shiftKey","rawDelta","deltaX","deltaY","currentSize","onMoveEnd","currentSize_0","finalSize","Math","round","t8","t9","current","t10","resetSize","parseInt","clampedSize","handleResetSize","t11","scrollbarStyle","t12","t13","hovered","scrolling","handlerHovered","focused","drag","paneMods","finalStyles","t14","t15","t16","t17","paneStyle","T0","t18","eventProps","t19","t20","t21","t22","t23","t24","_LayoutPane","displayName"],"sources":["../../../../src/components/content/Layout/LayoutPane.tsx"],"sourcesContent":["import {\n  BaseProps,\n  ContainerStyleProps,\n  filterBaseProps,\n  INNER_STYLES,\n  mergeStyles,\n  OUTER_STYLES,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { useFocusRing, useHover, useMove } from 'react-aria';\n\nimport { useDebouncedValue } from '../../../_internal/hooks';\nimport { useI18n } from '../../../i18n';\nimport { mergeProps, useCombinedRefs } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\n\nimport { useTinyScrollbar } from './hooks/useTinyScrollbar';\nimport { ScrollbarType } from './LayoutContent';\nimport { LayoutContextReset } from './LayoutContext';\nimport { clampSize } from './utils';\n\n// Handler dimensions\nconst HANDLER_WIDTH = 9; // Interactive area\nconst HANDLER_RESERVED = 5; // Space reserved in Inner padding\n\nconst PaneElement = tasty({\n  as: 'div',\n  qa: 'LayoutPane',\n  styles: {\n    container: 'pane / inline-size',\n    position: 'relative',\n    display: 'grid',\n    gridColumns: '1sf',\n    gridRows: '1sf',\n    placeContent: 'stretch',\n    placeItems: 'stretch',\n    placeSelf: 'stretch',\n    flexShrink: 0,\n    flexGrow: 0,\n    // Size is set via CSS custom property for performance during drag\n    width: {\n      '': 'auto',\n      'edge=right': '2x $pane-size $pane-size',\n    },\n    height: {\n      '': '2x $pane-size $pane-size',\n      'edge=right': 'auto',\n    },\n    boxSizing: 'content-box',\n\n    Inner: {\n      $: '>',\n      display: 'flex',\n      flow: 'column',\n      padding: '($content-padding, 1x)',\n      // Reserve space for handler on resize edge\n      paddingRight: {\n        '': '($content-padding, 1x)',\n        'edge=right': `calc(($content-padding, 1x) + ${HANDLER_RESERVED}px)`,\n      },\n      paddingBottom: {\n        '': '($content-padding, 1x)',\n        'edge=bottom': `calc(($content-padding, 1x) + ${HANDLER_RESERVED}px)`,\n      },\n      overflow: {\n        '': 'auto',\n        'scrollbar=none': 'clip',\n      },\n      placeSelf: 'stretch',\n      scrollbar: {\n        '': 'thin',\n        'scrollbar=tiny | scrollbar=none': 'none',\n      },\n\n      '$layout-border-size': '0',\n    },\n\n    // Custom scrollbar handles (when scrollbar=\"tiny\")\n    ScrollbarV: {\n      position: 'absolute',\n      right: {\n        '': '1px',\n        'edge=right': `${HANDLER_RESERVED + 1}px`,\n      },\n      top: '$scrollbar-v-top',\n      width: '1ow',\n      height: '$scrollbar-v-height',\n      radius: 'round',\n      fill: '#dark.35',\n      opacity: {\n        '': 0,\n        '(focused | scrolling) & scrollbar=tiny': 1,\n      },\n      transition: 'opacity 0.15s',\n      pointerEvents: 'none',\n    },\n\n    ScrollbarH: {\n      $: '>',\n      position: 'absolute',\n      bottom: {\n        '': '1px',\n        'edge=bottom': `${HANDLER_RESERVED + 1}px`,\n      },\n      left: '$scrollbar-h-left',\n      height: '1ow',\n      width: '$scrollbar-h-width',\n      radius: 'round',\n      fill: '#dark.35',\n      opacity: {\n        '': 0,\n        '(focused | scrolling) & scrollbar=tiny': 1,\n      },\n      transition: 'opacity 0.15s',\n      pointerEvents: 'none',\n    },\n\n    // Compact resize handler - only drag dots\n    ResizeHandler: {\n      position: 'absolute',\n      // Size: 9px interactive area\n      width: {\n        '': '100%',\n        'edge=right': `${HANDLER_WIDTH}px`,\n      },\n      height: {\n        '': `${HANDLER_WIDTH}px`,\n        'edge=right': '100%',\n      },\n      // Position at edge, centered on the reserved space boundary\n      right: {\n        '': 'initial',\n        'edge=right': `${(HANDLER_RESERVED - HANDLER_WIDTH) / 2}px`,\n      },\n      bottom: {\n        '': `${(HANDLER_RESERVED - HANDLER_WIDTH) / 2}px`,\n        'edge=right': 'initial',\n      },\n      top: {\n        '': 'initial',\n        'edge=right': 0,\n      },\n      left: {\n        '': 0,\n        'edge=right': 'initial',\n      },\n      cursor: {\n        '': 'row-resize',\n        'edge=right': 'col-resize',\n        disabled: 'not-allowed',\n      },\n      padding: 0,\n      outline: 0,\n      boxSizing: 'border-box',\n      transition: 'theme',\n    },\n\n    Drag: {\n      display: 'grid',\n      gap: '2bw',\n      border: 0,\n      flow: {\n        '': 'row',\n        'edge=right': 'column',\n      },\n      gridColumns: {\n        '': '3px 3px 3px 3px 3px',\n        'edge=right': 'auto',\n      },\n      gridRows: {\n        '': 'auto',\n        'edge=right': '3px 3px 3px 3px 3px',\n      },\n      width: {\n        '': 'auto',\n        'edge=right': '3px',\n      },\n      height: {\n        '': '3px',\n        'edge=right': 'auto',\n      },\n      position: 'absolute',\n      top: '50%',\n      left: '50%',\n      transform: 'translate(-50%, -50%)',\n      transition: 'theme',\n      radius: 'round',\n      outline: {\n        '': '0',\n        'focused | drag': '1bw #primary-text',\n      },\n      outlineOffset: 1,\n    },\n\n    DragPart: {\n      radius: true,\n      fill: {\n        '': '#dark-03',\n        'handlerHovered | drag | focused': '#primary-text',\n        disabled: '#disabled-surface-text',\n      },\n    },\n  },\n});\n\nexport type ResizeEdge = 'right' | 'bottom';\n\nexport interface CubeLayoutPaneProps extends BaseProps, ContainerStyleProps {\n  /** Edge where resize handler appears */\n  resizeEdge?: ResizeEdge;\n  /** Enable resize functionality */\n  isResizable?: boolean;\n  /** Controlled size (width for right edge, height for bottom edge) */\n  size?: number | string;\n  /** Default size for uncontrolled state */\n  defaultSize?: number | string;\n  /** Minimum size constraint */\n  minSize?: number | string;\n  /** Maximum size constraint */\n  maxSize?: number | string;\n  /** Size change callback */\n  onSizeChange?: (size: number) => void;\n  /** Scrollbar style */\n  scrollbar?: ScrollbarType;\n  /** Custom styles */\n  styles?: Styles;\n  children?: ReactNode;\n  /** Ref for the inner content element */\n  innerRef?: ForwardedRef<HTMLDivElement>;\n  /** Props to spread on the Inner sub-element */\n  innerProps?: HTMLAttributes<HTMLDivElement>;\n}\n\ninterface PaneResizeHandlerProps {\n  edge: ResizeEdge;\n  isDisabled?: boolean;\n  moveProps: ReturnType<typeof useMove>['moveProps'];\n  onDoubleClick?: () => void;\n  onHoverChange?: (isHovered: boolean) => void;\n  onFocusChange?: (isFocused: boolean) => void;\n}\n\nfunction PaneResizeHandler(props: PaneResizeHandlerProps) {\n  const {\n    edge,\n    isDisabled,\n    moveProps,\n    onDoubleClick,\n    onHoverChange,\n    onFocusChange,\n  } = props;\n  const { t } = useI18n();\n  const { hoverProps, isHovered } = useHover({\n    onHoverChange,\n  });\n  const { focusProps, isFocusVisible } = useFocusRing();\n  const isHorizontal = edge === 'right';\n\n  // Notify parent of focus changes\n  useEffect(() => {\n    onFocusChange?.(isFocusVisible);\n  }, [isFocusVisible, onFocusChange]);\n\n  return (\n    <div\n      data-element=\"ResizeHandler\"\n      {...mergeProps(hoverProps, focusProps, isDisabled ? {} : moveProps, {\n        tabIndex: isDisabled ? undefined : 0,\n        role: 'separator',\n        'aria-orientation': isHorizontal ? 'vertical' : 'horizontal',\n        'aria-label':\n          edge === 'right'\n            ? t('layout.resizePaneRight', 'Resize pane right')\n            : t('layout.resizePaneBottom', 'Resize pane bottom'),\n        onDoubleClick: isDisabled ? undefined : onDoubleClick,\n      })}\n    >\n      {!isDisabled && (\n        <div data-element=\"Drag\">\n          <div data-element=\"DragPart\" />\n          <div data-element=\"DragPart\" />\n          <div data-element=\"DragPart\" />\n          <div data-element=\"DragPart\" />\n          <div data-element=\"DragPart\" />\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction LayoutPane(\n  props: CubeLayoutPaneProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    resizeEdge = 'right',\n    isResizable = false,\n    size: providedSize,\n    defaultSize = 200,\n    minSize,\n    maxSize,\n    onSizeChange,\n    scrollbar = 'thin',\n    styles,\n    mods,\n    children,\n    innerRef: innerRefProp,\n    innerProps,\n    ...otherProps\n  } = props;\n\n  const combinedRef = useCombinedRefs(ref);\n  const internalInnerRef = useRef<HTMLDivElement>(null);\n  const combinedInnerRef = useCombinedRefs(innerRefProp, internalInnerRef);\n  const prevProvidedSizeRef = useRef(providedSize);\n  const isHorizontal = resizeEdge === 'right';\n\n  // Resize state\n  const [isDragging, setIsDragging] = useState(false);\n  const [isHandlerHovered, setIsHandlerHovered] = useState(false);\n  const [isHandlerFocused, setIsHandlerFocused] = useState(false);\n  const debouncedHandlerHovered = useDebouncedValue(isHandlerHovered, 150);\n  const [size, setSize] = useState<number>(() => {\n    const initialSize =\n      typeof providedSize === 'number'\n        ? providedSize\n        : typeof defaultSize === 'number'\n          ? defaultSize\n          : 200;\n\n    return clampSize(initialSize, minSize, maxSize);\n  });\n\n  // Extract outer wrapper styles and inner content styles\n  const outerStyles = extractStyles(otherProps, OUTER_STYLES);\n  const innerStyles = extractStyles(otherProps, INNER_STYLES);\n\n  const isTinyScrollbar = scrollbar === 'tiny';\n  const { hoverProps, isHovered } = useHover({});\n\n  const {\n    handleVStyle,\n    handleHStyle,\n    hasOverflowY,\n    hasOverflowX,\n    isScrolling,\n  } = useTinyScrollbar(internalInnerRef, isTinyScrollbar);\n\n  // Clamp size to min/max constraints\n  const clampValue = useCallback(\n    (value: number) => clampSize(value, minSize, maxSize),\n    [minSize, maxSize],\n  );\n\n  const { moveProps } = useMove({\n    onMoveStart() {\n      if (!isResizable) return;\n      setIsDragging(true);\n    },\n    onMove(e) {\n      if (!isResizable) return;\n\n      let delta: number;\n\n      if (e.pointerType === 'keyboard') {\n        // Keyboard resize: 10px per step, 50px with Shift\n        const step = e.shiftKey ? 50 : 10;\n        const rawDelta = isHorizontal ? e.deltaX : e.deltaY;\n        delta = rawDelta * step;\n      } else {\n        // Pointer resize: use exact delta values\n        delta = isHorizontal ? e.deltaX : e.deltaY;\n      }\n\n      setSize((currentSize) => clampValue(currentSize + delta));\n    },\n    onMoveEnd() {\n      setIsDragging(false);\n      // Round to integer on release and notify parent\n      setSize((currentSize) => {\n        const finalSize = Math.round(clampValue(currentSize));\n        onSizeChange?.(finalSize);\n        return finalSize;\n      });\n    },\n  });\n\n  // Sync provided size with internal state (only when providedSize actually changes)\n  // This prevents resetting size when only isDragging changes (which would cause a flash)\n  useEffect(() => {\n    if (prevProvidedSizeRef.current !== providedSize) {\n      prevProvidedSizeRef.current = providedSize;\n      if (typeof providedSize === 'number' && !isDragging) {\n        setSize(clampValue(providedSize));\n      }\n    }\n  }, [providedSize, isDragging, clampValue]);\n\n  // Reset to default size on double-click\n  const handleResetSize = () => {\n    const resetSize =\n      typeof defaultSize === 'number' ? defaultSize : parseInt(defaultSize, 10);\n    const clampedSize = clampValue(resetSize || 200);\n    setSize(clampedSize);\n    onSizeChange?.(clampedSize);\n  };\n\n  const scrollbarStyle = isTinyScrollbar\n    ? { ...handleVStyle, ...handleHStyle }\n    : {};\n\n  const paneMods = {\n    scrollbar,\n    hovered: isHovered,\n    scrolling: isScrolling,\n    handlerHovered: debouncedHandlerHovered,\n    focused: isHandlerFocused,\n    disabled: !isResizable,\n    edge: resizeEdge,\n    drag: isDragging,\n    ...mods,\n  };\n\n  // Merge styles: outer styles to root, inner styles to Inner element\n  // Size is NOT included here - it's set via CSS custom property in paneStyle for performance\n  const finalStyles = mergeStyles(\n    styles,\n    outerStyles,\n    innerStyles ? { Inner: innerStyles } : null,\n  );\n\n  // Size is set via CSS custom property for performance during drag\n  // This avoids expensive style recalculation on every mouse move\n  const paneStyle = {\n    ...scrollbarStyle,\n    '--pane-size': `${size}px`,\n    '--min-size': typeof minSize === 'number' ? `${minSize}px` : minSize,\n    '--max-size': typeof maxSize === 'number' ? `${maxSize}px` : maxSize,\n  };\n\n  return (\n    <PaneElement\n      ref={combinedRef}\n      {...filterBaseProps(otherProps, { eventProps: true })}\n      {...hoverProps}\n      mods={paneMods}\n      styles={finalStyles}\n      style={paneStyle}\n    >\n      <div ref={combinedInnerRef} data-element=\"Inner\" {...innerProps}>\n        <LayoutContextReset>{children}</LayoutContextReset>\n      </div>\n      {isTinyScrollbar && hasOverflowY && <div data-element=\"ScrollbarV\" />}\n      {isTinyScrollbar && hasOverflowX && <div data-element=\"ScrollbarH\" />}\n      {isResizable && (\n        <PaneResizeHandler\n          edge={resizeEdge}\n          isDisabled={!isResizable}\n          moveProps={moveProps}\n          onDoubleClick={handleResetSize}\n          onHoverChange={setIsHandlerHovered}\n          onFocusChange={setIsHandlerFocused}\n        />\n      )}\n    </PaneElement>\n  );\n}\n\nconst _LayoutPane = forwardRef(LayoutPane);\n\n_LayoutPane.displayName = 'Layout.Pane';\n\nexport { _LayoutPane as LayoutPane };\n"],"mappings":"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"}
+{"version":3,"file":"LayoutPane.js","names":["BaseProps","ContainerStyleProps","filterBaseProps","INNER_STYLES","mergeStyles","OUTER_STYLES","Styles","tasty","ForwardedRef","forwardRef","HTMLAttributes","ReactNode","useCallback","useEffect","useRef","useState","useFocusRing","useHover","useMove","useDebouncedValue","useI18n","mergeProps","useCombinedRefs","extractStyles","useTinyScrollbar","ScrollbarType","LayoutContextReset","clampSize","HANDLER_WIDTH","HANDLER_RESERVED","PaneElement","as","qa","styles","container","position","display","gridColumns","gridRows","placeContent","placeItems","placeSelf","flexShrink","flexGrow","width","height","boxSizing","Inner","$","flow","padding","paddingRight","paddingBottom","overflow","scrollbar","ScrollbarV","right","top","radius","fill","opacity","transition","pointerEvents","ScrollbarH","bottom","left","ResizeHandler","cursor","disabled","outline","Drag","gap","border","transform","outlineOffset","DragPart","ResizeEdge","CubeLayoutPaneProps","resizeEdge","isResizable","size","defaultSize","minSize","maxSize","onSizeChange","children","innerRef","HTMLDivElement","innerProps","PaneResizeHandlerProps","edge","isDisabled","moveProps","ReturnType","onDoubleClick","onHoverChange","isHovered","onFocusChange","isFocused","PaneResizeHandler","props","_c","t","t0","hoverProps","focusProps","isFocusVisible","isHorizontal","t1","t2","t3","tabIndex","undefined","role","t4","t5","LayoutPane","ref","providedSize","mods","innerRefProp","otherProps","combinedRef","internalInnerRef","combinedInnerRef","prevProvidedSizeRef","isDragging","setIsDragging","isHandlerHovered","setIsHandlerHovered","isHandlerFocused","setIsHandlerFocused","debouncedHandlerHovered","initialSize","setSize","outerStyles","innerStyles","isTinyScrollbar","Symbol","for","handleVStyle","handleHStyle","hasOverflowY","hasOverflowX","isScrolling","t6","value","clampValue","t7","onMoveStart","pane","current","style","getComputedStyle","drawn","Math","round","parseFloat","Number","isFinite","abs","onMove","e","delta","pointerType","step","shiftKey","rawDelta","deltaX","deltaY","currentSize","onMoveEnd","currentSize_0","finalSize","t8","t9","t10","resetSize","parseInt","clampedSize","handleResetSize","t11","scrollbarStyle","t12","t13","hovered","scrolling","handlerHovered","focused","drag","paneMods","finalStyles","t14","t15","t16","paneStyle","T0","t17","eventProps","t18","t19","t20","t21","t22","t23","_LayoutPane","displayName"],"sources":["../../../../src/components/content/Layout/LayoutPane.tsx"],"sourcesContent":["import {\n  BaseProps,\n  ContainerStyleProps,\n  filterBaseProps,\n  INNER_STYLES,\n  mergeStyles,\n  OUTER_STYLES,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { useFocusRing, useHover, useMove } from 'react-aria';\n\nimport { useDebouncedValue } from '../../../_internal/hooks';\nimport { useI18n } from '../../../i18n';\nimport { mergeProps, useCombinedRefs } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\n\nimport { useTinyScrollbar } from './hooks/useTinyScrollbar';\nimport { ScrollbarType } from './LayoutContent';\nimport { LayoutContextReset } from './LayoutContext';\nimport { clampSize } from './utils';\n\n// Handler dimensions\nconst HANDLER_WIDTH = 9; // Interactive area\nconst HANDLER_RESERVED = 5; // Space reserved in Inner padding\n\nconst PaneElement = tasty({\n  as: 'div',\n  qa: 'LayoutPane',\n  styles: {\n    container: 'pane / inline-size',\n    position: 'relative',\n    display: 'grid',\n    gridColumns: '1sf',\n    gridRows: '1sf',\n    placeContent: 'stretch',\n    placeItems: 'stretch',\n    placeSelf: 'stretch',\n    // Holds its size. With `flexShrink={1}` it gives way down to its minimum\n    // when a flex container runs short.\n    flexShrink: 0,\n    flexGrow: 0,\n    // Size is set via CSS custom property for performance during drag\n    width: {\n      '': 'auto',\n      'edge=right': '($pane-min-size, 2x) $pane-size $pane-size',\n    },\n    height: {\n      '': '($pane-min-size, 2x) $pane-size $pane-size',\n      'edge=right': 'auto',\n    },\n    boxSizing: 'content-box',\n\n    Inner: {\n      $: '>',\n      display: 'flex',\n      flow: 'column',\n      padding: '($content-padding, 1x)',\n      // Reserve space for handler on resize edge\n      paddingRight: {\n        '': '($content-padding, 1x)',\n        'edge=right': `calc(($content-padding, 1x) + ${HANDLER_RESERVED}px)`,\n      },\n      paddingBottom: {\n        '': '($content-padding, 1x)',\n        'edge=bottom': `calc(($content-padding, 1x) + ${HANDLER_RESERVED}px)`,\n      },\n      overflow: {\n        '': 'auto',\n        'scrollbar=none': 'clip',\n      },\n      placeSelf: 'stretch',\n      scrollbar: {\n        '': 'thin',\n        'scrollbar=tiny | scrollbar=none': 'none',\n      },\n\n      '$layout-border-size': '0',\n    },\n\n    // Custom scrollbar handles (when scrollbar=\"tiny\")\n    ScrollbarV: {\n      position: 'absolute',\n      right: {\n        '': '1px',\n        'edge=right': `${HANDLER_RESERVED + 1}px`,\n      },\n      top: '$scrollbar-v-top',\n      width: '1ow',\n      height: '$scrollbar-v-height',\n      radius: 'round',\n      fill: '#dark.35',\n      opacity: {\n        '': 0,\n        '(focused | scrolling) & scrollbar=tiny': 1,\n      },\n      transition: 'opacity 0.15s',\n      pointerEvents: 'none',\n    },\n\n    ScrollbarH: {\n      $: '>',\n      position: 'absolute',\n      bottom: {\n        '': '1px',\n        'edge=bottom': `${HANDLER_RESERVED + 1}px`,\n      },\n      left: '$scrollbar-h-left',\n      height: '1ow',\n      width: '$scrollbar-h-width',\n      radius: 'round',\n      fill: '#dark.35',\n      opacity: {\n        '': 0,\n        '(focused | scrolling) & scrollbar=tiny': 1,\n      },\n      transition: 'opacity 0.15s',\n      pointerEvents: 'none',\n    },\n\n    // Compact resize handler - only drag dots\n    ResizeHandler: {\n      position: 'absolute',\n      // Size: 9px interactive area\n      width: {\n        '': '100%',\n        'edge=right': `${HANDLER_WIDTH}px`,\n      },\n      height: {\n        '': `${HANDLER_WIDTH}px`,\n        'edge=right': '100%',\n      },\n      // Position at edge, centered on the reserved space boundary\n      right: {\n        '': 'initial',\n        'edge=right': `${(HANDLER_RESERVED - HANDLER_WIDTH) / 2}px`,\n      },\n      bottom: {\n        '': `${(HANDLER_RESERVED - HANDLER_WIDTH) / 2}px`,\n        'edge=right': 'initial',\n      },\n      top: {\n        '': 'initial',\n        'edge=right': 0,\n      },\n      left: {\n        '': 0,\n        'edge=right': 'initial',\n      },\n      cursor: {\n        '': 'row-resize',\n        'edge=right': 'col-resize',\n        disabled: 'not-allowed',\n      },\n      padding: 0,\n      outline: 0,\n      boxSizing: 'border-box',\n      transition: 'theme',\n    },\n\n    Drag: {\n      display: 'grid',\n      gap: '2bw',\n      border: 0,\n      flow: {\n        '': 'row',\n        'edge=right': 'column',\n      },\n      gridColumns: {\n        '': '3px 3px 3px 3px 3px',\n        'edge=right': 'auto',\n      },\n      gridRows: {\n        '': 'auto',\n        'edge=right': '3px 3px 3px 3px 3px',\n      },\n      width: {\n        '': 'auto',\n        'edge=right': '3px',\n      },\n      height: {\n        '': '3px',\n        'edge=right': 'auto',\n      },\n      position: 'absolute',\n      top: '50%',\n      left: '50%',\n      transform: 'translate(-50%, -50%)',\n      transition: 'theme',\n      radius: 'round',\n      outline: {\n        '': '0',\n        'focused | drag': '1bw #primary-text',\n      },\n      outlineOffset: 1,\n    },\n\n    DragPart: {\n      radius: true,\n      fill: {\n        '': '#dark-03',\n        'handlerHovered | drag | focused': '#primary-text',\n        disabled: '#disabled-surface-text',\n      },\n    },\n  },\n});\n\nexport type ResizeEdge = 'right' | 'bottom';\n\nexport interface CubeLayoutPaneProps extends BaseProps, ContainerStyleProps {\n  /** Edge where resize handler appears */\n  resizeEdge?: ResizeEdge;\n  /** Enable resize functionality */\n  isResizable?: boolean;\n  /** Controlled size (width for right edge, height for bottom edge) */\n  size?: number | string;\n  /** Default size for uncontrolled state */\n  defaultSize?: number | string;\n  /** Minimum size constraint */\n  minSize?: number | string;\n  /** Maximum size constraint */\n  maxSize?: number | string;\n  /** Size change callback */\n  onSizeChange?: (size: number) => void;\n  /** Scrollbar style */\n  scrollbar?: ScrollbarType;\n  /** Custom styles */\n  styles?: Styles;\n  children?: ReactNode;\n  /** Ref for the inner content element */\n  innerRef?: ForwardedRef<HTMLDivElement>;\n  /** Props to spread on the Inner sub-element */\n  innerProps?: HTMLAttributes<HTMLDivElement>;\n}\n\ninterface PaneResizeHandlerProps {\n  edge: ResizeEdge;\n  isDisabled?: boolean;\n  moveProps: ReturnType<typeof useMove>['moveProps'];\n  onDoubleClick?: () => void;\n  onHoverChange?: (isHovered: boolean) => void;\n  onFocusChange?: (isFocused: boolean) => void;\n}\n\nfunction PaneResizeHandler(props: PaneResizeHandlerProps) {\n  const {\n    edge,\n    isDisabled,\n    moveProps,\n    onDoubleClick,\n    onHoverChange,\n    onFocusChange,\n  } = props;\n  const { t } = useI18n();\n  const { hoverProps, isHovered } = useHover({\n    onHoverChange,\n  });\n  const { focusProps, isFocusVisible } = useFocusRing();\n  const isHorizontal = edge === 'right';\n\n  // Notify parent of focus changes\n  useEffect(() => {\n    onFocusChange?.(isFocusVisible);\n  }, [isFocusVisible, onFocusChange]);\n\n  return (\n    <div\n      data-element=\"ResizeHandler\"\n      {...mergeProps(hoverProps, focusProps, isDisabled ? {} : moveProps, {\n        tabIndex: isDisabled ? undefined : 0,\n        role: 'separator',\n        'aria-orientation': isHorizontal ? 'vertical' : 'horizontal',\n        'aria-label':\n          edge === 'right'\n            ? t('layout.resizePaneRight', 'Resize pane right')\n            : t('layout.resizePaneBottom', 'Resize pane bottom'),\n        onDoubleClick: isDisabled ? undefined : onDoubleClick,\n      })}\n    >\n      {!isDisabled && (\n        <div data-element=\"Drag\">\n          <div data-element=\"DragPart\" />\n          <div data-element=\"DragPart\" />\n          <div data-element=\"DragPart\" />\n          <div data-element=\"DragPart\" />\n          <div data-element=\"DragPart\" />\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction LayoutPane(\n  props: CubeLayoutPaneProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    resizeEdge = 'right',\n    isResizable = false,\n    size: providedSize,\n    defaultSize = 200,\n    minSize,\n    maxSize,\n    onSizeChange,\n    scrollbar = 'thin',\n    styles,\n    mods,\n    children,\n    innerRef: innerRefProp,\n    innerProps,\n    ...otherProps\n  } = props;\n\n  const combinedRef = useCombinedRefs(ref);\n  const internalInnerRef = useRef<HTMLDivElement>(null);\n  const combinedInnerRef = useCombinedRefs(innerRefProp, internalInnerRef);\n  const prevProvidedSizeRef = useRef(providedSize);\n  const isHorizontal = resizeEdge === 'right';\n\n  // Resize state\n  const [isDragging, setIsDragging] = useState(false);\n  const [isHandlerHovered, setIsHandlerHovered] = useState(false);\n  const [isHandlerFocused, setIsHandlerFocused] = useState(false);\n  const debouncedHandlerHovered = useDebouncedValue(isHandlerHovered, 150);\n  const [size, setSize] = useState<number>(() => {\n    const initialSize =\n      typeof providedSize === 'number'\n        ? providedSize\n        : typeof defaultSize === 'number'\n          ? defaultSize\n          : 200;\n\n    return clampSize(initialSize, minSize, maxSize);\n  });\n\n  // Extract outer wrapper styles and inner content styles\n  const outerStyles = extractStyles(otherProps, OUTER_STYLES);\n  const innerStyles = extractStyles(otherProps, INNER_STYLES);\n\n  const isTinyScrollbar = scrollbar === 'tiny';\n  const { hoverProps, isHovered } = useHover({});\n\n  const {\n    handleVStyle,\n    handleHStyle,\n    hasOverflowY,\n    hasOverflowX,\n    isScrolling,\n  } = useTinyScrollbar(internalInnerRef, isTinyScrollbar);\n\n  // Clamp size to min/max constraints\n  const clampValue = useCallback(\n    (value: number) => clampSize(value, minSize, maxSize),\n    [minSize, maxSize],\n  );\n\n  const { moveProps } = useMove({\n    onMoveStart() {\n      if (!isResizable) return;\n      setIsDragging(true);\n\n      // Flex shrinking or a CSS minimum can draw the pane at another size than\n      // `size`; resize from the one on screen, or the first moves do nothing.\n      const pane = combinedRef.current;\n\n      if (!pane) return;\n\n      const style = getComputedStyle(pane);\n      const drawn = Math.round(\n        parseFloat(isHorizontal ? style.width : style.height),\n      );\n\n      setSize((current) =>\n        Number.isFinite(drawn) && Math.abs(drawn - current) >= 1\n          ? drawn\n          : current,\n      );\n    },\n    onMove(e) {\n      if (!isResizable) return;\n\n      let delta: number;\n\n      if (e.pointerType === 'keyboard') {\n        // Keyboard resize: 10px per step, 50px with Shift\n        const step = e.shiftKey ? 50 : 10;\n        const rawDelta = isHorizontal ? e.deltaX : e.deltaY;\n        delta = rawDelta * step;\n      } else {\n        // Pointer resize: use exact delta values\n        delta = isHorizontal ? e.deltaX : e.deltaY;\n      }\n\n      setSize((currentSize) => clampValue(currentSize + delta));\n    },\n    onMoveEnd() {\n      setIsDragging(false);\n      // Round to integer on release and notify parent\n      setSize((currentSize) => {\n        const finalSize = Math.round(clampValue(currentSize));\n        onSizeChange?.(finalSize);\n        return finalSize;\n      });\n    },\n  });\n\n  // Sync provided size with internal state (only when providedSize actually changes)\n  // This prevents resetting size when only isDragging changes (which would cause a flash)\n  useEffect(() => {\n    if (prevProvidedSizeRef.current !== providedSize) {\n      prevProvidedSizeRef.current = providedSize;\n      if (typeof providedSize === 'number' && !isDragging) {\n        setSize(clampValue(providedSize));\n      }\n    }\n  }, [providedSize, isDragging, clampValue]);\n\n  // Reset to default size on double-click\n  const handleResetSize = () => {\n    const resetSize =\n      typeof defaultSize === 'number' ? defaultSize : parseInt(defaultSize, 10);\n    const clampedSize = clampValue(resetSize || 200);\n    setSize(clampedSize);\n    onSizeChange?.(clampedSize);\n  };\n\n  const scrollbarStyle = isTinyScrollbar\n    ? { ...handleVStyle, ...handleHStyle }\n    : {};\n\n  const paneMods = {\n    scrollbar,\n    hovered: isHovered,\n    scrolling: isScrolling,\n    handlerHovered: debouncedHandlerHovered,\n    focused: isHandlerFocused,\n    disabled: !isResizable,\n    edge: resizeEdge,\n    drag: isDragging,\n    ...mods,\n  };\n\n  // Merge styles: outer styles to root, inner styles to Inner element\n  // Size is NOT included here - it's set via CSS custom property in paneStyle for performance\n  const finalStyles = mergeStyles(\n    styles,\n    outerStyles,\n    innerStyles ? { Inner: innerStyles } : null,\n  );\n\n  // Size is set via CSS custom property for performance during drag\n  // This avoids expensive style recalculation on every mouse move\n  const paneStyle = {\n    ...scrollbarStyle,\n    '--pane-size': `${size}px`,\n    // Reset rather than left unset: a custom property inherits, and an\n    // enclosing pane's minimum is not this one's.\n    '--pane-min-size':\n      minSize == null\n        ? 'initial'\n        : typeof minSize === 'number'\n          ? `${minSize}px`\n          : minSize,\n  };\n\n  return (\n    <PaneElement\n      ref={combinedRef}\n      {...filterBaseProps(otherProps, { eventProps: true })}\n      {...hoverProps}\n      mods={paneMods}\n      styles={finalStyles}\n      style={paneStyle}\n    >\n      <div ref={combinedInnerRef} data-element=\"Inner\" {...innerProps}>\n        <LayoutContextReset>{children}</LayoutContextReset>\n      </div>\n      {isTinyScrollbar && hasOverflowY && <div data-element=\"ScrollbarV\" />}\n      {isTinyScrollbar && hasOverflowX && <div data-element=\"ScrollbarH\" />}\n      {isResizable && (\n        <PaneResizeHandler\n          edge={resizeEdge}\n          isDisabled={!isResizable}\n          moveProps={moveProps}\n          onDoubleClick={handleResetSize}\n          onHoverChange={setIsHandlerHovered}\n          onFocusChange={setIsHandlerFocused}\n        />\n      )}\n    </PaneElement>\n  );\n}\n\nconst _LayoutPane = forwardRef(LayoutPane);\n\n_LayoutPane.displayName = 'Layout.Pane';\n\nexport { _LayoutPane as LayoutPane };\n"],"mappings":"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"}

package/dist/components/content/Layout/LayoutPanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.194.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.194.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
@@ -15,8 +15,8 @@ import { c } from "react/compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, mergeStyles, tasty } from "@tenphi/tasty";
 import { forwardRef, useCallback, useEffect, useEffectEvent, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { useFocusRing, useHover, useMove } from "react-aria";
 import { createPortal } from "react-dom";
+import { useFocusRing, useHover, useMove } from "react-aria";
 
 //#region src/components/content/Layout/LayoutPanel.tsx
 const HANDLER_WIDTH = 9;
@@ -66,8 +66,9 @@ const PanelElement = tasty({
 			"side=bottom": "top"
 		},
 		fill: "#surface",
+		isolation: "isolate",
 		transform: {
-			"": "translateX(0) translateY(0)",
+			"": "none",
 			"offscreen & side=left": "translateX(-100%)",
 			"offscreen & side=right": "translateX(100%)",
 			"offscreen & side=top": "translateY(-100%)",