GitVita
New repositoryImport repositoryNew issue
Your repositories Your dashboard Sign in

cloudflare/kumo

Public

mirrored fromhttps://github.com/cloudflare/kumoAvailable

Watch0Fork0Star0
CodeCommitsIssuesPull requestsActionsInsightsSecurity
5260f1a5703bb69e6c7f7cf0ce8033a561cac8b5

Branches

Tags

  • No tags available.
0Branches0Tags
Go to file
Add file
Code

Clone

HTTPS

Download ZIP

kumo/packages/kumo-figma/src

packages/kumo-figma/src/figma-types.d.ts

253lines · modecode

RawDownload
Latest commit unavailable.
1/**
2 * Minimal Figma Plugin API type declarations
3 * For full types, install @figma/plugin-typings
4 */
5
6declare const figma: PluginAPI;
7declare const __html__: string;
8
9interface PluginAPI {
10 showUI(html: string, options?: { width?: number; height?: number }): void;
11 closePlugin(message?: string): void;
12 notify(
13 message: string,
14 options?: { error?: boolean; timeout?: number },
15 ): void;
16 ui: {
17 onmessage: ((msg: any) => void) | ((msg: any) => Promise<void>);
18 };
19 root: DocumentNode;
20 createFrame(): FrameNode;
21 createText(): TextNode;
22 createComponent(): ComponentNode;
23 createComponentSet(): ComponentSetNode;
24 createSection(): SectionNode;
25 createPage(): PageNode;
26 createRectangle(): RectangleNode;
27 createEllipse(): EllipseNode;
28 createNodeFromSvg(svg: string): FrameNode;
29 loadFontAsync(font: { family: string; style: string }): Promise<void>;
30 /**
31 * Combines multiple components into a ComponentSet (variants)
32 * @param components - Array of ComponentNode to combine
33 * @param parent - Parent node (usually PageNode or FrameNode)
34 * @returns ComponentSetNode containing all variants
35 */
36 combineAsVariants(
37 components: ComponentNode[],
38 parent: BaseNode,
39 ): ComponentSetNode;
40 variables: {
41 getLocalVariableCollections(): VariableCollection[];
42 getVariableById(id: string): Variable | null;
43 createVariableCollection(name: string): VariableCollection;
44 createVariable(
45 name: string,
46 collection: VariableCollection,
47 type: "COLOR" | "FLOAT" | "STRING",
48 ): Variable;
49 /**
50 * Binds a variable to a paint's color property
51 * @param paint - The paint to bind the variable to
52 * @param field - The field to bind (currently only 'color' is supported)
53 * @param variable - The variable to bind
54 * @returns A new paint with the variable bound
55 */
56 setBoundVariableForPaint(
57 paint: SolidPaint,
58 field: "color",
59 variable: Variable,
60 ): SolidPaint;
61 };
62 /**
63 * Utility functions for common operations
64 */
65 util: {
66 /**
67 * Creates a SolidPaint from a CSS color string
68 * Supports hex colors with optional alpha: #RGB, #RRGGBB, #RRGGBBAA
69 * @param color - CSS color string
70 * @param existingPaint - Optional existing paint to modify
71 * @returns A new SolidPaint with the specified color and opacity
72 */
73 solidPaint(color: string, existingPaint?: SolidPaint): SolidPaint;
74 };
75 currentPage: PageNode;
76}
77
78interface BaseNode {
79 name: string;
80 type: string;
81 appendChild(child: SceneNode): void;
82 findChild(callback: (node: BaseNode) => boolean): BaseNode | null;
83 remove(): void;
84}
85
86interface DocumentNode {
87 children: readonly PageNode[];
88}
89
90interface PageNode extends BaseNode {
91 type: "PAGE";
92 children: readonly SceneNode[];
93}
94
95interface SceneNode extends BaseNode {
96 fills?: ReadonlyArray<Paint>;
97 strokes?: ReadonlyArray<Paint>;
98 strokeWeight?: number;
99 constraints?: { horizontal: ConstraintType; vertical: ConstraintType };
100 children?: readonly SceneNode[];
101 setBoundVariable(
102 field: string,
103 variable: { type: "VARIABLE_ALIAS"; id: string },
104 ): void;
105}
106
107type ConstraintType = "MIN" | "CENTER" | "MAX" | "STRETCH" | "SCALE";
108
109interface FrameNode extends SceneNode {
110 type: "FRAME";
111 layoutMode: "NONE" | "HORIZONTAL" | "VERTICAL";
112 primaryAxisAlignItems?: "MIN" | "CENTER" | "MAX" | "SPACE_BETWEEN";
113 counterAxisAlignItems?: "MIN" | "CENTER" | "MAX";
114 paddingTop: number;
115 paddingRight: number;
116 paddingBottom: number;
117 paddingLeft: number;
118 itemSpacing: number;
119 primaryAxisSizingMode?: "FIXED" | "AUTO";
120 counterAxisSizingMode?: "FIXED" | "AUTO";
121 cornerRadius: number;
122 resize(width: number, height: number): void;
123 x: number;
124 y: number;
125 children: readonly SceneNode[];
126 setExplicitVariableModeForCollection(
127 collection: VariableCollection,
128 modeId: string,
129 ): void;
130}
131
132interface TextNode extends SceneNode {
133 type: "TEXT";
134 characters: string;
135 fontSize: number;
136 fontName: { family: string; style: string };
137}
138
139interface RectangleNode extends SceneNode, LayoutMixin {
140 type: "RECTANGLE";
141}
142
143interface EllipseNode extends SceneNode {
144 type: "ELLIPSE";
145 resize(width: number, height: number): void;
146 x: number;
147 y: number;
148 strokeAlign: "CENTER" | "INSIDE" | "OUTSIDE";
149 dashPattern: number[];
150}
151
152/**
153 * Layout mixin properties available on ComponentNode at runtime.
154 * Figma Plugin API includes these properties on ComponentNode even though
155 * the base typings don't extend LayoutMixin explicitly.
156 */
157interface LayoutMixin {
158 layoutMode: "NONE" | "HORIZONTAL" | "VERTICAL";
159 primaryAxisAlignItems: "MIN" | "CENTER" | "MAX" | "SPACE_BETWEEN";
160 counterAxisAlignItems: "MIN" | "CENTER" | "MAX";
161 paddingTop: number;
162 paddingRight: number;
163 paddingBottom: number;
164 paddingLeft: number;
165 itemSpacing: number;
166 primaryAxisSizingMode: "FIXED" | "AUTO";
167 counterAxisSizingMode: "FIXED" | "AUTO";
168 cornerRadius: number;
169 resize(width: number, height: number): void;
170 opacity: number;
171 x: number;
172 y: number;
173 width: number;
174 height: number;
175 dashPattern: number[];
176}
177
178interface ComponentNode extends SceneNode, LayoutMixin {
179 type: "COMPONENT";
180 description: string;
181 createInstance(): InstanceNode;
182}
183
184interface InstanceNode extends SceneNode, LayoutMixin {
185 type: "INSTANCE";
186}
187
188interface ComponentSetNode extends SceneNode, LayoutMixin {
189 type: "COMPONENT_SET";
190 description: string;
191}
192
193interface SectionNode extends BaseNode, LayoutMixin {
194 type: "SECTION";
195 children: readonly SceneNode[];
196 fills: ReadonlyArray<Paint>;
197 resizeWithoutConstraints(width: number, height: number): void;
198}
199
200interface Paint {
201 type: string;
202 color?: RGB;
203 opacity?: number;
204}
205
206interface SolidPaint extends Paint {
207 type: "SOLID";
208 color: RGB;
209 boundVariables?: {
210 color?: VariableAlias;
211 };
212}
213
214interface VariableAlias {
215 type: "VARIABLE_ALIAS";
216 id: string;
217}
218
219interface RGB {
220 r: number;
221 g: number;
222 b: number;
223}
224
225interface VariableCollection {
226 name: string;
227 variableIds: string[];
228 modes: { modeId: string; name: string }[];
229 renameMode(modeId: string, newName: string): void;
230 addMode(name: string): string;
231 remove(): void;
232}
233
234interface VectorNode extends SceneNode {
235 type: "VECTOR";
236}
237
238interface Variable {
239 id: string;
240 name: string;
241 setValueForMode(modeId: string, value: RGB | RGBA | number | string): void;
242 remove(): void;
243}
244
245interface RGBA extends RGB {
246 a: number;
247}
248
249type ComponentPropertyDefinition =
250 | { type: "BOOLEAN"; defaultValue?: boolean }
251 | { type: "TEXT"; defaultValue?: string }
252 | { type: "VARIANT"; defaultValue?: string; variantOptions?: string[] }
253 | { type: "INSTANCE_SWAP" };
254