fabric 7.3.1 → 7.4.0

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

@@ -1 +1 @@
-{"version":3,"file":"Gradient.min.mjs","names":[],"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"],"mappings":"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"}
+{"version":3,"file":"Gradient.min.mjs","names":[],"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 { isSafeSvgStyleValue } from '../util/internals/svgExportCheck';\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 { Color } from '../color/Color';\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    colorStops.forEach(({ color, offset }) => {\n      const rawColor = String(color);\n      // `escapeXml` protects the SVG attribute, but the value is also embedded in\n      // a CSS declaration, so reject tokens that can break either context.\n      const serializedColor = isSafeSvgStyleValue(rawColor)\n        ? rawColor\n        : new Color(rawColor).toRgba();\n      markup.push(\n        `<stop offset=\"${offset * 100}%\" style=\"stop-color:${escapeXml(serializedColor)};\"/>\\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"],"mappings":"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"}

package/dist/src/gradient/Gradient.mjs

@@ -1,4 +1,4 @@
-import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.mjs";
+import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.mjs";
 import { iMatrix } from "../constants.mjs";
 import { classRegistry } from "../ClassRegistry.mjs";
 import { uid } from "../util/internals/uid.mjs";
@@ -6,6 +6,8 @@ import { pick } from "../util/misc/pick.mjs";
 import { matrixToSVG } from "../util/misc/svgExport.mjs";
 import { isPath } from "../util/typeAssertions.mjs";
 import { escapeXml } from "../util/lang_string.mjs";
+import { isSafeSvgStyleValue } from "../util/internals/svgExportCheck.mjs";
+import { Color } from "../color/Color.mjs";
 import { parseTransformAttribute } from "../parser/parseTransformAttribute.mjs";
 import { linearDefaultCoords, radialDefaultCoords } from "./constants.mjs";
 import { parseColorStops } from "./parser/parseColorStops.mjs";
@@ -126,7 +128,9 @@ var Gradient = class {
 			}
 		}
 		colorStops.forEach(({ color, offset }) => {
-			markup.push(`<stop offset="${offset * 100}%" style="stop-color:${color};"/>\n`);
+			const rawColor = String(color);
+			const serializedColor = isSafeSvgStyleValue(rawColor) ? rawColor : new Color(rawColor).toRgba();
+			markup.push(`<stop offset="${offset * 100}%" style="stop-color:${escapeXml(serializedColor)};"/>\n`);
 		});
 		markup.push(this.type === "linear" ? "</linearGradient>" : "</radialGradient>", "\n");
 		return markup.join("");

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

@@ -1 +1 @@
-{"version":3,"file":"Gradient.mjs","names":[],"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"],"mappings":"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"}
+{"version":3,"file":"Gradient.mjs","names":[],"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 { isSafeSvgStyleValue } from '../util/internals/svgExportCheck';\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 { Color } from '../color/Color';\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    colorStops.forEach(({ color, offset }) => {\n      const rawColor = String(color);\n      // `escapeXml` protects the SVG attribute, but the value is also embedded in\n      // a CSS declaration, so reject tokens that can break either context.\n      const serializedColor = isSafeSvgStyleValue(rawColor)\n        ? rawColor\n        : new Color(rawColor).toRgba();\n      markup.push(\n        `<stop offset=\"${offset * 100}%\" style=\"stop-color:${escapeXml(serializedColor)};\"/>\\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"],"mappings":"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"}

package/dist/src/gradient/typedefs.d.ts

@@ -8,19 +8,19 @@ export type ColorStop = {
 };
 export type LinearGradientCoords<T extends GradientCoordValue> = {
     /**
-     * X coordiante of the first point
+     * X coordinate of the first point
      */
     x1: T;
     /**
-     * Y coordiante of the first point
+     * Y coordinate of the first point
      */
     y1: T;
     /**
-     * X coordiante of the second point
+     * X coordinate of the second point
      */
     x2: T;
     /**
-     * Y coordiante of the second point
+     * Y coordinate of the second point
      */
     y2: T;
 };
@@ -30,15 +30,15 @@ export type RadialGradientCoords<T extends GradientCoordValue> = {
      */
     x1: T;
     /**
-     * Y coordiante of the first focal point
+     * Y coordinate of the first focal point
      */
     y1: T;
     /**
-     * X coordiante of the second focal point
+     * X coordinate of the second focal point
      */
     x2: T;
     /**
-     * Y coordiante of the second focal point
+     * Y coordinate of the second focal point
      */
     y2: T;
     /**

package/dist/src/parser/applyViewboxTransform.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"applyViewboxTransform.d.ts","sourceRoot":"","sources":["../../../src/parser/applyViewboxTransform.ts"],"names":[],"mappings":"AAQA,MAAM,MAAM,sBAAsB,GAAG,OAAO,CAAC;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC,CAAC;AAEH;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,OAAO,GACf,sBAAsB,CAuJxB"}
+{"version":3,"file":"applyViewboxTransform.d.ts","sourceRoot":"","sources":["../../../src/parser/applyViewboxTransform.ts"],"names":[],"mappings":"AAQA,MAAM,MAAM,sBAAsB,GAAG,OAAO,CAAC;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC,CAAC;AAEH;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,OAAO,GACf,sBAAsB,CAqJxB"}

package/dist/src/parser/applyViewboxTransform.min.mjs

@@ -1,2 +1,2 @@
-import"../constants.min.mjs";import{parsePreserveAspectRatioAttribute as e,parseUnit as t}from"../util/misc/svgParsing.min.mjs";import{reViewBoxAttrValue as n,svgNS as r,svgViewBoxElementsRegEx as i}from"./constants.min.mjs";function a(a){if(!i.test(a.nodeName))return{};let o=a.getAttribute(`viewBox`),s,c,l=1,u=1,d=0,f=0,p=a.getAttribute(`width`),m=a.getAttribute(`height`),h=a.getAttribute(`x`)||0,g=a.getAttribute(`y`)||0,_=!(o&&n.test(o)),v=!p||!m||p===`100%`||m===`100%`,y=``,b=0,x=0;if(_&&(h||g)&&a.parentNode&&a.parentNode.nodeName!==`#document`&&(y=` translate(`+t(h||`0`)+` `+t(g||`0`)+`) `,s=(a.getAttribute(`transform`)||``)+y,a.setAttribute(`transform`,s),a.removeAttribute(`x`),a.removeAttribute(`y`)),_&&v)return{width:0,height:0};let S={width:0,height:0};if(_)return S.width=t(p),S.height=t(m),S;let C=o.match(n);d=-parseFloat(C[1]),f=-parseFloat(C[2]);let w=parseFloat(C[3]),T=parseFloat(C[4]);S.minX=d,S.minY=f,S.viewBoxWidth=w,S.viewBoxHeight=T,v?(S.width=w,S.height=T):(S.width=t(p),S.height=t(m),l=S.width/w,u=S.height/T);let E=e(a.getAttribute(`preserveAspectRatio`)||``);if(E.alignX!==`none`&&(E.meetOrSlice===`meet`&&(u=l=l>u?u:l),E.meetOrSlice===`slice`&&(u=l=l>u?l:u),b=S.width-w*l,x=S.height-T*l,E.alignX===`Mid`&&(b/=2),E.alignY===`Mid`&&(x/=2),E.alignX===`Min`&&(b=0),E.alignY===`Min`&&(x=0)),l===1&&u===1&&d===0&&f===0&&h===0&&g===0)return S;if((h||g)&&a.parentNode.nodeName!==`#document`&&(y=` translate(`+t(h||`0`)+` `+t(g||`0`)+`) `),s=y+` matrix(`+l+` 0 0 `+u+` `+(d*l+b)+` `+(f*u+x)+`) `,a.nodeName===`svg`){for(c=a.ownerDocument.createElementNS(r,`g`);a.firstChild;)c.appendChild(a.firstChild);a.appendChild(c)}else c=a,c.removeAttribute(`x`),c.removeAttribute(`y`),s=c.getAttribute(`transform`)+s;return c.setAttribute(`transform`,s),S}export{a as applyViewboxTransform};
+import"../constants.min.mjs";import{parsePreserveAspectRatioAttribute as e,parseUnit as t}from"../util/misc/svgParsing.min.mjs";import{reViewBoxAttrValue as n,svgNS as r,svgViewBoxElementsRegEx as i}from"./constants.min.mjs";function a(a){if(!i.test(a.nodeName))return{};let o=a.getAttribute(`viewBox`),s,c,l=1,u=1,d=a.getAttribute(`width`),f=a.getAttribute(`height`),p=a.getAttribute(`x`)||0,m=a.getAttribute(`y`)||0,h=!(o&&n.test(o)),g=!d||!f||d===`100%`||f===`100%`,_=``,v=0,y=0;if(h&&(p||m)&&a.parentNode&&a.parentNode.nodeName!==`#document`&&(_=` translate(`+t(p||`0`)+` `+t(m||`0`)+`) `,s=(a.getAttribute(`transform`)||``)+_,a.setAttribute(`transform`,s),a.removeAttribute(`x`),a.removeAttribute(`y`)),h&&g)return{width:0,height:0};let b={width:0,height:0};if(h)return b.width=t(d),b.height=t(f),b;let x=o.match(n),S=-parseFloat(x[1]),C=-parseFloat(x[2]),w=parseFloat(x[3]),T=parseFloat(x[4]);b.minX=S,b.minY=C,b.viewBoxWidth=w,b.viewBoxHeight=T,g?(b.width=w,b.height=T):(b.width=t(d),b.height=t(f),l=b.width/w,u=b.height/T);let E=e(a.getAttribute(`preserveAspectRatio`)||``);if(E.alignX!==`none`&&(E.meetOrSlice===`meet`&&(u=l=l>u?u:l),E.meetOrSlice===`slice`&&(u=l=l>u?l:u),v=b.width-w*l,y=b.height-T*l,E.alignX===`Mid`&&(v/=2),E.alignY===`Mid`&&(y/=2),E.alignX===`Min`&&(v=0),E.alignY===`Min`&&(y=0)),l===1&&u===1&&S===0&&C===0&&p===0&&m===0)return b;if((p||m)&&a.parentNode.nodeName!==`#document`&&(_=` translate(`+t(p||`0`)+` `+t(m||`0`)+`) `),s=_+` matrix(`+l+` 0 0 `+u+` `+(S*l+v)+` `+(C*u+y)+`) `,a.nodeName===`svg`){for(c=a.ownerDocument.createElementNS(r,`g`);a.firstChild;)c.appendChild(a.firstChild);a.appendChild(c)}else c=a,c.removeAttribute(`x`),c.removeAttribute(`y`),s=c.getAttribute(`transform`)+s;return c.setAttribute(`transform`,s),b}export{a as applyViewboxTransform};
 //# sourceMappingURL=applyViewboxTransform.min.mjs.map

package/dist/src/parser/applyViewboxTransform.min.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"applyViewboxTransform.min.mjs","names":[],"sources":["../../../src/parser/applyViewboxTransform.ts"],"sourcesContent":["import { svgNS } from './constants';\nimport {\n  parsePreserveAspectRatioAttribute,\n  parseUnit,\n} from '../util/misc/svgParsing';\nimport { svgViewBoxElementsRegEx, reViewBoxAttrValue } from './constants';\nimport { NONE } from '../constants';\n\nexport type ParsedViewboxTransform = Partial<{\n  width: number;\n  height: number;\n  minX: number;\n  minY: number;\n  viewBoxWidth: number;\n  viewBoxHeight: number;\n}>;\n\n/**\n * Add a <g> element that envelop all child elements and makes the viewbox transformMatrix descend on all elements\n */\nexport function applyViewboxTransform(\n  element: Element,\n): ParsedViewboxTransform {\n  if (!svgViewBoxElementsRegEx.test(element.nodeName)) {\n    return {};\n  }\n  const viewBoxAttr: string | null = element.getAttribute('viewBox');\n  let scaleX = 1;\n  let scaleY = 1;\n  let minX = 0;\n  let minY = 0;\n  let matrix;\n  let el;\n  const widthAttr = element.getAttribute('width');\n  const heightAttr = element.getAttribute('height');\n  const x = element.getAttribute('x') || 0;\n  const y = element.getAttribute('y') || 0;\n  const goodViewbox = viewBoxAttr && reViewBoxAttrValue.test(viewBoxAttr);\n  const missingViewBox = !goodViewbox;\n  const missingDimAttr =\n    !widthAttr || !heightAttr || widthAttr === '100%' || heightAttr === '100%';\n\n  let translateMatrix = '';\n  let widthDiff = 0;\n  let heightDiff = 0;\n\n  if (missingViewBox) {\n    if (\n      (x || y) &&\n      element.parentNode &&\n      element.parentNode.nodeName !== '#document'\n    ) {\n      translateMatrix =\n        ' translate(' + parseUnit(x || '0') + ' ' + parseUnit(y || '0') + ') ';\n      matrix = (element.getAttribute('transform') || '') + translateMatrix;\n      element.setAttribute('transform', matrix);\n      element.removeAttribute('x');\n      element.removeAttribute('y');\n    }\n  }\n\n  if (missingViewBox && missingDimAttr) {\n    return {\n      width: 0,\n      height: 0,\n    };\n  }\n\n  const parsedDim: ParsedViewboxTransform = {\n    width: 0,\n    height: 0,\n  };\n\n  if (missingViewBox) {\n    parsedDim.width = parseUnit(widthAttr!);\n    parsedDim.height = parseUnit(heightAttr!);\n    // set a transform for elements that have x y and are inner(only) SVGs\n    return parsedDim;\n  }\n\n  const pasedViewBox = viewBoxAttr.match(reViewBoxAttrValue)!;\n  minX = -parseFloat(pasedViewBox[1]);\n  minY = -parseFloat(pasedViewBox[2]);\n  const viewBoxWidth = parseFloat(pasedViewBox[3]);\n  const viewBoxHeight = parseFloat(pasedViewBox[4]);\n  parsedDim.minX = minX;\n  parsedDim.minY = minY;\n  parsedDim.viewBoxWidth = viewBoxWidth;\n  parsedDim.viewBoxHeight = viewBoxHeight;\n  if (!missingDimAttr) {\n    parsedDim.width = parseUnit(widthAttr);\n    parsedDim.height = parseUnit(heightAttr);\n    scaleX = parsedDim.width / viewBoxWidth;\n    scaleY = parsedDim.height / viewBoxHeight;\n  } else {\n    parsedDim.width = viewBoxWidth;\n    parsedDim.height = viewBoxHeight;\n  }\n\n  // default is to preserve aspect ratio\n  const preserveAspectRatio = parsePreserveAspectRatioAttribute(\n    element.getAttribute('preserveAspectRatio') || '',\n  );\n  if (preserveAspectRatio.alignX !== NONE) {\n    //translate all container for the effect of Mid, Min, Max\n    if (preserveAspectRatio.meetOrSlice === 'meet') {\n      scaleY = scaleX = scaleX > scaleY ? scaleY : scaleX;\n      // calculate additional translation to move the viewbox\n    }\n    if (preserveAspectRatio.meetOrSlice === 'slice') {\n      scaleY = scaleX = scaleX > scaleY ? scaleX : scaleY;\n      // calculate additional translation to move the viewbox\n    }\n    widthDiff = parsedDim.width - viewBoxWidth * scaleX;\n    heightDiff = parsedDim.height - viewBoxHeight * scaleX;\n    if (preserveAspectRatio.alignX === 'Mid') {\n      widthDiff /= 2;\n    }\n    if (preserveAspectRatio.alignY === 'Mid') {\n      heightDiff /= 2;\n    }\n    if (preserveAspectRatio.alignX === 'Min') {\n      widthDiff = 0;\n    }\n    if (preserveAspectRatio.alignY === 'Min') {\n      heightDiff = 0;\n    }\n  }\n\n  if (\n    scaleX === 1 &&\n    scaleY === 1 &&\n    minX === 0 &&\n    minY === 0 &&\n    x === 0 &&\n    y === 0\n  ) {\n    return parsedDim;\n  }\n  if ((x || y) && element.parentNode!.nodeName !== '#document') {\n    translateMatrix =\n      ' translate(' + parseUnit(x || '0') + ' ' + parseUnit(y || '0') + ') ';\n  }\n\n  matrix =\n    translateMatrix +\n    ' matrix(' +\n    scaleX +\n    ' 0' +\n    ' 0 ' +\n    scaleY +\n    ' ' +\n    (minX * scaleX + widthDiff) +\n    ' ' +\n    (minY * scaleY + heightDiff) +\n    ') ';\n  // seems unused.\n  // parsedDim.viewboxTransform = parseTransformAttribute(matrix);\n  if (element.nodeName === 'svg') {\n    el = element.ownerDocument.createElementNS(svgNS, 'g');\n    // element.firstChild != null\n    while (element.firstChild) {\n      el.appendChild(element.firstChild);\n    }\n    element.appendChild(el);\n  } else {\n    el = element;\n    el.removeAttribute('x');\n    el.removeAttribute('y');\n    matrix = el.getAttribute('transform') + matrix;\n  }\n  el.setAttribute('transform', matrix);\n  return parsedDim;\n}\n"],"mappings":"iOAoBA,SAAgB,EACd,EAAA,CAEA,GAAA,CAAK,EAAwB,KAAK,EAAQ,SAAA,CACxC,MAAO,EAAA,CAET,IAAM,EAA6B,EAAQ,aAAa,UAAA,CAKpD,EACA,EALA,EAAS,EACT,EAAS,EACT,EAAO,EACP,EAAO,EAGL,EAAY,EAAQ,aAAa,QAAA,CACjC,EAAa,EAAQ,aAAa,SAAA,CAClC,EAAI,EAAQ,aAAa,IAAA,EAAQ,EACjC,EAAI,EAAQ,aAAa,IAAA,EAAQ,EAEjC,EAAA,EADc,GAAe,EAAmB,KAAK,EAAA,EAErD,EAAA,CACH,GAAA,CAAc,GAAc,IAAc,QAAU,IAAe,OAElE,EAAkB,GAClB,EAAY,EACZ,EAAa,EAiBjB,GAfI,IAEC,GAAK,IACN,EAAQ,YACR,EAAQ,WAAW,WAAa,cAEhC,EACE,cAAgB,EAAU,GAAK,IAAA,CAAO,IAAM,EAAU,GAAK,IAAA,CAAO,KACpE,GAAU,EAAQ,aAAa,YAAA,EAAgB,IAAM,EACrD,EAAQ,aAAa,YAAa,EAAA,CAClC,EAAQ,gBAAgB,IAAA,CACxB,EAAQ,gBAAgB,IAAA,EAIxB,GAAkB,EACpB,MAAO,CACL,MAAO,EACP,OAAQ,EAAA,CAIZ,IAAM,EAAoC,CACxC,MAAO,EACP,OAAQ,EAAA,CAGV,GAAI,EAIF,MAHA,GAAU,MAAQ,EAAU,EAAA,CAC5B,EAAU,OAAS,EAAU,EAAA,CAEtB,EAGT,IAAM,EAAe,EAAY,MAAM,EAAA,CACvC,EAAA,CAAQ,WAAW,EAAa,GAAA,CAChC,EAAA,CAAQ,WAAW,EAAa,GAAA,CAChC,IAAM,EAAe,WAAW,EAAa,GAAA,CACvC,EAAgB,WAAW,EAAa,GAAA,CAC9C,EAAU,KAAO,EACjB,EAAU,KAAO,EACjB,EAAU,aAAe,EACzB,EAAU,cAAgB,EACrB,GAMH,EAAU,MAAQ,EAClB,EAAU,OAAS,IANnB,EAAU,MAAQ,EAAU,EAAA,CAC5B,EAAU,OAAS,EAAU,EAAA,CAC7B,EAAS,EAAU,MAAQ,EAC3B,EAAS,EAAU,OAAS,GAO9B,IAAM,EAAsB,EAC1B,EAAQ,aAAa,sBAAA,EAA0B,GAAA,CA4BjD,GA1BI,EAAoB,SAAA,SAElB,EAAoB,cAAgB,SACtC,EAAS,EAAS,EAAS,EAAS,EAAS,GAG3C,EAAoB,cAAgB,UACtC,EAAS,EAAS,EAAS,EAAS,EAAS,GAG/C,EAAY,EAAU,MAAQ,EAAe,EAC7C,EAAa,EAAU,OAAS,EAAgB,EAC5C,EAAoB,SAAW,QACjC,GAAa,GAEX,EAAoB,SAAW,QACjC,GAAc,GAEZ,EAAoB,SAAW,QACjC,EAAY,GAEV,EAAoB,SAAW,QACjC,EAAa,IAKf,IAAW,GACX,IAAW,GACX,IAAS,GACT,IAAS,GACT,IAAM,GACN,IAAM,EAEN,OAAO,EAqBT,IAnBK,GAAK,IAAM,EAAQ,WAAY,WAAa,cAC/C,EACE,cAAgB,EAAU,GAAK,IAAA,CAAO,IAAM,EAAU,GAAK,IAAA,CAAO,MAGtE,EACE,EACA,WACA,EACA,QAEA,EACA,KACC,EAAO,EAAS,GACjB,KACC,EAAO,EAAS,GACjB,KAGE,EAAQ,WAAa,MAAO,CAG9B,IAFA,EAAK,EAAQ,cAAc,gBAAgB,EAAO,IAAA,CAE3C,EAAQ,YACb,EAAG,YAAY,EAAQ,WAAA,CAEzB,EAAQ,YAAY,EAAA,MAEpB,EAAK,EACL,EAAG,gBAAgB,IAAA,CACnB,EAAG,gBAAgB,IAAA,CACnB,EAAS,EAAG,aAAa,YAAA,CAAe,EAG1C,OADA,EAAG,aAAa,YAAa,EAAA,CACtB,EAAA,OAAA,KAAA"}
+{"version":3,"file":"applyViewboxTransform.min.mjs","names":[],"sources":["../../../src/parser/applyViewboxTransform.ts"],"sourcesContent":["import { svgNS } from './constants';\nimport {\n  parsePreserveAspectRatioAttribute,\n  parseUnit,\n} from '../util/misc/svgParsing';\nimport { svgViewBoxElementsRegEx, reViewBoxAttrValue } from './constants';\nimport { NONE } from '../constants';\n\nexport type ParsedViewboxTransform = Partial<{\n  width: number;\n  height: number;\n  minX: number;\n  minY: number;\n  viewBoxWidth: number;\n  viewBoxHeight: number;\n}>;\n\n/**\n * Add a <g> element that envelop all child elements and makes the viewbox transformMatrix descend on all elements\n */\nexport function applyViewboxTransform(\n  element: Element,\n): ParsedViewboxTransform {\n  if (!svgViewBoxElementsRegEx.test(element.nodeName)) {\n    return {};\n  }\n  const viewBoxAttr: string | null = element.getAttribute('viewBox');\n  let scaleX = 1;\n  let scaleY = 1;\n  let matrix;\n  let el;\n  const widthAttr = element.getAttribute('width');\n  const heightAttr = element.getAttribute('height');\n  const x = element.getAttribute('x') || 0;\n  const y = element.getAttribute('y') || 0;\n  const goodViewbox = viewBoxAttr && reViewBoxAttrValue.test(viewBoxAttr);\n  const missingViewBox = !goodViewbox;\n  const missingDimAttr =\n    !widthAttr || !heightAttr || widthAttr === '100%' || heightAttr === '100%';\n\n  let translateMatrix = '';\n  let widthDiff = 0;\n  let heightDiff = 0;\n\n  if (missingViewBox) {\n    if (\n      (x || y) &&\n      element.parentNode &&\n      element.parentNode.nodeName !== '#document'\n    ) {\n      translateMatrix =\n        ' translate(' + parseUnit(x || '0') + ' ' + parseUnit(y || '0') + ') ';\n      matrix = (element.getAttribute('transform') || '') + translateMatrix;\n      element.setAttribute('transform', matrix);\n      element.removeAttribute('x');\n      element.removeAttribute('y');\n    }\n  }\n\n  if (missingViewBox && missingDimAttr) {\n    return {\n      width: 0,\n      height: 0,\n    };\n  }\n\n  const parsedDim: ParsedViewboxTransform = {\n    width: 0,\n    height: 0,\n  };\n\n  if (missingViewBox) {\n    parsedDim.width = parseUnit(widthAttr!);\n    parsedDim.height = parseUnit(heightAttr!);\n    // set a transform for elements that have x y and are inner(only) SVGs\n    return parsedDim;\n  }\n\n  const pasedViewBox = viewBoxAttr.match(reViewBoxAttrValue)!;\n  const minX = -parseFloat(pasedViewBox[1]);\n  const minY = -parseFloat(pasedViewBox[2]);\n  const viewBoxWidth = parseFloat(pasedViewBox[3]);\n  const viewBoxHeight = parseFloat(pasedViewBox[4]);\n  parsedDim.minX = minX;\n  parsedDim.minY = minY;\n  parsedDim.viewBoxWidth = viewBoxWidth;\n  parsedDim.viewBoxHeight = viewBoxHeight;\n  if (!missingDimAttr) {\n    parsedDim.width = parseUnit(widthAttr);\n    parsedDim.height = parseUnit(heightAttr);\n    scaleX = parsedDim.width / viewBoxWidth;\n    scaleY = parsedDim.height / viewBoxHeight;\n  } else {\n    parsedDim.width = viewBoxWidth;\n    parsedDim.height = viewBoxHeight;\n  }\n\n  // default is to preserve aspect ratio\n  const preserveAspectRatio = parsePreserveAspectRatioAttribute(\n    element.getAttribute('preserveAspectRatio') || '',\n  );\n  if (preserveAspectRatio.alignX !== NONE) {\n    //translate all container for the effect of Mid, Min, Max\n    if (preserveAspectRatio.meetOrSlice === 'meet') {\n      scaleY = scaleX = scaleX > scaleY ? scaleY : scaleX;\n      // calculate additional translation to move the viewbox\n    }\n    if (preserveAspectRatio.meetOrSlice === 'slice') {\n      scaleY = scaleX = scaleX > scaleY ? scaleX : scaleY;\n      // calculate additional translation to move the viewbox\n    }\n    widthDiff = parsedDim.width - viewBoxWidth * scaleX;\n    heightDiff = parsedDim.height - viewBoxHeight * scaleX;\n    if (preserveAspectRatio.alignX === 'Mid') {\n      widthDiff /= 2;\n    }\n    if (preserveAspectRatio.alignY === 'Mid') {\n      heightDiff /= 2;\n    }\n    if (preserveAspectRatio.alignX === 'Min') {\n      widthDiff = 0;\n    }\n    if (preserveAspectRatio.alignY === 'Min') {\n      heightDiff = 0;\n    }\n  }\n\n  if (\n    scaleX === 1 &&\n    scaleY === 1 &&\n    minX === 0 &&\n    minY === 0 &&\n    x === 0 &&\n    y === 0\n  ) {\n    return parsedDim;\n  }\n  if ((x || y) && element.parentNode!.nodeName !== '#document') {\n    translateMatrix =\n      ' translate(' + parseUnit(x || '0') + ' ' + parseUnit(y || '0') + ') ';\n  }\n\n  matrix =\n    translateMatrix +\n    ' matrix(' +\n    scaleX +\n    ' 0' +\n    ' 0 ' +\n    scaleY +\n    ' ' +\n    (minX * scaleX + widthDiff) +\n    ' ' +\n    (minY * scaleY + heightDiff) +\n    ') ';\n  // seems unused.\n  // parsedDim.viewboxTransform = parseTransformAttribute(matrix);\n  if (element.nodeName === 'svg') {\n    el = element.ownerDocument.createElementNS(svgNS, 'g');\n    // element.firstChild != null\n    while (element.firstChild) {\n      el.appendChild(element.firstChild);\n    }\n    element.appendChild(el);\n  } else {\n    el = element;\n    el.removeAttribute('x');\n    el.removeAttribute('y');\n    matrix = el.getAttribute('transform') + matrix;\n  }\n  el.setAttribute('transform', matrix);\n  return parsedDim;\n}\n"],"mappings":"iOAoBA,SAAgB,EACd,EAAA,CAEA,GAAA,CAAK,EAAwB,KAAK,EAAQ,SAAA,CACxC,MAAO,EAAA,CAET,IAAM,EAA6B,EAAQ,aAAa,UAAA,CAGpD,EACA,EAHA,EAAS,EACT,EAAS,EAGP,EAAY,EAAQ,aAAa,QAAA,CACjC,EAAa,EAAQ,aAAa,SAAA,CAClC,EAAI,EAAQ,aAAa,IAAA,EAAQ,EACjC,EAAI,EAAQ,aAAa,IAAA,EAAQ,EAEjC,EAAA,EADc,GAAe,EAAmB,KAAK,EAAA,EAErD,EAAA,CACH,GAAA,CAAc,GAAc,IAAc,QAAU,IAAe,OAElE,EAAkB,GAClB,EAAY,EACZ,EAAa,EAiBjB,GAfI,IAEC,GAAK,IACN,EAAQ,YACR,EAAQ,WAAW,WAAa,cAEhC,EACE,cAAgB,EAAU,GAAK,IAAA,CAAO,IAAM,EAAU,GAAK,IAAA,CAAO,KACpE,GAAU,EAAQ,aAAa,YAAA,EAAgB,IAAM,EACrD,EAAQ,aAAa,YAAa,EAAA,CAClC,EAAQ,gBAAgB,IAAA,CACxB,EAAQ,gBAAgB,IAAA,EAIxB,GAAkB,EACpB,MAAO,CACL,MAAO,EACP,OAAQ,EAAA,CAIZ,IAAM,EAAoC,CACxC,MAAO,EACP,OAAQ,EAAA,CAGV,GAAI,EAIF,MAHA,GAAU,MAAQ,EAAU,EAAA,CAC5B,EAAU,OAAS,EAAU,EAAA,CAEtB,EAGT,IAAM,EAAe,EAAY,MAAM,EAAA,CACjC,EAAA,CAAQ,WAAW,EAAa,GAAA,CAChC,EAAA,CAAQ,WAAW,EAAa,GAAA,CAChC,EAAe,WAAW,EAAa,GAAA,CACvC,EAAgB,WAAW,EAAa,GAAA,CAC9C,EAAU,KAAO,EACjB,EAAU,KAAO,EACjB,EAAU,aAAe,EACzB,EAAU,cAAgB,EACrB,GAMH,EAAU,MAAQ,EAClB,EAAU,OAAS,IANnB,EAAU,MAAQ,EAAU,EAAA,CAC5B,EAAU,OAAS,EAAU,EAAA,CAC7B,EAAS,EAAU,MAAQ,EAC3B,EAAS,EAAU,OAAS,GAO9B,IAAM,EAAsB,EAC1B,EAAQ,aAAa,sBAAA,EAA0B,GAAA,CA4BjD,GA1BI,EAAoB,SAAA,SAElB,EAAoB,cAAgB,SACtC,EAAS,EAAS,EAAS,EAAS,EAAS,GAG3C,EAAoB,cAAgB,UACtC,EAAS,EAAS,EAAS,EAAS,EAAS,GAG/C,EAAY,EAAU,MAAQ,EAAe,EAC7C,EAAa,EAAU,OAAS,EAAgB,EAC5C,EAAoB,SAAW,QACjC,GAAa,GAEX,EAAoB,SAAW,QACjC,GAAc,GAEZ,EAAoB,SAAW,QACjC,EAAY,GAEV,EAAoB,SAAW,QACjC,EAAa,IAKf,IAAW,GACX,IAAW,GACX,IAAS,GACT,IAAS,GACT,IAAM,GACN,IAAM,EAEN,OAAO,EAqBT,IAnBK,GAAK,IAAM,EAAQ,WAAY,WAAa,cAC/C,EACE,cAAgB,EAAU,GAAK,IAAA,CAAO,IAAM,EAAU,GAAK,IAAA,CAAO,MAGtE,EACE,EACA,WACA,EACA,QAEA,EACA,KACC,EAAO,EAAS,GACjB,KACC,EAAO,EAAS,GACjB,KAGE,EAAQ,WAAa,MAAO,CAG9B,IAFA,EAAK,EAAQ,cAAc,gBAAgB,EAAO,IAAA,CAE3C,EAAQ,YACb,EAAG,YAAY,EAAQ,WAAA,CAEzB,EAAQ,YAAY,EAAA,MAEpB,EAAK,EACL,EAAG,gBAAgB,IAAA,CACnB,EAAG,gBAAgB,IAAA,CACnB,EAAS,EAAG,aAAa,YAAA,CAAe,EAG1C,OADA,EAAG,aAAa,YAAa,EAAA,CACtB,EAAA,OAAA,KAAA"}

package/dist/src/parser/applyViewboxTransform.mjs

@@ -10,8 +10,6 @@ function applyViewboxTransform(element) {
 	const viewBoxAttr = element.getAttribute("viewBox");
 	let scaleX = 1;
 	let scaleY = 1;
-	let minX = 0;
-	let minY = 0;
 	let matrix;
 	let el;
 	const widthAttr = element.getAttribute("width");
@@ -46,8 +44,8 @@ function applyViewboxTransform(element) {
 		return parsedDim;
 	}
 	const pasedViewBox = viewBoxAttr.match(reViewBoxAttrValue);
-	minX = -parseFloat(pasedViewBox[1]);
-	minY = -parseFloat(pasedViewBox[2]);
+	const minX = -parseFloat(pasedViewBox[1]);
+	const minY = -parseFloat(pasedViewBox[2]);
 	const viewBoxWidth = parseFloat(pasedViewBox[3]);
 	const viewBoxHeight = parseFloat(pasedViewBox[4]);
 	parsedDim.minX = minX;

package/dist/src/parser/applyViewboxTransform.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"applyViewboxTransform.mjs","names":[],"sources":["../../../src/parser/applyViewboxTransform.ts"],"sourcesContent":["import { svgNS } from './constants';\nimport {\n  parsePreserveAspectRatioAttribute,\n  parseUnit,\n} from '../util/misc/svgParsing';\nimport { svgViewBoxElementsRegEx, reViewBoxAttrValue } from './constants';\nimport { NONE } from '../constants';\n\nexport type ParsedViewboxTransform = Partial<{\n  width: number;\n  height: number;\n  minX: number;\n  minY: number;\n  viewBoxWidth: number;\n  viewBoxHeight: number;\n}>;\n\n/**\n * Add a <g> element that envelop all child elements and makes the viewbox transformMatrix descend on all elements\n */\nexport function applyViewboxTransform(\n  element: Element,\n): ParsedViewboxTransform {\n  if (!svgViewBoxElementsRegEx.test(element.nodeName)) {\n    return {};\n  }\n  const viewBoxAttr: string | null = element.getAttribute('viewBox');\n  let scaleX = 1;\n  let scaleY = 1;\n  let minX = 0;\n  let minY = 0;\n  let matrix;\n  let el;\n  const widthAttr = element.getAttribute('width');\n  const heightAttr = element.getAttribute('height');\n  const x = element.getAttribute('x') || 0;\n  const y = element.getAttribute('y') || 0;\n  const goodViewbox = viewBoxAttr && reViewBoxAttrValue.test(viewBoxAttr);\n  const missingViewBox = !goodViewbox;\n  const missingDimAttr =\n    !widthAttr || !heightAttr || widthAttr === '100%' || heightAttr === '100%';\n\n  let translateMatrix = '';\n  let widthDiff = 0;\n  let heightDiff = 0;\n\n  if (missingViewBox) {\n    if (\n      (x || y) &&\n      element.parentNode &&\n      element.parentNode.nodeName !== '#document'\n    ) {\n      translateMatrix =\n        ' translate(' + parseUnit(x || '0') + ' ' + parseUnit(y || '0') + ') ';\n      matrix = (element.getAttribute('transform') || '') + translateMatrix;\n      element.setAttribute('transform', matrix);\n      element.removeAttribute('x');\n      element.removeAttribute('y');\n    }\n  }\n\n  if (missingViewBox && missingDimAttr) {\n    return {\n      width: 0,\n      height: 0,\n    };\n  }\n\n  const parsedDim: ParsedViewboxTransform = {\n    width: 0,\n    height: 0,\n  };\n\n  if (missingViewBox) {\n    parsedDim.width = parseUnit(widthAttr!);\n    parsedDim.height = parseUnit(heightAttr!);\n    // set a transform for elements that have x y and are inner(only) SVGs\n    return parsedDim;\n  }\n\n  const pasedViewBox = viewBoxAttr.match(reViewBoxAttrValue)!;\n  minX = -parseFloat(pasedViewBox[1]);\n  minY = -parseFloat(pasedViewBox[2]);\n  const viewBoxWidth = parseFloat(pasedViewBox[3]);\n  const viewBoxHeight = parseFloat(pasedViewBox[4]);\n  parsedDim.minX = minX;\n  parsedDim.minY = minY;\n  parsedDim.viewBoxWidth = viewBoxWidth;\n  parsedDim.viewBoxHeight = viewBoxHeight;\n  if (!missingDimAttr) {\n    parsedDim.width = parseUnit(widthAttr);\n    parsedDim.height = parseUnit(heightAttr);\n    scaleX = parsedDim.width / viewBoxWidth;\n    scaleY = parsedDim.height / viewBoxHeight;\n  } else {\n    parsedDim.width = viewBoxWidth;\n    parsedDim.height = viewBoxHeight;\n  }\n\n  // default is to preserve aspect ratio\n  const preserveAspectRatio = parsePreserveAspectRatioAttribute(\n    element.getAttribute('preserveAspectRatio') || '',\n  );\n  if (preserveAspectRatio.alignX !== NONE) {\n    //translate all container for the effect of Mid, Min, Max\n    if (preserveAspectRatio.meetOrSlice === 'meet') {\n      scaleY = scaleX = scaleX > scaleY ? scaleY : scaleX;\n      // calculate additional translation to move the viewbox\n    }\n    if (preserveAspectRatio.meetOrSlice === 'slice') {\n      scaleY = scaleX = scaleX > scaleY ? scaleX : scaleY;\n      // calculate additional translation to move the viewbox\n    }\n    widthDiff = parsedDim.width - viewBoxWidth * scaleX;\n    heightDiff = parsedDim.height - viewBoxHeight * scaleX;\n    if (preserveAspectRatio.alignX === 'Mid') {\n      widthDiff /= 2;\n    }\n    if (preserveAspectRatio.alignY === 'Mid') {\n      heightDiff /= 2;\n    }\n    if (preserveAspectRatio.alignX === 'Min') {\n      widthDiff = 0;\n    }\n    if (preserveAspectRatio.alignY === 'Min') {\n      heightDiff = 0;\n    }\n  }\n\n  if (\n    scaleX === 1 &&\n    scaleY === 1 &&\n    minX === 0 &&\n    minY === 0 &&\n    x === 0 &&\n    y === 0\n  ) {\n    return parsedDim;\n  }\n  if ((x || y) && element.parentNode!.nodeName !== '#document') {\n    translateMatrix =\n      ' translate(' + parseUnit(x || '0') + ' ' + parseUnit(y || '0') + ') ';\n  }\n\n  matrix =\n    translateMatrix +\n    ' matrix(' +\n    scaleX +\n    ' 0' +\n    ' 0 ' +\n    scaleY +\n    ' ' +\n    (minX * scaleX + widthDiff) +\n    ' ' +\n    (minY * scaleY + heightDiff) +\n    ') ';\n  // seems unused.\n  // parsedDim.viewboxTransform = parseTransformAttribute(matrix);\n  if (element.nodeName === 'svg') {\n    el = element.ownerDocument.createElementNS(svgNS, 'g');\n    // element.firstChild != null\n    while (element.firstChild) {\n      el.appendChild(element.firstChild);\n    }\n    element.appendChild(el);\n  } else {\n    el = element;\n    el.removeAttribute('x');\n    el.removeAttribute('y');\n    matrix = el.getAttribute('transform') + matrix;\n  }\n  el.setAttribute('transform', matrix);\n  return parsedDim;\n}\n"],"mappings":"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"}
+{"version":3,"file":"applyViewboxTransform.mjs","names":[],"sources":["../../../src/parser/applyViewboxTransform.ts"],"sourcesContent":["import { svgNS } from './constants';\nimport {\n  parsePreserveAspectRatioAttribute,\n  parseUnit,\n} from '../util/misc/svgParsing';\nimport { svgViewBoxElementsRegEx, reViewBoxAttrValue } from './constants';\nimport { NONE } from '../constants';\n\nexport type ParsedViewboxTransform = Partial<{\n  width: number;\n  height: number;\n  minX: number;\n  minY: number;\n  viewBoxWidth: number;\n  viewBoxHeight: number;\n}>;\n\n/**\n * Add a <g> element that envelop all child elements and makes the viewbox transformMatrix descend on all elements\n */\nexport function applyViewboxTransform(\n  element: Element,\n): ParsedViewboxTransform {\n  if (!svgViewBoxElementsRegEx.test(element.nodeName)) {\n    return {};\n  }\n  const viewBoxAttr: string | null = element.getAttribute('viewBox');\n  let scaleX = 1;\n  let scaleY = 1;\n  let matrix;\n  let el;\n  const widthAttr = element.getAttribute('width');\n  const heightAttr = element.getAttribute('height');\n  const x = element.getAttribute('x') || 0;\n  const y = element.getAttribute('y') || 0;\n  const goodViewbox = viewBoxAttr && reViewBoxAttrValue.test(viewBoxAttr);\n  const missingViewBox = !goodViewbox;\n  const missingDimAttr =\n    !widthAttr || !heightAttr || widthAttr === '100%' || heightAttr === '100%';\n\n  let translateMatrix = '';\n  let widthDiff = 0;\n  let heightDiff = 0;\n\n  if (missingViewBox) {\n    if (\n      (x || y) &&\n      element.parentNode &&\n      element.parentNode.nodeName !== '#document'\n    ) {\n      translateMatrix =\n        ' translate(' + parseUnit(x || '0') + ' ' + parseUnit(y || '0') + ') ';\n      matrix = (element.getAttribute('transform') || '') + translateMatrix;\n      element.setAttribute('transform', matrix);\n      element.removeAttribute('x');\n      element.removeAttribute('y');\n    }\n  }\n\n  if (missingViewBox && missingDimAttr) {\n    return {\n      width: 0,\n      height: 0,\n    };\n  }\n\n  const parsedDim: ParsedViewboxTransform = {\n    width: 0,\n    height: 0,\n  };\n\n  if (missingViewBox) {\n    parsedDim.width = parseUnit(widthAttr!);\n    parsedDim.height = parseUnit(heightAttr!);\n    // set a transform for elements that have x y and are inner(only) SVGs\n    return parsedDim;\n  }\n\n  const pasedViewBox = viewBoxAttr.match(reViewBoxAttrValue)!;\n  const minX = -parseFloat(pasedViewBox[1]);\n  const minY = -parseFloat(pasedViewBox[2]);\n  const viewBoxWidth = parseFloat(pasedViewBox[3]);\n  const viewBoxHeight = parseFloat(pasedViewBox[4]);\n  parsedDim.minX = minX;\n  parsedDim.minY = minY;\n  parsedDim.viewBoxWidth = viewBoxWidth;\n  parsedDim.viewBoxHeight = viewBoxHeight;\n  if (!missingDimAttr) {\n    parsedDim.width = parseUnit(widthAttr);\n    parsedDim.height = parseUnit(heightAttr);\n    scaleX = parsedDim.width / viewBoxWidth;\n    scaleY = parsedDim.height / viewBoxHeight;\n  } else {\n    parsedDim.width = viewBoxWidth;\n    parsedDim.height = viewBoxHeight;\n  }\n\n  // default is to preserve aspect ratio\n  const preserveAspectRatio = parsePreserveAspectRatioAttribute(\n    element.getAttribute('preserveAspectRatio') || '',\n  );\n  if (preserveAspectRatio.alignX !== NONE) {\n    //translate all container for the effect of Mid, Min, Max\n    if (preserveAspectRatio.meetOrSlice === 'meet') {\n      scaleY = scaleX = scaleX > scaleY ? scaleY : scaleX;\n      // calculate additional translation to move the viewbox\n    }\n    if (preserveAspectRatio.meetOrSlice === 'slice') {\n      scaleY = scaleX = scaleX > scaleY ? scaleX : scaleY;\n      // calculate additional translation to move the viewbox\n    }\n    widthDiff = parsedDim.width - viewBoxWidth * scaleX;\n    heightDiff = parsedDim.height - viewBoxHeight * scaleX;\n    if (preserveAspectRatio.alignX === 'Mid') {\n      widthDiff /= 2;\n    }\n    if (preserveAspectRatio.alignY === 'Mid') {\n      heightDiff /= 2;\n    }\n    if (preserveAspectRatio.alignX === 'Min') {\n      widthDiff = 0;\n    }\n    if (preserveAspectRatio.alignY === 'Min') {\n      heightDiff = 0;\n    }\n  }\n\n  if (\n    scaleX === 1 &&\n    scaleY === 1 &&\n    minX === 0 &&\n    minY === 0 &&\n    x === 0 &&\n    y === 0\n  ) {\n    return parsedDim;\n  }\n  if ((x || y) && element.parentNode!.nodeName !== '#document') {\n    translateMatrix =\n      ' translate(' + parseUnit(x || '0') + ' ' + parseUnit(y || '0') + ') ';\n  }\n\n  matrix =\n    translateMatrix +\n    ' matrix(' +\n    scaleX +\n    ' 0' +\n    ' 0 ' +\n    scaleY +\n    ' ' +\n    (minX * scaleX + widthDiff) +\n    ' ' +\n    (minY * scaleY + heightDiff) +\n    ') ';\n  // seems unused.\n  // parsedDim.viewboxTransform = parseTransformAttribute(matrix);\n  if (element.nodeName === 'svg') {\n    el = element.ownerDocument.createElementNS(svgNS, 'g');\n    // element.firstChild != null\n    while (element.firstChild) {\n      el.appendChild(element.firstChild);\n    }\n    element.appendChild(el);\n  } else {\n    el = element;\n    el.removeAttribute('x');\n    el.removeAttribute('y');\n    matrix = el.getAttribute('transform') + matrix;\n  }\n  el.setAttribute('transform', matrix);\n  return parsedDim;\n}\n"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-import{_defineProperty as e}from"../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.min.mjs";import{log as t}from"../util/internals/console.min.mjs";import{classRegistry as n}from"../ClassRegistry.min.mjs";import{LAYOUT_TYPE_ADDED as r}from"../LayoutManager/constants.min.mjs";import{Group as i}from"./Group.min.mjs";import{ActiveSelectionLayoutManager as a}from"../LayoutManager/ActiveSelectionLayoutManager.min.mjs";var o=class e extends i{static getDefaults(){return{...super.getDefaults(),...e.ownDefaults}}constructor(t=[],n={}){super(),Object.assign(this,e.ownDefaults),this.setOptions(n);let{left:r,top:i,layoutManager:o}=n;this.groupInit(t,{left:r,top:i,layoutManager:o==null?new a:o})}_shouldSetNestedCoords(){return!0}__objectSelectionMonitor(){}multiSelectAdd(...e){this.multiSelectionStacking===`selection-order`?this.add(...e):e.forEach(e=>{let t=this._objects.findIndex(t=>t.isInFrontOf(e)),n=t===-1?this.size():t;this.insertAt(n,e)})}canEnterGroup(e){return this.getObjects().some(t=>t.isDescendantOf(e)||e.isDescendantOf(t))?(t(`error`,`ActiveSelection: circular object trees are not supported, this call has no effect`),!1):super.canEnterGroup(e)}enterGroup(e,t){e.parent&&e.parent===e.group?e.parent._exitGroup(e):e.group&&e.parent!==e.group&&e.group.remove(e),this._enterGroup(e,t)}exitGroup(e,t){this._exitGroup(e,t),e.parent&&e.parent._enterGroup(e,!0)}_onAfterObjectsChange(e,t){super._onAfterObjectsChange(e,t);let n=new Set;t.forEach(e=>{let{parent:t}=e;t&&n.add(t)}),e===`removed`?n.forEach(e=>{e._onAfterObjectsChange(r,t)}):n.forEach(e=>{e._set(`dirty`,!0)})}onDeselect(){return this.removeAll(),!1}toString(){return`#<ActiveSelection: (${this.complexity()})>`}shouldCache(){return!1}isOnACache(){return!1}_renderControls(e,t,n){e.save(),e.globalAlpha=this.isMoving?this.borderOpacityWhenMoving:1;let r={hasControls:!1,...n,forActiveSelection:!0};for(let t=0;t<this._objects.length;t++)this._objects[t]._renderControls(e,r);super._renderControls(e,t),e.restore()}};e(o,`type`,`ActiveSelection`),e(o,`ownDefaults`,{multiSelectionStacking:`canvas-stacking`}),n.setClass(o),n.setClass(o,`activeSelection`);export{o as ActiveSelection};
+import{_defineProperty as e}from"../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.min.mjs";import{log as t}from"../util/internals/console.min.mjs";import{classRegistry as n}from"../ClassRegistry.min.mjs";import{LAYOUT_TYPE_ADDED as r}from"../LayoutManager/constants.min.mjs";import{Group as i}from"./Group.min.mjs";import{ActiveSelectionLayoutManager as a}from"../LayoutManager/ActiveSelectionLayoutManager.min.mjs";var o=class e extends i{static getDefaults(){return{...super.getDefaults(),...e.ownDefaults}}constructor(t=[],n={}){super(),Object.assign(this,e.ownDefaults),this.setOptions(n);let{left:r,top:i,layoutManager:o}=n;this.groupInit(t,{left:r,top:i,layoutManager:o==null?new a:o})}_shouldSetNestedCoords(){return!0}__objectSelectionMonitor(){}multiSelectAdd(...e){this.multiSelectionStacking===`selection-order`?this.add(...e):e.forEach(e=>{let t=this._objects.findIndex(t=>t.isInFrontOf(e)),n=t===-1?this.size():t;this.insertAt(n,e)})}canEnterGroup(e){return this.getObjects().some(t=>t.isDescendantOf(e)||e.isDescendantOf(t))?(t(`error`,`ActiveSelection: circular object trees are not supported, this call has no effect`),!1):super.canEnterGroup(e)}enterGroup(e,t){e.parent&&e.parent===e.group?e.parent._exitGroup(e):e.group&&e.parent!==e.group&&e.group.remove(e),this._enterGroup(e,t)}exitGroup(e,t){this._exitGroup(e,t),e.parent&&e.parent._enterGroup(e,!0)}_onAfterObjectsChange(e,t){super._onAfterObjectsChange(e,t);let n=new Set;t.forEach(e=>{let{parent:t}=e;t&&n.add(t)}),e===`removed`?n.forEach(e=>{e._onAfterObjectsChange(r,t)}):n.forEach(e=>{e._set(`dirty`,!0)})}onDeselect(){return this.removeAll(),!1}toString(){return`#<ActiveSelection: (${this.complexity()})>`}shouldCache(){return!1}isOnACache(){return!1}_renderControls(e,t,n){e.save(),e.globalAlpha=this.isMoving?this.borderOpacityWhenMoving:1;let r={hasControls:!1,...n,forActiveSelection:!0};for(let t=0;t<this._objects.length;t++)this._objects[t]._renderControls(e,r);super._renderControls(e,t),e.restore()}};e(o,`type`,`ActiveSelection`),e(o,`ownDefaults`,{multiSelectionStacking:`canvas-stacking`}),n.setClass(o),n.setClass(o,`activeSelection`);export{o as ActiveSelection};
 //# sourceMappingURL=ActiveSelection.min.mjs.map

package/dist/src/shapes/ActiveSelection.mjs

@@ -1,4 +1,4 @@
-import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.mjs";
+import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.mjs";
 import { log } from "../util/internals/console.mjs";
 import { classRegistry } from "../ClassRegistry.mjs";
 import { LAYOUT_TYPE_ADDED } from "../LayoutManager/constants.mjs";

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"Circle.min.mjs","names":[],"sources":["../../../src/shapes/Circle.ts"],"sourcesContent":["import type { ObjectEvents } from '../EventTypeDefs';\nimport { SHARED_ATTRIBUTES } from '../parser/attributes';\nimport { parseAttributes } from '../parser/parseAttributes';\nimport { cos } from '../util/misc/cos';\nimport { degreesToRadians } from '../util/misc/radiansDegreesConversion';\nimport { sin } from '../util/misc/sin';\nimport { classRegistry } from '../ClassRegistry';\nimport { FabricObject, cacheProperties } from './Object/FabricObject';\nimport type { Abortable, TClassProperties, TOptions } from '../typedefs';\nimport type { FabricObjectProps, SerializedObjectProps } from './Object/types';\nimport type { CSSRules } from '../parser/typedefs';\nimport { SCALE_X, SCALE_Y } from '../constants';\nimport { escapeXml } from '../util/lang_string';\n\ninterface UniqueCircleProps {\n  /**\n   * Radius of this circle\n   * @type Number\n   * @default 0\n   */\n  radius: number;\n\n  /**\n   * Angle for the start of the circle, in degrees.\n   * @type TDegree 0 - 359\n   * @default 0\n   */\n  startAngle: number;\n\n  /**\n   * Angle for the end of the circle, in degrees\n   * @type TDegree 1 - 360\n   * @default 360\n   */\n  endAngle: number;\n\n  /**\n   * Orientation for the direction of the circle.\n   * Setting to true will switch the arc of the circle to traverse from startAngle to endAngle in a counter-clockwise direction.\n   * Note: this will only change how the circle is drawn, and does not affect rotational transformation.\n   * @default false\n   */\n  counterClockwise: boolean;\n}\n\nexport interface SerializedCircleProps\n  extends SerializedObjectProps, UniqueCircleProps {}\n\nexport interface CircleProps extends FabricObjectProps, UniqueCircleProps {}\n\nconst CIRCLE_PROPS = [\n  'radius',\n  'startAngle',\n  'endAngle',\n  'counterClockwise',\n] as const;\n\nexport const circleDefaultValues: Partial<TClassProperties<Circle>> = {\n  radius: 0,\n  startAngle: 0,\n  endAngle: 360,\n  counterClockwise: false,\n};\n\nexport class Circle<\n  Props extends TOptions<CircleProps> = Partial<CircleProps>,\n  SProps extends SerializedCircleProps = SerializedCircleProps,\n  EventSpec extends ObjectEvents = ObjectEvents,\n>\n  extends FabricObject<Props, SProps, EventSpec>\n  implements UniqueCircleProps\n{\n  declare radius: number;\n  declare startAngle: number;\n  declare endAngle: number;\n  declare counterClockwise: boolean;\n\n  static type = 'Circle';\n\n  static cacheProperties = [...cacheProperties, ...CIRCLE_PROPS];\n\n  static ownDefaults = circleDefaultValues;\n\n  static getDefaults(): Record<string, any> {\n    return {\n      ...super.getDefaults(),\n      ...Circle.ownDefaults,\n    };\n  }\n\n  /**\n   * Constructor\n   * @param {Object} [options] Options object\n   */\n  constructor(options?: Props) {\n    super();\n    Object.assign(this, Circle.ownDefaults);\n    this.setOptions(options);\n  }\n\n  /**\n   * @private\n   * @param {String} key\n   * @param {*} value\n   */\n  _set(key: string, value: any) {\n    super._set(key, value);\n\n    if (key === 'radius') {\n      this.setRadius(value);\n    }\n\n    return this;\n  }\n\n  /**\n   * @private\n   * @param {CanvasRenderingContext2D} ctx context to render on\n   */\n  _render(ctx: CanvasRenderingContext2D) {\n    ctx.beginPath();\n    ctx.arc(\n      0,\n      0,\n      this.radius,\n      degreesToRadians(this.startAngle),\n      degreesToRadians(this.endAngle),\n      this.counterClockwise,\n    );\n    this._renderPaintInOrder(ctx);\n  }\n\n  /**\n   * Returns horizontal radius of an object (according to how an object is scaled)\n   * @return {Number}\n   */\n  getRadiusX(): number {\n    return this.get('radius') * this.get(SCALE_X);\n  }\n\n  /**\n   * Returns vertical radius of an object (according to how an object is scaled)\n   * @return {Number}\n   */\n  getRadiusY(): number {\n    return this.get('radius') * this.get(SCALE_Y);\n  }\n\n  /**\n   * Sets radius of an object (and updates width accordingly)\n   */\n  setRadius(value: number) {\n    this.radius = value;\n    this.set({ width: value * 2, height: value * 2 });\n  }\n\n  /**\n   * Returns object representation of an instance\n   * @param {Array} [propertiesToInclude] Any properties that you might want to additionally include in the output\n   * @return {Object} object representation of an instance\n   */\n  toObject<\n    T extends Omit<Props & TClassProperties<this>, keyof SProps>,\n    K extends keyof T = never,\n  >(propertiesToInclude: K[] = []): Pick<T, K> & SProps {\n    return super.toObject([...CIRCLE_PROPS, ...propertiesToInclude]);\n  }\n\n  /* _TO_SVG_START_ */\n\n  /**\n   * Returns svg representation of an instance\n   * @return {Array} an array of strings with the specific svg representation\n   * of the instance\n   */\n  _toSVG(): string[] {\n    const { radius, startAngle, endAngle } = this;\n    const angle = (endAngle - startAngle) % 360;\n\n    if (angle === 0) {\n      return [\n        '<circle ',\n        'COMMON_PARTS',\n        'cx=\"0\" cy=\"0\" ',\n        'r=\"',\n        `${escapeXml(radius)}`,\n        '\" />\\n',\n      ];\n    } else {\n      const start = degreesToRadians(startAngle),\n        end = degreesToRadians(endAngle),\n        startX = cos(start) * radius,\n        startY = sin(start) * radius,\n        endX = cos(end) * radius,\n        endY = sin(end) * radius,\n        largeFlag = angle > 180 ? 1 : 0,\n        sweepFlag = this.counterClockwise ? 0 : 1;\n      return [\n        `<path d=\"M ${startX} ${startY} A ${radius} ${radius} 0 ${largeFlag} ${sweepFlag} ${endX} ${endY}\" `,\n        'COMMON_PARTS',\n        ' />\\n',\n      ];\n    }\n  }\n  /* _TO_SVG_END_ */\n\n  /* _FROM_SVG_START_ */\n  /**\n   * List of attribute names to account for when parsing SVG element (used by {@link Circle.fromElement})\n   * @see: http://www.w3.org/TR/SVG/shapes.html#CircleElement\n   */\n  static ATTRIBUTE_NAMES = ['cx', 'cy', 'r', ...SHARED_ATTRIBUTES];\n\n  /**\n   * Returns {@link Circle} instance from an SVG element\n   * @param {HTMLElement} element Element to parse\n   * @param {Object} [options] Partial Circle object to default missing properties on the element.\n   * @throws {Error} If value of `r` attribute is missing or invalid\n   */\n  static async fromElement(\n    element: HTMLElement,\n    options: Abortable,\n    cssRules?: CSSRules,\n  ): Promise<Circle> {\n    const {\n      left = 0,\n      top = 0,\n      radius = 0,\n      ...otherParsedAttributes\n    } = parseAttributes(\n      element,\n      this.ATTRIBUTE_NAMES,\n      cssRules,\n    ) as Partial<CircleProps>;\n\n    // this probably requires to be fixed for default origins not being top/left.\n\n    return new this({\n      ...otherParsedAttributes,\n      radius,\n      left: left - radius,\n      top: top - radius,\n    });\n  }\n\n  /* _FROM_SVG_END_ */\n\n  /**\n   * @todo how do we declare this??\n   */\n  static fromObject<T extends TOptions<SerializedCircleProps>>(object: T) {\n    return super._fromObject<Circle>(object);\n  }\n}\n\nclassRegistry.setClass(Circle);\nclassRegistry.setSVGClass(Circle);\n"],"mappings":"6sBAkDA,MAAM,EAAe,CACnB,SACA,aACA,WACA,mBAAA,CAUF,IAAa,EAAb,MAAa,UAKH,CAAA,CAcR,OAAA,aAAO,CACL,MAAO,CAAA,GACF,MAAM,aAAA,CAAA,GACN,EAAO,YAAA,CAQd,YAAY,EAAA,CACV,OAAA,CACA,OAAO,OAAO,KAAM,EAAO,YAAA,CAC3B,KAAK,WAAW,EAAA,CAQlB,KAAK,EAAa,EAAA,CAOhB,OANA,MAAM,KAAK,EAAK,EAAA,CAEZ,IAAQ,UACV,KAAK,UAAU,EAAA,CAGV,KAOT,QAAQ,EAAA,CACN,EAAI,WAAA,CACJ,EAAI,IACF,EACA,EACA,KAAK,OACL,EAAiB,KAAK,WAAA,CACtB,EAAiB,KAAK,SAAA,CACtB,KAAK,iBAAA,CAEP,KAAK,oBAAoB,EAAA,CAO3B,YAAA,CACE,OAAO,KAAK,IAAI,SAAA,CAAY,KAAK,IAAI,EAAA,CAOvC,YAAA,CACE,OAAO,KAAK,IAAI,SAAA,CAAY,KAAK,IAAI,EAAA,CAMvC,UAAU,EAAA,CACR,KAAK,OAAS,EACd,KAAK,IAAI,CAAE,MAAe,EAAR,EAAW,OAAgB,EAAR,EAAA,CAAA,CAQvC,SAGE,EAA2B,EAAA,CAAA,CAC3B,OAAO,MAAM,SAAS,CAAA,GAAI,EAAA,GAAiB,EAAA,CAAA,CAU7C,QAAA,CACE,GAAA,CAAM,OAAE,EAAA,WAAQ,EAAA,SAAY,GAAa,KACnC,GAAS,EAAW,GAAc,IAExC,GAAI,IAAU,EACZ,MAAO,CACL,WACA,eACA,iBACA,MACA,GAAG,EAAU,EAAA,GACb;EAAA,CAEG,CACL,IAAM,EAAQ,EAAiB,EAAA,CAC7B,EAAM,EAAiB,EAAA,CACvB,EAAS,EAAI,EAAA,CAAS,EACtB,EAAS,EAAI,EAAA,CAAS,EACtB,EAAO,EAAI,EAAA,CAAO,EAClB,EAAO,EAAI,EAAA,CAAO,EAGpB,MAAO,CACL,cAAc,EAAA,GAAU,EAAA,KAAY,EAAA,GAAU,EAAA,KAHlC,EAAQ,IAAM,EAAI,EAAA,GAClB,KAAK,iBAAmB,EAAI,EAAA,GAE4C,EAAA,GAAQ,EAAA,IAC5F,eACA;EAAA,EAmBN,aAAA,YACE,EACA,EACA,EAAA,CAEA,GAAA,CAAM,KACJ,EAAO,EAAA,IACP,EAAM,EAAA,OACN,EAAS,EAAA,GACN,GACD,EACF,EACA,KAAK,gBACL,EAAA,CAKF,OAAO,IAAI,KAAK,CAAA,GACX,EACH,OAAA,EACA,KAAM,EAAO,EACb,IAAK,EAAM,EAAA,CAAA,CASf,OAAA,WAA6D,EAAA,CAC3D,OAAO,MAAM,YAAoB,EAAA,GAAA,EAAA,EA9K5B,OAAO,SAAA,CAAA,EAAA,EAEP,kBAAkB,CAAA,GAAI,EAAA,GAAoB,EAAA,CAAA,CAAA,EAAA,EAE1C,cAxB6D,CACpE,OAAQ,EACR,WAAY,EACZ,SAAU,IACV,iBAAA,CAAkB,EAAA,CAAA,CAAA,EAAA,EAsJX,kBAAkB,CAAC,KAAM,KAAM,IAAA,GAAQ,EAAA,CAAA,CA4ChD,EAAc,SAAS,EAAA,CACvB,EAAc,YAAY,EAAA,CAAA,OAAA,KAAA"}
+{"version":3,"file":"Circle.min.mjs","names":[],"sources":["../../../src/shapes/Circle.ts"],"sourcesContent":["import type { ObjectEvents } from '../EventTypeDefs';\nimport { SHARED_ATTRIBUTES } from '../parser/attributes';\nimport { parseAttributes } from '../parser/parseAttributes';\nimport { cos } from '../util/misc/cos';\nimport { degreesToRadians } from '../util/misc/radiansDegreesConversion';\nimport { sin } from '../util/misc/sin';\nimport { classRegistry } from '../ClassRegistry';\nimport { FabricObject, cacheProperties } from './Object/FabricObject';\nimport type { Abortable, TClassProperties, TOptions } from '../typedefs';\nimport type { FabricObjectProps, SerializedObjectProps } from './Object/types';\nimport type { CSSRules } from '../parser/typedefs';\nimport { SCALE_X, SCALE_Y } from '../constants';\nimport { escapeXml } from '../util/lang_string';\n\ninterface UniqueCircleProps {\n  /**\n   * Radius of this circle\n   * @type Number\n   * @default 0\n   */\n  radius: number;\n\n  /**\n   * Angle for the start of the circle, in degrees.\n   * @type TDegree 0 - 359\n   * @default 0\n   */\n  startAngle: number;\n\n  /**\n   * Angle for the end of the circle, in degrees\n   * @type TDegree 1 - 360\n   * @default 360\n   */\n  endAngle: number;\n\n  /**\n   * Orientation for the direction of the circle.\n   * Setting to true will switch the arc of the circle to traverse from startAngle to endAngle in a counter-clockwise direction.\n   * Note: this will only change how the circle is drawn, and does not affect rotational transformation.\n   * @default false\n   */\n  counterClockwise: boolean;\n}\n\nexport interface SerializedCircleProps\n  extends SerializedObjectProps, UniqueCircleProps {}\n\nexport interface CircleProps extends FabricObjectProps, UniqueCircleProps {}\n\nconst CIRCLE_PROPS = [\n  'radius',\n  'startAngle',\n  'endAngle',\n  'counterClockwise',\n] as const;\n\nexport const circleDefaultValues: Partial<TClassProperties<Circle>> = {\n  radius: 0,\n  startAngle: 0,\n  endAngle: 360,\n  counterClockwise: false,\n};\n\nexport class Circle<\n  Props extends TOptions<CircleProps> = Partial<CircleProps>,\n  SProps extends SerializedCircleProps = SerializedCircleProps,\n  EventSpec extends ObjectEvents = ObjectEvents,\n>\n  extends FabricObject<Props, SProps, EventSpec>\n  implements UniqueCircleProps\n{\n  declare radius: number;\n  declare startAngle: number;\n  declare endAngle: number;\n  declare counterClockwise: boolean;\n\n  static type = 'Circle';\n\n  static cacheProperties = [...cacheProperties, ...CIRCLE_PROPS];\n\n  static ownDefaults = circleDefaultValues;\n\n  static getDefaults(): Record<string, any> {\n    return {\n      ...super.getDefaults(),\n      ...Circle.ownDefaults,\n    };\n  }\n\n  /**\n   * Constructor\n   * @param {Object} [options] Options object\n   */\n  constructor(options?: Props) {\n    super();\n    Object.assign(this, Circle.ownDefaults);\n    this.setOptions(options);\n  }\n\n  /**\n   * @private\n   * @param {String} key\n   * @param {*} value\n   */\n  _set(key: string, value: any) {\n    super._set(key, value);\n\n    if (key === 'radius') {\n      this.setRadius(value);\n    }\n\n    return this;\n  }\n\n  /**\n   * @private\n   * @param {CanvasRenderingContext2D} ctx context to render on\n   */\n  _render(ctx: CanvasRenderingContext2D) {\n    ctx.beginPath();\n    ctx.arc(\n      0,\n      0,\n      this.radius,\n      degreesToRadians(this.startAngle),\n      degreesToRadians(this.endAngle),\n      this.counterClockwise,\n    );\n    this._renderPaintInOrder(ctx);\n  }\n\n  /**\n   * Returns horizontal radius of an object (according to how an object is scaled)\n   * @return {Number}\n   */\n  getRadiusX(): number {\n    return this.get('radius') * this.get(SCALE_X);\n  }\n\n  /**\n   * Returns vertical radius of an object (according to how an object is scaled)\n   * @return {Number}\n   */\n  getRadiusY(): number {\n    return this.get('radius') * this.get(SCALE_Y);\n  }\n\n  /**\n   * Sets radius of an object (and updates width accordingly)\n   */\n  setRadius(value: number) {\n    this.radius = value;\n    this.set({ width: value * 2, height: value * 2 });\n  }\n\n  /**\n   * Returns object representation of an instance\n   * @param {Array} [propertiesToInclude] Any properties that you might want to additionally include in the output\n   * @return {Object} object representation of an instance\n   */\n  toObject<\n    T extends Omit<Props & TClassProperties<this>, keyof SProps>,\n    K extends keyof T = never,\n  >(propertiesToInclude: K[] = []): Pick<T, K> & SProps {\n    return super.toObject([...CIRCLE_PROPS, ...propertiesToInclude]);\n  }\n\n  /* _TO_SVG_START_ */\n\n  /**\n   * Returns svg representation of an instance\n   * @return {Array} an array of strings with the specific svg representation\n   * of the instance\n   */\n  _toSVG(): string[] {\n    const { radius, startAngle, endAngle } = this;\n    const angle = (endAngle - startAngle) % 360;\n\n    if (angle === 0) {\n      return [\n        '<circle ',\n        'COMMON_PARTS',\n        'cx=\"0\" cy=\"0\" ',\n        'r=\"',\n        `${escapeXml(radius)}`,\n        '\" />\\n',\n      ];\n    } else {\n      const start = degreesToRadians(startAngle),\n        end = degreesToRadians(endAngle),\n        startX = cos(start) * radius,\n        startY = sin(start) * radius,\n        endX = cos(end) * radius,\n        endY = sin(end) * radius,\n        largeFlag = angle > 180 ? 1 : 0,\n        sweepFlag = this.counterClockwise ? 0 : 1;\n      return [\n        `<path d=\"M ${startX} ${startY} A ${radius} ${radius} 0 ${largeFlag} ${sweepFlag} ${endX} ${endY}\" `,\n        'COMMON_PARTS',\n        ' />\\n',\n      ];\n    }\n  }\n  /* _TO_SVG_END_ */\n\n  /* _FROM_SVG_START_ */\n  /**\n   * List of attribute names to account for when parsing SVG element (used by {@link Circle.fromElement})\n   * @see: http://www.w3.org/TR/SVG/shapes.html#CircleElement\n   */\n  static ATTRIBUTE_NAMES = ['cx', 'cy', 'r', ...SHARED_ATTRIBUTES];\n\n  /**\n   * Returns {@link Circle} instance from an SVG element\n   * @param {HTMLElement} element Element to parse\n   * @param {Object} [options] Partial Circle object to default missing properties on the element.\n   * @throws {Error} If value of `r` attribute is missing or invalid\n   */\n  static async fromElement(\n    element: HTMLElement,\n    options: Abortable,\n    cssRules?: CSSRules,\n  ): Promise<Circle> {\n    const {\n      left = 0,\n      top = 0,\n      radius = 0,\n      ...otherParsedAttributes\n    } = parseAttributes(\n      element,\n      this.ATTRIBUTE_NAMES,\n      cssRules,\n    ) as Partial<CircleProps>;\n\n    // this probably requires to be fixed for default origins not being top/left.\n\n    return new this({\n      ...otherParsedAttributes,\n      radius,\n      left: left - radius,\n      top: top - radius,\n    });\n  }\n\n  /* _FROM_SVG_END_ */\n\n  /**\n   * @todo how do we declare this??\n   */\n  static fromObject<T extends TOptions<SerializedCircleProps>>(object: T) {\n    return super._fromObject<Circle>(object);\n  }\n}\n\nclassRegistry.setClass(Circle);\nclassRegistry.setSVGClass(Circle);\n"],"mappings":"6sBAkDA,MAAM,EAAe,CACnB,SACA,aACA,WACA,mBAAA,CAUF,IAAa,EAAb,MAAa,UAKH,CAAA,CAcR,OAAA,aAAO,CACL,MAAO,CAAA,GACF,MAAM,aAAA,CAAA,GACN,EAAO,YAAA,CAQd,YAAY,EAAA,CACV,OAAA,CACA,OAAO,OAAO,KAAM,EAAO,YAAA,CAC3B,KAAK,WAAW,EAAA,CAQlB,KAAK,EAAa,EAAA,CAOhB,OANA,MAAM,KAAK,EAAK,EAAA,CAEZ,IAAQ,UACV,KAAK,UAAU,EAAA,CAGV,KAOT,QAAQ,EAAA,CACN,EAAI,WAAA,CACJ,EAAI,IACF,EACA,EACA,KAAK,OACL,EAAiB,KAAK,WAAA,CACtB,EAAiB,KAAK,SAAA,CACtB,KAAK,iBAAA,CAEP,KAAK,oBAAoB,EAAA,CAO3B,YAAA,CACE,OAAO,KAAK,IAAI,SAAA,CAAY,KAAK,IAAI,EAAA,CAOvC,YAAA,CACE,OAAO,KAAK,IAAI,SAAA,CAAY,KAAK,IAAI,EAAA,CAMvC,UAAU,EAAA,CACR,KAAK,OAAS,EACd,KAAK,IAAI,CAAE,MAAe,EAAR,EAAW,OAAgB,EAAR,EAAA,CAAA,CAQvC,SAGE,EAA2B,EAAA,CAAA,CAC3B,OAAO,MAAM,SAAS,CAAA,GAAI,EAAA,GAAiB,EAAA,CAAA,CAU7C,QAAA,CACE,GAAA,CAAM,OAAE,EAAA,WAAQ,EAAA,SAAY,GAAa,KACnC,GAAS,EAAW,GAAc,IAExC,GAAI,IAAU,EACZ,MAAO,CACL,WACA,eACA,iBACA,MACA,GAAG,EAAU,EAAA,GACb;EAAA,CAEG,CACL,IAAM,EAAQ,EAAiB,EAAA,CAC7B,EAAM,EAAiB,EAAA,CACvB,EAAS,EAAI,EAAA,CAAS,EACtB,EAAS,EAAI,EAAA,CAAS,EACtB,EAAO,EAAI,EAAA,CAAO,EAClB,EAAO,EAAI,EAAA,CAAO,EAGpB,MAAO,CACL,cAAc,EAAA,GAAU,EAAA,KAAY,EAAA,GAAU,EAAA,KAHlC,IAAQ,KAAU,GAClB,OAAK,iBAAuB,GAE4C,EAAA,GAAQ,EAAA,IAC5F,eACA;EAAA,EAmBN,aAAA,YACE,EACA,EACA,EAAA,CAEA,GAAA,CAAM,KACJ,EAAO,EAAA,IACP,EAAM,EAAA,OACN,EAAS,EAAA,GACN,GACD,EACF,EACA,KAAK,gBACL,EAAA,CAKF,OAAO,IAAI,KAAK,CAAA,GACX,EACH,OAAA,EACA,KAAM,EAAO,EACb,IAAK,EAAM,EAAA,CAAA,CASf,OAAA,WAA6D,EAAA,CAC3D,OAAO,MAAM,YAAoB,EAAA,GAAA,EAAA,EA9K5B,OAAO,SAAA,CAAA,EAAA,EAEP,kBAAkB,CAAA,GAAI,EAAA,GAAoB,EAAA,CAAA,CAAA,EAAA,EAE1C,cAxB6D,CACpE,OAAQ,EACR,WAAY,EACZ,SAAU,IACV,iBAAA,CAAkB,EAAA,CAAA,CAAA,EAAA,EAsJX,kBAAkB,CAAC,KAAM,KAAM,IAAA,GAAQ,EAAA,CAAA,CA4ChD,EAAc,SAAS,EAAA,CACvB,EAAc,YAAY,EAAA,CAAA,OAAA,KAAA"}

package/dist/src/shapes/Circle.mjs

@@ -1,4 +1,4 @@
-import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.mjs";
+import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.mjs";
 import { SCALE_X, SCALE_Y } from "../constants.mjs";
 import { classRegistry } from "../ClassRegistry.mjs";
 import { cos } from "../util/misc/cos.mjs";

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

@@ -1,2 +1,2 @@
-import{_defineProperty as e}from"../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.min.mjs";import{SCALE_X as t,SCALE_Y as n,twoMathPi as r}from"../constants.min.mjs";import{classRegistry as i}from"../ClassRegistry.min.mjs";import{escapeXml as a}from"../util/lang_string.min.mjs";import{cacheProperties as o}from"./Object/defaultValues.min.mjs";import{FabricObject as s}from"./Object/FabricObject.min.mjs";import{SHARED_ATTRIBUTES as c}from"../parser/attributes.min.mjs";import{parseAttributes as l}from"../parser/parseAttributes.min.mjs";const u=[`rx`,`ry`];var d=class e extends s{static getDefaults(){return{...super.getDefaults(),...e.ownDefaults}}constructor(t){super(),Object.assign(this,e.ownDefaults),this.setOptions(t)}_set(e,t){switch(super._set(e,t),e){case`rx`:this.rx=t,this.set(`width`,2*t);break;case`ry`:this.ry=t,this.set(`height`,2*t)}return this}getRx(){return this.get(`rx`)*this.get(t)}getRy(){return this.get(`ry`)*this.get(n)}toObject(e=[]){return super.toObject([...u,...e])}_toSVG(){return[`<ellipse `,`COMMON_PARTS`,`cx="0" cy="0" rx="${a(this.rx)}" ry="${a(this.ry)}" />\n`]}_render(e){e.beginPath(),e.save(),e.transform(1,0,0,this.ry/this.rx,0,0),e.arc(0,0,this.rx,0,r,!1),e.restore(),this._renderPaintInOrder(e)}static async fromElement(e,t,n){let r=l(e,this.ATTRIBUTE_NAMES,n);return r.left=(r.left||0)-r.rx,r.top=(r.top||0)-r.ry,new this(r)}};e(d,`type`,`Ellipse`),e(d,`cacheProperties`,[...o,...u]),e(d,`ownDefaults`,{rx:0,ry:0}),e(d,`ATTRIBUTE_NAMES`,[...c,`cx`,`cy`,`rx`,`ry`]),i.setClass(d),i.setSVGClass(d);export{d as Ellipse};
+import{_defineProperty as e}from"../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.min.mjs";import{SCALE_X as t,SCALE_Y as n,twoMathPi as r}from"../constants.min.mjs";import{classRegistry as i}from"../ClassRegistry.min.mjs";import{escapeXml as a}from"../util/lang_string.min.mjs";import{cacheProperties as o}from"./Object/defaultValues.min.mjs";import{FabricObject as s}from"./Object/FabricObject.min.mjs";import{SHARED_ATTRIBUTES as c}from"../parser/attributes.min.mjs";import{parseAttributes as l}from"../parser/parseAttributes.min.mjs";const u=[`rx`,`ry`];var d=class e extends s{static getDefaults(){return{...super.getDefaults(),...e.ownDefaults}}constructor(t){super(),Object.assign(this,e.ownDefaults),this.setOptions(t)}_set(e,t){switch(super._set(e,t),e){case`rx`:this.rx=t,this.set(`width`,2*t);break;case`ry`:this.ry=t,this.set(`height`,2*t)}return this}getRx(){return this.get(`rx`)*this.get(t)}getRy(){return this.get(`ry`)*this.get(n)}toObject(e=[]){return super.toObject([...u,...e])}_toSVG(){return[`<ellipse `,`COMMON_PARTS`,`cx="0" cy="0" rx="${a(this.rx)}" ry="${a(this.ry)}" />\n`]}_render(e){e.beginPath(),e.save(),e.transform(1,0,0,this.ry/this.rx,0,0),e.arc(0,0,this.rx,0,r,!1),e.restore(),this._renderPaintInOrder(e)}static async fromElement(e,t,n){let r=l(e,this.ATTRIBUTE_NAMES,n);return r.left=(r.left||0)-r.rx,r.top=(r.top||0)-r.ry,new this(r)}};e(d,`type`,`Ellipse`),e(d,`cacheProperties`,[...o,...u]),e(d,`ownDefaults`,{rx:0,ry:0}),e(d,`ATTRIBUTE_NAMES`,[...c,`cx`,`cy`,`rx`,`ry`]),i.setClass(d),i.setSVGClass(d);export{d as Ellipse};
 //# sourceMappingURL=Ellipse.min.mjs.map

package/dist/src/shapes/Ellipse.mjs

@@ -1,4 +1,4 @@
-import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.mjs";
+import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.mjs";
 import { SCALE_X, SCALE_Y, twoMathPi } from "../constants.mjs";
 import { classRegistry } from "../ClassRegistry.mjs";
 import { escapeXml } from "../util/lang_string.mjs";

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

@@ -1,4 +1,4 @@
-import{_defineProperty as e}from"../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.min.mjs";import{log as t}from"../util/internals/console.min.mjs";import{classRegistry as n}from"../ClassRegistry.min.mjs";import{createCollectionMixin as r}from"../Collection.min.mjs";import{invertTransform as i,multiplyTransformMatrices as a}from"../util/misc/matrix.min.mjs";import{enlivenObjectEnlivables as o,enlivenObjects as s}from"../util/misc/objectEnlive.min.mjs";import{escapeXml as c}from"../util/lang_string.min.mjs";import{applyTransformToObject as l}from"../util/misc/objectTransforms.min.mjs";import{FabricObject as u}from"./Object/FabricObject.min.mjs";import{Rect as d}from"./Rect.min.mjs";import{LAYOUT_TYPE_ADDED as f,LAYOUT_TYPE_IMPERATIVE as p,LAYOUT_TYPE_INITIALIZATION as m,LAYOUT_TYPE_REMOVED as h}from"../LayoutManager/constants.min.mjs";import{LayoutManager as g}from"../LayoutManager/LayoutManager.min.mjs";var _=class extends g{performLayout(){}},v=class v extends r(u){static getDefaults(){return{...super.getDefaults(),...v.ownDefaults}}constructor(t=[],n={}){super(),e(this,`_activeObjects`,[]),e(this,`__objectSelectionTracker`,void 0),e(this,`__objectSelectionDisposer`,void 0),Object.assign(this,v.ownDefaults),this.setOptions(n),this.groupInit(t,n)}groupInit(e,t){var n;this._objects=[...e],this.__objectSelectionTracker=this.__objectSelectionMonitor.bind(this,!0),this.__objectSelectionDisposer=this.__objectSelectionMonitor.bind(this,!1),this.forEachObject(e=>{this.enterGroup(e,!1)}),this.layoutManager=(n=t.layoutManager)==null?new g:n,this.layoutManager.performLayout({type:m,target:this,targets:[...e],x:t.left,y:t.top})}canEnterGroup(e){return e===this||this.isDescendantOf(e)?(t(`error`,`Group: circular object trees are not supported, this call has no effect`),!1):this._objects.indexOf(e)===-1||(t(`error`,`Group: duplicate objects are not supported inside group, this call has no effect`),!1)}_filterObjectsBeforeEnteringGroup(e){return e.filter((e,t,n)=>this.canEnterGroup(e)&&n.indexOf(e)===t)}add(...e){let t=this._filterObjectsBeforeEnteringGroup(e),n=super.add(...t);return this._onAfterObjectsChange(f,t),n}insertAt(e,...t){let n=this._filterObjectsBeforeEnteringGroup(t),r=super.insertAt(e,...n);return this._onAfterObjectsChange(f,n),r}remove(...e){let t=super.remove(...e);return this._onAfterObjectsChange(h,t),t}_onObjectAdded(e){this.enterGroup(e,!0),this.fire(`object:added`,{target:e}),e.fire(`added`,{target:this})}_onObjectRemoved(e,t){this.exitGroup(e,t),this.fire(`object:removed`,{target:e}),e.fire(`removed`,{target:this})}_onAfterObjectsChange(e,t){this.layoutManager.performLayout({type:e,targets:t,target:this})}_onStackOrderChanged(){this._set(`dirty`,!0)}_set(e,t){let n=this[e];return super._set(e,t),e===`canvas`&&n!==t&&(this._objects||[]).forEach(n=>{n._set(e,t)}),this}_shouldSetNestedCoords(){return this.subTargetCheck}removeAll(){return this._activeObjects=[],this.remove(...this._objects)}__objectSelectionMonitor(e,{target:t}){let n=this._activeObjects;if(e)n.push(t),this._set(`dirty`,!0);else if(n.length>0){let e=n.indexOf(t);e>-1&&(n.splice(e,1),this._set(`dirty`,!0))}}_watchObject(e,t){e&&this._watchObject(!1,t),e?(t.on(`selected`,this.__objectSelectionTracker),t.on(`deselected`,this.__objectSelectionDisposer)):(t.off(`selected`,this.__objectSelectionTracker),t.off(`deselected`,this.__objectSelectionDisposer))}enterGroup(e,t){e.group&&e.group.remove(e),e._set(`parent`,this),this._enterGroup(e,t)}_enterGroup(e,t){t&&l(e,a(i(this.calcTransformMatrix()),e.calcTransformMatrix())),this._shouldSetNestedCoords()&&e.setCoords(),e._set(`group`,this),e._set(`canvas`,this.canvas),this._watchObject(!0,e);let n=this.canvas&&this.canvas.getActiveObject&&this.canvas.getActiveObject();n&&(n===e||e.isDescendantOf(n))&&this._activeObjects.push(e)}exitGroup(e,t){this._exitGroup(e,t),e._set(`parent`,void 0),e._set(`canvas`,void 0)}_exitGroup(e,t){e._set(`group`,void 0),t||(l(e,a(this.calcTransformMatrix(),e.calcTransformMatrix())),e.setCoords()),this._watchObject(!1,e);let n=this._activeObjects.length>0?this._activeObjects.indexOf(e):-1;n>-1&&this._activeObjects.splice(n,1)}shouldCache(){let e=u.prototype.shouldCache.call(this);if(e){for(let e=0;e<this._objects.length;e++)if(this._objects[e].willDrawShadow())return this.ownCaching=!1,!1}return e}willDrawShadow(){if(super.willDrawShadow())return!0;for(let e=0;e<this._objects.length;e++)if(this._objects[e].willDrawShadow())return!0;return!1}isOnACache(){return this.ownCaching||!!this.parent&&this.parent.isOnACache()}drawObject(e,t,n){this._renderBackground(e);for(let t=0;t<this._objects.length;t++){var r;let n=this._objects[t];(r=this.canvas)!=null&&r.preserveObjectStacking&&n.group!==this?(e.save(),e.transform(...i(this.calcTransformMatrix())),n.render(e),e.restore()):n.group===this&&n.render(e)}this._drawClipPath(e,this.clipPath,n)}setCoords(){super.setCoords(),this._shouldSetNestedCoords()&&this.forEachObject(e=>e.setCoords())}triggerLayout(e={}){this.layoutManager.performLayout({target:this,type:p,...e})}render(e){this._transformDone=!0,super.render(e),this._transformDone=!1}__serializeObjects(e,t){let n=this.includeDefaultValues;return this._objects.filter(function(e){return!e.excludeFromExport}).map(function(r){let i=r.includeDefaultValues;r.includeDefaultValues=n;let a=r[e||`toObject`](t);return r.includeDefaultValues=i,a})}toObject(e=[]){let t=this.layoutManager.toObject();return{...super.toObject([`subTargetCheck`,`interactive`,...e]),...t.strategy!==`fit-content`||this.includeDefaultValues?{layoutManager:t}:{},objects:this.__serializeObjects(`toObject`,e)}}toString(){return`#<Group: (${this.complexity()})>`}dispose(){this.layoutManager.unsubscribeTargets({targets:this.getObjects(),target:this}),this._activeObjects=[],this.forEachObject(e=>{this._watchObject(!1,e),e.dispose()}),super.dispose()}_createSVGBgRect(e){if(!this.backgroundColor)return``;let t=d.prototype._toSVG.call(this),n=t.indexOf(`COMMON_PARTS`);t[n]=`for="group" `;let r=t.join(``);return e?e(r):r}_toSVG(e){let t=[`<g `,`COMMON_PARTS`,` >
+import{_defineProperty as e}from"../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.min.mjs";import{log as t}from"../util/internals/console.min.mjs";import{classRegistry as n}from"../ClassRegistry.min.mjs";import{createCollectionMixin as r}from"../Collection.min.mjs";import{invertTransform as i,multiplyTransformMatrices as a}from"../util/misc/matrix.min.mjs";import{enlivenObjectEnlivables as o,enlivenObjects as s}from"../util/misc/objectEnlive.min.mjs";import{escapeXml as c}from"../util/lang_string.min.mjs";import{applyTransformToObject as l}from"../util/misc/objectTransforms.min.mjs";import{FabricObject as u}from"./Object/FabricObject.min.mjs";import{Rect as d}from"./Rect.min.mjs";import{LAYOUT_TYPE_ADDED as f,LAYOUT_TYPE_IMPERATIVE as p,LAYOUT_TYPE_INITIALIZATION as m,LAYOUT_TYPE_REMOVED as h}from"../LayoutManager/constants.min.mjs";import{LayoutManager as g}from"../LayoutManager/LayoutManager.min.mjs";var _=class extends g{performLayout(){}},v=class v extends r(u){static getDefaults(){return{...super.getDefaults(),...v.ownDefaults}}constructor(t=[],n={}){super(),e(this,`_activeObjects`,[]),e(this,`__objectSelectionTracker`,void 0),e(this,`__objectSelectionDisposer`,void 0),Object.assign(this,v.ownDefaults),this.setOptions(n),this.groupInit(t,n)}groupInit(e,t){var n;this._objects=[...e],this.__objectSelectionTracker=this.__objectSelectionMonitor.bind(this,!0),this.__objectSelectionDisposer=this.__objectSelectionMonitor.bind(this,!1),this.forEachObject(e=>{this.enterGroup(e,!1)}),this.layoutManager=(n=t.layoutManager)==null?new g:n,this.layoutManager.performLayout({type:m,target:this,targets:[...e],x:t.left,y:t.top})}canEnterGroup(e){return e===this||this.isDescendantOf(e)?(t(`error`,`Group: circular object trees are not supported, this call has no effect`),!1):this._objects.indexOf(e)===-1||(t(`error`,`Group: duplicate objects are not supported inside group, this call has no effect`),!1)}_filterObjectsBeforeEnteringGroup(e){return e.filter((e,t,n)=>this.canEnterGroup(e)&&n.indexOf(e)===t)}add(...e){let t=this._filterObjectsBeforeEnteringGroup(e),n=super.add(...t);return this._onAfterObjectsChange(f,t),n}insertAt(e,...t){let n=this._filterObjectsBeforeEnteringGroup(t),r=super.insertAt(e,...n);return this._onAfterObjectsChange(f,n),r}remove(...e){let t=super.remove(...e);return this._onAfterObjectsChange(h,t),t}_onObjectAdded(e){this.enterGroup(e,!0),this.fire(`object:added`,{target:e}),e.fire(`added`,{target:this})}_onObjectRemoved(e,t){this.exitGroup(e,t),this.fire(`object:removed`,{target:e}),e.fire(`removed`,{target:this})}_onAfterObjectsChange(e,t){this.layoutManager.performLayout({type:e,targets:t,target:this})}_onStackOrderChanged(){this._set(`dirty`,!0)}_set(e,t){let n=this[e];return super._set(e,t),e===`canvas`&&n!==t&&(this._objects||[]).forEach(n=>{n._set(e,t)}),this}_shouldSetNestedCoords(){return this.subTargetCheck}removeAll(){return this._activeObjects=[],this.remove(...this._objects)}__objectSelectionMonitor(e,{target:t}){let n=this._activeObjects;if(e)n.push(t),this._set(`dirty`,!0);else if(n.length>0){let e=n.indexOf(t);e>-1&&(n.splice(e,1),this._set(`dirty`,!0))}}_watchObject(e,t){e&&this._watchObject(!1,t),e?(t.on(`selected`,this.__objectSelectionTracker),t.on(`deselected`,this.__objectSelectionDisposer)):(t.off(`selected`,this.__objectSelectionTracker),t.off(`deselected`,this.__objectSelectionDisposer))}enterGroup(e,t){e.group&&e.group.remove(e),e._set(`parent`,this),this._enterGroup(e,t)}_enterGroup(e,t){t&&l(e,a(i(this.calcTransformMatrix()),e.calcTransformMatrix())),this._shouldSetNestedCoords()&&e.setCoords(),e._set(`group`,this),e._set(`canvas`,this.canvas),this._watchObject(!0,e);let n=this.canvas&&this.canvas.getActiveObject&&this.canvas.getActiveObject();n&&(n===e||e.isDescendantOf(n))&&this._activeObjects.push(e)}exitGroup(e,t){this._exitGroup(e,t),e._set(`parent`,void 0),e._set(`canvas`,void 0)}_exitGroup(e,t){e._set(`group`,void 0),t||(l(e,a(this.calcTransformMatrix(),e.calcTransformMatrix())),e.setCoords()),this._watchObject(!1,e);let n=this._activeObjects.length>0?this._activeObjects.indexOf(e):-1;n>-1&&this._activeObjects.splice(n,1)}shouldCache(){let e=u.prototype.shouldCache.call(this);if(e){for(let e=0;e<this._objects.length;e++)if(this._objects[e].willDrawShadow())return this.ownCaching=!1,!1}return e}willDrawShadow(){if(super.willDrawShadow())return!0;for(let e=0;e<this._objects.length;e++)if(this._objects[e].willDrawShadow())return!0;return!1}isOnACache(){return this.ownCaching||!!this.parent&&this.parent.isOnACache()}drawObject(e,t,n){this._renderBackground(e);for(let t=0;t<this._objects.length;t++){var r;let n=this._objects[t];(r=this.canvas)!=null&&r.preserveObjectStacking&&n.group!==this?(e.save(),e.transform(...i(this.calcTransformMatrix())),n.render(e),e.restore()):n.group===this&&n.render(e)}this._drawClipPath(e,this.clipPath,n)}setCoords(){super.setCoords(),this._shouldSetNestedCoords()&&this.forEachObject(e=>e.setCoords())}triggerLayout(e={}){this.layoutManager.performLayout({target:this,type:p,...e})}render(e){this._transformDone=!0,super.render(e),this._transformDone=!1}__serializeObjects(e,t){let n=this.includeDefaultValues;return this._objects.filter(function(e){return!e.excludeFromExport}).map(function(r){let i=r.includeDefaultValues;r.includeDefaultValues=n;let a=r[e||`toObject`](t);return r.includeDefaultValues=i,a})}toObject(e=[]){let t=this.layoutManager.toObject();return{...super.toObject([`subTargetCheck`,`interactive`,...e]),...t.strategy!==`fit-content`||this.includeDefaultValues?{layoutManager:t}:{},objects:this.__serializeObjects(`toObject`,e)}}toString(){return`#<Group: (${this.complexity()})>`}dispose(){this.layoutManager.unsubscribeTargets({targets:this.getObjects(),target:this}),this._activeObjects=[],this.forEachObject(e=>{this._watchObject(!1,e),e.dispose()}),super.dispose()}_createSVGBgRect(e){if(!this.backgroundColor)return``;let t=d.prototype._toSVG.call(this),n=t.indexOf(`COMMON_PARTS`);t[n]=`for="group" `;let r=t.join(``);return e?e(r):r}_toSVG(e){let t=[`<g `,`COMMON_PARTS`,` >
 `],n=this._createSVGBgRect(e);n&&t.push(`		`,n);for(let n=0;n<this._objects.length;n++)t.push(`		`,this._objects[n].toSVG(e));return t.push(`</g>
 `),t}getSvgStyles(){let e=this.opacity!==void 0&&this.opacity!==1?`opacity: ${c(this.opacity)};`:``,t=this.visible?``:` visibility: hidden;`;return[e,this.getSvgFilter(),t].join(``)}toClipPathSVG(e){let t=[],n=this._createSVGBgRect(e);n&&t.push(`	`,n);for(let n=0;n<this._objects.length;n++)t.push(`	`,this._objects[n].toClipPathSVG(e));return this._createBaseClipPathSVGMarkup(t,{reviver:e})}static fromObject({type:e,objects:t=[],layoutManager:r,...i},a){return Promise.all([s(t,a),o(i,a)]).then(([e,t])=>{let a=new this(e,{...i,...t,layoutManager:new _});return a.layoutManager=r?new(n.getClass(r.type))(new(n.getClass(r.strategy))):new g,a.layoutManager.subscribeTargets({type:m,target:a,targets:a.getObjects()}),a.setCoords(),a})}};e(v,`type`,`Group`),e(v,`ownDefaults`,{strokeWidth:0,subTargetCheck:!1,interactive:!1}),n.setClass(v);export{v as Group};
 //# sourceMappingURL=Group.min.mjs.map

package/dist/src/shapes/Group.mjs

@@ -1,4 +1,4 @@
-import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.mjs";
+import { _defineProperty } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.mjs";
 import { log } from "../util/internals/console.mjs";
 import { classRegistry } from "../ClassRegistry.mjs";
 import { createCollectionMixin } from "../Collection.mjs";

package/dist/src/shapes/IText/DraggableTextDelegate.min.mjs

@@ -1,2 +1,2 @@
-import{_defineProperty as e}from"../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.min.mjs";import{CHANGED as t,NONE as n}from"../../constants.min.mjs";import{Point as r}from"../../Point.min.mjs";import{getDocumentFromElement as i}from"../../util/dom_misc.min.mjs";import{cloneStyles as a}from"../../util/internals/cloneStyles.min.mjs";import{setStyle as o}from"../../util/internals/dom_style.min.mjs";var s=class{constructor(t){e(this,`target`,void 0),e(this,`__mouseDownInPlace`,!1),e(this,`__dragStartFired`,!1),e(this,`__isDraggingOver`,!1),e(this,`__dragStartSelection`,void 0),e(this,`__dragImageDisposer`,void 0),e(this,`_dispose`,void 0),this.target=t;let n=[this.target.on(`dragenter`,this.dragEnterHandler.bind(this)),this.target.on(`dragover`,this.dragOverHandler.bind(this)),this.target.on(`dragleave`,this.dragLeaveHandler.bind(this)),this.target.on(`dragend`,this.dragEndHandler.bind(this)),this.target.on(`drop`,this.dropHandler.bind(this))];this._dispose=()=>{n.forEach(e=>e()),this._dispose=void 0}}isPointerOverSelection(e){let t=this.target,n=t.getSelectionStartFromPointer(e);return t.isEditing&&n>=t.selectionStart&&n<=t.selectionEnd&&t.selectionStart<t.selectionEnd}start(e){return this.__mouseDownInPlace=this.isPointerOverSelection(e)}isActive(){return this.__mouseDownInPlace}end(e){let t=this.isActive();return t&&!this.__dragStartFired&&(this.target.setCursorByClick(e),this.target.initDelayedCursor(!0)),this.__mouseDownInPlace=!1,this.__dragStartFired=!1,this.__isDraggingOver=!1,t}getDragStartSelection(){return this.__dragStartSelection}setDragImage(e,{selectionStart:t,selectionEnd:s}){var c;let l=this.target,u=l.canvas,d=new r(l.flipX?-1:1,l.flipY?-1:1),f=l._getCursorBoundaries(t),p=new r(f.left+f.leftOffset,f.top+f.topOffset).multiply(d).transform(l.calcTransformMatrix()),m=u.getScenePoint(e).subtract(p),h=l.getCanvasRetinaScaling(),g=l.getBoundingRect(),_=p.subtract(new r(g.left,g.top)),v=u.viewportTransform,y=_.add(m).transform(v,!0),b=l.backgroundColor,x=a(l.styles);l.backgroundColor=``;let S={stroke:`transparent`,fill:`transparent`,textBackgroundColor:`transparent`};l.setSelectionStyles(S,0,t),l.setSelectionStyles(S,s,l.text.length),l.dirty=!0;let C=l.toCanvasElement({enableRetinaScaling:u.enableRetinaScaling,viewportTransform:!0});l.backgroundColor=b,l.styles=x,l.dirty=!0,o(C,{position:`fixed`,left:-C.width+`px`,border:n,width:C.width/h+`px`,height:C.height/h+`px`}),this.__dragImageDisposer&&this.__dragImageDisposer(),this.__dragImageDisposer=()=>{C.remove()},i(e.target||this.target.hiddenTextarea).body.appendChild(C),(c=e.dataTransfer)==null||c.setDragImage(C,y.x,y.y)}onDragStart(e){this.__dragStartFired=!0;let t=this.target,n=this.isActive();if(n&&e.dataTransfer){let n=this.__dragStartSelection={selectionStart:t.selectionStart,selectionEnd:t.selectionEnd},r=t._text.slice(n.selectionStart,n.selectionEnd).join(``),i={text:t.text,value:r,...n};e.dataTransfer.setData(`text/plain`,r),e.dataTransfer.setData(`application/fabric`,JSON.stringify({value:r,styles:t.getSelectionStyles(n.selectionStart,n.selectionEnd,!0)})),e.dataTransfer.effectAllowed=`copyMove`,this.setDragImage(e,i)}return t.abortCursorAnimation(),n}canDrop(e){if(this.target.editable&&!this.target.getActiveControl()&&!e.defaultPrevented){if(this.isActive()&&this.__dragStartSelection){let t=this.target.getSelectionStartFromPointer(e),n=this.__dragStartSelection;return t<n.selectionStart||t>n.selectionEnd}return!0}return!1}targetCanDrop(e){return this.target.canDrop(e)}dragEnterHandler({e}){let t=this.targetCanDrop(e);!this.__isDraggingOver&&t&&(this.__isDraggingOver=!0)}dragOverHandler(e){let{e:t}=e,n=this.targetCanDrop(t);!this.__isDraggingOver&&n?this.__isDraggingOver=!0:this.__isDraggingOver&&!n&&(this.__isDraggingOver=!1),this.__isDraggingOver&&(t.preventDefault(),e.canDrop=!0,e.dropTarget=this.target)}dragLeaveHandler(){(this.__isDraggingOver||this.isActive())&&(this.__isDraggingOver=!1)}dropHandler(e){var n;let{e:r}=e,i=r.defaultPrevented;this.__isDraggingOver=!1,r.preventDefault();let a=(n=r.dataTransfer)==null?void 0:n.getData(`text/plain`);if(a&&!i){let n=this.target,i=n.canvas,o=n.getSelectionStartFromPointer(r),{styles:s}=r.dataTransfer.types.includes(`application/fabric`)?JSON.parse(r.dataTransfer.getData(`application/fabric`)):{},c=a[Math.max(0,a.length-1)];if(this.__dragStartSelection){let e=this.__dragStartSelection.selectionStart,t=this.__dragStartSelection.selectionEnd;o>e&&o<=t?o=e:o>t&&(o-=t-e),n.removeChars(e,t),delete this.__dragStartSelection}n._reNewline.test(c)&&(n._reNewline.test(n._text[o])||o===n._text.length)&&(a=a.trimEnd()),e.didDrop=!0,e.dropTarget=n,n.insertChars(a,s,o),i.setActiveObject(n),n.enterEditing(r),n.selectionStart=Math.min(o+0,n._text.length),n.selectionEnd=Math.min(n.selectionStart+a.length,n._text.length),n.hiddenTextarea.value=n.text,n._updateTextarea(),n.hiddenTextarea.focus(),n.fire(t,{index:o+0,action:`drop`}),i.fire(`text:changed`,{target:n}),i.contextTopDirty=!0,i.requestRenderAll()}}dragEndHandler({e}){if(this.isActive()&&this.__dragStartFired&&this.__dragStartSelection){var n;let r=this.target,i=this.target.canvas,{selectionStart:a,selectionEnd:o}=this.__dragStartSelection,s=((n=e.dataTransfer)==null?void 0:n.dropEffect)||`none`;s===`none`?(r.selectionStart=a,r.selectionEnd=o,r._updateTextarea(),r.hiddenTextarea.focus()):(r.clearContextTop(),s===`move`&&(r.removeChars(a,o),r.selectionStart=r.selectionEnd=a,r.hiddenTextarea&&(r.hiddenTextarea.value=r.text),r._updateTextarea(),r.fire(t,{index:a,action:`dragend`}),i.fire(`text:changed`,{target:r}),i.requestRenderAll()),r.exitEditing())}this.__dragImageDisposer&&this.__dragImageDisposer(),delete this.__dragImageDisposer,delete this.__dragStartSelection,this.__isDraggingOver=!1}dispose(){this._dispose&&this._dispose()}};export{s as DraggableTextDelegate};
+import{_defineProperty as e}from"../../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.min.mjs";import{CHANGED as t,NONE as n}from"../../constants.min.mjs";import{Point as r}from"../../Point.min.mjs";import{getDocumentFromElement as i}from"../../util/dom_misc.min.mjs";import{cloneStyles as a}from"../../util/internals/cloneStyles.min.mjs";import{setStyle as o}from"../../util/internals/dom_style.min.mjs";var s=class{constructor(t){e(this,`target`,void 0),e(this,`__mouseDownInPlace`,!1),e(this,`__dragStartFired`,!1),e(this,`__isDraggingOver`,!1),e(this,`__dragStartSelection`,void 0),e(this,`__dragImageDisposer`,void 0),e(this,`_dispose`,void 0),this.target=t;let n=[this.target.on(`dragenter`,this.dragEnterHandler.bind(this)),this.target.on(`dragover`,this.dragOverHandler.bind(this)),this.target.on(`dragleave`,this.dragLeaveHandler.bind(this)),this.target.on(`dragend`,this.dragEndHandler.bind(this)),this.target.on(`drop`,this.dropHandler.bind(this))];this._dispose=()=>{n.forEach(e=>e()),this._dispose=void 0}}isPointerOverSelection(e){let t=this.target,n=t.getSelectionStartFromPointer(e);return t.isEditing&&n>=t.selectionStart&&n<=t.selectionEnd&&t.selectionStart<t.selectionEnd}start(e){return this.__mouseDownInPlace=this.isPointerOverSelection(e)}isActive(){return this.__mouseDownInPlace}end(e){let t=this.isActive();return t&&!this.__dragStartFired&&(this.target.setCursorByClick(e),this.target.initDelayedCursor(!0)),this.__mouseDownInPlace=!1,this.__dragStartFired=!1,this.__isDraggingOver=!1,t}getDragStartSelection(){return this.__dragStartSelection}setDragImage(e,{selectionStart:t,selectionEnd:s}){var c;let l=this.target,u=l.canvas,d=new r(l.flipX?-1:1,l.flipY?-1:1),f=l._getCursorBoundaries(t),p=new r(f.left+f.leftOffset,f.top+f.topOffset).multiply(d).transform(l.calcTransformMatrix()),m=u.getScenePoint(e).subtract(p),h=l.getCanvasRetinaScaling(),g=l.getBoundingRect(),_=p.subtract(new r(g.left,g.top)),v=u.viewportTransform,y=_.add(m).transform(v,!0),b=l.backgroundColor,x=a(l.styles);l.backgroundColor=``;let S={stroke:`transparent`,fill:`transparent`,textBackgroundColor:`transparent`};l.setSelectionStyles(S,0,t),l.setSelectionStyles(S,s,l.text.length),l.dirty=!0;let C=l.toCanvasElement({enableRetinaScaling:u.enableRetinaScaling,viewportTransform:!0});l.backgroundColor=b,l.styles=x,l.dirty=!0,o(C,{position:`fixed`,left:-C.width+`px`,border:n,width:C.width/h+`px`,height:C.height/h+`px`}),this.__dragImageDisposer&&this.__dragImageDisposer(),this.__dragImageDisposer=()=>{C.remove()},i(e.target||this.target.hiddenTextarea).body.appendChild(C),(c=e.dataTransfer)==null||c.setDragImage(C,y.x,y.y)}onDragStart(e){this.__dragStartFired=!0;let t=this.target,n=this.isActive();if(n&&e.dataTransfer){let n=this.__dragStartSelection={selectionStart:t.selectionStart,selectionEnd:t.selectionEnd},r=t._text.slice(n.selectionStart,n.selectionEnd).join(``),i={text:t.text,value:r,...n};e.dataTransfer.setData(`text/plain`,r),e.dataTransfer.setData(`application/fabric`,JSON.stringify({value:r,styles:t.getSelectionStyles(n.selectionStart,n.selectionEnd,!0)})),e.dataTransfer.effectAllowed=`copyMove`,this.setDragImage(e,i)}return t.abortCursorAnimation(),n}canDrop(e){if(this.target.editable&&!this.target.getActiveControl()&&!e.defaultPrevented){if(this.isActive()&&this.__dragStartSelection){let t=this.target.getSelectionStartFromPointer(e),n=this.__dragStartSelection;return t<n.selectionStart||t>n.selectionEnd}return!0}return!1}targetCanDrop(e){return this.target.canDrop(e)}dragEnterHandler({e}){let t=this.targetCanDrop(e);!this.__isDraggingOver&&t&&(this.__isDraggingOver=!0)}dragOverHandler(e){let{e:t}=e,n=this.targetCanDrop(t);!this.__isDraggingOver&&n?this.__isDraggingOver=!0:this.__isDraggingOver&&!n&&(this.__isDraggingOver=!1),this.__isDraggingOver&&(t.preventDefault(),e.canDrop=!0,e.dropTarget=this.target)}dragLeaveHandler(){(this.__isDraggingOver||this.isActive())&&(this.__isDraggingOver=!1)}dropHandler(e){var n;let{e:r}=e,i=r.defaultPrevented;this.__isDraggingOver=!1,r.preventDefault();let a=(n=r.dataTransfer)==null?void 0:n.getData(`text/plain`);if(a&&!i){let n=this.target,i=n.canvas,o=n.getSelectionStartFromPointer(r),{styles:s}=r.dataTransfer.types.includes(`application/fabric`)?JSON.parse(r.dataTransfer.getData(`application/fabric`)):{},c=a[Math.max(0,a.length-1)];if(this.__dragStartSelection){let e=this.__dragStartSelection.selectionStart,t=this.__dragStartSelection.selectionEnd;o>e&&o<=t?o=e:o>t&&(o-=t-e),n.removeChars(e,t),delete this.__dragStartSelection}n._reNewline.test(c)&&(n._reNewline.test(n._text[o])||o===n._text.length)&&(a=a.trimEnd()),e.didDrop=!0,e.dropTarget=n,n.insertChars(a,s,o),i.setActiveObject(n),n.enterEditing(r),n.selectionStart=Math.min(o+0,n._text.length),n.selectionEnd=Math.min(n.selectionStart+a.length,n._text.length),n.hiddenTextarea.value=n.text,n._updateTextarea(),n.hiddenTextarea.focus(),n.fire(t,{index:o+0,action:`drop`}),i.fire(`text:changed`,{target:n}),i.contextTopDirty=!0,i.requestRenderAll()}}dragEndHandler({e}){if(this.isActive()&&this.__dragStartFired&&this.__dragStartSelection){var n;let r=this.target,i=this.target.canvas,{selectionStart:a,selectionEnd:o}=this.__dragStartSelection,s=((n=e.dataTransfer)==null?void 0:n.dropEffect)||`none`;s===`none`?(r.selectionStart=a,r.selectionEnd=o,r._updateTextarea(),r.hiddenTextarea.focus()):(r.clearContextTop(),s===`move`&&(r.removeChars(a,o),r.selectionStart=r.selectionEnd=a,r.hiddenTextarea&&(r.hiddenTextarea.value=r.text),r._updateTextarea(),r.fire(t,{index:a,action:`dragend`}),i.fire(`text:changed`,{target:r}),i.requestRenderAll()),r.exitEditing())}this.__dragImageDisposer&&this.__dragImageDisposer(),delete this.__dragImageDisposer,delete this.__dragStartSelection,this.__isDraggingOver=!1}dispose(){this._dispose&&this._dispose()}};export{s as DraggableTextDelegate};
 //# sourceMappingURL=DraggableTextDelegate.min.mjs.map

package/dist/src/shapes/IText/DraggableTextDelegate.mjs

@@ -1,4 +1,4 @@
-import { _defineProperty } from "../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.mjs";
+import { _defineProperty } from "../../../_virtual/_@oxc-project_runtime@0.126.0/helpers/defineProperty.mjs";
 import { CHANGED, NONE } from "../../constants.mjs";
 import { Point } from "../../Point.mjs";
 import { getDocumentFromElement } from "../../util/dom_misc.mjs";