@webflow/designer-extension-typings 0.1.0

package/elements.d.ts

@@ -0,0 +1,4 @@
+/// <reference path="./styles.d.ts" />
+/// <reference path="./elements-generated.d.ts" />
+
+declare type ElementId = string;

package/index.d.ts

@@ -0,0 +1,19 @@
+/// <reference path="./styles.d.ts" />
+/// <reference path="./elements.d.ts" />
+
+declare global {
+  const webflow: WebflowApi;
+}
+
+interface WebflowApi {
+  getSelectedElement(): Promise<null | AnyElement>;
+  getElements<t extends AnyElement['type']>(
+    types: Array<t>
+  ): Promise<Array<Extract<AnyElement, {type: t}>>>;
+  createStyle(name: string): Style;
+  createString(text: string): StringElement;
+  createDOM(tag: string): DOMElement;
+  createHeading(tag: 1 | 2 | 3 | 4 | 5 | 6): DOMElement;
+}
+
+export {};

package/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@webflow/designer-extension-typings",
+  "version": "0.1.0",
+  "license": "SEE LICENSE IN LICENSE",
+  "description": "Typings for the Webflow Designer Extension API",
+  "main": "",
+  "scripts": {
+    "test": "tsc"
+  }
+}

package/styles.d.ts

@@ -0,0 +1,51 @@
+interface Style {
+  readonly id: StyleId;
+  getClassName(): string;
+  getProperties(options?: BreakpointAndPseudo): PropertyMap;
+  setProperties(props: PropertyMap, options?: BreakpointAndPseudo): undefined;
+  getProperty(prop: string, options?: BreakpointAndPseudo): null | string;
+  setProperty(
+    prop: string,
+    value: string,
+    options?: BreakpointAndPseudo
+  ): undefined;
+  clearAllProperties(): undefined;
+  save(): Promise<undefined>;
+  destroy(): undefined;
+}
+
+declare type StyleId = string;
+
+declare type PropertyMap = {[property: string]: string};
+
+declare type BreakpointAndPseudo = {
+  breakpoint?: BreakpointId;
+  pseudo?: PseudoStateKey;
+};
+
+declare type BreakpointId =
+  | 'xxl'
+  | 'xl'
+  | 'large'
+  | 'main'
+  | 'medium'
+  | 'small'
+  | 'tiny';
+
+declare type PseudoStateKey =
+  | 'noPseudo'
+  | 'nth-child(odd)'
+  | 'nth-child(even)'
+  | 'first-child'
+  | 'last-child'
+  | 'hover'
+  | 'active'
+  | 'pressed'
+  | 'visited'
+  | 'focus'
+  | 'focus-visible'
+  | 'focus-within'
+  | 'placeholder'
+  | 'empty'
+  | 'before'
+  | 'after';

package/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "target": "es6",
+    "lib": ["es6"],
+    "noEmit": true,
+    "strict": true,
+    "typeRoots": [],
+  }
+}