@cube-dev/ui-kit 0.182.0 → 0.183.0

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

@@ -1,8 +1,9 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { _ItemButton } from "../../actions/ItemButton/ItemButton.js";
 import { useOptionalTabsContext } from "./TabsContext.js";
+import { c } from "react-compiler-runtime";
 import { tasty } from "@tenphi/tasty";
-import { forwardRef, useMemo } from "react";
+import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/navigation/Tabs/TabsAction.tsx
@@ -43,28 +44,61 @@ const TabsActionElement = tasty(_ItemButton, { styles: {
 * </Tabs>
 */
 const TabsAction = forwardRef(function TabsAction(props, ref) {
-	const { size, mods, type, ...rest } = props;
+	const $ = c(15);
+	let mods;
+	let rest;
+	let size;
+	let type;
+	if ($[0] !== props) {
+		({size, mods, type, ...rest} = props);
+		$[0] = props;
+		$[1] = mods;
+		$[2] = rest;
+		$[3] = size;
+		$[4] = type;
+	} else {
+		mods = $[1];
+		rest = $[2];
+		size = $[3];
+		type = $[4];
+	}
 	const tabsContext = useOptionalTabsContext();
 	const effectiveSize = size ?? tabsContext?.size ?? "medium";
 	const tabsType = tabsContext?.type ?? "default";
 	const tabsPlacement = tabsContext?.placement ?? "top";
 	const tabsVertical = tabsPlacement === "left" || tabsPlacement === "right";
-	const combinedMods = useMemo(() => ({
-		"tabs-type-file": tabsType === "file",
-		"tabs-vertical": tabsVertical,
-		...mods
-	}), [
-		tabsType,
-		tabsVertical,
-		mods
-	]);
-	return /* @__PURE__ */ jsx(TabsActionElement, {
-		ref,
-		type: type ?? (tabsType === "default" ? "outline" : "clear"),
-		size: effectiveSize,
-		mods: combinedMods,
-		...rest
-	});
+	const t0 = tabsType === "file";
+	let t1;
+	if ($[5] !== mods || $[6] !== t0 || $[7] !== tabsVertical) {
+		t1 = {
+			"tabs-type-file": t0,
+			"tabs-vertical": tabsVertical,
+			...mods
+		};
+		$[5] = mods;
+		$[6] = t0;
+		$[7] = tabsVertical;
+		$[8] = t1;
+	} else t1 = $[8];
+	const combinedMods = t1;
+	const t2 = type ?? (tabsType === "default" ? "outline" : "clear");
+	let t3;
+	if ($[9] !== combinedMods || $[10] !== effectiveSize || $[11] !== ref || $[12] !== rest || $[13] !== t2) {
+		t3 = /* @__PURE__ */ jsx(TabsActionElement, {
+			ref,
+			type: t2,
+			size: effectiveSize,
+			mods: combinedMods,
+			...rest
+		});
+		$[9] = combinedMods;
+		$[10] = effectiveSize;
+		$[11] = ref;
+		$[12] = rest;
+		$[13] = t2;
+		$[14] = t3;
+	} else t3 = $[14];
+	return t3;
 });
 
 //#endregion

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

@@ -1 +1 @@
-{"version":3,"file":"TabsAction.js","names":["ItemButton"],"sources":["../../../../src/components/navigation/Tabs/TabsAction.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { tasty } from '@tenphi/tasty';\nimport { forwardRef, useMemo } from 'react';\n\nimport {\n  CubeItemButtonProps,\n  ItemButton,\n} from '../../actions/ItemButton/ItemButton';\n\nimport { useOptionalTabsContext } from './TabsContext';\n\nimport type { TabSize } from './types';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface CubeTabsActionProps\n  extends Omit<CubeItemButtonProps, 'size' | 'shape'> {\n  /**\n   * Size of the action button.\n   * When used inside Tabs prefix/suffix, inherits from Tabs size by default.\n   */\n  size?: TabSize;\n}\n\n// =============================================================================\n// Styled Component\n// =============================================================================\n\nconst TabsActionElement = tasty(ItemButton, {\n  styles: {\n    border: {\n      'type=clear': 0,\n      'type=clear & tabs-type-file & !:first-child & !tabs-vertical': 'left',\n      'type=clear & tabs-type-file & !:first-child & tabs-vertical': 'top',\n    },\n    radius: {\n      'type=clear': 0,\n    },\n  },\n});\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Action button designed for the Tabs prefix/suffix slots.\n *\n * Styled with sharp edges and no border to match the TabPicker trigger.\n * When multiple TabsAction components are placed together, they automatically\n * display dividers between them using CSS :not(:first-child) border styling\n * (only for file tab type).\n *\n * Inherits size from the parent Tabs component when used inside prefix/suffix slots.\n *\n * @example\n * <Tabs suffix={<Tabs.Action icon={<PlusIcon />} onPress={handleAdd} />}>\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content</Tab>\n * </Tabs>\n *\n * @example\n * // Multiple actions with automatic dividers\n * <Tabs\n *   suffix={\n *     <>\n *       <Tabs.Action icon={<PlusIcon />} onPress={handleAdd} />\n *       <Tabs.Action icon={<SettingsIcon />} onPress={handleSettings} />\n *     </>\n *   }\n * >\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content</Tab>\n * </Tabs>\n */\nexport const TabsAction = forwardRef(function TabsAction(\n  props: CubeTabsActionProps,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const { size, mods, type, ...rest } = props;\n\n  // Get size, type, and placement from context if available (when used inside Tabs)\n  const tabsContext = useOptionalTabsContext();\n  const effectiveSize = size ?? tabsContext?.size ?? 'medium';\n  const tabsType = tabsContext?.type ?? 'default';\n  const tabsPlacement = tabsContext?.placement ?? 'top';\n  const tabsVertical = tabsPlacement === 'left' || tabsPlacement === 'right';\n\n  const combinedMods = useMemo(\n    () => ({\n      'tabs-type-file': tabsType === 'file',\n      'tabs-vertical': tabsVertical,\n      ...mods,\n    }),\n    [tabsType, tabsVertical, mods],\n  );\n\n  return (\n    <TabsActionElement\n      ref={ref}\n      type={type ?? (tabsType === 'default' ? 'outline' : 'clear')}\n      size={effectiveSize}\n      mods={combinedMods}\n      {...rest}\n    />\n  );\n});\n"],"mappings":";;;;;;;;AA8BA,MAAM,oBAAoB,MAAMA,aAAY,EAC1C,QAAQ;CACN,QAAQ;EACN,cAAc;EACd,gEAAgE;EAChE,+DAA+D;EAChE;CACD,QAAQ,EACN,cAAc,GACf;CACF,EACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCF,MAAa,aAAa,WAAW,SAAS,WAC5C,OACA,KACA;CACA,MAAM,EAAE,MAAM,MAAM,MAAM,GAAG,SAAS;CAGtC,MAAM,cAAc,wBAAwB;CAC5C,MAAM,gBAAgB,QAAQ,aAAa,QAAQ;CACnD,MAAM,WAAW,aAAa,QAAQ;CACtC,MAAM,gBAAgB,aAAa,aAAa;CAChD,MAAM,eAAe,kBAAkB,UAAU,kBAAkB;CAEnE,MAAM,eAAe,eACZ;EACL,kBAAkB,aAAa;EAC/B,iBAAiB;EACjB,GAAG;EACJ,GACD;EAAC;EAAU;EAAc;EAAK,CAC/B;AAED,QACE,oBAAC;EACM;EACL,MAAM,SAAS,aAAa,YAAY,YAAY;EACpD,MAAM;EACN,MAAM;EACN,GAAI;GACJ;EAEJ"}
+{"version":3,"file":"TabsAction.js","names":["FocusableRef","tasty","forwardRef","useMemo","CubeItemButtonProps","ItemButton","useOptionalTabsContext","TabSize","CubeTabsActionProps","Omit","size","TabsActionElement","styles","border","radius","TabsAction","props","ref","$","_c","mods","rest","type","tabsContext","effectiveSize","tabsType","tabsPlacement","placement","tabsVertical","t0","t1","combinedMods","t2","t3"],"sources":["../../../../src/components/navigation/Tabs/TabsAction.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { tasty } from '@tenphi/tasty';\nimport { forwardRef, useMemo } from 'react';\n\nimport {\n  CubeItemButtonProps,\n  ItemButton,\n} from '../../actions/ItemButton/ItemButton';\n\nimport { useOptionalTabsContext } from './TabsContext';\n\nimport type { TabSize } from './types';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface CubeTabsActionProps\n  extends Omit<CubeItemButtonProps, 'size' | 'shape'> {\n  /**\n   * Size of the action button.\n   * When used inside Tabs prefix/suffix, inherits from Tabs size by default.\n   */\n  size?: TabSize;\n}\n\n// =============================================================================\n// Styled Component\n// =============================================================================\n\nconst TabsActionElement = tasty(ItemButton, {\n  styles: {\n    border: {\n      'type=clear': 0,\n      'type=clear & tabs-type-file & !:first-child & !tabs-vertical': 'left',\n      'type=clear & tabs-type-file & !:first-child & tabs-vertical': 'top',\n    },\n    radius: {\n      'type=clear': 0,\n    },\n  },\n});\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Action button designed for the Tabs prefix/suffix slots.\n *\n * Styled with sharp edges and no border to match the TabPicker trigger.\n * When multiple TabsAction components are placed together, they automatically\n * display dividers between them using CSS :not(:first-child) border styling\n * (only for file tab type).\n *\n * Inherits size from the parent Tabs component when used inside prefix/suffix slots.\n *\n * @example\n * <Tabs suffix={<Tabs.Action icon={<PlusIcon />} onPress={handleAdd} />}>\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content</Tab>\n * </Tabs>\n *\n * @example\n * // Multiple actions with automatic dividers\n * <Tabs\n *   suffix={\n *     <>\n *       <Tabs.Action icon={<PlusIcon />} onPress={handleAdd} />\n *       <Tabs.Action icon={<SettingsIcon />} onPress={handleSettings} />\n *     </>\n *   }\n * >\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content</Tab>\n * </Tabs>\n */\nexport const TabsAction = forwardRef(function TabsAction(\n  props: CubeTabsActionProps,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const { size, mods, type, ...rest } = props;\n\n  // Get size, type, and placement from context if available (when used inside Tabs)\n  const tabsContext = useOptionalTabsContext();\n  const effectiveSize = size ?? tabsContext?.size ?? 'medium';\n  const tabsType = tabsContext?.type ?? 'default';\n  const tabsPlacement = tabsContext?.placement ?? 'top';\n  const tabsVertical = tabsPlacement === 'left' || tabsPlacement === 'right';\n\n  const combinedMods = useMemo(\n    () => ({\n      'tabs-type-file': tabsType === 'file',\n      'tabs-vertical': tabsVertical,\n      ...mods,\n    }),\n    [tabsType, tabsVertical, mods],\n  );\n\n  return (\n    <TabsActionElement\n      ref={ref}\n      type={type ?? (tabsType === 'default' ? 'outline' : 'clear')}\n      size={effectiveSize}\n      mods={combinedMods}\n      {...rest}\n    />\n  );\n});\n"],"mappings":";;;;;;;;;AA8BA,MAAMW,oBAAoBV,MAAMI,aAAY,EAC1CO,QAAQ;CACNC,QAAQ;EACN,cAAc;EACd,gEAAgE;EAChE,+DAA+D;EAChE;CACDC,QAAQ,EACN,cAAc,GAChB;CACF,EACD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCF,MAAaC,aAAab,WAAW,SAAAa,WAAAC,OAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAX;CAAA,IAAAY;AAAA,KAAAJ,EAAA,OAAAF,OAAA;AAInC,GAAA,CAAAN,MAAAU,MAAAE,SAAAD,QAAsCL;AAAME,IAAA,KAAAF;AAAAE,IAAA,KAAAE;AAAAF,IAAA,KAAAG;AAAAH,IAAA,KAAAR;AAAAQ,IAAA,KAAAI;QAAA;AAAAF,SAAAF,EAAA;AAAAG,SAAAH,EAAA;AAAAR,SAAAQ,EAAA;AAAAI,SAAAJ,EAAA;;CAG5C,MAAAK,cAAoBjB,wBAAwB;CAC5C,MAAAkB,gBAAsBd,QAAQa,aAAWb,QAAnB;CACtB,MAAAe,WAAiBF,aAAWD,QAAX;CACjB,MAAAI,gBAAsBH,aAAWI,aAAX;CACtB,MAAAC,eAAqBF,kBAAkB,UAAUA,kBAAkB;CAI7C,MAAAG,KAAAJ,aAAa;CAAM,IAAAK;AAAA,KAAAZ,EAAA,OAAAE,QAAAF,EAAA,OAAAW,MAAAX,EAAA,OAAAU,cAAA;AADhCE,OAAA;GAAA,kBACaD;GAAmB,iBACpBD;GAAY,GAC1BR;GACJ;AAAAF,IAAA,KAAAE;AAAAF,IAAA,KAAAW;AAAAX,IAAA,KAAAU;AAAAV,IAAA,KAAAY;OAAAA,MAAAZ,EAAA;CALH,MAAAa,eACSD;CAWC,MAAAE,KAAAV,SAASG,aAAa,YAAb,YAAA;CAA6C,IAAAQ;AAAA,KAAAf,EAAA,OAAAa,gBAAAb,EAAA,QAAAM,iBAAAN,EAAA,QAAAD,OAAAC,EAAA,QAAAG,QAAAH,EAAA,QAAAc,IAAA;AAF9DC,OAAA,oBAAC;GACMhB;GACC,MAAAe;GACAR,MAAAA;GACAO,MAAAA;GAAY,GACdV;IACJ;AAAAH,IAAA,KAAAa;AAAAb,IAAA,MAAAM;AAAAN,IAAA,MAAAD;AAAAC,IAAA,MAAAG;AAAAH,IAAA,MAAAc;AAAAd,IAAA,MAAAe;OAAAA,MAAAf,EAAA;AAAA,QANFe;EAQF"}

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

@@ -1,15 +1,25 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
+import { c } from "react-compiler-runtime";
 import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/navigation/Tabs/TabsContext.tsx
 const TabsContext = createContext(null);
 TabsContext.displayName = "TabsContext";
-function TabsProvider({ value, children }) {
-	return /* @__PURE__ */ jsx(TabsContext.Provider, {
-		value,
-		children
-	});
+function TabsProvider(t0) {
+	const $ = c(3);
+	const { value, children } = t0;
+	let t1;
+	if ($[0] !== children || $[1] !== value) {
+		t1 = /* @__PURE__ */ jsx(TabsContext.Provider, {
+			value,
+			children
+		});
+		$[0] = children;
+		$[1] = value;
+		$[2] = t1;
+	} else t1 = $[2];
+	return t1;
 }
 function useTabsContext() {
 	const context = useContext(TabsContext);

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 { TabContextMenu, TabPlacement, 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  /** Where the tab bar sits relative to its panels */\n  placement: TabPlacement;\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  /** 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":";;;;;AAgEA,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":["createContext","ReactNode","useContext","DraggableCollectionState","DroppableCollectionState","TabListState","CubeItemActionProps","CubeMenuProps","TabContextMenu","TabPlacement","TabSize","TabType","TabsContextValue","state","type","size","placement","autoHideActions","isEditable","menu","menuTriggerProps","Partial","menuProps","contextMenu","onDelete","key","onAction","action","tabKey","dragState","dropState","editingKey","startEditing","currentTitle","submitEditing","newTitle","tabOnTitleChange","title","cancelEditing","TabsContext","displayName","TabsProviderProps","value","children","TabsProvider","t0","$","_c","t1","useTabsContext","context","Error","useOptionalTabsContext"],"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, TabPlacement, 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  /** Where the tab bar sits relative to its panels */\n  placement: TabPlacement;\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  /** 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":";;;;;;AAgEA,MAAMuC,cAAcvC,cAAuC,KAAK;AAEhEuC,YAAYC,cAAc;AAW1B,SAAOI,aAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAsB,MAAA,EAAAL,OAAAC,aAAAE;CAAsC,IAAAG;AAAA,KAAAF,EAAA,OAAAH,YAAAG,EAAA,OAAAJ,OAAA;AAC1DM,OAAA,oBAAA,YAAA;GAA6BN;GAAQC;IAAgC;AAAAG,IAAA,KAAAH;AAAAG,IAAA,KAAAJ;AAAAI,IAAA,KAAAE;OAAAA,MAAAF,EAAA;AAAA,QAArEE;;AAOT,SAAOC,iBAAA;CACL,MAAAC,UAAgBhD,WAAWqC,YAAY;AAEvC,KAAI,CAACW,QACH,OAAM,IAAIC,MAAM,oDAAoD;AACrE,QAEMD;;;;;;AAOT,SAAOE,yBAAA;AAAA,QACElD,WAAWqC,YAAY"}

package/dist/components/navigation/Tabs/popover-placement.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 //#region src/components/navigation/Tabs/popover-placement.ts
 /**
 * Maps the parent Tabs `placement` to the popover placement for menus and

package/dist/components/navigation/Tabs/popover-placement.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover-placement.js","names":[],"sources":["../../../../src/components/navigation/Tabs/popover-placement.ts"],"sourcesContent":["import type { Placement } from 'react-aria';\nimport type { TabPlacement } from './types';\n\n/**\n * Maps the parent Tabs `placement` to the popover placement for menus and\n * pickers anchored to the strip (tab overflow menu, context menu, TabPicker).\n *\n * The popover always opens **toward the panel area** so it never covers the\n * bar itself and stays inside the visible Tabs region. Tooltips are the only\n * surface that opens on the outer-edge side; menus and pickers must flow into\n * the content side instead.\n */\nexport const POPOVER_PLACEMENT_BY_TABS_PLACEMENT: Record<\n  TabPlacement,\n  Placement\n> = {\n  top: 'bottom start',\n  bottom: 'top start',\n  left: 'right top',\n  right: 'left top',\n};\n"],"mappings":";;;;;;;;;;;AAYA,MAAa,sCAGT;CACF,KAAK;CACL,QAAQ;CACR,MAAM;CACN,OAAO;CACR"}
+{"version":3,"file":"popover-placement.js","names":["Placement","TabPlacement","POPOVER_PLACEMENT_BY_TABS_PLACEMENT","Record","top","bottom","left","right"],"sources":["../../../../src/components/navigation/Tabs/popover-placement.ts"],"sourcesContent":["import type { Placement } from 'react-aria';\nimport type { TabPlacement } from './types';\n\n/**\n * Maps the parent Tabs `placement` to the popover placement for menus and\n * pickers anchored to the strip (tab overflow menu, context menu, TabPicker).\n *\n * The popover always opens **toward the panel area** so it never covers the\n * bar itself and stays inside the visible Tabs region. Tooltips are the only\n * surface that opens on the outer-edge side; menus and pickers must flow into\n * the content side instead.\n */\nexport const POPOVER_PLACEMENT_BY_TABS_PLACEMENT: Record<\n  TabPlacement,\n  Placement\n> = {\n  top: 'bottom start',\n  bottom: 'top start',\n  left: 'right top',\n  right: 'left top',\n};\n"],"mappings":";;;;;;;;;;;AAYA,MAAaE,sCAGT;CACFE,KAAK;CACLC,QAAQ;CACRC,MAAM;CACNC,OAAO;CACR"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { _Item } from "../../content/Item/Item.js";
 import { tasty } from "@tenphi/tasty";
 

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

@@ -1 +1 @@
-{"version":3,"file":"styled.js","names":["Item"],"sources":["../../../../src/components/navigation/Tabs/styled.ts"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\n\nimport { Item } from '../../content/Item';\n\n// =============================================================================\n// Main Tabs Container — flex wrapper holding the tab Bar and the panels.\n// `placement` mod drives `flex-direction` so DOM order stays \"bar then panels\"\n// and visual order is controlled with `column / column-reverse / row / row-reverse`.\n// =============================================================================\n\nexport const TabsElement = tasty({\n  styles: {\n    display: 'flex',\n    flow: {\n      '': 'column',\n      'placement=bottom': 'column-reverse',\n      'placement=left': 'row',\n      'placement=right': 'row-reverse',\n    },\n    // Participate in parent flex layouts; allow shrinking on both axes so we\n    // never force the parent into overflow. The Bar keeps `flex-shrink: 0`,\n    // which makes the practical minimum of the wrapper along the main axis\n    // equal to the tablist's intrinsic size. When there are no panels the\n    // wrapper has only the Bar inside it, so we lock its sizing to the Bar's\n    // intrinsic size — matching the pre-wrapper behavior of a panel-less Tabs.\n    flexShrink: { '': 0, 'has-panels': 1 },\n    flexGrow: { '': 0, 'has-panels': 1 },\n    width: 'min 0',\n    height: 'min 0',\n    overflow: 'visible',\n\n    // ============================================\n    // Bar — the tab strip (Prefix + ScrollWrapper + Suffix).\n    // ============================================\n    Bar: {\n      $: '>',\n      display: 'flex',\n      flow: {\n        '': 'row',\n        'placement=left | placement=right': 'column',\n      },\n      placeItems: {\n        '': 'end stretch',\n        'placement=bottom': 'start stretch',\n        'placement=left': 'stretch end',\n        'placement=right': 'stretch start',\n        'type=radio | type=file': 'stretch',\n      },\n      overflow: 'visible',\n      border: {\n        '': 0,\n        '(type=default | type=file | type=narrow) & has-panels': 'bottom',\n        '(type=default | type=file | type=narrow) & has-panels & placement=bottom':\n          'top',\n        '(type=default | type=file | type=narrow) & has-panels & placement=left':\n          'right',\n        '(type=default | type=file | type=narrow) & has-panels & placement=right':\n          'left',\n      },\n      // Bar sizing — always follow the outer wrapper along the main axis so\n      // `width` / `height` props on `<Tabs>` apply to the strip as they did\n      // before the wrapper was introduced.\n      // - horizontal placements: main-axis = wrapper width  (100%), cross-axis intrinsic (auto)\n      // - vertical   placements: main-axis = wrapper height (100%), cross-axis intrinsic (auto / max-content for radio)\n      width: {\n        '': '100%',\n        'placement=left | placement=right': 'auto',\n        'type=radio & (placement=left | placement=right)': 'max-content',\n      },\n      height: {\n        '': 'auto',\n        'placement=left | placement=right': '100%',\n        'type=radio & (placement=left | placement=right)': 'max-content',\n      },\n      padding: {\n        '': 0,\n        'type=radio': '.5x',\n      },\n      radius: {\n        '': 0,\n        'type=radio': '1cr',\n      },\n      fill: {\n        '': '#clear',\n        'type=radio': '#surface-4',\n      },\n      // Never let the Bar shrink/grow within the outer wrapper — this is what\n      // gives the wrapper its effective \"tablist-size minimum\" on the main axis.\n      flexShrink: 0,\n      flexGrow: 0,\n\n      $transition: '$tab-transition',\n      '$tab-indicator-size': {\n        '': '2bw',\n        'size=large': '1ow',\n      },\n    },\n\n    // ============================================\n    // Prefix — slot before the scroll area.\n    // ============================================\n    Prefix: {\n      $: '> Bar >',\n      display: 'flex',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      placeSelf: 'stretch',\n      padding: {\n        '': 0,\n        'type=default': '.5x 0 .5x 1x',\n        'type=default & (placement=left | placement=right)': '1x .5x 0 .5x',\n      },\n      gap: {\n        '': 0,\n        'type=default': '.5x',\n      },\n      border: {\n        '': 0,\n        'type=file': 'right',\n        'type=file & (placement=left | placement=right)': 'bottom',\n      },\n    },\n\n    // ============================================\n    // Suffix — slot after the scroll area.\n    // ============================================\n    Suffix: {\n      $: '> Bar >',\n      display: 'flex',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      placeSelf: 'stretch',\n      padding: {\n        '': 0,\n        'type=default': '.5x 1x .5x 0',\n        'type=default & (placement=left | placement=right)': '0 .5x 1x .5x',\n      },\n      gap: {\n        '': 0,\n        'type=default': '.5x',\n      },\n      border: {\n        '': 0,\n        'type=file': 'left',\n        'type=file & (placement=left | placement=right)': 'top',\n      },\n    },\n\n    // Wrapper for scroll area and scrollbar (scrollbar is positioned relative to this)\n    ScrollWrapper: {\n      $: '> Bar >',\n      position: 'relative',\n      display: 'flex',\n      flexGrow: 1,\n      flexShrink: 1,\n      width: {\n        '': 'min 0',\n        'placement=left | placement=right': 'auto',\n      },\n      height: {\n        '': 'auto',\n        'placement=left | placement=right': 'min 0',\n      },\n      overflow: {\n        '': 'hidden',\n        'type=radio': 'visible',\n      },\n    },\n\n    Scroll: {\n      $: '> Bar > ScrollWrapper >',\n      position: 'relative',\n      display: 'block',\n      overflow: {\n        '': 'auto hidden',\n        'placement=left | placement=right': 'hidden auto',\n        'type=radio': 'visible',\n      },\n      scrollbar: 'none',\n      flexGrow: 1,\n      width: '100%',\n      // Add padding/margin for radio type to allow shadow to render outside\n      padding: {\n        '': 0,\n        'type=radio': '.5x',\n      },\n      margin: {\n        '': 0,\n        'type=radio': '-.5x',\n      },\n      // Multi-group fade with axis-neutral color tokens for smooth transitions.\n      // Direction flips based on placement.\n      fade: {\n        '': '2x left #tabs-fade-start #black, 2x right #tabs-fade-end #black',\n        'placement=left | placement=right':\n          '2x top #tabs-fade-start #black, 2x bottom #tabs-fade-end #black',\n      },\n      // ##name outputs --name-color (literal CSS property name)\n      transition:\n        '##tabs-fade-start $tab-transition ease-in, ##tabs-fade-end $tab-transition ease-in',\n\n      // Transition transparent color: opaque (no fade) -> transparent (fade visible)\n      '#tabs-fade-start': {\n        '': '#black',\n        'fade-start': '#black.0',\n      },\n      '#tabs-fade-end': {\n        '': '#black',\n        'fade-end': '#black.0',\n      },\n    },\n\n    TabList: {\n      $: '> Bar > ScrollWrapper > Scroll >',\n      position: 'relative',\n      display: 'grid',\n      // `border-box` is required because we set `width: 100%` for vertical\n      // placements AND apply padding. With the default `content-box`, the\n      // TabList's outer box would be `100% + padding × 2` and overflow Scroll\n      // horizontally — and the side selection indicator (positioned at\n      // `right: 0` / `left: 0` of TabList) would land in that overflow region\n      // and get clipped by Scroll's `overflow-x: hidden`.\n      boxSizing: 'border-box',\n      flow: {\n        '': 'column',\n        'placement=left | placement=right': 'row',\n      },\n      gridAutoColumns: {\n        '': 'auto',\n        'type=radio': '1fr',\n      },\n      gridAutoRows: {\n        '': 'auto',\n        'type=radio & (placement=left | placement=right)': '1fr',\n      },\n      gap: {\n        '': 0,\n        'type=default': '1x',\n        'type=narrow': '2x',\n        'type=radio': '.5x',\n        // Tabs stack vertically — collapse the gap so the strip reads as a\n        // single column. `narrow` is coerced to `default` in vertical, but we\n        // keep the rule defensive in case the styled element is consumed\n        // directly with a `type=narrow` mod set.\n        '(type=default | type=narrow) & (placement=left | placement=right)':\n          '1bw',\n      },\n      placeContent: 'start',\n      overflow: 'visible',\n      width: {\n        '': 'max-content',\n        'type=radio': '100%',\n        'placement=left | placement=right': '100%',\n      },\n      height: {\n        '': 'auto',\n        'placement=left | placement=right': 'max-content',\n      },\n      // For vertical default/narrow we apply `$tablist-padding` on ALL sides\n      // (instead of only the parallel axis) so the breathing room around the\n      // tabs and the selection indicator can be tuned via the `tabListPadding`\n      // prop — the same prop that controls horizontal start/end padding.\n      padding: {\n        '': '0 $tablist-padding',\n        'placement=left | placement=right': '$tablist-padding 0',\n        '(type=default | type=narrow) & (placement=left | placement=right)':\n          '$tablist-padding',\n      },\n\n      // Default `$tablist-padding` per type. Vertical default/narrow gets the\n      // smaller `.5x` default since it applies to all four sides; the\n      // `tabListPadding` prop overrides this via inline CSS variable.\n      '$tablist-padding': {\n        '': '0',\n        'type=default | type=narrow': '1x',\n        '(type=default | type=narrow) & (placement=left | placement=right)':\n          '.5x',\n      },\n    },\n\n    // Size variable for actions (if ItemAction is used instead of TabsAction)\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n    },\n\n    // Custom tiny scrollbar — positioned relative to ScrollWrapper. Switches\n    // edges and dimensions based on placement; the driving CSS custom\n    // properties come from `useTinyScrollbar.handleHStyle` / `handleVStyle`.\n    Scrollbar: {\n      $: '> Bar > ScrollWrapper >',\n      position: 'absolute',\n      bottom: {\n        '': '1px',\n        'placement=left | placement=right': 'auto',\n      },\n      top: {\n        '': 'auto',\n        'placement=left | placement=right': '$scrollbar-v-top',\n      },\n      left: {\n        '': '$scrollbar-h-left',\n        'placement=left | placement=right': 'auto',\n      },\n      right: {\n        '': 'auto',\n        'placement=left | placement=right': '1px',\n      },\n      height: {\n        '': '1ow',\n        'placement=left | placement=right': '$scrollbar-v-height',\n      },\n      width: {\n        '': '$scrollbar-h-width',\n        'placement=left | placement=right': '1ow',\n      },\n      radius: 'round',\n      fill: '#dark.35',\n      opacity: {\n        '': 0,\n        'focused | scrolling': 1,\n      },\n      transition: 'opacity 0.15s',\n      pointerEvents: 'none',\n    },\n  },\n});\n\n// =============================================================================\n// Tab Button (extends Item)\n// =============================================================================\n\nexport const TabElement = tasty(Item, {\n  as: 'button',\n  styles: {\n    radius: {\n      '': false,\n      'type=radio | type=default': true,\n      'type=narrow': 'top',\n      'type=narrow & placement=bottom': 'bottom',\n      'type=narrow & placement=left': 'left',\n      'type=narrow & placement=right': 'right',\n    },\n    color: {\n      '': '#dark-02',\n      'type=narrow & (hovered & !selected)': '#primary-text',\n      '(type=default | type=narrow) & selected': '#primary-text',\n      disabled: '#disabled-surface-text',\n    },\n    fill: {\n      '': '#clear',\n      'hovered & !type=narrow': '#dark.03',\n      'type=file': '#surface-3',\n      'type=file & hovered': '#surface-3.5',\n      'type=radio & hovered': '#surface.5',\n      '(type=file | type=radio) & selected': '#surface',\n      // Spring-load hint: a widget is hovering this tab and it is about to open.\n      'drop-pending': '#primary.10',\n    },\n    border: {\n      '': '#clear',\n      'type=file': '0 #clear',\n    },\n    preset: {\n      '': 't3m',\n      'size=xsmall': 't4',\n    },\n    shadow: {\n      '': '$selection-shadow',\n      'focused & focus-visible':\n        'inset 0 0 0 1bw #primary-text, $selection-shadow',\n      editing: 'inset 0 0 0 1bw #primary-text, $selection-shadow',\n      'type=radio & selected': '$item-shadow',\n      'type=radio & selected & focused & focus-visible':\n        '$item-shadow, inset 0 0 0 1bw #primary-text',\n    },\n    outline: 'none',\n    placeContent: {\n      // extend\n      'type=radio': 'center',\n    },\n    gridTemplate: {\n      // extend\n      'type=radio':\n        '\"icon prefix label suffix rightIcon actions\" auto / max-content max-content max-content max-content max-content max-content',\n    },\n    // File-type selection indicator: an inset shadow on the edge that faces\n    // the panel area. Flips with placement so the highlight always sits on\n    // the edge adjacent to the content.\n    '$selection-shadow': {\n      '': 'inset 0 0 0 0 #primary',\n      'type=file & selected': 'inset 0 (-1 * $tab-indicator-size) 0 0 #primary',\n      'type=file & selected & placement=bottom':\n        'inset 0 $tab-indicator-size 0 0 #primary',\n      'type=file & selected & placement=left':\n        'inset (-1 * $tab-indicator-size) 0 0 0 #primary',\n      'type=file & selected & placement=right':\n        'inset $tab-indicator-size 0 0 0 #primary',\n      '!type=file': 'inset 0 0 0 0 #primary.0',\n    },\n    // Collapse horizontal padding for narrow type\n    '$label-padding-left': {\n      '': '$inline-padding',\n      'has-start-content': 0,\n      'type=narrow': 0,\n    },\n    '$label-padding-right': {\n      '': '$inline-padding',\n      'has-end-content': 0,\n      'type=narrow': 0,\n    },\n    Label: {\n      placeSelf: {\n        '': 'center start',\n        'type=radio': 'center start',\n        'type=radio & !has-prefix & !has-suffix & !has-icon & !has-right-icon':\n          'center',\n      },\n    },\n    Actions: {\n      transition: false,\n    },\n  },\n});\n\n// =============================================================================\n// Tab Container (wrapper for tab + actions)\n// =============================================================================\n\nexport const TabContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'grid',\n    margin: {\n      '': 0,\n      // Horizontal strip: .5x top/bottom creates space between the tab and the\n      // bottom-edge indicator (which sits at `bottom: 0` of TabList).\n      'type=default': '.5x 0',\n      // Vertical strip: the breathing room around the tabs and the gap from\n      // the side indicator is provided by the TabList's own `.5x` padding —\n      // don't add per-tab horizontal margin on top of it.\n      'type=default & (placement=left | placement=right)': 0,\n    },\n    border: {\n      '': 0,\n      'type=file': 'right',\n      'type=file & (placement=left | placement=right)': 'bottom',\n    },\n    cursor: {\n      '': 'default',\n      draggable: 'grab',\n      dragging: 'grabbing',\n    },\n  },\n});\n\n// =============================================================================\n// Drop Indicator for Drag-and-Drop\n// Geometry flips based on placement: a vertical bar between horizontal tabs,\n// a horizontal bar between vertical tabs. `before`/`after` mods come from\n// `TabDropIndicator` and decide which edge inset is applied.\n// =============================================================================\n\nexport const DropIndicatorElement = tasty({\n  styles: {\n    zIndex: 10,\n    position: 'absolute',\n    pointerEvents: 'none',\n    opacity: {\n      '': 0,\n      'drop-target': 1,\n    },\n    fill: '#primary',\n    width: {\n      '': '.5x',\n      'placement=left | placement=right': 'auto',\n    },\n    height: {\n      '': 'auto',\n      'placement=left | placement=right': '.5x',\n    },\n    top: {\n      '': 0,\n      'placement=left | placement=right': 'auto',\n      '(placement=left | placement=right) & before': '-2px',\n    },\n    bottom: {\n      '': 0,\n      'placement=left | placement=right': 'auto',\n      '(placement=left | placement=right) & after': '-2px',\n    },\n    left: {\n      '': 'auto',\n      'before & !(placement=left | placement=right)': '-2px',\n      'placement=left | placement=right': 0,\n    },\n    right: {\n      '': 'auto',\n      'after & !(placement=left | placement=right)': '-2px',\n      'placement=left | placement=right': 0,\n    },\n  },\n});\n\n// =============================================================================\n// Tab Selection Indicator (for default/narrow type)\n// Position flips with placement; the dynamic axis dimensions (left/width for\n// horizontal, top/height for vertical) are populated via inline `style` from\n// `useTabIndicator` in `Tabs.tsx`.\n// =============================================================================\n\nexport const TabIndicatorElement = tasty({\n  styles: {\n    position: 'absolute',\n    bottom: {\n      '': '0',\n      'placement=bottom | placement=left | placement=right': 'auto',\n    },\n    top: {\n      '': 'auto',\n      'placement=bottom': '0',\n    },\n    left: {\n      '': 'auto',\n      'placement=right': '0',\n    },\n    right: {\n      '': 'auto',\n      'placement=left': '0',\n    },\n    height: {\n      '': '$tab-indicator-size',\n      'placement=left | placement=right': 'auto',\n    },\n    width: {\n      '': 'auto',\n      'placement=left | placement=right': '$tab-indicator-size',\n    },\n    fill: '#primary',\n    // Transition all four properties unconditionally — only the two relevant\n    // ones change per render, the others stay constant.\n    transition:\n      'left $tab-transition ease-in-out, width $tab-transition ease-in-out, top $tab-transition ease-in-out, height $tab-transition ease-in-out',\n    pointerEvents: 'none',\n  },\n});\n\n// =============================================================================\n// Tab Panel\n// =============================================================================\n\nexport const TabPanelElement = tasty({\n  as: 'section',\n  styles: {\n    display: 'contents',\n    hide: {\n      '': true,\n      active: false,\n    },\n  },\n});\n"],"mappings":"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"}
+{"version":3,"file":"styled.js","names":["tasty","Item","TabsElement","styles","display","flow","flexShrink","flexGrow","width","height","overflow","Bar","$","placeItems","border","padding","radius","fill","$transition","Prefix","placeContent","placeSelf","gap","Suffix","ScrollWrapper","position","Scroll","scrollbar","margin","fade","transition","TabList","boxSizing","gridAutoColumns","gridAutoRows","$size","Scrollbar","bottom","top","left","right","opacity","pointerEvents","TabElement","as","color","disabled","preset","shadow","editing","outline","gridTemplate","Label","Actions","TabContainer","cursor","draggable","dragging","DropIndicatorElement","zIndex","TabIndicatorElement","TabPanelElement","hide","active"],"sources":["../../../../src/components/navigation/Tabs/styled.ts"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\n\nimport { Item } from '../../content/Item';\n\n// =============================================================================\n// Main Tabs Container — flex wrapper holding the tab Bar and the panels.\n// `placement` mod drives `flex-direction` so DOM order stays \"bar then panels\"\n// and visual order is controlled with `column / column-reverse / row / row-reverse`.\n// =============================================================================\n\nexport const TabsElement = tasty({\n  styles: {\n    display: 'flex',\n    flow: {\n      '': 'column',\n      'placement=bottom': 'column-reverse',\n      'placement=left': 'row',\n      'placement=right': 'row-reverse',\n    },\n    // Participate in parent flex layouts; allow shrinking on both axes so we\n    // never force the parent into overflow. The Bar keeps `flex-shrink: 0`,\n    // which makes the practical minimum of the wrapper along the main axis\n    // equal to the tablist's intrinsic size. When there are no panels the\n    // wrapper has only the Bar inside it, so we lock its sizing to the Bar's\n    // intrinsic size — matching the pre-wrapper behavior of a panel-less Tabs.\n    flexShrink: { '': 0, 'has-panels': 1 },\n    flexGrow: { '': 0, 'has-panels': 1 },\n    width: 'min 0',\n    height: 'min 0',\n    overflow: 'visible',\n\n    // ============================================\n    // Bar — the tab strip (Prefix + ScrollWrapper + Suffix).\n    // ============================================\n    Bar: {\n      $: '>',\n      display: 'flex',\n      flow: {\n        '': 'row',\n        'placement=left | placement=right': 'column',\n      },\n      placeItems: {\n        '': 'end stretch',\n        'placement=bottom': 'start stretch',\n        'placement=left': 'stretch end',\n        'placement=right': 'stretch start',\n        'type=radio | type=file': 'stretch',\n      },\n      overflow: 'visible',\n      border: {\n        '': 0,\n        '(type=default | type=file | type=narrow) & has-panels': 'bottom',\n        '(type=default | type=file | type=narrow) & has-panels & placement=bottom':\n          'top',\n        '(type=default | type=file | type=narrow) & has-panels & placement=left':\n          'right',\n        '(type=default | type=file | type=narrow) & has-panels & placement=right':\n          'left',\n      },\n      // Bar sizing — always follow the outer wrapper along the main axis so\n      // `width` / `height` props on `<Tabs>` apply to the strip as they did\n      // before the wrapper was introduced.\n      // - horizontal placements: main-axis = wrapper width  (100%), cross-axis intrinsic (auto)\n      // - vertical   placements: main-axis = wrapper height (100%), cross-axis intrinsic (auto / max-content for radio)\n      width: {\n        '': '100%',\n        'placement=left | placement=right': 'auto',\n        'type=radio & (placement=left | placement=right)': 'max-content',\n      },\n      height: {\n        '': 'auto',\n        'placement=left | placement=right': '100%',\n        'type=radio & (placement=left | placement=right)': 'max-content',\n      },\n      padding: {\n        '': 0,\n        'type=radio': '.5x',\n      },\n      radius: {\n        '': 0,\n        'type=radio': '1cr',\n      },\n      fill: {\n        '': '#clear',\n        'type=radio': '#surface-4',\n      },\n      // Never let the Bar shrink/grow within the outer wrapper — this is what\n      // gives the wrapper its effective \"tablist-size minimum\" on the main axis.\n      flexShrink: 0,\n      flexGrow: 0,\n\n      $transition: '$tab-transition',\n      '$tab-indicator-size': {\n        '': '2bw',\n        'size=large': '1ow',\n      },\n    },\n\n    // ============================================\n    // Prefix — slot before the scroll area.\n    // ============================================\n    Prefix: {\n      $: '> Bar >',\n      display: 'flex',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      placeSelf: 'stretch',\n      padding: {\n        '': 0,\n        'type=default': '.5x 0 .5x 1x',\n        'type=default & (placement=left | placement=right)': '1x .5x 0 .5x',\n      },\n      gap: {\n        '': 0,\n        'type=default': '.5x',\n      },\n      border: {\n        '': 0,\n        'type=file': 'right',\n        'type=file & (placement=left | placement=right)': 'bottom',\n      },\n    },\n\n    // ============================================\n    // Suffix — slot after the scroll area.\n    // ============================================\n    Suffix: {\n      $: '> Bar >',\n      display: 'flex',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      placeSelf: 'stretch',\n      padding: {\n        '': 0,\n        'type=default': '.5x 1x .5x 0',\n        'type=default & (placement=left | placement=right)': '0 .5x 1x .5x',\n      },\n      gap: {\n        '': 0,\n        'type=default': '.5x',\n      },\n      border: {\n        '': 0,\n        'type=file': 'left',\n        'type=file & (placement=left | placement=right)': 'top',\n      },\n    },\n\n    // Wrapper for scroll area and scrollbar (scrollbar is positioned relative to this)\n    ScrollWrapper: {\n      $: '> Bar >',\n      position: 'relative',\n      display: 'flex',\n      flexGrow: 1,\n      flexShrink: 1,\n      width: {\n        '': 'min 0',\n        'placement=left | placement=right': 'auto',\n      },\n      height: {\n        '': 'auto',\n        'placement=left | placement=right': 'min 0',\n      },\n      overflow: {\n        '': 'hidden',\n        'type=radio': 'visible',\n      },\n    },\n\n    Scroll: {\n      $: '> Bar > ScrollWrapper >',\n      position: 'relative',\n      display: 'block',\n      overflow: {\n        '': 'auto hidden',\n        'placement=left | placement=right': 'hidden auto',\n        'type=radio': 'visible',\n      },\n      scrollbar: 'none',\n      flexGrow: 1,\n      width: '100%',\n      // Add padding/margin for radio type to allow shadow to render outside\n      padding: {\n        '': 0,\n        'type=radio': '.5x',\n      },\n      margin: {\n        '': 0,\n        'type=radio': '-.5x',\n      },\n      // Multi-group fade with axis-neutral color tokens for smooth transitions.\n      // Direction flips based on placement.\n      fade: {\n        '': '2x left #tabs-fade-start #black, 2x right #tabs-fade-end #black',\n        'placement=left | placement=right':\n          '2x top #tabs-fade-start #black, 2x bottom #tabs-fade-end #black',\n      },\n      // ##name outputs --name-color (literal CSS property name)\n      transition:\n        '##tabs-fade-start $tab-transition ease-in, ##tabs-fade-end $tab-transition ease-in',\n\n      // Transition transparent color: opaque (no fade) -> transparent (fade visible)\n      '#tabs-fade-start': {\n        '': '#black',\n        'fade-start': '#black.0',\n      },\n      '#tabs-fade-end': {\n        '': '#black',\n        'fade-end': '#black.0',\n      },\n    },\n\n    TabList: {\n      $: '> Bar > ScrollWrapper > Scroll >',\n      position: 'relative',\n      display: 'grid',\n      // `border-box` is required because we set `width: 100%` for vertical\n      // placements AND apply padding. With the default `content-box`, the\n      // TabList's outer box would be `100% + padding × 2` and overflow Scroll\n      // horizontally — and the side selection indicator (positioned at\n      // `right: 0` / `left: 0` of TabList) would land in that overflow region\n      // and get clipped by Scroll's `overflow-x: hidden`.\n      boxSizing: 'border-box',\n      flow: {\n        '': 'column',\n        'placement=left | placement=right': 'row',\n      },\n      gridAutoColumns: {\n        '': 'auto',\n        'type=radio': '1fr',\n      },\n      gridAutoRows: {\n        '': 'auto',\n        'type=radio & (placement=left | placement=right)': '1fr',\n      },\n      gap: {\n        '': 0,\n        'type=default': '1x',\n        'type=narrow': '2x',\n        'type=radio': '.5x',\n        // Tabs stack vertically — collapse the gap so the strip reads as a\n        // single column. `narrow` is coerced to `default` in vertical, but we\n        // keep the rule defensive in case the styled element is consumed\n        // directly with a `type=narrow` mod set.\n        '(type=default | type=narrow) & (placement=left | placement=right)':\n          '1bw',\n      },\n      placeContent: 'start',\n      overflow: 'visible',\n      width: {\n        '': 'max-content',\n        'type=radio': '100%',\n        'placement=left | placement=right': '100%',\n      },\n      height: {\n        '': 'auto',\n        'placement=left | placement=right': 'max-content',\n      },\n      // For vertical default/narrow we apply `$tablist-padding` on ALL sides\n      // (instead of only the parallel axis) so the breathing room around the\n      // tabs and the selection indicator can be tuned via the `tabListPadding`\n      // prop — the same prop that controls horizontal start/end padding.\n      padding: {\n        '': '0 $tablist-padding',\n        'placement=left | placement=right': '$tablist-padding 0',\n        '(type=default | type=narrow) & (placement=left | placement=right)':\n          '$tablist-padding',\n      },\n\n      // Default `$tablist-padding` per type. Vertical default/narrow gets the\n      // smaller `.5x` default since it applies to all four sides; the\n      // `tabListPadding` prop overrides this via inline CSS variable.\n      '$tablist-padding': {\n        '': '0',\n        'type=default | type=narrow': '1x',\n        '(type=default | type=narrow) & (placement=left | placement=right)':\n          '.5x',\n      },\n    },\n\n    // Size variable for actions (if ItemAction is used instead of TabsAction)\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n    },\n\n    // Custom tiny scrollbar — positioned relative to ScrollWrapper. Switches\n    // edges and dimensions based on placement; the driving CSS custom\n    // properties come from `useTinyScrollbar.handleHStyle` / `handleVStyle`.\n    Scrollbar: {\n      $: '> Bar > ScrollWrapper >',\n      position: 'absolute',\n      bottom: {\n        '': '1px',\n        'placement=left | placement=right': 'auto',\n      },\n      top: {\n        '': 'auto',\n        'placement=left | placement=right': '$scrollbar-v-top',\n      },\n      left: {\n        '': '$scrollbar-h-left',\n        'placement=left | placement=right': 'auto',\n      },\n      right: {\n        '': 'auto',\n        'placement=left | placement=right': '1px',\n      },\n      height: {\n        '': '1ow',\n        'placement=left | placement=right': '$scrollbar-v-height',\n      },\n      width: {\n        '': '$scrollbar-h-width',\n        'placement=left | placement=right': '1ow',\n      },\n      radius: 'round',\n      fill: '#dark.35',\n      opacity: {\n        '': 0,\n        'focused | scrolling': 1,\n      },\n      transition: 'opacity 0.15s',\n      pointerEvents: 'none',\n    },\n  },\n});\n\n// =============================================================================\n// Tab Button (extends Item)\n// =============================================================================\n\nexport const TabElement = tasty(Item, {\n  as: 'button',\n  styles: {\n    radius: {\n      '': false,\n      'type=radio | type=default': true,\n      'type=narrow': 'top',\n      'type=narrow & placement=bottom': 'bottom',\n      'type=narrow & placement=left': 'left',\n      'type=narrow & placement=right': 'right',\n    },\n    color: {\n      '': '#dark-02',\n      'type=narrow & (hovered & !selected)': '#primary-text',\n      '(type=default | type=narrow) & selected': '#primary-text',\n      disabled: '#disabled-surface-text',\n    },\n    fill: {\n      '': '#clear',\n      'hovered & !type=narrow': '#dark.03',\n      'type=file': '#surface-3',\n      'type=file & hovered': '#surface-3.5',\n      'type=radio & hovered': '#surface.5',\n      '(type=file | type=radio) & selected': '#surface',\n      // Spring-load hint: a widget is hovering this tab and it is about to open.\n      'drop-pending': '#primary.10',\n    },\n    border: {\n      '': '#clear',\n      'type=file': '0 #clear',\n    },\n    preset: {\n      '': 't3m',\n      'size=xsmall': 't4',\n    },\n    shadow: {\n      '': '$selection-shadow',\n      'focused & focus-visible':\n        'inset 0 0 0 1bw #primary-text, $selection-shadow',\n      editing: 'inset 0 0 0 1bw #primary-text, $selection-shadow',\n      'type=radio & selected': '$item-shadow',\n      'type=radio & selected & focused & focus-visible':\n        '$item-shadow, inset 0 0 0 1bw #primary-text',\n    },\n    outline: 'none',\n    placeContent: {\n      // extend\n      'type=radio': 'center',\n    },\n    gridTemplate: {\n      // extend\n      'type=radio':\n        '\"icon prefix label suffix rightIcon actions\" auto / max-content max-content max-content max-content max-content max-content',\n    },\n    // File-type selection indicator: an inset shadow on the edge that faces\n    // the panel area. Flips with placement so the highlight always sits on\n    // the edge adjacent to the content.\n    '$selection-shadow': {\n      '': 'inset 0 0 0 0 #primary',\n      'type=file & selected': 'inset 0 (-1 * $tab-indicator-size) 0 0 #primary',\n      'type=file & selected & placement=bottom':\n        'inset 0 $tab-indicator-size 0 0 #primary',\n      'type=file & selected & placement=left':\n        'inset (-1 * $tab-indicator-size) 0 0 0 #primary',\n      'type=file & selected & placement=right':\n        'inset $tab-indicator-size 0 0 0 #primary',\n      '!type=file': 'inset 0 0 0 0 #primary.0',\n    },\n    // Collapse horizontal padding for narrow type\n    '$label-padding-left': {\n      '': '$inline-padding',\n      'has-start-content': 0,\n      'type=narrow': 0,\n    },\n    '$label-padding-right': {\n      '': '$inline-padding',\n      'has-end-content': 0,\n      'type=narrow': 0,\n    },\n    Label: {\n      placeSelf: {\n        '': 'center start',\n        'type=radio': 'center start',\n        'type=radio & !has-prefix & !has-suffix & !has-icon & !has-right-icon':\n          'center',\n      },\n    },\n    Actions: {\n      transition: false,\n    },\n  },\n});\n\n// =============================================================================\n// Tab Container (wrapper for tab + actions)\n// =============================================================================\n\nexport const TabContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'grid',\n    margin: {\n      '': 0,\n      // Horizontal strip: .5x top/bottom creates space between the tab and the\n      // bottom-edge indicator (which sits at `bottom: 0` of TabList).\n      'type=default': '.5x 0',\n      // Vertical strip: the breathing room around the tabs and the gap from\n      // the side indicator is provided by the TabList's own `.5x` padding —\n      // don't add per-tab horizontal margin on top of it.\n      'type=default & (placement=left | placement=right)': 0,\n    },\n    border: {\n      '': 0,\n      'type=file': 'right',\n      'type=file & (placement=left | placement=right)': 'bottom',\n    },\n    cursor: {\n      '': 'default',\n      draggable: 'grab',\n      dragging: 'grabbing',\n    },\n  },\n});\n\n// =============================================================================\n// Drop Indicator for Drag-and-Drop\n// Geometry flips based on placement: a vertical bar between horizontal tabs,\n// a horizontal bar between vertical tabs. `before`/`after` mods come from\n// `TabDropIndicator` and decide which edge inset is applied.\n// =============================================================================\n\nexport const DropIndicatorElement = tasty({\n  styles: {\n    zIndex: 10,\n    position: 'absolute',\n    pointerEvents: 'none',\n    opacity: {\n      '': 0,\n      'drop-target': 1,\n    },\n    fill: '#primary',\n    width: {\n      '': '.5x',\n      'placement=left | placement=right': 'auto',\n    },\n    height: {\n      '': 'auto',\n      'placement=left | placement=right': '.5x',\n    },\n    top: {\n      '': 0,\n      'placement=left | placement=right': 'auto',\n      '(placement=left | placement=right) & before': '-2px',\n    },\n    bottom: {\n      '': 0,\n      'placement=left | placement=right': 'auto',\n      '(placement=left | placement=right) & after': '-2px',\n    },\n    left: {\n      '': 'auto',\n      'before & !(placement=left | placement=right)': '-2px',\n      'placement=left | placement=right': 0,\n    },\n    right: {\n      '': 'auto',\n      'after & !(placement=left | placement=right)': '-2px',\n      'placement=left | placement=right': 0,\n    },\n  },\n});\n\n// =============================================================================\n// Tab Selection Indicator (for default/narrow type)\n// Position flips with placement; the dynamic axis dimensions (left/width for\n// horizontal, top/height for vertical) are populated via inline `style` from\n// `useTabIndicator` in `Tabs.tsx`.\n// =============================================================================\n\nexport const TabIndicatorElement = tasty({\n  styles: {\n    position: 'absolute',\n    bottom: {\n      '': '0',\n      'placement=bottom | placement=left | placement=right': 'auto',\n    },\n    top: {\n      '': 'auto',\n      'placement=bottom': '0',\n    },\n    left: {\n      '': 'auto',\n      'placement=right': '0',\n    },\n    right: {\n      '': 'auto',\n      'placement=left': '0',\n    },\n    height: {\n      '': '$tab-indicator-size',\n      'placement=left | placement=right': 'auto',\n    },\n    width: {\n      '': 'auto',\n      'placement=left | placement=right': '$tab-indicator-size',\n    },\n    fill: '#primary',\n    // Transition all four properties unconditionally — only the two relevant\n    // ones change per render, the others stay constant.\n    transition:\n      'left $tab-transition ease-in-out, width $tab-transition ease-in-out, top $tab-transition ease-in-out, height $tab-transition ease-in-out',\n    pointerEvents: 'none',\n  },\n});\n\n// =============================================================================\n// Tab Panel\n// =============================================================================\n\nexport const TabPanelElement = tasty({\n  as: 'section',\n  styles: {\n    display: 'contents',\n    hide: {\n      '': true,\n      active: false,\n    },\n  },\n});\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 //#region src/components/navigation/Tabs/types.ts
 /**
 * Size mapping for radio type tabs.

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

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/navigation/Tabs/types.ts"],"sourcesContent":["import type { BaseProps, OuterStyleProps, Styles } from '@tenphi/tasty';\nimport type { ReactNode } from 'react';\nimport type { CubeItemActionProps } from '../../actions/ItemAction';\nimport type { CubeMenuProps } from '../../actions/Menu';\nimport type { CubeItemProps } from '../../content/Item';\n\n// =============================================================================\n// Core Types\n// =============================================================================\n\n/** Visual appearance type for tabs */\nexport type TabType = 'default' | 'narrow' | 'file' | 'radio';\n\n/**\n * Where the tab bar sits relative to its panels.\n * - `'top'` / `'bottom'` keep the bar horizontal.\n * - `'left'` / `'right'` switch it to a vertical strip.\n */\nexport type TabPlacement = 'top' | 'bottom' | 'left' | 'right';\n\n/** Position for TabPicker and scroll arrows */\nexport type TabsActionPosition = 'prefix' | 'suffix';\n\n/**\n * Tab size options.\n * Radio type only supports 'medium' | 'large' (mapped to smaller Item sizes).\n */\nexport type TabSize = 'xsmall' | 'small' | 'medium' | 'large';\n\n/**\n * Size mapping for radio type tabs.\n * API sizes mapped to Item button sizes:\n * medium (default) -> xsmall (32px total), large -> medium (40px total).\n */\nexport const RADIO_SIZE_MAP: Record<'medium' | 'large', TabSize> = {\n  medium: 'xsmall',\n  large: 'medium',\n};\n\n/** How the tab `menu` is exposed alongside or instead of the overflow trigger. */\nexport type TabContextMenu = boolean | 'context-only';\n\n// =============================================================================\n// Shared Props Interfaces\n// =============================================================================\n\n/** Common props for panel rendering behavior */\nexport interface PanelBehaviorProps {\n  /** If true, panel is rendered but hidden when not active. */\n  prerender?: boolean;\n  /** If true, once visited the panel stays in DOM. */\n  keepMounted?: boolean;\n}\n\n/** Common props for QA attributes */\nexport interface QAProps {\n  /** QA selector attribute. */\n  qa?: string;\n  /** Additional QA value attribute. */\n  qaVal?: string;\n}\n\n// =============================================================================\n// Tab Style Props\n// =============================================================================\n\n/** Props from CubeItemProps that don't apply to Tab */\ntype OmittedItemProps =\n  | 'id' // Tab has its own id as Key type\n  | 'type' // Type is decided at the Tabs level, never per-tab\n  | 'size' // Tab has its own TabSize\n  | 'theme' // Tabs have internal theming\n  | 'shape' // Tabs have internal shape logic\n  | 'description' // Tabs don't have descriptions\n  | 'descriptionPlacement'\n  | 'descriptionProps'\n  | 'hotkeys' // Tabs have their own keyboard navigation\n  | 'keyboardShortcutProps'\n  | 'labelProps' // Tabs use title prop instead\n  | 'labelRef'\n  | 'level' // Tabs don't use heading levels\n  | 'highlight' // Tabs don't use highlighting\n  | 'highlightCaseSensitive'\n  | 'highlightStyles'\n  | 'variant' // Tabs have internal variant logic\n  | 'htmlType' // Tab is always a button\n  | 'isSelected' // Handled internally by state\n  | 'preserveActionsSpace' // Set internally in TabButton\n  | 'disableActionsFocus' // Not used in Tab\n  | 'actions' // Tab has its own actions definition\n  | 'autoHideActions' // Tab has its own autoHideActions\n  | 'insideWrapper' // Internal Item wrapper prop\n  | 'showActions'; // Internal Item wrapper prop\n\n/** Common styling props for tabs - inherits style props from CubeItemProps */\nexport interface TabStyleProps extends Omit<CubeItemProps, OmittedItemProps> {\n  /**\n   * Tab size. Supports 'xsmall', 'small', 'medium', 'large'.\n   * Radio type supports 'large' (default, 40px) and 'medium' (32px),\n   * mapped to Item button sizes medium (32px) and xsmall (24px).\n   */\n  size?: TabSize;\n  /** Whether to show actions only on hover. */\n  autoHideActions?: boolean;\n}\n\n// =============================================================================\n// Component Props\n// =============================================================================\n\n/** Cache key type - primitives only for reliable comparison */\nexport type CacheKeyValue = string | number | boolean | null | undefined;\n\nexport interface CubeTabsProps\n  extends BaseProps,\n    OuterStyleProps,\n    PanelBehaviorProps {\n  /** Controlled active tab key. When provided, component is controlled. */\n  activeKey?: string;\n  /** Initial active tab key for uncontrolled mode. */\n  defaultActiveKey?: string;\n  /**\n   * Visual appearance type for tabs.\n   * - `default` - Standard tabs with selection indicator below (default)\n   * - `narrow` - Same as default but with collapsed vertical padding on labels\n   * - `file` - File-style tabs with border bottom highlight on selection, delimiter between tabs\n   * - `radio` - Radio button style for tab selection\n   * @default 'default'\n   */\n  type?: TabType;\n  /**\n   * Where the tab bar sits relative to its panels.\n   * `'top'` / `'bottom'` keep the bar horizontal; `'left'` / `'right'`\n   * switch it to a vertical strip. The selection indicator, scroll behavior,\n   * fades, and per-type visuals all adapt automatically.\n   * @default 'top'\n   */\n  placement?: TabPlacement;\n  /**\n   * Tab size. Supports 'xsmall', 'small', 'medium', 'large'.\n   * Radio type supports 'large' (default, 40px) and 'medium' (32px),\n   * mapped to Item button sizes medium (32px) and xsmall (24px).\n   * @default 'medium'\n   */\n  size?: TabSize;\n  /** Accessible label for the tab list. */\n  label?: string;\n  /** Content rendered before the tab list. */\n  prefix?: ReactNode;\n  /** Content rendered after the tab list. */\n  suffix?: ReactNode;\n  /** Callback when active tab changes. */\n  onChange?: (key: string) => void;\n  /** Callback when tab delete button is clicked. Presence enables delete buttons. */\n  onDelete?: (key: string) => void;\n  /** Callback when a tab title is changed. Enables title editing on tabs with isEditable. */\n  onTitleChange?: (key: string, newTitle: string) => void;\n  /** Whether to show tab actions only on hover. Can be overridden per-tab. */\n  autoHideActions?: boolean;\n  /**\n   * Whether tabs are editable by default.\n   * Can be overridden per-tab via Tab's isEditable prop.\n   * @default false\n   */\n  isEditable?: boolean;\n  /**\n   * Default menu items for all tabs.\n   * Can be overridden per-tab via Tab's menu prop.\n   * Set to `null` on individual Tab to disable menu for that tab.\n   */\n  menu?: ReactNode;\n  /**\n   * Default props for the menu trigger button.\n   * Can be overridden per-tab via Tab's menuTriggerProps prop.\n   * @default { icon: <MoreIcon /> }\n   */\n  menuTriggerProps?: Partial<CubeItemActionProps>;\n  /**\n   * Default props passed to the Menu component.\n   * Can be overridden per-tab via Tab's menuProps prop.\n   */\n  menuProps?: Partial<CubeMenuProps<object>>;\n  /**\n   * Context menu / overflow behavior for tab `menu` items.\n   * - `false` (default) — overflow trigger only; no right-click menu\n   * - `true` — overflow trigger and right-click menu\n   * - `'context-only'` — right-click menu only; no overflow trigger. Inline close\n   *   (`onDelete`) shows even when `menu` is non-empty, like tabs without a menu.\n   * Can be overridden per-tab via Tab's contextMenu prop.\n   * @default false\n   */\n  contextMenu?: TabContextMenu;\n  /**\n   * Callback when a menu action is triggered on any tab.\n   * Called with the action key and the tab key.\n   * Tab-level onAction is called first, then this.\n   */\n  onAction?: (action: string, tabKey: string) => void;\n  /** Custom tasty styles for the tab bar container. */\n  styles?: Styles;\n  /** QA selector attribute. */\n  qa?: string;\n  /** Tab components or Tabs.List with Tabs.Panel. */\n  children?: ReactNode;\n  /**\n   * Functional content renderer for optimized lazy evaluation.\n   * When provided, panel content is only evaluated for the active tab,\n   * while inactive tabs use cached content.\n   */\n  renderPanel?: (key: string) => ReactNode;\n  /**\n   * Cache keys for individual panels. Enables caching for specified panels.\n   */\n  panelCacheKeys?: Record<string | number, CacheKeyValue>;\n  /**\n   * Enable drag-and-drop tab reordering.\n   * When a tab picker is shown (`showTabPicker`), reordering is automatically\n   * enabled in the picker dropdown as well.\n   * @default false\n   */\n  isReorderable?: boolean;\n  /**\n   * Controlled order of tab keys.\n   * When provided, tabs are displayed in this order.\n   */\n  keyOrder?: string[];\n  /**\n   * Callback when tabs are reordered via drag-and-drop.\n   */\n  onReorder?: (newOrder: string[]) => void;\n  /**\n   * Whether to show a tab picker dropdown in the suffix area.\n   * - `true` - always show the tab picker\n   * - `false` - never show the tab picker (default)\n   * - `'auto'` - show only when tabs overflow (has horizontal scroll)\n   * @default false\n   */\n  showTabPicker?: boolean | 'auto';\n  /**\n   * Whether to show scroll arrow buttons in the suffix area.\n   * - `true` - always show scroll arrows\n   * - `false` - never show scroll arrows (default)\n   * - `'auto'` - show only when tabs overflow (has horizontal scroll)\n   * @default false\n   */\n  showScrollArrows?: boolean | 'auto';\n  /**\n   * Position of the tab picker dropdown.\n   * - `'prefix'` - render in the prefix slot (before tab list)\n   * - `'suffix'` - render in the suffix slot (after tab list)\n   * @default 'suffix'\n   */\n  tabPickerPosition?: TabsActionPosition;\n  /**\n   * Position of the scroll arrow buttons.\n   * - `'prefix'` - render in the prefix slot (before tab list)\n   * - `'suffix'` - render in the suffix slot (after tab list)\n   * @default 'suffix'\n   */\n  scrollArrowsPosition?: TabsActionPosition;\n  /**\n   * Visually hide the custom horizontal scrollbar in the tab list\n   * and skip its tracking logic. Does not affect tab picker, scroll arrows,\n   * or fade indicators — only the tiny scrollbar visual.\n   * @default false\n   */\n  hideTabListScroll?: boolean;\n  /**\n   * Inline padding for the tab list container.\n   * Sets horizontal padding only (e.g., \"2x\" → padding: \"0 2x\").\n   */\n  tabListPadding?: string;\n  /** Custom tasty styles for the tab bar (Bar sub-element). */\n  barStyles?: Styles;\n  /** Custom tasty styles for the TabList sub-element. */\n  tabListStyles?: Styles;\n  /** Custom tasty styles for the Prefix sub-element. */\n  prefixStyles?: Styles;\n  /** Custom tasty styles for the Suffix sub-element. */\n  suffixStyles?: Styles;\n}\n\nexport interface CubeTabProps extends TabStyleProps, PanelBehaviorProps {\n  /**\n   * Unique identifier for the tab.\n   * Auto-injected from the React `key` prop (converted to string).\n   */\n  id?: string;\n  /**\n   * Content displayed in the tab button. Optional for icon-only tabs\n   * (`icon` / `rightIcon`). When omitted, provide an `aria-label` (and\n   * typically a `tooltip`) so the tab has an accessible name.\n   */\n  title?: ReactNode;\n  /** Panel content rendered when tab is active. */\n  children?: ReactNode;\n  /** Disables the tab (cannot be selected). */\n  isDisabled?: boolean;\n  /** Actions to render in the tab. Rendered before menu trigger if tab has menu. */\n  actions?: ReactNode;\n  /** Whether the tab title can be edited. Overrides the Tabs-level isEditable default. */\n  isEditable?: boolean;\n  /** Callback when this tab's title is changed. Overrides parent's onTitleChange. */\n  onTitleChange?: (newTitle: string) => void;\n  /**\n   * Menu items to display in a dropdown menu on the tab.\n   * Pass Menu.Item elements directly - they will be wrapped in a Menu internally.\n   * Overrides the Tabs-level menu default. Set to `null` to disable menu.\n   */\n  menu?: ReactNode | null;\n  /**\n   * Props to customize the menu trigger button.\n   * Overrides the Tabs-level menuTriggerProps default.\n   */\n  menuTriggerProps?: Partial<CubeItemActionProps>;\n  /**\n   * Props passed to the Menu component.\n   * Overrides the Tabs-level menuProps default.\n   */\n  menuProps?: Partial<CubeMenuProps<object>>;\n  /**\n   * Context menu / overflow behavior. Same values as Tabs `contextMenu`.\n   * Uses the same menu items as `menu` prop.\n   * @default false\n   */\n  contextMenu?: TabContextMenu;\n  /**\n   * Callback when a menu action is triggered.\n   * Called with the action key from Menu.Item.\n   */\n  onAction?: (action: string) => void;\n}\n\nexport interface CubeTabPanelProps extends PanelBehaviorProps, QAProps {\n  /**\n   * Panel identifier. Must match a Tab's id.\n   * Auto-injected from the React `key` prop (converted to string).\n   */\n  id?: string;\n  /** Panel content. */\n  children?: ReactNode;\n  /** Custom tasty styles for the panel container. */\n  styles?: Styles;\n}\n\nexport interface CubeTabListProps {\n  /** Tab components. */\n  children?: ReactNode;\n}\n\n// =============================================================================\n// Internal Types\n// =============================================================================\n\n/**\n * Internal representation of a parsed Tab.\n * Uses `content` instead of `children` to distinguish panel content.\n */\nexport interface ParsedTab extends Omit<CubeTabProps, 'id' | 'children'> {\n  /** Tab key (always a string internally for React Aria compatibility) */\n  key: string;\n  /** Panel content extracted from Tab's children prop */\n  content: ReactNode;\n}\n\n/**\n * Internal representation of a parsed TabPanel.\n */\nexport interface ParsedPanel\n  extends Omit<CubeTabPanelProps, 'id' | 'children'> {\n  /** Panel key (always a string internally for React Aria compatibility) */\n  key: string;\n  /** Panel content extracted from TabPanel's children prop */\n  content: ReactNode;\n}\n"],"mappings":";;;;;;;AAkCA,MAAa,iBAAsD;CACjE,QAAQ;CACR,OAAO;CACR"}
+{"version":3,"file":"types.js","names":["BaseProps","OuterStyleProps","Styles","ReactNode","CubeItemActionProps","CubeMenuProps","CubeItemProps","TabType","TabPlacement","TabsActionPosition","TabSize","RADIO_SIZE_MAP","Record","medium","large","TabContextMenu","PanelBehaviorProps","prerender","keepMounted","QAProps","qa","qaVal","OmittedItemProps","TabStyleProps","Omit","size","autoHideActions","CacheKeyValue","CubeTabsProps","activeKey","defaultActiveKey","type","placement","label","prefix","suffix","onChange","key","onDelete","onTitleChange","newTitle","isEditable","menu","menuTriggerProps","Partial","menuProps","contextMenu","onAction","action","tabKey","styles","children","renderPanel","panelCacheKeys","isReorderable","keyOrder","onReorder","newOrder","showTabPicker","showScrollArrows","tabPickerPosition","scrollArrowsPosition","hideTabListScroll","tabListPadding","barStyles","tabListStyles","prefixStyles","suffixStyles","CubeTabProps","id","title","isDisabled","actions","CubeTabPanelProps","CubeTabListProps","ParsedTab","content","ParsedPanel"],"sources":["../../../../src/components/navigation/Tabs/types.ts"],"sourcesContent":["import type { BaseProps, OuterStyleProps, Styles } from '@tenphi/tasty';\nimport type { ReactNode } from 'react';\nimport type { CubeItemActionProps } from '../../actions/ItemAction';\nimport type { CubeMenuProps } from '../../actions/Menu';\nimport type { CubeItemProps } from '../../content/Item';\n\n// =============================================================================\n// Core Types\n// =============================================================================\n\n/** Visual appearance type for tabs */\nexport type TabType = 'default' | 'narrow' | 'file' | 'radio';\n\n/**\n * Where the tab bar sits relative to its panels.\n * - `'top'` / `'bottom'` keep the bar horizontal.\n * - `'left'` / `'right'` switch it to a vertical strip.\n */\nexport type TabPlacement = 'top' | 'bottom' | 'left' | 'right';\n\n/** Position for TabPicker and scroll arrows */\nexport type TabsActionPosition = 'prefix' | 'suffix';\n\n/**\n * Tab size options.\n * Radio type only supports 'medium' | 'large' (mapped to smaller Item sizes).\n */\nexport type TabSize = 'xsmall' | 'small' | 'medium' | 'large';\n\n/**\n * Size mapping for radio type tabs.\n * API sizes mapped to Item button sizes:\n * medium (default) -> xsmall (32px total), large -> medium (40px total).\n */\nexport const RADIO_SIZE_MAP: Record<'medium' | 'large', TabSize> = {\n  medium: 'xsmall',\n  large: 'medium',\n};\n\n/** How the tab `menu` is exposed alongside or instead of the overflow trigger. */\nexport type TabContextMenu = boolean | 'context-only';\n\n// =============================================================================\n// Shared Props Interfaces\n// =============================================================================\n\n/** Common props for panel rendering behavior */\nexport interface PanelBehaviorProps {\n  /** If true, panel is rendered but hidden when not active. */\n  prerender?: boolean;\n  /** If true, once visited the panel stays in DOM. */\n  keepMounted?: boolean;\n}\n\n/** Common props for QA attributes */\nexport interface QAProps {\n  /** QA selector attribute. */\n  qa?: string;\n  /** Additional QA value attribute. */\n  qaVal?: string;\n}\n\n// =============================================================================\n// Tab Style Props\n// =============================================================================\n\n/** Props from CubeItemProps that don't apply to Tab */\ntype OmittedItemProps =\n  | 'id' // Tab has its own id as Key type\n  | 'type' // Type is decided at the Tabs level, never per-tab\n  | 'size' // Tab has its own TabSize\n  | 'theme' // Tabs have internal theming\n  | 'shape' // Tabs have internal shape logic\n  | 'description' // Tabs don't have descriptions\n  | 'descriptionPlacement'\n  | 'descriptionProps'\n  | 'hotkeys' // Tabs have their own keyboard navigation\n  | 'keyboardShortcutProps'\n  | 'labelProps' // Tabs use title prop instead\n  | 'labelRef'\n  | 'level' // Tabs don't use heading levels\n  | 'highlight' // Tabs don't use highlighting\n  | 'highlightCaseSensitive'\n  | 'highlightStyles'\n  | 'variant' // Tabs have internal variant logic\n  | 'htmlType' // Tab is always a button\n  | 'isSelected' // Handled internally by state\n  | 'preserveActionsSpace' // Set internally in TabButton\n  | 'disableActionsFocus' // Not used in Tab\n  | 'actions' // Tab has its own actions definition\n  | 'autoHideActions' // Tab has its own autoHideActions\n  | 'insideWrapper' // Internal Item wrapper prop\n  | 'showActions'; // Internal Item wrapper prop\n\n/** Common styling props for tabs - inherits style props from CubeItemProps */\nexport interface TabStyleProps extends Omit<CubeItemProps, OmittedItemProps> {\n  /**\n   * Tab size. Supports 'xsmall', 'small', 'medium', 'large'.\n   * Radio type supports 'large' (default, 40px) and 'medium' (32px),\n   * mapped to Item button sizes medium (32px) and xsmall (24px).\n   */\n  size?: TabSize;\n  /** Whether to show actions only on hover. */\n  autoHideActions?: boolean;\n}\n\n// =============================================================================\n// Component Props\n// =============================================================================\n\n/** Cache key type - primitives only for reliable comparison */\nexport type CacheKeyValue = string | number | boolean | null | undefined;\n\nexport interface CubeTabsProps\n  extends BaseProps,\n    OuterStyleProps,\n    PanelBehaviorProps {\n  /** Controlled active tab key. When provided, component is controlled. */\n  activeKey?: string;\n  /** Initial active tab key for uncontrolled mode. */\n  defaultActiveKey?: string;\n  /**\n   * Visual appearance type for tabs.\n   * - `default` - Standard tabs with selection indicator below (default)\n   * - `narrow` - Same as default but with collapsed vertical padding on labels\n   * - `file` - File-style tabs with border bottom highlight on selection, delimiter between tabs\n   * - `radio` - Radio button style for tab selection\n   * @default 'default'\n   */\n  type?: TabType;\n  /**\n   * Where the tab bar sits relative to its panels.\n   * `'top'` / `'bottom'` keep the bar horizontal; `'left'` / `'right'`\n   * switch it to a vertical strip. The selection indicator, scroll behavior,\n   * fades, and per-type visuals all adapt automatically.\n   * @default 'top'\n   */\n  placement?: TabPlacement;\n  /**\n   * Tab size. Supports 'xsmall', 'small', 'medium', 'large'.\n   * Radio type supports 'large' (default, 40px) and 'medium' (32px),\n   * mapped to Item button sizes medium (32px) and xsmall (24px).\n   * @default 'medium'\n   */\n  size?: TabSize;\n  /** Accessible label for the tab list. */\n  label?: string;\n  /** Content rendered before the tab list. */\n  prefix?: ReactNode;\n  /** Content rendered after the tab list. */\n  suffix?: ReactNode;\n  /** Callback when active tab changes. */\n  onChange?: (key: string) => void;\n  /** Callback when tab delete button is clicked. Presence enables delete buttons. */\n  onDelete?: (key: string) => void;\n  /** Callback when a tab title is changed. Enables title editing on tabs with isEditable. */\n  onTitleChange?: (key: string, newTitle: string) => void;\n  /** Whether to show tab actions only on hover. Can be overridden per-tab. */\n  autoHideActions?: boolean;\n  /**\n   * Whether tabs are editable by default.\n   * Can be overridden per-tab via Tab's isEditable prop.\n   * @default false\n   */\n  isEditable?: boolean;\n  /**\n   * Default menu items for all tabs.\n   * Can be overridden per-tab via Tab's menu prop.\n   * Set to `null` on individual Tab to disable menu for that tab.\n   */\n  menu?: ReactNode;\n  /**\n   * Default props for the menu trigger button.\n   * Can be overridden per-tab via Tab's menuTriggerProps prop.\n   * @default { icon: <MoreIcon /> }\n   */\n  menuTriggerProps?: Partial<CubeItemActionProps>;\n  /**\n   * Default props passed to the Menu component.\n   * Can be overridden per-tab via Tab's menuProps prop.\n   */\n  menuProps?: Partial<CubeMenuProps<object>>;\n  /**\n   * Context menu / overflow behavior for tab `menu` items.\n   * - `false` (default) — overflow trigger only; no right-click menu\n   * - `true` — overflow trigger and right-click menu\n   * - `'context-only'` — right-click menu only; no overflow trigger. Inline close\n   *   (`onDelete`) shows even when `menu` is non-empty, like tabs without a menu.\n   * Can be overridden per-tab via Tab's contextMenu prop.\n   * @default false\n   */\n  contextMenu?: TabContextMenu;\n  /**\n   * Callback when a menu action is triggered on any tab.\n   * Called with the action key and the tab key.\n   * Tab-level onAction is called first, then this.\n   */\n  onAction?: (action: string, tabKey: string) => void;\n  /** Custom tasty styles for the tab bar container. */\n  styles?: Styles;\n  /** QA selector attribute. */\n  qa?: string;\n  /** Tab components or Tabs.List with Tabs.Panel. */\n  children?: ReactNode;\n  /**\n   * Functional content renderer for optimized lazy evaluation.\n   * When provided, panel content is only evaluated for the active tab,\n   * while inactive tabs use cached content.\n   */\n  renderPanel?: (key: string) => ReactNode;\n  /**\n   * Cache keys for individual panels. Enables caching for specified panels.\n   */\n  panelCacheKeys?: Record<string | number, CacheKeyValue>;\n  /**\n   * Enable drag-and-drop tab reordering.\n   * When a tab picker is shown (`showTabPicker`), reordering is automatically\n   * enabled in the picker dropdown as well.\n   * @default false\n   */\n  isReorderable?: boolean;\n  /**\n   * Controlled order of tab keys.\n   * When provided, tabs are displayed in this order.\n   */\n  keyOrder?: string[];\n  /**\n   * Callback when tabs are reordered via drag-and-drop.\n   */\n  onReorder?: (newOrder: string[]) => void;\n  /**\n   * Whether to show a tab picker dropdown in the suffix area.\n   * - `true` - always show the tab picker\n   * - `false` - never show the tab picker (default)\n   * - `'auto'` - show only when tabs overflow (has horizontal scroll)\n   * @default false\n   */\n  showTabPicker?: boolean | 'auto';\n  /**\n   * Whether to show scroll arrow buttons in the suffix area.\n   * - `true` - always show scroll arrows\n   * - `false` - never show scroll arrows (default)\n   * - `'auto'` - show only when tabs overflow (has horizontal scroll)\n   * @default false\n   */\n  showScrollArrows?: boolean | 'auto';\n  /**\n   * Position of the tab picker dropdown.\n   * - `'prefix'` - render in the prefix slot (before tab list)\n   * - `'suffix'` - render in the suffix slot (after tab list)\n   * @default 'suffix'\n   */\n  tabPickerPosition?: TabsActionPosition;\n  /**\n   * Position of the scroll arrow buttons.\n   * - `'prefix'` - render in the prefix slot (before tab list)\n   * - `'suffix'` - render in the suffix slot (after tab list)\n   * @default 'suffix'\n   */\n  scrollArrowsPosition?: TabsActionPosition;\n  /**\n   * Visually hide the custom horizontal scrollbar in the tab list\n   * and skip its tracking logic. Does not affect tab picker, scroll arrows,\n   * or fade indicators — only the tiny scrollbar visual.\n   * @default false\n   */\n  hideTabListScroll?: boolean;\n  /**\n   * Inline padding for the tab list container.\n   * Sets horizontal padding only (e.g., \"2x\" → padding: \"0 2x\").\n   */\n  tabListPadding?: string;\n  /** Custom tasty styles for the tab bar (Bar sub-element). */\n  barStyles?: Styles;\n  /** Custom tasty styles for the TabList sub-element. */\n  tabListStyles?: Styles;\n  /** Custom tasty styles for the Prefix sub-element. */\n  prefixStyles?: Styles;\n  /** Custom tasty styles for the Suffix sub-element. */\n  suffixStyles?: Styles;\n}\n\nexport interface CubeTabProps extends TabStyleProps, PanelBehaviorProps {\n  /**\n   * Unique identifier for the tab.\n   * Auto-injected from the React `key` prop (converted to string).\n   */\n  id?: string;\n  /**\n   * Content displayed in the tab button. Optional for icon-only tabs\n   * (`icon` / `rightIcon`). When omitted, provide an `aria-label` (and\n   * typically a `tooltip`) so the tab has an accessible name.\n   */\n  title?: ReactNode;\n  /** Panel content rendered when tab is active. */\n  children?: ReactNode;\n  /** Disables the tab (cannot be selected). */\n  isDisabled?: boolean;\n  /** Actions to render in the tab. Rendered before menu trigger if tab has menu. */\n  actions?: ReactNode;\n  /** Whether the tab title can be edited. Overrides the Tabs-level isEditable default. */\n  isEditable?: boolean;\n  /** Callback when this tab's title is changed. Overrides parent's onTitleChange. */\n  onTitleChange?: (newTitle: string) => void;\n  /**\n   * Menu items to display in a dropdown menu on the tab.\n   * Pass Menu.Item elements directly - they will be wrapped in a Menu internally.\n   * Overrides the Tabs-level menu default. Set to `null` to disable menu.\n   */\n  menu?: ReactNode | null;\n  /**\n   * Props to customize the menu trigger button.\n   * Overrides the Tabs-level menuTriggerProps default.\n   */\n  menuTriggerProps?: Partial<CubeItemActionProps>;\n  /**\n   * Props passed to the Menu component.\n   * Overrides the Tabs-level menuProps default.\n   */\n  menuProps?: Partial<CubeMenuProps<object>>;\n  /**\n   * Context menu / overflow behavior. Same values as Tabs `contextMenu`.\n   * Uses the same menu items as `menu` prop.\n   * @default false\n   */\n  contextMenu?: TabContextMenu;\n  /**\n   * Callback when a menu action is triggered.\n   * Called with the action key from Menu.Item.\n   */\n  onAction?: (action: string) => void;\n}\n\nexport interface CubeTabPanelProps extends PanelBehaviorProps, QAProps {\n  /**\n   * Panel identifier. Must match a Tab's id.\n   * Auto-injected from the React `key` prop (converted to string).\n   */\n  id?: string;\n  /** Panel content. */\n  children?: ReactNode;\n  /** Custom tasty styles for the panel container. */\n  styles?: Styles;\n}\n\nexport interface CubeTabListProps {\n  /** Tab components. */\n  children?: ReactNode;\n}\n\n// =============================================================================\n// Internal Types\n// =============================================================================\n\n/**\n * Internal representation of a parsed Tab.\n * Uses `content` instead of `children` to distinguish panel content.\n */\nexport interface ParsedTab extends Omit<CubeTabProps, 'id' | 'children'> {\n  /** Tab key (always a string internally for React Aria compatibility) */\n  key: string;\n  /** Panel content extracted from Tab's children prop */\n  content: ReactNode;\n}\n\n/**\n * Internal representation of a parsed TabPanel.\n */\nexport interface ParsedPanel\n  extends Omit<CubeTabPanelProps, 'id' | 'children'> {\n  /** Panel key (always a string internally for React Aria compatibility) */\n  key: string;\n  /** Panel content extracted from TabPanel's children prop */\n  content: ReactNode;\n}\n"],"mappings":";;;;;;;AAkCA,MAAaW,iBAAsD;CACjEE,QAAQ;CACRC,OAAO;CACR"}

package/dist/components/navigation/Tabs/use-tab-editing.js

@@ -1,5 +1,6 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
-import { useCallback, useState } from "react";
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
+import { c } from "react-compiler-runtime";
+import { useState } from "react";
 
 //#region src/components/navigation/Tabs/use-tab-editing.ts
 /**
@@ -13,26 +14,62 @@ import { useCallback, useState } from "react";
 * The draft value is managed inside `InlineInput`; this hook only tracks
 * which tab (if any) is currently editing.
 */
-function useTabEditing({ onChange, onTitleChange } = {}) {
+function useTabEditing(t0) {
+	const $ = c(11);
+	let t1;
+	if ($[0] !== t0) {
+		t1 = t0 === void 0 ? {} : t0;
+		$[0] = t0;
+		$[1] = t1;
+	} else t1 = $[1];
+	const { onChange, onTitleChange } = t1;
 	const [editingKey, setEditingKey] = useState(null);
-	return {
-		editingKey,
-		startEditing: useCallback((key) => {
+	let t2;
+	if ($[2] !== onChange) {
+		t2 = (key) => {
 			onChange?.(key);
 			setEditingKey(key);
-		}, [onChange]),
-		cancelEditing: useCallback(() => {
+		};
+		$[2] = onChange;
+		$[3] = t2;
+	} else t2 = $[3];
+	const startEditing = t2;
+	let t3;
+	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = () => {
 			setEditingKey(null);
-		}, []),
-		submitEditing: useCallback((key, newTitle, tabOnTitleChange) => {
+		};
+		$[4] = t3;
+	} else t3 = $[4];
+	const cancelEditing = t3;
+	let t4;
+	if ($[5] !== onTitleChange) {
+		t4 = (key_0, newTitle, tabOnTitleChange) => {
 			const trimmed = newTitle.trim();
 			if (trimmed) {
 				if (tabOnTitleChange) tabOnTitleChange(trimmed);
-				else if (onTitleChange) onTitleChange(key, trimmed);
+				else if (onTitleChange) onTitleChange(key_0, trimmed);
 			}
 			setEditingKey(null);
-		}, [onTitleChange])
-	};
+		};
+		$[5] = onTitleChange;
+		$[6] = t4;
+	} else t4 = $[6];
+	const submitEditing = t4;
+	let t5;
+	if ($[7] !== editingKey || $[8] !== startEditing || $[9] !== submitEditing) {
+		t5 = {
+			editingKey,
+			startEditing,
+			cancelEditing,
+			submitEditing
+		};
+		$[7] = editingKey;
+		$[8] = startEditing;
+		$[9] = submitEditing;
+		$[10] = t5;
+	} else t5 = $[10];
+	return t5;
 }
 
 //#endregion

package/dist/components/navigation/Tabs/use-tab-editing.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-tab-editing.js","names":[],"sources":["../../../../src/components/navigation/Tabs/use-tab-editing.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface UseTabEditingOptions {\n  /** Callback when tab selection changes (used to select tab when editing starts) */\n  onChange?: (key: string) => void;\n  /** Callback when a tab title is changed */\n  onTitleChange?: (key: string, newTitle: string) => void;\n}\n\nexport interface UseTabEditingResult {\n  /** Currently editing tab key (null if not editing) */\n  editingKey: string | null;\n  /** Start editing the given tab. The `currentTitle` argument is kept for API compatibility but is no longer used internally — `InlineInput` manages the draft. */\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// Hook\n// =============================================================================\n\n/**\n * Hook to manage tab title editing state.\n *\n * Provides state and callbacks for inline title editing with support for:\n * - Starting edit mode (selecting the tab)\n * - Submitting changes (with tab-level or parent-level callback)\n * - Canceling edits\n *\n * The draft value is managed inside `InlineInput`; this hook only tracks\n * which tab (if any) is currently editing.\n */\nexport function useTabEditing({\n  onChange,\n  onTitleChange,\n}: UseTabEditingOptions = {}): UseTabEditingResult {\n  const [editingKey, setEditingKey] = useState<string | null>(null);\n\n  const startEditing = useCallback(\n    (key: string) => {\n      onChange?.(key);\n      setEditingKey(key);\n    },\n    [onChange],\n  );\n\n  const cancelEditing = useCallback(() => {\n    setEditingKey(null);\n  }, []);\n\n  const submitEditing = useCallback(\n    (\n      key: string,\n      newTitle: string,\n      tabOnTitleChange?: (title: string) => void,\n    ) => {\n      const trimmed = newTitle.trim();\n\n      if (trimmed) {\n        // Tab-level callback takes precedence\n        if (tabOnTitleChange) {\n          tabOnTitleChange(trimmed);\n        } else if (onTitleChange) {\n          onTitleChange(key, trimmed);\n        }\n      }\n\n      setEditingKey(null);\n    },\n    [onTitleChange],\n  );\n\n  return {\n    editingKey,\n    startEditing,\n    cancelEditing,\n    submitEditing,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;AA2CA,SAAgB,cAAc,EAC5B,UACA,kBACwB,EAAE,EAAuB;CACjD,MAAM,CAAC,YAAY,iBAAiB,SAAwB,KAAK;AAoCjE,QAAO;EACL;EACA,cApCmB,aAClB,QAAgB;AACf,cAAW,IAAI;AACf,iBAAc,IAAI;KAEpB,CAAC,SAAS,CACX;EA+BC,eA7BoB,kBAAkB;AACtC,iBAAc,KAAK;KAClB,EAAE,CAAC;EA4BJ,eA1BoB,aAElB,KACA,UACA,qBACG;GACH,MAAM,UAAU,SAAS,MAAM;AAE/B,OAAI,SAEF;QAAI,iBACF,kBAAiB,QAAQ;aAChB,cACT,eAAc,KAAK,QAAQ;;AAI/B,iBAAc,KAAK;KAErB,CAAC,cAAc,CAChB;EAOA"}
+{"version":3,"file":"use-tab-editing.js","names":["useCallback","useState","UseTabEditingOptions","onChange","key","onTitleChange","newTitle","UseTabEditingResult","editingKey","startEditing","currentTitle","submitEditing","tabOnTitleChange","title","cancelEditing","useTabEditing","t0","$","_c","t1","undefined","setEditingKey","t2","t3","Symbol","for","t4","key_0","trimmed","trim","t5"],"sources":["../../../../src/components/navigation/Tabs/use-tab-editing.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface UseTabEditingOptions {\n  /** Callback when tab selection changes (used to select tab when editing starts) */\n  onChange?: (key: string) => void;\n  /** Callback when a tab title is changed */\n  onTitleChange?: (key: string, newTitle: string) => void;\n}\n\nexport interface UseTabEditingResult {\n  /** Currently editing tab key (null if not editing) */\n  editingKey: string | null;\n  /** Start editing the given tab. The `currentTitle` argument is kept for API compatibility but is no longer used internally — `InlineInput` manages the draft. */\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// Hook\n// =============================================================================\n\n/**\n * Hook to manage tab title editing state.\n *\n * Provides state and callbacks for inline title editing with support for:\n * - Starting edit mode (selecting the tab)\n * - Submitting changes (with tab-level or parent-level callback)\n * - Canceling edits\n *\n * The draft value is managed inside `InlineInput`; this hook only tracks\n * which tab (if any) is currently editing.\n */\nexport function useTabEditing({\n  onChange,\n  onTitleChange,\n}: UseTabEditingOptions = {}): UseTabEditingResult {\n  const [editingKey, setEditingKey] = useState<string | null>(null);\n\n  const startEditing = useCallback(\n    (key: string) => {\n      onChange?.(key);\n      setEditingKey(key);\n    },\n    [onChange],\n  );\n\n  const cancelEditing = useCallback(() => {\n    setEditingKey(null);\n  }, []);\n\n  const submitEditing = useCallback(\n    (\n      key: string,\n      newTitle: string,\n      tabOnTitleChange?: (title: string) => void,\n    ) => {\n      const trimmed = newTitle.trim();\n\n      if (trimmed) {\n        // Tab-level callback takes precedence\n        if (tabOnTitleChange) {\n          tabOnTitleChange(trimmed);\n        } else if (onTitleChange) {\n          onTitleChange(key, trimmed);\n        }\n      }\n\n      setEditingKey(null);\n    },\n    [onTitleChange],\n  );\n\n  return {\n    editingKey,\n    startEditing,\n    cancelEditing,\n    submitEditing,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;AA2CA,SAAOe,cAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAAA,IAAAC;AAAA,KAAAF,EAAA,OAAAD,IAAA;AAAuBG,OAAAH,OAAAI,SAAA,EAGF,GAHEJ;AAGFC,IAAA,KAAAD;AAAAC,IAAA,KAAAE;OAAAA,MAAAF,EAAA;CAHE,MAAA,EAAAd,UAAAE,kBAAAc;CAI5B,MAAA,CAAAX,YAAAa,iBAAoCpB,SAAwB,KAAK;CAAC,IAAAqB;AAAA,KAAAL,EAAA,OAAAd,UAAA;AAGhEmB,QAAAlB,QAAA;AACED,cAAWC,IAAI;AACfiB,iBAAcjB,IAAI;;AACnBa,IAAA,KAAAd;AAAAc,IAAA,KAAAK;OAAAA,MAAAL,EAAA;CAJH,MAAAR,eAAqBa;CAMnB,IAAAC;AAAA,KAAAN,EAAA,OAAAO,OAAAC,IAAA,4BAAA,EAAA;AAEgCF,aAAA;AAChCF,iBAAc,KAAK;;AACpBJ,IAAA,KAAAM;OAAAA,MAAAN,EAAA;CAFD,MAAAH,gBAAsBS;CAEf,IAAAG;AAAA,KAAAT,EAAA,OAAAZ,eAAA;AAGLqB,QAAAC,OAAArB,UAAAM,qBAAA;GAKE,MAAAgB,UAAgBtB,SAAQuB,MAAO;AAE/B,OAAID,SAEF;QAAIhB,iBACFA,kBAAiBgB,QAAQ;aAChBvB,cACTA,eAAcD,OAAKwB,QAAQ;;AAI/BP,iBAAc,KAAK;;AACpBJ,IAAA,KAAAZ;AAAAY,IAAA,KAAAS;OAAAA,MAAAT,EAAA;CAlBH,MAAAN,gBAAsBe;CAoBpB,IAAAI;AAAA,KAAAb,EAAA,OAAAT,cAAAS,EAAA,OAAAR,gBAAAQ,EAAA,OAAAN,eAAA;AAEKmB,OAAA;GAAAtB;GAAAC;GAAAK;GAAAH;GAKN;AAAAM,IAAA,KAAAT;AAAAS,IAAA,KAAAR;AAAAQ,IAAA,KAAAN;AAAAM,IAAA,MAAAa;OAAAA,MAAAb,EAAA;AAAA,QALMa"}