@cube-dev/ui-kit 0.199.1 → 0.200.0

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

@@ -1 +1 @@
-{"version":3,"file":"LayoutPanel.js","names":["getFocusableTreeWalker","BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","mergeStyles","Styles","tasty","ForwardedRef","forwardRef","HTMLAttributes","ReactNode","RefCallback","useCallback","useEffect","useEffectEvent","useLayoutEffect","useMemo","useRef","useState","useFocusRing","useHover","useMove","createPortal","useDebouncedValue","useI18n","mergeProps","useCombinedRefs","useLocalStorage","focusProgrammatically","extractStyles","DisplayTransition","Dialog","CubeDialogContainerProps","DialogContainer","LayoutContextReset","LayoutPanelContext","Side","useLayoutActionsContext","useLayoutRefsContext","useLayoutStateContext","LayoutPanelTransition","clampSize","getOppositeSide","resolveCssSize","HANDLER_WIDTH","HANDLER_OFFSET","RESIZABLE_INSET_OFFSET","PanelElement","as","qa","styles","container","position","display","hide","hidden","flow","overflow","boxSizing","top","right","bottom","left","width","height","border","fill","isolation","transform","transition","ResizeHandlerElement","horizontal","cursor","disabled","touchAction","padding","outline","Track","inset","outlineOffset","Drag","gap","gridColumns","gridRows","DragPart","radius","OverlayBackdrop","backdropFilter","opacity","visible","pointerEvents","ResizeHandlerProps","side","isDisabled","mods","Record","moveProps","ReturnType","style","onDoubleClick","ResizeHandler","props","$","_c","t","label","t0","Symbol","for","hoverProps","isHovered","focusProps","isFocusVisible","isHorizontal","localIsHovered","T0","t1","hovered","focused","tabIndex","undefined","role","t2","t3","t4","LayoutPanelMode","CubeLayoutPanelProps","mode","size","defaultSize","minSize","maxSize","isResizable","onSizeChange","isOpen","defaultIsOpen","onOpenChange","hasTransition","hideOnClose","isDismissable","overlayStyles","isDialog","isDialogOpen","defaultIsDialogOpen","onDialogOpenChange","dialogProps","Omit","dialogStyles","contentPadding","sizeStorageKey","children","matchesContainerSize","HTMLElement","dimension","offsetWidth","offsetHeight","LayoutPanel","ref","HTMLDivElement","layoutActions","layoutState","layoutRefs","Error","modeProp","providedSize","providedIsOpen","hasTransitionProp","providedIsDialogOpen","otherProps","isDialogMode","isOverlayMode","isStickyMode","combinedRef","prevProvidedSizeRef","containerWidth","containerHeight","minContentSize","containerDimension","oppositeSide","oppositePanelSize","panelSizes","ownInsetOffset","naturalMax","Math","max","Infinity","internalIsOpen","setInternalIsOpen","isTransitionActive","isPanelContainerReady","visualState","setVisualState","isShown","isPanelShown","internalIsDialogOpen","setInternalIsDialogOpen","dialogOpen","storedSize","setStoredSize","isDragging","setIsDragging","setSize","initialSize","extractedStyles","finalStyles","resolvedMax","trim","endsWith","effectiveMax","values","push","Number","isFinite","length","min","clampValue","value","setContextDragging","setDragging","onMoveStart","onMove","e","delta","pointerType","step","shiftKey","rawDelta","deltaX","deltaY","direction","currentSize","onMoveEnd","finalSize","round","current","panelContainerRef","parentElement","applyInlineBounds","prev","clamped","frame","requestAnimationFrame","cancelAnimationFrame","effectivePanelSize","effectiveInsetSize","registerPanel","unregisterPanel","updatePanelSize","isReady","lastSizeRef","closeRequestedRef","handleOpenChange","newIsOpen","queueMicrotask","handleDismiss","registerOverlayPanel","unregister","openerRef","Element","panelNodeRef","mountFocusRef","recordOpener","active","ownerDocument","activeElement","contains","moveFocusIn","panel","opener","lastReturnedFocus","target","tabbable","nextNode","preventScroll","returnFocus","isConnected","body","handleDialogOpenChange","panelContextValue","dialogPanelContextValue","panelMods","drag","maxSizeCss","parts","join","panelStyle","panelRefCallback","node","transitionRef","handleResetSize","resetSize","parseInt","clampedSize","renderPanelContent","offscreen","isHidden","showOverlay","eventProps","portalContainer","phase","isExiting","OpenerProbe","focusRef","document","_LayoutPanel","displayName","_c","mergeProps"],"sources":["../../../../src/components/content/Layout/LayoutPanel.tsx"],"sourcesContent":["import { getFocusableTreeWalker } from '@react-aria/focus';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  mergeStyles,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  ReactNode,\n  RefCallback,\n  useCallback,\n  useEffect,\n  useEffectEvent,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useFocusRing, useHover, useMove } from 'react-aria';\nimport { createPortal } from 'react-dom';\n\nimport { useDebouncedValue } from '../../../_internal/hooks';\nimport { useI18n } from '../../../i18n';\nimport {\n  mergeProps,\n  useCombinedRefs,\n  useLocalStorage,\n} from '../../../utils/react';\nimport { focusProgrammatically } from '../../../utils/react/programmaticFocus';\nimport { extractStyles } from '../../../utils/styles';\nimport { DisplayTransition } from '../../helpers/DisplayTransition/DisplayTransition';\nimport { Dialog } from '../../overlays/Dialog';\nimport {\n  CubeDialogContainerProps,\n  DialogContainer,\n} from '../../overlays/Dialog/DialogContainer';\n\nimport {\n  LayoutContextReset,\n  LayoutPanelContext,\n  Side,\n  useLayoutActionsContext,\n  useLayoutRefsContext,\n  useLayoutStateContext,\n} from './LayoutContext';\nimport { LayoutPanelTransition } from './LayoutPanelTransition';\nimport { clampSize, getOppositeSide, resolveCssSize } from './utils';\n\n// Resize handler dimensions\nconst HANDLER_WIDTH = 9;\n// How far from panel edge to position handler's inner edge (centers the 3px track on the edge)\nconst HANDLER_OFFSET = 4;\n// Extra inset added for resizable panels (to accommodate handler grab area)\nconst RESIZABLE_INSET_OFFSET = 2;\n\nconst PanelElement = tasty({\n  as: 'div',\n  qa: 'LayoutPanel',\n  styles: {\n    container: 'panel / inline-size',\n    position: 'absolute',\n    display: 'flex',\n    // A closed `hideOnClose` panel keeps its content mounted out of the layout.\n    hide: {\n      '': false,\n      hidden: true,\n    },\n    flow: 'column',\n    overflow: 'hidden',\n    boxSizing: 'border-box',\n\n    '$content-padding': '1x',\n    // Auto-border size for sub-components (panels are always vertical)\n    '$layout-border-size': '1bw',\n\n    // Position based on side prop\n    top: {\n      '': 0,\n      'side=bottom': 'initial',\n    },\n    right: {\n      '': 0,\n      'side=left': 'initial',\n    },\n    bottom: {\n      '': 0,\n      'side=top': 'initial',\n    },\n    left: {\n      '': 0,\n      'side=right': 'initial',\n    },\n\n    // Size handling with CSS-level min/max clamping\n    width: {\n      '': '$min-size $panel-size $max-size',\n      'side=top | side=bottom': '100%',\n    },\n    height: {\n      '': '100%',\n      'side=top | side=bottom': '$min-size $panel-size $max-size',\n    },\n\n    // Visual styling\n    border: {\n      '': false,\n      'side=left': 'right',\n      'side=right': 'left',\n      'side=top': 'bottom',\n      'side=bottom': 'top',\n    },\n    fill: '#surface',\n    // The stacking context the transform used to create: z-indexed content\n    // stays inside the panel, below its resize handle and an overlay backdrop.\n    isolation: 'isolate',\n\n    // Transition styles - offscreen mod controls slide animation.\n    // `none` at rest, not a zero translate: any transform makes the panel the\n    // containing block of its fixed descendants (drag previews, popups), which\n    // then position against the panel and are clipped by its overflow. `none`\n    // still animates to and from the offscreen translate.\n    transform: {\n      '': 'none',\n      'offscreen & side=left': 'translateX(-100%)',\n      'offscreen & side=right': 'translateX(100%)',\n      'offscreen & side=top': 'translateY(-100%)',\n      'offscreen & side=bottom': 'translateY(100%)',\n    },\n    transition: {\n      '': 'none',\n      'has-transition': 'transform $transition ease-out',\n    },\n  },\n});\n\n// Handler is positioned as sibling to panel (in Fragment), relative to Layout\nconst ResizeHandlerElement = tasty({\n  qa: 'PanelResizeHandler',\n  styles: {\n    position: 'absolute',\n\n    // Handler size\n    width: {\n      '': '100%',\n      horizontal: `${HANDLER_WIDTH}px`,\n      'disabled & horizontal': '1bw',\n    },\n    height: {\n      '': `${HANDLER_WIDTH}px`,\n      horizontal: '100%',\n      'disabled & !horizontal': '1bw',\n    },\n\n    // Position handler with direct offset (no centering needed)\n    top: {\n      '': 0,\n      'side=top': `calc($panel-size - ${HANDLER_OFFSET}px)`,\n      'side=bottom': 'initial',\n    },\n    bottom: {\n      '': 0,\n      'side=bottom': `calc($panel-size - ${HANDLER_OFFSET}px)`,\n      'side=top': 'initial',\n    },\n    left: {\n      '': 0,\n      'side=left': `calc($panel-size - ${HANDLER_OFFSET}px)`,\n      'side=right': 'initial',\n    },\n    right: {\n      '': 0,\n      'side=right': `calc($panel-size - ${HANDLER_OFFSET}px)`,\n      'side=left': 'initial',\n    },\n\n    // Offscreen transforms only (no centering needed with direct offset positioning)\n    transform: {\n      '': 'translateX(0)',\n      'offscreen & side=left': `translateX(calc(-1 * $panel-size - ${HANDLER_WIDTH - HANDLER_OFFSET}px))`,\n      'offscreen & side=right': `translateX(calc($panel-size + ${HANDLER_WIDTH - HANDLER_OFFSET}px))`,\n      'offscreen & side=top': `translateY(calc(-1 * $panel-size - ${HANDLER_WIDTH - HANDLER_OFFSET}px))`,\n      'offscreen & side=bottom': `translateY(calc($panel-size + ${HANDLER_WIDTH - HANDLER_OFFSET}px))`,\n    },\n\n    cursor: {\n      '': 'row-resize',\n      horizontal: 'col-resize',\n      disabled: 'not-allowed',\n    },\n    touchAction: {\n      '': 'none',\n      disabled: 'auto',\n    },\n    padding: 0,\n    outline: 0,\n    boxSizing: 'border-box',\n\n    // Transition must match panel for synchronized animation\n    transition: {\n      '': 'theme',\n      'has-transition': 'transform $transition ease-out, theme',\n    },\n\n    Track: {\n      width: {\n        '': 'initial',\n        horizontal: '3px',\n        'disabled & horizontal': '1px',\n      },\n      height: {\n        '': '3px',\n        horizontal: 'initial',\n        'disabled & !horizontal': '1px',\n      },\n      position: 'absolute',\n      inset: {\n        '': '3px 0',\n        horizontal: '0 3px',\n        disabled: '0 0',\n      },\n      fill: {\n        '': '#border',\n        '(hovered | drag | focused) & !disabled': '#purple-03',\n      },\n      border: 0,\n      transition: 'theme',\n      outline: {\n        '': '1bw #primary-text.0',\n        'drag | focused': '1bw #primary-text',\n      },\n      outlineOffset: 1,\n    },\n\n    Drag: {\n      display: 'grid',\n      gap: '2bw',\n      border: 0,\n      flow: {\n        '': 'row',\n        horizontal: 'column',\n      },\n      gridColumns: {\n        '': '3px 3px 3px 3px 3px',\n        horizontal: 'auto',\n      },\n      gridRows: {\n        '': 'auto',\n        horizontal: '3px 3px 3px 3px 3px',\n      },\n      width: {\n        '': 'auto',\n        horizontal: '1px',\n      },\n      height: {\n        '': '1px',\n        horizontal: 'auto',\n      },\n      inset: {\n        '': '4px 50% auto auto',\n        horizontal: '50% 4px auto auto',\n      },\n      transform: {\n        '': 'translate(-50%, 0)',\n        horizontal: 'translate(0, -50%)',\n      },\n      position: 'absolute',\n      transition: 'theme',\n    },\n\n    DragPart: {\n      radius: true,\n      fill: {\n        '': '#dark-03',\n        'hovered | drag | focused': '#primary-text',\n        disabled: '#disabled-surface-text',\n      },\n    },\n  },\n});\n\n// Overlay backdrop for overlay mode - covers the content area behind the panel\nconst OverlayBackdrop = tasty({\n  qa: 'PanelOverlay',\n  styles: {\n    position: 'absolute',\n    inset: 0,\n    // fill: '#white.2',\n    backdropFilter: 'invert(.15)',\n    cursor: 'pointer',\n    opacity: {\n      '': 0,\n      visible: 1,\n    },\n    pointerEvents: {\n      '': 'none',\n      visible: 'auto',\n    },\n    transition: 'opacity .15s ease-out',\n  },\n});\n\ninterface ResizeHandlerProps {\n  side: Side;\n  isDisabled?: boolean;\n  mods?: Record<string, boolean>;\n  moveProps: ReturnType<typeof useMove>['moveProps'];\n  style?: Record<string, string | number | null | undefined>;\n  onDoubleClick?: () => void;\n}\n\nfunction ResizeHandler(props: ResizeHandlerProps) {\n  const { side, isDisabled, mods, moveProps, style, onDoubleClick } = props;\n  const { t } = useI18n();\n  // One key per side: a translated sentence can't take the side as a word.\n  const label = {\n    left: t('layout.resizeLeftPanel', 'Resize left panel'),\n    top: t('layout.resizeTopPanel', 'Resize top panel'),\n    right: t('layout.resizeRightPanel', 'Resize right panel'),\n    bottom: t('layout.resizeBottomPanel', 'Resize bottom panel'),\n  }[side];\n  const { hoverProps, isHovered } = useHover({});\n  const { focusProps, isFocusVisible } = useFocusRing();\n  const isHorizontal = side === 'left' || side === 'right';\n  const localIsHovered = useDebouncedValue(isHovered, 150);\n\n  return (\n    <ResizeHandlerElement\n      {...mergeProps(hoverProps, focusProps, moveProps, {\n        mods: {\n          hovered: localIsHovered,\n          horizontal: isHorizontal,\n          disabled: isDisabled,\n          focused: isFocusVisible,\n          side,\n          ...mods,\n        },\n        style,\n        tabIndex: isDisabled ? undefined : 0,\n        role: 'separator',\n        'aria-orientation': isHorizontal ? 'vertical' : 'horizontal',\n        'aria-label': label,\n        onDoubleClick: isDisabled ? undefined : onDoubleClick,\n      })}\n    >\n      <div data-element=\"Track\" />\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    </ResizeHandlerElement>\n  );\n}\n\n/** Panel rendering mode */\nexport type LayoutPanelMode = 'default' | 'sticky' | 'overlay' | 'dialog';\n\nexport interface CubeLayoutPanelProps extends BaseProps, ContainerStyleProps {\n  /** Side of the layout where panel is positioned */\n  side: Side;\n  /**\n   * Panel rendering mode:\n   * - `default`: Standard panel that pushes content aside\n   * - `sticky`: Panel floats over content without pushing it\n   * - `overlay`: Panel with dismissable backdrop overlay; focus moves into it\n   *   when it opens and back to the opener when it closes\n   * - `dialog`: Panel renders as a modal dialog\n   */\n  mode?: LayoutPanelMode;\n  /** Panel size (width for left/right, height for top/bottom) - controlled */\n  size?: number | string;\n  /** Default panel size for uncontrolled state */\n  defaultSize?: number | string;\n  /** Minimum panel size */\n  minSize?: number | string;\n  /** Maximum panel size */\n  maxSize?: number | string;\n  /** Enable resize functionality */\n  isResizable?: boolean;\n  /** Size change callback */\n  onSizeChange?: (size: number) => void;\n  /** Controlled open state */\n  isOpen?: boolean;\n  /** Default open state */\n  defaultIsOpen?: boolean;\n  /** Open state change callback */\n  onOpenChange?: (isOpen: boolean) => void;\n  /** Enable slide transition on open/close */\n  hasTransition?: boolean;\n  /**\n   * Hide the closed panel instead of unmounting its content, so the content\n   * keeps its state (an unsent draft, scroll position, a request in flight)\n   * until the panel reopens. A hidden panel takes no space and no focus.\n   * The content mounts once, even while the panel starts closed, so mount\n   * effects and a native `autoFocus` do not run again on reopen. Content that\n   * mounts while closed is hidden: `autoFocus` does nothing and measurements\n   * read zero until the panel opens. In dialog mode the dialog is kept the\n   * same way, and moves focus itself as a dialog that mounts on open does: to\n   * an autofocused kit control on every open, and on close back to its\n   * opener, or to the trigger of the menu or popover it sat in once that has\n   * closed\n   * (DialogContainer's docs list what still differs);\n   * `dialogProps.hideOnClose` takes precedence. Default: false\n   */\n  hideOnClose?: boolean;\n  /**\n   * Whether the panel can be dismissed by clicking the overlay (overlay mode), pressing Escape,\n   * or, in overlay mode, moving focus into the main content.\n   * Only applies to `overlay` and `dialog` modes. Default: true\n   */\n  isDismissable?: boolean;\n  /** Styles for the overlay backdrop in overlay mode */\n  overlayStyles?: Styles;\n  /**\n   * @deprecated Use `mode=\"dialog\"` instead. Switch to dialog mode (renders panel inside Dialog)\n   */\n  isDialog?: boolean;\n  /** Controlled dialog open state (used with mode=\"dialog\") */\n  isDialogOpen?: boolean;\n  /** Default dialog open state */\n  defaultIsDialogOpen?: boolean;\n  /** Dialog open state change callback */\n  onDialogOpenChange?: (isOpen: boolean) => void;\n  /** Props passed to DialogContainer when in dialog mode */\n  dialogProps?: Omit<\n    CubeDialogContainerProps,\n    'isDismissable' | 'onDismiss' | 'isOpen'\n  >;\n  /** Styles for the Dialog root in dialog mode, separate from inline panel styles. */\n  dialogStyles?: Styles;\n  /** Padding for content areas inside the panel. Default: '1x' */\n  contentPadding?: Styles['padding'];\n  /** localStorage key for persisting panel size. When provided, size is stored and restored across instances. */\n  sizeStorageKey?: string;\n  /** Styles for the panel */\n  styles?: Styles;\n  children?: ReactNode;\n}\n\nfunction matchesContainerSize(\n  container: HTMLElement | null | undefined,\n  isHorizontal: boolean,\n  dimension: number,\n) {\n  return (\n    (isHorizontal ? container?.offsetWidth : container?.offsetHeight) ===\n    dimension\n  );\n}\n\nfunction LayoutPanel(\n  props: CubeLayoutPanelProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const layoutActions = useLayoutActionsContext();\n  const layoutState = useLayoutStateContext();\n  const layoutRefs = useLayoutRefsContext();\n\n  if (!layoutActions || !layoutState || !layoutRefs) {\n    throw new Error(\n      'Layout.Panel must be used within a Layout component. ' +\n        'Ensure your panel is rendered inside a <Layout> parent.',\n    );\n  }\n\n  const {\n    side = 'left',\n    mode: modeProp,\n    size: providedSize,\n    defaultSize = 280,\n    minSize = 200,\n    maxSize,\n    isResizable = false,\n    onSizeChange,\n    isOpen: providedIsOpen,\n    defaultIsOpen = true,\n    onOpenChange,\n    hasTransition: hasTransitionProp,\n    hideOnClose = false,\n    isDismissable = true,\n    overlayStyles,\n    // Deprecated prop - use mode=\"dialog\" instead\n    isDialog = false,\n    isDialogOpen: providedIsDialogOpen,\n    defaultIsDialogOpen = false,\n    onDialogOpenChange,\n    dialogProps,\n    dialogStyles,\n    contentPadding,\n    sizeStorageKey,\n    children,\n    styles,\n    mods,\n    ...otherProps\n  } = props;\n\n  // Resolve mode from prop or deprecated isDialog\n  const mode: LayoutPanelMode = modeProp ?? (isDialog ? 'dialog' : 'default');\n  const isDialogMode = mode === 'dialog';\n  const isOverlayMode = mode === 'overlay';\n  const isStickyMode = mode === 'sticky';\n\n  // Use prop value if provided, otherwise fall back to context value\n  const hasTransition = hasTransitionProp ?? layoutActions.hasTransition;\n\n  const combinedRef = useCombinedRefs(ref);\n  const prevProvidedSizeRef = useRef(providedSize);\n  const isHorizontal = side === 'left' || side === 'right';\n\n  // Natural boundary computation\n  const { containerWidth, containerHeight } = layoutState;\n  const { minContentSize } = layoutActions;\n  const containerDimension = isHorizontal ? containerWidth : containerHeight;\n  const oppositeSide = getOppositeSide(side);\n  const oppositePanelSize = layoutState.panelSizes[oppositeSide];\n  const ownInsetOffset = isResizable ? RESIZABLE_INSET_OFFSET : 0;\n  const naturalMax = useMemo(\n    () =>\n      !isDialogMode && containerDimension > 0\n        ? Math.max(\n            0,\n            containerDimension -\n              oppositePanelSize -\n              minContentSize -\n              ownInsetOffset,\n          )\n        : Infinity,\n    [\n      isDialogMode,\n      containerDimension,\n      oppositePanelSize,\n      minContentSize,\n      ownInsetOffset,\n    ],\n  );\n\n  // Panel open state\n  const [internalIsOpen, setInternalIsOpen] = useState(defaultIsOpen);\n  const isOpen = providedIsOpen ?? internalIsOpen;\n  const isTransitionActive =\n    hasTransition && !isDialogMode && layoutRefs.isPanelContainerReady;\n  const [visualState, setVisualState] = useState({\n    isShown: isOpen,\n    isTransitionActive,\n  });\n\n  // A newly mounted DisplayTransition starts at the requested visibility.\n  if (visualState.isTransitionActive !== isTransitionActive) {\n    setVisualState({ isShown: isOpen, isTransitionActive });\n  }\n  const isPanelShown = isTransitionActive ? visualState.isShown : isOpen;\n\n  // Dialog open state\n  const [internalIsDialogOpen, setInternalIsDialogOpen] =\n    useState(defaultIsDialogOpen);\n  const dialogOpen = providedIsDialogOpen ?? internalIsDialogOpen;\n\n  // Persistent size storage\n  const [storedSize, setStoredSize] = useLocalStorage<number | null>(\n    sizeStorageKey ?? null,\n    null,\n  );\n\n  // Resize state\n  const [isDragging, setIsDragging] = useState(false);\n  const [size, setSize] = useState<number>(() => {\n    const initialSize =\n      typeof providedSize === 'number'\n        ? providedSize\n        : storedSize != null\n          ? storedSize\n          : typeof defaultSize === 'number'\n            ? defaultSize\n            : 280;\n\n    return clampSize(initialSize, minSize, maxSize);\n  });\n\n  const extractedStyles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  // Merge styles with contentPadding support\n  const finalStyles = useMemo(\n    () =>\n      mergeStyles(\n        styles,\n        contentPadding != null ? { '$content-padding': contentPadding } : null,\n        extractedStyles,\n      ),\n    [extractedStyles, contentPadding, styles],\n  );\n\n  // Resolve user's maxSize to pixels for JS-level clamping.\n  // Percentage bounds belong to the inline host, not the dialog's host.\n  const resolvedMax = useMemo(() => {\n    if (typeof maxSize === 'number') return maxSize;\n    if (\n      typeof maxSize === 'string' &&\n      containerDimension > 0 &&\n      (!isDialogMode || !maxSize.trim().endsWith('%'))\n    ) {\n      return resolveCssSize(maxSize, containerDimension);\n    }\n    return undefined;\n  }, [maxSize, containerDimension, isDialogMode]);\n\n  // Effective max combines user's maxSize with natural boundary\n  const effectiveMax = useMemo(() => {\n    const values: number[] = [];\n    if (resolvedMax != null) values.push(resolvedMax);\n    if (Number.isFinite(naturalMax)) values.push(naturalMax);\n    return values.length > 0 ? Math.min(...values) : undefined;\n  }, [resolvedMax, naturalMax]);\n\n  // Clamp size to min/max constraints (including natural boundaries)\n  const clampValue = useCallback(\n    (value: number) => clampSize(value, minSize, undefined, effectiveMax),\n    [minSize, effectiveMax],\n  );\n\n  const setContextDragging = layoutActions.setDragging;\n\n  const { moveProps } = useMove({\n    onMoveStart() {\n      if (!isResizable || isDialogMode) return;\n      setIsDragging(true);\n      setContextDragging(true);\n    },\n    onMove(e) {\n      if (!isResizable || isDialogMode) 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        // For keyboard, deltaX/deltaY are direction indicators (-1, 0, 1)\n        const rawDelta = isHorizontal ? e.deltaX : e.deltaY;\n        const direction = side === 'right' || side === 'bottom' ? -1 : 1;\n        delta = rawDelta * step * direction;\n      } else {\n        // Pointer resize: use exact delta values\n        delta = isHorizontal\n          ? e.deltaX * (side === 'right' ? -1 : 1)\n          : e.deltaY * (side === 'bottom' ? -1 : 1);\n      }\n\n      setSize((currentSize) => clampValue(currentSize + delta));\n    },\n    onMoveEnd() {\n      setIsDragging(false);\n      setContextDragging(false);\n      if (isDialogMode && !isDragging) return;\n      // Round to integer on release and notify parent\n      setSize((currentSize) => {\n        const finalSize = Math.round(clampValue(currentSize));\n        // Call onSizeChange synchronously to ensure parent state is updated\n        onSizeChange?.(finalSize);\n        // Persist to localStorage if key is provided\n        setStoredSize(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      if (\n        !isDialogMode &&\n        !matchesContainerSize(\n          layoutRefs.panelContainerRef.current?.parentElement,\n          isHorizontal,\n          containerDimension,\n        )\n      ) {\n        return;\n      }\n\n      prevProvidedSizeRef.current = providedSize;\n      if (typeof providedSize === 'number' && !isDragging) {\n        setSize(clampValue(providedSize));\n      }\n    }\n  }, [\n    providedSize,\n    isDragging,\n    clampValue,\n    isDialogMode,\n    isHorizontal,\n    containerDimension,\n    layoutRefs.panelContainerRef,\n  ]);\n\n  // Dialogs retain inline size; only inline panels follow the host's bounds.\n  const applyInlineBounds = useEffectEvent(() => {\n    if (\n      !matchesContainerSize(\n        layoutRefs.panelContainerRef.current?.parentElement,\n        isHorizontal,\n        containerDimension,\n      )\n    ) {\n      return;\n    }\n\n    setSize((prev) => {\n      const clamped = clampValue(prev);\n\n      if (clamped !== prev) {\n        onSizeChange?.(Math.round(clamped));\n        setStoredSize(Math.round(clamped));\n      }\n\n      return clamped;\n    });\n  });\n\n  useEffect(() => {\n    if (!isDialogMode && !isDragging && containerDimension > 0) {\n      // In an iframe ResizeObserver can precede responsive mode delivery.\n      // Let that mode settle before shrinking and persisting the inline size.\n      const frame = requestAnimationFrame(() => applyInlineBounds());\n      return () => cancelAnimationFrame(frame);\n    }\n  }, [\n    isDialogMode,\n    isDragging,\n    clampValue,\n    containerDimension,\n    isHorizontal,\n    layoutRefs.panelContainerRef,\n  ]);\n\n  // Register panel with layout context\n  // Include handler outside portion (minus border overlap) for proper content inset\n  // In sticky, overlay, and dialog modes, panel doesn't push content, so size is 0\n  // NOTE: We intentionally use `size` (not `clampValue(size)`) here to avoid a feedback\n  // loop. `clampValue` depends on the opposite panel's context size, so clamping here\n  // would create a period-2 oscillation through shared context. CSS --max-size handles\n  // visual clamping immediately; the auto-shrink effect converges `size` state.\n  const effectivePanelSize = isPanelShown && mode === 'default' ? size : 0;\n  const effectiveInsetSize = Math.round(\n    effectivePanelSize +\n      (isResizable && effectivePanelSize > 0 ? RESIZABLE_INSET_OFFSET : 0),\n  );\n\n  const { registerPanel, unregisterPanel, updatePanelSize } = layoutActions;\n  const { isReady } = layoutState;\n\n  // Track the last reported size to prevent unnecessary updates\n  const lastSizeRef = useRef<number>(effectiveInsetSize);\n\n  // Register on mount, unregister on unmount\n  // Using useLayoutEffect ensures registration happens before browser paint\n  useLayoutEffect(() => {\n    registerPanel(side, lastSizeRef.current);\n\n    return () => {\n      unregisterPanel(side);\n    };\n  }, [side, registerPanel, unregisterPanel]);\n\n  // Update size when it changes (after initial mount)\n  // Using useLayoutEffect ensures size updates happen before browser paint\n  useLayoutEffect(() => {\n    if (lastSizeRef.current !== effectiveInsetSize) {\n      lastSizeRef.current = effectiveInsetSize;\n      updatePanelSize(side, effectiveInsetSize);\n    }\n  }, [side, effectiveInsetSize, updatePanelSize]);\n\n  // One close per task: a consumer that moves focus into the main content in\n  // `onOpenChange(false)` would otherwise dismiss the still-registered panel\n  // a second time.\n  const closeRequestedRef = useRef(false);\n\n  const handleOpenChange = useCallback(\n    (newIsOpen: boolean) => {\n      if (!newIsOpen) {\n        if (closeRequestedRef.current) return;\n\n        closeRequestedRef.current = true;\n        queueMicrotask(() => {\n          closeRequestedRef.current = false;\n        });\n      }\n\n      setInternalIsOpen(newIsOpen);\n      onOpenChange?.(newIsOpen);\n    },\n    [onOpenChange],\n  );\n\n  // Dismiss handler for overlay mode (click on overlay)\n  const handleDismiss = useCallback(() => {\n    if (isDismissable) {\n      handleOpenChange(false);\n    }\n  }, [isDismissable, handleOpenChange]);\n\n  // Register overlay panel with Layout context for coordinated dismissal\n  const { registerOverlayPanel } = layoutActions;\n\n  useEffect(() => {\n    // Only register if in overlay mode, open, and dismissable\n    if (isOverlayMode && isOpen && isDismissable) {\n      const unregister = registerOverlayPanel(() => handleOpenChange(false));\n      return unregister;\n    }\n  }, [\n    isOverlayMode,\n    isOpen,\n    isDismissable,\n    registerOverlayPanel,\n    handleOpenChange,\n  ]);\n\n  // Overlay focus: move into the panel on open, back to the opener on close.\n  // Declared after the registration effect on purpose: its cleanup then runs\n  // after the panel unregisters, so a restore into the main content dismisses\n  // nothing.\n  const openerRef = useRef<Element | null>(null);\n  const panelNodeRef = useRef<HTMLDivElement | null>(null);\n  // Focus as the panel shows (its contents may mount now), before a native\n  // `autoFocus` inside them moves it (see OpenerProbe).\n  const mountFocusRef = useRef<Element | null>(null);\n\n  // A panel open on the Layout's first render leaves page focus alone.\n  const recordOpener = useEffectEvent(() => {\n    const active =\n      mountFocusRef.current ??\n      panelNodeRef.current?.ownerDocument.activeElement ??\n      null;\n\n    mountFocusRef.current = null;\n\n    openerRef.current =\n      isOverlayMode && isReady && !panelNodeRef.current?.contains(active)\n        ? active\n        : null;\n  });\n\n  const moveFocusIn = useEffectEvent(() => {\n    const panel = panelNodeRef.current;\n    const opener = openerRef.current;\n\n    const active = panel?.ownerDocument.activeElement;\n\n    // Focus already moved elsewhere as the panel opened, such as to a field\n    // with `autoFocus` inside it: leave it there. Focus another overlay panel just\n    // returned, as it closed in the same commit, does not count.\n    if (\n      !panel ||\n      !opener ||\n      (active !== opener && active !== lastReturnedFocus)\n    ) {\n      return;\n    }\n\n    const target =\n      getFocusableTreeWalker(panel, { tabbable: true }).nextNode() ??\n      getFocusableTreeWalker(panel).nextNode();\n\n    // The panel enters translated offscreen, so focus must not scroll.\n    focusProgrammatically(target as HTMLElement | null, {\n      preventScroll: true,\n    });\n  });\n\n  // Return focus only if it is still in the panel or was lost with it; focus\n  // the user or the consumer moved elsewhere stays there.\n  const returnFocus = useEffectEvent(() => {\n    const opener = openerRef.current;\n    const panel = panelNodeRef.current;\n\n    openerRef.current = null;\n\n    if (\n      !isOverlayMode ||\n      !(opener instanceof HTMLElement) ||\n      !opener.isConnected ||\n      opener === opener.ownerDocument.body\n    ) {\n      return;\n    }\n\n    const active = opener.ownerDocument.activeElement;\n\n    if (\n      active != null &&\n      active !== opener.ownerDocument.body &&\n      !panel?.contains(active)\n    ) {\n      return;\n    }\n\n    focusProgrammatically(opener, { preventScroll: true });\n    lastReturnedFocus = opener;\n    queueMicrotask(() => {\n      lastReturnedFocus = null;\n    });\n  });\n\n  useLayoutEffect(() => {\n    if (isOpen) recordOpener();\n  }, [isOpen]);\n\n  // Passive, so a menu item that refocuses itself while closing its menu has\n  // done so before focus moves in.\n  useEffect(() => {\n    if (!isOpen) return;\n\n    moveFocusIn();\n\n    return () => returnFocus();\n  }, [isOpen]);\n\n  const handleDialogOpenChange = useCallback(\n    (newIsOpen: boolean) => {\n      setInternalIsDialogOpen(newIsOpen);\n      onDialogOpenChange?.(newIsOpen);\n    },\n    [onDialogOpenChange],\n  );\n\n  // Panel context value for child components (like LayoutPanelHeader)\n  const panelContextValue = useMemo(\n    () => ({\n      onOpenChange: handleOpenChange,\n      isOpen,\n    }),\n    [handleOpenChange, isOpen],\n  );\n\n  // Dialog mode context value - uses dialog state instead of panel state\n  const dialogPanelContextValue = useMemo(\n    () => ({\n      onOpenChange: handleDialogOpenChange,\n      isOpen: dialogOpen,\n    }),\n    [handleDialogOpenChange, dialogOpen],\n  );\n\n  const panelMods = useMemo(\n    () => ({\n      side,\n      drag: isDragging,\n      horizontal: isHorizontal,\n      // Only enable transition after layout is ready to prevent initial animation\n      'has-transition': hasTransition && isReady,\n      ...mods,\n    }),\n    [side, isDragging, isHorizontal, hasTransition, isReady, mods],\n  );\n\n  // Build --max-size CSS variable combining user maxSize and natural boundary\n  const maxSizeCss = useMemo(() => {\n    const parts: string[] = [];\n\n    if (maxSize != null) {\n      parts.push(typeof maxSize === 'number' ? `${maxSize}px` : maxSize);\n    }\n\n    if (containerDimension > 0 && Number.isFinite(naturalMax)) {\n      parts.push(`${naturalMax}px`);\n    }\n\n    if (parts.length === 0) return undefined;\n    return parts.length === 1 ? parts[0] : `min(${parts.join(', ')})`;\n  }, [maxSize, naturalMax, containerDimension]);\n\n  const panelStyle = useMemo(\n    () => ({\n      '--panel-size': `${size}px`,\n      '--min-size': typeof minSize === 'number' ? `${minSize}px` : minSize,\n      '--max-size': maxSizeCss,\n    }),\n    [size, minSize, maxSizeCss],\n  );\n\n  // Combine refs for panel element\n  const panelRefCallback = useCallback(\n    (node: HTMLDivElement | null, transitionRef?: RefCallback<HTMLElement>) => {\n      // Update the combined ref\n      (combinedRef as { current: HTMLDivElement | null }).current = node;\n      // Call transition ref if provided\n      transitionRef?.(node);\n    },\n    [combinedRef],\n  );\n\n  // Reset to default size on double-click\n  const handleResetSize = useCallback(() => {\n    const resetSize =\n      typeof defaultSize === 'number' ? defaultSize : parseInt(defaultSize, 10);\n    const clampedSize = clampValue(resetSize || 280);\n    setSize(clampedSize);\n    onSizeChange?.(clampedSize);\n    setStoredSize(clampedSize);\n  }, [defaultSize, clampValue, onSizeChange, setStoredSize]);\n\n  // `isHidden` keeps the element tree of an open panel, so content never remounts.\n  // Without a transition, a rendered closed panel is a hidden one.\n  const renderPanelContent = (\n    offscreen = false,\n    transitionRef?: RefCallback<HTMLElement>,\n    isHidden = !isOpen,\n  ) => {\n    const showOverlay = isOverlayMode && !offscreen;\n\n    return (\n      <>\n        {/* Mounted only while shown, so an open from hidden reads live focus. */}\n        {isOverlayMode && !isHidden && <OpenerProbe focusRef={mountFocusRef} />}\n        {/* Overlay backdrop for overlay mode */}\n        {isOverlayMode && !isHidden && (\n          <OverlayBackdrop\n            mods={{ visible: showOverlay }}\n            styles={overlayStyles}\n            aria-hidden=\"true\"\n            onClick={handleDismiss}\n          />\n        )}\n        <PanelElement\n          ref={(node: HTMLDivElement | null) => {\n            // Kept after detach: StrictMode detaches refs before it replays\n            // the effects that still need the panel.\n            if (node) panelNodeRef.current = node;\n            panelRefCallback(node, transitionRef);\n          }}\n          {...filterBaseProps(otherProps, { eventProps: true })}\n          mods={{ ...panelMods, offscreen, hidden: isHidden }}\n          styles={finalStyles}\n          style={panelStyle}\n          data-side={side}\n        >\n          <LayoutPanelContext.Provider value={panelContextValue}>\n            <LayoutContextReset>{children}</LayoutContextReset>\n          </LayoutPanelContext.Provider>\n        </PanelElement>\n        {isResizable && !isHidden && (\n          <ResizeHandler\n            side={side}\n            isDisabled={!isResizable}\n            mods={{\n              drag: isDragging,\n              offscreen,\n              'has-transition': hasTransition && isReady,\n            }}\n            moveProps={moveProps}\n            style={panelStyle}\n            onDoubleClick={handleResetSize}\n          />\n        )}\n      </>\n    );\n  };\n\n  // Dialog mode - uses its own portal via DialogContainer\n  if (isDialogMode) {\n    return (\n      <DialogContainer\n        isOpen={dialogOpen}\n        isDismissable={isDismissable}\n        hideOnClose={hideOnClose}\n        onDismiss={() => handleDialogOpenChange(false)}\n        {...dialogProps}\n      >\n        <Dialog isDismissable={false} styles={dialogStyles}>\n          <LayoutPanelContext.Provider value={dialogPanelContextValue}>\n            <LayoutContextReset>{children}</LayoutContextReset>\n          </LayoutPanelContext.Provider>\n        </Dialog>\n      </DialogContainer>\n    );\n  }\n\n  // Wait for portal container to be ready before rendering\n  if (!layoutRefs.isPanelContainerReady) {\n    return null;\n  }\n\n  const portalContainer = layoutRefs.panelContainerRef.current!;\n\n  // Panel with transition - portal to panel container\n  if (hasTransition) {\n    return createPortal(\n      <DisplayTransition\n        isShown={isOpen}\n        animateOnMount={false}\n        exposeUnmounted={hideOnClose}\n        onToggle={(isShown) => setVisualState({ isShown, isTransitionActive })}\n      >\n        {({ phase, isShown, isExiting, ref: transitionRef }) => {\n          const isHidden = phase === 'unmounted';\n\n          return (\n            <LayoutPanelTransition\n              isShown={isShown}\n              isExiting={isExiting}\n              isHidden={isHidden}\n            >\n              {renderPanelContent(!isShown, transitionRef, isHidden)}\n            </LayoutPanelTransition>\n          );\n        }}\n      </DisplayTransition>,\n      portalContainer,\n    );\n  }\n\n  // Simple panel (no transition) - portal to panel container\n  if (!isOpen && !hideOnClose) return null;\n\n  return createPortal(renderPanelContent(false), portalContainer);\n}\n\n// Focus another overlay panel returned in the current task.\nlet lastReturnedFocus: Element | null = null;\n\n// Rendered before the panel's contents, so its layout effect reads focus\n// before React applies a native `autoFocus` inside them.\nfunction OpenerProbe({ focusRef }: { focusRef: { current: Element | null } }) {\n  useLayoutEffect(() => {\n    focusRef.current = document.activeElement;\n  }, [focusRef]);\n\n  return null;\n}\n\nconst _LayoutPanel = forwardRef(LayoutPanel);\n\n_LayoutPanel.displayName = 'Layout.Panel';\n\nexport { _LayoutPanel as LayoutPanel };\n"],"mappings":"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"}
+{"version":3,"file":"LayoutPanel.js","names":["getFocusableTreeWalker","BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","mergeStyles","Styles","tasty","Tokens","ForwardedRef","forwardRef","HTMLAttributes","ReactNode","RefCallback","useCallback","useEffect","useEffectEvent","useLayoutEffect","useMemo","useRef","useState","useFocusRing","useHover","useMove","createPortal","useDebouncedValue","useI18n","mergeProps","useCombinedRefs","useLocalStorage","focusProgrammatically","extractStyles","DisplayTransition","Dialog","CubeDialogContainerProps","DialogContainer","LayoutContextReset","LayoutPanelContext","Side","useLayoutActionsContext","useLayoutRefsContext","useLayoutStateContext","LayoutPanelTransition","clampSize","getOppositeSide","resolveCssSize","HANDLER_WIDTH","HANDLER_OFFSET","RESIZABLE_INSET_OFFSET","PanelElement","as","qa","styles","container","position","display","hide","hidden","flow","overflow","boxSizing","top","right","bottom","left","width","height","border","fill","isolation","transform","transition","ResizeHandlerElement","horizontal","cursor","disabled","touchAction","padding","outline","Track","inset","outlineOffset","Drag","gap","gridColumns","gridRows","DragPart","radius","OverlayBackdrop","backdropFilter","opacity","visible","pointerEvents","ResizeHandlerProps","side","isDisabled","mods","Record","moveProps","ReturnType","tokens","onDoubleClick","ResizeHandler","props","$","_c","t","label","t0","Symbol","for","hoverProps","isHovered","focusProps","isFocusVisible","isHorizontal","localIsHovered","T0","t1","hovered","focused","tabIndex","undefined","role","t2","t3","t4","LayoutPanelMode","CubeLayoutPanelProps","mode","size","defaultSize","minSize","maxSize","isResizable","onSizeChange","isOpen","defaultIsOpen","onOpenChange","hasTransition","hideOnClose","isDismissable","overlayStyles","isDialog","isDialogOpen","defaultIsDialogOpen","onDialogOpenChange","dialogProps","Omit","dialogStyles","contentPadding","sizeStorageKey","children","matchesContainerSize","HTMLElement","dimension","offsetWidth","offsetHeight","LayoutPanel","ref","HTMLDivElement","layoutActions","layoutState","layoutRefs","Error","modeProp","providedSize","providedIsOpen","hasTransitionProp","providedIsDialogOpen","otherProps","isDialogMode","isOverlayMode","isStickyMode","combinedRef","prevProvidedSizeRef","containerWidth","containerHeight","minContentSize","containerDimension","oppositeSide","oppositePanelSize","panelSizes","ownInsetOffset","naturalMax","Math","max","Infinity","internalIsOpen","setInternalIsOpen","isTransitionActive","isPanelContainerReady","visualState","setVisualState","isShown","isPanelShown","internalIsDialogOpen","setInternalIsDialogOpen","dialogOpen","storedSize","setStoredSize","isDragging","setIsDragging","setSize","initialSize","extractedStyles","finalStyles","resolvedMax","trim","endsWith","effectiveMax","values","push","Number","isFinite","length","min","clampValue","value","setContextDragging","setDragging","onMoveStart","onMove","e","delta","pointerType","step","shiftKey","rawDelta","deltaX","deltaY","direction","currentSize","onMoveEnd","finalSize","round","current","panelContainerRef","parentElement","applyInlineBounds","prev","clamped","frame","requestAnimationFrame","cancelAnimationFrame","effectivePanelSize","effectiveInsetSize","registerPanel","unregisterPanel","updatePanelSize","isReady","lastSizeRef","closeRequestedRef","handleOpenChange","newIsOpen","queueMicrotask","handleDismiss","registerOverlayPanel","unregister","openerRef","Element","panelNodeRef","mountFocusRef","recordOpener","active","ownerDocument","activeElement","contains","moveFocusIn","panel","opener","lastReturnedFocus","target","tabbable","nextNode","preventScroll","returnFocus","isConnected","body","handleDialogOpenChange","panelContextValue","dialogPanelContextValue","panelMods","drag","maxSizeCss","parts","join","panelTokens","panelRefCallback","node","transitionRef","handleResetSize","resetSize","parseInt","clampedSize","renderPanelContent","offscreen","isHidden","showOverlay","eventProps","portalContainer","phase","isExiting","OpenerProbe","focusRef","document","_LayoutPanel","displayName","_c","mergeProps"],"sources":["../../../../src/components/content/Layout/LayoutPanel.tsx"],"sourcesContent":["import { getFocusableTreeWalker } from '@react-aria/focus';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  mergeStyles,\n  Styles,\n  tasty,\n  Tokens,\n} from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  ReactNode,\n  RefCallback,\n  useCallback,\n  useEffect,\n  useEffectEvent,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useFocusRing, useHover, useMove } from 'react-aria';\nimport { createPortal } from 'react-dom';\n\nimport { useDebouncedValue } from '../../../_internal/hooks';\nimport { useI18n } from '../../../i18n';\nimport {\n  mergeProps,\n  useCombinedRefs,\n  useLocalStorage,\n} from '../../../utils/react';\nimport { focusProgrammatically } from '../../../utils/react/programmaticFocus';\nimport { extractStyles } from '../../../utils/styles';\nimport { DisplayTransition } from '../../helpers/DisplayTransition/DisplayTransition';\nimport { Dialog } from '../../overlays/Dialog';\nimport {\n  CubeDialogContainerProps,\n  DialogContainer,\n} from '../../overlays/Dialog/DialogContainer';\n\nimport {\n  LayoutContextReset,\n  LayoutPanelContext,\n  Side,\n  useLayoutActionsContext,\n  useLayoutRefsContext,\n  useLayoutStateContext,\n} from './LayoutContext';\nimport { LayoutPanelTransition } from './LayoutPanelTransition';\nimport { clampSize, getOppositeSide, resolveCssSize } from './utils';\n\n// Resize handler dimensions\nconst HANDLER_WIDTH = 9;\n// How far from panel edge to position handler's inner edge (centers the 3px track on the edge)\nconst HANDLER_OFFSET = 4;\n// Extra inset added for resizable panels (to accommodate handler grab area)\nconst RESIZABLE_INSET_OFFSET = 2;\n\nconst PanelElement = tasty({\n  as: 'div',\n  qa: 'LayoutPanel',\n  styles: {\n    container: 'panel / inline-size',\n    position: 'absolute',\n    display: 'flex',\n    // A closed `hideOnClose` panel keeps its content mounted out of the layout.\n    hide: {\n      '': false,\n      hidden: true,\n    },\n    flow: 'column',\n    overflow: 'hidden',\n    boxSizing: 'border-box',\n\n    '$content-padding': '1x',\n    // Auto-border size for sub-components (panels are always vertical)\n    '$layout-border-size': '1bw',\n\n    // Position based on side prop\n    top: {\n      '': 0,\n      'side=bottom': 'initial',\n    },\n    right: {\n      '': 0,\n      'side=left': 'initial',\n    },\n    bottom: {\n      '': 0,\n      'side=top': 'initial',\n    },\n    left: {\n      '': 0,\n      'side=right': 'initial',\n    },\n\n    // Size handling with CSS-level min/max clamping\n    width: {\n      '': '$min-size $panel-size $max-size',\n      'side=top | side=bottom': '100%',\n    },\n    height: {\n      '': '100%',\n      'side=top | side=bottom': '$min-size $panel-size $max-size',\n    },\n\n    // Visual styling\n    border: {\n      '': false,\n      'side=left': 'right',\n      'side=right': 'left',\n      'side=top': 'bottom',\n      'side=bottom': 'top',\n    },\n    fill: '#surface',\n    // The stacking context the transform used to create: z-indexed content\n    // stays inside the panel, below its resize handle and an overlay backdrop.\n    isolation: 'isolate',\n\n    // Transition styles - offscreen mod controls slide animation.\n    // `none` at rest, not a zero translate: any transform makes the panel the\n    // containing block of its fixed descendants (drag previews, popups), which\n    // then position against the panel and are clipped by its overflow. `none`\n    // still animates to and from the offscreen translate.\n    transform: {\n      '': 'none',\n      'offscreen & side=left': 'translateX(-100%)',\n      'offscreen & side=right': 'translateX(100%)',\n      'offscreen & side=top': 'translateY(-100%)',\n      'offscreen & side=bottom': 'translateY(100%)',\n    },\n    transition: {\n      '': 'none',\n      'has-transition': 'transform $transition ease-out',\n    },\n  },\n});\n\n// Handler is positioned as sibling to panel (in Fragment), relative to Layout\nconst ResizeHandlerElement = tasty({\n  qa: 'PanelResizeHandler',\n  styles: {\n    position: 'absolute',\n\n    // The handle's geometry is in device pixels so the grip stays crisp at any\n    // gap: `$grip-size` is the track's thickness and each dot's length,\n    // `$dot-size` each dot's thickness and `$dot-gap` the space between dots.\n    // The track and dot offsets below derive from these.\n    '$handle-size': `${HANDLER_WIDTH}px`,\n    '$grip-size': '3px',\n    '$dot-size': '1px',\n    '$dot-gap': '2px',\n\n    // Handler size\n    width: {\n      '': '100%',\n      horizontal: '$handle-size',\n      'disabled & horizontal': '1bw',\n    },\n    height: {\n      '': '$handle-size',\n      horizontal: '100%',\n      'disabled & !horizontal': '1bw',\n    },\n\n    // Position handler with direct offset (no centering needed)\n    top: {\n      '': 0,\n      'side=top': `calc($panel-size - ${HANDLER_OFFSET}px)`,\n      'side=bottom': 'initial',\n    },\n    bottom: {\n      '': 0,\n      'side=bottom': `calc($panel-size - ${HANDLER_OFFSET}px)`,\n      'side=top': 'initial',\n    },\n    left: {\n      '': 0,\n      'side=left': `calc($panel-size - ${HANDLER_OFFSET}px)`,\n      'side=right': 'initial',\n    },\n    right: {\n      '': 0,\n      'side=right': `calc($panel-size - ${HANDLER_OFFSET}px)`,\n      'side=left': 'initial',\n    },\n\n    // Offscreen transforms only (no centering needed with direct offset positioning)\n    transform: {\n      '': 'translateX(0)',\n      'offscreen & side=left': `translateX(calc(-1 * $panel-size - ${HANDLER_WIDTH - HANDLER_OFFSET}px))`,\n      'offscreen & side=right': `translateX(calc($panel-size + ${HANDLER_WIDTH - HANDLER_OFFSET}px))`,\n      'offscreen & side=top': `translateY(calc(-1 * $panel-size - ${HANDLER_WIDTH - HANDLER_OFFSET}px))`,\n      'offscreen & side=bottom': `translateY(calc($panel-size + ${HANDLER_WIDTH - HANDLER_OFFSET}px))`,\n    },\n\n    cursor: {\n      '': 'row-resize',\n      horizontal: 'col-resize',\n      disabled: 'not-allowed',\n    },\n    touchAction: {\n      '': 'none',\n      disabled: 'auto',\n    },\n    padding: 0,\n    outline: 0,\n    boxSizing: 'border-box',\n\n    // Transition must match panel for synchronized animation\n    transition: {\n      '': 'theme',\n      'has-transition': 'transform $transition ease-out, theme',\n    },\n\n    Track: {\n      width: {\n        '': 'initial',\n        horizontal: '$grip-size',\n        'disabled & horizontal': '1bw',\n      },\n      height: {\n        '': '$grip-size',\n        horizontal: 'initial',\n        'disabled & !horizontal': '1bw',\n      },\n      position: 'absolute',\n      inset: {\n        '': '(($handle-size - $grip-size) / 2) 0',\n        horizontal: '0 (($handle-size - $grip-size) / 2)',\n        disabled: '0 0',\n      },\n      fill: {\n        '': '#border',\n        '(hovered | drag | focused) & !disabled': '#purple-03',\n      },\n      border: 0,\n      transition: 'theme',\n      outline: {\n        '': '$ring-width #primary-text.0',\n        'drag | focused': '$ring-width #primary-text',\n      },\n      outlineOffset: '$outline-offset',\n    },\n\n    Drag: {\n      display: 'grid',\n      gap: '$dot-gap',\n      border: 0,\n      flow: {\n        '': 'row',\n        horizontal: 'column',\n      },\n      gridColumns: {\n        '': 'repeat(5, $grip-size)',\n        horizontal: 'auto',\n      },\n      gridRows: {\n        '': 'auto',\n        horizontal: 'repeat(5, $grip-size)',\n      },\n      width: {\n        '': 'auto',\n        horizontal: '$dot-size',\n      },\n      height: {\n        '': '$dot-size',\n        horizontal: 'auto',\n      },\n      inset: {\n        '': '(($handle-size - $dot-size) / 2) 50% auto auto',\n        horizontal: '50% (($handle-size - $dot-size) / 2) auto auto',\n      },\n      transform: {\n        '': 'translate(-50%, 0)',\n        horizontal: 'translate(0, -50%)',\n      },\n      position: 'absolute',\n      transition: 'theme',\n    },\n\n    DragPart: {\n      radius: true,\n      fill: {\n        '': '#dark-03',\n        'hovered | drag | focused': '#primary-text',\n        disabled: '#disabled-surface-text',\n      },\n    },\n  },\n});\n\n// Overlay backdrop for overlay mode - covers the content area behind the panel\nconst OverlayBackdrop = tasty({\n  qa: 'PanelOverlay',\n  styles: {\n    position: 'absolute',\n    inset: 0,\n    // fill: '#white.2',\n    backdropFilter: 'invert(.15)',\n    cursor: 'pointer',\n    opacity: {\n      '': 0,\n      visible: 1,\n    },\n    pointerEvents: {\n      '': 'none',\n      visible: 'auto',\n    },\n    // oxlint-disable-next-line tasty/no-raw-transition-duration -- a one-off 150ms backdrop fade: $scrollbar-transition has the value but times scrollbar fades, and $overlay-transition would slow it to 250ms\n    transition: 'opacity .15s ease-out',\n  },\n});\n\ninterface ResizeHandlerProps {\n  side: Side;\n  isDisabled?: boolean;\n  mods?: Record<string, boolean>;\n  moveProps: ReturnType<typeof useMove>['moveProps'];\n  tokens?: Tokens;\n  onDoubleClick?: () => void;\n}\n\nfunction ResizeHandler(props: ResizeHandlerProps) {\n  const { side, isDisabled, mods, moveProps, tokens, onDoubleClick } = props;\n  const { t } = useI18n();\n  // One key per side: a translated sentence can't take the side as a word.\n  const label = {\n    left: t('layout.resizeLeftPanel', 'Resize left panel'),\n    top: t('layout.resizeTopPanel', 'Resize top panel'),\n    right: t('layout.resizeRightPanel', 'Resize right panel'),\n    bottom: t('layout.resizeBottomPanel', 'Resize bottom panel'),\n  }[side];\n  const { hoverProps, isHovered } = useHover({});\n  const { focusProps, isFocusVisible } = useFocusRing();\n  const isHorizontal = side === 'left' || side === 'right';\n  const localIsHovered = useDebouncedValue(isHovered, 150);\n\n  return (\n    <ResizeHandlerElement\n      {...mergeProps(hoverProps, focusProps, moveProps, {\n        mods: {\n          hovered: localIsHovered,\n          horizontal: isHorizontal,\n          disabled: isDisabled,\n          focused: isFocusVisible,\n          side,\n          ...mods,\n        },\n        tokens,\n        tabIndex: isDisabled ? undefined : 0,\n        role: 'separator',\n        'aria-orientation': isHorizontal ? 'vertical' : 'horizontal',\n        'aria-label': label,\n        onDoubleClick: isDisabled ? undefined : onDoubleClick,\n      })}\n    >\n      <div data-element=\"Track\" />\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    </ResizeHandlerElement>\n  );\n}\n\n/** Panel rendering mode */\nexport type LayoutPanelMode = 'default' | 'sticky' | 'overlay' | 'dialog';\n\nexport interface CubeLayoutPanelProps extends BaseProps, ContainerStyleProps {\n  /** Side of the layout where panel is positioned */\n  side: Side;\n  /**\n   * Panel rendering mode:\n   * - `default`: Standard panel that pushes content aside\n   * - `sticky`: Panel floats over content without pushing it\n   * - `overlay`: Panel with dismissable backdrop overlay; focus moves into it\n   *   when it opens and back to the opener when it closes\n   * - `dialog`: Panel renders as a modal dialog\n   */\n  mode?: LayoutPanelMode;\n  /** Panel size (width for left/right, height for top/bottom) - controlled */\n  size?: number | string;\n  /** Default panel size for uncontrolled state */\n  defaultSize?: number | string;\n  /** Minimum panel size */\n  minSize?: number | string;\n  /** Maximum panel size */\n  maxSize?: number | string;\n  /** Enable resize functionality */\n  isResizable?: boolean;\n  /** Size change callback */\n  onSizeChange?: (size: number) => void;\n  /** Controlled open state */\n  isOpen?: boolean;\n  /** Default open state */\n  defaultIsOpen?: boolean;\n  /** Open state change callback */\n  onOpenChange?: (isOpen: boolean) => void;\n  /** Enable slide transition on open/close */\n  hasTransition?: boolean;\n  /**\n   * Hide the closed panel instead of unmounting its content, so the content\n   * keeps its state (an unsent draft, scroll position, a request in flight)\n   * until the panel reopens. A hidden panel takes no space and no focus.\n   * The content mounts once, even while the panel starts closed, so mount\n   * effects and a native `autoFocus` do not run again on reopen. Content that\n   * mounts while closed is hidden: `autoFocus` does nothing and measurements\n   * read zero until the panel opens. In dialog mode the dialog is kept the\n   * same way, and moves focus itself as a dialog that mounts on open does: to\n   * an autofocused kit control on every open, and on close back to its\n   * opener, or to the trigger of the menu or popover it sat in once that has\n   * closed\n   * (DialogContainer's docs list what still differs);\n   * `dialogProps.hideOnClose` takes precedence. Default: false\n   */\n  hideOnClose?: boolean;\n  /**\n   * Whether the panel can be dismissed by clicking the overlay (overlay mode), pressing Escape,\n   * or, in overlay mode, moving focus into the main content.\n   * Only applies to `overlay` and `dialog` modes. Default: true\n   */\n  isDismissable?: boolean;\n  /** Styles for the overlay backdrop in overlay mode */\n  overlayStyles?: Styles;\n  /**\n   * @deprecated Use `mode=\"dialog\"` instead. Switch to dialog mode (renders panel inside Dialog)\n   */\n  isDialog?: boolean;\n  /** Controlled dialog open state (used with mode=\"dialog\") */\n  isDialogOpen?: boolean;\n  /** Default dialog open state */\n  defaultIsDialogOpen?: boolean;\n  /** Dialog open state change callback */\n  onDialogOpenChange?: (isOpen: boolean) => void;\n  /** Props passed to DialogContainer when in dialog mode */\n  dialogProps?: Omit<\n    CubeDialogContainerProps,\n    'isDismissable' | 'onDismiss' | 'isOpen'\n  >;\n  /** Styles for the Dialog root in dialog mode, separate from inline panel styles. */\n  dialogStyles?: Styles;\n  /** Padding for content areas inside the panel. Default: '1x' */\n  contentPadding?: Styles['padding'];\n  /** localStorage key for persisting panel size. When provided, size is stored and restored across instances. */\n  sizeStorageKey?: string;\n  /** Styles for the panel */\n  styles?: Styles;\n  children?: ReactNode;\n}\n\nfunction matchesContainerSize(\n  container: HTMLElement | null | undefined,\n  isHorizontal: boolean,\n  dimension: number,\n) {\n  return (\n    (isHorizontal ? container?.offsetWidth : container?.offsetHeight) ===\n    dimension\n  );\n}\n\nfunction LayoutPanel(\n  props: CubeLayoutPanelProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const layoutActions = useLayoutActionsContext();\n  const layoutState = useLayoutStateContext();\n  const layoutRefs = useLayoutRefsContext();\n\n  if (!layoutActions || !layoutState || !layoutRefs) {\n    throw new Error(\n      'Layout.Panel must be used within a Layout component. ' +\n        'Ensure your panel is rendered inside a <Layout> parent.',\n    );\n  }\n\n  const {\n    side = 'left',\n    mode: modeProp,\n    size: providedSize,\n    defaultSize = 280,\n    minSize = 200,\n    maxSize,\n    isResizable = false,\n    onSizeChange,\n    isOpen: providedIsOpen,\n    defaultIsOpen = true,\n    onOpenChange,\n    hasTransition: hasTransitionProp,\n    hideOnClose = false,\n    isDismissable = true,\n    overlayStyles,\n    // Deprecated prop - use mode=\"dialog\" instead\n    isDialog = false,\n    isDialogOpen: providedIsDialogOpen,\n    defaultIsDialogOpen = false,\n    onDialogOpenChange,\n    dialogProps,\n    dialogStyles,\n    contentPadding,\n    sizeStorageKey,\n    children,\n    styles,\n    mods,\n    ...otherProps\n  } = props;\n\n  // Resolve mode from prop or deprecated isDialog\n  const mode: LayoutPanelMode = modeProp ?? (isDialog ? 'dialog' : 'default');\n  const isDialogMode = mode === 'dialog';\n  const isOverlayMode = mode === 'overlay';\n  const isStickyMode = mode === 'sticky';\n\n  // Use prop value if provided, otherwise fall back to context value\n  const hasTransition = hasTransitionProp ?? layoutActions.hasTransition;\n\n  const combinedRef = useCombinedRefs(ref);\n  const prevProvidedSizeRef = useRef(providedSize);\n  const isHorizontal = side === 'left' || side === 'right';\n\n  // Natural boundary computation\n  const { containerWidth, containerHeight } = layoutState;\n  const { minContentSize } = layoutActions;\n  const containerDimension = isHorizontal ? containerWidth : containerHeight;\n  const oppositeSide = getOppositeSide(side);\n  const oppositePanelSize = layoutState.panelSizes[oppositeSide];\n  const ownInsetOffset = isResizable ? RESIZABLE_INSET_OFFSET : 0;\n  const naturalMax = useMemo(\n    () =>\n      !isDialogMode && containerDimension > 0\n        ? Math.max(\n            0,\n            containerDimension -\n              oppositePanelSize -\n              minContentSize -\n              ownInsetOffset,\n          )\n        : Infinity,\n    [\n      isDialogMode,\n      containerDimension,\n      oppositePanelSize,\n      minContentSize,\n      ownInsetOffset,\n    ],\n  );\n\n  // Panel open state\n  const [internalIsOpen, setInternalIsOpen] = useState(defaultIsOpen);\n  const isOpen = providedIsOpen ?? internalIsOpen;\n  const isTransitionActive =\n    hasTransition && !isDialogMode && layoutRefs.isPanelContainerReady;\n  const [visualState, setVisualState] = useState({\n    isShown: isOpen,\n    isTransitionActive,\n  });\n\n  // A newly mounted DisplayTransition starts at the requested visibility.\n  if (visualState.isTransitionActive !== isTransitionActive) {\n    setVisualState({ isShown: isOpen, isTransitionActive });\n  }\n  const isPanelShown = isTransitionActive ? visualState.isShown : isOpen;\n\n  // Dialog open state\n  const [internalIsDialogOpen, setInternalIsDialogOpen] =\n    useState(defaultIsDialogOpen);\n  const dialogOpen = providedIsDialogOpen ?? internalIsDialogOpen;\n\n  // Persistent size storage\n  const [storedSize, setStoredSize] = useLocalStorage<number | null>(\n    sizeStorageKey ?? null,\n    null,\n  );\n\n  // Resize state\n  const [isDragging, setIsDragging] = useState(false);\n  const [size, setSize] = useState<number>(() => {\n    const initialSize =\n      typeof providedSize === 'number'\n        ? providedSize\n        : storedSize != null\n          ? storedSize\n          : typeof defaultSize === 'number'\n            ? defaultSize\n            : 280;\n\n    return clampSize(initialSize, minSize, maxSize);\n  });\n\n  const extractedStyles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  // Merge styles with contentPadding support\n  const finalStyles = useMemo(\n    () =>\n      mergeStyles(\n        styles,\n        // oxlint-disable-next-line tasty/no-runtime-styles-mutation -- forwards the consumer's `contentPadding` prop\n        contentPadding != null ? { '$content-padding': contentPadding } : null,\n        extractedStyles,\n      ),\n    [extractedStyles, contentPadding, styles],\n  );\n\n  // Resolve user's maxSize to pixels for JS-level clamping.\n  // Percentage bounds belong to the inline host, not the dialog's host.\n  const resolvedMax = useMemo(() => {\n    if (typeof maxSize === 'number') return maxSize;\n    if (\n      typeof maxSize === 'string' &&\n      containerDimension > 0 &&\n      (!isDialogMode || !maxSize.trim().endsWith('%'))\n    ) {\n      return resolveCssSize(maxSize, containerDimension);\n    }\n    return undefined;\n  }, [maxSize, containerDimension, isDialogMode]);\n\n  // Effective max combines user's maxSize with natural boundary\n  const effectiveMax = useMemo(() => {\n    const values: number[] = [];\n    if (resolvedMax != null) values.push(resolvedMax);\n    if (Number.isFinite(naturalMax)) values.push(naturalMax);\n    return values.length > 0 ? Math.min(...values) : undefined;\n  }, [resolvedMax, naturalMax]);\n\n  // Clamp size to min/max constraints (including natural boundaries)\n  const clampValue = useCallback(\n    (value: number) => clampSize(value, minSize, undefined, effectiveMax),\n    [minSize, effectiveMax],\n  );\n\n  const setContextDragging = layoutActions.setDragging;\n\n  const { moveProps } = useMove({\n    onMoveStart() {\n      if (!isResizable || isDialogMode) return;\n      setIsDragging(true);\n      setContextDragging(true);\n    },\n    onMove(e) {\n      if (!isResizable || isDialogMode) 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        // For keyboard, deltaX/deltaY are direction indicators (-1, 0, 1)\n        const rawDelta = isHorizontal ? e.deltaX : e.deltaY;\n        const direction = side === 'right' || side === 'bottom' ? -1 : 1;\n        delta = rawDelta * step * direction;\n      } else {\n        // Pointer resize: use exact delta values\n        delta = isHorizontal\n          ? e.deltaX * (side === 'right' ? -1 : 1)\n          : e.deltaY * (side === 'bottom' ? -1 : 1);\n      }\n\n      setSize((currentSize) => clampValue(currentSize + delta));\n    },\n    onMoveEnd() {\n      setIsDragging(false);\n      setContextDragging(false);\n      if (isDialogMode && !isDragging) return;\n      // Round to integer on release and notify parent\n      setSize((currentSize) => {\n        const finalSize = Math.round(clampValue(currentSize));\n        // Call onSizeChange synchronously to ensure parent state is updated\n        onSizeChange?.(finalSize);\n        // Persist to localStorage if key is provided\n        setStoredSize(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      if (\n        !isDialogMode &&\n        !matchesContainerSize(\n          layoutRefs.panelContainerRef.current?.parentElement,\n          isHorizontal,\n          containerDimension,\n        )\n      ) {\n        return;\n      }\n\n      prevProvidedSizeRef.current = providedSize;\n      if (typeof providedSize === 'number' && !isDragging) {\n        setSize(clampValue(providedSize));\n      }\n    }\n  }, [\n    providedSize,\n    isDragging,\n    clampValue,\n    isDialogMode,\n    isHorizontal,\n    containerDimension,\n    layoutRefs.panelContainerRef,\n  ]);\n\n  // Dialogs retain inline size; only inline panels follow the host's bounds.\n  const applyInlineBounds = useEffectEvent(() => {\n    if (\n      !matchesContainerSize(\n        layoutRefs.panelContainerRef.current?.parentElement,\n        isHorizontal,\n        containerDimension,\n      )\n    ) {\n      return;\n    }\n\n    setSize((prev) => {\n      const clamped = clampValue(prev);\n\n      if (clamped !== prev) {\n        onSizeChange?.(Math.round(clamped));\n        setStoredSize(Math.round(clamped));\n      }\n\n      return clamped;\n    });\n  });\n\n  useEffect(() => {\n    if (!isDialogMode && !isDragging && containerDimension > 0) {\n      // In an iframe ResizeObserver can precede responsive mode delivery.\n      // Let that mode settle before shrinking and persisting the inline size.\n      const frame = requestAnimationFrame(() => applyInlineBounds());\n      return () => cancelAnimationFrame(frame);\n    }\n  }, [\n    isDialogMode,\n    isDragging,\n    clampValue,\n    containerDimension,\n    isHorizontal,\n    layoutRefs.panelContainerRef,\n  ]);\n\n  // Register panel with layout context\n  // Include handler outside portion (minus border overlap) for proper content inset\n  // In sticky, overlay, and dialog modes, panel doesn't push content, so size is 0\n  // NOTE: We intentionally use `size` (not `clampValue(size)`) here to avoid a feedback\n  // loop. `clampValue` depends on the opposite panel's context size, so clamping here\n  // would create a period-2 oscillation through shared context. CSS --max-size handles\n  // visual clamping immediately; the auto-shrink effect converges `size` state.\n  const effectivePanelSize = isPanelShown && mode === 'default' ? size : 0;\n  const effectiveInsetSize = Math.round(\n    effectivePanelSize +\n      (isResizable && effectivePanelSize > 0 ? RESIZABLE_INSET_OFFSET : 0),\n  );\n\n  const { registerPanel, unregisterPanel, updatePanelSize } = layoutActions;\n  const { isReady } = layoutState;\n\n  // Track the last reported size to prevent unnecessary updates\n  const lastSizeRef = useRef<number>(effectiveInsetSize);\n\n  // Register on mount, unregister on unmount\n  // Using useLayoutEffect ensures registration happens before browser paint\n  useLayoutEffect(() => {\n    registerPanel(side, lastSizeRef.current);\n\n    return () => {\n      unregisterPanel(side);\n    };\n  }, [side, registerPanel, unregisterPanel]);\n\n  // Update size when it changes (after initial mount)\n  // Using useLayoutEffect ensures size updates happen before browser paint\n  useLayoutEffect(() => {\n    if (lastSizeRef.current !== effectiveInsetSize) {\n      lastSizeRef.current = effectiveInsetSize;\n      updatePanelSize(side, effectiveInsetSize);\n    }\n  }, [side, effectiveInsetSize, updatePanelSize]);\n\n  // One close per task: a consumer that moves focus into the main content in\n  // `onOpenChange(false)` would otherwise dismiss the still-registered panel\n  // a second time.\n  const closeRequestedRef = useRef(false);\n\n  const handleOpenChange = useCallback(\n    (newIsOpen: boolean) => {\n      if (!newIsOpen) {\n        if (closeRequestedRef.current) return;\n\n        closeRequestedRef.current = true;\n        queueMicrotask(() => {\n          closeRequestedRef.current = false;\n        });\n      }\n\n      setInternalIsOpen(newIsOpen);\n      onOpenChange?.(newIsOpen);\n    },\n    [onOpenChange],\n  );\n\n  // Dismiss handler for overlay mode (click on overlay)\n  const handleDismiss = useCallback(() => {\n    if (isDismissable) {\n      handleOpenChange(false);\n    }\n  }, [isDismissable, handleOpenChange]);\n\n  // Register overlay panel with Layout context for coordinated dismissal\n  const { registerOverlayPanel } = layoutActions;\n\n  useEffect(() => {\n    // Only register if in overlay mode, open, and dismissable\n    if (isOverlayMode && isOpen && isDismissable) {\n      const unregister = registerOverlayPanel(() => handleOpenChange(false));\n      return unregister;\n    }\n  }, [\n    isOverlayMode,\n    isOpen,\n    isDismissable,\n    registerOverlayPanel,\n    handleOpenChange,\n  ]);\n\n  // Overlay focus: move into the panel on open, back to the opener on close.\n  // Declared after the registration effect on purpose: its cleanup then runs\n  // after the panel unregisters, so a restore into the main content dismisses\n  // nothing.\n  const openerRef = useRef<Element | null>(null);\n  const panelNodeRef = useRef<HTMLDivElement | null>(null);\n  // Focus as the panel shows (its contents may mount now), before a native\n  // `autoFocus` inside them moves it (see OpenerProbe).\n  const mountFocusRef = useRef<Element | null>(null);\n\n  // A panel open on the Layout's first render leaves page focus alone.\n  const recordOpener = useEffectEvent(() => {\n    const active =\n      mountFocusRef.current ??\n      panelNodeRef.current?.ownerDocument.activeElement ??\n      null;\n\n    mountFocusRef.current = null;\n\n    openerRef.current =\n      isOverlayMode && isReady && !panelNodeRef.current?.contains(active)\n        ? active\n        : null;\n  });\n\n  const moveFocusIn = useEffectEvent(() => {\n    const panel = panelNodeRef.current;\n    const opener = openerRef.current;\n\n    const active = panel?.ownerDocument.activeElement;\n\n    // Focus already moved elsewhere as the panel opened, such as to a field\n    // with `autoFocus` inside it: leave it there. Focus another overlay panel just\n    // returned, as it closed in the same commit, does not count.\n    if (\n      !panel ||\n      !opener ||\n      (active !== opener && active !== lastReturnedFocus)\n    ) {\n      return;\n    }\n\n    const target =\n      getFocusableTreeWalker(panel, { tabbable: true }).nextNode() ??\n      getFocusableTreeWalker(panel).nextNode();\n\n    // The panel enters translated offscreen, so focus must not scroll.\n    focusProgrammatically(target as HTMLElement | null, {\n      preventScroll: true,\n    });\n  });\n\n  // Return focus only if it is still in the panel or was lost with it; focus\n  // the user or the consumer moved elsewhere stays there.\n  const returnFocus = useEffectEvent(() => {\n    const opener = openerRef.current;\n    const panel = panelNodeRef.current;\n\n    openerRef.current = null;\n\n    if (\n      !isOverlayMode ||\n      !(opener instanceof HTMLElement) ||\n      !opener.isConnected ||\n      opener === opener.ownerDocument.body\n    ) {\n      return;\n    }\n\n    const active = opener.ownerDocument.activeElement;\n\n    if (\n      active != null &&\n      active !== opener.ownerDocument.body &&\n      !panel?.contains(active)\n    ) {\n      return;\n    }\n\n    focusProgrammatically(opener, { preventScroll: true });\n    lastReturnedFocus = opener;\n    queueMicrotask(() => {\n      lastReturnedFocus = null;\n    });\n  });\n\n  useLayoutEffect(() => {\n    if (isOpen) recordOpener();\n  }, [isOpen]);\n\n  // Passive, so a menu item that refocuses itself while closing its menu has\n  // done so before focus moves in.\n  useEffect(() => {\n    if (!isOpen) return;\n\n    moveFocusIn();\n\n    return () => returnFocus();\n  }, [isOpen]);\n\n  const handleDialogOpenChange = useCallback(\n    (newIsOpen: boolean) => {\n      setInternalIsDialogOpen(newIsOpen);\n      onDialogOpenChange?.(newIsOpen);\n    },\n    [onDialogOpenChange],\n  );\n\n  // Panel context value for child components (like LayoutPanelHeader)\n  const panelContextValue = useMemo(\n    () => ({\n      onOpenChange: handleOpenChange,\n      isOpen,\n    }),\n    [handleOpenChange, isOpen],\n  );\n\n  // Dialog mode context value - uses dialog state instead of panel state\n  const dialogPanelContextValue = useMemo(\n    () => ({\n      onOpenChange: handleDialogOpenChange,\n      isOpen: dialogOpen,\n    }),\n    [handleDialogOpenChange, dialogOpen],\n  );\n\n  const panelMods = useMemo(\n    () => ({\n      side,\n      drag: isDragging,\n      horizontal: isHorizontal,\n      // Only enable transition after layout is ready to prevent initial animation\n      'has-transition': hasTransition && isReady,\n      ...mods,\n    }),\n    [side, isDragging, isHorizontal, hasTransition, isReady, mods],\n  );\n\n  // Build --max-size CSS variable combining user maxSize and natural boundary\n  const maxSizeCss = useMemo(() => {\n    const parts: string[] = [];\n\n    if (maxSize != null) {\n      parts.push(typeof maxSize === 'number' ? `${maxSize}px` : maxSize);\n    }\n\n    if (containerDimension > 0 && Number.isFinite(naturalMax)) {\n      parts.push(`${naturalMax}px`);\n    }\n\n    if (parts.length === 0) return undefined;\n    return parts.length === 1 ? parts[0] : `min(${parts.join(', ')})`;\n  }, [maxSize, naturalMax, containerDimension]);\n\n  const panelTokens = useMemo(\n    () => ({\n      '$panel-size': `${size}px`,\n      '$min-size': typeof minSize === 'number' ? `${minSize}px` : minSize,\n      '$max-size': maxSizeCss,\n    }),\n    [size, minSize, maxSizeCss],\n  );\n\n  // Combine refs for panel element\n  const panelRefCallback = useCallback(\n    (node: HTMLDivElement | null, transitionRef?: RefCallback<HTMLElement>) => {\n      // Update the combined ref\n      (combinedRef as { current: HTMLDivElement | null }).current = node;\n      // Call transition ref if provided\n      transitionRef?.(node);\n    },\n    [combinedRef],\n  );\n\n  // Reset to default size on double-click\n  const handleResetSize = useCallback(() => {\n    const resetSize =\n      typeof defaultSize === 'number' ? defaultSize : parseInt(defaultSize, 10);\n    const clampedSize = clampValue(resetSize || 280);\n    setSize(clampedSize);\n    onSizeChange?.(clampedSize);\n    setStoredSize(clampedSize);\n  }, [defaultSize, clampValue, onSizeChange, setStoredSize]);\n\n  // `isHidden` keeps the element tree of an open panel, so content never remounts.\n  // Without a transition, a rendered closed panel is a hidden one.\n  const renderPanelContent = (\n    offscreen = false,\n    transitionRef?: RefCallback<HTMLElement>,\n    isHidden = !isOpen,\n  ) => {\n    const showOverlay = isOverlayMode && !offscreen;\n\n    return (\n      <>\n        {/* Mounted only while shown, so an open from hidden reads live focus. */}\n        {isOverlayMode && !isHidden && <OpenerProbe focusRef={mountFocusRef} />}\n        {/* Overlay backdrop for overlay mode */}\n        {isOverlayMode && !isHidden && (\n          <OverlayBackdrop\n            mods={{ visible: showOverlay }}\n            styles={overlayStyles}\n            aria-hidden=\"true\"\n            onClick={handleDismiss}\n          />\n        )}\n        <PanelElement\n          ref={(node: HTMLDivElement | null) => {\n            // Kept after detach: StrictMode detaches refs before it replays\n            // the effects that still need the panel.\n            if (node) panelNodeRef.current = node;\n            panelRefCallback(node, transitionRef);\n          }}\n          {...filterBaseProps(otherProps, { eventProps: true })}\n          mods={{ ...panelMods, offscreen, hidden: isHidden }}\n          styles={finalStyles}\n          tokens={panelTokens}\n          data-side={side}\n        >\n          <LayoutPanelContext.Provider value={panelContextValue}>\n            <LayoutContextReset>{children}</LayoutContextReset>\n          </LayoutPanelContext.Provider>\n        </PanelElement>\n        {isResizable && !isHidden && (\n          <ResizeHandler\n            side={side}\n            isDisabled={!isResizable}\n            mods={{\n              drag: isDragging,\n              offscreen,\n              'has-transition': hasTransition && isReady,\n            }}\n            moveProps={moveProps}\n            tokens={panelTokens}\n            onDoubleClick={handleResetSize}\n          />\n        )}\n      </>\n    );\n  };\n\n  // Dialog mode - uses its own portal via DialogContainer\n  if (isDialogMode) {\n    return (\n      <DialogContainer\n        isOpen={dialogOpen}\n        isDismissable={isDismissable}\n        hideOnClose={hideOnClose}\n        onDismiss={() => handleDialogOpenChange(false)}\n        {...dialogProps}\n      >\n        <Dialog isDismissable={false} styles={dialogStyles}>\n          <LayoutPanelContext.Provider value={dialogPanelContextValue}>\n            <LayoutContextReset>{children}</LayoutContextReset>\n          </LayoutPanelContext.Provider>\n        </Dialog>\n      </DialogContainer>\n    );\n  }\n\n  // Wait for portal container to be ready before rendering\n  if (!layoutRefs.isPanelContainerReady) {\n    return null;\n  }\n\n  const portalContainer = layoutRefs.panelContainerRef.current!;\n\n  // Panel with transition - portal to panel container\n  if (hasTransition) {\n    return createPortal(\n      <DisplayTransition\n        isShown={isOpen}\n        animateOnMount={false}\n        exposeUnmounted={hideOnClose}\n        onToggle={(isShown) => setVisualState({ isShown, isTransitionActive })}\n      >\n        {({ phase, isShown, isExiting, ref: transitionRef }) => {\n          const isHidden = phase === 'unmounted';\n\n          return (\n            <LayoutPanelTransition\n              isShown={isShown}\n              isExiting={isExiting}\n              isHidden={isHidden}\n            >\n              {renderPanelContent(!isShown, transitionRef, isHidden)}\n            </LayoutPanelTransition>\n          );\n        }}\n      </DisplayTransition>,\n      portalContainer,\n    );\n  }\n\n  // Simple panel (no transition) - portal to panel container\n  if (!isOpen && !hideOnClose) return null;\n\n  return createPortal(renderPanelContent(false), portalContainer);\n}\n\n// Focus another overlay panel returned in the current task.\nlet lastReturnedFocus: Element | null = null;\n\n// Rendered before the panel's contents, so its layout effect reads focus\n// before React applies a native `autoFocus` inside them.\nfunction OpenerProbe({ focusRef }: { focusRef: { current: Element | null } }) {\n  useLayoutEffect(() => {\n    focusRef.current = document.activeElement;\n  }, [focusRef]);\n\n  return null;\n}\n\nconst _LayoutPanel = forwardRef(LayoutPanel);\n\n_LayoutPanel.displayName = 'Layout.Panel';\n\nexport { _LayoutPanel as LayoutPanel };\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { useI18n } from "../../../i18n/useI18n.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { LayoutPanelTransitionContext, useLayoutRefsContext } from "./LayoutContext.js";
 import { c } from "react/compiler-runtime";
 import { useContext, useLayoutEffect, useState } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { LayoutContent as _LayoutContent } from "./LayoutContent.js";
 import { c } from "react/compiler-runtime";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Layout/hooks/useTinyScrollbar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { c } from "react/compiler-runtime";
 import { useEffect, useRef, useState } from "react";
 //#region src/components/content/Layout/hooks/useTinyScrollbar.ts
@@ -176,32 +176,30 @@ function useTinyScrollbar(ref, enabled) {
 	let t10;
 	if ($[18] !== t8 || $[19] !== t9) {
 		t10 = {
-			"--scrollbar-v-top": t8,
-			"--scrollbar-v-height": t9
+			"$scrollbar-v-top": t8,
+			"$scrollbar-v-height": t9
 		};
 		$[18] = t8;
 		$[19] = t9;
 		$[20] = t10;
 	} else t10 = $[20];
-	const t11 = t10;
-	const t12 = `${hHandle.left}px`;
-	const t13 = `${hHandle.width}px`;
+	const t11 = `${hHandle.left}px`;
+	const t12 = `${hHandle.width}px`;
+	let t13;
+	if ($[21] !== t11 || $[22] !== t12) {
+		t13 = {
+			"$scrollbar-h-left": t11,
+			"$scrollbar-h-width": t12
+		};
+		$[21] = t11;
+		$[22] = t12;
+		$[23] = t13;
+	} else t13 = $[23];
 	let t14;
-	if ($[21] !== t12 || $[22] !== t13) {
+	if ($[24] !== isAtEndX || $[25] !== isAtEndY || $[26] !== isAtStartX || $[27] !== isAtStartY || $[28] !== isScrolling || $[29] !== scrollState.hasOverflowX || $[30] !== scrollState.hasOverflowY || $[31] !== t10 || $[32] !== t13) {
 		t14 = {
-			"--scrollbar-h-left": t12,
-			"--scrollbar-h-width": t13
-		};
-		$[21] = t12;
-		$[22] = t13;
-		$[23] = t14;
-	} else t14 = $[23];
-	const t15 = t14;
-	let t16;
-	if ($[24] !== isAtEndX || $[25] !== isAtEndY || $[26] !== isAtStartX || $[27] !== isAtStartY || $[28] !== isScrolling || $[29] !== scrollState.hasOverflowX || $[30] !== scrollState.hasOverflowY || $[31] !== t11 || $[32] !== t15) {
-		t16 = {
-			handleVStyle: t11,
-			handleHStyle: t15,
+			handleVTokens: t10,
+			handleHTokens: t13,
 			hasOverflowY: scrollState.hasOverflowY,
 			hasOverflowX: scrollState.hasOverflowX,
 			isScrolling,
@@ -217,11 +215,11 @@ function useTinyScrollbar(ref, enabled) {
 		$[28] = isScrolling;
 		$[29] = scrollState.hasOverflowX;
 		$[30] = scrollState.hasOverflowY;
-		$[31] = t11;
-		$[32] = t15;
-		$[33] = t16;
-	} else t16 = $[33];
-	return t16;
+		$[31] = t10;
+		$[32] = t13;
+		$[33] = t14;
+	} else t14 = $[33];
+	return t14;
 }
 //#endregion
 export { useTinyScrollbar };

package/dist/components/content/Layout/hooks/useTinyScrollbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTinyScrollbar.js","names":["CSSProperties","RefObject","useCallback","useEffect","useRef","useState","TinyScrollbarState","hasOverflowY","hasOverflowX","scrollTop","scrollLeft","scrollHeight","scrollWidth","clientHeight","clientWidth","TinyScrollbarResult","handleVStyle","handleHStyle","isScrolling","isAtStartX","isAtStartY","isAtEndX","isAtEndY","MIN_HANDLE_SIZE","SCROLL_VISIBILITY_DURATION","OVERFLOW_THRESHOLD","useTinyScrollbar","ref","enabled","$","_c","t0","Symbol","for","scrollState","setScrollState","setIsScrolling","scrollTimeoutRef","resizeFrameRef","t1","element","current","prev","updateScrollState","t2","t3","element_0","showScrollbarBriefly","clearTimeout","setTimeout","handleScroll","handleMouseEnter","addEventListener","passive","resizeObserver","ResizeObserver","cancelAnimationFrame","requestAnimationFrame","observe","removeEventListener","disconnect","t4","scrollHeight_0","clientHeight_0","scrollTop_0","hasOverflowY_0","top","height","trackHeight","ratio","handleHeight","Math","max","round","availableTrack","scrollRatio","handleTop","calculateVHandle","t5","scrollWidth_0","clientWidth_0","scrollLeft_0","hasOverflowX_0","left","width","trackWidth","ratio_0","handleWidth","availableTrack_0","scrollRatio_0","handleLeft","calculateHHandle","t6","vHandle","t7","hHandle","scrollTop_1","scrollLeft_1","scrollHeight_1","scrollWidth_1","clientHeight_1","clientWidth_1","hasOverflowY_1","hasOverflowX_1","t8","t9","t10","t11","t12","t13","t14","t15","t16","_c"],"sources":["../../../../../src/components/content/Layout/hooks/useTinyScrollbar.ts"],"sourcesContent":["import {\n  CSSProperties,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nexport interface TinyScrollbarState {\n  hasOverflowY: boolean;\n  hasOverflowX: boolean;\n  scrollTop: number;\n  scrollLeft: number;\n  scrollHeight: number;\n  scrollWidth: number;\n  clientHeight: number;\n  clientWidth: number;\n}\n\nexport interface TinyScrollbarResult {\n  handleVStyle: CSSProperties;\n  handleHStyle: CSSProperties;\n  hasOverflowY: boolean;\n  hasOverflowX: boolean;\n  isScrolling: boolean;\n  /** Whether scroll is at the start edge (top for Y, left for X) */\n  isAtStartX: boolean;\n  isAtStartY: boolean;\n  /** Whether scroll is at the end edge (bottom for Y, right for X) */\n  isAtEndX: boolean;\n  isAtEndY: boolean;\n}\n\nconst MIN_HANDLE_SIZE = 20;\nconst SCROLL_VISIBILITY_DURATION = 1000;\n// Threshold to prevent overflow oscillation at boundary\nconst OVERFLOW_THRESHOLD = 2;\n\nexport function useTinyScrollbar(\n  ref: RefObject<HTMLElement | null>,\n  enabled: boolean,\n): TinyScrollbarResult {\n  const [scrollState, setScrollState] = useState<TinyScrollbarState>({\n    hasOverflowY: false,\n    hasOverflowX: false,\n    scrollTop: 0,\n    scrollLeft: 0,\n    scrollHeight: 0,\n    scrollWidth: 0,\n    clientHeight: 0,\n    clientWidth: 0,\n  });\n  const [isScrolling, setIsScrolling] = useState(false);\n  const scrollTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const resizeFrameRef = useRef<number | null>(null);\n\n  const updateScrollState = useCallback(() => {\n    const element = ref.current;\n\n    if (!element) return;\n\n    const {\n      scrollTop,\n      scrollLeft,\n      scrollHeight,\n      scrollWidth,\n      clientHeight,\n      clientWidth,\n    } = element;\n\n    // Use threshold to prevent oscillation at overflow boundary\n    const hasOverflowY = scrollHeight > clientHeight + OVERFLOW_THRESHOLD;\n    const hasOverflowX = scrollWidth > clientWidth + OVERFLOW_THRESHOLD;\n\n    setScrollState((prev) => {\n      // Only update if values actually changed to prevent unnecessary re-renders\n      if (\n        prev.hasOverflowY === hasOverflowY &&\n        prev.hasOverflowX === hasOverflowX &&\n        prev.scrollTop === scrollTop &&\n        prev.scrollLeft === scrollLeft &&\n        prev.scrollHeight === scrollHeight &&\n        prev.scrollWidth === scrollWidth &&\n        prev.clientHeight === clientHeight &&\n        prev.clientWidth === clientWidth\n      ) {\n        return prev; // Return same reference to skip re-render\n      }\n\n      return {\n        hasOverflowY,\n        hasOverflowX,\n        scrollTop,\n        scrollLeft,\n        scrollHeight,\n        scrollWidth,\n        clientHeight,\n        clientWidth,\n      };\n    });\n  }, [ref]);\n\n  useEffect(() => {\n    if (!enabled) return;\n\n    const element = ref.current;\n\n    if (!element) return;\n\n    // Initial update\n    updateScrollState();\n\n    // Show scrollbar briefly and hide after delay\n    const showScrollbarBriefly = () => {\n      setIsScrolling(true);\n\n      // Clear existing timeout\n      if (scrollTimeoutRef.current) {\n        clearTimeout(scrollTimeoutRef.current);\n      }\n\n      // Hide scrollbar after delay\n      scrollTimeoutRef.current = setTimeout(() => {\n        setIsScrolling(false);\n      }, SCROLL_VISIBILITY_DURATION);\n    };\n\n    // Listen for scroll events\n    const handleScroll = () => {\n      updateScrollState();\n      showScrollbarBriefly();\n    };\n\n    // Show scrollbar briefly when mouse enters the container\n    const handleMouseEnter = () => {\n      showScrollbarBriefly();\n    };\n\n    element.addEventListener('scroll', handleScroll, { passive: true });\n    element.addEventListener('mouseenter', handleMouseEnter);\n\n    // ResizeObserver for content size changes\n    // Uses requestAnimationFrame to coalesce updates and prevent cascading events\n    const resizeObserver = new ResizeObserver(() => {\n      if (resizeFrameRef.current) {\n        cancelAnimationFrame(resizeFrameRef.current);\n      }\n\n      resizeFrameRef.current = requestAnimationFrame(() => {\n        updateScrollState();\n        showScrollbarBriefly();\n      });\n    });\n\n    resizeObserver.observe(element);\n\n    // Note: We intentionally don't observe children to prevent\n    // cascading resize events in nested layouts\n\n    return () => {\n      element.removeEventListener('scroll', handleScroll);\n      element.removeEventListener('mouseenter', handleMouseEnter);\n      resizeObserver.disconnect();\n\n      if (scrollTimeoutRef.current) {\n        clearTimeout(scrollTimeoutRef.current);\n      }\n\n      if (resizeFrameRef.current) {\n        cancelAnimationFrame(resizeFrameRef.current);\n      }\n    };\n  }, [enabled, ref, updateScrollState]);\n\n  // Calculate vertical handle position and size\n  const calculateVHandle = () => {\n    const { scrollHeight, clientHeight, scrollTop, hasOverflowY } = scrollState;\n\n    if (!hasOverflowY || !enabled) {\n      return { top: 0, height: 0 };\n    }\n\n    const trackHeight = clientHeight - 2; // 1px padding on each end\n    const ratio = clientHeight / scrollHeight;\n    let handleHeight = Math.max(\n      MIN_HANDLE_SIZE,\n      Math.round(trackHeight * ratio),\n    );\n    const availableTrack = trackHeight - handleHeight;\n    const scrollRatio =\n      scrollHeight - clientHeight > 0\n        ? scrollTop / (scrollHeight - clientHeight)\n        : 0;\n    const handleTop = 1 + Math.round(availableTrack * scrollRatio);\n\n    return { top: handleTop, height: handleHeight };\n  };\n\n  // Calculate horizontal handle position and size\n  const calculateHHandle = () => {\n    const { scrollWidth, clientWidth, scrollLeft, hasOverflowX } = scrollState;\n\n    if (!hasOverflowX || !enabled) {\n      return { left: 0, width: 0 };\n    }\n\n    const trackWidth = clientWidth - 2; // 1px padding on each end\n    const ratio = clientWidth / scrollWidth;\n    let handleWidth = Math.max(MIN_HANDLE_SIZE, Math.round(trackWidth * ratio));\n    const availableTrack = trackWidth - handleWidth;\n    const scrollRatio =\n      scrollWidth - clientWidth > 0\n        ? scrollLeft / (scrollWidth - clientWidth)\n        : 0;\n    const handleLeft = 1 + Math.round(availableTrack * scrollRatio);\n\n    return { left: handleLeft, width: handleWidth };\n  };\n\n  const vHandle = calculateVHandle();\n  const hHandle = calculateHHandle();\n\n  // Calculate edge detection\n  const {\n    scrollTop,\n    scrollLeft,\n    scrollHeight,\n    scrollWidth,\n    clientHeight,\n    clientWidth,\n    hasOverflowY,\n    hasOverflowX,\n  } = scrollState;\n\n  // For Y axis: at start if scrollTop is 0, at end if scrolled to bottom\n  const isAtStartY = !hasOverflowY || scrollTop <= 0;\n  const isAtEndY =\n    !hasOverflowY || scrollTop >= scrollHeight - clientHeight - 1;\n\n  // For X axis: at start if scrollLeft is 0, at end if scrolled to right\n  const isAtStartX = !hasOverflowX || scrollLeft <= 0;\n  const isAtEndX = !hasOverflowX || scrollLeft >= scrollWidth - clientWidth - 1;\n\n  return {\n    handleVStyle: {\n      '--scrollbar-v-top': `${vHandle.top}px`,\n      '--scrollbar-v-height': `${vHandle.height}px`,\n    } as CSSProperties,\n    handleHStyle: {\n      '--scrollbar-h-left': `${hHandle.left}px`,\n      '--scrollbar-h-width': `${hHandle.width}px`,\n    } as CSSProperties,\n    hasOverflowY: scrollState.hasOverflowY,\n    hasOverflowX: scrollState.hasOverflowX,\n    isScrolling,\n    isAtStartX,\n    isAtStartY,\n    isAtEndX,\n    isAtEndY,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"useTinyScrollbar.js","names":["RefObject","useCallback","useEffect","useRef","useState","Tokens","TinyScrollbarState","hasOverflowY","hasOverflowX","scrollTop","scrollLeft","scrollHeight","scrollWidth","clientHeight","clientWidth","TinyScrollbarResult","handleVTokens","handleHTokens","isScrolling","isAtStartX","isAtStartY","isAtEndX","isAtEndY","MIN_HANDLE_SIZE","SCROLL_VISIBILITY_DURATION","OVERFLOW_THRESHOLD","useTinyScrollbar","ref","enabled","$","_c","t0","Symbol","for","scrollState","setScrollState","setIsScrolling","scrollTimeoutRef","resizeFrameRef","t1","element","current","prev","updateScrollState","t2","t3","element_0","showScrollbarBriefly","clearTimeout","setTimeout","handleScroll","handleMouseEnter","addEventListener","passive","resizeObserver","ResizeObserver","cancelAnimationFrame","requestAnimationFrame","observe","removeEventListener","disconnect","t4","scrollHeight_0","clientHeight_0","scrollTop_0","hasOverflowY_0","top","height","trackHeight","ratio","handleHeight","Math","max","round","availableTrack","scrollRatio","handleTop","calculateVHandle","t5","scrollWidth_0","clientWidth_0","scrollLeft_0","hasOverflowX_0","left","width","trackWidth","ratio_0","handleWidth","availableTrack_0","scrollRatio_0","handleLeft","calculateHHandle","t6","vHandle","t7","hHandle","scrollTop_1","scrollLeft_1","scrollHeight_1","scrollWidth_1","clientHeight_1","clientWidth_1","hasOverflowY_1","hasOverflowX_1","t8","t9","t10","t11","t12","t13","t14","_c"],"sources":["../../../../../src/components/content/Layout/hooks/useTinyScrollbar.ts"],"sourcesContent":["import { RefObject, useCallback, useEffect, useRef, useState } from 'react';\n\nimport type { Tokens } from '@tenphi/tasty';\n\nexport interface TinyScrollbarState {\n  hasOverflowY: boolean;\n  hasOverflowX: boolean;\n  scrollTop: number;\n  scrollLeft: number;\n  scrollHeight: number;\n  scrollWidth: number;\n  clientHeight: number;\n  clientWidth: number;\n}\n\nexport interface TinyScrollbarResult {\n  handleVTokens: Tokens;\n  handleHTokens: Tokens;\n  hasOverflowY: boolean;\n  hasOverflowX: boolean;\n  isScrolling: boolean;\n  /** Whether scroll is at the start edge (top for Y, left for X) */\n  isAtStartX: boolean;\n  isAtStartY: boolean;\n  /** Whether scroll is at the end edge (bottom for Y, right for X) */\n  isAtEndX: boolean;\n  isAtEndY: boolean;\n}\n\nconst MIN_HANDLE_SIZE = 20;\nconst SCROLL_VISIBILITY_DURATION = 1000;\n// Threshold to prevent overflow oscillation at boundary\nconst OVERFLOW_THRESHOLD = 2;\n\nexport function useTinyScrollbar(\n  ref: RefObject<HTMLElement | null>,\n  enabled: boolean,\n): TinyScrollbarResult {\n  const [scrollState, setScrollState] = useState<TinyScrollbarState>({\n    hasOverflowY: false,\n    hasOverflowX: false,\n    scrollTop: 0,\n    scrollLeft: 0,\n    scrollHeight: 0,\n    scrollWidth: 0,\n    clientHeight: 0,\n    clientWidth: 0,\n  });\n  const [isScrolling, setIsScrolling] = useState(false);\n  const scrollTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const resizeFrameRef = useRef<number | null>(null);\n\n  const updateScrollState = useCallback(() => {\n    const element = ref.current;\n\n    if (!element) return;\n\n    const {\n      scrollTop,\n      scrollLeft,\n      scrollHeight,\n      scrollWidth,\n      clientHeight,\n      clientWidth,\n    } = element;\n\n    // Use threshold to prevent oscillation at overflow boundary\n    const hasOverflowY = scrollHeight > clientHeight + OVERFLOW_THRESHOLD;\n    const hasOverflowX = scrollWidth > clientWidth + OVERFLOW_THRESHOLD;\n\n    setScrollState((prev) => {\n      // Only update if values actually changed to prevent unnecessary re-renders\n      if (\n        prev.hasOverflowY === hasOverflowY &&\n        prev.hasOverflowX === hasOverflowX &&\n        prev.scrollTop === scrollTop &&\n        prev.scrollLeft === scrollLeft &&\n        prev.scrollHeight === scrollHeight &&\n        prev.scrollWidth === scrollWidth &&\n        prev.clientHeight === clientHeight &&\n        prev.clientWidth === clientWidth\n      ) {\n        return prev; // Return same reference to skip re-render\n      }\n\n      return {\n        hasOverflowY,\n        hasOverflowX,\n        scrollTop,\n        scrollLeft,\n        scrollHeight,\n        scrollWidth,\n        clientHeight,\n        clientWidth,\n      };\n    });\n  }, [ref]);\n\n  useEffect(() => {\n    if (!enabled) return;\n\n    const element = ref.current;\n\n    if (!element) return;\n\n    // Initial update\n    updateScrollState();\n\n    // Show scrollbar briefly and hide after delay\n    const showScrollbarBriefly = () => {\n      setIsScrolling(true);\n\n      // Clear existing timeout\n      if (scrollTimeoutRef.current) {\n        clearTimeout(scrollTimeoutRef.current);\n      }\n\n      // Hide scrollbar after delay\n      scrollTimeoutRef.current = setTimeout(() => {\n        setIsScrolling(false);\n      }, SCROLL_VISIBILITY_DURATION);\n    };\n\n    // Listen for scroll events\n    const handleScroll = () => {\n      updateScrollState();\n      showScrollbarBriefly();\n    };\n\n    // Show scrollbar briefly when mouse enters the container\n    const handleMouseEnter = () => {\n      showScrollbarBriefly();\n    };\n\n    element.addEventListener('scroll', handleScroll, { passive: true });\n    element.addEventListener('mouseenter', handleMouseEnter);\n\n    // ResizeObserver for content size changes\n    // Uses requestAnimationFrame to coalesce updates and prevent cascading events\n    const resizeObserver = new ResizeObserver(() => {\n      if (resizeFrameRef.current) {\n        cancelAnimationFrame(resizeFrameRef.current);\n      }\n\n      resizeFrameRef.current = requestAnimationFrame(() => {\n        updateScrollState();\n        showScrollbarBriefly();\n      });\n    });\n\n    resizeObserver.observe(element);\n\n    // Note: We intentionally don't observe children to prevent\n    // cascading resize events in nested layouts\n\n    return () => {\n      element.removeEventListener('scroll', handleScroll);\n      element.removeEventListener('mouseenter', handleMouseEnter);\n      resizeObserver.disconnect();\n\n      if (scrollTimeoutRef.current) {\n        clearTimeout(scrollTimeoutRef.current);\n      }\n\n      if (resizeFrameRef.current) {\n        cancelAnimationFrame(resizeFrameRef.current);\n      }\n    };\n  }, [enabled, ref, updateScrollState]);\n\n  // Calculate vertical handle position and size\n  const calculateVHandle = () => {\n    const { scrollHeight, clientHeight, scrollTop, hasOverflowY } = scrollState;\n\n    if (!hasOverflowY || !enabled) {\n      return { top: 0, height: 0 };\n    }\n\n    const trackHeight = clientHeight - 2; // 1px padding on each end\n    const ratio = clientHeight / scrollHeight;\n    let handleHeight = Math.max(\n      MIN_HANDLE_SIZE,\n      Math.round(trackHeight * ratio),\n    );\n    const availableTrack = trackHeight - handleHeight;\n    const scrollRatio =\n      scrollHeight - clientHeight > 0\n        ? scrollTop / (scrollHeight - clientHeight)\n        : 0;\n    const handleTop = 1 + Math.round(availableTrack * scrollRatio);\n\n    return { top: handleTop, height: handleHeight };\n  };\n\n  // Calculate horizontal handle position and size\n  const calculateHHandle = () => {\n    const { scrollWidth, clientWidth, scrollLeft, hasOverflowX } = scrollState;\n\n    if (!hasOverflowX || !enabled) {\n      return { left: 0, width: 0 };\n    }\n\n    const trackWidth = clientWidth - 2; // 1px padding on each end\n    const ratio = clientWidth / scrollWidth;\n    let handleWidth = Math.max(MIN_HANDLE_SIZE, Math.round(trackWidth * ratio));\n    const availableTrack = trackWidth - handleWidth;\n    const scrollRatio =\n      scrollWidth - clientWidth > 0\n        ? scrollLeft / (scrollWidth - clientWidth)\n        : 0;\n    const handleLeft = 1 + Math.round(availableTrack * scrollRatio);\n\n    return { left: handleLeft, width: handleWidth };\n  };\n\n  const vHandle = calculateVHandle();\n  const hHandle = calculateHHandle();\n\n  // Calculate edge detection\n  const {\n    scrollTop,\n    scrollLeft,\n    scrollHeight,\n    scrollWidth,\n    clientHeight,\n    clientWidth,\n    hasOverflowY,\n    hasOverflowX,\n  } = scrollState;\n\n  // For Y axis: at start if scrollTop is 0, at end if scrolled to bottom\n  const isAtStartY = !hasOverflowY || scrollTop <= 0;\n  const isAtEndY =\n    !hasOverflowY || scrollTop >= scrollHeight - clientHeight - 1;\n\n  // For X axis: at start if scrollLeft is 0, at end if scrolled to right\n  const isAtStartX = !hasOverflowX || scrollLeft <= 0;\n  const isAtEndX = !hasOverflowX || scrollLeft >= scrollWidth - clientWidth - 1;\n\n  return {\n    handleVTokens: {\n      '$scrollbar-v-top': `${vHandle.top}px`,\n      '$scrollbar-v-height': `${vHandle.height}px`,\n    },\n    handleHTokens: {\n      '$scrollbar-h-left': `${hHandle.left}px`,\n      '$scrollbar-h-width': `${hHandle.width}px`,\n    },\n    hasOverflowY: scrollState.hasOverflowY,\n    hasOverflowX: scrollState.hasOverflowX,\n    isScrolling,\n    isAtStartX,\n    isAtStartY,\n    isAtEndX,\n    isAtEndY,\n  };\n}\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import "./LayoutContext.js";
 import { Layout as _Layout } from "./Layout.js";
 import { LayoutContent as _LayoutContent } from "./LayoutContent.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 //#region src/components/content/Layout/utils.ts
 /**
 * Clamps a size value within min/max constraints.

package/dist/components/content/Paragraph.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { Text as _Text } from "./Text.js";
 import { c } from "react/compiler-runtime";

package/dist/components/content/Placeholder/Placeholder.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles, mergeStyleLayers } from "../../../utils/styles.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { c } from "react/compiler-runtime";

package/dist/components/content/Placeholder/Placeholder.js.map

@@ -1 +1 @@
-{"version":3,"file":"Placeholder.js","names":["BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","keyframes","Styles","tasty","createContext","forwardRef","useContext","useI18n","extractStyles","mergeStyleLayers","placeholderAnimation","StyledPlaceholder","styles","display","height","opacity","aspectRatio","circle","radius","backgroundRepeat","backgroundSize","fill","animation","animated","image","PlaceholderGroupContext","CubePlaceholderProps","size","isStatic","Placeholder","allProps","ref","$","_c","t0","props","undefined","t","isInGroup","T0","t1","role","t2","eventProps","t3","t4","t5","t6","t7","_c"],"sources":["../../../../src/components/content/Placeholder/Placeholder.tsx"],"sourcesContent":["import {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  keyframes,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { createContext, forwardRef, useContext } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { extractStyles, mergeStyleLayers } from '../../../utils/styles';\n\n// Create the placeholder animation using keyframes helper\nconst placeholderAnimation = keyframes({\n  '0%': {\n    'background-position': '0 0',\n  },\n  '100%': {\n    'background-position': '$placeholder-animation-size 0',\n  },\n});\n\nconst StyledPlaceholder = tasty({\n  styles: {\n    display: 'block',\n    height: '2x',\n    opacity: '.35',\n    aspectRatio: {\n      '': 'initial',\n      circle: '1 / 1',\n    },\n    radius: {\n      '': '1r',\n      circle: 'round',\n    },\n\n    // CSS custom properties for animation\n    '$placeholder-animation-time': '1.4s',\n    '$placeholder-animation-size': 'calc((180rem + 100vw) / 3)',\n\n    // Base background styling\n    backgroundRepeat: 'repeat',\n    backgroundSize: '$placeholder-animation-size',\n    fill: '#dark.15',\n\n    // Animated state styling\n    animation: {\n      '': 'none',\n      animated: `${placeholderAnimation} $placeholder-animation-time linear infinite`,\n    },\n    image: {\n      '': 'none',\n      animated: `linear-gradient(\n        135deg,\n        #dark.15 0%,\n        #dark.15 5%,\n        #dark.0 35%,\n        #dark-03.2 50%,\n        #dark-03.0 65%,\n        #dark.15 95%,\n        #dark.15 100%\n      )`,\n    },\n  },\n});\n\n/**\n * Set by a component that says once that a whole group of placeholders is\n * loading — `Skeleton` is one region around all of its bars, and a table's\n * loading row is `aria-busy`. The placeholders inside are then decoration, and\n * stay out of the accessibility tree rather than each being a landmark of its\n * own.\n */\nexport const PlaceholderGroupContext = createContext(false);\n\nexport interface CubePlaceholderProps extends BaseProps, ContainerStyleProps {\n  size?: Styles['fontSize'];\n  circle?: boolean;\n  isStatic?: boolean;\n}\n\nexport const Placeholder = forwardRef(function Placeholder(\n  allProps: CubePlaceholderProps,\n  ref,\n) {\n  let { size = '2x', isStatic, circle, ...props } = allProps;\n\n  const { t } = useI18n();\n  const isInGroup = useContext(PlaceholderGroupContext);\n\n  let styles = extractStyles(props, CONTAINER_STYLES);\n\n  return (\n    <StyledPlaceholder\n      {...(isInGroup\n        ? { 'aria-hidden': true }\n        : {\n            role: 'region',\n            'aria-label': t(\n              'placeholder.contentIsLoading',\n              'Content is loading',\n            ),\n          })}\n      {...filterBaseProps(props, { eventProps: true })}\n      // The documented way to detect a loading placeholder. Fixed, so a\n      // caller's `qa` or a translated `aria-label` doesn't change it.\n      data-loading-placeholder=\"\"\n      ref={ref}\n      mods={{ animated: !isStatic, circle }}\n      styles={mergeStyleLayers({ height: size }, styles)}\n    />\n  );\n});\n"],"mappings":";;;;;;;;AAeA,MAAMa,uBAAuBT,UAAU;CACrC,MAAM,EACJ,uBAAuB,MACzB;CACA,QAAQ,EACN,uBAAuB,gCACzB;AACF,CAAC;AAED,MAAMU,oBAAoBR,MAAM,EAC9BS,QAAQ;CACNC,SAAS;CACTC,QAAQ;CACRC,SAAS;CACTC,aAAa;EACX,IAAI;EACJC,QAAQ;CACV;CACAC,QAAQ;EACN,IAAI;EACJD,QAAQ;CACV;CAGA,+BAA+B;CAC/B,+BAA+B;CAG/BE,kBAAkB;CAClBC,gBAAgB;CAChBC,MAAM;CAGNC,WAAW;EACT,IAAI;EACJC,UAAU,GAAGb,qBAAoB;CACnC;CACAc,OAAO;EACL,IAAI;EACJD,UAAU;;;;;;;;;;CAUZ;AACF,EACF,CAAC;;;;;;;;AASD,MAAaE,0BAA0BrB,cAAc,KAAK;AAQ1D,MAAayB,cAAcxB,WAAW,SAAAwB,YAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAIpC,MAAA,EAAAN,MAAAO,IAAAN,UAAAX,QAAA,GAAAkB,UAAkDL;CAA5C,MAAAH,OAAAO,OAAAE,KAAAA,IAAA,OAAAF;CAEN,MAAA,EAAAG,MAAc9B,QAAQ;CACtB,MAAA+B,YAAkBhC,WAAWmB,uBAAuB;CAEpD,MAAAb,SAAaJ,cAAc2B,OAAOrC,gBAAgB;CAG/C,MAAAyC,KAAA5B;CAAiB,IAAA6B;CAAA,IAAAR,EAAA,OAAAM,aAAAN,EAAA,OAAAK,GAAA;EACXG,KAAAF,YAAA,EAAA,eACgB,KAOjB,IARC;GAAAG,MAGO;GAAQ,cACAJ,EACZ,gCACA,oBACF;EACF;EAACL,EAAA,KAAAM;EAAAN,EAAA,KAAAK;EAAAL,EAAA,KAAAQ;CAAA,OAAAA,KAAAR,EAAA;CACD,MAAAU,KAAA1C,gBAAgBmC,OAAO,EAAAQ,YAAc,KAAK,CAAC;CAGtB,MAAAC,KAAA;CAEP,MAAAC,KAAA,CAACjB;CAAQ,IAAAkB;CAAA,IAAAd,EAAA,OAAAf,UAAAe,EAAA,OAAAa,IAAA;EAArBC,KAAA;GAAAvB,UAAYsB;GAAS5B;EAAS;EAACe,EAAA,KAAAf;EAAAe,EAAA,KAAAa;EAAAb,EAAA,KAAAc;CAAA,OAAAA,KAAAd,EAAA;CAC7B,MAAAe,KAAAtC,iBAAiB,EAAAK,QAAUa,KAAK,GAAGf,MAAM;CAAC,IAAAoC;CAAA,IAAAhB,EAAA,OAAAO,MAAAP,EAAA,OAAAD,OAAAC,EAAA,OAAAQ,MAAAR,EAAA,OAAAU,MAAAV,EAAA,QAAAc,MAAAd,EAAA,QAAAe,IAAA;EAhBpDC,KAAA,oBAAC,IAAD;GAAkB,GACXR;GAQA,GACDE;GAGqB,4BAAAE;GACpBb;GACC,MAAAe;GACE,QAAAC;EAA0C,CAAA;EAClDf,EAAA,KAAAO;EAAAP,EAAA,KAAAD;EAAAC,EAAA,KAAAQ;EAAAR,EAAA,KAAAU;EAAAV,EAAA,MAAAc;EAAAd,EAAA,MAAAe;EAAAf,EAAA,MAAAgB;CAAA,OAAAA,KAAAhB,EAAA;CAAA,OAjBFgB;AAiBE,CAEL"}
+{"version":3,"file":"Placeholder.js","names":["BaseProps","CONTAINER_STYLES","ContainerStyleProps","filterBaseProps","keyframes","Styles","tasty","createContext","forwardRef","useContext","useI18n","extractStyles","mergeStyleLayers","placeholderAnimation","StyledPlaceholder","styles","display","height","opacity","aspectRatio","circle","radius","backgroundRepeat","backgroundSize","fill","animation","animated","image","PlaceholderGroupContext","CubePlaceholderProps","size","isStatic","Placeholder","allProps","ref","$","_c","t0","props","undefined","t","isInGroup","T0","t1","role","t2","eventProps","t3","t4","t5","t6","t7","_c"],"sources":["../../../../src/components/content/Placeholder/Placeholder.tsx"],"sourcesContent":["import {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  keyframes,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { createContext, forwardRef, useContext } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { extractStyles, mergeStyleLayers } from '../../../utils/styles';\n\n// Create the placeholder animation using keyframes helper\nconst placeholderAnimation = keyframes({\n  '0%': {\n    'background-position': '0 0',\n  },\n  '100%': {\n    'background-position': '$placeholder-animation-size 0',\n  },\n});\n\nconst StyledPlaceholder = tasty({\n  styles: {\n    display: 'block',\n    height: '2x',\n    opacity: '.35',\n    aspectRatio: {\n      '': 'initial',\n      circle: '1 / 1',\n    },\n    radius: {\n      '': '1r',\n      circle: 'round',\n    },\n\n    // CSS custom properties for animation\n    '$placeholder-animation-time': '1.4s',\n    '$placeholder-animation-size': 'calc((180rem + 100vw) / 3)',\n\n    // Base background styling\n    backgroundRepeat: 'repeat',\n    backgroundSize: '$placeholder-animation-size',\n    fill: '#dark.15',\n\n    // Animated state styling\n    animation: {\n      '': 'none',\n      animated: `${placeholderAnimation} $placeholder-animation-time linear infinite`,\n    },\n    image: {\n      '': 'none',\n      animated: `linear-gradient(\n        135deg,\n        #dark.15 0%,\n        #dark.15 5%,\n        #dark.0 35%,\n        #dark-03.2 50%,\n        #dark-03.0 65%,\n        #dark.15 95%,\n        #dark.15 100%\n      )`,\n    },\n  },\n});\n\n/**\n * Set by a component that says once that a whole group of placeholders is\n * loading — `Skeleton` is one region around all of its bars, and a table's\n * loading row is `aria-busy`. The placeholders inside are then decoration, and\n * stay out of the accessibility tree rather than each being a landmark of its\n * own.\n */\nexport const PlaceholderGroupContext = createContext(false);\n\nexport interface CubePlaceholderProps extends BaseProps, ContainerStyleProps {\n  size?: Styles['fontSize'];\n  circle?: boolean;\n  isStatic?: boolean;\n}\n\nexport const Placeholder = forwardRef(function Placeholder(\n  allProps: CubePlaceholderProps,\n  ref,\n) {\n  let { size = '2x', isStatic, circle, ...props } = allProps;\n\n  const { t } = useI18n();\n  const isInGroup = useContext(PlaceholderGroupContext);\n\n  let styles = extractStyles(props, CONTAINER_STYLES);\n\n  return (\n    <StyledPlaceholder\n      {...(isInGroup\n        ? { 'aria-hidden': true }\n        : {\n            role: 'region',\n            'aria-label': t(\n              'placeholder.contentIsLoading',\n              'Content is loading',\n            ),\n          })}\n      {...filterBaseProps(props, { eventProps: true })}\n      // The documented way to detect a loading placeholder. Fixed, so a\n      // caller's `qa` or a translated `aria-label` doesn't change it.\n      data-loading-placeholder=\"\"\n      ref={ref}\n      mods={{ animated: !isStatic, circle }}\n      // oxlint-disable-next-line tasty/no-runtime-styles-mutation -- forwards the consumer's `size` prop\n      styles={mergeStyleLayers({ height: size }, styles)}\n    />\n  );\n});\n"],"mappings":";;;;;;;;AAeA,MAAMa,uBAAuBT,UAAU;CACrC,MAAM,EACJ,uBAAuB,MACzB;CACA,QAAQ,EACN,uBAAuB,gCACzB;AACF,CAAC;AAED,MAAMU,oBAAoBR,MAAM,EAC9BS,QAAQ;CACNC,SAAS;CACTC,QAAQ;CACRC,SAAS;CACTC,aAAa;EACX,IAAI;EACJC,QAAQ;CACV;CACAC,QAAQ;EACN,IAAI;EACJD,QAAQ;CACV;CAGA,+BAA+B;CAC/B,+BAA+B;CAG/BE,kBAAkB;CAClBC,gBAAgB;CAChBC,MAAM;CAGNC,WAAW;EACT,IAAI;EACJC,UAAU,GAAGb,qBAAoB;CACnC;CACAc,OAAO;EACL,IAAI;EACJD,UAAU;;;;;;;;;;CAUZ;AACF,EACF,CAAC;;;;;;;;AASD,MAAaE,0BAA0BrB,cAAc,KAAK;AAQ1D,MAAayB,cAAcxB,WAAW,SAAAwB,YAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAIpC,MAAA,EAAAN,MAAAO,IAAAN,UAAAX,QAAA,GAAAkB,UAAkDL;CAA5C,MAAAH,OAAAO,OAAAE,KAAAA,IAAA,OAAAF;CAEN,MAAA,EAAAG,MAAc9B,QAAQ;CACtB,MAAA+B,YAAkBhC,WAAWmB,uBAAuB;CAEpD,MAAAb,SAAaJ,cAAc2B,OAAOrC,gBAAgB;CAG/C,MAAAyC,KAAA5B;CAAiB,IAAA6B;CAAA,IAAAR,EAAA,OAAAM,aAAAN,EAAA,OAAAK,GAAA;EACXG,KAAAF,YAAA,EAAA,eACgB,KAOjB,IARC;GAAAG,MAGO;GAAQ,cACAJ,EACZ,gCACA,oBACF;EACF;EAACL,EAAA,KAAAM;EAAAN,EAAA,KAAAK;EAAAL,EAAA,KAAAQ;CAAA,OAAAA,KAAAR,EAAA;CACD,MAAAU,KAAA1C,gBAAgBmC,OAAO,EAAAQ,YAAc,KAAK,CAAC;CAGtB,MAAAC,KAAA;CAEP,MAAAC,KAAA,CAACjB;CAAQ,IAAAkB;CAAA,IAAAd,EAAA,OAAAf,UAAAe,EAAA,OAAAa,IAAA;EAArBC,KAAA;GAAAvB,UAAYsB;GAAS5B;EAAS;EAACe,EAAA,KAAAf;EAAAe,EAAA,KAAAa;EAAAb,EAAA,KAAAc;CAAA,OAAAA,KAAAd,EAAA;CAE7B,MAAAe,KAAAtC,iBAAiB,EAAAK,QAAUa,KAAK,GAAGf,MAAM;CAAC,IAAAoC;CAAA,IAAAhB,EAAA,OAAAO,MAAAP,EAAA,OAAAD,OAAAC,EAAA,OAAAQ,MAAAR,EAAA,OAAAU,MAAAV,EAAA,QAAAc,MAAAd,EAAA,QAAAe,IAAA;EAjBpDC,KAAA,oBAAC,IAAD;GAAkB,GACXR;GAQA,GACDE;GAGqB,4BAAAE;GACpBb;GACC,MAAAe;GAEE,QAAAC;EAA0C,CAAA;EAClDf,EAAA,KAAAO;EAAAP,EAAA,KAAAD;EAAAC,EAAA,KAAAQ;EAAAR,EAAA,KAAAU;EAAAV,EAAA,MAAAc;EAAAd,EAAA,MAAAe;EAAAf,EAAA,MAAAgB;CAAA,OAAAA,KAAAhB,EAAA;CAAA,OAlBFgB;AAkBE,CAEL"}

package/dist/components/content/PrismCode/PrismCode.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { Prism as RendererPrism, ensureYamlSqlExtensions } from "./prismSetup.js";
 import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/PrismCode/PrismCode.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrismCode.js","names":["BaseProps","CONTAINER_STYLES","ContainerStyleProps","Styles","tasty","Highlight","forwardRef","ensureYamlSqlExtensions","Prism","PreElement","as","qa","styleProps","concat","className","styles","margin","padding","overflow","scrollbar","preset","Code","display","whiteSpace","wrapped","overflowWrap","CubePrismCodeProps","style","isWrapped","code","language","isDiffCode","lines","split","additionPattern","deletionPattern","headerPattern","line","test","PrismCode","props","ref","otherProps","Error","isDiff","grammarLang","languages","diff","tokens","getLineProps","getTokenProps","color","undefined","backgroundColor","map","i","key","_lineKey","lineProps","token","_tokenKey","tokenProps","_PrismCode","displayName","Prism"],"sources":["../../../../src/components/content/PrismCode/PrismCode.tsx"],"sourcesContent":["import {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { Highlight } from 'prism-react-renderer';\nimport { forwardRef } from 'react';\n\nimport { ensureYamlSqlExtensions, Prism } from './prismSetup';\n\nimport 'prismjs/components/prism-markup.js';\nimport 'prismjs/components/prism-javascript.js';\nimport 'prismjs/components/prism-yaml.js';\nimport 'prismjs/components/prism-bash.js';\nimport 'prismjs/components/prism-sql.js';\n\nconst PreElement = tasty({\n  as: 'pre',\n  qa: 'CodeBlock',\n  styleProps: CONTAINER_STYLES.concat([]),\n  className: 'cube-prism-code',\n  styles: {\n    margin: 0,\n    padding: 0,\n    overflow: 'auto',\n    scrollbar: 'styled',\n    preset: 's3',\n\n    Code: {\n      display: 'block',\n      preset: 's3',\n      // The global Prism CSS pins `white-space: pre` on\n      // `code[class*=\"language-\"]`, so the wrap has to be re-declared right on\n      // the `<code>` element — `pre-wrap` on the surrounding block alone does\n      // not cascade past it. `overflow-wrap: anywhere` also breaks runs with no\n      // spaces (URLs, tokens, identifiers) that `pre-wrap` on its own would let\n      // overflow.\n      whiteSpace: {\n        '': 'pre',\n        wrapped: 'pre-wrap',\n      },\n      overflowWrap: {\n        '': 'normal',\n        wrapped: 'anywhere',\n      },\n    },\n  },\n});\n\nexport interface CubePrismCodeProps extends ContainerStyleProps {\n  /** The CSS style map */\n  style?: BaseProps['style'];\n  styles?: Styles;\n  /**\n   * Soft-wrap long lines onto multiple lines instead of scrolling them\n   * horizontally. Unbreakable runs like URLs, tokens and identifiers wrap too.\n   * Useful for error messages and logs.\n   */\n  isWrapped?: boolean;\n  /** The code snippet */\n  code?: string;\n  /** The language of the code snippet */\n  language?:\n    | 'javascript'\n    | 'css'\n    | 'sql'\n    | 'less'\n    | 'html'\n    | 'json'\n    | 'yaml'\n    | 'bash'\n    | 'editorconfig'\n    | 'php'\n    | 'python'\n    | 'typescript';\n}\n\nfunction isDiffCode(code: string): boolean {\n  // Split the code into lines\n  const lines = code.split('\\n');\n\n  // Define patterns to check for diff characteristics\n  const additionPattern = /^\\+/; // Lines starting with '+'\n  const deletionPattern = /^-+/; // Lines starting with '-'\n  const headerPattern = /^(diff --git|---|\\+\\+\\+)/; // Diff headers\n\n  // Check each line for diff-specific patterns\n  for (const line of lines) {\n    if (\n      additionPattern.test(line) ||\n      deletionPattern.test(line) ||\n      headerPattern.test(line)\n    ) {\n      return true; // Code matches a diff pattern\n    }\n  }\n\n  // No diff-specific patterns found\n  return false;\n}\n\nfunction PrismCode(props: CubePrismCodeProps, ref) {\n  let { code = '', language = 'javascript', isWrapped, ...otherProps } = props;\n\n  if (!code) {\n    code = '';\n  }\n\n  if (typeof code !== 'string' && code) {\n    throw new Error(\n      'UIKit: code prop should be a string in PrismCode. Found: ' + typeof code,\n    );\n  }\n\n  const isDiff = isDiffCode(code || '');\n\n  const grammarLang = isDiff ? `diff-${language}` : language;\n\n  // Ensure the diff language exists before rendering\n  if (isDiff && !Prism.languages[grammarLang]) {\n    Prism.languages[grammarLang] = Prism.languages.diff;\n  }\n\n  // Ensure YAML SQL extensions are applied for YAML content\n  if (language === 'yaml' || grammarLang === 'diff-yaml') {\n    ensureYamlSqlExtensions();\n  }\n\n  return (\n    <PreElement ref={ref} {...otherProps} mods={{ wrapped: isWrapped }}>\n      <Highlight prism={Prism} code={code} language={grammarLang as any}>\n        {({ className, style, tokens, getLineProps, getTokenProps }) => {\n          return (\n            <code\n              data-element=\"Code\"\n              className={`${className}${isDiff ? ' diff-highlight' : ''}`}\n              style={{\n                ...style,\n                color: undefined,\n                backgroundColor: undefined,\n              }}\n            >\n              {tokens.map((line, i) => {\n                const { key: _lineKey, ...lineProps } = getLineProps({\n                  line,\n                  key: i,\n                });\n\n                return (\n                  <span\n                    key={i}\n                    {...lineProps}\n                    style={{\n                      ...lineProps.style,\n                      color: undefined,\n                    }}\n                  >\n                    {line.map((token, key) => {\n                      const { key: _tokenKey, ...tokenProps } = getTokenProps({\n                        token,\n                        key,\n                      });\n\n                      return (\n                        <span\n                          key={key}\n                          {...tokenProps}\n                          style={{\n                            ...tokenProps.style,\n                            color: undefined,\n                            backgroundColor: undefined,\n                          }}\n                        />\n                      );\n                    })}\n                    {'\\n'}\n                  </span>\n                );\n              })}\n            </code>\n          );\n        }}\n      </Highlight>\n    </PreElement>\n  );\n}\n\n/**\n * Code block with syntax highlighting\n */\nconst _PrismCode = forwardRef(PrismCode);\n\n_PrismCode.displayName = 'PrismCode';\n\nexport { _PrismCode as PrismCode };\n"],"mappings":";;;;;;;;;;;;AAkBA,MAAMS,aAAaL,MAAM;CACvBM,IAAI;CACJC,IAAI;CACJC,YAAYX,iBAAiBY,OAAO,CAAA,CAAE;CACtCC,WAAW;CACXC,QAAQ;EACNC,QAAQ;EACRC,SAAS;EACTC,UAAU;EACVC,WAAW;EACXC,QAAQ;EAERC,MAAM;GACJC,SAAS;GACTF,QAAQ;GAORG,YAAY;IACV,IAAI;IACJC,SAAS;GACX;GACAC,cAAc;IACZ,IAAI;IACJD,SAAS;GACX;EACF;CACF;AACF,CAAC;AA8BD,SAASO,WAAWF,MAAuB;CAEzC,MAAMG,QAAQH,KAAKI,MAAM,IAAI;CAG7B,MAAMC,kBAAkB;CACxB,MAAMC,kBAAkB;CACxB,MAAMC,gBAAgB;CAGtB,KAAK,MAAMC,QAAQL,OACjB,IACEE,gBAAgBI,KAAKD,IAAI,KACzBF,gBAAgBG,KAAKD,IAAI,KACzBD,cAAcE,KAAKD,IAAI,GAEvB,OAAO;CAKX,OAAO;AACT;AAEA,SAASE,UAAUC,OAA2BC,KAAK;CACjD,IAAI,EAAEZ,OAAO,IAAIC,WAAW,cAAcF,WAAW,GAAGc,eAAeF;CAEvE,IAAI,CAACX,MACHA,OAAO;CAGT,IAAI,OAAOA,SAAS,YAAYA,MAC9B,MAAM,IAAIc,MACR,8DAA8D,OAAOd,IACvE;CAGF,MAAMe,SAASb,WAAWF,QAAQ,EAAE;CAEpC,MAAMgB,cAAcD,SAAS,QAAQd,aAAaA;CAGlD,IAAIc,UAAU,CAACpC,cAAMsC,UAAUD,cAC7BrC,cAAMsC,UAAUD,eAAerC,cAAMsC,UAAUC;CAIjD,IAAIjB,aAAa,UAAUe,gBAAgB,aACzCtC,wBAAwB;CAG1B,OACE,oBAAC,YAAD;EAAiBkC;EAAK,GAAIC;EAAY,MAAM,EAAElB,SAASI,UAAU;EAC/D,UAAA,oBAAC,WAAD;GAAW,OAAOpB;GAAaqB;GAAM,UAAUgB;GAC3C,WAAA,EAAE/B,WAAWa,OAAOqB,QAAQC,cAAcC,oBAAoB;IAC9D,OACE,oBAAC,QAAD;KACE,gBAAa;KACb,WAAW,GAAGpC,YAAY8B,SAAS,oBAAoB;KACvD,OAAO;MACL,GAAGjB;MACHwB,OAAOC,KAAAA;MACPC,iBAAiBD,KAAAA;KACnB;KAECJ,UAAAA,OAAOM,KAAKjB,MAAMkB,MAAM;MACvB,MAAM,EAAEC,KAAKC,UAAU,GAAGC,cAAcT,aAAa;OACnDZ;OACAmB,KAAKD;MACP,CAAC;MAED,OACE,qBAAC,QAAD;OAEE,GAAIG;OACJ,OAAO;QACL,GAAGA,UAAU/B;QACbwB,OAAOC,KAAAA;OACT;OANF,UAAA,CAQGf,KAAKiB,KAAKK,OAAOH,QAAQ;QACxB,MAAM,EAAEA,KAAKI,WAAW,GAAGC,eAAeX,cAAc;SACtDS;SACAH;QACF,CAAC;QAED,OACE,oBAAC,QAAD;SAEE,GAAIK;SACJ,OAAO;UACL,GAAGA,WAAWlC;UACdwB,OAAOC,KAAAA;UACPC,iBAAiBD,KAAAA;SACnB;QAAE,GANGI,GAMH;OAGR,CAAC,GACA,IACG;MA1BCD,GAAAA,CA0BD;KAEV,CAAC;IACG,CAAA;GAEV;EACS,CAAA;CACD,CAAA;AAEhB;;;;AAKA,MAAMO,aAAaxD,WAAWiC,SAAS;AAEvCuB,WAAWC,cAAc"}
+{"version":3,"file":"PrismCode.js","names":["BaseProps","CONTAINER_STYLES","ContainerStyleProps","Styles","tasty","Highlight","forwardRef","ensureYamlSqlExtensions","Prism","PreElement","as","qa","styleProps","concat","className","styles","margin","padding","overflow","scrollbar","preset","Code","display","whiteSpace","wrapped","overflowWrap","CubePrismCodeProps","style","isWrapped","code","language","isDiffCode","lines","split","additionPattern","deletionPattern","headerPattern","line","test","PrismCode","props","ref","otherProps","Error","isDiff","grammarLang","languages","diff","tokens","getLineProps","getTokenProps","color","undefined","backgroundColor","map","i","key","_lineKey","lineProps","token","_tokenKey","tokenProps","_PrismCode","displayName","Prism"],"sources":["../../../../src/components/content/PrismCode/PrismCode.tsx"],"sourcesContent":["import {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { Highlight } from 'prism-react-renderer';\nimport { forwardRef } from 'react';\n\nimport { ensureYamlSqlExtensions, Prism } from './prismSetup';\n\nimport 'prismjs/components/prism-markup.js';\nimport 'prismjs/components/prism-javascript.js';\nimport 'prismjs/components/prism-yaml.js';\nimport 'prismjs/components/prism-bash.js';\nimport 'prismjs/components/prism-sql.js';\n\nconst PreElement = tasty({\n  as: 'pre',\n  qa: 'CodeBlock',\n  styleProps: CONTAINER_STYLES.concat([]),\n  className: 'cube-prism-code',\n  styles: {\n    margin: 0,\n    padding: 0,\n    overflow: 'auto',\n    scrollbar: 'styled',\n    preset: 's3',\n\n    Code: {\n      display: 'block',\n      preset: 's3',\n      // The global Prism CSS pins `white-space: pre` on\n      // `code[class*=\"language-\"]`, so the wrap has to be re-declared right on\n      // the `<code>` element — `pre-wrap` on the surrounding block alone does\n      // not cascade past it. `overflow-wrap: anywhere` also breaks runs with no\n      // spaces (URLs, tokens, identifiers) that `pre-wrap` on its own would let\n      // overflow.\n      whiteSpace: {\n        '': 'pre',\n        wrapped: 'pre-wrap',\n      },\n      overflowWrap: {\n        '': 'normal',\n        wrapped: 'anywhere',\n      },\n    },\n  },\n});\n\nexport interface CubePrismCodeProps extends ContainerStyleProps {\n  /** The CSS style map */\n  style?: BaseProps['style'];\n  styles?: Styles;\n  /**\n   * Soft-wrap long lines onto multiple lines instead of scrolling them\n   * horizontally. Unbreakable runs like URLs, tokens and identifiers wrap too.\n   * Useful for error messages and logs.\n   */\n  isWrapped?: boolean;\n  /** The code snippet */\n  code?: string;\n  /** The language of the code snippet */\n  language?:\n    | 'javascript'\n    | 'css'\n    | 'sql'\n    | 'less'\n    | 'html'\n    | 'json'\n    | 'yaml'\n    | 'bash'\n    | 'editorconfig'\n    | 'php'\n    | 'python'\n    | 'typescript';\n}\n\nfunction isDiffCode(code: string): boolean {\n  // Split the code into lines\n  const lines = code.split('\\n');\n\n  // Define patterns to check for diff characteristics\n  const additionPattern = /^\\+/; // Lines starting with '+'\n  const deletionPattern = /^-+/; // Lines starting with '-'\n  const headerPattern = /^(diff --git|---|\\+\\+\\+)/; // Diff headers\n\n  // Check each line for diff-specific patterns\n  for (const line of lines) {\n    if (\n      additionPattern.test(line) ||\n      deletionPattern.test(line) ||\n      headerPattern.test(line)\n    ) {\n      return true; // Code matches a diff pattern\n    }\n  }\n\n  // No diff-specific patterns found\n  return false;\n}\n\nfunction PrismCode(props: CubePrismCodeProps, ref) {\n  let { code = '', language = 'javascript', isWrapped, ...otherProps } = props;\n\n  if (!code) {\n    code = '';\n  }\n\n  if (typeof code !== 'string' && code) {\n    throw new Error(\n      'UIKit: code prop should be a string in PrismCode. Found: ' + typeof code,\n    );\n  }\n\n  const isDiff = isDiffCode(code || '');\n\n  const grammarLang = isDiff ? `diff-${language}` : language;\n\n  // Ensure the diff language exists before rendering\n  if (isDiff && !Prism.languages[grammarLang]) {\n    Prism.languages[grammarLang] = Prism.languages.diff;\n  }\n\n  // Ensure YAML SQL extensions are applied for YAML content\n  if (language === 'yaml' || grammarLang === 'diff-yaml') {\n    ensureYamlSqlExtensions();\n  }\n\n  return (\n    <PreElement ref={ref} {...otherProps} mods={{ wrapped: isWrapped }}>\n      <Highlight prism={Prism} code={code} language={grammarLang as any}>\n        {({ className, style, tokens, getLineProps, getTokenProps }) => {\n          return (\n            <code\n              data-element=\"Code\"\n              className={`${className}${isDiff ? ' diff-highlight' : ''}`}\n              // oxlint-disable-next-line tasty/no-style-prop -- prism-react-renderer supplies its theme styles; we only clear its colors\n              style={{\n                ...style,\n                color: undefined,\n                backgroundColor: undefined,\n              }}\n            >\n              {tokens.map((line, i) => {\n                const { key: _lineKey, ...lineProps } = getLineProps({\n                  line,\n                  key: i,\n                });\n\n                return (\n                  <span\n                    key={i}\n                    {...lineProps}\n                    // oxlint-disable-next-line tasty/no-style-prop -- prism-react-renderer supplies its theme styles; we only clear its colors\n                    style={{\n                      ...lineProps.style,\n                      color: undefined,\n                    }}\n                  >\n                    {line.map((token, key) => {\n                      const { key: _tokenKey, ...tokenProps } = getTokenProps({\n                        token,\n                        key,\n                      });\n\n                      return (\n                        <span\n                          key={key}\n                          {...tokenProps}\n                          // oxlint-disable-next-line tasty/no-style-prop -- prism-react-renderer supplies its theme styles; we only clear its colors\n                          style={{\n                            ...tokenProps.style,\n                            color: undefined,\n                            backgroundColor: undefined,\n                          }}\n                        />\n                      );\n                    })}\n                    {'\\n'}\n                  </span>\n                );\n              })}\n            </code>\n          );\n        }}\n      </Highlight>\n    </PreElement>\n  );\n}\n\n/**\n * Code block with syntax highlighting\n */\nconst _PrismCode = forwardRef(PrismCode);\n\n_PrismCode.displayName = 'PrismCode';\n\nexport { _PrismCode as PrismCode };\n"],"mappings":";;;;;;;;;;;;AAkBA,MAAMS,aAAaL,MAAM;CACvBM,IAAI;CACJC,IAAI;CACJC,YAAYX,iBAAiBY,OAAO,CAAA,CAAE;CACtCC,WAAW;CACXC,QAAQ;EACNC,QAAQ;EACRC,SAAS;EACTC,UAAU;EACVC,WAAW;EACXC,QAAQ;EAERC,MAAM;GACJC,SAAS;GACTF,QAAQ;GAORG,YAAY;IACV,IAAI;IACJC,SAAS;GACX;GACAC,cAAc;IACZ,IAAI;IACJD,SAAS;GACX;EACF;CACF;AACF,CAAC;AA8BD,SAASO,WAAWF,MAAuB;CAEzC,MAAMG,QAAQH,KAAKI,MAAM,IAAI;CAG7B,MAAMC,kBAAkB;CACxB,MAAMC,kBAAkB;CACxB,MAAMC,gBAAgB;CAGtB,KAAK,MAAMC,QAAQL,OACjB,IACEE,gBAAgBI,KAAKD,IAAI,KACzBF,gBAAgBG,KAAKD,IAAI,KACzBD,cAAcE,KAAKD,IAAI,GAEvB,OAAO;CAKX,OAAO;AACT;AAEA,SAASE,UAAUC,OAA2BC,KAAK;CACjD,IAAI,EAAEZ,OAAO,IAAIC,WAAW,cAAcF,WAAW,GAAGc,eAAeF;CAEvE,IAAI,CAACX,MACHA,OAAO;CAGT,IAAI,OAAOA,SAAS,YAAYA,MAC9B,MAAM,IAAIc,MACR,8DAA8D,OAAOd,IACvE;CAGF,MAAMe,SAASb,WAAWF,QAAQ,EAAE;CAEpC,MAAMgB,cAAcD,SAAS,QAAQd,aAAaA;CAGlD,IAAIc,UAAU,CAACpC,cAAMsC,UAAUD,cAC7BrC,cAAMsC,UAAUD,eAAerC,cAAMsC,UAAUC;CAIjD,IAAIjB,aAAa,UAAUe,gBAAgB,aACzCtC,wBAAwB;CAG1B,OACE,oBAAC,YAAD;EAAiBkC;EAAK,GAAIC;EAAY,MAAM,EAAElB,SAASI,UAAU;EAC/D,UAAA,oBAAC,WAAD;GAAW,OAAOpB;GAAaqB;GAAM,UAAUgB;GAC3C,WAAA,EAAE/B,WAAWa,OAAOqB,QAAQC,cAAcC,oBAAoB;IAC9D,OACE,oBAAC,QAAD;KACE,gBAAa;KACb,WAAW,GAAGpC,YAAY8B,SAAS,oBAAoB;KAEvD,OAAO;MACL,GAAGjB;MACHwB,OAAOC,KAAAA;MACPC,iBAAiBD,KAAAA;KACnB;KAECJ,UAAAA,OAAOM,KAAKjB,MAAMkB,MAAM;MACvB,MAAM,EAAEC,KAAKC,UAAU,GAAGC,cAAcT,aAAa;OACnDZ;OACAmB,KAAKD;MACP,CAAC;MAED,OACE,qBAAC,QAAD;OAEE,GAAIG;OAEJ,OAAO;QACL,GAAGA,UAAU/B;QACbwB,OAAOC,KAAAA;OACT;OAPF,UAAA,CASGf,KAAKiB,KAAKK,OAAOH,QAAQ;QACxB,MAAM,EAAEA,KAAKI,WAAW,GAAGC,eAAeX,cAAc;SACtDS;SACAH;QACF,CAAC;QAED,OACE,oBAAC,QAAD;SAEE,GAAIK;SAEJ,OAAO;UACL,GAAGA,WAAWlC;UACdwB,OAAOC,KAAAA;UACPC,iBAAiBD,KAAAA;SACnB;QAAE,GAPGI,GAOH;OAGR,CAAC,GACA,IACG;MA5BCD,GAAAA,CA4BD;KAEV,CAAC;IACG,CAAA;GAEV;EACS,CAAA;CACD,CAAA;AAEhB;;;;AAKA,MAAMO,aAAaxD,WAAWiC,SAAS;AAEvCuB,WAAWC,cAAc"}

package/dist/components/content/PrismCode/prismSetup.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { Prism as RendererPrism } from "prism-react-renderer";
 //#region src/components/content/PrismCode/prismSetup.tsx
 globalThis.Prism = RendererPrism;