From f9b5405dfafebe47fb3b862ad614ce5f83f38aee Mon Sep 17 00:00:00 2001 From: Pablo Date: Tue, 29 Jan 2019 11:34:15 +0100 Subject: [PATCH 1/3] Added assets module --- package.json | 2 +- types/assets.d.ts | 171 ++++++++++++++++++++++++++++++++++++++++++ types/scenegraph.d.ts | 1 + 3 files changed, 173 insertions(+), 1 deletion(-) create mode 100644 types/assets.d.ts diff --git a/package.json b/package.json index 0a78ee1..9b1caaf 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@adobexd/typings", - "version": "14.0.0", + "version": "15.0.0", "typings": "./types/index.d.ts", "description": "Typings for Adobe XD CC", "repository": { diff --git a/types/assets.d.ts b/types/assets.d.ts new file mode 100644 index 0000000..ecc6330 --- /dev/null +++ b/types/assets.d.ts @@ -0,0 +1,171 @@ +import {Color, LinearGradientFill, RadialGradientFill} from "./scenegraph"; + +/** + * Represents the document styles listed in the Assets panel. Styles can be added and removed manually by the user, so there's no guarantee that these styles are currently used anywhere in the document's content. + * **Since: ** XD 15 + */ +export module assets { + /** + * Type of gradient color element: linear gradient or radial gradient + */ + export enum GradientType { + LINEAR, + RADIAL + } + + /** + * Assets library entry representing a solid color. + */ + type ColorAsset = { + /** + * Name of the Assets entry, if it is explicitly named. (The UI shows an auto-generated label for any unnamed assets). + */ + name?: string; + + /** + * Color of the asset + */ + color: Color; + } + + /** + * Assets library entry representing a linear or radial gradient. + */ + type GradientAsset = { + /** + * Name of the Assets entry, if it is explicitly named. (The UI shows an auto-generated label for any unnamed assets). + */ + name?: string; + /** + * Either `GradientType.LINEAR` or `GradientType.RADIAL` + */ + gradientType: GradientType; + /** + * Array of color stops used in the gradient, where stop >= 0 and <= 1, and the values are strictly increasing. Same format as the colorStops property of a LinearGradientFill object. + */ + colorStops: Array<{ stop: number, color: Color }> + } + + /** + * Assets library entry representing a set of text character styles. + */ + type CharacterStyleAsset = { + /** + * Name of the Assets entry, if it is explicitly named. (The UI shows an auto-generated label for any unnamed assets). + */ + name?: string; + /** + * Object containing the style properties + */ + style: CharacterStyle; + } + + /** + * Character style properties. See documentation for the Text node type for more details. + */ + type CharacterStyle = { + /** + * the font family + */ + fontFamily: string; + /** + * the style of the font + */ + fontStyle: string; + /** + * the size of the font + */ + fontSize: number; + /** + * the Color of the font fill + */ + fill: Color; + /** + * the character spacing + */ + charSpacing: number; + /** + * the line spacing + */ + lineSpacing: number; + /** + * whether underline is turned on + */ + underline: boolean; + } + + /** + * The collection of colors and gradients saved in this document's Asset library + */ + declare static class colors { + /** + * Get a list of all color/gradient assets, in the order they appear in the Assets panel. + * + * The list may contain a mix of solid Color assets and/or gradient assets. If there are no color/gradient assets, an empty array is returned. + * + * @example + * var assets = require("assets"), + * allColors = assets.colors.get(); + * + */ + public static get(): Array; + + /** + * Add color/gradient assets to the collection. + * + * The list may contain a mix of solid Color assets and/or gradient assets. Items are not added if a duplicate color/gradient already exists in the collection, *regardless of its name*. + * @param colorAssets The color assets + * @returns {number} number of assets added (may be less than requested if duplicates already exist) + */ + public static add(colorAssets: Color | ColorAsset | LinearGradientFill | RadialGradientFill | GradientAsset | Array): number; + + /** + * Delete color/gradient assets from the collection. + * + * The list may contain a mix of solid Color assets and/or gradient assets. Assets with the same color/gradient are removed even if their names differ. Assets that already don't exist in the collection are silently ignored. Typically you will pass asset objects returned from `get()` directly to this function. + * + * @param colorAssets The color assets + * @returns {number} number of assets deleted (may be less than requested if some didn't exist) + */ + public static delete(colorAssets: Color | ColorAsset | LinearGradientFill | RadialGradientFill | GradientAsset | Array): number; + } + + /** + * The collection of character styles saved in this document's Assets library. + */ + declare static class characterStyles { + /** + * Get a list of all character style assets, in the order they appear in the Assets panel. + * + * If there are no character style assets, an empty array is returned. + * + * @example + * var assets = require("assets"), + * allCharacterStyles = assets.characterStyles.get(); + * + */ + public static get(): Array; + + /** + * Add one or more character style assets to the collection. + * + * Items are not added if a duplicate character style already exists in the collection, regardless of its name. All character style properties must be fully specified (no properties are optional). + * + * @param charStyleAssets The character style assets + * @returns {number} number of assets added (may be less than requested if duplicates already exist) + */ + public static add(charStyleAssets: CharacterStyleAsset | Array): number; + + /** + * Delete one or more character style assets from the collection. + * + * Assets with the same character style are removed even if their names differ. Assets that already don't exist in the collection are silently ignored. All character style properties must be fully specified (no properties are optional). Typically you will pass asset objects returned from `get()` directly to this function. + * + * @returns {number} number of assets deleted (may be less than requested if some didn't exist) + * @param charStyleAssets The character styles + */ + public static delete(charStyleAssets: CharacterStyleAsset | Array): number; + } + + +} \ No newline at end of file diff --git a/types/scenegraph.d.ts b/types/scenegraph.d.ts index 27ed536..885010d 100644 --- a/types/scenegraph.d.ts +++ b/types/scenegraph.d.ts @@ -1214,6 +1214,7 @@ export { Color, ImageFill, LinearGradientFill, + RadialGradientFill, Matrix, Shadow, Blur, From 27dc3b28568149d8db999c8b93ade34043410e7b Mon Sep 17 00:00:00 2001 From: Pablo Date: Tue, 29 Jan 2019 11:42:21 +0100 Subject: [PATCH 2/3] Moved global classes Color, ImageFill etc. to globals --- types/application.d.ts | 2 +- types/assets.d.ts | 2 - types/index.d.ts | 380 +++++++++++++++++++++++++++++++++++++++ types/scenegraph.d.ts | 390 ----------------------------------------- 4 files changed, 381 insertions(+), 393 deletions(-) diff --git a/types/application.d.ts b/types/application.d.ts index bf44d17..ccd04ea 100644 --- a/types/application.d.ts +++ b/types/application.d.ts @@ -1,4 +1,4 @@ -import {Color, SceneNode} from "./scenegraph"; +import {SceneNode} from "./scenegraph"; /** * All rendition settings fields are required (for a given rendition type) unless otherwise specified. diff --git a/types/assets.d.ts b/types/assets.d.ts index ecc6330..b105393 100644 --- a/types/assets.d.ts +++ b/types/assets.d.ts @@ -1,5 +1,3 @@ -import {Color, LinearGradientFill, RadialGradientFill} from "./scenegraph"; - /** * Represents the document styles listed in the Assets panel. Styles can be added and removed manually by the user, so there's no guarantee that these styles are currently used anywhere in the document's content. * **Since: ** XD 15 diff --git a/types/index.d.ts b/types/index.d.ts index 5b2d442..313b27d 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -108,4 +108,384 @@ declare global { */ public openExternal(url: string); } + + + declare class Color { + /** + * Integer 0-255. Get/set the alpha channel value. + */ + public a: number; + + /** + * Integer 0-255. Get/set the red channel value. + */ + public r: number; + + /** + * Integer 0-255. Get/set the green channel value. + */ + public g: number; + + /** + * Integer 0-255. Get/set the blue channel value. + */ + public b: number; + + /** + * Creates a new color instance. + * @param value String in CSS color format (hex, rgb, rgba, hsl, hsla, hsv, hsva, or color name); or ARGB numeric value (unsigned 32-bit integer); or object with r, g, b, a keys all set to integers from 0 - 255 (if a is omitted, 255 is used). + * @param opacity Optional, floating-point value from 0 - 1. Use when value parameter doesn't specify an opacity and you don't want the default 1.0 (100%) opacity. + */ + public constructor(value: string | { r: number, g: number, b: number, a?: number }, opacity?: number); + + /** + * Convert to an object with r, g, b, a keys where r, g, b, a range from 0 - 255. + */ + public toRgba(): { r: number, g: number, b: number, a: number }; + + /** + * Convert to hex string with "#" prefix. Ignores the Color's alpha value. Returns a 3-digit string if possible, otherwise returns a 6-digit string. + * @param forceSixDigits True if you want the result to always have 6 digits. + */ + public toHex(forceSixDigits: boolean): string; + + /** + * Returns a clone of the current color object + */ + public clone(): Color; + } + + declare class LinearGradientFill { + /** + * Array of objects representing each color and its position along the gradient line. The position (stop value) is a number 0.0 - 1.0. + */ + public colorStops: {color:Color,stop:number}[]; + + /** + * X position of the start of the gradient line, as a multiple of the object's bounding box: X=0 indicates the left edge of the bounding box and X=1 indicates the right edge. The gradient line may start or end outside the object's bounding box, so values may be < 0 or > 1. + */ + public startX: number; + + /** + * Y position of the start of the gradient line, as a multiple of the object's bounding box: Y=0 indicates the top edge of the bounding box and Y=1 indicates the bottom edge. The gradient line may start or end outside the object's bounding box, so values may be < 0 or > 1. + */ + public startY: number; + + /** + * X position of the end of the gradient line, as a multiple of the object's bounding box: X=0 indicates the left edge of the bounding box and X=1 indicates the right edge. The gradient line may start or end outside the object's bounding box, so values may be < 0 or > 1. + */ + public endX: number; + + /** + * Y position of the end of the gradient line, as a multiple of the object's bounding box: Y=0 indicates the top edge of the bounding box and Y=1 indicates the bottom edge. The gradient line may start or end outside the object's bounding box, so values may be < 0 or > 1. + */ + public endY: number; + + /** + * Create a new LinearGradientFill instance. + */ + public constructor(); + + /** + * Returns a copy of this instance. + */ + public clone(): LinearGradientFill; + + /** + * Returns an array of [startX, startY, endX, endY]. + */ + public getEndPoints(): number[]; + + /** + * Shorthand for setting all four start/endpoint properties. + * @param startX + * @param startY + * @param endX + * @param endY + */ + public setEndPoints(startX: number, startY: number, endX: number, endY: number); + } + + declare class RadialGradientFill { + // TODO: Waiting for documentation to arrive + } + + declare class ImageFill { + /** + * The image is stretched (distorting its aspect ratio) so its edges line up exactly with the edges of the shape. (Similar to `object-fit: fill` in CSS). + */ + public static SCALE_STRETCH: string; + /** + * The image's aspect ratio is preserved and it it scaled to completely cover the area of the shape. This means on one axis the image's edges line up exactly with the edges of the shape, and on the other axis the image extends beyond the shape's bounds and is cropped. (Similar to `object-fit: cover` in CSS). + */ + public static SCALE_COVER: string; + + /** + * How the image is scaled when the aspect ratio of the shape does not match the aspect ratio of the image: + * * ImageFill.SCALE_STRETCH - The image is stretched (distorting its aspect ratio) so its edges line up exactly with the edges of the shape. (Similar to `object-fit: fill` in CSS). + * * ImageFill.SCALE_COVER - The image's aspect ratio is preserved and it it scaled to completely cover the area of the shape. This means on one axis the image's edges line up exactly with the edges of the shape, and on the other axis the image extends beyond the shape's bounds and is cropped. (Similar to `object-fit: cover` in CSS). + * + * Image size and scaling are also affected by cropping settings, but these are not yet exposed to plugins. + * + * To change this property, use cloneWithOverrides. + */ + public scaleBehaviour: string; + + /** + * Format the image data was originally encoded in, such as `image/gif` or `image/jpeg`. + */ + public readonly mimeType: string; + + /** + * True if the image comes from a link to an external resource, such as Creative Cloud Libraries. + */ + public readonly isLinkedContent: boolean; + + /** + * Pixel dimensions of the underlying bitmap image data. + */ + public readonly naturalWidth: number; + + /** + * Pixel dimensions of the underlying bitmap image data. + */ + public readonly naturalHeight: number; + + /** + * + * @param fileOrDataURI File object pointing to an image file; or a string containing a data: URI with a base-64 encoded image. + */ + public constructor(fileOrDataURI: string | File); + + /** + * @returns a new copy of this ImageFill. + */ + public clone(): ImageFill; + } + + + declare class Shadow { + /** + * X offset of the shadow relative to the shape it is attached to, in global coordinates (i.e. independent of the shape's rotation or any parent's rotation). May be negative. + */ + public x: number; + + /** + * Y offset of the shadow relative to the shape it is attached to, in global coordinates (i.e. independent of the shape's rotation or any parent's rotation). May be negative. + */ + public y: number; + public blur: number; + public color: Color; + + /** + * If false, the shadow is not rendered. The user can toggle this via a checkbox in the Properties panel. + */ + public visible: boolean; + + /** + * Creates a drop shadow style object with the given properties. + * @param x + * @param y + * @param blur + * @param color + * @param visible optional and defaults to true. + */ + public constructor(x: number, y: number, blur: number, color: Color, visible: boolean) + } + + declare class Blur { + /** + * The amount of blur + * + * (0 - 50) + */ + public blurAmount: number; + /** + * For background blur effects, the amount to increase or decrease the brightness of the background. Ignored for object blur effects. + * + * (-50 - 50) + */ + public brightnessAmount: number; + + /** + * For background blur effects, the a multiplier on the opacity of the object's fill drawn over top of the blurred background. Useful to create a color tint on top of the blurred background. Does not affect stroke opacity. + * + * Ignored for object blur effects. + * + * (0.0 - 1.0) + */ + public fillOpacity: number; + /** + * If true, renders a background blur effect: all objects beneath the shape are blurred (modulated by brightnessAmount), but the shape itself is still rendered with crisp edges (with its fill modulated by fillOpacity). + * + * If false, renders an object blur effect: the shape itself is blurred, and objects beneath it are unaffected. + */ + public isBackgroundEffect: boolean; + + /** + * If false, the blur effect is not rendered. The user can toggle this via a checkbox in the Properties panel. + */ + public visible: boolean; + + /** + * Creates an object blur or background blur effect object with the given properties. + * @param blurAmount + * @param brightnessAmount + * @param fillOpacity + * @param visible + * @param isBackgroundEffect + */ + constructor(blurAmount: number, brightnessAmount: number, fillOpacity: number, visible?: boolean, isBackgroundEffect?: boolean); + } + + + declare class Matrix { + /** + * Creates a new transform matrix with the following structure: + * + * ``` + * | a c e | + * | b d f | + * | 0 0 1 | + * ``` + * + * Note: XD does not generally allow transform matrices with scale or shear (skew) components - only translate and rotate components are typically permitted. + * + * If no arguments, creates a new identity matrix by default. + * + * @param a + * @param b + * @param c + * @param d + * @param e + * @param f + */ + public constructor(a: number, b: number, c: number, d: number, e: number, f: number); + + /** + * Copies another matrix's values into this matrix. + * @param otherMatrix The matrix to copy values from. + */ + public setFrom(otherMatrix: Matrix); + + /** + * Returns a copy of the matrix + */ + public clone(): Matrix; + + /** + * Multiplies a passed affine transform to the right: this * M. The result effectively applies the transform of the passed in matrix first, followed by the transform of this matrix second. Modifies this matrix object and also returns it so calls can be chained. + * @param aOrOtherMatrix A Matrix or the a component of an affine transform. + * @param b The b component of an affine transform. + * @param c The c component of an affine transform. + * @param d The d component of an affine transform. + * @param e The e component of an affine transform. + * @param f The f component of an affine transform. + */ + public add(aOrOtherMatrix: number, b: number, c: number, d: number, e: number, f: number); + + /** + * Multiplies a passed affine transform to the right: this * M. The result effectively applies the transform of the passed in matrix first, followed by the transform of this matrix second. Modifies this matrix object and also returns it so calls can be chained. + * @param aOrOtherMatrix A Matrix or the a component of an affine transform. + */ + public add(aOrOtherMatrix: Matrix); + + /** + * Multiplies a passed affine transform to the left: M * this. The result effectively applies the transform of this matrix first, followed by the transform of the passed in matrix second. Modifies this matrix object and also returns it so calls can be chained. + * @param aOrOtherMatrix A Matrix or the a component of an affine transform. + * @param b The b component of an affine transform. + * @param c The c component of an affine transform. + * @param d The d component of an affine transform. + * @param e The e component of an affine transform. + * @param f The f component of an affine transform. + */ + public multLeft(aOrOtherMatrix: number, b: number, c: number, d: number, e: number, f: number); + + /** + * Multiplies a passed affine transform to the left: M * this. The result effectively applies the transform of this matrix first, followed by the transform of the passed in matrix second. Modifies this matrix object and also returns it so calls can be chained. + * @param aOrOtherMatrix A Matrix or the a component of an affine transform. + */ + public multLeft(aOrOtherMatrix: Matrix); + + /** + * Returns an inverted version of the matrix. Returns a brand new matrix - does not modify this matrix object. + */ + public invert(): Matrix; + + /** + * Applies translation before the current transform of this matrix, as if using the add() method. Modifies this matrix object and also returns it so calls can be chained. + * @param tx horizontal offset distance + * @param ty vertical offset distance + */ + public translate(tx: number, ty: number): Matrix; + + /** + * Applies scaling before the current transform of this matrix, as if using the add() method. Modifies this matrix object and also returns it so calls can be chained. + * + * Note: scale transforms are not generally permitted in XD. + * @param sx amount to be scaled, with 1 resulting in no change + * @param sy amount to scale along the vertical axis. (Otherwise sx applies to both axes.) + * @param cx horizontal origin point from which to scale (if unspecified, scales from the local coordinates' origin point) + * @param cy vertical origin point from which to scale + */ + public scale(sx: number, sy?: number, cx?: number, cy?: number): Matrix; + + /** + * Applies clockwise rotation before the current transform of this matrix, as if using the add() method. Modifies this matrix object and also returns it so calls can be chained. + * @param angle angle of rotation, in degrees clockwise + * @param cx horizontal origin point from which to rotate (if unspecified, scales from the local coordinates' origin point) + * @param cy vertical origin point from which to rotate + */ + public rotate(angle: number, cx?: number, cy?: number): Matrix; + + /** + * Returns x coordinate of the given point after transformation described by this matrix. See also Matrix.y and Matrix.transformPoint. + * @param x + * @param y + */ + public x(x: number, y: number): number; + + /** + * Returns y coordinate of the given point after transformation described by this matrix. See also Matrix.x and Matrix.transformPoint. + * @param x + * @param y + */ + public y(x: number, y: number): number; + + /** + * Returns x & y coordinates of the given point after transformation described by this matrix. + * @param point + */ + public transformPoint(point: Point): Point; + + /** + * Transforms a rectangle using this matrix, returning the axis-aligned bounds of the resulting rectangle. If this matrix has rotation, then the result will have different width & height from the original rectangle, due to axis alignment. See "Coordinate Spaces" for some illustrations of this. + * @param rect + */ + public transformRect(rect: Bounds): Bounds; + + /** + * @return The translation component of this matrix: [tx, ty]. Equals the `e` and `f` components of this matrix. + */ + public getTranslate(): number[]; + + /** + * Split the matrix into scale factors. This method assumes that there is no skew in the matrix. + */ + public scaleFactors(): {scaleX:number,scaleY:number}; + + /** + * Returns a new matrix that contains only the translate and rotate components of the current matrix, with the given scale factors stripped out. Must be passed the exact scale factors returned by scaleFactors() for this matrix, and this matrix must have no skew/shear component. + * + * Returns a brand new matrix - does not modify this matrix object. + * @param scaleX horizontal scale component to remove + * @param scaleY vertical scale component to remove + */ + public removedScaleMatrix(scaleX: number, scaleY: number): Matrix; + + /** + * @return true, if the matrix includes any skew (shear) + */ + public hasSkew(): boolean; + } } diff --git a/types/scenegraph.d.ts b/types/scenegraph.d.ts index 885010d..dccd175 100644 --- a/types/scenegraph.d.ts +++ b/types/scenegraph.d.ts @@ -3,389 +3,6 @@ declare interface Point { y: number; } -interface ScaleFactor { - scaleX: number; - scaleY: number; -} - -declare class Matrix { - /** - * Creates a new transform matrix with the following structure: - * - * ``` - * | a c e | - * | b d f | - * | 0 0 1 | - * ``` - * - * Note: XD does not generally allow transform matrices with scale or shear (skew) components - only translate and rotate components are typically permitted. - * - * If no arguments, creates a new identity matrix by default. - * - * @param a - * @param b - * @param c - * @param d - * @param e - * @param f - */ - public constructor(a: number, b: number, c: number, d: number, e: number, f: number); - - /** - * Copies another matrix's values into this matrix. - * @param otherMatrix The matrix to copy values from. - */ - public setFrom(otherMatrix: Matrix); - - /** - * Returns a copy of the matrix - */ - public clone(): Matrix; - - /** - * Multiplies a passed affine transform to the right: this * M. The result effectively applies the transform of the passed in matrix first, followed by the transform of this matrix second. Modifies this matrix object and also returns it so calls can be chained. - * @param aOrOtherMatrix A Matrix or the a component of an affine transform. - * @param b The b component of an affine transform. - * @param c The c component of an affine transform. - * @param d The d component of an affine transform. - * @param e The e component of an affine transform. - * @param f The f component of an affine transform. - */ - public add(aOrOtherMatrix: number, b: number, c: number, d: number, e: number, f: number); - - /** - * Multiplies a passed affine transform to the right: this * M. The result effectively applies the transform of the passed in matrix first, followed by the transform of this matrix second. Modifies this matrix object and also returns it so calls can be chained. - * @param aOrOtherMatrix A Matrix or the a component of an affine transform. - */ - public add(aOrOtherMatrix: Matrix); - - /** - * Multiplies a passed affine transform to the left: M * this. The result effectively applies the transform of this matrix first, followed by the transform of the passed in matrix second. Modifies this matrix object and also returns it so calls can be chained. - * @param aOrOtherMatrix A Matrix or the a component of an affine transform. - * @param b The b component of an affine transform. - * @param c The c component of an affine transform. - * @param d The d component of an affine transform. - * @param e The e component of an affine transform. - * @param f The f component of an affine transform. - */ - public multLeft(aOrOtherMatrix: number, b: number, c: number, d: number, e: number, f: number); - - /** - * Multiplies a passed affine transform to the left: M * this. The result effectively applies the transform of this matrix first, followed by the transform of the passed in matrix second. Modifies this matrix object and also returns it so calls can be chained. - * @param aOrOtherMatrix A Matrix or the a component of an affine transform. - */ - public multLeft(aOrOtherMatrix: Matrix); - - /** - * Returns an inverted version of the matrix. Returns a brand new matrix - does not modify this matrix object. - */ - public invert(): Matrix; - - /** - * Applies translation before the current transform of this matrix, as if using the add() method. Modifies this matrix object and also returns it so calls can be chained. - * @param tx horizontal offset distance - * @param ty vertical offset distance - */ - public translate(tx: number, ty: number): Matrix; - - /** - * Applies scaling before the current transform of this matrix, as if using the add() method. Modifies this matrix object and also returns it so calls can be chained. - * - * Note: scale transforms are not generally permitted in XD. - * @param sx amount to be scaled, with 1 resulting in no change - * @param sy amount to scale along the vertical axis. (Otherwise sx applies to both axes.) - * @param cx horizontal origin point from which to scale (if unspecified, scales from the local coordinates' origin point) - * @param cy vertical origin point from which to scale - */ - public scale(sx: number, sy?: number, cx?: number, cy?: number): Matrix; - - /** - * Applies clockwise rotation before the current transform of this matrix, as if using the add() method. Modifies this matrix object and also returns it so calls can be chained. - * @param angle angle of rotation, in degrees clockwise - * @param cx horizontal origin point from which to rotate (if unspecified, scales from the local coordinates' origin point) - * @param cy vertical origin point from which to rotate - */ - public rotate(angle: number, cx?: number, cy?: number): Matrix; - - /** - * Returns x coordinate of the given point after transformation described by this matrix. See also Matrix.y and Matrix.transformPoint. - * @param x - * @param y - */ - public x(x: number, y: number): number; - - /** - * Returns y coordinate of the given point after transformation described by this matrix. See also Matrix.x and Matrix.transformPoint. - * @param x - * @param y - */ - public y(x: number, y: number): number; - - /** - * Returns x & y coordinates of the given point after transformation described by this matrix. - * @param point - */ - public transformPoint(point: Point): Point; - - /** - * Transforms a rectangle using this matrix, returning the axis-aligned bounds of the resulting rectangle. If this matrix has rotation, then the result will have different width & height from the original rectangle, due to axis alignment. See "Coordinate Spaces" for some illustrations of this. - * @param rect - */ - public transformRect(rect: Bounds): Bounds; - - /** - * @return The translation component of this matrix: [tx, ty]. Equals the `e` and `f` components of this matrix. - */ - public getTranslate(): number[]; - - /** - * Split the matrix into scale factors. This method assumes that there is no skew in the matrix. - */ - public scaleFactors(): ScaleFactor; - - /** - * Returns a new matrix that contains only the translate and rotate components of the current matrix, with the given scale factors stripped out. Must be passed the exact scale factors returned by scaleFactors() for this matrix, and this matrix must have no skew/shear component. - * - * Returns a brand new matrix - does not modify this matrix object. - * @param scaleX horizontal scale component to remove - * @param scaleY vertical scale component to remove - */ - public removedScaleMatrix(scaleX: number, scaleY: number): Matrix; - - /** - * @return true, if the matrix includes any skew (shear) - */ - public hasSkew(): boolean; -} - -declare class Color { - /** - * Integer 0-255. Get/set the alpha channel value. - */ - public a: number; - - /** - * Integer 0-255. Get/set the red channel value. - */ - public r: number; - - /** - * Integer 0-255. Get/set the green channel value. - */ - public g: number; - - /** - * Integer 0-255. Get/set the blue channel value. - */ - public b: number; - - /** - * Creates a new color instance. - * @param value String in CSS color format (hex, rgb, rgba, hsl, hsla, hsv, hsva, or color name); or ARGB numeric value (unsigned 32-bit integer); or object with r, g, b, a keys all set to integers from 0 - 255 (if a is omitted, 255 is used). - * @param opacity Optional, floating-point value from 0 - 1. Use when value parameter doesn't specify an opacity and you don't want the default 1.0 (100%) opacity. - */ - public constructor(value: string | { r: number, g: number, b: number, a?: number }, opacity?: number); - - /** - * Convert to an object with r, g, b, a keys where r, g, b, a range from 0 - 255. - */ - public toRgba(): { r: number, g: number, b: number, a: number }; - - /** - * Convert to hex string with "#" prefix. Ignores the Color's alpha value. Returns a 3-digit string if possible, otherwise returns a 6-digit string. - * @param forceSixDigits True if you want the result to always have 6 digits. - */ - public toHex(forceSixDigits: boolean): string; - - /** - * Returns a clone of the current color object - */ - public clone(): Color; -} - -declare class LinearGradientFill { - /** - * Array of objects representing each color and its position along the gradient line. The position (stop value) is a number 0.0 - 1.0. - */ - public colorStops: {color:Color,stop:number}[]; - - /** - * X position of the start of the gradient line, as a multiple of the object's bounding box: X=0 indicates the left edge of the bounding box and X=1 indicates the right edge. The gradient line may start or end outside the object's bounding box, so values may be < 0 or > 1. - */ - public startX: number; - - /** - * Y position of the start of the gradient line, as a multiple of the object's bounding box: Y=0 indicates the top edge of the bounding box and Y=1 indicates the bottom edge. The gradient line may start or end outside the object's bounding box, so values may be < 0 or > 1. - */ - public startY: number; - - /** - * X position of the end of the gradient line, as a multiple of the object's bounding box: X=0 indicates the left edge of the bounding box and X=1 indicates the right edge. The gradient line may start or end outside the object's bounding box, so values may be < 0 or > 1. - */ - public endX: number; - - /** - * Y position of the end of the gradient line, as a multiple of the object's bounding box: Y=0 indicates the top edge of the bounding box and Y=1 indicates the bottom edge. The gradient line may start or end outside the object's bounding box, so values may be < 0 or > 1. - */ - public endY: number; - - /** - * Create a new LinearGradientFill instance. - */ - public constructor(); - - /** - * Returns a copy of this instance. - */ - public clone(): LinearGradientFill; - - /** - * Returns an array of [startX, startY, endX, endY]. - */ - public getEndPoints(): number[]; - - /** - * Shorthand for setting all four start/endpoint properties. - * @param startX - * @param startY - * @param endX - * @param endY - */ - public setEndPoints(startX: number, startY: number, endX: number, endY: number); -} - -declare class RadialGradientFill { - // TODO: Waiting for documentation to arrive -} - -declare class ImageFill { - /** - * The image is stretched (distorting its aspect ratio) so its edges line up exactly with the edges of the shape. (Similar to `object-fit: fill` in CSS). - */ - public static SCALE_STRETCH: string; - /** - * The image's aspect ratio is preserved and it it scaled to completely cover the area of the shape. This means on one axis the image's edges line up exactly with the edges of the shape, and on the other axis the image extends beyond the shape's bounds and is cropped. (Similar to `object-fit: cover` in CSS). - */ - public static SCALE_COVER: string; - - /** - * How the image is scaled when the aspect ratio of the shape does not match the aspect ratio of the image: - * * ImageFill.SCALE_STRETCH - The image is stretched (distorting its aspect ratio) so its edges line up exactly with the edges of the shape. (Similar to `object-fit: fill` in CSS). - * * ImageFill.SCALE_COVER - The image's aspect ratio is preserved and it it scaled to completely cover the area of the shape. This means on one axis the image's edges line up exactly with the edges of the shape, and on the other axis the image extends beyond the shape's bounds and is cropped. (Similar to `object-fit: cover` in CSS). - * - * Image size and scaling are also affected by cropping settings, but these are not yet exposed to plugins. - * - * To change this property, use cloneWithOverrides. - */ - public scaleBehaviour: string; - - /** - * Format the image data was originally encoded in, such as `image/gif` or `image/jpeg`. - */ - public readonly mimeType: string; - - /** - * True if the image comes from a link to an external resource, such as Creative Cloud Libraries. - */ - public readonly isLinkedContent: boolean; - - /** - * Pixel dimensions of the underlying bitmap image data. - */ - public readonly naturalWidth: number; - - /** - * Pixel dimensions of the underlying bitmap image data. - */ - public readonly naturalHeight: number; - - /** - * - * @param fileOrDataURI File object pointing to an image file; or a string containing a data: URI with a base-64 encoded image. - */ - public constructor(fileOrDataURI: string | File); - - /** - * @returns a new copy of this ImageFill. - */ - public clone(): ImageFill; -} - - -declare class Shadow { - /** - * X offset of the shadow relative to the shape it is attached to, in global coordinates (i.e. independent of the shape's rotation or any parent's rotation). May be negative. - */ - public x: number; - - /** - * Y offset of the shadow relative to the shape it is attached to, in global coordinates (i.e. independent of the shape's rotation or any parent's rotation). May be negative. - */ - public y: number; - public blur: number; - public color: Color; - - /** - * If false, the shadow is not rendered. The user can toggle this via a checkbox in the Properties panel. - */ - public visible: boolean; - - /** - * Creates a drop shadow style object with the given properties. - * @param x - * @param y - * @param blur - * @param color - * @param visible optional and defaults to true. - */ - public constructor(x: number, y: number, blur: number, color: Color, visible: boolean) -} - -declare class Blur { - /** - * The amount of blur - * - * (0 - 50) - */ - public blurAmount: number; - /** - * For background blur effects, the amount to increase or decrease the brightness of the background. Ignored for object blur effects. - * - * (-50 - 50) - */ - public brightnessAmount: number; - - /** - * For background blur effects, the a multiplier on the opacity of the object's fill drawn over top of the blurred background. Useful to create a color tint on top of the blurred background. Does not affect stroke opacity. - * - * Ignored for object blur effects. - * - * (0.0 - 1.0) - */ - public fillOpacity: number; - /** - * If true, renders a background blur effect: all objects beneath the shape are blurred (modulated by brightnessAmount), but the shape itself is still rendered with crisp edges (with its fill modulated by fillOpacity). - * - * If false, renders an object blur effect: the shape itself is blurred, and objects beneath it are unaffected. - */ - public isBackgroundEffect: boolean; - - /** - * If false, the blur effect is not rendered. The user can toggle this via a checkbox in the Properties panel. - */ - public visible: boolean; - - /** - * Creates an object blur or background blur effect object with the given properties. - * @param blurAmount - * @param brightnessAmount - * @param fillOpacity - * @param visible - * @param isBackgroundEffect - */ - constructor(blurAmount: number, brightnessAmount: number, fillOpacity: number, visible?: boolean, isBackgroundEffect?: boolean); -} - declare interface Bounds { x: number; y: number; @@ -1211,13 +828,6 @@ export { SymbolInstance, RepeatGrid, LinkedGraphic, - Color, - ImageFill, - LinearGradientFill, - RadialGradientFill, - Matrix, - Shadow, - Blur, selection, root } From c5faebf1c42407dcde55c811570fd77af0bd5a49 Mon Sep 17 00:00:00 2001 From: Pablo Date: Tue, 29 Jan 2019 11:43:35 +0100 Subject: [PATCH 3/3] Added warning to RadialGradientFill --- types/index.d.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/types/index.d.ts b/types/index.d.ts index 313b27d..d196b50 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -206,6 +206,9 @@ declare global { public setEndPoints(startX: number, startY: number, endX: number, endY: number); } + /** + * **The RadialGradientFill type is not documented and its API may change. Plugins currently cannot modify or otherwise work with radial gradients.** + */ declare class RadialGradientFill { // TODO: Waiting for documentation to arrive }