@leafer-in/editor 1.0.0-rc.19 → 1.0.0-rc.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import { PathCommandMap, Leaf, Path, Line, Polygon, MatrixHelper, Group, Box } from '@leafer-ui/draw';
2
- import { Event, defineKey, MatrixHelper as MatrixHelper$1, UI, Paint, Group as Group$1, Rect, Answer, Bounds, LeafList, PointerEvent, DragEvent, MoveEvent, ZoomEvent, PointHelper, AroundHelper, Box as Box$1, getPointData, Line as Line$1, Matrix, DataHelper, RotateEvent, MathHelper, RenderEvent, KeyEvent, Creator } from '@leafer-ui/core';
2
+ import { Event, defineKey, MatrixHelper as MatrixHelper$1, UI, Paint, Group as Group$1, Rect, Answer, Bounds, LeafList, PointerEvent, DragEvent, MoveEvent, ZoomEvent, PointHelper, AroundHelper, MathHelper, Box as Box$1, getPointData, Line as Line$1, Matrix, DataHelper, RotateEvent, RenderEvent, KeyEvent, Creator } from '@leafer-ui/core';
3
3
 
4
4
  const { M, L, C, Q, Z, N, D, X, G, F, O, P, U } = PathCommandMap;
5
5
  const PathScaler = {
@@ -178,7 +178,12 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
178
178
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
179
179
  };
180
180
 
181
+ function toList(value) {
182
+ return value ? (value instanceof Array ? value : [value]) : [];
183
+ }
181
184
  class EditorEvent extends Event {
185
+ get list() { return toList(this.value); }
186
+ get oldList() { return toList(this.oldValue); }
182
187
  constructor(type, data) {
183
188
  super(type);
184
189
  if (data)
@@ -385,45 +390,60 @@ class EditSelect extends Group$1 {
385
390
  this.targetStroker.forceUpdate();
386
391
  }
387
392
  onPointerMove(e) {
388
- if (this.running && !this.isMoveMode) {
393
+ const { app, editor } = this;
394
+ if (this.running && !this.isMoveMode && app.config.pointer.hover && !app.interaction.dragging) {
389
395
  const find = e.shiftKey ? this.findDeepOne(e) : findOne(e.path);
390
- this.editor.hoverTarget = this.editor.hasItem(find) ? null : find;
396
+ editor.hoverTarget = editor.hasItem(find) ? null : find;
391
397
  }
392
398
  if (this.isMoveMode) {
393
- this.editor.hoverTarget = null;
399
+ editor.hoverTarget = null;
394
400
  }
395
401
  }
396
402
  onBeforeDown(e) {
403
+ const { select } = this.editor.config;
404
+ if (select === 'press')
405
+ this.checkAndSelect(e, true);
406
+ }
407
+ onTap(e) {
408
+ const { editor } = this;
409
+ const { select, continuousSelect } = editor.config;
410
+ if (select === 'tap')
411
+ this.checkAndSelect(e);
412
+ if (this.running && (e.shiftKey || continuousSelect) && !e.middle && !this.lastDownLeaf) {
413
+ const find = this.findDeepOne(e);
414
+ if (find)
415
+ editor.shiftItem(find);
416
+ else if (!e.shiftKey && continuousSelect)
417
+ editor.target = null;
418
+ }
419
+ else if (this.isMoveMode) {
420
+ editor.target = null;
421
+ }
422
+ this.lastDownLeaf = null;
423
+ }
424
+ checkAndSelect(e, isDownType) {
397
425
  if (this.running && !this.isMoveMode && !e.middle) {
426
+ const { editor } = this;
398
427
  const find = this.lastDownLeaf = findOne(e.path);
399
428
  if (find) {
400
- if (e.shiftKey) {
401
- this.editor.shiftItem(find);
429
+ if (e.shiftKey || editor.config.continuousSelect) {
430
+ editor.shiftItem(find);
402
431
  }
403
432
  else {
404
- this.editor.target = find;
433
+ editor.target = find;
434
+ }
435
+ if (isDownType) {
436
+ editor.updateLayout();
437
+ if (!find.locked)
438
+ this.app.interaction.updateDownData(e, { findList: [editor.editBox.rect] }, editor.config.dualEvent);
405
439
  }
406
- this.editor.updateLayout();
407
- if (!find.locked)
408
- this.app.interaction.updateDownData(e, { findList: [this.editor.editBox.rect] }, this.editor.config.dualEvent);
409
440
  }
410
441
  else if (this.allow(e.target)) {
411
442
  if (!e.shiftKey)
412
- this.editor.target = null;
443
+ editor.target = null;
413
444
  }
414
445
  }
415
446
  }
416
- onTap(e) {
417
- if (this.running && e.shiftKey && !e.middle && !this.lastDownLeaf) {
418
- const find = this.findDeepOne(e);
419
- if (find)
420
- this.editor.shiftItem(find);
421
- }
422
- else if (this.isMoveMode) {
423
- this.editor.target = null;
424
- }
425
- this.lastDownLeaf = null;
426
- }
427
447
  onDragStart(e) {
428
448
  if (this.running && this.allowDrag(e)) {
429
449
  const { editor } = this;
@@ -589,10 +609,13 @@ const EditDataHelper = {
589
609
  origin = { x: 1, y: 0 };
590
610
  }
591
611
  if (lockRatio) {
592
- if (scaleX !== 1)
593
- scaleY = scaleX;
594
- else
595
- scaleX = scaleY;
612
+ const unlockSide = lockRatio === 'corner' && direction % 2;
613
+ if (!unlockSide) {
614
+ if (scaleY !== 1)
615
+ scaleX = scaleY;
616
+ else
617
+ scaleY = scaleX;
618
+ }
596
619
  }
597
620
  toPoint(around || origin, bounds, origin);
598
621
  return { origin, scaleX, scaleY, direction, lockRatio, around };
@@ -708,10 +731,13 @@ const EditDataHelper = {
708
731
  }
709
732
  };
710
733
 
734
+ const cacheCursors = {};
711
735
  function updateCursor(editor, e) {
712
736
  const { editBox } = editor, point = editBox.enterPoint;
713
737
  if (!point || !editor.hasTarget || !editBox.visible)
714
738
  return;
739
+ if (point.name === 'circle')
740
+ return;
715
741
  let { rotation } = editBox;
716
742
  const { resizeCursor, rotateCursor, skewCursor, resizeable, rotateable, skewable } = editor.config;
717
743
  const { pointType } = point, { flippedX, flippedY } = editBox;
@@ -721,8 +747,15 @@ function updateCursor(editor, e) {
721
747
  const showSkew = skewable && !showResize && point.name === 'resize-line';
722
748
  const cursor = showSkew ? skewCursor : (showResize ? resizeCursor : rotateCursor);
723
749
  rotation += (EditDataHelper.getFlipDirection(point.direction, flippedX, flippedY) + 1) * 45;
750
+ rotation = Math.round(MathHelper.formatRotation(rotation, true) / 2) * 2;
724
751
  const { url, x, y } = cursor;
725
- point.cursor = { url: toDataURL(url, rotation), x, y };
752
+ const key = url + rotation;
753
+ if (cacheCursors[key]) {
754
+ point.cursor = cacheCursors[key];
755
+ }
756
+ else {
757
+ cacheCursors[key] = point.cursor = { url: toDataURL(url, rotation), x, y };
758
+ }
726
759
  }
727
760
  function updateMoveCursor(editor) {
728
761
  editor.editBox.rect.cursor = editor.config.moveCursor;
@@ -779,10 +812,11 @@ class EditBox extends Group$1 {
779
812
  const { config, list } = this.editor;
780
813
  const { width, height } = bounds;
781
814
  const { rect, circle, resizePoints, rotatePoints, resizeLines } = this;
782
- const { middlePoint, resizeable, rotateable, stroke, strokeWidth } = config;
815
+ const { middlePoint, resizeable, rotateable, stroke, strokeWidth, hideOnSmall } = config;
783
816
  const pointsStyle = this.getPointsStyle();
784
817
  const middlePointsStyle = this.getMiddlePointsStyle();
785
- const showPoints = width > 20 || height > 20;
818
+ const smallSize = typeof hideOnSmall === 'number' ? hideOnSmall : 10;
819
+ const showPoints = !(hideOnSmall && width < smallSize && height < smallSize);
786
820
  this.visible = list[0] && !list[0].locked;
787
821
  let point = {}, style, rotateP, resizeP, resizeL;
788
822
  for (let i = 0; i < 8; i++) {
@@ -792,7 +826,7 @@ class EditBox extends Group$1 {
792
826
  resizeP.set(style);
793
827
  resizeP.set(point), rotateP.set(point), resizeL.set(point);
794
828
  resizeP.visible = resizeL.visible = showPoints && (resizeable || rotateable);
795
- rotateP.visible = showPoints && rotateable && resizeable;
829
+ rotateP.visible = showPoints && rotateable && resizeable && !config.rotatePoint;
796
830
  if (i % 2) {
797
831
  resizeP.visible = rotateP.visible = showPoints && !!middlePoint;
798
832
  if (((i + 1) / 2) % 2) {
@@ -880,11 +914,11 @@ class EditBox extends Group$1 {
880
914
  if (point.pointType === 'rotate' || e.metaKey || e.ctrlKey || !editor.config.resizeable) {
881
915
  if (editor.config.rotateable)
882
916
  editor.onRotate(e);
883
- updateCursor(editor, e);
884
917
  }
885
918
  else {
886
919
  editor.onScale(e);
887
920
  }
921
+ updateCursor(editor, e);
888
922
  }
889
923
  onArrow(e) {
890
924
  if (this.editor.hasTarget && this.editor.config.keyEvent) {
@@ -1006,12 +1040,14 @@ const config = {
1006
1040
  rotateGap: 45,
1007
1041
  buttonsDirection: 'bottom',
1008
1042
  buttonsMargin: 12,
1043
+ hideOnSmall: true,
1009
1044
  moveCursor: 'move',
1010
1045
  resizeCursor: { url: resizeSVG, x: 12, y: 12 },
1011
1046
  rotateCursor: { url: rotateSVG, x: 12, y: 12 },
1012
1047
  skewCursor: { url: skewSVG, x: 12, y: 12 },
1013
1048
  selector: true,
1014
1049
  hover: true,
1050
+ select: 'press',
1015
1051
  boxSelect: true,
1016
1052
  moveable: true,
1017
1053
  resizeable: true,
@@ -1307,7 +1343,12 @@ class Editor extends Group$1 {
1307
1343
  }
1308
1344
  onMove(e) {
1309
1345
  const move = e.getLocalMove(this.element);
1310
- if (e.shiftKey) {
1346
+ const { lockMove } = this.config;
1347
+ if (lockMove === 'x')
1348
+ move.y = 0;
1349
+ else if (lockMove === 'y')
1350
+ move.x = 0;
1351
+ else if (e.shiftKey) {
1311
1352
  if (Math.abs(move.x) > Math.abs(move.y))
1312
1353
  move.y = 0;
1313
1354
  else
@@ -1 +1 @@
1
- import{PathCommandMap as t,Leaf as e,Path as i,Line as s,Polygon as o,MatrixHelper as n,Group as r,Box as a}from"@leafer-ui/draw";import{Event as h,defineKey as l,MatrixHelper as c,UI as d,Paint as g,Group as u,Rect as f,Answer as p,Bounds as y,LeafList as w,PointerEvent as L,DragEvent as v,MoveEvent as _,ZoomEvent as k,PointHelper as b,AroundHelper as m,Box as x,getPointData as M,Line as E,Matrix as V,DataHelper as S,RotateEvent as H,MathHelper as T,RenderEvent as O,KeyEvent as P,Creator as D}from"@leafer-ui/core";const{M:R,L:Z,C:A,Q:B,Z:z,N:W,D:I,X:X,G:Y,F:C,O:F,P:K,U:U}=t,j={scale(t,e,i){if(!t)return;let s,o=0,n=t.length;for(;o<n;)switch(s=t[o],s){case R:case Z:G(t,e,i,o,1),o+=3;break;case A:G(t,e,i,o,3),o+=7;break;case B:G(t,e,i,o,2),o+=5;break;case z:o+=1;break;case W:G(t,e,i,o,2),o+=5;break;case I:G(t,e,i,o,2),o+=9;break;case X:G(t,e,i,o,2),o+=6;break;case Y:G(t,e,i,o,2),o+=9;break;case C:G(t,e,i,o,2),o+=5;break;case F:t[o]=Y,t.splice(o+4,0,t[o+3],0),G(t,e,i,o,2),o+=9,n+=2;break;case K:t[o]=C,t.splice(o+4,0,t[o+3]),G(t,e,i,o,2),o+=5,n+=1;break;case U:G(t,e,i,o,2),o+=6}},scalePoints(t,e,i,s,o){for(let n=o?s+1:0,r=o?n+2*o:t.length;n<r;n+=2)t[n]*=e,t[n+1]*=i}},{scalePoints:G}=j;function N(t,e,i){1!==e&&(t.width*=e),1!==i&&(t.height*=i)}e.prototype.scaleResize=function(t,e=t,i){const s=this;i?(s.scaleX*=t,s.scaleY*=e):(t<0&&(s.scaleX*=-1,t=-t),e<0&&(s.scaleY*=-1,e=-e),this.__scaleResize(t,e))},e.prototype.__scaleResize=function(t,e){N(this,t,e)},i.prototype.__scaleResize=function(t,e){j.scale(this.__.path,t,e),this.path=this.__.path},s.prototype.__scaleResize=function(t,e){if(this.points)j.scalePoints(this.__.points,t,e),this.points=this.__.points;else{const i=this.toPoint;i.x*=t,i.y*=e,this.toPoint=i}},o.prototype.__scaleResize=function(t,e){this.points?(j.scalePoints(this.__.points,t,e),this.points=this.__.points):N(this,t,e)};const $=n.get();function Q(t,e,i){const{children:s}=t;for(let t=0;t<s.length;t++)$.a=e,$.d=i,s[t].transform($,!0)}function q(t,e,i,s){var o,n=arguments.length,r=n<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,i,s);else for(var a=t.length-1;a>=0;a--)(o=t[a])&&(r=(n<3?o(r):n>3?o(e,i,r):o(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r}r.prototype.__scaleResize=function(t,e){Q(this,t,e)},a.prototype.__scaleResize=function(t,e){this.__.__autoSize&&this.children.length?Q(this,t,e):N(this,t,e)},"function"==typeof SuppressedError&&SuppressedError;class J extends h{constructor(t,e){super(t),e&&Object.assign(this,e)}}J.SELECT="editor.select",J.HOVER="editor.hover";class tt extends J{constructor(t,e){super(t,e)}}tt.MOVE="editor.move";class et extends J{constructor(t,e){super(t,e)}}et.SCALE="editor.scale";class it extends J{constructor(t,e){super(t,e)}}it.ROTATE="editor.rotate";class st extends J{constructor(t,e){super(t,e)}}function ot(t){return(e,i)=>{const s="_"+i;l(e,i,{get(){return this[s]},set(e){const i=this[s];i!==e&&(this[s]=e,t(this,i))}})}}st.SKEW="editor.skew";const nt=c.get(),{abs:rt}=Math,{copy:at,scale:ht}=c;class lt extends d{constructor(){super(),this.list=[],this.hittable=!1,this.strokeAlign="center"}setTarget(t,e){const{stroke:i,strokeWidth:s}=e;this.set({stroke:i,strokeWidth:s}),this.target=t}__draw(t,e){const{list:i}=this;if(i.length){let s;const{stroke:o,strokeWidth:n}=this.__,{bounds:r}=e;for(let a=0;a<i.length;a++)if(s=i[a],r&&r.hit(s.__world,e.matrix)){let i;if("scale"===s.__.editSize){const o=rt(s.__world.scaleX),r=rt(s.__world.scaleY);if(o!==r){at(nt,s.__world),ht(nt,1/o,1/r),t.setWorld(nt,e.matrix),t.beginPath(),this.__.strokeWidth=n;const{x:a,y:h,width:l,height:c}=s.__layout.boxBounds;t.rect(a*o,h*r,l*o,c*r),i=!0}}i||(t.setWorld(s.__world,e.matrix),t.beginPath(),s.__.__useArrow?s.__drawPath(t):s.__.__pathForRender?s.__drawRenderPath(t):s.__drawPathByBox(t),this.__.strokeWidth=n/rt(s.__world.scaleX)),"string"==typeof o?g.stroke(o,this,t):g.strokes(o,this,t)}this.__.strokeWidth=n}}destroy(){this.target=null,super.destroy()}}q([ot((function(t){const e=t.target;t.list=e?e instanceof Array?e:[e]:[],t.forceUpdate()}))],lt.prototype,"target",void 0);class ct extends u{constructor(t){super(t),this.strokeArea=new f({strokeAlign:"center"}),this.fillArea=new f,this.visible=this.hittable=!1,this.addMany(this.fillArea,this.strokeArea)}setStyle(t,e){const{visible:i,stroke:s,strokeWidth:o}=t;this.visible=i,this.strokeArea.reset(Object.assign({stroke:s,strokeWidth:o},e||{})),this.fillArea.reset({visible:!e,fill:s,opacity:.2})}setBounds(t){this.strokeArea.set(t),this.fillArea.set(t)}}const{No:dt,Yes:gt,NoAndSkip:ut,YesAndSkip:ft}=p,pt={findOne:t=>t.list.find((t=>t.editable)),findBounds(t,e){if(t.__.hittable&&t.__.visible&&!t.__.locked&&e.hit(t.__world)){if(t.__.editable){if(t.isBranch&&!t.__.hitChildren)return t.__.hitSelf?ft:ut;if(t.isFrame)return e.includes(t.__layout.boxBounds,t.__world)?ft:dt;if(e.hit(t.__layout.boxBounds,t.__world)&&t.__.hitSelf)return gt}return dt}return t.isBranch?ut:dt}},{findOne:yt}=pt;class wt extends u{get dragging(){return!!this.originList}get running(){return this.editor.hittable&&this.editor.config.selector}get isMoveMode(){return this.app&&this.app.interaction.moveMode}constructor(t){super(),this.hoverStroker=new lt,this.targetStroker=new lt,this.bounds=new y,this.selectArea=new ct,this.__eventIds=[],this.editor=t,this.addMany(this.targetStroker,this.hoverStroker,this.selectArea),this.__listenEvents()}onHover(){const{editor:t}=this;if(!this.running||this.dragging||t.dragging)this.hoverStroker.target=null;else{const{stroke:e,strokeWidth:i,hover:s}=t.config;this.hoverStroker.setTarget(s?this.editor.hoverTarget:null,{stroke:e,strokeWidth:i})}}onSelect(){if(this.running){const{config:t,list:e}=this.editor,{stroke:i,strokeWidth:s}=t;this.targetStroker.setTarget(e,{stroke:i,strokeWidth:Math.max(1,s/2)}),this.hoverStroker.target=null}}update(){this.running&&this.targetStroker.forceUpdate()}onPointerMove(t){if(this.running&&!this.isMoveMode){const e=t.shiftKey?this.findDeepOne(t):yt(t.path);this.editor.hoverTarget=this.editor.hasItem(e)?null:e}this.isMoveMode&&(this.editor.hoverTarget=null)}onBeforeDown(t){if(this.running&&!this.isMoveMode&&!t.middle){const e=this.lastDownLeaf=yt(t.path);e?(t.shiftKey?this.editor.shiftItem(e):this.editor.target=e,this.editor.updateLayout(),e.locked||this.app.interaction.updateDownData(t,{findList:[this.editor.editBox.rect]},this.editor.config.dualEvent)):this.allow(t.target)&&(t.shiftKey||(this.editor.target=null))}}onTap(t){if(this.running&&t.shiftKey&&!t.middle&&!this.lastDownLeaf){const e=this.findDeepOne(t);e&&this.editor.shiftItem(e)}else this.isMoveMode&&(this.editor.target=null);this.lastDownLeaf=null}onDragStart(t){if(this.running&&this.allowDrag(t)){const{editor:e}=this,{stroke:i,strokeWidth:s,area:o}=e.config,{x:n,y:r}=t.getInner(this);this.bounds.set(n,r),this.selectArea.setStyle({visible:!0,stroke:i,strokeWidth:s,x:n,y:r},o),this.selectArea.setBounds(this.bounds.get()),this.originList=e.leafList.clone()}}onDrag(t){if(this.editor.dragging)this.onDragEnd();else if(this.dragging){const{editor:e}=this,i=t.getInnerTotal(this),s=this.bounds.clone().unsign(),o=new w(e.app.find(pt.findBounds,s));if(this.bounds.width=i.x,this.bounds.height=i.y,this.selectArea.setBounds(s.get()),o.length){const t=[];this.originList.forEach((e=>{o.has(e)||t.push(e)})),o.forEach((e=>{this.originList.has(e)||t.push(e)})),(t.length!==e.list.length||e.list.some(((e,i)=>e!==t[i])))&&(e.target=t)}else e.target=this.originList.list}}onDragEnd(){this.dragging&&(this.originList=null,this.selectArea.visible=!1)}onAutoMove(t){if(this.dragging){const{x:e,y:i}=t.getLocalMove(this);this.bounds.x+=e,this.bounds.y+=i}}allow(t){return t.leafer!==this.editor.leafer}allowDrag(t){return!(!this.editor.config.boxSelect||t.target.draggable)&&(!this.editor.hasTarget&&this.allow(t.target)||t.shiftKey&&!yt(t.path))}findDeepOne(t){const e={exclude:new w(this.editor.editBox.rect)};return yt(t.target.leafer.interaction.findPath(t,e))}__listenEvents(){const{editor:t}=this;t.waitLeafer((()=>{const{app:e}=t;e.selector.proxy=t,this.__eventIds=[t.on_(J.HOVER,this.onHover,this),t.on_(J.SELECT,this.onSelect,this),e.on_(L.MOVE,this.onPointerMove,this),e.on_(L.BEFORE_DOWN,this.onBeforeDown,this),e.on_(L.TAP,this.onTap,this),e.on_(v.START,this.onDragStart,this),e.on_(v.DRAG,this.onDrag,this),e.on_(v.END,this.onDragEnd,this),e.on_(_.MOVE,this.onAutoMove,this),e.on_([k.ZOOM,_.MOVE],(()=>{this.editor.hoverTarget=null}))]}))}__removeListenEvents(){this.__eventIds&&(this.off_(this.__eventIds),this.__eventIds.length=0)}destroy(){this.editor=this.originList=this.lastDownLeaf=null,this.__removeListenEvents(),super.destroy()}}var Lt;!function(t){t[t.topLeft=0]="topLeft",t[t.top=1]="top",t[t.topRight=2]="topRight",t[t.right=3]="right",t[t.bottomRight=4]="bottomRight",t[t.bottom=5]="bottom",t[t.bottomLeft=6]="bottomLeft",t[t.left=7]="left"}(Lt||(Lt={}));const{topLeft:vt,top:_t,topRight:kt,right:bt,bottomRight:mt,bottom:xt,bottomLeft:Mt,left:Et}=Lt,{toPoint:Vt}=m,St={getScaleData(t,e,i,s,o){let n,r=1,a=1;const{width:h,height:l}=t;o&&(i.x*=2,i.y*=2),Math.abs(i.x)===h&&(i.x+=.1),Math.abs(i.y)===l&&(i.y+=.1);const c=(-i.y+l)/l,d=(i.x+h)/h,g=(i.y+l)/l,u=(-i.x+h)/h;switch(e){case _t:a=c,n={x:.5,y:1};break;case bt:r=d,n={x:0,y:.5};break;case xt:a=g,n={x:.5,y:0};break;case Et:r=u,n={x:1,y:.5};break;case vt:a=c,r=u,n={x:1,y:1};break;case kt:a=c,r=d,n={x:0,y:1};break;case mt:a=g,r=d,n={x:0,y:0};break;case Mt:a=g,r=u,n={x:1,y:0}}return s&&(1!==r?a=r:r=a),Vt(o||n,t,n),{origin:n,scaleX:r,scaleY:a,direction:e,lockRatio:s,around:o}},getRotateData(t,e,i,s,o){let n;switch(e){case vt:n={x:1,y:1};break;case kt:n={x:0,y:1};break;case mt:n={x:0,y:0};break;case Mt:n={x:1,y:0};break;default:n={x:.5,y:.5}}return Vt(o||n,t,n),{origin:n,rotation:b.getRotation(s,n,i)}},getSkewData(t,e,i,s){let o,n,r=0,a=0;switch(e){case _t:n={x:.5,y:0},o={x:.5,y:1},r=1;break;case xt:n={x:.5,y:1},o={x:.5,y:0},r=1;break;case Et:n={x:0,y:.5},o={x:1,y:.5},a=1;break;case bt:n={x:1,y:.5},o={x:0,y:.5},a=1}const{x:h,y:l,width:c,height:d}=t;n.x=h+n.x*c,n.y=l+n.y*d,Vt(s||o,t,o);const g=b.getRotation(n,o,{x:n.x+(r?i.x:0),y:n.y+(a?i.y:0)});return r?r=-g:a=g,{origin:o,skewX:r,skewY:a}},getAround:(t,e)=>e&&!t?"center":t,getRotateDirection:(t,e,i=8)=>((t=(t+Math.round(e/(360/i)))%i)<0&&(t+=i),t),getFlipDirection(t,e,i){if(e)switch(t){case Et:t=bt;break;case vt:t=kt;break;case Mt:t=mt;break;case bt:t=Et;break;case kt:t=vt;break;case mt:t=Mt}if(i)switch(t){case _t:t=xt;break;case vt:t=Mt;break;case kt:t=mt;break;case xt:t=_t;break;case Mt:t=vt;break;case mt:t=kt}return t}};function Ht(t,e){const{editBox:i}=t,s=i.enterPoint;if(!s||!t.hasTarget||!i.visible)return;let{rotation:o}=i;const{resizeCursor:n,rotateCursor:r,skewCursor:a,resizeable:h,rotateable:l,skewable:c}=t.config,{pointType:d}=s,{flippedX:g,flippedY:u}=i;let f="resize"===d;f&&l&&(e.metaKey||e.ctrlKey||!h)&&(f=!1);const p=c&&!f&&"resize-line"===s.name?a:f?n:r;o+=45*(St.getFlipDirection(s.direction,g,u)+1);const{url:y,x:w,y:L}=p;s.cursor={url:Ot(y,o),x:w,y:L}}function Tt(t){t.editBox.rect.cursor=t.config.moveCursor}function Ot(t,e){return'"data:image/svg+xml,'+encodeURIComponent(t.replace("{{rotation}}",e.toString()))+'"'}class Pt extends x{}const Dt=["top","right","bottom","left"];class Rt extends u{get flipped(){return this.flippedX||this.flippedY}get flippedX(){return this.scaleX<0}get flippedY(){return this.scaleY<0}get flippedOne(){return this.scaleX*this.scaleY<0}constructor(t){super(),this.rect=new x({name:"rect",hitFill:"all",hitStroke:"none",strokeAlign:"center",hitRadius:5}),this.circle=new Pt({name:"circle",strokeAlign:"center",around:"center",cursor:"crosshair",hitRadius:5}),this.buttons=new u({around:"center",hitSelf:!1}),this.resizePoints=[],this.rotatePoints=[],this.resizeLines=[],this.__eventIds=[],this.editor=t,this.visible=!1,this.create(),this.__listenEvents()}create(){let t,e,i;const{resizePoints:s,rotatePoints:o,resizeLines:n,rect:r,circle:a,buttons:h}=this,l=[{x:1,y:1},{x:.5,y:1},{x:0,y:1},{x:0,y:.5},{x:0,y:0},{x:.5,y:0},{x:1,y:0},{x:1,y:.5}];for(let r=0;r<8;r++)t=new Pt({name:"rotate-point",around:l[r],width:15,height:15,hitFill:"all"}),o.push(t),this.listenPointEvents(t,"rotate",r),r%2&&(e=new Pt({name:"resize-line",around:"center",width:10,height:10,hitFill:"all"}),n.push(e),this.listenPointEvents(e,"resize",r)),i=new Pt({name:"resize-point",around:"center",strokeAlign:"center",hitRadius:5}),s.push(i),this.listenPointEvents(i,"resize",r);h.add(a),this.listenPointEvents(a,"rotate",2),this.addMany(...o,r,h,...n,...s)}update(t){const{config:e,list:i}=this.editor,{width:s,height:o}=t,{rect:n,circle:r,resizePoints:a,rotatePoints:h,resizeLines:l}=this,{middlePoint:c,resizeable:d,rotateable:g,stroke:u,strokeWidth:f}=e,p=this.getPointsStyle(),y=this.getMiddlePointsStyle(),w=s>20||o>20;this.visible=i[0]&&!i[0].locked;let L,v,_,k,b={};for(let e=0;e<8;e++)m.toPoint(m.directionData[e],t,b),L=this.getPointStyle(e%2?y[(e-1)/2%y.length]:p[e/2%p.length]),_=a[e],v=h[e],k=l[Math.floor(e/2)],_.set(L),_.set(b),v.set(b),k.set(b),_.visible=k.visible=w&&(d||g),v.visible=w&&g&&d,e%2?(_.visible=v.visible=w&&!!c,(e+1)/2%2?(k.width=s,_.width>s-30&&(_.visible=!1)):(k.height=o,_.rotation=90,_.width>o-30&&(_.visible=!1))):_.rotation=e/2*90;r.visible=w&&g&&!!e.rotatePoint,r.set(this.getPointStyle(e.rotatePoint||p[0])),n.set(Object.assign({stroke:u,strokeWidth:f},e.rect||{})),n.set(Object.assign(Object.assign({},t),{visible:!0})),n.hittable=e.moveable,this.buttons.visible=w,this.layoutButtons()}layoutButtons(){const{buttons:t,resizePoints:e}=this,{buttonsDirection:i,buttonsFixed:s,buttonsMargin:o,middlePoint:n}=this.editor.config,{flippedX:r,flippedY:a}=this;let h=Dt.indexOf(i);(h%2&&r||(h+1)%2&&a)&&s&&(h=(h+2)%4);const l=s?St.getRotateDirection(h,this.flippedOne?this.rotation:-this.rotation,4):h,c=e[2*l+1],d=l%2,g=l&&3!==l?1:-1,u=(o+(h%2?(n?c.width:0)+t.boxBounds.width:(n?c.height:0)+t.boxBounds.height)/2)*g;d?(t.x=c.x+u,t.y=c.y):(t.x=c.x,t.y=c.y+u),s&&(t.rotation=90*(l-h),t.scaleX=r?-1:1,t.scaleY=a?-1:1)}getPointStyle(t){const{stroke:e,strokeWidth:i,pointFill:s,pointSize:o,pointRadius:n}=this.editor.config,r={fill:s,stroke:e,strokeWidth:i,width:o,height:o,cornerRadius:n};return t?Object.assign(r,t):r}getPointsStyle(){const{point:t}=this.editor.config;return t instanceof Array?t:[t]}getMiddlePointsStyle(){const{middlePoint:t}=this.editor.config;return t instanceof Array?t:t?[t]:this.getPointsStyle()}onDragStart(t){this.dragging=!0,"rect"===t.target.name&&(this.moving=!0,this.editor.opacity=this.editor.config.hideOnMove?0:1)}onDragEnd(t){this.dragging=!1,this.moving=!1,"rect"===t.target.name&&(this.editor.opacity=1)}onDrag(t){const{editor:e}=this;"rotate"===(this.enterPoint=t.current).pointType||t.metaKey||t.ctrlKey||!e.config.resizeable?(e.config.rotateable&&e.onRotate(t),Ht(e,t)):e.onScale(t)}onArrow(t){if(this.editor.hasTarget&&this.editor.config.keyEvent){const e={x:0,y:0},i=t.shiftKey?10:1;switch(t.code){case"ArrowDown":e.y=i;break;case"ArrowUp":e.y=-i;break;case"ArrowLeft":e.x=-i;break;case"ArrowRight":e.x=i}(e.x||e.y)&&this.editor.move(e.x,e.y)}}onDoubleClick(){const{editor:t}=this;t.single&&t.element.isBranch}listenPointEvents(t,e,i){const{editor:s}=this;t.direction=i,t.pointType=e,t.on_(v.START,this.onDragStart,this),t.on_(v.DRAG,this.onDrag,this),t.on_(v.END,this.onDragEnd,this),t.on_(L.LEAVE,(()=>this.enterPoint=null)),"circle"!==t.name&&t.on_(L.ENTER,(e=>{this.enterPoint=t,Ht(s,e)}))}__listenEvents(){const{rect:t,editor:e}=this;this.__eventIds=[e.on_(J.SELECT,(()=>{this.visible=e.hasTarget})),t.on_(v.START,this.onDragStart,this),t.on_(v.DRAG,e.onMove,e),t.on_(v.END,this.onDragEnd,this),t.on_(L.ENTER,(()=>Tt(e))),t.on_(L.DOUBLE_CLICK,this.onDoubleClick,this)]}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(){this.editor=null,this.__removeListenEvents(),super.destroy()}}const Zt='\n<feOffset dy="1"/>\n<feGaussianBlur stdDeviation="1.5"/>\n<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"/>\n<feBlend mode="normal" in="SourceGraphic" result="shape"/>',At={editSize:"auto",keyEvent:!0,stroke:"#836DFF",strokeWidth:2,pointFill:"#FFFFFF",pointSize:10,pointRadius:16,rotateGap:45,buttonsDirection:"bottom",buttonsMargin:12,moveCursor:"move",resizeCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate({{rotation}},12,12)">\n<path d="M7.5 8.0H8.5V5.9L6.8 7.2L7.5 8.0ZM3 11.4L2.3 10.6L1.3 11.4L2.3 12.2L3 11.4ZM7.5 10.4H6.5V11.4H7.5V10.4ZM16.5 10.4V11.4H17.5V10.4H16.5ZM16.5 8.0L17.1 7.2L15.5 5.9V8.0H16.5ZM21 11.4L21.6 12.2L22.6 11.4L21.6 10.6L21 11.4ZM16.5 14.9H15.5V16.9L17.1 15.7L16.5 14.9ZM16.5 12.4H17.5V11.4H16.5V12.4ZM7.5 12.4V11.4H6.5V12.4H7.5ZM7.5 14.9L6.8 15.7L8.5 16.9V14.9H7.5ZM6.8 7.2L2.3 10.6L3.6 12.2L8.1 8.7L6.8 7.2ZM8.5 10.4V8.0H6.5V10.4H8.5ZM16.5 9.4H7.5V11.4H16.5V9.4ZM17.5 10.4V8.0H15.5V10.4H17.5ZM15.8 8.7L20.3 12.2L21.6 10.6L17.1 7.2L15.8 8.7ZM20.3 10.6L15.8 14.1L17.1 15.7L21.6 12.2L20.3 10.6ZM17.5 14.9V12.4H15.5V14.9H17.5ZM7.5 13.4H16.5V11.4H7.5V13.4ZM8.5 14.9V12.4H6.5V14.9H8.5ZM2.3 12.2L6.8 15.7L8.1 14.1L3.6 10.6L2.3 12.2Z" fill="white"/>\n<path fill-rule="evenodd" d="M3 11.4L7.5 8.0V10.4H16.5V8.0L21 11.4L16.5 14.9V12.4H7.5V14.9L3 11.4Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter id="f" x="-1.6" y="3.9" width="27.2" height="16.9" filterUnits="userSpaceOnUse">\n${Zt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},rotateCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate(135,12,12),rotate({{rotation}},12,12)">\n<path d="M20.4 8H21.4L20.8 7.1L17.3 2.6L17 2.1L16.6 2.6L13.1 7.1L12.5 8H13.5H15.4C14.9 11.8 11.8 14.9 8 15.4V13.5V12.5L7.1 13.1L2.6 16.6L2.1 17L2.6 17.3L7.1 20.8L8 21.4V20.4V18.4C13.5 17.9 17.9 13.5 18.4 8H20.4Z" stroke="white"/>\n<path fill-rule="evenodd" d="M17 3L20.4 7.5H17.9C17.7 13.1 13.1 17.7 7.5 17.9V20.4L3 17L7.5 13.5V15.9C12.0 15.7 15.7 12.0 15.9 7.5H13.5L17 3Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter id="f" x="-1.6" y="-0.6" width="27.1" height="27.1" filterUnits="userSpaceOnUse">\n${Zt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},skewCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate(90,12,12),rotate({{rotation}},12,12)">\n<path d="M21 10.4L21 11.4L23.8 11.4L21.6 9.6L21 10.4ZM17 10.4V11.4L17 11.4L17 10.4ZM15.5 6L16.1 5.2L14.5 3.9V6H15.5ZM15.5 8.4V9.4H16.5V8.4H15.5ZM6 8.4V7.4H5V8.4H6ZM6 10.4H5V11.4H6V10.4ZM7 14.4V13.4L7 13.4L7 14.4ZM3 14.4L3 13.4L0.1 13.4L2.3 15.2L3 14.4ZM8.5 18.9L7.8 19.7L9.5 21.0V18.9H8.5ZM8.5 16.4V15.4H7.5V16.4H8.5ZM19 16.4V17.4H20V16.4H19ZM19 14.4H20V13.4H19V14.4ZM21 9.4L17 9.4L17 11.4L21 11.4L21 9.4ZM14.8 6.7L20.3 11.2L21.6 9.6L16.1 5.2L14.8 6.7ZM16.5 8.4V6H14.5V8.4H16.5ZM6 9.4H15.5V7.4H6V9.4ZM7 10.4V8.4H5V10.4H7ZM15.5 9.4H6V11.4H15.5V9.4ZM17 9.4H15.5V11.4H17V9.4ZM7 15.4H8.5V13.4H7V15.4ZM3 15.4L7 15.4L7 13.4L3 13.4L3 15.4ZM9.1 18.1L3.6 13.6L2.3 15.2L7.8 19.7L9.1 18.1ZM7.5 16.4V18.9H9.5V16.4H7.5ZM19 15.4H8.5V17.4H19V15.4ZM18 14.4V16.4H20V14.4H18ZM8.5 15.4H19V13.4H8.5V15.4Z" fill="white"/>\n<path fill-rule="evenodd" d="M17 10.4L21 10.4L15.5 6V8.4H6V10.4H15.5H17ZM8.5 14.4H7L3 14.4L8.5 18.9V16.4H19V14.4H8.5Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter x="-2.8" y="1.9" width="29.6" height="23.1" filterUnits="userSpaceOnUse" >\n${Zt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},selector:!0,hover:!0,boxSelect:!0,moveable:!0,resizeable:!0,rotateable:!0,skewable:!0};class Bt{constructor(){this.tag="EditTool"}onMove(t){const{moveX:e,moveY:i,editor:s}=t,{app:o,list:n}=s;o.lockLayout(),n.forEach((t=>{t.moveWorld(e,i)})),o.unlockLayout()}onScale(t){const{scaleX:e,scaleY:i,transform:s,worldOrigin:o,editor:n}=t,{app:r,list:a}=n;r.lockLayout(),a.forEach((t=>{const r="size"===n.getEditSize(t);s?t.transformWorld(s,r):t.scaleOfWorld(o,e,i,r)})),r.unlockLayout()}onRotate(t){const{rotation:e,transform:i,worldOrigin:s,editor:o}=t,{app:n,list:r}=o;n.lockLayout(),r.forEach((t=>{const n="size"===o.getEditSize(t);i?t.transformWorld(i,n):t.rotateOfWorld(s,e)})),n.unlockLayout()}onSkew(t){const{skewX:e,skewY:i,transform:s,worldOrigin:o,editor:n}=t,{app:r,list:a}=n;r.lockLayout(),a.forEach((t=>{const r="size"===n.getEditSize(t);s?t.transformWorld(s,r):t.skewOfWorld(o,e,i,r)})),r.unlockLayout()}update(t){const{simulateTarget:e,element:i}=t;t.multiple&&e.parent.updateLayout();const{x:s,y:o,scaleX:n,scaleY:r,rotation:a,skewX:h,skewY:l,width:c,height:d}=i.getLayoutBounds("box",t,!0);t.editBox.set({x:s,y:o,scaleX:n,scaleY:r,rotation:a,skewX:h,skewY:l}),t.editBox.update({x:0,y:0,width:c,height:d})}}Bt.list=[];const{left:zt,right:Wt}=Lt;class It extends Bt{constructor(){super(...arguments),this.tag="LineEditTool",this.scaleOfEvent=!0}onScaleWithDrag(t){const{drag:e,direction:i,lockRatio:s,around:o}=t,n=t.target,r=M(),{toPoint:a}=n;n.rotation=0;let{x:h,y:l}=e.getInnerMove(n);s&&(Math.abs(h)>Math.abs(l)?l=0:h=0),i===zt?(r.x+=h,r.y+=l,o&&(a.x-=h,a.y-=l)):(o&&(r.x-=h,r.y-=l),a.x+=h,a.y+=l),n.getLocalPointByInner(r,null,null,!0),n.getLocalPointByInner(a,null,null,!0),n.x=r.x,n.y=r.y,n.getInnerPointByLocal(a,null,null,!0),n.toPoint=a}onSkew(t){}update(t){const{rotatePoints:e,resizeLines:i,resizePoints:s}=t.editBox;super.update(t);for(let t=0;t<8;t++)t<4&&(i[t].visible=!1),s[t].visible=e[t].visible=t===zt||t===Wt}}const Xt=(t,e)=>t.parent.children.indexOf(t)-e.parent.children.indexOf(e),Yt=(t,e)=>e.parent.children.indexOf(e)-t.parent.children.indexOf(t),Ct={group(t,e,i){t.sort(Yt);const{app:s,parent:o}=t[0];let n;n=i&&i.add?i:new u(i),o.addAt(n,o.children.indexOf(t[0])),t.sort(Xt);const r=new V(e.worldTransform);return r.divideParent(o.worldTransform),n.setTransform(r),n.editable=!0,n.hitChildren=!1,s.lockLayout(),t.forEach((t=>t.dropTo(n))),s.unlockLayout(),n},ungroup(t){const{app:e}=t[0],i=[];return e.lockLayout(),t.forEach((t=>{if(t.isBranch){const{parent:e,children:s}=t;for(;s.length;)i.push(s[0]),s[0].dropTo(e,e.children.indexOf(t));t.remove()}else i.push(t)})),e.unlockLayout(),i},toTop(t){t.sort(Xt),t.forEach((t=>{t.parent&&t.parent.add(t)}))},toBottom(t){t.sort(Yt),t.forEach((t=>{t.parent&&t.parent.addAt(t,0)}))}};class Ft extends u{get list(){return this.leafList.list}get hasTarget(){return!!this.list.length}get multiple(){return this.list.length>1}get single(){return 1===this.list.length}get element(){return this.multiple?this.simulateTarget:this.list[0]}get buttons(){return this.editBox.buttons}get dragging(){return this.editBox.dragging}constructor(t,e){super(e),this.config=At,this.leafList=new w,this.simulateTarget=new f({visible:!1}),this.editBox=new Rt(this),this.selector=new wt(this),this.targetEventIds=[],t&&(this.config=S.default(t,this.config)),this.addMany(this.selector,this.editBox)}hasItem(t){return this.leafList.has(t)}addItem(t){this.hasItem(t)||t.locked||(this.leafList.add(t),this.target=this.leafList.list)}removeItem(t){this.hasItem(t)&&(this.leafList.remove(t),this.target=this.leafList.list)}shiftItem(t){this.hasItem(t)?this.removeItem(t):this.addItem(t)}update(){this.hasTarget&&(this.editTool&&this.editTool.update(this),this.selector.update())}updateEditTool(){this.editTool=function(t){if(1===t.length){const e=t[0];return e instanceof E&&!e.points?new It:new Bt}return new Bt}(this.list)}getEditSize(t){let{editSize:e}=this.config;return"auto"===e?t.editSize:e}onMove(t){const e=t.getLocalMove(this.element);t.shiftKey&&(Math.abs(e.x)>Math.abs(e.y)?e.y=0:e.x=0),this.move(e.x,e.y)}onScale(t){const{element:e}=this,{direction:i}=t.current;let{around:s,lockRatio:o}=this.config;t.shiftKey&&(o=!0);const n=St.getScaleData(e.boxBounds,i,t.getInnerMove(e),o,St.getAround(s,t.altKey));this.editTool.onScaleWithDrag?(n.drag=t,this.scaleWithDrag(n)):this.scaleOf(n.origin,n.scaleX,n.scaleY)}onRotate(t){const{skewable:e,around:i,rotateGap:s}=this.config,{direction:o,name:n}=t.current;if(e&&"resize-line"===n)return this.onSkew(t);const{element:r}=this;let a,h;if(t instanceof H)h=t.rotation,a=r.getInnerPoint(t);else{const e={x:t.x-t.moveX,y:t.y-t.moveY},s=St.getRotateData(r.boxBounds,o,t.getInner(r),r.getInnerPoint(e),t.shiftKey?null:i||"center");h=s.rotation,a=s.origin}h=T.getGapRotation(h,s,r.rotation),h&&(r.scaleX*r.scaleY<0&&(h=-h),this.rotateOf(a,T.float(h,2)))}onSkew(t){const{element:e}=this,{around:i}=this.config,{origin:s,skewX:o,skewY:n}=St.getSkewData(e.boxBounds,t.current.direction,t.getInnerMove(e),St.getAround(i,t.altKey));(o||n)&&this.skewOf(s,o,n)}move(t,e){if(!this.config.moveable)return;const{element:i}=this,s=i.getWorldPointByLocal({x:t,y:e},null,!0),o=new tt(tt.MOVE,{target:i,editor:this,moveX:s.x,moveY:s.y});this.editTool.onMove(o),this.emitEvent(o),this.multiple&&i.move(t,e)}scaleWithDrag(t){const{element:e}=this,i=e.getWorldPoint(t.origin),s=new et(et.SCALE,Object.assign(Object.assign({},t),{target:e,editor:this,worldOrigin:i}));this.editTool.onScaleWithDrag(s),this.emitEvent(s)}scaleOf(t,e,i=e,s){const{element:o}=this,n=o.getWorldPoint(t);let r;if(this.multiple){const s=new V(o.worldTransform);o.scaleOf(t,e,i),r=new V(o.worldTransform).divide(s)}const a=new et(et.SCALE,{target:o,editor:this,worldOrigin:n,scaleX:e,scaleY:i,transform:r});this.editTool.onScale(a),this.emitEvent(a)}rotateOf(t,e){const{element:i}=this,s=i.getWorldPoint(t);let o;if(this.multiple){const s=new V(i.worldTransform);i.rotateOf(t,e),o=new V(i.worldTransform).divide(s)}const n=new it(it.ROTATE,{target:i,editor:this,worldOrigin:s,rotation:e,transform:o});this.editTool.onRotate(n),this.emitEvent(n)}skewOf(t,e,i=0,s){const{element:o}=this,n=o.getWorldPoint(t);let r;if(this.multiple){const s=new V(o.worldTransform);o.skewOf(t,e,i),r=new V(o.worldTransform).divide(s)}const a=new st(st.SKEW,{target:o,editor:this,skewX:e,skewY:i,transform:r,worldOrigin:n});this.editTool.onSkew(a),this.emitEvent(a)}group(t){return this.multiple&&(this.target=Ct.group(this.list,this.element,t)),this.target}ungroup(){return this.list.length&&(this.target=Ct.ungroup(this.list)),this.list}lock(){this.list.forEach((t=>t.locked=!0)),this.update()}unlock(){this.list.forEach((t=>t.locked=!1)),this.update()}toTop(){this.list.length&&(Ct.toTop(this.list),this.leafList.update())}toBottom(){this.list.length&&(Ct.toBottom(this.list),this.leafList.update())}listenTargetEvents(){if(!this.targetEventIds.length){const{leafer:t}=this.list[0];this.targetEventIds=[t.on_(O.START,this.update,this),t.on_([P.HOLD,P.UP],(t=>{Ht(this,t)})),t.on_(P.DOWN,this.editBox.onArrow,this.editBox)]}}removeTargetEvents(){const{targetEventIds:t}=this;t.length&&(this.off_(t),t.length=0)}destroy(){this.destroyed||(this.simulateTarget.destroy(),this.target=this.hoverTarget=this.simulateTarget=null,super.destroy())}}q([ot((function(t,e){t.emitEvent(new J(J.HOVER,{editor:t,value:t.hoverTarget,oldValue:e}))}))],Ft.prototype,"hoverTarget",void 0),q([ot((function(t,e){const{target:i}=t;i?t.leafList=i instanceof w?i:new w(i):t.leafList.reset(),t.emitEvent(new J(J.SELECT,{editor:t,value:i,oldValue:e})),t.hasTarget?t.waitLeafer((()=>{t.multiple&&function(t){const{simulateTarget:e,leafList:i}=t,{x:s,y:o,width:n,height:r}=(new y).setListWithFn(i.list,(t=>t.worldBoxBounds)),a=e.parent=i.list[0].leafer.zoomLayer,{scaleX:h,scaleY:l,e:c,f:d}=a.__world;e.reset({x:(s-c)/h,y:(o-d)/l,width:n/h,height:r/l})}(t),Tt(t),t.updateEditTool(),t.update(),t.listenTargetEvents()})):t.removeTargetEvents()}))],Ft.prototype,"target",void 0),D.editor=function(t){return new Ft(t)};export{Rt as EditBox,St as EditDataHelper,Pt as EditPoint,wt as EditSelect,pt as EditSelectHelper,Bt as EditTool,Ft as Editor,J as EditorEvent,Ct as EditorHelper,tt as EditorMoveEvent,it as EditorRotateEvent,et as EditorScaleEvent,st as EditorSkewEvent,It as LineEditTool,ct as SelectArea,lt as Stroker};
1
+ import{PathCommandMap as t,Leaf as e,Path as i,Line as s,Polygon as o,MatrixHelper as n,Group as r,Box as a}from"@leafer-ui/draw";import{Event as l,defineKey as h,MatrixHelper as c,UI as d,Paint as g,Group as u,Rect as f,Answer as p,Bounds as y,LeafList as w,PointerEvent as L,DragEvent as v,MoveEvent as k,ZoomEvent as _,PointHelper as m,AroundHelper as b,MathHelper as x,Box as M,getPointData as E,Line as S,Matrix as V,DataHelper as H,RotateEvent as T,RenderEvent as O,KeyEvent as P,Creator as D}from"@leafer-ui/core";const{M:R,L:A,C:Z,Q:B,Z:z,N:W,D:I,X:X,G:Y,F:C,O:F,P:K,U:U}=t,j={scale(t,e,i){if(!t)return;let s,o=0,n=t.length;for(;o<n;)switch(s=t[o],s){case R:case A:G(t,e,i,o,1),o+=3;break;case Z:G(t,e,i,o,3),o+=7;break;case B:G(t,e,i,o,2),o+=5;break;case z:o+=1;break;case W:G(t,e,i,o,2),o+=5;break;case I:G(t,e,i,o,2),o+=9;break;case X:G(t,e,i,o,2),o+=6;break;case Y:G(t,e,i,o,2),o+=9;break;case C:G(t,e,i,o,2),o+=5;break;case F:t[o]=Y,t.splice(o+4,0,t[o+3],0),G(t,e,i,o,2),o+=9,n+=2;break;case K:t[o]=C,t.splice(o+4,0,t[o+3]),G(t,e,i,o,2),o+=5,n+=1;break;case U:G(t,e,i,o,2),o+=6}},scalePoints(t,e,i,s,o){for(let n=o?s+1:0,r=o?n+2*o:t.length;n<r;n+=2)t[n]*=e,t[n+1]*=i}},{scalePoints:G}=j;function N(t,e,i){1!==e&&(t.width*=e),1!==i&&(t.height*=i)}e.prototype.scaleResize=function(t,e=t,i){const s=this;i?(s.scaleX*=t,s.scaleY*=e):(t<0&&(s.scaleX*=-1,t=-t),e<0&&(s.scaleY*=-1,e=-e),this.__scaleResize(t,e))},e.prototype.__scaleResize=function(t,e){N(this,t,e)},i.prototype.__scaleResize=function(t,e){j.scale(this.__.path,t,e),this.path=this.__.path},s.prototype.__scaleResize=function(t,e){if(this.points)j.scalePoints(this.__.points,t,e),this.points=this.__.points;else{const i=this.toPoint;i.x*=t,i.y*=e,this.toPoint=i}},o.prototype.__scaleResize=function(t,e){this.points?(j.scalePoints(this.__.points,t,e),this.points=this.__.points):N(this,t,e)};const $=n.get();function Q(t,e,i){const{children:s}=t;for(let t=0;t<s.length;t++)$.a=e,$.d=i,s[t].transform($,!0)}function q(t,e,i,s){var o,n=arguments.length,r=n<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,i,s);else for(var a=t.length-1;a>=0;a--)(o=t[a])&&(r=(n<3?o(r):n>3?o(e,i,r):o(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r}function J(t){return t?t instanceof Array?t:[t]:[]}r.prototype.__scaleResize=function(t,e){Q(this,t,e)},a.prototype.__scaleResize=function(t,e){this.__.__autoSize&&this.children.length?Q(this,t,e):N(this,t,e)},"function"==typeof SuppressedError&&SuppressedError;class tt extends l{get list(){return J(this.value)}get oldList(){return J(this.oldValue)}constructor(t,e){super(t),e&&Object.assign(this,e)}}tt.SELECT="editor.select",tt.HOVER="editor.hover";class et extends tt{constructor(t,e){super(t,e)}}et.MOVE="editor.move";class it extends tt{constructor(t,e){super(t,e)}}it.SCALE="editor.scale";class st extends tt{constructor(t,e){super(t,e)}}st.ROTATE="editor.rotate";class ot extends tt{constructor(t,e){super(t,e)}}function nt(t){return(e,i)=>{const s="_"+i;h(e,i,{get(){return this[s]},set(e){const i=this[s];i!==e&&(this[s]=e,t(this,i))}})}}ot.SKEW="editor.skew";const rt=c.get(),{abs:at}=Math,{copy:lt,scale:ht}=c;class ct extends d{constructor(){super(),this.list=[],this.hittable=!1,this.strokeAlign="center"}setTarget(t,e){const{stroke:i,strokeWidth:s}=e;this.set({stroke:i,strokeWidth:s}),this.target=t}__draw(t,e){const{list:i}=this;if(i.length){let s;const{stroke:o,strokeWidth:n}=this.__,{bounds:r}=e;for(let a=0;a<i.length;a++)if(s=i[a],r&&r.hit(s.__world,e.matrix)){let i;if("scale"===s.__.editSize){const o=at(s.__world.scaleX),r=at(s.__world.scaleY);if(o!==r){lt(rt,s.__world),ht(rt,1/o,1/r),t.setWorld(rt,e.matrix),t.beginPath(),this.__.strokeWidth=n;const{x:a,y:l,width:h,height:c}=s.__layout.boxBounds;t.rect(a*o,l*r,h*o,c*r),i=!0}}i||(t.setWorld(s.__world,e.matrix),t.beginPath(),s.__.__useArrow?s.__drawPath(t):s.__.__pathForRender?s.__drawRenderPath(t):s.__drawPathByBox(t),this.__.strokeWidth=n/at(s.__world.scaleX)),"string"==typeof o?g.stroke(o,this,t):g.strokes(o,this,t)}this.__.strokeWidth=n}}destroy(){this.target=null,super.destroy()}}q([nt((function(t){const e=t.target;t.list=e?e instanceof Array?e:[e]:[],t.forceUpdate()}))],ct.prototype,"target",void 0);class dt extends u{constructor(t){super(t),this.strokeArea=new f({strokeAlign:"center"}),this.fillArea=new f,this.visible=this.hittable=!1,this.addMany(this.fillArea,this.strokeArea)}setStyle(t,e){const{visible:i,stroke:s,strokeWidth:o}=t;this.visible=i,this.strokeArea.reset(Object.assign({stroke:s,strokeWidth:o},e||{})),this.fillArea.reset({visible:!e,fill:s,opacity:.2})}setBounds(t){this.strokeArea.set(t),this.fillArea.set(t)}}const{No:gt,Yes:ut,NoAndSkip:ft,YesAndSkip:pt}=p,yt={findOne:t=>t.list.find((t=>t.editable)),findBounds(t,e){if(t.__.hittable&&t.__.visible&&!t.__.locked&&e.hit(t.__world)){if(t.__.editable){if(t.isBranch&&!t.__.hitChildren)return t.__.hitSelf?pt:ft;if(t.isFrame)return e.includes(t.__layout.boxBounds,t.__world)?pt:gt;if(e.hit(t.__layout.boxBounds,t.__world)&&t.__.hitSelf)return ut}return gt}return t.isBranch?ft:gt}},{findOne:wt}=yt;class Lt extends u{get dragging(){return!!this.originList}get running(){return this.editor.hittable&&this.editor.config.selector}get isMoveMode(){return this.app&&this.app.interaction.moveMode}constructor(t){super(),this.hoverStroker=new ct,this.targetStroker=new ct,this.bounds=new y,this.selectArea=new dt,this.__eventIds=[],this.editor=t,this.addMany(this.targetStroker,this.hoverStroker,this.selectArea),this.__listenEvents()}onHover(){const{editor:t}=this;if(!this.running||this.dragging||t.dragging)this.hoverStroker.target=null;else{const{stroke:e,strokeWidth:i,hover:s}=t.config;this.hoverStroker.setTarget(s?this.editor.hoverTarget:null,{stroke:e,strokeWidth:i})}}onSelect(){if(this.running){const{config:t,list:e}=this.editor,{stroke:i,strokeWidth:s}=t;this.targetStroker.setTarget(e,{stroke:i,strokeWidth:Math.max(1,s/2)}),this.hoverStroker.target=null}}update(){this.running&&this.targetStroker.forceUpdate()}onPointerMove(t){const{app:e,editor:i}=this;if(this.running&&!this.isMoveMode&&e.config.pointer.hover&&!e.interaction.dragging){const e=t.shiftKey?this.findDeepOne(t):wt(t.path);i.hoverTarget=i.hasItem(e)?null:e}this.isMoveMode&&(i.hoverTarget=null)}onBeforeDown(t){const{select:e}=this.editor.config;"press"===e&&this.checkAndSelect(t,!0)}onTap(t){const{editor:e}=this,{select:i,continuousSelect:s}=e.config;if("tap"===i&&this.checkAndSelect(t),!this.running||!t.shiftKey&&!s||t.middle||this.lastDownLeaf)this.isMoveMode&&(e.target=null);else{const i=this.findDeepOne(t);i?e.shiftItem(i):!t.shiftKey&&s&&(e.target=null)}this.lastDownLeaf=null}checkAndSelect(t,e){if(this.running&&!this.isMoveMode&&!t.middle){const{editor:i}=this,s=this.lastDownLeaf=wt(t.path);s?(t.shiftKey||i.config.continuousSelect?i.shiftItem(s):i.target=s,e&&(i.updateLayout(),s.locked||this.app.interaction.updateDownData(t,{findList:[i.editBox.rect]},i.config.dualEvent))):this.allow(t.target)&&(t.shiftKey||(i.target=null))}}onDragStart(t){if(this.running&&this.allowDrag(t)){const{editor:e}=this,{stroke:i,strokeWidth:s,area:o}=e.config,{x:n,y:r}=t.getInner(this);this.bounds.set(n,r),this.selectArea.setStyle({visible:!0,stroke:i,strokeWidth:s,x:n,y:r},o),this.selectArea.setBounds(this.bounds.get()),this.originList=e.leafList.clone()}}onDrag(t){if(this.editor.dragging)this.onDragEnd();else if(this.dragging){const{editor:e}=this,i=t.getInnerTotal(this),s=this.bounds.clone().unsign(),o=new w(e.app.find(yt.findBounds,s));if(this.bounds.width=i.x,this.bounds.height=i.y,this.selectArea.setBounds(s.get()),o.length){const t=[];this.originList.forEach((e=>{o.has(e)||t.push(e)})),o.forEach((e=>{this.originList.has(e)||t.push(e)})),(t.length!==e.list.length||e.list.some(((e,i)=>e!==t[i])))&&(e.target=t)}else e.target=this.originList.list}}onDragEnd(){this.dragging&&(this.originList=null,this.selectArea.visible=!1)}onAutoMove(t){if(this.dragging){const{x:e,y:i}=t.getLocalMove(this);this.bounds.x+=e,this.bounds.y+=i}}allow(t){return t.leafer!==this.editor.leafer}allowDrag(t){return!(!this.editor.config.boxSelect||t.target.draggable)&&(!this.editor.hasTarget&&this.allow(t.target)||t.shiftKey&&!wt(t.path))}findDeepOne(t){const e={exclude:new w(this.editor.editBox.rect)};return wt(t.target.leafer.interaction.findPath(t,e))}__listenEvents(){const{editor:t}=this;t.waitLeafer((()=>{const{app:e}=t;e.selector.proxy=t,this.__eventIds=[t.on_(tt.HOVER,this.onHover,this),t.on_(tt.SELECT,this.onSelect,this),e.on_(L.MOVE,this.onPointerMove,this),e.on_(L.BEFORE_DOWN,this.onBeforeDown,this),e.on_(L.TAP,this.onTap,this),e.on_(v.START,this.onDragStart,this),e.on_(v.DRAG,this.onDrag,this),e.on_(v.END,this.onDragEnd,this),e.on_(k.MOVE,this.onAutoMove,this),e.on_([_.ZOOM,k.MOVE],(()=>{this.editor.hoverTarget=null}))]}))}__removeListenEvents(){this.__eventIds&&(this.off_(this.__eventIds),this.__eventIds.length=0)}destroy(){this.editor=this.originList=this.lastDownLeaf=null,this.__removeListenEvents(),super.destroy()}}var vt;!function(t){t[t.topLeft=0]="topLeft",t[t.top=1]="top",t[t.topRight=2]="topRight",t[t.right=3]="right",t[t.bottomRight=4]="bottomRight",t[t.bottom=5]="bottom",t[t.bottomLeft=6]="bottomLeft",t[t.left=7]="left"}(vt||(vt={}));const{topLeft:kt,top:_t,topRight:mt,right:bt,bottomRight:xt,bottom:Mt,bottomLeft:Et,left:St}=vt,{toPoint:Vt}=b,Ht={getScaleData(t,e,i,s,o){let n,r=1,a=1;const{width:l,height:h}=t;o&&(i.x*=2,i.y*=2),Math.abs(i.x)===l&&(i.x+=.1),Math.abs(i.y)===h&&(i.y+=.1);const c=(-i.y+h)/h,d=(i.x+l)/l,g=(i.y+h)/h,u=(-i.x+l)/l;switch(e){case _t:a=c,n={x:.5,y:1};break;case bt:r=d,n={x:0,y:.5};break;case Mt:a=g,n={x:.5,y:0};break;case St:r=u,n={x:1,y:.5};break;case kt:a=c,r=u,n={x:1,y:1};break;case mt:a=c,r=d,n={x:0,y:1};break;case xt:a=g,r=d,n={x:0,y:0};break;case Et:a=g,r=u,n={x:1,y:0}}if(s){"corner"===s&&e%2||(1!==a?r=a:a=r)}return Vt(o||n,t,n),{origin:n,scaleX:r,scaleY:a,direction:e,lockRatio:s,around:o}},getRotateData(t,e,i,s,o){let n;switch(e){case kt:n={x:1,y:1};break;case mt:n={x:0,y:1};break;case xt:n={x:0,y:0};break;case Et:n={x:1,y:0};break;default:n={x:.5,y:.5}}return Vt(o||n,t,n),{origin:n,rotation:m.getRotation(s,n,i)}},getSkewData(t,e,i,s){let o,n,r=0,a=0;switch(e){case _t:n={x:.5,y:0},o={x:.5,y:1},r=1;break;case Mt:n={x:.5,y:1},o={x:.5,y:0},r=1;break;case St:n={x:0,y:.5},o={x:1,y:.5},a=1;break;case bt:n={x:1,y:.5},o={x:0,y:.5},a=1}const{x:l,y:h,width:c,height:d}=t;n.x=l+n.x*c,n.y=h+n.y*d,Vt(s||o,t,o);const g=m.getRotation(n,o,{x:n.x+(r?i.x:0),y:n.y+(a?i.y:0)});return r?r=-g:a=g,{origin:o,skewX:r,skewY:a}},getAround:(t,e)=>e&&!t?"center":t,getRotateDirection:(t,e,i=8)=>((t=(t+Math.round(e/(360/i)))%i)<0&&(t+=i),t),getFlipDirection(t,e,i){if(e)switch(t){case St:t=bt;break;case kt:t=mt;break;case Et:t=xt;break;case bt:t=St;break;case mt:t=kt;break;case xt:t=Et}if(i)switch(t){case _t:t=Mt;break;case kt:t=Et;break;case mt:t=xt;break;case Mt:t=_t;break;case Et:t=kt;break;case xt:t=mt}return t}},Tt={};function Ot(t,e){const{editBox:i}=t,s=i.enterPoint;if(!s||!t.hasTarget||!i.visible)return;if("circle"===s.name)return;let{rotation:o}=i;const{resizeCursor:n,rotateCursor:r,skewCursor:a,resizeable:l,rotateable:h,skewable:c}=t.config,{pointType:d}=s,{flippedX:g,flippedY:u}=i;let f="resize"===d;f&&h&&(e.metaKey||e.ctrlKey||!l)&&(f=!1);const p=c&&!f&&"resize-line"===s.name?a:f?n:r;o+=45*(Ht.getFlipDirection(s.direction,g,u)+1),o=2*Math.round(x.formatRotation(o,!0)/2);const{url:y,x:w,y:L}=p,v=y+o;Tt[v]?s.cursor=Tt[v]:Tt[v]=s.cursor={url:Dt(y,o),x:w,y:L}}function Pt(t){t.editBox.rect.cursor=t.config.moveCursor}function Dt(t,e){return'"data:image/svg+xml,'+encodeURIComponent(t.replace("{{rotation}}",e.toString()))+'"'}class Rt extends M{}const At=["top","right","bottom","left"];class Zt extends u{get flipped(){return this.flippedX||this.flippedY}get flippedX(){return this.scaleX<0}get flippedY(){return this.scaleY<0}get flippedOne(){return this.scaleX*this.scaleY<0}constructor(t){super(),this.rect=new M({name:"rect",hitFill:"all",hitStroke:"none",strokeAlign:"center",hitRadius:5}),this.circle=new Rt({name:"circle",strokeAlign:"center",around:"center",cursor:"crosshair",hitRadius:5}),this.buttons=new u({around:"center",hitSelf:!1}),this.resizePoints=[],this.rotatePoints=[],this.resizeLines=[],this.__eventIds=[],this.editor=t,this.visible=!1,this.create(),this.__listenEvents()}create(){let t,e,i;const{resizePoints:s,rotatePoints:o,resizeLines:n,rect:r,circle:a,buttons:l}=this,h=[{x:1,y:1},{x:.5,y:1},{x:0,y:1},{x:0,y:.5},{x:0,y:0},{x:.5,y:0},{x:1,y:0},{x:1,y:.5}];for(let r=0;r<8;r++)t=new Rt({name:"rotate-point",around:h[r],width:15,height:15,hitFill:"all"}),o.push(t),this.listenPointEvents(t,"rotate",r),r%2&&(e=new Rt({name:"resize-line",around:"center",width:10,height:10,hitFill:"all"}),n.push(e),this.listenPointEvents(e,"resize",r)),i=new Rt({name:"resize-point",around:"center",strokeAlign:"center",hitRadius:5}),s.push(i),this.listenPointEvents(i,"resize",r);l.add(a),this.listenPointEvents(a,"rotate",2),this.addMany(...o,r,l,...n,...s)}update(t){const{config:e,list:i}=this.editor,{width:s,height:o}=t,{rect:n,circle:r,resizePoints:a,rotatePoints:l,resizeLines:h}=this,{middlePoint:c,resizeable:d,rotateable:g,stroke:u,strokeWidth:f,hideOnSmall:p}=e,y=this.getPointsStyle(),w=this.getMiddlePointsStyle(),L="number"==typeof p?p:10,v=!(p&&s<L&&o<L);this.visible=i[0]&&!i[0].locked;let k,_,m,x,M={};for(let i=0;i<8;i++)b.toPoint(b.directionData[i],t,M),k=this.getPointStyle(i%2?w[(i-1)/2%w.length]:y[i/2%y.length]),m=a[i],_=l[i],x=h[Math.floor(i/2)],m.set(k),m.set(M),_.set(M),x.set(M),m.visible=x.visible=v&&(d||g),_.visible=v&&g&&d&&!e.rotatePoint,i%2?(m.visible=_.visible=v&&!!c,(i+1)/2%2?(x.width=s,m.width>s-30&&(m.visible=!1)):(x.height=o,m.rotation=90,m.width>o-30&&(m.visible=!1))):m.rotation=i/2*90;r.visible=v&&g&&!!e.rotatePoint,r.set(this.getPointStyle(e.rotatePoint||y[0])),n.set(Object.assign({stroke:u,strokeWidth:f},e.rect||{})),n.set(Object.assign(Object.assign({},t),{visible:!0})),n.hittable=e.moveable,this.buttons.visible=v,this.layoutButtons()}layoutButtons(){const{buttons:t,resizePoints:e}=this,{buttonsDirection:i,buttonsFixed:s,buttonsMargin:o,middlePoint:n}=this.editor.config,{flippedX:r,flippedY:a}=this;let l=At.indexOf(i);(l%2&&r||(l+1)%2&&a)&&s&&(l=(l+2)%4);const h=s?Ht.getRotateDirection(l,this.flippedOne?this.rotation:-this.rotation,4):l,c=e[2*h+1],d=h%2,g=h&&3!==h?1:-1,u=(o+(l%2?(n?c.width:0)+t.boxBounds.width:(n?c.height:0)+t.boxBounds.height)/2)*g;d?(t.x=c.x+u,t.y=c.y):(t.x=c.x,t.y=c.y+u),s&&(t.rotation=90*(h-l),t.scaleX=r?-1:1,t.scaleY=a?-1:1)}getPointStyle(t){const{stroke:e,strokeWidth:i,pointFill:s,pointSize:o,pointRadius:n}=this.editor.config,r={fill:s,stroke:e,strokeWidth:i,width:o,height:o,cornerRadius:n};return t?Object.assign(r,t):r}getPointsStyle(){const{point:t}=this.editor.config;return t instanceof Array?t:[t]}getMiddlePointsStyle(){const{middlePoint:t}=this.editor.config;return t instanceof Array?t:t?[t]:this.getPointsStyle()}onDragStart(t){this.dragging=!0,"rect"===t.target.name&&(this.moving=!0,this.editor.opacity=this.editor.config.hideOnMove?0:1)}onDragEnd(t){this.dragging=!1,this.moving=!1,"rect"===t.target.name&&(this.editor.opacity=1)}onDrag(t){const{editor:e}=this;"rotate"===(this.enterPoint=t.current).pointType||t.metaKey||t.ctrlKey||!e.config.resizeable?e.config.rotateable&&e.onRotate(t):e.onScale(t),Ot(e,t)}onArrow(t){if(this.editor.hasTarget&&this.editor.config.keyEvent){const e={x:0,y:0},i=t.shiftKey?10:1;switch(t.code){case"ArrowDown":e.y=i;break;case"ArrowUp":e.y=-i;break;case"ArrowLeft":e.x=-i;break;case"ArrowRight":e.x=i}(e.x||e.y)&&this.editor.move(e.x,e.y)}}onDoubleClick(){const{editor:t}=this;t.single&&t.element.isBranch}listenPointEvents(t,e,i){const{editor:s}=this;t.direction=i,t.pointType=e,t.on_(v.START,this.onDragStart,this),t.on_(v.DRAG,this.onDrag,this),t.on_(v.END,this.onDragEnd,this),t.on_(L.LEAVE,(()=>this.enterPoint=null)),"circle"!==t.name&&t.on_(L.ENTER,(e=>{this.enterPoint=t,Ot(s,e)}))}__listenEvents(){const{rect:t,editor:e}=this;this.__eventIds=[e.on_(tt.SELECT,(()=>{this.visible=e.hasTarget})),t.on_(v.START,this.onDragStart,this),t.on_(v.DRAG,e.onMove,e),t.on_(v.END,this.onDragEnd,this),t.on_(L.ENTER,(()=>Pt(e))),t.on_(L.DOUBLE_CLICK,this.onDoubleClick,this)]}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(){this.editor=null,this.__removeListenEvents(),super.destroy()}}const Bt='\n<feOffset dy="1"/>\n<feGaussianBlur stdDeviation="1.5"/>\n<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"/>\n<feBlend mode="normal" in="SourceGraphic" result="shape"/>',zt={editSize:"auto",keyEvent:!0,stroke:"#836DFF",strokeWidth:2,pointFill:"#FFFFFF",pointSize:10,pointRadius:16,rotateGap:45,buttonsDirection:"bottom",buttonsMargin:12,hideOnSmall:!0,moveCursor:"move",resizeCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate({{rotation}},12,12)">\n<path d="M7.5 8.0H8.5V5.9L6.8 7.2L7.5 8.0ZM3 11.4L2.3 10.6L1.3 11.4L2.3 12.2L3 11.4ZM7.5 10.4H6.5V11.4H7.5V10.4ZM16.5 10.4V11.4H17.5V10.4H16.5ZM16.5 8.0L17.1 7.2L15.5 5.9V8.0H16.5ZM21 11.4L21.6 12.2L22.6 11.4L21.6 10.6L21 11.4ZM16.5 14.9H15.5V16.9L17.1 15.7L16.5 14.9ZM16.5 12.4H17.5V11.4H16.5V12.4ZM7.5 12.4V11.4H6.5V12.4H7.5ZM7.5 14.9L6.8 15.7L8.5 16.9V14.9H7.5ZM6.8 7.2L2.3 10.6L3.6 12.2L8.1 8.7L6.8 7.2ZM8.5 10.4V8.0H6.5V10.4H8.5ZM16.5 9.4H7.5V11.4H16.5V9.4ZM17.5 10.4V8.0H15.5V10.4H17.5ZM15.8 8.7L20.3 12.2L21.6 10.6L17.1 7.2L15.8 8.7ZM20.3 10.6L15.8 14.1L17.1 15.7L21.6 12.2L20.3 10.6ZM17.5 14.9V12.4H15.5V14.9H17.5ZM7.5 13.4H16.5V11.4H7.5V13.4ZM8.5 14.9V12.4H6.5V14.9H8.5ZM2.3 12.2L6.8 15.7L8.1 14.1L3.6 10.6L2.3 12.2Z" fill="white"/>\n<path fill-rule="evenodd" d="M3 11.4L7.5 8.0V10.4H16.5V8.0L21 11.4L16.5 14.9V12.4H7.5V14.9L3 11.4Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter id="f" x="-1.6" y="3.9" width="27.2" height="16.9" filterUnits="userSpaceOnUse">\n${Bt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},rotateCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate(135,12,12),rotate({{rotation}},12,12)">\n<path d="M20.4 8H21.4L20.8 7.1L17.3 2.6L17 2.1L16.6 2.6L13.1 7.1L12.5 8H13.5H15.4C14.9 11.8 11.8 14.9 8 15.4V13.5V12.5L7.1 13.1L2.6 16.6L2.1 17L2.6 17.3L7.1 20.8L8 21.4V20.4V18.4C13.5 17.9 17.9 13.5 18.4 8H20.4Z" stroke="white"/>\n<path fill-rule="evenodd" d="M17 3L20.4 7.5H17.9C17.7 13.1 13.1 17.7 7.5 17.9V20.4L3 17L7.5 13.5V15.9C12.0 15.7 15.7 12.0 15.9 7.5H13.5L17 3Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter id="f" x="-1.6" y="-0.6" width="27.1" height="27.1" filterUnits="userSpaceOnUse">\n${Bt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},skewCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate(90,12,12),rotate({{rotation}},12,12)">\n<path d="M21 10.4L21 11.4L23.8 11.4L21.6 9.6L21 10.4ZM17 10.4V11.4L17 11.4L17 10.4ZM15.5 6L16.1 5.2L14.5 3.9V6H15.5ZM15.5 8.4V9.4H16.5V8.4H15.5ZM6 8.4V7.4H5V8.4H6ZM6 10.4H5V11.4H6V10.4ZM7 14.4V13.4L7 13.4L7 14.4ZM3 14.4L3 13.4L0.1 13.4L2.3 15.2L3 14.4ZM8.5 18.9L7.8 19.7L9.5 21.0V18.9H8.5ZM8.5 16.4V15.4H7.5V16.4H8.5ZM19 16.4V17.4H20V16.4H19ZM19 14.4H20V13.4H19V14.4ZM21 9.4L17 9.4L17 11.4L21 11.4L21 9.4ZM14.8 6.7L20.3 11.2L21.6 9.6L16.1 5.2L14.8 6.7ZM16.5 8.4V6H14.5V8.4H16.5ZM6 9.4H15.5V7.4H6V9.4ZM7 10.4V8.4H5V10.4H7ZM15.5 9.4H6V11.4H15.5V9.4ZM17 9.4H15.5V11.4H17V9.4ZM7 15.4H8.5V13.4H7V15.4ZM3 15.4L7 15.4L7 13.4L3 13.4L3 15.4ZM9.1 18.1L3.6 13.6L2.3 15.2L7.8 19.7L9.1 18.1ZM7.5 16.4V18.9H9.5V16.4H7.5ZM19 15.4H8.5V17.4H19V15.4ZM18 14.4V16.4H20V14.4H18ZM8.5 15.4H19V13.4H8.5V15.4Z" fill="white"/>\n<path fill-rule="evenodd" d="M17 10.4L21 10.4L15.5 6V8.4H6V10.4H15.5H17ZM8.5 14.4H7L3 14.4L8.5 18.9V16.4H19V14.4H8.5Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter x="-2.8" y="1.9" width="29.6" height="23.1" filterUnits="userSpaceOnUse" >\n${Bt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},selector:!0,hover:!0,select:"press",boxSelect:!0,moveable:!0,resizeable:!0,rotateable:!0,skewable:!0};class Wt{constructor(){this.tag="EditTool"}onMove(t){const{moveX:e,moveY:i,editor:s}=t,{app:o,list:n}=s;o.lockLayout(),n.forEach((t=>{t.moveWorld(e,i)})),o.unlockLayout()}onScale(t){const{scaleX:e,scaleY:i,transform:s,worldOrigin:o,editor:n}=t,{app:r,list:a}=n;r.lockLayout(),a.forEach((t=>{const r="size"===n.getEditSize(t);s?t.transformWorld(s,r):t.scaleOfWorld(o,e,i,r)})),r.unlockLayout()}onRotate(t){const{rotation:e,transform:i,worldOrigin:s,editor:o}=t,{app:n,list:r}=o;n.lockLayout(),r.forEach((t=>{const n="size"===o.getEditSize(t);i?t.transformWorld(i,n):t.rotateOfWorld(s,e)})),n.unlockLayout()}onSkew(t){const{skewX:e,skewY:i,transform:s,worldOrigin:o,editor:n}=t,{app:r,list:a}=n;r.lockLayout(),a.forEach((t=>{const r="size"===n.getEditSize(t);s?t.transformWorld(s,r):t.skewOfWorld(o,e,i,r)})),r.unlockLayout()}update(t){const{simulateTarget:e,element:i}=t;t.multiple&&e.parent.updateLayout();const{x:s,y:o,scaleX:n,scaleY:r,rotation:a,skewX:l,skewY:h,width:c,height:d}=i.getLayoutBounds("box",t,!0);t.editBox.set({x:s,y:o,scaleX:n,scaleY:r,rotation:a,skewX:l,skewY:h}),t.editBox.update({x:0,y:0,width:c,height:d})}}Wt.list=[];const{left:It,right:Xt}=vt;class Yt extends Wt{constructor(){super(...arguments),this.tag="LineEditTool",this.scaleOfEvent=!0}onScaleWithDrag(t){const{drag:e,direction:i,lockRatio:s,around:o}=t,n=t.target,r=E(),{toPoint:a}=n;n.rotation=0;let{x:l,y:h}=e.getInnerMove(n);s&&(Math.abs(l)>Math.abs(h)?h=0:l=0),i===It?(r.x+=l,r.y+=h,o&&(a.x-=l,a.y-=h)):(o&&(r.x-=l,r.y-=h),a.x+=l,a.y+=h),n.getLocalPointByInner(r,null,null,!0),n.getLocalPointByInner(a,null,null,!0),n.x=r.x,n.y=r.y,n.getInnerPointByLocal(a,null,null,!0),n.toPoint=a}onSkew(t){}update(t){const{rotatePoints:e,resizeLines:i,resizePoints:s}=t.editBox;super.update(t);for(let t=0;t<8;t++)t<4&&(i[t].visible=!1),s[t].visible=e[t].visible=t===It||t===Xt}}const Ct=(t,e)=>t.parent.children.indexOf(t)-e.parent.children.indexOf(e),Ft=(t,e)=>e.parent.children.indexOf(e)-t.parent.children.indexOf(t),Kt={group(t,e,i){t.sort(Ft);const{app:s,parent:o}=t[0];let n;n=i&&i.add?i:new u(i),o.addAt(n,o.children.indexOf(t[0])),t.sort(Ct);const r=new V(e.worldTransform);return r.divideParent(o.worldTransform),n.setTransform(r),n.editable=!0,n.hitChildren=!1,s.lockLayout(),t.forEach((t=>t.dropTo(n))),s.unlockLayout(),n},ungroup(t){const{app:e}=t[0],i=[];return e.lockLayout(),t.forEach((t=>{if(t.isBranch){const{parent:e,children:s}=t;for(;s.length;)i.push(s[0]),s[0].dropTo(e,e.children.indexOf(t));t.remove()}else i.push(t)})),e.unlockLayout(),i},toTop(t){t.sort(Ct),t.forEach((t=>{t.parent&&t.parent.add(t)}))},toBottom(t){t.sort(Ft),t.forEach((t=>{t.parent&&t.parent.addAt(t,0)}))}};class Ut extends u{get list(){return this.leafList.list}get hasTarget(){return!!this.list.length}get multiple(){return this.list.length>1}get single(){return 1===this.list.length}get element(){return this.multiple?this.simulateTarget:this.list[0]}get buttons(){return this.editBox.buttons}get dragging(){return this.editBox.dragging}constructor(t,e){super(e),this.config=zt,this.leafList=new w,this.simulateTarget=new f({visible:!1}),this.editBox=new Zt(this),this.selector=new Lt(this),this.targetEventIds=[],t&&(this.config=H.default(t,this.config)),this.addMany(this.selector,this.editBox)}hasItem(t){return this.leafList.has(t)}addItem(t){this.hasItem(t)||t.locked||(this.leafList.add(t),this.target=this.leafList.list)}removeItem(t){this.hasItem(t)&&(this.leafList.remove(t),this.target=this.leafList.list)}shiftItem(t){this.hasItem(t)?this.removeItem(t):this.addItem(t)}update(){this.hasTarget&&(this.editTool&&this.editTool.update(this),this.selector.update())}updateEditTool(){this.editTool=function(t){if(1===t.length){const e=t[0];return e instanceof S&&!e.points?new Yt:new Wt}return new Wt}(this.list)}getEditSize(t){let{editSize:e}=this.config;return"auto"===e?t.editSize:e}onMove(t){const e=t.getLocalMove(this.element),{lockMove:i}=this.config;"x"===i?e.y=0:"y"===i?e.x=0:t.shiftKey&&(Math.abs(e.x)>Math.abs(e.y)?e.y=0:e.x=0),this.move(e.x,e.y)}onScale(t){const{element:e}=this,{direction:i}=t.current;let{around:s,lockRatio:o}=this.config;t.shiftKey&&(o=!0);const n=Ht.getScaleData(e.boxBounds,i,t.getInnerMove(e),o,Ht.getAround(s,t.altKey));this.editTool.onScaleWithDrag?(n.drag=t,this.scaleWithDrag(n)):this.scaleOf(n.origin,n.scaleX,n.scaleY)}onRotate(t){const{skewable:e,around:i,rotateGap:s}=this.config,{direction:o,name:n}=t.current;if(e&&"resize-line"===n)return this.onSkew(t);const{element:r}=this;let a,l;if(t instanceof T)l=t.rotation,a=r.getInnerPoint(t);else{const e={x:t.x-t.moveX,y:t.y-t.moveY},s=Ht.getRotateData(r.boxBounds,o,t.getInner(r),r.getInnerPoint(e),t.shiftKey?null:i||"center");l=s.rotation,a=s.origin}l=x.getGapRotation(l,s,r.rotation),l&&(r.scaleX*r.scaleY<0&&(l=-l),this.rotateOf(a,x.float(l,2)))}onSkew(t){const{element:e}=this,{around:i}=this.config,{origin:s,skewX:o,skewY:n}=Ht.getSkewData(e.boxBounds,t.current.direction,t.getInnerMove(e),Ht.getAround(i,t.altKey));(o||n)&&this.skewOf(s,o,n)}move(t,e){if(!this.config.moveable)return;const{element:i}=this,s=i.getWorldPointByLocal({x:t,y:e},null,!0),o=new et(et.MOVE,{target:i,editor:this,moveX:s.x,moveY:s.y});this.editTool.onMove(o),this.emitEvent(o),this.multiple&&i.move(t,e)}scaleWithDrag(t){const{element:e}=this,i=e.getWorldPoint(t.origin),s=new it(it.SCALE,Object.assign(Object.assign({},t),{target:e,editor:this,worldOrigin:i}));this.editTool.onScaleWithDrag(s),this.emitEvent(s)}scaleOf(t,e,i=e,s){const{element:o}=this,n=o.getWorldPoint(t);let r;if(this.multiple){const s=new V(o.worldTransform);o.scaleOf(t,e,i),r=new V(o.worldTransform).divide(s)}const a=new it(it.SCALE,{target:o,editor:this,worldOrigin:n,scaleX:e,scaleY:i,transform:r});this.editTool.onScale(a),this.emitEvent(a)}rotateOf(t,e){const{element:i}=this,s=i.getWorldPoint(t);let o;if(this.multiple){const s=new V(i.worldTransform);i.rotateOf(t,e),o=new V(i.worldTransform).divide(s)}const n=new st(st.ROTATE,{target:i,editor:this,worldOrigin:s,rotation:e,transform:o});this.editTool.onRotate(n),this.emitEvent(n)}skewOf(t,e,i=0,s){const{element:o}=this,n=o.getWorldPoint(t);let r;if(this.multiple){const s=new V(o.worldTransform);o.skewOf(t,e,i),r=new V(o.worldTransform).divide(s)}const a=new ot(ot.SKEW,{target:o,editor:this,skewX:e,skewY:i,transform:r,worldOrigin:n});this.editTool.onSkew(a),this.emitEvent(a)}group(t){return this.multiple&&(this.target=Kt.group(this.list,this.element,t)),this.target}ungroup(){return this.list.length&&(this.target=Kt.ungroup(this.list)),this.list}lock(){this.list.forEach((t=>t.locked=!0)),this.update()}unlock(){this.list.forEach((t=>t.locked=!1)),this.update()}toTop(){this.list.length&&(Kt.toTop(this.list),this.leafList.update())}toBottom(){this.list.length&&(Kt.toBottom(this.list),this.leafList.update())}listenTargetEvents(){if(!this.targetEventIds.length){const{leafer:t}=this.list[0];this.targetEventIds=[t.on_(O.START,this.update,this),t.on_([P.HOLD,P.UP],(t=>{Ot(this,t)})),t.on_(P.DOWN,this.editBox.onArrow,this.editBox)]}}removeTargetEvents(){const{targetEventIds:t}=this;t.length&&(this.off_(t),t.length=0)}destroy(){this.destroyed||(this.simulateTarget.destroy(),this.target=this.hoverTarget=this.simulateTarget=null,super.destroy())}}q([nt((function(t,e){t.emitEvent(new tt(tt.HOVER,{editor:t,value:t.hoverTarget,oldValue:e}))}))],Ut.prototype,"hoverTarget",void 0),q([nt((function(t,e){const{target:i}=t;i?t.leafList=i instanceof w?i:new w(i):t.leafList.reset(),t.emitEvent(new tt(tt.SELECT,{editor:t,value:i,oldValue:e})),t.hasTarget?t.waitLeafer((()=>{t.multiple&&function(t){const{simulateTarget:e,leafList:i}=t,{x:s,y:o,width:n,height:r}=(new y).setListWithFn(i.list,(t=>t.worldBoxBounds)),a=e.parent=i.list[0].leafer.zoomLayer,{scaleX:l,scaleY:h,e:c,f:d}=a.__world;e.reset({x:(s-c)/l,y:(o-d)/h,width:n/l,height:r/h})}(t),Pt(t),t.updateEditTool(),t.update(),t.listenTargetEvents()})):t.removeTargetEvents()}))],Ut.prototype,"target",void 0),D.editor=function(t){return new Ut(t)};export{Zt as EditBox,Ht as EditDataHelper,Rt as EditPoint,Lt as EditSelect,yt as EditSelectHelper,Wt as EditTool,Ut as Editor,tt as EditorEvent,Kt as EditorHelper,et as EditorMoveEvent,st as EditorRotateEvent,it as EditorScaleEvent,ot as EditorSkewEvent,Yt as LineEditTool,dt as SelectArea,ct as Stroker};
package/dist/editor.js CHANGED
@@ -179,7 +179,12 @@ this.LeaferIN.editor = (function (exports, draw, core) {
179
179
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
180
180
  };
181
181
 
182
+ function toList(value) {
183
+ return value ? (value instanceof Array ? value : [value]) : [];
184
+ }
182
185
  class EditorEvent extends core.Event {
186
+ get list() { return toList(this.value); }
187
+ get oldList() { return toList(this.oldValue); }
183
188
  constructor(type, data) {
184
189
  super(type);
185
190
  if (data)
@@ -386,45 +391,60 @@ this.LeaferIN.editor = (function (exports, draw, core) {
386
391
  this.targetStroker.forceUpdate();
387
392
  }
388
393
  onPointerMove(e) {
389
- if (this.running && !this.isMoveMode) {
394
+ const { app, editor } = this;
395
+ if (this.running && !this.isMoveMode && app.config.pointer.hover && !app.interaction.dragging) {
390
396
  const find = e.shiftKey ? this.findDeepOne(e) : findOne(e.path);
391
- this.editor.hoverTarget = this.editor.hasItem(find) ? null : find;
397
+ editor.hoverTarget = editor.hasItem(find) ? null : find;
392
398
  }
393
399
  if (this.isMoveMode) {
394
- this.editor.hoverTarget = null;
400
+ editor.hoverTarget = null;
395
401
  }
396
402
  }
397
403
  onBeforeDown(e) {
404
+ const { select } = this.editor.config;
405
+ if (select === 'press')
406
+ this.checkAndSelect(e, true);
407
+ }
408
+ onTap(e) {
409
+ const { editor } = this;
410
+ const { select, continuousSelect } = editor.config;
411
+ if (select === 'tap')
412
+ this.checkAndSelect(e);
413
+ if (this.running && (e.shiftKey || continuousSelect) && !e.middle && !this.lastDownLeaf) {
414
+ const find = this.findDeepOne(e);
415
+ if (find)
416
+ editor.shiftItem(find);
417
+ else if (!e.shiftKey && continuousSelect)
418
+ editor.target = null;
419
+ }
420
+ else if (this.isMoveMode) {
421
+ editor.target = null;
422
+ }
423
+ this.lastDownLeaf = null;
424
+ }
425
+ checkAndSelect(e, isDownType) {
398
426
  if (this.running && !this.isMoveMode && !e.middle) {
427
+ const { editor } = this;
399
428
  const find = this.lastDownLeaf = findOne(e.path);
400
429
  if (find) {
401
- if (e.shiftKey) {
402
- this.editor.shiftItem(find);
430
+ if (e.shiftKey || editor.config.continuousSelect) {
431
+ editor.shiftItem(find);
403
432
  }
404
433
  else {
405
- this.editor.target = find;
434
+ editor.target = find;
435
+ }
436
+ if (isDownType) {
437
+ editor.updateLayout();
438
+ if (!find.locked)
439
+ this.app.interaction.updateDownData(e, { findList: [editor.editBox.rect] }, editor.config.dualEvent);
406
440
  }
407
- this.editor.updateLayout();
408
- if (!find.locked)
409
- this.app.interaction.updateDownData(e, { findList: [this.editor.editBox.rect] }, this.editor.config.dualEvent);
410
441
  }
411
442
  else if (this.allow(e.target)) {
412
443
  if (!e.shiftKey)
413
- this.editor.target = null;
444
+ editor.target = null;
414
445
  }
415
446
  }
416
447
  }
417
- onTap(e) {
418
- if (this.running && e.shiftKey && !e.middle && !this.lastDownLeaf) {
419
- const find = this.findDeepOne(e);
420
- if (find)
421
- this.editor.shiftItem(find);
422
- }
423
- else if (this.isMoveMode) {
424
- this.editor.target = null;
425
- }
426
- this.lastDownLeaf = null;
427
- }
428
448
  onDragStart(e) {
429
449
  if (this.running && this.allowDrag(e)) {
430
450
  const { editor } = this;
@@ -590,10 +610,13 @@ this.LeaferIN.editor = (function (exports, draw, core) {
590
610
  origin = { x: 1, y: 0 };
591
611
  }
592
612
  if (lockRatio) {
593
- if (scaleX !== 1)
594
- scaleY = scaleX;
595
- else
596
- scaleX = scaleY;
613
+ const unlockSide = lockRatio === 'corner' && direction % 2;
614
+ if (!unlockSide) {
615
+ if (scaleY !== 1)
616
+ scaleX = scaleY;
617
+ else
618
+ scaleY = scaleX;
619
+ }
597
620
  }
598
621
  toPoint(around || origin, bounds, origin);
599
622
  return { origin, scaleX, scaleY, direction, lockRatio, around };
@@ -709,10 +732,13 @@ this.LeaferIN.editor = (function (exports, draw, core) {
709
732
  }
710
733
  };
711
734
 
735
+ const cacheCursors = {};
712
736
  function updateCursor(editor, e) {
713
737
  const { editBox } = editor, point = editBox.enterPoint;
714
738
  if (!point || !editor.hasTarget || !editBox.visible)
715
739
  return;
740
+ if (point.name === 'circle')
741
+ return;
716
742
  let { rotation } = editBox;
717
743
  const { resizeCursor, rotateCursor, skewCursor, resizeable, rotateable, skewable } = editor.config;
718
744
  const { pointType } = point, { flippedX, flippedY } = editBox;
@@ -722,8 +748,15 @@ this.LeaferIN.editor = (function (exports, draw, core) {
722
748
  const showSkew = skewable && !showResize && point.name === 'resize-line';
723
749
  const cursor = showSkew ? skewCursor : (showResize ? resizeCursor : rotateCursor);
724
750
  rotation += (EditDataHelper.getFlipDirection(point.direction, flippedX, flippedY) + 1) * 45;
751
+ rotation = Math.round(core.MathHelper.formatRotation(rotation, true) / 2) * 2;
725
752
  const { url, x, y } = cursor;
726
- point.cursor = { url: toDataURL(url, rotation), x, y };
753
+ const key = url + rotation;
754
+ if (cacheCursors[key]) {
755
+ point.cursor = cacheCursors[key];
756
+ }
757
+ else {
758
+ cacheCursors[key] = point.cursor = { url: toDataURL(url, rotation), x, y };
759
+ }
727
760
  }
728
761
  function updateMoveCursor(editor) {
729
762
  editor.editBox.rect.cursor = editor.config.moveCursor;
@@ -780,10 +813,11 @@ this.LeaferIN.editor = (function (exports, draw, core) {
780
813
  const { config, list } = this.editor;
781
814
  const { width, height } = bounds;
782
815
  const { rect, circle, resizePoints, rotatePoints, resizeLines } = this;
783
- const { middlePoint, resizeable, rotateable, stroke, strokeWidth } = config;
816
+ const { middlePoint, resizeable, rotateable, stroke, strokeWidth, hideOnSmall } = config;
784
817
  const pointsStyle = this.getPointsStyle();
785
818
  const middlePointsStyle = this.getMiddlePointsStyle();
786
- const showPoints = width > 20 || height > 20;
819
+ const smallSize = typeof hideOnSmall === 'number' ? hideOnSmall : 10;
820
+ const showPoints = !(hideOnSmall && width < smallSize && height < smallSize);
787
821
  this.visible = list[0] && !list[0].locked;
788
822
  let point = {}, style, rotateP, resizeP, resizeL;
789
823
  for (let i = 0; i < 8; i++) {
@@ -793,7 +827,7 @@ this.LeaferIN.editor = (function (exports, draw, core) {
793
827
  resizeP.set(style);
794
828
  resizeP.set(point), rotateP.set(point), resizeL.set(point);
795
829
  resizeP.visible = resizeL.visible = showPoints && (resizeable || rotateable);
796
- rotateP.visible = showPoints && rotateable && resizeable;
830
+ rotateP.visible = showPoints && rotateable && resizeable && !config.rotatePoint;
797
831
  if (i % 2) {
798
832
  resizeP.visible = rotateP.visible = showPoints && !!middlePoint;
799
833
  if (((i + 1) / 2) % 2) {
@@ -881,11 +915,11 @@ this.LeaferIN.editor = (function (exports, draw, core) {
881
915
  if (point.pointType === 'rotate' || e.metaKey || e.ctrlKey || !editor.config.resizeable) {
882
916
  if (editor.config.rotateable)
883
917
  editor.onRotate(e);
884
- updateCursor(editor, e);
885
918
  }
886
919
  else {
887
920
  editor.onScale(e);
888
921
  }
922
+ updateCursor(editor, e);
889
923
  }
890
924
  onArrow(e) {
891
925
  if (this.editor.hasTarget && this.editor.config.keyEvent) {
@@ -1007,12 +1041,14 @@ ${filterStyle}
1007
1041
  rotateGap: 45,
1008
1042
  buttonsDirection: 'bottom',
1009
1043
  buttonsMargin: 12,
1044
+ hideOnSmall: true,
1010
1045
  moveCursor: 'move',
1011
1046
  resizeCursor: { url: resizeSVG, x: 12, y: 12 },
1012
1047
  rotateCursor: { url: rotateSVG, x: 12, y: 12 },
1013
1048
  skewCursor: { url: skewSVG, x: 12, y: 12 },
1014
1049
  selector: true,
1015
1050
  hover: true,
1051
+ select: 'press',
1016
1052
  boxSelect: true,
1017
1053
  moveable: true,
1018
1054
  resizeable: true,
@@ -1308,7 +1344,12 @@ ${filterStyle}
1308
1344
  }
1309
1345
  onMove(e) {
1310
1346
  const move = e.getLocalMove(this.element);
1311
- if (e.shiftKey) {
1347
+ const { lockMove } = this.config;
1348
+ if (lockMove === 'x')
1349
+ move.y = 0;
1350
+ else if (lockMove === 'y')
1351
+ move.x = 0;
1352
+ else if (e.shiftKey) {
1312
1353
  if (Math.abs(move.x) > Math.abs(move.y))
1313
1354
  move.y = 0;
1314
1355
  else
@@ -1 +1 @@
1
- this.LeaferIN=this.LeaferIN||{},this.LeaferIN.editor=function(t,e,i){"use strict";const{M:s,L:o,C:n,Q:r,Z:a,N:l,D:h,X:d,G:c,F:g,O:u,P:f,U:p}=e.PathCommandMap,v={scale(t,e,i){if(!t)return;let v,y=0,w=t.length;for(;y<w;)switch(v=t[y],v){case s:case o:L(t,e,i,y,1),y+=3;break;case n:L(t,e,i,y,3),y+=7;break;case r:L(t,e,i,y,2),y+=5;break;case a:y+=1;break;case l:L(t,e,i,y,2),y+=5;break;case h:L(t,e,i,y,2),y+=9;break;case d:L(t,e,i,y,2),y+=6;break;case c:L(t,e,i,y,2),y+=9;break;case g:L(t,e,i,y,2),y+=5;break;case u:t[y]=c,t.splice(y+4,0,t[y+3],0),L(t,e,i,y,2),y+=9,w+=2;break;case f:t[y]=g,t.splice(y+4,0,t[y+3]),L(t,e,i,y,2),y+=5,w+=1;break;case p:L(t,e,i,y,2),y+=6}},scalePoints(t,e,i,s,o){for(let n=o?s+1:0,r=o?n+2*o:t.length;n<r;n+=2)t[n]*=e,t[n+1]*=i}},{scalePoints:L}=v;function y(t,e,i){1!==e&&(t.width*=e),1!==i&&(t.height*=i)}e.Leaf.prototype.scaleResize=function(t,e=t,i){const s=this;i?(s.scaleX*=t,s.scaleY*=e):(t<0&&(s.scaleX*=-1,t=-t),e<0&&(s.scaleY*=-1,e=-e),this.__scaleResize(t,e))},e.Leaf.prototype.__scaleResize=function(t,e){y(this,t,e)},e.Path.prototype.__scaleResize=function(t,e){v.scale(this.__.path,t,e),this.path=this.__.path},e.Line.prototype.__scaleResize=function(t,e){if(this.points)v.scalePoints(this.__.points,t,e),this.points=this.__.points;else{const i=this.toPoint;i.x*=t,i.y*=e,this.toPoint=i}},e.Polygon.prototype.__scaleResize=function(t,e){this.points?(v.scalePoints(this.__.points,t,e),this.points=this.__.points):y(this,t,e)};const w=e.MatrixHelper.get();function _(t,e,i){const{children:s}=t;for(let t=0;t<s.length;t++)w.a=e,w.d=i,s[t].transform(w,!0)}function k(t,e,i,s){var o,n=arguments.length,r=n<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,i,s);else for(var a=t.length-1;a>=0;a--)(o=t[a])&&(r=(n<3?o(r):n>3?o(e,i,r):o(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r}e.Group.prototype.__scaleResize=function(t,e){_(this,t,e)},e.Box.prototype.__scaleResize=function(t,e){this.__.__autoSize&&this.children.length?_(this,t,e):y(this,t,e)},"function"==typeof SuppressedError&&SuppressedError;class x extends i.Event{constructor(t,e){super(t),e&&Object.assign(this,e)}}x.SELECT="editor.select",x.HOVER="editor.hover";class b extends x{constructor(t,e){super(t,e)}}b.MOVE="editor.move";class m extends x{constructor(t,e){super(t,e)}}m.SCALE="editor.scale";class E extends x{constructor(t,e){super(t,e)}}E.ROTATE="editor.rotate";class M extends x{constructor(t,e){super(t,e)}}function H(t){return(e,s)=>{const o="_"+s;i.defineKey(e,s,{get(){return this[o]},set(e){const i=this[o];i!==e&&(this[o]=e,t(this,i))}})}}M.SKEW="editor.skew";const S=i.MatrixHelper.get(),{abs:V}=Math,{copy:P,scale:T}=i.MatrixHelper;class D extends i.UI{constructor(){super(),this.list=[],this.hittable=!1,this.strokeAlign="center"}setTarget(t,e){const{stroke:i,strokeWidth:s}=e;this.set({stroke:i,strokeWidth:s}),this.target=t}__draw(t,e){const{list:s}=this;if(s.length){let o;const{stroke:n,strokeWidth:r}=this.__,{bounds:a}=e;for(let l=0;l<s.length;l++)if(o=s[l],a&&a.hit(o.__world,e.matrix)){let s;if("scale"===o.__.editSize){const i=V(o.__world.scaleX),n=V(o.__world.scaleY);if(i!==n){P(S,o.__world),T(S,1/i,1/n),t.setWorld(S,e.matrix),t.beginPath(),this.__.strokeWidth=r;const{x:a,y:l,width:h,height:d}=o.__layout.boxBounds;t.rect(a*i,l*n,h*i,d*n),s=!0}}s||(t.setWorld(o.__world,e.matrix),t.beginPath(),o.__.__useArrow?o.__drawPath(t):o.__.__pathForRender?o.__drawRenderPath(t):o.__drawPathByBox(t),this.__.strokeWidth=r/V(o.__world.scaleX)),"string"==typeof n?i.Paint.stroke(n,this,t):i.Paint.strokes(n,this,t)}this.__.strokeWidth=r}}destroy(){this.target=null,super.destroy()}}k([H((function(t){const e=t.target;t.list=e?e instanceof Array?e:[e]:[],t.forceUpdate()}))],D.prototype,"target",void 0);class O extends i.Group{constructor(t){super(t),this.strokeArea=new i.Rect({strokeAlign:"center"}),this.fillArea=new i.Rect,this.visible=this.hittable=!1,this.addMany(this.fillArea,this.strokeArea)}setStyle(t,e){const{visible:i,stroke:s,strokeWidth:o}=t;this.visible=i,this.strokeArea.reset(Object.assign({stroke:s,strokeWidth:o},e||{})),this.fillArea.reset({visible:!e,fill:s,opacity:.2})}setBounds(t){this.strokeArea.set(t),this.fillArea.set(t)}}const{No:R,Yes:A,NoAndSkip:B,YesAndSkip:Z}=i.Answer,z={findOne:t=>t.list.find((t=>t.editable)),findBounds(t,e){if(t.__.hittable&&t.__.visible&&!t.__.locked&&e.hit(t.__world)){if(t.__.editable){if(t.isBranch&&!t.__.hitChildren)return t.__.hitSelf?Z:B;if(t.isFrame)return e.includes(t.__layout.boxBounds,t.__world)?Z:R;if(e.hit(t.__layout.boxBounds,t.__world)&&t.__.hitSelf)return A}return R}return t.isBranch?B:R}},{findOne:I}=z;class W extends i.Group{get dragging(){return!!this.originList}get running(){return this.editor.hittable&&this.editor.config.selector}get isMoveMode(){return this.app&&this.app.interaction.moveMode}constructor(t){super(),this.hoverStroker=new D,this.targetStroker=new D,this.bounds=new i.Bounds,this.selectArea=new O,this.__eventIds=[],this.editor=t,this.addMany(this.targetStroker,this.hoverStroker,this.selectArea),this.__listenEvents()}onHover(){const{editor:t}=this;if(!this.running||this.dragging||t.dragging)this.hoverStroker.target=null;else{const{stroke:e,strokeWidth:i,hover:s}=t.config;this.hoverStroker.setTarget(s?this.editor.hoverTarget:null,{stroke:e,strokeWidth:i})}}onSelect(){if(this.running){const{config:t,list:e}=this.editor,{stroke:i,strokeWidth:s}=t;this.targetStroker.setTarget(e,{stroke:i,strokeWidth:Math.max(1,s/2)}),this.hoverStroker.target=null}}update(){this.running&&this.targetStroker.forceUpdate()}onPointerMove(t){if(this.running&&!this.isMoveMode){const e=t.shiftKey?this.findDeepOne(t):I(t.path);this.editor.hoverTarget=this.editor.hasItem(e)?null:e}this.isMoveMode&&(this.editor.hoverTarget=null)}onBeforeDown(t){if(this.running&&!this.isMoveMode&&!t.middle){const e=this.lastDownLeaf=I(t.path);e?(t.shiftKey?this.editor.shiftItem(e):this.editor.target=e,this.editor.updateLayout(),e.locked||this.app.interaction.updateDownData(t,{findList:[this.editor.editBox.rect]},this.editor.config.dualEvent)):this.allow(t.target)&&(t.shiftKey||(this.editor.target=null))}}onTap(t){if(this.running&&t.shiftKey&&!t.middle&&!this.lastDownLeaf){const e=this.findDeepOne(t);e&&this.editor.shiftItem(e)}else this.isMoveMode&&(this.editor.target=null);this.lastDownLeaf=null}onDragStart(t){if(this.running&&this.allowDrag(t)){const{editor:e}=this,{stroke:i,strokeWidth:s,area:o}=e.config,{x:n,y:r}=t.getInner(this);this.bounds.set(n,r),this.selectArea.setStyle({visible:!0,stroke:i,strokeWidth:s,x:n,y:r},o),this.selectArea.setBounds(this.bounds.get()),this.originList=e.leafList.clone()}}onDrag(t){if(this.editor.dragging)this.onDragEnd();else if(this.dragging){const{editor:e}=this,s=t.getInnerTotal(this),o=this.bounds.clone().unsign(),n=new i.LeafList(e.app.find(z.findBounds,o));if(this.bounds.width=s.x,this.bounds.height=s.y,this.selectArea.setBounds(o.get()),n.length){const t=[];this.originList.forEach((e=>{n.has(e)||t.push(e)})),n.forEach((e=>{this.originList.has(e)||t.push(e)})),(t.length!==e.list.length||e.list.some(((e,i)=>e!==t[i])))&&(e.target=t)}else e.target=this.originList.list}}onDragEnd(){this.dragging&&(this.originList=null,this.selectArea.visible=!1)}onAutoMove(t){if(this.dragging){const{x:e,y:i}=t.getLocalMove(this);this.bounds.x+=e,this.bounds.y+=i}}allow(t){return t.leafer!==this.editor.leafer}allowDrag(t){return!(!this.editor.config.boxSelect||t.target.draggable)&&(!this.editor.hasTarget&&this.allow(t.target)||t.shiftKey&&!I(t.path))}findDeepOne(t){const e={exclude:new i.LeafList(this.editor.editBox.rect)};return I(t.target.leafer.interaction.findPath(t,e))}__listenEvents(){const{editor:t}=this;t.waitLeafer((()=>{const{app:e}=t;e.selector.proxy=t,this.__eventIds=[t.on_(x.HOVER,this.onHover,this),t.on_(x.SELECT,this.onSelect,this),e.on_(i.PointerEvent.MOVE,this.onPointerMove,this),e.on_(i.PointerEvent.BEFORE_DOWN,this.onBeforeDown,this),e.on_(i.PointerEvent.TAP,this.onTap,this),e.on_(i.DragEvent.START,this.onDragStart,this),e.on_(i.DragEvent.DRAG,this.onDrag,this),e.on_(i.DragEvent.END,this.onDragEnd,this),e.on_(i.MoveEvent.MOVE,this.onAutoMove,this),e.on_([i.ZoomEvent.ZOOM,i.MoveEvent.MOVE],(()=>{this.editor.hoverTarget=null}))]}))}__removeListenEvents(){this.__eventIds&&(this.off_(this.__eventIds),this.__eventIds.length=0)}destroy(){this.editor=this.originList=this.lastDownLeaf=null,this.__removeListenEvents(),super.destroy()}}var C;!function(t){t[t.topLeft=0]="topLeft",t[t.top=1]="top",t[t.topRight=2]="topRight",t[t.right=3]="right",t[t.bottomRight=4]="bottomRight",t[t.bottom=5]="bottom",t[t.bottomLeft=6]="bottomLeft",t[t.left=7]="left"}(C||(C={}));const{topLeft:X,top:Y,topRight:K,right:F,bottomRight:G,bottom:U,bottomLeft:N,left:j}=C,{toPoint:$}=i.AroundHelper,Q={getScaleData(t,e,i,s,o){let n,r=1,a=1;const{width:l,height:h}=t;o&&(i.x*=2,i.y*=2),Math.abs(i.x)===l&&(i.x+=.1),Math.abs(i.y)===h&&(i.y+=.1);const d=(-i.y+h)/h,c=(i.x+l)/l,g=(i.y+h)/h,u=(-i.x+l)/l;switch(e){case Y:a=d,n={x:.5,y:1};break;case F:r=c,n={x:0,y:.5};break;case U:a=g,n={x:.5,y:0};break;case j:r=u,n={x:1,y:.5};break;case X:a=d,r=u,n={x:1,y:1};break;case K:a=d,r=c,n={x:0,y:1};break;case G:a=g,r=c,n={x:0,y:0};break;case N:a=g,r=u,n={x:1,y:0}}return s&&(1!==r?a=r:r=a),$(o||n,t,n),{origin:n,scaleX:r,scaleY:a,direction:e,lockRatio:s,around:o}},getRotateData(t,e,s,o,n){let r;switch(e){case X:r={x:1,y:1};break;case K:r={x:0,y:1};break;case G:r={x:0,y:0};break;case N:r={x:1,y:0};break;default:r={x:.5,y:.5}}return $(n||r,t,r),{origin:r,rotation:i.PointHelper.getRotation(o,r,s)}},getSkewData(t,e,s,o){let n,r,a=0,l=0;switch(e){case Y:r={x:.5,y:0},n={x:.5,y:1},a=1;break;case U:r={x:.5,y:1},n={x:.5,y:0},a=1;break;case j:r={x:0,y:.5},n={x:1,y:.5},l=1;break;case F:r={x:1,y:.5},n={x:0,y:.5},l=1}const{x:h,y:d,width:c,height:g}=t;r.x=h+r.x*c,r.y=d+r.y*g,$(o||n,t,n);const u=i.PointHelper.getRotation(r,n,{x:r.x+(a?s.x:0),y:r.y+(l?s.y:0)});return a?a=-u:l=u,{origin:n,skewX:a,skewY:l}},getAround:(t,e)=>e&&!t?"center":t,getRotateDirection:(t,e,i=8)=>((t=(t+Math.round(e/(360/i)))%i)<0&&(t+=i),t),getFlipDirection(t,e,i){if(e)switch(t){case j:t=F;break;case X:t=K;break;case N:t=G;break;case F:t=j;break;case K:t=X;break;case G:t=N}if(i)switch(t){case Y:t=U;break;case X:t=N;break;case K:t=G;break;case U:t=Y;break;case N:t=X;break;case G:t=K}return t}};function q(t,e){const{editBox:i}=t,s=i.enterPoint;if(!s||!t.hasTarget||!i.visible)return;let{rotation:o}=i;const{resizeCursor:n,rotateCursor:r,skewCursor:a,resizeable:l,rotateable:h,skewable:d}=t.config,{pointType:c}=s,{flippedX:g,flippedY:u}=i;let f="resize"===c;f&&h&&(e.metaKey||e.ctrlKey||!l)&&(f=!1);const p=d&&!f&&"resize-line"===s.name?a:f?n:r;o+=45*(Q.getFlipDirection(s.direction,g,u)+1);const{url:v,x:L,y:y}=p;s.cursor={url:tt(v,o),x:L,y:y}}function J(t){t.editBox.rect.cursor=t.config.moveCursor}function tt(t,e){return'"data:image/svg+xml,'+encodeURIComponent(t.replace("{{rotation}}",e.toString()))+'"'}class et extends i.Box{}const it=["top","right","bottom","left"];class st extends i.Group{get flipped(){return this.flippedX||this.flippedY}get flippedX(){return this.scaleX<0}get flippedY(){return this.scaleY<0}get flippedOne(){return this.scaleX*this.scaleY<0}constructor(t){super(),this.rect=new i.Box({name:"rect",hitFill:"all",hitStroke:"none",strokeAlign:"center",hitRadius:5}),this.circle=new et({name:"circle",strokeAlign:"center",around:"center",cursor:"crosshair",hitRadius:5}),this.buttons=new i.Group({around:"center",hitSelf:!1}),this.resizePoints=[],this.rotatePoints=[],this.resizeLines=[],this.__eventIds=[],this.editor=t,this.visible=!1,this.create(),this.__listenEvents()}create(){let t,e,i;const{resizePoints:s,rotatePoints:o,resizeLines:n,rect:r,circle:a,buttons:l}=this,h=[{x:1,y:1},{x:.5,y:1},{x:0,y:1},{x:0,y:.5},{x:0,y:0},{x:.5,y:0},{x:1,y:0},{x:1,y:.5}];for(let r=0;r<8;r++)t=new et({name:"rotate-point",around:h[r],width:15,height:15,hitFill:"all"}),o.push(t),this.listenPointEvents(t,"rotate",r),r%2&&(e=new et({name:"resize-line",around:"center",width:10,height:10,hitFill:"all"}),n.push(e),this.listenPointEvents(e,"resize",r)),i=new et({name:"resize-point",around:"center",strokeAlign:"center",hitRadius:5}),s.push(i),this.listenPointEvents(i,"resize",r);l.add(a),this.listenPointEvents(a,"rotate",2),this.addMany(...o,r,l,...n,...s)}update(t){const{config:e,list:s}=this.editor,{width:o,height:n}=t,{rect:r,circle:a,resizePoints:l,rotatePoints:h,resizeLines:d}=this,{middlePoint:c,resizeable:g,rotateable:u,stroke:f,strokeWidth:p}=e,v=this.getPointsStyle(),L=this.getMiddlePointsStyle(),y=o>20||n>20;this.visible=s[0]&&!s[0].locked;let w,_,k,x,b={};for(let e=0;e<8;e++)i.AroundHelper.toPoint(i.AroundHelper.directionData[e],t,b),w=this.getPointStyle(e%2?L[(e-1)/2%L.length]:v[e/2%v.length]),k=l[e],_=h[e],x=d[Math.floor(e/2)],k.set(w),k.set(b),_.set(b),x.set(b),k.visible=x.visible=y&&(g||u),_.visible=y&&u&&g,e%2?(k.visible=_.visible=y&&!!c,(e+1)/2%2?(x.width=o,k.width>o-30&&(k.visible=!1)):(x.height=n,k.rotation=90,k.width>n-30&&(k.visible=!1))):k.rotation=e/2*90;a.visible=y&&u&&!!e.rotatePoint,a.set(this.getPointStyle(e.rotatePoint||v[0])),r.set(Object.assign({stroke:f,strokeWidth:p},e.rect||{})),r.set(Object.assign(Object.assign({},t),{visible:!0})),r.hittable=e.moveable,this.buttons.visible=y,this.layoutButtons()}layoutButtons(){const{buttons:t,resizePoints:e}=this,{buttonsDirection:i,buttonsFixed:s,buttonsMargin:o,middlePoint:n}=this.editor.config,{flippedX:r,flippedY:a}=this;let l=it.indexOf(i);(l%2&&r||(l+1)%2&&a)&&s&&(l=(l+2)%4);const h=s?Q.getRotateDirection(l,this.flippedOne?this.rotation:-this.rotation,4):l,d=e[2*h+1],c=h%2,g=h&&3!==h?1:-1,u=(o+(l%2?(n?d.width:0)+t.boxBounds.width:(n?d.height:0)+t.boxBounds.height)/2)*g;c?(t.x=d.x+u,t.y=d.y):(t.x=d.x,t.y=d.y+u),s&&(t.rotation=90*(h-l),t.scaleX=r?-1:1,t.scaleY=a?-1:1)}getPointStyle(t){const{stroke:e,strokeWidth:i,pointFill:s,pointSize:o,pointRadius:n}=this.editor.config,r={fill:s,stroke:e,strokeWidth:i,width:o,height:o,cornerRadius:n};return t?Object.assign(r,t):r}getPointsStyle(){const{point:t}=this.editor.config;return t instanceof Array?t:[t]}getMiddlePointsStyle(){const{middlePoint:t}=this.editor.config;return t instanceof Array?t:t?[t]:this.getPointsStyle()}onDragStart(t){this.dragging=!0,"rect"===t.target.name&&(this.moving=!0,this.editor.opacity=this.editor.config.hideOnMove?0:1)}onDragEnd(t){this.dragging=!1,this.moving=!1,"rect"===t.target.name&&(this.editor.opacity=1)}onDrag(t){const{editor:e}=this;"rotate"===(this.enterPoint=t.current).pointType||t.metaKey||t.ctrlKey||!e.config.resizeable?(e.config.rotateable&&e.onRotate(t),q(e,t)):e.onScale(t)}onArrow(t){if(this.editor.hasTarget&&this.editor.config.keyEvent){const e={x:0,y:0},i=t.shiftKey?10:1;switch(t.code){case"ArrowDown":e.y=i;break;case"ArrowUp":e.y=-i;break;case"ArrowLeft":e.x=-i;break;case"ArrowRight":e.x=i}(e.x||e.y)&&this.editor.move(e.x,e.y)}}onDoubleClick(){const{editor:t}=this;t.single&&t.element.isBranch}listenPointEvents(t,e,s){const{editor:o}=this;t.direction=s,t.pointType=e,t.on_(i.DragEvent.START,this.onDragStart,this),t.on_(i.DragEvent.DRAG,this.onDrag,this),t.on_(i.DragEvent.END,this.onDragEnd,this),t.on_(i.PointerEvent.LEAVE,(()=>this.enterPoint=null)),"circle"!==t.name&&t.on_(i.PointerEvent.ENTER,(e=>{this.enterPoint=t,q(o,e)}))}__listenEvents(){const{rect:t,editor:e}=this;this.__eventIds=[e.on_(x.SELECT,(()=>{this.visible=e.hasTarget})),t.on_(i.DragEvent.START,this.onDragStart,this),t.on_(i.DragEvent.DRAG,e.onMove,e),t.on_(i.DragEvent.END,this.onDragEnd,this),t.on_(i.PointerEvent.ENTER,(()=>J(e))),t.on_(i.PointerEvent.DOUBLE_CLICK,this.onDoubleClick,this)]}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(){this.editor=null,this.__removeListenEvents(),super.destroy()}}const ot='\n<feOffset dy="1"/>\n<feGaussianBlur stdDeviation="1.5"/>\n<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"/>\n<feBlend mode="normal" in="SourceGraphic" result="shape"/>',nt={editSize:"auto",keyEvent:!0,stroke:"#836DFF",strokeWidth:2,pointFill:"#FFFFFF",pointSize:10,pointRadius:16,rotateGap:45,buttonsDirection:"bottom",buttonsMargin:12,moveCursor:"move",resizeCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate({{rotation}},12,12)">\n<path d="M7.5 8.0H8.5V5.9L6.8 7.2L7.5 8.0ZM3 11.4L2.3 10.6L1.3 11.4L2.3 12.2L3 11.4ZM7.5 10.4H6.5V11.4H7.5V10.4ZM16.5 10.4V11.4H17.5V10.4H16.5ZM16.5 8.0L17.1 7.2L15.5 5.9V8.0H16.5ZM21 11.4L21.6 12.2L22.6 11.4L21.6 10.6L21 11.4ZM16.5 14.9H15.5V16.9L17.1 15.7L16.5 14.9ZM16.5 12.4H17.5V11.4H16.5V12.4ZM7.5 12.4V11.4H6.5V12.4H7.5ZM7.5 14.9L6.8 15.7L8.5 16.9V14.9H7.5ZM6.8 7.2L2.3 10.6L3.6 12.2L8.1 8.7L6.8 7.2ZM8.5 10.4V8.0H6.5V10.4H8.5ZM16.5 9.4H7.5V11.4H16.5V9.4ZM17.5 10.4V8.0H15.5V10.4H17.5ZM15.8 8.7L20.3 12.2L21.6 10.6L17.1 7.2L15.8 8.7ZM20.3 10.6L15.8 14.1L17.1 15.7L21.6 12.2L20.3 10.6ZM17.5 14.9V12.4H15.5V14.9H17.5ZM7.5 13.4H16.5V11.4H7.5V13.4ZM8.5 14.9V12.4H6.5V14.9H8.5ZM2.3 12.2L6.8 15.7L8.1 14.1L3.6 10.6L2.3 12.2Z" fill="white"/>\n<path fill-rule="evenodd" d="M3 11.4L7.5 8.0V10.4H16.5V8.0L21 11.4L16.5 14.9V12.4H7.5V14.9L3 11.4Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter id="f" x="-1.6" y="3.9" width="27.2" height="16.9" filterUnits="userSpaceOnUse">\n${ot}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},rotateCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate(135,12,12),rotate({{rotation}},12,12)">\n<path d="M20.4 8H21.4L20.8 7.1L17.3 2.6L17 2.1L16.6 2.6L13.1 7.1L12.5 8H13.5H15.4C14.9 11.8 11.8 14.9 8 15.4V13.5V12.5L7.1 13.1L2.6 16.6L2.1 17L2.6 17.3L7.1 20.8L8 21.4V20.4V18.4C13.5 17.9 17.9 13.5 18.4 8H20.4Z" stroke="white"/>\n<path fill-rule="evenodd" d="M17 3L20.4 7.5H17.9C17.7 13.1 13.1 17.7 7.5 17.9V20.4L3 17L7.5 13.5V15.9C12.0 15.7 15.7 12.0 15.9 7.5H13.5L17 3Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter id="f" x="-1.6" y="-0.6" width="27.1" height="27.1" filterUnits="userSpaceOnUse">\n${ot}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},skewCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate(90,12,12),rotate({{rotation}},12,12)">\n<path d="M21 10.4L21 11.4L23.8 11.4L21.6 9.6L21 10.4ZM17 10.4V11.4L17 11.4L17 10.4ZM15.5 6L16.1 5.2L14.5 3.9V6H15.5ZM15.5 8.4V9.4H16.5V8.4H15.5ZM6 8.4V7.4H5V8.4H6ZM6 10.4H5V11.4H6V10.4ZM7 14.4V13.4L7 13.4L7 14.4ZM3 14.4L3 13.4L0.1 13.4L2.3 15.2L3 14.4ZM8.5 18.9L7.8 19.7L9.5 21.0V18.9H8.5ZM8.5 16.4V15.4H7.5V16.4H8.5ZM19 16.4V17.4H20V16.4H19ZM19 14.4H20V13.4H19V14.4ZM21 9.4L17 9.4L17 11.4L21 11.4L21 9.4ZM14.8 6.7L20.3 11.2L21.6 9.6L16.1 5.2L14.8 6.7ZM16.5 8.4V6H14.5V8.4H16.5ZM6 9.4H15.5V7.4H6V9.4ZM7 10.4V8.4H5V10.4H7ZM15.5 9.4H6V11.4H15.5V9.4ZM17 9.4H15.5V11.4H17V9.4ZM7 15.4H8.5V13.4H7V15.4ZM3 15.4L7 15.4L7 13.4L3 13.4L3 15.4ZM9.1 18.1L3.6 13.6L2.3 15.2L7.8 19.7L9.1 18.1ZM7.5 16.4V18.9H9.5V16.4H7.5ZM19 15.4H8.5V17.4H19V15.4ZM18 14.4V16.4H20V14.4H18ZM8.5 15.4H19V13.4H8.5V15.4Z" fill="white"/>\n<path fill-rule="evenodd" d="M17 10.4L21 10.4L15.5 6V8.4H6V10.4H15.5H17ZM8.5 14.4H7L3 14.4L8.5 18.9V16.4H19V14.4H8.5Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter x="-2.8" y="1.9" width="29.6" height="23.1" filterUnits="userSpaceOnUse" >\n${ot}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},selector:!0,hover:!0,boxSelect:!0,moveable:!0,resizeable:!0,rotateable:!0,skewable:!0};class rt{constructor(){this.tag="EditTool"}onMove(t){const{moveX:e,moveY:i,editor:s}=t,{app:o,list:n}=s;o.lockLayout(),n.forEach((t=>{t.moveWorld(e,i)})),o.unlockLayout()}onScale(t){const{scaleX:e,scaleY:i,transform:s,worldOrigin:o,editor:n}=t,{app:r,list:a}=n;r.lockLayout(),a.forEach((t=>{const r="size"===n.getEditSize(t);s?t.transformWorld(s,r):t.scaleOfWorld(o,e,i,r)})),r.unlockLayout()}onRotate(t){const{rotation:e,transform:i,worldOrigin:s,editor:o}=t,{app:n,list:r}=o;n.lockLayout(),r.forEach((t=>{const n="size"===o.getEditSize(t);i?t.transformWorld(i,n):t.rotateOfWorld(s,e)})),n.unlockLayout()}onSkew(t){const{skewX:e,skewY:i,transform:s,worldOrigin:o,editor:n}=t,{app:r,list:a}=n;r.lockLayout(),a.forEach((t=>{const r="size"===n.getEditSize(t);s?t.transformWorld(s,r):t.skewOfWorld(o,e,i,r)})),r.unlockLayout()}update(t){const{simulateTarget:e,element:i}=t;t.multiple&&e.parent.updateLayout();const{x:s,y:o,scaleX:n,scaleY:r,rotation:a,skewX:l,skewY:h,width:d,height:c}=i.getLayoutBounds("box",t,!0);t.editBox.set({x:s,y:o,scaleX:n,scaleY:r,rotation:a,skewX:l,skewY:h}),t.editBox.update({x:0,y:0,width:d,height:c})}}rt.list=[];const{left:at,right:lt}=C;class ht extends rt{constructor(){super(...arguments),this.tag="LineEditTool",this.scaleOfEvent=!0}onScaleWithDrag(t){const{drag:e,direction:s,lockRatio:o,around:n}=t,r=t.target,a=i.getPointData(),{toPoint:l}=r;r.rotation=0;let{x:h,y:d}=e.getInnerMove(r);o&&(Math.abs(h)>Math.abs(d)?d=0:h=0),s===at?(a.x+=h,a.y+=d,n&&(l.x-=h,l.y-=d)):(n&&(a.x-=h,a.y-=d),l.x+=h,l.y+=d),r.getLocalPointByInner(a,null,null,!0),r.getLocalPointByInner(l,null,null,!0),r.x=a.x,r.y=a.y,r.getInnerPointByLocal(l,null,null,!0),r.toPoint=l}onSkew(t){}update(t){const{rotatePoints:e,resizeLines:i,resizePoints:s}=t.editBox;super.update(t);for(let t=0;t<8;t++)t<4&&(i[t].visible=!1),s[t].visible=e[t].visible=t===at||t===lt}}const dt=(t,e)=>t.parent.children.indexOf(t)-e.parent.children.indexOf(e),ct=(t,e)=>e.parent.children.indexOf(e)-t.parent.children.indexOf(t),gt={group(t,e,s){t.sort(ct);const{app:o,parent:n}=t[0];let r;r=s&&s.add?s:new i.Group(s),n.addAt(r,n.children.indexOf(t[0])),t.sort(dt);const a=new i.Matrix(e.worldTransform);return a.divideParent(n.worldTransform),r.setTransform(a),r.editable=!0,r.hitChildren=!1,o.lockLayout(),t.forEach((t=>t.dropTo(r))),o.unlockLayout(),r},ungroup(t){const{app:e}=t[0],i=[];return e.lockLayout(),t.forEach((t=>{if(t.isBranch){const{parent:e,children:s}=t;for(;s.length;)i.push(s[0]),s[0].dropTo(e,e.children.indexOf(t));t.remove()}else i.push(t)})),e.unlockLayout(),i},toTop(t){t.sort(dt),t.forEach((t=>{t.parent&&t.parent.add(t)}))},toBottom(t){t.sort(ct),t.forEach((t=>{t.parent&&t.parent.addAt(t,0)}))}};class ut extends i.Group{get list(){return this.leafList.list}get hasTarget(){return!!this.list.length}get multiple(){return this.list.length>1}get single(){return 1===this.list.length}get element(){return this.multiple?this.simulateTarget:this.list[0]}get buttons(){return this.editBox.buttons}get dragging(){return this.editBox.dragging}constructor(t,e){super(e),this.config=nt,this.leafList=new i.LeafList,this.simulateTarget=new i.Rect({visible:!1}),this.editBox=new st(this),this.selector=new W(this),this.targetEventIds=[],t&&(this.config=i.DataHelper.default(t,this.config)),this.addMany(this.selector,this.editBox)}hasItem(t){return this.leafList.has(t)}addItem(t){this.hasItem(t)||t.locked||(this.leafList.add(t),this.target=this.leafList.list)}removeItem(t){this.hasItem(t)&&(this.leafList.remove(t),this.target=this.leafList.list)}shiftItem(t){this.hasItem(t)?this.removeItem(t):this.addItem(t)}update(){this.hasTarget&&(this.editTool&&this.editTool.update(this),this.selector.update())}updateEditTool(){this.editTool=function(t){if(1===t.length){const e=t[0];return e instanceof i.Line&&!e.points?new ht:new rt}return new rt}(this.list)}getEditSize(t){let{editSize:e}=this.config;return"auto"===e?t.editSize:e}onMove(t){const e=t.getLocalMove(this.element);t.shiftKey&&(Math.abs(e.x)>Math.abs(e.y)?e.y=0:e.x=0),this.move(e.x,e.y)}onScale(t){const{element:e}=this,{direction:i}=t.current;let{around:s,lockRatio:o}=this.config;t.shiftKey&&(o=!0);const n=Q.getScaleData(e.boxBounds,i,t.getInnerMove(e),o,Q.getAround(s,t.altKey));this.editTool.onScaleWithDrag?(n.drag=t,this.scaleWithDrag(n)):this.scaleOf(n.origin,n.scaleX,n.scaleY)}onRotate(t){const{skewable:e,around:s,rotateGap:o}=this.config,{direction:n,name:r}=t.current;if(e&&"resize-line"===r)return this.onSkew(t);const{element:a}=this;let l,h;if(t instanceof i.RotateEvent)h=t.rotation,l=a.getInnerPoint(t);else{const e={x:t.x-t.moveX,y:t.y-t.moveY},i=Q.getRotateData(a.boxBounds,n,t.getInner(a),a.getInnerPoint(e),t.shiftKey?null:s||"center");h=i.rotation,l=i.origin}h=i.MathHelper.getGapRotation(h,o,a.rotation),h&&(a.scaleX*a.scaleY<0&&(h=-h),this.rotateOf(l,i.MathHelper.float(h,2)))}onSkew(t){const{element:e}=this,{around:i}=this.config,{origin:s,skewX:o,skewY:n}=Q.getSkewData(e.boxBounds,t.current.direction,t.getInnerMove(e),Q.getAround(i,t.altKey));(o||n)&&this.skewOf(s,o,n)}move(t,e){if(!this.config.moveable)return;const{element:i}=this,s=i.getWorldPointByLocal({x:t,y:e},null,!0),o=new b(b.MOVE,{target:i,editor:this,moveX:s.x,moveY:s.y});this.editTool.onMove(o),this.emitEvent(o),this.multiple&&i.move(t,e)}scaleWithDrag(t){const{element:e}=this,i=e.getWorldPoint(t.origin),s=new m(m.SCALE,Object.assign(Object.assign({},t),{target:e,editor:this,worldOrigin:i}));this.editTool.onScaleWithDrag(s),this.emitEvent(s)}scaleOf(t,e,s=e,o){const{element:n}=this,r=n.getWorldPoint(t);let a;if(this.multiple){const o=new i.Matrix(n.worldTransform);n.scaleOf(t,e,s),a=new i.Matrix(n.worldTransform).divide(o)}const l=new m(m.SCALE,{target:n,editor:this,worldOrigin:r,scaleX:e,scaleY:s,transform:a});this.editTool.onScale(l),this.emitEvent(l)}rotateOf(t,e){const{element:s}=this,o=s.getWorldPoint(t);let n;if(this.multiple){const o=new i.Matrix(s.worldTransform);s.rotateOf(t,e),n=new i.Matrix(s.worldTransform).divide(o)}const r=new E(E.ROTATE,{target:s,editor:this,worldOrigin:o,rotation:e,transform:n});this.editTool.onRotate(r),this.emitEvent(r)}skewOf(t,e,s=0,o){const{element:n}=this,r=n.getWorldPoint(t);let a;if(this.multiple){const o=new i.Matrix(n.worldTransform);n.skewOf(t,e,s),a=new i.Matrix(n.worldTransform).divide(o)}const l=new M(M.SKEW,{target:n,editor:this,skewX:e,skewY:s,transform:a,worldOrigin:r});this.editTool.onSkew(l),this.emitEvent(l)}group(t){return this.multiple&&(this.target=gt.group(this.list,this.element,t)),this.target}ungroup(){return this.list.length&&(this.target=gt.ungroup(this.list)),this.list}lock(){this.list.forEach((t=>t.locked=!0)),this.update()}unlock(){this.list.forEach((t=>t.locked=!1)),this.update()}toTop(){this.list.length&&(gt.toTop(this.list),this.leafList.update())}toBottom(){this.list.length&&(gt.toBottom(this.list),this.leafList.update())}listenTargetEvents(){if(!this.targetEventIds.length){const{leafer:t}=this.list[0];this.targetEventIds=[t.on_(i.RenderEvent.START,this.update,this),t.on_([i.KeyEvent.HOLD,i.KeyEvent.UP],(t=>{q(this,t)})),t.on_(i.KeyEvent.DOWN,this.editBox.onArrow,this.editBox)]}}removeTargetEvents(){const{targetEventIds:t}=this;t.length&&(this.off_(t),t.length=0)}destroy(){this.destroyed||(this.simulateTarget.destroy(),this.target=this.hoverTarget=this.simulateTarget=null,super.destroy())}}return k([H((function(t,e){t.emitEvent(new x(x.HOVER,{editor:t,value:t.hoverTarget,oldValue:e}))}))],ut.prototype,"hoverTarget",void 0),k([H((function(t,e){const{target:s}=t;s?t.leafList=s instanceof i.LeafList?s:new i.LeafList(s):t.leafList.reset(),t.emitEvent(new x(x.SELECT,{editor:t,value:s,oldValue:e})),t.hasTarget?t.waitLeafer((()=>{t.multiple&&function(t){const{simulateTarget:e,leafList:s}=t,{x:o,y:n,width:r,height:a}=(new i.Bounds).setListWithFn(s.list,(t=>t.worldBoxBounds)),l=e.parent=s.list[0].leafer.zoomLayer,{scaleX:h,scaleY:d,e:c,f:g}=l.__world;e.reset({x:(o-c)/h,y:(n-g)/d,width:r/h,height:a/d})}(t),J(t),t.updateEditTool(),t.update(),t.listenTargetEvents()})):t.removeTargetEvents()}))],ut.prototype,"target",void 0),i.Creator.editor=function(t){return new ut(t)},t.EditBox=st,t.EditDataHelper=Q,t.EditPoint=et,t.EditSelect=W,t.EditSelectHelper=z,t.EditTool=rt,t.Editor=ut,t.EditorEvent=x,t.EditorHelper=gt,t.EditorMoveEvent=b,t.EditorRotateEvent=E,t.EditorScaleEvent=m,t.EditorSkewEvent=M,t.LineEditTool=ht,t.SelectArea=O,t.Stroker=D,t}({},LeaferUI,LeaferUI);
1
+ this.LeaferIN=this.LeaferIN||{},this.LeaferIN.editor=function(t,e,i){"use strict";const{M:s,L:o,C:n,Q:r,Z:a,N:l,D:h,X:c,G:d,F:g,O:u,P:f,U:p}=e.PathCommandMap,v={scale(t,e,i){if(!t)return;let v,L=0,w=t.length;for(;L<w;)switch(v=t[L],v){case s:case o:y(t,e,i,L,1),L+=3;break;case n:y(t,e,i,L,3),L+=7;break;case r:y(t,e,i,L,2),L+=5;break;case a:L+=1;break;case l:y(t,e,i,L,2),L+=5;break;case h:y(t,e,i,L,2),L+=9;break;case c:y(t,e,i,L,2),L+=6;break;case d:y(t,e,i,L,2),L+=9;break;case g:y(t,e,i,L,2),L+=5;break;case u:t[L]=d,t.splice(L+4,0,t[L+3],0),y(t,e,i,L,2),L+=9,w+=2;break;case f:t[L]=g,t.splice(L+4,0,t[L+3]),y(t,e,i,L,2),L+=5,w+=1;break;case p:y(t,e,i,L,2),L+=6}},scalePoints(t,e,i,s,o){for(let n=o?s+1:0,r=o?n+2*o:t.length;n<r;n+=2)t[n]*=e,t[n+1]*=i}},{scalePoints:y}=v;function L(t,e,i){1!==e&&(t.width*=e),1!==i&&(t.height*=i)}e.Leaf.prototype.scaleResize=function(t,e=t,i){const s=this;i?(s.scaleX*=t,s.scaleY*=e):(t<0&&(s.scaleX*=-1,t=-t),e<0&&(s.scaleY*=-1,e=-e),this.__scaleResize(t,e))},e.Leaf.prototype.__scaleResize=function(t,e){L(this,t,e)},e.Path.prototype.__scaleResize=function(t,e){v.scale(this.__.path,t,e),this.path=this.__.path},e.Line.prototype.__scaleResize=function(t,e){if(this.points)v.scalePoints(this.__.points,t,e),this.points=this.__.points;else{const i=this.toPoint;i.x*=t,i.y*=e,this.toPoint=i}},e.Polygon.prototype.__scaleResize=function(t,e){this.points?(v.scalePoints(this.__.points,t,e),this.points=this.__.points):L(this,t,e)};const w=e.MatrixHelper.get();function k(t,e,i){const{children:s}=t;for(let t=0;t<s.length;t++)w.a=e,w.d=i,s[t].transform(w,!0)}function _(t,e,i,s){var o,n=arguments.length,r=n<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,i,s);else for(var a=t.length-1;a>=0;a--)(o=t[a])&&(r=(n<3?o(r):n>3?o(e,i,r):o(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r}function x(t){return t?t instanceof Array?t:[t]:[]}e.Group.prototype.__scaleResize=function(t,e){k(this,t,e)},e.Box.prototype.__scaleResize=function(t,e){this.__.__autoSize&&this.children.length?k(this,t,e):L(this,t,e)},"function"==typeof SuppressedError&&SuppressedError;class m extends i.Event{get list(){return x(this.value)}get oldList(){return x(this.oldValue)}constructor(t,e){super(t),e&&Object.assign(this,e)}}m.SELECT="editor.select",m.HOVER="editor.hover";class b extends m{constructor(t,e){super(t,e)}}b.MOVE="editor.move";class E extends m{constructor(t,e){super(t,e)}}E.SCALE="editor.scale";class M extends m{constructor(t,e){super(t,e)}}M.ROTATE="editor.rotate";class S extends m{constructor(t,e){super(t,e)}}function H(t){return(e,s)=>{const o="_"+s;i.defineKey(e,s,{get(){return this[o]},set(e){const i=this[o];i!==e&&(this[o]=e,t(this,i))}})}}S.SKEW="editor.skew";const V=i.MatrixHelper.get(),{abs:P}=Math,{copy:T,scale:D}=i.MatrixHelper;class O extends i.UI{constructor(){super(),this.list=[],this.hittable=!1,this.strokeAlign="center"}setTarget(t,e){const{stroke:i,strokeWidth:s}=e;this.set({stroke:i,strokeWidth:s}),this.target=t}__draw(t,e){const{list:s}=this;if(s.length){let o;const{stroke:n,strokeWidth:r}=this.__,{bounds:a}=e;for(let l=0;l<s.length;l++)if(o=s[l],a&&a.hit(o.__world,e.matrix)){let s;if("scale"===o.__.editSize){const i=P(o.__world.scaleX),n=P(o.__world.scaleY);if(i!==n){T(V,o.__world),D(V,1/i,1/n),t.setWorld(V,e.matrix),t.beginPath(),this.__.strokeWidth=r;const{x:a,y:l,width:h,height:c}=o.__layout.boxBounds;t.rect(a*i,l*n,h*i,c*n),s=!0}}s||(t.setWorld(o.__world,e.matrix),t.beginPath(),o.__.__useArrow?o.__drawPath(t):o.__.__pathForRender?o.__drawRenderPath(t):o.__drawPathByBox(t),this.__.strokeWidth=r/P(o.__world.scaleX)),"string"==typeof n?i.Paint.stroke(n,this,t):i.Paint.strokes(n,this,t)}this.__.strokeWidth=r}}destroy(){this.target=null,super.destroy()}}_([H((function(t){const e=t.target;t.list=e?e instanceof Array?e:[e]:[],t.forceUpdate()}))],O.prototype,"target",void 0);class R extends i.Group{constructor(t){super(t),this.strokeArea=new i.Rect({strokeAlign:"center"}),this.fillArea=new i.Rect,this.visible=this.hittable=!1,this.addMany(this.fillArea,this.strokeArea)}setStyle(t,e){const{visible:i,stroke:s,strokeWidth:o}=t;this.visible=i,this.strokeArea.reset(Object.assign({stroke:s,strokeWidth:o},e||{})),this.fillArea.reset({visible:!e,fill:s,opacity:.2})}setBounds(t){this.strokeArea.set(t),this.fillArea.set(t)}}const{No:A,Yes:B,NoAndSkip:Z,YesAndSkip:z}=i.Answer,I={findOne:t=>t.list.find((t=>t.editable)),findBounds(t,e){if(t.__.hittable&&t.__.visible&&!t.__.locked&&e.hit(t.__world)){if(t.__.editable){if(t.isBranch&&!t.__.hitChildren)return t.__.hitSelf?z:Z;if(t.isFrame)return e.includes(t.__layout.boxBounds,t.__world)?z:A;if(e.hit(t.__layout.boxBounds,t.__world)&&t.__.hitSelf)return B}return A}return t.isBranch?Z:A}},{findOne:W}=I;class C extends i.Group{get dragging(){return!!this.originList}get running(){return this.editor.hittable&&this.editor.config.selector}get isMoveMode(){return this.app&&this.app.interaction.moveMode}constructor(t){super(),this.hoverStroker=new O,this.targetStroker=new O,this.bounds=new i.Bounds,this.selectArea=new R,this.__eventIds=[],this.editor=t,this.addMany(this.targetStroker,this.hoverStroker,this.selectArea),this.__listenEvents()}onHover(){const{editor:t}=this;if(!this.running||this.dragging||t.dragging)this.hoverStroker.target=null;else{const{stroke:e,strokeWidth:i,hover:s}=t.config;this.hoverStroker.setTarget(s?this.editor.hoverTarget:null,{stroke:e,strokeWidth:i})}}onSelect(){if(this.running){const{config:t,list:e}=this.editor,{stroke:i,strokeWidth:s}=t;this.targetStroker.setTarget(e,{stroke:i,strokeWidth:Math.max(1,s/2)}),this.hoverStroker.target=null}}update(){this.running&&this.targetStroker.forceUpdate()}onPointerMove(t){const{app:e,editor:i}=this;if(this.running&&!this.isMoveMode&&e.config.pointer.hover&&!e.interaction.dragging){const e=t.shiftKey?this.findDeepOne(t):W(t.path);i.hoverTarget=i.hasItem(e)?null:e}this.isMoveMode&&(i.hoverTarget=null)}onBeforeDown(t){const{select:e}=this.editor.config;"press"===e&&this.checkAndSelect(t,!0)}onTap(t){const{editor:e}=this,{select:i,continuousSelect:s}=e.config;if("tap"===i&&this.checkAndSelect(t),!this.running||!t.shiftKey&&!s||t.middle||this.lastDownLeaf)this.isMoveMode&&(e.target=null);else{const i=this.findDeepOne(t);i?e.shiftItem(i):!t.shiftKey&&s&&(e.target=null)}this.lastDownLeaf=null}checkAndSelect(t,e){if(this.running&&!this.isMoveMode&&!t.middle){const{editor:i}=this,s=this.lastDownLeaf=W(t.path);s?(t.shiftKey||i.config.continuousSelect?i.shiftItem(s):i.target=s,e&&(i.updateLayout(),s.locked||this.app.interaction.updateDownData(t,{findList:[i.editBox.rect]},i.config.dualEvent))):this.allow(t.target)&&(t.shiftKey||(i.target=null))}}onDragStart(t){if(this.running&&this.allowDrag(t)){const{editor:e}=this,{stroke:i,strokeWidth:s,area:o}=e.config,{x:n,y:r}=t.getInner(this);this.bounds.set(n,r),this.selectArea.setStyle({visible:!0,stroke:i,strokeWidth:s,x:n,y:r},o),this.selectArea.setBounds(this.bounds.get()),this.originList=e.leafList.clone()}}onDrag(t){if(this.editor.dragging)this.onDragEnd();else if(this.dragging){const{editor:e}=this,s=t.getInnerTotal(this),o=this.bounds.clone().unsign(),n=new i.LeafList(e.app.find(I.findBounds,o));if(this.bounds.width=s.x,this.bounds.height=s.y,this.selectArea.setBounds(o.get()),n.length){const t=[];this.originList.forEach((e=>{n.has(e)||t.push(e)})),n.forEach((e=>{this.originList.has(e)||t.push(e)})),(t.length!==e.list.length||e.list.some(((e,i)=>e!==t[i])))&&(e.target=t)}else e.target=this.originList.list}}onDragEnd(){this.dragging&&(this.originList=null,this.selectArea.visible=!1)}onAutoMove(t){if(this.dragging){const{x:e,y:i}=t.getLocalMove(this);this.bounds.x+=e,this.bounds.y+=i}}allow(t){return t.leafer!==this.editor.leafer}allowDrag(t){return!(!this.editor.config.boxSelect||t.target.draggable)&&(!this.editor.hasTarget&&this.allow(t.target)||t.shiftKey&&!W(t.path))}findDeepOne(t){const e={exclude:new i.LeafList(this.editor.editBox.rect)};return W(t.target.leafer.interaction.findPath(t,e))}__listenEvents(){const{editor:t}=this;t.waitLeafer((()=>{const{app:e}=t;e.selector.proxy=t,this.__eventIds=[t.on_(m.HOVER,this.onHover,this),t.on_(m.SELECT,this.onSelect,this),e.on_(i.PointerEvent.MOVE,this.onPointerMove,this),e.on_(i.PointerEvent.BEFORE_DOWN,this.onBeforeDown,this),e.on_(i.PointerEvent.TAP,this.onTap,this),e.on_(i.DragEvent.START,this.onDragStart,this),e.on_(i.DragEvent.DRAG,this.onDrag,this),e.on_(i.DragEvent.END,this.onDragEnd,this),e.on_(i.MoveEvent.MOVE,this.onAutoMove,this),e.on_([i.ZoomEvent.ZOOM,i.MoveEvent.MOVE],(()=>{this.editor.hoverTarget=null}))]}))}__removeListenEvents(){this.__eventIds&&(this.off_(this.__eventIds),this.__eventIds.length=0)}destroy(){this.editor=this.originList=this.lastDownLeaf=null,this.__removeListenEvents(),super.destroy()}}var X;!function(t){t[t.topLeft=0]="topLeft",t[t.top=1]="top",t[t.topRight=2]="topRight",t[t.right=3]="right",t[t.bottomRight=4]="bottomRight",t[t.bottom=5]="bottom",t[t.bottomLeft=6]="bottomLeft",t[t.left=7]="left"}(X||(X={}));const{topLeft:Y,top:K,topRight:F,right:G,bottomRight:U,bottom:N,bottomLeft:j,left:$}=X,{toPoint:Q}=i.AroundHelper,q={getScaleData(t,e,i,s,o){let n,r=1,a=1;const{width:l,height:h}=t;o&&(i.x*=2,i.y*=2),Math.abs(i.x)===l&&(i.x+=.1),Math.abs(i.y)===h&&(i.y+=.1);const c=(-i.y+h)/h,d=(i.x+l)/l,g=(i.y+h)/h,u=(-i.x+l)/l;switch(e){case K:a=c,n={x:.5,y:1};break;case G:r=d,n={x:0,y:.5};break;case N:a=g,n={x:.5,y:0};break;case $:r=u,n={x:1,y:.5};break;case Y:a=c,r=u,n={x:1,y:1};break;case F:a=c,r=d,n={x:0,y:1};break;case U:a=g,r=d,n={x:0,y:0};break;case j:a=g,r=u,n={x:1,y:0}}if(s){"corner"===s&&e%2||(1!==a?r=a:a=r)}return Q(o||n,t,n),{origin:n,scaleX:r,scaleY:a,direction:e,lockRatio:s,around:o}},getRotateData(t,e,s,o,n){let r;switch(e){case Y:r={x:1,y:1};break;case F:r={x:0,y:1};break;case U:r={x:0,y:0};break;case j:r={x:1,y:0};break;default:r={x:.5,y:.5}}return Q(n||r,t,r),{origin:r,rotation:i.PointHelper.getRotation(o,r,s)}},getSkewData(t,e,s,o){let n,r,a=0,l=0;switch(e){case K:r={x:.5,y:0},n={x:.5,y:1},a=1;break;case N:r={x:.5,y:1},n={x:.5,y:0},a=1;break;case $:r={x:0,y:.5},n={x:1,y:.5},l=1;break;case G:r={x:1,y:.5},n={x:0,y:.5},l=1}const{x:h,y:c,width:d,height:g}=t;r.x=h+r.x*d,r.y=c+r.y*g,Q(o||n,t,n);const u=i.PointHelper.getRotation(r,n,{x:r.x+(a?s.x:0),y:r.y+(l?s.y:0)});return a?a=-u:l=u,{origin:n,skewX:a,skewY:l}},getAround:(t,e)=>e&&!t?"center":t,getRotateDirection:(t,e,i=8)=>((t=(t+Math.round(e/(360/i)))%i)<0&&(t+=i),t),getFlipDirection(t,e,i){if(e)switch(t){case $:t=G;break;case Y:t=F;break;case j:t=U;break;case G:t=$;break;case F:t=Y;break;case U:t=j}if(i)switch(t){case K:t=N;break;case Y:t=j;break;case F:t=U;break;case N:t=K;break;case j:t=Y;break;case U:t=F}return t}},J={};function tt(t,e){const{editBox:s}=t,o=s.enterPoint;if(!o||!t.hasTarget||!s.visible)return;if("circle"===o.name)return;let{rotation:n}=s;const{resizeCursor:r,rotateCursor:a,skewCursor:l,resizeable:h,rotateable:c,skewable:d}=t.config,{pointType:g}=o,{flippedX:u,flippedY:f}=s;let p="resize"===g;p&&c&&(e.metaKey||e.ctrlKey||!h)&&(p=!1);const v=d&&!p&&"resize-line"===o.name?l:p?r:a;n+=45*(q.getFlipDirection(o.direction,u,f)+1),n=2*Math.round(i.MathHelper.formatRotation(n,!0)/2);const{url:y,x:L,y:w}=v,k=y+n;J[k]?o.cursor=J[k]:J[k]=o.cursor={url:it(y,n),x:L,y:w}}function et(t){t.editBox.rect.cursor=t.config.moveCursor}function it(t,e){return'"data:image/svg+xml,'+encodeURIComponent(t.replace("{{rotation}}",e.toString()))+'"'}class st extends i.Box{}const ot=["top","right","bottom","left"];class nt extends i.Group{get flipped(){return this.flippedX||this.flippedY}get flippedX(){return this.scaleX<0}get flippedY(){return this.scaleY<0}get flippedOne(){return this.scaleX*this.scaleY<0}constructor(t){super(),this.rect=new i.Box({name:"rect",hitFill:"all",hitStroke:"none",strokeAlign:"center",hitRadius:5}),this.circle=new st({name:"circle",strokeAlign:"center",around:"center",cursor:"crosshair",hitRadius:5}),this.buttons=new i.Group({around:"center",hitSelf:!1}),this.resizePoints=[],this.rotatePoints=[],this.resizeLines=[],this.__eventIds=[],this.editor=t,this.visible=!1,this.create(),this.__listenEvents()}create(){let t,e,i;const{resizePoints:s,rotatePoints:o,resizeLines:n,rect:r,circle:a,buttons:l}=this,h=[{x:1,y:1},{x:.5,y:1},{x:0,y:1},{x:0,y:.5},{x:0,y:0},{x:.5,y:0},{x:1,y:0},{x:1,y:.5}];for(let r=0;r<8;r++)t=new st({name:"rotate-point",around:h[r],width:15,height:15,hitFill:"all"}),o.push(t),this.listenPointEvents(t,"rotate",r),r%2&&(e=new st({name:"resize-line",around:"center",width:10,height:10,hitFill:"all"}),n.push(e),this.listenPointEvents(e,"resize",r)),i=new st({name:"resize-point",around:"center",strokeAlign:"center",hitRadius:5}),s.push(i),this.listenPointEvents(i,"resize",r);l.add(a),this.listenPointEvents(a,"rotate",2),this.addMany(...o,r,l,...n,...s)}update(t){const{config:e,list:s}=this.editor,{width:o,height:n}=t,{rect:r,circle:a,resizePoints:l,rotatePoints:h,resizeLines:c}=this,{middlePoint:d,resizeable:g,rotateable:u,stroke:f,strokeWidth:p,hideOnSmall:v}=e,y=this.getPointsStyle(),L=this.getMiddlePointsStyle(),w="number"==typeof v?v:10,k=!(v&&o<w&&n<w);this.visible=s[0]&&!s[0].locked;let _,x,m,b,E={};for(let s=0;s<8;s++)i.AroundHelper.toPoint(i.AroundHelper.directionData[s],t,E),_=this.getPointStyle(s%2?L[(s-1)/2%L.length]:y[s/2%y.length]),m=l[s],x=h[s],b=c[Math.floor(s/2)],m.set(_),m.set(E),x.set(E),b.set(E),m.visible=b.visible=k&&(g||u),x.visible=k&&u&&g&&!e.rotatePoint,s%2?(m.visible=x.visible=k&&!!d,(s+1)/2%2?(b.width=o,m.width>o-30&&(m.visible=!1)):(b.height=n,m.rotation=90,m.width>n-30&&(m.visible=!1))):m.rotation=s/2*90;a.visible=k&&u&&!!e.rotatePoint,a.set(this.getPointStyle(e.rotatePoint||y[0])),r.set(Object.assign({stroke:f,strokeWidth:p},e.rect||{})),r.set(Object.assign(Object.assign({},t),{visible:!0})),r.hittable=e.moveable,this.buttons.visible=k,this.layoutButtons()}layoutButtons(){const{buttons:t,resizePoints:e}=this,{buttonsDirection:i,buttonsFixed:s,buttonsMargin:o,middlePoint:n}=this.editor.config,{flippedX:r,flippedY:a}=this;let l=ot.indexOf(i);(l%2&&r||(l+1)%2&&a)&&s&&(l=(l+2)%4);const h=s?q.getRotateDirection(l,this.flippedOne?this.rotation:-this.rotation,4):l,c=e[2*h+1],d=h%2,g=h&&3!==h?1:-1,u=(o+(l%2?(n?c.width:0)+t.boxBounds.width:(n?c.height:0)+t.boxBounds.height)/2)*g;d?(t.x=c.x+u,t.y=c.y):(t.x=c.x,t.y=c.y+u),s&&(t.rotation=90*(h-l),t.scaleX=r?-1:1,t.scaleY=a?-1:1)}getPointStyle(t){const{stroke:e,strokeWidth:i,pointFill:s,pointSize:o,pointRadius:n}=this.editor.config,r={fill:s,stroke:e,strokeWidth:i,width:o,height:o,cornerRadius:n};return t?Object.assign(r,t):r}getPointsStyle(){const{point:t}=this.editor.config;return t instanceof Array?t:[t]}getMiddlePointsStyle(){const{middlePoint:t}=this.editor.config;return t instanceof Array?t:t?[t]:this.getPointsStyle()}onDragStart(t){this.dragging=!0,"rect"===t.target.name&&(this.moving=!0,this.editor.opacity=this.editor.config.hideOnMove?0:1)}onDragEnd(t){this.dragging=!1,this.moving=!1,"rect"===t.target.name&&(this.editor.opacity=1)}onDrag(t){const{editor:e}=this;"rotate"===(this.enterPoint=t.current).pointType||t.metaKey||t.ctrlKey||!e.config.resizeable?e.config.rotateable&&e.onRotate(t):e.onScale(t),tt(e,t)}onArrow(t){if(this.editor.hasTarget&&this.editor.config.keyEvent){const e={x:0,y:0},i=t.shiftKey?10:1;switch(t.code){case"ArrowDown":e.y=i;break;case"ArrowUp":e.y=-i;break;case"ArrowLeft":e.x=-i;break;case"ArrowRight":e.x=i}(e.x||e.y)&&this.editor.move(e.x,e.y)}}onDoubleClick(){const{editor:t}=this;t.single&&t.element.isBranch}listenPointEvents(t,e,s){const{editor:o}=this;t.direction=s,t.pointType=e,t.on_(i.DragEvent.START,this.onDragStart,this),t.on_(i.DragEvent.DRAG,this.onDrag,this),t.on_(i.DragEvent.END,this.onDragEnd,this),t.on_(i.PointerEvent.LEAVE,(()=>this.enterPoint=null)),"circle"!==t.name&&t.on_(i.PointerEvent.ENTER,(e=>{this.enterPoint=t,tt(o,e)}))}__listenEvents(){const{rect:t,editor:e}=this;this.__eventIds=[e.on_(m.SELECT,(()=>{this.visible=e.hasTarget})),t.on_(i.DragEvent.START,this.onDragStart,this),t.on_(i.DragEvent.DRAG,e.onMove,e),t.on_(i.DragEvent.END,this.onDragEnd,this),t.on_(i.PointerEvent.ENTER,(()=>et(e))),t.on_(i.PointerEvent.DOUBLE_CLICK,this.onDoubleClick,this)]}__removeListenEvents(){this.off_(this.__eventIds),this.__eventIds.length=0}destroy(){this.editor=null,this.__removeListenEvents(),super.destroy()}}const rt='\n<feOffset dy="1"/>\n<feGaussianBlur stdDeviation="1.5"/>\n<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"/>\n<feBlend mode="normal" in="SourceGraphic" result="shape"/>',at={editSize:"auto",keyEvent:!0,stroke:"#836DFF",strokeWidth:2,pointFill:"#FFFFFF",pointSize:10,pointRadius:16,rotateGap:45,buttonsDirection:"bottom",buttonsMargin:12,hideOnSmall:!0,moveCursor:"move",resizeCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate({{rotation}},12,12)">\n<path d="M7.5 8.0H8.5V5.9L6.8 7.2L7.5 8.0ZM3 11.4L2.3 10.6L1.3 11.4L2.3 12.2L3 11.4ZM7.5 10.4H6.5V11.4H7.5V10.4ZM16.5 10.4V11.4H17.5V10.4H16.5ZM16.5 8.0L17.1 7.2L15.5 5.9V8.0H16.5ZM21 11.4L21.6 12.2L22.6 11.4L21.6 10.6L21 11.4ZM16.5 14.9H15.5V16.9L17.1 15.7L16.5 14.9ZM16.5 12.4H17.5V11.4H16.5V12.4ZM7.5 12.4V11.4H6.5V12.4H7.5ZM7.5 14.9L6.8 15.7L8.5 16.9V14.9H7.5ZM6.8 7.2L2.3 10.6L3.6 12.2L8.1 8.7L6.8 7.2ZM8.5 10.4V8.0H6.5V10.4H8.5ZM16.5 9.4H7.5V11.4H16.5V9.4ZM17.5 10.4V8.0H15.5V10.4H17.5ZM15.8 8.7L20.3 12.2L21.6 10.6L17.1 7.2L15.8 8.7ZM20.3 10.6L15.8 14.1L17.1 15.7L21.6 12.2L20.3 10.6ZM17.5 14.9V12.4H15.5V14.9H17.5ZM7.5 13.4H16.5V11.4H7.5V13.4ZM8.5 14.9V12.4H6.5V14.9H8.5ZM2.3 12.2L6.8 15.7L8.1 14.1L3.6 10.6L2.3 12.2Z" fill="white"/>\n<path fill-rule="evenodd" d="M3 11.4L7.5 8.0V10.4H16.5V8.0L21 11.4L16.5 14.9V12.4H7.5V14.9L3 11.4Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter id="f" x="-1.6" y="3.9" width="27.2" height="16.9" filterUnits="userSpaceOnUse">\n${rt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},rotateCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate(135,12,12),rotate({{rotation}},12,12)">\n<path d="M20.4 8H21.4L20.8 7.1L17.3 2.6L17 2.1L16.6 2.6L13.1 7.1L12.5 8H13.5H15.4C14.9 11.8 11.8 14.9 8 15.4V13.5V12.5L7.1 13.1L2.6 16.6L2.1 17L2.6 17.3L7.1 20.8L8 21.4V20.4V18.4C13.5 17.9 17.9 13.5 18.4 8H20.4Z" stroke="white"/>\n<path fill-rule="evenodd" d="M17 3L20.4 7.5H17.9C17.7 13.1 13.1 17.7 7.5 17.9V20.4L3 17L7.5 13.5V15.9C12.0 15.7 15.7 12.0 15.9 7.5H13.5L17 3Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter id="f" x="-1.6" y="-0.6" width="27.1" height="27.1" filterUnits="userSpaceOnUse">\n${rt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},skewCursor:{url:`\n<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">\n<g filter="url(#f)">\n<g transform="rotate(90,12,12),rotate({{rotation}},12,12)">\n<path d="M21 10.4L21 11.4L23.8 11.4L21.6 9.6L21 10.4ZM17 10.4V11.4L17 11.4L17 10.4ZM15.5 6L16.1 5.2L14.5 3.9V6H15.5ZM15.5 8.4V9.4H16.5V8.4H15.5ZM6 8.4V7.4H5V8.4H6ZM6 10.4H5V11.4H6V10.4ZM7 14.4V13.4L7 13.4L7 14.4ZM3 14.4L3 13.4L0.1 13.4L2.3 15.2L3 14.4ZM8.5 18.9L7.8 19.7L9.5 21.0V18.9H8.5ZM8.5 16.4V15.4H7.5V16.4H8.5ZM19 16.4V17.4H20V16.4H19ZM19 14.4H20V13.4H19V14.4ZM21 9.4L17 9.4L17 11.4L21 11.4L21 9.4ZM14.8 6.7L20.3 11.2L21.6 9.6L16.1 5.2L14.8 6.7ZM16.5 8.4V6H14.5V8.4H16.5ZM6 9.4H15.5V7.4H6V9.4ZM7 10.4V8.4H5V10.4H7ZM15.5 9.4H6V11.4H15.5V9.4ZM17 9.4H15.5V11.4H17V9.4ZM7 15.4H8.5V13.4H7V15.4ZM3 15.4L7 15.4L7 13.4L3 13.4L3 15.4ZM9.1 18.1L3.6 13.6L2.3 15.2L7.8 19.7L9.1 18.1ZM7.5 16.4V18.9H9.5V16.4H7.5ZM19 15.4H8.5V17.4H19V15.4ZM18 14.4V16.4H20V14.4H18ZM8.5 15.4H19V13.4H8.5V15.4Z" fill="white"/>\n<path fill-rule="evenodd" d="M17 10.4L21 10.4L15.5 6V8.4H6V10.4H15.5H17ZM8.5 14.4H7L3 14.4L8.5 18.9V16.4H19V14.4H8.5Z" fill="black"/>\n</g>\n</g>\n<defs>\n<filter x="-2.8" y="1.9" width="29.6" height="23.1" filterUnits="userSpaceOnUse" >\n${rt}\n</filter>\n</defs>\n</svg>\n`,x:12,y:12},selector:!0,hover:!0,select:"press",boxSelect:!0,moveable:!0,resizeable:!0,rotateable:!0,skewable:!0};class lt{constructor(){this.tag="EditTool"}onMove(t){const{moveX:e,moveY:i,editor:s}=t,{app:o,list:n}=s;o.lockLayout(),n.forEach((t=>{t.moveWorld(e,i)})),o.unlockLayout()}onScale(t){const{scaleX:e,scaleY:i,transform:s,worldOrigin:o,editor:n}=t,{app:r,list:a}=n;r.lockLayout(),a.forEach((t=>{const r="size"===n.getEditSize(t);s?t.transformWorld(s,r):t.scaleOfWorld(o,e,i,r)})),r.unlockLayout()}onRotate(t){const{rotation:e,transform:i,worldOrigin:s,editor:o}=t,{app:n,list:r}=o;n.lockLayout(),r.forEach((t=>{const n="size"===o.getEditSize(t);i?t.transformWorld(i,n):t.rotateOfWorld(s,e)})),n.unlockLayout()}onSkew(t){const{skewX:e,skewY:i,transform:s,worldOrigin:o,editor:n}=t,{app:r,list:a}=n;r.lockLayout(),a.forEach((t=>{const r="size"===n.getEditSize(t);s?t.transformWorld(s,r):t.skewOfWorld(o,e,i,r)})),r.unlockLayout()}update(t){const{simulateTarget:e,element:i}=t;t.multiple&&e.parent.updateLayout();const{x:s,y:o,scaleX:n,scaleY:r,rotation:a,skewX:l,skewY:h,width:c,height:d}=i.getLayoutBounds("box",t,!0);t.editBox.set({x:s,y:o,scaleX:n,scaleY:r,rotation:a,skewX:l,skewY:h}),t.editBox.update({x:0,y:0,width:c,height:d})}}lt.list=[];const{left:ht,right:ct}=X;class dt extends lt{constructor(){super(...arguments),this.tag="LineEditTool",this.scaleOfEvent=!0}onScaleWithDrag(t){const{drag:e,direction:s,lockRatio:o,around:n}=t,r=t.target,a=i.getPointData(),{toPoint:l}=r;r.rotation=0;let{x:h,y:c}=e.getInnerMove(r);o&&(Math.abs(h)>Math.abs(c)?c=0:h=0),s===ht?(a.x+=h,a.y+=c,n&&(l.x-=h,l.y-=c)):(n&&(a.x-=h,a.y-=c),l.x+=h,l.y+=c),r.getLocalPointByInner(a,null,null,!0),r.getLocalPointByInner(l,null,null,!0),r.x=a.x,r.y=a.y,r.getInnerPointByLocal(l,null,null,!0),r.toPoint=l}onSkew(t){}update(t){const{rotatePoints:e,resizeLines:i,resizePoints:s}=t.editBox;super.update(t);for(let t=0;t<8;t++)t<4&&(i[t].visible=!1),s[t].visible=e[t].visible=t===ht||t===ct}}const gt=(t,e)=>t.parent.children.indexOf(t)-e.parent.children.indexOf(e),ut=(t,e)=>e.parent.children.indexOf(e)-t.parent.children.indexOf(t),ft={group(t,e,s){t.sort(ut);const{app:o,parent:n}=t[0];let r;r=s&&s.add?s:new i.Group(s),n.addAt(r,n.children.indexOf(t[0])),t.sort(gt);const a=new i.Matrix(e.worldTransform);return a.divideParent(n.worldTransform),r.setTransform(a),r.editable=!0,r.hitChildren=!1,o.lockLayout(),t.forEach((t=>t.dropTo(r))),o.unlockLayout(),r},ungroup(t){const{app:e}=t[0],i=[];return e.lockLayout(),t.forEach((t=>{if(t.isBranch){const{parent:e,children:s}=t;for(;s.length;)i.push(s[0]),s[0].dropTo(e,e.children.indexOf(t));t.remove()}else i.push(t)})),e.unlockLayout(),i},toTop(t){t.sort(gt),t.forEach((t=>{t.parent&&t.parent.add(t)}))},toBottom(t){t.sort(ut),t.forEach((t=>{t.parent&&t.parent.addAt(t,0)}))}};class pt extends i.Group{get list(){return this.leafList.list}get hasTarget(){return!!this.list.length}get multiple(){return this.list.length>1}get single(){return 1===this.list.length}get element(){return this.multiple?this.simulateTarget:this.list[0]}get buttons(){return this.editBox.buttons}get dragging(){return this.editBox.dragging}constructor(t,e){super(e),this.config=at,this.leafList=new i.LeafList,this.simulateTarget=new i.Rect({visible:!1}),this.editBox=new nt(this),this.selector=new C(this),this.targetEventIds=[],t&&(this.config=i.DataHelper.default(t,this.config)),this.addMany(this.selector,this.editBox)}hasItem(t){return this.leafList.has(t)}addItem(t){this.hasItem(t)||t.locked||(this.leafList.add(t),this.target=this.leafList.list)}removeItem(t){this.hasItem(t)&&(this.leafList.remove(t),this.target=this.leafList.list)}shiftItem(t){this.hasItem(t)?this.removeItem(t):this.addItem(t)}update(){this.hasTarget&&(this.editTool&&this.editTool.update(this),this.selector.update())}updateEditTool(){this.editTool=function(t){if(1===t.length){const e=t[0];return e instanceof i.Line&&!e.points?new dt:new lt}return new lt}(this.list)}getEditSize(t){let{editSize:e}=this.config;return"auto"===e?t.editSize:e}onMove(t){const e=t.getLocalMove(this.element),{lockMove:i}=this.config;"x"===i?e.y=0:"y"===i?e.x=0:t.shiftKey&&(Math.abs(e.x)>Math.abs(e.y)?e.y=0:e.x=0),this.move(e.x,e.y)}onScale(t){const{element:e}=this,{direction:i}=t.current;let{around:s,lockRatio:o}=this.config;t.shiftKey&&(o=!0);const n=q.getScaleData(e.boxBounds,i,t.getInnerMove(e),o,q.getAround(s,t.altKey));this.editTool.onScaleWithDrag?(n.drag=t,this.scaleWithDrag(n)):this.scaleOf(n.origin,n.scaleX,n.scaleY)}onRotate(t){const{skewable:e,around:s,rotateGap:o}=this.config,{direction:n,name:r}=t.current;if(e&&"resize-line"===r)return this.onSkew(t);const{element:a}=this;let l,h;if(t instanceof i.RotateEvent)h=t.rotation,l=a.getInnerPoint(t);else{const e={x:t.x-t.moveX,y:t.y-t.moveY},i=q.getRotateData(a.boxBounds,n,t.getInner(a),a.getInnerPoint(e),t.shiftKey?null:s||"center");h=i.rotation,l=i.origin}h=i.MathHelper.getGapRotation(h,o,a.rotation),h&&(a.scaleX*a.scaleY<0&&(h=-h),this.rotateOf(l,i.MathHelper.float(h,2)))}onSkew(t){const{element:e}=this,{around:i}=this.config,{origin:s,skewX:o,skewY:n}=q.getSkewData(e.boxBounds,t.current.direction,t.getInnerMove(e),q.getAround(i,t.altKey));(o||n)&&this.skewOf(s,o,n)}move(t,e){if(!this.config.moveable)return;const{element:i}=this,s=i.getWorldPointByLocal({x:t,y:e},null,!0),o=new b(b.MOVE,{target:i,editor:this,moveX:s.x,moveY:s.y});this.editTool.onMove(o),this.emitEvent(o),this.multiple&&i.move(t,e)}scaleWithDrag(t){const{element:e}=this,i=e.getWorldPoint(t.origin),s=new E(E.SCALE,Object.assign(Object.assign({},t),{target:e,editor:this,worldOrigin:i}));this.editTool.onScaleWithDrag(s),this.emitEvent(s)}scaleOf(t,e,s=e,o){const{element:n}=this,r=n.getWorldPoint(t);let a;if(this.multiple){const o=new i.Matrix(n.worldTransform);n.scaleOf(t,e,s),a=new i.Matrix(n.worldTransform).divide(o)}const l=new E(E.SCALE,{target:n,editor:this,worldOrigin:r,scaleX:e,scaleY:s,transform:a});this.editTool.onScale(l),this.emitEvent(l)}rotateOf(t,e){const{element:s}=this,o=s.getWorldPoint(t);let n;if(this.multiple){const o=new i.Matrix(s.worldTransform);s.rotateOf(t,e),n=new i.Matrix(s.worldTransform).divide(o)}const r=new M(M.ROTATE,{target:s,editor:this,worldOrigin:o,rotation:e,transform:n});this.editTool.onRotate(r),this.emitEvent(r)}skewOf(t,e,s=0,o){const{element:n}=this,r=n.getWorldPoint(t);let a;if(this.multiple){const o=new i.Matrix(n.worldTransform);n.skewOf(t,e,s),a=new i.Matrix(n.worldTransform).divide(o)}const l=new S(S.SKEW,{target:n,editor:this,skewX:e,skewY:s,transform:a,worldOrigin:r});this.editTool.onSkew(l),this.emitEvent(l)}group(t){return this.multiple&&(this.target=ft.group(this.list,this.element,t)),this.target}ungroup(){return this.list.length&&(this.target=ft.ungroup(this.list)),this.list}lock(){this.list.forEach((t=>t.locked=!0)),this.update()}unlock(){this.list.forEach((t=>t.locked=!1)),this.update()}toTop(){this.list.length&&(ft.toTop(this.list),this.leafList.update())}toBottom(){this.list.length&&(ft.toBottom(this.list),this.leafList.update())}listenTargetEvents(){if(!this.targetEventIds.length){const{leafer:t}=this.list[0];this.targetEventIds=[t.on_(i.RenderEvent.START,this.update,this),t.on_([i.KeyEvent.HOLD,i.KeyEvent.UP],(t=>{tt(this,t)})),t.on_(i.KeyEvent.DOWN,this.editBox.onArrow,this.editBox)]}}removeTargetEvents(){const{targetEventIds:t}=this;t.length&&(this.off_(t),t.length=0)}destroy(){this.destroyed||(this.simulateTarget.destroy(),this.target=this.hoverTarget=this.simulateTarget=null,super.destroy())}}return _([H((function(t,e){t.emitEvent(new m(m.HOVER,{editor:t,value:t.hoverTarget,oldValue:e}))}))],pt.prototype,"hoverTarget",void 0),_([H((function(t,e){const{target:s}=t;s?t.leafList=s instanceof i.LeafList?s:new i.LeafList(s):t.leafList.reset(),t.emitEvent(new m(m.SELECT,{editor:t,value:s,oldValue:e})),t.hasTarget?t.waitLeafer((()=>{t.multiple&&function(t){const{simulateTarget:e,leafList:s}=t,{x:o,y:n,width:r,height:a}=(new i.Bounds).setListWithFn(s.list,(t=>t.worldBoxBounds)),l=e.parent=s.list[0].leafer.zoomLayer,{scaleX:h,scaleY:c,e:d,f:g}=l.__world;e.reset({x:(o-d)/h,y:(n-g)/c,width:r/h,height:a/c})}(t),et(t),t.updateEditTool(),t.update(),t.listenTargetEvents()})):t.removeTargetEvents()}))],pt.prototype,"target",void 0),i.Creator.editor=function(t){return new pt(t)},t.EditBox=nt,t.EditDataHelper=q,t.EditPoint=st,t.EditSelect=C,t.EditSelectHelper=I,t.EditTool=lt,t.Editor=pt,t.EditorEvent=m,t.EditorHelper=ft,t.EditorMoveEvent=b,t.EditorRotateEvent=M,t.EditorScaleEvent=E,t.EditorSkewEvent=S,t.LineEditTool=dt,t.SelectArea=R,t.Stroker=O,t}({},LeaferUI,LeaferUI);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@leafer-in/editor",
3
- "version": "1.0.0-rc.19",
3
+ "version": "1.0.0-rc.20",
4
4
  "description": "@leafer-in/editor",
5
5
  "author": "Chao (Leafer) Wan",
6
6
  "license": "MIT",
@@ -28,11 +28,11 @@
28
28
  "leaferjs"
29
29
  ],
30
30
  "dependencies": {
31
- "@leafer-ui/core": "1.0.0-rc.19",
32
- "@leafer-ui/scale": "1.0.0-rc.19"
31
+ "@leafer-ui/core": "1.0.0-rc.20",
32
+ "@leafer-ui/scale": "1.0.0-rc.20"
33
33
  },
34
34
  "devDependencies": {
35
- "@leafer-ui/interface": "1.0.0-rc.19",
36
- "@leafer-in/interface": "1.0.0-rc.19"
35
+ "@leafer-ui/interface": "1.0.0-rc.20",
36
+ "@leafer-in/interface": "1.0.0-rc.20"
37
37
  }
38
38
  }
package/src/Editor.ts CHANGED
@@ -100,8 +100,11 @@ export class Editor extends Group implements IEditor {
100
100
 
101
101
  public onMove(e: DragEvent): void {
102
102
  const move = e.getLocalMove(this.element)
103
+ const { lockMove } = this.config
103
104
 
104
- if (e.shiftKey) {
105
+ if (lockMove === 'x') move.y = 0
106
+ else if (lockMove === 'y') move.x = 0
107
+ else if (e.shiftKey) {
105
108
  if (Math.abs(move.x) > Math.abs(move.y)) move.y = 0
106
109
  else move.x = 0
107
110
  }
package/src/config.ts CHANGED
@@ -18,6 +18,8 @@ export const config: IEditorConfig = {
18
18
  buttonsDirection: 'bottom',
19
19
  buttonsMargin: 12,
20
20
 
21
+ hideOnSmall: true,
22
+
21
23
  moveCursor: 'move',
22
24
  resizeCursor: { url: resizeSVG, x: 12, y: 12 },
23
25
  rotateCursor: { url: rotateSVG, x: 12, y: 12 },
@@ -25,6 +27,7 @@ export const config: IEditorConfig = {
25
27
 
26
28
  selector: true,
27
29
  hover: true,
30
+ select: 'press',
28
31
  boxSelect: true,
29
32
 
30
33
  moveable: true,
@@ -77,11 +77,12 @@ export class EditBox extends Group implements IEditBox {
77
77
  const { config, list } = this.editor
78
78
  const { width, height } = bounds
79
79
  const { rect, circle, resizePoints, rotatePoints, resizeLines } = this
80
- const { middlePoint, resizeable, rotateable, stroke, strokeWidth } = config
80
+ const { middlePoint, resizeable, rotateable, stroke, strokeWidth, hideOnSmall } = config
81
81
 
82
82
  const pointsStyle = this.getPointsStyle()
83
83
  const middlePointsStyle = this.getMiddlePointsStyle()
84
- const showPoints = width > 20 || height > 20
84
+ const smallSize = typeof hideOnSmall === 'number' ? hideOnSmall : 10
85
+ const showPoints = !(hideOnSmall && width < smallSize && height < smallSize)
85
86
 
86
87
  this.visible = list[0] && !list[0].locked // check locked
87
88
 
@@ -97,7 +98,7 @@ export class EditBox extends Group implements IEditBox {
97
98
 
98
99
  // visible
99
100
  resizeP.visible = resizeL.visible = showPoints && (resizeable || rotateable)
100
- rotateP.visible = showPoints && rotateable && resizeable
101
+ rotateP.visible = showPoints && rotateable && resizeable && !config.rotatePoint
101
102
 
102
103
  if (i % 2) { // top, right, bottom, left
103
104
 
@@ -203,10 +204,10 @@ export class EditBox extends Group implements IEditBox {
203
204
  const point = this.enterPoint = e.current as IEditPoint
204
205
  if (point.pointType === 'rotate' || e.metaKey || e.ctrlKey || !editor.config.resizeable) {
205
206
  if (editor.config.rotateable) editor.onRotate(e)
206
- updateCursor(editor, e)
207
207
  } else {
208
208
  editor.onScale(e)
209
209
  }
210
+ updateCursor(editor, e)
210
211
  }
211
212
 
212
213
  public onArrow(e: IKeyEvent): void {
@@ -66,49 +66,63 @@ export class EditSelect extends Group implements IEditSelect {
66
66
  // move / down
67
67
 
68
68
  protected onPointerMove(e: PointerEvent): void {
69
- if (this.running && !this.isMoveMode) {
69
+ const { app, editor } = this
70
+ if (this.running && !this.isMoveMode && app.config.pointer.hover && !app.interaction.dragging) {
70
71
  const find = e.shiftKey ? this.findDeepOne(e) : findOne(e.path)
71
- this.editor.hoverTarget = this.editor.hasItem(find) ? null : find
72
+ editor.hoverTarget = editor.hasItem(find) ? null : find
72
73
  } if (this.isMoveMode) {
73
- this.editor.hoverTarget = null // move.dragEmpty
74
+ editor.hoverTarget = null // move.dragEmpty
74
75
  }
75
76
  }
76
77
 
77
78
  protected onBeforeDown(e: PointerEvent): void {
79
+ const { select } = this.editor.config
80
+ if (select === 'press') this.checkAndSelect(e, true)
81
+ }
82
+
83
+ protected onTap(e: PointerEvent): void {
84
+ const { editor } = this
85
+ const { select, continuousSelect } = editor.config
86
+ if (select === 'tap') this.checkAndSelect(e)
87
+
88
+ if (this.running && (e.shiftKey || continuousSelect) && !e.middle && !this.lastDownLeaf) {
89
+ const find = this.findDeepOne(e)
90
+ if (find) editor.shiftItem(find)
91
+ else if (!e.shiftKey && continuousSelect) editor.target = null
92
+ } else if (this.isMoveMode) {
93
+ editor.target = null // move.dragEmpty
94
+ }
95
+
96
+ this.lastDownLeaf = null
97
+ }
98
+
99
+ protected checkAndSelect(e: PointerEvent, isDownType?: boolean): void { // pointer.down or tap
78
100
  if (this.running && !this.isMoveMode && !e.middle) {
101
+ const { editor } = this
79
102
  const find = this.lastDownLeaf = findOne(e.path)
80
103
 
81
104
  if (find) {
82
105
 
83
- if (e.shiftKey) {
84
- this.editor.shiftItem(find)
106
+ if (e.shiftKey || editor.config.continuousSelect) {
107
+ editor.shiftItem(find)
85
108
  } else {
86
- this.editor.target = find
109
+ editor.target = find
87
110
  }
88
111
 
89
112
  // change down data
90
- this.editor.updateLayout()
91
- if (!find.locked) this.app.interaction.updateDownData(e, { findList: [this.editor.editBox.rect] }, this.editor.config.dualEvent)
113
+ if (isDownType) {
114
+ editor.updateLayout()
115
+ if (!find.locked) this.app.interaction.updateDownData(e, { findList: [editor.editBox.rect] }, editor.config.dualEvent)
116
+ }
92
117
 
93
118
  } else if (this.allow(e.target)) {
94
119
 
95
- if (!e.shiftKey) this.editor.target = null
120
+ if (!e.shiftKey) editor.target = null
96
121
 
97
122
  }
98
123
  }
99
124
  }
100
125
 
101
- protected onTap(e: PointerEvent): void {
102
- if (this.running && e.shiftKey && !e.middle && !this.lastDownLeaf) {
103
- const find = this.findDeepOne(e)
104
- if (find) this.editor.shiftItem(find)
105
- } else if (this.isMoveMode) {
106
- this.editor.target = null // move.dragEmpty
107
- }
108
-
109
- this.lastDownLeaf = null
110
- }
111
-
112
126
  // drag
113
127
 
114
128
  protected onDragStart(e: DragEvent): void {
@@ -1,13 +1,17 @@
1
- import { IUIEvent } from '@leafer-ui/interface'
1
+ import { IObject, IUIEvent } from '@leafer-ui/interface'
2
2
 
3
3
  import { IEditor } from '@leafer-in/interface'
4
+ import { MathHelper } from '@leafer-ui/core'
4
5
 
5
6
  import { EditDataHelper } from '../helper/EditDataHelper'
6
7
 
7
8
 
9
+ const cacheCursors: IObject = {}
10
+
8
11
  export function updateCursor(editor: IEditor, e: IUIEvent): void {
9
12
  const { editBox } = editor, point = editBox.enterPoint
10
13
  if (!point || !editor.hasTarget || !editBox.visible) return
14
+ if (point.name === 'circle') return // 独立旋转按钮
11
15
 
12
16
  let { rotation } = editBox
13
17
  const { resizeCursor, rotateCursor, skewCursor, resizeable, rotateable, skewable } = editor.config
@@ -19,9 +23,16 @@ export function updateCursor(editor: IEditor, e: IUIEvent): void {
19
23
 
20
24
  const cursor = showSkew ? skewCursor : (showResize ? resizeCursor : rotateCursor)
21
25
  rotation += (EditDataHelper.getFlipDirection(point.direction, flippedX, flippedY) + 1) * 45
26
+ rotation = Math.round(MathHelper.formatRotation(rotation, true) / 2) * 2
22
27
 
23
28
  const { url, x, y } = cursor
24
- point.cursor = { url: toDataURL(url, rotation), x, y }
29
+ const key = url + rotation
30
+
31
+ if (cacheCursors[key]) {
32
+ point.cursor = cacheCursors[key]
33
+ } else {
34
+ cacheCursors[key] = point.cursor = { url: toDataURL(url, rotation), x, y }
35
+ }
25
36
  }
26
37
 
27
38
  export function updateMoveCursor(editor: IEditor): void {
@@ -4,6 +4,10 @@ import { Event } from '@leafer-ui/core'
4
4
  import { IEditor, IEditorEvent } from '@leafer-in/interface'
5
5
 
6
6
 
7
+ function toList(value: IUI | IUI[]): IUI[] {
8
+ return value ? (value instanceof Array ? value : [value]) : []
9
+ }
10
+
7
11
  export class EditorEvent extends Event implements IEditorEvent {
8
12
 
9
13
  static SELECT = 'editor.select'
@@ -15,6 +19,9 @@ export class EditorEvent extends Event implements IEditorEvent {
15
19
  readonly value: IUI | IUI[]
16
20
  readonly oldValue: IUI | IUI[]
17
21
 
22
+ get list() { return toList(this.value) }
23
+ get oldList() { return toList(this.oldValue) }
24
+
18
25
  readonly worldOrigin: IPointData
19
26
  declare readonly origin: IPointData
20
27
 
@@ -9,7 +9,7 @@ const { toPoint } = AroundHelper
9
9
 
10
10
  export const EditDataHelper = {
11
11
 
12
- getScaleData(bounds: IBoundsData, direction: IDirection8, pointMove: IPointData, lockRatio: boolean, around: IAround): IEditorScaleEvent {
12
+ getScaleData(bounds: IBoundsData, direction: IDirection8, pointMove: IPointData, lockRatio: boolean | 'corner', around: IAround): IEditorScaleEvent {
13
13
  let origin: IPointData, scaleX: number = 1, scaleY: number = 1
14
14
  const { width, height } = bounds
15
15
 
@@ -66,8 +66,11 @@ export const EditDataHelper = {
66
66
  }
67
67
 
68
68
  if (lockRatio) {
69
- if (scaleX !== 1) scaleY = scaleX
70
- else scaleX = scaleY
69
+ const unlockSide = lockRatio === 'corner' && direction % 2
70
+ if (!unlockSide) {
71
+ if (scaleY !== 1) scaleX = scaleY
72
+ else scaleY = scaleX
73
+ }
71
74
  }
72
75
 
73
76
  toPoint(around || origin, bounds, origin)
package/types/index.d.ts CHANGED
@@ -22,6 +22,7 @@ declare class EditSelect extends Group implements IEditSelect {
22
22
  protected onPointerMove(e: PointerEvent): void;
23
23
  protected onBeforeDown(e: PointerEvent): void;
24
24
  protected onTap(e: PointerEvent): void;
25
+ protected checkAndSelect(e: PointerEvent, isDownType?: boolean): void;
25
26
  protected onDragStart(e: DragEvent): void;
26
27
  protected onDrag(e: DragEvent): void;
27
28
  protected onDragEnd(): void;
@@ -142,6 +143,8 @@ declare class EditorEvent extends Event implements IEditorEvent {
142
143
  readonly editor: IEditor;
143
144
  readonly value: IUI | IUI[];
144
145
  readonly oldValue: IUI | IUI[];
146
+ get list(): IUI[];
147
+ get oldList(): IUI[];
145
148
  readonly worldOrigin: IPointData;
146
149
  readonly origin: IPointData;
147
150
  constructor(type: string, data?: IEditorEvent);
@@ -205,7 +208,7 @@ declare const EditorHelper: {
205
208
  };
206
209
 
207
210
  declare const EditDataHelper: {
208
- getScaleData(bounds: IBoundsData, direction: IDirection8, pointMove: IPointData, lockRatio: boolean, around: IAround): IEditorScaleEvent;
211
+ getScaleData(bounds: IBoundsData, direction: IDirection8, pointMove: IPointData, lockRatio: boolean | 'corner', around: IAround): IEditorScaleEvent;
209
212
  getRotateData(bounds: IBoundsData, direction: IDirection8, current: IPointData, last: IPointData, around: IAround): IEditorRotateEvent;
210
213
  getSkewData(bounds: IBoundsData, direction: IDirection8, move: IPointData, around: IAround): IEditorSkewEvent;
211
214
  getAround(around: IAround, altKey: boolean): IAround;