@glyphjs/components 0.4.0 → 0.5.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/index.cjs +212 -77
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +33 -23
- package/dist/index.d.ts +33 -23
- package/dist/index.js +212 -77
- package/dist/index.js.map +1 -1
- package/package.json +4 -4
package/dist/index.d.cts
CHANGED
|
@@ -22,18 +22,19 @@ declare const calloutDefinition: GlyphComponentDefinition<CalloutData>;
|
|
|
22
22
|
interface ChartData {
|
|
23
23
|
type: 'line' | 'bar' | 'area' | 'ohlc';
|
|
24
24
|
series: {
|
|
25
|
-
name: string;
|
|
25
|
+
name: string | InlineNode[];
|
|
26
26
|
data: DataRecord[];
|
|
27
27
|
}[];
|
|
28
28
|
xAxis?: {
|
|
29
29
|
key: string;
|
|
30
|
-
label?: string;
|
|
30
|
+
label?: string | InlineNode[];
|
|
31
31
|
};
|
|
32
32
|
yAxis?: {
|
|
33
33
|
key: string;
|
|
34
|
-
label?: string;
|
|
34
|
+
label?: string | InlineNode[];
|
|
35
35
|
};
|
|
36
36
|
legend?: boolean;
|
|
37
|
+
markdown?: boolean;
|
|
37
38
|
}
|
|
38
39
|
type DataRecord = Record<string, number | string>;
|
|
39
40
|
|
|
@@ -71,7 +72,7 @@ declare const stepsDefinition: GlyphComponentDefinition<StepsData>;
|
|
|
71
72
|
|
|
72
73
|
interface TableColumn {
|
|
73
74
|
key: string;
|
|
74
|
-
label: string;
|
|
75
|
+
label: string | InlineNode[];
|
|
75
76
|
sortable?: boolean;
|
|
76
77
|
filterable?: boolean;
|
|
77
78
|
type?: 'string' | 'number' | 'date' | 'boolean';
|
|
@@ -84,6 +85,7 @@ interface TableData {
|
|
|
84
85
|
columns: TableColumn[];
|
|
85
86
|
rows: Record<string, unknown>[];
|
|
86
87
|
aggregation?: TableAggregation[];
|
|
88
|
+
markdown?: boolean;
|
|
87
89
|
}
|
|
88
90
|
/**
|
|
89
91
|
* Renders an interactive data table with optional sorting, filtering,
|
|
@@ -97,9 +99,10 @@ declare const tableDefinition: GlyphComponentDefinition<TableData>;
|
|
|
97
99
|
/** Shape of the validated `data` for a `ui:tabs` block. */
|
|
98
100
|
interface TabsData {
|
|
99
101
|
tabs: {
|
|
100
|
-
label: string;
|
|
101
|
-
content: string;
|
|
102
|
+
label: string | InlineNode[];
|
|
103
|
+
content: string | InlineNode[];
|
|
102
104
|
}[];
|
|
105
|
+
markdown?: boolean;
|
|
103
106
|
}
|
|
104
107
|
/**
|
|
105
108
|
* `ui:tabs` component.
|
|
@@ -141,7 +144,7 @@ declare const timelineDefinition: GlyphComponentDefinition<TimelineData>;
|
|
|
141
144
|
|
|
142
145
|
interface GraphNodeData {
|
|
143
146
|
id: string;
|
|
144
|
-
label: string;
|
|
147
|
+
label: string | InlineNode[];
|
|
145
148
|
type?: string;
|
|
146
149
|
style?: Record<string, string>;
|
|
147
150
|
group?: string;
|
|
@@ -149,7 +152,7 @@ interface GraphNodeData {
|
|
|
149
152
|
interface GraphEdgeData {
|
|
150
153
|
from: string;
|
|
151
154
|
to: string;
|
|
152
|
-
label?: string;
|
|
155
|
+
label?: string | InlineNode[];
|
|
153
156
|
type?: string;
|
|
154
157
|
style?: Record<string, string>;
|
|
155
158
|
}
|
|
@@ -159,6 +162,7 @@ interface GraphData {
|
|
|
159
162
|
edges: GraphEdgeData[];
|
|
160
163
|
layout?: 'top-down' | 'left-right' | 'bottom-up' | 'radial' | 'force';
|
|
161
164
|
interactionMode?: 'modifier-key' | 'click-to-activate' | 'always';
|
|
165
|
+
markdown?: boolean;
|
|
162
166
|
}
|
|
163
167
|
declare function Graph({ data, block, outgoingRefs, onNavigate, onInteraction, container, }: GlyphComponentProps<GraphData>): ReactElement;
|
|
164
168
|
|
|
@@ -196,19 +200,19 @@ declare function computeForceLayout(nodes: GraphNode[], edges: GraphEdge[]): Lay
|
|
|
196
200
|
declare const graphDefinition: GlyphComponentDefinition<GraphData>;
|
|
197
201
|
|
|
198
202
|
interface Attribute {
|
|
199
|
-
name: string;
|
|
203
|
+
name: string | InlineNode[];
|
|
200
204
|
type: string;
|
|
201
205
|
primaryKey?: boolean;
|
|
202
206
|
}
|
|
203
207
|
interface Entity {
|
|
204
208
|
id: string;
|
|
205
|
-
label: string;
|
|
209
|
+
label: string | InlineNode[];
|
|
206
210
|
attributes?: Attribute[];
|
|
207
211
|
}
|
|
208
212
|
interface Relationship {
|
|
209
213
|
from: string;
|
|
210
214
|
to: string;
|
|
211
|
-
label?: string;
|
|
215
|
+
label?: string | InlineNode[];
|
|
212
216
|
cardinality: '1:1' | '1:N' | 'N:1' | 'N:M';
|
|
213
217
|
}
|
|
214
218
|
interface RelationData {
|
|
@@ -216,6 +220,7 @@ interface RelationData {
|
|
|
216
220
|
relationships: Relationship[];
|
|
217
221
|
layout?: 'top-down' | 'left-right';
|
|
218
222
|
interactionMode?: 'modifier-key' | 'click-to-activate' | 'always';
|
|
223
|
+
markdown?: boolean;
|
|
219
224
|
}
|
|
220
225
|
declare function Relation({ data, block }: GlyphComponentProps<RelationData>): ReactElement;
|
|
221
226
|
|
|
@@ -276,8 +281,9 @@ interface CodeDiffData {
|
|
|
276
281
|
language?: string;
|
|
277
282
|
before: string;
|
|
278
283
|
after: string;
|
|
279
|
-
beforeLabel?: string;
|
|
280
|
-
afterLabel?: string;
|
|
284
|
+
beforeLabel?: string | InlineNode[];
|
|
285
|
+
afterLabel?: string | InlineNode[];
|
|
286
|
+
markdown?: boolean;
|
|
281
287
|
}
|
|
282
288
|
declare function CodeDiff({ data, block }: GlyphComponentProps<CodeDiffData>): ReactElement;
|
|
283
289
|
|
|
@@ -301,19 +307,20 @@ type FlowchartNodeType = 'start' | 'end' | 'process' | 'decision';
|
|
|
301
307
|
interface FlowchartNodeData {
|
|
302
308
|
id: string;
|
|
303
309
|
type: FlowchartNodeType;
|
|
304
|
-
label: string;
|
|
310
|
+
label: string | InlineNode[];
|
|
305
311
|
}
|
|
306
312
|
interface FlowchartEdgeData {
|
|
307
313
|
from: string;
|
|
308
314
|
to: string;
|
|
309
|
-
label?: string;
|
|
315
|
+
label?: string | InlineNode[];
|
|
310
316
|
}
|
|
311
317
|
interface FlowchartData {
|
|
312
|
-
title?: string;
|
|
318
|
+
title?: string | InlineNode[];
|
|
313
319
|
nodes: FlowchartNodeData[];
|
|
314
320
|
edges: FlowchartEdgeData[];
|
|
315
321
|
direction: 'top-down' | 'left-right';
|
|
316
322
|
interactionMode?: 'modifier-key' | 'click-to-activate' | 'always';
|
|
323
|
+
markdown?: boolean;
|
|
317
324
|
}
|
|
318
325
|
declare function Flowchart({ data, block, container, }: GlyphComponentProps<FlowchartData>): ReactElement;
|
|
319
326
|
|
|
@@ -336,18 +343,19 @@ declare const fileTreeDefinition: GlyphComponentDefinition<FileTreeData>;
|
|
|
336
343
|
type MessageType = 'message' | 'reply' | 'self';
|
|
337
344
|
interface Actor {
|
|
338
345
|
id: string;
|
|
339
|
-
label: string;
|
|
346
|
+
label: string | InlineNode[];
|
|
340
347
|
}
|
|
341
348
|
interface Message {
|
|
342
349
|
from: string;
|
|
343
350
|
to: string;
|
|
344
|
-
label: string;
|
|
351
|
+
label: string | InlineNode[];
|
|
345
352
|
type: MessageType;
|
|
346
353
|
}
|
|
347
354
|
interface SequenceData {
|
|
348
|
-
title?: string;
|
|
355
|
+
title?: string | InlineNode[];
|
|
349
356
|
actors: Actor[];
|
|
350
357
|
messages: Message[];
|
|
358
|
+
markdown?: boolean;
|
|
351
359
|
}
|
|
352
360
|
declare function Sequence({ data, container }: GlyphComponentProps<SequenceData>): ReactElement;
|
|
353
361
|
|
|
@@ -432,12 +440,13 @@ declare const mindMapDefinition: GlyphComponentDefinition<MindMapData>;
|
|
|
432
440
|
|
|
433
441
|
interface EquationStep {
|
|
434
442
|
expression: string;
|
|
435
|
-
annotation?: string;
|
|
443
|
+
annotation?: string | InlineNode[];
|
|
436
444
|
}
|
|
437
445
|
interface EquationData {
|
|
438
446
|
expression?: string;
|
|
439
|
-
label?: string;
|
|
447
|
+
label?: string | InlineNode[];
|
|
440
448
|
steps?: EquationStep[];
|
|
449
|
+
markdown?: boolean;
|
|
441
450
|
}
|
|
442
451
|
declare function Equation({ data }: GlyphComponentProps<EquationData>): ReactElement;
|
|
443
452
|
|
|
@@ -695,8 +704,8 @@ declare const formDefinition: GlyphComponentDefinition<FormData>;
|
|
|
695
704
|
|
|
696
705
|
interface KanbanCard {
|
|
697
706
|
id: string;
|
|
698
|
-
title: string;
|
|
699
|
-
description?: string;
|
|
707
|
+
title: string | InlineNode[];
|
|
708
|
+
description?: string | InlineNode[];
|
|
700
709
|
priority?: 'high' | 'medium' | 'low';
|
|
701
710
|
tags?: string[];
|
|
702
711
|
}
|
|
@@ -709,6 +718,7 @@ interface KanbanColumn {
|
|
|
709
718
|
interface KanbanData {
|
|
710
719
|
title?: string;
|
|
711
720
|
columns: KanbanColumn[];
|
|
721
|
+
markdown?: boolean;
|
|
712
722
|
}
|
|
713
723
|
declare function Kanban({ data, block, onInteraction, }: GlyphComponentProps<KanbanData>): ReactElement;
|
|
714
724
|
|
package/dist/index.d.ts
CHANGED
|
@@ -22,18 +22,19 @@ declare const calloutDefinition: GlyphComponentDefinition<CalloutData>;
|
|
|
22
22
|
interface ChartData {
|
|
23
23
|
type: 'line' | 'bar' | 'area' | 'ohlc';
|
|
24
24
|
series: {
|
|
25
|
-
name: string;
|
|
25
|
+
name: string | InlineNode[];
|
|
26
26
|
data: DataRecord[];
|
|
27
27
|
}[];
|
|
28
28
|
xAxis?: {
|
|
29
29
|
key: string;
|
|
30
|
-
label?: string;
|
|
30
|
+
label?: string | InlineNode[];
|
|
31
31
|
};
|
|
32
32
|
yAxis?: {
|
|
33
33
|
key: string;
|
|
34
|
-
label?: string;
|
|
34
|
+
label?: string | InlineNode[];
|
|
35
35
|
};
|
|
36
36
|
legend?: boolean;
|
|
37
|
+
markdown?: boolean;
|
|
37
38
|
}
|
|
38
39
|
type DataRecord = Record<string, number | string>;
|
|
39
40
|
|
|
@@ -71,7 +72,7 @@ declare const stepsDefinition: GlyphComponentDefinition<StepsData>;
|
|
|
71
72
|
|
|
72
73
|
interface TableColumn {
|
|
73
74
|
key: string;
|
|
74
|
-
label: string;
|
|
75
|
+
label: string | InlineNode[];
|
|
75
76
|
sortable?: boolean;
|
|
76
77
|
filterable?: boolean;
|
|
77
78
|
type?: 'string' | 'number' | 'date' | 'boolean';
|
|
@@ -84,6 +85,7 @@ interface TableData {
|
|
|
84
85
|
columns: TableColumn[];
|
|
85
86
|
rows: Record<string, unknown>[];
|
|
86
87
|
aggregation?: TableAggregation[];
|
|
88
|
+
markdown?: boolean;
|
|
87
89
|
}
|
|
88
90
|
/**
|
|
89
91
|
* Renders an interactive data table with optional sorting, filtering,
|
|
@@ -97,9 +99,10 @@ declare const tableDefinition: GlyphComponentDefinition<TableData>;
|
|
|
97
99
|
/** Shape of the validated `data` for a `ui:tabs` block. */
|
|
98
100
|
interface TabsData {
|
|
99
101
|
tabs: {
|
|
100
|
-
label: string;
|
|
101
|
-
content: string;
|
|
102
|
+
label: string | InlineNode[];
|
|
103
|
+
content: string | InlineNode[];
|
|
102
104
|
}[];
|
|
105
|
+
markdown?: boolean;
|
|
103
106
|
}
|
|
104
107
|
/**
|
|
105
108
|
* `ui:tabs` component.
|
|
@@ -141,7 +144,7 @@ declare const timelineDefinition: GlyphComponentDefinition<TimelineData>;
|
|
|
141
144
|
|
|
142
145
|
interface GraphNodeData {
|
|
143
146
|
id: string;
|
|
144
|
-
label: string;
|
|
147
|
+
label: string | InlineNode[];
|
|
145
148
|
type?: string;
|
|
146
149
|
style?: Record<string, string>;
|
|
147
150
|
group?: string;
|
|
@@ -149,7 +152,7 @@ interface GraphNodeData {
|
|
|
149
152
|
interface GraphEdgeData {
|
|
150
153
|
from: string;
|
|
151
154
|
to: string;
|
|
152
|
-
label?: string;
|
|
155
|
+
label?: string | InlineNode[];
|
|
153
156
|
type?: string;
|
|
154
157
|
style?: Record<string, string>;
|
|
155
158
|
}
|
|
@@ -159,6 +162,7 @@ interface GraphData {
|
|
|
159
162
|
edges: GraphEdgeData[];
|
|
160
163
|
layout?: 'top-down' | 'left-right' | 'bottom-up' | 'radial' | 'force';
|
|
161
164
|
interactionMode?: 'modifier-key' | 'click-to-activate' | 'always';
|
|
165
|
+
markdown?: boolean;
|
|
162
166
|
}
|
|
163
167
|
declare function Graph({ data, block, outgoingRefs, onNavigate, onInteraction, container, }: GlyphComponentProps<GraphData>): ReactElement;
|
|
164
168
|
|
|
@@ -196,19 +200,19 @@ declare function computeForceLayout(nodes: GraphNode[], edges: GraphEdge[]): Lay
|
|
|
196
200
|
declare const graphDefinition: GlyphComponentDefinition<GraphData>;
|
|
197
201
|
|
|
198
202
|
interface Attribute {
|
|
199
|
-
name: string;
|
|
203
|
+
name: string | InlineNode[];
|
|
200
204
|
type: string;
|
|
201
205
|
primaryKey?: boolean;
|
|
202
206
|
}
|
|
203
207
|
interface Entity {
|
|
204
208
|
id: string;
|
|
205
|
-
label: string;
|
|
209
|
+
label: string | InlineNode[];
|
|
206
210
|
attributes?: Attribute[];
|
|
207
211
|
}
|
|
208
212
|
interface Relationship {
|
|
209
213
|
from: string;
|
|
210
214
|
to: string;
|
|
211
|
-
label?: string;
|
|
215
|
+
label?: string | InlineNode[];
|
|
212
216
|
cardinality: '1:1' | '1:N' | 'N:1' | 'N:M';
|
|
213
217
|
}
|
|
214
218
|
interface RelationData {
|
|
@@ -216,6 +220,7 @@ interface RelationData {
|
|
|
216
220
|
relationships: Relationship[];
|
|
217
221
|
layout?: 'top-down' | 'left-right';
|
|
218
222
|
interactionMode?: 'modifier-key' | 'click-to-activate' | 'always';
|
|
223
|
+
markdown?: boolean;
|
|
219
224
|
}
|
|
220
225
|
declare function Relation({ data, block }: GlyphComponentProps<RelationData>): ReactElement;
|
|
221
226
|
|
|
@@ -276,8 +281,9 @@ interface CodeDiffData {
|
|
|
276
281
|
language?: string;
|
|
277
282
|
before: string;
|
|
278
283
|
after: string;
|
|
279
|
-
beforeLabel?: string;
|
|
280
|
-
afterLabel?: string;
|
|
284
|
+
beforeLabel?: string | InlineNode[];
|
|
285
|
+
afterLabel?: string | InlineNode[];
|
|
286
|
+
markdown?: boolean;
|
|
281
287
|
}
|
|
282
288
|
declare function CodeDiff({ data, block }: GlyphComponentProps<CodeDiffData>): ReactElement;
|
|
283
289
|
|
|
@@ -301,19 +307,20 @@ type FlowchartNodeType = 'start' | 'end' | 'process' | 'decision';
|
|
|
301
307
|
interface FlowchartNodeData {
|
|
302
308
|
id: string;
|
|
303
309
|
type: FlowchartNodeType;
|
|
304
|
-
label: string;
|
|
310
|
+
label: string | InlineNode[];
|
|
305
311
|
}
|
|
306
312
|
interface FlowchartEdgeData {
|
|
307
313
|
from: string;
|
|
308
314
|
to: string;
|
|
309
|
-
label?: string;
|
|
315
|
+
label?: string | InlineNode[];
|
|
310
316
|
}
|
|
311
317
|
interface FlowchartData {
|
|
312
|
-
title?: string;
|
|
318
|
+
title?: string | InlineNode[];
|
|
313
319
|
nodes: FlowchartNodeData[];
|
|
314
320
|
edges: FlowchartEdgeData[];
|
|
315
321
|
direction: 'top-down' | 'left-right';
|
|
316
322
|
interactionMode?: 'modifier-key' | 'click-to-activate' | 'always';
|
|
323
|
+
markdown?: boolean;
|
|
317
324
|
}
|
|
318
325
|
declare function Flowchart({ data, block, container, }: GlyphComponentProps<FlowchartData>): ReactElement;
|
|
319
326
|
|
|
@@ -336,18 +343,19 @@ declare const fileTreeDefinition: GlyphComponentDefinition<FileTreeData>;
|
|
|
336
343
|
type MessageType = 'message' | 'reply' | 'self';
|
|
337
344
|
interface Actor {
|
|
338
345
|
id: string;
|
|
339
|
-
label: string;
|
|
346
|
+
label: string | InlineNode[];
|
|
340
347
|
}
|
|
341
348
|
interface Message {
|
|
342
349
|
from: string;
|
|
343
350
|
to: string;
|
|
344
|
-
label: string;
|
|
351
|
+
label: string | InlineNode[];
|
|
345
352
|
type: MessageType;
|
|
346
353
|
}
|
|
347
354
|
interface SequenceData {
|
|
348
|
-
title?: string;
|
|
355
|
+
title?: string | InlineNode[];
|
|
349
356
|
actors: Actor[];
|
|
350
357
|
messages: Message[];
|
|
358
|
+
markdown?: boolean;
|
|
351
359
|
}
|
|
352
360
|
declare function Sequence({ data, container }: GlyphComponentProps<SequenceData>): ReactElement;
|
|
353
361
|
|
|
@@ -432,12 +440,13 @@ declare const mindMapDefinition: GlyphComponentDefinition<MindMapData>;
|
|
|
432
440
|
|
|
433
441
|
interface EquationStep {
|
|
434
442
|
expression: string;
|
|
435
|
-
annotation?: string;
|
|
443
|
+
annotation?: string | InlineNode[];
|
|
436
444
|
}
|
|
437
445
|
interface EquationData {
|
|
438
446
|
expression?: string;
|
|
439
|
-
label?: string;
|
|
447
|
+
label?: string | InlineNode[];
|
|
440
448
|
steps?: EquationStep[];
|
|
449
|
+
markdown?: boolean;
|
|
441
450
|
}
|
|
442
451
|
declare function Equation({ data }: GlyphComponentProps<EquationData>): ReactElement;
|
|
443
452
|
|
|
@@ -695,8 +704,8 @@ declare const formDefinition: GlyphComponentDefinition<FormData>;
|
|
|
695
704
|
|
|
696
705
|
interface KanbanCard {
|
|
697
706
|
id: string;
|
|
698
|
-
title: string;
|
|
699
|
-
description?: string;
|
|
707
|
+
title: string | InlineNode[];
|
|
708
|
+
description?: string | InlineNode[];
|
|
700
709
|
priority?: 'high' | 'medium' | 'low';
|
|
701
710
|
tags?: string[];
|
|
702
711
|
}
|
|
@@ -709,6 +718,7 @@ interface KanbanColumn {
|
|
|
709
718
|
interface KanbanData {
|
|
710
719
|
title?: string;
|
|
711
720
|
columns: KanbanColumn[];
|
|
721
|
+
markdown?: boolean;
|
|
712
722
|
}
|
|
713
723
|
declare function Kanban({ data, block, onInteraction, }: GlyphComponentProps<KanbanData>): ReactElement;
|
|
714
724
|
|