@cratis/components 1.4.0 → 1.4.1
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.
- package/dist/cjs/CommandForm/fields/ColorPickerField.js +5 -1
- package/dist/cjs/CommandForm/fields/ColorPickerField.js.map +1 -1
- package/dist/cjs/PivotViewer/PivotViewer.css +8 -2
- package/dist/cjs/PivotViewer/PivotViewer.js +3 -0
- package/dist/cjs/PivotViewer/PivotViewer.js.map +1 -1
- package/dist/cjs/PivotViewer/engine/layout.js +2 -2
- package/dist/cjs/PivotViewer/engine/layout.js.map +1 -1
- package/dist/cjs/PivotViewer/hooks/useCardSelection.js +4 -4
- package/dist/cjs/PivotViewer/hooks/useCardSelection.js.map +1 -1
- package/dist/cjs/PivotViewer/hooks/useDetailPanelClose.js +3 -3
- package/dist/cjs/PivotViewer/hooks/useDetailPanelClose.js.map +1 -1
- package/dist/cjs/PivotViewer/hooks/useWheelZoom.js +8 -1
- package/dist/cjs/PivotViewer/hooks/useWheelZoom.js.map +1 -1
- package/dist/cjs/PivotViewer/utils/selection.js +22 -2
- package/dist/cjs/PivotViewer/utils/selection.js.map +1 -1
- package/dist/esm/CommandDialog/CommandDialog.stories.d.ts.map +1 -1
- package/dist/esm/CommandDialog/CommandDialog.stories.js +129 -142
- package/dist/esm/CommandDialog/CommandDialog.stories.js.map +1 -1
- package/dist/esm/CommandForm/fields/ColorPickerField.d.ts.map +1 -1
- package/dist/esm/CommandForm/fields/ColorPickerField.js +5 -1
- package/dist/esm/CommandForm/fields/ColorPickerField.js.map +1 -1
- package/dist/esm/Dialogs/Dialog.stories.d.ts.map +1 -1
- package/dist/esm/Dialogs/Dialog.stories.js +15 -16
- package/dist/esm/Dialogs/Dialog.stories.js.map +1 -1
- package/dist/esm/ObjectNavigationalBar/ObjectNavigationalBar.stories.d.ts.map +1 -1
- package/dist/esm/ObjectNavigationalBar/ObjectNavigationalBar.stories.js +12 -13
- package/dist/esm/ObjectNavigationalBar/ObjectNavigationalBar.stories.js.map +1 -1
- package/dist/esm/PivotViewer/PivotViewer.css +8 -2
- package/dist/esm/PivotViewer/PivotViewer.d.ts.map +1 -1
- package/dist/esm/PivotViewer/PivotViewer.js +3 -0
- package/dist/esm/PivotViewer/PivotViewer.js.map +1 -1
- package/dist/esm/PivotViewer/PivotViewer.stories.d.ts +1 -0
- package/dist/esm/PivotViewer/PivotViewer.stories.d.ts.map +1 -1
- package/dist/esm/PivotViewer/PivotViewer.stories.js +177 -0
- package/dist/esm/PivotViewer/PivotViewer.stories.js.map +1 -1
- package/dist/esm/PivotViewer/engine/layout.js +2 -2
- package/dist/esm/PivotViewer/engine/layout.js.map +1 -1
- package/dist/esm/PivotViewer/hooks/useCardSelection.d.ts +4 -1
- package/dist/esm/PivotViewer/hooks/useCardSelection.d.ts.map +1 -1
- package/dist/esm/PivotViewer/hooks/useCardSelection.js +4 -4
- package/dist/esm/PivotViewer/hooks/useCardSelection.js.map +1 -1
- package/dist/esm/PivotViewer/hooks/useDetailPanelClose.d.ts +3 -1
- package/dist/esm/PivotViewer/hooks/useDetailPanelClose.d.ts.map +1 -1
- package/dist/esm/PivotViewer/hooks/useDetailPanelClose.js +3 -3
- package/dist/esm/PivotViewer/hooks/useDetailPanelClose.js.map +1 -1
- package/dist/esm/PivotViewer/hooks/useWheelZoom.d.ts.map +1 -1
- package/dist/esm/PivotViewer/hooks/useWheelZoom.js +8 -1
- package/dist/esm/PivotViewer/hooks/useWheelZoom.js.map +1 -1
- package/dist/esm/PivotViewer/utils/selection.d.ts.map +1 -1
- package/dist/esm/PivotViewer/utils/selection.js +23 -3
- package/dist/esm/PivotViewer/utils/selection.js.map +1 -1
- package/dist/esm/SchemaEditor/SchemaEditor.stories.d.ts.map +1 -1
- package/dist/esm/SchemaEditor/SchemaEditor.stories.js +7 -8
- package/dist/esm/SchemaEditor/SchemaEditor.stories.js.map +1 -1
- package/dist/esm/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCardSelection.js","sources":["../../../../PivotViewer/hooks/useCardSelection.ts"],"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 } from 'react';\nimport { handleCardSelection } from '../utils/selection';\nimport type { Layout } from '../utils/cardPosition';\nimport type { ViewMode } from '../components/Toolbar';\nimport {\n getCardPositionFromLayout,\n normalizeIdToLayoutKey,\n type CardPosition,\n} from '../utils/idResolution';\nimport { createCardPositionCallbacks } from '../utils/cardPosition';\nimport { ZOOM_MAX, MIN_ZOOM_ON_SELECT, ZOOM_MULTIPLIER, BASE_CARD_WIDTH, BASE_CARD_HEIGHT } from '../utils/constants';\n\ninterface UseCardSelectionParams<TItem extends object> {\n data: TItem[];\n isPanning: boolean;\n selectedItem: TItem | null;\n zoomLevel: number;\n viewMode: ViewMode;\n layout: Layout;\n containerDimensions: { width: number; height: number };\n scrollPosition: { x: number; y: number };\n preSelectionState: { zoom: number; scrollLeft: number; scrollTop: number } | null;\n grouping: unknown;\n getItemId?: (item: TItem, index: number) => string | number;\n resolveId: (item: TItem, index: number) => string | number;\n setZoomLevel: (level: number) => void;\n setIsZooming: (zooming: boolean) => void;\n setSelectedItem: (item: TItem | null) => void;\n setPreSelectionState: (state: { zoom: number; scrollLeft: number; scrollTop: number } | null) => void;\n}\n\nexport function useCardSelection<TItem extends object>({\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}: UseCardSelectionParams<TItem>) {\n return useCallback((item: TItem, e: MouseEvent, id?: number | string) => {\n if (isPanning) return;\n\n //
|
|
1
|
+
{"version":3,"file":"useCardSelection.js","sources":["../../../../PivotViewer/hooks/useCardSelection.ts"],"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 } from 'react';\nimport type React from 'react';\nimport { handleCardSelection } from '../utils/selection';\nimport type { Layout } from '../utils/cardPosition';\nimport type { ViewMode } from '../components/Toolbar';\nimport {\n getCardPositionFromLayout,\n normalizeIdToLayoutKey,\n type CardPosition,\n} from '../utils/idResolution';\nimport { createCardPositionCallbacks } from '../utils/cardPosition';\nimport { ZOOM_MAX, MIN_ZOOM_ON_SELECT, ZOOM_MULTIPLIER, BASE_CARD_WIDTH, BASE_CARD_HEIGHT } from '../utils/constants';\n\ninterface UseCardSelectionParams<TItem extends object> {\n data: TItem[];\n isPanning: boolean;\n selectedItem: TItem | null;\n zoomLevel: number;\n viewMode: ViewMode;\n layout: Layout;\n containerRef: React.RefObject<HTMLDivElement | null>;\n spacerRef: React.RefObject<HTMLDivElement | null>;\n containerDimensions: { width: number; height: number };\n scrollPosition: { x: number; y: number };\n preSelectionState: { zoom: number; scrollLeft: number; scrollTop: number } | null;\n grouping: unknown;\n getItemId?: (item: TItem, index: number) => string | number;\n resolveId: (item: TItem, index: number) => string | number;\n setZoomLevel: (level: number) => void;\n setIsZooming: (zooming: boolean) => void;\n setSelectedItem: (item: TItem | null) => void;\n setPreSelectionState: (state: { zoom: number; scrollLeft: number; scrollTop: number } | null) => void;\n}\n\nexport function useCardSelection<TItem extends object>({\n data,\n isPanning,\n selectedItem,\n zoomLevel,\n viewMode,\n layout,\n containerRef,\n spacerRef,\n containerDimensions,\n scrollPosition,\n preSelectionState,\n grouping,\n getItemId,\n resolveId,\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n}: UseCardSelectionParams<TItem>) {\n return useCallback((item: TItem, e: MouseEvent, id?: number | string) => {\n if (isPanning) return;\n\n // Use the containerRef directly as the scrollable viewport\n const container = containerRef.current;\n if (!container) return;\n\n // Resolve item ID\n let itemId = (id !== undefined && id !== null) ? id : resolveId(item, 0);\n itemId = normalizeIdToLayoutKey(itemId, layout);\n\n const selectedId = selectedItem\n ? (() => {\n const index = data.indexOf(selectedItem);\n const rawSelectedId = index !== -1 ? resolveId(selectedItem, index) : resolveId(selectedItem, 0);\n return normalizeIdToLayoutKey(rawSelectedId, layout);\n })()\n : null;\n\n // Get card position from layout\n const cardPosition = getCardPositionFromLayout(itemId, layout, BASE_CARD_WIDTH, BASE_CARD_HEIGHT);\n\n // Calculate target position for animation\n let targetCardPosition: CardPosition | null = null;\n let callbacks = { getCardPositionAtZoom: null as unknown as ((zoom: number) => CardPosition | null), getLayoutSizeAtZoom: null as unknown as ((zoom: number) => { width: number; height: number }) };\n let targetTotalHeight = layout.totalHeight;\n\n if (viewMode === 'grouped' && cardPosition) {\n // Calculate target zoom\n const targetZoom = Math.min(ZOOM_MAX, Math.max(MIN_ZOOM_ON_SELECT, zoomLevel * ZOOM_MULTIPLIER));\n\n const targetContainerWidth = containerDimensions.width / targetZoom;\n const targetContainerHeight = containerDimensions.height;\n\n callbacks = createCardPositionCallbacks(\n itemId,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n grouping as unknown as any,\n viewMode,\n targetContainerWidth,\n targetContainerHeight,\n );\n\n const targetPosition = callbacks.getCardPositionAtZoom(targetZoom);\n if (targetPosition) {\n targetCardPosition = targetPosition;\n }\n\n const targetLayout = callbacks.getLayoutSizeAtZoom(targetZoom);\n targetTotalHeight = targetLayout.height;\n }\n\n handleCardSelection({\n item,\n itemId,\n selectedItemId: selectedId,\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom: callbacks.getCardPositionAtZoom,\n getLayoutSizeAtZoom: callbacks.getLayoutSizeAtZoom,\n spacer: spacerRef.current,\n preSelectionState,\n startScrollPosition: { x: scrollPosition.x, y: scrollPosition.y },\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n viewMode,\n zoomLevel,\n totalHeight: targetTotalHeight,\n });\n }, [isPanning, selectedItem, zoomLevel, preSelectionState, viewMode, resolveId, setZoomLevel, layout, grouping, containerRef, spacerRef, containerDimensions, scrollPosition, data, getItemId]);\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type React from 'react';
|
|
1
2
|
import type { Layout } from '../utils/cardPosition';
|
|
2
3
|
import type { ViewMode } from '../components/Toolbar';
|
|
3
4
|
interface UseDetailPanelCloseParams<TItem extends object> {
|
|
@@ -10,6 +11,7 @@ interface UseDetailPanelCloseParams<TItem extends object> {
|
|
|
10
11
|
zoomLevel: number;
|
|
11
12
|
viewMode: ViewMode;
|
|
12
13
|
layout: Layout;
|
|
14
|
+
containerRef: React.RefObject<HTMLDivElement | null>;
|
|
13
15
|
containerDimensions: {
|
|
14
16
|
width: number;
|
|
15
17
|
height: number;
|
|
@@ -22,6 +24,6 @@ interface UseDetailPanelCloseParams<TItem extends object> {
|
|
|
22
24
|
setSelectedItem: (item: TItem | null) => void;
|
|
23
25
|
setPreSelectionState: (state: null) => void;
|
|
24
26
|
}
|
|
25
|
-
export declare function useDetailPanelClose<TItem extends object>({ selectedItem, preSelectionState, zoomLevel, viewMode, layout, containerDimensions, grouping, data, resolveId, setZoomLevel, setIsZooming, setSelectedItem, setPreSelectionState, }: UseDetailPanelCloseParams<TItem>): () => void;
|
|
27
|
+
export declare function useDetailPanelClose<TItem extends object>({ selectedItem, preSelectionState, zoomLevel, viewMode, layout, containerRef, containerDimensions, grouping, data, resolveId, setZoomLevel, setIsZooming, setSelectedItem, setPreSelectionState, }: UseDetailPanelCloseParams<TItem>): () => void;
|
|
26
28
|
export {};
|
|
27
29
|
//# sourceMappingURL=useDetailPanelClose.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDetailPanelClose.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/hooks/useDetailPanelClose.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useDetailPanelClose.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/hooks/useDetailPanelClose.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAQtD,UAAU,yBAAyB,CAAC,KAAK,SAAS,MAAM;IACpD,YAAY,EAAE,KAAK,GAAG,IAAI,CAAC;IAC3B,iBAAiB,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAClF,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,QAAQ,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACrD,mBAAmB,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACvD,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,KAAK,EAAE,CAAC;IACd,SAAS,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAAC;IAC3D,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,eAAe,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9C,oBAAoB,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;CAC/C;AAED,wBAAgB,mBAAmB,CAAC,KAAK,SAAS,MAAM,EAAE,EACtD,YAAY,EACZ,iBAAiB,EACjB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,YAAY,EACZ,mBAAmB,EACnB,QAAQ,EACR,IAAI,EACJ,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,eAAe,EACf,oBAAoB,GACvB,EAAE,yBAAyB,CAAC,KAAK,CAAC,cA2ElC"}
|
|
@@ -4,9 +4,9 @@ import { normalizeIdToLayoutKey, getCardPositionFromLayout } from '../utils/idRe
|
|
|
4
4
|
import { createCardPositionCallbacks } from '../utils/cardPosition.js';
|
|
5
5
|
import { BASE_CARD_HEIGHT, BASE_CARD_WIDTH } from '../utils/constants.js';
|
|
6
6
|
|
|
7
|
-
function useDetailPanelClose({ selectedItem, preSelectionState, zoomLevel, viewMode, layout, containerDimensions, grouping, data, resolveId, setZoomLevel, setIsZooming, setSelectedItem, setPreSelectionState, }) {
|
|
7
|
+
function useDetailPanelClose({ selectedItem, preSelectionState, zoomLevel, viewMode, layout, containerRef, containerDimensions, grouping, data, resolveId, setZoomLevel, setIsZooming, setSelectedItem, setPreSelectionState, }) {
|
|
8
8
|
return useCallback(() => {
|
|
9
|
-
const container =
|
|
9
|
+
const container = containerRef.current;
|
|
10
10
|
if (!container || !selectedItem) {
|
|
11
11
|
setSelectedItem(null);
|
|
12
12
|
return;
|
|
@@ -54,7 +54,7 @@ function useDetailPanelClose({ selectedItem, preSelectionState, zoomLevel, viewM
|
|
|
54
54
|
setPreSelectionState(null);
|
|
55
55
|
},
|
|
56
56
|
});
|
|
57
|
-
}, [preSelectionState, selectedItem, zoomLevel, viewMode, resolveId, setZoomLevel, layout, grouping, containerDimensions, data, setSelectedItem, setPreSelectionState, setIsZooming]);
|
|
57
|
+
}, [preSelectionState, selectedItem, zoomLevel, viewMode, resolveId, setZoomLevel, layout, grouping, containerRef, containerDimensions, data, setSelectedItem, setPreSelectionState, setIsZooming]);
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
export { useDetailPanelClose };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDetailPanelClose.js","sources":["../../../../PivotViewer/hooks/useDetailPanelClose.ts"],"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 } from 'react';\nimport { animateZoomAndScroll, smoothScrollTo } from '../utils/animations';\nimport type { Layout } from '../utils/cardPosition';\nimport type { ViewMode } from '../components/Toolbar';\nimport {\n getCardPositionFromLayout,\n normalizeIdToLayoutKey,\n} from '../utils/idResolution';\nimport { createCardPositionCallbacks } from '../utils/cardPosition';\nimport { BASE_CARD_WIDTH, BASE_CARD_HEIGHT } from '../utils/constants';\n\ninterface UseDetailPanelCloseParams<TItem extends object> {\n selectedItem: TItem | null;\n preSelectionState: { zoom: number; scrollLeft: number; scrollTop: number } | null;\n zoomLevel: number;\n viewMode: ViewMode;\n layout: Layout;\n containerDimensions: { width: number; height: number };\n grouping: unknown;\n data: TItem[];\n resolveId: (item: TItem, index: number) => string | number;\n setZoomLevel: (level: number) => void;\n setIsZooming: (zooming: boolean) => void;\n setSelectedItem: (item: TItem | null) => void;\n setPreSelectionState: (state: null) => void;\n}\n\nexport function useDetailPanelClose<TItem extends object>({\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}: UseDetailPanelCloseParams<TItem>) {\n return useCallback(() => {\n //
|
|
1
|
+
{"version":3,"file":"useDetailPanelClose.js","sources":["../../../../PivotViewer/hooks/useDetailPanelClose.ts"],"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 } from 'react';\nimport type React from 'react';\nimport { animateZoomAndScroll, smoothScrollTo } from '../utils/animations';\nimport type { Layout } from '../utils/cardPosition';\nimport type { ViewMode } from '../components/Toolbar';\nimport {\n getCardPositionFromLayout,\n normalizeIdToLayoutKey,\n} from '../utils/idResolution';\nimport { createCardPositionCallbacks } from '../utils/cardPosition';\nimport { BASE_CARD_WIDTH, BASE_CARD_HEIGHT } from '../utils/constants';\n\ninterface UseDetailPanelCloseParams<TItem extends object> {\n selectedItem: TItem | null;\n preSelectionState: { zoom: number; scrollLeft: number; scrollTop: number } | null;\n zoomLevel: number;\n viewMode: ViewMode;\n layout: Layout;\n containerRef: React.RefObject<HTMLDivElement | null>;\n containerDimensions: { width: number; height: number };\n grouping: unknown;\n data: TItem[];\n resolveId: (item: TItem, index: number) => string | number;\n setZoomLevel: (level: number) => void;\n setIsZooming: (zooming: boolean) => void;\n setSelectedItem: (item: TItem | null) => void;\n setPreSelectionState: (state: null) => void;\n}\n\nexport function useDetailPanelClose<TItem extends object>({\n selectedItem,\n preSelectionState,\n zoomLevel,\n viewMode,\n layout,\n containerRef,\n containerDimensions,\n grouping,\n data,\n resolveId,\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n}: UseDetailPanelCloseParams<TItem>) {\n return useCallback(() => {\n // Use the containerRef directly as the scrollable viewport\n const container = containerRef.current;\n if (!container || !selectedItem) {\n setSelectedItem(null);\n return;\n }\n\n // Resolve item ID\n const index = data.indexOf(selectedItem);\n let itemId: string | number = index !== -1 ? index : resolveId(selectedItem, 0);\n itemId = normalizeIdToLayoutKey(itemId, layout);\n\n // Get card position from layout\n const cardPosition = getCardPositionFromLayout(itemId, layout, BASE_CARD_WIDTH, BASE_CARD_HEIGHT);\n\n if (!preSelectionState) {\n setSelectedItem(null);\n return;\n }\n\n // Collection mode: just scroll back\n if (viewMode === 'collection') {\n setSelectedItem(null);\n smoothScrollTo(container, preSelectionState.scrollLeft, preSelectionState.scrollTop, true);\n setPreSelectionState(null);\n return;\n }\n\n // Grouped mode: check if zoom changed\n const zoomChanged = Math.abs(preSelectionState.zoom - zoomLevel) > 0.001;\n\n if (!zoomChanged || !cardPosition) {\n setSelectedItem(null);\n smoothScrollTo(container, preSelectionState.scrollLeft, preSelectionState.scrollTop, true);\n setPreSelectionState(null);\n return;\n }\n\n // Calculate target position for animation (zooming out)\n const targetZoom = preSelectionState.zoom;\n const targetContainerWidth = containerDimensions.width / targetZoom;\n const targetContainerHeight = containerDimensions.height;\n\n const callbacks = createCardPositionCallbacks(\n itemId,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n grouping as unknown as any,\n viewMode,\n targetContainerWidth,\n targetContainerHeight,\n );\n\n const targetCardPosition = callbacks.getCardPositionAtZoom(targetZoom);\n\n setIsZooming(true);\n\n animateZoomAndScroll({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom: callbacks.getCardPositionAtZoom,\n startZoom: zoomLevel,\n targetZoom,\n targetScrollLeft: preSelectionState.scrollLeft,\n targetScrollTop: preSelectionState.scrollTop,\n onUpdate: setZoomLevel,\n onComplete: () => {\n setIsZooming(false);\n setSelectedItem(null);\n setPreSelectionState(null);\n },\n });\n }, [preSelectionState, selectedItem, zoomLevel, viewMode, resolveId, setZoomLevel, layout, grouping, containerRef, containerDimensions, data, setSelectedItem, setPreSelectionState, setIsZooming]);\n}\n"],"names":[],"mappings":";;;;;;AAgCM,SAAU,mBAAmB,CAAuB,EACtD,YAAY,EACZ,iBAAiB,EACjB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,YAAY,EACZ,mBAAmB,EACnB,QAAQ,EACR,IAAI,EACJ,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,eAAe,EACf,oBAAoB,GACW,EAAA;IAC/B,OAAO,WAAW,CAAC,MAAK;AAEpB,QAAA,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO;AACtC,QAAA,IAAI,CAAC,SAAS,IAAI,CAAC,YAAY,EAAE;YAC7B,eAAe,CAAC,IAAI,CAAC;YACrB;QACJ;QAGA,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC;AACxC,QAAA,IAAI,MAAM,GAAoB,KAAK,KAAK,EAAE,GAAG,KAAK,GAAG,SAAS,CAAC,YAAY,EAAE,CAAC,CAAC;AAC/E,QAAA,MAAM,GAAG,sBAAsB,CAAC,MAAM,EAAE,MAAM,CAAC;AAG/C,QAAA,MAAM,YAAY,GAAG,yBAAyB,CAAC,MAAM,EAAE,MAAM,EAAE,eAAe,EAAE,gBAAgB,CAAC;QAEjG,IAAI,CAAC,iBAAiB,EAAE;YACpB,eAAe,CAAC,IAAI,CAAC;YACrB;QACJ;AAGA,QAAA,IAAI,QAAQ,KAAK,YAAY,EAAE;YAC3B,eAAe,CAAC,IAAI,CAAC;AACrB,YAAA,cAAc,CAAC,SAAS,EAAE,iBAAiB,CAAC,UAAU,EAAE,iBAAiB,CAAC,SAAS,EAAE,IAAI,CAAC;YAC1F,oBAAoB,CAAC,IAAI,CAAC;YAC1B;QACJ;AAGA,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,IAAI,GAAG,SAAS,CAAC,GAAG,KAAK;AAExE,QAAA,IAAI,CAAC,WAAW,IAAI,CAAC,YAAY,EAAE;YAC/B,eAAe,CAAC,IAAI,CAAC;AACrB,YAAA,cAAc,CAAC,SAAS,EAAE,iBAAiB,CAAC,UAAU,EAAE,iBAAiB,CAAC,SAAS,EAAE,IAAI,CAAC;YAC1F,oBAAoB,CAAC,IAAI,CAAC;YAC1B;QACJ;AAGA,QAAA,MAAM,UAAU,GAAG,iBAAiB,CAAC,IAAI;AACzC,QAAA,MAAM,oBAAoB,GAAG,mBAAmB,CAAC,KAAK,GAAG,UAAU;AACnE,QAAA,MAAM,qBAAqB,GAAG,mBAAmB,CAAC,MAAM;AAExD,QAAA,MAAM,SAAS,GAAG,2BAA2B,CACzC,MAAM,EAEN,QAA0B,EAC1B,QAAQ,EACR,oBAAoB,EACpB,qBAAqB,CACxB;QAED,MAAM,kBAAkB,GAAG,SAAS,CAAC,qBAAqB,CAAC,UAAU,CAAC;QAEtE,YAAY,CAAC,IAAI,CAAC;AAElB,QAAA,oBAAoB,CAAC;YACjB,SAAS;YACT,YAAY;YACZ,kBAAkB;YAClB,qBAAqB,EAAE,SAAS,CAAC,qBAAqB;AACtD,YAAA,SAAS,EAAE,SAAS;YACpB,UAAU;YACV,gBAAgB,EAAE,iBAAiB,CAAC,UAAU;YAC9C,eAAe,EAAE,iBAAiB,CAAC,SAAS;AAC5C,YAAA,QAAQ,EAAE,YAAY;YACtB,UAAU,EAAE,MAAK;gBACb,YAAY,CAAC,KAAK,CAAC;gBACnB,eAAe,CAAC,IAAI,CAAC;gBACrB,oBAAoB,CAAC,IAAI,CAAC;YAC9B,CAAC;AACJ,SAAA,CAAC;AACN,IAAA,CAAC,EAAE,CAAC,iBAAiB,EAAE,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,mBAAmB,EAAE,IAAI,EAAE,eAAe,EAAE,oBAAoB,EAAE,YAAY,CAAC,CAAC;AACvM;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useWheelZoom.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/hooks/useWheelZoom.ts"],"names":[],"mappings":"AAMA,wBAAgB,YAAY,CAC1B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EACpD,SAAS,EAAE,MAAM,EACjB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,
|
|
1
|
+
{"version":3,"file":"useWheelZoom.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/hooks/useWheelZoom.ts"],"names":[],"mappings":"AAMA,wBAAgB,YAAY,CAC1B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EACpD,SAAS,EAAE,MAAM,EACjB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,QAkHrC"}
|
|
@@ -14,7 +14,14 @@ function useWheelZoom(containerRef, zoomLevel, setZoomLevel) {
|
|
|
14
14
|
const cursorY = e.clientY - rect.top;
|
|
15
15
|
const scrollX = container.scrollLeft;
|
|
16
16
|
const scrollY = container.scrollTop;
|
|
17
|
-
|
|
17
|
+
let factor;
|
|
18
|
+
if (e.deltaMode === 1) {
|
|
19
|
+
factor = 0.12;
|
|
20
|
+
}
|
|
21
|
+
else {
|
|
22
|
+
factor = 0.01;
|
|
23
|
+
}
|
|
24
|
+
const delta = -e.deltaY * factor;
|
|
18
25
|
const newZoom = Math.max(ZOOM_MIN, Math.min(ZOOM_MAX, zoomLevel + delta));
|
|
19
26
|
const zoomRatio = newZoom / zoomLevel;
|
|
20
27
|
const newScrollLeft = (scrollX + cursorX) * zoomRatio - cursorX;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useWheelZoom.js","sources":["../../../../PivotViewer/hooks/useWheelZoom.ts"],"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 } from 'react';\nimport { ZOOM_MIN, ZOOM_MAX } from '../utils/utils';\n\nexport function useWheelZoom(\n containerRef: React.RefObject<HTMLDivElement | null>,\n zoomLevel: number,\n setZoomLevel: (zoom: number) => void\n) {\n const handleWheel = useCallback((e: WheelEvent) => {\n if (e.ctrlKey || e.metaKey) {\n e.preventDefault();\n\n const container = containerRef.current;\n if (!container) return;\n\n container.style.scrollBehavior = 'auto';\n\n const rect = container.getBoundingClientRect();\n const cursorX = e.clientX - rect.left;\n const cursorY = e.clientY - rect.top;\n const scrollX = container.scrollLeft;\n const scrollY = container.scrollTop;\n\n const delta = -e.deltaY *
|
|
1
|
+
{"version":3,"file":"useWheelZoom.js","sources":["../../../../PivotViewer/hooks/useWheelZoom.ts"],"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 } from 'react';\nimport { ZOOM_MIN, ZOOM_MAX } from '../utils/utils';\n\nexport function useWheelZoom(\n containerRef: React.RefObject<HTMLDivElement | null>,\n zoomLevel: number,\n setZoomLevel: (zoom: number) => void\n) {\n const handleWheel = useCallback((e: WheelEvent) => {\n if (e.ctrlKey || e.metaKey) {\n e.preventDefault();\n\n const container = containerRef.current;\n if (!container) return;\n\n container.style.scrollBehavior = 'auto';\n\n const rect = container.getBoundingClientRect();\n const cursorX = e.clientX - rect.left;\n const cursorY = e.clientY - rect.top;\n const scrollX = container.scrollLeft;\n const scrollY = container.scrollTop;\n\n // Normalize delta based on deltaMode:\n // 0 = DOM_DELTA_PIXEL (trackpad pinch — deltaY is in pixels, small values)\n // 1 = DOM_DELTA_LINE (mouse wheel — deltaY is in lines, typically 3)\n // 2 = DOM_DELTA_PAGE (rare, treated same as pixel for safety)\n let factor: number;\n if (e.deltaMode === 1) {\n factor = 0.12; // line-mode: each \"line\" gives a noticeable zoom step\n } else {\n factor = 0.01; // pixel-mode (trackpad pinch) and page-mode: fast zoom step\n }\n const delta = -e.deltaY * factor;\n const newZoom = Math.max(ZOOM_MIN, Math.min(ZOOM_MAX, zoomLevel + delta));\n const zoomRatio = newZoom / zoomLevel;\n\n const newScrollLeft = (scrollX + cursorX) * zoomRatio - cursorX;\n const newScrollTop = (scrollY + cursorY) * zoomRatio - cursorY;\n\n setZoomLevel(newZoom);\n\n setTimeout(() => {\n container.scrollLeft = Math.max(0, newScrollLeft);\n container.scrollTop = Math.max(0, newScrollTop);\n setTimeout(() => {\n container.style.scrollBehavior = '';\n }, 50);\n }, 0);\n }\n }, [zoomLevel, setZoomLevel, containerRef]);\n\n useEffect(() => {\n const container = containerRef.current;\n if (!container) return;\n\n container.addEventListener('wheel', handleWheel, { passive: false });\n\n let lastTouchDistance = 0;\n let currentZoom = zoomLevel;\n\n const handleTouchStart = (e: TouchEvent) => {\n if (e.touches.length === 2) {\n const dx = e.touches[0].clientX - e.touches[1].clientX;\n const dy = e.touches[0].clientY - e.touches[1].clientY;\n lastTouchDistance = Math.sqrt(dx * dx + dy * dy);\n currentZoom = zoomLevel;\n }\n };\n\n const handleTouchMove = (e: TouchEvent) => {\n if (e.touches.length === 2) {\n e.preventDefault();\n const dx = e.touches[0].clientX - e.touches[1].clientX;\n const dy = e.touches[0].clientY - e.touches[1].clientY;\n const distance = Math.sqrt(dx * dx + dy * dy);\n\n const centerX = (e.touches[0].clientX + e.touches[1].clientX) / 2;\n const centerY = (e.touches[0].clientY + e.touches[1].clientY) / 2;\n const rect = container.getBoundingClientRect();\n const cursorX = centerX - rect.left;\n const cursorY = centerY - rect.top;\n\n if (lastTouchDistance > 0) {\n const scale = distance / lastTouchDistance;\n const newZoom = Math.max(ZOOM_MIN, Math.min(ZOOM_MAX, currentZoom * scale));\n const zoomRatio = newZoom / zoomLevel;\n\n const contentX = container.scrollLeft + cursorX;\n const contentY = container.scrollTop + cursorY;\n\n const newScrollLeft = contentX * zoomRatio - cursorX;\n const newScrollTop = contentY * zoomRatio - cursorY;\n\n setZoomLevel(newZoom);\n\n requestAnimationFrame(() => {\n container.scrollLeft = Math.max(0, newScrollLeft);\n container.scrollTop = Math.max(0, newScrollTop);\n });\n }\n lastTouchDistance = distance;\n }\n };\n\n const handleTouchEnd = () => {\n lastTouchDistance = 0;\n };\n\n container.addEventListener('touchstart', handleTouchStart, { passive: true });\n container.addEventListener('touchmove', handleTouchMove, { passive: false });\n container.addEventListener('touchend', handleTouchEnd, { passive: true });\n\n return () => {\n container.removeEventListener('wheel', handleWheel);\n container.removeEventListener('touchstart', handleTouchStart);\n container.removeEventListener('touchmove', handleTouchMove);\n container.removeEventListener('touchend', handleTouchEnd);\n };\n }, [handleWheel, zoomLevel, setZoomLevel, containerRef]);\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selection.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/utils/selection.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEtD,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,sBAAsB,CAAC,KAAK;IAC3C,IAAI,EAAE,KAAK,CAAC;IACZ,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IACvC,SAAS,EAAE,WAAW,CAAC;IACvB,YAAY,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC7E,kBAAkB,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACpF,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACzG,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1E,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,QAAQ,EAAE,QAAQ,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,EAAE,cAAc,GAAG,IAAI,CAAC;IACzC,mBAAmB,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC/C,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,eAAe,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9C,oBAAoB,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;CAC9D;AAgBD,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,EACzC,MAAM,EACN,cAAc,EACd,SAAS,EACT,YAAY,EACZ,kBAAkB,EAClB,qBAAqB,EACrB,mBAAmB,EACnB,MAAM,EACN,QAAQ,EACR,SAAS,EACT,WAAW,EACX,iBAAiB,EACjB,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,eAAe,EACf,oBAAoB,EACpB,IAAI,GACL,EAAE,sBAAsB,CAAC,KAAK,CAAC,GAAG,IAAI,
|
|
1
|
+
{"version":3,"file":"selection.d.ts","sourceRoot":"","sources":["../../../../PivotViewer/utils/selection.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEtD,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,sBAAsB,CAAC,KAAK;IAC3C,IAAI,EAAE,KAAK,CAAC;IACZ,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IACvC,SAAS,EAAE,WAAW,CAAC;IACvB,YAAY,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC7E,kBAAkB,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACpF,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACzG,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1E,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,QAAQ,EAAE,QAAQ,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,EAAE,cAAc,GAAG,IAAI,CAAC;IACzC,mBAAmB,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC/C,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,eAAe,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9C,oBAAoB,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;CAC9D;AAgBD,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,EACzC,MAAM,EACN,cAAc,EACd,SAAS,EACT,YAAY,EACZ,kBAAkB,EAClB,qBAAqB,EACrB,mBAAmB,EACnB,MAAM,EACN,QAAQ,EACR,SAAS,EACT,WAAW,EACX,iBAAiB,EACjB,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,eAAe,EACf,oBAAoB,EACpB,IAAI,GACL,EAAE,sBAAsB,CAAC,KAAK,CAAC,GAAG,IAAI,CAsFtC;AA8JD,wBAAgB,kBAAkB,CAAC,UAAU,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,GAAG,WAAW,GAAG,IAAI,CAMxG"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { calculateCenterScrollPosition,
|
|
1
|
+
import { calculateCenterScrollPosition, animateZoomAndScroll, smoothScrollTo } from './animations.js';
|
|
2
2
|
import { DETAIL_PANEL_WIDTH, ZOOM_MAX, MIN_ZOOM_ON_SELECT, ZOOM_MULTIPLIER } from './constants.js';
|
|
3
3
|
|
|
4
4
|
function isSameItemId(id1, id2) {
|
|
@@ -39,8 +39,18 @@ function handleCardSelection({ itemId, selectedItemId, container, cardPosition,
|
|
|
39
39
|
if (isFirstSelection) {
|
|
40
40
|
if (viewMode === 'collection') {
|
|
41
41
|
if (cardPosition) {
|
|
42
|
+
setIsZooming(true);
|
|
42
43
|
const { scrollLeft, scrollTop } = calculateCenterScrollPosition(container, cardPosition, zoomLevel, 0, totalHeight);
|
|
43
|
-
|
|
44
|
+
animateZoomAndScroll({
|
|
45
|
+
container,
|
|
46
|
+
cardPosition,
|
|
47
|
+
startZoom: zoomLevel,
|
|
48
|
+
targetZoom: zoomLevel,
|
|
49
|
+
targetScrollLeft: scrollLeft,
|
|
50
|
+
targetScrollTop: scrollTop,
|
|
51
|
+
onUpdate: setZoomLevel,
|
|
52
|
+
onComplete: () => setIsZooming(false),
|
|
53
|
+
});
|
|
44
54
|
}
|
|
45
55
|
}
|
|
46
56
|
else {
|
|
@@ -61,9 +71,19 @@ function handleCardSelection({ itemId, selectedItemId, container, cardPosition,
|
|
|
61
71
|
}
|
|
62
72
|
else {
|
|
63
73
|
if (cardPosition) {
|
|
74
|
+
setIsZooming(true);
|
|
64
75
|
const detailWidth = viewMode === 'collection' ? 0 : DETAIL_PANEL_WIDTH;
|
|
65
76
|
const { scrollLeft, scrollTop } = calculateCenterScrollPosition(container, cardPosition, zoomLevel, detailWidth, totalHeight);
|
|
66
|
-
|
|
77
|
+
animateZoomAndScroll({
|
|
78
|
+
container,
|
|
79
|
+
cardPosition,
|
|
80
|
+
startZoom: zoomLevel,
|
|
81
|
+
targetZoom: zoomLevel,
|
|
82
|
+
targetScrollLeft: scrollLeft,
|
|
83
|
+
targetScrollTop: scrollTop,
|
|
84
|
+
onUpdate: setZoomLevel,
|
|
85
|
+
onComplete: () => setIsZooming(false),
|
|
86
|
+
});
|
|
67
87
|
}
|
|
68
88
|
}
|
|
69
89
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selection.js","sources":["../../../../PivotViewer/utils/selection.ts"],"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 { animateZoomAndScroll, calculateCenterScrollPosition, smoothScrollTo } from './animations';\nimport { ZOOM_MAX, MIN_ZOOM_ON_SELECT, ZOOM_MULTIPLIER, DETAIL_PANEL_WIDTH } from './constants';\nimport type { ViewMode } from '../components/Toolbar';\n\nexport interface SelectionState {\n zoom: number;\n scrollLeft: number;\n scrollTop: number;\n}\n\nexport interface CardClickHandlerParams<TItem> {\n item: TItem;\n itemId: string | number;\n selectedItemId: string | number | null;\n container: HTMLElement;\n cardPosition: { x: number; y: number; width: number; height: number } | null;\n targetCardPosition?: { x: number; y: number; width: number; height: number } | null;\n getCardPositionAtZoom?: (zoom: number) => { x: number; y: number; width: number; height: number } | null;\n getLayoutSizeAtZoom?: (zoom: number) => { width: number; height: number };\n spacer?: HTMLElement | null;\n viewMode: ViewMode;\n zoomLevel: number;\n totalHeight?: number;\n preSelectionState: SelectionState | null;\n startScrollPosition?: { x: number; y: number };\n setZoomLevel: (zoom: number) => void;\n setIsZooming: (isZooming: boolean) => void;\n setSelectedItem: (item: TItem | null) => void;\n setPreSelectionState: (state: SelectionState | null) => void;\n}\n\n/**\n * Compare two item IDs handling type coercion (string vs number)\n */\nfunction isSameItemId(id1: string | number | null, id2: string | number | null): boolean {\n if (id1 === null || id2 === null) return false;\n // Strict equality\n if (id1 === id2) return true;\n // Compare as strings to handle number/string mismatches\n return String(id1) === String(id2);\n}\n\n/**\n * Handle card click for selection with zoom and scroll animation\n */\nexport function handleCardSelection<TItem>({\n itemId,\n selectedItemId,\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n viewMode,\n zoomLevel,\n totalHeight,\n preSelectionState,\n startScrollPosition,\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n item,\n}: CardClickHandlerParams<TItem>): void {\n // Clicking the same card - deselect (using type-coerced comparison)\n if (isSameItemId(selectedItemId, itemId)) {\n deselectCard({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n viewMode,\n zoomLevel,\n preSelectionState,\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n });\n return;\n }\n\n // First selection - save state and zoom in\n const isFirstSelection = selectedItemId === null;\n\n if (isFirstSelection) {\n setPreSelectionState({\n zoom: zoomLevel,\n scrollLeft: container.scrollLeft,\n scrollTop: container.scrollTop,\n });\n }\n\n setSelectedItem(item);\n\n if (isFirstSelection) {\n if (viewMode === 'collection') {\n // Collection mode: just smooth scroll to center, no zoom\n if (cardPosition) {\n // In collection mode, we don't have a detail panel width offset because the panel is an overlay or separate\n // But if we want to center it, we should consider if the detail panel pushes content\n // For now, assume 0 offset as per original code\n const { scrollLeft, scrollTop } = calculateCenterScrollPosition(container, cardPosition, zoomLevel, 0, totalHeight);\n smoothScrollTo(container, scrollLeft, scrollTop, true);\n }\n } else {\n // Grouped mode: animate zoom and scroll\n zoomAndCenterCard({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n itemId,\n zoomLevel,\n totalHeight,\n startScrollPosition,\n setZoomLevel,\n setIsZooming,\n });\n }\n } else {\n // Subsequent selections: just center the new card\n if (cardPosition) {\n // In collection mode, we don't zoom, so we just center.\n // In grouped mode, we might be zoomed in, so we center with offset.\n const detailWidth = viewMode === 'collection' ? 0 : DETAIL_PANEL_WIDTH;\n const { scrollLeft, scrollTop } = calculateCenterScrollPosition(container, cardPosition, zoomLevel, detailWidth, totalHeight);\n smoothScrollTo(container, scrollLeft, scrollTop, true);\n }\n }\n}\n\ninterface DeselectParams {\n container: HTMLElement;\n cardPosition: { x: number; y: number; width: number; height: number } | null;\n targetCardPosition?: { x: number; y: number; width: number; height: number } | null;\n getCardPositionAtZoom?: (zoom: number) => { x: number; y: number; width: number; height: number } | null;\n getLayoutSizeAtZoom?: (zoom: number) => { width: number; height: number };\n spacer?: HTMLElement | null;\n viewMode: ViewMode;\n zoomLevel: number;\n preSelectionState: SelectionState | null;\n setZoomLevel: (zoom: number) => void;\n setIsZooming: (isZooming: boolean) => void;\n setSelectedItem: (item: null) => void;\n setPreSelectionState: (state: SelectionState | null) => void;\n}\n\n/**\n * Deselect card with zoom-out animation if needed\n */\nfunction deselectCard({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n viewMode,\n zoomLevel,\n preSelectionState,\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n}: DeselectParams): void {\n if (!preSelectionState) {\n setSelectedItem(null);\n return;\n }\n\n // Collection mode: just scroll back\n if (viewMode === 'collection') {\n setSelectedItem(null);\n smoothScrollTo(container, preSelectionState.scrollLeft, preSelectionState.scrollTop, true);\n setPreSelectionState(null);\n return;\n }\n\n // Grouped mode: check if zoom changed\n const zoomChanged = Math.abs(preSelectionState.zoom - zoomLevel) > 0.001;\n\n if (!zoomChanged || !cardPosition) {\n setSelectedItem(null);\n smoothScrollTo(container, preSelectionState.scrollLeft, preSelectionState.scrollTop, true);\n setPreSelectionState(null);\n return;\n }\n\n // Animate zoom out\n setIsZooming(true);\n\n animateZoomAndScroll({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n startZoom: zoomLevel,\n targetZoom: preSelectionState.zoom,\n targetScrollLeft: preSelectionState.scrollLeft,\n targetScrollTop: preSelectionState.scrollTop,\n onUpdate: setZoomLevel,\n onComplete: () => {\n setIsZooming(false);\n setSelectedItem(null);\n setPreSelectionState(null);\n },\n });\n}\n\ninterface ZoomAndCenterParams {\n container: HTMLElement;\n cardPosition: { x: number; y: number; width: number; height: number } | null;\n targetCardPosition?: { x: number; y: number; width: number; height: number } | null;\n getCardPositionAtZoom?: (zoom: number) => { x: number; y: number; width: number; height: number } | null;\n getLayoutSizeAtZoom?: (zoom: number) => { width: number; height: number };\n spacer?: HTMLElement | null;\n itemId: string | number;\n zoomLevel: number;\n totalHeight?: number;\n startScrollPosition?: { x: number; y: number };\n setZoomLevel: (zoom: number) => void;\n setIsZooming: (isZooming: boolean) => void;\n}\n\n/**\n * Zoom in and center a card\n */\nfunction zoomAndCenterCard({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n zoomLevel,\n totalHeight,\n startScrollPosition,\n setZoomLevel,\n setIsZooming,\n}: ZoomAndCenterParams): void {\n const targetZoom = Math.min(ZOOM_MAX, Math.max(MIN_ZOOM_ON_SELECT, zoomLevel * ZOOM_MULTIPLIER));\n const shouldZoom = Math.abs(targetZoom - zoomLevel) > 0.001;\n\n if (!shouldZoom || !cardPosition) {\n if (cardPosition) {\n const { scrollLeft, scrollTop } = calculateCenterScrollPosition(container, cardPosition, zoomLevel, DETAIL_PANEL_WIDTH, totalHeight);\n smoothScrollTo(container, scrollLeft, scrollTop, true);\n }\n return;\n }\n\n setIsZooming(true);\n\n // Use targetCardPosition if available, otherwise fallback to cardPosition\n const { scrollLeft: targetScrollLeft, scrollTop: targetScrollTop } = calculateCenterScrollPosition(\n container,\n targetCardPosition || cardPosition,\n targetZoom,\n DETAIL_PANEL_WIDTH,\n totalHeight\n );\n\n animateZoomAndScroll({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n startZoom: zoomLevel,\n targetZoom,\n targetScrollLeft,\n targetScrollTop,\n startScrollLeft: startScrollPosition?.x,\n startScrollTop: startScrollPosition?.y,\n onUpdate: setZoomLevel,\n onComplete: () => {\n setIsZooming(false);\n },\n });\n}\n\n/**\n * Get card element by ID from container\n */\nexport function getCardElementById(_container: HTMLElement, _itemId: string | number): HTMLElement | null {\n // Deprecated: Pixi renderer doesn't use DOM elements for cards\n // Keep parameter names prefixed to indicate intentional non-use.\n void _container;\n void _itemId;\n return null;\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"selection.js","sources":["../../../../PivotViewer/utils/selection.ts"],"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 { animateZoomAndScroll, calculateCenterScrollPosition, smoothScrollTo } from './animations';\nimport { ZOOM_MAX, MIN_ZOOM_ON_SELECT, ZOOM_MULTIPLIER, DETAIL_PANEL_WIDTH } from './constants';\nimport type { ViewMode } from '../components/Toolbar';\n\nexport interface SelectionState {\n zoom: number;\n scrollLeft: number;\n scrollTop: number;\n}\n\nexport interface CardClickHandlerParams<TItem> {\n item: TItem;\n itemId: string | number;\n selectedItemId: string | number | null;\n container: HTMLElement;\n cardPosition: { x: number; y: number; width: number; height: number } | null;\n targetCardPosition?: { x: number; y: number; width: number; height: number } | null;\n getCardPositionAtZoom?: (zoom: number) => { x: number; y: number; width: number; height: number } | null;\n getLayoutSizeAtZoom?: (zoom: number) => { width: number; height: number };\n spacer?: HTMLElement | null;\n viewMode: ViewMode;\n zoomLevel: number;\n totalHeight?: number;\n preSelectionState: SelectionState | null;\n startScrollPosition?: { x: number; y: number };\n setZoomLevel: (zoom: number) => void;\n setIsZooming: (isZooming: boolean) => void;\n setSelectedItem: (item: TItem | null) => void;\n setPreSelectionState: (state: SelectionState | null) => void;\n}\n\n/**\n * Compare two item IDs handling type coercion (string vs number)\n */\nfunction isSameItemId(id1: string | number | null, id2: string | number | null): boolean {\n if (id1 === null || id2 === null) return false;\n // Strict equality\n if (id1 === id2) return true;\n // Compare as strings to handle number/string mismatches\n return String(id1) === String(id2);\n}\n\n/**\n * Handle card click for selection with zoom and scroll animation\n */\nexport function handleCardSelection<TItem>({\n itemId,\n selectedItemId,\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n viewMode,\n zoomLevel,\n totalHeight,\n preSelectionState,\n startScrollPosition,\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n item,\n}: CardClickHandlerParams<TItem>): void {\n // Clicking the same card - deselect (using type-coerced comparison)\n if (isSameItemId(selectedItemId, itemId)) {\n deselectCard({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n viewMode,\n zoomLevel,\n preSelectionState,\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n });\n return;\n }\n\n // First selection - save state and zoom in\n const isFirstSelection = selectedItemId === null;\n\n if (isFirstSelection) {\n setPreSelectionState({\n zoom: zoomLevel,\n scrollLeft: container.scrollLeft,\n scrollTop: container.scrollTop,\n });\n }\n\n setSelectedItem(item);\n\n if (isFirstSelection) {\n if (viewMode === 'collection') {\n // Collection mode: animate scroll to center the selected card (no zoom change)\n if (cardPosition) {\n setIsZooming(true);\n const { scrollLeft, scrollTop } = calculateCenterScrollPosition(container, cardPosition, zoomLevel, 0, totalHeight);\n animateZoomAndScroll({\n container,\n cardPosition,\n startZoom: zoomLevel,\n targetZoom: zoomLevel,\n targetScrollLeft: scrollLeft,\n targetScrollTop: scrollTop,\n onUpdate: setZoomLevel,\n onComplete: () => setIsZooming(false),\n });\n }\n } else {\n // Grouped mode: animate zoom and scroll\n zoomAndCenterCard({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n itemId,\n zoomLevel,\n totalHeight,\n startScrollPosition,\n setZoomLevel,\n setIsZooming,\n });\n }\n } else {\n // Subsequent selections: animate the scroll to center the new card\n if (cardPosition) {\n setIsZooming(true);\n const detailWidth = viewMode === 'collection' ? 0 : DETAIL_PANEL_WIDTH;\n const { scrollLeft, scrollTop } = calculateCenterScrollPosition(container, cardPosition, zoomLevel, detailWidth, totalHeight);\n animateZoomAndScroll({\n container,\n cardPosition,\n startZoom: zoomLevel,\n targetZoom: zoomLevel,\n targetScrollLeft: scrollLeft,\n targetScrollTop: scrollTop,\n onUpdate: setZoomLevel,\n onComplete: () => setIsZooming(false),\n });\n }\n }\n}\n\ninterface DeselectParams {\n container: HTMLElement;\n cardPosition: { x: number; y: number; width: number; height: number } | null;\n targetCardPosition?: { x: number; y: number; width: number; height: number } | null;\n getCardPositionAtZoom?: (zoom: number) => { x: number; y: number; width: number; height: number } | null;\n getLayoutSizeAtZoom?: (zoom: number) => { width: number; height: number };\n spacer?: HTMLElement | null;\n viewMode: ViewMode;\n zoomLevel: number;\n preSelectionState: SelectionState | null;\n setZoomLevel: (zoom: number) => void;\n setIsZooming: (isZooming: boolean) => void;\n setSelectedItem: (item: null) => void;\n setPreSelectionState: (state: SelectionState | null) => void;\n}\n\n/**\n * Deselect card with zoom-out animation if needed\n */\nfunction deselectCard({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n viewMode,\n zoomLevel,\n preSelectionState,\n setZoomLevel,\n setIsZooming,\n setSelectedItem,\n setPreSelectionState,\n}: DeselectParams): void {\n if (!preSelectionState) {\n setSelectedItem(null);\n return;\n }\n\n // Collection mode: just scroll back\n if (viewMode === 'collection') {\n setSelectedItem(null);\n smoothScrollTo(container, preSelectionState.scrollLeft, preSelectionState.scrollTop, true);\n setPreSelectionState(null);\n return;\n }\n\n // Grouped mode: check if zoom changed\n const zoomChanged = Math.abs(preSelectionState.zoom - zoomLevel) > 0.001;\n\n if (!zoomChanged || !cardPosition) {\n setSelectedItem(null);\n smoothScrollTo(container, preSelectionState.scrollLeft, preSelectionState.scrollTop, true);\n setPreSelectionState(null);\n return;\n }\n\n // Animate zoom out\n setIsZooming(true);\n\n animateZoomAndScroll({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n startZoom: zoomLevel,\n targetZoom: preSelectionState.zoom,\n targetScrollLeft: preSelectionState.scrollLeft,\n targetScrollTop: preSelectionState.scrollTop,\n onUpdate: setZoomLevel,\n onComplete: () => {\n setIsZooming(false);\n setSelectedItem(null);\n setPreSelectionState(null);\n },\n });\n}\n\ninterface ZoomAndCenterParams {\n container: HTMLElement;\n cardPosition: { x: number; y: number; width: number; height: number } | null;\n targetCardPosition?: { x: number; y: number; width: number; height: number } | null;\n getCardPositionAtZoom?: (zoom: number) => { x: number; y: number; width: number; height: number } | null;\n getLayoutSizeAtZoom?: (zoom: number) => { width: number; height: number };\n spacer?: HTMLElement | null;\n itemId: string | number;\n zoomLevel: number;\n totalHeight?: number;\n startScrollPosition?: { x: number; y: number };\n setZoomLevel: (zoom: number) => void;\n setIsZooming: (isZooming: boolean) => void;\n}\n\n/**\n * Zoom in and center a card\n */\nfunction zoomAndCenterCard({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n zoomLevel,\n totalHeight,\n startScrollPosition,\n setZoomLevel,\n setIsZooming,\n}: ZoomAndCenterParams): void {\n const targetZoom = Math.min(ZOOM_MAX, Math.max(MIN_ZOOM_ON_SELECT, zoomLevel * ZOOM_MULTIPLIER));\n const shouldZoom = Math.abs(targetZoom - zoomLevel) > 0.001;\n\n if (!shouldZoom || !cardPosition) {\n if (cardPosition) {\n const { scrollLeft, scrollTop } = calculateCenterScrollPosition(container, cardPosition, zoomLevel, DETAIL_PANEL_WIDTH, totalHeight);\n smoothScrollTo(container, scrollLeft, scrollTop, true);\n }\n return;\n }\n\n setIsZooming(true);\n\n // Use targetCardPosition if available, otherwise fallback to cardPosition\n const { scrollLeft: targetScrollLeft, scrollTop: targetScrollTop } = calculateCenterScrollPosition(\n container,\n targetCardPosition || cardPosition,\n targetZoom,\n DETAIL_PANEL_WIDTH,\n totalHeight\n );\n\n animateZoomAndScroll({\n container,\n cardPosition,\n targetCardPosition,\n getCardPositionAtZoom,\n getLayoutSizeAtZoom,\n spacer,\n startZoom: zoomLevel,\n targetZoom,\n targetScrollLeft,\n targetScrollTop,\n startScrollLeft: startScrollPosition?.x,\n startScrollTop: startScrollPosition?.y,\n onUpdate: setZoomLevel,\n onComplete: () => {\n setIsZooming(false);\n },\n });\n}\n\n/**\n * Get card element by ID from container\n */\nexport function getCardElementById(_container: HTMLElement, _itemId: string | number): HTMLElement | null {\n // Deprecated: Pixi renderer doesn't use DOM elements for cards\n // Keep parameter names prefixed to indicate intentional non-use.\n void _container;\n void _itemId;\n return null;\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SchemaEditor.stories.d.ts","sourceRoot":"","sources":["../../../SchemaEditor/SchemaEditor.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAOnC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"SchemaEditor.stories.d.ts","sourceRoot":"","sources":["../../../SchemaEditor/SchemaEditor.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAOnC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAC;AAoE3C,eAAO,MAAM,WAAW,EAAE,KAoBzB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAStB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC;AAOF,eAAO,MAAM,WAAW,EAAE,KAUzB,CAAC;AAoBF,eAAO,MAAM,YAAY,EAAE,KAO1B,CAAC"}
|
|
@@ -75,15 +75,14 @@ const sampleSchema = {
|
|
|
75
75
|
}
|
|
76
76
|
}
|
|
77
77
|
};
|
|
78
|
-
const InteractiveWrapper = () => {
|
|
79
|
-
const [schema, setSchema] = useState(JSON.parse(JSON.stringify(sampleSchema)));
|
|
80
|
-
return (_jsx("div", { style: { height: '600px', background: 'var(--surface-ground)' }, children: _jsx(SchemaEditor, { schema: schema, eventTypeName: "User", canEdit: true, onChange: (newSchema) => {
|
|
81
|
-
setSchema(newSchema);
|
|
82
|
-
console.log('Schema changed:', newSchema);
|
|
83
|
-
}, onSave: () => console.log('Save clicked', schema), onCancel: () => console.log('Cancel clicked') }) }));
|
|
84
|
-
};
|
|
85
78
|
export const Interactive = {
|
|
86
|
-
render: () =>
|
|
79
|
+
render: () => {
|
|
80
|
+
const [schema, setSchema] = useState(JSON.parse(JSON.stringify(sampleSchema)));
|
|
81
|
+
return (_jsx("div", { style: { height: '600px', background: 'var(--surface-ground)' }, children: _jsx(SchemaEditor, { schema: schema, eventTypeName: "User", canEdit: true, onChange: (newSchema) => {
|
|
82
|
+
setSchema(newSchema);
|
|
83
|
+
console.log('Schema changed:', newSchema);
|
|
84
|
+
}, onSave: () => console.log('Save clicked', schema), onCancel: () => console.log('Cancel clicked') }) }));
|
|
85
|
+
},
|
|
87
86
|
};
|
|
88
87
|
export const ViewMode = {
|
|
89
88
|
args: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SchemaEditor.stories.js","sourceRoot":"","sources":["../../../SchemaEditor/SchemaEditor.stories.tsx"],"names":[],"mappings":";AAGA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C,MAAM,IAAI,GAA8B;IACpC,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,YAAY;IACvB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACR,MAAM,EAAE,QAAQ;KACnB;CACJ,CAAC;AAEF,eAAe,IAAI,CAAC;AAGpB,MAAM,YAAY,GAAe;IAC7B,IAAI,EAAE,QAAQ;IACd,UAAU,EAAE;QACR,EAAE,EAAE;YACA,IAAI,EAAE,QAAQ;YACd,MAAM,EAAE,MAAM;YACd,WAAW,EAAE,mBAAmB;SACnC;QACD,IAAI,EAAE;YACF,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,oBAAoB;SACpC;QACD,KAAK,EAAE;YACH,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,eAAe;SAC/B;QACD,GAAG,EAAE;YACD,IAAI,EAAE,SAAS;YACf,MAAM,EAAE,OAAO;YACf,WAAW,EAAE,cAAc;SAC9B;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,SAAS;YACf,WAAW,EAAE,8BAA8B;SAC9C;QACD,OAAO,EAAE;YACL,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,qBAAqB;YAClC,UAAU,EAAE;gBACR,MAAM,EAAE;oBACJ,IAAI,EAAE,QAAQ;oBACd,WAAW,EAAE,gBAAgB;iBAChC;gBACD,IAAI,EAAE;oBACF,IAAI,EAAE,QAAQ;oBACd,WAAW,EAAE,WAAW;iBAC3B;gBACD,OAAO,EAAE;oBACL,IAAI,EAAE,QAAQ;oBACd,WAAW,EAAE,iBAAiB;iBACjC;gBACD,OAAO,EAAE;oBACL,IAAI,EAAE,QAAQ;oBACd,WAAW,EAAE,cAAc;iBAC9B;aACJ;SACJ;QACD,IAAI,EAAE;YACF,IAAI,EAAE,OAAO;YACb,WAAW,EAAE,iCAAiC;YAC9C,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;SAC5B;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,OAAO;YACb,WAAW,EAAE,kBAAkB;YAC/B,KAAK,EAAE;gBACH,IAAI,EAAE,QAAQ;gBACd,UAAU,EAAE;oBACR,GAAG,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;oBACvB,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;iBAC5B;aACJ;SACJ;KACJ;CACJ,CAAC;AAEF,MAAM,
|
|
1
|
+
{"version":3,"file":"SchemaEditor.stories.js","sourceRoot":"","sources":["../../../SchemaEditor/SchemaEditor.stories.tsx"],"names":[],"mappings":"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"}
|