@pixerate/editor-react 0.35.1 → 0.37.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/dist/chart/index.cjs +260 -30
- package/dist/chart/index.cjs.map +1 -1
- package/dist/chart/index.d.cts +87 -6
- package/dist/chart/index.d.ts +87 -6
- package/dist/chart/index.js +101 -520
- package/dist/chart/index.js.map +1 -1
- package/dist/chunk-C2JWRD2B.js +708 -0
- package/dist/chunk-C2JWRD2B.js.map +1 -0
- package/dist/index.cjs +674 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +28 -2
- package/dist/index.d.ts +28 -2
- package/dist/index.js +81 -0
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/dist/chart/index.d.ts
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import * as React from 'react';
|
|
2
2
|
import React__default from 'react';
|
|
3
|
+
import { ToolRegistry } from '@pixerate/editor/tools';
|
|
4
|
+
import { ChartController, ChartState, ChartSelection, ChartSpecPatch, ChartActionResult, ChartType, ChartCommandOptions, ChartControllerOptions, ChartScene, ChartPresence, ChartDirector, ChartToolProviderOptions, ChartTheme, ChartTextMeasure, ChartMark, ChartSparklineOptions, ChartValue, ChartStreamFormat } from '@pixerate/editor/chart';
|
|
3
5
|
|
|
4
6
|
/** A `ChartController` created once for the component's lifetime. */
|
|
5
7
|
declare function useChartController(options?: ChartControllerOptions): ChartController;
|
|
@@ -31,6 +33,27 @@ interface ChartCommandTarget {
|
|
|
31
33
|
* `chart.setValues`, …) in `registry` while mounted.
|
|
32
34
|
*/
|
|
33
35
|
declare function useChartCommands(registry: ChartCommandTarget | null | undefined, controller: ChartController, options?: ChartCommandOptions): void;
|
|
36
|
+
/**
|
|
37
|
+
* Registers the chart's agent tools (`createChartToolProvider`) with a `ToolRegistry` while
|
|
38
|
+
* mounted. Options are read when the controller or registry changes.
|
|
39
|
+
*/
|
|
40
|
+
declare function useChartToolProvider(registry: ToolRegistry | null | undefined, controller: ChartController, options?: ChartToolProviderOptions): void;
|
|
41
|
+
/**
|
|
42
|
+
* A `ChartPresence` and `ChartDirector` for a chart: pass `presence` and `sceneRef` to
|
|
43
|
+
* `ChartCanvas`, and `director` to `useChartToolProvider` so agent edits are acted out with a
|
|
44
|
+
* cursor.
|
|
45
|
+
*/
|
|
46
|
+
declare function useChartDirector(controller: ChartController, options?: {
|
|
47
|
+
speed?: number;
|
|
48
|
+
size?: {
|
|
49
|
+
width: number;
|
|
50
|
+
height: number;
|
|
51
|
+
};
|
|
52
|
+
}): {
|
|
53
|
+
sceneRef: React.RefObject<ChartScene | null>;
|
|
54
|
+
presence: ChartPresence;
|
|
55
|
+
director: ChartDirector;
|
|
56
|
+
};
|
|
34
57
|
|
|
35
58
|
declare const chartInputClass = "h-7 w-full min-w-0 rounded-md border border-input bg-background px-2 text-xs text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary disabled:cursor-not-allowed disabled:opacity-50";
|
|
36
59
|
declare const chartButtonClass = "inline-flex h-7 items-center justify-center gap-1 rounded-md border border-input bg-background px-2 text-xs text-foreground hover:bg-muted focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary disabled:pointer-events-none disabled:opacity-50";
|
|
@@ -56,13 +79,32 @@ interface ChartCanvasProps {
|
|
|
56
79
|
measureText?: ChartTextMeasure;
|
|
57
80
|
emptyMessage?: string;
|
|
58
81
|
className?: string;
|
|
82
|
+
/** Agent cursors to draw over the chart (see `ChartDirector`). */
|
|
83
|
+
presence?: ChartPresence;
|
|
84
|
+
/** Receives the scene as drawn (e.g. for `ChartDirector`'s `scene`). */
|
|
85
|
+
sceneRef?: {
|
|
86
|
+
current: ChartScene | null;
|
|
87
|
+
};
|
|
59
88
|
}
|
|
89
|
+
/** SVG attributes for one mark (colours go in `style` so CSS variables work). */
|
|
90
|
+
declare function renderChartMark(mark: ChartMark, fontFamily: string, interactive: boolean): React__default.ReactNode;
|
|
91
|
+
/** Agent cursors and notes, drawn in scene coordinates inside the chart's SVG. */
|
|
92
|
+
declare function ChartPresenceLayer({ presence }: {
|
|
93
|
+
presence: ChartPresence;
|
|
94
|
+
}): React__default.JSX.Element;
|
|
95
|
+
/** A laid-out scene as an SVG (no interaction): for read-only views, streaming and exports. */
|
|
96
|
+
declare function ChartSceneSvg({ scene, label, className }: {
|
|
97
|
+
scene: ChartScene;
|
|
98
|
+
label?: string;
|
|
99
|
+
className?: string;
|
|
100
|
+
}): React__default.JSX.Element;
|
|
60
101
|
/**
|
|
61
102
|
* Draws a chart controller's spec as SVG. Click a mark to select it, drag a bar or point to
|
|
62
|
-
* change its value (one undo step
|
|
63
|
-
* Escape
|
|
103
|
+
* change its value (one undo step; Alt for fine steps, Shift to keep one axis on scatter
|
|
104
|
+
* charts, Ctrl / ⌘ to skip snapping, Escape to cancel), and with the chart focused use
|
|
105
|
+
* ← → ↑ ↓, Delete and Escape (see `handleChartKey`).
|
|
64
106
|
*/
|
|
65
|
-
declare function ChartCanvas({ controller, width, height, responsive, theme, editable, measureText, emptyMessage, className }: ChartCanvasProps): React__default.JSX.Element;
|
|
107
|
+
declare function ChartCanvas({ controller, width, height, responsive, theme, editable, measureText, emptyMessage, className, presence, sceneRef }: ChartCanvasProps): React__default.JSX.Element;
|
|
66
108
|
|
|
67
109
|
type CommitInputProps = {
|
|
68
110
|
value: string;
|
|
@@ -92,7 +134,7 @@ interface ChartInspectorProps {
|
|
|
92
134
|
sections?: readonly ChartInspectorSection[];
|
|
93
135
|
className?: string;
|
|
94
136
|
}
|
|
95
|
-
type ChartInspectorSection = 'type' | 'titles' | 'options' | 'legend' | 'axes' | 'series';
|
|
137
|
+
type ChartInspectorSection = 'type' | 'style' | 'titles' | 'options' | 'legend' | 'axes' | 'series';
|
|
96
138
|
/**
|
|
97
139
|
* Settings for a chart controller: type, titles, stacking and line options, legend, both
|
|
98
140
|
* axes and the selected series. Every change is one undo step.
|
|
@@ -115,4 +157,43 @@ interface ChartEditorProps {
|
|
|
115
157
|
/** Toolbar, chart, settings sidebar and data grid for a `ChartController`. */
|
|
116
158
|
declare function ChartEditor({ controller, showInspector, showDataGrid, showToolbar, height, canvasProps, className }: ChartEditorProps): React__default.JSX.Element;
|
|
117
159
|
|
|
118
|
-
|
|
160
|
+
interface ChartStreamingViewProps {
|
|
161
|
+
/** Mermaid (xychart-beta, pie, radar-beta) or a JSON chart spec, as far as it has arrived. */
|
|
162
|
+
source: string;
|
|
163
|
+
/** Nothing more will arrive: the final chart is drawn at once and problems are reported. */
|
|
164
|
+
complete?: boolean;
|
|
165
|
+
format?: ChartStreamFormat;
|
|
166
|
+
width?: number;
|
|
167
|
+
height?: number;
|
|
168
|
+
theme?: Partial<ChartTheme>;
|
|
169
|
+
/** How often a new layout is adopted while streaming (ms, default 300). */
|
|
170
|
+
adoptInterval?: number;
|
|
171
|
+
/** Tween length between layouts (ms, default 450; 0 to switch at once). */
|
|
172
|
+
tween?: number;
|
|
173
|
+
/** Shown before anything can be drawn. */
|
|
174
|
+
placeholder?: React__default.ReactNode;
|
|
175
|
+
/** Called with the parse problems once `complete`. */
|
|
176
|
+
onIssues?: (issues: {
|
|
177
|
+
message: string;
|
|
178
|
+
line?: number;
|
|
179
|
+
}[]) => void;
|
|
180
|
+
className?: string;
|
|
181
|
+
}
|
|
182
|
+
/**
|
|
183
|
+
* Draws a chart whose source is still arriving (e.g. from a model): series appear as their
|
|
184
|
+
* values come in, the value axis only grows so it does not jump, and each new layout tweens
|
|
185
|
+
* from the last. Read-only; load the final spec into a `ChartController` to edit it.
|
|
186
|
+
*/
|
|
187
|
+
declare function ChartStreamingView({ source, complete, format, width, height, theme, adoptInterval, tween, placeholder, onIssues, className }: ChartStreamingViewProps): React__default.JSX.Element;
|
|
188
|
+
interface ChartSparklineProps extends Omit<ChartSparklineOptions, 'width' | 'height'> {
|
|
189
|
+
values: readonly ChartValue[];
|
|
190
|
+
width?: number;
|
|
191
|
+
height?: number;
|
|
192
|
+
/** Accessible label (default: first and last value). */
|
|
193
|
+
label?: string;
|
|
194
|
+
className?: string;
|
|
195
|
+
}
|
|
196
|
+
/** A word-sized chart: line, column or win/loss. */
|
|
197
|
+
declare function ChartSparkline({ values, width, height, label, className, ...options }: ChartSparklineProps): React__default.JSX.Element;
|
|
198
|
+
|
|
199
|
+
export { ChartCanvas, type ChartCanvasProps, type ChartCommandTarget, ChartCommitInput, ChartDataGrid, type ChartDataGridProps, ChartEditor, type ChartEditorProps, ChartInspector, type ChartInspectorProps, type ChartInspectorSection, ChartPresenceLayer, ChartSceneSvg, ChartSparkline, type ChartSparklineProps, ChartStreamingView, type ChartStreamingViewProps, type UseChartEditorResult, chartButtonClass, chartCellClass, chartIconButtonClass, chartInputClass, chartLabelClass, chartSectionClass, chartSegmentClass, renderChartMark, useChartCommands, useChartController, useChartDirector, useChartEditor, useChartState, useChartToolProvider };
|