@sqlrooms/cosmos 0.6.0 → 0.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +168 -0
- package/dist/index.d.ts +1 -111
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -111
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
package/README.md
ADDED
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
A powerful graph visualization package for SQLRooms applications. This package provides React components and hooks for creating interactive graph visualizations using a WebGL-based graph rendering engine, with state management through Zustand.
|
|
2
|
+
|
|
3
|
+
This package is built on top of the [Cosmos library](https://github.com/cosmograph-org/cosmos), a GPU-accelerated force graph layout and rendering library.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- 🌐 **Interactive Graphs**: Create dynamic, interactive graph visualizations
|
|
8
|
+
- 🚀 **WebGL Rendering**: High-performance rendering for large graphs
|
|
9
|
+
- 🧩 **React Components**: Ready-to-use components for graph visualization
|
|
10
|
+
- 🔄 **State Management**: Zustand-based state management for graph state
|
|
11
|
+
- 🎛️ **Simulation Controls**: Fine-grained control over physics simulation
|
|
12
|
+
- 🎨 **Customizable Styling**: Extensive options for visual customization
|
|
13
|
+
|
|
14
|
+
## Installation
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
npm install @sqlrooms/cosmos
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## Basic Usage
|
|
21
|
+
|
|
22
|
+
### Simple Graph Visualization
|
|
23
|
+
|
|
24
|
+
```tsx
|
|
25
|
+
import {
|
|
26
|
+
CosmosGraph,
|
|
27
|
+
CosmosGraphControls,
|
|
28
|
+
createDefaultCosmosConfig,
|
|
29
|
+
} from '@sqlrooms/cosmos';
|
|
30
|
+
|
|
31
|
+
function MyGraph() {
|
|
32
|
+
const graphData = {
|
|
33
|
+
nodes: [
|
|
34
|
+
{id: 'node1', label: 'Node 1'},
|
|
35
|
+
{id: 'node2', label: 'Node 2'},
|
|
36
|
+
{id: 'node3', label: 'Node 3'},
|
|
37
|
+
],
|
|
38
|
+
links: [
|
|
39
|
+
{source: 'node1', target: 'node2'},
|
|
40
|
+
{source: 'node2', target: 'node3'},
|
|
41
|
+
{source: 'node3', target: 'node1'},
|
|
42
|
+
],
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
return (
|
|
46
|
+
<div style={{width: '800px', height: '600px'}}>
|
|
47
|
+
<CosmosGraph config={createDefaultCosmosConfig()} data={graphData}>
|
|
48
|
+
<CosmosGraphControls />
|
|
49
|
+
</CosmosGraph>
|
|
50
|
+
</div>
|
|
51
|
+
);
|
|
52
|
+
}
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
### With Simulation Controls
|
|
56
|
+
|
|
57
|
+
```tsx
|
|
58
|
+
import {
|
|
59
|
+
CosmosGraph,
|
|
60
|
+
CosmosGraphControls,
|
|
61
|
+
CosmosSimulationControls,
|
|
62
|
+
createDefaultCosmosConfig,
|
|
63
|
+
} from '@sqlrooms/cosmos';
|
|
64
|
+
|
|
65
|
+
function AdvancedGraph() {
|
|
66
|
+
return (
|
|
67
|
+
<div style={{width: '800px', height: '600px', position: 'relative'}}>
|
|
68
|
+
<CosmosGraph config={createDefaultCosmosConfig()} data={graphData}>
|
|
69
|
+
<CosmosGraphControls />
|
|
70
|
+
<CosmosSimulationControls className="absolute bottom-4 left-4" />
|
|
71
|
+
</CosmosGraph>
|
|
72
|
+
</div>
|
|
73
|
+
);
|
|
74
|
+
}
|
|
75
|
+
```
|
|
76
|
+
|
|
77
|
+
### Using with Zustand Store
|
|
78
|
+
|
|
79
|
+
```tsx
|
|
80
|
+
import {
|
|
81
|
+
createCosmosSlice,
|
|
82
|
+
useStoreWithCosmos,
|
|
83
|
+
createDefaultCosmosConfig,
|
|
84
|
+
} from '@sqlrooms/cosmos';
|
|
85
|
+
import {createProjectStore} from '@sqlrooms/project-builder';
|
|
86
|
+
|
|
87
|
+
// Create a project store with cosmos capabilities
|
|
88
|
+
const useStore = createProjectStore({
|
|
89
|
+
cosmos: createCosmosSlice(createDefaultCosmosConfig()),
|
|
90
|
+
});
|
|
91
|
+
|
|
92
|
+
function GraphWithState() {
|
|
93
|
+
const {setGraphData, toggleSimulation, isSimulationRunning, zoomToFit} =
|
|
94
|
+
useStoreWithCosmos(useStore);
|
|
95
|
+
|
|
96
|
+
// Load graph data
|
|
97
|
+
useEffect(() => {
|
|
98
|
+
setGraphData(myGraphData);
|
|
99
|
+
}, []);
|
|
100
|
+
|
|
101
|
+
return (
|
|
102
|
+
<div>
|
|
103
|
+
<button onClick={toggleSimulation}>
|
|
104
|
+
{isSimulationRunning ? 'Pause' : 'Resume'} Simulation
|
|
105
|
+
</button>
|
|
106
|
+
<button onClick={zoomToFit}>Zoom to Fit</button>
|
|
107
|
+
|
|
108
|
+
<CosmosGraph store={useStore}>
|
|
109
|
+
<CosmosGraphControls />
|
|
110
|
+
</CosmosGraph>
|
|
111
|
+
</div>
|
|
112
|
+
);
|
|
113
|
+
}
|
|
114
|
+
```
|
|
115
|
+
|
|
116
|
+
## Configuration
|
|
117
|
+
|
|
118
|
+
The Cosmos graph visualization system provides extensive configuration options for both visual appearance and physics simulation.
|
|
119
|
+
|
|
120
|
+
### Visual Configuration
|
|
121
|
+
|
|
122
|
+
```tsx
|
|
123
|
+
const config = {
|
|
124
|
+
pointSizeScale: 1.2, // Base scale for node sizes
|
|
125
|
+
scalePointsOnZoom: true, // Dynamic node sizing with zoom
|
|
126
|
+
renderLinks: true, // Toggle link visibility
|
|
127
|
+
linkArrows: true, // Show directional arrows
|
|
128
|
+
curvedLinks: true, // Use curved links
|
|
129
|
+
linkWidth: 1.5, // Width of links
|
|
130
|
+
linkOpacity: 0.8, // Opacity of links
|
|
131
|
+
// ... other visual options
|
|
132
|
+
};
|
|
133
|
+
```
|
|
134
|
+
|
|
135
|
+
### Physics Simulation Configuration
|
|
136
|
+
|
|
137
|
+
```tsx
|
|
138
|
+
const config = {
|
|
139
|
+
simulationGravity: 0.2, // Center attraction strength
|
|
140
|
+
simulationRepulsion: 1.0, // Node repulsion strength
|
|
141
|
+
simulationLinkSpring: 1.2, // Link elasticity
|
|
142
|
+
simulationLinkDistance: 15, // Preferred link distance
|
|
143
|
+
simulationFriction: 0.85, // Movement damping
|
|
144
|
+
simulationDecay: 1000, // Simulation cooling rate
|
|
145
|
+
// ... other physics options
|
|
146
|
+
};
|
|
147
|
+
```
|
|
148
|
+
|
|
149
|
+
## Advanced Features
|
|
150
|
+
|
|
151
|
+
- **Custom Node Rendering**: Define custom renderers for nodes
|
|
152
|
+
- **Interactive Events**: Handle click, hover, and drag events
|
|
153
|
+
- **Data Binding**: Connect graph data to your application state
|
|
154
|
+
- **Layout Algorithms**: Apply different layout algorithms
|
|
155
|
+
- **Performance Optimization**: Options for handling large graphs
|
|
156
|
+
|
|
157
|
+
For more information, visit the SQLRooms documentation.
|
|
158
|
+
|
|
159
|
+
## About Cosmograph Cosmos
|
|
160
|
+
|
|
161
|
+
This package is built on top of [Cosmograph Cosmos](https://github.com/cosmograph-org/cosmos), a GPU-accelerated force graph layout and rendering library. Cosmograph Cosmos offers:
|
|
162
|
+
|
|
163
|
+
- **GPU Acceleration**: All computations and rendering happen on the GPU in fragment and vertex shaders
|
|
164
|
+
- **High Performance**: Capable of rendering hundreds of thousands of nodes and links in real-time
|
|
165
|
+
- **WebGL-based**: Utilizes WebGL for efficient graph visualization
|
|
166
|
+
- **Advanced Physics**: Sophisticated force-directed layout algorithms
|
|
167
|
+
|
|
168
|
+
For more information about the underlying library, visit the [Cosmograph Cosmos GitHub repository](https://github.com/cosmograph-org/cosmos) or the [official documentation](https://cosmograph-org.github.io/cosmos/).
|
package/dist/index.d.ts
CHANGED
|
@@ -1,126 +1,16 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @
|
|
3
|
-
*
|
|
4
|
-
* This package provides React components and hooks for creating interactive graph visualizations
|
|
5
|
-
* using the Cosmograph WebGL-based graph visualization library. It includes components for
|
|
6
|
-
* rendering graphs, managing graph state through zustand, and controlling graph interactions.
|
|
7
|
-
*
|
|
8
|
-
* @example Basic usage
|
|
9
|
-
* ```tsx
|
|
10
|
-
* import { CosmosGraph, CosmosGraphControls } from '@sqlrooms/cosmos';
|
|
11
|
-
*
|
|
12
|
-
* const MyGraph = () => {
|
|
13
|
-
* return (
|
|
14
|
-
* <div style={{ width: '800px', height: '600px' }}>
|
|
15
|
-
* <CosmosGraph
|
|
16
|
-
* config={graphConfig}
|
|
17
|
-
* pointPositions={positions}
|
|
18
|
-
* pointColors={colors}
|
|
19
|
-
* pointSizes={sizes}
|
|
20
|
-
* >
|
|
21
|
-
* <CosmosGraphControls />
|
|
22
|
-
* </CosmosGraph>
|
|
23
|
-
* </div>
|
|
24
|
-
* );
|
|
25
|
-
* };
|
|
26
|
-
* ```
|
|
27
|
-
*
|
|
2
|
+
* {@include ../README.md}
|
|
28
3
|
* @packageDocumentation
|
|
29
4
|
*/
|
|
30
5
|
export { CosmosGraph } from './CosmosGraph';
|
|
31
6
|
export { CosmosGraphControls } from './CosmosGraphControls';
|
|
32
7
|
/**
|
|
33
8
|
* A component that provides fine-grained controls for the graph simulation parameters.
|
|
34
|
-
* Uses the zustand store to access and control the graph state.
|
|
35
|
-
*
|
|
36
|
-
* Features:
|
|
37
|
-
* - Slider controls for gravity, repulsion, link strength, link distance, friction, and decay
|
|
38
|
-
* - Real-time parameter adjustment with immediate visual feedback
|
|
39
|
-
* - Tooltips with parameter descriptions
|
|
40
|
-
* - Customizable positioning
|
|
41
|
-
*
|
|
42
|
-
* @example Basic usage
|
|
43
|
-
* ```tsx
|
|
44
|
-
* <CosmosGraph {...graphProps}>
|
|
45
|
-
* <CosmosSimulationControls />
|
|
46
|
-
* </CosmosGraph>
|
|
47
|
-
* ```
|
|
48
|
-
*
|
|
49
|
-
* @example Custom positioning
|
|
50
|
-
* ```tsx
|
|
51
|
-
* <CosmosGraph {...graphProps}>
|
|
52
|
-
* <CosmosSimulationControls className="absolute bottom-4 left-4" />
|
|
53
|
-
* </CosmosGraph>
|
|
54
|
-
* ```
|
|
55
9
|
*/
|
|
56
10
|
export { CosmosSimulationControls } from './CosmosSimulationControls';
|
|
57
11
|
export type { CosmosGraphProps } from './CosmosGraph';
|
|
58
12
|
export { useHoverState } from './hooks/useHoverState';
|
|
59
13
|
export { createCosmosSlice, useStoreWithCosmos, type CosmosSliceState, type ProjectStateWithCosmos, } from './CosmosSlice';
|
|
60
14
|
export { CosmosSliceConfig, createDefaultCosmosConfig, type CosmosSliceConfig as CosmosSliceConfigType, } from './CosmosSliceConfig';
|
|
61
|
-
/**
|
|
62
|
-
* Configuration schema for the Cosmos graph visualization system.
|
|
63
|
-
* Provides type-safe validation and configuration options for both visual and physics aspects of the graph.
|
|
64
|
-
*
|
|
65
|
-
* Configuration Categories:
|
|
66
|
-
*
|
|
67
|
-
* 1. Visual Appearance
|
|
68
|
-
* - Node styling: size scaling and zoom behavior
|
|
69
|
-
* - Link styling: visibility, width, arrows, and curve options
|
|
70
|
-
*
|
|
71
|
-
* 2. Physics Simulation
|
|
72
|
-
* - Gravity: Central force pulling nodes toward center
|
|
73
|
-
* - Repulsion: Force pushing nodes apart
|
|
74
|
-
* - Link Forces: Spring forces and distances between connected nodes
|
|
75
|
-
* - Dynamics: Friction and decay rates for movement
|
|
76
|
-
*
|
|
77
|
-
* Key Parameters:
|
|
78
|
-
* - `pointSizeScale` (number): Base scale for node sizes (default: 1.1)
|
|
79
|
-
* - `scalePointsOnZoom` (boolean): Dynamic node sizing with zoom (default: true)
|
|
80
|
-
* - `renderLinks` (boolean): Toggle link visibility (default: true)
|
|
81
|
-
* - `linkArrows` (boolean): Show directional arrows (default: false)
|
|
82
|
-
* - `curvedLinks` (boolean): Use curved or straight links (default: false)
|
|
83
|
-
* - `simulationGravity` (number): Center attraction strength (default: 0.25)
|
|
84
|
-
* - `simulationRepulsion` (number): Node repulsion strength (default: 1.0)
|
|
85
|
-
* - `simulationLinkSpring` (number): Link elasticity (default: 1.0)
|
|
86
|
-
* - `simulationFriction` (number): Movement damping (default: 0.85)
|
|
87
|
-
* - `simulationDecay` (number): Simulation cooling rate (default: 1000)
|
|
88
|
-
*
|
|
89
|
-
* @example Typical usage with default-like values
|
|
90
|
-
* ```tsx
|
|
91
|
-
* import { CosmosGraph, createDefaultCosmosConfig } from '@sqlrooms/cosmos';
|
|
92
|
-
*
|
|
93
|
-
* const config = createDefaultCosmosConfig();
|
|
94
|
-
*
|
|
95
|
-
* function MyGraph() {
|
|
96
|
-
* return (
|
|
97
|
-
* <CosmosGraph
|
|
98
|
-
* config={config}
|
|
99
|
-
* data={graphData}
|
|
100
|
-
* />
|
|
101
|
-
* );
|
|
102
|
-
* }
|
|
103
|
-
* ```
|
|
104
|
-
*
|
|
105
|
-
* @example Custom configuration for directed graph
|
|
106
|
-
* ```tsx
|
|
107
|
-
* const config = {
|
|
108
|
-
* cosmos: {
|
|
109
|
-
* // Visual settings
|
|
110
|
-
* pointSizeScale: 1.2,
|
|
111
|
-
* linkArrows: true,
|
|
112
|
-
* curvedLinks: true,
|
|
113
|
-
*
|
|
114
|
-
* // Physics settings
|
|
115
|
-
* simulationGravity: 0.2,
|
|
116
|
-
* simulationLinkDistance: 15,
|
|
117
|
-
* simulationLinkSpring: 1.2
|
|
118
|
-
* }
|
|
119
|
-
* };
|
|
120
|
-
* ```
|
|
121
|
-
*
|
|
122
|
-
* @see {@link CosmosGraph} For the main graph component
|
|
123
|
-
* @see {@link CosmosSimulationControls} For runtime control of simulation parameters
|
|
124
|
-
*/
|
|
125
15
|
export * from './CosmosSliceConfig';
|
|
126
16
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAGH,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,mBAAmB,EAAC,MAAM,uBAAuB,CAAC;AAE1D;;GAEG;AACH,OAAO,EAAC,wBAAwB,EAAC,MAAM,4BAA4B,CAAC;AACpE,YAAY,EAAC,gBAAgB,EAAC,MAAM,eAAe,CAAC;AAGpD,OAAO,EAAC,aAAa,EAAC,MAAM,uBAAuB,CAAC;AACpD,OAAO,EACL,iBAAiB,EACjB,kBAAkB,EAClB,KAAK,gBAAgB,EACrB,KAAK,sBAAsB,GAC5B,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,iBAAiB,EACjB,yBAAyB,EACzB,KAAK,iBAAiB,IAAI,qBAAqB,GAChD,MAAM,qBAAqB,CAAC;AAG7B,cAAc,qBAAqB,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -1,30 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @
|
|
3
|
-
*
|
|
4
|
-
* This package provides React components and hooks for creating interactive graph visualizations
|
|
5
|
-
* using the Cosmograph WebGL-based graph visualization library. It includes components for
|
|
6
|
-
* rendering graphs, managing graph state through zustand, and controlling graph interactions.
|
|
7
|
-
*
|
|
8
|
-
* @example Basic usage
|
|
9
|
-
* ```tsx
|
|
10
|
-
* import { CosmosGraph, CosmosGraphControls } from '@sqlrooms/cosmos';
|
|
11
|
-
*
|
|
12
|
-
* const MyGraph = () => {
|
|
13
|
-
* return (
|
|
14
|
-
* <div style={{ width: '800px', height: '600px' }}>
|
|
15
|
-
* <CosmosGraph
|
|
16
|
-
* config={graphConfig}
|
|
17
|
-
* pointPositions={positions}
|
|
18
|
-
* pointColors={colors}
|
|
19
|
-
* pointSizes={sizes}
|
|
20
|
-
* >
|
|
21
|
-
* <CosmosGraphControls />
|
|
22
|
-
* </CosmosGraph>
|
|
23
|
-
* </div>
|
|
24
|
-
* );
|
|
25
|
-
* };
|
|
26
|
-
* ```
|
|
27
|
-
*
|
|
2
|
+
* {@include ../README.md}
|
|
28
3
|
* @packageDocumentation
|
|
29
4
|
*/
|
|
30
5
|
// Components
|
|
@@ -32,27 +7,6 @@ export { CosmosGraph } from './CosmosGraph';
|
|
|
32
7
|
export { CosmosGraphControls } from './CosmosGraphControls';
|
|
33
8
|
/**
|
|
34
9
|
* A component that provides fine-grained controls for the graph simulation parameters.
|
|
35
|
-
* Uses the zustand store to access and control the graph state.
|
|
36
|
-
*
|
|
37
|
-
* Features:
|
|
38
|
-
* - Slider controls for gravity, repulsion, link strength, link distance, friction, and decay
|
|
39
|
-
* - Real-time parameter adjustment with immediate visual feedback
|
|
40
|
-
* - Tooltips with parameter descriptions
|
|
41
|
-
* - Customizable positioning
|
|
42
|
-
*
|
|
43
|
-
* @example Basic usage
|
|
44
|
-
* ```tsx
|
|
45
|
-
* <CosmosGraph {...graphProps}>
|
|
46
|
-
* <CosmosSimulationControls />
|
|
47
|
-
* </CosmosGraph>
|
|
48
|
-
* ```
|
|
49
|
-
*
|
|
50
|
-
* @example Custom positioning
|
|
51
|
-
* ```tsx
|
|
52
|
-
* <CosmosGraph {...graphProps}>
|
|
53
|
-
* <CosmosSimulationControls className="absolute bottom-4 left-4" />
|
|
54
|
-
* </CosmosGraph>
|
|
55
|
-
* ```
|
|
56
10
|
*/
|
|
57
11
|
export { CosmosSimulationControls } from './CosmosSimulationControls';
|
|
58
12
|
// State management
|
|
@@ -60,69 +14,5 @@ export { useHoverState } from './hooks/useHoverState';
|
|
|
60
14
|
export { createCosmosSlice, useStoreWithCosmos, } from './CosmosSlice';
|
|
61
15
|
export { CosmosSliceConfig, createDefaultCosmosConfig, } from './CosmosSliceConfig';
|
|
62
16
|
// Configuration
|
|
63
|
-
/**
|
|
64
|
-
* Configuration schema for the Cosmos graph visualization system.
|
|
65
|
-
* Provides type-safe validation and configuration options for both visual and physics aspects of the graph.
|
|
66
|
-
*
|
|
67
|
-
* Configuration Categories:
|
|
68
|
-
*
|
|
69
|
-
* 1. Visual Appearance
|
|
70
|
-
* - Node styling: size scaling and zoom behavior
|
|
71
|
-
* - Link styling: visibility, width, arrows, and curve options
|
|
72
|
-
*
|
|
73
|
-
* 2. Physics Simulation
|
|
74
|
-
* - Gravity: Central force pulling nodes toward center
|
|
75
|
-
* - Repulsion: Force pushing nodes apart
|
|
76
|
-
* - Link Forces: Spring forces and distances between connected nodes
|
|
77
|
-
* - Dynamics: Friction and decay rates for movement
|
|
78
|
-
*
|
|
79
|
-
* Key Parameters:
|
|
80
|
-
* - `pointSizeScale` (number): Base scale for node sizes (default: 1.1)
|
|
81
|
-
* - `scalePointsOnZoom` (boolean): Dynamic node sizing with zoom (default: true)
|
|
82
|
-
* - `renderLinks` (boolean): Toggle link visibility (default: true)
|
|
83
|
-
* - `linkArrows` (boolean): Show directional arrows (default: false)
|
|
84
|
-
* - `curvedLinks` (boolean): Use curved or straight links (default: false)
|
|
85
|
-
* - `simulationGravity` (number): Center attraction strength (default: 0.25)
|
|
86
|
-
* - `simulationRepulsion` (number): Node repulsion strength (default: 1.0)
|
|
87
|
-
* - `simulationLinkSpring` (number): Link elasticity (default: 1.0)
|
|
88
|
-
* - `simulationFriction` (number): Movement damping (default: 0.85)
|
|
89
|
-
* - `simulationDecay` (number): Simulation cooling rate (default: 1000)
|
|
90
|
-
*
|
|
91
|
-
* @example Typical usage with default-like values
|
|
92
|
-
* ```tsx
|
|
93
|
-
* import { CosmosGraph, createDefaultCosmosConfig } from '@sqlrooms/cosmos';
|
|
94
|
-
*
|
|
95
|
-
* const config = createDefaultCosmosConfig();
|
|
96
|
-
*
|
|
97
|
-
* function MyGraph() {
|
|
98
|
-
* return (
|
|
99
|
-
* <CosmosGraph
|
|
100
|
-
* config={config}
|
|
101
|
-
* data={graphData}
|
|
102
|
-
* />
|
|
103
|
-
* );
|
|
104
|
-
* }
|
|
105
|
-
* ```
|
|
106
|
-
*
|
|
107
|
-
* @example Custom configuration for directed graph
|
|
108
|
-
* ```tsx
|
|
109
|
-
* const config = {
|
|
110
|
-
* cosmos: {
|
|
111
|
-
* // Visual settings
|
|
112
|
-
* pointSizeScale: 1.2,
|
|
113
|
-
* linkArrows: true,
|
|
114
|
-
* curvedLinks: true,
|
|
115
|
-
*
|
|
116
|
-
* // Physics settings
|
|
117
|
-
* simulationGravity: 0.2,
|
|
118
|
-
* simulationLinkDistance: 15,
|
|
119
|
-
* simulationLinkSpring: 1.2
|
|
120
|
-
* }
|
|
121
|
-
* };
|
|
122
|
-
* ```
|
|
123
|
-
*
|
|
124
|
-
* @see {@link CosmosGraph} For the main graph component
|
|
125
|
-
* @see {@link CosmosSimulationControls} For runtime control of simulation parameters
|
|
126
|
-
*/
|
|
127
17
|
export * from './CosmosSliceConfig';
|
|
128
18
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,aAAa;AACb,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,mBAAmB,EAAC,MAAM,uBAAuB,CAAC;AAE1D;;GAEG;AACH,OAAO,EAAC,wBAAwB,EAAC,MAAM,4BAA4B,CAAC;AAGpE,mBAAmB;AACnB,OAAO,EAAC,aAAa,EAAC,MAAM,uBAAuB,CAAC;AACpD,OAAO,EACL,iBAAiB,EACjB,kBAAkB,GAGnB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,iBAAiB,EACjB,yBAAyB,GAE1B,MAAM,qBAAqB,CAAC;AAE7B,gBAAgB;AAChB,cAAc,qBAAqB,CAAC","sourcesContent":["/**\n * {@include ../README.md}\n * @packageDocumentation\n */\n\n// Components\nexport {CosmosGraph} from './CosmosGraph';\nexport {CosmosGraphControls} from './CosmosGraphControls';\n\n/**\n * A component that provides fine-grained controls for the graph simulation parameters.\n */\nexport {CosmosSimulationControls} from './CosmosSimulationControls';\nexport type {CosmosGraphProps} from './CosmosGraph';\n\n// State management\nexport {useHoverState} from './hooks/useHoverState';\nexport {\n createCosmosSlice,\n useStoreWithCosmos,\n type CosmosSliceState,\n type ProjectStateWithCosmos,\n} from './CosmosSlice';\nexport {\n CosmosSliceConfig,\n createDefaultCosmosConfig,\n type CosmosSliceConfig as CosmosSliceConfigType,\n} from './CosmosSliceConfig';\n\n// Configuration\nexport * from './CosmosSliceConfig';\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sqlrooms/cosmos",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.7.0",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -20,9 +20,9 @@
|
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@cosmograph/cosmos": "2.0.0-beta.22",
|
|
23
|
-
"@sqlrooms/project-builder": "0.
|
|
24
|
-
"@sqlrooms/project-config": "0.
|
|
25
|
-
"@sqlrooms/ui": "0.
|
|
23
|
+
"@sqlrooms/project-builder": "0.7.0",
|
|
24
|
+
"@sqlrooms/project-config": "0.7.0",
|
|
25
|
+
"@sqlrooms/ui": "0.7.0",
|
|
26
26
|
"immer": "^10.1.1",
|
|
27
27
|
"lucide-react": "^0.474.0",
|
|
28
28
|
"zod": "^3.24.1",
|
|
@@ -38,5 +38,5 @@
|
|
|
38
38
|
"lint": "eslint .",
|
|
39
39
|
"typedoc": "typedoc"
|
|
40
40
|
},
|
|
41
|
-
"gitHead": "
|
|
41
|
+
"gitHead": "8be65f051c588d3a963f721322429657913b6c63"
|
|
42
42
|
}
|