@oicl/openbridge-webcomponents 0.0.8 → 0.0.10

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.
Files changed (86) hide show
  1. package/.release-it.json +12 -0
  2. package/.storybook/main.ts +17 -0
  3. package/.storybook/preview.ts +0 -1
  4. package/CHANGELOG.md +118 -41
  5. package/__snapshots__/application-topbar--inactive.png +0 -0
  6. package/__snapshots__/button-button--raised-disabled.png +0 -0
  7. package/__snapshots__/button-rich-button--with-graphic-info.png +0 -0
  8. package/__snapshots__/input-slider--no-icons.png +0 -0
  9. package/__snapshots__/input-slider--no-value.png +0 -0
  10. package/__snapshots__/line-corner-line--primary.png +0 -0
  11. package/__snapshots__/line-example--air.png +0 -0
  12. package/__snapshots__/line-example--connector.png +0 -0
  13. package/__snapshots__/line-example--electric.png +0 -0
  14. package/__snapshots__/line-example--fluid.png +0 -0
  15. package/__snapshots__/line-horizontal-line--primary.png +0 -0
  16. package/__snapshots__/line-vertical-line--complex.png +0 -0
  17. package/__snapshots__/line-vertical-line--primary.png +0 -0
  18. package/custom-elements.json +679 -297
  19. package/dist/automation/corner-line/corner-line.d.ts +22 -0
  20. package/dist/automation/corner-line/corner-line.d.ts.map +1 -0
  21. package/dist/automation/corner-line/corner-line.js +161 -0
  22. package/dist/automation/corner-line/corner-line.js.map +1 -0
  23. package/dist/automation/horizontal-line/horizontal-line.d.ts +15 -0
  24. package/dist/automation/horizontal-line/horizontal-line.d.ts.map +1 -0
  25. package/dist/automation/horizontal-line/horizontal-line.js +110 -0
  26. package/dist/automation/horizontal-line/horizontal-line.js.map +1 -0
  27. package/dist/automation/index.d.ts +20 -0
  28. package/dist/automation/index.d.ts.map +1 -0
  29. package/dist/automation/index.js +42 -0
  30. package/dist/automation/index.js.map +1 -0
  31. package/dist/automation/vertical-line/vertical-line.d.ts +15 -0
  32. package/dist/automation/vertical-line/vertical-line.d.ts.map +1 -0
  33. package/dist/automation/vertical-line/vertical-line.js +111 -0
  34. package/dist/automation/vertical-line/vertical-line.js.map +1 -0
  35. package/dist/components/brilliance-menu/brilliance-menu.d.ts.map +1 -1
  36. package/dist/components/brilliance-menu/brilliance-menu.js +2 -0
  37. package/dist/components/brilliance-menu/brilliance-menu.js.map +1 -1
  38. package/dist/components/button/button.css.js +2 -2
  39. package/dist/components/navigation-item/navigation-item.css.js +2 -1
  40. package/dist/components/navigation-item/navigation-item.css.js.map +1 -1
  41. package/dist/components/notification-button/notification-button.css.js +1 -1
  42. package/dist/components/rich-button/rich-button.css.js +20 -10
  43. package/dist/components/rich-button/rich-button.css.js.map +1 -1
  44. package/dist/components/rich-button/rich-button.d.ts +1 -0
  45. package/dist/components/rich-button/rich-button.d.ts.map +1 -1
  46. package/dist/components/rich-button/rich-button.js +5 -0
  47. package/dist/components/rich-button/rich-button.js.map +1 -1
  48. package/dist/components/slider/slider.css.js +20 -0
  49. package/dist/components/slider/slider.css.js.map +1 -1
  50. package/dist/components/slider/slider.d.ts +8 -0
  51. package/dist/components/slider/slider.d.ts.map +1 -1
  52. package/dist/components/slider/slider.js +44 -18
  53. package/dist/components/slider/slider.js.map +1 -1
  54. package/dist/components/top-bar/top-bar.css.js +5 -1
  55. package/dist/components/top-bar/top-bar.css.js.map +1 -1
  56. package/dist/components/top-bar/top-bar.d.ts.map +1 -1
  57. package/dist/components/top-bar/top-bar.js +8 -8
  58. package/dist/components/top-bar/top-bar.js.map +1 -1
  59. package/fix-generated.cjs +1 -0
  60. package/package.json +20 -26
  61. package/src/automation/corner-line/corner-line.stories.ts +31 -0
  62. package/src/automation/corner-line/corner-line.ts +167 -0
  63. package/src/automation/horizontal-line/horizontal-line.stories.ts +28 -0
  64. package/src/automation/horizontal-line/horizontal-line.ts +100 -0
  65. package/src/automation/index.ts +41 -0
  66. package/src/automation/line.stories.ts +142 -0
  67. package/src/automation/vertical-line/vertical-line.stories.ts +71 -0
  68. package/src/automation/vertical-line/vertical-line.ts +104 -0
  69. package/src/components/brilliance-menu/brilliance-menu.ts +2 -0
  70. package/src/components/rich-button/rich-button.css +15 -2
  71. package/src/components/rich-button/rich-button.stories.ts +36 -0
  72. package/src/components/rich-button/rich-button.ts +2 -0
  73. package/src/components/slider/slider.css +20 -0
  74. package/src/components/slider/slider.stories.ts +20 -1
  75. package/src/components/slider/slider.ts +43 -19
  76. package/src/components/top-bar/top-bar.css +4 -0
  77. package/src/components/top-bar/top-bar.ts +10 -8
  78. package/src/palettes/variables.css +64 -43
  79. package/.yarnrc.yml +0 -1
  80. package/script/svg-instruments/convert-svg.ts +0 -246
  81. package/script/svg-instruments/environment.d.ts +0 -7
  82. package/script/svg-instruments/exports.ts +0 -82
  83. package/script/svg-instruments/figma-types.ts +0 -804
  84. package/script/svg-instruments/figmaImport.ts +0 -79
  85. package/script/svg-instruments/main.ts +0 -109
  86. package/test.svg +0 -3
@@ -1,804 +0,0 @@
1
- // Figma Plugin API version 1, update 14
2
-
3
- export interface StyledNode {
4
- name: string;
5
- id: string;
6
- children?: StyledNode[];
7
- visible?: boolean;
8
- styles?: {
9
- stroke?: string;
10
- strokes?: string;
11
- fill?: string;
12
- fills?: string;
13
- text?: string;
14
- };
15
- background?: any[];
16
- strokes?: any[];
17
- strokeAlign?: string;
18
- }
19
-
20
- export interface Style {
21
- key: string;
22
- name: string;
23
- styleType: 'FILL' | 'EFFECT' | 'TEXT' | 'GRID';
24
- }
25
-
26
- export type StyleDict = {[id: string]: Style};
27
-
28
- ////////////////////////////////////////////////////////////////////////////////
29
- // Datatypes
30
-
31
- type Transform = [[number, number, number], [number, number, number]];
32
-
33
- interface Vector {
34
- readonly x: number;
35
- readonly y: number;
36
- }
37
-
38
- interface Rect {
39
- readonly x: number;
40
- readonly y: number;
41
- readonly width: number;
42
- readonly height: number;
43
- }
44
-
45
- interface RGB {
46
- readonly r: number;
47
- readonly g: number;
48
- readonly b: number;
49
- }
50
-
51
- interface RGBA {
52
- readonly r: number;
53
- readonly g: number;
54
- readonly b: number;
55
- readonly a: number;
56
- }
57
-
58
- interface FontName {
59
- readonly family: string;
60
- readonly style: string;
61
- }
62
-
63
- type TextCase = 'ORIGINAL' | 'UPPER' | 'LOWER' | 'TITLE';
64
-
65
- type TextDecoration = 'NONE' | 'UNDERLINE' | 'STRIKETHROUGH';
66
-
67
- interface ArcData {
68
- readonly startingAngle: number;
69
- readonly endingAngle: number;
70
- readonly innerRadius: number;
71
- }
72
-
73
- interface ShadowEffect {
74
- readonly type: 'DROP_SHADOW' | 'INNER_SHADOW';
75
- readonly color: RGBA;
76
- readonly offset: Vector;
77
- readonly radius: number;
78
- readonly spread?: number;
79
- readonly visible: boolean;
80
- readonly blendMode: BlendMode;
81
- }
82
-
83
- interface BlurEffect {
84
- readonly type: 'LAYER_BLUR' | 'BACKGROUND_BLUR';
85
- readonly radius: number;
86
- readonly visible: boolean;
87
- }
88
-
89
- type Effect = ShadowEffect | BlurEffect;
90
-
91
- type ConstraintType = 'MIN' | 'CENTER' | 'MAX' | 'STRETCH' | 'SCALE';
92
-
93
- interface Constraints {
94
- readonly horizontal: ConstraintType;
95
- readonly vertical: ConstraintType;
96
- }
97
-
98
- interface ColorStop {
99
- readonly position: number;
100
- readonly color: RGBA;
101
- }
102
-
103
- interface ImageFilters {
104
- readonly exposure?: number;
105
- readonly contrast?: number;
106
- readonly saturation?: number;
107
- readonly temperature?: number;
108
- readonly tint?: number;
109
- readonly highlights?: number;
110
- readonly shadows?: number;
111
- }
112
-
113
- interface SolidPaint {
114
- readonly type: 'SOLID';
115
- readonly color: RGB;
116
-
117
- readonly visible?: boolean;
118
- readonly opacity?: number;
119
- readonly blendMode?: BlendMode;
120
- }
121
-
122
- interface GradientPaint {
123
- readonly type:
124
- | 'GRADIENT_LINEAR'
125
- | 'GRADIENT_RADIAL'
126
- | 'GRADIENT_ANGULAR'
127
- | 'GRADIENT_DIAMOND';
128
- readonly gradientTransform: Transform;
129
- readonly gradientStops: ReadonlyArray<ColorStop>;
130
-
131
- readonly visible?: boolean;
132
- readonly opacity?: number;
133
- readonly blendMode?: BlendMode;
134
- }
135
-
136
- interface ImagePaint {
137
- readonly type: 'IMAGE';
138
- readonly scaleMode: 'FILL' | 'FIT' | 'CROP' | 'TILE';
139
- readonly imageHash: string | null;
140
- readonly imageTransform?: Transform; // setting for "CROP"
141
- readonly scalingFactor?: number; // setting for "TILE"
142
- readonly filters?: ImageFilters;
143
-
144
- readonly visible?: boolean;
145
- readonly opacity?: number;
146
- readonly blendMode?: BlendMode;
147
- }
148
-
149
- type Paint = SolidPaint | GradientPaint | ImagePaint;
150
-
151
- interface Guide {
152
- readonly axis: 'X' | 'Y';
153
- readonly offset: number;
154
- }
155
-
156
- interface RowsColsLayoutGrid {
157
- readonly pattern: 'ROWS' | 'COLUMNS';
158
- readonly alignment: 'MIN' | 'MAX' | 'STRETCH' | 'CENTER';
159
- readonly gutterSize: number;
160
-
161
- readonly count: number; // Infinity when "Auto" is set in the UI
162
- readonly sectionSize?: number; // Not set for alignment: "STRETCH"
163
- readonly offset?: number; // Not set for alignment: "CENTER"
164
-
165
- readonly visible?: boolean;
166
- readonly color?: RGBA;
167
- }
168
-
169
- interface GridLayoutGrid {
170
- readonly pattern: 'GRID';
171
- readonly sectionSize: number;
172
-
173
- readonly visible?: boolean;
174
- readonly color?: RGBA;
175
- }
176
-
177
- type LayoutGrid = RowsColsLayoutGrid | GridLayoutGrid;
178
-
179
- interface ExportSettingsConstraints {
180
- readonly type: 'SCALE' | 'WIDTH' | 'HEIGHT';
181
- readonly value: number;
182
- }
183
-
184
- interface ExportSettingsImage {
185
- readonly format: 'JPG' | 'PNG';
186
- readonly contentsOnly?: boolean; // defaults to true
187
- readonly suffix?: string;
188
- readonly constraint?: ExportSettingsConstraints;
189
- }
190
-
191
- interface ExportSettingsSVG {
192
- readonly format: 'SVG';
193
- readonly contentsOnly?: boolean; // defaults to true
194
- readonly suffix?: string;
195
- readonly svgOutlineText?: boolean; // defaults to true
196
- readonly svgIdAttribute?: boolean; // defaults to false
197
- readonly svgSimplifyStroke?: boolean; // defaults to true
198
- }
199
-
200
- interface ExportSettingsPDF {
201
- readonly format: 'PDF';
202
- readonly contentsOnly?: boolean; // defaults to true
203
- readonly suffix?: string;
204
- }
205
-
206
- type ExportSettings =
207
- | ExportSettingsImage
208
- | ExportSettingsSVG
209
- | ExportSettingsPDF;
210
-
211
- type WindingRule = 'NONZERO' | 'EVENODD';
212
-
213
- interface VectorVertex {
214
- readonly x: number;
215
- readonly y: number;
216
- readonly strokeCap?: StrokeCap;
217
- readonly strokeJoin?: StrokeJoin;
218
- readonly cornerRadius?: number;
219
- readonly handleMirroring?: HandleMirroring;
220
- }
221
-
222
- interface VectorSegment {
223
- readonly start: number;
224
- readonly end: number;
225
- readonly tangentStart?: Vector; // Defaults to { x: 0, y: 0 }
226
- readonly tangentEnd?: Vector; // Defaults to { x: 0, y: 0 }
227
- }
228
-
229
- interface VectorRegion {
230
- readonly windingRule: WindingRule;
231
- readonly loops: ReadonlyArray<ReadonlyArray<number>>;
232
- }
233
-
234
- interface VectorNetwork {
235
- readonly vertices: ReadonlyArray<VectorVertex>;
236
- readonly segments: ReadonlyArray<VectorSegment>;
237
- readonly regions?: ReadonlyArray<VectorRegion>; // Defaults to []
238
- }
239
-
240
- interface VectorPath {
241
- readonly windingRule: WindingRule | 'NONE';
242
- readonly data: string;
243
- }
244
-
245
- type VectorPaths = ReadonlyArray<VectorPath>;
246
-
247
- interface LetterSpacing {
248
- readonly value: number;
249
- readonly unit: 'PIXELS' | 'PERCENT';
250
- }
251
-
252
- type LineHeight =
253
- | {
254
- readonly value: number;
255
- readonly unit: 'PIXELS' | 'PERCENT';
256
- }
257
- | {
258
- readonly unit: 'AUTO';
259
- };
260
-
261
- type BlendMode =
262
- | 'PASS_THROUGH'
263
- | 'NORMAL'
264
- | 'DARKEN'
265
- | 'MULTIPLY'
266
- | 'LINEAR_BURN'
267
- | 'COLOR_BURN'
268
- | 'LIGHTEN'
269
- | 'SCREEN'
270
- | 'LINEAR_DODGE'
271
- | 'COLOR_DODGE'
272
- | 'OVERLAY'
273
- | 'SOFT_LIGHT'
274
- | 'HARD_LIGHT'
275
- | 'DIFFERENCE'
276
- | 'EXCLUSION'
277
- | 'HUE'
278
- | 'SATURATION'
279
- | 'COLOR'
280
- | 'LUMINOSITY';
281
-
282
- interface Font {
283
- fontName: FontName;
284
- }
285
-
286
- type Reaction = {action: Action; trigger: Trigger};
287
-
288
- type Action =
289
- | {readonly type: 'BACK' | 'CLOSE'}
290
- | {readonly type: 'URL'; url: string}
291
- | {
292
- readonly type: 'NODE';
293
- readonly destinationId: string | null;
294
- readonly navigation: Navigation;
295
- readonly transition: Transition | null;
296
- readonly preserveScrollPosition: boolean;
297
-
298
- // Only present if navigation == "OVERLAY" and the destination uses
299
- // overlay position type "RELATIVE"
300
- readonly overlayRelativePosition?: Vector;
301
- };
302
-
303
- interface SimpleTransition {
304
- readonly type: 'DISSOLVE' | 'SMART_ANIMATE';
305
- readonly easing: Easing;
306
- readonly duration: number;
307
- }
308
-
309
- interface DirectionalTransition {
310
- readonly type: 'MOVE_IN' | 'MOVE_OUT' | 'PUSH' | 'SLIDE_IN' | 'SLIDE_OUT';
311
- readonly direction: 'LEFT' | 'RIGHT' | 'TOP' | 'BOTTOM';
312
- readonly matchLayers: boolean;
313
-
314
- readonly easing: Easing;
315
- readonly duration: number;
316
- }
317
-
318
- type Transition = SimpleTransition | DirectionalTransition;
319
-
320
- type Trigger =
321
- | {readonly type: 'ON_CLICK' | 'ON_HOVER' | 'ON_PRESS' | 'ON_DRAG'}
322
- | {readonly type: 'AFTER_TIMEOUT'; readonly timeout: number}
323
- | {
324
- readonly type: 'MOUSE_ENTER' | 'MOUSE_LEAVE' | 'MOUSE_UP' | 'MOUSE_DOWN';
325
- readonly delay: number;
326
- };
327
-
328
- type Navigation = 'NAVIGATE' | 'SWAP' | 'OVERLAY';
329
-
330
- interface Easing {
331
- readonly type: 'EASE_IN' | 'EASE_OUT' | 'EASE_IN_AND_OUT' | 'LINEAR';
332
- readonly easingFunctionCubicBezier?: EasingFunctionBezier;
333
- }
334
-
335
- interface EasingFunctionBezier {
336
- x1: number;
337
- y1: number;
338
- x2: number;
339
- y2: number;
340
- }
341
-
342
- type OverflowDirection = 'NONE' | 'HORIZONTAL' | 'VERTICAL' | 'BOTH';
343
-
344
- type OverlayPositionType =
345
- | 'CENTER'
346
- | 'TOP_LEFT'
347
- | 'TOP_CENTER'
348
- | 'TOP_RIGHT'
349
- | 'BOTTOM_LEFT'
350
- | 'BOTTOM_CENTER'
351
- | 'BOTTOM_RIGHT'
352
- | 'MANUAL';
353
-
354
- type OverlayBackground =
355
- | {readonly type: 'NONE'}
356
- | {readonly type: 'SOLID_COLOR'; readonly color: RGBA};
357
-
358
- type OverlayBackgroundInteraction = 'NONE' | 'CLOSE_ON_CLICK_OUTSIDE';
359
-
360
- type PublishStatus = 'UNPUBLISHED' | 'CURRENT' | 'CHANGED';
361
-
362
- ////////////////////////////////////////////////////////////////////////////////
363
- // Mixins
364
-
365
- interface BaseNodeMixin {
366
- readonly id: string;
367
- readonly parent: (BaseNode & ChildrenMixin) | null;
368
- name: string; // Note: setting this also sets `autoRename` to false on TextNodes
369
- readonly removed: boolean;
370
- toString(): string;
371
- remove(): void;
372
-
373
- getPluginData(key: string): string;
374
- setPluginData(key: string, value: string): void;
375
-
376
- // Namespace is a string that must be at least 3 alphanumeric characters, and should
377
- // be a name related to your plugin. Other plugins will be able to read this data.
378
- getSharedPluginData(namespace: string, key: string): string;
379
- setSharedPluginData(namespace: string, key: string, value: string): void;
380
- setRelaunchData(data: {[command: string]: /* description */ string}): void;
381
- }
382
-
383
- interface SceneNodeMixin {
384
- visible: boolean;
385
- locked: boolean;
386
- }
387
-
388
- interface ChildrenMixin {
389
- readonly children: ReadonlyArray<SceneNode>;
390
-
391
- appendChild(child: SceneNode): void;
392
- insertChild(index: number, child: SceneNode): void;
393
-
394
- findChildren(callback?: (node: SceneNode) => boolean): SceneNode[];
395
- findChild(callback: (node: SceneNode) => boolean): SceneNode | null;
396
-
397
- /**
398
- * If you only need to search immediate children, it is much faster
399
- * to call node.children.filter(callback) or node.findChildren(callback)
400
- */
401
- findAll(callback?: (node: SceneNode) => boolean): SceneNode[];
402
-
403
- /**
404
- * If you only need to search immediate children, it is much faster
405
- * to call node.children.find(callback) or node.findChild(callback)
406
- */
407
- findOne(callback: (node: SceneNode) => boolean): SceneNode | null;
408
- }
409
-
410
- interface ConstraintMixin {
411
- constraints: Constraints;
412
- }
413
-
414
- interface LayoutMixin {
415
- readonly absoluteTransform: Transform;
416
- relativeTransform: Transform;
417
- x: number;
418
- y: number;
419
- rotation: number; // In degrees
420
-
421
- readonly width: number;
422
- readonly height: number;
423
- constrainProportions: boolean;
424
-
425
- layoutAlign: 'MIN' | 'CENTER' | 'MAX' | 'STRETCH'; // applicable only inside auto-layout frames
426
-
427
- resize(width: number, height: number): void;
428
- resizeWithoutConstraints(width: number, height: number): void;
429
- rescale(scale: number): void;
430
- }
431
-
432
- interface BlendMixin {
433
- opacity: number;
434
- blendMode: BlendMode;
435
- isMask: boolean;
436
- effects: ReadonlyArray<Effect>;
437
- effectStyleId: string;
438
- }
439
-
440
- interface ContainerMixin {
441
- expanded: boolean;
442
- backgrounds: ReadonlyArray<Paint>; // DEPRECATED: use 'fills' instead
443
- backgroundStyleId: string; // DEPRECATED: use 'fillStyleId' instead
444
- }
445
-
446
- type StrokeCap =
447
- | 'NONE'
448
- | 'ROUND'
449
- | 'SQUARE'
450
- | 'ARROW_LINES'
451
- | 'ARROW_EQUILATERAL';
452
- type StrokeJoin = 'MITER' | 'BEVEL' | 'ROUND';
453
- type HandleMirroring = 'NONE' | 'ANGLE' | 'ANGLE_AND_LENGTH';
454
-
455
- interface GeometryMixin {
456
- fills: ReadonlyArray<Paint>;
457
- strokes: ReadonlyArray<Paint>;
458
- strokeWeight: number;
459
- strokeMiterLimit: number;
460
- strokeAlign: 'CENTER' | 'INSIDE' | 'OUTSIDE';
461
- strokeCap: StrokeCap;
462
- strokeJoin: StrokeJoin;
463
- dashPattern: ReadonlyArray<number>;
464
- fillStyleId: string;
465
- strokeStyleId: string;
466
- outlineStroke(): VectorNode | null;
467
- }
468
-
469
- interface CornerMixin {
470
- cornerRadius: number;
471
- cornerSmoothing: number;
472
- }
473
-
474
- interface RectangleCornerMixin {
475
- topLeftRadius: number;
476
- topRightRadius: number;
477
- bottomLeftRadius: number;
478
- bottomRightRadius: number;
479
- }
480
-
481
- interface ExportMixin {
482
- exportSettings: ReadonlyArray<ExportSettings>;
483
- exportAsync(settings?: ExportSettings): Promise<Uint8Array>; // Defaults to PNG format
484
- }
485
-
486
- interface ReactionMixin {
487
- readonly reactions: ReadonlyArray<Reaction>;
488
- }
489
-
490
- interface DefaultShapeMixin
491
- extends BaseNodeMixin,
492
- SceneNodeMixin,
493
- ReactionMixin,
494
- BlendMixin,
495
- GeometryMixin,
496
- LayoutMixin,
497
- ExportMixin {}
498
-
499
- interface DefaultFrameMixin
500
- extends BaseNodeMixin,
501
- SceneNodeMixin,
502
- ReactionMixin,
503
- ChildrenMixin,
504
- ContainerMixin,
505
- GeometryMixin,
506
- CornerMixin,
507
- RectangleCornerMixin,
508
- BlendMixin,
509
- ConstraintMixin,
510
- LayoutMixin,
511
- ExportMixin {
512
- layoutMode: 'NONE' | 'HORIZONTAL' | 'VERTICAL';
513
- counterAxisSizingMode: 'FIXED' | 'AUTO'; // applicable only if layoutMode != "NONE"
514
- horizontalPadding: number; // applicable only if layoutMode != "NONE"
515
- verticalPadding: number; // applicable only if layoutMode != "NONE"
516
- itemSpacing: number; // applicable only if layoutMode != "NONE"
517
-
518
- layoutGrids: ReadonlyArray<LayoutGrid>;
519
- gridStyleId: string;
520
- clipsContent: boolean;
521
- guides: ReadonlyArray<Guide>;
522
-
523
- overflowDirection: OverflowDirection;
524
- numberOfFixedChildren: number;
525
-
526
- readonly overlayPositionType: OverlayPositionType;
527
- readonly overlayBackground: OverlayBackground;
528
- readonly overlayBackgroundInteraction: OverlayBackgroundInteraction;
529
- }
530
-
531
- ////////////////////////////////////////////////////////////////////////////////
532
- // Nodes
533
-
534
- interface DocumentNode extends BaseNodeMixin {
535
- readonly type: 'DOCUMENT';
536
-
537
- readonly children: ReadonlyArray<PageNode>;
538
-
539
- appendChild(child: PageNode): void;
540
- insertChild(index: number, child: PageNode): void;
541
- findChildren(callback?: (node: PageNode) => boolean): Array<PageNode>;
542
- findChild(callback: (node: PageNode) => boolean): PageNode | null;
543
-
544
- /**
545
- * If you only need to search immediate children, it is much faster
546
- * to call node.children.filter(callback) or node.findChildren(callback)
547
- */
548
- findAll(
549
- callback?: (node: PageNode | SceneNode) => boolean
550
- ): Array<PageNode | SceneNode>;
551
-
552
- /**
553
- * If you only need to search immediate children, it is much faster
554
- * to call node.children.find(callback) or node.findChild(callback)
555
- */
556
- findOne(
557
- callback: (node: PageNode | SceneNode) => boolean
558
- ): PageNode | SceneNode | null;
559
- }
560
-
561
- interface PageNode extends BaseNodeMixin, ChildrenMixin, ExportMixin {
562
- readonly type: 'PAGE';
563
- clone(): PageNode;
564
-
565
- guides: ReadonlyArray<Guide>;
566
- selection: ReadonlyArray<SceneNode>;
567
- selectedTextRange: {node: TextNode; start: number; end: number} | null;
568
-
569
- backgrounds: ReadonlyArray<Paint>;
570
-
571
- readonly prototypeStartNode:
572
- | FrameNode
573
- | GroupNode
574
- | ComponentNode
575
- | InstanceNode
576
- | null;
577
- }
578
-
579
- export interface FrameNode extends DefaultFrameMixin {
580
- readonly type: 'FRAME';
581
- clone(): FrameNode;
582
- }
583
-
584
- interface GroupNode
585
- extends BaseNodeMixin,
586
- SceneNodeMixin,
587
- ReactionMixin,
588
- ChildrenMixin,
589
- ContainerMixin,
590
- BlendMixin,
591
- LayoutMixin,
592
- ExportMixin {
593
- readonly type: 'GROUP';
594
- clone(): GroupNode;
595
- }
596
-
597
- interface SliceNode
598
- extends BaseNodeMixin,
599
- SceneNodeMixin,
600
- LayoutMixin,
601
- ExportMixin {
602
- readonly type: 'SLICE';
603
- clone(): SliceNode;
604
- }
605
-
606
- interface RectangleNode
607
- extends DefaultShapeMixin,
608
- ConstraintMixin,
609
- CornerMixin,
610
- RectangleCornerMixin {
611
- readonly type: 'RECTANGLE';
612
- clone(): RectangleNode;
613
- }
614
-
615
- interface LineNode extends DefaultShapeMixin, ConstraintMixin {
616
- readonly type: 'LINE';
617
- clone(): LineNode;
618
- }
619
-
620
- export interface EllipseNode
621
- extends DefaultShapeMixin,
622
- ConstraintMixin,
623
- CornerMixin {
624
- readonly type: 'ELLIPSE';
625
- clone(): EllipseNode;
626
- arcData: ArcData;
627
- }
628
-
629
- interface PolygonNode extends DefaultShapeMixin, ConstraintMixin, CornerMixin {
630
- readonly type: 'POLYGON';
631
- clone(): PolygonNode;
632
- pointCount: number;
633
- }
634
-
635
- interface StarNode extends DefaultShapeMixin, ConstraintMixin, CornerMixin {
636
- readonly type: 'STAR';
637
- clone(): StarNode;
638
- pointCount: number;
639
- innerRadius: number;
640
- }
641
-
642
- interface VectorNode extends DefaultShapeMixin, ConstraintMixin, CornerMixin {
643
- readonly type: 'VECTOR';
644
- clone(): VectorNode;
645
- vectorNetwork: VectorNetwork;
646
- vectorPaths: VectorPaths;
647
- handleMirroring: HandleMirroring;
648
- }
649
-
650
- interface TextNode extends DefaultShapeMixin, ConstraintMixin {
651
- readonly type: 'TEXT';
652
- clone(): TextNode;
653
- readonly hasMissingFont: boolean;
654
- textAlignHorizontal: 'LEFT' | 'CENTER' | 'RIGHT' | 'JUSTIFIED';
655
- textAlignVertical: 'TOP' | 'CENTER' | 'BOTTOM';
656
- textAutoResize: 'NONE' | 'WIDTH_AND_HEIGHT' | 'HEIGHT';
657
- paragraphIndent: number;
658
- paragraphSpacing: number;
659
- autoRename: boolean;
660
-
661
- textStyleId: string;
662
- fontSize: number;
663
- fontName: FontName;
664
- textCase: TextCase;
665
- textDecoration: TextDecoration;
666
- letterSpacing: LetterSpacing;
667
- lineHeight: LineHeight;
668
-
669
- characters: string;
670
- insertCharacters(
671
- start: number,
672
- characters: string,
673
- useStyle?: 'BEFORE' | 'AFTER'
674
- ): void;
675
- deleteCharacters(start: number, end: number): void;
676
-
677
- getRangeFontSize(start: number, end: number): number;
678
- setRangeFontSize(start: number, end: number, value: number): void;
679
- getRangeFontName(start: number, end: number): FontName;
680
- setRangeFontName(start: number, end: number, value: FontName): void;
681
- getRangeTextCase(start: number, end: number): TextCase;
682
- setRangeTextCase(start: number, end: number, value: TextCase): void;
683
- getRangeTextDecoration(start: number, end: number): TextDecoration;
684
- setRangeTextDecoration(
685
- start: number,
686
- end: number,
687
- value: TextDecoration
688
- ): void;
689
- getRangeLetterSpacing(start: number, end: number): LetterSpacing;
690
- setRangeLetterSpacing(start: number, end: number, value: LetterSpacing): void;
691
- getRangeLineHeight(start: number, end: number): LineHeight;
692
- setRangeLineHeight(start: number, end: number, value: LineHeight): void;
693
- getRangeFills(start: number, end: number): Paint[];
694
- setRangeFills(start: number, end: number, value: Paint[]): void;
695
- getRangeTextStyleId(start: number, end: number): string;
696
- setRangeTextStyleId(start: number, end: number, value: string): void;
697
- getRangeFillStyleId(start: number, end: number): string;
698
- setRangeFillStyleId(start: number, end: number, value: string): void;
699
- }
700
-
701
- interface ComponentNode extends DefaultFrameMixin {
702
- readonly type: 'COMPONENT';
703
- clone(): ComponentNode;
704
-
705
- createInstance(): InstanceNode;
706
- description: string;
707
- readonly remote: boolean;
708
- readonly key: string; // The key to use with "importComponentByKeyAsync"
709
- getPublishStatusAsync(): Promise<PublishStatus>;
710
- }
711
-
712
- interface InstanceNode extends DefaultFrameMixin {
713
- readonly type: 'INSTANCE';
714
- clone(): InstanceNode;
715
- mainComponent: ComponentNode;
716
- scaleFactor: number;
717
- }
718
-
719
- interface BooleanOperationNode
720
- extends DefaultShapeMixin,
721
- ChildrenMixin,
722
- CornerMixin {
723
- readonly type: 'BOOLEAN_OPERATION';
724
- clone(): BooleanOperationNode;
725
- booleanOperation: 'UNION' | 'INTERSECT' | 'SUBTRACT' | 'EXCLUDE';
726
-
727
- expanded: boolean;
728
- }
729
-
730
- type BaseNode = DocumentNode | PageNode | SceneNode;
731
-
732
- export type SceneNode =
733
- | SliceNode
734
- | FrameNode
735
- | GroupNode
736
- | ComponentNode
737
- | InstanceNode
738
- | BooleanOperationNode
739
- | VectorNode
740
- | StarNode
741
- | LineNode
742
- | EllipseNode
743
- | PolygonNode
744
- | RectangleNode
745
- | TextNode;
746
-
747
- type NodeType =
748
- | 'DOCUMENT'
749
- | 'PAGE'
750
- | 'SLICE'
751
- | 'FRAME'
752
- | 'GROUP'
753
- | 'COMPONENT'
754
- | 'INSTANCE'
755
- | 'BOOLEAN_OPERATION'
756
- | 'VECTOR'
757
- | 'STAR'
758
- | 'LINE'
759
- | 'ELLIPSE'
760
- | 'POLYGON'
761
- | 'RECTANGLE'
762
- | 'TEXT';
763
-
764
- ////////////////////////////////////////////////////////////////////////////////
765
- // Styles
766
- type StyleType = 'PAINT' | 'TEXT' | 'EFFECT' | 'GRID';
767
-
768
- interface BaseStyle {
769
- readonly id: string;
770
- readonly type: StyleType;
771
- name: string;
772
- description: string;
773
- readonly remote: boolean;
774
- readonly key: string; // The key to use with "importStyleByKeyAsync"
775
- remove(): void;
776
- getPublishStatusAsync(): Promise<PublishStatus>;
777
- }
778
-
779
- interface PaintStyle extends BaseStyle {
780
- type: 'PAINT';
781
- paints: ReadonlyArray<Paint>;
782
- }
783
-
784
- interface TextStyle extends BaseStyle {
785
- type: 'TEXT';
786
- fontSize: number;
787
- textDecoration: TextDecoration;
788
- fontName: FontName;
789
- letterSpacing: LetterSpacing;
790
- lineHeight: LineHeight;
791
- paragraphIndent: number;
792
- paragraphSpacing: number;
793
- textCase: TextCase;
794
- }
795
-
796
- interface EffectStyle extends BaseStyle {
797
- type: 'EFFECT';
798
- effects: ReadonlyArray<Effect>;
799
- }
800
-
801
- interface GridStyle extends BaseStyle {
802
- type: 'GRID';
803
- layoutGrids: ReadonlyArray<LayoutGrid>;
804
- }