@cube-dev/ui-kit 0.121.7 → 0.123.0

package/dist/components/form/Form/SubmitError.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { FormContext } from "./Form.js";
 import { Alert } from "../../content/Alert/Alert.js";
 import { forwardRef, isValidElement, useContext } from "react";

package/dist/components/form/Form/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { useForm } from "./use-form.js";
 import { FormContext, _Form, useFormProps } from "./Form.js";
 import { useField } from "./use-field/use-field.js";

package/dist/components/form/Form/use-field/use-field-props.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { mergeProps } from "../../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { warn } from "../../../../utils/warnings.js";

package/dist/components/form/Form/use-field/use-field.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { useIsFirstRender } from "../../../../_internal/hooks/use-is-first-render.js";
 import { delayValidationRule } from "../validation.js";

package/dist/components/form/Form/use-form.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { applyRules } from "./validation.js";
 import { dotize } from "@tenphi/tasty";
 import { useRef, useState } from "react";

package/dist/components/form/Form/validation.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { validate } from "email-validator";
 import validUrl from "valid-url";
 

package/dist/components/form/Label.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useProviderProps } from "../../provider.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/form/wrapper.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { mergeProps } from "../../utils/react/mergeProps.js";
 import { FieldWrapper } from "./FieldWrapper/FieldWrapper.js";
 import { jsx } from "react/jsx-runtime";

package/dist/components/helpers/DisplayTransition/DisplayTransition.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
 
 //#region src/components/helpers/DisplayTransition/DisplayTransition.tsx

package/dist/components/helpers/IconSwitch/IconSwitch.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { DisplayTransition } from "../DisplayTransition/DisplayTransition.js";
 import { tasty } from "@tenphi/tasty";
 import { isValidElement, useCallback, useLayoutEffect, useRef, useState } from "react";

package/dist/components/layout/Flex.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/layout/Flow.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/layout/Grid.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/layout/Panel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { BASE_STYLES, BLOCK_STYLES, COLOR_STYLES, DIMENSION_STYLES, OUTER_STYLES, tasty } from "@tenphi/tasty";
 import { forwardRef, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/layout/Prefix.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useLayoutEffect as useLayoutEffect$1 } from "../../utils/react/useLayoutEffect.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";

package/dist/components/layout/ResizablePanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";
 import { useEvent } from "../../_internal/hooks/use-event.js";

package/dist/components/layout/Space.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/layout/Suffix.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";
 import { CONTAINER_STYLES, filterBaseProps, parseStyle, tasty } from "@tenphi/tasty";

package/dist/components/navigation/Tabs/DraggableTabList.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useCallback, useMemo } from "react";
 import { ListDropTargetDelegate, ListKeyboardDelegate, useDraggableCollection, useDroppableCollection } from "react-aria";

package/dist/components/navigation/Tabs/EditableTitle.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { EditableTitleInputElement, HiddenMeasure } from "./styled.js";
 import { useLayoutEffect, useRef, useState } from "react";

package/dist/components/navigation/Tabs/TabButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { ItemActionProvider } from "../../actions/ItemActionContext.js";
@@ -120,7 +120,9 @@ function TabButton({ item, tabData, isLastTab }) {
 	};
 	const effectiveContextMenu = tabData.contextMenu ?? parentContextMenu ?? false;
 	const effectiveType = tabData.type ?? type ?? "default";
-	const showDeleteButton = isDeletable && isMenuEmpty(effectiveMenu);
+	const contextMenuEnabled = effectiveContextMenu === true || effectiveContextMenu === "context-only";
+	const contextMenuOnly = effectiveContextMenu === "context-only";
+	const showDeleteButton = isDeletable && (isMenuEmpty(effectiveMenu) || contextMenuOnly);
 	const processedMenu = effectiveMenu && !isMenuEmpty(effectiveMenu) ? processMenuItems(effectiveMenu, effectiveIsEditable, isDeletable) : null;
 	const itemKeyStr = String(item.key);
 	const handleDelete = useEvent(() => {
@@ -155,6 +157,16 @@ function TabButton({ item, tabData, isLastTab }) {
 		tabData.onAction?.(normalizedAction);
 		parentOnAction?.(normalizedAction, itemKeyStr);
 	});
+	const menuElement = processedMenu ? /* @__PURE__ */ jsx(__Menu, {
+		...effectiveMenuProps,
+		onAction: handleMenuAction,
+		children: processedMenu
+	}) : null;
+	const contextMenu = useContextMenu(__Menu, { placement: "bottom start" }, {
+		...effectiveMenuProps,
+		onAction: handleMenuAction,
+		children: processedMenu
+	});
 	const handleKeyDown = useEvent((e) => {
 		if (suppressFocusVisible) setSuppressFocusVisible(false);
 		if (e.key === "F2" && effectiveIsEditable && !isDisabled) {
@@ -165,7 +177,8 @@ function TabButton({ item, tabData, isLastTab }) {
 		if (e.key === "F10" && e.shiftKey && processedMenu) {
 			e.preventDefault();
 			e.stopPropagation();
-			setIsMenuOpen(true);
+			if (contextMenuOnly) contextMenu.open();
+			else setIsMenuOpen(true);
 		}
 		if ((e.key === "Delete" || e.key === "Backspace") && isDeletable && !isEditing) {
 			e.preventDefault();
@@ -201,17 +214,7 @@ function TabButton({ item, tabData, isLastTab }) {
 			inline: "nearest"
 		});
 	}, [isActive]);
-	const menuElement = processedMenu ? /* @__PURE__ */ jsx(__Menu, {
-		...effectiveMenuProps,
-		onAction: handleMenuAction,
-		children: processedMenu
-	}) : null;
-	const contextMenu = useContextMenu(__Menu, { placement: "bottom start" }, {
-		...effectiveMenuProps,
-		onAction: handleMenuAction,
-		children: processedMenu
-	});
-	const menuAction = menuElement ? /* @__PURE__ */ jsxs(_MenuTrigger, {
+	const menuAction = menuElement && !contextMenuOnly ? /* @__PURE__ */ jsxs(_MenuTrigger, {
 		isOpen: isMenuOpen,
 		onOpenChange: setIsMenuOpen,
 		children: [/* @__PURE__ */ jsx(ItemAction, {
@@ -249,7 +252,7 @@ function TabButton({ item, tabData, isLastTab }) {
 		onCancel: handleCancelEditing
 	}) : tabData.title;
 	const { title: _title, content: _content, key: _key, isDisabled: _isDisabled, prerender: _prerender, keepMounted: _keepMounted, size: _size, type: _type, actions: _actions, autoHideActions: _autoHideActions, isEditable: _isEditable, onTitleChange: _onTitleChange, menu: _menu, menuTriggerProps: _menuTriggerProps, menuProps: _menuProps, contextMenu: _contextMenu, onAction: _onAction, qa, qaVal, styles, ...itemStyleProps } = tabData;
-	const effectiveContainerRef = effectiveContextMenu && processedMenu ? contextMenu.targetRef : containerRef;
+	const effectiveContainerRef = contextMenuEnabled && processedMenu ? contextMenu.targetRef : containerRef;
 	const ariaProps = processedMenu ? { "aria-haspopup": "menu" } : {};
 	const containerMods = {
 		...mods,
@@ -302,7 +305,7 @@ function TabButton({ item, tabData, isLastTab }) {
 					children: actions
 				})
 			}),
-			effectiveContextMenu && processedMenu && contextMenu.rendered,
+			contextMenuEnabled && processedMenu && contextMenu.rendered,
 			isDraggable && dropState && isLastTab && /* @__PURE__ */ jsx(TabDropIndicator, {
 				target: {
 					type: "item",

package/dist/components/navigation/Tabs/TabButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabButton.js","names":["Menu","MenuTrigger","mergeProps"],"sources":["../../../../src/components/navigation/Tabs/TabButton.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  isValidElement,\n  ReactElement,\n  ReactNode,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  useDraggableItem,\n  useFocus,\n  useFocusVisible,\n  useHover,\n  useTab,\n} from 'react-aria';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { CloseIcon, MoreIcon } from '../../../icons';\nimport { mergeProps } from '../../../utils/react';\nimport { CubeItemActionProps, ItemAction } from '../../actions/ItemAction';\nimport { ItemActionProvider } from '../../actions/ItemActionContext';\nimport { CubeMenuProps, Menu, MenuTrigger } from '../../actions/Menu';\nimport { useContextMenu } from '../../actions/use-context-menu';\n\nimport { EditableTitle } from './EditableTitle';\nimport { TabContainer, TabElement } from './styled';\nimport { TabDropIndicator } from './TabDropIndicator';\nimport { useTabsContext } from './TabsContext';\nimport { ParsedTab, RADIO_SIZE_MAP } from './types';\n\nimport type { Key, Node } from '@react-types/shared';\nimport type { KeyboardEvent, MouseEvent, PointerEvent } from 'react';\nimport type { DraggableCollectionState } from 'react-stately';\n\n// =============================================================================\n// Event handlers for actions to prevent event propagation to tab button\n// =============================================================================\n\nconst ACTIONS_EVENT_HANDLERS = {\n  onClick: (e: MouseEvent) => e.stopPropagation(),\n  onPointerDown: (e: PointerEvent) => e.stopPropagation(),\n  onPointerUp: (e: PointerEvent) => e.stopPropagation(),\n  onMouseDown: (e: MouseEvent) => e.stopPropagation(),\n  onMouseUp: (e: MouseEvent) => e.stopPropagation(),\n  onKeyDown: (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.stopPropagation();\n    }\n  },\n};\n\n// =============================================================================\n// Menu Processing Utilities\n// =============================================================================\n\ninterface MenuItemLikeProps {\n  children?: ReactNode;\n  isDisabled?: boolean;\n  theme?: string;\n}\n\n/**\n * Extracts the raw key from a React element, stripping the \".$\" prefix\n * that React adds via Children.map/toArray.\n */\nfunction getRawKey(element: ReactElement): string | null {\n  if (element.key == null) return null;\n  const keyStr = String(element.key);\n  return keyStr.startsWith('.$') ? keyStr.slice(2) : keyStr;\n}\n\n/**\n * Process menu items for predefined action keys (rename, delete).\n * Auto-adds labels and disables items when requirements aren't met.\n */\nfunction processMenuItems(\n  children: ReactNode,\n  effectiveIsEditable: boolean,\n  isDeletable: boolean,\n): ReactNode {\n  return Children.toArray(children).map((child) => {\n    if (!isValidElement(child)) return child;\n\n    const childKey = getRawKey(child);\n    const childProps = child.props as MenuItemLikeProps;\n\n    // Handle predefined action keys\n    if (childKey === 'rename') {\n      return cloneElement(child as ReactElement<MenuItemLikeProps>, {\n        children: childProps.children ?? 'Rename',\n        isDisabled: childProps.isDisabled ?? !effectiveIsEditable,\n      });\n    }\n    if (childKey === 'delete') {\n      return cloneElement(child as ReactElement<MenuItemLikeProps>, {\n        children: childProps.children ?? 'Delete',\n        theme: childProps.theme ?? 'danger',\n        isDisabled: childProps.isDisabled ?? !isDeletable,\n      });\n    }\n\n    // Recursively process Menu.Section children\n    if (childProps.children && typeof childProps.children !== 'string') {\n      return cloneElement(child as ReactElement<MenuItemLikeProps>, {\n        children: processMenuItems(\n          childProps.children,\n          effectiveIsEditable,\n          isDeletable,\n        ),\n      });\n    }\n\n    return child;\n  });\n}\n\n/**\n * Check if menu children is empty (null, undefined, or empty fragment)\n */\nfunction isMenuEmpty(menu: ReactNode): boolean {\n  if (menu === null || menu === undefined) return true;\n  const children = Children.toArray(menu);\n  return children.length === 0;\n}\n\n// =============================================================================\n// TabButton Props\n// =============================================================================\n\nexport interface TabButtonProps {\n  /** React Aria collection item */\n  item: Node<object>;\n  /** Parsed tab data */\n  tabData: ParsedTab;\n  /** Whether this is the last tab (for drop indicator) */\n  isLastTab?: boolean;\n}\n\n// =============================================================================\n// TabButton Component\n// =============================================================================\n\n/**\n * Individual tab button component.\n *\n * Uses TabsContext to access shared props, dramatically reducing prop drilling.\n * Handles:\n * - Tab selection and keyboard navigation\n * - Inline title editing\n * - Menu and context menu\n * - Drag-and-drop reordering\n * - Focus and hover states\n */\nexport function TabButton({ item, tabData, isLastTab }: TabButtonProps) {\n  // Get shared context\n  const {\n    state,\n    type,\n    size,\n    autoHideActions: parentAutoHideActions,\n    isEditable: parentIsEditable,\n    menu: parentMenu,\n    menuTriggerProps: parentMenuTriggerProps,\n    menuProps: parentMenuProps,\n    contextMenu: parentContextMenu,\n    onAction: parentOnAction,\n    onDelete,\n    dragState,\n    dropState,\n    editingKey,\n    editValue,\n    setEditValue,\n    startEditing,\n    submitEditing,\n    cancelEditing,\n  } = useTabsContext();\n\n  const ref = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const actionsRef = useRef<HTMLDivElement>(null);\n  const { tabProps } = useTab({ key: item.key }, state, ref);\n\n  // Measure actions width for proper space allocation in Item\n  const [actionsWidth, setActionsWidth] = useState(0);\n\n  // Drag-and-drop support - only enable when both states are provided\n  const isDraggable = !!dragState && !!dropState;\n\n  // useDraggableItem must be called unconditionally (Rules of Hooks)\n  // When dragState is undefined, we pass a minimal mock state to satisfy the hook\n  const mockDragState = useMemo(\n    () =>\n      ({\n        collection: state.collection,\n        selectionManager: state.selectionManager,\n        isDragging: () => false,\n        getKeysForDrag: () => new Set<Key>(),\n        isDisabled: false,\n        startDrag: () => {},\n        endDrag: () => {},\n      }) as DraggableCollectionState,\n    [state.collection, state.selectionManager],\n  );\n\n  const dragResult = useDraggableItem(\n    { key: item.key },\n    dragState ?? mockDragState,\n  );\n  const effectiveDragProps = isDraggable ? dragResult.dragProps : {};\n  const isDragging = isDraggable && dragResult.isDragging;\n\n  // Controlled state for menu trigger (enables keyboard opening with Shift+F10)\n  const [isMenuOpen, setIsMenuOpen] = useState(false);\n\n  // Hover, focus, and focus-visible state handling\n  const { hoverProps, isHovered } = useHover({});\n  const [isFocused, setIsFocused] = useState(false);\n  const { focusProps } = useFocus({ onFocusChange: setIsFocused });\n  const { isFocusVisible } = useFocusVisible();\n\n  // Suppress focus-visible when restoring focus after editing\n  const [suppressFocusVisible, setSuppressFocusVisible] = useState(false);\n  const effectiveFocusVisible = isFocusVisible && !suppressFocusVisible;\n\n  const isActive = state.selectedKey === item.key;\n  const isDisabled = state.disabledKeys.has(item.key);\n  const isDeletable = !!onDelete;\n  const isEditing = editingKey === item.key;\n\n  // Compute effective values - Tab-level overrides Tabs-level\n  const effectiveIsEditable = tabData.isEditable ?? parentIsEditable ?? false;\n  const effectiveMenu =\n    tabData.menu === null ? null : tabData.menu ?? parentMenu;\n  const effectiveMenuTriggerProps: Partial<CubeItemActionProps> = {\n    ...parentMenuTriggerProps,\n    ...tabData.menuTriggerProps,\n  };\n  const effectiveMenuProps: Partial<CubeMenuProps<object>> = {\n    ...parentMenuProps,\n    ...tabData.menuProps,\n  };\n  const effectiveContextMenu =\n    tabData.contextMenu ?? parentContextMenu ?? false;\n  const effectiveType = tabData.type ?? type ?? 'default';\n\n  // Delete button shown only if onDelete is set AND no menu\n  const showDeleteButton = isDeletable && isMenuEmpty(effectiveMenu);\n\n  // Process menu items for auto-labels and disabled states\n  const processedMenu =\n    effectiveMenu && !isMenuEmpty(effectiveMenu)\n      ? processMenuItems(effectiveMenu, effectiveIsEditable, isDeletable)\n      : null;\n\n  const itemKeyStr = String(item.key);\n\n  const handleDelete = useEvent(() => {\n    onDelete?.(itemKeyStr);\n  });\n\n  const handleStartEditing = useEvent(() => {\n    if (!effectiveIsEditable || isDisabled) return;\n\n    const titleText =\n      typeof tabData.title === 'string' ? tabData.title : itemKeyStr;\n\n    startEditing(itemKeyStr, titleText);\n  });\n\n  const handleSubmitEditing = useEvent(() => {\n    submitEditing(itemKeyStr, editValue, tabData.onTitleChange);\n    // Suppress focus-visible and restore focus to the tab button after editing\n    setSuppressFocusVisible(true);\n    requestAnimationFrame(() => {\n      ref.current?.focus();\n    });\n  });\n\n  const handleCancelEditing = useEvent(() => {\n    cancelEditing();\n    // Suppress focus-visible and restore focus to the tab button after editing\n    setSuppressFocusVisible(true);\n    requestAnimationFrame(() => {\n      ref.current?.focus();\n    });\n  });\n\n  const handleEditValueChange = useEvent((value: string) => {\n    setEditValue(value);\n  });\n\n  // Handle menu actions - predefined actions first, then callbacks\n  const handleMenuAction = useEvent((action: Key) => {\n    // Strip the \".$\" prefix that React adds via Children.toArray/map\n    const actionStr = String(action);\n    const normalizedAction = actionStr.startsWith('.$')\n      ? actionStr.slice(2)\n      : actionStr;\n\n    // Handle predefined actions first (only if requirements are met)\n    if (normalizedAction === 'rename' && effectiveIsEditable) {\n      handleStartEditing();\n    }\n    if (normalizedAction === 'delete' && isDeletable) {\n      onDelete?.(itemKeyStr);\n    }\n    // Call Tab-level onAction first (with normalized action)\n    tabData.onAction?.(normalizedAction);\n    // Then call Tabs-level onAction with tab key (with normalized action)\n    parentOnAction?.(normalizedAction, itemKeyStr);\n  });\n\n  // Keyboard handler for accessibility shortcuts (WAI-ARIA Tabs Pattern)\n  const handleKeyDown = useEvent((e: KeyboardEvent) => {\n    // Reset focus-visible suppression on any keyboard interaction\n    if (suppressFocusVisible) {\n      setSuppressFocusVisible(false);\n    }\n\n    // F2 to start editing (standard rename shortcut)\n    if (e.key === 'F2' && effectiveIsEditable && !isDisabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      handleStartEditing();\n    }\n\n    // Shift+F10 opens the menu (standard context menu shortcut)\n    if (e.key === 'F10' && e.shiftKey && processedMenu) {\n      e.preventDefault();\n      e.stopPropagation();\n      setIsMenuOpen(true);\n    }\n\n    // Delete key for direct tab deletion (ARIA Tabs pattern optional feature)\n    // Skip when editing to allow normal text editing operations\n    if (\n      (e.key === 'Delete' || e.key === 'Backspace') &&\n      isDeletable &&\n      !isEditing\n    ) {\n      e.preventDefault();\n      onDelete?.(itemKeyStr);\n    }\n  });\n\n  const mods = useMemo(\n    () => ({\n      type: effectiveType,\n      active: isActive,\n      deletable: isDeletable,\n      disabled: isDisabled,\n      editing: isEditing,\n      hovered: isHovered,\n      focused: isFocused,\n      'focus-visible': effectiveFocusVisible,\n      draggable: isDraggable,\n      dragging: isDragging,\n    }),\n    [\n      effectiveType,\n      isActive,\n      isDeletable,\n      isDisabled,\n      isEditing,\n      isHovered,\n      isFocused,\n      effectiveFocusVisible,\n      isDraggable,\n      isDragging,\n    ],\n  );\n\n  // Scroll active tab into view\n  useEffect(() => {\n    if (ref.current && isActive) {\n      ref.current.scrollIntoView?.({ block: 'nearest', inline: 'nearest' });\n    }\n  }, [isActive]);\n\n  // Build menu element\n  const menuElement = processedMenu ? (\n    <Menu {...effectiveMenuProps} onAction={handleMenuAction}>\n      {processedMenu}\n    </Menu>\n  ) : null;\n\n  // Use the useContextMenu hook for context menu handling\n  const contextMenu = useContextMenu<HTMLDivElement, CubeMenuProps<object>>(\n    Menu,\n    { placement: 'bottom start' },\n    {\n      ...effectiveMenuProps,\n      onAction: handleMenuAction,\n      children: processedMenu,\n    },\n  );\n\n  // Build menu trigger action with controlled state for keyboard accessibility\n  const menuAction = menuElement ? (\n    <MenuTrigger isOpen={isMenuOpen} onOpenChange={setIsMenuOpen}>\n      <ItemAction\n        tabIndex={-1}\n        icon={<MoreIcon />}\n        {...effectiveMenuTriggerProps}\n      />\n      {menuElement}\n    </MenuTrigger>\n  ) : null;\n\n  // Build delete button (only shown when no menu)\n  const deleteAction = showDeleteButton ? (\n    <ItemAction\n      tabIndex={-1}\n      icon={<CloseIcon />}\n      tooltip=\"Close\"\n      onPress={handleDelete}\n    />\n  ) : null;\n\n  // Order: custom actions → menu trigger → delete button\n  const actions =\n    tabData.actions || menuAction || deleteAction ? (\n      <>\n        {tabData.actions}\n        {menuAction}\n        {deleteAction}\n      </>\n    ) : undefined;\n\n  // Measure actions width to pass to Item for proper space allocation\n  useLayoutEffect(() => {\n    if (actions && actionsRef.current) {\n      setActionsWidth(Math.round(actionsRef.current.offsetWidth));\n    }\n  }, [actions]);\n\n  // Determine effective size\n  const effectiveSize = tabData.size ?? size ?? 'medium';\n  const itemSize =\n    effectiveType === 'radio'\n      ? RADIO_SIZE_MAP[effectiveSize === 'large' ? 'large' : 'medium']\n      : effectiveSize;\n\n  // Determine Item type prop\n  const itemType =\n    effectiveType === 'default' ? (isActive ? 'clear' : 'neutral') : 'neutral';\n\n  // Determine shape - file type uses sharp edges\n  const isFileType = effectiveType === 'file';\n  const itemShape = isFileType ? 'sharp' : undefined;\n\n  // Determine autoHideActions - tab-level overrides parent-level\n  const effectiveAutoHideActions =\n    tabData.autoHideActions ?? parentAutoHideActions;\n\n  // Render title with editing support if editable\n  const titleContent = effectiveIsEditable ? (\n    <EditableTitle\n      title={tabData.title}\n      isEditing={isEditing}\n      editValue={isEditing ? editValue : ''}\n      onEditValueChange={handleEditValueChange}\n      onStartEditing={handleStartEditing}\n      onSubmit={handleSubmitEditing}\n      onCancel={handleCancelEditing}\n    />\n  ) : (\n    tabData.title\n  );\n\n  // Extract tab-specific props and pass through the rest (style props) to the Item\n  const {\n    title: _title,\n    content: _content,\n    key: _key,\n    isDisabled: _isDisabled,\n    prerender: _prerender,\n    keepMounted: _keepMounted,\n    size: _size,\n    type: _type,\n    actions: _actions,\n    autoHideActions: _autoHideActions,\n    isEditable: _isEditable,\n    onTitleChange: _onTitleChange,\n    menu: _menu,\n    menuTriggerProps: _menuTriggerProps,\n    menuProps: _menuProps,\n    contextMenu: _contextMenu,\n    onAction: _onAction,\n    qa,\n    qaVal,\n    styles,\n    ...itemStyleProps\n  } = tabData;\n\n  // Use the hook's targetRef when context menu is enabled\n  const effectiveContainerRef =\n    effectiveContextMenu && processedMenu\n      ? contextMenu.targetRef\n      : containerRef;\n\n  // ARIA: indicate popup menu presence\n  const ariaProps = processedMenu ? { 'aria-haspopup': 'menu' as const } : {};\n\n  // Mods for TabContainer\n  const containerMods = {\n    ...mods,\n    'auto-hide-actions': effectiveAutoHideActions,\n  };\n\n  return (\n    <TabContainer\n      ref={effectiveContainerRef}\n      data-size={itemSize}\n      mods={containerMods}\n      tokens={{ '$actions-width': `${actionsWidth}px` }}\n      {...effectiveDragProps}\n    >\n      {/* Drop indicator before this tab */}\n      {isDraggable && dropState && (\n        <TabDropIndicator\n          target={{ type: 'item', key: item.key, dropPosition: 'before' }}\n          dropState={dropState}\n          position=\"before\"\n        />\n      )}\n      <TabElement\n        preserveActionsSpace\n        autoHideActions={effectiveAutoHideActions}\n        as=\"button\"\n        {...mergeProps(tabProps, hoverProps, focusProps, {\n          onKeyDown: handleKeyDown,\n        })}\n        {...ariaProps}\n        {...itemStyleProps}\n        ref={ref}\n        qa={qa ?? `Tab-${String(item.key)}`}\n        qaVal={qaVal}\n        styles={styles}\n        mods={mods}\n        isSelected={isActive}\n        isDisabled={isDisabled}\n        size={itemSize}\n        type={itemType}\n        shape={itemShape}\n        actions={actions ? true : undefined}\n      >\n        {titleContent}\n      </TabElement>\n      {/* Actions rendered outside the button for accessibility */}\n      {actions && (\n        <div\n          ref={actionsRef}\n          data-element=\"Actions\"\n          {...ACTIONS_EVENT_HANDLERS}\n        >\n          <ItemActionProvider\n            type={itemType}\n            theme=\"default\"\n            isDisabled={isDisabled}\n          >\n            {actions}\n          </ItemActionProvider>\n        </div>\n      )}\n      {effectiveContextMenu && processedMenu && contextMenu.rendered}\n      {/* Drop indicator after the last tab */}\n      {isDraggable && dropState && isLastTab && (\n        <TabDropIndicator\n          target={{ type: 'item', key: item.key, dropPosition: 'after' }}\n          dropState={dropState}\n          position=\"after\"\n        />\n      )}\n    </TabContainer>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"TabButton.js","names":["Menu","MenuTrigger","mergeProps"],"sources":["../../../../src/components/navigation/Tabs/TabButton.tsx"],"sourcesContent":["import {\n  Children,\n  cloneElement,\n  isValidElement,\n  ReactElement,\n  ReactNode,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  useDraggableItem,\n  useFocus,\n  useFocusVisible,\n  useHover,\n  useTab,\n} from 'react-aria';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { CloseIcon, MoreIcon } from '../../../icons';\nimport { mergeProps } from '../../../utils/react';\nimport { CubeItemActionProps, ItemAction } from '../../actions/ItemAction';\nimport { ItemActionProvider } from '../../actions/ItemActionContext';\nimport { CubeMenuProps, Menu, MenuTrigger } from '../../actions/Menu';\nimport { useContextMenu } from '../../actions/use-context-menu';\n\nimport { EditableTitle } from './EditableTitle';\nimport { TabContainer, TabElement } from './styled';\nimport { TabDropIndicator } from './TabDropIndicator';\nimport { useTabsContext } from './TabsContext';\nimport { ParsedTab, RADIO_SIZE_MAP } from './types';\n\nimport type { Key, Node } from '@react-types/shared';\nimport type { KeyboardEvent, MouseEvent, PointerEvent } from 'react';\nimport type { DraggableCollectionState } from 'react-stately';\n\n// =============================================================================\n// Event handlers for actions to prevent event propagation to tab button\n// =============================================================================\n\nconst ACTIONS_EVENT_HANDLERS = {\n  onClick: (e: MouseEvent) => e.stopPropagation(),\n  onPointerDown: (e: PointerEvent) => e.stopPropagation(),\n  onPointerUp: (e: PointerEvent) => e.stopPropagation(),\n  onMouseDown: (e: MouseEvent) => e.stopPropagation(),\n  onMouseUp: (e: MouseEvent) => e.stopPropagation(),\n  onKeyDown: (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.stopPropagation();\n    }\n  },\n};\n\n// =============================================================================\n// Menu Processing Utilities\n// =============================================================================\n\ninterface MenuItemLikeProps {\n  children?: ReactNode;\n  isDisabled?: boolean;\n  theme?: string;\n}\n\n/**\n * Extracts the raw key from a React element, stripping the \".$\" prefix\n * that React adds via Children.map/toArray.\n */\nfunction getRawKey(element: ReactElement): string | null {\n  if (element.key == null) return null;\n  const keyStr = String(element.key);\n  return keyStr.startsWith('.$') ? keyStr.slice(2) : keyStr;\n}\n\n/**\n * Process menu items for predefined action keys (rename, delete).\n * Auto-adds labels and disables items when requirements aren't met.\n */\nfunction processMenuItems(\n  children: ReactNode,\n  effectiveIsEditable: boolean,\n  isDeletable: boolean,\n): ReactNode {\n  return Children.toArray(children).map((child) => {\n    if (!isValidElement(child)) return child;\n\n    const childKey = getRawKey(child);\n    const childProps = child.props as MenuItemLikeProps;\n\n    // Handle predefined action keys\n    if (childKey === 'rename') {\n      return cloneElement(child as ReactElement<MenuItemLikeProps>, {\n        children: childProps.children ?? 'Rename',\n        isDisabled: childProps.isDisabled ?? !effectiveIsEditable,\n      });\n    }\n    if (childKey === 'delete') {\n      return cloneElement(child as ReactElement<MenuItemLikeProps>, {\n        children: childProps.children ?? 'Delete',\n        theme: childProps.theme ?? 'danger',\n        isDisabled: childProps.isDisabled ?? !isDeletable,\n      });\n    }\n\n    // Recursively process Menu.Section children\n    if (childProps.children && typeof childProps.children !== 'string') {\n      return cloneElement(child as ReactElement<MenuItemLikeProps>, {\n        children: processMenuItems(\n          childProps.children,\n          effectiveIsEditable,\n          isDeletable,\n        ),\n      });\n    }\n\n    return child;\n  });\n}\n\n/**\n * Check if menu children is empty (null, undefined, or empty fragment)\n */\nfunction isMenuEmpty(menu: ReactNode): boolean {\n  if (menu === null || menu === undefined) return true;\n  const children = Children.toArray(menu);\n  return children.length === 0;\n}\n\n// =============================================================================\n// TabButton Props\n// =============================================================================\n\nexport interface TabButtonProps {\n  /** React Aria collection item */\n  item: Node<object>;\n  /** Parsed tab data */\n  tabData: ParsedTab;\n  /** Whether this is the last tab (for drop indicator) */\n  isLastTab?: boolean;\n}\n\n// =============================================================================\n// TabButton Component\n// =============================================================================\n\n/**\n * Individual tab button component.\n *\n * Uses TabsContext to access shared props, dramatically reducing prop drilling.\n * Handles:\n * - Tab selection and keyboard navigation\n * - Inline title editing\n * - Menu and context menu\n * - Drag-and-drop reordering\n * - Focus and hover states\n */\nexport function TabButton({ item, tabData, isLastTab }: TabButtonProps) {\n  // Get shared context\n  const {\n    state,\n    type,\n    size,\n    autoHideActions: parentAutoHideActions,\n    isEditable: parentIsEditable,\n    menu: parentMenu,\n    menuTriggerProps: parentMenuTriggerProps,\n    menuProps: parentMenuProps,\n    contextMenu: parentContextMenu,\n    onAction: parentOnAction,\n    onDelete,\n    dragState,\n    dropState,\n    editingKey,\n    editValue,\n    setEditValue,\n    startEditing,\n    submitEditing,\n    cancelEditing,\n  } = useTabsContext();\n\n  const ref = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const actionsRef = useRef<HTMLDivElement>(null);\n  const { tabProps } = useTab({ key: item.key }, state, ref);\n\n  // Measure actions width for proper space allocation in Item\n  const [actionsWidth, setActionsWidth] = useState(0);\n\n  // Drag-and-drop support - only enable when both states are provided\n  const isDraggable = !!dragState && !!dropState;\n\n  // useDraggableItem must be called unconditionally (Rules of Hooks)\n  // When dragState is undefined, we pass a minimal mock state to satisfy the hook\n  const mockDragState = useMemo(\n    () =>\n      ({\n        collection: state.collection,\n        selectionManager: state.selectionManager,\n        isDragging: () => false,\n        getKeysForDrag: () => new Set<Key>(),\n        isDisabled: false,\n        startDrag: () => {},\n        endDrag: () => {},\n      }) as DraggableCollectionState,\n    [state.collection, state.selectionManager],\n  );\n\n  const dragResult = useDraggableItem(\n    { key: item.key },\n    dragState ?? mockDragState,\n  );\n  const effectiveDragProps = isDraggable ? dragResult.dragProps : {};\n  const isDragging = isDraggable && dragResult.isDragging;\n\n  // Controlled state for menu trigger (enables keyboard opening with Shift+F10)\n  const [isMenuOpen, setIsMenuOpen] = useState(false);\n\n  // Hover, focus, and focus-visible state handling\n  const { hoverProps, isHovered } = useHover({});\n  const [isFocused, setIsFocused] = useState(false);\n  const { focusProps } = useFocus({ onFocusChange: setIsFocused });\n  const { isFocusVisible } = useFocusVisible();\n\n  // Suppress focus-visible when restoring focus after editing\n  const [suppressFocusVisible, setSuppressFocusVisible] = useState(false);\n  const effectiveFocusVisible = isFocusVisible && !suppressFocusVisible;\n\n  const isActive = state.selectedKey === item.key;\n  const isDisabled = state.disabledKeys.has(item.key);\n  const isDeletable = !!onDelete;\n  const isEditing = editingKey === item.key;\n\n  // Compute effective values - Tab-level overrides Tabs-level\n  const effectiveIsEditable = tabData.isEditable ?? parentIsEditable ?? false;\n  const effectiveMenu =\n    tabData.menu === null ? null : tabData.menu ?? parentMenu;\n  const effectiveMenuTriggerProps: Partial<CubeItemActionProps> = {\n    ...parentMenuTriggerProps,\n    ...tabData.menuTriggerProps,\n  };\n  const effectiveMenuProps: Partial<CubeMenuProps<object>> = {\n    ...parentMenuProps,\n    ...tabData.menuProps,\n  };\n  const effectiveContextMenu =\n    tabData.contextMenu ?? parentContextMenu ?? false;\n  const effectiveType = tabData.type ?? type ?? 'default';\n\n  const contextMenuEnabled =\n    effectiveContextMenu === true || effectiveContextMenu === 'context-only';\n  const contextMenuOnly = effectiveContextMenu === 'context-only';\n\n  // Inline close when no menu, or context-only (no overflow trigger)\n  const showDeleteButton =\n    isDeletable && (isMenuEmpty(effectiveMenu) || contextMenuOnly);\n\n  // Process menu items for auto-labels and disabled states\n  const processedMenu =\n    effectiveMenu && !isMenuEmpty(effectiveMenu)\n      ? processMenuItems(effectiveMenu, effectiveIsEditable, isDeletable)\n      : null;\n\n  const itemKeyStr = String(item.key);\n\n  const handleDelete = useEvent(() => {\n    onDelete?.(itemKeyStr);\n  });\n\n  const handleStartEditing = useEvent(() => {\n    if (!effectiveIsEditable || isDisabled) return;\n\n    const titleText =\n      typeof tabData.title === 'string' ? tabData.title : itemKeyStr;\n\n    startEditing(itemKeyStr, titleText);\n  });\n\n  const handleSubmitEditing = useEvent(() => {\n    submitEditing(itemKeyStr, editValue, tabData.onTitleChange);\n    // Suppress focus-visible and restore focus to the tab button after editing\n    setSuppressFocusVisible(true);\n    requestAnimationFrame(() => {\n      ref.current?.focus();\n    });\n  });\n\n  const handleCancelEditing = useEvent(() => {\n    cancelEditing();\n    // Suppress focus-visible and restore focus to the tab button after editing\n    setSuppressFocusVisible(true);\n    requestAnimationFrame(() => {\n      ref.current?.focus();\n    });\n  });\n\n  const handleEditValueChange = useEvent((value: string) => {\n    setEditValue(value);\n  });\n\n  // Handle menu actions - predefined actions first, then callbacks\n  const handleMenuAction = useEvent((action: Key) => {\n    // Strip the \".$\" prefix that React adds via Children.toArray/map\n    const actionStr = String(action);\n    const normalizedAction = actionStr.startsWith('.$')\n      ? actionStr.slice(2)\n      : actionStr;\n\n    // Handle predefined actions first (only if requirements are met)\n    if (normalizedAction === 'rename' && effectiveIsEditable) {\n      handleStartEditing();\n    }\n    if (normalizedAction === 'delete' && isDeletable) {\n      onDelete?.(itemKeyStr);\n    }\n    // Call Tab-level onAction first (with normalized action)\n    tabData.onAction?.(normalizedAction);\n    // Then call Tabs-level onAction with tab key (with normalized action)\n    parentOnAction?.(normalizedAction, itemKeyStr);\n  });\n\n  const menuElement = processedMenu ? (\n    <Menu {...effectiveMenuProps} onAction={handleMenuAction}>\n      {processedMenu}\n    </Menu>\n  ) : null;\n\n  const contextMenu = useContextMenu<HTMLDivElement, CubeMenuProps<object>>(\n    Menu,\n    { placement: 'bottom start' },\n    {\n      ...effectiveMenuProps,\n      onAction: handleMenuAction,\n      children: processedMenu,\n    },\n  );\n\n  // Keyboard handler for accessibility shortcuts (WAI-ARIA Tabs Pattern)\n  const handleKeyDown = useEvent((e: KeyboardEvent) => {\n    // Reset focus-visible suppression on any keyboard interaction\n    if (suppressFocusVisible) {\n      setSuppressFocusVisible(false);\n    }\n\n    // F2 to start editing (standard rename shortcut)\n    if (e.key === 'F2' && effectiveIsEditable && !isDisabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      handleStartEditing();\n    }\n\n    // Shift+F10 opens the menu (standard context menu shortcut)\n    if (e.key === 'F10' && e.shiftKey && processedMenu) {\n      e.preventDefault();\n      e.stopPropagation();\n      if (contextMenuOnly) {\n        contextMenu.open();\n      } else {\n        setIsMenuOpen(true);\n      }\n    }\n\n    // Delete key for direct tab deletion (ARIA Tabs pattern optional feature)\n    // Skip when editing to allow normal text editing operations\n    if (\n      (e.key === 'Delete' || e.key === 'Backspace') &&\n      isDeletable &&\n      !isEditing\n    ) {\n      e.preventDefault();\n      onDelete?.(itemKeyStr);\n    }\n  });\n\n  const mods = useMemo(\n    () => ({\n      type: effectiveType,\n      active: isActive,\n      deletable: isDeletable,\n      disabled: isDisabled,\n      editing: isEditing,\n      hovered: isHovered,\n      focused: isFocused,\n      'focus-visible': effectiveFocusVisible,\n      draggable: isDraggable,\n      dragging: isDragging,\n    }),\n    [\n      effectiveType,\n      isActive,\n      isDeletable,\n      isDisabled,\n      isEditing,\n      isHovered,\n      isFocused,\n      effectiveFocusVisible,\n      isDraggable,\n      isDragging,\n    ],\n  );\n\n  // Scroll active tab into view\n  useEffect(() => {\n    if (ref.current && isActive) {\n      ref.current.scrollIntoView?.({ block: 'nearest', inline: 'nearest' });\n    }\n  }, [isActive]);\n\n  // Overflow trigger (hidden in context-only mode)\n  const menuAction =\n    menuElement && !contextMenuOnly ? (\n      <MenuTrigger isOpen={isMenuOpen} onOpenChange={setIsMenuOpen}>\n        <ItemAction\n          tabIndex={-1}\n          icon={<MoreIcon />}\n          {...effectiveMenuTriggerProps}\n        />\n        {menuElement}\n      </MenuTrigger>\n    ) : null;\n\n  // Build delete button (only shown when no menu)\n  const deleteAction = showDeleteButton ? (\n    <ItemAction\n      tabIndex={-1}\n      icon={<CloseIcon />}\n      tooltip=\"Close\"\n      onPress={handleDelete}\n    />\n  ) : null;\n\n  // Order: custom actions → menu trigger → delete button\n  const actions =\n    tabData.actions || menuAction || deleteAction ? (\n      <>\n        {tabData.actions}\n        {menuAction}\n        {deleteAction}\n      </>\n    ) : undefined;\n\n  // Measure actions width to pass to Item for proper space allocation\n  useLayoutEffect(() => {\n    if (actions && actionsRef.current) {\n      setActionsWidth(Math.round(actionsRef.current.offsetWidth));\n    }\n  }, [actions]);\n\n  // Determine effective size\n  const effectiveSize = tabData.size ?? size ?? 'medium';\n  const itemSize =\n    effectiveType === 'radio'\n      ? RADIO_SIZE_MAP[effectiveSize === 'large' ? 'large' : 'medium']\n      : effectiveSize;\n\n  // Determine Item type prop\n  const itemType =\n    effectiveType === 'default' ? (isActive ? 'clear' : 'neutral') : 'neutral';\n\n  // Determine shape - file type uses sharp edges\n  const isFileType = effectiveType === 'file';\n  const itemShape = isFileType ? 'sharp' : undefined;\n\n  // Determine autoHideActions - tab-level overrides parent-level\n  const effectiveAutoHideActions =\n    tabData.autoHideActions ?? parentAutoHideActions;\n\n  // Render title with editing support if editable\n  const titleContent = effectiveIsEditable ? (\n    <EditableTitle\n      title={tabData.title}\n      isEditing={isEditing}\n      editValue={isEditing ? editValue : ''}\n      onEditValueChange={handleEditValueChange}\n      onStartEditing={handleStartEditing}\n      onSubmit={handleSubmitEditing}\n      onCancel={handleCancelEditing}\n    />\n  ) : (\n    tabData.title\n  );\n\n  // Extract tab-specific props and pass through the rest (style props) to the Item\n  const {\n    title: _title,\n    content: _content,\n    key: _key,\n    isDisabled: _isDisabled,\n    prerender: _prerender,\n    keepMounted: _keepMounted,\n    size: _size,\n    type: _type,\n    actions: _actions,\n    autoHideActions: _autoHideActions,\n    isEditable: _isEditable,\n    onTitleChange: _onTitleChange,\n    menu: _menu,\n    menuTriggerProps: _menuTriggerProps,\n    menuProps: _menuProps,\n    contextMenu: _contextMenu,\n    onAction: _onAction,\n    qa,\n    qaVal,\n    styles,\n    ...itemStyleProps\n  } = tabData;\n\n  // Use the hook's targetRef when context menu is enabled\n  const effectiveContainerRef =\n    contextMenuEnabled && processedMenu ? contextMenu.targetRef : containerRef;\n\n  // ARIA: indicate popup menu presence\n  const ariaProps = processedMenu ? { 'aria-haspopup': 'menu' as const } : {};\n\n  // Mods for TabContainer\n  const containerMods = {\n    ...mods,\n    'auto-hide-actions': effectiveAutoHideActions,\n  };\n\n  return (\n    <TabContainer\n      ref={effectiveContainerRef}\n      data-size={itemSize}\n      mods={containerMods}\n      tokens={{ '$actions-width': `${actionsWidth}px` }}\n      {...effectiveDragProps}\n    >\n      {/* Drop indicator before this tab */}\n      {isDraggable && dropState && (\n        <TabDropIndicator\n          target={{ type: 'item', key: item.key, dropPosition: 'before' }}\n          dropState={dropState}\n          position=\"before\"\n        />\n      )}\n      <TabElement\n        preserveActionsSpace\n        autoHideActions={effectiveAutoHideActions}\n        as=\"button\"\n        {...mergeProps(tabProps, hoverProps, focusProps, {\n          onKeyDown: handleKeyDown,\n        })}\n        {...ariaProps}\n        {...itemStyleProps}\n        ref={ref}\n        qa={qa ?? `Tab-${String(item.key)}`}\n        qaVal={qaVal}\n        styles={styles}\n        mods={mods}\n        isSelected={isActive}\n        isDisabled={isDisabled}\n        size={itemSize}\n        type={itemType}\n        shape={itemShape}\n        actions={actions ? true : undefined}\n      >\n        {titleContent}\n      </TabElement>\n      {/* Actions rendered outside the button for accessibility */}\n      {actions && (\n        <div\n          ref={actionsRef}\n          data-element=\"Actions\"\n          {...ACTIONS_EVENT_HANDLERS}\n        >\n          <ItemActionProvider\n            type={itemType}\n            theme=\"default\"\n            isDisabled={isDisabled}\n          >\n            {actions}\n          </ItemActionProvider>\n        </div>\n      )}\n      {contextMenuEnabled && processedMenu && contextMenu.rendered}\n      {/* Drop indicator after the last tab */}\n      {isDraggable && dropState && isLastTab && (\n        <TabDropIndicator\n          target={{ type: 'item', key: item.key, dropPosition: 'after' }}\n          dropState={dropState}\n          position=\"after\"\n        />\n      )}\n    </TabContainer>\n  );\n}\n"],"mappings":"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"}

package/dist/components/navigation/Tabs/TabDropIndicator.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { DropIndicatorElement } from "./styled.js";
 import { useEffect, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/navigation/Tabs/TabPanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { TabPanelElement } from "./styled.js";
 import { useEffect, useMemo, useRef } from "react";
 import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";

package/dist/components/navigation/Tabs/TabPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { CloseIcon } from "../../../icons/CloseIcon.js";
 import { MoreIcon } from "../../../icons/MoreIcon.js";

package/dist/components/navigation/Tabs/Tabs.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
@@ -67,9 +67,14 @@ function TabsComponent(props, ref) {
 	const listRef = useRef(null);
 	const scrollRef = useRef(null);
 	const visitedKeysRef = useRef(/* @__PURE__ */ new Set());
+	const onTitleChangeRaf = useEvent((key, newTitle) => {
+		requestAnimationFrame(() => {
+			onTitleChange?.(key, newTitle);
+		});
+	});
 	const { editingKey, editValue, setEditValue, startEditing, cancelEditing, submitEditing } = useTabEditing({
 		onChange,
-		onTitleChange
+		onTitleChange: onTitleChange ? onTitleChangeRaf : void 0
 	});
 	const { parsedTabs, explicitPanels, hasAnyContent } = useMemo(() => {
 		const childArray = Children.toArray(children);

package/dist/components/navigation/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","names":["CollectionItem","mergeProps"],"sources":["../../../../src/components/navigation/Tabs/Tabs.tsx"],"sourcesContent":["import { mergeStyles, OUTER_STYLES } from '@tenphi/tasty';\nimport {\n  Children,\n  ForwardedRef,\n  forwardRef,\n  isValidElement,\n  ReactElement,\n  ReactNode,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\nimport { AriaTabListProps, useTabList } from 'react-aria';\nimport {\n  Item as CollectionItem,\n  DraggableCollectionState,\n  DroppableCollectionState,\n  useTabListState,\n} from 'react-stately';\n\nimport { useEvent, useWarn } from '../../../_internal/hooks';\nimport { DirectionIcon } from '../../../icons';\nimport { mergeProps, useMergeStyles } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useTinyScrollbar } from '../../content/Layout/hooks/useTinyScrollbar';\n\nimport { DraggableTabList } from './DraggableTabList';\nimport { TabIndicatorElement, TabsElement } from './styled';\nimport { TabButton } from './TabButton';\nimport { CachedPanelRenderer, TabPanelRenderer } from './TabPanel';\nimport { TabPicker } from './TabPicker';\nimport { TabsAction } from './TabsAction';\nimport { TabsContextValue, TabsProvider } from './TabsContext';\nimport { useTabEditing } from './use-tab-editing';\nimport { useTabIndicator } from './use-tab-indicator';\n\nimport type { Key } from '@react-types/shared';\nimport type {\n  CubeTabListProps,\n  CubeTabPanelProps,\n  CubeTabProps,\n  CubeTabsProps,\n  ParsedPanel,\n  ParsedTab,\n} from './types';\n\n// =============================================================================\n// Helper Functions\n// =============================================================================\n\n/**\n * Generic helper to check if a child is a specific component by displayName.\n */\nfunction isComponentElement<T>(\n  child: ReactNode,\n  displayName: string,\n): child is ReactElement<T> {\n  return (\n    isValidElement(child) &&\n    typeof child.type === 'function' &&\n    (child.type as any).displayName === displayName\n  );\n}\n\n/** Checks if a child is a Tab component. */\nconst isTabElement = (child: ReactNode): child is ReactElement<CubeTabProps> =>\n  isComponentElement<CubeTabProps>(child, 'CubeTab');\n\n/** Checks if a child is a TabPanel component. */\nconst isTabPanelElement = (\n  child: ReactNode,\n): child is ReactElement<CubeTabPanelProps> =>\n  isComponentElement<CubeTabPanelProps>(child, 'CubeTabPanel');\n\n/** Checks if a child is a TabList component. */\nconst isTabListElement = (\n  child: ReactNode,\n): child is ReactElement<CubeTabListProps> =>\n  isComponentElement<CubeTabListProps>(child, 'CubeTabList');\n\n/**\n * Extracts the raw key from a React element, stripping the \".$\" prefix\n * that React adds via Children.map/toArray.\n */\nfunction getRawKey(element: ReactElement): string | null {\n  if (element.key == null) return null;\n  const keyStr = String(element.key);\n  return keyStr.startsWith('.$') ? keyStr.slice(2) : keyStr;\n}\n\n// =============================================================================\n// Tab Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction Tab(_props: CubeTabProps): ReactElement | null {\n  return null;\n}\n\nTab.displayName = 'CubeTab';\n\n// =============================================================================\n// TabPanel Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabPanel(_props: CubeTabPanelProps): ReactElement | null {\n  return null;\n}\n\nTabPanel.displayName = 'CubeTabPanel';\n\n// =============================================================================\n// TabList Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabList(_props: CubeTabListProps): ReactElement | null {\n  return null;\n}\n\nTabList.displayName = 'CubeTabList';\n\n// =============================================================================\n// Main Tabs Component\n// =============================================================================\n\nfunction TabsComponent(\n  props: CubeTabsProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    label = 'Tabs',\n    defaultActiveKey,\n    activeKey,\n    size,\n    type = 'default',\n    onChange,\n    onDelete,\n    onTitleChange,\n    autoHideActions,\n    isEditable: parentIsEditable,\n    menu: parentMenu,\n    menuTriggerProps: parentMenuTriggerProps,\n    menuProps: parentMenuProps,\n    contextMenu: parentContextMenu,\n    onAction: parentOnAction,\n    children,\n    prefix,\n    suffix,\n    prerender = false,\n    keepMounted = false,\n    qa = 'Tabs',\n    renderPanel,\n    panelCacheKeys,\n    isReorderable = false,\n    keyOrder,\n    onReorder,\n    showTabPicker = false,\n    showScrollArrows = false,\n    tabPickerPosition = 'suffix',\n    scrollArrowsPosition = 'suffix',\n    tabListPadding,\n    tabListStyles,\n    prefixStyles,\n    suffixStyles,\n    ...otherProps\n  } = props;\n\n  // Extract outer styles\n  const baseStyles = extractStyles(otherProps, OUTER_STYLES);\n\n  // Build TabList padding style (memoized)\n  const tabListPaddingStyles = useMemo(\n    () =>\n      tabListPadding ? { '$tablist-padding': `${tabListPadding}` } : undefined,\n    [tabListPadding],\n  );\n\n  // Merge tabListPaddingStyles with tabListStyles (memoized)\n  const mergedTabListStyles = useMemo(\n    () => mergeStyles(tabListPaddingStyles, tabListStyles),\n    [tabListPaddingStyles, tabListStyles],\n  );\n\n  // Merge all sub-element styles into baseStyles\n  const combinedStyles = useMergeStyles(baseStyles, {\n    TabList: mergedTabListStyles,\n    Prefix: prefixStyles,\n    Suffix: suffixStyles,\n  });\n\n  // DOM element refs\n  const listRef = useRef<HTMLDivElement>(null);\n  const scrollRef = useRef<HTMLDivElement>(null);\n\n  // Track visited tabs for keepMounted functionality\n  const visitedKeysRef = useRef<Set<string>>(new Set());\n\n  // =========================================================================\n  // Tab Title Editing Hook\n  // =========================================================================\n  const {\n    editingKey,\n    editValue,\n    setEditValue,\n    startEditing,\n    cancelEditing,\n    submitEditing,\n  } = useTabEditing({ onChange, onTitleChange });\n\n  // =========================================================================\n  // Parse children to extract tabs and explicit panels\n  // =========================================================================\n  const { parsedTabs, explicitPanels, hasAnyContent } = useMemo(() => {\n    const childArray = Children.toArray(children);\n    const tabs: ParsedTab[] = [];\n    const panels = new Map<string, ParsedPanel>();\n    let hasExplicitList = false;\n    let tabChildren: ReactNode[] = [];\n\n    // Check for explicit Tabs.List / Tabs.Panel structure\n    for (const child of childArray) {\n      if (isTabListElement(child)) {\n        hasExplicitList = true;\n        tabChildren = Children.toArray(child.props.children);\n      } else if (isTabPanelElement(child)) {\n        const key = getRawKey(child as ReactElement);\n\n        if (key != null) {\n          panels.set(key, {\n            key,\n            content: child.props.children,\n            prerender: child.props.prerender,\n            keepMounted: child.props.keepMounted,\n            styles: child.props.styles,\n            qa: child.props.qa,\n            qaVal: child.props.qaVal,\n          });\n        }\n      }\n    }\n\n    // If no explicit list, use direct Tab children\n    if (!hasExplicitList) {\n      tabChildren = childArray;\n    }\n\n    // Parse Tab elements\n    let hasContent = panels.size > 0;\n\n    for (const child of tabChildren) {\n      if (isTabElement(child)) {\n        const key = getRawKey(child) ?? child.props.id;\n\n        if (key != null) {\n          const { id: _id, children: tabContent, ...tabProps } = child.props;\n\n          tabs.push({\n            ...tabProps,\n            key,\n            content: tabContent,\n          });\n\n          if (tabContent != null) {\n            hasContent = true;\n          }\n        }\n      }\n    }\n\n    return {\n      parsedTabs: tabs,\n      explicitPanels: panels,\n      hasAnyContent: hasContent,\n    };\n  }, [children]);\n\n  // Clean up visitedKeys when tabs are removed\n  const currentTabKeysSet = useMemo(\n    () => new Set(parsedTabs.map((t) => t.key)),\n    [parsedTabs],\n  );\n\n  useEffect(() => {\n    for (const key of visitedKeysRef.current) {\n      if (!currentTabKeysSet.has(key)) {\n        visitedKeysRef.current.delete(key);\n      }\n    }\n  }, [currentTabKeysSet]);\n\n  // =========================================================================\n  // Order tabs according to keyOrder\n  // =========================================================================\n  const orderedParsedTabs = useMemo(() => {\n    if (!keyOrder || keyOrder.length === 0) {\n      return parsedTabs;\n    }\n\n    const tabMap = new Map<string, ParsedTab>();\n    for (const tab of parsedTabs) {\n      tabMap.set(tab.key, tab);\n    }\n\n    const ordered: ParsedTab[] = [];\n    for (const key of keyOrder) {\n      const tab = tabMap.get(String(key));\n      if (tab) {\n        ordered.push(tab);\n        tabMap.delete(String(key));\n      }\n    }\n\n    // Append any tabs not in keyOrder\n    for (const tab of parsedTabs) {\n      if (tabMap.has(tab.key)) {\n        ordered.push(tab);\n      }\n    }\n\n    return ordered;\n  }, [parsedTabs, keyOrder]);\n\n  // Create collection items for React Stately\n  const collectionItems = useMemo(() => {\n    return orderedParsedTabs.map((tab) => (\n      <CollectionItem\n        key={tab.key}\n        textValue={typeof tab.title === 'string' ? tab.title : String(tab.key)}\n      >\n        {tab.title}\n      </CollectionItem>\n    ));\n  }, [orderedParsedTabs]);\n\n  // Determine disabled keys\n  const disabledKeys = useMemo(() => {\n    return new Set(\n      parsedTabs.filter((tab) => tab.isDisabled).map((tab) => tab.key),\n    );\n  }, [parsedTabs]);\n\n  // Handle selection change (converts React Aria's Key to string for our API)\n  const handleSelectionChange = useEvent((key: Key) => {\n    const keyStr = String(key);\n    visitedKeysRef.current.add(keyStr);\n    onChange?.(keyStr);\n  });\n\n  // Convert keys to strings for React Aria compatibility\n  const selectedKey = activeKey != null ? String(activeKey) : undefined;\n  const defaultSelectedKey =\n    defaultActiveKey != null ? String(defaultActiveKey) : undefined;\n\n  // Create aria props for useTabListState\n  const ariaProps: AriaTabListProps<object> = useMemo(\n    () => ({\n      selectedKey,\n      defaultSelectedKey,\n      onSelectionChange: handleSelectionChange,\n      disabledKeys,\n      children: collectionItems,\n      'aria-label': label,\n    }),\n    [\n      selectedKey,\n      defaultSelectedKey,\n      handleSelectionChange,\n      disabledKeys,\n      collectionItems,\n      label,\n    ],\n  );\n\n  // Create state using useTabListState\n  const state = useTabListState(ariaProps);\n\n  // Track initial selected key for visited tabs\n  useEffect(() => {\n    if (state.selectedKey != null) {\n      visitedKeysRef.current.add(String(state.selectedKey));\n    }\n  }, [state.selectedKey]);\n\n  // Get tablist props from react-aria\n  const { tabListProps } = useTabList(ariaProps, state, listRef);\n\n  // Handle selection from TabPicker (needs to update internal state in uncontrolled mode)\n  const handleTabPickerSelect = useEvent((key: string) => {\n    // Update internal state (for uncontrolled mode)\n    state.setSelectedKey(key);\n    // Also call the external onChange handler\n    handleSelectionChange(key);\n  });\n\n  // =========================================================================\n  // Tab Indicator (for default type)\n  // =========================================================================\n  // Create order token that changes when tab order changes (for indicator recalculation)\n  const orderToken = useMemo(\n    () => orderedParsedTabs.map((t) => t.key).join(','),\n    [orderedParsedTabs],\n  );\n\n  const indicatorStyle = useTabIndicator(\n    listRef,\n    state.selectedKey,\n    type === 'default' || type === 'narrow',\n    orderToken,\n  );\n\n  // =========================================================================\n  // Tiny Scrollbar (not for radio type)\n  // =========================================================================\n  const isTinyScrollbar = type !== 'radio';\n  const { handleHStyle, hasOverflowX, isScrolling, isAtStartX, isAtEndX } =\n    useTinyScrollbar(scrollRef, isTinyScrollbar);\n\n  const hasPanels = hasAnyContent || !!renderPanel;\n\n  // =========================================================================\n  // Tab Picker visibility\n  // =========================================================================\n  useWarn(showTabPicker && type === 'radio', {\n    key: ['tabs-tabpicker-radio-unsupported'],\n    args: [\n      'Tabs:',\n      '`showTabPicker` is not supported when `type=\"radio\"`. The TabPicker will not be rendered.',\n    ],\n  });\n\n  const shouldShowTabPicker =\n    type !== 'radio' &&\n    (showTabPicker === true || (showTabPicker === 'auto' && hasOverflowX));\n\n  // =========================================================================\n  // Scroll Arrows visibility and handlers\n  // =========================================================================\n  useWarn(showScrollArrows && type === 'radio', {\n    key: ['tabs-scrollarrows-radio-unsupported'],\n    args: [\n      'Tabs:',\n      '`showScrollArrows` is not supported when `type=\"radio\"`. The scroll arrows will not be rendered.',\n    ],\n  });\n\n  const shouldShowScrollArrows =\n    type !== 'radio' &&\n    (showScrollArrows === true ||\n      (showScrollArrows === 'auto' && hasOverflowX));\n\n  const handleScrollLeft = useEvent(() => {\n    const el = scrollRef.current;\n    if (el) {\n      el.scrollTo({\n        left: el.scrollLeft - el.clientWidth,\n        behavior: 'smooth',\n      });\n    }\n  });\n\n  const handleScrollRight = useEvent(() => {\n    const el = scrollRef.current;\n    if (el) {\n      el.scrollTo({\n        left: el.scrollLeft + el.clientWidth,\n        behavior: 'smooth',\n      });\n    }\n  });\n\n  // =========================================================================\n  // Base Context Value (without drag/drop states)\n  // =========================================================================\n  const baseContextValue = useMemo(\n    () => ({\n      state,\n      type,\n      size,\n      autoHideActions,\n      isEditable: parentIsEditable,\n      menu: parentMenu,\n      menuTriggerProps: parentMenuTriggerProps,\n      menuProps: parentMenuProps,\n      contextMenu: parentContextMenu,\n      onDelete,\n      onAction: parentOnAction,\n      editingKey,\n      editValue,\n      setEditValue,\n      startEditing,\n      submitEditing,\n      cancelEditing,\n    }),\n    [\n      state,\n      type,\n      size,\n      autoHideActions,\n      parentIsEditable,\n      parentMenu,\n      parentMenuTriggerProps,\n      parentMenuProps,\n      parentContextMenu,\n      onDelete,\n      parentOnAction,\n      editingKey,\n      editValue,\n      setEditValue,\n      startEditing,\n      submitEditing,\n      cancelEditing,\n    ],\n  );\n\n  // Helper to create full context value with optional drag/drop states\n  const createContextValue = (\n    dragState?: DraggableCollectionState,\n    dropState?: DroppableCollectionState,\n  ): TabsContextValue => ({\n    ...baseContextValue,\n    dragState,\n    dropState,\n  });\n\n  // =========================================================================\n  // Tab List Content Renderer\n  // =========================================================================\n  const renderTabListContent = (\n    contextValue: TabsContextValue,\n    collectionProps: Record<string, unknown> = {},\n  ) => (\n    <div\n      {...mergeProps(tabListProps, collectionProps)}\n      ref={listRef}\n      data-element=\"TabList\"\n    >\n      <TabsProvider value={contextValue}>\n        {orderedParsedTabs.map((tab, index) => {\n          const item = state.collection.getItem(tab.key);\n          if (!item) return null;\n\n          return (\n            <TabButton\n              key={item.key}\n              item={item}\n              tabData={tab}\n              isLastTab={index === orderedParsedTabs.length - 1}\n            />\n          );\n        })}\n      </TabsProvider>\n      {indicatorStyle && (\n        <TabIndicatorElement\n          style={{\n            left: indicatorStyle.left,\n            width: indicatorStyle.width,\n          }}\n        />\n      )}\n    </div>\n  );\n\n  // =========================================================================\n  // Mods for styling\n  // =========================================================================\n  const mods = useMemo(\n    () => ({\n      type,\n      size,\n      deletable: !!onDelete,\n      scrolling: isScrolling,\n      'fade-left': !isAtStartX,\n      'fade-right': !isAtEndX,\n      'has-panels': hasPanels,\n    }),\n    [type, size, onDelete, isScrolling, isAtStartX, isAtEndX, hasPanels],\n  );\n\n  // =========================================================================\n  // Action Elements (TabPicker and Scroll Arrows)\n  // =========================================================================\n  const scrollArrowsElement = shouldShowScrollArrows ? (\n    <>\n      <TabsAction\n        icon={<DirectionIcon to=\"left\" />}\n        aria-label=\"Scroll tabs left\"\n        isDisabled={isAtStartX}\n        onPress={handleScrollLeft}\n      />\n      <TabsAction\n        icon={<DirectionIcon to=\"right\" />}\n        aria-label=\"Scroll tabs right\"\n        isDisabled={isAtEndX}\n        onPress={handleScrollRight}\n      />\n    </>\n  ) : null;\n\n  const tabPickerElement = shouldShowTabPicker ? (\n    <TabPicker\n      tabs={orderedParsedTabs}\n      selectedKey={state.selectedKey}\n      size={size}\n      type={type}\n      onSelect={handleTabPickerSelect}\n      onDelete={onDelete}\n    />\n  ) : null;\n\n  // Determine which actions go in prefix/suffix\n  // In prefix: TabPicker first (left), then scroll arrows (right)\n  // In suffix: scroll arrows first (left), then TabPicker (right)\n  const prefixHasActions =\n    (shouldShowTabPicker && tabPickerPosition === 'prefix') ||\n    (shouldShowScrollArrows && scrollArrowsPosition === 'prefix');\n\n  const suffixHasActions =\n    (shouldShowTabPicker && tabPickerPosition === 'suffix') ||\n    (shouldShowScrollArrows && scrollArrowsPosition === 'suffix');\n\n  // Wrap with TabsProvider so prefix/suffix can access context (size, type)\n  // The inner TabsProvider in renderTabListContent will override for tab buttons\n  return (\n    <TabsProvider value={baseContextValue}>\n      <TabsElement\n        ref={ref}\n        qa={qa}\n        mods={mods}\n        styles={combinedStyles}\n        style={handleHStyle}\n        data-size={size}\n      >\n        {prefix || prefixHasActions ? (\n          <div data-element=\"Prefix\">\n            {tabPickerPosition === 'prefix' && tabPickerElement}\n            {scrollArrowsPosition === 'prefix' && scrollArrowsElement}\n            {prefix}\n          </div>\n        ) : null}\n        <div data-element=\"ScrollWrapper\">\n          <div ref={scrollRef} data-element=\"Scroll\">\n            {isReorderable ? (\n              <DraggableTabList\n                state={state}\n                listRef={listRef}\n                orderedKeys={orderedParsedTabs.map((t) => t.key)}\n                onReorder={onReorder}\n              >\n                {(dragState, dropState, collectionProps) =>\n                  renderTabListContent(\n                    createContextValue(dragState, dropState),\n                    collectionProps,\n                  )\n                }\n              </DraggableTabList>\n            ) : (\n              renderTabListContent(createContextValue())\n            )}\n          </div>\n          {isTinyScrollbar && hasOverflowX && <div data-element=\"ScrollbarH\" />}\n        </div>\n        {suffix || suffixHasActions ? (\n          <div data-element=\"Suffix\">\n            {scrollArrowsPosition === 'suffix' && scrollArrowsElement}\n            {tabPickerPosition === 'suffix' && tabPickerElement}\n            {suffix}\n          </div>\n        ) : null}\n      </TabsElement>\n\n      {/* Functional panel rendering with content caching */}\n      {renderPanel && (\n        <CachedPanelRenderer\n          parsedTabs={parsedTabs}\n          explicitPanels={explicitPanels}\n          state={state}\n          renderPanel={renderPanel}\n          panelCacheKeys={panelCacheKeys}\n          prerender={prerender}\n          keepMounted={keepMounted}\n          visitedKeys={visitedKeysRef.current}\n        />\n      )}\n\n      {/* Static panel rendering (traditional children-based approach) */}\n      {!renderPanel &&\n        hasAnyContent &&\n        parsedTabs.map((tab) => {\n          const explicitPanel = explicitPanels.get(tab.key);\n          const content = explicitPanel?.content ?? tab.content;\n\n          if (content == null) return null;\n\n          return (\n            <TabPanelRenderer\n              key={tab.key}\n              tabKey={tab.key}\n              state={state}\n              content={content}\n              prerender={prerender}\n              keepMounted={keepMounted}\n              tabPrerender={explicitPanel?.prerender ?? tab.prerender}\n              tabKeepMounted={explicitPanel?.keepMounted ?? tab.keepMounted}\n              visitedKeys={visitedKeysRef.current}\n              panelStyles={explicitPanel?.styles}\n              qa={explicitPanel?.qa}\n              qaVal={explicitPanel?.qaVal}\n            />\n          );\n        })}\n    </TabsProvider>\n  );\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nconst _Tabs = forwardRef(TabsComponent);\n\n/**\n * Tabs component for organizing content into multiple panels.\n * Built with React Aria for full accessibility support.\n *\n * **Note:** Tab keys are internally converted to strings for React Aria compatibility.\n *\n * @example\n * // Simple usage\n * <Tabs defaultActiveKey=\"tab1\">\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content 1</Tab>\n *   <Tab key=\"tab2\" title=\"Tab 2\">Content 2</Tab>\n * </Tabs>\n *\n * @example\n * // Tabs-only (no panels)\n * <Tabs activeKey={activeTab} onChange={setActiveTab}>\n *   <Tab key=\"overview\" title=\"Overview\" />\n *   <Tab key=\"settings\" title=\"Settings\" />\n * </Tabs>\n *\n * @example\n * // Explicit panels\n * <Tabs defaultActiveKey=\"tab1\">\n *   <Tabs.List>\n *     <Tab key=\"tab1\" title=\"Tab 1\" />\n *     <Tab key=\"tab2\" title=\"Tab 2\" />\n *   </Tabs.List>\n *   <Tabs.Panel key=\"tab1\">Content 1</Tabs.Panel>\n *   <Tabs.Panel key=\"tab2\">Content 2</Tabs.Panel>\n * </Tabs>\n */\nexport const Tabs = Object.assign(_Tabs, {\n  Tab,\n  List: TabList,\n  Panel: TabPanel,\n  Action: TabsAction,\n});\n\nexport { Tab, TabList, TabPanel, TabsAction };\n"],"mappings":"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"}
+{"version":3,"file":"Tabs.js","names":["CollectionItem","mergeProps"],"sources":["../../../../src/components/navigation/Tabs/Tabs.tsx"],"sourcesContent":["import { mergeStyles, OUTER_STYLES } from '@tenphi/tasty';\nimport {\n  Children,\n  ForwardedRef,\n  forwardRef,\n  isValidElement,\n  ReactElement,\n  ReactNode,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\nimport { AriaTabListProps, useTabList } from 'react-aria';\nimport {\n  Item as CollectionItem,\n  DraggableCollectionState,\n  DroppableCollectionState,\n  useTabListState,\n} from 'react-stately';\n\nimport { useEvent, useWarn } from '../../../_internal/hooks';\nimport { DirectionIcon } from '../../../icons';\nimport { mergeProps, useMergeStyles } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useTinyScrollbar } from '../../content/Layout/hooks/useTinyScrollbar';\n\nimport { DraggableTabList } from './DraggableTabList';\nimport { TabIndicatorElement, TabsElement } from './styled';\nimport { TabButton } from './TabButton';\nimport { CachedPanelRenderer, TabPanelRenderer } from './TabPanel';\nimport { TabPicker } from './TabPicker';\nimport { TabsAction } from './TabsAction';\nimport { TabsContextValue, TabsProvider } from './TabsContext';\nimport { useTabEditing } from './use-tab-editing';\nimport { useTabIndicator } from './use-tab-indicator';\n\nimport type { Key } from '@react-types/shared';\nimport type {\n  CubeTabListProps,\n  CubeTabPanelProps,\n  CubeTabProps,\n  CubeTabsProps,\n  ParsedPanel,\n  ParsedTab,\n} from './types';\n\n// =============================================================================\n// Helper Functions\n// =============================================================================\n\n/**\n * Generic helper to check if a child is a specific component by displayName.\n */\nfunction isComponentElement<T>(\n  child: ReactNode,\n  displayName: string,\n): child is ReactElement<T> {\n  return (\n    isValidElement(child) &&\n    typeof child.type === 'function' &&\n    (child.type as any).displayName === displayName\n  );\n}\n\n/** Checks if a child is a Tab component. */\nconst isTabElement = (child: ReactNode): child is ReactElement<CubeTabProps> =>\n  isComponentElement<CubeTabProps>(child, 'CubeTab');\n\n/** Checks if a child is a TabPanel component. */\nconst isTabPanelElement = (\n  child: ReactNode,\n): child is ReactElement<CubeTabPanelProps> =>\n  isComponentElement<CubeTabPanelProps>(child, 'CubeTabPanel');\n\n/** Checks if a child is a TabList component. */\nconst isTabListElement = (\n  child: ReactNode,\n): child is ReactElement<CubeTabListProps> =>\n  isComponentElement<CubeTabListProps>(child, 'CubeTabList');\n\n/**\n * Extracts the raw key from a React element, stripping the \".$\" prefix\n * that React adds via Children.map/toArray.\n */\nfunction getRawKey(element: ReactElement): string | null {\n  if (element.key == null) return null;\n  const keyStr = String(element.key);\n  return keyStr.startsWith('.$') ? keyStr.slice(2) : keyStr;\n}\n\n// =============================================================================\n// Tab Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction Tab(_props: CubeTabProps): ReactElement | null {\n  return null;\n}\n\nTab.displayName = 'CubeTab';\n\n// =============================================================================\n// TabPanel Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabPanel(_props: CubeTabPanelProps): ReactElement | null {\n  return null;\n}\n\nTabPanel.displayName = 'CubeTabPanel';\n\n// =============================================================================\n// TabList Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabList(_props: CubeTabListProps): ReactElement | null {\n  return null;\n}\n\nTabList.displayName = 'CubeTabList';\n\n// =============================================================================\n// Main Tabs Component\n// =============================================================================\n\nfunction TabsComponent(\n  props: CubeTabsProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    label = 'Tabs',\n    defaultActiveKey,\n    activeKey,\n    size,\n    type = 'default',\n    onChange,\n    onDelete,\n    onTitleChange,\n    autoHideActions,\n    isEditable: parentIsEditable,\n    menu: parentMenu,\n    menuTriggerProps: parentMenuTriggerProps,\n    menuProps: parentMenuProps,\n    contextMenu: parentContextMenu,\n    onAction: parentOnAction,\n    children,\n    prefix,\n    suffix,\n    prerender = false,\n    keepMounted = false,\n    qa = 'Tabs',\n    renderPanel,\n    panelCacheKeys,\n    isReorderable = false,\n    keyOrder,\n    onReorder,\n    showTabPicker = false,\n    showScrollArrows = false,\n    tabPickerPosition = 'suffix',\n    scrollArrowsPosition = 'suffix',\n    tabListPadding,\n    tabListStyles,\n    prefixStyles,\n    suffixStyles,\n    ...otherProps\n  } = props;\n\n  // Extract outer styles\n  const baseStyles = extractStyles(otherProps, OUTER_STYLES);\n\n  // Build TabList padding style (memoized)\n  const tabListPaddingStyles = useMemo(\n    () =>\n      tabListPadding ? { '$tablist-padding': `${tabListPadding}` } : undefined,\n    [tabListPadding],\n  );\n\n  // Merge tabListPaddingStyles with tabListStyles (memoized)\n  const mergedTabListStyles = useMemo(\n    () => mergeStyles(tabListPaddingStyles, tabListStyles),\n    [tabListPaddingStyles, tabListStyles],\n  );\n\n  // Merge all sub-element styles into baseStyles\n  const combinedStyles = useMergeStyles(baseStyles, {\n    TabList: mergedTabListStyles,\n    Prefix: prefixStyles,\n    Suffix: suffixStyles,\n  });\n\n  // DOM element refs\n  const listRef = useRef<HTMLDivElement>(null);\n  const scrollRef = useRef<HTMLDivElement>(null);\n\n  // Track visited tabs for keepMounted functionality\n  const visitedKeysRef = useRef<Set<string>>(new Set());\n\n  // =========================================================================\n  // Tab Title Editing Hook\n  // =========================================================================\n  const onTitleChangeRaf = useEvent((key: string, newTitle: string) => {\n    requestAnimationFrame(() => {\n      onTitleChange?.(key, newTitle);\n    });\n  });\n\n  const {\n    editingKey,\n    editValue,\n    setEditValue,\n    startEditing,\n    cancelEditing,\n    submitEditing,\n  } = useTabEditing({\n    onChange,\n    onTitleChange: onTitleChange ? onTitleChangeRaf : undefined,\n  });\n\n  // =========================================================================\n  // Parse children to extract tabs and explicit panels\n  // =========================================================================\n  const { parsedTabs, explicitPanels, hasAnyContent } = useMemo(() => {\n    const childArray = Children.toArray(children);\n    const tabs: ParsedTab[] = [];\n    const panels = new Map<string, ParsedPanel>();\n    let hasExplicitList = false;\n    let tabChildren: ReactNode[] = [];\n\n    // Check for explicit Tabs.List / Tabs.Panel structure\n    for (const child of childArray) {\n      if (isTabListElement(child)) {\n        hasExplicitList = true;\n        tabChildren = Children.toArray(child.props.children);\n      } else if (isTabPanelElement(child)) {\n        const key = getRawKey(child as ReactElement);\n\n        if (key != null) {\n          panels.set(key, {\n            key,\n            content: child.props.children,\n            prerender: child.props.prerender,\n            keepMounted: child.props.keepMounted,\n            styles: child.props.styles,\n            qa: child.props.qa,\n            qaVal: child.props.qaVal,\n          });\n        }\n      }\n    }\n\n    // If no explicit list, use direct Tab children\n    if (!hasExplicitList) {\n      tabChildren = childArray;\n    }\n\n    // Parse Tab elements\n    let hasContent = panels.size > 0;\n\n    for (const child of tabChildren) {\n      if (isTabElement(child)) {\n        const key = getRawKey(child) ?? child.props.id;\n\n        if (key != null) {\n          const { id: _id, children: tabContent, ...tabProps } = child.props;\n\n          tabs.push({\n            ...tabProps,\n            key,\n            content: tabContent,\n          });\n\n          if (tabContent != null) {\n            hasContent = true;\n          }\n        }\n      }\n    }\n\n    return {\n      parsedTabs: tabs,\n      explicitPanels: panels,\n      hasAnyContent: hasContent,\n    };\n  }, [children]);\n\n  // Clean up visitedKeys when tabs are removed\n  const currentTabKeysSet = useMemo(\n    () => new Set(parsedTabs.map((t) => t.key)),\n    [parsedTabs],\n  );\n\n  useEffect(() => {\n    for (const key of visitedKeysRef.current) {\n      if (!currentTabKeysSet.has(key)) {\n        visitedKeysRef.current.delete(key);\n      }\n    }\n  }, [currentTabKeysSet]);\n\n  // =========================================================================\n  // Order tabs according to keyOrder\n  // =========================================================================\n  const orderedParsedTabs = useMemo(() => {\n    if (!keyOrder || keyOrder.length === 0) {\n      return parsedTabs;\n    }\n\n    const tabMap = new Map<string, ParsedTab>();\n    for (const tab of parsedTabs) {\n      tabMap.set(tab.key, tab);\n    }\n\n    const ordered: ParsedTab[] = [];\n    for (const key of keyOrder) {\n      const tab = tabMap.get(String(key));\n      if (tab) {\n        ordered.push(tab);\n        tabMap.delete(String(key));\n      }\n    }\n\n    // Append any tabs not in keyOrder\n    for (const tab of parsedTabs) {\n      if (tabMap.has(tab.key)) {\n        ordered.push(tab);\n      }\n    }\n\n    return ordered;\n  }, [parsedTabs, keyOrder]);\n\n  // Create collection items for React Stately\n  const collectionItems = useMemo(() => {\n    return orderedParsedTabs.map((tab) => (\n      <CollectionItem\n        key={tab.key}\n        textValue={typeof tab.title === 'string' ? tab.title : String(tab.key)}\n      >\n        {tab.title}\n      </CollectionItem>\n    ));\n  }, [orderedParsedTabs]);\n\n  // Determine disabled keys\n  const disabledKeys = useMemo(() => {\n    return new Set(\n      parsedTabs.filter((tab) => tab.isDisabled).map((tab) => tab.key),\n    );\n  }, [parsedTabs]);\n\n  // Handle selection change (converts React Aria's Key to string for our API)\n  const handleSelectionChange = useEvent((key: Key) => {\n    const keyStr = String(key);\n    visitedKeysRef.current.add(keyStr);\n    onChange?.(keyStr);\n  });\n\n  // Convert keys to strings for React Aria compatibility\n  const selectedKey = activeKey != null ? String(activeKey) : undefined;\n  const defaultSelectedKey =\n    defaultActiveKey != null ? String(defaultActiveKey) : undefined;\n\n  // Create aria props for useTabListState\n  const ariaProps: AriaTabListProps<object> = useMemo(\n    () => ({\n      selectedKey,\n      defaultSelectedKey,\n      onSelectionChange: handleSelectionChange,\n      disabledKeys,\n      children: collectionItems,\n      'aria-label': label,\n    }),\n    [\n      selectedKey,\n      defaultSelectedKey,\n      handleSelectionChange,\n      disabledKeys,\n      collectionItems,\n      label,\n    ],\n  );\n\n  // Create state using useTabListState\n  const state = useTabListState(ariaProps);\n\n  // Track initial selected key for visited tabs\n  useEffect(() => {\n    if (state.selectedKey != null) {\n      visitedKeysRef.current.add(String(state.selectedKey));\n    }\n  }, [state.selectedKey]);\n\n  // Get tablist props from react-aria\n  const { tabListProps } = useTabList(ariaProps, state, listRef);\n\n  // Handle selection from TabPicker (needs to update internal state in uncontrolled mode)\n  const handleTabPickerSelect = useEvent((key: string) => {\n    // Update internal state (for uncontrolled mode)\n    state.setSelectedKey(key);\n    // Also call the external onChange handler\n    handleSelectionChange(key);\n  });\n\n  // =========================================================================\n  // Tab Indicator (for default type)\n  // =========================================================================\n  // Create order token that changes when tab order changes (for indicator recalculation)\n  const orderToken = useMemo(\n    () => orderedParsedTabs.map((t) => t.key).join(','),\n    [orderedParsedTabs],\n  );\n\n  const indicatorStyle = useTabIndicator(\n    listRef,\n    state.selectedKey,\n    type === 'default' || type === 'narrow',\n    orderToken,\n  );\n\n  // =========================================================================\n  // Tiny Scrollbar (not for radio type)\n  // =========================================================================\n  const isTinyScrollbar = type !== 'radio';\n  const { handleHStyle, hasOverflowX, isScrolling, isAtStartX, isAtEndX } =\n    useTinyScrollbar(scrollRef, isTinyScrollbar);\n\n  const hasPanels = hasAnyContent || !!renderPanel;\n\n  // =========================================================================\n  // Tab Picker visibility\n  // =========================================================================\n  useWarn(showTabPicker && type === 'radio', {\n    key: ['tabs-tabpicker-radio-unsupported'],\n    args: [\n      'Tabs:',\n      '`showTabPicker` is not supported when `type=\"radio\"`. The TabPicker will not be rendered.',\n    ],\n  });\n\n  const shouldShowTabPicker =\n    type !== 'radio' &&\n    (showTabPicker === true || (showTabPicker === 'auto' && hasOverflowX));\n\n  // =========================================================================\n  // Scroll Arrows visibility and handlers\n  // =========================================================================\n  useWarn(showScrollArrows && type === 'radio', {\n    key: ['tabs-scrollarrows-radio-unsupported'],\n    args: [\n      'Tabs:',\n      '`showScrollArrows` is not supported when `type=\"radio\"`. The scroll arrows will not be rendered.',\n    ],\n  });\n\n  const shouldShowScrollArrows =\n    type !== 'radio' &&\n    (showScrollArrows === true ||\n      (showScrollArrows === 'auto' && hasOverflowX));\n\n  const handleScrollLeft = useEvent(() => {\n    const el = scrollRef.current;\n    if (el) {\n      el.scrollTo({\n        left: el.scrollLeft - el.clientWidth,\n        behavior: 'smooth',\n      });\n    }\n  });\n\n  const handleScrollRight = useEvent(() => {\n    const el = scrollRef.current;\n    if (el) {\n      el.scrollTo({\n        left: el.scrollLeft + el.clientWidth,\n        behavior: 'smooth',\n      });\n    }\n  });\n\n  // =========================================================================\n  // Base Context Value (without drag/drop states)\n  // =========================================================================\n  const baseContextValue = useMemo(\n    () => ({\n      state,\n      type,\n      size,\n      autoHideActions,\n      isEditable: parentIsEditable,\n      menu: parentMenu,\n      menuTriggerProps: parentMenuTriggerProps,\n      menuProps: parentMenuProps,\n      contextMenu: parentContextMenu,\n      onDelete,\n      onAction: parentOnAction,\n      editingKey,\n      editValue,\n      setEditValue,\n      startEditing,\n      submitEditing,\n      cancelEditing,\n    }),\n    [\n      state,\n      type,\n      size,\n      autoHideActions,\n      parentIsEditable,\n      parentMenu,\n      parentMenuTriggerProps,\n      parentMenuProps,\n      parentContextMenu,\n      onDelete,\n      parentOnAction,\n      editingKey,\n      editValue,\n      setEditValue,\n      startEditing,\n      submitEditing,\n      cancelEditing,\n    ],\n  );\n\n  // Helper to create full context value with optional drag/drop states\n  const createContextValue = (\n    dragState?: DraggableCollectionState,\n    dropState?: DroppableCollectionState,\n  ): TabsContextValue => ({\n    ...baseContextValue,\n    dragState,\n    dropState,\n  });\n\n  // =========================================================================\n  // Tab List Content Renderer\n  // =========================================================================\n  const renderTabListContent = (\n    contextValue: TabsContextValue,\n    collectionProps: Record<string, unknown> = {},\n  ) => (\n    <div\n      {...mergeProps(tabListProps, collectionProps)}\n      ref={listRef}\n      data-element=\"TabList\"\n    >\n      <TabsProvider value={contextValue}>\n        {orderedParsedTabs.map((tab, index) => {\n          const item = state.collection.getItem(tab.key);\n          if (!item) return null;\n\n          return (\n            <TabButton\n              key={item.key}\n              item={item}\n              tabData={tab}\n              isLastTab={index === orderedParsedTabs.length - 1}\n            />\n          );\n        })}\n      </TabsProvider>\n      {indicatorStyle && (\n        <TabIndicatorElement\n          style={{\n            left: indicatorStyle.left,\n            width: indicatorStyle.width,\n          }}\n        />\n      )}\n    </div>\n  );\n\n  // =========================================================================\n  // Mods for styling\n  // =========================================================================\n  const mods = useMemo(\n    () => ({\n      type,\n      size,\n      deletable: !!onDelete,\n      scrolling: isScrolling,\n      'fade-left': !isAtStartX,\n      'fade-right': !isAtEndX,\n      'has-panels': hasPanels,\n    }),\n    [type, size, onDelete, isScrolling, isAtStartX, isAtEndX, hasPanels],\n  );\n\n  // =========================================================================\n  // Action Elements (TabPicker and Scroll Arrows)\n  // =========================================================================\n  const scrollArrowsElement = shouldShowScrollArrows ? (\n    <>\n      <TabsAction\n        icon={<DirectionIcon to=\"left\" />}\n        aria-label=\"Scroll tabs left\"\n        isDisabled={isAtStartX}\n        onPress={handleScrollLeft}\n      />\n      <TabsAction\n        icon={<DirectionIcon to=\"right\" />}\n        aria-label=\"Scroll tabs right\"\n        isDisabled={isAtEndX}\n        onPress={handleScrollRight}\n      />\n    </>\n  ) : null;\n\n  const tabPickerElement = shouldShowTabPicker ? (\n    <TabPicker\n      tabs={orderedParsedTabs}\n      selectedKey={state.selectedKey}\n      size={size}\n      type={type}\n      onSelect={handleTabPickerSelect}\n      onDelete={onDelete}\n    />\n  ) : null;\n\n  // Determine which actions go in prefix/suffix\n  // In prefix: TabPicker first (left), then scroll arrows (right)\n  // In suffix: scroll arrows first (left), then TabPicker (right)\n  const prefixHasActions =\n    (shouldShowTabPicker && tabPickerPosition === 'prefix') ||\n    (shouldShowScrollArrows && scrollArrowsPosition === 'prefix');\n\n  const suffixHasActions =\n    (shouldShowTabPicker && tabPickerPosition === 'suffix') ||\n    (shouldShowScrollArrows && scrollArrowsPosition === 'suffix');\n\n  // Wrap with TabsProvider so prefix/suffix can access context (size, type)\n  // The inner TabsProvider in renderTabListContent will override for tab buttons\n  return (\n    <TabsProvider value={baseContextValue}>\n      <TabsElement\n        ref={ref}\n        qa={qa}\n        mods={mods}\n        styles={combinedStyles}\n        style={handleHStyle}\n        data-size={size}\n      >\n        {prefix || prefixHasActions ? (\n          <div data-element=\"Prefix\">\n            {tabPickerPosition === 'prefix' && tabPickerElement}\n            {scrollArrowsPosition === 'prefix' && scrollArrowsElement}\n            {prefix}\n          </div>\n        ) : null}\n        <div data-element=\"ScrollWrapper\">\n          <div ref={scrollRef} data-element=\"Scroll\">\n            {isReorderable ? (\n              <DraggableTabList\n                state={state}\n                listRef={listRef}\n                orderedKeys={orderedParsedTabs.map((t) => t.key)}\n                onReorder={onReorder}\n              >\n                {(dragState, dropState, collectionProps) =>\n                  renderTabListContent(\n                    createContextValue(dragState, dropState),\n                    collectionProps,\n                  )\n                }\n              </DraggableTabList>\n            ) : (\n              renderTabListContent(createContextValue())\n            )}\n          </div>\n          {isTinyScrollbar && hasOverflowX && <div data-element=\"ScrollbarH\" />}\n        </div>\n        {suffix || suffixHasActions ? (\n          <div data-element=\"Suffix\">\n            {scrollArrowsPosition === 'suffix' && scrollArrowsElement}\n            {tabPickerPosition === 'suffix' && tabPickerElement}\n            {suffix}\n          </div>\n        ) : null}\n      </TabsElement>\n\n      {/* Functional panel rendering with content caching */}\n      {renderPanel && (\n        <CachedPanelRenderer\n          parsedTabs={parsedTabs}\n          explicitPanels={explicitPanels}\n          state={state}\n          renderPanel={renderPanel}\n          panelCacheKeys={panelCacheKeys}\n          prerender={prerender}\n          keepMounted={keepMounted}\n          visitedKeys={visitedKeysRef.current}\n        />\n      )}\n\n      {/* Static panel rendering (traditional children-based approach) */}\n      {!renderPanel &&\n        hasAnyContent &&\n        parsedTabs.map((tab) => {\n          const explicitPanel = explicitPanels.get(tab.key);\n          const content = explicitPanel?.content ?? tab.content;\n\n          if (content == null) return null;\n\n          return (\n            <TabPanelRenderer\n              key={tab.key}\n              tabKey={tab.key}\n              state={state}\n              content={content}\n              prerender={prerender}\n              keepMounted={keepMounted}\n              tabPrerender={explicitPanel?.prerender ?? tab.prerender}\n              tabKeepMounted={explicitPanel?.keepMounted ?? tab.keepMounted}\n              visitedKeys={visitedKeysRef.current}\n              panelStyles={explicitPanel?.styles}\n              qa={explicitPanel?.qa}\n              qaVal={explicitPanel?.qaVal}\n            />\n          );\n        })}\n    </TabsProvider>\n  );\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nconst _Tabs = forwardRef(TabsComponent);\n\n/**\n * Tabs component for organizing content into multiple panels.\n * Built with React Aria for full accessibility support.\n *\n * **Note:** Tab keys are internally converted to strings for React Aria compatibility.\n *\n * @example\n * // Simple usage\n * <Tabs defaultActiveKey=\"tab1\">\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content 1</Tab>\n *   <Tab key=\"tab2\" title=\"Tab 2\">Content 2</Tab>\n * </Tabs>\n *\n * @example\n * // Tabs-only (no panels)\n * <Tabs activeKey={activeTab} onChange={setActiveTab}>\n *   <Tab key=\"overview\" title=\"Overview\" />\n *   <Tab key=\"settings\" title=\"Settings\" />\n * </Tabs>\n *\n * @example\n * // Explicit panels\n * <Tabs defaultActiveKey=\"tab1\">\n *   <Tabs.List>\n *     <Tab key=\"tab1\" title=\"Tab 1\" />\n *     <Tab key=\"tab2\" title=\"Tab 2\" />\n *   </Tabs.List>\n *   <Tabs.Panel key=\"tab1\">Content 1</Tabs.Panel>\n *   <Tabs.Panel key=\"tab2\">Content 2</Tabs.Panel>\n * </Tabs>\n */\nexport const Tabs = Object.assign(_Tabs, {\n  Tab,\n  List: TabList,\n  Panel: TabPanel,\n  Action: TabsAction,\n});\n\nexport { Tab, TabList, TabPanel, TabsAction };\n"],"mappings":"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"}

package/dist/components/navigation/Tabs/TabsAction.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { _ItemButton } from "../../actions/ItemButton/ItemButton.js";
 import { useOptionalTabsContext } from "./TabsContext.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/navigation/Tabs/TabsContext.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.121.7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.123.0 | Cube Dev Team */
 import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/navigation/Tabs/TabsContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabsContext.js","names":[],"sources":["../../../../src/components/navigation/Tabs/TabsContext.tsx"],"sourcesContent":["import { createContext, ReactNode, useContext } from 'react';\n\nimport type {\n  DraggableCollectionState,\n  DroppableCollectionState,\n  TabListState,\n} from 'react-stately';\nimport type { CubeItemActionProps } from '../../actions/ItemAction';\nimport type { CubeMenuProps } from '../../actions/Menu';\nimport type { TabSize, TabType } from './types';\n\n// =============================================================================\n// Context Value Interface\n// =============================================================================\n\nexport interface TabsContextValue {\n  /** Tab list state from React Stately */\n  state: TabListState<object>;\n  /** Parent-level type default */\n  type: TabType;\n  /** Parent-level size default */\n  size?: TabSize;\n  /** Parent-level autoHideActions default */\n  autoHideActions?: boolean;\n  /** Parent-level isEditable default */\n  isEditable?: boolean;\n  /** Parent-level menu default */\n  menu?: ReactNode;\n  /** Parent-level menuTriggerProps default */\n  menuTriggerProps?: Partial<CubeItemActionProps>;\n  /** Parent-level menuProps default */\n  menuProps?: Partial<CubeMenuProps<object>>;\n  /** Parent-level contextMenu default */\n  contextMenu?: boolean;\n  /** Callback when tab is deleted */\n  onDelete?: (key: string) => void;\n  /** Parent-level onAction callback */\n  onAction?: (action: string, tabKey: string) => void;\n  /** Drag state for reorderable tabs (undefined if not reorderable) */\n  dragState?: DraggableCollectionState;\n  /** Drop state for reorderable tabs (undefined if not reorderable) */\n  dropState?: DroppableCollectionState;\n\n  // Editing callbacks\n  /** Current tab being edited (null if none) */\n  editingKey: string | null;\n  /** Current edit value */\n  editValue: string;\n  /** Set the edit value */\n  setEditValue: (value: string) => void;\n  /** Start editing a tab */\n  startEditing: (key: string, currentTitle: string) => void;\n  /** Submit the current edit */\n  submitEditing: (\n    key: string,\n    newTitle: string,\n    tabOnTitleChange?: (title: string) => void,\n  ) => void;\n  /** Cancel the current edit */\n  cancelEditing: () => void;\n}\n\n// =============================================================================\n// Context\n// =============================================================================\n\nconst TabsContext = createContext<TabsContextValue | null>(null);\n\nTabsContext.displayName = 'TabsContext';\n\n// =============================================================================\n// Provider\n// =============================================================================\n\nexport interface TabsProviderProps {\n  value: TabsContextValue;\n  children: ReactNode;\n}\n\nexport function TabsProvider({ value, children }: TabsProviderProps) {\n  return <TabsContext.Provider value={value}>{children}</TabsContext.Provider>;\n}\n\n// =============================================================================\n// Hook\n// =============================================================================\n\nexport function useTabsContext(): TabsContextValue {\n  const context = useContext(TabsContext);\n\n  if (!context) {\n    throw new Error('useTabsContext must be used within a TabsProvider');\n  }\n\n  return context;\n}\n\n/**\n * Optional hook to get TabsContext value.\n * Returns null when used outside a TabsProvider (e.g., for TabsAction in standalone usage).\n */\nexport function useOptionalTabsContext(): TabsContextValue | null {\n  return useContext(TabsContext);\n}\n"],"mappings":";;;;;AAkEA,MAAM,cAAc,cAAuC,KAAK;AAEhE,YAAY,cAAc;AAW1B,SAAgB,aAAa,EAAE,OAAO,YAA+B;AACnE,QAAO,oBAAC,YAAY;EAAgB;EAAQ;GAAgC;;AAO9E,SAAgB,iBAAmC;CACjD,MAAM,UAAU,WAAW,YAAY;AAEvC,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,oDAAoD;AAGtE,QAAO;;;;;;AAOT,SAAgB,yBAAkD;AAChE,QAAO,WAAW,YAAY"}
+{"version":3,"file":"TabsContext.js","names":[],"sources":["../../../../src/components/navigation/Tabs/TabsContext.tsx"],"sourcesContent":["import { createContext, ReactNode, useContext } from 'react';\n\nimport type {\n  DraggableCollectionState,\n  DroppableCollectionState,\n  TabListState,\n} from 'react-stately';\nimport type { CubeItemActionProps } from '../../actions/ItemAction';\nimport type { CubeMenuProps } from '../../actions/Menu';\nimport type { TabContextMenu, TabSize, TabType } from './types';\n\n// =============================================================================\n// Context Value Interface\n// =============================================================================\n\nexport interface TabsContextValue {\n  /** Tab list state from React Stately */\n  state: TabListState<object>;\n  /** Parent-level type default */\n  type: TabType;\n  /** Parent-level size default */\n  size?: TabSize;\n  /** Parent-level autoHideActions default */\n  autoHideActions?: boolean;\n  /** Parent-level isEditable default */\n  isEditable?: boolean;\n  /** Parent-level menu default */\n  menu?: ReactNode;\n  /** Parent-level menuTriggerProps default */\n  menuTriggerProps?: Partial<CubeItemActionProps>;\n  /** Parent-level menuProps default */\n  menuProps?: Partial<CubeMenuProps<object>>;\n  /** Parent-level contextMenu default */\n  contextMenu?: TabContextMenu;\n  /** Callback when tab is deleted */\n  onDelete?: (key: string) => void;\n  /** Parent-level onAction callback */\n  onAction?: (action: string, tabKey: string) => void;\n  /** Drag state for reorderable tabs (undefined if not reorderable) */\n  dragState?: DraggableCollectionState;\n  /** Drop state for reorderable tabs (undefined if not reorderable) */\n  dropState?: DroppableCollectionState;\n\n  // Editing callbacks\n  /** Current tab being edited (null if none) */\n  editingKey: string | null;\n  /** Current edit value */\n  editValue: string;\n  /** Set the edit value */\n  setEditValue: (value: string) => void;\n  /** Start editing a tab */\n  startEditing: (key: string, currentTitle: string) => void;\n  /** Submit the current edit */\n  submitEditing: (\n    key: string,\n    newTitle: string,\n    tabOnTitleChange?: (title: string) => void,\n  ) => void;\n  /** Cancel the current edit */\n  cancelEditing: () => void;\n}\n\n// =============================================================================\n// Context\n// =============================================================================\n\nconst TabsContext = createContext<TabsContextValue | null>(null);\n\nTabsContext.displayName = 'TabsContext';\n\n// =============================================================================\n// Provider\n// =============================================================================\n\nexport interface TabsProviderProps {\n  value: TabsContextValue;\n  children: ReactNode;\n}\n\nexport function TabsProvider({ value, children }: TabsProviderProps) {\n  return <TabsContext.Provider value={value}>{children}</TabsContext.Provider>;\n}\n\n// =============================================================================\n// Hook\n// =============================================================================\n\nexport function useTabsContext(): TabsContextValue {\n  const context = useContext(TabsContext);\n\n  if (!context) {\n    throw new Error('useTabsContext must be used within a TabsProvider');\n  }\n\n  return context;\n}\n\n/**\n * Optional hook to get TabsContext value.\n * Returns null when used outside a TabsProvider (e.g., for TabsAction in standalone usage).\n */\nexport function useOptionalTabsContext(): TabsContextValue | null {\n  return useContext(TabsContext);\n}\n"],"mappings":";;;;;AAkEA,MAAM,cAAc,cAAuC,KAAK;AAEhE,YAAY,cAAc;AAW1B,SAAgB,aAAa,EAAE,OAAO,YAA+B;AACnE,QAAO,oBAAC,YAAY;EAAgB;EAAQ;GAAgC;;AAO9E,SAAgB,iBAAmC;CACjD,MAAM,UAAU,WAAW,YAAY;AAEvC,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,oDAAoD;AAGtE,QAAO;;;;;;AAOT,SAAgB,yBAAkD;AAChE,QAAO,WAAW,YAAY"}

package/dist/components/navigation/Tabs/index.d.ts

@@ -1,4 +1,4 @@
 
-import { CubeTabListProps, CubeTabPanelProps, CubeTabProps, CubeTabsProps, TabSize, TabType, TabsActionPosition } from "./types.js";
+import { CubeTabListProps, CubeTabPanelProps, CubeTabProps, CubeTabsProps, TabContextMenu, TabSize, TabType, TabsActionPosition } from "./types.js";
 import { CubeTabsActionProps, TabsAction } from "./TabsAction.js";
 import { Tab, Tabs } from "./Tabs.js";