fabric 7.1.0 → 7.2.0

package/dist/src/controls/Control.min.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Control.min.mjs","sources":["../../../src/controls/Control.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\nimport type {\n  ControlActionHandler,\n  TPointerEvent,\n  TransformActionHandler,\n} from '../EventTypeDefs';\nimport { Intersection } from '../Intersection';\nimport { Point } from '../Point';\nimport { FILL, SCALE, STROKE } from '../constants';\nimport type {\n  InteractiveFabricObject,\n  TOCoord,\n} from '../shapes/Object/InteractiveObject';\nimport type { TCornerPoint, TDegree, TMat2D } from '../typedefs';\nimport {\n  createRotateMatrix,\n  createScaleMatrix,\n  createTranslateMatrix,\n  multiplyTransformMatrixArray,\n} from '../util/misc/matrix';\nimport { degreesToRadians } from '../util/misc/radiansDegreesConversion';\nimport type { ControlRenderingStyleOverride } from './controlRendering';\nimport { renderCircleControl, renderSquareControl } from './controlRendering';\n\nexport class Control {\n  /**\n   * keep track of control visibility.\n   * mainly for backward compatibility.\n   * if you do not want to see a control, you can remove it\n   * from the control set.\n   * @type {Boolean}\n   * @default true\n   */\n  visible = true;\n\n  /**\n   * Name of the action that the control will likely execute.\n   * This is optional. FabricJS uses to identify what the user is doing for some\n   * extra optimizations. If you are writing a custom control and you want to know\n   * somewhere else in the code what is going on, you can use this string here.\n   * you can also provide a custom getActionName if your control run multiple actions\n   * depending on some external state.\n   * default to scale since is the most common, used on 4 corners by default\n   * @type {String}\n   * @default 'scale'\n   */\n  actionName = SCALE;\n\n  /**\n   * Drawing angle of the control.\n   * NOT used for now, but name marked as needed for internal logic\n   * example: to reuse the same drawing function for different rotated controls\n   * @type {Number}\n   * @default 0\n   */\n  angle = 0;\n\n  /**\n   * Relative position of the control. X\n   * 0,0 is the center of the Object, while -0.5 (left) or 0.5 (right) are the extremities\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  x = 0;\n\n  /**\n   * Relative position of the control. Y\n   * 0,0 is the center of the Object, while -0.5 (top) or 0.5 (bottom) are the extremities\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  y = 0;\n\n  /**\n   * Horizontal offset of the control from the defined position. In pixels\n   * Positive offset moves the control to the right, negative to the left.\n   * It used when you want to have position of control that does not scale with\n   * the bounding box. Example: rotation control is placed at x:0, y: 0.5 on\n   * the boundind box, with an offset of 30 pixels vertically. Those 30 pixels will\n   * stay 30 pixels no matter how the object is big. Another example is having 2\n   * controls in the corner, that stay in the same position when the object scale.\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  offsetX = 0;\n\n  /**\n   * Vertical offset of the control from the defined position. In pixels\n   * Positive offset moves the control to the bottom, negative to the top.\n   * @type {Number}\n   * @default 0\n   */\n  offsetY = 0;\n\n  /**\n   * Sets the length of the control. If null, defaults to object's cornerSize.\n   * Expects both sizeX and sizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  sizeX = 0;\n\n  /**\n   * Sets the height of the control. If null, defaults to object's cornerSize.\n   * Expects both sizeX and sizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  sizeY = 0;\n\n  /**\n   * Sets the length of the touch area of the control. If null, defaults to object's touchCornerSize.\n   * Expects both touchSizeX and touchSizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  touchSizeX = 0;\n\n  /**\n   * Sets the height of the touch area of the control. If null, defaults to object's touchCornerSize.\n   * Expects both touchSizeX and touchSizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  touchSizeY = 0;\n\n  /**\n   * Css cursor style to display when the control is hovered.\n   * if the method `cursorStyleHandler` is provided, this property is ignored.\n   * @type {String}\n   * @default 'crosshair'\n   */\n  cursorStyle = 'crosshair';\n\n  /**\n   * If controls has an offsetY or offsetX, draw a line that connects\n   * the control to the bounding box\n   * @type {Boolean}\n   * @default false\n   */\n  withConnection = false;\n\n  constructor(options?: Partial<Control>) {\n    Object.assign(this, options);\n  }\n\n  /**\n   * The control actionHandler, provide one to handle action ( control being moved )\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare actionHandler: TransformActionHandler;\n\n  /**\n   * The control handler for mouse down, provide one to handle mouse down on control\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare mouseDownHandler?: ControlActionHandler;\n\n  /**\n   * The control mouseUpHandler, provide one to handle an effect on mouse up.\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare mouseUpHandler?: ControlActionHandler;\n\n  shouldActivate(\n    controlKey: string,\n    fabricObject: InteractiveFabricObject,\n    pointer: Point,\n    { tl, tr, br, bl }: TCornerPoint,\n  ) {\n    // TODO: locking logic can be handled here instead of in the control handler logic\n    return (\n      fabricObject.canvas?.getActiveObject() === fabricObject &&\n      fabricObject.isControlVisible(controlKey) &&\n      Intersection.isPointInPolygon(pointer, [tl, tr, br, bl])\n    );\n  }\n\n  /**\n   * Returns control actionHandler\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getActionHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): TransformActionHandler | undefined {\n    return this.actionHandler;\n  }\n\n  /**\n   * Returns control mouseDown handler\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getMouseDownHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): ControlActionHandler | undefined {\n    return this.mouseDownHandler;\n  }\n\n  /**\n   * Returns control mouseUp handler.\n   * During actions the fabricObject or the control can be of different obj\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getMouseUpHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): ControlActionHandler | undefined {\n    return this.mouseUpHandler;\n  }\n\n  /**\n   * Returns control cursorStyle for css using cursorStyle. If you need a more elaborate\n   * function you can pass one in the constructor\n   * the cursorStyle property\n   * @param {Event} eventData the native mouse event\n   * @param {Control} control the current control ( likely this)\n   * @param {FabricObject} object on which the control is displayed\n   * @return {String}\n   */\n  cursorStyleHandler(\n    eventData: TPointerEvent,\n    control: Control,\n    fabricObject: InteractiveFabricObject,\n    coord: TOCoord,\n  ) {\n    return control.cursorStyle;\n  }\n\n  /**\n   * Returns the action name. The basic implementation just return the actionName property.\n   * @param {Event} eventData the native mouse event\n   * @param {Control} control the current control ( likely this)\n   * @param {FabricObject} object on which the control is displayed\n   * @return {String}\n   */\n  getActionName(\n    eventData: TPointerEvent,\n    control: Control,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    return control.actionName;\n  }\n\n  /**\n   * Returns controls visibility\n   * @param {FabricObject} object on which the control is displayed\n   * @param {String} controlKey key where the control is memorized on the\n   * @return {Boolean}\n   */\n  getVisibility(fabricObject: InteractiveFabricObject, controlKey: string) {\n    return fabricObject._controlsVisibility?.[controlKey] ?? this.visible;\n  }\n\n  /**\n   * Sets controls visibility\n   * @param {Boolean} visibility for the object\n   * @return {Void}\n   */\n  setVisibility(\n    visibility: boolean,\n    name?: string,\n    fabricObject?: InteractiveFabricObject,\n  ) {\n    this.visible = visibility;\n  }\n\n  positionHandler(\n    dim: Point,\n    finalMatrix: TMat2D,\n    fabricObject: InteractiveFabricObject,\n    currentControl: Control,\n  ) {\n    return new Point(\n      this.x * dim.x + this.offsetX,\n      this.y * dim.y + this.offsetY,\n    ).transform(finalMatrix);\n  }\n\n  /**\n   * Returns the coords for this control based on object values.\n   * @param {Number} objectAngle angle from the fabric object holding the control\n   * @param {Number} objectCornerSize cornerSize from the fabric object holding the control (or touchCornerSize if\n   *   isTouch is true)\n   * @param {Number} centerX x coordinate where the control center should be\n   * @param {Number} centerY y coordinate where the control center should be\n   * @param {boolean} isTouch true if touch corner, false if normal corner\n   */\n  calcCornerCoords(\n    angle: TDegree,\n    objectCornerSize: number,\n    centerX: number,\n    centerY: number,\n    isTouch: boolean,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    const t = multiplyTransformMatrixArray([\n      createTranslateMatrix(centerX, centerY),\n      createRotateMatrix({ angle }),\n      createScaleMatrix(\n        (isTouch ? this.touchSizeX : this.sizeX) || objectCornerSize,\n        (isTouch ? this.touchSizeY : this.sizeY) || objectCornerSize,\n      ),\n    ]);\n    return {\n      tl: new Point(-0.5, -0.5).transform(t),\n      tr: new Point(0.5, -0.5).transform(t),\n      br: new Point(0.5, 0.5).transform(t),\n      bl: new Point(-0.5, 0.5).transform(t),\n    };\n  }\n\n  /**\n   * This is an helper method to prepare the canvas to render a control\n   * It detectes common control properties and sets the correct fill and\n   * stroke styles on the context. It does not execute translations or\n   * rotations since different controls need differnt combination of these.\n   */\n  commonRenderProps(\n    ctx: CanvasRenderingContext2D,\n    left: number,\n    top: number,\n    fabricObject: InteractiveFabricObject,\n    styleOverride: ControlRenderingStyleOverride = {},\n  ): {\n    stroke: boolean;\n    xSize: number;\n    ySize: number;\n    transparentCorners: boolean;\n    opName: 'stroke' | 'fill';\n  } {\n    const { cornerSize, cornerColor, transparentCorners, cornerStrokeColor } =\n        styleOverride,\n      sizeFromProps = cornerSize || fabricObject.cornerSize,\n      xSize = this.sizeX || sizeFromProps,\n      ySize = this.sizeY || sizeFromProps,\n      transparent =\n        typeof transparentCorners !== 'undefined'\n          ? transparentCorners\n          : fabricObject.transparentCorners,\n      opName = transparent ? STROKE : FILL,\n      strokeColor = cornerStrokeColor || fabricObject.cornerStrokeColor,\n      stroke = !transparent && !!strokeColor;\n    ctx.fillStyle = cornerColor || fabricObject.cornerColor || '';\n    ctx.strokeStyle = strokeColor || '';\n    ctx.translate(left, top);\n    //  angle is relative to canvas plane\n    ctx.rotate(degreesToRadians(fabricObject.getTotalAngle()));\n    return {\n      stroke,\n      xSize,\n      ySize,\n      transparentCorners: transparent,\n      opName,\n    };\n  }\n\n  /**\n   * Render function for the control.\n   * When this function runs the context is unscaled. unrotate. Just retina scaled.\n   * all the functions will have to translate to the point left,top before starting Drawing\n   * if they want to draw a control where the position is detected.\n   * left and top are the result of the positionHandler function\n   * @param {RenderingContext2D} ctx the context where the control will be drawn\n   * @param {Number} left position of the canvas where we are about to render the control.\n   * @param {Number} top position of the canvas where we are about to render the control.\n   * @param {Object} styleOverride\n   * @param {FabricObject} fabricObject the object where the control is about to be rendered\n   */\n  render(\n    ctx: CanvasRenderingContext2D,\n    left: number,\n    top: number,\n    styleOverride: ControlRenderingStyleOverride | undefined,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    styleOverride = styleOverride || {};\n    switch (styleOverride.cornerStyle || fabricObject.cornerStyle) {\n      case 'circle':\n        renderCircleControl.call(\n          this,\n          ctx,\n          left,\n          top,\n          styleOverride,\n          fabricObject,\n        );\n        break;\n      default:\n        renderSquareControl.call(\n          this,\n          ctx,\n          left,\n          top,\n          styleOverride,\n          fabricObject,\n        );\n    }\n  }\n}\n"],"names":["Control","constructor","options","_defineProperty","SCALE","Object","assign","this","shouldActivate","controlKey","fabricObject","pointer","_ref","_fabricObject$canvas","tl","tr","br","bl","canvas","getActiveObject","isControlVisible","Intersection","isPointInPolygon","getActionHandler","eventData","control","actionHandler","getMouseDownHandler","mouseDownHandler","getMouseUpHandler","mouseUpHandler","cursorStyleHandler","coord","cursorStyle","getActionName","actionName","getVisibility","_fabricObject$_contro","_fabricObject$_contro2","_controlsVisibility","visible","setVisibility","visibility","name","positionHandler","dim","finalMatrix","currentControl","Point","x","offsetX","y","offsetY","transform","calcCornerCoords","angle","objectCornerSize","centerX","centerY","isTouch","t","multiplyTransformMatrixArray","createTranslateMatrix","createRotateMatrix","createScaleMatrix","touchSizeX","sizeX","touchSizeY","sizeY","commonRenderProps","ctx","left","top","styleOverride","arguments","length","undefined","cornerSize","cornerColor","transparentCorners","cornerStrokeColor","sizeFromProps","xSize","ySize","transparent","opName","STROKE","FILL","strokeColor","stroke","fillStyle","strokeStyle","translate","rotate","degreesToRadians","getTotalAngle","render","cornerStyle","renderCircleControl","call","renderSquareControl"],"mappings":"qjBAwBO,MAAMA,EAyHXC,WAAAA,CAAYC,GAxHZC,kBAQU,GAEVA,oBAWaC,GAEbD,eAOQ,GAERA,WAOI,GAEJA,WAOI,GAEJA,iBAYU,GAEVA,iBAMU,GAEVA,eAMQ,GAERA,eAMQ,GAERA,oBAMa,GAEbA,oBAMa,GAEbA,qBAMc,aAEdA,yBAMiB,GAGfE,OAAOC,OAAOC,KAAML,EACtB,CAgCAM,cAAAA,CACEC,EACAC,EACAC,EAAcC,GAEd,IAAAC,EAAA,IADAC,GAAEA,EAAEC,GAAEA,EAAEC,GAAEA,EAAEC,GAAEA,GAAkBL,EAGhC,OACqB,QAAnBC,EAAAH,EAAaQ,cAAM,IAAAL,OAAA,EAAnBA,EAAqBM,qBAAsBT,GAC3CA,EAAaU,iBAAiBX,IAC9BY,EAAaC,iBAAiBX,EAAS,CAACG,EAAIC,EAAIC,EAAIC,GAExD,CASAM,gBAAAA,CACEC,EACAd,EACAe,GAEA,OAAOlB,KAAKmB,aACd,CASAC,mBAAAA,CACEH,EACAd,EACAe,GAEA,OAAOlB,KAAKqB,gBACd,CAUAC,iBAAAA,CACEL,EACAd,EACAe,GAEA,OAAOlB,KAAKuB,cACd,CAWAC,kBAAAA,CACEP,EACAC,EACAf,EACAsB,GAEA,OAAOP,EAAQQ,WACjB,CASAC,aAAAA,CACEV,EACAC,EACAf,GAEA,OAAOe,EAAQU,UACjB,CAQAC,aAAAA,CAAc1B,EAAuCD,GAAoB,IAAA4B,EAAAC,EACvE,OAAqD,QAArDD,UAAAC,EAAO5B,EAAa6B,2BAAmB,IAAAD,OAAA,EAAhCA,EAAmC7B,cAAW4B,EAAAA,EAAI9B,KAAKiC,OAChE,CAOAC,aAAAA,CACEC,EACAC,EACAjC,GAEAH,KAAKiC,QAAUE,CACjB,CAEAE,eAAAA,CACEC,EACAC,EACApC,EACAqC,GAEA,OAAO,IAAIC,EACTzC,KAAK0C,EAAIJ,EAAII,EAAI1C,KAAK2C,QACtB3C,KAAK4C,EAAIN,EAAIM,EAAI5C,KAAK6C,SACtBC,UAAUP,EACd,CAWAQ,gBAAAA,CACEC,EACAC,EACAC,EACAC,EACAC,EACAjD,GAEA,MAAMkD,EAAIC,EAA6B,CACrCC,EAAsBL,EAASC,GAC/BK,EAAmB,CAAER,UACrBS,GACGL,EAAUpD,KAAK0D,WAAa1D,KAAK2D,QAAUV,GAC3CG,EAAUpD,KAAK4D,WAAa5D,KAAK6D,QAAUZ,KAGhD,MAAO,CACL1C,GAAI,IAAIkC,GAAM,IAAM,IAAMK,UAAUO,GACpC7C,GAAI,IAAIiC,EAAM,IAAK,IAAMK,UAAUO,GACnC5C,GAAI,IAAIgC,EAAM,GAAK,IAAKK,UAAUO,GAClC3C,GAAI,IAAI+B,GAAM,GAAM,IAAKK,UAAUO,GAEvC,CAQAS,iBAAAA,CACEC,EACAC,EACAC,EACA9D,GAQA,IAPA+D,EAA4CC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,CAAA,EAQ/C,MAAMG,WAAEA,EAAUC,YAAEA,EAAWC,mBAAEA,EAAkBC,kBAAEA,GACjDP,EACFQ,EAAgBJ,GAAcnE,EAAamE,WAC3CK,EAAQ3E,KAAK2D,OAASe,EACtBE,EAAQ5E,KAAK6D,OAASa,EACtBG,OACgC,IAAvBL,EACHA,EACArE,EAAaqE,mBACnBM,EAASD,EAAcE,EAASC,EAChCC,EAAcR,GAAqBtE,EAAasE,kBAChDS,GAAUL,KAAiBI,EAM7B,OALAlB,EAAIoB,UAAYZ,GAAepE,EAAaoE,aAAe,GAC3DR,EAAIqB,YAAcH,GAAe,GACjClB,EAAIsB,UAAUrB,EAAMC,GAEpBF,EAAIuB,OAAOC,EAAiBpF,EAAaqF,kBAClC,CACLN,SACAP,QACAC,QACAJ,mBAAoBK,EACpBC,SAEJ,CAcAW,MAAAA,CACE1B,EACAC,EACAC,EACAC,EACA/D,GAGA,GACO,aAFP+D,EAAgBA,GAAiB,CAAA,GACXwB,aAAevF,EAAauF,aAE9CC,EAAoBC,KAClB5F,KACA+D,EACAC,EACAC,EACAC,EACA/D,QAIF0F,EAAoBD,KAClB5F,KACA+D,EACAC,EACAC,EACAC,EACA/D,EAGR"}
+{"version":3,"file":"Control.min.mjs","sources":["../../../src/controls/Control.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\nimport type {\n  ControlActionHandler,\n  TPointerEvent,\n  TransformActionHandler,\n} from '../EventTypeDefs';\nimport { Intersection } from '../Intersection';\nimport { Point } from '../Point';\nimport { FILL, SCALE, STROKE } from '../constants';\nimport type {\n  InteractiveFabricObject,\n  TOCoord,\n} from '../shapes/Object/InteractiveObject';\nimport type {\n  TCornerPoint,\n  TDegree,\n  TMat2D,\n  TOriginX,\n  TOriginY,\n} from '../typedefs';\nimport {\n  createRotateMatrix,\n  createScaleMatrix,\n  createTranslateMatrix,\n  multiplyTransformMatrixArray,\n} from '../util/misc/matrix';\nimport { degreesToRadians } from '../util/misc/radiansDegreesConversion';\nimport type { ControlRenderingStyleOverride } from './controlRendering';\nimport { renderCircleControl, renderSquareControl } from './controlRendering';\n\nexport class Control {\n  /**\n   * keep track of control visibility.\n   * mainly for backward compatibility.\n   * if you do not want to see a control, you can remove it\n   * from the control set.\n   * @type {Boolean}\n   * @default true\n   */\n  visible = true;\n\n  /**\n   * Name of the action that the control will likely execute.\n   * This is optional. FabricJS uses to identify what the user is doing for some\n   * extra optimizations. If you are writing a custom control and you want to know\n   * somewhere else in the code what is going on, you can use this string here.\n   * you can also provide a custom getActionName if your control run multiple actions\n   * depending on some external state.\n   * default to scale since is the most common, used on 4 corners by default\n   * @type {String}\n   * @default 'scale'\n   */\n  actionName = SCALE;\n\n  /**\n   * Drawing angle of the control.\n   * NOT used for now, but name marked as needed for internal logic\n   * example: to reuse the same drawing function for different rotated controls\n   * @type {Number}\n   * @default 0\n   */\n  angle = 0;\n\n  /**\n   * Relative position of the control. X\n   * 0,0 is the center of the Object, while -0.5 (left) or 0.5 (right) are the extremities\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  x = 0;\n\n  /**\n   * Relative position of the control. Y\n   * 0,0 is the center of the Object, while -0.5 (top) or 0.5 (bottom) are the extremities\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  y = 0;\n\n  /**\n   * Horizontal offset of the control from the defined position. In pixels\n   * Positive offset moves the control to the right, negative to the left.\n   * It used when you want to have position of control that does not scale with\n   * the bounding box. Example: rotation control is placed at x:0, y: 0.5 on\n   * the boundind box, with an offset of 30 pixels vertically. Those 30 pixels will\n   * stay 30 pixels no matter how the object is big. Another example is having 2\n   * controls in the corner, that stay in the same position when the object scale.\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  offsetX = 0;\n\n  /**\n   * Vertical offset of the control from the defined position. In pixels\n   * Positive offset moves the control to the bottom, negative to the top.\n   * @type {Number}\n   * @default 0\n   */\n  offsetY = 0;\n\n  /**\n   * Sets the length of the control. If null, defaults to object's cornerSize.\n   * Expects both sizeX and sizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  sizeX = 0;\n\n  /**\n   * Sets the height of the control. If null, defaults to object's cornerSize.\n   * Expects both sizeX and sizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  sizeY = 0;\n\n  /**\n   * Sets the length of the touch area of the control. If null, defaults to object's touchCornerSize.\n   * Expects both touchSizeX and touchSizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  touchSizeX = 0;\n\n  /**\n   * Sets the height of the touch area of the control. If null, defaults to object's touchCornerSize.\n   * Expects both touchSizeX and touchSizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  touchSizeY = 0;\n\n  /**\n   * Css cursor style to display when the control is hovered.\n   * if the method `cursorStyleHandler` is provided, this property is ignored.\n   * @type {String}\n   * @default 'crosshair'\n   */\n  cursorStyle = 'crosshair';\n\n  /**\n   * If controls has an offsetY or offsetX, draw a line that connects\n   * the control to the bounding box\n   * @type {Boolean}\n   * @default false\n   */\n  withConnection = false;\n\n  declare transformAnchorPoint?: {\n    x: TOriginX;\n    y: TOriginY;\n  };\n\n  constructor(options?: Partial<Control>) {\n    Object.assign(this, options);\n  }\n\n  getTransformAnchorPoint(): {\n    x: TOriginX;\n    y: TOriginY;\n  } {\n    return (\n      // return the control transformAnchorPoint\n      this.transformAnchorPoint ??\n      // otherwise will return the opposite origin of where the control is located.\n      new Point(-this.x + 0.5, -this.y + 0.5)\n    );\n  }\n\n  /**\n   * The control actionHandler, provide one to handle action ( control being moved )\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare actionHandler: TransformActionHandler;\n\n  /**\n   * The control handler for mouse down, provide one to handle mouse down on control\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare mouseDownHandler?: ControlActionHandler;\n\n  /**\n   * The control mouseUpHandler, provide one to handle an effect on mouse up.\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare mouseUpHandler?: ControlActionHandler;\n\n  shouldActivate(\n    controlKey: string,\n    fabricObject: InteractiveFabricObject,\n    pointer: Point,\n    { tl, tr, br, bl }: TCornerPoint,\n  ) {\n    // TODO: locking logic can be handled here instead of in the control handler logic\n    return (\n      fabricObject.canvas?.getActiveObject() === fabricObject &&\n      fabricObject.isControlVisible(controlKey) &&\n      Intersection.isPointInPolygon(pointer, [tl, tr, br, bl])\n    );\n  }\n\n  /**\n   * Returns control actionHandler\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getActionHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): TransformActionHandler | undefined {\n    return this.actionHandler;\n  }\n\n  /**\n   * Returns control mouseDown handler\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getMouseDownHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): ControlActionHandler | undefined {\n    return this.mouseDownHandler;\n  }\n\n  /**\n   * Returns control mouseUp handler.\n   * During actions the fabricObject or the control can be of different obj\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getMouseUpHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): ControlActionHandler | undefined {\n    return this.mouseUpHandler;\n  }\n\n  /**\n   * Returns control cursorStyle for css using cursorStyle. If you need a more elaborate\n   * function you can pass one in the constructor\n   * the cursorStyle property\n   * @param {Event} eventData the native mouse event\n   * @param {Control} control the current control ( likely this)\n   * @param {FabricObject} object on which the control is displayed\n   * @return {String}\n   */\n  cursorStyleHandler(\n    eventData: TPointerEvent,\n    control: Control,\n    fabricObject: InteractiveFabricObject,\n    coord: TOCoord,\n  ) {\n    return control.cursorStyle;\n  }\n\n  /**\n   * Returns the action name. The basic implementation just return the actionName property.\n   * @param {Event} eventData the native mouse event\n   * @param {Control} control the current control ( likely this)\n   * @param {FabricObject} object on which the control is displayed\n   * @return {String}\n   */\n  getActionName(\n    eventData: TPointerEvent,\n    control: Control,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    return control.actionName;\n  }\n\n  /**\n   * Returns controls visibility\n   * @param {FabricObject} object on which the control is displayed\n   * @param {String} controlKey key where the control is memorized on the\n   * @return {Boolean}\n   */\n  getVisibility(fabricObject: InteractiveFabricObject, controlKey: string) {\n    return fabricObject._controlsVisibility?.[controlKey] ?? this.visible;\n  }\n\n  /**\n   * Sets controls visibility\n   * @param {Boolean} visibility for the object\n   * @return {Void}\n   */\n  setVisibility(\n    visibility: boolean,\n    name?: string,\n    fabricObject?: InteractiveFabricObject,\n  ) {\n    this.visible = visibility;\n  }\n\n  positionHandler(\n    dim: Point,\n    finalMatrix: TMat2D,\n    fabricObject: InteractiveFabricObject,\n    currentControl: Control,\n  ) {\n    return new Point(\n      this.x * dim.x + this.offsetX,\n      this.y * dim.y + this.offsetY,\n    ).transform(finalMatrix);\n  }\n\n  /**\n   * Returns the coords for this control based on object values.\n   * @param {Number} objectAngle angle from the fabric object holding the control\n   * @param {Number} objectCornerSize cornerSize from the fabric object holding the control (or touchCornerSize if\n   *   isTouch is true)\n   * @param {Number} centerX x coordinate where the control center should be\n   * @param {Number} centerY y coordinate where the control center should be\n   * @param {boolean} isTouch true if touch corner, false if normal corner\n   */\n  calcCornerCoords(\n    angle: TDegree,\n    objectCornerSize: number,\n    centerX: number,\n    centerY: number,\n    isTouch: boolean,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    const t = multiplyTransformMatrixArray([\n      createTranslateMatrix(centerX, centerY),\n      createRotateMatrix({ angle }),\n      createScaleMatrix(\n        (isTouch ? this.touchSizeX : this.sizeX) || objectCornerSize,\n        (isTouch ? this.touchSizeY : this.sizeY) || objectCornerSize,\n      ),\n    ]);\n    return {\n      tl: new Point(-0.5, -0.5).transform(t),\n      tr: new Point(0.5, -0.5).transform(t),\n      br: new Point(0.5, 0.5).transform(t),\n      bl: new Point(-0.5, 0.5).transform(t),\n    };\n  }\n\n  /**\n   * This is an helper method to prepare the canvas to render a control\n   * It detectes common control properties and sets the correct fill and\n   * stroke styles on the context. It does not execute translations or\n   * rotations since different controls need differnt combination of these.\n   */\n  commonRenderProps(\n    ctx: CanvasRenderingContext2D,\n    left: number,\n    top: number,\n    fabricObject: InteractiveFabricObject,\n    styleOverride: ControlRenderingStyleOverride = {},\n  ): {\n    stroke: boolean;\n    xSize: number;\n    ySize: number;\n    transparentCorners: boolean;\n    opName: 'stroke' | 'fill';\n  } {\n    const { cornerSize, cornerColor, transparentCorners, cornerStrokeColor } =\n        styleOverride,\n      sizeFromProps = cornerSize || fabricObject.cornerSize,\n      xSize = this.sizeX || sizeFromProps,\n      ySize = this.sizeY || sizeFromProps,\n      transparent =\n        typeof transparentCorners !== 'undefined'\n          ? transparentCorners\n          : fabricObject.transparentCorners,\n      opName = transparent ? STROKE : FILL,\n      strokeColor = cornerStrokeColor || fabricObject.cornerStrokeColor,\n      stroke = !transparent && !!strokeColor;\n    ctx.fillStyle = cornerColor || fabricObject.cornerColor || '';\n    ctx.strokeStyle = strokeColor || '';\n    ctx.translate(left, top);\n    //  angle is relative to canvas plane\n    ctx.rotate(degreesToRadians(fabricObject.getTotalAngle()));\n    return {\n      stroke,\n      xSize,\n      ySize,\n      transparentCorners: transparent,\n      opName,\n    };\n  }\n\n  /**\n   * Render function for the control.\n   * When this function runs the context is unscaled. unrotate. Just retina scaled.\n   * all the functions will have to translate to the point left,top before starting Drawing\n   * if they want to draw a control where the position is detected.\n   * left and top are the result of the positionHandler function\n   * @param {RenderingContext2D} ctx the context where the control will be drawn\n   * @param {Number} left position of the canvas where we are about to render the control.\n   * @param {Number} top position of the canvas where we are about to render the control.\n   * @param {Object} styleOverride\n   * @param {FabricObject} fabricObject the object where the control is about to be rendered\n   */\n  render(\n    ctx: CanvasRenderingContext2D,\n    left: number,\n    top: number,\n    styleOverride: ControlRenderingStyleOverride | undefined,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    styleOverride = styleOverride || {};\n    switch (styleOverride.cornerStyle || fabricObject.cornerStyle) {\n      case 'circle':\n        renderCircleControl.call(\n          this,\n          ctx,\n          left,\n          top,\n          styleOverride,\n          fabricObject,\n        );\n        break;\n      default:\n        renderSquareControl.call(\n          this,\n          ctx,\n          left,\n          top,\n          styleOverride,\n          fabricObject,\n        );\n    }\n  }\n}\n"],"names":["Control","constructor","options","_defineProperty","SCALE","Object","assign","this","getTransformAnchorPoint","_this$transformAnchor","transformAnchorPoint","Point","x","y","shouldActivate","controlKey","fabricObject","pointer","_ref","_fabricObject$canvas","tl","tr","br","bl","canvas","getActiveObject","isControlVisible","Intersection","isPointInPolygon","getActionHandler","eventData","control","actionHandler","getMouseDownHandler","mouseDownHandler","getMouseUpHandler","mouseUpHandler","cursorStyleHandler","coord","cursorStyle","getActionName","actionName","getVisibility","_fabricObject$_contro","_fabricObject$_contro2","_controlsVisibility","visible","setVisibility","visibility","name","positionHandler","dim","finalMatrix","currentControl","offsetX","offsetY","transform","calcCornerCoords","angle","objectCornerSize","centerX","centerY","isTouch","t","multiplyTransformMatrixArray","createTranslateMatrix","createRotateMatrix","createScaleMatrix","touchSizeX","sizeX","touchSizeY","sizeY","commonRenderProps","ctx","left","top","styleOverride","arguments","length","undefined","cornerSize","cornerColor","transparentCorners","cornerStrokeColor","sizeFromProps","xSize","ySize","transparent","opName","STROKE","FILL","strokeColor","stroke","fillStyle","strokeStyle","translate","rotate","degreesToRadians","getTotalAngle","render","cornerStyle","renderCircleControl","call","renderSquareControl"],"mappings":"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"}

package/dist/src/controls/Control.mjs

@@ -117,6 +117,14 @@ class Control {
     _defineProperty(this, "withConnection", false);
     Object.assign(this, options);
   }
+  getTransformAnchorPoint() {
+    var _this$transformAnchor;
+    return (// return the control transformAnchorPoint
+      (_this$transformAnchor = this.transformAnchorPoint) !== null && _this$transformAnchor !== void 0 ? _this$transformAnchor :
+      // otherwise will return the opposite origin of where the control is located.
+      new Point(-this.x + 0.5, -this.y + 0.5)
+    );
+  }
 
   /**
    * The control actionHandler, provide one to handle action ( control being moved )

package/dist/src/controls/Control.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Control.mjs","sources":["../../../src/controls/Control.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\nimport type {\n  ControlActionHandler,\n  TPointerEvent,\n  TransformActionHandler,\n} from '../EventTypeDefs';\nimport { Intersection } from '../Intersection';\nimport { Point } from '../Point';\nimport { FILL, SCALE, STROKE } from '../constants';\nimport type {\n  InteractiveFabricObject,\n  TOCoord,\n} from '../shapes/Object/InteractiveObject';\nimport type { TCornerPoint, TDegree, TMat2D } from '../typedefs';\nimport {\n  createRotateMatrix,\n  createScaleMatrix,\n  createTranslateMatrix,\n  multiplyTransformMatrixArray,\n} from '../util/misc/matrix';\nimport { degreesToRadians } from '../util/misc/radiansDegreesConversion';\nimport type { ControlRenderingStyleOverride } from './controlRendering';\nimport { renderCircleControl, renderSquareControl } from './controlRendering';\n\nexport class Control {\n  /**\n   * keep track of control visibility.\n   * mainly for backward compatibility.\n   * if you do not want to see a control, you can remove it\n   * from the control set.\n   * @type {Boolean}\n   * @default true\n   */\n  visible = true;\n\n  /**\n   * Name of the action that the control will likely execute.\n   * This is optional. FabricJS uses to identify what the user is doing for some\n   * extra optimizations. If you are writing a custom control and you want to know\n   * somewhere else in the code what is going on, you can use this string here.\n   * you can also provide a custom getActionName if your control run multiple actions\n   * depending on some external state.\n   * default to scale since is the most common, used on 4 corners by default\n   * @type {String}\n   * @default 'scale'\n   */\n  actionName = SCALE;\n\n  /**\n   * Drawing angle of the control.\n   * NOT used for now, but name marked as needed for internal logic\n   * example: to reuse the same drawing function for different rotated controls\n   * @type {Number}\n   * @default 0\n   */\n  angle = 0;\n\n  /**\n   * Relative position of the control. X\n   * 0,0 is the center of the Object, while -0.5 (left) or 0.5 (right) are the extremities\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  x = 0;\n\n  /**\n   * Relative position of the control. Y\n   * 0,0 is the center of the Object, while -0.5 (top) or 0.5 (bottom) are the extremities\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  y = 0;\n\n  /**\n   * Horizontal offset of the control from the defined position. In pixels\n   * Positive offset moves the control to the right, negative to the left.\n   * It used when you want to have position of control that does not scale with\n   * the bounding box. Example: rotation control is placed at x:0, y: 0.5 on\n   * the boundind box, with an offset of 30 pixels vertically. Those 30 pixels will\n   * stay 30 pixels no matter how the object is big. Another example is having 2\n   * controls in the corner, that stay in the same position when the object scale.\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  offsetX = 0;\n\n  /**\n   * Vertical offset of the control from the defined position. In pixels\n   * Positive offset moves the control to the bottom, negative to the top.\n   * @type {Number}\n   * @default 0\n   */\n  offsetY = 0;\n\n  /**\n   * Sets the length of the control. If null, defaults to object's cornerSize.\n   * Expects both sizeX and sizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  sizeX = 0;\n\n  /**\n   * Sets the height of the control. If null, defaults to object's cornerSize.\n   * Expects both sizeX and sizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  sizeY = 0;\n\n  /**\n   * Sets the length of the touch area of the control. If null, defaults to object's touchCornerSize.\n   * Expects both touchSizeX and touchSizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  touchSizeX = 0;\n\n  /**\n   * Sets the height of the touch area of the control. If null, defaults to object's touchCornerSize.\n   * Expects both touchSizeX and touchSizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  touchSizeY = 0;\n\n  /**\n   * Css cursor style to display when the control is hovered.\n   * if the method `cursorStyleHandler` is provided, this property is ignored.\n   * @type {String}\n   * @default 'crosshair'\n   */\n  cursorStyle = 'crosshair';\n\n  /**\n   * If controls has an offsetY or offsetX, draw a line that connects\n   * the control to the bounding box\n   * @type {Boolean}\n   * @default false\n   */\n  withConnection = false;\n\n  constructor(options?: Partial<Control>) {\n    Object.assign(this, options);\n  }\n\n  /**\n   * The control actionHandler, provide one to handle action ( control being moved )\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare actionHandler: TransformActionHandler;\n\n  /**\n   * The control handler for mouse down, provide one to handle mouse down on control\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare mouseDownHandler?: ControlActionHandler;\n\n  /**\n   * The control mouseUpHandler, provide one to handle an effect on mouse up.\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare mouseUpHandler?: ControlActionHandler;\n\n  shouldActivate(\n    controlKey: string,\n    fabricObject: InteractiveFabricObject,\n    pointer: Point,\n    { tl, tr, br, bl }: TCornerPoint,\n  ) {\n    // TODO: locking logic can be handled here instead of in the control handler logic\n    return (\n      fabricObject.canvas?.getActiveObject() === fabricObject &&\n      fabricObject.isControlVisible(controlKey) &&\n      Intersection.isPointInPolygon(pointer, [tl, tr, br, bl])\n    );\n  }\n\n  /**\n   * Returns control actionHandler\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getActionHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): TransformActionHandler | undefined {\n    return this.actionHandler;\n  }\n\n  /**\n   * Returns control mouseDown handler\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getMouseDownHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): ControlActionHandler | undefined {\n    return this.mouseDownHandler;\n  }\n\n  /**\n   * Returns control mouseUp handler.\n   * During actions the fabricObject or the control can be of different obj\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getMouseUpHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): ControlActionHandler | undefined {\n    return this.mouseUpHandler;\n  }\n\n  /**\n   * Returns control cursorStyle for css using cursorStyle. If you need a more elaborate\n   * function you can pass one in the constructor\n   * the cursorStyle property\n   * @param {Event} eventData the native mouse event\n   * @param {Control} control the current control ( likely this)\n   * @param {FabricObject} object on which the control is displayed\n   * @return {String}\n   */\n  cursorStyleHandler(\n    eventData: TPointerEvent,\n    control: Control,\n    fabricObject: InteractiveFabricObject,\n    coord: TOCoord,\n  ) {\n    return control.cursorStyle;\n  }\n\n  /**\n   * Returns the action name. The basic implementation just return the actionName property.\n   * @param {Event} eventData the native mouse event\n   * @param {Control} control the current control ( likely this)\n   * @param {FabricObject} object on which the control is displayed\n   * @return {String}\n   */\n  getActionName(\n    eventData: TPointerEvent,\n    control: Control,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    return control.actionName;\n  }\n\n  /**\n   * Returns controls visibility\n   * @param {FabricObject} object on which the control is displayed\n   * @param {String} controlKey key where the control is memorized on the\n   * @return {Boolean}\n   */\n  getVisibility(fabricObject: InteractiveFabricObject, controlKey: string) {\n    return fabricObject._controlsVisibility?.[controlKey] ?? this.visible;\n  }\n\n  /**\n   * Sets controls visibility\n   * @param {Boolean} visibility for the object\n   * @return {Void}\n   */\n  setVisibility(\n    visibility: boolean,\n    name?: string,\n    fabricObject?: InteractiveFabricObject,\n  ) {\n    this.visible = visibility;\n  }\n\n  positionHandler(\n    dim: Point,\n    finalMatrix: TMat2D,\n    fabricObject: InteractiveFabricObject,\n    currentControl: Control,\n  ) {\n    return new Point(\n      this.x * dim.x + this.offsetX,\n      this.y * dim.y + this.offsetY,\n    ).transform(finalMatrix);\n  }\n\n  /**\n   * Returns the coords for this control based on object values.\n   * @param {Number} objectAngle angle from the fabric object holding the control\n   * @param {Number} objectCornerSize cornerSize from the fabric object holding the control (or touchCornerSize if\n   *   isTouch is true)\n   * @param {Number} centerX x coordinate where the control center should be\n   * @param {Number} centerY y coordinate where the control center should be\n   * @param {boolean} isTouch true if touch corner, false if normal corner\n   */\n  calcCornerCoords(\n    angle: TDegree,\n    objectCornerSize: number,\n    centerX: number,\n    centerY: number,\n    isTouch: boolean,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    const t = multiplyTransformMatrixArray([\n      createTranslateMatrix(centerX, centerY),\n      createRotateMatrix({ angle }),\n      createScaleMatrix(\n        (isTouch ? this.touchSizeX : this.sizeX) || objectCornerSize,\n        (isTouch ? this.touchSizeY : this.sizeY) || objectCornerSize,\n      ),\n    ]);\n    return {\n      tl: new Point(-0.5, -0.5).transform(t),\n      tr: new Point(0.5, -0.5).transform(t),\n      br: new Point(0.5, 0.5).transform(t),\n      bl: new Point(-0.5, 0.5).transform(t),\n    };\n  }\n\n  /**\n   * This is an helper method to prepare the canvas to render a control\n   * It detectes common control properties and sets the correct fill and\n   * stroke styles on the context. It does not execute translations or\n   * rotations since different controls need differnt combination of these.\n   */\n  commonRenderProps(\n    ctx: CanvasRenderingContext2D,\n    left: number,\n    top: number,\n    fabricObject: InteractiveFabricObject,\n    styleOverride: ControlRenderingStyleOverride = {},\n  ): {\n    stroke: boolean;\n    xSize: number;\n    ySize: number;\n    transparentCorners: boolean;\n    opName: 'stroke' | 'fill';\n  } {\n    const { cornerSize, cornerColor, transparentCorners, cornerStrokeColor } =\n        styleOverride,\n      sizeFromProps = cornerSize || fabricObject.cornerSize,\n      xSize = this.sizeX || sizeFromProps,\n      ySize = this.sizeY || sizeFromProps,\n      transparent =\n        typeof transparentCorners !== 'undefined'\n          ? transparentCorners\n          : fabricObject.transparentCorners,\n      opName = transparent ? STROKE : FILL,\n      strokeColor = cornerStrokeColor || fabricObject.cornerStrokeColor,\n      stroke = !transparent && !!strokeColor;\n    ctx.fillStyle = cornerColor || fabricObject.cornerColor || '';\n    ctx.strokeStyle = strokeColor || '';\n    ctx.translate(left, top);\n    //  angle is relative to canvas plane\n    ctx.rotate(degreesToRadians(fabricObject.getTotalAngle()));\n    return {\n      stroke,\n      xSize,\n      ySize,\n      transparentCorners: transparent,\n      opName,\n    };\n  }\n\n  /**\n   * Render function for the control.\n   * When this function runs the context is unscaled. unrotate. Just retina scaled.\n   * all the functions will have to translate to the point left,top before starting Drawing\n   * if they want to draw a control where the position is detected.\n   * left and top are the result of the positionHandler function\n   * @param {RenderingContext2D} ctx the context where the control will be drawn\n   * @param {Number} left position of the canvas where we are about to render the control.\n   * @param {Number} top position of the canvas where we are about to render the control.\n   * @param {Object} styleOverride\n   * @param {FabricObject} fabricObject the object where the control is about to be rendered\n   */\n  render(\n    ctx: CanvasRenderingContext2D,\n    left: number,\n    top: number,\n    styleOverride: ControlRenderingStyleOverride | undefined,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    styleOverride = styleOverride || {};\n    switch (styleOverride.cornerStyle || fabricObject.cornerStyle) {\n      case 'circle':\n        renderCircleControl.call(\n          this,\n          ctx,\n          left,\n          top,\n          styleOverride,\n          fabricObject,\n        );\n        break;\n      default:\n        renderSquareControl.call(\n          this,\n          ctx,\n          left,\n          top,\n          styleOverride,\n          fabricObject,\n        );\n    }\n  }\n}\n"],"names":["Control","constructor","options","_defineProperty","SCALE","Object","assign","shouldActivate","controlKey","fabricObject","pointer","_ref","_fabricObject$canvas","tl","tr","br","bl","canvas","getActiveObject","isControlVisible","Intersection","isPointInPolygon","getActionHandler","eventData","control","actionHandler","getMouseDownHandler","mouseDownHandler","getMouseUpHandler","mouseUpHandler","cursorStyleHandler","coord","cursorStyle","getActionName","actionName","getVisibility","_fabricObject$_contro","_fabricObject$_contro2","_controlsVisibility","visible","setVisibility","visibility","name","positionHandler","dim","finalMatrix","currentControl","Point","x","offsetX","y","offsetY","transform","calcCornerCoords","angle","objectCornerSize","centerX","centerY","isTouch","t","multiplyTransformMatrixArray","createTranslateMatrix","createRotateMatrix","createScaleMatrix","touchSizeX","sizeX","touchSizeY","sizeY","commonRenderProps","ctx","left","top","styleOverride","arguments","length","undefined","cornerSize","cornerColor","transparentCorners","cornerStrokeColor","sizeFromProps","xSize","ySize","transparent","opName","STROKE","FILL","strokeColor","stroke","fillStyle","strokeStyle","translate","rotate","degreesToRadians","getTotalAngle","render","cornerStyle","renderCircleControl","call","renderSquareControl"],"mappings":";;;;;;;;AAwBO,MAAMA,OAAO,CAAC;EAyHnBC,WAAWA,CAACC,OAA0B,EAAE;AAxHxC;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AAPEC,IAAAA,eAAA,kBAQU,IAAI,CAAA;AAEd;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVEA,IAAAA,eAAA,qBAWaC,KAAK,CAAA;AAElB;AACF;AACA;AACA;AACA;AACA;AACA;AANED,IAAAA,eAAA,gBAOQ,CAAC,CAAA;AAET;AACF;AACA;AACA;AACA;AACA;AACA;AANEA,IAAAA,eAAA,YAOI,CAAC,CAAA;AAEL;AACF;AACA;AACA;AACA;AACA;AACA;AANEA,IAAAA,eAAA,YAOI,CAAC,CAAA;AAEL;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAXEA,IAAAA,eAAA,kBAYU,CAAC,CAAA;AAEX;AACF;AACA;AACA;AACA;AACA;AALEA,IAAAA,eAAA,kBAMU,CAAC,CAAA;AAEX;AACF;AACA;AACA;AACA;AACA;AALEA,IAAAA,eAAA,gBAMQ,CAAC,CAAA;AAET;AACF;AACA;AACA;AACA;AACA;AALEA,IAAAA,eAAA,gBAMQ,CAAC,CAAA;AAET;AACF;AACA;AACA;AACA;AACA;AALEA,IAAAA,eAAA,qBAMa,CAAC,CAAA;AAEd;AACF;AACA;AACA;AACA;AACA;AALEA,IAAAA,eAAA,qBAMa,CAAC,CAAA;AAEd;AACF;AACA;AACA;AACA;AACA;AALEA,IAAAA,eAAA,sBAMc,WAAW,CAAA;AAEzB;AACF;AACA;AACA;AACA;AACA;AALEA,IAAAA,eAAA,yBAMiB,KAAK,CAAA;AAGpBE,IAAAA,MAAM,CAACC,MAAM,CAAC,IAAI,EAAEJ,OAAO,CAAC;AAC9B,EAAA;;AAEA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;;AAGE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;;AAGE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;;EAGEK,cAAcA,CACZC,UAAkB,EAClBC,YAAqC,EACrCC,OA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"}
+{"version":3,"file":"Control.mjs","sources":["../../../src/controls/Control.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unused-vars */\nimport type {\n  ControlActionHandler,\n  TPointerEvent,\n  TransformActionHandler,\n} from '../EventTypeDefs';\nimport { Intersection } from '../Intersection';\nimport { Point } from '../Point';\nimport { FILL, SCALE, STROKE } from '../constants';\nimport type {\n  InteractiveFabricObject,\n  TOCoord,\n} from '../shapes/Object/InteractiveObject';\nimport type {\n  TCornerPoint,\n  TDegree,\n  TMat2D,\n  TOriginX,\n  TOriginY,\n} from '../typedefs';\nimport {\n  createRotateMatrix,\n  createScaleMatrix,\n  createTranslateMatrix,\n  multiplyTransformMatrixArray,\n} from '../util/misc/matrix';\nimport { degreesToRadians } from '../util/misc/radiansDegreesConversion';\nimport type { ControlRenderingStyleOverride } from './controlRendering';\nimport { renderCircleControl, renderSquareControl } from './controlRendering';\n\nexport class Control {\n  /**\n   * keep track of control visibility.\n   * mainly for backward compatibility.\n   * if you do not want to see a control, you can remove it\n   * from the control set.\n   * @type {Boolean}\n   * @default true\n   */\n  visible = true;\n\n  /**\n   * Name of the action that the control will likely execute.\n   * This is optional. FabricJS uses to identify what the user is doing for some\n   * extra optimizations. If you are writing a custom control and you want to know\n   * somewhere else in the code what is going on, you can use this string here.\n   * you can also provide a custom getActionName if your control run multiple actions\n   * depending on some external state.\n   * default to scale since is the most common, used on 4 corners by default\n   * @type {String}\n   * @default 'scale'\n   */\n  actionName = SCALE;\n\n  /**\n   * Drawing angle of the control.\n   * NOT used for now, but name marked as needed for internal logic\n   * example: to reuse the same drawing function for different rotated controls\n   * @type {Number}\n   * @default 0\n   */\n  angle = 0;\n\n  /**\n   * Relative position of the control. X\n   * 0,0 is the center of the Object, while -0.5 (left) or 0.5 (right) are the extremities\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  x = 0;\n\n  /**\n   * Relative position of the control. Y\n   * 0,0 is the center of the Object, while -0.5 (top) or 0.5 (bottom) are the extremities\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  y = 0;\n\n  /**\n   * Horizontal offset of the control from the defined position. In pixels\n   * Positive offset moves the control to the right, negative to the left.\n   * It used when you want to have position of control that does not scale with\n   * the bounding box. Example: rotation control is placed at x:0, y: 0.5 on\n   * the boundind box, with an offset of 30 pixels vertically. Those 30 pixels will\n   * stay 30 pixels no matter how the object is big. Another example is having 2\n   * controls in the corner, that stay in the same position when the object scale.\n   * of the bounding box.\n   * @type {Number}\n   * @default 0\n   */\n  offsetX = 0;\n\n  /**\n   * Vertical offset of the control from the defined position. In pixels\n   * Positive offset moves the control to the bottom, negative to the top.\n   * @type {Number}\n   * @default 0\n   */\n  offsetY = 0;\n\n  /**\n   * Sets the length of the control. If null, defaults to object's cornerSize.\n   * Expects both sizeX and sizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  sizeX = 0;\n\n  /**\n   * Sets the height of the control. If null, defaults to object's cornerSize.\n   * Expects both sizeX and sizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  sizeY = 0;\n\n  /**\n   * Sets the length of the touch area of the control. If null, defaults to object's touchCornerSize.\n   * Expects both touchSizeX and touchSizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  touchSizeX = 0;\n\n  /**\n   * Sets the height of the touch area of the control. If null, defaults to object's touchCornerSize.\n   * Expects both touchSizeX and touchSizeY to be set when set.\n   * @type {?Number}\n   * @default null\n   */\n  touchSizeY = 0;\n\n  /**\n   * Css cursor style to display when the control is hovered.\n   * if the method `cursorStyleHandler` is provided, this property is ignored.\n   * @type {String}\n   * @default 'crosshair'\n   */\n  cursorStyle = 'crosshair';\n\n  /**\n   * If controls has an offsetY or offsetX, draw a line that connects\n   * the control to the bounding box\n   * @type {Boolean}\n   * @default false\n   */\n  withConnection = false;\n\n  declare transformAnchorPoint?: {\n    x: TOriginX;\n    y: TOriginY;\n  };\n\n  constructor(options?: Partial<Control>) {\n    Object.assign(this, options);\n  }\n\n  getTransformAnchorPoint(): {\n    x: TOriginX;\n    y: TOriginY;\n  } {\n    return (\n      // return the control transformAnchorPoint\n      this.transformAnchorPoint ??\n      // otherwise will return the opposite origin of where the control is located.\n      new Point(-this.x + 0.5, -this.y + 0.5)\n    );\n  }\n\n  /**\n   * The control actionHandler, provide one to handle action ( control being moved )\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare actionHandler: TransformActionHandler;\n\n  /**\n   * The control handler for mouse down, provide one to handle mouse down on control\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare mouseDownHandler?: ControlActionHandler;\n\n  /**\n   * The control mouseUpHandler, provide one to handle an effect on mouse up.\n   * @param {Event} eventData the native mouse event\n   * @param {Transform} transformData properties of the current transform\n   * @param {Number} x x position of the cursor\n   * @param {Number} y y position of the cursor\n   * @return {Boolean} true if the action/event modified the object\n   */\n  declare mouseUpHandler?: ControlActionHandler;\n\n  shouldActivate(\n    controlKey: string,\n    fabricObject: InteractiveFabricObject,\n    pointer: Point,\n    { tl, tr, br, bl }: TCornerPoint,\n  ) {\n    // TODO: locking logic can be handled here instead of in the control handler logic\n    return (\n      fabricObject.canvas?.getActiveObject() === fabricObject &&\n      fabricObject.isControlVisible(controlKey) &&\n      Intersection.isPointInPolygon(pointer, [tl, tr, br, bl])\n    );\n  }\n\n  /**\n   * Returns control actionHandler\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getActionHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): TransformActionHandler | undefined {\n    return this.actionHandler;\n  }\n\n  /**\n   * Returns control mouseDown handler\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getMouseDownHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): ControlActionHandler | undefined {\n    return this.mouseDownHandler;\n  }\n\n  /**\n   * Returns control mouseUp handler.\n   * During actions the fabricObject or the control can be of different obj\n   * @param {Event} eventData the native mouse event\n   * @param {FabricObject} fabricObject on which the control is displayed\n   * @param {Control} control control for which the action handler is being asked\n   * @return {Function} the action handler\n   */\n  getMouseUpHandler(\n    eventData: TPointerEvent,\n    fabricObject: InteractiveFabricObject,\n    control: Control,\n  ): ControlActionHandler | undefined {\n    return this.mouseUpHandler;\n  }\n\n  /**\n   * Returns control cursorStyle for css using cursorStyle. If you need a more elaborate\n   * function you can pass one in the constructor\n   * the cursorStyle property\n   * @param {Event} eventData the native mouse event\n   * @param {Control} control the current control ( likely this)\n   * @param {FabricObject} object on which the control is displayed\n   * @return {String}\n   */\n  cursorStyleHandler(\n    eventData: TPointerEvent,\n    control: Control,\n    fabricObject: InteractiveFabricObject,\n    coord: TOCoord,\n  ) {\n    return control.cursorStyle;\n  }\n\n  /**\n   * Returns the action name. The basic implementation just return the actionName property.\n   * @param {Event} eventData the native mouse event\n   * @param {Control} control the current control ( likely this)\n   * @param {FabricObject} object on which the control is displayed\n   * @return {String}\n   */\n  getActionName(\n    eventData: TPointerEvent,\n    control: Control,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    return control.actionName;\n  }\n\n  /**\n   * Returns controls visibility\n   * @param {FabricObject} object on which the control is displayed\n   * @param {String} controlKey key where the control is memorized on the\n   * @return {Boolean}\n   */\n  getVisibility(fabricObject: InteractiveFabricObject, controlKey: string) {\n    return fabricObject._controlsVisibility?.[controlKey] ?? this.visible;\n  }\n\n  /**\n   * Sets controls visibility\n   * @param {Boolean} visibility for the object\n   * @return {Void}\n   */\n  setVisibility(\n    visibility: boolean,\n    name?: string,\n    fabricObject?: InteractiveFabricObject,\n  ) {\n    this.visible = visibility;\n  }\n\n  positionHandler(\n    dim: Point,\n    finalMatrix: TMat2D,\n    fabricObject: InteractiveFabricObject,\n    currentControl: Control,\n  ) {\n    return new Point(\n      this.x * dim.x + this.offsetX,\n      this.y * dim.y + this.offsetY,\n    ).transform(finalMatrix);\n  }\n\n  /**\n   * Returns the coords for this control based on object values.\n   * @param {Number} objectAngle angle from the fabric object holding the control\n   * @param {Number} objectCornerSize cornerSize from the fabric object holding the control (or touchCornerSize if\n   *   isTouch is true)\n   * @param {Number} centerX x coordinate where the control center should be\n   * @param {Number} centerY y coordinate where the control center should be\n   * @param {boolean} isTouch true if touch corner, false if normal corner\n   */\n  calcCornerCoords(\n    angle: TDegree,\n    objectCornerSize: number,\n    centerX: number,\n    centerY: number,\n    isTouch: boolean,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    const t = multiplyTransformMatrixArray([\n      createTranslateMatrix(centerX, centerY),\n      createRotateMatrix({ angle }),\n      createScaleMatrix(\n        (isTouch ? this.touchSizeX : this.sizeX) || objectCornerSize,\n        (isTouch ? this.touchSizeY : this.sizeY) || objectCornerSize,\n      ),\n    ]);\n    return {\n      tl: new Point(-0.5, -0.5).transform(t),\n      tr: new Point(0.5, -0.5).transform(t),\n      br: new Point(0.5, 0.5).transform(t),\n      bl: new Point(-0.5, 0.5).transform(t),\n    };\n  }\n\n  /**\n   * This is an helper method to prepare the canvas to render a control\n   * It detectes common control properties and sets the correct fill and\n   * stroke styles on the context. It does not execute translations or\n   * rotations since different controls need differnt combination of these.\n   */\n  commonRenderProps(\n    ctx: CanvasRenderingContext2D,\n    left: number,\n    top: number,\n    fabricObject: InteractiveFabricObject,\n    styleOverride: ControlRenderingStyleOverride = {},\n  ): {\n    stroke: boolean;\n    xSize: number;\n    ySize: number;\n    transparentCorners: boolean;\n    opName: 'stroke' | 'fill';\n  } {\n    const { cornerSize, cornerColor, transparentCorners, cornerStrokeColor } =\n        styleOverride,\n      sizeFromProps = cornerSize || fabricObject.cornerSize,\n      xSize = this.sizeX || sizeFromProps,\n      ySize = this.sizeY || sizeFromProps,\n      transparent =\n        typeof transparentCorners !== 'undefined'\n          ? transparentCorners\n          : fabricObject.transparentCorners,\n      opName = transparent ? STROKE : FILL,\n      strokeColor = cornerStrokeColor || fabricObject.cornerStrokeColor,\n      stroke = !transparent && !!strokeColor;\n    ctx.fillStyle = cornerColor || fabricObject.cornerColor || '';\n    ctx.strokeStyle = strokeColor || '';\n    ctx.translate(left, top);\n    //  angle is relative to canvas plane\n    ctx.rotate(degreesToRadians(fabricObject.getTotalAngle()));\n    return {\n      stroke,\n      xSize,\n      ySize,\n      transparentCorners: transparent,\n      opName,\n    };\n  }\n\n  /**\n   * Render function for the control.\n   * When this function runs the context is unscaled. unrotate. Just retina scaled.\n   * all the functions will have to translate to the point left,top before starting Drawing\n   * if they want to draw a control where the position is detected.\n   * left and top are the result of the positionHandler function\n   * @param {RenderingContext2D} ctx the context where the control will be drawn\n   * @param {Number} left position of the canvas where we are about to render the control.\n   * @param {Number} top position of the canvas where we are about to render the control.\n   * @param {Object} styleOverride\n   * @param {FabricObject} fabricObject the object where the control is about to be rendered\n   */\n  render(\n    ctx: CanvasRenderingContext2D,\n    left: number,\n    top: number,\n    styleOverride: ControlRenderingStyleOverride | undefined,\n    fabricObject: InteractiveFabricObject,\n  ) {\n    styleOverride = styleOverride || {};\n    switch (styleOverride.cornerStyle || fabricObject.cornerStyle) {\n      case 'circle':\n        renderCircleControl.call(\n          this,\n          ctx,\n          left,\n          top,\n          styleOverride,\n          fabricObject,\n        );\n        break;\n      default:\n        renderSquareControl.call(\n          this,\n          ctx,\n          left,\n          top,\n          styleOverride,\n          fabricObject,\n        );\n    }\n  }\n}\n"],"names":["Control","constructor","options","_defineProperty","SCALE","Object","assign","getTransformAnchorPoint","_this$transformAnchor","transformAnchorPoint","Point","x","y","shouldActivate","controlKey","fabricObject","pointer","_ref","_fabricObject$canvas","tl","tr","br","bl","canvas","getActiveObject","isControlVisible","Intersection","isPointInPolygon","getActionHandler","eventData","control","actionHandler","getMouseDownHandler","mouseDownHandler","getMouseUpHandler","mouseUpHandler","cursorStyleHandler","coord","cursorStyle","getActionName","actionName","getVisibility","_fabricObject$_contro","_fabricObject$_contro2","_controlsVisibility","visible","setVisibility","visibility","name","positionHandler","dim","finalMatrix","currentControl","offsetX","offsetY","transform","calcCornerCoords","angle","objectCornerSize","centerX","centerY","isTouch","t","multiplyTransformMatrixArray","createTranslateMatrix","createRotateMatrix","createScaleMatrix","touchSizeX","sizeX","touchSizeY","sizeY","commonRenderProps","ctx","left","top","styleOverride","arguments","length","undefined","cornerSize","cornerColor","transparentCorners","cornerStrokeColor","sizeFromProps","xSize","ySize","transparent","opName","STROKE","FILL","strokeColor","stroke","fillStyle","strokeStyle","translate","rotate","degreesToRadians","getTotalAngle","render","cornerStyle","renderCircleControl","call","renderSquareControl"],"mappings":"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"}

package/dist/src/gradient/Gradient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Gradient.d.ts","sourceRoot":"","sources":["../../../src/gradient/Gradient.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAQ1C,OAAO,KAAK,EACV,SAAS,EACT,cAAc,EACd,eAAe,EACf,YAAY,EACZ,aAAa,EACb,UAAU,EACV,uBAAuB,EACxB,MAAM,YAAY,CAAC;AAIpB;;;;GAIG;AACH,qBAAa,QAAQ,CACnB,CAAC,EACD,CAAC,SAAS,YAAY,GAAG,CAAC,SAAS,YAAY,GAAG,CAAC,GAAG,QAAQ;IAE9D;;;;OAIG;IACK,OAAO,EAAE,MAAM,CAAC;IAExB;;;;OAIG;IACK,OAAO,EAAE,MAAM,CAAC;IAExB;;;;;;;OAOG;IACK,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAEnC;;;;;;;;OAQG;IACK,aAAa,EAAE,aAAa,CAAC;IAErC;;;;OAIG;IACK,IAAI,EAAE,CAAC,CAAC;IAEhB;;;OAGG;IACK,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IAElC;;;;OAIG;IACK,UAAU,EAAE,SAAS,EAAE,CAAC;IAEhC;;;OAGG;IACK,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAEpC;;;OAGG;IACH,SAAiB,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IAErC,MAAM,CAAC,IAAI,SAAc;gBAEb,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC;IA0BvC;;;;OAIG;IACH,YAAY,CAAC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;IAU/C;;;;OAIG;IACH,QAAQ,CACN,mBAAmB,CAAC,EAAE,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,GAC5C,uBAAuB,CAAC,CAAC,CAAC;IAgB7B;;;;OAIG;IACH,KAAK,CACH,MAAM,EAAE,YAAY,EACpB,EACE,mBAAmB,EAAE,YAAY,GAClC,GAAE;QAAE,mBAAmB,CAAC,EAAE,MAAM,CAAA;KAAO;IAiH1C;;;;OAIG;IACH,MAAM,CAAC,GAAG,EAAE,wBAAwB,GAAG,cAAc;WAcxC,UAAU,CACrB,OAAO,EAAE,eAAe,CAAC,QAAQ,CAAC,GACjC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;WACjB,UAAU,CACrB,OAAO,EAAE,eAAe,CAAC,QAAQ,CAAC,GACjC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;IAe9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAyCG;IACH,MAAM,CAAC,WAAW,CAChB,EAAE,EAAE,kBAAkB,EACtB,QAAQ,EAAE,YAAY,EACtB,UAAU,EAAE,UAAU,GACrB,QAAQ,CAAC,YAAY,CAAC;CA2B1B"}
+{"version":3,"file":"Gradient.d.ts","sourceRoot":"","sources":["../../../src/gradient/Gradient.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAQ1C,OAAO,KAAK,EACV,SAAS,EACT,cAAc,EACd,eAAe,EACf,YAAY,EACZ,aAAa,EACb,UAAU,EACV,uBAAuB,EACxB,MAAM,YAAY,CAAC;AAKpB;;;;GAIG;AACH,qBAAa,QAAQ,CACnB,CAAC,EACD,CAAC,SAAS,YAAY,GAAG,CAAC,SAAS,YAAY,GAAG,CAAC,GAAG,QAAQ;IAE9D;;;;OAIG;IACK,OAAO,EAAE,MAAM,CAAC;IAExB;;;;OAIG;IACK,OAAO,EAAE,MAAM,CAAC;IAExB;;;;;;;OAOG;IACK,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAEnC;;;;;;;;OAQG;IACK,aAAa,EAAE,aAAa,CAAC;IAErC;;;;OAIG;IACK,IAAI,EAAE,CAAC,CAAC;IAEhB;;;OAGG;IACK,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IAElC;;;;OAIG;IACK,UAAU,EAAE,SAAS,EAAE,CAAC;IAEhC;;;OAGG;IACK,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAEpC;;;OAGG;IACH,SAAiB,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IAErC,MAAM,CAAC,IAAI,SAAc;gBAEb,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC;IA0BvC;;;;OAIG;IACH,YAAY,CAAC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;IAU/C;;;;OAIG;IACH,QAAQ,CACN,mBAAmB,CAAC,EAAE,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,GAC5C,uBAAuB,CAAC,CAAC,CAAC;IAgB7B;;;;OAIG;IACH,KAAK,CACH,MAAM,EAAE,YAAY,EACpB,EACE,mBAAmB,EAAE,YAAY,GAClC,GAAE;QAAE,mBAAmB,CAAC,EAAE,MAAM,CAAA;KAAO;IA6H1C;;;;OAIG;IACH,MAAM,CAAC,GAAG,EAAE,wBAAwB,GAAG,cAAc;WAcxC,UAAU,CACrB,OAAO,EAAE,eAAe,CAAC,QAAQ,CAAC,GACjC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;WACjB,UAAU,CACrB,OAAO,EAAE,eAAe,CAAC,QAAQ,CAAC,GACjC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;IAe9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAyCG;IACH,MAAM,CAAC,WAAW,CAChB,EAAE,EAAE,kBAAkB,EACtB,QAAQ,EAAE,YAAY,EACtB,UAAU,EAAE,UAAU,GACrB,QAAQ,CAAC,YAAY,CAAC;CA2B1B"}

package/dist/src/gradient/Gradient.min.mjs

@@ -1,2 +1,2 @@
-import{defineProperty as t}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{iMatrix as o}from"../constants.min.mjs";import{parseTransformAttribute as r}from"../parser/parseTransformAttribute.min.mjs";import{uid as s}from"../util/internals/uid.min.mjs";import{pick as i}from"../util/misc/pick.min.mjs";import{matrixToSVG as e}from"../util/misc/svgExport.min.mjs";import{radialDefaultCoords as n,linearDefaultCoords as a}from"./constants.min.mjs";import{parseColorStops as f}from"./parser/parseColorStops.min.mjs";import{parseCoords as m}from"./parser/parseCoords.min.mjs";import{parseGradientUnits as d,parseType as p}from"./parser/misc.min.mjs";import{classRegistry as c}from"../ClassRegistry.min.mjs";import{isPath as h}from"../util/typeAssertions.min.mjs";class l{constructor(t){const{type:o="linear",gradientUnits:r="pixels",coords:i={},colorStops:e=[],offsetX:f=0,offsetY:m=0,gradientTransform:d,id:p}=t||{};Object.assign(this,{type:o,gradientUnits:r,coords:{..."radial"===o?n:a,...i},colorStops:e,offsetX:f,offsetY:m,gradientTransform:d,id:p?`${p}_${s()}`:s()})}addColorStop(t){for(const o in t)this.colorStops.push({offset:parseFloat(o),color:t[o]});return this}toObject(t){return{...i(this,t),type:this.type,coords:{...this.coords},colorStops:this.colorStops.map(t=>({...t})),offsetX:this.offsetX,offsetY:this.offsetY,gradientUnits:this.gradientUnits,gradientTransform:this.gradientTransform?[...this.gradientTransform]:void 0}}toSVG(t){let{additionalTransform:r}=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};const s=[],i=this.gradientTransform?this.gradientTransform.concat():o.concat(),n="pixels"===this.gradientUnits?"userSpaceOnUse":"objectBoundingBox",a=this.colorStops.map(t=>({...t})).sort((t,o)=>t.offset-o.offset);let f=-this.offsetX,m=-this.offsetY;"objectBoundingBox"===n?(f/=t.width,m/=t.height):(f+=t.width/2,m+=t.height/2),h(t)&&"percentage"!==this.gradientUnits&&(f-=t.pathOffset.x,m-=t.pathOffset.y),i[4]-=f,i[5]-=m;const d=[`id="SVGID_${this.id}"`,`gradientUnits="${n}"`,`gradientTransform="${r?r+" ":""}${e(i)}"`,""].join(" ");if("linear"===this.type){const{x1:t,y1:o,x2:r,y2:i}=this.coords;s.push("<linearGradient ",d,' x1="',t,'" y1="',o,'" x2="',r,'" y2="',i,'">\n')}else if("radial"===this.type){const{x1:t,y1:o,x2:r,y2:i,r1:e,r2:n}=this.coords,f=e>n;s.push("<radialGradient ",d,' cx="',f?t:r,'" cy="',f?o:i,'" r="',f?e:n,'" fx="',f?r:t,'" fy="',f?i:o,'">\n'),f&&(a.reverse(),a.forEach(t=>{t.offset=1-t.offset}));const m=Math.min(e,n);if(m>0){const t=m/Math.max(e,n);a.forEach(o=>{o.offset+=t*(1-o.offset)})}}return a.forEach(t=>{let{color:o,offset:r}=t;s.push(`<stop offset="${100*r}%" style="stop-color:${o};"/>\n`)}),s.push("linear"===this.type?"</linearGradient>":"</radialGradient>","\n"),s.join("")}toLive(t){const{x1:o,y1:r,x2:s,y2:i,r1:e,r2:n}=this.coords,a="linear"===this.type?t.createLinearGradient(o,r,s,i):t.createRadialGradient(o,r,e,s,i,n);return this.colorStops.forEach(t=>{let{color:o,offset:r}=t;a.addColorStop(r,o)}),a}static async fromObject(t){const{colorStops:o,gradientTransform:r}=t;return new this({...t,colorStops:o?o.map(t=>({...t})):void 0,gradientTransform:r?[...r]:void 0})}static fromElement(t,o,s){const i=d(t),e=o._findCenterFromElement();return new this({id:t.getAttribute("id")||void 0,type:p(t),coords:m(t,{width:s.viewBoxWidth||s.width,height:s.viewBoxHeight||s.height}),colorStops:f(t,s.opacity),gradientUnits:i,gradientTransform:r(t.getAttribute("gradientTransform")||""),..."pixels"===i?{offsetX:o.width/2-e.x,offsetY:o.height/2-e.y}:{offsetX:0,offsetY:0}})}}t(l,"type","Gradient"),c.setClass(l,"gradient"),c.setClass(l,"linear"),c.setClass(l,"radial");export{l as Gradient};
+import{defineProperty as t}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{iMatrix as r}from"../constants.min.mjs";import{parseTransformAttribute as o}from"../parser/parseTransformAttribute.min.mjs";import{uid as s}from"../util/internals/uid.min.mjs";import{pick as i}from"../util/misc/pick.min.mjs";import{matrixToSVG as e}from"../util/misc/svgExport.min.mjs";import{radialDefaultCoords as n,linearDefaultCoords as a}from"./constants.min.mjs";import{parseColorStops as f}from"./parser/parseColorStops.min.mjs";import{parseCoords as m}from"./parser/parseCoords.min.mjs";import{parseGradientUnits as d,parseType as p}from"./parser/misc.min.mjs";import{classRegistry as c}from"../ClassRegistry.min.mjs";import{isPath as l}from"../util/typeAssertions.min.mjs";import{escapeXml as h}from"../util/lang_string.min.mjs";class g{constructor(t){const{type:r="linear",gradientUnits:o="pixels",coords:i={},colorStops:e=[],offsetX:f=0,offsetY:m=0,gradientTransform:d,id:p}=t||{};Object.assign(this,{type:r,gradientUnits:o,coords:{..."radial"===r?n:a,...i},colorStops:e,offsetX:f,offsetY:m,gradientTransform:d,id:p?`${p}_${s()}`:s()})}addColorStop(t){for(const r in t)this.colorStops.push({offset:parseFloat(r),color:t[r]});return this}toObject(t){return{...i(this,t),type:this.type,coords:{...this.coords},colorStops:this.colorStops.map(t=>({...t})),offsetX:this.offsetX,offsetY:this.offsetY,gradientUnits:this.gradientUnits,gradientTransform:this.gradientTransform?[...this.gradientTransform]:void 0}}toSVG(t){let{additionalTransform:o}=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};const s=[],i=this.gradientTransform?this.gradientTransform.concat():r.concat(),n="pixels"===this.gradientUnits?"userSpaceOnUse":"objectBoundingBox",a=this.colorStops.map(t=>({...t})).sort((t,r)=>t.offset-r.offset);let f=-this.offsetX,m=-this.offsetY;"objectBoundingBox"===n?(f/=t.width,m/=t.height):(f+=t.width/2,m+=t.height/2),l(t)&&"percentage"!==this.gradientUnits&&(f-=t.pathOffset.x,m-=t.pathOffset.y),i[4]-=f,i[5]-=m;const d=[`id="SVGID_${h(String(this.id))}"`,`gradientUnits="${n}"`,`gradientTransform="${o?o+" ":""}${e(i)}"`,""].join(" "),p=t=>parseFloat(String(t));if("linear"===this.type){const{x1:t,y1:r,x2:o,y2:i}=this.coords,e=p(t),n=p(r),a=p(o),f=p(i);s.push("<linearGradient ",d,' x1="',e,'" y1="',n,'" x2="',a,'" y2="',f,'">\n')}else if("radial"===this.type){const{x1:t,y1:r,x2:o,y2:i,r1:e,r2:n}=this.coords,f=p(t),m=p(r),c=p(o),l=p(i),h=p(e),g=p(n),y=h>g;s.push("<radialGradient ",d,' cx="',y?f:c,'" cy="',y?m:l,'" r="',y?h:g,'" fx="',y?c:f,'" fy="',y?l:m,'">\n'),y&&(a.reverse(),a.forEach(t=>{t.offset=1-t.offset}));const u=Math.min(h,g);if(u>0){const t=u/Math.max(h,g);a.forEach(r=>{r.offset+=t*(1-r.offset)})}}return a.forEach(t=>{let{color:r,offset:o}=t;s.push(`<stop offset="${100*o}%" style="stop-color:${r};"/>\n`)}),s.push("linear"===this.type?"</linearGradient>":"</radialGradient>","\n"),s.join("")}toLive(t){const{x1:r,y1:o,x2:s,y2:i,r1:e,r2:n}=this.coords,a="linear"===this.type?t.createLinearGradient(r,o,s,i):t.createRadialGradient(r,o,e,s,i,n);return this.colorStops.forEach(t=>{let{color:r,offset:o}=t;a.addColorStop(o,r)}),a}static async fromObject(t){const{colorStops:r,gradientTransform:o}=t;return new this({...t,colorStops:r?r.map(t=>({...t})):void 0,gradientTransform:o?[...o]:void 0})}static fromElement(t,r,s){const i=d(t),e=r._findCenterFromElement();return new this({id:t.getAttribute("id")||void 0,type:p(t),coords:m(t,{width:s.viewBoxWidth||s.width,height:s.viewBoxHeight||s.height}),colorStops:f(t,s.opacity),gradientUnits:i,gradientTransform:o(t.getAttribute("gradientTransform")||""),..."pixels"===i?{offsetX:r.width/2-e.x,offsetY:r.height/2-e.y}:{offsetX:0,offsetY:0}})}}t(g,"type","Gradient"),c.setClass(g,"gradient"),c.setClass(g,"linear"),c.setClass(g,"radial");export{g as Gradient};
 //# sourceMappingURL=Gradient.min.mjs.map

package/dist/src/gradient/Gradient.min.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Gradient.min.mjs","sources":["../../../src/gradient/Gradient.ts"],"sourcesContent":["import { iMatrix } from '../constants';\nimport { parseTransformAttribute } from '../parser/parseTransformAttribute';\nimport type { FabricObject } from '../shapes/Object/FabricObject';\nimport type { TMat2D } from '../typedefs';\nimport { uid } from '../util/internals/uid';\nimport { pick } from '../util/misc/pick';\nimport { matrixToSVG } from '../util/misc/svgExport';\nimport { linearDefaultCoords, radialDefaultCoords } from './constants';\nimport { parseColorStops } from './parser/parseColorStops';\nimport { parseCoords } from './parser/parseCoords';\nimport { parseType, parseGradientUnits } from './parser/misc';\nimport type {\n  ColorStop,\n  GradientCoords,\n  GradientOptions,\n  GradientType,\n  GradientUnits,\n  SVGOptions,\n  SerializedGradientProps,\n} from './typedefs';\nimport { classRegistry } from '../ClassRegistry';\nimport { isPath } from '../util/typeAssertions';\n\n/**\n * Gradient class\n * @class Gradient\n * @see {@link http://fabric5.fabricjs.com/fabric-intro-part-2#gradients}\n */\nexport class Gradient<\n  S,\n  T extends GradientType = S extends GradientType ? S : 'linear',\n> {\n  /**\n   * Horizontal offset for aligning gradients coming from SVG when outside pathgroups\n   * @type Number\n   * @default 0\n   */\n  declare offsetX: number;\n\n  /**\n   * Vertical offset for aligning gradients coming from SVG when outside pathgroups\n   * @type Number\n   * @default 0\n   */\n  declare offsetY: number;\n\n  /**\n   * A transform matrix to apply to the gradient before painting.\n   * Imported from svg gradients, is not applied with the current transform in the center.\n   * Before this transform is applied, the origin point is at the top left corner of the object\n   * plus the addition of offsetY and offsetX.\n   * @type Number[]\n   * @default null\n   */\n  declare gradientTransform?: TMat2D;\n\n  /**\n   * coordinates units for coords.\n   * If `pixels`, the number of coords are in the same unit of width / height.\n   * If set as `percentage` the coords are still a number, but 1 means 100% of width\n   * for the X and 100% of the height for the y. It can be bigger than 1 and negative.\n   * allowed values pixels or percentage.\n   * @type GradientUnits\n   * @default 'pixels'\n   */\n  declare gradientUnits: GradientUnits;\n\n  /**\n   * Gradient type linear or radial\n   * @type GradientType\n   * @default 'linear'\n   */\n  declare type: T;\n\n  /**\n   * Defines how the gradient is located in space and spread\n   * @type GradientCoords\n   */\n  declare coords: GradientCoords<T>;\n\n  /**\n   * Defines how many colors a gradient has and how they are located on the axis\n   * defined by coords\n   * @type GradientCoords\n   */\n  declare colorStops: ColorStop[];\n\n  /**\n   * If true, this object will not be exported during the serialization of a canvas\n   * @type boolean\n   */\n  declare excludeFromExport?: boolean;\n\n  /**\n   * ID used for SVG export functionalities\n   * @type number | string\n   */\n  declare readonly id: string | number;\n\n  static type = 'Gradient';\n\n  constructor(options: GradientOptions<T>) {\n    const {\n      type = 'linear' as T,\n      gradientUnits = 'pixels',\n      coords = {},\n      colorStops = [],\n      offsetX = 0,\n      offsetY = 0,\n      gradientTransform,\n      id,\n    } = options || {};\n    Object.assign(this, {\n      type,\n      gradientUnits,\n      coords: {\n        ...(type === 'radial' ? radialDefaultCoords : linearDefaultCoords),\n        ...coords,\n      },\n      colorStops,\n      offsetX,\n      offsetY,\n      gradientTransform,\n      id: id ? `${id}_${uid()}` : uid(),\n    });\n  }\n\n  /**\n   * Adds another colorStop\n   * @param {Record<string, string>} colorStop Object with offset and color\n   * @return {Gradient} thisArg\n   */\n  addColorStop(colorStops: Record<string, string>) {\n    for (const position in colorStops) {\n      this.colorStops.push({\n        offset: parseFloat(position),\n        color: colorStops[position],\n      });\n    }\n    return this;\n  }\n\n  /**\n   * Returns object representation of a gradient\n   * @param {string[]} [propertiesToInclude] Any properties that you might want to additionally include in the output\n   * @return {object}\n   */\n  toObject(\n    propertiesToInclude?: (keyof this | string)[],\n  ): SerializedGradientProps<T> {\n    return {\n      ...pick(this, propertiesToInclude as (keyof this)[]),\n      type: this.type,\n      coords: { ...this.coords },\n      colorStops: this.colorStops.map((colorStop) => ({ ...colorStop })),\n      offsetX: this.offsetX,\n      offsetY: this.offsetY,\n      gradientUnits: this.gradientUnits,\n      gradientTransform: this.gradientTransform\n        ? [...this.gradientTransform]\n        : undefined,\n    };\n  }\n\n  /* _TO_SVG_START_ */\n  /**\n   * Returns SVG representation of an gradient\n   * @param {FabricObject} object Object to create a gradient for\n   * @return {String} SVG representation of an gradient (linear/radial)\n   */\n  toSVG(\n    object: FabricObject,\n    {\n      additionalTransform: preTransform,\n    }: { additionalTransform?: string } = {},\n  ) {\n    const markup = [],\n      transform = (\n        this.gradientTransform\n          ? this.gradientTransform.concat()\n          : iMatrix.concat()\n      ) as TMat2D,\n      gradientUnits =\n        this.gradientUnits === 'pixels'\n          ? 'userSpaceOnUse'\n          : 'objectBoundingBox';\n    // colorStops must be sorted ascending, and guarded against deep mutations\n    const colorStops = this.colorStops\n      .map((colorStop) => ({ ...colorStop }))\n      .sort((a, b) => {\n        return a.offset - b.offset;\n      });\n\n    let offsetX = -this.offsetX,\n      offsetY = -this.offsetY;\n    if (gradientUnits === 'objectBoundingBox') {\n      offsetX /= object.width;\n      offsetY /= object.height;\n    } else {\n      offsetX += object.width / 2;\n      offsetY += object.height / 2;\n    }\n    // todo what about polygon/polyline?\n    if (isPath(object) && this.gradientUnits !== 'percentage') {\n      offsetX -= object.pathOffset.x;\n      offsetY -= object.pathOffset.y;\n    }\n    transform[4] -= offsetX;\n    transform[5] -= offsetY;\n\n    const commonAttributes = [\n      `id=\"SVGID_${this.id}\"`,\n      `gradientUnits=\"${gradientUnits}\"`,\n      `gradientTransform=\"${\n        preTransform ? preTransform + ' ' : ''\n      }${matrixToSVG(transform)}\"`,\n      '',\n    ].join(' ');\n\n    if (this.type === 'linear') {\n      const { x1, y1, x2, y2 } = this.coords;\n      markup.push(\n        '<linearGradient ',\n        commonAttributes,\n        ' x1=\"',\n        x1,\n        '\" y1=\"',\n        y1,\n        '\" x2=\"',\n        x2,\n        '\" y2=\"',\n        y2,\n        '\">\\n',\n      );\n    } else if (this.type === 'radial') {\n      const { x1, y1, x2, y2, r1, r2 } = this\n        .coords as GradientCoords<'radial'>;\n      const needsSwap = r1 > r2;\n      // svg radial gradient has just 1 radius. the biggest.\n      markup.push(\n        '<radialGradient ',\n        commonAttributes,\n        ' cx=\"',\n        needsSwap ? x1 : x2,\n        '\" cy=\"',\n        needsSwap ? y1 : y2,\n        '\" r=\"',\n        needsSwap ? r1 : r2,\n        '\" fx=\"',\n        needsSwap ? x2 : x1,\n        '\" fy=\"',\n        needsSwap ? y2 : y1,\n        '\">\\n',\n      );\n      if (needsSwap) {\n        // svg goes from internal to external radius. if radius are inverted, swap color stops.\n        colorStops.reverse(); //  mutates array\n        colorStops.forEach((colorStop) => {\n          colorStop.offset = 1 - colorStop.offset;\n        });\n      }\n      const minRadius = Math.min(r1, r2);\n      if (minRadius > 0) {\n        // i have to shift all colorStops and add new one in 0.\n        const maxRadius = Math.max(r1, r2),\n          percentageShift = minRadius / maxRadius;\n        colorStops.forEach((colorStop) => {\n          colorStop.offset += percentageShift * (1 - colorStop.offset);\n        });\n      }\n    }\n\n    colorStops.forEach(({ color, offset }) => {\n      markup.push(\n        `<stop offset=\"${offset * 100}%\" style=\"stop-color:${color};\"/>\\n`,\n      );\n    });\n\n    markup.push(\n      this.type === 'linear' ? '</linearGradient>' : '</radialGradient>',\n      '\\n',\n    );\n\n    return markup.join('');\n  }\n  /* _TO_SVG_END_ */\n\n  /**\n   * Returns an instance of CanvasGradient\n   * @param {CanvasRenderingContext2D} ctx Context to render on\n   * @return {CanvasGradient}\n   */\n  toLive(ctx: CanvasRenderingContext2D): CanvasGradient {\n    const { x1, y1, x2, y2, r1, r2 } = this.coords as GradientCoords<'radial'>;\n    const gradient =\n      this.type === 'linear'\n        ? ctx.createLinearGradient(x1, y1, x2, y2)\n        : ctx.createRadialGradient(x1, y1, r1, x2, y2, r2);\n\n    this.colorStops.forEach(({ color, offset }) => {\n      gradient.addColorStop(offset, color);\n    });\n\n    return gradient;\n  }\n\n  static async fromObject(\n    options: GradientOptions<'linear'>,\n  ): Promise<Gradient<'linear'>>;\n  static async fromObject(\n    options: GradientOptions<'radial'>,\n  ): Promise<Gradient<'radial'>>;\n  static async fromObject(\n    options: GradientOptions<'linear'> | GradientOptions<'radial'>,\n  ) {\n    const { colorStops, gradientTransform } = options;\n    return new this({\n      ...options,\n      colorStops: colorStops\n        ? colorStops.map((colorStop) => ({ ...colorStop }))\n        : undefined,\n      gradientTransform: gradientTransform ? [...gradientTransform] : undefined,\n    });\n  }\n\n  /* _FROM_SVG_START_ */\n  /**\n   * Returns {@link Gradient} instance from an SVG element\n   * @param {SVGGradientElement} el SVG gradient element\n   * @param {FabricObject} instance\n   * @param {String} opacity A fill-opacity or stroke-opacity attribute to multiply to each stop's opacity.\n   * @param {SVGOptions} svgOptions an object containing the size of the SVG in order to parse correctly gradients\n   * that uses gradientUnits as 'userSpaceOnUse' and percentages.\n   * @return {Gradient} Gradient instance\n   * @see http://www.w3.org/TR/SVG/pservers.html#LinearGradientElement\n   * @see http://www.w3.org/TR/SVG/pservers.html#RadialGradientElement\n   *\n   *  @example\n   *\n   *  <linearGradient id=\"linearGrad1\">\n   *    <stop offset=\"0%\" stop-color=\"white\"/>\n   *    <stop offset=\"100%\" stop-color=\"black\"/>\n   *  </linearGradient>\n   *\n   *  OR\n   *\n   *  <linearGradient id=\"linearGrad2\">\n   *    <stop offset=\"0\" style=\"stop-color:rgb(255,255,255)\"/>\n   *    <stop offset=\"1\" style=\"stop-color:rgb(0,0,0)\"/>\n   *  </linearGradient>\n   *\n   *  OR\n   *\n   *  <radialGradient id=\"radialGrad1\">\n   *    <stop offset=\"0%\" stop-color=\"white\" stop-opacity=\"1\" />\n   *    <stop offset=\"50%\" stop-color=\"black\" stop-opacity=\"0.5\" />\n   *    <stop offset=\"100%\" stop-color=\"white\" stop-opacity=\"1\" />\n   *  </radialGradient>\n   *\n   *  OR\n   *\n   *  <radialGradient id=\"radialGrad2\">\n   *    <stop offset=\"0\" stop-color=\"rgb(255,255,255)\" />\n   *    <stop offset=\"0.5\" stop-color=\"rgb(0,0,0)\" />\n   *    <stop offset=\"1\" stop-color=\"rgb(255,255,255)\" />\n   *  </radialGradient>\n   *\n   */\n  static fromElement(\n    el: SVGGradientElement,\n    instance: FabricObject,\n    svgOptions: SVGOptions,\n  ): Gradient<GradientType> {\n    const gradientUnits = parseGradientUnits(el);\n    const center = instance._findCenterFromElement();\n    return new this({\n      id: el.getAttribute('id') || undefined,\n      type: parseType(el),\n      coords: parseCoords(el, {\n        width: svgOptions.viewBoxWidth || svgOptions.width,\n        height: svgOptions.viewBoxHeight || svgOptions.height,\n      }),\n      colorStops: parseColorStops(el, svgOptions.opacity),\n      gradientUnits,\n      gradientTransform: parseTransformAttribute(\n        el.getAttribute('gradientTransform') || '',\n      ),\n      ...(gradientUnits === 'pixels'\n        ? {\n            offsetX: instance.width / 2 - center.x,\n            offsetY: instance.height / 2 - center.y,\n          }\n        : {\n            offsetX: 0,\n            offsetY: 0,\n          }),\n    });\n  }\n  /* _FROM_SVG_END_ */\n}\n\nclassRegistry.setClass(Gradient, 'gradient');\nclassRegistry.setClass(Gradient, 'linear');\nclassRegistry.setClass(Gradient, 'radial');\n"],"names":["Gradient","constructor","options","type","gradientUnits","coords","colorStops","offsetX","offsetY","gradientTransform","id","Object","assign","this","radialDefaultCoords","linearDefaultCoords","uid","addColorStop","position","push","offset","parseFloat","color","toObject","propertiesToInclude","pick","map","colorStop","undefined","toSVG","object","additionalTransform","preTransform","arguments","length","markup","transform","concat","iMatrix","sort","a","b","width","height","isPath","pathOffset","x","y","commonAttributes","matrixToSVG","join","x1","y1","x2","y2","r1","r2","needsSwap","reverse","forEach","minRadius","Math","min","percentageShift","max","_ref","toLive","ctx","gradient","createLinearGradient","createRadialGradient","_ref2","fromObject","fromElement","el","instance","svgOptions","parseGradientUnits","center","_findCenterFromElement","getAttribute","parseType","parseCoords","viewBoxWidth","viewBoxHeight","parseColorStops","opacity","parseTransformAttribute","_defineProperty","classRegistry","setClass"],"mappings":"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"}
+{"version":3,"file":"Gradient.min.mjs","sources":["../../../src/gradient/Gradient.ts"],"sourcesContent":["import { iMatrix } from '../constants';\nimport { parseTransformAttribute } from '../parser/parseTransformAttribute';\nimport type { FabricObject } from '../shapes/Object/FabricObject';\nimport type { TMat2D } from '../typedefs';\nimport { uid } from '../util/internals/uid';\nimport { pick } from '../util/misc/pick';\nimport { matrixToSVG } from '../util/misc/svgExport';\nimport { linearDefaultCoords, radialDefaultCoords } from './constants';\nimport { parseColorStops } from './parser/parseColorStops';\nimport { parseCoords } from './parser/parseCoords';\nimport { parseType, parseGradientUnits } from './parser/misc';\nimport type {\n  ColorStop,\n  GradientCoords,\n  GradientOptions,\n  GradientType,\n  GradientUnits,\n  SVGOptions,\n  SerializedGradientProps,\n} from './typedefs';\nimport { classRegistry } from '../ClassRegistry';\nimport { isPath } from '../util/typeAssertions';\nimport { escapeXml } from '../util/lang_string';\n\n/**\n * Gradient class\n * @class Gradient\n * @see {@link http://fabric5.fabricjs.com/fabric-intro-part-2#gradients}\n */\nexport class Gradient<\n  S,\n  T extends GradientType = S extends GradientType ? S : 'linear',\n> {\n  /**\n   * Horizontal offset for aligning gradients coming from SVG when outside pathgroups\n   * @type Number\n   * @default 0\n   */\n  declare offsetX: number;\n\n  /**\n   * Vertical offset for aligning gradients coming from SVG when outside pathgroups\n   * @type Number\n   * @default 0\n   */\n  declare offsetY: number;\n\n  /**\n   * A transform matrix to apply to the gradient before painting.\n   * Imported from svg gradients, is not applied with the current transform in the center.\n   * Before this transform is applied, the origin point is at the top left corner of the object\n   * plus the addition of offsetY and offsetX.\n   * @type Number[]\n   * @default null\n   */\n  declare gradientTransform?: TMat2D;\n\n  /**\n   * coordinates units for coords.\n   * If `pixels`, the number of coords are in the same unit of width / height.\n   * If set as `percentage` the coords are still a number, but 1 means 100% of width\n   * for the X and 100% of the height for the y. It can be bigger than 1 and negative.\n   * allowed values pixels or percentage.\n   * @type GradientUnits\n   * @default 'pixels'\n   */\n  declare gradientUnits: GradientUnits;\n\n  /**\n   * Gradient type linear or radial\n   * @type GradientType\n   * @default 'linear'\n   */\n  declare type: T;\n\n  /**\n   * Defines how the gradient is located in space and spread\n   * @type GradientCoords\n   */\n  declare coords: GradientCoords<T>;\n\n  /**\n   * Defines how many colors a gradient has and how they are located on the axis\n   * defined by coords\n   * @type GradientCoords\n   */\n  declare colorStops: ColorStop[];\n\n  /**\n   * If true, this object will not be exported during the serialization of a canvas\n   * @type boolean\n   */\n  declare excludeFromExport?: boolean;\n\n  /**\n   * ID used for SVG export functionalities\n   * @type number | string\n   */\n  declare readonly id: string | number;\n\n  static type = 'Gradient';\n\n  constructor(options: GradientOptions<T>) {\n    const {\n      type = 'linear' as T,\n      gradientUnits = 'pixels',\n      coords = {},\n      colorStops = [],\n      offsetX = 0,\n      offsetY = 0,\n      gradientTransform,\n      id,\n    } = options || {};\n    Object.assign(this, {\n      type,\n      gradientUnits,\n      coords: {\n        ...(type === 'radial' ? radialDefaultCoords : linearDefaultCoords),\n        ...coords,\n      },\n      colorStops,\n      offsetX,\n      offsetY,\n      gradientTransform,\n      id: id ? `${id}_${uid()}` : uid(),\n    });\n  }\n\n  /**\n   * Adds another colorStop\n   * @param {Record<string, string>} colorStop Object with offset and color\n   * @return {Gradient} thisArg\n   */\n  addColorStop(colorStops: Record<string, string>) {\n    for (const position in colorStops) {\n      this.colorStops.push({\n        offset: parseFloat(position),\n        color: colorStops[position],\n      });\n    }\n    return this;\n  }\n\n  /**\n   * Returns object representation of a gradient\n   * @param {string[]} [propertiesToInclude] Any properties that you might want to additionally include in the output\n   * @return {object}\n   */\n  toObject(\n    propertiesToInclude?: (keyof this | string)[],\n  ): SerializedGradientProps<T> {\n    return {\n      ...pick(this, propertiesToInclude as (keyof this)[]),\n      type: this.type,\n      coords: { ...this.coords },\n      colorStops: this.colorStops.map((colorStop) => ({ ...colorStop })),\n      offsetX: this.offsetX,\n      offsetY: this.offsetY,\n      gradientUnits: this.gradientUnits,\n      gradientTransform: this.gradientTransform\n        ? [...this.gradientTransform]\n        : undefined,\n    };\n  }\n\n  /* _TO_SVG_START_ */\n  /**\n   * Returns SVG representation of an gradient\n   * @param {FabricObject} object Object to create a gradient for\n   * @return {String} SVG representation of an gradient (linear/radial)\n   */\n  toSVG(\n    object: FabricObject,\n    {\n      additionalTransform: preTransform,\n    }: { additionalTransform?: string } = {},\n  ) {\n    const markup = [],\n      transform = (\n        this.gradientTransform\n          ? this.gradientTransform.concat()\n          : iMatrix.concat()\n      ) as TMat2D,\n      gradientUnits =\n        this.gradientUnits === 'pixels'\n          ? 'userSpaceOnUse'\n          : 'objectBoundingBox';\n    // colorStops must be sorted ascending, and guarded against deep mutations\n    const colorStops = this.colorStops\n      .map((colorStop) => ({ ...colorStop }))\n      .sort((a, b) => {\n        return a.offset - b.offset;\n      });\n\n    let offsetX = -this.offsetX,\n      offsetY = -this.offsetY;\n    if (gradientUnits === 'objectBoundingBox') {\n      offsetX /= object.width;\n      offsetY /= object.height;\n    } else {\n      offsetX += object.width / 2;\n      offsetY += object.height / 2;\n    }\n    // todo what about polygon/polyline?\n    if (isPath(object) && this.gradientUnits !== 'percentage') {\n      offsetX -= object.pathOffset.x;\n      offsetY -= object.pathOffset.y;\n    }\n    transform[4] -= offsetX;\n    transform[5] -= offsetY;\n\n    const commonAttributes = [\n      `id=\"SVGID_${escapeXml(String(this.id))}\"`,\n      `gradientUnits=\"${gradientUnits}\"`,\n      `gradientTransform=\"${\n        preTransform ? preTransform + ' ' : ''\n      }${matrixToSVG(transform)}\"`,\n      '',\n    ].join(' ');\n\n    const sanitizeCoord = (value: unknown) => parseFloat(String(value));\n\n    if (this.type === 'linear') {\n      const { x1, y1, x2, y2 } = this.coords;\n      const sx1 = sanitizeCoord(x1);\n      const sy1 = sanitizeCoord(y1);\n      const sx2 = sanitizeCoord(x2);\n      const sy2 = sanitizeCoord(y2);\n      markup.push(\n        '<linearGradient ',\n        commonAttributes,\n        ' x1=\"',\n        sx1,\n        '\" y1=\"',\n        sy1,\n        '\" x2=\"',\n        sx2,\n        '\" y2=\"',\n        sy2,\n        '\">\\n',\n      );\n    } else if (this.type === 'radial') {\n      const { x1, y1, x2, y2, r1, r2 } = this\n        .coords as GradientCoords<'radial'>;\n      const sx1 = sanitizeCoord(x1);\n      const sy1 = sanitizeCoord(y1);\n      const sx2 = sanitizeCoord(x2);\n      const sy2 = sanitizeCoord(y2);\n      const sr1 = sanitizeCoord(r1);\n      const sr2 = sanitizeCoord(r2);\n      const needsSwap = sr1 > sr2;\n      // svg radial gradient has just 1 radius. the biggest.\n      markup.push(\n        '<radialGradient ',\n        commonAttributes,\n        ' cx=\"',\n        needsSwap ? sx1 : sx2,\n        '\" cy=\"',\n        needsSwap ? sy1 : sy2,\n        '\" r=\"',\n        needsSwap ? sr1 : sr2,\n        '\" fx=\"',\n        needsSwap ? sx2 : sx1,\n        '\" fy=\"',\n        needsSwap ? sy2 : sy1,\n        '\">\\n',\n      );\n      if (needsSwap) {\n        // svg goes from internal to external radius. if radius are inverted, swap color stops.\n        colorStops.reverse(); //  mutates array\n        colorStops.forEach((colorStop) => {\n          colorStop.offset = 1 - colorStop.offset;\n        });\n      }\n      const minRadius = Math.min(sr1, sr2);\n      if (minRadius > 0) {\n        // i have to shift all colorStops and add new one in 0.\n        const maxRadius = Math.max(sr1, sr2),\n          percentageShift = minRadius / maxRadius;\n        colorStops.forEach((colorStop) => {\n          colorStop.offset += percentageShift * (1 - colorStop.offset);\n        });\n      }\n    }\n    // todo make a malicious script tag injection test with color and also apply a fix with escapeXml\n    colorStops.forEach(({ color, offset }) => {\n      markup.push(\n        `<stop offset=\"${offset * 100}%\" style=\"stop-color:${color};\"/>\\n`,\n      );\n    });\n\n    markup.push(\n      this.type === 'linear' ? '</linearGradient>' : '</radialGradient>',\n      '\\n',\n    );\n\n    return markup.join('');\n  }\n  /* _TO_SVG_END_ */\n\n  /**\n   * Returns an instance of CanvasGradient\n   * @param {CanvasRenderingContext2D} ctx Context to render on\n   * @return {CanvasGradient}\n   */\n  toLive(ctx: CanvasRenderingContext2D): CanvasGradient {\n    const { x1, y1, x2, y2, r1, r2 } = this.coords as GradientCoords<'radial'>;\n    const gradient =\n      this.type === 'linear'\n        ? ctx.createLinearGradient(x1, y1, x2, y2)\n        : ctx.createRadialGradient(x1, y1, r1, x2, y2, r2);\n\n    this.colorStops.forEach(({ color, offset }) => {\n      gradient.addColorStop(offset, color);\n    });\n\n    return gradient;\n  }\n\n  static async fromObject(\n    options: GradientOptions<'linear'>,\n  ): Promise<Gradient<'linear'>>;\n  static async fromObject(\n    options: GradientOptions<'radial'>,\n  ): Promise<Gradient<'radial'>>;\n  static async fromObject(\n    options: GradientOptions<'linear'> | GradientOptions<'radial'>,\n  ) {\n    const { colorStops, gradientTransform } = options;\n    return new this({\n      ...options,\n      colorStops: colorStops\n        ? colorStops.map((colorStop) => ({ ...colorStop }))\n        : undefined,\n      gradientTransform: gradientTransform ? [...gradientTransform] : undefined,\n    });\n  }\n\n  /* _FROM_SVG_START_ */\n  /**\n   * Returns {@link Gradient} instance from an SVG element\n   * @param {SVGGradientElement} el SVG gradient element\n   * @param {FabricObject} instance\n   * @param {String} opacity A fill-opacity or stroke-opacity attribute to multiply to each stop's opacity.\n   * @param {SVGOptions} svgOptions an object containing the size of the SVG in order to parse correctly gradients\n   * that uses gradientUnits as 'userSpaceOnUse' and percentages.\n   * @return {Gradient} Gradient instance\n   * @see http://www.w3.org/TR/SVG/pservers.html#LinearGradientElement\n   * @see http://www.w3.org/TR/SVG/pservers.html#RadialGradientElement\n   *\n   *  @example\n   *\n   *  <linearGradient id=\"linearGrad1\">\n   *    <stop offset=\"0%\" stop-color=\"white\"/>\n   *    <stop offset=\"100%\" stop-color=\"black\"/>\n   *  </linearGradient>\n   *\n   *  OR\n   *\n   *  <linearGradient id=\"linearGrad2\">\n   *    <stop offset=\"0\" style=\"stop-color:rgb(255,255,255)\"/>\n   *    <stop offset=\"1\" style=\"stop-color:rgb(0,0,0)\"/>\n   *  </linearGradient>\n   *\n   *  OR\n   *\n   *  <radialGradient id=\"radialGrad1\">\n   *    <stop offset=\"0%\" stop-color=\"white\" stop-opacity=\"1\" />\n   *    <stop offset=\"50%\" stop-color=\"black\" stop-opacity=\"0.5\" />\n   *    <stop offset=\"100%\" stop-color=\"white\" stop-opacity=\"1\" />\n   *  </radialGradient>\n   *\n   *  OR\n   *\n   *  <radialGradient id=\"radialGrad2\">\n   *    <stop offset=\"0\" stop-color=\"rgb(255,255,255)\" />\n   *    <stop offset=\"0.5\" stop-color=\"rgb(0,0,0)\" />\n   *    <stop offset=\"1\" stop-color=\"rgb(255,255,255)\" />\n   *  </radialGradient>\n   *\n   */\n  static fromElement(\n    el: SVGGradientElement,\n    instance: FabricObject,\n    svgOptions: SVGOptions,\n  ): Gradient<GradientType> {\n    const gradientUnits = parseGradientUnits(el);\n    const center = instance._findCenterFromElement();\n    return new this({\n      id: el.getAttribute('id') || undefined,\n      type: parseType(el),\n      coords: parseCoords(el, {\n        width: svgOptions.viewBoxWidth || svgOptions.width,\n        height: svgOptions.viewBoxHeight || svgOptions.height,\n      }),\n      colorStops: parseColorStops(el, svgOptions.opacity),\n      gradientUnits,\n      gradientTransform: parseTransformAttribute(\n        el.getAttribute('gradientTransform') || '',\n      ),\n      ...(gradientUnits === 'pixels'\n        ? {\n            offsetX: instance.width / 2 - center.x,\n            offsetY: instance.height / 2 - center.y,\n          }\n        : {\n            offsetX: 0,\n            offsetY: 0,\n          }),\n    });\n  }\n  /* _FROM_SVG_END_ */\n}\n\nclassRegistry.setClass(Gradient, 'gradient');\nclassRegistry.setClass(Gradient, 'linear');\nclassRegistry.setClass(Gradient, 'radial');\n"],"names":["Gradient","constructor","options","type","gradientUnits","coords","colorStops","offsetX","offsetY","gradientTransform","id","Object","assign","this","radialDefaultCoords","linearDefaultCoords","uid","addColorStop","position","push","offset","parseFloat","color","toObject","propertiesToInclude","pick","map","colorStop","undefined","toSVG","object","additionalTransform","preTransform","arguments","length","markup","transform","concat","iMatrix","sort","a","b","width","height","isPath","pathOffset","x","y","commonAttributes","escapeXml","String","matrixToSVG","join","sanitizeCoord","value","x1","y1","x2","y2","sx1","sy1","sx2","sy2","r1","r2","sr1","sr2","needsSwap","reverse","forEach","minRadius","Math","min","percentageShift","max","_ref","toLive","ctx","gradient","createLinearGradient","createRadialGradient","_ref2","fromObject","fromElement","el","instance","svgOptions","parseGradientUnits","center","_findCenterFromElement","getAttribute","parseType","parseCoords","viewBoxWidth","viewBoxHeight","parseColorStops","opacity","parseTransformAttribute","_defineProperty","classRegistry","setClass"],"mappings":"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"}

package/dist/src/gradient/Gradient.mjs

@@ -10,6 +10,7 @@ import { parseCoords } from './parser/parseCoords.mjs';
 import { parseGradientUnits, parseType } from './parser/misc.mjs';
 import { classRegistry } from '../ClassRegistry.mjs';
 import { isPath } from '../util/typeAssertions.mjs';
+import { escapeXml } from '../util/lang_string.mjs';
 
 /**
  * Gradient class
@@ -115,7 +116,8 @@ class Gradient {
     }
     transform[4] -= offsetX;
     transform[5] -= offsetY;
-    const commonAttributes = [`id="SVGID_${this.id}"`, `gradientUnits="${gradientUnits}"`, `gradientTransform="${preTransform ? preTransform + ' ' : ''}${matrixToSVG(transform)}"`, ''].join(' ');
+    const commonAttributes = [`id="SVGID_${escapeXml(String(this.id))}"`, `gradientUnits="${gradientUnits}"`, `gradientTransform="${preTransform ? preTransform + ' ' : ''}${matrixToSVG(transform)}"`, ''].join(' ');
+    const sanitizeCoord = value => parseFloat(String(value));
     if (this.type === 'linear') {
       const {
         x1,
@@ -123,7 +125,11 @@ class Gradient {
         x2,
         y2
       } = this.coords;
-      markup.push('<linearGradient ', commonAttributes, ' x1="', x1, '" y1="', y1, '" x2="', x2, '" y2="', y2, '">\n');
+      const sx1 = sanitizeCoord(x1);
+      const sy1 = sanitizeCoord(y1);
+      const sx2 = sanitizeCoord(x2);
+      const sy2 = sanitizeCoord(y2);
+      markup.push('<linearGradient ', commonAttributes, ' x1="', sx1, '" y1="', sy1, '" x2="', sx2, '" y2="', sy2, '">\n');
     } else if (this.type === 'radial') {
       const {
         x1,
@@ -133,9 +139,15 @@ class Gradient {
         r1,
         r2
       } = this.coords;
-      const needsSwap = r1 > r2;
+      const sx1 = sanitizeCoord(x1);
+      const sy1 = sanitizeCoord(y1);
+      const sx2 = sanitizeCoord(x2);
+      const sy2 = sanitizeCoord(y2);
+      const sr1 = sanitizeCoord(r1);
+      const sr2 = sanitizeCoord(r2);
+      const needsSwap = sr1 > sr2;
       // svg radial gradient has just 1 radius. the biggest.
-      markup.push('<radialGradient ', commonAttributes, ' cx="', needsSwap ? x1 : x2, '" cy="', needsSwap ? y1 : y2, '" r="', needsSwap ? r1 : r2, '" fx="', needsSwap ? x2 : x1, '" fy="', needsSwap ? y2 : y1, '">\n');
+      markup.push('<radialGradient ', commonAttributes, ' cx="', needsSwap ? sx1 : sx2, '" cy="', needsSwap ? sy1 : sy2, '" r="', needsSwap ? sr1 : sr2, '" fx="', needsSwap ? sx2 : sx1, '" fy="', needsSwap ? sy2 : sy1, '">\n');
       if (needsSwap) {
         // svg goes from internal to external radius. if radius are inverted, swap color stops.
         colorStops.reverse(); //  mutates array
@@ -143,16 +155,17 @@ class Gradient {
           colorStop.offset = 1 - colorStop.offset;
         });
       }
-      const minRadius = Math.min(r1, r2);
+      const minRadius = Math.min(sr1, sr2);
       if (minRadius > 0) {
         // i have to shift all colorStops and add new one in 0.
-        const maxRadius = Math.max(r1, r2),
+        const maxRadius = Math.max(sr1, sr2),
           percentageShift = minRadius / maxRadius;
         colorStops.forEach(colorStop => {
           colorStop.offset += percentageShift * (1 - colorStop.offset);
         });
       }
     }
+    // todo make a malicious script tag injection test with color and also apply a fix with escapeXml
     colorStops.forEach(_ref => {
       let {
         color,

package/dist/src/gradient/Gradient.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Gradient.mjs","sources":["../../../src/gradient/Gradient.ts"],"sourcesContent":["import { iMatrix } from '../constants';\nimport { parseTransformAttribute } from '../parser/parseTransformAttribute';\nimport type { FabricObject } from '../shapes/Object/FabricObject';\nimport type { TMat2D } from '../typedefs';\nimport { uid } from '../util/internals/uid';\nimport { pick } from '../util/misc/pick';\nimport { matrixToSVG } from '../util/misc/svgExport';\nimport { linearDefaultCoords, radialDefaultCoords } from './constants';\nimport { parseColorStops } from './parser/parseColorStops';\nimport { parseCoords } from './parser/parseCoords';\nimport { parseType, parseGradientUnits } from './parser/misc';\nimport type {\n  ColorStop,\n  GradientCoords,\n  GradientOptions,\n  GradientType,\n  GradientUnits,\n  SVGOptions,\n  SerializedGradientProps,\n} from './typedefs';\nimport { classRegistry } from '../ClassRegistry';\nimport { isPath } from '../util/typeAssertions';\n\n/**\n * Gradient class\n * @class Gradient\n * @see {@link http://fabric5.fabricjs.com/fabric-intro-part-2#gradients}\n */\nexport class Gradient<\n  S,\n  T extends GradientType = S extends GradientType ? S : 'linear',\n> {\n  /**\n   * Horizontal offset for aligning gradients coming from SVG when outside pathgroups\n   * @type Number\n   * @default 0\n   */\n  declare offsetX: number;\n\n  /**\n   * Vertical offset for aligning gradients coming from SVG when outside pathgroups\n   * @type Number\n   * @default 0\n   */\n  declare offsetY: number;\n\n  /**\n   * A transform matrix to apply to the gradient before painting.\n   * Imported from svg gradients, is not applied with the current transform in the center.\n   * Before this transform is applied, the origin point is at the top left corner of the object\n   * plus the addition of offsetY and offsetX.\n   * @type Number[]\n   * @default null\n   */\n  declare gradientTransform?: TMat2D;\n\n  /**\n   * coordinates units for coords.\n   * If `pixels`, the number of coords are in the same unit of width / height.\n   * If set as `percentage` the coords are still a number, but 1 means 100% of width\n   * for the X and 100% of the height for the y. It can be bigger than 1 and negative.\n   * allowed values pixels or percentage.\n   * @type GradientUnits\n   * @default 'pixels'\n   */\n  declare gradientUnits: GradientUnits;\n\n  /**\n   * Gradient type linear or radial\n   * @type GradientType\n   * @default 'linear'\n   */\n  declare type: T;\n\n  /**\n   * Defines how the gradient is located in space and spread\n   * @type GradientCoords\n   */\n  declare coords: GradientCoords<T>;\n\n  /**\n   * Defines how many colors a gradient has and how they are located on the axis\n   * defined by coords\n   * @type GradientCoords\n   */\n  declare colorStops: ColorStop[];\n\n  /**\n   * If true, this object will not be exported during the serialization of a canvas\n   * @type boolean\n   */\n  declare excludeFromExport?: boolean;\n\n  /**\n   * ID used for SVG export functionalities\n   * @type number | string\n   */\n  declare readonly id: string | number;\n\n  static type = 'Gradient';\n\n  constructor(options: GradientOptions<T>) {\n    const {\n      type = 'linear' as T,\n      gradientUnits = 'pixels',\n      coords = {},\n      colorStops = [],\n      offsetX = 0,\n      offsetY = 0,\n      gradientTransform,\n      id,\n    } = options || {};\n    Object.assign(this, {\n      type,\n      gradientUnits,\n      coords: {\n        ...(type === 'radial' ? radialDefaultCoords : linearDefaultCoords),\n        ...coords,\n      },\n      colorStops,\n      offsetX,\n      offsetY,\n      gradientTransform,\n      id: id ? `${id}_${uid()}` : uid(),\n    });\n  }\n\n  /**\n   * Adds another colorStop\n   * @param {Record<string, string>} colorStop Object with offset and color\n   * @return {Gradient} thisArg\n   */\n  addColorStop(colorStops: Record<string, string>) {\n    for (const position in colorStops) {\n      this.colorStops.push({\n        offset: parseFloat(position),\n        color: colorStops[position],\n      });\n    }\n    return this;\n  }\n\n  /**\n   * Returns object representation of a gradient\n   * @param {string[]} [propertiesToInclude] Any properties that you might want to additionally include in the output\n   * @return {object}\n   */\n  toObject(\n    propertiesToInclude?: (keyof this | string)[],\n  ): SerializedGradientProps<T> {\n    return {\n      ...pick(this, propertiesToInclude as (keyof this)[]),\n      type: this.type,\n      coords: { ...this.coords },\n      colorStops: this.colorStops.map((colorStop) => ({ ...colorStop })),\n      offsetX: this.offsetX,\n      offsetY: this.offsetY,\n      gradientUnits: this.gradientUnits,\n      gradientTransform: this.gradientTransform\n        ? [...this.gradientTransform]\n        : undefined,\n    };\n  }\n\n  /* _TO_SVG_START_ */\n  /**\n   * Returns SVG representation of an gradient\n   * @param {FabricObject} object Object to create a gradient for\n   * @return {String} SVG representation of an gradient (linear/radial)\n   */\n  toSVG(\n    object: FabricObject,\n    {\n      additionalTransform: preTransform,\n    }: { additionalTransform?: string } = {},\n  ) {\n    const markup = [],\n      transform = (\n        this.gradientTransform\n          ? this.gradientTransform.concat()\n          : iMatrix.concat()\n      ) as TMat2D,\n      gradientUnits =\n        this.gradientUnits === 'pixels'\n          ? 'userSpaceOnUse'\n          : 'objectBoundingBox';\n    // colorStops must be sorted ascending, and guarded against deep mutations\n    const colorStops = this.colorStops\n      .map((colorStop) => ({ ...colorStop }))\n      .sort((a, b) => {\n        return a.offset - b.offset;\n      });\n\n    let offsetX = -this.offsetX,\n      offsetY = -this.offsetY;\n    if (gradientUnits === 'objectBoundingBox') {\n      offsetX /= object.width;\n      offsetY /= object.height;\n    } else {\n      offsetX += object.width / 2;\n      offsetY += object.height / 2;\n    }\n    // todo what about polygon/polyline?\n    if (isPath(object) && this.gradientUnits !== 'percentage') {\n      offsetX -= object.pathOffset.x;\n      offsetY -= object.pathOffset.y;\n    }\n    transform[4] -= offsetX;\n    transform[5] -= offsetY;\n\n    const commonAttributes = [\n      `id=\"SVGID_${this.id}\"`,\n      `gradientUnits=\"${gradientUnits}\"`,\n      `gradientTransform=\"${\n        preTransform ? preTransform + ' ' : ''\n      }${matrixToSVG(transform)}\"`,\n      '',\n    ].join(' ');\n\n    if (this.type === 'linear') {\n      const { x1, y1, x2, y2 } = this.coords;\n      markup.push(\n        '<linearGradient ',\n        commonAttributes,\n        ' x1=\"',\n        x1,\n        '\" y1=\"',\n        y1,\n        '\" x2=\"',\n        x2,\n        '\" y2=\"',\n        y2,\n        '\">\\n',\n      );\n    } else if (this.type === 'radial') {\n      const { x1, y1, x2, y2, r1, r2 } = this\n        .coords as GradientCoords<'radial'>;\n      const needsSwap = r1 > r2;\n      // svg radial gradient has just 1 radius. the biggest.\n      markup.push(\n        '<radialGradient ',\n        commonAttributes,\n        ' cx=\"',\n        needsSwap ? x1 : x2,\n        '\" cy=\"',\n        needsSwap ? y1 : y2,\n        '\" r=\"',\n        needsSwap ? r1 : r2,\n        '\" fx=\"',\n        needsSwap ? x2 : x1,\n        '\" fy=\"',\n        needsSwap ? y2 : y1,\n        '\">\\n',\n      );\n      if (needsSwap) {\n        // svg goes from internal to external radius. if radius are inverted, swap color stops.\n        colorStops.reverse(); //  mutates array\n        colorStops.forEach((colorStop) => {\n          colorStop.offset = 1 - colorStop.offset;\n        });\n      }\n      const minRadius = Math.min(r1, r2);\n      if (minRadius > 0) {\n        // i have to shift all colorStops and add new one in 0.\n        const maxRadius = Math.max(r1, r2),\n          percentageShift = minRadius / maxRadius;\n        colorStops.forEach((colorStop) => {\n          colorStop.offset += percentageShift * (1 - colorStop.offset);\n        });\n      }\n    }\n\n    colorStops.forEach(({ color, offset }) => {\n      markup.push(\n        `<stop offset=\"${offset * 100}%\" style=\"stop-color:${color};\"/>\\n`,\n      );\n    });\n\n    markup.push(\n      this.type === 'linear' ? '</linearGradient>' : '</radialGradient>',\n      '\\n',\n    );\n\n    return markup.join('');\n  }\n  /* _TO_SVG_END_ */\n\n  /**\n   * Returns an instance of CanvasGradient\n   * @param {CanvasRenderingContext2D} ctx Context to render on\n   * @return {CanvasGradient}\n   */\n  toLive(ctx: CanvasRenderingContext2D): CanvasGradient {\n    const { x1, y1, x2, y2, r1, r2 } = this.coords as GradientCoords<'radial'>;\n    const gradient =\n      this.type === 'linear'\n        ? ctx.createLinearGradient(x1, y1, x2, y2)\n        : ctx.createRadialGradient(x1, y1, r1, x2, y2, r2);\n\n    this.colorStops.forEach(({ color, offset }) => {\n      gradient.addColorStop(offset, color);\n    });\n\n    return gradient;\n  }\n\n  static async fromObject(\n    options: GradientOptions<'linear'>,\n  ): Promise<Gradient<'linear'>>;\n  static async fromObject(\n    options: GradientOptions<'radial'>,\n  ): Promise<Gradient<'radial'>>;\n  static async fromObject(\n    options: GradientOptions<'linear'> | GradientOptions<'radial'>,\n  ) {\n    const { colorStops, gradientTransform } = options;\n    return new this({\n      ...options,\n      colorStops: colorStops\n        ? colorStops.map((colorStop) => ({ ...colorStop }))\n        : undefined,\n      gradientTransform: gradientTransform ? [...gradientTransform] : undefined,\n    });\n  }\n\n  /* _FROM_SVG_START_ */\n  /**\n   * Returns {@link Gradient} instance from an SVG element\n   * @param {SVGGradientElement} el SVG gradient element\n   * @param {FabricObject} instance\n   * @param {String} opacity A fill-opacity or stroke-opacity attribute to multiply to each stop's opacity.\n   * @param {SVGOptions} svgOptions an object containing the size of the SVG in order to parse correctly gradients\n   * that uses gradientUnits as 'userSpaceOnUse' and percentages.\n   * @return {Gradient} Gradient instance\n   * @see http://www.w3.org/TR/SVG/pservers.html#LinearGradientElement\n   * @see http://www.w3.org/TR/SVG/pservers.html#RadialGradientElement\n   *\n   *  @example\n   *\n   *  <linearGradient id=\"linearGrad1\">\n   *    <stop offset=\"0%\" stop-color=\"white\"/>\n   *    <stop offset=\"100%\" stop-color=\"black\"/>\n   *  </linearGradient>\n   *\n   *  OR\n   *\n   *  <linearGradient id=\"linearGrad2\">\n   *    <stop offset=\"0\" style=\"stop-color:rgb(255,255,255)\"/>\n   *    <stop offset=\"1\" style=\"stop-color:rgb(0,0,0)\"/>\n   *  </linearGradient>\n   *\n   *  OR\n   *\n   *  <radialGradient id=\"radialGrad1\">\n   *    <stop offset=\"0%\" stop-color=\"white\" stop-opacity=\"1\" />\n   *    <stop offset=\"50%\" stop-color=\"black\" stop-opacity=\"0.5\" />\n   *    <stop offset=\"100%\" stop-color=\"white\" stop-opacity=\"1\" />\n   *  </radialGradient>\n   *\n   *  OR\n   *\n   *  <radialGradient id=\"radialGrad2\">\n   *    <stop offset=\"0\" stop-color=\"rgb(255,255,255)\" />\n   *    <stop offset=\"0.5\" stop-color=\"rgb(0,0,0)\" />\n   *    <stop offset=\"1\" stop-color=\"rgb(255,255,255)\" />\n   *  </radialGradient>\n   *\n   */\n  static fromElement(\n    el: SVGGradientElement,\n    instance: FabricObject,\n    svgOptions: SVGOptions,\n  ): Gradient<GradientType> {\n    const gradientUnits = parseGradientUnits(el);\n    const center = instance._findCenterFromElement();\n    return new this({\n      id: el.getAttribute('id') || undefined,\n      type: parseType(el),\n      coords: parseCoords(el, {\n        width: svgOptions.viewBoxWidth || svgOptions.width,\n        height: svgOptions.viewBoxHeight || svgOptions.height,\n      }),\n      colorStops: parseColorStops(el, svgOptions.opacity),\n      gradientUnits,\n      gradientTransform: parseTransformAttribute(\n        el.getAttribute('gradientTransform') || '',\n      ),\n      ...(gradientUnits === 'pixels'\n        ? {\n            offsetX: instance.width / 2 - center.x,\n            offsetY: instance.height / 2 - center.y,\n          }\n        : {\n            offsetX: 0,\n            offsetY: 0,\n          }),\n    });\n  }\n  /* _FROM_SVG_END_ */\n}\n\nclassRegistry.setClass(Gradient, 'gradient');\nclassRegistry.setClass(Gradient, 'linear');\nclassRegistry.setClass(Gradient, 'radial');\n"],"names":["Gradient","constructor","options","type","gradientUnits","coords","colorStops","offsetX","offsetY","gradientTransform","id","Object","assign","radialDefaultCoords","linearDefaultCoords","uid","addColorStop","position","push","offset","parseFloat","color","toObject","propertiesToInclude","pick","map","colorStop","undefined","toSVG","object","additionalTransform","preTransform","arguments","length","markup","transform","concat","iMatrix","sort","a","b","width","height","isPath","pathOffset","x","y","commonAttributes","matrixToSVG","join","x1","y1","x2","y2","r1","r2","needsSwap","reverse","forEach","minRadius","Math","min","maxRadius","max","percentageShift","_ref","toLive","ctx","gradient","createLinearGradient","createRadialGradient","_ref2","fromObject","fromElement","el","instance","svgOptions","parseGradientUnits","center","_findCenterFromElement","getAttribute","parseType","parseCoords","viewBoxWidth","viewBoxHeight","parseColorStops","opacity","parseTransformAttribute","_defineProperty","classRegistry","setClass"],"mappings":"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"}
+{"version":3,"file":"Gradient.mjs","sources":["../../../src/gradient/Gradient.ts"],"sourcesContent":["import { iMatrix } from '../constants';\nimport { parseTransformAttribute } from '../parser/parseTransformAttribute';\nimport type { FabricObject } from '../shapes/Object/FabricObject';\nimport type { TMat2D } from '../typedefs';\nimport { uid } from '../util/internals/uid';\nimport { pick } from '../util/misc/pick';\nimport { matrixToSVG } from '../util/misc/svgExport';\nimport { linearDefaultCoords, radialDefaultCoords } from './constants';\nimport { parseColorStops } from './parser/parseColorStops';\nimport { parseCoords } from './parser/parseCoords';\nimport { parseType, parseGradientUnits } from './parser/misc';\nimport type {\n  ColorStop,\n  GradientCoords,\n  GradientOptions,\n  GradientType,\n  GradientUnits,\n  SVGOptions,\n  SerializedGradientProps,\n} from './typedefs';\nimport { classRegistry } from '../ClassRegistry';\nimport { isPath } from '../util/typeAssertions';\nimport { escapeXml } from '../util/lang_string';\n\n/**\n * Gradient class\n * @class Gradient\n * @see {@link http://fabric5.fabricjs.com/fabric-intro-part-2#gradients}\n */\nexport class Gradient<\n  S,\n  T extends GradientType = S extends GradientType ? S : 'linear',\n> {\n  /**\n   * Horizontal offset for aligning gradients coming from SVG when outside pathgroups\n   * @type Number\n   * @default 0\n   */\n  declare offsetX: number;\n\n  /**\n   * Vertical offset for aligning gradients coming from SVG when outside pathgroups\n   * @type Number\n   * @default 0\n   */\n  declare offsetY: number;\n\n  /**\n   * A transform matrix to apply to the gradient before painting.\n   * Imported from svg gradients, is not applied with the current transform in the center.\n   * Before this transform is applied, the origin point is at the top left corner of the object\n   * plus the addition of offsetY and offsetX.\n   * @type Number[]\n   * @default null\n   */\n  declare gradientTransform?: TMat2D;\n\n  /**\n   * coordinates units for coords.\n   * If `pixels`, the number of coords are in the same unit of width / height.\n   * If set as `percentage` the coords are still a number, but 1 means 100% of width\n   * for the X and 100% of the height for the y. It can be bigger than 1 and negative.\n   * allowed values pixels or percentage.\n   * @type GradientUnits\n   * @default 'pixels'\n   */\n  declare gradientUnits: GradientUnits;\n\n  /**\n   * Gradient type linear or radial\n   * @type GradientType\n   * @default 'linear'\n   */\n  declare type: T;\n\n  /**\n   * Defines how the gradient is located in space and spread\n   * @type GradientCoords\n   */\n  declare coords: GradientCoords<T>;\n\n  /**\n   * Defines how many colors a gradient has and how they are located on the axis\n   * defined by coords\n   * @type GradientCoords\n   */\n  declare colorStops: ColorStop[];\n\n  /**\n   * If true, this object will not be exported during the serialization of a canvas\n   * @type boolean\n   */\n  declare excludeFromExport?: boolean;\n\n  /**\n   * ID used for SVG export functionalities\n   * @type number | string\n   */\n  declare readonly id: string | number;\n\n  static type = 'Gradient';\n\n  constructor(options: GradientOptions<T>) {\n    const {\n      type = 'linear' as T,\n      gradientUnits = 'pixels',\n      coords = {},\n      colorStops = [],\n      offsetX = 0,\n      offsetY = 0,\n      gradientTransform,\n      id,\n    } = options || {};\n    Object.assign(this, {\n      type,\n      gradientUnits,\n      coords: {\n        ...(type === 'radial' ? radialDefaultCoords : linearDefaultCoords),\n        ...coords,\n      },\n      colorStops,\n      offsetX,\n      offsetY,\n      gradientTransform,\n      id: id ? `${id}_${uid()}` : uid(),\n    });\n  }\n\n  /**\n   * Adds another colorStop\n   * @param {Record<string, string>} colorStop Object with offset and color\n   * @return {Gradient} thisArg\n   */\n  addColorStop(colorStops: Record<string, string>) {\n    for (const position in colorStops) {\n      this.colorStops.push({\n        offset: parseFloat(position),\n        color: colorStops[position],\n      });\n    }\n    return this;\n  }\n\n  /**\n   * Returns object representation of a gradient\n   * @param {string[]} [propertiesToInclude] Any properties that you might want to additionally include in the output\n   * @return {object}\n   */\n  toObject(\n    propertiesToInclude?: (keyof this | string)[],\n  ): SerializedGradientProps<T> {\n    return {\n      ...pick(this, propertiesToInclude as (keyof this)[]),\n      type: this.type,\n      coords: { ...this.coords },\n      colorStops: this.colorStops.map((colorStop) => ({ ...colorStop })),\n      offsetX: this.offsetX,\n      offsetY: this.offsetY,\n      gradientUnits: this.gradientUnits,\n      gradientTransform: this.gradientTransform\n        ? [...this.gradientTransform]\n        : undefined,\n    };\n  }\n\n  /* _TO_SVG_START_ */\n  /**\n   * Returns SVG representation of an gradient\n   * @param {FabricObject} object Object to create a gradient for\n   * @return {String} SVG representation of an gradient (linear/radial)\n   */\n  toSVG(\n    object: FabricObject,\n    {\n      additionalTransform: preTransform,\n    }: { additionalTransform?: string } = {},\n  ) {\n    const markup = [],\n      transform = (\n        this.gradientTransform\n          ? this.gradientTransform.concat()\n          : iMatrix.concat()\n      ) as TMat2D,\n      gradientUnits =\n        this.gradientUnits === 'pixels'\n          ? 'userSpaceOnUse'\n          : 'objectBoundingBox';\n    // colorStops must be sorted ascending, and guarded against deep mutations\n    const colorStops = this.colorStops\n      .map((colorStop) => ({ ...colorStop }))\n      .sort((a, b) => {\n        return a.offset - b.offset;\n      });\n\n    let offsetX = -this.offsetX,\n      offsetY = -this.offsetY;\n    if (gradientUnits === 'objectBoundingBox') {\n      offsetX /= object.width;\n      offsetY /= object.height;\n    } else {\n      offsetX += object.width / 2;\n      offsetY += object.height / 2;\n    }\n    // todo what about polygon/polyline?\n    if (isPath(object) && this.gradientUnits !== 'percentage') {\n      offsetX -= object.pathOffset.x;\n      offsetY -= object.pathOffset.y;\n    }\n    transform[4] -= offsetX;\n    transform[5] -= offsetY;\n\n    const commonAttributes = [\n      `id=\"SVGID_${escapeXml(String(this.id))}\"`,\n      `gradientUnits=\"${gradientUnits}\"`,\n      `gradientTransform=\"${\n        preTransform ? preTransform + ' ' : ''\n      }${matrixToSVG(transform)}\"`,\n      '',\n    ].join(' ');\n\n    const sanitizeCoord = (value: unknown) => parseFloat(String(value));\n\n    if (this.type === 'linear') {\n      const { x1, y1, x2, y2 } = this.coords;\n      const sx1 = sanitizeCoord(x1);\n      const sy1 = sanitizeCoord(y1);\n      const sx2 = sanitizeCoord(x2);\n      const sy2 = sanitizeCoord(y2);\n      markup.push(\n        '<linearGradient ',\n        commonAttributes,\n        ' x1=\"',\n        sx1,\n        '\" y1=\"',\n        sy1,\n        '\" x2=\"',\n        sx2,\n        '\" y2=\"',\n        sy2,\n        '\">\\n',\n      );\n    } else if (this.type === 'radial') {\n      const { x1, y1, x2, y2, r1, r2 } = this\n        .coords as GradientCoords<'radial'>;\n      const sx1 = sanitizeCoord(x1);\n      const sy1 = sanitizeCoord(y1);\n      const sx2 = sanitizeCoord(x2);\n      const sy2 = sanitizeCoord(y2);\n      const sr1 = sanitizeCoord(r1);\n      const sr2 = sanitizeCoord(r2);\n      const needsSwap = sr1 > sr2;\n      // svg radial gradient has just 1 radius. the biggest.\n      markup.push(\n        '<radialGradient ',\n        commonAttributes,\n        ' cx=\"',\n        needsSwap ? sx1 : sx2,\n        '\" cy=\"',\n        needsSwap ? sy1 : sy2,\n        '\" r=\"',\n        needsSwap ? sr1 : sr2,\n        '\" fx=\"',\n        needsSwap ? sx2 : sx1,\n        '\" fy=\"',\n        needsSwap ? sy2 : sy1,\n        '\">\\n',\n      );\n      if (needsSwap) {\n        // svg goes from internal to external radius. if radius are inverted, swap color stops.\n        colorStops.reverse(); //  mutates array\n        colorStops.forEach((colorStop) => {\n          colorStop.offset = 1 - colorStop.offset;\n        });\n      }\n      const minRadius = Math.min(sr1, sr2);\n      if (minRadius > 0) {\n        // i have to shift all colorStops and add new one in 0.\n        const maxRadius = Math.max(sr1, sr2),\n          percentageShift = minRadius / maxRadius;\n        colorStops.forEach((colorStop) => {\n          colorStop.offset += percentageShift * (1 - colorStop.offset);\n        });\n      }\n    }\n    // todo make a malicious script tag injection test with color and also apply a fix with escapeXml\n    colorStops.forEach(({ color, offset }) => {\n      markup.push(\n        `<stop offset=\"${offset * 100}%\" style=\"stop-color:${color};\"/>\\n`,\n      );\n    });\n\n    markup.push(\n      this.type === 'linear' ? '</linearGradient>' : '</radialGradient>',\n      '\\n',\n    );\n\n    return markup.join('');\n  }\n  /* _TO_SVG_END_ */\n\n  /**\n   * Returns an instance of CanvasGradient\n   * @param {CanvasRenderingContext2D} ctx Context to render on\n   * @return {CanvasGradient}\n   */\n  toLive(ctx: CanvasRenderingContext2D): CanvasGradient {\n    const { x1, y1, x2, y2, r1, r2 } = this.coords as GradientCoords<'radial'>;\n    const gradient =\n      this.type === 'linear'\n        ? ctx.createLinearGradient(x1, y1, x2, y2)\n        : ctx.createRadialGradient(x1, y1, r1, x2, y2, r2);\n\n    this.colorStops.forEach(({ color, offset }) => {\n      gradient.addColorStop(offset, color);\n    });\n\n    return gradient;\n  }\n\n  static async fromObject(\n    options: GradientOptions<'linear'>,\n  ): Promise<Gradient<'linear'>>;\n  static async fromObject(\n    options: GradientOptions<'radial'>,\n  ): Promise<Gradient<'radial'>>;\n  static async fromObject(\n    options: GradientOptions<'linear'> | GradientOptions<'radial'>,\n  ) {\n    const { colorStops, gradientTransform } = options;\n    return new this({\n      ...options,\n      colorStops: colorStops\n        ? colorStops.map((colorStop) => ({ ...colorStop }))\n        : undefined,\n      gradientTransform: gradientTransform ? [...gradientTransform] : undefined,\n    });\n  }\n\n  /* _FROM_SVG_START_ */\n  /**\n   * Returns {@link Gradient} instance from an SVG element\n   * @param {SVGGradientElement} el SVG gradient element\n   * @param {FabricObject} instance\n   * @param {String} opacity A fill-opacity or stroke-opacity attribute to multiply to each stop's opacity.\n   * @param {SVGOptions} svgOptions an object containing the size of the SVG in order to parse correctly gradients\n   * that uses gradientUnits as 'userSpaceOnUse' and percentages.\n   * @return {Gradient} Gradient instance\n   * @see http://www.w3.org/TR/SVG/pservers.html#LinearGradientElement\n   * @see http://www.w3.org/TR/SVG/pservers.html#RadialGradientElement\n   *\n   *  @example\n   *\n   *  <linearGradient id=\"linearGrad1\">\n   *    <stop offset=\"0%\" stop-color=\"white\"/>\n   *    <stop offset=\"100%\" stop-color=\"black\"/>\n   *  </linearGradient>\n   *\n   *  OR\n   *\n   *  <linearGradient id=\"linearGrad2\">\n   *    <stop offset=\"0\" style=\"stop-color:rgb(255,255,255)\"/>\n   *    <stop offset=\"1\" style=\"stop-color:rgb(0,0,0)\"/>\n   *  </linearGradient>\n   *\n   *  OR\n   *\n   *  <radialGradient id=\"radialGrad1\">\n   *    <stop offset=\"0%\" stop-color=\"white\" stop-opacity=\"1\" />\n   *    <stop offset=\"50%\" stop-color=\"black\" stop-opacity=\"0.5\" />\n   *    <stop offset=\"100%\" stop-color=\"white\" stop-opacity=\"1\" />\n   *  </radialGradient>\n   *\n   *  OR\n   *\n   *  <radialGradient id=\"radialGrad2\">\n   *    <stop offset=\"0\" stop-color=\"rgb(255,255,255)\" />\n   *    <stop offset=\"0.5\" stop-color=\"rgb(0,0,0)\" />\n   *    <stop offset=\"1\" stop-color=\"rgb(255,255,255)\" />\n   *  </radialGradient>\n   *\n   */\n  static fromElement(\n    el: SVGGradientElement,\n    instance: FabricObject,\n    svgOptions: SVGOptions,\n  ): Gradient<GradientType> {\n    const gradientUnits = parseGradientUnits(el);\n    const center = instance._findCenterFromElement();\n    return new this({\n      id: el.getAttribute('id') || undefined,\n      type: parseType(el),\n      coords: parseCoords(el, {\n        width: svgOptions.viewBoxWidth || svgOptions.width,\n        height: svgOptions.viewBoxHeight || svgOptions.height,\n      }),\n      colorStops: parseColorStops(el, svgOptions.opacity),\n      gradientUnits,\n      gradientTransform: parseTransformAttribute(\n        el.getAttribute('gradientTransform') || '',\n      ),\n      ...(gradientUnits === 'pixels'\n        ? {\n            offsetX: instance.width / 2 - center.x,\n            offsetY: instance.height / 2 - center.y,\n          }\n        : {\n            offsetX: 0,\n            offsetY: 0,\n          }),\n    });\n  }\n  /* _FROM_SVG_END_ */\n}\n\nclassRegistry.setClass(Gradient, 'gradient');\nclassRegistry.setClass(Gradient, 'linear');\nclassRegistry.setClass(Gradient, 'radial');\n"],"names":["Gradient","constructor","options","type","gradientUnits","coords","colorStops","offsetX","offsetY","gradientTransform","id","Object","assign","radialDefaultCoords","linearDefaultCoords","uid","addColorStop","position","push","offset","parseFloat","color","toObject","propertiesToInclude","pick","map","colorStop","undefined","toSVG","object","additionalTransform","preTransform","arguments","length","markup","transform","concat","iMatrix","sort","a","b","width","height","isPath","pathOffset","x","y","commonAttributes","escapeXml","String","matrixToSVG","join","sanitizeCoord","value","x1","y1","x2","y2","sx1","sy1","sx2","sy2","r1","r2","sr1","sr2","needsSwap","reverse","forEach","minRadius","Math","min","maxRadius","max","percentageShift","_ref","toLive","ctx","gradient","createLinearGradient","createRadialGradient","_ref2","fromObject","fromElement","el","instance","svgOptions","parseGradientUnits","center","_findCenterFromElement","getAttribute","parseType","parseCoords","viewBoxWidth","viewBoxHeight","parseColorStops","opacity","parseTransformAttribute","_defineProperty","classRegistry","setClass"],"mappings":"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"}

package/dist/src/shapes/Circle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Circle.d.ts","sourceRoot":"","sources":["../../../src/shapes/Circle.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAOrD,OAAO,EAAE,YAAY,EAAmB,MAAM,uBAAuB,CAAC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACzE,OAAO,KAAK,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAC/E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAGnD,UAAU,iBAAiB;IACzB;;;;OAIG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;;;OAIG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;;;OAKG;IACH,gBAAgB,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,qBACf,SAAQ,qBAAqB,EAC3B,iBAAiB;CAAG;AAExB,MAAM,WAAW,WAAY,SAAQ,iBAAiB,EAAE,iBAAiB;CAAG;AAS5E,eAAO,MAAM,mBAAmB,EAAE,OAAO,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAKjE,CAAC;AAEF,qBAAa,MAAM,CACf,KAAK,SAAS,QAAQ,CAAC,WAAW,CAAC,GAAG,OAAO,CAAC,WAAW,CAAC,EAC1D,MAAM,SAAS,qBAAqB,GAAG,qBAAqB,EAC5D,SAAS,SAAS,YAAY,GAAG,YAAY,CAE/C,SAAQ,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,CAC7C,YAAW,iBAAiB;IAEpB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,OAAO,CAAC;IAElC,MAAM,CAAC,IAAI,SAAY;IAEvB,MAAM,CAAC,eAAe,WAAyC;IAE/D,MAAM,CAAC,WAAW,+FAAuB;IAEzC,MAAM,CAAC,WAAW,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAOzC;;;OAGG;gBACS,OAAO,CAAC,EAAE,KAAK;IAM3B;;;;OAIG;IACH,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG;IAU5B;;;OAGG;IACH,OAAO,CAAC,GAAG,EAAE,wBAAwB;IAarC;;;OAGG;IACH,UAAU,IAAI,MAAM;IAIpB;;;OAGG;IACH,UAAU,IAAI,MAAM;IAIpB;;OAEG;IACH,SAAS,CAAC,KAAK,EAAE,MAAM;IAKvB;;;;OAIG;IACH,QAAQ,CACN,CAAC,SAAS,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,MAAM,MAAM,CAAC,EAC5D,CAAC,SAAS,MAAM,CAAC,GAAG,KAAK,EACzB,mBAAmB,GAAE,CAAC,EAAO,GAAG,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,MAAM;IAMrD;;;;OAIG;IACH,MAAM,IAAI,MAAM,EAAE;IAgClB;;;OAGG;IACH,MAAM,CAAC,eAAe,WAA2C;IAEjE;;;;;OAKG;WACU,WAAW,CACtB,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,SAAS,EAClB,QAAQ,CAAC,EAAE,QAAQ,GAClB,OAAO,CAAC,MAAM,CAAC;IAwBlB;;OAEG;IACH,MAAM,CAAC,UAAU,CAAC,CAAC,SAAS,QAAQ,CAAC,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;CAGvE"}
+{"version":3,"file":"Circle.d.ts","sourceRoot":"","sources":["../../../src/shapes/Circle.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAOrD,OAAO,EAAE,YAAY,EAAmB,MAAM,uBAAuB,CAAC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACzE,OAAO,KAAK,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAC/E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAInD,UAAU,iBAAiB;IACzB;;;;OAIG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;;;OAIG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;;;OAKG;IACH,gBAAgB,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,qBACf,SAAQ,qBAAqB,EAAE,iBAAiB;CAAG;AAErD,MAAM,WAAW,WAAY,SAAQ,iBAAiB,EAAE,iBAAiB;CAAG;AAS5E,eAAO,MAAM,mBAAmB,EAAE,OAAO,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAKjE,CAAC;AAEF,qBAAa,MAAM,CACjB,KAAK,SAAS,QAAQ,CAAC,WAAW,CAAC,GAAG,OAAO,CAAC,WAAW,CAAC,EAC1D,MAAM,SAAS,qBAAqB,GAAG,qBAAqB,EAC5D,SAAS,SAAS,YAAY,GAAG,YAAY,CAE7C,SAAQ,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,CAC7C,YAAW,iBAAiB;IAEpB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,OAAO,CAAC;IAElC,MAAM,CAAC,IAAI,SAAY;IAEvB,MAAM,CAAC,eAAe,WAAyC;IAE/D,MAAM,CAAC,WAAW,+FAAuB;IAEzC,MAAM,CAAC,WAAW,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAOzC;;;OAGG;gBACS,OAAO,CAAC,EAAE,KAAK;IAM3B;;;;OAIG;IACH,IAAI,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG;IAU5B;;;OAGG;IACH,OAAO,CAAC,GAAG,EAAE,wBAAwB;IAarC;;;OAGG;IACH,UAAU,IAAI,MAAM;IAIpB;;;OAGG;IACH,UAAU,IAAI,MAAM;IAIpB;;OAEG;IACH,SAAS,CAAC,KAAK,EAAE,MAAM;IAKvB;;;;OAIG;IACH,QAAQ,CACN,CAAC,SAAS,IAAI,CAAC,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,EAAE,MAAM,MAAM,CAAC,EAC5D,CAAC,SAAS,MAAM,CAAC,GAAG,KAAK,EACzB,mBAAmB,GAAE,CAAC,EAAO,GAAG,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,MAAM;IAMrD;;;;OAIG;IACH,MAAM,IAAI,MAAM,EAAE;IAgClB;;;OAGG;IACH,MAAM,CAAC,eAAe,WAA2C;IAEjE;;;;;OAKG;WACU,WAAW,CACtB,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,SAAS,EAClB,QAAQ,CAAC,EAAE,QAAQ,GAClB,OAAO,CAAC,MAAM,CAAC;IAwBlB;;OAEG;IACH,MAAM,CAAC,UAAU,CAAC,CAAC,SAAS,QAAQ,CAAC,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;CAGvE"}

package/dist/src/shapes/Circle.min.mjs

@@ -1,2 +1,2 @@
-import{defineProperty as t}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{SHARED_ATTRIBUTES as s}from"../parser/attributes.min.mjs";import{parseAttributes as e}from"../parser/parseAttributes.min.mjs";import{cos as r}from"../util/misc/cos.min.mjs";import{degreesToRadians as i}from"../util/misc/radiansDegreesConversion.min.mjs";import{sin as n}from"../util/misc/sin.min.mjs";import{classRegistry as o}from"../ClassRegistry.min.mjs";import{FabricObject as a}from"./Object/FabricObject.min.mjs";import{SCALE_X as u,SCALE_Y as m}from"../constants.min.mjs";import{cacheProperties as c}from"./Object/defaultValues.min.mjs";const l=["radius","startAngle","endAngle","counterClockwise"],h={radius:0,startAngle:0,endAngle:360,counterClockwise:!1};class d extends a{static getDefaults(){return{...super.getDefaults(),...d.ownDefaults}}constructor(t){super(),Object.assign(this,d.ownDefaults),this.setOptions(t)}_set(t,s){return super._set(t,s),"radius"===t&&this.setRadius(s),this}_render(t){t.beginPath(),t.arc(0,0,this.radius,i(this.startAngle),i(this.endAngle),this.counterClockwise),this._renderPaintInOrder(t)}getRadiusX(){return this.get("radius")*this.get(u)}getRadiusY(){return this.get("radius")*this.get(m)}setRadius(t){this.radius=t,this.set({width:2*t,height:2*t})}toObject(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[];return super.toObject([...l,...t])}_toSVG(){const t=(this.endAngle-this.startAngle)%360;if(0===t)return["<circle ","COMMON_PARTS",'cx="0" cy="0" ','r="',`${this.radius}`,'" />\n'];{const{radius:s}=this,e=i(this.startAngle),o=i(this.endAngle),a=r(e)*s,u=n(e)*s,m=r(o)*s,c=n(o)*s;return[`<path d="M ${a} ${u} A ${s} ${s} 0 ${t>180?1:0} ${this.counterClockwise?0:1} ${m} ${c}" `,"COMMON_PARTS"," />\n"]}}static async fromElement(t,s,r){const{left:i=0,top:n=0,radius:o=0,...a}=e(t,this.ATTRIBUTE_NAMES,r);return new this({...a,radius:o,left:i-o,top:n-o})}static fromObject(t){return super._fromObject(t)}}t(d,"type","Circle"),t(d,"cacheProperties",[...c,...l]),t(d,"ownDefaults",h),t(d,"ATTRIBUTE_NAMES",["cx","cy","r",...s]),o.setClass(d),o.setSVGClass(d);export{d as Circle,h as circleDefaultValues};
+import{defineProperty as t}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{SHARED_ATTRIBUTES as s}from"../parser/attributes.min.mjs";import{parseAttributes as e}from"../parser/parseAttributes.min.mjs";import{cos as r}from"../util/misc/cos.min.mjs";import{degreesToRadians as i}from"../util/misc/radiansDegreesConversion.min.mjs";import{sin as n}from"../util/misc/sin.min.mjs";import{classRegistry as o}from"../ClassRegistry.min.mjs";import{FabricObject as a}from"./Object/FabricObject.min.mjs";import{SCALE_X as m,SCALE_Y as u}from"../constants.min.mjs";import{escapeXml as c}from"../util/lang_string.min.mjs";import{cacheProperties as l}from"./Object/defaultValues.min.mjs";const p=["radius","startAngle","endAngle","counterClockwise"],d={radius:0,startAngle:0,endAngle:360,counterClockwise:!1};class h extends a{static getDefaults(){return{...super.getDefaults(),...h.ownDefaults}}constructor(t){super(),Object.assign(this,h.ownDefaults),this.setOptions(t)}_set(t,s){return super._set(t,s),"radius"===t&&this.setRadius(s),this}_render(t){t.beginPath(),t.arc(0,0,this.radius,i(this.startAngle),i(this.endAngle),this.counterClockwise),this._renderPaintInOrder(t)}getRadiusX(){return this.get("radius")*this.get(m)}getRadiusY(){return this.get("radius")*this.get(u)}setRadius(t){this.radius=t,this.set({width:2*t,height:2*t})}toObject(){let t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[];return super.toObject([...p,...t])}_toSVG(){const{radius:t,startAngle:s,endAngle:e}=this,o=(e-s)%360;if(0===o)return["<circle ","COMMON_PARTS",'cx="0" cy="0" ','r="',`${c(t)}`,'" />\n'];{const a=i(s),m=i(e),u=r(a)*t,c=n(a)*t,l=r(m)*t,p=n(m)*t;return[`<path d="M ${u} ${c} A ${t} ${t} 0 ${o>180?1:0} ${this.counterClockwise?0:1} ${l} ${p}" `,"COMMON_PARTS"," />\n"]}}static async fromElement(t,s,r){const{left:i=0,top:n=0,radius:o=0,...a}=e(t,this.ATTRIBUTE_NAMES,r);return new this({...a,radius:o,left:i-o,top:n-o})}static fromObject(t){return super._fromObject(t)}}t(h,"type","Circle"),t(h,"cacheProperties",[...l,...p]),t(h,"ownDefaults",d),t(h,"ATTRIBUTE_NAMES",["cx","cy","r",...s]),o.setClass(h),o.setSVGClass(h);export{h as Circle,d as circleDefaultValues};
 //# sourceMappingURL=Circle.min.mjs.map