@cratis/components 3.6.1 → 4.1.0

package/dist/esm/SchemaEditor/TypeCell.js

@@ -1,30 +1,27 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Button } from 'primereact/button';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { Button } from '../Common/Button.js';
 import { Dropdown } from '../Dropdown/Dropdown.js';
 import { Tooltip } from '../Common/Tooltip.js';
 import * as faIcons from 'react-icons/fa6';
 
 const CONTAINER_TYPES = [
     { label: 'array', value: 'array' },
-    { label: 'object', value: 'object' }
+    { label: 'object', value: 'object' },
 ];
-const TypeCell = ({ rowData, isEditMode, typeFormats, onUpdateProperty, onUpdateArrayItemType, onNavigateToProperty, onNavigateToArrayItems, onRemoveProperty, labels }) => {
+const TypeCell = ({ rowData, isEditMode, typeFormats, onUpdateProperty, onUpdateArrayItemType, onNavigateToProperty, onNavigateToArrayItems, onRemoveProperty, labels, }) => {
     const DEFAULT_TYPE_OPTIONS = [
         { label: 'string', value: 'string' },
         { label: 'integer', value: 'integer' },
         { label: 'number', value: 'number' },
-        { label: 'boolean', value: 'boolean' }
+        { label: 'boolean', value: 'boolean' },
     ];
     const formatOptions = typeFormats.length > 0
-        ? typeFormats.map(tf => {
-            const format = (!tf.format || tf.format === '' ? tf.jsonType : tf.format);
+        ? typeFormats.map((tf) => {
+            const format = !tf.format || tf.format === '' ? tf.jsonType : tf.format;
             return { label: format, value: format };
         })
         : DEFAULT_TYPE_OPTIONS;
-    const allTypeOptions = [
-        ...formatOptions,
-        ...CONTAINER_TYPES
-    ];
+    const allTypeOptions = [...formatOptions, ...CONTAINER_TYPES];
     const displayValue = rowData.format || rowData.type || 'string';
     const currentValue = rowData.format || rowData.type || 'string';
     const handleTypeChange = (value, propertyName, isArrayItem = false) => {
@@ -37,8 +34,8 @@ const TypeCell = ({ rowData, isEditMode, typeFormats, onUpdateProperty, onUpdate
             }
         }
         else {
-            const typeFormat = typeFormats.find(tf => {
-                const effectiveFormat = (!tf.format || tf.format === '' ? tf.jsonType : tf.format);
+            const typeFormat = typeFormats.find((tf) => {
+                const effectiveFormat = !tf.format || tf.format === '' ? tf.jsonType : tf.format;
                 return effectiveFormat === value;
             });
             if (typeFormat) {
@@ -47,10 +44,14 @@ const TypeCell = ({ rowData, isEditMode, typeFormats, onUpdateProperty, onUpdate
                 }
                 else {
                     if (typeFormat.format && typeFormat.format !== '') {
-                        onUpdateProperty(propertyName, 'type', typeFormat.jsonType, { format: value });
+                        onUpdateProperty(propertyName, 'type', typeFormat.jsonType, {
+                            format: value,
+                        });
                     }
                     else {
-                        onUpdateProperty(propertyName, 'type', typeFormat.jsonType, { format: undefined });
+                        onUpdateProperty(propertyName, 'type', typeFormat.jsonType, {
+                            format: undefined,
+                        });
                     }
                 }
             }
@@ -68,14 +69,31 @@ const TypeCell = ({ rowData, isEditMode, typeFormats, onUpdateProperty, onUpdate
         if (rowData.type === 'array') {
             const itemType = rowData.items?.type || 'string';
             const isNavigable = itemType === 'object';
-            return (jsx(Tooltip, { content: isNavigable ? 'Click to navigate to item definition' : undefined, position: "top", className: "w-full", children: jsxs("div", { className: "flex items-center gap-2 w-full", style: { height: '100%' }, children: [jsxs("span", { children: ["Array of ", itemType] }), isNavigable && (jsxs(Fragment, { children: [jsx("div", { style: { flex: 1 } }), jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: jsx(faIcons.FaArrowRight, { style: { fontSize: '1rem', color: 'var(--cratis-primary-color)' } }) })] }))] }) }));
+            return (jsxs("div", { className: 'cratis:flex cratis:items-center cratis:gap-2 cratis:w-full', style: { height: '100%' }, title: isNavigable ? 'Click to navigate to item definition' : undefined, children: [jsxs("span", { children: ["Array of ", itemType] }), isNavigable && (jsxs(Fragment, { children: [jsx("div", { style: { flex: 1 } }), jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: jsx(faIcons.FaArrowRight, { style: {
+                                        fontSize: '1rem',
+                                        color: 'var(--cratis-primary-color)',
+                                    } }) })] }))] }));
         }
         else if (rowData.type === 'object') {
-            return (jsx(Tooltip, { content: "Click to navigate to object properties", position: "top", className: "w-full", children: jsxs("div", { className: "flex items-center gap-2 w-full", style: { height: '100%' }, children: [jsx("span", { children: "Object" }), jsx("div", { style: { flex: 1 } }), jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: jsx(faIcons.FaArrowRight, { style: { fontSize: '1rem', color: 'var(--cratis-primary-color)' } }) })] }) }));
+            return (jsxs("div", { className: 'cratis:flex cratis:items-center cratis:gap-2 cratis:w-full', style: { height: '100%' }, title: 'Click to navigate to object properties', children: [jsx("span", { children: "Object" }), jsx("div", { style: { flex: 1 } }), jsx("span", { style: { display: 'flex', alignItems: 'center' }, children: jsx(faIcons.FaArrowRight, { style: {
+                                fontSize: '1rem',
+                                color: 'var(--cratis-primary-color)',
+                            } }) })] }));
         }
         return displayValue;
     }
-    return (jsxs("div", { className: "flex items-center gap-2 w-full", style: { minHeight: '2.5rem' }, children: [jsx(Dropdown, { value: currentValue, options: allTypeOptions, optionLabel: "label", optionValue: "value", onChange: (e) => handleTypeChange(e.value, rowData.name || ''), className: "flex-1" }), rowData.type === 'array' && rowData.items && (jsxs(Fragment, { children: [jsx("span", { style: { whiteSpace: 'nowrap', display: 'flex', alignItems: 'center' }, children: "of" }), jsx(Dropdown, { value: rowData.items.type || 'string', options: allTypeOptions, optionLabel: "label", optionValue: "value", onChange: (e) => handleTypeChange(e.value, rowData.name || '', true), className: "flex-1" })] })), jsxs("div", { style: { marginLeft: 'auto', display: 'flex', alignItems: 'center', gap: '0.5rem' }, children: [rowData.type === 'array' && rowData.items?.type === 'object' && rowData.name && (jsx(Tooltip, { content: labels.navigateToItemDefinition, position: "top", children: jsx(Button, { variant: "text", size: "small", iconOnly: true, onClick: () => onNavigateToArrayItems(rowData.name), "aria-label": labels.navigateToItemDefinition, children: jsx(faIcons.FaArrowRight, {}) }) })), rowData.type === 'object' && rowData.name && (jsx(Tooltip, { content: labels.navigateToProperties, position: "top", children: jsx(Button, { variant: "text", size: "small", iconOnly: true, onClick: () => onNavigateToProperty(rowData.name), "aria-label": labels.navigateToProperties, children: jsx(faIcons.FaArrowRight, {}) }) })), rowData.name && (jsx(Tooltip, { content: labels.deleteProperty, position: "top", children: jsx(Button, { variant: "text", severity: "danger", size: "small", iconOnly: true, onClick: () => onRemoveProperty(rowData.name), "aria-label": labels.deleteProperty, children: jsx(faIcons.FaTrash, {}) }) }))] })] }));
+    return (jsxs("div", { className: 'cratis:flex cratis:items-center cratis:gap-2 cratis:w-full', style: { minHeight: '2.5rem' }, children: [jsx(Dropdown, { "aria-label": labels.propertyType, value: currentValue, options: allTypeOptions, optionLabel: 'label', optionValue: 'value', onChange: (value) => handleTypeChange(value, rowData.name || ''), className: 'cratis:flex-1' }), rowData.type === 'array' && rowData.items && (jsxs(Fragment, { children: [jsx("span", { style: {
+                            whiteSpace: 'nowrap',
+                            display: 'flex',
+                            alignItems: 'center',
+                        }, children: "of" }), jsx(Dropdown, { "aria-label": labels.arrayItemType, value: rowData.items.type || 'string', options: allTypeOptions, optionLabel: 'label', optionValue: 'value', onChange: (value) => handleTypeChange(value, rowData.name || '', true), className: 'cratis:flex-1' })] })), jsxs("div", { style: {
+                    marginLeft: 'auto',
+                    display: 'flex',
+                    alignItems: 'center',
+                    gap: '0.5rem',
+                }, children: [rowData.type === 'array' &&
+                        rowData.items?.type === 'object' &&
+                        rowData.name && (jsx(Tooltip, { content: labels.navigateToItemDefinition, position: 'top', children: jsx(Button, { variant: 'ghost', size: 'small', icon: jsx(faIcons.FaArrowRight, {}), onClick: () => onNavigateToArrayItems(rowData.name), "aria-label": labels.navigateToItemDefinition }) })), rowData.type === 'object' && rowData.name && (jsx(Tooltip, { content: labels.navigateToProperties, position: 'top', children: jsx(Button, { variant: 'ghost', size: 'small', icon: jsx(faIcons.FaArrowRight, {}), onClick: () => onNavigateToProperty(rowData.name), "aria-label": labels.navigateToProperties }) })), rowData.name && (jsx(Tooltip, { content: labels.deleteProperty, position: 'top', children: jsx(Button, { variant: 'ghost', tone: 'critical', size: 'small', icon: jsx(faIcons.FaTrash, {}), onClick: () => onRemoveProperty(rowData.name), "aria-label": labels.deleteProperty }) }))] })] }));
 };
 
 export { TypeCell };

package/dist/esm/SchemaEditor/TypeCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TypeCell.js","sources":["../../../SchemaEditor/TypeCell.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"TypeCell.js","sources":["../../../SchemaEditor/TypeCell.tsx"],"sourcesContent":[null],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}

package/dist/esm/SchemaEditor/index.d.ts

@@ -1,4 +1,3 @@
-export * from './SchemaEditor';
-export * from '../types/JsonSchema';
-export * from '../types/TypeFormat';
-//# sourceMappingURL=index.d.ts.map
+export * from './SchemaEditor.js';
+export * from '../types/JsonSchema.js';
+export * from '../types/TypeFormat.js';

package/dist/esm/SchemaEditor/index.js

@@ -1,6 +1,3 @@
 export { SchemaEditor, defaultSchemaEditorLabels } from './SchemaEditor.js';
 export { DEFAULT_TYPE_FORMATS } from '../types/TypeFormat.js';
-
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
 //# sourceMappingURL=index.js.map

package/dist/esm/SchemaEditor/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../SchemaEditor/index.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAAA;AACA"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/esm/SchemaEditor/schemaHelpers.d.ts

@@ -1,4 +1,9 @@
-import { JsonSchemaProperty, NavigationItem } from '../types/JsonSchema';
+import type { JsonSchemaProperty, NavigationItem } from '../types/JsonSchema.js';
+/**
+ * Validates a property name, returning an error string or undefined if valid.
+ */
 export declare function validatePropertyName(name: string, propertyId: string, allProperties: JsonSchemaProperty[]): string | undefined;
+/**
+ * Builds the list of breadcrumb navigation items from a path, using the event type name as the root.
+ */
 export declare function buildBreadcrumbItems(eventTypeName: string, currentPath: string[]): NavigationItem[];
-//# sourceMappingURL=schemaHelpers.d.ts.map

package/dist/esm/SchemaEditor/schemaHelpers.js

@@ -1,25 +1,21 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-/**
- * Validates a property name, returning an error string or undefined if valid.
- */
+const reservedPrototypeKeys = new Set(['__proto__', 'constructor', 'prototype']);
 function validatePropertyName(name, propertyId, allProperties) {
     if (!name || name.trim() === '') {
         return 'Property name cannot be empty';
     }
+    if (reservedPrototypeKeys.has(name)) {
+        return 'Property name cannot be a reserved prototype key';
+    }
     const validIdentifierPattern = /^[a-zA-Z_][a-zA-Z0-9_]*$/;
     if (!validIdentifierPattern.test(name)) {
         return 'Property name must start with a letter or underscore and contain only letters, numbers, and underscores';
     }
-    const duplicates = allProperties.filter(p => p.name === name && p.id !== propertyId);
+    const duplicates = allProperties.filter((p) => p.name === name && p.id !== propertyId);
     if (duplicates.length > 0) {
         return 'Property name must be unique';
     }
     return undefined;
 }
-/**
- * Builds the list of breadcrumb navigation items from a path, using the event type name as the root.
- */
 function buildBreadcrumbItems(eventTypeName, currentPath) {
     const items = [{ name: eventTypeName, path: [] }];
     for (let i = 0; i < currentPath.length; i++) {

package/dist/esm/SchemaEditor/schemaHelpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"schemaHelpers.js","sources":["../../../SchemaEditor/schemaHelpers.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AAIA;;AAEG;SACa,oBAAoB,CAAC,IAAY,EAAE,UAAkB,EAAE,aAAmC,EAAA;IACtG,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;AAC7B,QAAA,OAAO,+BAA+B;IAC1C;IAEA,MAAM,sBAAsB,GAAG,0BAA0B;IACzD,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AACpC,QAAA,OAAO,yGAAyG;IACpH;IAEA,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,CAAC,EAAE,KAAK,UAAU,CAAC;AACpF,IAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACvB,QAAA,OAAO,8BAA8B;IACzC;AAEA,IAAA,OAAO,SAAS;AACpB;AAEA;;AAEG;AACG,SAAU,oBAAoB,CAAC,aAAqB,EAAE,WAAqB,EAAA;AAC7E,IAAA,MAAM,KAAK,GAAqB,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC;AAEnE,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACzC,QAAA,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,CAAC;AAC9B,QAAA,IAAI,OAAO,KAAK,QAAQ,EAAE;YACtB,KAAK,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;QACtE;aAAO;YACH,KAAK,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;QACpE;IACJ;AAEA,IAAA,OAAO,KAAK;AAChB;;"}
+{"version":3,"file":"schemaHelpers.js","sources":["../../../SchemaEditor/schemaHelpers.ts"],"sourcesContent":[null],"names":[],"mappings":"AAKA,MAAM,qBAAqB,GAAG,IAAI,GAAG,CAAC,CAAC,WAAW,EAAE,aAAa,EAAE,WAAW,CAAC,CAAC;SAKhE,oBAAoB,CAChC,IAAY,EACZ,UAAkB,EAClB,aAAmC,EAAA;IAEnC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;AAC7B,QAAA,OAAO,+BAA+B;IAC1C;AAEA,IAAA,IAAI,qBAAqB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;AACjC,QAAA,OAAO,kDAAkD;IAC7D;IAEA,MAAM,sBAAsB,GAAG,0BAA0B;IACzD,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AACpC,QAAA,OAAO,yGAAyG;IACpH;IAEA,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CACnC,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,CAAC,EAAE,KAAK,UAAU,CAChD;AACD,IAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACvB,QAAA,OAAO,8BAA8B;IACzC;AAEA,IAAA,OAAO,SAAS;AACpB;AAKM,SAAU,oBAAoB,CAChC,aAAqB,EACrB,WAAqB,EAAA;AAErB,IAAA,MAAM,KAAK,GAAqB,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC;AAEnE,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACzC,QAAA,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,CAAC;AAC9B,QAAA,IAAI,OAAO,KAAK,QAAQ,EAAE;YACtB,KAAK,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;QACtE;aAAO;YACH,KAAK,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;QACpE;IACJ;AAEA,IAAA,OAAO,KAAK;AAChB;;"}

package/dist/esm/TimeMachine/EventsView.d.ts

@@ -1,15 +1,40 @@
-import React from 'react';
-import type { TimelineRootProps } from '@primereact/types/primitive/timeline';
-import type { Event } from './types';
-import { type TimeMachineLabels } from './TimeMachineLabels';
-interface EventsViewProps {
+import { type HTMLAttributes } from 'react';
+import type { Event } from './types.js';
+import { type TimeMachineLabels } from './TimeMachineLabels.js';
+/** Stable part attributes for {@link EventsView}. */
+export interface EventsViewParts {
+    /** Scrollable container wrapping the entire vertical timeline. */
+    timeline?: HTMLAttributes<HTMLDivElement>;
+    /** One timeline event article element with `data-position` (left/right). */
+    event?: HTMLAttributes<HTMLElement>;
+    /** Separator column containing the marker and optional connector line. */
+    separator?: HTMLAttributes<HTMLDivElement>;
+    /** Event marker (the circular dot on the timeline spine). */
+    marker?: HTMLAttributes<HTMLDivElement>;
+    /** Vertical line connecting consecutive event markers. */
+    connector?: HTMLAttributes<HTMLDivElement>;
+    /** Content panel showing the event card (type, timestamp, properties). */
+    content?: HTMLAttributes<HTMLDivElement>;
+}
+/** Props for the standalone, localized event timeline. */
+export interface EventsViewProps {
+    /** Ordered list of domain events to render in the vertical timeline. */
     events: Event[];
+    /** CSS class name applied to the timeline root. */
     className?: string;
-    pt?: TimelineRootProps['pt'];
-    ptOptions?: TimelineRootProps['ptOptions'];
+    /** Cratis-owned per-part attributes for timeline, event, separator, marker, connector, content. */
+    pt?: EventsViewParts;
+    /**
+     * @deprecated Cratis parts always merge. Remove this renderer-era option.
+     */
+    ptOptions?: object;
+    /**
+     * @deprecated Components always uses consumer-owned CSS. Customize through `pt` and CSS instead.
+     */
     unstyled?: boolean;
+    /** Override any user-facing string (for localization). See {@link TimeMachineLabels}. */
     labels?: TimeMachineLabels;
 }
-export declare const EventsView: React.FC<EventsViewProps>;
-export {};
-//# sourceMappingURL=EventsView.d.ts.map
+export declare const SelectedEventSequenceNumbersContext: import("react").Context<ReadonlySet<number> | undefined>;
+/** Vertical, alternating timeline visualization of an ordered event list. */
+export declare const EventsView: ({ events, className, pt, labels, }: EventsViewProps) => import("react").JSX.Element;

package/dist/esm/TimeMachine/EventsView.js

@@ -1,24 +1,13 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { useRef, useState, useEffect } from 'react';
-import { Timeline } from 'primereact/timeline';
+import { createContext, useRef, useContext, useState, useEffect } from 'react';
 import { defaultTimeMachineLabels } from './TimeMachineLabels.js';
 import { Properties } from './Properties.js';
 
-/**
- * Vertical timeline visualization of an ordered list of Cratis events.
- * Renders each event on alternating sides of a central spine with its
- * properties shown in a popup, and tracks scroll boundaries so up/down
- * arrows appear only when there's content to scroll to.
- *
- * Used inside {@link TimeMachine} to show the events that produced a given
- * read-model version, but can be reused for any event timeline UI.
- *
- * @param props - {@link EventsViewProps}.
- */
-const EventsView = ({ events, className, pt, ptOptions, unstyled, labels = defaultTimeMachineLabels }) => {
-    // Use test data if no events provided
-    const displayEvents = events.length > 0 ? events : [];
+const classNames = (...values) => values.filter(Boolean).join(' ');
+const SelectedEventSequenceNumbersContext = createContext(undefined);
+const EventsView = ({ events, className, pt, labels = defaultTimeMachineLabels, }) => {
     const containerRef = useRef(null);
+    const selectedEventSequenceNumbers = useContext(SelectedEventSequenceNumbersContext);
     const [canScrollUp, setCanScrollUp] = useState(false);
     const [canScrollDown, setCanScrollDown] = useState(false);
     const updateScrollState = () => {
@@ -29,40 +18,33 @@ const EventsView = ({ events, className, pt, ptOptions, unstyled, labels = defau
             return;
         }
         const { scrollTop, scrollHeight, clientHeight } = container;
-        const epsilon = 1;
-        setCanScrollUp(scrollTop > epsilon);
-        setCanScrollDown(scrollTop + clientHeight < scrollHeight - epsilon);
+        setCanScrollUp(scrollTop > 1);
+        setCanScrollDown(scrollTop + clientHeight < scrollHeight - 1);
     };
     useEffect(() => {
         updateScrollState();
         const container = containerRef.current;
         if (!container)
             return;
-        const handleScroll = () => updateScrollState();
-        container.addEventListener('scroll', handleScroll);
-        return () => container.removeEventListener('scroll', handleScroll);
-    }, [displayEvents.length]);
-    const renderEventCard = (event, position) => {
-        const isLeft = position === 'left';
-        return (jsxs("div", { className: `events-view-event-card events-view-event-card--${position}`, children: [jsxs("div", { className: `events-view-event-header ${isLeft ? 'events-view-event-header--right' : ''}`, children: [jsx("h3", { className: `events-view-event-name ${isLeft ? 'events-view-event-name--right' : ''}`, children: event.type }), jsx("div", { className: `events-view-event-timestamp ${isLeft ? 'events-view-event-timestamp--right' : ''}`, children: event.occurred.toLocaleString() })] }), jsx("div", { className: "events-view-event-properties", children: jsx(Properties, { data: event.content || {}, align: "left" }) })] }));
-    };
-    const customContent = (event, index) => {
-        // PrimeReact places even indices (0,2,4,...) on the right, odd on the left
-        const position = index % 2 === 0 ? 'right' : 'left';
-        return renderEventCard(event, position);
-    };
-    const customMarker = () => {
-        return (jsx("div", { className: "events-view-marker", children: jsx("div", { className: "events-view-marker-dot" }) }));
-    };
-    const scrollToTop = () => containerRef.current?.scrollTo({ top: 0, behavior: 'smooth' });
+        container.addEventListener('scroll', updateScrollState);
+        return () => container.removeEventListener('scroll', updateScrollState);
+    }, [events.length]);
+    const scrollBehavior = () => window.matchMedia('(prefers-reduced-motion: reduce)').matches ? 'auto' : 'smooth';
+    const scrollToTop = () => containerRef.current?.scrollTo({ top: 0, behavior: scrollBehavior() });
     const scrollToBottom = () => {
         const container = containerRef.current;
-        if (!container)
-            return;
-        container.scrollTo({ top: container.scrollHeight, behavior: 'smooth' });
+        if (container)
+            container.scrollTo({
+                top: container.scrollHeight,
+                behavior: scrollBehavior(),
+            });
     };
-    return (jsxs("div", { className: "events-view-container", ref: containerRef, children: [canScrollUp && (jsx("div", { className: "events-view-scroll-button-wrapper events-view-scroll-button-wrapper--top", children: jsx("button", { type: "button", className: "events-view-scroll-button events-view-scroll-button--top", onClick: scrollToTop, "aria-label": labels.scrollToTop, children: jsx("i", { className: "pi pi-arrow-up" }) }) })), jsx(Timeline.Root, { align: "alternate", className: className ? `events-view-timeline ${className}` : 'events-view-timeline', pt: pt, ptOptions: ptOptions, unstyled: unstyled, children: displayEvents.map((event, index) => (jsxs(Timeline.Event, { children: [jsxs(Timeline.Separator, { children: [jsx(Timeline.Marker, { children: customMarker() }), index < displayEvents.length - 1 && jsx(Timeline.Connector, {})] }), jsx(Timeline.Content, { children: customContent(event, index) })] }, index))) }), canScrollDown && (jsx("div", { className: "events-view-scroll-button-wrapper events-view-scroll-button-wrapper--bottom", children: jsx("button", { type: "button", className: "events-view-scroll-button events-view-scroll-button--bottom", onClick: scrollToBottom, "aria-label": labels.scrollToBottom, children: jsx("i", { className: "pi pi-arrow-down" }) }) }))] }));
+    return (jsxs("div", { className: 'events-view-container', ref: containerRef, children: [canScrollUp && (jsx("div", { className: 'events-view-scroll-button-wrapper events-view-scroll-button-wrapper--top', children: jsx("button", { type: 'button', className: 'events-view-scroll-button events-view-scroll-button--top', onClick: scrollToTop, "aria-label": labels.scrollToTop, children: "\u2191" }) })), jsx("div", { ...pt?.timeline, className: classNames('events-view-timeline', pt?.timeline?.className, className), "data-cratis-part": 'timeline', children: events.map((event, index) => {
+                    const position = index % 2 === 0 ? 'right' : 'left';
+                    const isSelected = selectedEventSequenceNumbers?.has(event.sequenceNumber);
+                    return (jsxs("article", { ...pt?.event, className: classNames('events-view-timeline-event', pt?.event?.className), "data-cratis-part": 'event', "data-position": position, "data-selected": isSelected || undefined, children: [jsxs("div", { ...pt?.separator, className: classNames('events-view-timeline-separator', pt?.separator?.className), "data-cratis-part": 'separator', children: [jsx("div", { ...pt?.marker, className: classNames('events-view-marker', pt?.marker?.className), "data-cratis-part": 'marker', "data-selected": isSelected || undefined, children: jsx("div", { className: 'events-view-marker-dot' }) }), index < events.length - 1 && (jsx("div", { ...pt?.connector, className: classNames('events-view-timeline-connector', pt?.connector?.className), "data-cratis-part": 'connector' }))] }), jsx("div", { ...pt?.content, className: classNames('events-view-timeline-content', pt?.content?.className), "data-cratis-part": 'content', children: jsxs("div", { className: `events-view-event-card events-view-event-card--${position}`, children: [jsxs("div", { className: `events-view-event-header ${position === 'left' ? 'events-view-event-header--right' : ''}`, children: [jsx("h3", { className: `events-view-event-name ${position === 'left' ? 'events-view-event-name--right' : ''}`, children: event.type }), jsx("div", { className: `events-view-event-timestamp ${position === 'left' ? 'events-view-event-timestamp--right' : ''}`, children: event.occurred.toLocaleString() })] }), jsx("div", { className: 'events-view-event-properties', children: jsx(Properties, { data: event.content || {}, align: 'left' }) })] }) })] }, `${event.type}-${event.occurred.toISOString()}-${index}`));
+                }) }), canScrollDown && (jsx("div", { className: 'events-view-scroll-button-wrapper events-view-scroll-button-wrapper--bottom', children: jsx("button", { type: 'button', className: 'events-view-scroll-button events-view-scroll-button--bottom', onClick: scrollToBottom, "aria-label": labels.scrollToBottom, children: "\u2193" }) }))] }));
 };
 
-export { EventsView };
+export { EventsView, SelectedEventSequenceNumbersContext };
 //# sourceMappingURL=EventsView.js.map

package/dist/esm/TimeMachine/EventsView.js.map

@@ -1 +1 @@
-{"version":3,"file":"EventsView.js","sources":["../../../TimeMachine/EventsView.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"EventsView.js","sources":["../../../TimeMachine/EventsView.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/TimeMachine/Properties.d.ts

@@ -1,9 +1,16 @@
 import React from 'react';
 interface PropertiesProps {
     data: Record<string, unknown>;
+    /** CSS class name for the container */
     className?: string;
+    /** Text alignment for the table */
     align?: 'left' | 'right';
 }
+/**
+ * Renders a key-value property table showing an entity's properties at a point in time.
+ * Used by {@link EventsView} to display event content and by {@link ReadModelView} for
+ * version snapshots. A public composable building block for rendering structured data.
+ */
 export declare const Properties: React.FC<PropertiesProps>;
 export {};
 //# sourceMappingURL=Properties.d.ts.map

package/dist/esm/TimeMachine/Properties.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Properties.d.ts","sourceRoot":"","sources":["../../../TimeMachine/Properties.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,UAAU,eAAe;IACrB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAE9B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAqDhD,CAAC"}
+{"version":3,"file":"Properties.d.ts","sourceRoot":"","sources":["../../../TimeMachine/Properties.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,UAAU,eAAe;IACrB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9B,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mCAAmC;IACnC,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAC5B;AAED;;;;GAIG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAwEhD,CAAC"}

package/dist/esm/TimeMachine/Properties.js

@@ -1,30 +1,33 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { formatPropertyName } from './propertiesHelpers.js';
 
-const Properties = ({ data, className, align = 'left' }) => {
+const Properties = ({ data, className, align = 'left', }) => {
     const isRight = align === 'right';
     const renderValue = (value) => {
         if (value === null || value === undefined) {
-            return jsx("span", { className: "tm-properties-null", children: "null" });
+            return jsx("span", { className: 'tm-properties-null', children: "null" });
         }
         if (typeof value === 'boolean') {
-            return jsx("span", { className: value ? 'tm-properties-boolean-true' : 'tm-properties-boolean-false', children: value.toString() });
+            return (jsx("span", { className: value
+                    ? 'tm-properties-boolean-true'
+                    : 'tm-properties-boolean-false', children: value.toString() }));
         }
         if (typeof value === 'number') {
-            return jsx("span", { className: "tm-properties-number", children: value });
+            return jsx("span", { className: 'tm-properties-number', children: value });
         }
         if (value instanceof Date) {
-            return jsx("span", { className: "tm-properties-date", children: value.toLocaleString() });
+            return jsx("span", { className: 'tm-properties-date', children: value.toLocaleString() });
         }
         if (Array.isArray(value)) {
-            return (jsxs("span", { className: "tm-properties-complex", children: ["Array[", value.length, "]"] }));
+            return jsxs("span", { className: 'tm-properties-complex', children: ["Array[", value.length, "]"] });
         }
         if (typeof value === 'object') {
-            return (jsxs("span", { className: "tm-properties-complex", children: ['{', "...", '}'] }));
+            return (jsxs("span", { className: 'tm-properties-complex', children: ['{', "...", '}'] }));
         }
         return jsx("span", { children: String(value) });
     };
-    return (jsx("div", { className: className, children: jsx("table", { className: "tm-properties-table", children: jsx("tbody", { children: data && Object.entries(data).map(([key, value], index) => (jsxs("tr", { className: "tm-properties-row", children: [jsx("td", { className: `tm-properties-label${isRight ? ' tm-properties-label--right' : ''}`, children: formatPropertyName(key) }), jsx("td", { className: `tm-properties-value${isRight ? ' tm-properties-value--right' : ''}`, children: renderValue(value) })] }, `${key}-${index}`))) }) }) }));
+    return (jsx("div", { className: className, children: jsx("table", { className: 'tm-properties-table', children: jsx("tbody", { children: data &&
+                    Object.entries(data).map(([key, value], index) => (jsxs("tr", { className: 'tm-properties-row', children: [jsx("td", { className: `tm-properties-label${isRight ? ' tm-properties-label--right' : ''}`, children: formatPropertyName(key) }), jsx("td", { className: `tm-properties-value${isRight ? ' tm-properties-value--right' : ''}`, children: renderValue(value) })] }, `${key}-${index}`))) }) }) }));
 };
 
 export { Properties };

package/dist/esm/TimeMachine/Properties.js.map

@@ -1 +1 @@
-{"version":3,"file":"Properties.js","sources":["../../../TimeMachine/Properties.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":";;;AAcO,MAAM,UAAU,GAA8B,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,EAAE,KAAI;AACzF,IAAA,MAAM,OAAO,GAAG,KAAK,KAAK,OAAO;AAEjC,IAAA,MAAM,WAAW,GAAG,CAAC,KAAc,KAAqB;QACpD,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS,EAAE;AACvC,YAAA,OAAOA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,qBAAY;QAC3D;AAEA,QAAA,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE;AAC5B,YAAA,OAAOA,cAAM,SAAS,EAAE,KAAK,GAAG,4BAA4B,GAAG,6BAA6B,EAAA,QAAA,EAAG,KAAK,CAAC,QAAQ,EAAE,GAAQ;QAC3H;AAEA,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC3B,YAAA,OAAOA,cAAM,SAAS,EAAC,sBAAsB,EAAA,QAAA,EAAE,KAAK,GAAQ;QAChE;AAEA,QAAA,IAAI,KAAK,YAAY,IAAI,EAAE;YACvB,OAAOA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAE,KAAK,CAAC,cAAc,EAAE,EAAA,CAAQ;QAC/E;AAEA,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACtB,QACIC,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,uBAAuB,EAAA,QAAA,EAAA,CAAA,QAAA,EAC5B,KAAK,CAAC,MAAM,EAAA,GAAA,CAAA,EAAA,CAChB;QAEf;AAEA,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;YAC3B,QACIA,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,uBAAuB,EAAA,QAAA,EAAA,CAClC,GAAG,EAAA,KAAA,EAAK,GAAG,CAAA,EAAA,CACT;QAEf;AAEA,QAAA,OAAOD,wBAAO,MAAM,CAAC,KAAK,CAAC,GAAQ;AACvC,IAAA,CAAC;IAED,QACIA,aAAK,SAAS,EAAE,SAAS,EAAA,QAAA,EACrBA,GAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAC,qBAAqB,YAClCA,GAAA,CAAA,OAAA,EAAA,EAAA,QAAA,EACK,IAAI,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,KAAK,MAClDC,IAAA,CAAA,IAAA,EAAA,EAA4B,SAAS,EAAC,mBAAmB,EAAA,QAAA,EAAA,CACrDD,YAAI,SAAS,EAAE,CAAA,mBAAA,EAAsB,OAAO,GAAG,6BAA6B,GAAG,EAAE,EAAE,EAAA,QAAA,EAAG,kBAAkB,CAAC,GAAG,CAAC,GAAM,EACnHA,GAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAE,CAAA,mBAAA,EAAsB,OAAO,GAAG,6BAA6B,GAAG,EAAE,EAAE,EAAA,QAAA,EAAG,WAAW,CAAC,KAAK,CAAC,GAAM,CAAA,EAAA,EAFzG,CAAA,EAAG,GAAG,CAAA,CAAA,EAAI,KAAK,EAAE,CAGrB,CACR,CAAC,EAAA,CACE,EAAA,CACJ,EAAA,CACN;AAEd;;"}
+{"version":3,"file":"Properties.js","sources":["../../../TimeMachine/Properties.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":";;;AAmBO,MAAM,UAAU,GAA8B,CAAC,EAClD,IAAI,EACJ,SAAS,EACT,KAAK,GAAG,MAAM,GACjB,KAAI;AACD,IAAA,MAAM,OAAO,GAAG,KAAK,KAAK,OAAO;AAEjC,IAAA,MAAM,WAAW,GAAG,CAAC,KAAc,KAAqB;QACpD,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS,EAAE;AACvC,YAAA,OAAOA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,qBAAY;QAC3D;AAEA,QAAA,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE;AAC5B,YAAA,QACIA,GAAA,CAAA,MAAA,EAAA,EACI,SAAS,EACL;AACI,sBAAE;sBACA,6BAA6B,EAAA,QAAA,EAGtC,KAAK,CAAC,QAAQ,EAAE,EAAA,CACd;QAEf;AAEA,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC3B,YAAA,OAAOA,cAAM,SAAS,EAAC,sBAAsB,EAAA,QAAA,EAAE,KAAK,GAAQ;QAChE;AAEA,QAAA,IAAI,KAAK,YAAY,IAAI,EAAE;YACvB,OAAOA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAE,KAAK,CAAC,cAAc,EAAE,EAAA,CAAQ;QAC/E;AAEA,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACtB,OAAOC,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,uBAAuB,uBAAQ,KAAK,CAAC,MAAM,EAAA,GAAA,CAAA,EAAA,CAAS;QAC/E;AAEA,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;YAC3B,QACIA,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,uBAAuB,EAAA,QAAA,EAAA,CAClC,GAAG,EAAA,KAAA,EAAK,GAAG,CAAA,EAAA,CACT;QAEf;AAEA,QAAA,OAAOD,wBAAO,MAAM,CAAC,KAAK,CAAC,GAAQ;AACvC,IAAA,CAAC;AAED,IAAA,QACIA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,SAAS,EAAA,QAAA,EACrBA,GAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAC,qBAAqB,EAAA,QAAA,EAClCA,GAAA,CAAA,OAAA,EAAA,EAAA,QAAA,EACK,IAAI;AACD,oBAAA,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,KAAK,MACzCC,aAA4B,SAAS,EAAC,mBAAmB,EAAA,QAAA,EAAA,CACrDD,YACI,SAAS,EAAE,CAAA,mBAAA,EAAsB,OAAO,GAAG,6BAA6B,GAAG,EAAE,CAAA,CAAE,EAAA,QAAA,EAE9E,kBAAkB,CAAC,GAAG,CAAC,EAAA,CACvB,EACLA,YACI,SAAS,EAAE,CAAA,mBAAA,EAAsB,OAAO,GAAG,6BAA6B,GAAG,EAAE,CAAA,CAAE,EAAA,QAAA,EAE9E,WAAW,CAAC,KAAK,CAAC,EAAA,CAClB,CAAA,EAAA,EAVA,GAAG,GAAG,CAAA,CAAA,EAAI,KAAK,CAAA,CAAE,CAWrB,CACR,CAAC,GACF,EAAA,CACJ,EAAA,CACN;AAEd;;"}

package/dist/esm/TimeMachine/ReadModelView.d.ts

@@ -1,14 +1,39 @@
-import React from 'react';
-import type { Version } from './types';
-import { type TimeMachineLabels } from './TimeMachineLabels';
+import type React from 'react';
+import type { Version } from './types.js';
+import { type TimeMachineLabels } from './TimeMachineLabels.js';
+/**
+ * Props for {@link ReadModelView}.
+ */
 interface ReadModelViewProps {
+    /** Ordered list of read-model versions to display. */
     versions: Version[];
+    /** Index of the currently-selected (committed) version. */
     selectedIndex: number;
+    /**
+     * Index of the currently-hovered version, or `null` when nothing is hovered.
+     * Used to preview a version without committing the selection.
+     */
     hoveredIndex: number | null;
+    /** Invoked when the user clicks a version card to select it. */
     onVersionSelect: (index: number) => void;
+    /**
+     * Invoked when the hover state over any card changes — true on enter,
+     * false on leave. Lets the parent coordinate the surrounding chrome with
+     * the hover state.
+     */
     onHoveringCardChange: (isHovering: boolean) => void;
+    /** Accessible-name overrides; defaults to English. See {@link TimeMachineLabels}. */
     labels?: TimeMachineLabels;
 }
+/**
+ * Visual representation of a read-model's version history as a row of
+ * flippable "window" cards. Each card shows the read-model state at that
+ * version on its front face and can be flipped to reveal additional metadata.
+ *
+ * Selection and hover are externally controlled so the parent {@link TimeMachine}
+ * can synchronize the read-model view with the events timeline.
+ *
+ * @param props - {@link ReadModelViewProps}.
+ */
 export declare const ReadModelView: React.FC<ReadModelViewProps>;
 export {};
-//# sourceMappingURL=ReadModelView.d.ts.map

package/dist/esm/TimeMachine/ReadModelView.js

@@ -2,17 +2,8 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { defaultTimeMachineLabels } from './TimeMachineLabels.js';
 import { Properties } from './Properties.js';
+import { FaArrowRotateLeft, FaArrowRotateRight } from 'react-icons/fa6';
 
-/**
- * Visual representation of a read-model's version history as a row of
- * flippable "window" cards. Each card shows the read-model state at that
- * version on its front face and can be flipped to reveal additional metadata.
- *
- * Selection and hover are externally controlled so the parent {@link TimeMachine}
- * can synchronize the read-model view with the events timeline.
- *
- * @param props - {@link ReadModelViewProps}.
- */
 const ReadModelView = ({ versions, selectedIndex, hoveredIndex, onVersionSelect, onHoveringCardChange, labels = defaultTimeMachineLabels, }) => {
     const displayIndex = hoveredIndex ?? selectedIndex;
     const [flippedMap, setFlippedMap] = useState({});
@@ -26,11 +17,11 @@ const ReadModelView = ({ versions, selectedIndex, hoveredIndex, onVersionSelect,
     return (jsxs(Fragment, { children: [jsxs("div", { className: "time-machine-background", children: [jsx("div", { className: "stars" }), jsx("div", { className: "stars stars-2" }), jsx("div", { className: "stars stars-3" })] }), jsx("div", { className: "time-machine-viewport", children: jsx("div", { className: "windows-container", children: versions.map((version, index) => {
                         const depth = index - displayIndex;
                         const isActive = index === displayIndex;
+                        const isSelected = index === selectedIndex;
                         const isVisible = depth >= 0 && depth < 10;
                         const isFlipped = flippedMap[version.id] ?? false;
                         if (!isVisible)
                             return null;
-                        // Only prepare events for the active version to avoid showing all events at once
                         const events = isActive && version.events?.length
                             ? version.events.map(event => ({
                                 ...event,
@@ -42,7 +33,7 @@ const ReadModelView = ({ versions, selectedIndex, hoveredIndex, onVersionSelect,
                                 '--z-offset': -depth * 150,
                                 '--scale': 1 - depth * 0.05,
                                 '--opacity': 1 - depth * 0.12,
-                            }, onClick: () => onVersionSelect(index), onMouseEnter: () => onHoveringCardChange(true), onMouseLeave: () => onHoveringCardChange(false), children: jsxs("div", { className: "version-window-inner", children: [jsxs("div", { className: "version-window-face version-window-face--front", children: [jsxs("div", { className: "window-chrome", children: [jsxs("div", { className: "window-controls", children: [jsx("span", { className: "control close" }), jsx("span", { className: "control minimize" }), jsx("span", { className: "control maximize" })] }), jsx("div", { className: "window-title", children: version.label }), jsx("div", { className: "window-actions", children: jsx("button", { type: "button", className: "window-flip-button", onClick: toggleFlip(version.id), "aria-label": labels.showRelatedEvents, "aria-pressed": isFlipped, children: jsx("i", { className: `pi ${isFlipped ? 'pi-undo' : 'pi-refresh'}` }) }) })] }), jsx("div", { className: "window-content", children: version.content })] }), jsxs("div", { className: "version-window-face version-window-face--back", children: [jsxs("div", { className: "window-chrome window-chrome--back", children: [jsxs("div", { className: "window-controls", children: [jsx("span", { className: "control close" }), jsx("span", { className: "control minimize" }), jsx("span", { className: "control maximize" })] }), jsx("div", { className: "window-title", children: "Related Events" }), jsx("div", { className: "window-actions", children: jsx("button", { type: "button", className: "window-flip-button", onClick: toggleFlip(version.id), "aria-label": labels.showReadModelSnapshot, "aria-pressed": isFlipped, children: jsx("i", { className: `pi ${isFlipped ? 'pi-undo' : 'pi-refresh'}` }) }) })] }), jsx("div", { className: "window-content window-content--events", children: jsx("div", { className: "snapshot-event-list", children: events.map((event, eventIndex) => (jsxs("div", { className: "snapshot-event", children: [jsxs("div", { className: "snapshot-event-header", children: [jsx("span", { className: "snapshot-event-name", children: event.type }), jsx("span", { className: "snapshot-event-timestamp", children: event.occurred.toLocaleString() })] }), jsx(Properties, { data: event.content, align: "left" })] }, `${version.id}-${event.sequenceNumber ?? eventIndex}`))) }) })] })] }) }, version.id));
+                            }, onClick: () => onVersionSelect(index), "data-selected": isSelected || undefined, onMouseEnter: () => onHoveringCardChange(true), onMouseLeave: () => onHoveringCardChange(false), children: jsxs("div", { className: "version-window-inner", children: [jsxs("div", { className: "version-window-face version-window-face--front", children: [jsxs("div", { className: "window-chrome", children: [jsxs("div", { className: "window-controls", children: [jsx("span", { className: "control close" }), jsx("span", { className: "control minimize" }), jsx("span", { className: "control maximize" })] }), jsx("div", { className: "window-title", children: version.label }), jsx("div", { className: "window-actions", children: jsx("button", { type: "button", className: "window-flip-button", onClick: toggleFlip(version.id), "aria-label": labels.showRelatedEvents, "aria-pressed": isFlipped, "data-pressed": isFlipped || undefined, children: isFlipped ? (jsx(FaArrowRotateLeft, { "aria-hidden": 'true' })) : (jsx(FaArrowRotateRight, { "aria-hidden": 'true' })) }) })] }), jsx("div", { className: "window-content", children: version.content })] }), jsxs("div", { className: "version-window-face version-window-face--back", children: [jsxs("div", { className: "window-chrome window-chrome--back", children: [jsxs("div", { className: "window-controls", children: [jsx("span", { className: "control close" }), jsx("span", { className: "control minimize" }), jsx("span", { className: "control maximize" })] }), jsx("div", { className: "window-title", children: "Related Events" }), jsx("div", { className: "window-actions", children: jsx("button", { type: "button", className: "window-flip-button", onClick: toggleFlip(version.id), "aria-label": labels.showReadModelSnapshot, "aria-pressed": isFlipped, "data-pressed": isFlipped || undefined, children: isFlipped ? (jsx(FaArrowRotateLeft, { "aria-hidden": 'true' })) : (jsx(FaArrowRotateRight, { "aria-hidden": 'true' })) }) })] }), jsx("div", { className: "window-content window-content--events", children: jsx("div", { className: "snapshot-event-list", children: events.map((event, eventIndex) => (jsxs("div", { className: "snapshot-event", children: [jsxs("div", { className: "snapshot-event-header", children: [jsx("span", { className: "snapshot-event-name", children: event.type }), jsx("span", { className: "snapshot-event-timestamp", children: event.occurred.toLocaleString() })] }), jsx(Properties, { data: event.content, align: "left" })] }, `${version.id}-${event.sequenceNumber ?? eventIndex}`))) }) })] })] }) }, version.id));
                     }) }) })] }));
 };