@cratis/components 0.1.16 → 0.1.18

package/dist/esm/PivotViewer/PivotViewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"PivotViewer.js","sources":["../../../PivotViewer/PivotViewer.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { PivotViewerProps } from './types';\nimport type { GroupingResult } from './engine/types';\nimport { usePivotEngine } from './hooks/usePivotEngine';\nimport { computeLayout } from './engine/layout';\nimport { useFilterState } from './hooks/useFilterState';\nimport { useDimensionState } from './hooks/useDimensionState';\nimport { useZoomState } from './hooks/useZoomState';\nimport { BASE_CARD_WIDTH, BASE_CARD_HEIGHT, CARDS_PER_COLUMN, GROUP_SPACING } from './constants';\nimport './PivotViewer.css';\nimport { PivotViewerMain } from './components/PivotViewerMain';\nimport { FilterPanelContainer } from './components/FilterPanelContainer';\nimport { ToolbarContainer } from './components/ToolbarContainer';\nimport { usePanning, useWheelZoom, useFilterOptions } from './hooks';\nimport { useContainerDimensions } from './hooks/useContainerDimensions';\nimport type { ViewMode } from './components/Toolbar';\nimport { useFieldExtractors } from './hooks/useFieldExtractors';\nimport { useCurrentFilters, useCurrentGroupBy } from './hooks/useCurrentFilters';\nimport { useCardSelection } from './hooks/useCardSelection';\nimport { useDetailPanelClose } from './hooks/useDetailPanelClose';\nimport { useScrollSync } from './hooks/useScrollSync';\nimport { useAnimationModeTracking } from './hooks/useAnimationModeTracking';\nimport { useViewModeScrollHandling } from './hooks/useViewModeScrollHandling';\n\nexport function PivotViewer<TItem extends object>({\n    data,\n    dimensions,\n    filters,\n    defaultDimensionKey,\n    cardRenderer,\n    detailRenderer,\n    getItemId,\n    searchFields,\n    className,\n    emptyContent,\n    isLoading = false,\n    colors,\n}: PivotViewerProps<TItem>) {\n    // Refs\n    const containerRef = useRef<HTMLDivElement>(null!);\n    const filterButtonRef = useRef<HTMLButtonElement>(null!);\n    const axisLabelsRef = useRef<HTMLDivElement>(null!);\n    const spacerRef = useRef<HTMLDivElement>(null!);\n\n    // State\n    const [search, setSearch] = useState('');\n    const [viewMode, setViewMode] = useState<ViewMode>('collection');\n    const [filtersOpen, setFiltersOpen] = useState(false);\n    const [selectedItem, setSelectedItem] = useState<TItem | null>(null);\n    const [isZooming, setIsZooming] = useState(false);\n    const [visibleIds, setVisibleIds] = useState<Uint32Array>(new Uint32Array(0));\n    const [grouping, setGrouping] = useState<GroupingResult>({ groups: [] });\n    const [hoveredGroupIndex, setHoveredGroupIndex] = useState<number | null>(null);\n    const [preSelectionState, setPreSelectionState] = useState<{ zoom: number; scrollLeft: number; scrollTop: number } | null>(null);\n    const [, setAnimationMode] = useState<'layout' | 'filter'>('layout');\n    const [scrollPosition, setScrollPosition] = useState({ x: 0, y: 0 });\n\n    // Filter hooks\n    const {\n        filterState,\n        rangeFilterState,\n        expandedFilterKey,\n        setExpandedFilterKey,\n        handleToggleFilter,\n        handleClearFilter,\n        handleRangeChange,\n    } = useFilterState(filters);\n\n    // Dimension hooks\n    const {\n        activeDimensionKey,\n        setActiveDimensionKey,\n        activeDimension,\n        dimensionFilter,\n        handleAxisLabelClick,\n    } = useDimensionState(dimensions, defaultDimensionKey);\n\n    // Zoom and pan hooks\n    const {\n        zoomLevel,\n        setZoomLevel,\n        handleZoomIn,\n        handleZoomOut,\n        handleZoomSlider,\n    } = useZoomState(1);\n\n    const {\n        isPanning,\n        handlePanStart,\n        handlePanMove,\n        handlePanEnd,\n    } = usePanning(containerRef, undefined, setScrollPosition);\n\n    useWheelZoom(containerRef, zoomLevel, setZoomLevel);\n\n    // Track container dimensions for responsive layout\n    const containerDimensions = useContainerDimensions(containerRef, isLoading);\n\n    useEffect(() => {\n        const container = containerRef.current;\n        if (!container) return;\n\n        const handleScroll = () => {\n            setScrollPosition({\n                x: container.scrollLeft,\n                y: container.scrollTop,\n            });\n        };\n\n        container.addEventListener('scroll', handleScroll);\n        return () => container.removeEventListener('scroll', handleScroll);\n    }, []);\n\n    // Build field extractors for the columnar store\n    const { fieldExtractors, indexFields } = useFieldExtractors(dimensions, filters);\n\n    // Initialize the Web Worker engine\n    const { ready, applyFilters: engineApplyFilters, computeGrouping, sortIds } = usePivotEngine({\n        data,\n        fieldExtractors,\n        indexFields,\n    });\n\n    // Build filter specs from UI state\n    const currentFilters = useCurrentFilters(\n        filters,\n        filterState,\n        rangeFilterState,\n        search,\n        searchFields,\n        dimensionFilter,\n        activeDimension,\n    );\n\n    const currentGroupBy = useCurrentGroupBy(activeDimensionKey, dimensions);\n\n    // Apply filters\n    useEffect(() => {\n        if (!ready) return;\n\n        engineApplyFilters(currentFilters).then((result) => {\n            setVisibleIds(result.visibleIds);\n        });\n    }, [ready, currentFilters, engineApplyFilters]);\n\n    // Compute grouping\n    const lastGroupingRequest = useRef<{ viewMode: ViewMode; groupBy: unknown; visibleIds: Uint32Array } | null>(null);\n    \n    useEffect(() => {\n        if (!ready || visibleIds.length === 0) {\n            setGrouping({ groups: [] });\n            lastGroupingRequest.current = null;\n            return;\n        }\n\n        if (viewMode === 'collection') {\n            // In collection mode, create a single group with all items\n            // Sort items if activeDimensionKey is set\n            if (activeDimensionKey) {\n                sortIds(visibleIds, activeDimensionKey).then((sortedIds) => {\n                    setGrouping({\n                        groups: [{\n                            key: 'all',\n                            label: 'All Items',\n                            value: 'all',\n                            ids: sortedIds,\n                            count: sortedIds.length\n                        }]\n                    });\n                });\n            } else {\n                setGrouping({\n                    groups: [{\n                        key: 'all',\n                        label: 'All Items',\n                        value: 'all',\n                        ids: visibleIds,\n                        count: visibleIds.length\n                    }]\n                });\n            }\n            lastGroupingRequest.current = null;\n            return;\n        }\n\n        // Check if this is the same request as last time to prevent duplicate computations\n        const lastRequest = lastGroupingRequest.current;\n        if (\n            lastRequest &&\n            lastRequest.viewMode === viewMode &&\n            (lastRequest.groupBy as unknown as typeof currentGroupBy)?.field === currentGroupBy.field &&\n            lastRequest.visibleIds === visibleIds\n        ) {\n            return;\n        }\n\n        lastGroupingRequest.current = { viewMode, groupBy: currentGroupBy, visibleIds };\n        \n        computeGrouping(visibleIds, currentGroupBy).then((result) => {\n            setGrouping(result);\n        });\n    }, [ready, visibleIds, currentGroupBy, viewMode, computeGrouping, sortIds, activeDimensionKey]);\n\n    // Compute layout\n    const layout = useMemo(() => {\n        // Calculate layout at base dimensions (zoom is applied as transform)\n        const cardWidth = BASE_CARD_WIDTH;\n        const cardHeight = BASE_CARD_HEIGHT;\n        const containerWidth = containerDimensions.width / zoomLevel;\n        // For grouped mode, use fixed container height to ensure stable layout during zoom\n        const containerHeight = viewMode === 'collection'\n            ? containerDimensions.height / zoomLevel\n            : containerDimensions.height;\n\n        const result = computeLayout(grouping, {\n            viewMode,\n            cardWidth,\n            cardHeight,\n            cardsPerColumn: CARDS_PER_COLUMN,\n            groupSpacing: GROUP_SPACING,\n            containerWidth,\n            containerHeight,\n        });\n\n        return result;\n    }, [grouping, viewMode, zoomLevel, containerDimensions.width, containerDimensions.height]);\n\n    const resolveId = useCallback((item: TItem, index: number) => {\n        if (getItemId) {\n            const id = getItemId(item, index);\n            return typeof id === 'number' ? id : index;\n        }\n        const id = (item as Record<string, unknown>)['id'];\n        return typeof id === 'number' ? id : index;\n    }, [getItemId]);\n\n    // Track animation mode changes\n    useAnimationModeTracking(filterState, rangeFilterState, search, activeDimensionKey, viewMode, setAnimationMode);\n\n    // Sync axis labels scroll with container scroll\n    useScrollSync(containerRef, axisLabelsRef, viewMode);\n\n    // Handle scroll positioning when switching view modes or grouping changes\n    useViewModeScrollHandling({\n        containerRef,\n        viewMode,\n        grouping,\n        layout,\n        selectedItem,\n        zoomLevel,\n        resolveId,\n        data,\n        setPreSelectionState,\n    });\n\n    // Handle card selection (click)\n    const handleCardClick = useCardSelection({\n        data,\n        isPanning,\n        selectedItem,\n        zoomLevel,\n        viewMode,\n        layout,\n        containerDimensions,\n        scrollPosition,\n        preSelectionState,\n        grouping,\n        getItemId,\n        resolveId,\n        setZoomLevel,\n        setIsZooming,\n        setSelectedItem,\n        setPreSelectionState,\n    });\n\n    // Handle detail panel close\n    const closeDetail = useDetailPanelClose({\n        selectedItem,\n        preSelectionState,\n        zoomLevel,\n        viewMode,\n        layout,\n        containerDimensions,\n        grouping,\n        data,\n        resolveId,\n        setZoomLevel,\n        setIsZooming,\n        setSelectedItem,\n        setPreSelectionState,\n    });\n\n    // Use base card dimensions - zoom is applied as transform in canvas\n    const cardWidth = BASE_CARD_WIDTH;\n    const cardHeight = BASE_CARD_HEIGHT;\n\n    // Calculate filter options\n    const filterOptions = useFilterOptions(data, filters, filterState, rangeFilterState);\n\n    const hasFilters = Boolean(filters && filters.length > 0);\n    const activeFilterCount = Object.values(filterState).reduce((sum: number, vals) => sum + (vals as Set<string>).size, 0) +\n        Object.values(rangeFilterState).filter(r => r !== null).length;\n\n    const viewerClassName = [\n        'pivot-viewer',\n        className,\n        hasFilters ? (filtersOpen ? 'filters-open' : 'filters-closed') : 'no-filters',\n        viewMode === 'grouped' ? 'bucket-mode' : 'collection-mode',\n    ]\n        .filter(Boolean)\n        .join(' ');\n\n    // Map provided color overrides to CSS variables understood by the component.\n    const cssVariables = useMemo(() => {\n        const vars: Record<string, string> = {};\n        if (!colors) return vars;\n        if (colors.primaryColor) vars['--primary-color'] = colors.primaryColor;\n        if (colors.primaryColorText) vars['--primary-color-text'] = colors.primaryColorText;\n        if (colors.primary500) vars['--primary-500'] = colors.primary500;\n        if (colors.surfaceGround) vars['--surface-ground'] = colors.surfaceGround;\n        if (colors.surfaceCard) vars['--surface-card'] = colors.surfaceCard;\n        if (colors.surfaceSection) vars['--surface-section'] = colors.surfaceSection;\n        if (colors.surfaceOverlay) vars['--surface-overlay'] = colors.surfaceOverlay;\n        if (colors.surfaceBorder) vars['--surface-border'] = colors.surfaceBorder;\n        if (colors.textColor) vars['--text-color'] = colors.textColor;\n        if (colors.textColorSecondary) vars['--text-color-secondary'] = colors.textColorSecondary;\n        if (colors.highlightBg) vars['--highlight-bg'] = colors.highlightBg;\n        if (colors.maskbg) vars['--maskbg'] = colors.maskbg;\n        if (colors.focusRing) vars['--focus-ring'] = colors.focusRing;\n        return vars;\n    }, [colors]);\n\n    return (\n        <div className={viewerClassName} style={cssVariables as React.CSSProperties}>\n            <FilterPanelContainer\n                isOpen={filtersOpen && hasFilters}\n                search={search}\n                filterState={filterState}\n                rangeFilterState={rangeFilterState}\n                expandedFilterKey={expandedFilterKey}\n                filterOptions={filterOptions}\n                anchorRef={filterButtonRef}\n                onClose={() => setFiltersOpen(false)}\n                onSearchChange={setSearch}\n                onFilterToggle={handleToggleFilter}\n                onFilterClear={handleClearFilter}\n                onRangeChange={handleRangeChange}\n                onExpandedFilterChange={setExpandedFilterKey}\n            />\n\n            <main className=\"pv-main\">\n                <ToolbarContainer\n                    hasFilters={hasFilters}\n                    filtersOpen={filtersOpen}\n                    filteredCount={visibleIds.length}\n                    viewMode={viewMode}\n                    zoomLevel={zoomLevel}\n                    activeDimensionKey={activeDimensionKey}\n                    dimensions={dimensions}\n                    activeFilterCount={activeFilterCount}\n                    onFiltersToggle={() => setFiltersOpen((prev) => !prev)}\n                    onViewModeChange={setViewMode}\n                    onZoomIn={handleZoomIn}\n                    onZoomOut={handleZoomOut}\n                    onZoomSlider={handleZoomSlider}\n                    onDimensionChange={setActiveDimensionKey}\n                    filterButtonRef={filterButtonRef}\n                />\n\n                <PivotViewerMain\n                    data={data}\n                    ready={ready}\n                    isLoading={isLoading}\n                    visibleIds={visibleIds}\n                    grouping={grouping}\n                    layout={layout}\n                    cardWidth={cardWidth}\n                    cardHeight={cardHeight}\n                    zoomLevel={zoomLevel}\n                    scrollPosition={scrollPosition}\n                    containerDimensions={containerDimensions}\n                    selectedItem={selectedItem}\n                    hoveredGroupIndex={hoveredGroupIndex}\n                    isZooming={isZooming}\n                    viewMode={viewMode}\n                    cardRenderer={cardRenderer}\n                    detailRenderer={detailRenderer}\n                    resolveId={resolveId}\n                    emptyContent={emptyContent}\n                    dimensionFilter={dimensionFilter}\n                    onCardClick={handleCardClick}\n                    onPanStart={handlePanStart as (e: React.MouseEvent) => void}\n                    onPanMove={handlePanMove as (e: React.MouseEvent) => void}\n                    onPanEnd={handlePanEnd}\n                    onGroupHover={setHoveredGroupIndex}\n                    onAxisLabelClick={handleAxisLabelClick}\n                    onCloseDetail={closeDetail}\n                    containerRef={containerRef}\n                    axisLabelsRef={axisLabelsRef}\n                    spacerRef={spacerRef}\n                />\n            </main>\n        </div>\n    );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"PivotViewer.js","sources":["../../../PivotViewer/PivotViewer.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { PivotViewerProps } from './types';\nimport type { GroupingResult } from './engine/types';\nimport { usePivotEngine } from './hooks/usePivotEngine';\nimport { computeLayout } from './engine/layout';\nimport { useFilterState } from './hooks/useFilterState';\nimport { useDimensionState } from './hooks/useDimensionState';\nimport { useZoomState } from './hooks/useZoomState';\nimport { BASE_CARD_WIDTH, BASE_CARD_HEIGHT, CARDS_PER_COLUMN, GROUP_SPACING } from './constants';\nimport './PivotViewer.css';\nimport { PivotViewerMain } from './components/PivotViewerMain';\nimport { FilterPanelContainer } from './components/FilterPanelContainer';\nimport { ToolbarContainer } from './components/ToolbarContainer';\nimport { usePanning, useWheelZoom, useFilterOptions } from './hooks';\nimport { useContainerDimensions } from './hooks/useContainerDimensions';\nimport type { ViewMode } from './components/Toolbar';\nimport { useFieldExtractors } from './hooks/useFieldExtractors';\nimport { useCurrentFilters, useCurrentGroupBy } from './hooks/useCurrentFilters';\nimport { useCardSelection } from './hooks/useCardSelection';\nimport { useDetailPanelClose } from './hooks/useDetailPanelClose';\nimport { useScrollSync } from './hooks/useScrollSync';\nimport { useAnimationModeTracking } from './hooks/useAnimationModeTracking';\nimport { useViewModeScrollHandling } from './hooks/useViewModeScrollHandling';\n\nexport function PivotViewer<TItem extends object>({\n    data,\n    dimensions,\n    filters,\n    defaultDimensionKey,\n    cardRenderer,\n    detailRenderer,\n    getItemId,\n    searchFields,\n    className,\n    emptyContent,\n    isLoading = false,\n    colors,\n}: PivotViewerProps<TItem>) {\n    // Refs\n    const containerRef = useRef<HTMLDivElement>(null!);\n    const filterButtonRef = useRef<HTMLButtonElement>(null!);\n    const axisLabelsRef = useRef<HTMLDivElement>(null!);\n    const spacerRef = useRef<HTMLDivElement>(null!);\n\n    // State\n    const [search, setSearch] = useState('');\n    const [viewMode, setViewMode] = useState<ViewMode>('collection');\n    const [filtersOpen, setFiltersOpen] = useState(false);\n    const [selectedItem, setSelectedItem] = useState<TItem | null>(null);\n    const [isZooming, setIsZooming] = useState(false);\n    const [visibleIds, setVisibleIds] = useState<Uint32Array>(new Uint32Array(0));\n    const [grouping, setGrouping] = useState<GroupingResult>({ groups: [] });\n    const [hoveredGroupIndex, setHoveredGroupIndex] = useState<number | null>(null);\n    const [preSelectionState, setPreSelectionState] = useState<{ zoom: number; scrollLeft: number; scrollTop: number } | null>(null);\n    const [, setAnimationMode] = useState<'layout' | 'filter'>('layout');\n    const [scrollPosition, setScrollPosition] = useState({ x: 0, y: 0 });\n\n    // Filter hooks\n    const {\n        filterState,\n        rangeFilterState,\n        expandedFilterKey,\n        setExpandedFilterKey,\n        handleToggleFilter,\n        handleClearFilter,\n        handleRangeChange,\n    } = useFilterState(filters);\n\n    // Dimension hooks\n    const {\n        activeDimensionKey,\n        setActiveDimensionKey,\n        activeDimension,\n        dimensionFilter,\n        handleAxisLabelClick,\n    } = useDimensionState(dimensions, defaultDimensionKey);\n\n    // Zoom and pan hooks\n    const {\n        zoomLevel,\n        setZoomLevel,\n        handleZoomIn,\n        handleZoomOut,\n        handleZoomSlider,\n        handleZoomReset,\n        handleZoomChange,\n    } = useZoomState(1);\n\n    const {\n        isPanning,\n        handlePanStart,\n        handlePanMove,\n        handlePanEnd,\n    } = usePanning(containerRef, undefined, setScrollPosition);\n\n    useWheelZoom(containerRef, zoomLevel, setZoomLevel);\n\n    // Track container dimensions for responsive layout\n    const containerDimensions = useContainerDimensions(containerRef, isLoading);\n\n    useEffect(() => {\n        const container = containerRef.current;\n        if (!container) return;\n\n        const handleScroll = () => {\n            setScrollPosition({\n                x: container.scrollLeft,\n                y: container.scrollTop,\n            });\n        };\n\n        container.addEventListener('scroll', handleScroll);\n        return () => container.removeEventListener('scroll', handleScroll);\n    }, []);\n\n    // Build field extractors for the columnar store\n    const { fieldExtractors, indexFields } = useFieldExtractors(dimensions, filters);\n\n    // Initialize the Web Worker engine\n    const { ready, applyFilters: engineApplyFilters, computeGrouping, sortIds } = usePivotEngine({\n        data,\n        fieldExtractors,\n        indexFields,\n    });\n\n    // Build filter specs from UI state\n    const currentFilters = useCurrentFilters(\n        filters,\n        filterState,\n        rangeFilterState,\n        search,\n        searchFields,\n        dimensionFilter,\n        activeDimension,\n    );\n\n    const currentGroupBy = useCurrentGroupBy(activeDimensionKey, dimensions);\n\n    // Apply filters\n    useEffect(() => {\n        if (!ready) return;\n\n        engineApplyFilters(currentFilters).then((result) => {\n            // If the engine failed to return any IDs while no filters are active,\n            // fall back to showing the full dataset so the canvas never renders empty.\n            if (result.visibleIds.length === 0 && currentFilters.length === 0 && data.length > 0) {\n                const fallbackIds = new Uint32Array(data.length);\n                for (let i = 0; i < data.length; i++) {\n                    fallbackIds[i] = i;\n                }\n                setVisibleIds(fallbackIds);\n                return;\n            }\n\n            setVisibleIds(result.visibleIds);\n        });\n    }, [ready, currentFilters, engineApplyFilters, data.length]);\n\n    // Compute grouping\n    const lastGroupingRequest = useRef<{ viewMode: ViewMode; groupBy: unknown; visibleIds: Uint32Array } | null>(null);\n    \n    useEffect(() => {\n        if (!ready || visibleIds.length === 0) {\n            setGrouping({ groups: [] });\n            lastGroupingRequest.current = null;\n            return;\n        }\n\n        if (viewMode === 'collection') {\n            // In collection mode, create a single group with all items\n            // Sort items if activeDimensionKey is set\n            if (activeDimensionKey) {\n                sortIds(visibleIds, activeDimensionKey).then((sortedIds) => {\n                    setGrouping({\n                        groups: [{\n                            key: 'all',\n                            label: 'All Items',\n                            value: 'all',\n                            ids: sortedIds,\n                            count: sortedIds.length\n                        }]\n                    });\n                });\n            } else {\n                setGrouping({\n                    groups: [{\n                        key: 'all',\n                        label: 'All Items',\n                        value: 'all',\n                        ids: visibleIds,\n                        count: visibleIds.length\n                    }]\n                });\n            }\n            lastGroupingRequest.current = null;\n            return;\n        }\n\n        // Check if this is the same request as last time to prevent duplicate computations\n        const lastRequest = lastGroupingRequest.current;\n        if (\n            lastRequest &&\n            lastRequest.viewMode === viewMode &&\n            (lastRequest.groupBy as unknown as typeof currentGroupBy)?.field === currentGroupBy.field &&\n            lastRequest.visibleIds === visibleIds\n        ) {\n            return;\n        }\n\n        lastGroupingRequest.current = { viewMode, groupBy: currentGroupBy, visibleIds };\n        \n        computeGrouping(visibleIds, currentGroupBy).then((result) => {\n            setGrouping(result);\n        });\n    }, [ready, visibleIds, currentGroupBy, viewMode, computeGrouping, sortIds, activeDimensionKey]);\n\n    // Compute layout\n    const layout = useMemo(() => {\n        // Calculate layout at base dimensions (zoom is applied as transform)\n        const cardWidth = BASE_CARD_WIDTH;\n        const cardHeight = BASE_CARD_HEIGHT;\n        const containerWidth = containerDimensions.width / zoomLevel;\n        // For grouped mode, use fixed container height to ensure stable layout during zoom\n        const containerHeight = viewMode === 'collection'\n            ? containerDimensions.height / zoomLevel\n            : containerDimensions.height;\n\n        const result = computeLayout(grouping, {\n            viewMode,\n            cardWidth,\n            cardHeight,\n            cardsPerColumn: CARDS_PER_COLUMN,\n            groupSpacing: GROUP_SPACING,\n            containerWidth,\n            containerHeight,\n        });\n\n        return result;\n    }, [grouping, viewMode, zoomLevel, containerDimensions.width, containerDimensions.height]);\n\n    const resolveId = useCallback((item: TItem, index: number) => {\n        if (getItemId) {\n            const id = getItemId(item, index);\n            return typeof id === 'number' ? id : index;\n        }\n        const id = (item as Record<string, unknown>)['id'];\n        return typeof id === 'number' ? id : index;\n    }, [getItemId]);\n\n    // Track animation mode changes\n    useAnimationModeTracking(filterState, rangeFilterState, search, activeDimensionKey, viewMode, setAnimationMode);\n\n    // Sync axis labels scroll with container scroll\n    useScrollSync(containerRef, axisLabelsRef, viewMode);\n\n    // Handle scroll positioning when switching view modes or grouping changes\n    useViewModeScrollHandling({\n        containerRef,\n        viewMode,\n        grouping,\n        layout,\n        selectedItem,\n        zoomLevel,\n        resolveId,\n        data,\n        setPreSelectionState,\n    });\n\n    // Handle card selection (click)\n    const handleCardClick = useCardSelection({\n        data,\n        isPanning,\n        selectedItem,\n        zoomLevel,\n        viewMode,\n        layout,\n        containerDimensions,\n        scrollPosition,\n        preSelectionState,\n        grouping,\n        getItemId,\n        resolveId,\n        setZoomLevel,\n        setIsZooming,\n        setSelectedItem,\n        setPreSelectionState,\n    });\n\n    // Handle detail panel close\n    const closeDetail = useDetailPanelClose({\n        selectedItem,\n        preSelectionState,\n        zoomLevel,\n        viewMode,\n        layout,\n        containerDimensions,\n        grouping,\n        data,\n        resolveId,\n        setZoomLevel,\n        setIsZooming,\n        setSelectedItem,\n        setPreSelectionState,\n    });\n\n    // Use base card dimensions - zoom is applied as transform in canvas\n    const cardWidth = BASE_CARD_WIDTH;\n    const cardHeight = BASE_CARD_HEIGHT;\n\n    // Calculate filter options\n    const filterOptions = useFilterOptions(data, filters, filterState, rangeFilterState);\n\n    const hasFilters = Boolean(filters && filters.length > 0);\n    const activeFilterCount = Object.values(filterState).reduce((sum: number, vals) => sum + (vals as Set<string>).size, 0) +\n        Object.values(rangeFilterState).filter(r => r !== null).length;\n\n    const viewerClassName = [\n        'pivot-viewer',\n        className,\n        hasFilters ? (filtersOpen ? 'filters-open' : 'filters-closed') : 'no-filters',\n        viewMode === 'grouped' ? 'grouped-mode' : 'collection-mode',\n    ]\n        .filter(Boolean)\n        .join(' ');\n\n    // Deselect any selected card when switching between view modes\n    useEffect(() => {\n        setSelectedItem(null);\n    }, [viewMode]);\n\n    // Map provided color overrides to CSS variables understood by the component.\n    const cssVariables = useMemo(() => {\n        const vars: Record<string, string> = {};\n        if (!colors) return vars;\n        if (colors.primaryColor) vars['--primary-color'] = colors.primaryColor;\n        if (colors.primaryColorText) vars['--primary-color-text'] = colors.primaryColorText;\n        if (colors.primary500) vars['--primary-500'] = colors.primary500;\n        if (colors.surfaceGround) vars['--surface-ground'] = colors.surfaceGround;\n        if (colors.surfaceCard) vars['--surface-card'] = colors.surfaceCard;\n        if (colors.surfaceSection) vars['--surface-section'] = colors.surfaceSection;\n        if (colors.surfaceOverlay) vars['--surface-overlay'] = colors.surfaceOverlay;\n        if (colors.surfaceBorder) vars['--surface-border'] = colors.surfaceBorder;\n        if (colors.textColor) vars['--text-color'] = colors.textColor;\n        if (colors.textColorSecondary) vars['--text-color-secondary'] = colors.textColorSecondary;\n        if (colors.highlightBg) vars['--highlight-bg'] = colors.highlightBg;\n        if (colors.maskbg) vars['--maskbg'] = colors.maskbg;\n        if (colors.focusRing) vars['--focus-ring'] = colors.focusRing;\n        return vars;\n    }, [colors]);\n\n    return (\n        <div className={viewerClassName} style={cssVariables as React.CSSProperties}>\n            <FilterPanelContainer\n                isOpen={filtersOpen && hasFilters}\n                search={search}\n                filterState={filterState}\n                rangeFilterState={rangeFilterState}\n                expandedFilterKey={expandedFilterKey}\n                filterOptions={filterOptions}\n                anchorRef={filterButtonRef}\n                onClose={() => setFiltersOpen(false)}\n                onSearchChange={setSearch}\n                onFilterToggle={handleToggleFilter}\n                onFilterClear={handleClearFilter}\n                onRangeChange={handleRangeChange}\n                onExpandedFilterChange={setExpandedFilterKey}\n            />\n\n            <main className=\"pv-main\">\n                <ToolbarContainer\n                    hasFilters={hasFilters}\n                    filtersOpen={filtersOpen}\n                    filteredCount={visibleIds.length}\n                    viewMode={viewMode}\n                    zoomLevel={zoomLevel}\n                    activeDimensionKey={activeDimensionKey}\n                    dimensions={dimensions}\n                    activeFilterCount={activeFilterCount}\n                    onFiltersToggle={() => setFiltersOpen((prev) => !prev)}\n                    onViewModeChange={setViewMode}\n                    onZoomIn={handleZoomIn}\n                    onZoomOut={handleZoomOut}\n                    onZoomSlider={handleZoomSlider}\n                    onZoomReset={handleZoomReset}\n                    onZoomChange={handleZoomChange}\n                    onDimensionChange={setActiveDimensionKey}\n                    filterButtonRef={filterButtonRef}\n                />\n\n                <PivotViewerMain\n                    data={data}\n                    ready={ready}\n                    isLoading={isLoading}\n                    visibleIds={visibleIds}\n                    grouping={grouping}\n                    layout={layout}\n                    cardWidth={cardWidth}\n                    cardHeight={cardHeight}\n                    zoomLevel={zoomLevel}\n                    scrollPosition={scrollPosition}\n                    containerDimensions={containerDimensions}\n                    selectedItem={selectedItem}\n                    hoveredGroupIndex={hoveredGroupIndex}\n                    isZooming={isZooming}\n                    viewMode={viewMode}\n                    cardRenderer={cardRenderer}\n                    detailRenderer={detailRenderer}\n                    resolveId={resolveId}\n                    emptyContent={emptyContent}\n                    dimensionFilter={dimensionFilter}\n                    onCardClick={handleCardClick}\n                    onPanStart={handlePanStart as (e: React.MouseEvent) => void}\n                    onPanMove={handlePanMove as (e: React.MouseEvent) => void}\n                    onPanEnd={handlePanEnd}\n                    onGroupHover={setHoveredGroupIndex}\n                    onAxisLabelClick={handleAxisLabelClick}\n                    onCloseDetail={closeDetail}\n                    containerRef={containerRef}\n                    axisLabelsRef={axisLabelsRef}\n                    spacerRef={spacerRef}\n                />\n            </main>\n        </div>\n    );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/PivotViewer/PivotViewer.stories.d.ts

@@ -4,5 +4,4 @@ declare const meta: Meta<typeof PivotViewer>;
 export default meta;
 type Story = StoryObj<typeof PivotViewer>;
 export declare const Default: Story;
-export declare const WithTypeSafeSearch: Story;
 //# sourceMappingURL=PivotViewer.stories.d.ts.map

package/dist/esm/PivotViewer/PivotViewer.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PivotViewer.stories.d.ts","sourceRoot":"","sources":["../../../PivotViewer/PivotViewer.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAGlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAyB1C,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAsFhC,CAAC"}
+{"version":3,"file":"PivotViewer.stories.d.ts","sourceRoot":"","sources":["../../../PivotViewer/PivotViewer.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAGlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AA6B1C,eAAO,MAAM,OAAO,EAAE,KAgFrB,CAAC"}

package/dist/esm/PivotViewer/PivotViewer.stories.js

@@ -11,15 +11,12 @@ const sampleData = [
     { id: 3, name: 'Charlie Brown', age: 42, department: 'Engineering', address: { street: '789 Pine Rd', city: 'Seattle', zipCode: '98102' } },
     { id: 4, name: 'Diana Prince', age: 31, department: 'Sales', address: { street: '321 Elm St', city: 'San Francisco', zipCode: '94102' } },
     { id: 5, name: 'Edward Norton', age: 29, department: 'Engineering', address: { street: '654 Maple Dr', city: 'Portland', zipCode: '97202' } },
+    { id: 6, name: 'Fiona Lee', age: 33, department: 'Human Resources', address: { street: '852 Cedar St', city: 'Seattle', zipCode: '98103' } },
+    { id: 7, name: 'George Miller', age: 27, department: 'Support', address: { street: '147 Birch Ln', city: 'Portland', zipCode: '97204' } },
+    { id: 8, name: 'Hannah Davis', age: 45, department: 'Finance', address: { street: '963 Walnut Ave', city: 'San Francisco', zipCode: '94103' } },
+    { id: 9, name: 'Isaac Newton', age: 38, department: 'Research', address: { street: '753 Spruce Rd', city: 'Austin', zipCode: '73301' } },
 ];
 export const Default = {
-    args: {
-        data: [],
-        dimensions: [],
-    },
-    render: (args) => (_jsx("div", { className: "storybook-wrapper", children: _jsx(PivotViewer, { ...args, data: [], dimensions: [] }) }))
-};
-export const WithTypeSafeSearch = {
     render: () => {
         const dimensions = [
             {
@@ -46,10 +43,14 @@ export const WithTypeSafeSearch = {
                     (item) => item.department,
                     (item) => item.address.city,
                     (item) => item.address.street,
-                ], cardRenderer: (item) => (_jsxs("div", { style: { padding: '8px' }, children: [_jsx("h3", { children: item.name }), _jsxs("p", { children: ["Age: ", item.age] }), _jsxs("p", { children: ["Department: ", item.department] }), _jsx("p", { children: item.address.city })] })), colors: {
+                ], cardRenderer: (item) => ({
+                    title: item.name,
+                    labels: ['Id', 'Age', 'Department', 'City'],
+                    values: [String(item.id), String(item.age), item.department, item.address.city],
+                }), colors: {
                     primaryColor: '#91BDF8',
                     primary500: '#2E66BA',
-                }, detailRenderer: (item, onClose) => (_jsxs("aside", { className: "pv-detail-panel", children: [_jsxs("header", { children: [_jsxs("div", { children: [_jsx("h2", { children: item.name }), _jsxs("p", { children: ["Department \u2022 ", item.department] })] }), _jsx("button", { type: "button", onClick: onClose, title: "Close", children: "\u00D7" })] }), _jsx("div", { className: "pv-detail-panel-content", children: _jsxs("section", { children: [_jsx("h3", { children: "Profile" }), _jsxs("dl", { children: [_jsxs("div", { children: [_jsx("dt", { children: "Age" }), _jsx("dd", { children: item.age })] }), _jsxs("div", { children: [_jsx("dt", { children: "City" }), _jsx("dd", { children: item.address.city })] }), _jsxs("div", { children: [_jsx("dt", { children: "Street" }), _jsx("dd", { children: item.address.street })] })] })] }) })] })), getItemId: (item) => item.id }) }));
+                }, detailRenderer: (item, onClose) => (_jsxs("section", { children: [_jsxs("header", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', gap: '0.5rem' }, children: [_jsxs("div", { children: [_jsx("h3", { style: { margin: 0 }, children: item.name }), _jsxs("p", { style: { margin: 0, opacity: 0.8 }, children: ["Department \u2022 ", item.department] })] }), _jsx("button", { type: "button", onClick: onClose, title: "Close", className: "p-button p-button-text", children: "Close" })] }), _jsxs("dl", { style: { marginTop: '1rem', display: 'grid', gridTemplateColumns: 'auto 1fr', gap: '0.35rem 0.75rem' }, children: [_jsxs("div", { children: [_jsx("dt", { children: "Age" }), _jsx("dd", { children: item.age })] }), _jsxs("div", { children: [_jsx("dt", { children: "City" }), _jsx("dd", { children: item.address.city })] }), _jsxs("div", { children: [_jsx("dt", { children: "Street" }), _jsx("dd", { children: item.address.street })] })] })] })), getItemId: (item) => item.id }) }));
     },
 };
 //# sourceMappingURL=PivotViewer.stories.js.map

package/dist/esm/PivotViewer/PivotViewer.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"PivotViewer.stories.js","sourceRoot":"","sources":["../../../PivotViewer/PivotViewer.stories.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"PivotViewer.stories.js","sourceRoot":"","sources":["../../../PivotViewer/PivotViewer.stories.tsx"],"names":[],"mappings":"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"}

package/dist/esm/PivotViewer/components/AxisLabels.d.ts

@@ -5,9 +5,10 @@ export interface AxisLabelsProps<TItem extends object> {
     dimensionFilter: string | null;
     hoveredGroup: string | null;
     zoomLevel: number;
+    visible: boolean;
     onHover: (key: string | null) => void;
     onClick: (key: string) => void;
     containerRef: React.RefObject<HTMLDivElement | null>;
 }
-export declare function AxisLabels<TItem extends object>({ groups, bucketWidths, dimensionFilter, hoveredGroup, zoomLevel, onHover, onClick, containerRef, }: AxisLabelsProps<TItem>): import("react/jsx-runtime").JSX.Element;
+export declare function AxisLabels<TItem extends object>({ groups, bucketWidths, dimensionFilter, hoveredGroup, zoomLevel, visible, onHover, onClick, containerRef, }: AxisLabelsProps<TItem>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AxisLabels.d.ts.map

package/dist/esm/PivotViewer/components/AxisLabels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AxisLabels.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/components/AxisLabels.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAG3C,MAAM,WAAW,eAAe,CAAC,KAAK,SAAS,MAAM;IACnD,MAAM,EAAE,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC;IAC5B,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,eAAe,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACtD;AAED,wBAAgB,UAAU,CAAC,KAAK,SAAS,MAAM,EAAE,EAC/C,MAAM,EACN,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,SAAS,EACT,OAAO,EACP,OAAO,EACP,YAAY,GACb,EAAE,eAAe,CAAC,KAAK,CAAC,2CA0CxB"}
+{"version":3,"file":"AxisLabels.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/components/AxisLabels.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAG3C,MAAM,WAAW,eAAe,CAAC,KAAK,SAAS,MAAM;IACnD,MAAM,EAAE,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC;IAC5B,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,eAAe,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACtD;AAED,wBAAgB,UAAU,CAAC,KAAK,SAAS,MAAM,EAAE,EAC/C,MAAM,EACN,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,SAAS,EACT,OAAO,EACP,OAAO,EACP,OAAO,EACP,YAAY,GACb,EAAE,eAAe,CAAC,KAAK,CAAC,2CA0CxB"}

package/dist/esm/PivotViewer/components/AxisLabels.js

@@ -1,12 +1,9 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { GROUP_SPACING } from '../constants.js';
+import { CANVAS_PADDING } from '../constants.js';
 
-function AxisLabels({ groups, bucketWidths, dimensionFilter, hoveredGroup, zoomLevel, onHover, onClick, containerRef, }) {
-    return (jsx("div", { className: "pv-axis-labels", ref: containerRef, style: {
-            pointerEvents: 'none',
-            gap: `${GROUP_SPACING * zoomLevel}px`,
-            paddingLeft: 0,
-            paddingRight: 0,
+function AxisLabels({ groups, bucketWidths, dimensionFilter, hoveredGroup, zoomLevel, visible, onHover, onClick, containerRef, }) {
+    return (jsx("div", { className: `pv-axis-labels ${visible ? 'visible' : 'hidden'}`, ref: containerRef, style: {
+            paddingLeft: `${(CANVAS_PADDING * zoomLevel) - (20 * zoomLevel)}px`,
             overflowX: 'hidden',
             whiteSpace: 'nowrap',
         }, children: groups.map((group, index) => {
@@ -14,9 +11,9 @@ function AxisLabels({ groups, bucketWidths, dimensionFilter, hoveredGroup, zoomL
             const baseBucketWidth = bucketWidths[index] || 0;
             const bucketWidth = baseBucketWidth * zoomLevel;
             const width = bucketWidth;
-            return (jsxs("button", { type: "button", className: `pv-axis-label ${hoveredGroup === group.key ? 'highlighted' : ''} ${isSelected ? 'selected' : ''}`, style: {
+            const isFilteredOut = dimensionFilter !== null && !isSelected;
+            return (jsxs("button", { type: "button", className: `pv-axis-label ${hoveredGroup === group.key ? 'highlighted' : ''} ${isSelected ? 'selected' : ''} ${isFilteredOut ? 'filtered-out' : ''}`, style: {
                     width,
-                    pointerEvents: 'auto'
                 }, onMouseEnter: () => onHover(group.key), onMouseLeave: () => onHover(null), onClick: () => onClick(group.key), children: [jsx("span", { className: "pv-axis-label-text", children: group.label }), jsx("span", { className: "pv-axis-label-count", children: group.count ?? group.items.length })] }, group.key));
         }) }));
 }

package/dist/esm/PivotViewer/components/AxisLabels.js.map

@@ -1 +1 @@
-{"version":3,"file":"AxisLabels.js","sources":["../../../../PivotViewer/components/AxisLabels.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport type { PivotGroup } from '../types';\nimport { GROUP_SPACING } from '../constants';\n\nexport interface AxisLabelsProps<TItem extends object> {\n  groups: PivotGroup<TItem>[];\n  bucketWidths: number[];\n  dimensionFilter: string | null;\n  hoveredGroup: string | null;\n  zoomLevel: number;\n  onHover: (key: string | null) => void;\n  onClick: (key: string) => void;\n  containerRef: React.RefObject<HTMLDivElement | null>;\n}\n\nexport function AxisLabels<TItem extends object>({\n  groups,\n  bucketWidths,\n  dimensionFilter,\n  hoveredGroup,\n  zoomLevel,\n  onHover,\n  onClick,\n  containerRef,\n}: AxisLabelsProps<TItem>) {\n  return (\n    <div\n      className=\"pv-axis-labels\"\n      ref={containerRef}\n      style={{\n        pointerEvents: 'none',\n        gap: `${GROUP_SPACING * zoomLevel}px`,\n        paddingLeft: 0,\n        paddingRight: 0,\n        overflowX: 'hidden',\n        whiteSpace: 'nowrap',\n      }}\n    >\n      {groups.map((group, index) => {\n        const isSelected = dimensionFilter === group.key;\n        const baseBucketWidth = bucketWidths[index] || 0;\n        // Apply zoom to bucket width\n        const bucketWidth = baseBucketWidth * zoomLevel;\n        // Width is just the bucket width - spacing is handled by CSS gap\n        const width = bucketWidth;\n\n        return (\n          <button\n            key={group.key}\n            type=\"button\"\n            className={`pv-axis-label ${hoveredGroup === group.key ? 'highlighted' : ''} ${isSelected ? 'selected' : ''}`}\n            style={{\n              width,\n              pointerEvents: 'auto'\n            }}\n            onMouseEnter={() => onHover(group.key)}\n            onMouseLeave={() => onHover(null)}\n            onClick={() => onClick(group.key)}\n          >\n            <span className=\"pv-axis-label-text\">{group.label}</span>\n            <span className=\"pv-axis-label-count\">{group.count ?? group.items.length}</span>\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;SAiBgB,UAAU,CAAuB,EAC/C,MAAM,EACN,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,SAAS,EACT,OAAO,EACP,OAAO,EACP,YAAY,GACW,EAAA;IACvB,QACEA,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAC,gBAAgB,EAC1B,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE;AACL,YAAA,aAAa,EAAE,MAAM;AACrB,YAAA,GAAG,EAAE,CAAA,EAAG,aAAa,GAAG,SAAS,CAAA,EAAA,CAAI;AACrC,YAAA,WAAW,EAAE,CAAC;AACd,YAAA,YAAY,EAAE,CAAC;AACf,YAAA,SAAS,EAAE,QAAQ;AACnB,YAAA,UAAU,EAAE,QAAQ;SACrB,EAAA,QAAA,EAEA,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,KAAI;AAC3B,YAAA,MAAM,UAAU,GAAG,eAAe,KAAK,KAAK,CAAC,GAAG;YAChD,MAAM,eAAe,GAAG,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC;AAEhD,YAAA,MAAM,WAAW,GAAG,eAAe,GAAG,SAAS;YAE/C,MAAM,KAAK,GAAG,WAAW;AAEzB,YAAA,QACEC,IAAA,CAAA,QAAA,EAAA,EAEE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,CAAA,cAAA,EAAiB,YAAY,KAAK,KAAK,CAAC,GAAG,GAAG,aAAa,GAAG,EAAE,CAAA,CAAA,EAAI,UAAU,GAAG,UAAU,GAAG,EAAE,CAAA,CAAE,EAC7G,KAAK,EAAE;oBACL,KAAK;AACL,oBAAA,aAAa,EAAE;AAChB,iBAAA,EACD,YAAY,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,EACtC,YAAY,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,EACjC,OAAO,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,EAAA,QAAA,EAAA,CAEjCD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAE,KAAK,CAAC,KAAK,EAAA,CAAQ,EACzDA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,qBAAqB,EAAA,QAAA,EAAE,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,EAAA,CAAQ,CAAA,EAAA,EAZ3E,KAAK,CAAC,GAAG,CAaP;QAEb,CAAC,CAAC,EAAA,CACE;AAEV;;;;"}
+{"version":3,"file":"AxisLabels.js","sources":["../../../../PivotViewer/components/AxisLabels.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport type { PivotGroup } from '../types';\nimport { CANVAS_PADDING } from '../constants';\n\nexport interface AxisLabelsProps<TItem extends object> {\n  groups: PivotGroup<TItem>[];\n  bucketWidths: number[];\n  dimensionFilter: string | null;\n  hoveredGroup: string | null;\n  zoomLevel: number;\n  visible: boolean;\n  onHover: (key: string | null) => void;\n  onClick: (key: string) => void;\n  containerRef: React.RefObject<HTMLDivElement | null>;\n}\n\nexport function AxisLabels<TItem extends object>({\n  groups,\n  bucketWidths,\n  dimensionFilter,\n  hoveredGroup,\n  zoomLevel,\n  visible,\n  onHover,\n  onClick,\n  containerRef,\n}: AxisLabelsProps<TItem>) {\n  return (\n    <div\n      className={`pv-axis-labels ${visible ? 'visible' : 'hidden'}`}\n      ref={containerRef}\n      style={{\n        // Align labels start with grouped buckets using canvas padding scaled by zoom\n        paddingLeft: `${(CANVAS_PADDING * zoomLevel)-(20*zoomLevel)}px`,\n        overflowX: 'hidden',\n        whiteSpace: 'nowrap',\n      }}\n    >\n      {groups.map((group, index) => {\n        const isSelected = dimensionFilter === group.key;\n        const baseBucketWidth = bucketWidths[index] || 0;\n        // Apply zoom to bucket width\n        const bucketWidth = baseBucketWidth * zoomLevel;\n        // Width is just the bucket width - spacing is handled by CSS gap\n        const width = bucketWidth;\n\n        // When a dimension filter is active, mark non-selected groups as filtered-out\n        const isFilteredOut = dimensionFilter !== null && !isSelected;\n\n        return (\n          <button\n            key={group.key}\n            type=\"button\"\n            className={`pv-axis-label ${hoveredGroup === group.key ? 'highlighted' : ''} ${isSelected ? 'selected' : ''} ${isFilteredOut ? 'filtered-out' : ''}`}\n            style={{\n              width,\n            }}\n            onMouseEnter={() => onHover(group.key)}\n            onMouseLeave={() => onHover(null)}\n            onClick={() => onClick(group.key)}\n          >\n            <span className=\"pv-axis-label-text\">{group.label}</span>\n            <span className=\"pv-axis-label-count\">{group.count ?? group.items.length}</span>\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;AAkBM,SAAU,UAAU,CAAuB,EAC/C,MAAM,EACN,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,SAAS,EACT,OAAO,EACP,OAAO,EACP,OAAO,EACP,YAAY,GACW,EAAA;IACvB,QACEA,aACE,SAAS,EAAE,kBAAkB,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAA,CAAE,EAC7D,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE;AAEL,YAAA,WAAW,EAAE,CAAA,EAAG,CAAC,cAAc,GAAG,SAAS,KAAG,EAAE,GAAC,SAAS,CAAC,CAAA,EAAA,CAAI;AAC/D,YAAA,SAAS,EAAE,QAAQ;AACnB,YAAA,UAAU,EAAE,QAAQ;SACrB,EAAA,QAAA,EAEA,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,KAAI;AAC3B,YAAA,MAAM,UAAU,GAAG,eAAe,KAAK,KAAK,CAAC,GAAG;YAChD,MAAM,eAAe,GAAG,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC;AAEhD,YAAA,MAAM,WAAW,GAAG,eAAe,GAAG,SAAS;YAE/C,MAAM,KAAK,GAAG,WAAW;YAGzB,MAAM,aAAa,GAAG,eAAe,KAAK,IAAI,IAAI,CAAC,UAAU;YAE7D,QACEC,iBAEE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,CAAA,cAAA,EAAiB,YAAY,KAAK,KAAK,CAAC,GAAG,GAAG,aAAa,GAAG,EAAE,IAAI,UAAU,GAAG,UAAU,GAAG,EAAE,CAAA,CAAA,EAAI,aAAa,GAAG,cAAc,GAAG,EAAE,CAAA,CAAE,EACpJ,KAAK,EAAE;oBACL,KAAK;AACN,iBAAA,EACD,YAAY,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,EACtC,YAAY,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,EACjC,OAAO,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,EAAA,QAAA,EAAA,CAEjCD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAE,KAAK,CAAC,KAAK,EAAA,CAAQ,EACzDA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,qBAAqB,EAAA,QAAA,EAAE,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,EAAA,CAAQ,CAAA,EAAA,EAX3E,KAAK,CAAC,GAAG,CAYP;QAEb,CAAC,CAAC,EAAA,CACE;AAEV;;;;"}

package/dist/esm/PivotViewer/components/DetailPanel.d.ts

@@ -1,6 +1,8 @@
+import type { ReactNode } from 'react';
 export interface DetailPanelProps<TItem extends object> {
     selectedItem: TItem | null;
     onClose: () => void;
+    contentRenderer?: (item: TItem, onClose: () => void) => ReactNode;
 }
-export declare function DetailPanel<TItem extends object>({ selectedItem, onClose, }: DetailPanelProps<TItem>): import("react/jsx-runtime").JSX.Element;
+export declare function DetailPanel<TItem extends object>({ selectedItem, onClose, contentRenderer, }: DetailPanelProps<TItem>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=DetailPanel.d.ts.map

package/dist/esm/PivotViewer/components/DetailPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DetailPanel.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/components/DetailPanel.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,gBAAgB,CAAC,KAAK,SAAS,MAAM;IACpD,YAAY,EAAE,KAAK,GAAG,IAAI,CAAC;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,WAAW,CAAC,KAAK,SAAS,MAAM,EAAE,EAChD,YAAY,EACZ,OAAO,GACR,EAAE,gBAAgB,CAAC,KAAK,CAAC,2CA4FzB"}
+{"version":3,"file":"DetailPanel.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/components/DetailPanel.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,WAAW,gBAAgB,CAAC,KAAK,SAAS,MAAM;IACpD,YAAY,EAAE,KAAK,GAAG,IAAI,CAAC;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,IAAI,KAAK,SAAS,CAAC;CACnE;AAED,wBAAgB,WAAW,CAAC,KAAK,SAAS,MAAM,EAAE,EAChD,YAAY,EACZ,OAAO,EACP,eAAe,GAChB,EAAE,gBAAgB,CAAC,KAAK,CAAC,2CAyGzB"}

package/dist/esm/PivotViewer/components/DetailPanel.js

@@ -1,7 +1,7 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { AnimatePresence, motion } from 'framer-motion';
 
-function DetailPanel({ selectedItem, onClose, }) {
+function DetailPanel({ selectedItem, onClose, contentRenderer, }) {
     const selectedRecord = selectedItem;
     const selectedContent = selectedRecord
         ? (selectedRecord['content'] ?? {})
@@ -26,7 +26,14 @@ function DetailPanel({ selectedItem, onClose, }) {
     const causation = Array.isArray(selectedRecord?.['causation'])
         ? selectedRecord?.['causation']
         : [];
-    return (jsx(AnimatePresence, { children: selectedRecord && (jsxs(motion.aside, { className: "pv-detail-panel", initial: { x: '100%' }, animate: { x: 0 }, exit: { x: '100%' }, transition: { type: 'spring', stiffness: 400, damping: 35 }, children: [jsxs("header", { children: [jsxs("div", { children: [jsx("h2", { children: String(selectedRecord['name'] ?? selectedRecord['type'] ?? 'Event') }), selectedRecord['type'] ? jsx("p", { children: String(selectedRecord['type']) }) : null] }), jsx("button", { type: "button", onClick: onClose, title: "Close", children: "\u00D7" })] }), jsxs("div", { className: "pv-detail-panel-content", children: [metadataEntries.length > 0 && (jsxs("section", { className: "pv-detail-meta", children: [jsx("h3", { children: "Metadata" }), jsx("dl", { children: metadataEntries.map(([key, value]) => (jsxs("div", { children: [jsx("dt", { children: key }), jsx("dd", { children: String(value) })] }, key))) })] })), causation.length > 0 && (jsxs("section", { className: "pv-detail-causation", children: [jsx("h3", { children: "Causation" }), jsx("div", { className: "pv-pill-row", children: causation.map((value, index) => (jsx("span", { className: "pv-pill", children: String(value) }, `${value}-${index}`))) })] })), jsxs("section", { className: "pv-detail-content", children: [jsx("h3", { children: "Content" }), jsx("dl", { children: Object.entries(selectedContent).map(([key, value]) => (jsxs("div", { children: [jsx("dt", { children: key }), jsx("dd", { children: typeof value === 'object' ? JSON.stringify(value, null, 2) : String(value) })] }, key))) })] })] })] })) }));
+    const defaultContent = (jsxs(Fragment, { children: [metadataEntries.length > 0 && (jsxs("section", { className: "pv-detail-meta", children: [jsx("h3", { children: "Metadata" }), jsx("dl", { children: metadataEntries.map(([key, value]) => (jsxs("div", { children: [jsx("dt", { children: key }), jsx("dd", { children: String(value) })] }, key))) })] })), causation.length > 0 && (jsxs("section", { className: "pv-detail-causation", children: [jsx("h3", { children: "Causation" }), jsx("div", { className: "pv-pill-row", children: causation.map((value, index) => (jsx("span", { className: "pv-pill", children: String(value) }, `${value}-${index}`))) })] })), jsxs("section", { className: "pv-detail-content", children: [jsx("h3", { children: "Content" }), jsx("dl", { children: Object.entries(selectedContent).map(([key, value]) => (jsxs("div", { children: [jsx("dt", { children: key }), jsx("dd", { children: typeof value === 'object' ? JSON.stringify(value, null, 2) : String(value) })] }, key))) })] })] }));
+    const customContent = contentRenderer && selectedRecord ? contentRenderer(selectedRecord, onClose) : null;
+    return (jsx(AnimatePresence, { mode: "wait", children: selectedRecord && (jsxs(motion.aside, { className: "pv-detail-panel", initial: { x: '100%' }, animate: { x: 0 }, exit: { x: '100%' }, transition: {
+                type: 'spring',
+                stiffness: 120,
+                damping: 20,
+                mass: 1,
+            }, children: [jsxs("header", { children: [jsxs("div", { children: [jsx("h2", { children: String(selectedRecord['name'] ?? selectedRecord['type'] ?? 'Event') }), selectedRecord['type'] ? jsx("p", { children: String(selectedRecord['type']) }) : null] }), jsx("button", { type: "button", onClick: onClose, title: "Close", children: "\u00D7" })] }), jsx("div", { className: "pv-detail-panel-content", children: customContent ?? defaultContent })] })) }));
 }
 
 export { DetailPanel };

package/dist/esm/PivotViewer/components/DetailPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"DetailPanel.js","sources":["../../../../PivotViewer/components/DetailPanel.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { AnimatePresence, motion } from 'framer-motion';\n\ntype WithRecord<TItem> = TItem extends Record<string, unknown> ? TItem : never;\n\nexport interface DetailPanelProps<TItem extends object> {\n  selectedItem: TItem | null;\n  onClose: () => void;\n}\n\nexport function DetailPanel<TItem extends object>({\n  selectedItem,\n  onClose,\n}: DetailPanelProps<TItem>) {\n  const selectedRecord = selectedItem as WithRecord<TItem> | null;\n\n  const selectedContent = selectedRecord\n    ? ((selectedRecord['content'] as Record<string, unknown> | undefined) ?? {})\n    : {};\n\n  const metadataEntries = selectedRecord\n    ? (\n        [\n          ['Type', selectedRecord['type']],\n          [\n            'Occurred',\n            selectedRecord['occurred'] instanceof Date\n              ? (selectedRecord['occurred'] as Date).toLocaleString()\n              : selectedRecord['occurred']\n              ? new Date(String(selectedRecord['occurred'])).toLocaleString()\n              : undefined,\n          ],\n          ['Service', selectedRecord['service']],\n          ['Environment', selectedRecord['environment']],\n          ['Tenant', selectedRecord['tenant']],\n          ['Correlation Id', selectedRecord['correlationId']],\n        ] as Array<[string, unknown]>\n      ).filter(([, value]) => value !== undefined && value !== null)\n    : [];\n\n  const causation = Array.isArray(selectedRecord?.['causation'])\n    ? (selectedRecord?.['causation'] as unknown[])\n    : [];\n\n  return (\n    <AnimatePresence>\n      {selectedRecord && (\n        <motion.aside\n          className=\"pv-detail-panel\"\n          initial={{ x: '100%' }}\n          animate={{ x: 0 }}\n          exit={{ x: '100%' }}\n          transition={{ type: 'spring', stiffness: 400, damping: 35 }}\n        >\n          <header>\n            <div>\n              <h2>{String(selectedRecord['name'] ?? selectedRecord['type'] ?? 'Event')}</h2>\n              {selectedRecord['type'] ? <p>{String(selectedRecord['type'])}</p> : null}\n            </div>\n            <button type=\"button\" onClick={onClose} title=\"Close\">\n              ×\n            </button>\n          </header>\n          <div className=\"pv-detail-panel-content\">\n            {metadataEntries.length > 0 && (\n              <section className=\"pv-detail-meta\">\n                <h3>Metadata</h3>\n                <dl>\n                  {metadataEntries.map(([key, value]) => (\n                    <div key={key}>\n                      <dt>{key}</dt>\n                      <dd>{String(value)}</dd>\n                    </div>\n                  ))}\n                </dl>\n              </section>\n            )}\n            {causation.length > 0 && (\n              <section className=\"pv-detail-causation\">\n                <h3>Causation</h3>\n                <div className=\"pv-pill-row\">\n                  {causation.map((value, index) => (\n                    <span key={`${value}-${index}`} className=\"pv-pill\">\n                      {String(value)}\n                    </span>\n                  ))}\n                </div>\n              </section>\n            )}\n            <section className=\"pv-detail-content\">\n              <h3>Content</h3>\n              <dl>\n                {Object.entries(selectedContent).map(([key, value]) => (\n                  <div key={key}>\n                    <dt>{key}</dt>\n                    <dd>{typeof value === 'object' ? JSON.stringify(value, null, 2) : String(value)}</dd>\n                  </div>\n                ))}\n              </dl>\n            </section>\n          </div>\n        </motion.aside>\n      )}\n    </AnimatePresence>\n  );\n}\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"DetailPanel.js","sources":["../../../../PivotViewer/components/DetailPanel.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { AnimatePresence, motion } from 'framer-motion';\nimport type { ReactNode } from 'react';\n\ntype WithRecord<TItem> = TItem extends Record<string, unknown> ? TItem : never;\n\nexport interface DetailPanelProps<TItem extends object> {\n  selectedItem: TItem | null;\n  onClose: () => void;\n  /** Custom renderer for the detail content area. The drawer shell (header, close button, layout) remains owned by the component. */\n  contentRenderer?: (item: TItem, onClose: () => void) => ReactNode;\n}\n\nexport function DetailPanel<TItem extends object>({\n  selectedItem,\n  onClose,\n  contentRenderer,\n}: DetailPanelProps<TItem>) {\n  const selectedRecord = selectedItem as WithRecord<TItem> | null;\n\n  const selectedContent = selectedRecord\n    ? ((selectedRecord['content'] as Record<string, unknown> | undefined) ?? {})\n    : {};\n\n  const metadataEntries = selectedRecord\n    ? (\n        [\n          ['Type', selectedRecord['type']],\n          [\n            'Occurred',\n            selectedRecord['occurred'] instanceof Date\n              ? (selectedRecord['occurred'] as Date).toLocaleString()\n              : selectedRecord['occurred']\n              ? new Date(String(selectedRecord['occurred'])).toLocaleString()\n              : undefined,\n          ],\n          ['Service', selectedRecord['service']],\n          ['Environment', selectedRecord['environment']],\n          ['Tenant', selectedRecord['tenant']],\n          ['Correlation Id', selectedRecord['correlationId']],\n        ] as Array<[string, unknown]>\n      ).filter(([, value]) => value !== undefined && value !== null)\n    : [];\n\n  const causation = Array.isArray(selectedRecord?.['causation'])\n    ? (selectedRecord?.['causation'] as unknown[])\n    : [];\n\n  const defaultContent = (\n    <>\n      {metadataEntries.length > 0 && (\n        <section className=\"pv-detail-meta\">\n          <h3>Metadata</h3>\n          <dl>\n            {metadataEntries.map(([key, value]) => (\n              <div key={key}>\n                <dt>{key}</dt>\n                <dd>{String(value)}</dd>\n              </div>\n            ))}\n          </dl>\n        </section>\n      )}\n      {causation.length > 0 && (\n        <section className=\"pv-detail-causation\">\n          <h3>Causation</h3>\n          <div className=\"pv-pill-row\">\n            {causation.map((value, index) => (\n              <span key={`${value}-${index}`} className=\"pv-pill\">\n                {String(value)}\n              </span>\n            ))}\n          </div>\n        </section>\n      )}\n      <section className=\"pv-detail-content\">\n        <h3>Content</h3>\n        <dl>\n          {Object.entries(selectedContent).map(([key, value]) => (\n            <div key={key}>\n              <dt>{key}</dt>\n              <dd>{typeof value === 'object' ? JSON.stringify(value, null, 2) : String(value)}</dd>\n            </div>\n          ))}\n        </dl>\n      </section>\n    </>\n  );\n\n  const customContent = contentRenderer && selectedRecord ? contentRenderer(selectedRecord, onClose) : null;\n\n  return (\n    <AnimatePresence mode=\"wait\">\n      {selectedRecord && (\n        <motion.aside\n          className=\"pv-detail-panel\"\n          initial={{ x: '100%' }}\n          animate={{ x: 0 }}\n          exit={{ x: '100%' }}\n          transition={{\n            type: 'spring',\n            stiffness: 120,\n            damping: 20,\n            mass: 1,\n          }}\n        >\n          <header>\n            <div>\n              <h2>{String(selectedRecord['name'] ?? selectedRecord['type'] ?? 'Event')}</h2>\n              {selectedRecord['type'] ? <p>{String(selectedRecord['type'])}</p> : null}\n            </div>\n            <button type=\"button\" onClick={onClose} title=\"Close\">\n              ×\n            </button>\n          </header>\n          <div className=\"pv-detail-panel-content\">\n            {customContent ?? defaultContent}\n          </div>\n        </motion.aside>\n      )}\n    </AnimatePresence>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/PivotViewer/components/PivotCanvas.d.ts

@@ -1,4 +1,3 @@
-import { type ReactNode } from 'react';
 import type { ItemId, LayoutResult, GroupingResult } from '../engine/types';
 import type { ViewMode } from './Toolbar';
 export interface PivotCanvasProps<TItem extends object> {
@@ -17,7 +16,11 @@ export interface PivotCanvasProps<TItem extends object> {
     hoveredGroupIndex: number | null;
     viewMode: ViewMode;
     isZooming?: boolean;
-    cardRenderer?: (item: TItem) => ReactNode;
+    cardRenderer: (item: TItem) => {
+        title: string;
+        labels: string[];
+        values: string[];
+    };
     resolveId: (item: TItem, index: number) => string | number;
     onCardClick: (item: TItem, e: MouseEvent, id: number | string) => void;
     onPanStart: (e: React.MouseEvent) => void;

package/dist/esm/PivotViewer/components/PivotCanvas.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PivotCanvas.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/components/PivotCanvas.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAwC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7E,OAAO,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAC5E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAQ1C,MAAM,WAAW,gBAAgB,CAAC,KAAK,SAAS,MAAM;IAEpD,KAAK,EAAE,KAAK,EAAE,CAAC;IAGf,MAAM,EAAE,YAAY,CAAC;IAGrB,QAAQ,EAAE,cAAc,CAAC;IAGzB,UAAU,EAAE,WAAW,CAAC;IAGxB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IAGnB,SAAS,EAAE,MAAM,CAAC;IAGlB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IAGb,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IAGvB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAG1B,iBAAiB,EAAE,MAAM,GAAG,IAAI,CAAC;IAGjC,QAAQ,EAAE,QAAQ,CAAC;IAGnB,SAAS,CAAC,EAAE,OAAO,CAAC;IAGpB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,SAAS,CAAC;IAG1C,SAAS,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAAC;IAG3D,WAAW,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAGvE,UAAU,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACtD;AAMD,wBAAgB,WAAW,CAAC,KAAK,SAAS,MAAM,EAAE,EAChD,KAAK,EACL,MAAM,EACN,QAAQ,EACR,UAAU,EACV,SAAS,EACT,UAAU,EACV,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,aAAa,EACb,cAAc,EACd,UAAU,EACV,iBAAiB,EACjB,SAAS,EAAE,UAAkB,EAC7B,SAAS,EAAE,UAAU,EACrB,WAAW,EACX,UAAU,EACV,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,YAAY,GACb,EAAE,gBAAgB,CAAC,KAAK,CAAC,QA0kBzB"}
+{"version":3,"file":"PivotCanvas.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/components/PivotCanvas.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAC5E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAQ1C,MAAM,WAAW,gBAAgB,CAAC,KAAK,SAAS,MAAM;IAEpD,KAAK,EAAE,KAAK,EAAE,CAAC;IAGf,MAAM,EAAE,YAAY,CAAC;IAGrB,QAAQ,EAAE,cAAc,CAAC;IAGzB,UAAU,EAAE,WAAW,CAAC;IAGxB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IAGnB,SAAS,EAAE,MAAM,CAAC;IAGlB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IAGb,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IAGvB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAG1B,iBAAiB,EAAE,MAAM,GAAG,IAAI,CAAC;IAGjC,QAAQ,EAAE,QAAQ,CAAC;IAGnB,SAAS,CAAC,EAAE,OAAO,CAAC;IAGpB,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,EAAE,CAAC;QAAC,MAAM,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC;IAGrF,SAAS,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAAC;IAG3D,WAAW,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAGvE,UAAU,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACzC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACtD;AAMD,wBAAgB,WAAW,CAAC,KAAK,SAAS,MAAM,EAAE,EAChD,KAAK,EACL,MAAM,EACN,QAAQ,EACR,UAAU,EACV,SAAS,EACT,UAAU,EACV,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,aAAa,EACb,cAAc,EACd,UAAU,EACV,iBAAiB,EACjB,SAAS,EAAE,UAAkB,EAC7B,SAAS,EAAE,UAAU,EACrB,WAAW,EACX,UAAU,EACV,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,YAAY,GACb,EAAE,gBAAgB,CAAC,KAAK,CAAC,QAknBzB"}