fabric 6.0.0 → 6.0.2

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

@@ -1 +1 @@
-{"version":3,"file":"skew.min.mjs","sources":["../../../src/controls/skew.ts"],"sourcesContent":["import type {\n  ControlCursorCallback,\n  TPointerEvent,\n  Transform,\n  TransformActionHandler,\n} from '../EventTypeDefs';\nimport { resolveOrigin } from '../util/misc/resolveOrigin';\nimport { Point } from '../Point';\nimport type { TAxis, TAxisKey } from '../typedefs';\nimport {\n  degreesToRadians,\n  radiansToDegrees,\n} from '../util/misc/radiansDegreesConversion';\nimport {\n  findCornerQuadrant,\n  getLocalPoint,\n  isLocked,\n  NOT_ALLOWED_CURSOR,\n} from './util';\nimport { wrapWithFireEvent } from './wrapWithFireEvent';\nimport { wrapWithFixedAnchor } from './wrapWithFixedAnchor';\nimport { CENTER } from '../constants';\n\nexport type SkewTransform = Transform & { skewingSide: -1 | 1 };\n\nconst AXIS_KEYS: Record<\n  TAxis,\n  {\n    counterAxis: TAxis;\n    scale: TAxisKey<'scale'>;\n    skew: TAxisKey<'skew'>;\n    lockSkewing: TAxisKey<'lockSkewing'>;\n    origin: TAxisKey<'origin'>;\n    flip: TAxisKey<'flip'>;\n  }\n> = {\n  x: {\n    counterAxis: 'y',\n    scale: 'scaleX',\n    skew: 'skewX',\n    lockSkewing: 'lockSkewingX',\n    origin: 'originX',\n    flip: 'flipX',\n  },\n  y: {\n    counterAxis: 'x',\n    scale: 'scaleY',\n    skew: 'skewY',\n    lockSkewing: 'lockSkewingY',\n    origin: 'originY',\n    flip: 'flipY',\n  },\n};\n\nconst skewMap = ['ns', 'nesw', 'ew', 'nwse'];\n\n/**\n * return the correct cursor style for the skew action\n * @param {Event} eventData the javascript event that is causing the scale\n * @param {Control} control the control that is interested in the action\n * @param {FabricObject} fabricObject the fabric object that is interested in the action\n * @return {String} a valid css string for the cursor\n */\nexport const skewCursorStyleHandler: ControlCursorCallback = (\n  eventData,\n  control,\n  fabricObject\n) => {\n  if (control.x !== 0 && isLocked(fabricObject, 'lockSkewingY')) {\n    return NOT_ALLOWED_CURSOR;\n  }\n  if (control.y !== 0 && isLocked(fabricObject, 'lockSkewingX')) {\n    return NOT_ALLOWED_CURSOR;\n  }\n  const n = findCornerQuadrant(fabricObject, control) % 4;\n  return `${skewMap[n]}-resize`;\n};\n\n/**\n * Since skewing is applied before scaling, calculations are done in a scaleless plane\n * @see https://github.com/fabricjs/fabric.js/pull/8380\n */\nfunction skewObject(\n  axis: TAxis,\n  { target, ex, ey, skewingSide, ...transform }: SkewTransform,\n  pointer: Point\n) {\n  const { skew: skewKey } = AXIS_KEYS[axis],\n    offset = pointer\n      .subtract(new Point(ex, ey))\n      .divide(new Point(target.scaleX, target.scaleY))[axis],\n    skewingBefore = target[skewKey],\n    skewingStart = transform[skewKey],\n    shearingStart = Math.tan(degreesToRadians(skewingStart)),\n    // let a, b be the size of target\n    // let a' be the value of a after applying skewing\n    // then:\n    // a' = a + b * skewA => skewA = (a' - a) / b\n    // the value b is tricky since skewY is applied before skewX\n    b =\n      axis === 'y'\n        ? target._getTransformedDimensions({\n            scaleX: 1,\n            scaleY: 1,\n            // since skewY is applied before skewX, b (=width) is not affected by skewX\n            skewX: 0,\n          }).x\n        : target._getTransformedDimensions({\n            scaleX: 1,\n            scaleY: 1,\n          }).y;\n\n  const shearing =\n    (2 * offset * skewingSide) /\n      // we max out fractions to safeguard from asymptotic behavior\n      Math.max(b, 1) +\n    // add starting state\n    shearingStart;\n\n  const skewing = radiansToDegrees(Math.atan(shearing));\n\n  target.set(skewKey, skewing);\n  const changed = skewingBefore !== target[skewKey];\n\n  if (changed && axis === 'y') {\n    // we don't want skewing to affect scaleX\n    // so we factor it by the inverse skewing diff to make it seem unchanged to the viewer\n    const { skewX, scaleX } = target,\n      dimBefore = target._getTransformedDimensions({ skewY: skewingBefore }),\n      dimAfter = target._getTransformedDimensions(),\n      compensationFactor = skewX !== 0 ? dimBefore.x / dimAfter.x : 1;\n    compensationFactor !== 1 &&\n      target.set('scaleX', compensationFactor * scaleX);\n  }\n\n  return changed;\n}\n\n/**\n * Wrapped Action handler for skewing on a given axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nfunction skewHandler(\n  axis: TAxis,\n  eventData: TPointerEvent,\n  transform: Transform,\n  x: number,\n  y: number\n) {\n  const { target } = transform,\n    {\n      counterAxis,\n      origin: originKey,\n      lockSkewing: lockSkewingKey,\n      skew: skewKey,\n      flip: flipKey,\n    } = AXIS_KEYS[axis];\n  if (isLocked(target, lockSkewingKey)) {\n    return false;\n  }\n\n  const { origin: counterOriginKey, flip: counterFlipKey } =\n      AXIS_KEYS[counterAxis],\n    counterOriginFactor =\n      resolveOrigin(transform[counterOriginKey]) *\n      (target[counterFlipKey] ? -1 : 1),\n    // if the counter origin is top/left (= -0.5) then we are skewing x/y values on the bottom/right side of target respectively.\n    // if the counter origin is bottom/right (= 0.5) then we are skewing x/y values on the top/left side of target respectively.\n    // skewing direction on the top/left side of target is OPPOSITE to the direction of the movement of the pointer,\n    // so we factor skewing direction by this value.\n    skewingSide = (-Math.sign(counterOriginFactor) *\n      (target[flipKey] ? -1 : 1)) as 1 | -1,\n    skewingDirection =\n      ((target[skewKey] === 0 &&\n        // in case skewing equals 0 we use the pointer offset from target center to determine the direction of skewing\n        getLocalPoint(transform, CENTER, CENTER, x, y)[axis] > 0) ||\n      // in case target has skewing we use that as the direction\n      target[skewKey] > 0\n        ? 1\n        : -1) * skewingSide,\n    // anchor to the opposite side of the skewing direction\n    // normalize value from [-1, 1] to origin value [0, 1]\n    origin = -skewingDirection * 0.5 + 0.5;\n\n  const finalHandler = wrapWithFireEvent<SkewTransform>(\n    'skewing',\n    wrapWithFixedAnchor((eventData, transform, x, y) =>\n      skewObject(axis, transform, new Point(x, y))\n    )\n  );\n\n  return finalHandler(\n    eventData,\n    {\n      ...transform,\n      [originKey]: origin,\n      skewingSide,\n    },\n    x,\n    y\n  );\n}\n\n/**\n * Wrapped Action handler for skewing on the X axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nexport const skewHandlerX: TransformActionHandler = (\n  eventData,\n  transform,\n  x,\n  y\n) => {\n  return skewHandler('x', eventData, transform, x, y);\n};\n\n/**\n * Wrapped Action handler for skewing on the Y axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nexport const skewHandlerY: TransformActionHandler = (\n  eventData,\n  transform,\n  x,\n  y\n) => {\n  return skewHandler('y', eventData, transform, x, y);\n};\n"],"names":["AXIS_KEYS","x","counterAxis","scale","skew","lockSkewing","origin","flip","y","skewMap","skewCursorStyleHandler","eventData","control","fabricObject","isLocked","NOT_ALLOWED_CURSOR","n","findCornerQuadrant","concat","skewHandler","axis","transform","target","originKey","lockSkewingKey","skewKey","flipKey","counterOriginKey","counterFlipKey","counterOriginFactor","resolveOrigin","skewingSide","Math","sign","getLocalPoint","CENTER","finalHandler","wrapWithFireEvent","wrapWithFixedAnchor","_ref","pointer","ex","ey","_objectWithoutProperties","_excluded","offset","subtract","Point","divide","scaleX","scaleY","skewingBefore","skewingStart","shearingStart","tan","degreesToRadians","b","_getTransformedDimensions","skewX","shearing","max","skewing","radiansToDegrees","atan","set","changed","dimBefore","skewY","dimAfter","compensationFactor","skewObject","_objectSpread","skewHandlerX","skewHandlerY"],"mappings":"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"}
+{"version":3,"file":"skew.min.mjs","sources":["../../../src/controls/skew.ts"],"sourcesContent":["import type {\n  ControlCursorCallback,\n  TPointerEvent,\n  Transform,\n  TransformActionHandler,\n} from '../EventTypeDefs';\nimport { resolveOrigin } from '../util/misc/resolveOrigin';\nimport { Point } from '../Point';\nimport type { TAxis, TAxisKey } from '../typedefs';\nimport {\n  degreesToRadians,\n  radiansToDegrees,\n} from '../util/misc/radiansDegreesConversion';\nimport {\n  findCornerQuadrant,\n  getLocalPoint,\n  isLocked,\n  NOT_ALLOWED_CURSOR,\n} from './util';\nimport { wrapWithFireEvent } from './wrapWithFireEvent';\nimport { wrapWithFixedAnchor } from './wrapWithFixedAnchor';\nimport {\n  CENTER,\n  SCALE_X,\n  SCALE_Y,\n  SKEWING,\n  SKEW_X,\n  SKEW_Y,\n} from '../constants';\n\nexport type SkewTransform = Transform & { skewingSide: -1 | 1 };\n\nconst AXIS_KEYS: Record<\n  TAxis,\n  {\n    counterAxis: TAxis;\n    scale: TAxisKey<'scale'>;\n    skew: TAxisKey<'skew'>;\n    lockSkewing: TAxisKey<'lockSkewing'>;\n    origin: TAxisKey<'origin'>;\n    flip: TAxisKey<'flip'>;\n  }\n> = {\n  x: {\n    counterAxis: 'y',\n    scale: SCALE_X,\n    skew: SKEW_X,\n    lockSkewing: 'lockSkewingX',\n    origin: 'originX',\n    flip: 'flipX',\n  },\n  y: {\n    counterAxis: 'x',\n    scale: SCALE_Y,\n    skew: SKEW_Y,\n    lockSkewing: 'lockSkewingY',\n    origin: 'originY',\n    flip: 'flipY',\n  },\n};\n\nconst skewMap = ['ns', 'nesw', 'ew', 'nwse'];\n\n/**\n * return the correct cursor style for the skew action\n * @param {Event} eventData the javascript event that is causing the scale\n * @param {Control} control the control that is interested in the action\n * @param {FabricObject} fabricObject the fabric object that is interested in the action\n * @return {String} a valid css string for the cursor\n */\nexport const skewCursorStyleHandler: ControlCursorCallback = (\n  eventData,\n  control,\n  fabricObject\n) => {\n  if (control.x !== 0 && isLocked(fabricObject, 'lockSkewingY')) {\n    return NOT_ALLOWED_CURSOR;\n  }\n  if (control.y !== 0 && isLocked(fabricObject, 'lockSkewingX')) {\n    return NOT_ALLOWED_CURSOR;\n  }\n  const n = findCornerQuadrant(fabricObject, control) % 4;\n  return `${skewMap[n]}-resize`;\n};\n\n/**\n * Since skewing is applied before scaling, calculations are done in a scaleless plane\n * @see https://github.com/fabricjs/fabric.js/pull/8380\n */\nfunction skewObject(\n  axis: TAxis,\n  { target, ex, ey, skewingSide, ...transform }: SkewTransform,\n  pointer: Point\n) {\n  const { skew: skewKey } = AXIS_KEYS[axis],\n    offset = pointer\n      .subtract(new Point(ex, ey))\n      .divide(new Point(target.scaleX, target.scaleY))[axis],\n    skewingBefore = target[skewKey],\n    skewingStart = transform[skewKey],\n    shearingStart = Math.tan(degreesToRadians(skewingStart)),\n    // let a, b be the size of target\n    // let a' be the value of a after applying skewing\n    // then:\n    // a' = a + b * skewA => skewA = (a' - a) / b\n    // the value b is tricky since skewY is applied before skewX\n    b =\n      axis === 'y'\n        ? target._getTransformedDimensions({\n            scaleX: 1,\n            scaleY: 1,\n            // since skewY is applied before skewX, b (=width) is not affected by skewX\n            skewX: 0,\n          }).x\n        : target._getTransformedDimensions({\n            scaleX: 1,\n            scaleY: 1,\n          }).y;\n\n  const shearing =\n    (2 * offset * skewingSide) /\n      // we max out fractions to safeguard from asymptotic behavior\n      Math.max(b, 1) +\n    // add starting state\n    shearingStart;\n\n  const skewing = radiansToDegrees(Math.atan(shearing));\n\n  target.set(skewKey, skewing);\n  const changed = skewingBefore !== target[skewKey];\n\n  if (changed && axis === 'y') {\n    // we don't want skewing to affect scaleX\n    // so we factor it by the inverse skewing diff to make it seem unchanged to the viewer\n    const { skewX, scaleX } = target,\n      dimBefore = target._getTransformedDimensions({ skewY: skewingBefore }),\n      dimAfter = target._getTransformedDimensions(),\n      compensationFactor = skewX !== 0 ? dimBefore.x / dimAfter.x : 1;\n    compensationFactor !== 1 &&\n      target.set(SCALE_X, compensationFactor * scaleX);\n  }\n\n  return changed;\n}\n\n/**\n * Wrapped Action handler for skewing on a given axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nfunction skewHandler(\n  axis: TAxis,\n  eventData: TPointerEvent,\n  transform: Transform,\n  x: number,\n  y: number\n) {\n  const { target } = transform,\n    {\n      counterAxis,\n      origin: originKey,\n      lockSkewing: lockSkewingKey,\n      skew: skewKey,\n      flip: flipKey,\n    } = AXIS_KEYS[axis];\n  if (isLocked(target, lockSkewingKey)) {\n    return false;\n  }\n\n  const { origin: counterOriginKey, flip: counterFlipKey } =\n      AXIS_KEYS[counterAxis],\n    counterOriginFactor =\n      resolveOrigin(transform[counterOriginKey]) *\n      (target[counterFlipKey] ? -1 : 1),\n    // if the counter origin is top/left (= -0.5) then we are skewing x/y values on the bottom/right side of target respectively.\n    // if the counter origin is bottom/right (= 0.5) then we are skewing x/y values on the top/left side of target respectively.\n    // skewing direction on the top/left side of target is OPPOSITE to the direction of the movement of the pointer,\n    // so we factor skewing direction by this value.\n    skewingSide = (-Math.sign(counterOriginFactor) *\n      (target[flipKey] ? -1 : 1)) as 1 | -1,\n    skewingDirection =\n      ((target[skewKey] === 0 &&\n        // in case skewing equals 0 we use the pointer offset from target center to determine the direction of skewing\n        getLocalPoint(transform, CENTER, CENTER, x, y)[axis] > 0) ||\n      // in case target has skewing we use that as the direction\n      target[skewKey] > 0\n        ? 1\n        : -1) * skewingSide,\n    // anchor to the opposite side of the skewing direction\n    // normalize value from [-1, 1] to origin value [0, 1]\n    origin = -skewingDirection * 0.5 + 0.5;\n\n  const finalHandler = wrapWithFireEvent<SkewTransform>(\n    SKEWING,\n    wrapWithFixedAnchor((eventData, transform, x, y) =>\n      skewObject(axis, transform, new Point(x, y))\n    )\n  );\n\n  return finalHandler(\n    eventData,\n    {\n      ...transform,\n      [originKey]: origin,\n      skewingSide,\n    },\n    x,\n    y\n  );\n}\n\n/**\n * Wrapped Action handler for skewing on the X axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nexport const skewHandlerX: TransformActionHandler = (\n  eventData,\n  transform,\n  x,\n  y\n) => {\n  return skewHandler('x', eventData, transform, x, y);\n};\n\n/**\n * Wrapped Action handler for skewing on the Y axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nexport const skewHandlerY: TransformActionHandler = (\n  eventData,\n  transform,\n  x,\n  y\n) => {\n  return skewHandler('y', eventData, transform, x, y);\n};\n"],"names":["AXIS_KEYS","x","counterAxis","scale","SCALE_X","skew","SKEW_X","lockSkewing","origin","flip","y","SCALE_Y","SKEW_Y","skewMap","skewCursorStyleHandler","eventData","control","fabricObject","isLocked","NOT_ALLOWED_CURSOR","n","findCornerQuadrant","concat","skewHandler","axis","transform","target","originKey","lockSkewingKey","skewKey","flipKey","counterOriginKey","counterFlipKey","counterOriginFactor","resolveOrigin","skewingSide","Math","sign","getLocalPoint","CENTER","finalHandler","wrapWithFireEvent","SKEWING","wrapWithFixedAnchor","_ref","pointer","ex","ey","_objectWithoutProperties","_excluded","offset","subtract","Point","divide","scaleX","scaleY","skewingBefore","skewingStart","shearingStart","tan","degreesToRadians","b","_getTransformedDimensions","skewX","shearing","max","skewing","radiansToDegrees","atan","set","changed","dimBefore","skewY","dimAfter","compensationFactor","skewObject","_objectSpread","skewHandlerX","skewHandlerY"],"mappings":"0sBAgCMA,EAUF,CACFC,EAAG,CACDC,YAAa,IACbC,MAAOC,EACPC,KAAMC,EACNC,YAAa,eACbC,OAAQ,UACRC,KAAM,SAERC,EAAG,CACDR,YAAa,IACbC,MAAOQ,EACPN,KAAMO,EACNL,YAAa,eACbC,OAAQ,UACRC,KAAM,UAIJI,EAAU,CAAC,KAAM,OAAQ,KAAM,QASxBC,EAAgDA,CAC3DC,EACAC,EACAC,KAEA,GAAkB,IAAdD,EAAQf,GAAWiB,EAASD,EAAc,gBAC5C,OAAOE,EAET,GAAkB,IAAdH,EAAQN,GAAWQ,EAASD,EAAc,gBAC5C,OAAOE,EAET,MAAMC,EAAIC,EAAmBJ,EAAcD,GAAW,EACtD,MAAA,GAAAM,OAAUT,EAAQO,GAAE,UAAA,EAwEtB,SAASG,EACPC,EACAT,EACAU,EACAxB,EACAS,GAEA,MAAMgB,OAAEA,GAAWD,GACjBvB,YACEA,EACAM,OAAQmB,EACRpB,YAAaqB,EACbvB,KAAMwB,EACNpB,KAAMqB,GACJ9B,EAAUwB,GAChB,GAAIN,EAASQ,EAAQE,GACnB,OAAO,EAGT,MAAQpB,OAAQuB,EAAkBtB,KAAMuB,GACpChC,EAAUE,GACZ+B,EACEC,EAAcT,EAAUM,KACvBL,EAAOM,IAAmB,EAAI,GAKjCG,GAAgBC,KAAKC,KAAKJ,IACvBP,EAAOI,IAAY,EAAI,GAW1BtB,EAA6B,MATL,IAApBkB,EAAOG,IAEPS,EAAcb,EAAWc,EAAQA,EAAQtC,EAAGS,GAAGc,GAAQ,GAEzDE,EAAOG,GAAW,EACd,GACC,GAAKM,GAGuB,GAE/BK,EAAeC,EACnBC,EACAC,GAAoB,CAAC5B,EAAWU,EAAWxB,EAAGS,IA7GlD,SACEc,EAAWoB,EAEXC,GACA,IAFAnB,OAAEA,EAAMoB,GAAEA,EAAEC,GAAEA,EAAEZ,YAAEA,GAA0CS,EAA1BnB,EAASuB,EAAAJ,EAAAK,GAG3C,MAAQ5C,KAAMwB,GAAY7B,EAAUwB,GAClC0B,EAASL,EACNM,SAAS,IAAIC,EAAMN,EAAIC,IACvBM,OAAO,IAAID,EAAM1B,EAAO4B,OAAQ5B,EAAO6B,SAAS/B,GACnDgC,EAAgB9B,EAAOG,GACvB4B,EAAehC,EAAUI,GACzB6B,EAAgBtB,KAAKuB,IAAIC,EAAiBH,IAM1CI,EACW,MAATrC,EACIE,EAAOoC,0BAA0B,CAC/BR,OAAQ,EACRC,OAAQ,EAERQ,MAAO,IACN9D,EACHyB,EAAOoC,0BAA0B,CAC/BR,OAAQ,EACRC,OAAQ,IACP7C,EAELsD,EACH,EAAId,EAASf,EAEZC,KAAK6B,IAAIJ,EAAG,GAEdH,EAEIQ,EAAUC,EAAiB/B,KAAKgC,KAAKJ,IAE3CtC,EAAO2C,IAAIxC,EAASqC,GACpB,MAAMI,EAAUd,IAAkB9B,EAAOG,GAEzC,GAAIyC,GAAoB,MAAT9C,EAAc,CAG3B,MAAMuC,MAAEA,EAAKT,OAAEA,GAAW5B,EACxB6C,EAAY7C,EAAOoC,0BAA0B,CAAEU,MAAOhB,IACtDiB,EAAW/C,EAAOoC,4BAClBY,EAA+B,IAAVX,EAAcQ,EAAUtE,EAAIwE,EAASxE,EAAI,EACzC,IAAvByE,GACEhD,EAAO2C,IAAIjE,EAASsE,EAAqBpB,EAC7C,CAEA,OAAOgB,CACT,CAwDMK,CAAWnD,EAAMC,EAAW,IAAI2B,EAAMnD,EAAGS,OAI7C,OAAO8B,EACLzB,EAAS6D,EAAAA,KAEJnD,GAAS,GAAA,CACZE,CAACA,GAAYnB,EACb2B,gBAEFlC,EACAS,EAEJ,CAWO,MAAMmE,EAAuCA,CAClD9D,EACAU,EACAxB,EACAS,IAEOa,EAAY,IAAKR,EAAWU,EAAWxB,EAAGS,GAYtCoE,EAAuCA,CAClD/D,EACAU,EACAxB,EACAS,IAEOa,EAAY,IAAKR,EAAWU,EAAWxB,EAAGS"}

package/dist/src/controls/skew.mjs

@@ -5,22 +5,22 @@ import { radiansToDegrees, degreesToRadians } from '../util/misc/radiansDegreesC
 import { isLocked, NOT_ALLOWED_CURSOR, findCornerQuadrant, getLocalPoint } from './util.mjs';
 import { wrapWithFireEvent } from './wrapWithFireEvent.mjs';
 import { wrapWithFixedAnchor } from './wrapWithFixedAnchor.mjs';
-import { CENTER } from '../constants.mjs';
+import { CENTER, SKEWING, SCALE_X, SKEW_X, SCALE_Y, SKEW_Y } from '../constants.mjs';
 
 const _excluded = ["target", "ex", "ey", "skewingSide"];
 const AXIS_KEYS = {
   x: {
     counterAxis: 'y',
-    scale: 'scaleX',
-    skew: 'skewX',
+    scale: SCALE_X,
+    skew: SKEW_X,
     lockSkewing: 'lockSkewingX',
     origin: 'originX',
     flip: 'flipX'
   },
   y: {
     counterAxis: 'x',
-    scale: 'scaleY',
-    skew: 'skewY',
+    scale: SCALE_Y,
+    skew: SKEW_Y,
     lockSkewing: 'lockSkewingY',
     origin: 'originY',
     flip: 'flipY'
@@ -99,7 +99,7 @@ function skewObject(axis, _ref, pointer) {
       }),
       dimAfter = target._getTransformedDimensions(),
       compensationFactor = skewX !== 0 ? dimBefore.x / dimAfter.x : 1;
-    compensationFactor !== 1 && target.set('scaleX', compensationFactor * scaleX);
+    compensationFactor !== 1 && target.set(SCALE_X, compensationFactor * scaleX);
   }
   return changed;
 }
@@ -145,7 +145,7 @@ function skewHandler(axis, eventData, transform, x, y) {
     // anchor to the opposite side of the skewing direction
     // normalize value from [-1, 1] to origin value [0, 1]
     origin = -skewingDirection * 0.5 + 0.5;
-  const finalHandler = wrapWithFireEvent('skewing', wrapWithFixedAnchor((eventData, transform, x, y) => skewObject(axis, transform, new Point(x, y))));
+  const finalHandler = wrapWithFireEvent(SKEWING, wrapWithFixedAnchor((eventData, transform, x, y) => skewObject(axis, transform, new Point(x, y))));
   return finalHandler(eventData, _objectSpread2(_objectSpread2({}, transform), {}, {
     [originKey]: origin,
     skewingSide

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

@@ -1 +1 @@
-{"version":3,"file":"skew.mjs","sources":["../../../src/controls/skew.ts"],"sourcesContent":["import type {\n  ControlCursorCallback,\n  TPointerEvent,\n  Transform,\n  TransformActionHandler,\n} from '../EventTypeDefs';\nimport { resolveOrigin } from '../util/misc/resolveOrigin';\nimport { Point } from '../Point';\nimport type { TAxis, TAxisKey } from '../typedefs';\nimport {\n  degreesToRadians,\n  radiansToDegrees,\n} from '../util/misc/radiansDegreesConversion';\nimport {\n  findCornerQuadrant,\n  getLocalPoint,\n  isLocked,\n  NOT_ALLOWED_CURSOR,\n} from './util';\nimport { wrapWithFireEvent } from './wrapWithFireEvent';\nimport { wrapWithFixedAnchor } from './wrapWithFixedAnchor';\nimport { CENTER } from '../constants';\n\nexport type SkewTransform = Transform & { skewingSide: -1 | 1 };\n\nconst AXIS_KEYS: Record<\n  TAxis,\n  {\n    counterAxis: TAxis;\n    scale: TAxisKey<'scale'>;\n    skew: TAxisKey<'skew'>;\n    lockSkewing: TAxisKey<'lockSkewing'>;\n    origin: TAxisKey<'origin'>;\n    flip: TAxisKey<'flip'>;\n  }\n> = {\n  x: {\n    counterAxis: 'y',\n    scale: 'scaleX',\n    skew: 'skewX',\n    lockSkewing: 'lockSkewingX',\n    origin: 'originX',\n    flip: 'flipX',\n  },\n  y: {\n    counterAxis: 'x',\n    scale: 'scaleY',\n    skew: 'skewY',\n    lockSkewing: 'lockSkewingY',\n    origin: 'originY',\n    flip: 'flipY',\n  },\n};\n\nconst skewMap = ['ns', 'nesw', 'ew', 'nwse'];\n\n/**\n * return the correct cursor style for the skew action\n * @param {Event} eventData the javascript event that is causing the scale\n * @param {Control} control the control that is interested in the action\n * @param {FabricObject} fabricObject the fabric object that is interested in the action\n * @return {String} a valid css string for the cursor\n */\nexport const skewCursorStyleHandler: ControlCursorCallback = (\n  eventData,\n  control,\n  fabricObject\n) => {\n  if (control.x !== 0 && isLocked(fabricObject, 'lockSkewingY')) {\n    return NOT_ALLOWED_CURSOR;\n  }\n  if (control.y !== 0 && isLocked(fabricObject, 'lockSkewingX')) {\n    return NOT_ALLOWED_CURSOR;\n  }\n  const n = findCornerQuadrant(fabricObject, control) % 4;\n  return `${skewMap[n]}-resize`;\n};\n\n/**\n * Since skewing is applied before scaling, calculations are done in a scaleless plane\n * @see https://github.com/fabricjs/fabric.js/pull/8380\n */\nfunction skewObject(\n  axis: TAxis,\n  { target, ex, ey, skewingSide, ...transform }: SkewTransform,\n  pointer: Point\n) {\n  const { skew: skewKey } = AXIS_KEYS[axis],\n    offset = pointer\n      .subtract(new Point(ex, ey))\n      .divide(new Point(target.scaleX, target.scaleY))[axis],\n    skewingBefore = target[skewKey],\n    skewingStart = transform[skewKey],\n    shearingStart = Math.tan(degreesToRadians(skewingStart)),\n    // let a, b be the size of target\n    // let a' be the value of a after applying skewing\n    // then:\n    // a' = a + b * skewA => skewA = (a' - a) / b\n    // the value b is tricky since skewY is applied before skewX\n    b =\n      axis === 'y'\n        ? target._getTransformedDimensions({\n            scaleX: 1,\n            scaleY: 1,\n            // since skewY is applied before skewX, b (=width) is not affected by skewX\n            skewX: 0,\n          }).x\n        : target._getTransformedDimensions({\n            scaleX: 1,\n            scaleY: 1,\n          }).y;\n\n  const shearing =\n    (2 * offset * skewingSide) /\n      // we max out fractions to safeguard from asymptotic behavior\n      Math.max(b, 1) +\n    // add starting state\n    shearingStart;\n\n  const skewing = radiansToDegrees(Math.atan(shearing));\n\n  target.set(skewKey, skewing);\n  const changed = skewingBefore !== target[skewKey];\n\n  if (changed && axis === 'y') {\n    // we don't want skewing to affect scaleX\n    // so we factor it by the inverse skewing diff to make it seem unchanged to the viewer\n    const { skewX, scaleX } = target,\n      dimBefore = target._getTransformedDimensions({ skewY: skewingBefore }),\n      dimAfter = target._getTransformedDimensions(),\n      compensationFactor = skewX !== 0 ? dimBefore.x / dimAfter.x : 1;\n    compensationFactor !== 1 &&\n      target.set('scaleX', compensationFactor * scaleX);\n  }\n\n  return changed;\n}\n\n/**\n * Wrapped Action handler for skewing on a given axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nfunction skewHandler(\n  axis: TAxis,\n  eventData: TPointerEvent,\n  transform: Transform,\n  x: number,\n  y: number\n) {\n  const { target } = transform,\n    {\n      counterAxis,\n      origin: originKey,\n      lockSkewing: lockSkewingKey,\n      skew: skewKey,\n      flip: flipKey,\n    } = AXIS_KEYS[axis];\n  if (isLocked(target, lockSkewingKey)) {\n    return false;\n  }\n\n  const { origin: counterOriginKey, flip: counterFlipKey } =\n      AXIS_KEYS[counterAxis],\n    counterOriginFactor =\n      resolveOrigin(transform[counterOriginKey]) *\n      (target[counterFlipKey] ? -1 : 1),\n    // if the counter origin is top/left (= -0.5) then we are skewing x/y values on the bottom/right side of target respectively.\n    // if the counter origin is bottom/right (= 0.5) then we are skewing x/y values on the top/left side of target respectively.\n    // skewing direction on the top/left side of target is OPPOSITE to the direction of the movement of the pointer,\n    // so we factor skewing direction by this value.\n    skewingSide = (-Math.sign(counterOriginFactor) *\n      (target[flipKey] ? -1 : 1)) as 1 | -1,\n    skewingDirection =\n      ((target[skewKey] === 0 &&\n        // in case skewing equals 0 we use the pointer offset from target center to determine the direction of skewing\n        getLocalPoint(transform, CENTER, CENTER, x, y)[axis] > 0) ||\n      // in case target has skewing we use that as the direction\n      target[skewKey] > 0\n        ? 1\n        : -1) * skewingSide,\n    // anchor to the opposite side of the skewing direction\n    // normalize value from [-1, 1] to origin value [0, 1]\n    origin = -skewingDirection * 0.5 + 0.5;\n\n  const finalHandler = wrapWithFireEvent<SkewTransform>(\n    'skewing',\n    wrapWithFixedAnchor((eventData, transform, x, y) =>\n      skewObject(axis, transform, new Point(x, y))\n    )\n  );\n\n  return finalHandler(\n    eventData,\n    {\n      ...transform,\n      [originKey]: origin,\n      skewingSide,\n    },\n    x,\n    y\n  );\n}\n\n/**\n * Wrapped Action handler for skewing on the X axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nexport const skewHandlerX: TransformActionHandler = (\n  eventData,\n  transform,\n  x,\n  y\n) => {\n  return skewHandler('x', eventData, transform, x, y);\n};\n\n/**\n * Wrapped Action handler for skewing on the Y axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nexport const skewHandlerY: TransformActionHandler = (\n  eventData,\n  transform,\n  x,\n  y\n) => {\n  return skewHandler('y', eventData, transform, x, y);\n};\n"],"names":["AXIS_KEYS","x","counterAxis","scale","skew","lockSkewing","origin","flip","y","skewMap","skewCursorStyleHandler","eventData","control","fabricObject","isLocked","NOT_ALLOWED_CURSOR","n","findCornerQuadrant","concat","skewObject","axis","_ref","pointer","target","ex","ey","skewingSide","transform","_objectWithoutProperties","_excluded","skewKey","offset","subtract","Point","divide","scaleX","scaleY","skewingBefore","skewingStart","shearingStart","Math","tan","degreesToRadians","b","_getTransformedDimensions","skewX","shearing","max","skewing","radiansToDegrees","atan","set","changed","dimBefore","skewY","dimAfter","compensationFactor","skewHandler","originKey","lockSkewingKey","flipKey","counterOriginKey","counterFlipKey","counterOriginFactor","resolveOrigin","sign","skewingDirection","getLocalPoint","CENTER","finalHandler","wrapWithFireEvent","wrapWithFixedAnchor","_objectSpread","skewHandlerX","skewHandlerY"],"mappings":"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"}
+{"version":3,"file":"skew.mjs","sources":["../../../src/controls/skew.ts"],"sourcesContent":["import type {\n  ControlCursorCallback,\n  TPointerEvent,\n  Transform,\n  TransformActionHandler,\n} from '../EventTypeDefs';\nimport { resolveOrigin } from '../util/misc/resolveOrigin';\nimport { Point } from '../Point';\nimport type { TAxis, TAxisKey } from '../typedefs';\nimport {\n  degreesToRadians,\n  radiansToDegrees,\n} from '../util/misc/radiansDegreesConversion';\nimport {\n  findCornerQuadrant,\n  getLocalPoint,\n  isLocked,\n  NOT_ALLOWED_CURSOR,\n} from './util';\nimport { wrapWithFireEvent } from './wrapWithFireEvent';\nimport { wrapWithFixedAnchor } from './wrapWithFixedAnchor';\nimport {\n  CENTER,\n  SCALE_X,\n  SCALE_Y,\n  SKEWING,\n  SKEW_X,\n  SKEW_Y,\n} from '../constants';\n\nexport type SkewTransform = Transform & { skewingSide: -1 | 1 };\n\nconst AXIS_KEYS: Record<\n  TAxis,\n  {\n    counterAxis: TAxis;\n    scale: TAxisKey<'scale'>;\n    skew: TAxisKey<'skew'>;\n    lockSkewing: TAxisKey<'lockSkewing'>;\n    origin: TAxisKey<'origin'>;\n    flip: TAxisKey<'flip'>;\n  }\n> = {\n  x: {\n    counterAxis: 'y',\n    scale: SCALE_X,\n    skew: SKEW_X,\n    lockSkewing: 'lockSkewingX',\n    origin: 'originX',\n    flip: 'flipX',\n  },\n  y: {\n    counterAxis: 'x',\n    scale: SCALE_Y,\n    skew: SKEW_Y,\n    lockSkewing: 'lockSkewingY',\n    origin: 'originY',\n    flip: 'flipY',\n  },\n};\n\nconst skewMap = ['ns', 'nesw', 'ew', 'nwse'];\n\n/**\n * return the correct cursor style for the skew action\n * @param {Event} eventData the javascript event that is causing the scale\n * @param {Control} control the control that is interested in the action\n * @param {FabricObject} fabricObject the fabric object that is interested in the action\n * @return {String} a valid css string for the cursor\n */\nexport const skewCursorStyleHandler: ControlCursorCallback = (\n  eventData,\n  control,\n  fabricObject\n) => {\n  if (control.x !== 0 && isLocked(fabricObject, 'lockSkewingY')) {\n    return NOT_ALLOWED_CURSOR;\n  }\n  if (control.y !== 0 && isLocked(fabricObject, 'lockSkewingX')) {\n    return NOT_ALLOWED_CURSOR;\n  }\n  const n = findCornerQuadrant(fabricObject, control) % 4;\n  return `${skewMap[n]}-resize`;\n};\n\n/**\n * Since skewing is applied before scaling, calculations are done in a scaleless plane\n * @see https://github.com/fabricjs/fabric.js/pull/8380\n */\nfunction skewObject(\n  axis: TAxis,\n  { target, ex, ey, skewingSide, ...transform }: SkewTransform,\n  pointer: Point\n) {\n  const { skew: skewKey } = AXIS_KEYS[axis],\n    offset = pointer\n      .subtract(new Point(ex, ey))\n      .divide(new Point(target.scaleX, target.scaleY))[axis],\n    skewingBefore = target[skewKey],\n    skewingStart = transform[skewKey],\n    shearingStart = Math.tan(degreesToRadians(skewingStart)),\n    // let a, b be the size of target\n    // let a' be the value of a after applying skewing\n    // then:\n    // a' = a + b * skewA => skewA = (a' - a) / b\n    // the value b is tricky since skewY is applied before skewX\n    b =\n      axis === 'y'\n        ? target._getTransformedDimensions({\n            scaleX: 1,\n            scaleY: 1,\n            // since skewY is applied before skewX, b (=width) is not affected by skewX\n            skewX: 0,\n          }).x\n        : target._getTransformedDimensions({\n            scaleX: 1,\n            scaleY: 1,\n          }).y;\n\n  const shearing =\n    (2 * offset * skewingSide) /\n      // we max out fractions to safeguard from asymptotic behavior\n      Math.max(b, 1) +\n    // add starting state\n    shearingStart;\n\n  const skewing = radiansToDegrees(Math.atan(shearing));\n\n  target.set(skewKey, skewing);\n  const changed = skewingBefore !== target[skewKey];\n\n  if (changed && axis === 'y') {\n    // we don't want skewing to affect scaleX\n    // so we factor it by the inverse skewing diff to make it seem unchanged to the viewer\n    const { skewX, scaleX } = target,\n      dimBefore = target._getTransformedDimensions({ skewY: skewingBefore }),\n      dimAfter = target._getTransformedDimensions(),\n      compensationFactor = skewX !== 0 ? dimBefore.x / dimAfter.x : 1;\n    compensationFactor !== 1 &&\n      target.set(SCALE_X, compensationFactor * scaleX);\n  }\n\n  return changed;\n}\n\n/**\n * Wrapped Action handler for skewing on a given axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nfunction skewHandler(\n  axis: TAxis,\n  eventData: TPointerEvent,\n  transform: Transform,\n  x: number,\n  y: number\n) {\n  const { target } = transform,\n    {\n      counterAxis,\n      origin: originKey,\n      lockSkewing: lockSkewingKey,\n      skew: skewKey,\n      flip: flipKey,\n    } = AXIS_KEYS[axis];\n  if (isLocked(target, lockSkewingKey)) {\n    return false;\n  }\n\n  const { origin: counterOriginKey, flip: counterFlipKey } =\n      AXIS_KEYS[counterAxis],\n    counterOriginFactor =\n      resolveOrigin(transform[counterOriginKey]) *\n      (target[counterFlipKey] ? -1 : 1),\n    // if the counter origin is top/left (= -0.5) then we are skewing x/y values on the bottom/right side of target respectively.\n    // if the counter origin is bottom/right (= 0.5) then we are skewing x/y values on the top/left side of target respectively.\n    // skewing direction on the top/left side of target is OPPOSITE to the direction of the movement of the pointer,\n    // so we factor skewing direction by this value.\n    skewingSide = (-Math.sign(counterOriginFactor) *\n      (target[flipKey] ? -1 : 1)) as 1 | -1,\n    skewingDirection =\n      ((target[skewKey] === 0 &&\n        // in case skewing equals 0 we use the pointer offset from target center to determine the direction of skewing\n        getLocalPoint(transform, CENTER, CENTER, x, y)[axis] > 0) ||\n      // in case target has skewing we use that as the direction\n      target[skewKey] > 0\n        ? 1\n        : -1) * skewingSide,\n    // anchor to the opposite side of the skewing direction\n    // normalize value from [-1, 1] to origin value [0, 1]\n    origin = -skewingDirection * 0.5 + 0.5;\n\n  const finalHandler = wrapWithFireEvent<SkewTransform>(\n    SKEWING,\n    wrapWithFixedAnchor((eventData, transform, x, y) =>\n      skewObject(axis, transform, new Point(x, y))\n    )\n  );\n\n  return finalHandler(\n    eventData,\n    {\n      ...transform,\n      [originKey]: origin,\n      skewingSide,\n    },\n    x,\n    y\n  );\n}\n\n/**\n * Wrapped Action handler for skewing on the X axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nexport const skewHandlerX: TransformActionHandler = (\n  eventData,\n  transform,\n  x,\n  y\n) => {\n  return skewHandler('x', eventData, transform, x, y);\n};\n\n/**\n * Wrapped Action handler for skewing on the Y axis, takes care of the\n * skew direction and determines the correct transform origin for the anchor point\n * @param {Event} eventData javascript event that is doing the transform\n * @param {Object} transform javascript object containing a series of information around the current transform\n * @param {number} x current mouse x position, canvas normalized\n * @param {number} y current mouse y position, canvas normalized\n * @return {Boolean} true if some change happened\n */\nexport const skewHandlerY: TransformActionHandler = (\n  eventData,\n  transform,\n  x,\n  y\n) => {\n  return skewHandler('y', eventData, transform, x, y);\n};\n"],"names":["AXIS_KEYS","x","counterAxis","scale","SCALE_X","skew","SKEW_X","lockSkewing","origin","flip","y","SCALE_Y","SKEW_Y","skewMap","skewCursorStyleHandler","eventData","control","fabricObject","isLocked","NOT_ALLOWED_CURSOR","n","findCornerQuadrant","concat","skewObject","axis","_ref","pointer","target","ex","ey","skewingSide","transform","_objectWithoutProperties","_excluded","skewKey","offset","subtract","Point","divide","scaleX","scaleY","skewingBefore","skewingStart","shearingStart","Math","tan","degreesToRadians","b","_getTransformedDimensions","skewX","shearing","max","skewing","radiansToDegrees","atan","set","changed","dimBefore","skewY","dimAfter","compensationFactor","skewHandler","originKey","lockSkewingKey","flipKey","counterOriginKey","counterFlipKey","counterOriginFactor","resolveOrigin","sign","skewingDirection","getLocalPoint","CENTER","finalHandler","wrapWithFireEvent","SKEWING","wrapWithFixedAnchor","_objectSpread","skewHandlerX","skewHandlerY"],"mappings":";;;;;;;;;;AAgCA,MAAMA,SAUL,GAAG;AACFC,EAAAA,CAAC,EAAE;AACDC,IAAAA,WAAW,EAAE,GAAG;AAChBC,IAAAA,KAAK,EAAEC,OAAO;AACdC,IAAAA,IAAI,EAAEC,MAAM;AACZC,IAAAA,WAAW,EAAE,cAAc;AAC3BC,IAAAA,MAAM,EAAE,SAAS;AACjBC,IAAAA,IAAI,EAAE,OAAA;GACP;AACDC,EAAAA,CAAC,EAAE;AACDR,IAAAA,WAAW,EAAE,GAAG;AAChBC,IAAAA,KAAK,EAAEQ,OAAO;AACdN,IAAAA,IAAI,EAAEO,MAAM;AACZL,IAAAA,WAAW,EAAE,cAAc;AAC3BC,IAAAA,MAAM,EAAE,SAAS;AACjBC,IAAAA,IAAI,EAAE,OAAA;AACR,GAAA;AACF,CAAC,CAAA;AAED,MAAMI,OAAO,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,CAAC,CAAA;;AAE5C;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,sBAA6C,GAAGA,CAC3DC,SAAS,EACTC,OAAO,EACPC,YAAY,KACT;AACH,EAAA,IAAID,OAAO,CAACf,CAAC,KAAK,CAAC,IAAIiB,QAAQ,CAACD,YAAY,EAAE,cAAc,CAAC,EAAE;AAC7D,IAAA,OAAOE,kBAAkB,CAAA;AAC3B,GAAA;AACA,EAAA,IAAIH,OAAO,CAACN,CAAC,KAAK,CAAC,IAAIQ,QAAQ,CAACD,YAAY,EAAE,cAAc,CAAC,EAAE;AAC7D,IAAA,OAAOE,kBAAkB,CAAA;AAC3B,GAAA;EACA,MAAMC,CAAC,GAAGC,kBAAkB,CAACJ,YAAY,EAAED,OAAO,CAAC,GAAG,CAAC,CAAA;AACvD,EAAA,OAAA,EAAA,CAAAM,MAAA,CAAUT,OAAO,CAACO,CAAC,CAAC,EAAA,SAAA,CAAA,CAAA;AACtB,EAAC;;AAED;AACA;AACA;AACA;AACA,SAASG,UAAUA,CACjBC,IAAW,EAAAC,IAAA,EAEXC,OAAc,EACd;EAAA,IAFA;MAAEC,MAAM;MAAEC,EAAE;MAAEC,EAAE;AAAEC,MAAAA,WAAAA;AAAyC,KAAC,GAAAL,IAAA;AAA1BM,IAAAA,SAAS,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA,CAAA;EAG3C,MAAM;AAAE5B,MAAAA,IAAI,EAAE6B,OAAAA;AAAQ,KAAC,GAAGlC,SAAS,CAACwB,IAAI,CAAC;AACvCW,IAAAA,MAAM,GAAGT,OAAO,CACbU,QAAQ,CAAC,IAAIC,KAAK,CAACT,EAAE,EAAEC,EAAE,CAAC,CAAC,CAC3BS,MAAM,CAAC,IAAID,KAAK,CAACV,MAAM,CAACY,MAAM,EAAEZ,MAAM,CAACa,MAAM,CAAC,CAAC,CAAChB,IAAI,CAAC;AACxDiB,IAAAA,aAAa,GAAGd,MAAM,CAACO,OAAO,CAAC;AAC/BQ,IAAAA,YAAY,GAAGX,SAAS,CAACG,OAAO,CAAC;IACjCS,aAAa,GAAGC,IAAI,CAACC,GAAG,CAACC,gBAAgB,CAACJ,YAAY,CAAC,CAAC;AACxD;AACA;AACA;AACA;AACA;IACAK,CAAC,GACCvB,IAAI,KAAK,GAAG,GACRG,MAAM,CAACqB,yBAAyB,CAAC;AAC/BT,MAAAA,MAAM,EAAE,CAAC;AACTC,MAAAA,MAAM,EAAE,CAAC;AACT;AACAS,MAAAA,KAAK,EAAE,CAAA;AACT,KAAC,CAAC,CAAChD,CAAC,GACJ0B,MAAM,CAACqB,yBAAyB,CAAC;AAC/BT,MAAAA,MAAM,EAAE,CAAC;AACTC,MAAAA,MAAM,EAAE,CAAA;KACT,CAAC,CAAC9B,CAAC,CAAA;AAEZ,EAAA,MAAMwC,QAAQ,GACX,CAAC,GAAGf,MAAM,GAAGL,WAAW;AACvB;AACAc,EAAAA,IAAI,CAACO,GAAG,CAACJ,CAAC,EAAE,CAAC,CAAC;AAChB;EACAJ,aAAa,CAAA;EAEf,MAAMS,OAAO,GAAGC,gBAAgB,CAACT,IAAI,CAACU,IAAI,CAACJ,QAAQ,CAAC,CAAC,CAAA;AAErDvB,EAAAA,MAAM,CAAC4B,GAAG,CAACrB,OAAO,EAAEkB,OAAO,CAAC,CAAA;AAC5B,EAAA,MAAMI,OAAO,GAAGf,aAAa,KAAKd,MAAM,CAACO,OAAO,CAAC,CAAA;AAEjD,EAAA,IAAIsB,OAAO,IAAIhC,IAAI,KAAK,GAAG,EAAE;AAC3B;AACA;IACA,MAAM;QAAEyB,KAAK;AAAEV,QAAAA,MAAAA;AAAO,OAAC,GAAGZ,MAAM;AAC9B8B,MAAAA,SAAS,GAAG9B,MAAM,CAACqB,yBAAyB,CAAC;AAAEU,QAAAA,KAAK,EAAEjB,aAAAA;AAAc,OAAC,CAAC;AACtEkB,MAAAA,QAAQ,GAAGhC,MAAM,CAACqB,yBAAyB,EAAE;AAC7CY,MAAAA,kBAAkB,GAAGX,KAAK,KAAK,CAAC,GAAGQ,SAAS,CAACxD,CAAC,GAAG0D,QAAQ,CAAC1D,CAAC,GAAG,CAAC,CAAA;AACjE2D,IAAAA,kBAAkB,KAAK,CAAC,IACtBjC,MAAM,CAAC4B,GAAG,CAACnD,OAAO,EAAEwD,kBAAkB,GAAGrB,MAAM,CAAC,CAAA;AACpD,GAAA;AAEA,EAAA,OAAOiB,OAAO,CAAA;AAChB,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASK,WAAWA,CAClBrC,IAAW,EACXT,SAAwB,EACxBgB,SAAoB,EACpB9B,CAAS,EACTS,CAAS,EACT;EACA,MAAM;AAAEiB,MAAAA,MAAAA;AAAO,KAAC,GAAGI,SAAS;AAC1B,IAAA;MACE7B,WAAW;AACXM,MAAAA,MAAM,EAAEsD,SAAS;AACjBvD,MAAAA,WAAW,EAAEwD,cAAc;AAC3B1D,MAAAA,IAAI,EAAE6B,OAAO;AACbzB,MAAAA,IAAI,EAAEuD,OAAAA;AACR,KAAC,GAAGhE,SAAS,CAACwB,IAAI,CAAC,CAAA;AACrB,EAAA,IAAIN,QAAQ,CAACS,MAAM,EAAEoC,cAAc,CAAC,EAAE;AACpC,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;EAEA,MAAM;AAAEvD,MAAAA,MAAM,EAAEyD,gBAAgB;AAAExD,MAAAA,IAAI,EAAEyD,cAAAA;AAAe,KAAC,GACpDlE,SAAS,CAACE,WAAW,CAAC;AACxBiE,IAAAA,mBAAmB,GACjBC,aAAa,CAACrC,SAAS,CAACkC,gBAAgB,CAAC,CAAC,IACzCtC,MAAM,CAACuC,cAAc,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;AACnC;AACA;AACA;AACA;AACApC,IAAAA,WAAW,GAAI,CAACc,IAAI,CAACyB,IAAI,CAACF,mBAAmB,CAAC,IAC3CxC,MAAM,CAACqC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAY;AACvCM,IAAAA,gBAAgB,GACd,CAAE3C,MAAM,CAACO,OAAO,CAAC,KAAK,CAAC;AACrB;AACAqC,IAAAA,aAAa,CAACxC,SAAS,EAAEyC,MAAM,EAAEA,MAAM,EAAEvE,CAAC,EAAES,CAAC,CAAC,CAACc,IAAI,CAAC,GAAG,CAAC;AAC1D;IACAG,MAAM,CAACO,OAAO,CAAC,GAAG,CAAC,GACf,CAAC,GACD,CAAC,CAAC,IAAIJ,WAAW;AACvB;AACA;AACAtB,IAAAA,MAAM,GAAG,CAAC8D,gBAAgB,GAAG,GAAG,GAAG,GAAG,CAAA;AAExC,EAAA,MAAMG,YAAY,GAAGC,iBAAiB,CACpCC,OAAO,EACPC,mBAAmB,CAAC,CAAC7D,SAAS,EAAEgB,SAAS,EAAE9B,CAAC,EAAES,CAAC,KAC7Ca,UAAU,CAACC,IAAI,EAAEO,SAAS,EAAE,IAAIM,KAAK,CAACpC,CAAC,EAAES,CAAC,CAAC,CAC7C,CACF,CAAC,CAAA;EAED,OAAO+D,YAAY,CACjB1D,SAAS,EAAA8D,cAAA,CAAAA,cAAA,KAEJ9C,SAAS,CAAA,EAAA,EAAA,EAAA;IACZ,CAAC+B,SAAS,GAAGtD,MAAM;AACnBsB,IAAAA,WAAAA;GAEF7B,CAAAA,EAAAA,CAAC,EACDS,CACF,CAAC,CAAA;AACH,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMoE,YAAoC,GAAGA,CAClD/D,SAAS,EACTgB,SAAS,EACT9B,CAAC,EACDS,CAAC,KACE;EACH,OAAOmD,WAAW,CAAC,GAAG,EAAE9C,SAAS,EAAEgB,SAAS,EAAE9B,CAAC,EAAES,CAAC,CAAC,CAAA;AACrD,EAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMqE,YAAoC,GAAGA,CAClDhE,SAAS,EACTgB,SAAS,EACT9B,CAAC,EACDS,CAAC,KACE;EACH,OAAOmD,WAAW,CAAC,GAAG,EAAE9C,SAAS,EAAEgB,SAAS,EAAE9B,CAAC,EAAES,CAAC,CAAC,CAAA;AACrD;;;;"}

package/dist/src/filters/Blur.min.mjs

@@ -1,2 +1,2 @@
-import{defineProperty as t}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{createCanvasElement as e}from"../util/misc/dom.min.mjs";import{BaseFilter as a}from"./BaseFilter.min.mjs";import{isWebGLPipelineState as r}from"./utils.min.mjs";import{classRegistry as i}from"../ClassRegistry.min.mjs";import{fragmentSource as s}from"./shaders/blur.min.mjs";const o={blur:0};class h extends a{getFragmentSource(){return s}applyTo(t){r(t)?(this.aspectRatio=t.sourceWidth/t.sourceHeight,t.passes++,this._setupFrameBuffer(t),this.horizontal=!0,this.applyToWebGL(t),this._swapTextures(t),this._setupFrameBuffer(t),this.horizontal=!1,this.applyToWebGL(t),this._swapTextures(t)):this.applyTo2d(t)}applyTo2d(t){t.imageData=this.simpleBlur(t)}simpleBlur(t){let{ctx:a,imageData:r,filterBackend:{resources:i}}=t;const{width:s,height:o}=r;i.blurLayer1||(i.blurLayer1=e(),i.blurLayer2=e());const h=i.blurLayer1,l=i.blurLayer2;h.width===s&&h.height===o||(l.width=h.width=s,l.height=h.height=o);const m=h.getContext("2d"),p=l.getContext("2d"),u=15,n=.06*this.blur*.5;let c,g,d,b;for(m.putImageData(r,0,0),p.clearRect(0,0,s,o),b=-15;b<=u;b++)c=(Math.random()-.5)/4,g=b/u,d=n*g*s+c,p.globalAlpha=1-Math.abs(g),p.drawImage(h,d,c),m.drawImage(l,0,0),p.globalAlpha=1,p.clearRect(0,0,l.width,l.height);for(b=-15;b<=u;b++)c=(Math.random()-.5)/4,g=b/u,d=n*g*o+c,p.globalAlpha=1-Math.abs(g),p.drawImage(h,c,d),m.drawImage(l,0,0),p.globalAlpha=1,p.clearRect(0,0,l.width,l.height);a.drawImage(h,0,0);const f=a.getImageData(0,0,h.width,h.height);return m.globalAlpha=1,m.clearRect(0,0,h.width,h.height),f}sendUniformData(t,e){const a=this.chooseRightDelta();t.uniform2fv(e.delta,a)}isNeutralState(){return 0===this.blur}chooseRightDelta(){let t=1;const e=[0,0];this.horizontal?this.aspectRatio>1&&(t=1/this.aspectRatio):this.aspectRatio<1&&(t=this.aspectRatio);const a=t*this.blur*.12;return this.horizontal?e[0]=a:e[1]=a,e}}t(h,"type","Blur"),t(h,"defaults",o),t(h,"uniformLocations",["uDelta"]),i.setClass(h);export{h as Blur,o as blurDefaultValues};
+import{defineProperty as t}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{createCanvasElement as e}from"../util/misc/dom.min.mjs";import{BaseFilter as a}from"./BaseFilter.min.mjs";import{isWebGLPipelineState as r}from"./utils.min.mjs";import{classRegistry as i}from"../ClassRegistry.min.mjs";import{fragmentSource as s}from"./shaders/blur.min.mjs";const o={blur:0};class h extends a{getFragmentSource(){return s}applyTo(t){r(t)?(this.aspectRatio=t.sourceWidth/t.sourceHeight,t.passes++,this._setupFrameBuffer(t),this.horizontal=!0,this.applyToWebGL(t),this._swapTextures(t),this._setupFrameBuffer(t),this.horizontal=!1,this.applyToWebGL(t),this._swapTextures(t)):this.applyTo2d(t)}applyTo2d(t){t.imageData=this.simpleBlur(t)}simpleBlur(t){let{ctx:a,imageData:r,filterBackend:{resources:i}}=t;const{width:s,height:o}=r;i.blurLayer1||(i.blurLayer1=e(),i.blurLayer2=e());const h=i.blurLayer1,l=i.blurLayer2;h.width===s&&h.height===o||(l.width=h.width=s,l.height=h.height=o);const m=h.getContext("2d"),p=l.getContext("2d"),u=15,n=.06*this.blur*.5;let c,g,d,b;for(m.putImageData(r,0,0),p.clearRect(0,0,s,o),b=-15;b<=u;b++)c=(Math.random()-.5)/4,g=b/u,d=n*g*s+c,p.globalAlpha=1-Math.abs(g),p.drawImage(h,d,c),m.drawImage(l,0,0),p.globalAlpha=1,p.clearRect(0,0,l.width,l.height);for(b=-15;b<=u;b++)c=(Math.random()-.5)/4,g=b/u,d=n*g*o+c,p.globalAlpha=1-Math.abs(g),p.drawImage(h,c,d),m.drawImage(l,0,0),p.globalAlpha=1,p.clearRect(0,0,l.width,l.height);a.drawImage(h,0,0);const f=a.getImageData(0,0,h.width,h.height);return m.globalAlpha=1,m.clearRect(0,0,h.width,h.height),f}sendUniformData(t,e){const a=this.chooseRightDelta();t.uniform2fv(e.uDelta,a)}isNeutralState(){return 0===this.blur}chooseRightDelta(){let t=1;const e=[0,0];this.horizontal?this.aspectRatio>1&&(t=1/this.aspectRatio):this.aspectRatio<1&&(t=this.aspectRatio);const a=t*this.blur*.12;return this.horizontal?e[0]=a:e[1]=a,e}}t(h,"type","Blur"),t(h,"defaults",o),t(h,"uniformLocations",["uDelta"]),i.setClass(h);export{h as Blur,o as blurDefaultValues};
 //# sourceMappingURL=Blur.min.mjs.map

package/dist/src/filters/Blur.min.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Blur.min.mjs","sources":["../../../src/filters/Blur.ts"],"sourcesContent":["import { createCanvasElement } from '../util/misc/dom';\nimport { BaseFilter } from './BaseFilter';\nimport type {\n  TWebGLPipelineState,\n  T2DPipelineState,\n  TWebGLUniformLocationMap,\n} from './typedefs';\nimport { isWebGLPipelineState } from './utils';\nimport { classRegistry } from '../ClassRegistry';\nimport { fragmentSource } from './shaders/blur';\n\ntype BlurOwnProps = {\n  blur: number;\n};\n\nexport const blurDefaultValues: BlurOwnProps = {\n  blur: 0,\n};\n\n/**\n * Blur filter class\n * @example\n * const filter = new Blur({\n *   blur: 0.5\n * });\n * object.filters.push(filter);\n * object.applyFilters();\n * canvas.renderAll();\n */\nexport class Blur extends BaseFilter<'Blur', BlurOwnProps> {\n  /**\n   * blur value, in percentage of image dimensions.\n   * specific to keep the image blur constant at different resolutions\n   * range between 0 and 1.\n   * @type Number\n   * @default\n   */\n  declare blur: BlurOwnProps['blur'];\n\n  declare horizontal: boolean;\n  declare aspectRatio: number;\n\n  static type = 'Blur';\n\n  static defaults = blurDefaultValues;\n\n  static uniformLocations = ['uDelta'];\n\n  getFragmentSource(): string {\n    return fragmentSource;\n  }\n\n  applyTo(options: TWebGLPipelineState | T2DPipelineState) {\n    if (isWebGLPipelineState(options)) {\n      // this aspectRatio is used to give the same blur to vertical and horizontal\n      this.aspectRatio = options.sourceWidth / options.sourceHeight;\n      options.passes++;\n      this._setupFrameBuffer(options);\n      this.horizontal = true;\n      this.applyToWebGL(options);\n      this._swapTextures(options);\n      this._setupFrameBuffer(options);\n      this.horizontal = false;\n      this.applyToWebGL(options);\n      this._swapTextures(options);\n    } else {\n      this.applyTo2d(options);\n    }\n  }\n\n  applyTo2d(options: T2DPipelineState) {\n    options.imageData = this.simpleBlur(options);\n  }\n\n  simpleBlur({\n    ctx,\n    imageData,\n    filterBackend: { resources },\n  }: T2DPipelineState) {\n    const { width, height } = imageData;\n    if (!resources.blurLayer1) {\n      resources.blurLayer1 = createCanvasElement();\n      resources.blurLayer2 = createCanvasElement();\n    }\n    const canvas1 = resources.blurLayer1!;\n    const canvas2 = resources.blurLayer2!;\n    if (canvas1.width !== width || canvas1.height !== height) {\n      canvas2.width = canvas1.width = width;\n      canvas2.height = canvas1.height = height;\n    }\n    const ctx1 = canvas1.getContext('2d')!,\n      ctx2 = canvas2.getContext('2d')!,\n      nSamples = 15,\n      blur = this.blur * 0.06 * 0.5;\n    let random, percent, j, i;\n\n    // load first canvas\n    ctx1.putImageData(imageData, 0, 0);\n    ctx2.clearRect(0, 0, width, height);\n\n    for (i = -nSamples; i <= nSamples; i++) {\n      random = (Math.random() - 0.5) / 4;\n      percent = i / nSamples;\n      j = blur * percent * width + random;\n      ctx2.globalAlpha = 1 - Math.abs(percent);\n      ctx2.drawImage(canvas1, j, random);\n      ctx1.drawImage(canvas2, 0, 0);\n      ctx2.globalAlpha = 1;\n      ctx2.clearRect(0, 0, canvas2.width, canvas2.height);\n    }\n    for (i = -nSamples; i <= nSamples; i++) {\n      random = (Math.random() - 0.5) / 4;\n      percent = i / nSamples;\n      j = blur * percent * height + random;\n      ctx2.globalAlpha = 1 - Math.abs(percent);\n      ctx2.drawImage(canvas1, random, j);\n      ctx1.drawImage(canvas2, 0, 0);\n      ctx2.globalAlpha = 1;\n      ctx2.clearRect(0, 0, canvas2.width, canvas2.height);\n    }\n    ctx.drawImage(canvas1, 0, 0);\n    const newImageData = ctx.getImageData(0, 0, canvas1.width, canvas1.height);\n    ctx1.globalAlpha = 1;\n    ctx1.clearRect(0, 0, canvas1.width, canvas1.height);\n    return newImageData;\n  }\n\n  /**\n   * Send data from this filter to its shader program's uniforms.\n   *\n   * @param {WebGLRenderingContext} gl The GL canvas context used to compile this filter's shader.\n   * @param {Object} uniformLocations A map of string uniform names to WebGLUniformLocation objects\n   */\n  sendUniformData(\n    gl: WebGLRenderingContext,\n    uniformLocations: TWebGLUniformLocationMap\n  ) {\n    const delta = this.chooseRightDelta();\n    gl.uniform2fv(uniformLocations.delta, delta);\n  }\n\n  isNeutralState() {\n    return this.blur === 0;\n  }\n\n  /**\n   * choose right value of image percentage to blur with\n   * @returns {Array} a numeric array with delta values\n   */\n  chooseRightDelta() {\n    let blurScale = 1;\n    const delta = [0, 0];\n    if (this.horizontal) {\n      if (this.aspectRatio > 1) {\n        // image is wide, i want to shrink radius horizontal\n        blurScale = 1 / this.aspectRatio;\n      }\n    } else {\n      if (this.aspectRatio < 1) {\n        // image is tall, i want to shrink radius vertical\n        blurScale = this.aspectRatio;\n      }\n    }\n    const blur = blurScale * this.blur * 0.12;\n    if (this.horizontal) {\n      delta[0] = blur;\n    } else {\n      delta[1] = blur;\n    }\n    return delta;\n  }\n}\n\nclassRegistry.setClass(Blur);\n"],"names":["blurDefaultValues","blur","Blur","BaseFilter","getFragmentSource","fragmentSource","applyTo","options","isWebGLPipelineState","this","aspectRatio","sourceWidth","sourceHeight","passes","_setupFrameBuffer","horizontal","applyToWebGL","_swapTextures","applyTo2d","imageData","simpleBlur","_ref","ctx","filterBackend","resources","width","height","blurLayer1","createCanvasElement","blurLayer2","canvas1","canvas2","ctx1","getContext","ctx2","nSamples","random","percent","j","i","putImageData","clearRect","Math","globalAlpha","abs","drawImage","newImageData","getImageData","sendUniformData","gl","uniformLocations","delta","chooseRightDelta","uniform2fv","isNeutralState","blurScale","_defineProperty","classRegistry","setClass"],"mappings":"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"}
+{"version":3,"file":"Blur.min.mjs","sources":["../../../src/filters/Blur.ts"],"sourcesContent":["import { createCanvasElement } from '../util/misc/dom';\nimport { BaseFilter } from './BaseFilter';\nimport type {\n  TWebGLPipelineState,\n  T2DPipelineState,\n  TWebGLUniformLocationMap,\n} from './typedefs';\nimport { isWebGLPipelineState } from './utils';\nimport { classRegistry } from '../ClassRegistry';\nimport { fragmentSource } from './shaders/blur';\n\ntype BlurOwnProps = {\n  blur: number;\n};\n\nexport const blurDefaultValues: BlurOwnProps = {\n  blur: 0,\n};\n\n/**\n * Blur filter class\n * @example\n * const filter = new Blur({\n *   blur: 0.5\n * });\n * object.filters.push(filter);\n * object.applyFilters();\n * canvas.renderAll();\n */\nexport class Blur extends BaseFilter<'Blur', BlurOwnProps> {\n  /**\n   * blur value, in percentage of image dimensions.\n   * specific to keep the image blur constant at different resolutions\n   * range between 0 and 1.\n   * @type Number\n   * @default\n   */\n  declare blur: BlurOwnProps['blur'];\n\n  declare horizontal: boolean;\n  declare aspectRatio: number;\n\n  static type = 'Blur';\n\n  static defaults = blurDefaultValues;\n\n  static uniformLocations = ['uDelta'];\n\n  getFragmentSource(): string {\n    return fragmentSource;\n  }\n\n  applyTo(options: TWebGLPipelineState | T2DPipelineState) {\n    if (isWebGLPipelineState(options)) {\n      // this aspectRatio is used to give the same blur to vertical and horizontal\n      this.aspectRatio = options.sourceWidth / options.sourceHeight;\n      options.passes++;\n      this._setupFrameBuffer(options);\n      this.horizontal = true;\n      this.applyToWebGL(options);\n      this._swapTextures(options);\n      this._setupFrameBuffer(options);\n      this.horizontal = false;\n      this.applyToWebGL(options);\n      this._swapTextures(options);\n    } else {\n      this.applyTo2d(options);\n    }\n  }\n\n  applyTo2d(options: T2DPipelineState) {\n    options.imageData = this.simpleBlur(options);\n  }\n\n  simpleBlur({\n    ctx,\n    imageData,\n    filterBackend: { resources },\n  }: T2DPipelineState) {\n    const { width, height } = imageData;\n    if (!resources.blurLayer1) {\n      resources.blurLayer1 = createCanvasElement();\n      resources.blurLayer2 = createCanvasElement();\n    }\n    const canvas1 = resources.blurLayer1!;\n    const canvas2 = resources.blurLayer2!;\n    if (canvas1.width !== width || canvas1.height !== height) {\n      canvas2.width = canvas1.width = width;\n      canvas2.height = canvas1.height = height;\n    }\n    const ctx1 = canvas1.getContext('2d')!,\n      ctx2 = canvas2.getContext('2d')!,\n      nSamples = 15,\n      blur = this.blur * 0.06 * 0.5;\n    let random, percent, j, i;\n\n    // load first canvas\n    ctx1.putImageData(imageData, 0, 0);\n    ctx2.clearRect(0, 0, width, height);\n\n    for (i = -nSamples; i <= nSamples; i++) {\n      random = (Math.random() - 0.5) / 4;\n      percent = i / nSamples;\n      j = blur * percent * width + random;\n      ctx2.globalAlpha = 1 - Math.abs(percent);\n      ctx2.drawImage(canvas1, j, random);\n      ctx1.drawImage(canvas2, 0, 0);\n      ctx2.globalAlpha = 1;\n      ctx2.clearRect(0, 0, canvas2.width, canvas2.height);\n    }\n    for (i = -nSamples; i <= nSamples; i++) {\n      random = (Math.random() - 0.5) / 4;\n      percent = i / nSamples;\n      j = blur * percent * height + random;\n      ctx2.globalAlpha = 1 - Math.abs(percent);\n      ctx2.drawImage(canvas1, random, j);\n      ctx1.drawImage(canvas2, 0, 0);\n      ctx2.globalAlpha = 1;\n      ctx2.clearRect(0, 0, canvas2.width, canvas2.height);\n    }\n    ctx.drawImage(canvas1, 0, 0);\n    const newImageData = ctx.getImageData(0, 0, canvas1.width, canvas1.height);\n    ctx1.globalAlpha = 1;\n    ctx1.clearRect(0, 0, canvas1.width, canvas1.height);\n    return newImageData;\n  }\n\n  /**\n   * Send data from this filter to its shader program's uniforms.\n   *\n   * @param {WebGLRenderingContext} gl The GL canvas context used to compile this filter's shader.\n   * @param {Object} uniformLocations A map of string uniform names to WebGLUniformLocation objects\n   */\n  sendUniformData(\n    gl: WebGLRenderingContext,\n    uniformLocations: TWebGLUniformLocationMap\n  ) {\n    const delta = this.chooseRightDelta();\n    gl.uniform2fv(uniformLocations.uDelta, delta);\n  }\n\n  isNeutralState() {\n    return this.blur === 0;\n  }\n\n  /**\n   * choose right value of image percentage to blur with\n   * @returns {Array} a numeric array with delta values\n   */\n  chooseRightDelta() {\n    let blurScale = 1;\n    const delta = [0, 0];\n    if (this.horizontal) {\n      if (this.aspectRatio > 1) {\n        // image is wide, i want to shrink radius horizontal\n        blurScale = 1 / this.aspectRatio;\n      }\n    } else {\n      if (this.aspectRatio < 1) {\n        // image is tall, i want to shrink radius vertical\n        blurScale = this.aspectRatio;\n      }\n    }\n    const blur = blurScale * this.blur * 0.12;\n    if (this.horizontal) {\n      delta[0] = blur;\n    } else {\n      delta[1] = blur;\n    }\n    return delta;\n  }\n}\n\nclassRegistry.setClass(Blur);\n"],"names":["blurDefaultValues","blur","Blur","BaseFilter","getFragmentSource","fragmentSource","applyTo","options","isWebGLPipelineState","this","aspectRatio","sourceWidth","sourceHeight","passes","_setupFrameBuffer","horizontal","applyToWebGL","_swapTextures","applyTo2d","imageData","simpleBlur","_ref","ctx","filterBackend","resources","width","height","blurLayer1","createCanvasElement","blurLayer2","canvas1","canvas2","ctx1","getContext","ctx2","nSamples","random","percent","j","i","putImageData","clearRect","Math","globalAlpha","abs","drawImage","newImageData","getImageData","sendUniformData","gl","uniformLocations","delta","chooseRightDelta","uniform2fv","uDelta","isNeutralState","blurScale","_defineProperty","classRegistry","setClass"],"mappings":"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"}

package/dist/src/filters/Blur.mjs

@@ -109,7 +109,7 @@ class Blur extends BaseFilter {
    */
   sendUniformData(gl, uniformLocations) {
     const delta = this.chooseRightDelta();
-    gl.uniform2fv(uniformLocations.delta, delta);
+    gl.uniform2fv(uniformLocations.uDelta, delta);
   }
   isNeutralState() {
     return this.blur === 0;

package/dist/src/filters/Blur.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Blur.mjs","sources":["../../../src/filters/Blur.ts"],"sourcesContent":["import { createCanvasElement } from '../util/misc/dom';\nimport { BaseFilter } from './BaseFilter';\nimport type {\n  TWebGLPipelineState,\n  T2DPipelineState,\n  TWebGLUniformLocationMap,\n} from './typedefs';\nimport { isWebGLPipelineState } from './utils';\nimport { classRegistry } from '../ClassRegistry';\nimport { fragmentSource } from './shaders/blur';\n\ntype BlurOwnProps = {\n  blur: number;\n};\n\nexport const blurDefaultValues: BlurOwnProps = {\n  blur: 0,\n};\n\n/**\n * Blur filter class\n * @example\n * const filter = new Blur({\n *   blur: 0.5\n * });\n * object.filters.push(filter);\n * object.applyFilters();\n * canvas.renderAll();\n */\nexport class Blur extends BaseFilter<'Blur', BlurOwnProps> {\n  /**\n   * blur value, in percentage of image dimensions.\n   * specific to keep the image blur constant at different resolutions\n   * range between 0 and 1.\n   * @type Number\n   * @default\n   */\n  declare blur: BlurOwnProps['blur'];\n\n  declare horizontal: boolean;\n  declare aspectRatio: number;\n\n  static type = 'Blur';\n\n  static defaults = blurDefaultValues;\n\n  static uniformLocations = ['uDelta'];\n\n  getFragmentSource(): string {\n    return fragmentSource;\n  }\n\n  applyTo(options: TWebGLPipelineState | T2DPipelineState) {\n    if (isWebGLPipelineState(options)) {\n      // this aspectRatio is used to give the same blur to vertical and horizontal\n      this.aspectRatio = options.sourceWidth / options.sourceHeight;\n      options.passes++;\n      this._setupFrameBuffer(options);\n      this.horizontal = true;\n      this.applyToWebGL(options);\n      this._swapTextures(options);\n      this._setupFrameBuffer(options);\n      this.horizontal = false;\n      this.applyToWebGL(options);\n      this._swapTextures(options);\n    } else {\n      this.applyTo2d(options);\n    }\n  }\n\n  applyTo2d(options: T2DPipelineState) {\n    options.imageData = this.simpleBlur(options);\n  }\n\n  simpleBlur({\n    ctx,\n    imageData,\n    filterBackend: { resources },\n  }: T2DPipelineState) {\n    const { width, height } = imageData;\n    if (!resources.blurLayer1) {\n      resources.blurLayer1 = createCanvasElement();\n      resources.blurLayer2 = createCanvasElement();\n    }\n    const canvas1 = resources.blurLayer1!;\n    const canvas2 = resources.blurLayer2!;\n    if (canvas1.width !== width || canvas1.height !== height) {\n      canvas2.width = canvas1.width = width;\n      canvas2.height = canvas1.height = height;\n    }\n    const ctx1 = canvas1.getContext('2d')!,\n      ctx2 = canvas2.getContext('2d')!,\n      nSamples = 15,\n      blur = this.blur * 0.06 * 0.5;\n    let random, percent, j, i;\n\n    // load first canvas\n    ctx1.putImageData(imageData, 0, 0);\n    ctx2.clearRect(0, 0, width, height);\n\n    for (i = -nSamples; i <= nSamples; i++) {\n      random = (Math.random() - 0.5) / 4;\n      percent = i / nSamples;\n      j = blur * percent * width + random;\n      ctx2.globalAlpha = 1 - Math.abs(percent);\n      ctx2.drawImage(canvas1, j, random);\n      ctx1.drawImage(canvas2, 0, 0);\n      ctx2.globalAlpha = 1;\n      ctx2.clearRect(0, 0, canvas2.width, canvas2.height);\n    }\n    for (i = -nSamples; i <= nSamples; i++) {\n      random = (Math.random() - 0.5) / 4;\n      percent = i / nSamples;\n      j = blur * percent * height + random;\n      ctx2.globalAlpha = 1 - Math.abs(percent);\n      ctx2.drawImage(canvas1, random, j);\n      ctx1.drawImage(canvas2, 0, 0);\n      ctx2.globalAlpha = 1;\n      ctx2.clearRect(0, 0, canvas2.width, canvas2.height);\n    }\n    ctx.drawImage(canvas1, 0, 0);\n    const newImageData = ctx.getImageData(0, 0, canvas1.width, canvas1.height);\n    ctx1.globalAlpha = 1;\n    ctx1.clearRect(0, 0, canvas1.width, canvas1.height);\n    return newImageData;\n  }\n\n  /**\n   * Send data from this filter to its shader program's uniforms.\n   *\n   * @param {WebGLRenderingContext} gl The GL canvas context used to compile this filter's shader.\n   * @param {Object} uniformLocations A map of string uniform names to WebGLUniformLocation objects\n   */\n  sendUniformData(\n    gl: WebGLRenderingContext,\n    uniformLocations: TWebGLUniformLocationMap\n  ) {\n    const delta = this.chooseRightDelta();\n    gl.uniform2fv(uniformLocations.delta, delta);\n  }\n\n  isNeutralState() {\n    return this.blur === 0;\n  }\n\n  /**\n   * choose right value of image percentage to blur with\n   * @returns {Array} a numeric array with delta values\n   */\n  chooseRightDelta() {\n    let blurScale = 1;\n    const delta = [0, 0];\n    if (this.horizontal) {\n      if (this.aspectRatio > 1) {\n        // image is wide, i want to shrink radius horizontal\n        blurScale = 1 / this.aspectRatio;\n      }\n    } else {\n      if (this.aspectRatio < 1) {\n        // image is tall, i want to shrink radius vertical\n        blurScale = this.aspectRatio;\n      }\n    }\n    const blur = blurScale * this.blur * 0.12;\n    if (this.horizontal) {\n      delta[0] = blur;\n    } else {\n      delta[1] = blur;\n    }\n    return delta;\n  }\n}\n\nclassRegistry.setClass(Blur);\n"],"names":["blurDefaultValues","blur","Blur","BaseFilter","getFragmentSource","fragmentSource","applyTo","options","isWebGLPipelineState","aspectRatio","sourceWidth","sourceHeight","passes","_setupFrameBuffer","horizontal","applyToWebGL","_swapTextures","applyTo2d","imageData","simpleBlur","_ref","ctx","filterBackend","resources","width","height","blurLayer1","createCanvasElement","blurLayer2","canvas1","canvas2","ctx1","getContext","ctx2","nSamples","random","percent","j","i","putImageData","clearRect","Math","globalAlpha","abs","drawImage","newImageData","getImageData","sendUniformData","gl","uniformLocations","delta","chooseRightDelta","uniform2fv","isNeutralState","blurScale","_defineProperty","classRegistry","setClass"],"mappings":"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"}
+{"version":3,"file":"Blur.mjs","sources":["../../../src/filters/Blur.ts"],"sourcesContent":["import { createCanvasElement } from '../util/misc/dom';\nimport { BaseFilter } from './BaseFilter';\nimport type {\n  TWebGLPipelineState,\n  T2DPipelineState,\n  TWebGLUniformLocationMap,\n} from './typedefs';\nimport { isWebGLPipelineState } from './utils';\nimport { classRegistry } from '../ClassRegistry';\nimport { fragmentSource } from './shaders/blur';\n\ntype BlurOwnProps = {\n  blur: number;\n};\n\nexport const blurDefaultValues: BlurOwnProps = {\n  blur: 0,\n};\n\n/**\n * Blur filter class\n * @example\n * const filter = new Blur({\n *   blur: 0.5\n * });\n * object.filters.push(filter);\n * object.applyFilters();\n * canvas.renderAll();\n */\nexport class Blur extends BaseFilter<'Blur', BlurOwnProps> {\n  /**\n   * blur value, in percentage of image dimensions.\n   * specific to keep the image blur constant at different resolutions\n   * range between 0 and 1.\n   * @type Number\n   * @default\n   */\n  declare blur: BlurOwnProps['blur'];\n\n  declare horizontal: boolean;\n  declare aspectRatio: number;\n\n  static type = 'Blur';\n\n  static defaults = blurDefaultValues;\n\n  static uniformLocations = ['uDelta'];\n\n  getFragmentSource(): string {\n    return fragmentSource;\n  }\n\n  applyTo(options: TWebGLPipelineState | T2DPipelineState) {\n    if (isWebGLPipelineState(options)) {\n      // this aspectRatio is used to give the same blur to vertical and horizontal\n      this.aspectRatio = options.sourceWidth / options.sourceHeight;\n      options.passes++;\n      this._setupFrameBuffer(options);\n      this.horizontal = true;\n      this.applyToWebGL(options);\n      this._swapTextures(options);\n      this._setupFrameBuffer(options);\n      this.horizontal = false;\n      this.applyToWebGL(options);\n      this._swapTextures(options);\n    } else {\n      this.applyTo2d(options);\n    }\n  }\n\n  applyTo2d(options: T2DPipelineState) {\n    options.imageData = this.simpleBlur(options);\n  }\n\n  simpleBlur({\n    ctx,\n    imageData,\n    filterBackend: { resources },\n  }: T2DPipelineState) {\n    const { width, height } = imageData;\n    if (!resources.blurLayer1) {\n      resources.blurLayer1 = createCanvasElement();\n      resources.blurLayer2 = createCanvasElement();\n    }\n    const canvas1 = resources.blurLayer1!;\n    const canvas2 = resources.blurLayer2!;\n    if (canvas1.width !== width || canvas1.height !== height) {\n      canvas2.width = canvas1.width = width;\n      canvas2.height = canvas1.height = height;\n    }\n    const ctx1 = canvas1.getContext('2d')!,\n      ctx2 = canvas2.getContext('2d')!,\n      nSamples = 15,\n      blur = this.blur * 0.06 * 0.5;\n    let random, percent, j, i;\n\n    // load first canvas\n    ctx1.putImageData(imageData, 0, 0);\n    ctx2.clearRect(0, 0, width, height);\n\n    for (i = -nSamples; i <= nSamples; i++) {\n      random = (Math.random() - 0.5) / 4;\n      percent = i / nSamples;\n      j = blur * percent * width + random;\n      ctx2.globalAlpha = 1 - Math.abs(percent);\n      ctx2.drawImage(canvas1, j, random);\n      ctx1.drawImage(canvas2, 0, 0);\n      ctx2.globalAlpha = 1;\n      ctx2.clearRect(0, 0, canvas2.width, canvas2.height);\n    }\n    for (i = -nSamples; i <= nSamples; i++) {\n      random = (Math.random() - 0.5) / 4;\n      percent = i / nSamples;\n      j = blur * percent * height + random;\n      ctx2.globalAlpha = 1 - Math.abs(percent);\n      ctx2.drawImage(canvas1, random, j);\n      ctx1.drawImage(canvas2, 0, 0);\n      ctx2.globalAlpha = 1;\n      ctx2.clearRect(0, 0, canvas2.width, canvas2.height);\n    }\n    ctx.drawImage(canvas1, 0, 0);\n    const newImageData = ctx.getImageData(0, 0, canvas1.width, canvas1.height);\n    ctx1.globalAlpha = 1;\n    ctx1.clearRect(0, 0, canvas1.width, canvas1.height);\n    return newImageData;\n  }\n\n  /**\n   * Send data from this filter to its shader program's uniforms.\n   *\n   * @param {WebGLRenderingContext} gl The GL canvas context used to compile this filter's shader.\n   * @param {Object} uniformLocations A map of string uniform names to WebGLUniformLocation objects\n   */\n  sendUniformData(\n    gl: WebGLRenderingContext,\n    uniformLocations: TWebGLUniformLocationMap\n  ) {\n    const delta = this.chooseRightDelta();\n    gl.uniform2fv(uniformLocations.uDelta, delta);\n  }\n\n  isNeutralState() {\n    return this.blur === 0;\n  }\n\n  /**\n   * choose right value of image percentage to blur with\n   * @returns {Array} a numeric array with delta values\n   */\n  chooseRightDelta() {\n    let blurScale = 1;\n    const delta = [0, 0];\n    if (this.horizontal) {\n      if (this.aspectRatio > 1) {\n        // image is wide, i want to shrink radius horizontal\n        blurScale = 1 / this.aspectRatio;\n      }\n    } else {\n      if (this.aspectRatio < 1) {\n        // image is tall, i want to shrink radius vertical\n        blurScale = this.aspectRatio;\n      }\n    }\n    const blur = blurScale * this.blur * 0.12;\n    if (this.horizontal) {\n      delta[0] = blur;\n    } else {\n      delta[1] = blur;\n    }\n    return delta;\n  }\n}\n\nclassRegistry.setClass(Blur);\n"],"names":["blurDefaultValues","blur","Blur","BaseFilter","getFragmentSource","fragmentSource","applyTo","options","isWebGLPipelineState","aspectRatio","sourceWidth","sourceHeight","passes","_setupFrameBuffer","horizontal","applyToWebGL","_swapTextures","applyTo2d","imageData","simpleBlur","_ref","ctx","filterBackend","resources","width","height","blurLayer1","createCanvasElement","blurLayer2","canvas1","canvas2","ctx1","getContext","ctx2","nSamples","random","percent","j","i","putImageData","clearRect","Math","globalAlpha","abs","drawImage","newImageData","getImageData","sendUniformData","gl","uniformLocations","delta","chooseRightDelta","uniform2fv","uDelta","isNeutralState","blurScale","_defineProperty","classRegistry","setClass"],"mappings":"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"}

package/dist/src/filters/Pixelate.min.mjs

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{BaseFilter as t}from"./BaseFilter.min.mjs";import{classRegistry as i}from"../ClassRegistry.min.mjs";import{fragmentSource as s}from"./shaders/pixelate.min.mjs";const o={blocksize:4};class r extends t{applyTo2d(e){let{imageData:{data:t,width:i,height:s}}=e;for(let e=0;e<s;e+=this.blocksize)for(let o=0;o<i;o+=this.blocksize){const r=4*e*i+4*o,l=t[r],a=t[r+1],m=t[r+2],n=t[r+3];for(let r=e;r<Math.min(e+this.blocksize,s);r++)for(let e=o;e<Math.min(o+this.blocksize,i);e++){const s=4*r*i+4*e;t[s]=l,t[s+1]=a,t[s+2]=m,t[s+3]=n}}}isNeutralState(){return 1===this.blocksize}getFragmentSource(){return s}sendUniformData(e,t){e.uniform1f(t.uBlocksize,this.blocksize)}}e(r,"type","Pixelate"),e(r,"defaults",o),e(r,"uniformLocations",["uBlockSize"]),i.setClass(r);export{r as Pixelate,o as pixelateDefaultValues};
+import{defineProperty as e}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{BaseFilter as t}from"./BaseFilter.min.mjs";import{classRegistry as i}from"../ClassRegistry.min.mjs";import{fragmentSource as s}from"./shaders/pixelate.min.mjs";const o={blocksize:4};class r extends t{applyTo2d(e){let{imageData:{data:t,width:i,height:s}}=e;for(let e=0;e<s;e+=this.blocksize)for(let o=0;o<i;o+=this.blocksize){const r=4*e*i+4*o,l=t[r],a=t[r+1],m=t[r+2],n=t[r+3];for(let r=e;r<Math.min(e+this.blocksize,s);r++)for(let e=o;e<Math.min(o+this.blocksize,i);e++){const s=4*r*i+4*e;t[s]=l,t[s+1]=a,t[s+2]=m,t[s+3]=n}}}isNeutralState(){return 1===this.blocksize}getFragmentSource(){return s}sendUniformData(e,t){e.uniform1f(t.uBlocksize,this.blocksize)}}e(r,"type","Pixelate"),e(r,"defaults",o),e(r,"uniformLocations",["uBlocksize"]),i.setClass(r);export{r as Pixelate,o as pixelateDefaultValues};
 //# sourceMappingURL=Pixelate.min.mjs.map

package/dist/src/filters/Pixelate.min.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Pixelate.min.mjs","sources":["../../../src/filters/Pixelate.ts"],"sourcesContent":["import { BaseFilter } from './BaseFilter';\nimport type { T2DPipelineState, TWebGLUniformLocationMap } from './typedefs';\nimport { classRegistry } from '../ClassRegistry';\nimport { fragmentSource } from './shaders/pixelate';\n\nexport type PixelateOwnProps = {\n  blocksize: number;\n};\n\nexport const pixelateDefaultValues: PixelateOwnProps = {\n  blocksize: 4,\n};\n\n/**\n * Pixelate filter class\n * @example\n * const filter = new Pixelate({\n *   blocksize: 8\n * });\n * object.filters.push(filter);\n * object.applyFilters();\n */\nexport class Pixelate extends BaseFilter<'Pixelate', PixelateOwnProps> {\n  declare blocksize: PixelateOwnProps['blocksize'];\n\n  static type = 'Pixelate';\n\n  static defaults = pixelateDefaultValues;\n\n  static uniformLocations = ['uBlockSize'];\n\n  /**\n   * Apply the Pixelate operation to a Uint8ClampedArray representing the pixels of an image.\n   *\n   * @param {Object} options\n   * @param {ImageData} options.imageData The Uint8ClampedArray to be filtered.\n   */\n  applyTo2d({ imageData: { data, width, height } }: T2DPipelineState) {\n    for (let i = 0; i < height; i += this.blocksize) {\n      for (let j = 0; j < width; j += this.blocksize) {\n        const index = i * 4 * width + j * 4;\n        const r = data[index];\n        const g = data[index + 1];\n        const b = data[index + 2];\n        const a = data[index + 3];\n\n        for (let _i = i; _i < Math.min(i + this.blocksize, height); _i++) {\n          for (let _j = j; _j < Math.min(j + this.blocksize, width); _j++) {\n            const index = _i * 4 * width + _j * 4;\n            data[index] = r;\n            data[index + 1] = g;\n            data[index + 2] = b;\n            data[index + 3] = a;\n          }\n        }\n      }\n    }\n  }\n\n  /**\n   * Indicate when the filter is not gonna apply changes to the image\n   **/\n  isNeutralState() {\n    return this.blocksize === 1;\n  }\n\n  protected getFragmentSource(): string {\n    return fragmentSource;\n  }\n\n  /**\n   * Send data from this filter to its shader program's uniforms.\n   *\n   * @param {WebGLRenderingContext} gl The GL canvas context used to compile this filter's shader.\n   * @param {Object} uniformLocations A map of string uniform names to WebGLUniformLocation objects\n   */\n  sendUniformData(\n    gl: WebGLRenderingContext,\n    uniformLocations: TWebGLUniformLocationMap\n  ) {\n    gl.uniform1f(uniformLocations.uBlocksize, this.blocksize);\n  }\n}\n\nclassRegistry.setClass(Pixelate);\n"],"names":["pixelateDefaultValues","blocksize","Pixelate","BaseFilter","applyTo2d","_ref","imageData","data","width","height","i","this","j","index","r","g","b","a","_i","Math","min","_j","isNeutralState","getFragmentSource","fragmentSource","sendUniformData","gl","uniformLocations","uniform1f","uBlocksize","_defineProperty","classRegistry","setClass"],"mappings":"yPASO,MAAMA,EAA0C,CACrDC,UAAW,GAYN,MAAMC,UAAiBC,EAe5BC,SAAAA,CAASC,GAA2D,IAAxDC,WAAWC,KAAEA,EAAIC,MAAEA,EAAKC,OAAEA,IAA4BJ,EAChE,IAAK,IAAIK,EAAI,EAAGA,EAAID,EAAQC,GAAKC,KAAKV,UACpC,IAAK,IAAIW,EAAI,EAAGA,EAAIJ,EAAOI,GAAKD,KAAKV,UAAW,CAC9C,MAAMY,EAAY,EAAJH,EAAQF,EAAY,EAAJI,EACxBE,EAAIP,EAAKM,GACTE,EAAIR,EAAKM,EAAQ,GACjBG,EAAIT,EAAKM,EAAQ,GACjBI,EAAIV,EAAKM,EAAQ,GAEvB,IAAK,IAAIK,EAAKR,EAAGQ,EAAKC,KAAKC,IAAIV,EAAIC,KAAKV,UAAWQ,GAASS,IAC1D,IAAK,IAAIG,EAAKT,EAAGS,EAAKF,KAAKC,IAAIR,EAAID,KAAKV,UAAWO,GAAQa,IAAM,CAC/D,MAAMR,EAAa,EAALK,EAASV,EAAa,EAALa,EAC/Bd,EAAKM,GAASC,EACdP,EAAKM,EAAQ,GAAKE,EAClBR,EAAKM,EAAQ,GAAKG,EAClBT,EAAKM,EAAQ,GAAKI,CACpB,CAEJ,CAEJ,CAKAK,cAAAA,GACE,OAA0B,IAAnBX,KAAKV,SACd,CAEUsB,iBAAAA,GACR,OAAOC,CACT,CAQAC,eAAAA,CACEC,EACAC,GAEAD,EAAGE,UAAUD,EAAiBE,WAAYlB,KAAKV,UACjD,EACD6B,EA5DY5B,EAAQ,OAGL,YAAU4B,EAHb5B,EAAQ,WAKDF,GAAqB8B,EAL5B5B,EAOe,mBAAA,CAAC,eAuD7B6B,EAAcC,SAAS9B"}
+{"version":3,"file":"Pixelate.min.mjs","sources":["../../../src/filters/Pixelate.ts"],"sourcesContent":["import { BaseFilter } from './BaseFilter';\nimport type { T2DPipelineState, TWebGLUniformLocationMap } from './typedefs';\nimport { classRegistry } from '../ClassRegistry';\nimport { fragmentSource } from './shaders/pixelate';\n\nexport type PixelateOwnProps = {\n  blocksize: number;\n};\n\nexport const pixelateDefaultValues: PixelateOwnProps = {\n  blocksize: 4,\n};\n\n/**\n * Pixelate filter class\n * @example\n * const filter = new Pixelate({\n *   blocksize: 8\n * });\n * object.filters.push(filter);\n * object.applyFilters();\n */\nexport class Pixelate extends BaseFilter<'Pixelate', PixelateOwnProps> {\n  declare blocksize: PixelateOwnProps['blocksize'];\n\n  static type = 'Pixelate';\n\n  static defaults = pixelateDefaultValues;\n\n  static uniformLocations = ['uBlocksize'];\n\n  /**\n   * Apply the Pixelate operation to a Uint8ClampedArray representing the pixels of an image.\n   *\n   * @param {Object} options\n   * @param {ImageData} options.imageData The Uint8ClampedArray to be filtered.\n   */\n  applyTo2d({ imageData: { data, width, height } }: T2DPipelineState) {\n    for (let i = 0; i < height; i += this.blocksize) {\n      for (let j = 0; j < width; j += this.blocksize) {\n        const index = i * 4 * width + j * 4;\n        const r = data[index];\n        const g = data[index + 1];\n        const b = data[index + 2];\n        const a = data[index + 3];\n\n        for (let _i = i; _i < Math.min(i + this.blocksize, height); _i++) {\n          for (let _j = j; _j < Math.min(j + this.blocksize, width); _j++) {\n            const index = _i * 4 * width + _j * 4;\n            data[index] = r;\n            data[index + 1] = g;\n            data[index + 2] = b;\n            data[index + 3] = a;\n          }\n        }\n      }\n    }\n  }\n\n  /**\n   * Indicate when the filter is not gonna apply changes to the image\n   **/\n  isNeutralState() {\n    return this.blocksize === 1;\n  }\n\n  protected getFragmentSource(): string {\n    return fragmentSource;\n  }\n\n  /**\n   * Send data from this filter to its shader program's uniforms.\n   *\n   * @param {WebGLRenderingContext} gl The GL canvas context used to compile this filter's shader.\n   * @param {Object} uniformLocations A map of string uniform names to WebGLUniformLocation objects\n   */\n  sendUniformData(\n    gl: WebGLRenderingContext,\n    uniformLocations: TWebGLUniformLocationMap\n  ) {\n    gl.uniform1f(uniformLocations.uBlocksize, this.blocksize);\n  }\n}\n\nclassRegistry.setClass(Pixelate);\n"],"names":["pixelateDefaultValues","blocksize","Pixelate","BaseFilter","applyTo2d","_ref","imageData","data","width","height","i","this","j","index","r","g","b","a","_i","Math","min","_j","isNeutralState","getFragmentSource","fragmentSource","sendUniformData","gl","uniformLocations","uniform1f","uBlocksize","_defineProperty","classRegistry","setClass"],"mappings":"yPASO,MAAMA,EAA0C,CACrDC,UAAW,GAYN,MAAMC,UAAiBC,EAe5BC,SAAAA,CAASC,GAA2D,IAAxDC,WAAWC,KAAEA,EAAIC,MAAEA,EAAKC,OAAEA,IAA4BJ,EAChE,IAAK,IAAIK,EAAI,EAAGA,EAAID,EAAQC,GAAKC,KAAKV,UACpC,IAAK,IAAIW,EAAI,EAAGA,EAAIJ,EAAOI,GAAKD,KAAKV,UAAW,CAC9C,MAAMY,EAAY,EAAJH,EAAQF,EAAY,EAAJI,EACxBE,EAAIP,EAAKM,GACTE,EAAIR,EAAKM,EAAQ,GACjBG,EAAIT,EAAKM,EAAQ,GACjBI,EAAIV,EAAKM,EAAQ,GAEvB,IAAK,IAAIK,EAAKR,EAAGQ,EAAKC,KAAKC,IAAIV,EAAIC,KAAKV,UAAWQ,GAASS,IAC1D,IAAK,IAAIG,EAAKT,EAAGS,EAAKF,KAAKC,IAAIR,EAAID,KAAKV,UAAWO,GAAQa,IAAM,CAC/D,MAAMR,EAAa,EAALK,EAASV,EAAa,EAALa,EAC/Bd,EAAKM,GAASC,EACdP,EAAKM,EAAQ,GAAKE,EAClBR,EAAKM,EAAQ,GAAKG,EAClBT,EAAKM,EAAQ,GAAKI,CACpB,CAEJ,CAEJ,CAKAK,cAAAA,GACE,OAA0B,IAAnBX,KAAKV,SACd,CAEUsB,iBAAAA,GACR,OAAOC,CACT,CAQAC,eAAAA,CACEC,EACAC,GAEAD,EAAGE,UAAUD,EAAiBE,WAAYlB,KAAKV,UACjD,EACD6B,EA5DY5B,EAAQ,OAGL,YAAU4B,EAHb5B,EAAQ,WAKDF,GAAqB8B,EAL5B5B,EAOe,mBAAA,CAAC,eAuD7B6B,EAAcC,SAAS9B"}

package/dist/src/filters/Pixelate.mjs

@@ -73,7 +73,7 @@ class Pixelate extends BaseFilter {
 }
 _defineProperty(Pixelate, "type", 'Pixelate');
 _defineProperty(Pixelate, "defaults", pixelateDefaultValues);
-_defineProperty(Pixelate, "uniformLocations", ['uBlockSize']);
+_defineProperty(Pixelate, "uniformLocations", ['uBlocksize']);
 classRegistry.setClass(Pixelate);
 
 export { Pixelate, pixelateDefaultValues };

package/dist/src/filters/Pixelate.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Pixelate.mjs","sources":["../../../src/filters/Pixelate.ts"],"sourcesContent":["import { BaseFilter } from './BaseFilter';\nimport type { T2DPipelineState, TWebGLUniformLocationMap } from './typedefs';\nimport { classRegistry } from '../ClassRegistry';\nimport { fragmentSource } from './shaders/pixelate';\n\nexport type PixelateOwnProps = {\n  blocksize: number;\n};\n\nexport const pixelateDefaultValues: PixelateOwnProps = {\n  blocksize: 4,\n};\n\n/**\n * Pixelate filter class\n * @example\n * const filter = new Pixelate({\n *   blocksize: 8\n * });\n * object.filters.push(filter);\n * object.applyFilters();\n */\nexport class Pixelate extends BaseFilter<'Pixelate', PixelateOwnProps> {\n  declare blocksize: PixelateOwnProps['blocksize'];\n\n  static type = 'Pixelate';\n\n  static defaults = pixelateDefaultValues;\n\n  static uniformLocations = ['uBlockSize'];\n\n  /**\n   * Apply the Pixelate operation to a Uint8ClampedArray representing the pixels of an image.\n   *\n   * @param {Object} options\n   * @param {ImageData} options.imageData The Uint8ClampedArray to be filtered.\n   */\n  applyTo2d({ imageData: { data, width, height } }: T2DPipelineState) {\n    for (let i = 0; i < height; i += this.blocksize) {\n      for (let j = 0; j < width; j += this.blocksize) {\n        const index = i * 4 * width + j * 4;\n        const r = data[index];\n        const g = data[index + 1];\n        const b = data[index + 2];\n        const a = data[index + 3];\n\n        for (let _i = i; _i < Math.min(i + this.blocksize, height); _i++) {\n          for (let _j = j; _j < Math.min(j + this.blocksize, width); _j++) {\n            const index = _i * 4 * width + _j * 4;\n            data[index] = r;\n            data[index + 1] = g;\n            data[index + 2] = b;\n            data[index + 3] = a;\n          }\n        }\n      }\n    }\n  }\n\n  /**\n   * Indicate when the filter is not gonna apply changes to the image\n   **/\n  isNeutralState() {\n    return this.blocksize === 1;\n  }\n\n  protected getFragmentSource(): string {\n    return fragmentSource;\n  }\n\n  /**\n   * Send data from this filter to its shader program's uniforms.\n   *\n   * @param {WebGLRenderingContext} gl The GL canvas context used to compile this filter's shader.\n   * @param {Object} uniformLocations A map of string uniform names to WebGLUniformLocation objects\n   */\n  sendUniformData(\n    gl: WebGLRenderingContext,\n    uniformLocations: TWebGLUniformLocationMap\n  ) {\n    gl.uniform1f(uniformLocations.uBlocksize, this.blocksize);\n  }\n}\n\nclassRegistry.setClass(Pixelate);\n"],"names":["pixelateDefaultValues","blocksize","Pixelate","BaseFilter","applyTo2d","_ref","imageData","data","width","height","i","j","index","r","g","b","a","_i","Math","min","_j","isNeutralState","getFragmentSource","fragmentSource","sendUniformData","gl","uniformLocations","uniform1f","uBlocksize","_defineProperty","classRegistry","setClass"],"mappings":"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"}
+{"version":3,"file":"Pixelate.mjs","sources":["../../../src/filters/Pixelate.ts"],"sourcesContent":["import { BaseFilter } from './BaseFilter';\nimport type { T2DPipelineState, TWebGLUniformLocationMap } from './typedefs';\nimport { classRegistry } from '../ClassRegistry';\nimport { fragmentSource } from './shaders/pixelate';\n\nexport type PixelateOwnProps = {\n  blocksize: number;\n};\n\nexport const pixelateDefaultValues: PixelateOwnProps = {\n  blocksize: 4,\n};\n\n/**\n * Pixelate filter class\n * @example\n * const filter = new Pixelate({\n *   blocksize: 8\n * });\n * object.filters.push(filter);\n * object.applyFilters();\n */\nexport class Pixelate extends BaseFilter<'Pixelate', PixelateOwnProps> {\n  declare blocksize: PixelateOwnProps['blocksize'];\n\n  static type = 'Pixelate';\n\n  static defaults = pixelateDefaultValues;\n\n  static uniformLocations = ['uBlocksize'];\n\n  /**\n   * Apply the Pixelate operation to a Uint8ClampedArray representing the pixels of an image.\n   *\n   * @param {Object} options\n   * @param {ImageData} options.imageData The Uint8ClampedArray to be filtered.\n   */\n  applyTo2d({ imageData: { data, width, height } }: T2DPipelineState) {\n    for (let i = 0; i < height; i += this.blocksize) {\n      for (let j = 0; j < width; j += this.blocksize) {\n        const index = i * 4 * width + j * 4;\n        const r = data[index];\n        const g = data[index + 1];\n        const b = data[index + 2];\n        const a = data[index + 3];\n\n        for (let _i = i; _i < Math.min(i + this.blocksize, height); _i++) {\n          for (let _j = j; _j < Math.min(j + this.blocksize, width); _j++) {\n            const index = _i * 4 * width + _j * 4;\n            data[index] = r;\n            data[index + 1] = g;\n            data[index + 2] = b;\n            data[index + 3] = a;\n          }\n        }\n      }\n    }\n  }\n\n  /**\n   * Indicate when the filter is not gonna apply changes to the image\n   **/\n  isNeutralState() {\n    return this.blocksize === 1;\n  }\n\n  protected getFragmentSource(): string {\n    return fragmentSource;\n  }\n\n  /**\n   * Send data from this filter to its shader program's uniforms.\n   *\n   * @param {WebGLRenderingContext} gl The GL canvas context used to compile this filter's shader.\n   * @param {Object} uniformLocations A map of string uniform names to WebGLUniformLocation objects\n   */\n  sendUniformData(\n    gl: WebGLRenderingContext,\n    uniformLocations: TWebGLUniformLocationMap\n  ) {\n    gl.uniform1f(uniformLocations.uBlocksize, this.blocksize);\n  }\n}\n\nclassRegistry.setClass(Pixelate);\n"],"names":["pixelateDefaultValues","blocksize","Pixelate","BaseFilter","applyTo2d","_ref","imageData","data","width","height","i","j","index","r","g","b","a","_i","Math","min","_j","isNeutralState","getFragmentSource","fragmentSource","sendUniformData","gl","uniformLocations","uniform1f","uBlocksize","_defineProperty","classRegistry","setClass"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"attributes.d.ts","sourceRoot":"","sources":["../../../src/parser/attributes.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,iBAAiB,UAoB7B,CAAC"}
+{"version":3,"file":"attributes.d.ts","sourceRoot":"","sources":["../../../src/parser/attributes.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,eAAO,MAAM,iBAAiB,UAoB7B,CAAC"}

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

@@ -1,2 +1,2 @@
-const t=["display","transform","fill","fill-opacity","fill-rule","opacity","stroke","stroke-dasharray","stroke-linecap","stroke-dashoffset","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke-width","id","paint-order","vector-effect","instantiated_by_use","clip-path"];export{t as SHARED_ATTRIBUTES};
+import{FILL as t,STROKE as i}from"../constants.min.mjs";const o=["display","transform",t,"fill-opacity","fill-rule","opacity",i,"stroke-dasharray","stroke-linecap","stroke-dashoffset","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke-width","id","paint-order","vector-effect","instantiated_by_use","clip-path"];export{o as SHARED_ATTRIBUTES};
 //# sourceMappingURL=attributes.min.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"attributes.min.mjs","sources":["../../../src/parser/attributes.ts"],"sourcesContent":["/**\n * Attributes parsed from all SVG elements\n * @type array\n */\nexport const SHARED_ATTRIBUTES = [\n  'display',\n  'transform',\n  'fill',\n  'fill-opacity',\n  'fill-rule',\n  'opacity',\n  'stroke',\n  'stroke-dasharray',\n  'stroke-linecap',\n  'stroke-dashoffset',\n  'stroke-linejoin',\n  'stroke-miterlimit',\n  'stroke-opacity',\n  'stroke-width',\n  'id',\n  'paint-order',\n  'vector-effect',\n  'instantiated_by_use',\n  'clip-path',\n];\n"],"names":["SHARED_ATTRIBUTES"],"mappings":"MAIaA,EAAoB,CAC/B,UACA,YACA,OACA,eACA,YACA,UACA,SACA,mBACA,iBACA,oBACA,kBACA,oBACA,iBACA,eACA,KACA,cACA,gBACA,sBACA"}
+{"version":3,"file":"attributes.min.mjs","sources":["../../../src/parser/attributes.ts"],"sourcesContent":["import { FILL, STROKE } from '../constants';\n\n/**\n * Attributes parsed from all SVG elements\n * @type array\n */\nexport const SHARED_ATTRIBUTES = [\n  'display',\n  'transform',\n  FILL,\n  'fill-opacity',\n  'fill-rule',\n  'opacity',\n  STROKE,\n  'stroke-dasharray',\n  'stroke-linecap',\n  'stroke-dashoffset',\n  'stroke-linejoin',\n  'stroke-miterlimit',\n  'stroke-opacity',\n  'stroke-width',\n  'id',\n  'paint-order',\n  'vector-effect',\n  'instantiated_by_use',\n  'clip-path',\n];\n"],"names":["SHARED_ATTRIBUTES","FILL","STROKE"],"mappings":"8DAMaA,EAAoB,CAC/B,UACA,YACAC,EACA,eACA,YACA,UACAC,EACA,mBACA,iBACA,oBACA,kBACA,oBACA,iBACA,eACA,KACA,cACA,gBACA,sBACA"}

package/dist/src/parser/attributes.mjs

@@ -1,8 +1,10 @@
+import { FILL, STROKE } from '../constants.mjs';
+
 /**
  * Attributes parsed from all SVG elements
  * @type array
  */
-const SHARED_ATTRIBUTES = ['display', 'transform', 'fill', 'fill-opacity', 'fill-rule', 'opacity', 'stroke', 'stroke-dasharray', 'stroke-linecap', 'stroke-dashoffset', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'id', 'paint-order', 'vector-effect', 'instantiated_by_use', 'clip-path'];
+const SHARED_ATTRIBUTES = ['display', 'transform', FILL, 'fill-opacity', 'fill-rule', 'opacity', STROKE, 'stroke-dasharray', 'stroke-linecap', 'stroke-dashoffset', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'id', 'paint-order', 'vector-effect', 'instantiated_by_use', 'clip-path'];
 
 export { SHARED_ATTRIBUTES };
 //# sourceMappingURL=attributes.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"attributes.mjs","sources":["../../../src/parser/attributes.ts"],"sourcesContent":["/**\n * Attributes parsed from all SVG elements\n * @type array\n */\nexport const SHARED_ATTRIBUTES = [\n  'display',\n  'transform',\n  'fill',\n  'fill-opacity',\n  'fill-rule',\n  'opacity',\n  'stroke',\n  'stroke-dasharray',\n  'stroke-linecap',\n  'stroke-dashoffset',\n  'stroke-linejoin',\n  'stroke-miterlimit',\n  'stroke-opacity',\n  'stroke-width',\n  'id',\n  'paint-order',\n  'vector-effect',\n  'instantiated_by_use',\n  'clip-path',\n];\n"],"names":["SHARED_ATTRIBUTES"],"mappings":"AAAA;AACA;AACA;AACA;MACaA,iBAAiB,GAAG,CAC/B,SAAS,EACT,WAAW,EACX,MAAM,EACN,cAAc,EACd,WAAW,EACX,SAAS,EACT,QAAQ,EACR,kBAAkB,EAClB,gBAAgB,EAChB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,cAAc,EACd,IAAI,EACJ,aAAa,EACb,eAAe,EACf,qBAAqB,EACrB,WAAW;;;;"}
+{"version":3,"file":"attributes.mjs","sources":["../../../src/parser/attributes.ts"],"sourcesContent":["import { FILL, STROKE } from '../constants';\n\n/**\n * Attributes parsed from all SVG elements\n * @type array\n */\nexport const SHARED_ATTRIBUTES = [\n  'display',\n  'transform',\n  FILL,\n  'fill-opacity',\n  'fill-rule',\n  'opacity',\n  STROKE,\n  'stroke-dasharray',\n  'stroke-linecap',\n  'stroke-dashoffset',\n  'stroke-linejoin',\n  'stroke-miterlimit',\n  'stroke-opacity',\n  'stroke-width',\n  'id',\n  'paint-order',\n  'vector-effect',\n  'instantiated_by_use',\n  'clip-path',\n];\n"],"names":["SHARED_ATTRIBUTES","FILL","STROKE"],"mappings":";;AAEA;AACA;AACA;AACA;MACaA,iBAAiB,GAAG,CAC/B,SAAS,EACT,WAAW,EACXC,IAAI,EACJ,cAAc,EACd,WAAW,EACX,SAAS,EACTC,MAAM,EACN,kBAAkB,EAClB,gBAAgB,EAChB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,cAAc,EACd,IAAI,EACJ,aAAa,EACb,eAAe,EACf,qBAAqB,EACrB,WAAW;;;;"}

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

@@ -1,2 +1,2 @@
-import{objectSpread2 as t}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{Gradient as e}from"../gradient/Gradient.min.mjs";import{Group as i}from"../shapes/Group.min.mjs";import{FabricImage as s}from"../shapes/Image.min.mjs";import{classRegistry as r}from"../ClassRegistry.min.mjs";import{invertTransform as n,multiplyTransformMatrices as a,qrDecompose as o}from"../util/misc/matrix.min.mjs";import{removeTransformMatrixForSvgParsing as l}from"../util/transform_matrix_removal.min.mjs";import{Point as m}from"../Point.min.mjs";import{CENTER as c}from"../constants.min.mjs";import{getGradientDefs as p}from"./getGradientDefs.min.mjs";import{getCSSRules as h}from"./getCSSRules.min.mjs";import{getTagName as f}from"./getTagName.min.mjs";import{parseTransformAttribute as u}from"./parseTransformAttribute.min.mjs";const g=t=>r.getSVGClass(f(t).toLowerCase());class P{constructor(t,e,i,s,r){this.elements=t,this.options=e,this.reviver=i,this.regexUrl=/^url\(['"]?#([^'"]+)['"]?\)/g,this.doc=s,this.clipPaths=r,this.gradientDefs=p(s),this.cssRules=h(s)}parse(){return Promise.all(this.elements.map((t=>this.createObject(t))))}async createObject(t){const e=g(t);if(e){const i=await e.fromElement(t,this.options,this.cssRules);return this.resolveGradient(i,t,"fill"),this.resolveGradient(i,t,"stroke"),i instanceof s&&i._originalElement?l(i,i.parsePreserveAspectRatioAttribute()):l(i),await this.resolveClipPath(i,t),this.reviver&&this.reviver(t,i),i}return null}extractPropertyDefinition(t,e,i){const s=t[e],r=this.regexUrl;if(!r.test(s))return;r.lastIndex=0;const n=r.exec(s)[1];return r.lastIndex=0,i[n]}resolveGradient(i,s,r){const n=this.extractPropertyDefinition(i,r,this.gradientDefs);if(n){const a=s.getAttribute(r+"-opacity"),o=e.fromElement(n,i,t(t({},this.options),{},{opacity:a}));i.set(r,o)}}async resolveClipPath(t,e){const s=this.extractPropertyDefinition(t,"clipPath",this.clipPaths);if(s){const r=n(t.calcTransformMatrix()),p=s[0].parentElement;let h=e;for(;h.parentElement&&h.getAttribute("clip-path")!==t.clipPath;)h=h.parentElement;h.parentElement.appendChild(p);const f=u("".concat(h.getAttribute("transform")||""," ").concat(p.getAttribute("originalTransform")||""));p.setAttribute("transform","matrix(".concat(f.join(","),")"));const P=await Promise.all(s.map((t=>g(t).fromElement(t,this.options,this.cssRules).then((t=>(l(t),t.fillRule=t.clipRule,delete t.clipRule,t)))))),j=1===P.length?P[0]:new i(P),d=a(r,j.calcTransformMatrix());j.clipPath&&await this.resolveClipPath(j,h);const{scaleX:v,scaleY:x,angle:b,skewX:w,translateX:y,translateY:R}=o(d);j.set({flipX:!1,flipY:!1}),j.set({scaleX:v,scaleY:x,angle:b,skewX:w,skewY:0}),j.setPositionByOrigin(new m(y,R),c,c),t.clipPath=j}else delete t.clipPath}}export{P as ElementsParser};
+import{objectSpread2 as t}from"../../_virtual/_rollupPluginBabelHelpers.min.mjs";import{Gradient as e}from"../gradient/Gradient.min.mjs";import{Group as i}from"../shapes/Group.min.mjs";import{FabricImage as s}from"../shapes/Image.min.mjs";import{classRegistry as r}from"../ClassRegistry.min.mjs";import{invertTransform as n,multiplyTransformMatrices as a,qrDecompose as o}from"../util/misc/matrix.min.mjs";import{removeTransformMatrixForSvgParsing as m}from"../util/transform_matrix_removal.min.mjs";import{Point as l}from"../Point.min.mjs";import{FILL as c,STROKE as p,CENTER as h}from"../constants.min.mjs";import{getGradientDefs as f}from"./getGradientDefs.min.mjs";import{getCSSRules as u}from"./getCSSRules.min.mjs";import{getTagName as g}from"./getTagName.min.mjs";import{parseTransformAttribute as P}from"./parseTransformAttribute.min.mjs";const j=t=>r.getSVGClass(g(t).toLowerCase());class d{constructor(t,e,i,s,r){this.elements=t,this.options=e,this.reviver=i,this.regexUrl=/^url\(['"]?#([^'"]+)['"]?\)/g,this.doc=s,this.clipPaths=r,this.gradientDefs=f(s),this.cssRules=u(s)}parse(){return Promise.all(this.elements.map((t=>this.createObject(t))))}async createObject(t){const e=j(t);if(e){const i=await e.fromElement(t,this.options,this.cssRules);return this.resolveGradient(i,t,c),this.resolveGradient(i,t,p),i instanceof s&&i._originalElement?m(i,i.parsePreserveAspectRatioAttribute()):m(i),await this.resolveClipPath(i,t),this.reviver&&this.reviver(t,i),i}return null}extractPropertyDefinition(t,e,i){const s=t[e],r=this.regexUrl;if(!r.test(s))return;r.lastIndex=0;const n=r.exec(s)[1];return r.lastIndex=0,i[n]}resolveGradient(i,s,r){const n=this.extractPropertyDefinition(i,r,this.gradientDefs);if(n){const a=s.getAttribute(r+"-opacity"),o=e.fromElement(n,i,t(t({},this.options),{},{opacity:a}));i.set(r,o)}}async resolveClipPath(t,e){const s=this.extractPropertyDefinition(t,"clipPath",this.clipPaths);if(s){const r=n(t.calcTransformMatrix()),c=s[0].parentElement;let p=e;for(;p.parentElement&&p.getAttribute("clip-path")!==t.clipPath;)p=p.parentElement;p.parentElement.appendChild(c);const f=P("".concat(p.getAttribute("transform")||""," ").concat(c.getAttribute("originalTransform")||""));c.setAttribute("transform","matrix(".concat(f.join(","),")"));const u=await Promise.all(s.map((t=>j(t).fromElement(t,this.options,this.cssRules).then((t=>(m(t),t.fillRule=t.clipRule,delete t.clipRule,t)))))),g=1===u.length?u[0]:new i(u),d=a(r,g.calcTransformMatrix());g.clipPath&&await this.resolveClipPath(g,p);const{scaleX:v,scaleY:x,angle:b,skewX:w,translateX:y,translateY:R}=o(d);g.set({flipX:!1,flipY:!1}),g.set({scaleX:v,scaleY:x,angle:b,skewX:w,skewY:0}),g.setPositionByOrigin(new l(y,R),h,h),t.clipPath=g}else delete t.clipPath}}export{d as ElementsParser};
 //# sourceMappingURL=elements_parser.min.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"elements_parser.min.mjs","sources":["../../../src/parser/elements_parser.ts"],"sourcesContent":["import { Gradient } from '../gradient/Gradient';\nimport { Group } from '../shapes/Group';\nimport { FabricImage } from '../shapes/Image';\nimport { classRegistry } from '../ClassRegistry';\nimport {\n  invertTransform,\n  multiplyTransformMatrices,\n  qrDecompose,\n} from '../util/misc/matrix';\nimport { removeTransformMatrixForSvgParsing } from '../util/transform_matrix_removal';\nimport type { FabricObject } from '../shapes/Object/FabricObject';\nimport { Point } from '../Point';\nimport { CENTER } from '../constants';\nimport { getGradientDefs } from './getGradientDefs';\nimport { getCSSRules } from './getCSSRules';\nimport type { LoadImageOptions } from '../util';\nimport type { CSSRules, TSvgReviverCallback } from './typedefs';\nimport type { ParsedViewboxTransform } from './applyViewboxTransform';\nimport type { SVGOptions } from '../gradient';\nimport { getTagName } from './getTagName';\nimport { parseTransformAttribute } from './parseTransformAttribute';\n\nconst findTag = (el: Element) =>\n  classRegistry.getSVGClass(getTagName(el).toLowerCase());\n\ntype StorageType = {\n  fill: SVGGradientElement;\n  stroke: SVGGradientElement;\n  clipPath: Element[];\n};\n\ntype NotParsedFabricObject = FabricObject & {\n  fill: string;\n  stroke: string;\n  clipPath?: string;\n  clipRule?: CanvasFillRule;\n};\n\nexport class ElementsParser {\n  declare elements: Element[];\n  declare options: LoadImageOptions & ParsedViewboxTransform;\n  declare reviver?: TSvgReviverCallback;\n  declare regexUrl: RegExp;\n  declare doc: Document;\n  declare clipPaths: Record<string, Element[]>;\n  declare gradientDefs: Record<string, SVGGradientElement>;\n  declare cssRules: CSSRules;\n\n  constructor(\n    elements: Element[],\n    options: LoadImageOptions & ParsedViewboxTransform,\n    reviver: TSvgReviverCallback | undefined,\n    doc: Document,\n    clipPaths: Record<string, Element[]>\n  ) {\n    this.elements = elements;\n    this.options = options;\n    this.reviver = reviver;\n    this.regexUrl = /^url\\(['\"]?#([^'\"]+)['\"]?\\)/g;\n    this.doc = doc;\n    this.clipPaths = clipPaths;\n    this.gradientDefs = getGradientDefs(doc);\n    this.cssRules = getCSSRules(doc);\n  }\n\n  parse(): Promise<Array<FabricObject | null>> {\n    return Promise.all(\n      this.elements.map((element) => this.createObject(element))\n    );\n  }\n\n  async createObject(el: Element): Promise<FabricObject | null> {\n    const klass = findTag(el);\n    if (klass) {\n      const obj: NotParsedFabricObject = await klass.fromElement(\n        el,\n        this.options,\n        this.cssRules\n      );\n      this.resolveGradient(obj, el, 'fill');\n      this.resolveGradient(obj, el, 'stroke');\n      if (obj instanceof FabricImage && obj._originalElement) {\n        removeTransformMatrixForSvgParsing(\n          obj,\n          obj.parsePreserveAspectRatioAttribute()\n        );\n      } else {\n        removeTransformMatrixForSvgParsing(obj);\n      }\n      await this.resolveClipPath(obj, el);\n      this.reviver && this.reviver(el, obj);\n      return obj;\n    }\n    return null;\n  }\n\n  extractPropertyDefinition(\n    obj: NotParsedFabricObject,\n    property: 'fill' | 'stroke' | 'clipPath',\n    storage: Record<string, StorageType[typeof property]>\n  ): StorageType[typeof property] | undefined {\n    const value = obj[property]!,\n      regex = this.regexUrl;\n    if (!regex.test(value)) {\n      return undefined;\n    }\n    // verify: can we remove the 'g' flag? and remove lastIndex changes?\n    regex.lastIndex = 0;\n    // we passed the regex test, so we know is not null;\n    const id = regex.exec(value)![1];\n    regex.lastIndex = 0;\n    // @todo fix this\n    return storage[id];\n  }\n\n  resolveGradient(\n    obj: NotParsedFabricObject,\n    el: Element,\n    property: 'fill' | 'stroke'\n  ) {\n    const gradientDef = this.extractPropertyDefinition(\n      obj,\n      property,\n      this.gradientDefs\n    ) as SVGGradientElement;\n    if (gradientDef) {\n      const opacityAttr = el.getAttribute(property + '-opacity');\n      const gradient = Gradient.fromElement(gradientDef, obj, {\n        ...this.options,\n        opacity: opacityAttr,\n      } as SVGOptions);\n      obj.set(property, gradient);\n    }\n  }\n\n  // TODO: resolveClipPath could be run once per clippath with minor work per object.\n  // is a refactor that i m not sure is worth on this code\n  async resolveClipPath(obj: NotParsedFabricObject, usingElement: Element) {\n    const clipPathElements = this.extractPropertyDefinition(\n      obj,\n      'clipPath',\n      this.clipPaths\n    ) as Element[];\n    if (clipPathElements) {\n      const objTransformInv = invertTransform(obj.calcTransformMatrix());\n      const clipPathTag = clipPathElements[0].parentElement!;\n      let clipPathOwner = usingElement;\n      while (\n        clipPathOwner.parentElement &&\n        clipPathOwner.getAttribute('clip-path') !== obj.clipPath\n      ) {\n        clipPathOwner = clipPathOwner.parentElement;\n      }\n      // move the clipPath tag as sibling to the real element that is using it\n      clipPathOwner.parentElement!.appendChild(clipPathTag!);\n\n      // this multiplication order could be opposite.\n      // but i don't have an svg to test it\n      // at the first SVG that has a transform on both places and is misplaced\n      // try to invert this multiplication order\n      const finalTransform = parseTransformAttribute(\n        `${clipPathOwner.getAttribute('transform') || ''} ${\n          clipPathTag.getAttribute('originalTransform') || ''\n        }`\n      );\n\n      clipPathTag.setAttribute(\n        'transform',\n        `matrix(${finalTransform.join(',')})`\n      );\n\n      const container = await Promise.all(\n        clipPathElements.map((clipPathElement) => {\n          return findTag(clipPathElement)\n            .fromElement(clipPathElement, this.options, this.cssRules)\n            .then((enlivedClippath: NotParsedFabricObject) => {\n              removeTransformMatrixForSvgParsing(enlivedClippath);\n              enlivedClippath.fillRule = enlivedClippath.clipRule!;\n              delete enlivedClippath.clipRule;\n              return enlivedClippath;\n            });\n        })\n      );\n      const clipPath =\n        container.length === 1 ? container[0] : new Group(container);\n      const gTransform = multiplyTransformMatrices(\n        objTransformInv,\n        clipPath.calcTransformMatrix()\n      );\n      if (clipPath.clipPath) {\n        await this.resolveClipPath(clipPath, clipPathOwner);\n      }\n      const { scaleX, scaleY, angle, skewX, translateX, translateY } =\n        qrDecompose(gTransform);\n      clipPath.set({\n        flipX: false,\n        flipY: false,\n      });\n      clipPath.set({\n        scaleX,\n        scaleY,\n        angle,\n        skewX,\n        skewY: 0,\n      });\n      clipPath.setPositionByOrigin(\n        new Point(translateX, translateY),\n        CENTER,\n        CENTER\n      );\n      obj.clipPath = clipPath;\n    } else {\n      // if clip-path does not resolve to any element, delete the property.\n      delete obj.clipPath;\n      return;\n    }\n  }\n}\n"],"names":["findTag","el","classRegistry","getSVGClass","getTagName","toLowerCase","ElementsParser","constructor","elements","options","reviver","doc","clipPaths","this","regexUrl","gradientDefs","getGradientDefs","cssRules","getCSSRules","parse","Promise","all","map","element","createObject","klass","obj","fromElement","resolveGradient","FabricImage","_originalElement","removeTransformMatrixForSvgParsing","parsePreserveAspectRatioAttribute","resolveClipPath","extractPropertyDefinition","property","storage","value","regex","test","lastIndex","id","exec","gradientDef","opacityAttr","getAttribute","gradient","Gradient","_objectSpread","opacity","set","usingElement","clipPathElements","objTransformInv","invertTransform","calcTransformMatrix","clipPathTag","parentElement","clipPathOwner","clipPath","appendChild","finalTransform","parseTransformAttribute","concat","setAttribute","join","container","clipPathElement","then","enlivedClippath","fillRule","clipRule","length","Group","gTransform","multiplyTransformMatrices","scaleX","scaleY","angle","skewX","translateX","translateY","qrDecompose","flipX","flipY","skewY","setPositionByOrigin","Point","CENTER"],"mappings":"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"}
+{"version":3,"file":"elements_parser.min.mjs","sources":["../../../src/parser/elements_parser.ts"],"sourcesContent":["import { Gradient } from '../gradient/Gradient';\nimport { Group } from '../shapes/Group';\nimport { FabricImage } from '../shapes/Image';\nimport { classRegistry } from '../ClassRegistry';\nimport {\n  invertTransform,\n  multiplyTransformMatrices,\n  qrDecompose,\n} from '../util/misc/matrix';\nimport { removeTransformMatrixForSvgParsing } from '../util/transform_matrix_removal';\nimport type { FabricObject } from '../shapes/Object/FabricObject';\nimport { Point } from '../Point';\nimport { CENTER, FILL, STROKE } from '../constants';\nimport { getGradientDefs } from './getGradientDefs';\nimport { getCSSRules } from './getCSSRules';\nimport type { LoadImageOptions } from '../util';\nimport type { CSSRules, TSvgReviverCallback } from './typedefs';\nimport type { ParsedViewboxTransform } from './applyViewboxTransform';\nimport type { SVGOptions } from '../gradient';\nimport { getTagName } from './getTagName';\nimport { parseTransformAttribute } from './parseTransformAttribute';\n\nconst findTag = (el: Element) =>\n  classRegistry.getSVGClass(getTagName(el).toLowerCase());\n\ntype StorageType = {\n  fill: SVGGradientElement;\n  stroke: SVGGradientElement;\n  clipPath: Element[];\n};\n\ntype NotParsedFabricObject = FabricObject & {\n  fill: string;\n  stroke: string;\n  clipPath?: string;\n  clipRule?: CanvasFillRule;\n};\n\nexport class ElementsParser {\n  declare elements: Element[];\n  declare options: LoadImageOptions & ParsedViewboxTransform;\n  declare reviver?: TSvgReviverCallback;\n  declare regexUrl: RegExp;\n  declare doc: Document;\n  declare clipPaths: Record<string, Element[]>;\n  declare gradientDefs: Record<string, SVGGradientElement>;\n  declare cssRules: CSSRules;\n\n  constructor(\n    elements: Element[],\n    options: LoadImageOptions & ParsedViewboxTransform,\n    reviver: TSvgReviverCallback | undefined,\n    doc: Document,\n    clipPaths: Record<string, Element[]>\n  ) {\n    this.elements = elements;\n    this.options = options;\n    this.reviver = reviver;\n    this.regexUrl = /^url\\(['\"]?#([^'\"]+)['\"]?\\)/g;\n    this.doc = doc;\n    this.clipPaths = clipPaths;\n    this.gradientDefs = getGradientDefs(doc);\n    this.cssRules = getCSSRules(doc);\n  }\n\n  parse(): Promise<Array<FabricObject | null>> {\n    return Promise.all(\n      this.elements.map((element) => this.createObject(element))\n    );\n  }\n\n  async createObject(el: Element): Promise<FabricObject | null> {\n    const klass = findTag(el);\n    if (klass) {\n      const obj: NotParsedFabricObject = await klass.fromElement(\n        el,\n        this.options,\n        this.cssRules\n      );\n      this.resolveGradient(obj, el, FILL);\n      this.resolveGradient(obj, el, STROKE);\n      if (obj instanceof FabricImage && obj._originalElement) {\n        removeTransformMatrixForSvgParsing(\n          obj,\n          obj.parsePreserveAspectRatioAttribute()\n        );\n      } else {\n        removeTransformMatrixForSvgParsing(obj);\n      }\n      await this.resolveClipPath(obj, el);\n      this.reviver && this.reviver(el, obj);\n      return obj;\n    }\n    return null;\n  }\n\n  extractPropertyDefinition(\n    obj: NotParsedFabricObject,\n    property: 'fill' | 'stroke' | 'clipPath',\n    storage: Record<string, StorageType[typeof property]>\n  ): StorageType[typeof property] | undefined {\n    const value = obj[property]!,\n      regex = this.regexUrl;\n    if (!regex.test(value)) {\n      return undefined;\n    }\n    // verify: can we remove the 'g' flag? and remove lastIndex changes?\n    regex.lastIndex = 0;\n    // we passed the regex test, so we know is not null;\n    const id = regex.exec(value)![1];\n    regex.lastIndex = 0;\n    // @todo fix this\n    return storage[id];\n  }\n\n  resolveGradient(\n    obj: NotParsedFabricObject,\n    el: Element,\n    property: 'fill' | 'stroke'\n  ) {\n    const gradientDef = this.extractPropertyDefinition(\n      obj,\n      property,\n      this.gradientDefs\n    ) as SVGGradientElement;\n    if (gradientDef) {\n      const opacityAttr = el.getAttribute(property + '-opacity');\n      const gradient = Gradient.fromElement(gradientDef, obj, {\n        ...this.options,\n        opacity: opacityAttr,\n      } as SVGOptions);\n      obj.set(property, gradient);\n    }\n  }\n\n  // TODO: resolveClipPath could be run once per clippath with minor work per object.\n  // is a refactor that i m not sure is worth on this code\n  async resolveClipPath(obj: NotParsedFabricObject, usingElement: Element) {\n    const clipPathElements = this.extractPropertyDefinition(\n      obj,\n      'clipPath',\n      this.clipPaths\n    ) as Element[];\n    if (clipPathElements) {\n      const objTransformInv = invertTransform(obj.calcTransformMatrix());\n      const clipPathTag = clipPathElements[0].parentElement!;\n      let clipPathOwner = usingElement;\n      while (\n        clipPathOwner.parentElement &&\n        clipPathOwner.getAttribute('clip-path') !== obj.clipPath\n      ) {\n        clipPathOwner = clipPathOwner.parentElement;\n      }\n      // move the clipPath tag as sibling to the real element that is using it\n      clipPathOwner.parentElement!.appendChild(clipPathTag!);\n\n      // this multiplication order could be opposite.\n      // but i don't have an svg to test it\n      // at the first SVG that has a transform on both places and is misplaced\n      // try to invert this multiplication order\n      const finalTransform = parseTransformAttribute(\n        `${clipPathOwner.getAttribute('transform') || ''} ${\n          clipPathTag.getAttribute('originalTransform') || ''\n        }`\n      );\n\n      clipPathTag.setAttribute(\n        'transform',\n        `matrix(${finalTransform.join(',')})`\n      );\n\n      const container = await Promise.all(\n        clipPathElements.map((clipPathElement) => {\n          return findTag(clipPathElement)\n            .fromElement(clipPathElement, this.options, this.cssRules)\n            .then((enlivedClippath: NotParsedFabricObject) => {\n              removeTransformMatrixForSvgParsing(enlivedClippath);\n              enlivedClippath.fillRule = enlivedClippath.clipRule!;\n              delete enlivedClippath.clipRule;\n              return enlivedClippath;\n            });\n        })\n      );\n      const clipPath =\n        container.length === 1 ? container[0] : new Group(container);\n      const gTransform = multiplyTransformMatrices(\n        objTransformInv,\n        clipPath.calcTransformMatrix()\n      );\n      if (clipPath.clipPath) {\n        await this.resolveClipPath(clipPath, clipPathOwner);\n      }\n      const { scaleX, scaleY, angle, skewX, translateX, translateY } =\n        qrDecompose(gTransform);\n      clipPath.set({\n        flipX: false,\n        flipY: false,\n      });\n      clipPath.set({\n        scaleX,\n        scaleY,\n        angle,\n        skewX,\n        skewY: 0,\n      });\n      clipPath.setPositionByOrigin(\n        new Point(translateX, translateY),\n        CENTER,\n        CENTER\n      );\n      obj.clipPath = clipPath;\n    } else {\n      // if clip-path does not resolve to any element, delete the property.\n      delete obj.clipPath;\n      return;\n    }\n  }\n}\n"],"names":["findTag","el","classRegistry","getSVGClass","getTagName","toLowerCase","ElementsParser","constructor","elements","options","reviver","doc","clipPaths","this","regexUrl","gradientDefs","getGradientDefs","cssRules","getCSSRules","parse","Promise","all","map","element","createObject","klass","obj","fromElement","resolveGradient","FILL","STROKE","FabricImage","_originalElement","removeTransformMatrixForSvgParsing","parsePreserveAspectRatioAttribute","resolveClipPath","extractPropertyDefinition","property","storage","value","regex","test","lastIndex","id","exec","gradientDef","opacityAttr","getAttribute","gradient","Gradient","_objectSpread","opacity","set","usingElement","clipPathElements","objTransformInv","invertTransform","calcTransformMatrix","clipPathTag","parentElement","clipPathOwner","clipPath","appendChild","finalTransform","parseTransformAttribute","concat","setAttribute","join","container","clipPathElement","then","enlivedClippath","fillRule","clipRule","length","Group","gTransform","multiplyTransformMatrices","scaleX","scaleY","angle","skewX","translateX","translateY","qrDecompose","flipX","flipY","skewY","setPositionByOrigin","Point","CENTER"],"mappings":"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"}

package/dist/src/parser/elements_parser.mjs

@@ -6,7 +6,7 @@ import { classRegistry } from '../ClassRegistry.mjs';
 import { invertTransform, multiplyTransformMatrices, qrDecompose } from '../util/misc/matrix.mjs';
 import { removeTransformMatrixForSvgParsing } from '../util/transform_matrix_removal.mjs';
 import { Point } from '../Point.mjs';
-import { CENTER } from '../constants.mjs';
+import { FILL, STROKE, CENTER } from '../constants.mjs';
 import { getGradientDefs } from './getGradientDefs.mjs';
 import { getCSSRules } from './getCSSRules.mjs';
 import { getTagName } from './getTagName.mjs';
@@ -31,8 +31,8 @@ class ElementsParser {
     const klass = findTag(el);
     if (klass) {
       const obj = await klass.fromElement(el, this.options, this.cssRules);
-      this.resolveGradient(obj, el, 'fill');
-      this.resolveGradient(obj, el, 'stroke');
+      this.resolveGradient(obj, el, FILL);
+      this.resolveGradient(obj, el, STROKE);
       if (obj instanceof FabricImage && obj._originalElement) {
         removeTransformMatrixForSvgParsing(obj, obj.parsePreserveAspectRatioAttribute());
       } else {