npm - @cube-dev/ui-kit - Versions diffs - 0.177.0 → 0.178.0 - Mend

@cube-dev/ui-kit 0.177.0 → 0.178.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (567) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabs.js","names":["CollectionItem","mergeProps"],"sources":["../../../../src/components/navigation/Tabs/Tabs.tsx"],"sourcesContent":["import { mergeStyles, OUTER_STYLES } from '@tenphi/tasty';\nimport {\n Children,\n ForwardedRef,\n forwardRef,\n isValidElement,\n ReactElement,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport { AriaTabListProps, useTabList } from 'react-aria';\nimport {\n Item as CollectionItem,\n DraggableCollectionState,\n DroppableCollectionState,\n useTabListState,\n} from 'react-stately';\n\nimport { useEvent, useWarn } from '../../../_internal/hooks';\nimport { DirectionIcon } from '../../../icons/DirectionIcon';\nimport { mergeProps, useMergeStyles } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useTinyScrollbar } from '../../content/Layout/hooks/useTinyScrollbar';\nimport { useBoardDragActive } from '../../layout/Board/board-context';\n\nimport { DraggableTabList } from './DraggableTabList';\nimport { TabIndicatorElement, TabsElement } from './styled';\nimport { TabButton } from './TabButton';\nimport { CachedPanelRenderer, TabPanelRenderer } from './TabPanel';\nimport { TabPicker } from './TabPicker';\nimport { TabsAction } from './TabsAction';\nimport { TabsContextValue, TabsProvider } from './TabsContext';\nimport { useTabEditing } from './use-tab-editing';\nimport { useTabIndicator } from './use-tab-indicator';\n\nimport type { Key } from '@react-types/shared';\nimport type {\n CubeTabListProps,\n CubeTabPanelProps,\n CubeTabProps,\n CubeTabsProps,\n ParsedPanel,\n ParsedTab,\n} from './types';\n\n// =============================================================================\n// Helper Functions\n// =============================================================================\n\n/*\n Generic helper to check if a child is a specific component by displayName.\n /\nfunction isComponentElement<T>(\n child: ReactNode,\n displayName: string,\n): child is ReactElement<T> {\n return (\n isValidElement(child) &&\n typeof child.type === 'function' &&\n (child.type as any).displayName === displayName\n );\n}\n\n/* Checks if a child is a Tab component. /\nconst isTabElement = (child: ReactNode): child is ReactElement<CubeTabProps> =>\n isComponentElement<CubeTabProps>(child, 'CubeTab');\n\n/* Checks if a child is a TabPanel component. /\nconst isTabPanelElement = (\n child: ReactNode,\n): child is ReactElement<CubeTabPanelProps> =>\n isComponentElement<CubeTabPanelProps>(child, 'CubeTabPanel');\n\n/* Checks if a child is a TabList component. /\nconst isTabListElement = (\n child: ReactNode,\n): child is ReactElement<CubeTabListProps> =>\n isComponentElement<CubeTabListProps>(child, 'CubeTabList');\n\n/\n Extracts the raw key from a React element, stripping the \".$\" prefix\n * that React adds via Children.map/toArray.\n /\nfunction getRawKey(element: ReactElement): string \| null {\n if (element.key == null) return null;\n const keyStr = String(element.key);\n return keyStr.startsWith('.$') ? keyStr.slice(2) : keyStr;\n}\n\n// =============================================================================\n// Tab Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction Tab(_props: CubeTabProps): ReactElement \| null {\n return null;\n}\n\nTab.displayName = 'CubeTab';\n\n// =============================================================================\n// TabPanel Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabPanel(_props: CubeTabPanelProps): ReactElement \| null {\n return null;\n}\n\nTabPanel.displayName = 'CubeTabPanel';\n\n// =============================================================================\n// TabList Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabList(_props: CubeTabListProps): ReactElement \| null {\n return null;\n}\n\nTabList.displayName = 'CubeTabList';\n\n// =============================================================================\n// Main Tabs Component\n// =============================================================================\n\nfunction TabsComponent(\n props: CubeTabsProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const {\n label = 'Tabs',\n defaultActiveKey,\n activeKey,\n size,\n type = 'default',\n placement = 'top',\n onChange,\n onDelete,\n onTitleChange,\n autoHideActions,\n isEditable: parentIsEditable,\n menu: parentMenu,\n menuTriggerProps: parentMenuTriggerProps,\n menuProps: parentMenuProps,\n contextMenu: parentContextMenu,\n onAction: parentOnAction,\n children,\n prefix,\n suffix,\n prerender = false,\n keepMounted = false,\n qa = 'Tabs',\n renderPanel,\n panelCacheKeys,\n isReorderable = false,\n keyOrder,\n onReorder,\n showTabPicker = false,\n showScrollArrows = false,\n tabPickerPosition = 'suffix',\n scrollArrowsPosition = 'suffix',\n hideTabListScroll = false,\n tabListPadding,\n barStyles,\n tabListStyles,\n prefixStyles,\n suffixStyles,\n ...otherProps\n } = props;\n\n // Derive orientation from placement\n const orientation: 'horizontal' \| 'vertical' =\n placement === 'left' \|\| placement === 'right' ? 'vertical' : 'horizontal';\n\n // `narrow` only makes sense for a horizontal strip — its whole point is\n // collapsed horizontal padding for a denser row of tabs. Force `default`\n // when the strip is vertical.\n const effectiveType =\n orientation === 'vertical' && type === 'narrow' ? 'default' : type;\n\n // Extract outer styles (these go on the new outer wrapper)\n const baseStyles = extractStyles(otherProps, OUTER_STYLES);\n\n // Build TabList padding style (memoized)\n const tabListPaddingStyles = useMemo(\n () =>\n tabListPadding ? { '$tablist-padding': `${tabListPadding}` } : undefined,\n [tabListPadding],\n );\n\n // Merge tabListPaddingStyles with tabListStyles (memoized)\n const mergedTabListStyles = useMemo(\n () => mergeStyles(tabListPaddingStyles, tabListStyles),\n [tabListPaddingStyles, tabListStyles],\n );\n\n // Merge all sub-element styles into baseStyles. The outer `TabsElement`\n // exposes `Bar`, `Prefix`, `Suffix`, `TabList`, `ScrollWrapper`, `Scroll`,\n // and `Scrollbar` sub-elements (defined in styled.ts).\n const combinedStyles = useMergeStyles(baseStyles, {\n Bar: barStyles,\n TabList: mergedTabListStyles,\n Prefix: prefixStyles,\n Suffix: suffixStyles,\n });\n\n // DOM element refs\n const listRef = useRef<HTMLDivElement>(null);\n const scrollRef = useRef<HTMLDivElement>(null);\n\n // Track visited tabs for keepMounted functionality\n const visitedKeysRef = useRef<Set<string>>(new Set());\n\n // While a Board widget is being dragged (this Tabs sits inside a Board),\n // force panels to stay mounted so a tab a widget is dragged out of - and its\n // board owning the in-flight drag gesture - is not unmounted when the user\n // spring-loads a different tab by hovering it. Always `false` outside a Board.\n const isBoardDragActive = useBoardDragActive();\n const effectiveKeepMounted = keepMounted \|\| isBoardDragActive;\n\n // =========================================================================\n // Tab Title Editing Hook\n // =========================================================================\n const onTitleChangeRaf = useEvent((key: string, newTitle: string) => {\n requestAnimationFrame(() => {\n onTitleChange?.(key, newTitle);\n });\n });\n\n const { editingKey, startEditing, cancelEditing, submitEditing } =\n useTabEditing({\n onChange,\n onTitleChange: onTitleChange ? onTitleChangeRaf : undefined,\n });\n\n // =========================================================================\n // Parse children to extract tabs and explicit panels\n // =========================================================================\n const { parsedTabs, explicitPanels, hasAnyContent } = useMemo(() => {\n const childArray = Children.toArray(children);\n const tabs: ParsedTab[] = [];\n const panels = new Map<string, ParsedPanel>();\n let hasExplicitList = false;\n let tabChildren: ReactNode[] = [];\n\n // Check for explicit Tabs.List / Tabs.Panel structure\n for (const child of childArray) {\n if (isTabListElement(child)) {\n hasExplicitList = true;\n tabChildren = Children.toArray(child.props.children);\n } else if (isTabPanelElement(child)) {\n const key = getRawKey(child as ReactElement);\n\n if (key != null) {\n panels.set(key, {\n key,\n content: child.props.children,\n prerender: child.props.prerender,\n keepMounted: child.props.keepMounted,\n styles: child.props.styles,\n qa: child.props.qa,\n qaVal: child.props.qaVal,\n });\n }\n }\n }\n\n // If no explicit list, use direct Tab children\n if (!hasExplicitList) {\n tabChildren = childArray;\n }\n\n // Parse Tab elements\n let hasContent = panels.size > 0;\n\n for (const child of tabChildren) {\n if (isTabElement(child)) {\n const key = getRawKey(child) ?? child.props.id;\n\n if (key != null) {\n const { id: _id, children: tabContent, ...tabProps } = child.props;\n\n tabs.push({\n ...tabProps,\n key,\n content: tabContent,\n });\n\n if (tabContent != null) {\n hasContent = true;\n }\n }\n }\n }\n\n return {\n parsedTabs: tabs,\n explicitPanels: panels,\n hasAnyContent: hasContent,\n };\n }, [children]);\n\n // Clean up visitedKeys when tabs are removed\n const currentTabKeysSet = useMemo(\n () => new Set(parsedTabs.map((t) => t.key)),\n [parsedTabs],\n );\n\n useEffect(() => {\n for (const key of visitedKeysRef.current) {\n if (!currentTabKeysSet.has(key)) {\n visitedKeysRef.current.delete(key);\n }\n }\n }, [currentTabKeysSet]);\n\n // =========================================================================\n // Order tabs according to keyOrder\n // =========================================================================\n const orderedParsedTabs = useMemo(() => {\n if (!keyOrder \|\| keyOrder.length === 0) {\n return parsedTabs;\n }\n\n const tabMap = new Map<string, ParsedTab>();\n for (const tab of parsedTabs) {\n tabMap.set(tab.key, tab);\n }\n\n const ordered: ParsedTab[] = [];\n for (const key of keyOrder) {\n const tab = tabMap.get(String(key));\n if (tab) {\n ordered.push(tab);\n tabMap.delete(String(key));\n }\n }\n\n // Append any tabs not in keyOrder\n for (const tab of parsedTabs) {\n if (tabMap.has(tab.key)) {\n ordered.push(tab);\n }\n }\n\n return ordered;\n }, [parsedTabs, keyOrder]);\n\n // Create collection items for React Stately\n const collectionItems = useMemo(() => {\n return orderedParsedTabs.map((tab) => (\n <CollectionItem\n key={tab.key}\n textValue={typeof tab.title === 'string' ? tab.title : String(tab.key)}\n >\n {tab.title}\n </CollectionItem>\n ));\n }, [orderedParsedTabs]);\n\n // Determine disabled keys\n const disabledKeys = useMemo(() => {\n return new Set(\n parsedTabs.filter((tab) => tab.isDisabled).map((tab) => tab.key),\n );\n }, [parsedTabs]);\n\n // Handle selection change (converts React Aria's Key to string for our API)\n const handleSelectionChange = useEvent((key: Key) => {\n const keyStr = String(key);\n visitedKeysRef.current.add(keyStr);\n onChange?.(keyStr);\n });\n\n // Convert keys to strings for React Aria compatibility\n const selectedKey = activeKey != null ? String(activeKey) : undefined;\n const defaultSelectedKey =\n defaultActiveKey != null ? String(defaultActiveKey) : undefined;\n\n // Create aria props for useTabListState\n const ariaProps: AriaTabListProps<object> = useMemo(\n () => ({\n selectedKey,\n defaultSelectedKey,\n onSelectionChange: handleSelectionChange,\n disabledKeys,\n children: collectionItems,\n 'aria-label': label,\n orientation,\n }),\n [\n selectedKey,\n defaultSelectedKey,\n handleSelectionChange,\n disabledKeys,\n collectionItems,\n label,\n orientation,\n ],\n );\n\n // Create state using useTabListState\n const state = useTabListState(ariaProps);\n\n // Track initial selected key for visited tabs\n useEffect(() => {\n if (state.selectedKey != null) {\n visitedKeysRef.current.add(String(state.selectedKey));\n }\n }, [state.selectedKey]);\n\n // Get tablist props from react-aria\n const { tabListProps } = useTabList(ariaProps, state, listRef);\n\n // Handle selection from TabPicker (needs to update internal state in uncontrolled mode)\n const handleTabPickerSelect = useEvent((key: string) => {\n // Update internal state (for uncontrolled mode)\n state.setSelectedKey(key);\n // Also call the external onChange handler\n handleSelectionChange(key);\n });\n\n // =========================================================================\n // Tab Indicator (for default type)\n // =========================================================================\n // Create order token that changes when tab order changes (for indicator recalculation)\n const orderToken = useMemo(\n () => orderedParsedTabs.map((t) => t.key).join(','),\n [orderedParsedTabs],\n );\n\n const indicatorStyle = useTabIndicator(\n listRef,\n state.selectedKey,\n effectiveType === 'default' \|\| effectiveType === 'narrow',\n orientation,\n orderToken,\n );\n\n // =========================================================================\n // Tiny Scrollbar (not for radio type)\n // =========================================================================\n const isTinyScrollbar = effectiveType !== 'radio';\n const {\n handleHStyle,\n handleVStyle,\n hasOverflowX,\n hasOverflowY,\n isScrolling,\n isAtStartX,\n isAtEndX,\n isAtStartY,\n isAtEndY,\n } = useTinyScrollbar(scrollRef, isTinyScrollbar);\n const showTinyScrollbar = isTinyScrollbar && !hideTabListScroll;\n\n // Active-axis aggregates (used everywhere downstream so we don't sprinkle\n // orientation checks around).\n const hasOverflow = orientation === 'vertical' ? hasOverflowY : hasOverflowX;\n const isAtStart = orientation === 'vertical' ? isAtStartY : isAtStartX;\n const isAtEnd = orientation === 'vertical' ? isAtEndY : isAtEndX;\n\n const hasPanels = hasAnyContent \|\| !!renderPanel;\n\n // =========================================================================\n // Tab Picker visibility\n // =========================================================================\n useWarn(showTabPicker && effectiveType === 'radio', {\n key: ['tabs-tabpicker-radio-unsupported'],\n args: [\n 'Tabs:',\n '`showTabPicker` is not supported when `type=\"radio\"`. The TabPicker will not be rendered.',\n ],\n });\n\n const shouldShowTabPicker =\n effectiveType !== 'radio' &&\n (showTabPicker === true \|\| (showTabPicker === 'auto' && hasOverflow));\n\n // =========================================================================\n // Scroll Arrows visibility and handlers\n // =========================================================================\n useWarn(showScrollArrows && effectiveType === 'radio', {\n key: ['tabs-scrollarrows-radio-unsupported'],\n args: [\n 'Tabs:',\n '`showScrollArrows` is not supported when `type=\"radio\"`. The scroll arrows will not be rendered.',\n ],\n });\n\n const shouldShowScrollArrows =\n effectiveType !== 'radio' &&\n (showScrollArrows === true \|\| (showScrollArrows === 'auto' && hasOverflow));\n\n const handleScrollStart = useEvent(() => {\n const el = scrollRef.current;\n if (!el) return;\n if (orientation === 'vertical') {\n el.scrollTo({\n top: el.scrollTop - el.clientHeight,\n behavior: 'smooth',\n });\n } else {\n el.scrollTo({\n left: el.scrollLeft - el.clientWidth,\n behavior: 'smooth',\n });\n }\n });\n\n const handleScrollEnd = useEvent(() => {\n const el = scrollRef.current;\n if (!el) return;\n if (orientation === 'vertical') {\n el.scrollTo({\n top: el.scrollTop + el.clientHeight,\n behavior: 'smooth',\n });\n } else {\n el.scrollTo({\n left: el.scrollLeft + el.clientWidth,\n behavior: 'smooth',\n });\n }\n });\n\n // =========================================================================\n // Base Context Value (without drag/drop states)\n // =========================================================================\n const baseContextValue = useMemo(\n () => ({\n state,\n type: effectiveType,\n size,\n placement,\n autoHideActions,\n isEditable: parentIsEditable,\n menu: parentMenu,\n menuTriggerProps: parentMenuTriggerProps,\n menuProps: parentMenuProps,\n contextMenu: parentContextMenu,\n onDelete,\n onAction: parentOnAction,\n editingKey,\n startEditing,\n submitEditing,\n cancelEditing,\n }),\n [\n state,\n effectiveType,\n size,\n placement,\n autoHideActions,\n parentIsEditable,\n parentMenu,\n parentMenuTriggerProps,\n parentMenuProps,\n parentContextMenu,\n onDelete,\n parentOnAction,\n editingKey,\n startEditing,\n submitEditing,\n cancelEditing,\n ],\n );\n\n // Helper to create full context value with optional drag/drop states\n const createContextValue = (\n dragState?: DraggableCollectionState,\n dropState?: DroppableCollectionState,\n ): TabsContextValue => ({\n ...baseContextValue,\n dragState,\n dropState,\n });\n\n // =========================================================================\n // Tab List Content Renderer\n // =========================================================================\n const renderTabListContent = (\n contextValue: TabsContextValue,\n collectionProps: Record<string, unknown> = {},\n ) => (\n <div\n {...mergeProps(tabListProps, collectionProps)}\n ref={listRef}\n data-element=\"TabList\"\n >\n <TabsProvider value={contextValue}>\n {orderedParsedTabs.map((tab, index) => {\n const item = state.collection.getItem(tab.key);\n if (!item) return null;\n\n return (\n <TabButton\n key={item.key}\n item={item}\n tabData={tab}\n isLastTab={index === orderedParsedTabs.length - 1}\n />\n );\n })}\n </TabsProvider>\n {indicatorStyle && (\n <TabIndicatorElement\n mods={{ placement }}\n style={\n orientation === 'vertical'\n ? {\n top: indicatorStyle.start,\n height: indicatorStyle.size,\n }\n : {\n left: indicatorStyle.start,\n width: indicatorStyle.size,\n }\n }\n />\n )}\n </div>\n );\n\n // =========================================================================\n // Mods for styling\n // =========================================================================\n const mods = useMemo(\n () => ({\n type: effectiveType,\n size,\n placement,\n deletable: !!onDelete,\n scrolling: showTinyScrollbar && isScrolling,\n 'fade-start': !isAtStart,\n 'fade-end': !isAtEnd,\n 'has-panels': hasPanels,\n }),\n [\n effectiveType,\n size,\n placement,\n onDelete,\n showTinyScrollbar,\n isScrolling,\n isAtStart,\n isAtEnd,\n hasPanels,\n ],\n );\n\n // =========================================================================\n // Action Elements (TabPicker and Scroll Arrows)\n // =========================================================================\n const scrollArrowsElement = shouldShowScrollArrows ? (\n <>\n <TabsAction\n icon={\n <DirectionIcon to={orientation === 'vertical' ? 'top' : 'left'} />\n }\n aria-label={\n orientation === 'vertical' ? 'Scroll tabs up' : 'Scroll tabs left'\n }\n isDisabled={isAtStart}\n onPress={handleScrollStart}\n />\n <TabsAction\n icon={\n <DirectionIcon to={orientation === 'vertical' ? 'bottom' : 'right'} />\n }\n aria-label={\n orientation === 'vertical' ? 'Scroll tabs down' : 'Scroll tabs right'\n }\n isDisabled={isAtEnd}\n onPress={handleScrollEnd}\n />\n </>\n ) : null;\n\n const tabPickerElement = shouldShowTabPicker ? (\n <TabPicker\n tabs={orderedParsedTabs}\n selectedKey={state.selectedKey}\n size={size}\n type={effectiveType}\n placement={placement}\n isReorderable={isReorderable}\n onSelect={handleTabPickerSelect}\n onDelete={onDelete}\n onReorder={onReorder}\n />\n ) : null;\n\n // Determine which actions go in prefix/suffix\n // In prefix: TabPicker first (left), then scroll arrows (right)\n // In suffix: scroll arrows first (left), then TabPicker (right)\n const prefixHasActions =\n (shouldShowTabPicker && tabPickerPosition === 'prefix') \|\|\n (shouldShowScrollArrows && scrollArrowsPosition === 'prefix');\n\n const suffixHasActions =\n (shouldShowTabPicker && tabPickerPosition === 'suffix') \|\|\n (shouldShowScrollArrows && scrollArrowsPosition === 'suffix');\n\n // Apply the active-axis scrollbar handle vars to the outer wrapper so the\n // `Scrollbar` sub-element can read them via CSS variables.\n const handleStyle = showTinyScrollbar\n ? orientation === 'vertical'\n ? handleVStyle\n : handleHStyle\n : undefined;\n\n // Wrap with TabsProvider so prefix/suffix can access context (size, type, placement).\n // The inner TabsProvider in renderTabListContent will override for tab buttons.\n return (\n <TabsProvider value={baseContextValue}>\n <TabsElement\n ref={ref}\n qa={qa}\n mods={mods}\n styles={combinedStyles}\n style={handleStyle}\n data-size={size}\n >\n <div data-element=\"Bar\">\n {prefix \|\| prefixHasActions ? (\n <div data-element=\"Prefix\">\n {tabPickerPosition === 'prefix' && tabPickerElement}\n {scrollArrowsPosition === 'prefix' && scrollArrowsElement}\n {prefix}\n </div>\n ) : null}\n <div data-element=\"ScrollWrapper\">\n <div ref={scrollRef} data-element=\"Scroll\">\n {isReorderable ? (\n <DraggableTabList\n state={state}\n listRef={listRef}\n orderedKeys={orderedParsedTabs.map((t) => t.key)}\n orientation={orientation}\n onReorder={onReorder}\n >\n {(dragState, dropState, collectionProps) =>\n renderTabListContent(\n createContextValue(dragState, dropState),\n collectionProps,\n )\n }\n </DraggableTabList>\n ) : (\n renderTabListContent(createContextValue())\n )}\n </div>\n {showTinyScrollbar && hasOverflow && (\n <div data-element=\"Scrollbar\" />\n )}\n </div>\n {suffix \|\| suffixHasActions ? (\n <div data-element=\"Suffix\">\n {scrollArrowsPosition === 'suffix' && scrollArrowsElement}\n {tabPickerPosition === 'suffix' && tabPickerElement}\n {suffix}\n </div>\n ) : null}\n </div>\n\n {/ Functional panel rendering with content caching /}\n {renderPanel && (\n <CachedPanelRenderer\n parsedTabs={parsedTabs}\n explicitPanels={explicitPanels}\n state={state}\n renderPanel={renderPanel}\n panelCacheKeys={panelCacheKeys}\n prerender={prerender}\n keepMounted={effectiveKeepMounted}\n visitedKeys={visitedKeysRef.current}\n />\n )}\n\n {/ Static panel rendering (traditional children-based approach) /}\n {!renderPanel &&\n hasAnyContent &&\n parsedTabs.map((tab) => {\n const explicitPanel = explicitPanels.get(tab.key);\n const content = explicitPanel?.content ?? tab.content;\n\n if (content == null) return null;\n\n return (\n <TabPanelRenderer\n key={tab.key}\n tabKey={tab.key}\n state={state}\n content={content}\n prerender={prerender}\n keepMounted={effectiveKeepMounted}\n tabPrerender={explicitPanel?.prerender ?? tab.prerender}\n tabKeepMounted={explicitPanel?.keepMounted ?? tab.keepMounted}\n visitedKeys={visitedKeysRef.current}\n panelStyles={explicitPanel?.styles}\n qa={explicitPanel?.qa}\n qaVal={explicitPanel?.qaVal}\n />\n );\n })}\n </TabsElement>\n </TabsProvider>\n );\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nconst _Tabs = forwardRef(TabsComponent);\n\n/\n Tabs component for organizing content into multiple panels.\n * Built with React Aria for full accessibility support.\n \n Note: Tab keys are internally converted to strings for React Aria compatibility.\n \n @example\n * // Simple usage\n * <Tabs defaultActiveKey=\"tab1\">\n * <Tab key=\"tab1\" title=\"Tab 1\">Content 1</Tab>\n * <Tab key=\"tab2\" title=\"Tab 2\">Content 2</Tab>\n * </Tabs>\n \n @example\n * // Tabs-only (no panels)\n * <Tabs activeKey={activeTab} onChange={setActiveTab}>\n * <Tab key=\"overview\" title=\"Overview\" />\n * <Tab key=\"settings\" title=\"Settings\" />\n * </Tabs>\n \n @example\n * // Explicit panels\n * <Tabs defaultActiveKey=\"tab1\">\n * <Tabs.List>\n * <Tab key=\"tab1\" title=\"Tab 1\" />\n * <Tab key=\"tab2\" title=\"Tab 2\" />\n * </Tabs.List>\n * <Tabs.Panel key=\"tab1\">Content 1</Tabs.Panel>\n * <Tabs.Panel key=\"tab2\">Content 2</Tabs.Panel>\n * </Tabs>\n */\nexport const Tabs = Object.assign(_Tabs, {\n Tab,\n List: TabList,\n Panel: TabPanel,\n Action: TabsAction,\n});\n\nexport { Tab, TabList, TabPanel, TabsAction };\n"],"mappings":"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"}
1	+ {"version":3,"file":"Tabs.js","names":["CollectionItem","mergeProps"],"sources":["../../../../src/components/navigation/Tabs/Tabs.tsx"],"sourcesContent":["import { mergeStyles, OUTER_STYLES } from '@tenphi/tasty';\nimport {\n Children,\n ForwardedRef,\n forwardRef,\n isValidElement,\n ReactElement,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport { AriaTabListProps, useTabList } from 'react-aria';\nimport {\n Item as CollectionItem,\n DraggableCollectionState,\n DroppableCollectionState,\n useTabListState,\n} from 'react-stately';\n\nimport { useEvent, useWarn } from '../../../_internal/hooks';\nimport { DirectionIcon } from '../../../icons/DirectionIcon';\nimport { mergeProps, useMergeStyles } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { ItemAction } from '../../actions/ItemAction/ItemAction';\nimport { useTinyScrollbar } from '../../content/Layout/hooks/useTinyScrollbar';\nimport { useBoardDragActive } from '../../layout/Board/board-context';\n\nimport { DraggableTabList } from './DraggableTabList';\nimport { TabIndicatorElement, TabsElement } from './styled';\nimport { TabButton } from './TabButton';\nimport { CachedPanelRenderer, TabPanelRenderer } from './TabPanel';\nimport { TabPicker } from './TabPicker';\nimport { TabsAction } from './TabsAction';\nimport { TabsContextValue, TabsProvider } from './TabsContext';\nimport { useTabEditing } from './use-tab-editing';\nimport { useTabIndicator } from './use-tab-indicator';\n\nimport type { Key } from '@react-types/shared';\nimport type {\n CubeTabListProps,\n CubeTabPanelProps,\n CubeTabProps,\n CubeTabsProps,\n ParsedPanel,\n ParsedTab,\n} from './types';\n\n// =============================================================================\n// Helper Functions\n// =============================================================================\n\n/*\n Generic helper to check if a child is a specific component by displayName.\n /\nfunction isComponentElement<T>(\n child: ReactNode,\n displayName: string,\n): child is ReactElement<T> {\n return (\n isValidElement(child) &&\n typeof child.type === 'function' &&\n (child.type as any).displayName === displayName\n );\n}\n\n/* Checks if a child is a Tab component. /\nconst isTabElement = (child: ReactNode): child is ReactElement<CubeTabProps> =>\n isComponentElement<CubeTabProps>(child, 'CubeTab');\n\n/* Checks if a child is a TabPanel component. /\nconst isTabPanelElement = (\n child: ReactNode,\n): child is ReactElement<CubeTabPanelProps> =>\n isComponentElement<CubeTabPanelProps>(child, 'CubeTabPanel');\n\n/* Checks if a child is a TabList component. /\nconst isTabListElement = (\n child: ReactNode,\n): child is ReactElement<CubeTabListProps> =>\n isComponentElement<CubeTabListProps>(child, 'CubeTabList');\n\n/\n Extracts the raw key from a React element, stripping the \".$\" prefix\n * that React adds via Children.map/toArray.\n /\nfunction getRawKey(element: ReactElement): string \| null {\n if (element.key == null) return null;\n const keyStr = String(element.key);\n return keyStr.startsWith('.$') ? keyStr.slice(2) : keyStr;\n}\n\n// =============================================================================\n// Tab Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction Tab(_props: CubeTabProps): ReactElement \| null {\n return null;\n}\n\nTab.displayName = 'CubeTab';\n\n/\n Action for a tab's own `actions` slot, where it renders left of the built-in\n * menu trigger and delete button — which are `ItemAction`s themselves.\n \n Not to be confused with `Tabs.Action`, which is an `ItemButton` sized for the\n * tab bar's `prefix` / `suffix` slots rather than for a tab.\n /\nTab.Action = ItemAction;\n\n// =============================================================================\n// TabPanel Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabPanel(_props: CubeTabPanelProps): ReactElement \| null {\n return null;\n}\n\nTabPanel.displayName = 'CubeTabPanel';\n\n// =============================================================================\n// TabList Component (configuration only - not rendered directly)\n// =============================================================================\n\nfunction TabList(_props: CubeTabListProps): ReactElement \| null {\n return null;\n}\n\nTabList.displayName = 'CubeTabList';\n\n// =============================================================================\n// Main Tabs Component\n// =============================================================================\n\nfunction TabsComponent(\n props: CubeTabsProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const {\n label = 'Tabs',\n defaultActiveKey,\n activeKey,\n size,\n type = 'default',\n placement = 'top',\n onChange,\n onDelete,\n onTitleChange,\n autoHideActions,\n isEditable: parentIsEditable,\n menu: parentMenu,\n menuTriggerProps: parentMenuTriggerProps,\n menuProps: parentMenuProps,\n contextMenu: parentContextMenu,\n onAction: parentOnAction,\n children,\n prefix,\n suffix,\n prerender = false,\n keepMounted = false,\n qa = 'Tabs',\n renderPanel,\n panelCacheKeys,\n isReorderable = false,\n keyOrder,\n onReorder,\n showTabPicker = false,\n showScrollArrows = false,\n tabPickerPosition = 'suffix',\n scrollArrowsPosition = 'suffix',\n hideTabListScroll = false,\n tabListPadding,\n barStyles,\n tabListStyles,\n prefixStyles,\n suffixStyles,\n ...otherProps\n } = props;\n\n // Derive orientation from placement\n const orientation: 'horizontal' \| 'vertical' =\n placement === 'left' \|\| placement === 'right' ? 'vertical' : 'horizontal';\n\n // `narrow` only makes sense for a horizontal strip — its whole point is\n // collapsed horizontal padding for a denser row of tabs. Force `default`\n // when the strip is vertical.\n const effectiveType =\n orientation === 'vertical' && type === 'narrow' ? 'default' : type;\n\n // Extract outer styles (these go on the new outer wrapper)\n const baseStyles = extractStyles(otherProps, OUTER_STYLES);\n\n // Build TabList padding style (memoized)\n const tabListPaddingStyles = useMemo(\n () =>\n tabListPadding ? { '$tablist-padding': `${tabListPadding}` } : undefined,\n [tabListPadding],\n );\n\n // Merge tabListPaddingStyles with tabListStyles (memoized)\n const mergedTabListStyles = useMemo(\n () => mergeStyles(tabListPaddingStyles, tabListStyles),\n [tabListPaddingStyles, tabListStyles],\n );\n\n // Merge all sub-element styles into baseStyles. The outer `TabsElement`\n // exposes `Bar`, `Prefix`, `Suffix`, `TabList`, `ScrollWrapper`, `Scroll`,\n // and `Scrollbar` sub-elements (defined in styled.ts).\n const combinedStyles = useMergeStyles(baseStyles, {\n Bar: barStyles,\n TabList: mergedTabListStyles,\n Prefix: prefixStyles,\n Suffix: suffixStyles,\n });\n\n // DOM element refs\n const listRef = useRef<HTMLDivElement>(null);\n const scrollRef = useRef<HTMLDivElement>(null);\n\n // Track visited tabs for keepMounted functionality\n const visitedKeysRef = useRef<Set<string>>(new Set());\n\n // While a Board widget is being dragged (this Tabs sits inside a Board),\n // force panels to stay mounted so a tab a widget is dragged out of - and its\n // board owning the in-flight drag gesture - is not unmounted when the user\n // spring-loads a different tab by hovering it. Always `false` outside a Board.\n const isBoardDragActive = useBoardDragActive();\n const effectiveKeepMounted = keepMounted \|\| isBoardDragActive;\n\n // =========================================================================\n // Tab Title Editing Hook\n // =========================================================================\n const onTitleChangeRaf = useEvent((key: string, newTitle: string) => {\n requestAnimationFrame(() => {\n onTitleChange?.(key, newTitle);\n });\n });\n\n const { editingKey, startEditing, cancelEditing, submitEditing } =\n useTabEditing({\n onChange,\n onTitleChange: onTitleChange ? onTitleChangeRaf : undefined,\n });\n\n // =========================================================================\n // Parse children to extract tabs and explicit panels\n // =========================================================================\n const { parsedTabs, explicitPanels, hasAnyContent } = useMemo(() => {\n const childArray = Children.toArray(children);\n const tabs: ParsedTab[] = [];\n const panels = new Map<string, ParsedPanel>();\n let hasExplicitList = false;\n let tabChildren: ReactNode[] = [];\n\n // Check for explicit Tabs.List / Tabs.Panel structure\n for (const child of childArray) {\n if (isTabListElement(child)) {\n hasExplicitList = true;\n tabChildren = Children.toArray(child.props.children);\n } else if (isTabPanelElement(child)) {\n const key = getRawKey(child as ReactElement);\n\n if (key != null) {\n panels.set(key, {\n key,\n content: child.props.children,\n prerender: child.props.prerender,\n keepMounted: child.props.keepMounted,\n styles: child.props.styles,\n qa: child.props.qa,\n qaVal: child.props.qaVal,\n });\n }\n }\n }\n\n // If no explicit list, use direct Tab children\n if (!hasExplicitList) {\n tabChildren = childArray;\n }\n\n // Parse Tab elements\n let hasContent = panels.size > 0;\n\n for (const child of tabChildren) {\n if (isTabElement(child)) {\n const key = getRawKey(child) ?? child.props.id;\n\n if (key != null) {\n const { id: _id, children: tabContent, ...tabProps } = child.props;\n\n tabs.push({\n ...tabProps,\n key,\n content: tabContent,\n });\n\n if (tabContent != null) {\n hasContent = true;\n }\n }\n }\n }\n\n return {\n parsedTabs: tabs,\n explicitPanels: panels,\n hasAnyContent: hasContent,\n };\n }, [children]);\n\n // Clean up visitedKeys when tabs are removed\n const currentTabKeysSet = useMemo(\n () => new Set(parsedTabs.map((t) => t.key)),\n [parsedTabs],\n );\n\n useEffect(() => {\n for (const key of visitedKeysRef.current) {\n if (!currentTabKeysSet.has(key)) {\n visitedKeysRef.current.delete(key);\n }\n }\n }, [currentTabKeysSet]);\n\n // =========================================================================\n // Order tabs according to keyOrder\n // =========================================================================\n const orderedParsedTabs = useMemo(() => {\n if (!keyOrder \|\| keyOrder.length === 0) {\n return parsedTabs;\n }\n\n const tabMap = new Map<string, ParsedTab>();\n for (const tab of parsedTabs) {\n tabMap.set(tab.key, tab);\n }\n\n const ordered: ParsedTab[] = [];\n for (const key of keyOrder) {\n const tab = tabMap.get(String(key));\n if (tab) {\n ordered.push(tab);\n tabMap.delete(String(key));\n }\n }\n\n // Append any tabs not in keyOrder\n for (const tab of parsedTabs) {\n if (tabMap.has(tab.key)) {\n ordered.push(tab);\n }\n }\n\n return ordered;\n }, [parsedTabs, keyOrder]);\n\n // Create collection items for React Stately\n const collectionItems = useMemo(() => {\n return orderedParsedTabs.map((tab) => (\n <CollectionItem\n key={tab.key}\n textValue={typeof tab.title === 'string' ? tab.title : String(tab.key)}\n >\n {tab.title}\n </CollectionItem>\n ));\n }, [orderedParsedTabs]);\n\n // Determine disabled keys\n const disabledKeys = useMemo(() => {\n return new Set(\n parsedTabs.filter((tab) => tab.isDisabled).map((tab) => tab.key),\n );\n }, [parsedTabs]);\n\n // Handle selection change (converts React Aria's Key to string for our API)\n const handleSelectionChange = useEvent((key: Key) => {\n const keyStr = String(key);\n visitedKeysRef.current.add(keyStr);\n onChange?.(keyStr);\n });\n\n // Convert keys to strings for React Aria compatibility\n const selectedKey = activeKey != null ? String(activeKey) : undefined;\n const defaultSelectedKey =\n defaultActiveKey != null ? String(defaultActiveKey) : undefined;\n\n // Create aria props for useTabListState\n const ariaProps: AriaTabListProps<object> = useMemo(\n () => ({\n selectedKey,\n defaultSelectedKey,\n onSelectionChange: handleSelectionChange,\n disabledKeys,\n children: collectionItems,\n 'aria-label': label,\n orientation,\n }),\n [\n selectedKey,\n defaultSelectedKey,\n handleSelectionChange,\n disabledKeys,\n collectionItems,\n label,\n orientation,\n ],\n );\n\n // Create state using useTabListState\n const state = useTabListState(ariaProps);\n\n // Track initial selected key for visited tabs\n useEffect(() => {\n if (state.selectedKey != null) {\n visitedKeysRef.current.add(String(state.selectedKey));\n }\n }, [state.selectedKey]);\n\n // Get tablist props from react-aria\n const { tabListProps } = useTabList(ariaProps, state, listRef);\n\n // Handle selection from TabPicker (needs to update internal state in uncontrolled mode)\n const handleTabPickerSelect = useEvent((key: string) => {\n // Update internal state (for uncontrolled mode)\n state.setSelectedKey(key);\n // Also call the external onChange handler\n handleSelectionChange(key);\n });\n\n // =========================================================================\n // Tab Indicator (for default type)\n // =========================================================================\n // Create order token that changes when tab order changes (for indicator recalculation)\n const orderToken = useMemo(\n () => orderedParsedTabs.map((t) => t.key).join(','),\n [orderedParsedTabs],\n );\n\n const indicatorStyle = useTabIndicator(\n listRef,\n state.selectedKey,\n effectiveType === 'default' \|\| effectiveType === 'narrow',\n orientation,\n orderToken,\n );\n\n // =========================================================================\n // Tiny Scrollbar (not for radio type)\n // =========================================================================\n const isTinyScrollbar = effectiveType !== 'radio';\n const {\n handleHStyle,\n handleVStyle,\n hasOverflowX,\n hasOverflowY,\n isScrolling,\n isAtStartX,\n isAtEndX,\n isAtStartY,\n isAtEndY,\n } = useTinyScrollbar(scrollRef, isTinyScrollbar);\n const showTinyScrollbar = isTinyScrollbar && !hideTabListScroll;\n\n // Active-axis aggregates (used everywhere downstream so we don't sprinkle\n // orientation checks around).\n const hasOverflow = orientation === 'vertical' ? hasOverflowY : hasOverflowX;\n const isAtStart = orientation === 'vertical' ? isAtStartY : isAtStartX;\n const isAtEnd = orientation === 'vertical' ? isAtEndY : isAtEndX;\n\n const hasPanels = hasAnyContent \|\| !!renderPanel;\n\n // =========================================================================\n // Tab Picker visibility\n // =========================================================================\n useWarn(showTabPicker && effectiveType === 'radio', {\n key: ['tabs-tabpicker-radio-unsupported'],\n args: [\n 'Tabs:',\n '`showTabPicker` is not supported when `type=\"radio\"`. The TabPicker will not be rendered.',\n ],\n });\n\n const shouldShowTabPicker =\n effectiveType !== 'radio' &&\n (showTabPicker === true \|\| (showTabPicker === 'auto' && hasOverflow));\n\n // =========================================================================\n // Scroll Arrows visibility and handlers\n // =========================================================================\n useWarn(showScrollArrows && effectiveType === 'radio', {\n key: ['tabs-scrollarrows-radio-unsupported'],\n args: [\n 'Tabs:',\n '`showScrollArrows` is not supported when `type=\"radio\"`. The scroll arrows will not be rendered.',\n ],\n });\n\n const shouldShowScrollArrows =\n effectiveType !== 'radio' &&\n (showScrollArrows === true \|\| (showScrollArrows === 'auto' && hasOverflow));\n\n const handleScrollStart = useEvent(() => {\n const el = scrollRef.current;\n if (!el) return;\n if (orientation === 'vertical') {\n el.scrollTo({\n top: el.scrollTop - el.clientHeight,\n behavior: 'smooth',\n });\n } else {\n el.scrollTo({\n left: el.scrollLeft - el.clientWidth,\n behavior: 'smooth',\n });\n }\n });\n\n const handleScrollEnd = useEvent(() => {\n const el = scrollRef.current;\n if (!el) return;\n if (orientation === 'vertical') {\n el.scrollTo({\n top: el.scrollTop + el.clientHeight,\n behavior: 'smooth',\n });\n } else {\n el.scrollTo({\n left: el.scrollLeft + el.clientWidth,\n behavior: 'smooth',\n });\n }\n });\n\n // =========================================================================\n // Base Context Value (without drag/drop states)\n // =========================================================================\n const baseContextValue = useMemo(\n () => ({\n state,\n type: effectiveType,\n size,\n placement,\n autoHideActions,\n isEditable: parentIsEditable,\n menu: parentMenu,\n menuTriggerProps: parentMenuTriggerProps,\n menuProps: parentMenuProps,\n contextMenu: parentContextMenu,\n onDelete,\n onAction: parentOnAction,\n editingKey,\n startEditing,\n submitEditing,\n cancelEditing,\n }),\n [\n state,\n effectiveType,\n size,\n placement,\n autoHideActions,\n parentIsEditable,\n parentMenu,\n parentMenuTriggerProps,\n parentMenuProps,\n parentContextMenu,\n onDelete,\n parentOnAction,\n editingKey,\n startEditing,\n submitEditing,\n cancelEditing,\n ],\n );\n\n // Helper to create full context value with optional drag/drop states\n const createContextValue = (\n dragState?: DraggableCollectionState,\n dropState?: DroppableCollectionState,\n ): TabsContextValue => ({\n ...baseContextValue,\n dragState,\n dropState,\n });\n\n // =========================================================================\n // Tab List Content Renderer\n // =========================================================================\n const renderTabListContent = (\n contextValue: TabsContextValue,\n collectionProps: Record<string, unknown> = {},\n ) => (\n <div\n {...mergeProps(tabListProps, collectionProps)}\n ref={listRef}\n data-element=\"TabList\"\n >\n <TabsProvider value={contextValue}>\n {orderedParsedTabs.map((tab, index) => {\n const item = state.collection.getItem(tab.key);\n if (!item) return null;\n\n return (\n <TabButton\n key={item.key}\n item={item}\n tabData={tab}\n isLastTab={index === orderedParsedTabs.length - 1}\n />\n );\n })}\n </TabsProvider>\n {indicatorStyle && (\n <TabIndicatorElement\n mods={{ placement }}\n style={\n orientation === 'vertical'\n ? {\n top: indicatorStyle.start,\n height: indicatorStyle.size,\n }\n : {\n left: indicatorStyle.start,\n width: indicatorStyle.size,\n }\n }\n />\n )}\n </div>\n );\n\n // =========================================================================\n // Mods for styling\n // =========================================================================\n const mods = useMemo(\n () => ({\n type: effectiveType,\n size,\n placement,\n deletable: !!onDelete,\n scrolling: showTinyScrollbar && isScrolling,\n 'fade-start': !isAtStart,\n 'fade-end': !isAtEnd,\n 'has-panels': hasPanels,\n }),\n [\n effectiveType,\n size,\n placement,\n onDelete,\n showTinyScrollbar,\n isScrolling,\n isAtStart,\n isAtEnd,\n hasPanels,\n ],\n );\n\n // =========================================================================\n // Action Elements (TabPicker and Scroll Arrows)\n // =========================================================================\n const scrollArrowsElement = shouldShowScrollArrows ? (\n <>\n <TabsAction\n icon={\n <DirectionIcon to={orientation === 'vertical' ? 'top' : 'left'} />\n }\n aria-label={\n orientation === 'vertical' ? 'Scroll tabs up' : 'Scroll tabs left'\n }\n isDisabled={isAtStart}\n onPress={handleScrollStart}\n />\n <TabsAction\n icon={\n <DirectionIcon to={orientation === 'vertical' ? 'bottom' : 'right'} />\n }\n aria-label={\n orientation === 'vertical' ? 'Scroll tabs down' : 'Scroll tabs right'\n }\n isDisabled={isAtEnd}\n onPress={handleScrollEnd}\n />\n </>\n ) : null;\n\n const tabPickerElement = shouldShowTabPicker ? (\n <TabPicker\n tabs={orderedParsedTabs}\n selectedKey={state.selectedKey}\n size={size}\n type={effectiveType}\n placement={placement}\n isReorderable={isReorderable}\n onSelect={handleTabPickerSelect}\n onDelete={onDelete}\n onReorder={onReorder}\n />\n ) : null;\n\n // Determine which actions go in prefix/suffix\n // In prefix: TabPicker first (left), then scroll arrows (right)\n // In suffix: scroll arrows first (left), then TabPicker (right)\n const prefixHasActions =\n (shouldShowTabPicker && tabPickerPosition === 'prefix') \|\|\n (shouldShowScrollArrows && scrollArrowsPosition === 'prefix');\n\n const suffixHasActions =\n (shouldShowTabPicker && tabPickerPosition === 'suffix') \|\|\n (shouldShowScrollArrows && scrollArrowsPosition === 'suffix');\n\n // Apply the active-axis scrollbar handle vars to the outer wrapper so the\n // `Scrollbar` sub-element can read them via CSS variables.\n const handleStyle = showTinyScrollbar\n ? orientation === 'vertical'\n ? handleVStyle\n : handleHStyle\n : undefined;\n\n // Wrap with TabsProvider so prefix/suffix can access context (size, type, placement).\n // The inner TabsProvider in renderTabListContent will override for tab buttons.\n return (\n <TabsProvider value={baseContextValue}>\n <TabsElement\n ref={ref}\n qa={qa}\n mods={mods}\n styles={combinedStyles}\n style={handleStyle}\n data-size={size}\n >\n <div data-element=\"Bar\">\n {prefix \|\| prefixHasActions ? (\n <div data-element=\"Prefix\">\n {tabPickerPosition === 'prefix' && tabPickerElement}\n {scrollArrowsPosition === 'prefix' && scrollArrowsElement}\n {prefix}\n </div>\n ) : null}\n <div data-element=\"ScrollWrapper\">\n <div ref={scrollRef} data-element=\"Scroll\">\n {isReorderable ? (\n <DraggableTabList\n state={state}\n listRef={listRef}\n orderedKeys={orderedParsedTabs.map((t) => t.key)}\n orientation={orientation}\n onReorder={onReorder}\n >\n {(dragState, dropState, collectionProps) =>\n renderTabListContent(\n createContextValue(dragState, dropState),\n collectionProps,\n )\n }\n </DraggableTabList>\n ) : (\n renderTabListContent(createContextValue())\n )}\n </div>\n {showTinyScrollbar && hasOverflow && (\n <div data-element=\"Scrollbar\" />\n )}\n </div>\n {suffix \|\| suffixHasActions ? (\n <div data-element=\"Suffix\">\n {scrollArrowsPosition === 'suffix' && scrollArrowsElement}\n {tabPickerPosition === 'suffix' && tabPickerElement}\n {suffix}\n </div>\n ) : null}\n </div>\n\n {/ Functional panel rendering with content caching /}\n {renderPanel && (\n <CachedPanelRenderer\n parsedTabs={parsedTabs}\n explicitPanels={explicitPanels}\n state={state}\n renderPanel={renderPanel}\n panelCacheKeys={panelCacheKeys}\n prerender={prerender}\n keepMounted={effectiveKeepMounted}\n visitedKeys={visitedKeysRef.current}\n />\n )}\n\n {/ Static panel rendering (traditional children-based approach) /}\n {!renderPanel &&\n hasAnyContent &&\n parsedTabs.map((tab) => {\n const explicitPanel = explicitPanels.get(tab.key);\n const content = explicitPanel?.content ?? tab.content;\n\n if (content == null) return null;\n\n return (\n <TabPanelRenderer\n key={tab.key}\n tabKey={tab.key}\n state={state}\n content={content}\n prerender={prerender}\n keepMounted={effectiveKeepMounted}\n tabPrerender={explicitPanel?.prerender ?? tab.prerender}\n tabKeepMounted={explicitPanel?.keepMounted ?? tab.keepMounted}\n visitedKeys={visitedKeysRef.current}\n panelStyles={explicitPanel?.styles}\n qa={explicitPanel?.qa}\n qaVal={explicitPanel?.qaVal}\n />\n );\n })}\n </TabsElement>\n </TabsProvider>\n );\n}\n\n// =============================================================================\n// Exports\n// =============================================================================\n\nconst _Tabs = forwardRef(TabsComponent);\n\n/\n Tabs component for organizing content into multiple panels.\n * Built with React Aria for full accessibility support.\n \n Note: Tab keys are internally converted to strings for React Aria compatibility.\n \n @example\n * // Simple usage\n * <Tabs defaultActiveKey=\"tab1\">\n * <Tab key=\"tab1\" title=\"Tab 1\">Content 1</Tab>\n * <Tab key=\"tab2\" title=\"Tab 2\">Content 2</Tab>\n * </Tabs>\n \n @example\n * // Tabs-only (no panels)\n * <Tabs activeKey={activeTab} onChange={setActiveTab}>\n * <Tab key=\"overview\" title=\"Overview\" />\n * <Tab key=\"settings\" title=\"Settings\" />\n * </Tabs>\n \n @example\n * // Explicit panels\n * <Tabs defaultActiveKey=\"tab1\">\n * <Tabs.List>\n * <Tab key=\"tab1\" title=\"Tab 1\" />\n * <Tab key=\"tab2\" title=\"Tab 2\" />\n * </Tabs.List>\n * <Tabs.Panel key=\"tab1\">Content 1</Tabs.Panel>\n * <Tabs.Panel key=\"tab2\">Content 2</Tabs.Panel>\n * </Tabs>\n */\nexport const Tabs = Object.assign(_Tabs, {\n Tab,\n List: TabList,\n Panel: TabPanel,\n Action: TabsAction,\n});\n\nexport { Tab, TabList, TabPanel, TabsAction };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDA,SAAS,mBACP,OACA,aAC0B;AAC1B,QACE,eAAe,MAAM,IACrB,OAAO,MAAM,SAAS,cACrB,MAAM,KAAa,gBAAgB;;;AAKxC,MAAM,gBAAgB,UACpB,mBAAiC,OAAO,UAAU;;AAGpD,MAAM,qBACJ,UAEA,mBAAsC,OAAO,eAAe;;AAG9D,MAAM,oBACJ,UAEA,mBAAqC,OAAO,cAAc;;;;;AAM5D,SAAS,UAAU,SAAsC;AACvD,KAAI,QAAQ,OAAO,KAAM,QAAO;CAChC,MAAM,SAAS,OAAO,QAAQ,IAAI;AAClC,QAAO,OAAO,WAAW,KAAK,GAAG,OAAO,MAAM,EAAE,GAAG;;AAOrD,SAAS,IAAI,QAA2C;AACtD,QAAO;;AAGT,IAAI,cAAc;;;;;;;;AASlB,IAAI,SAAS;AAMb,SAAS,SAAS,QAAgD;AAChE,QAAO;;AAGT,SAAS,cAAc;AAMvB,SAAS,QAAQ,QAA+C;AAC9D,QAAO;;AAGT,QAAQ,cAAc;AAMtB,SAAS,cACP,OACA,KACA;CACA,MAAM,EACJ,QAAQ,QACR,kBACA,WACA,MACA,OAAO,WACP,YAAY,OACZ,UACA,UACA,eACA,iBACA,YAAY,kBACZ,MAAM,YACN,kBAAkB,wBAClB,WAAW,iBACX,aAAa,mBACb,UAAU,gBACV,UACA,QACA,QACA,YAAY,OACZ,cAAc,OACd,KAAK,QACL,aACA,gBACA,gBAAgB,OAChB,UACA,WACA,gBAAgB,OAChB,mBAAmB,OACnB,oBAAoB,UACpB,uBAAuB,UACvB,oBAAoB,OACpB,gBACA,WACA,eACA,cACA,cACA,GAAG,eACD;CAGJ,MAAM,cACJ,cAAc,UAAU,cAAc,UAAU,aAAa;CAK/D,MAAM,gBACJ,gBAAgB,cAAc,SAAS,WAAW,YAAY;CAGhE,MAAM,aAAa,cAAc,YAAY,aAAa;CAG1D,MAAM,uBAAuB,cAEzB,iBAAiB,EAAE,oBAAoB,GAAG,kBAAkB,GAAG,QACjE,CAAC,eAAe,CACjB;CAWD,MAAM,iBAAiB,eAAe,YAAY;EAChD,KAAK;EACL,SAV0B,cACpB,YAAY,sBAAsB,cAAc,EACtD,CAAC,sBAAsB,cAAc,CACtC;EAQC,QAAQ;EACR,QAAQ;EACT,CAAC;CAGF,MAAM,UAAU,OAAuB,KAAK;CAC5C,MAAM,YAAY,OAAuB,KAAK;CAG9C,MAAM,iBAAiB,uBAAoB,IAAI,KAAK,CAAC;CAMrD,MAAM,oBAAoB,oBAAoB;CAC9C,MAAM,uBAAuB,eAAe;CAK5C,MAAM,mBAAmB,UAAU,KAAa,aAAqB;AACnE,8BAA4B;AAC1B,mBAAgB,KAAK,SAAS;IAC9B;GACF;CAEF,MAAM,EAAE,YAAY,cAAc,eAAe,kBAC/C,cAAc;EACZ;EACA,eAAe,gBAAgB,mBAAmB;EACnD,CAAC;CAKJ,MAAM,EAAE,YAAY,gBAAgB,kBAAkB,cAAc;EAClE,MAAM,aAAa,SAAS,QAAQ,SAAS;EAC7C,MAAM,OAAoB,EAAE;EAC5B,MAAM,yBAAS,IAAI,KAA0B;EAC7C,IAAI,kBAAkB;EACtB,IAAI,cAA2B,EAAE;AAGjC,OAAK,MAAM,SAAS,WAClB,KAAI,iBAAiB,MAAM,EAAE;AAC3B,qBAAkB;AAClB,iBAAc,SAAS,QAAQ,MAAM,MAAM,SAAS;aAC3C,kBAAkB,MAAM,EAAE;GACnC,MAAM,MAAM,UAAU,MAAsB;AAE5C,OAAI,OAAO,KACT,QAAO,IAAI,KAAK;IACd;IACA,SAAS,MAAM,MAAM;IACrB,WAAW,MAAM,MAAM;IACvB,aAAa,MAAM,MAAM;IACzB,QAAQ,MAAM,MAAM;IACpB,IAAI,MAAM,MAAM;IAChB,OAAO,MAAM,MAAM;IACpB,CAAC;;AAMR,MAAI,CAAC,gBACH,eAAc;EAIhB,IAAI,aAAa,OAAO,OAAO;AAE/B,OAAK,MAAM,SAAS,YAClB,KAAI,aAAa,MAAM,EAAE;GACvB,MAAM,MAAM,UAAU,MAAM,IAAI,MAAM,MAAM;AAE5C,OAAI,OAAO,MAAM;IACf,MAAM,EAAE,IAAI,KAAK,UAAU,YAAY,GAAG,aAAa,MAAM;AAE7D,SAAK,KAAK;KACR,GAAG;KACH;KACA,SAAS;KACV,CAAC;AAEF,QAAI,cAAc,KAChB,cAAa;;;AAMrB,SAAO;GACL,YAAY;GACZ,gBAAgB;GAChB,eAAe;GAChB;IACA,CAAC,SAAS,CAAC;CAGd,MAAM,oBAAoB,cAClB,IAAI,IAAI,WAAW,KAAK,MAAM,EAAE,IAAI,CAAC,EAC3C,CAAC,WAAW,CACb;AAED,iBAAgB;AACd,OAAK,MAAM,OAAO,eAAe,QAC/B,KAAI,CAAC,kBAAkB,IAAI,IAAI,CAC7B,gBAAe,QAAQ,OAAO,IAAI;IAGrC,CAAC,kBAAkB,CAAC;CAKvB,MAAM,oBAAoB,cAAc;AACtC,MAAI,CAAC,YAAY,SAAS,WAAW,EACnC,QAAO;EAGT,MAAM,yBAAS,IAAI,KAAwB;AAC3C,OAAK,MAAM,OAAO,WAChB,QAAO,IAAI,IAAI,KAAK,IAAI;EAG1B,MAAM,UAAuB,EAAE;AAC/B,OAAK,MAAM,OAAO,UAAU;GAC1B,MAAM,MAAM,OAAO,IAAI,OAAO,IAAI,CAAC;AACnC,OAAI,KAAK;AACP,YAAQ,KAAK,IAAI;AACjB,WAAO,OAAO,OAAO,IAAI,CAAC;;;AAK9B,OAAK,MAAM,OAAO,WAChB,KAAI,OAAO,IAAI,IAAI,IAAI,CACrB,SAAQ,KAAK,IAAI;AAIrB,SAAO;IACN,CAAC,YAAY,SAAS,CAAC;CAG1B,MAAM,kBAAkB,cAAc;AACpC,SAAO,kBAAkB,KAAK,QAC5B,oBAACA;GAEC,WAAW,OAAO,IAAI,UAAU,WAAW,IAAI,QAAQ,OAAO,IAAI,IAAI;aAErE,IAAI;KAHA,IAAI,IAIM,CACjB;IACD,CAAC,kBAAkB,CAAC;CAGvB,MAAM,eAAe,cAAc;AACjC,SAAO,IAAI,IACT,WAAW,QAAQ,QAAQ,IAAI,WAAW,CAAC,KAAK,QAAQ,IAAI,IAAI,CACjE;IACA,CAAC,WAAW,CAAC;CAGhB,MAAM,wBAAwB,UAAU,QAAa;EACnD,MAAM,SAAS,OAAO,IAAI;AAC1B,iBAAe,QAAQ,IAAI,OAAO;AAClC,aAAW,OAAO;GAClB;CAGF,MAAM,cAAc,aAAa,OAAO,OAAO,UAAU,GAAG;CAC5D,MAAM,qBACJ,oBAAoB,OAAO,OAAO,iBAAiB,GAAG;CAGxD,MAAM,YAAsC,eACnC;EACL;EACA;EACA,mBAAmB;EACnB;EACA,UAAU;EACV,cAAc;EACd;EACD,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAGD,MAAM,QAAQ,gBAAgB,UAAU;AAGxC,iBAAgB;AACd,MAAI,MAAM,eAAe,KACvB,gBAAe,QAAQ,IAAI,OAAO,MAAM,YAAY,CAAC;IAEtD,CAAC,MAAM,YAAY,CAAC;CAGvB,MAAM,EAAE,iBAAiB,WAAW,WAAW,OAAO,QAAQ;CAG9D,MAAM,wBAAwB,UAAU,QAAgB;AAEtD,QAAM,eAAe,IAAI;AAEzB,wBAAsB,IAAI;GAC1B;CAMF,MAAM,aAAa,cACX,kBAAkB,KAAK,MAAM,EAAE,IAAI,CAAC,KAAK,IAAI,EACnD,CAAC,kBAAkB,CACpB;CAED,MAAM,iBAAiB,gBACrB,SACA,MAAM,aACN,kBAAkB,aAAa,kBAAkB,UACjD,aACA,WACD;CAKD,MAAM,kBAAkB,kBAAkB;CAC1C,MAAM,EACJ,cACA,cACA,cACA,cACA,aACA,YACA,UACA,YACA,aACE,iBAAiB,WAAW,gBAAgB;CAChD,MAAM,oBAAoB,mBAAmB,CAAC;CAI9C,MAAM,cAAc,gBAAgB,aAAa,eAAe;CAChE,MAAM,YAAY,gBAAgB,aAAa,aAAa;CAC5D,MAAM,UAAU,gBAAgB,aAAa,WAAW;CAExD,MAAM,YAAY,iBAAiB,CAAC,CAAC;AAKrC,SAAQ,iBAAiB,kBAAkB,SAAS;EAClD,KAAK,CAAC,mCAAmC;EACzC,MAAM,CACJ,SACA,8FACD;EACF,CAAC;CAEF,MAAM,sBACJ,kBAAkB,YACjB,kBAAkB,QAAS,kBAAkB,UAAU;AAK1D,SAAQ,oBAAoB,kBAAkB,SAAS;EACrD,KAAK,CAAC,sCAAsC;EAC5C,MAAM,CACJ,SACA,qGACD;EACF,CAAC;CAEF,MAAM,yBACJ,kBAAkB,YACjB,qBAAqB,QAAS,qBAAqB,UAAU;CAEhE,MAAM,oBAAoB,eAAe;EACvC,MAAM,KAAK,UAAU;AACrB,MAAI,CAAC,GAAI;AACT,MAAI,gBAAgB,WAClB,IAAG,SAAS;GACV,KAAK,GAAG,YAAY,GAAG;GACvB,UAAU;GACX,CAAC;MAEF,IAAG,SAAS;GACV,MAAM,GAAG,aAAa,GAAG;GACzB,UAAU;GACX,CAAC;GAEJ;CAEF,MAAM,kBAAkB,eAAe;EACrC,MAAM,KAAK,UAAU;AACrB,MAAI,CAAC,GAAI;AACT,MAAI,gBAAgB,WAClB,IAAG,SAAS;GACV,KAAK,GAAG,YAAY,GAAG;GACvB,UAAU;GACX,CAAC;MAEF,IAAG,SAAS;GACV,MAAM,GAAG,aAAa,GAAG;GACzB,UAAU;GACX,CAAC;GAEJ;CAKF,MAAM,mBAAmB,eAChB;EACL;EACA,MAAM;EACN;EACA;EACA;EACA,YAAY;EACZ,MAAM;EACN,kBAAkB;EAClB,WAAW;EACX,aAAa;EACb;EACA,UAAU;EACV;EACA;EACA;EACA;EACD,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAGD,MAAM,sBACJ,WACA,eACsB;EACtB,GAAG;EACH;EACA;EACD;CAKD,MAAM,wBACJ,cACA,kBAA2C,EAAE,KAE7C,qBAAC;EACC,GAAIC,aAAW,cAAc,gBAAgB;EAC7C,KAAK;EACL,gBAAa;aAEb,oBAAC;GAAa,OAAO;aAClB,kBAAkB,KAAK,KAAK,UAAU;IACrC,MAAM,OAAO,MAAM,WAAW,QAAQ,IAAI,IAAI;AAC9C,QAAI,CAAC,KAAM,QAAO;AAElB,WACE,oBAAC;KAEO;KACN,SAAS;KACT,WAAW,UAAU,kBAAkB,SAAS;OAH3C,KAAK,IAIV;KAEJ;IACW,EACd,kBACC,oBAAC;GACC,MAAM,EAAE,WAAW;GACnB,OACE,gBAAgB,aACZ;IACE,KAAK,eAAe;IACpB,QAAQ,eAAe;IACxB,GACD;IACE,MAAM,eAAe;IACrB,OAAO,eAAe;IACvB;IAEP;GAEA;CAMR,MAAM,OAAO,eACJ;EACL,MAAM;EACN;EACA;EACA,WAAW,CAAC,CAAC;EACb,WAAW,qBAAqB;EAChC,cAAc,CAAC;EACf,YAAY,CAAC;EACb,cAAc;EACf,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAKD,MAAM,sBAAsB,yBAC1B,8CACE,oBAAC;EACC,MACE,oBAAC,iBAAc,IAAI,gBAAgB,aAAa,QAAQ,SAAU;EAEpE,cACE,gBAAgB,aAAa,mBAAmB;EAElD,YAAY;EACZ,SAAS;GACT,EACF,oBAAC;EACC,MACE,oBAAC,iBAAc,IAAI,gBAAgB,aAAa,WAAW,UAAW;EAExE,cACE,gBAAgB,aAAa,qBAAqB;EAEpD,YAAY;EACZ,SAAS;GACT,IACD,GACD;CAEJ,MAAM,mBAAmB,sBACvB,oBAAC;EACC,MAAM;EACN,aAAa,MAAM;EACb;EACN,MAAM;EACK;EACI;EACf,UAAU;EACA;EACC;GACX,GACA;CAKJ,MAAM,mBACH,uBAAuB,sBAAsB,YAC7C,0BAA0B,yBAAyB;CAEtD,MAAM,mBACH,uBAAuB,sBAAsB,YAC7C,0BAA0B,yBAAyB;AAYtD,QACE,oBAAC;EAAa,OAAO;YACnB,qBAAC;GACM;GACD;GACE;GACN,QAAQ;GACR,OAfc,oBAChB,gBAAgB,aACd,eACA,eACF;GAYE,aAAW;;IAEX,qBAAC;KAAI,gBAAa;;MACf,UAAU,mBACT,qBAAC;OAAI,gBAAa;;QACf,sBAAsB,YAAY;QAClC,yBAAyB,YAAY;QACrC;;QACG,GACJ;MACJ,qBAAC;OAAI,gBAAa;kBAChB,oBAAC;QAAI,KAAK;QAAW,gBAAa;kBAC/B,gBACC,oBAAC;SACQ;SACE;SACT,aAAa,kBAAkB,KAAK,MAAM,EAAE,IAAI;SACnC;SACF;oBAET,WAAW,WAAW,oBACtB,qBACE,mBAAmB,WAAW,UAAU,EACxC,gBACD;UAEc,GAEnB,qBAAqB,oBAAoB,CAAC;SAExC,EACL,qBAAqB,eACpB,oBAAC,SAAI,gBAAa,cAAc;QAE9B;MACL,UAAU,mBACT,qBAAC;OAAI,gBAAa;;QACf,yBAAyB,YAAY;QACrC,sBAAsB,YAAY;QAClC;;QACG,GACJ;;MACA;IAGL,eACC,oBAAC;KACa;KACI;KACT;KACM;KACG;KACL;KACX,aAAa;KACb,aAAa,eAAe;MAC5B;IAIH,CAAC,eACA,iBACA,WAAW,KAAK,QAAQ;KACtB,MAAM,gBAAgB,eAAe,IAAI,IAAI,IAAI;KACjD,MAAM,UAAU,eAAe,WAAW,IAAI;AAE9C,SAAI,WAAW,KAAM,QAAO;AAE5B,YACE,oBAAC;MAEC,QAAQ,IAAI;MACL;MACE;MACE;MACX,aAAa;MACb,cAAc,eAAe,aAAa,IAAI;MAC9C,gBAAgB,eAAe,eAAe,IAAI;MAClD,aAAa,eAAe;MAC5B,aAAa,eAAe;MAC5B,IAAI,eAAe;MACnB,OAAO,eAAe;QAXjB,IAAI,IAYT;MAEJ;;IACQ;GACD;;AAQnB,MAAM,QAAQ,WAAW,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCvC,MAAa,OAAO,OAAO,OAAO,OAAO;CACvC;CACA,MAAM;CACN,OAAO;CACP,QAAQ;CACT,CAAC"}

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

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

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.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/styled.js CHANGED Viewed

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

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { useCallback, useState } from "react";
 //#region src/components/navigation/Tabs/use-tab-editing.ts

package/dist/components/navigation/Tabs/use-tab-indicator.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { chainRaf } from "../../../utils/raf.js";
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";

package/dist/components/organisms/StatsCard/StatsCard.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { _Text } from "../../content/Text.js";
 import { _Title } from "../../content/Title.js";
 import { Card } from "../../content/Card/Card.js";

package/dist/components/other/Calendar/Calendar.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { useProviderProps } from "../../../provider.js";
 import { CalendarPanel } from "./CalendarPanel.js";
 import { forwardRef, useImperativeHandle, useRef } from "react";

package/dist/components/other/Calendar/CalendarCell.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { CALENDAR_CELL_STYLES } from "./styled.js";
 import { tasty } from "@tenphi/tasty";
 import { useRef } from "react";

package/dist/components/other/Calendar/CalendarGrid.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { getWeekNumber } from "../../fields/DatePicker/period.js";
 import { CalendarCell } from "./CalendarCell.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/other/Calendar/CalendarHeader.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { _Title } from "../../content/Title.js";
 import { Space } from "../../layout/Space.js";
 import { RightIcon } from "../../../icons/RightIcon.js";

package/dist/components/other/Calendar/CalendarPanel.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { CalendarElement } from "./styled.js";

package/dist/components/other/Calendar/PeriodCalendar.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { useProviderProps } from "../../../provider.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { getQuarter } from "../../fields/DatePicker/period.js";

package/dist/components/other/Calendar/PeriodGrid.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { CALENDAR_CELL_STYLES } from "./styled.js";
 import { tasty } from "@tenphi/tasty";
 import { useLayoutEffect, useRef } from "react";

package/dist/components/other/Calendar/RangeCalendar.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { useProviderProps } from "../../../provider.js";
 import { CalendarPanel } from "./CalendarPanel.js";
 import { forwardRef, useImperativeHandle, useRef } from "react";

package/dist/components/other/Calendar/styled.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 //#region src/components/other/Calendar/styled.tsx

package/dist/components/other/CubeLogo/CubeLogo.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { Icon } from "../../../icons/Icon.js";
 import { mergeStyles, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/other/NoDataIcon/NoDataIcon.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { wrapIcon } from "../../../icons/wrap-icon.js";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/overlays/AlertDialog/AlertDialog.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { Paragraph } from "../../content/Paragraph.js";
 import { _Title } from "../../content/Title.js";

package/dist/components/overlays/AlertDialog/AlertDialogApiProvider.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { AlertDialogZone } from "./AlertDialogZone.js";
 import { createContext, useContext, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/overlays/AlertDialog/AlertDialogZone.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { Portal } from "../../portal/Portal.js";
 import { DialogContainer } from "../Dialog/DialogContainer.js";
 import { _AlertDialog } from "./AlertDialog.js";

package/dist/components/overlays/Dialog/Dialog.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { SlotProvider } from "../../../utils/react/Slots.js";

package/dist/components/overlays/Dialog/DialogContainer.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { _Modal } from "../Modal/Modal.js";
 import { DialogContext } from "./context.js";
 import { Children, isValidElement, useRef } from "react";

package/dist/components/overlays/Dialog/DialogForm.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { _Title } from "../../content/Title.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { ButtonGroup } from "../../actions/ButtonGroup/ButtonGroup.js";

package/dist/components/overlays/Dialog/DialogTrigger.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
@@ -150,9 +150,9 @@ function PopoverTrigger(allProps) {
 		ref: targetRef ? void 0 : triggerRef
 	};
 	const resolveShouldCloseOnInteractOutside = useEvent((el) => {
+		if (shouldCloseOnInteractOutside && !shouldCloseOnInteractOutside(el)) return false;
 		const popoverTriggerEl = el.closest("[data-popover-trigger]");
 		if (!popoverTriggerEl) {
-			if (shouldCloseOnInteractOutside && !shouldCloseOnInteractOutside(el)) return false;
 			if (el.closest("[data-popover-keep]")) return false;
 			if (el.closest("[data-popover-dismiss]")) {
 				setTimeout(() => state.close(), 0);

package/dist/components/overlays/Dialog/DialogTrigger.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogTrigger.js","names":["Modal","Tray","Popover"],"sources":["../../../../src/components/overlays/Dialog/DialogTrigger.tsx"],"sourcesContent":["import { PressResponder } from '@react-aria/interactions';\nimport { useMediaQuery } from '@react-spectrum/utils';\nimport { Styles } from '@tenphi/tasty';\nimport {\n Fragment,\n ReactElement,\n RefObject,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport {\n OverlayTriggerProps,\n Placement,\n PositionProps,\n useOverlayPosition,\n useOverlayTrigger,\n} from 'react-aria';\nimport { OverlayTriggerState, useOverlayTriggerState } from 'react-stately';\n\nimport { useEvent } from '../../../_internal';\nimport { generateRandomId } from '../../../utils/random';\nimport { useCombinedRefs, useLayoutEffect } from '../../../utils/react/index';\nimport { usePopoverSync } from '../../../utils/react/usePopoverSync';\nimport { Modal, Popover, Tray, WithCloseBehavior } from '../Modal';\n\nimport { DialogContext } from './context';\n\nexport type CubeDialogClose = (close: () => void) => ReactElement;\n\nexport interface CubeDialogTriggerProps\n extends OverlayTriggerProps,\n PositionProps,\n WithCloseBehavior {\n /** The Dialog and its trigger element. See the DialogTrigger [Content section](#content) for more information on what to provide as children. /\n children: [\n ReactElement \| ((state: OverlayTriggerState) => ReactElement),\n CubeDialogClose \| ReactElement,\n ];\n /\n The type of Dialog that should be rendered. See the DialogTrigger [types section](#dialog-types) for an explanation on each.\n * @default 'modal'\n /\n type?:\n \| 'modal'\n \| 'popover'\n \| 'tray'\n \| 'fullscreen'\n \| 'fullscreenTakeover'\n \| 'panel';\n /* The type of Dialog that should be rendered when on a mobile device. See DialogTrigger [types section](#dialog-types) for an explanation on each. /\n mobileType?:\n \| 'modal'\n \| 'tray'\n \| 'fullscreen'\n \| 'fullscreenTakeover'\n \| 'panel'\n \| 'popover';\n placement?: Placement;\n /\n Whether a popover type Dialog's arrow should be hidden.\n /\n hideArrow?: boolean;\n /* The ref of the element the Dialog should visually attach itself to. Defaults to the trigger button if not defined. /\n targetRef?: RefObject<HTMLElement \| null>;\n /* Whether a modal type Dialog should be dismissable. /\n isDismissable?: boolean;\n /* Whether pressing the escape key to close the dialog should be disabled. /\n isKeyboardDismissDisabled?: boolean;\n /* The screen breakpoint for the mobile type /\n mobileViewport?: number;\n /* The style map for the overlay /\n styles?: Styles;\n shouldCloseOnInteractOutside?: (element: Element) => boolean;\n onDismiss?: (action?: string) => void;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n defaultOpen?: boolean;\n shouldFlip?: boolean;\n shouldUpdatePosition?: boolean;\n / Minimum padding in pixels between the popover and viewport edges /\n containerPadding?: number;\n /\n Whether focus returns to the trigger when the dialog closes. Defaults to\n * `true`.\n \n The restore is skipped automatically whenever the action that closed the\n * dialog has already moved focus somewhere else, so an action that opens a\n * panel/dialog/inline editor and focuses it needs nothing here. Pass `false`\n * for the remaining case: a surface that claims focus later than the\n * dialog's own restore (after an async load, an entry animation, or a\n * `requestAnimationFrame`), where the trigger would otherwise take focus\n * first and produce a visible flash.\n /\n shouldRestoreFocus?: boolean;\n}\n\n/\n DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the Dialog's\n * open state with the trigger's press state. Additionally, it allows you to customize the type and\n * positioning of the Dialog.\n */\nexport function DialogTrigger(props: CubeDialogTriggerProps) {\n let {\n children,\n type = 'modal',\n mobileType = type,\n hideArrow,\n targetRef,\n onDismiss,\n isDismissable = true,\n isKeyboardDismissDisabled,\n styles,\n mobileViewport = 700,\n hideOnClose,\n shouldCloseOnInteractOutside,\n shouldRestoreFocus = true,\n ...positionProps\n } = props;\n\n if (!Array.isArray(children) \|\| children.length > 2) {\n throw new Error('DialogTrigger must have exactly 2 children');\n }\n // if a function is passed as the second child, it won't appear in toArray\n let [trigger, content] = children;\n\n // On small devices, show a modal or tray instead of a popover.\n let isMobile = useMediaQuery(`(max-width: ${mobileViewport}px)`);\n if (isMobile) {\n // handle cases where desktop popovers need a close button for the mobile modal view\n if (type !== 'modal' && mobileType === 'modal') {\n isDismissable = true;\n }\n\n type = mobileType;\n }\n\n let state = useOverlayTriggerState(props);\n\n if (typeof trigger === 'function') {\n trigger = trigger(state);\n }\n\n let wasOpen = useRef(false);\n let isExiting = useRef(false);\n let onExiting = () => (isExiting.current = true);\n let onExited = () => (isExiting.current = false);\n\n wasOpen.current = state.isOpen;\n\n // Shared identity + refs for `usePopoverSync`. Allocating here (rather than\n // inside the branch-specific sub-trees) keeps a single sync registration for\n // the lifetime of the trigger, even when `type` flips between popover and\n // modal at the mobile breakpoint. The refs are then threaded into the\n // appropriate branch so existing positioning / useOverlayTrigger hooks keep\n // their original ref targets and `usePopoverSync`'s `contains()` check has a\n // real DOM node to query.\n const dialogSyncId = useMemo(() => generateRandomId(), []);\n const syncTriggerRef = useRef<HTMLElement \| null>(null);\n const syncOverlayRef = useRef<HTMLElement \| null>(null);\n\n // Only popover-type Dialogs participate in the \"press inside dismisses\n // me\" / \"peer popover opening dismisses me\" behaviours: modals, trays,\n // fullscreen and panel Dialogs are persistent workspaces and must not be\n // yanked closed via the EventBus (which would bypass `isDismissable` and\n // call `state.close()` directly). Non-popover types DO still EMIT\n // `popover:open`, so opening a modal correctly dismisses peer popovers.\n const isPopoverFlavored = type === 'popover';\n usePopoverSync({\n menuId: dialogSyncId,\n isOpen: state.isOpen,\n onClose: () => state.close(),\n triggerRef: syncTriggerRef,\n containerRef: syncOverlayRef,\n dismissOnInnerButtonPress: isPopoverFlavored,\n closeOnPeerOpen: isPopoverFlavored,\n });\n\n useEffect(() => {\n return () => {\n if (\n (wasOpen.current \|\| isExiting.current) &&\n type !== 'popover' &&\n type !== 'tray'\n ) {\n console.warn(\n 'CubeUIKit: A DialogTrigger unmounted while open. This is likely due to being placed within a trigger that unmounts or inside a conditional. Consider using a DialogContainer instead.',\n );\n }\n };\n }, []);\n\n function onClose(action) {\n if (isDismissable) {\n onDismiss && onDismiss(action);\n state.close();\n }\n }\n\n if (type === 'popover') {\n return (\n <PopoverTrigger\n {...positionProps}\n hideOnClose={hideOnClose}\n state={state}\n styles={styles}\n targetRef={targetRef}\n trigger={trigger}\n content={content}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n hideArrow={hideArrow}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}\n shouldRestoreFocus={shouldRestoreFocus}\n syncTriggerRef={syncTriggerRef}\n syncOverlayRef={syncOverlayRef}\n triggerType={type}\n onClose={onClose}\n />\n );\n }\n\n let renderOverlay = () => {\n switch (type) {\n case 'panel':\n case 'fullscreen':\n case 'fullscreenTakeover':\n case 'modal':\n return (\n <Modal\n ref={syncOverlayRef}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n isDismissable={isDismissable}\n type={type}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n styles={styles}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}\n onClose={onClose}\n onExiting={onExiting}\n onExited={onExited}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Modal>\n );\n case 'tray':\n return (\n <Tray\n ref={syncOverlayRef}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n styles={styles}\n onClose={onClose}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Tray>\n );\n }\n };\n\n return (\n <DialogTriggerBase\n type={type}\n state={state}\n isDismissable={isDismissable}\n trigger={trigger}\n overlay={renderOverlay()}\n hideOnClose={hideOnClose}\n syncTriggerRef={syncTriggerRef}\n overlayRef={syncOverlayRef}\n shouldRestoreFocus={shouldRestoreFocus}\n onClose={onClose}\n />\n );\n}\n\nfunction PopoverTrigger(allProps) {\n let {\n state,\n styles,\n targetRef,\n trigger,\n content,\n hideArrow,\n onClose,\n isKeyboardDismissDisabled,\n hideOnClose,\n shouldCloseOnInteractOutside,\n shouldRestoreFocus,\n keepOpenOnScroll,\n syncTriggerRef,\n syncOverlayRef,\n triggerType,\n ...props\n } = allProps;\n\n let triggerRef = useRef<HTMLButtonElement>(null);\n let overlayRef = useRef<HTMLDivElement>(null);\n\n // Mirror the trigger/overlay DOM nodes into the parent-owned sync refs.\n //\n // We deliberately do NOT use `useCombinedRefs` here: that hook returns a\n // brand new internal ref and propagates to the passed refs via a regular\n // `useEffect` (post-commit). `useOverlayPosition` below reads\n // `triggerRef.current` in its own layout effect during the SAME commit, so\n // if `triggerRef` only receives the DOM node via a delayed effect, the\n // first measurement sees `null` and the popover positions at the document\n // origin until something forces a re-measure.\n //\n // Keeping `triggerRef`/`overlayRef` as the direct React refs preserves\n // synchronous assignment for `useOverlayPosition`. The sync refs are only\n // ever read inside `popover:open` handlers, which fire via setTimeout(0),\n // so a layout-effect mirror is more than fast enough.\n useLayoutEffect(() => {\n if (syncTriggerRef) {\n syncTriggerRef.current = targetRef?.current ?? triggerRef.current ?? null;\n }\n if (syncOverlayRef) {\n syncOverlayRef.current = overlayRef.current ?? null;\n }\n });\n\n let {\n overlayProps: popoverProps,\n placement,\n arrowProps,\n updatePosition,\n } = useOverlayPosition({\n targetRef: targetRef \|\| triggerRef,\n overlayRef: overlayRef,\n placement: props.placement,\n containerPadding: props.containerPadding,\n offset: props.offset \|\| 8,\n crossOffset: props.crossOffset,\n shouldFlip: props.shouldFlip,\n shouldUpdatePosition: props.shouldUpdatePosition,\n isOpen: state.isOpen,\n });\n\n let overlayTriggerState = state;\n\n if (keepOpenOnScroll) {\n overlayTriggerState = { ...state, close: updatePosition };\n }\n\n let { triggerProps, overlayProps } = useOverlayTrigger(\n { type: 'dialog' },\n overlayTriggerState,\n triggerRef,\n );\n\n let triggerPropsWithRef = {\n ...triggerProps,\n ref: targetRef ? undefined : triggerRef,\n };\n\n // Mirror the Select/ComboBox/MenuTrigger pattern: when an outside click lands\n // on ANOTHER popover trigger, return `false` so react-aria's `useOverlay`\n // does NOT `stopPropagation()` the click. The click then reaches that trigger,\n // its popover opens, and `usePopoverSync` closes this one via the EventBus.\n // Without this, react-aria swallows every outside click and a single click on\n // a sibling trigger can't open it while this popover is open.\n const resolveShouldCloseOnInteractOutside = useEvent(\n (el: Element): boolean => {\n const popoverTriggerEl = el.closest('[data-popover-trigger]');\n if (!popoverTriggerEl) {\n // The caller's own predicate is asked FIRST, so an explicit \"keep me\n // open for this element\" wins over the automatic behaviours below\n // (CUB-4113). It used to be consulted last, which made the prop inert\n // for every `Button` / `ItemButton`: those carry\n // `data-popover-dismiss`, so the auto-dismiss branch matched and\n // closed the popover before the predicate was ever asked.\n //\n // React Aria hands over the element the pointer landed on — for a\n // `Button` that is the label inside it, not the `<button>` — so a\n // predicate that guards an element has to use `contains()` rather\n // than an identity check.\n if (shouldCloseOnInteractOutside && !shouldCloseOnInteractOutside(el)) {\n return false;\n }\n if (el.closest('[data-popover-keep]')) return false;\n // Plain interactive controls (Button, ItemButton) opt in via\n // `data-popover-dismiss`. Schedule the close after the click finishes so\n // the control's `onPress` runs first instead of losing the click to\n // useOverlay's stopPropagation.\n if (el.closest('[data-popover-dismiss]')) {\n setTimeout(() => state.close(), 0);\n return false;\n }\n return true;\n }\n // Clicking our own trigger again should dismiss us.\n const ownTrigger = targetRef?.current ?? triggerRef.current;\n if (popoverTriggerEl === ownTrigger \|\| ownTrigger?.contains(el))\n return true;\n // Another popover's trigger: let the click through so it can open.\n return false;\n },\n );\n\n let overlay = (\n <Popover\n ref={overlayRef}\n styles={styles}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n style={popoverProps.style}\n placement={placement}\n arrowProps={arrowProps}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n hideArrow={hideArrow}\n shouldCloseOnInteractOutside={resolveShouldCloseOnInteractOutside}\n onClose={onClose}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Popover>\n );\n\n return (\n <DialogTriggerBase\n type=\"popover\"\n state={state}\n triggerProps={triggerPropsWithRef}\n dialogProps={overlayProps}\n trigger={trigger}\n overlay={overlay}\n overlayRef={overlayRef}\n shouldRestoreFocus={shouldRestoreFocus}\n onClose={onClose}\n />\n );\n}\n\nfunction DialogTriggerBase(props: any) {\n const ref = useCombinedRefs<HTMLElement>(props.ref);\n const wasOpenRef = useRef(false);\n const overlayRef: RefObject<HTMLElement \| null> \| undefined =\n props.overlayRef;\n\n // Mirror the press-responder DOM node into the parent's sync trigger ref.\n // Done via `useLayoutEffect` rather than threading through `useCombinedRefs`\n // for consistency with `PopoverTrigger` (see comment there) — keeps the\n // sync-ref population deterministic regardless of branch.\n useLayoutEffect(() => {\n if (props.syncTriggerRef) {\n props.syncTriggerRef.current = ref.current ?? null;\n }\n });\n\n let {\n type,\n state,\n onClose,\n isDismissable,\n dialogProps = {},\n triggerProps = {},\n overlay,\n trigger,\n shouldRestoreFocus = true,\n } = props;\n\n let context = {\n type,\n onClose,\n isDismissable,\n isOpen: state.isOpen,\n // Reaches `Dialog`'s `FocusScope`, which owns the restore for\n // popover-type dialogs. `useDialog` filters it out of the DOM props.\n shouldRestoreFocus,\n ...dialogProps,\n };\n\n // Whether focus has been claimed by something outside the closing dialog —\n // the signal that an action handed focus off and the trigger must not take\n // it back. Same rule as `MenuTrigger` (see CUB-3962): an action that opens\n // a panel, another dialog or an inline editor focuses that surface, and\n // restoring here would undo the hand-off.\n //\n // Focus still inside the overlay means nobody claimed it (the pressed\n // control keeps focus while the overlay plays its ~350ms exit animation),\n // and focus on `<body>` or on a detached node means the focused element\n // went away with the dialog. Both belong back on the trigger.\n const hasFocusMovedOutsideDialog = useEvent(() => {\n const activeElement = document.activeElement;\n\n if (!activeElement \|\| activeElement === document.body) return false;\n if (!activeElement.isConnected) return false;\n\n return !(\n overlayRef?.current?.contains(activeElement) \|\|\n ref.current?.contains(activeElement)\n );\n });\n\n // Restore focus manually when the dialog closes.\n //\n // Live for modal/tray/fullscreen/panel types only: in the popover branch\n // `triggerProps` carries its own `ref`, which overrides the `ref={ref}` on\n // `PressResponder` below, so `ref.current` stays null and this is a no-op.\n // Popovers get their restore from `Dialog`'s own `<FocusScope restoreFocus>`\n // instead, which already declines to restore when focus moved elsewhere.\n useEffect(() => {\n if (!state.isOpen && wasOpenRef.current) {\n wasOpenRef.current = false;\n if (!shouldRestoreFocus) return;\n if (hasFocusMovedOutsideDialog()) return;\n ref.current?.focus();\n } else if (state.isOpen) {\n wasOpenRef.current = true;\n }\n }, [state.isOpen, shouldRestoreFocus, hasFocusMovedOutsideDialog]);\n\n // Mark popover-type DialogTrigger children with `data-popover-trigger` so\n // `Button` / `ItemButton`'s default dismiss-on-press behaviour treats them\n // as popover triggers (skips the dismiss). Modal/tray/fullscreen children\n // intentionally stay UNMARKED — when a modal-type DialogTrigger lives\n // inside a popover footer, pressing it should dismiss the parent popover\n // (matching the \"modal takes over\" native UX).\n const triggerExtraProps =\n type === 'popover' ? { 'data-popover-trigger': '' } : {};\n\n return (\n <Fragment>\n <PressResponder\n ref={ref}\n {...triggerProps}\n {...triggerExtraProps}\n isPressed={\n state.isOpen &&\n type !== 'modal' &&\n type !== 'fullscreen' &&\n type !== 'fullscreenTakeover'\n }\n onPress={state.toggle}\n >\n {trigger}\n </PressResponder>\n <DialogContext.Provider value={context}>{overlay}</DialogContext.Provider>\n </Fragment>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"DialogTrigger.js","names":["Modal","Tray","Popover"],"sources":["../../../../src/components/overlays/Dialog/DialogTrigger.tsx"],"sourcesContent":["import { PressResponder } from '@react-aria/interactions';\nimport { useMediaQuery } from '@react-spectrum/utils';\nimport { Styles } from '@tenphi/tasty';\nimport {\n Fragment,\n ReactElement,\n RefObject,\n useEffect,\n useMemo,\n useRef,\n} from 'react';\nimport {\n OverlayTriggerProps,\n Placement,\n PositionProps,\n useOverlayPosition,\n useOverlayTrigger,\n} from 'react-aria';\nimport { OverlayTriggerState, useOverlayTriggerState } from 'react-stately';\n\nimport { useEvent } from '../../../_internal';\nimport { generateRandomId } from '../../../utils/random';\nimport { useCombinedRefs, useLayoutEffect } from '../../../utils/react/index';\nimport { usePopoverSync } from '../../../utils/react/usePopoverSync';\nimport { Modal, Popover, Tray, WithCloseBehavior } from '../Modal';\n\nimport { DialogContext } from './context';\n\nexport type CubeDialogClose = (close: () => void) => ReactElement;\n\nexport interface CubeDialogTriggerProps\n extends OverlayTriggerProps,\n PositionProps,\n WithCloseBehavior {\n /** The Dialog and its trigger element. See the DialogTrigger [Content section](#content) for more information on what to provide as children. /\n children: [\n ReactElement \| ((state: OverlayTriggerState) => ReactElement),\n CubeDialogClose \| ReactElement,\n ];\n /\n The type of Dialog that should be rendered. See the DialogTrigger [types section](#dialog-types) for an explanation on each.\n * @default 'modal'\n /\n type?:\n \| 'modal'\n \| 'popover'\n \| 'tray'\n \| 'fullscreen'\n \| 'fullscreenTakeover'\n \| 'panel';\n /* The type of Dialog that should be rendered when on a mobile device. See DialogTrigger [types section](#dialog-types) for an explanation on each. /\n mobileType?:\n \| 'modal'\n \| 'tray'\n \| 'fullscreen'\n \| 'fullscreenTakeover'\n \| 'panel'\n \| 'popover';\n placement?: Placement;\n /\n Whether a popover type Dialog's arrow should be hidden.\n /\n hideArrow?: boolean;\n /* The ref of the element the Dialog should visually attach itself to. Defaults to the trigger button if not defined. /\n targetRef?: RefObject<HTMLElement \| null>;\n /* Whether a modal type Dialog should be dismissable. /\n isDismissable?: boolean;\n /* Whether pressing the escape key to close the dialog should be disabled. /\n isKeyboardDismissDisabled?: boolean;\n /* The screen breakpoint for the mobile type /\n mobileViewport?: number;\n /* The style map for the overlay /\n styles?: Styles;\n shouldCloseOnInteractOutside?: (element: Element) => boolean;\n onDismiss?: (action?: string) => void;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n defaultOpen?: boolean;\n shouldFlip?: boolean;\n shouldUpdatePosition?: boolean;\n / Minimum padding in pixels between the popover and viewport edges /\n containerPadding?: number;\n /\n Whether focus returns to the trigger when the dialog closes. Defaults to\n * `true`.\n \n The restore is skipped automatically whenever the action that closed the\n * dialog has already moved focus somewhere else, so an action that opens a\n * panel/dialog/inline editor and focuses it needs nothing here. Pass `false`\n * for the remaining case: a surface that claims focus later than the\n * dialog's own restore (after an async load, an entry animation, or a\n * `requestAnimationFrame`), where the trigger would otherwise take focus\n * first and produce a visible flash.\n /\n shouldRestoreFocus?: boolean;\n}\n\n/\n DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the Dialog's\n * open state with the trigger's press state. Additionally, it allows you to customize the type and\n * positioning of the Dialog.\n */\nexport function DialogTrigger(props: CubeDialogTriggerProps) {\n let {\n children,\n type = 'modal',\n mobileType = type,\n hideArrow,\n targetRef,\n onDismiss,\n isDismissable = true,\n isKeyboardDismissDisabled,\n styles,\n mobileViewport = 700,\n hideOnClose,\n shouldCloseOnInteractOutside,\n shouldRestoreFocus = true,\n ...positionProps\n } = props;\n\n if (!Array.isArray(children) \|\| children.length > 2) {\n throw new Error('DialogTrigger must have exactly 2 children');\n }\n // if a function is passed as the second child, it won't appear in toArray\n let [trigger, content] = children;\n\n // On small devices, show a modal or tray instead of a popover.\n let isMobile = useMediaQuery(`(max-width: ${mobileViewport}px)`);\n if (isMobile) {\n // handle cases where desktop popovers need a close button for the mobile modal view\n if (type !== 'modal' && mobileType === 'modal') {\n isDismissable = true;\n }\n\n type = mobileType;\n }\n\n let state = useOverlayTriggerState(props);\n\n if (typeof trigger === 'function') {\n trigger = trigger(state);\n }\n\n let wasOpen = useRef(false);\n let isExiting = useRef(false);\n let onExiting = () => (isExiting.current = true);\n let onExited = () => (isExiting.current = false);\n\n wasOpen.current = state.isOpen;\n\n // Shared identity + refs for `usePopoverSync`. Allocating here (rather than\n // inside the branch-specific sub-trees) keeps a single sync registration for\n // the lifetime of the trigger, even when `type` flips between popover and\n // modal at the mobile breakpoint. The refs are then threaded into the\n // appropriate branch so existing positioning / useOverlayTrigger hooks keep\n // their original ref targets and `usePopoverSync`'s `contains()` check has a\n // real DOM node to query.\n const dialogSyncId = useMemo(() => generateRandomId(), []);\n const syncTriggerRef = useRef<HTMLElement \| null>(null);\n const syncOverlayRef = useRef<HTMLElement \| null>(null);\n\n // Only popover-type Dialogs participate in the \"press inside dismisses\n // me\" / \"peer popover opening dismisses me\" behaviours: modals, trays,\n // fullscreen and panel Dialogs are persistent workspaces and must not be\n // yanked closed via the EventBus (which would bypass `isDismissable` and\n // call `state.close()` directly). Non-popover types DO still EMIT\n // `popover:open`, so opening a modal correctly dismisses peer popovers.\n const isPopoverFlavored = type === 'popover';\n usePopoverSync({\n menuId: dialogSyncId,\n isOpen: state.isOpen,\n onClose: () => state.close(),\n triggerRef: syncTriggerRef,\n containerRef: syncOverlayRef,\n dismissOnInnerButtonPress: isPopoverFlavored,\n closeOnPeerOpen: isPopoverFlavored,\n });\n\n useEffect(() => {\n return () => {\n if (\n (wasOpen.current \|\| isExiting.current) &&\n type !== 'popover' &&\n type !== 'tray'\n ) {\n console.warn(\n 'CubeUIKit: A DialogTrigger unmounted while open. This is likely due to being placed within a trigger that unmounts or inside a conditional. Consider using a DialogContainer instead.',\n );\n }\n };\n }, []);\n\n function onClose(action) {\n if (isDismissable) {\n onDismiss && onDismiss(action);\n state.close();\n }\n }\n\n if (type === 'popover') {\n return (\n <PopoverTrigger\n {...positionProps}\n hideOnClose={hideOnClose}\n state={state}\n styles={styles}\n targetRef={targetRef}\n trigger={trigger}\n content={content}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n hideArrow={hideArrow}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}\n shouldRestoreFocus={shouldRestoreFocus}\n syncTriggerRef={syncTriggerRef}\n syncOverlayRef={syncOverlayRef}\n triggerType={type}\n onClose={onClose}\n />\n );\n }\n\n let renderOverlay = () => {\n switch (type) {\n case 'panel':\n case 'fullscreen':\n case 'fullscreenTakeover':\n case 'modal':\n return (\n <Modal\n ref={syncOverlayRef}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n isDismissable={isDismissable}\n type={type}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n styles={styles}\n shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}\n onClose={onClose}\n onExiting={onExiting}\n onExited={onExited}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Modal>\n );\n case 'tray':\n return (\n <Tray\n ref={syncOverlayRef}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n styles={styles}\n onClose={onClose}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Tray>\n );\n }\n };\n\n return (\n <DialogTriggerBase\n type={type}\n state={state}\n isDismissable={isDismissable}\n trigger={trigger}\n overlay={renderOverlay()}\n hideOnClose={hideOnClose}\n syncTriggerRef={syncTriggerRef}\n overlayRef={syncOverlayRef}\n shouldRestoreFocus={shouldRestoreFocus}\n onClose={onClose}\n />\n );\n}\n\nfunction PopoverTrigger(allProps) {\n let {\n state,\n styles,\n targetRef,\n trigger,\n content,\n hideArrow,\n onClose,\n isKeyboardDismissDisabled,\n hideOnClose,\n shouldCloseOnInteractOutside,\n shouldRestoreFocus,\n keepOpenOnScroll,\n syncTriggerRef,\n syncOverlayRef,\n triggerType,\n ...props\n } = allProps;\n\n let triggerRef = useRef<HTMLButtonElement>(null);\n let overlayRef = useRef<HTMLDivElement>(null);\n\n // Mirror the trigger/overlay DOM nodes into the parent-owned sync refs.\n //\n // We deliberately do NOT use `useCombinedRefs` here: that hook returns a\n // brand new internal ref and propagates to the passed refs via a regular\n // `useEffect` (post-commit). `useOverlayPosition` below reads\n // `triggerRef.current` in its own layout effect during the SAME commit, so\n // if `triggerRef` only receives the DOM node via a delayed effect, the\n // first measurement sees `null` and the popover positions at the document\n // origin until something forces a re-measure.\n //\n // Keeping `triggerRef`/`overlayRef` as the direct React refs preserves\n // synchronous assignment for `useOverlayPosition`. The sync refs are only\n // ever read inside `popover:open` handlers, which fire via setTimeout(0),\n // so a layout-effect mirror is more than fast enough.\n useLayoutEffect(() => {\n if (syncTriggerRef) {\n syncTriggerRef.current = targetRef?.current ?? triggerRef.current ?? null;\n }\n if (syncOverlayRef) {\n syncOverlayRef.current = overlayRef.current ?? null;\n }\n });\n\n let {\n overlayProps: popoverProps,\n placement,\n arrowProps,\n updatePosition,\n } = useOverlayPosition({\n targetRef: targetRef \|\| triggerRef,\n overlayRef: overlayRef,\n placement: props.placement,\n containerPadding: props.containerPadding,\n offset: props.offset \|\| 8,\n crossOffset: props.crossOffset,\n shouldFlip: props.shouldFlip,\n shouldUpdatePosition: props.shouldUpdatePosition,\n isOpen: state.isOpen,\n });\n\n let overlayTriggerState = state;\n\n if (keepOpenOnScroll) {\n overlayTriggerState = { ...state, close: updatePosition };\n }\n\n let { triggerProps, overlayProps } = useOverlayTrigger(\n { type: 'dialog' },\n overlayTriggerState,\n triggerRef,\n );\n\n let triggerPropsWithRef = {\n ...triggerProps,\n ref: targetRef ? undefined : triggerRef,\n };\n\n // Mirror the Select/ComboBox/MenuTrigger pattern: when an outside click lands\n // on ANOTHER popover trigger, return `false` so react-aria's `useOverlay`\n // does NOT `stopPropagation()` the click. The click then reaches that trigger,\n // its popover opens, and `usePopoverSync` closes this one via the EventBus.\n // Without this, react-aria swallows every outside click and a single click on\n // a sibling trigger can't open it while this popover is open.\n const resolveShouldCloseOnInteractOutside = useEvent(\n (el: Element): boolean => {\n // The caller's own predicate is asked FIRST, so an explicit \"keep me open\n // for this element\" wins over every automatic behaviour below (CUB-4113).\n // It used to be consulted last, which made the prop inert for every\n // `Button` / `ItemButton`: those carry `data-popover-dismiss`, so the\n // auto-dismiss branch matched and closed the popover before the predicate\n // was ever asked.\n //\n // Asked before the `data-popover-trigger` lookup too, not just inside the\n // \"outside any trigger\" branch. A trigger can own interactive controls —\n // a picker's clear button, or its custom `actions` — and those live\n // INSIDE the trigger element, so the lookup below matched \"our own\n // trigger\" and dismissed us without asking. That cost the control its\n // press: the first click on `Reset` closed the list and never ran.\n //\n // React Aria hands over the element the pointer landed on — for a\n // `Button` that is the label inside it, not the `<button>` — so a\n // predicate that guards an element has to use `contains()` rather than an\n // identity check.\n if (shouldCloseOnInteractOutside && !shouldCloseOnInteractOutside(el)) {\n return false;\n }\n\n const popoverTriggerEl = el.closest('[data-popover-trigger]');\n if (!popoverTriggerEl) {\n if (el.closest('[data-popover-keep]')) return false;\n // Plain interactive controls (Button, ItemButton) opt in via\n // `data-popover-dismiss`. Schedule the close after the click finishes so\n // the control's `onPress` runs first instead of losing the click to\n // useOverlay's stopPropagation.\n if (el.closest('[data-popover-dismiss]')) {\n setTimeout(() => state.close(), 0);\n return false;\n }\n return true;\n }\n // Clicking our own trigger again should dismiss us.\n const ownTrigger = targetRef?.current ?? triggerRef.current;\n if (popoverTriggerEl === ownTrigger \|\| ownTrigger?.contains(el))\n return true;\n // Another popover's trigger: let the click through so it can open.\n return false;\n },\n );\n\n let overlay = (\n <Popover\n ref={overlayRef}\n styles={styles}\n hideOnClose={hideOnClose}\n isOpen={state.isOpen}\n style={popoverProps.style}\n placement={placement}\n arrowProps={arrowProps}\n isKeyboardDismissDisabled={isKeyboardDismissDisabled}\n hideArrow={hideArrow}\n shouldCloseOnInteractOutside={resolveShouldCloseOnInteractOutside}\n onClose={onClose}\n >\n {typeof content === 'function' ? content(state.close) : content}\n </Popover>\n );\n\n return (\n <DialogTriggerBase\n type=\"popover\"\n state={state}\n triggerProps={triggerPropsWithRef}\n dialogProps={overlayProps}\n trigger={trigger}\n overlay={overlay}\n overlayRef={overlayRef}\n shouldRestoreFocus={shouldRestoreFocus}\n onClose={onClose}\n />\n );\n}\n\nfunction DialogTriggerBase(props: any) {\n const ref = useCombinedRefs<HTMLElement>(props.ref);\n const wasOpenRef = useRef(false);\n const overlayRef: RefObject<HTMLElement \| null> \| undefined =\n props.overlayRef;\n\n // Mirror the press-responder DOM node into the parent's sync trigger ref.\n // Done via `useLayoutEffect` rather than threading through `useCombinedRefs`\n // for consistency with `PopoverTrigger` (see comment there) — keeps the\n // sync-ref population deterministic regardless of branch.\n useLayoutEffect(() => {\n if (props.syncTriggerRef) {\n props.syncTriggerRef.current = ref.current ?? null;\n }\n });\n\n let {\n type,\n state,\n onClose,\n isDismissable,\n dialogProps = {},\n triggerProps = {},\n overlay,\n trigger,\n shouldRestoreFocus = true,\n } = props;\n\n let context = {\n type,\n onClose,\n isDismissable,\n isOpen: state.isOpen,\n // Reaches `Dialog`'s `FocusScope`, which owns the restore for\n // popover-type dialogs. `useDialog` filters it out of the DOM props.\n shouldRestoreFocus,\n ...dialogProps,\n };\n\n // Whether focus has been claimed by something outside the closing dialog —\n // the signal that an action handed focus off and the trigger must not take\n // it back. Same rule as `MenuTrigger` (see CUB-3962): an action that opens\n // a panel, another dialog or an inline editor focuses that surface, and\n // restoring here would undo the hand-off.\n //\n // Focus still inside the overlay means nobody claimed it (the pressed\n // control keeps focus while the overlay plays its ~350ms exit animation),\n // and focus on `<body>` or on a detached node means the focused element\n // went away with the dialog. Both belong back on the trigger.\n const hasFocusMovedOutsideDialog = useEvent(() => {\n const activeElement = document.activeElement;\n\n if (!activeElement \|\| activeElement === document.body) return false;\n if (!activeElement.isConnected) return false;\n\n return !(\n overlayRef?.current?.contains(activeElement) \|\|\n ref.current?.contains(activeElement)\n );\n });\n\n // Restore focus manually when the dialog closes.\n //\n // Live for modal/tray/fullscreen/panel types only: in the popover branch\n // `triggerProps` carries its own `ref`, which overrides the `ref={ref}` on\n // `PressResponder` below, so `ref.current` stays null and this is a no-op.\n // Popovers get their restore from `Dialog`'s own `<FocusScope restoreFocus>`\n // instead, which already declines to restore when focus moved elsewhere.\n useEffect(() => {\n if (!state.isOpen && wasOpenRef.current) {\n wasOpenRef.current = false;\n if (!shouldRestoreFocus) return;\n if (hasFocusMovedOutsideDialog()) return;\n ref.current?.focus();\n } else if (state.isOpen) {\n wasOpenRef.current = true;\n }\n }, [state.isOpen, shouldRestoreFocus, hasFocusMovedOutsideDialog]);\n\n // Mark popover-type DialogTrigger children with `data-popover-trigger` so\n // `Button` / `ItemButton`'s default dismiss-on-press behaviour treats them\n // as popover triggers (skips the dismiss). Modal/tray/fullscreen children\n // intentionally stay UNMARKED — when a modal-type DialogTrigger lives\n // inside a popover footer, pressing it should dismiss the parent popover\n // (matching the \"modal takes over\" native UX).\n const triggerExtraProps =\n type === 'popover' ? { 'data-popover-trigger': '' } : {};\n\n return (\n <Fragment>\n <PressResponder\n ref={ref}\n {...triggerProps}\n {...triggerExtraProps}\n isPressed={\n state.isOpen &&\n type !== 'modal' &&\n type !== 'fullscreen' &&\n type !== 'fullscreenTakeover'\n }\n onPress={state.toggle}\n >\n {trigger}\n </PressResponder>\n <DialogContext.Provider value={context}>{overlay}</DialogContext.Provider>\n </Fragment>\n );\n}\n"],"mappings":"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"}

package/dist/components/overlays/Dialog/context.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { createContext, useContext } from "react";
 import invariant from "tiny-invariant";

package/dist/components/overlays/Dialog/use-dialog-container.js CHANGED Viewed

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

package/dist/components/overlays/Modal/Modal.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
 import "./types.js";
-import { BaseProps, Styles } from "@tenphi/tasty";
+import { BaseProps, Styles } from "@tenphi/tasty";
+import "react";

package/dist/components/overlays/Modal/Modal.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _Overlay } from "./Overlay.js";
 import { _Underlay } from "./Underlay.js";

package/dist/components/overlays/Modal/OpenTransitionContext.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { createContext, useContext } from "react";
 //#region src/components/overlays/Modal/OpenTransitionContext.tsx

package/dist/components/overlays/Modal/Overlay.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
 import "./types.js";
+import "react";
 import { OverlayProps } from "react-aria";

package/dist/components/overlays/Modal/Overlay.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
 import { Provider, useProviderProps } from "../../../provider.js";
 import { OpenTransitionContext } from "./OpenTransitionContext.js";

package/dist/components/overlays/Modal/Popover.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _Overlay } from "./Overlay.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/overlays/Modal/Tray.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _Overlay } from "./Overlay.js";
 import { _Underlay } from "./Underlay.js";

package/dist/components/overlays/Modal/Underlay.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/overlays/Modal/types.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
+import "../../helpers/DisplayTransition/DisplayTransition.js";
 import { ReactElement } from "react";
 import { OverlayProps } from "react-aria";

package/dist/components/overlays/Notifications/Notification.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.177.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.178.0 | Cube Dev Team */
 import { useNotificationContext } from "./NotificationContext.js";
 import { useEffect, useRef } from "react";