@rnacanvas/draw.floating 3.2.1 → 3.2.2
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.
- package/README.md +268 -1
- package/dist/Rectangle.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -12,7 +12,7 @@ All exports of this package can be accessed as named imports.
|
|
|
12
12
|
|
|
13
13
|
```javascript
|
|
14
14
|
// some example imports
|
|
15
|
-
import { Text, Circle } from '@rnacanvas/draw.floating';
|
|
15
|
+
import { Text, Circle, Rectangle } from '@rnacanvas/draw.floating';
|
|
16
16
|
```
|
|
17
17
|
|
|
18
18
|
## `class Text`
|
|
@@ -430,3 +430,270 @@ circle2.domNode === circle1.domNode; // true
|
|
|
430
430
|
|
|
431
431
|
circle2 === circle1 // false
|
|
432
432
|
```
|
|
433
|
+
|
|
434
|
+
## `class Rectangle`
|
|
435
|
+
|
|
436
|
+
A rectangle element.
|
|
437
|
+
|
|
438
|
+
```javascript
|
|
439
|
+
var rectangle = Rectangle.create();
|
|
440
|
+
|
|
441
|
+
// set center coordinates
|
|
442
|
+
rectangle.centerX = 10;
|
|
443
|
+
rectangle.centerY = 20;
|
|
444
|
+
|
|
445
|
+
rectangle.width = 15;
|
|
446
|
+
rectangle.height = 25;
|
|
447
|
+
|
|
448
|
+
// controls how rounded the corners are
|
|
449
|
+
rectangle.cornerRadius = 5;
|
|
450
|
+
|
|
451
|
+
// black stroke
|
|
452
|
+
rectangle.domNode.setAttribute('stroke', 'black');
|
|
453
|
+
rectangle.domNode.setAttribute('stroke-width', '1');
|
|
454
|
+
|
|
455
|
+
// white filling
|
|
456
|
+
rectangle.domNode.setAttribute('fill', 'white');
|
|
457
|
+
```
|
|
458
|
+
|
|
459
|
+
### `static create()`
|
|
460
|
+
|
|
461
|
+
Creates a new rectangle from scratch.
|
|
462
|
+
|
|
463
|
+
```javascript
|
|
464
|
+
var rectangle = Rectangle.create();
|
|
465
|
+
```
|
|
466
|
+
|
|
467
|
+
The rectangle will be created with a UUID
|
|
468
|
+
and with some default values
|
|
469
|
+
(e.g., width and height, stroke and fill colors).
|
|
470
|
+
|
|
471
|
+
### `constructor()`
|
|
472
|
+
|
|
473
|
+
Constructs a new rectangle instance wrapping the specified SVG path element.
|
|
474
|
+
|
|
475
|
+
```javascript
|
|
476
|
+
var domNode = document.createElementNS('http://www.w3.org/2000/svg', 'path');
|
|
477
|
+
|
|
478
|
+
var rectangle = new Rectangle(domNode);
|
|
479
|
+
|
|
480
|
+
rectangle.domNode === domNode; // true
|
|
481
|
+
```
|
|
482
|
+
|
|
483
|
+
The input SVG path element is not modified in any way by this constructor.
|
|
484
|
+
|
|
485
|
+
This constructor is more meant for internal use
|
|
486
|
+
(e.g., when recreating saved rectangle elements).
|
|
487
|
+
|
|
488
|
+
### `readonly domNode`
|
|
489
|
+
|
|
490
|
+
The SVG path element corresponding to the rectangle element.
|
|
491
|
+
|
|
492
|
+
```javascript
|
|
493
|
+
var rectangle = Rectangle.create();
|
|
494
|
+
|
|
495
|
+
rectangle.domNode instanceof SVGPathElement; // true
|
|
496
|
+
```
|
|
497
|
+
|
|
498
|
+
### `readonly id`
|
|
499
|
+
|
|
500
|
+
The ID of the rectangle.
|
|
501
|
+
|
|
502
|
+
Is equal to the `id` attribute of the underlying SVG path element.
|
|
503
|
+
|
|
504
|
+
```javascript
|
|
505
|
+
var rectangle = Rectangle.create();
|
|
506
|
+
|
|
507
|
+
rectangle.domNode.setAttribute('id', 'id-12345');
|
|
508
|
+
|
|
509
|
+
rectangle.id; // "id-12345"
|
|
510
|
+
```
|
|
511
|
+
|
|
512
|
+
<b>All drawing elements must have a unique ID for RNAcanvas drawings to be savable
|
|
513
|
+
and for undo / redo functionality to work.</b>
|
|
514
|
+
|
|
515
|
+
Note that the `create()` static method already creates rectangles with a UUID.
|
|
516
|
+
|
|
517
|
+
(IDs should generally not be changed after being initialized.)
|
|
518
|
+
|
|
519
|
+
### `centerX`
|
|
520
|
+
|
|
521
|
+
Center X coordinate.
|
|
522
|
+
|
|
523
|
+
```javascript
|
|
524
|
+
var rectangle = Rectangle.create();
|
|
525
|
+
|
|
526
|
+
rectangle.centerX = 10;
|
|
527
|
+
|
|
528
|
+
// is stored under the `data-center-x` attribute
|
|
529
|
+
rectangle.domNode.dataset.centerX; // "10"
|
|
530
|
+
```
|
|
531
|
+
|
|
532
|
+
This value is stored under the `data-center-x` attribute,
|
|
533
|
+
which allows for watching for changes to it using mutation observers.
|
|
534
|
+
|
|
535
|
+
### `centerY`
|
|
536
|
+
|
|
537
|
+
Center Y coordinate.
|
|
538
|
+
|
|
539
|
+
```javascript
|
|
540
|
+
var rectangle = Rectangle.create();
|
|
541
|
+
|
|
542
|
+
rectangle.centerY = 20;
|
|
543
|
+
|
|
544
|
+
// is stored under the `data-center-y` attribute
|
|
545
|
+
rectangle.domNode.dataset.centerY; // "20"
|
|
546
|
+
```
|
|
547
|
+
|
|
548
|
+
This value is stored under the `data-center-y` attribute,
|
|
549
|
+
which allows for watching for changes to it using mutation observers.
|
|
550
|
+
|
|
551
|
+
### `drag()`
|
|
552
|
+
|
|
553
|
+
Move the center coordinates of a rectangle by the specified X and Y amounts.
|
|
554
|
+
|
|
555
|
+
```javascript
|
|
556
|
+
var rectangle = Rectangle.create();
|
|
557
|
+
|
|
558
|
+
rectangle.centerX = 10;
|
|
559
|
+
rectangle.centerY = 20;
|
|
560
|
+
|
|
561
|
+
rectangle.drag(5, -2);
|
|
562
|
+
|
|
563
|
+
rectangle.centerX; // 15
|
|
564
|
+
rectangle.centerY; // 18
|
|
565
|
+
```
|
|
566
|
+
|
|
567
|
+
### `direction`
|
|
568
|
+
|
|
569
|
+
The direction of the rectangle (in radians).
|
|
570
|
+
|
|
571
|
+
```javascript
|
|
572
|
+
var rectangle = Rectangle.create();
|
|
573
|
+
|
|
574
|
+
// rectangles are created upright by default
|
|
575
|
+
rectangle.direction; // -Math.PI / 2
|
|
576
|
+
|
|
577
|
+
// "pointing" to the left
|
|
578
|
+
rectangle.direction = Math.PI;
|
|
579
|
+
|
|
580
|
+
// "pointing" to the right
|
|
581
|
+
rectangle.direction = 0;
|
|
582
|
+
|
|
583
|
+
// is stored under the `data-direction` attribute
|
|
584
|
+
rectangle.domNode.dataset.direction; // "0"
|
|
585
|
+
```
|
|
586
|
+
|
|
587
|
+
This value is stored under the `data-direction` attribute,
|
|
588
|
+
which allows for watching for changes to it using mutation observers.
|
|
589
|
+
|
|
590
|
+
### `width`
|
|
591
|
+
|
|
592
|
+
The width of a rectangle.
|
|
593
|
+
|
|
594
|
+
```javascript
|
|
595
|
+
var rectangle = Rectangle.create();
|
|
596
|
+
|
|
597
|
+
rectangle.width = 30;
|
|
598
|
+
|
|
599
|
+
// is stored under the `data-width` attribute
|
|
600
|
+
rectangle.domNode.dataset.width; // "30"
|
|
601
|
+
```
|
|
602
|
+
|
|
603
|
+
This value is stored under the `data-width` attribute,
|
|
604
|
+
which allows for watching for changes to it using mutation observers.
|
|
605
|
+
|
|
606
|
+
### `height`
|
|
607
|
+
|
|
608
|
+
The height of a rectangle.
|
|
609
|
+
|
|
610
|
+
```javascript
|
|
611
|
+
var rectangle = Rectangle.create();
|
|
612
|
+
|
|
613
|
+
rectangle.height = 50;
|
|
614
|
+
|
|
615
|
+
// is stored under the `data-height` attribute
|
|
616
|
+
rectangle.domNode.dataset.height; // "50"
|
|
617
|
+
```
|
|
618
|
+
|
|
619
|
+
This value is stored under the `data-height` attribute,
|
|
620
|
+
which allows for watching for changes to it using mutation observers.
|
|
621
|
+
|
|
622
|
+
### `cornerRadius`
|
|
623
|
+
|
|
624
|
+
Controls how rounded the corners of a rectangle are.
|
|
625
|
+
|
|
626
|
+
```javascript
|
|
627
|
+
var rectangle = Rectangle.create();
|
|
628
|
+
|
|
629
|
+
rectangle.cornerRadius = 5;
|
|
630
|
+
|
|
631
|
+
// is stored under the `data-corner-radius` attribute
|
|
632
|
+
rectangle.domNode.dataset.cornerRadius; // "5"
|
|
633
|
+
```
|
|
634
|
+
|
|
635
|
+
This value is stored under the `data-corner-radius` attribute,
|
|
636
|
+
which allows for watching for changes to it using mutation observers.
|
|
637
|
+
|
|
638
|
+
### `readonly bbox`
|
|
639
|
+
|
|
640
|
+
The bounding box of a rectangle.
|
|
641
|
+
|
|
642
|
+
<b>Bounding boxes can only be calculated
|
|
643
|
+
when drawing elements have been added to the document body.</b>
|
|
644
|
+
|
|
645
|
+
```javascript
|
|
646
|
+
var rectangle = Rectangle.create();
|
|
647
|
+
|
|
648
|
+
var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
|
|
649
|
+
|
|
650
|
+
svg.append(rectangle.domNode);
|
|
651
|
+
|
|
652
|
+
// add everything to the document body
|
|
653
|
+
document.body.append(svg);
|
|
654
|
+
|
|
655
|
+
rectangle.centerX = 0;
|
|
656
|
+
rectangle.centerY = 0;
|
|
657
|
+
|
|
658
|
+
rectangle.width = 10;
|
|
659
|
+
rectangle.height = 20;
|
|
660
|
+
|
|
661
|
+
rectangle.bbox.x; // -5
|
|
662
|
+
rectangle.bbox.y; // -10
|
|
663
|
+
rectangle.bbox.width; // 10
|
|
664
|
+
rectangle.bbox.height; // 20
|
|
665
|
+
```
|
|
666
|
+
|
|
667
|
+
See [Box](https://pzhaojohnson.github.io/rnacanvas.boxes/) class documentation
|
|
668
|
+
for a full list of bounding box methods and properties.
|
|
669
|
+
|
|
670
|
+
### `serialized()`
|
|
671
|
+
|
|
672
|
+
Returns the serialized form of a rectangle,
|
|
673
|
+
which is a JSON-serializable object.
|
|
674
|
+
|
|
675
|
+
```javascript
|
|
676
|
+
var rectangle = Rectangle.create();
|
|
677
|
+
|
|
678
|
+
var savedRectangle = rectangle.serialized();
|
|
679
|
+
```
|
|
680
|
+
|
|
681
|
+
### `static recreate()`
|
|
682
|
+
|
|
683
|
+
Recreates a saved rectangle given the parent drawing that its DOM node is in.
|
|
684
|
+
|
|
685
|
+
```javascript
|
|
686
|
+
var rectangle1 = Rectangle.create();
|
|
687
|
+
|
|
688
|
+
var savedRectangle = rectangle1.serialized();
|
|
689
|
+
|
|
690
|
+
// an RNAcanvas drawing
|
|
691
|
+
parentDrawing;
|
|
692
|
+
|
|
693
|
+
var rectangle2 = Rectangle.recreate(savedRectangle, parentDrawing);
|
|
694
|
+
|
|
695
|
+
// share the same DOM node
|
|
696
|
+
rectangle2.domNode === rectangle1.domNode; // true
|
|
697
|
+
|
|
698
|
+
rectangle2 === rectangle1; // false
|
|
699
|
+
```
|
package/dist/Rectangle.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Rectangle.d.ts","sourceRoot":"","sources":["../src/Rectangle.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAMzC,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"Rectangle.d.ts","sourceRoot":"","sources":["../src/Rectangle.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAMzC,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAQvC;;GAEG;AACH,qBAAa,SAAS;;IAwCR,QAAQ,CAAC,OAAO,EAAE,cAAc;IAvC5C;;;;;OAKG;IACH,MAAM,CAAC,MAAM,IAAI,SAAS;gBAiCL,OAAO,EAAE,cAAc;IAsB5C,IAAI,EAAE,IAAI,MAAM,CAEf;IAED;;OAEG;IACH,IAAI,OAAO,IAAI,MAAM,CAIpB;IAED,IAAI,OAAO,CAAC,OAAO,EANJ,MAMI,EASlB;IAED;;OAEG;IACH,IAAI,OAAO,IAAI,MAAM,CAIpB;IAED,IAAI,OAAO,CAAC,OAAO,EANJ,MAMI,EASlB;IAED,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI;IAKhC,IAAI,SAAS,IAAI,MAAM,CAItB;IAED,IAAI,SAAS,CAAC,SAAS,EANN,MAMM,EAStB;IAED,IAAI,KAAK,IAAI,MAAM,CAIlB;IAED,IAAI,KAAK,CAAC,KAAK,EANF,MAME,EASd;IAED,IAAI,MAAM,IAAI,MAAM,CAInB;IAED,IAAI,MAAM,CAAC,MAAM,EANH,MAMG,EAShB;IAED,IAAI,YAAY,IAAI,MAAM,CAIzB;IAED,IAAI,YAAY,CAAC,YAAY,EANT,MAMS,EAS5B;IAED;;OAEG;IACH,IAAI,IAAI,IAAI,GAAG,CAEd;IAkBD;;;;;OAKG;IACH,UAAU;;;IAUV;;;;OAIG;IACH,MAAM,CAAC,QAAQ,CAAC,cAAc,EAAE,OAAO,EAAE,aAAa,EAAE,OAAO,GAAG,SAAS,GAAG,KAAK;CA0CpF"}
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports["draw.floating"]=e():t["draw.floating"]=e()}(this,()=>(()=>{var t={645(t){var e;e=()=>(()=>{var t={986(t){t.exports=(()=>{"use strict";var t={d:(e,r)=>{for(var i in r)t.o(r,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:r[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function r(t){var e=0;return t.forEach(function(t){return e+=t}),e}function i(t){return r(t)/t.length}function n(t){t.sort(function(t,e){return t-e})}t.r(e),t.d(e,{areWithin:()=>m,average:()=>i,clamp:()=>l,degrees:()=>b,flipAway:()=>v,isBetween:()=>h,isBetweenExclusive:()=>u,isBetweenInclusive:()=>h,max:()=>d,mean:()=>i,median:()=>a,min:()=>c,normalizeAngle:()=>w,radians:()=>y,round:()=>g,sortNumbers:()=>n,sortNumbersAscending:()=>n,sortNumbersDescending:()=>f,sortedNumbers:()=>s,sortedNumbersAscending:()=>s,sortedNumbersDescending:()=>p,sum:()=>r});var o=function(t,e,r){if(r||2===arguments.length)for(var i,n=0,o=e.length;n<o;n++)!i&&n in e||(i||(i=Array.prototype.slice.call(e,0,n)),i[n]=e[n]);return t.concat(i||Array.prototype.slice.call(e))};function s(t){var e=o([],t,!0);return n(e),e}function a(t){if(0==t.length)return NaN;var e=s(t);if(e.length%2!=0)return e[Math.floor(e.length/2)];var r=e.length/2,n=r-1;return i([e[r],e[n]])}function c(t){if(0==t.length)return 1/0;var e=t[0];return t.slice(1).forEach(function(t){e=Math.min(e,t)}),e}function d(t){if(0==t.length)return-1/0;var e=t[0];return t.slice(1).forEach(function(t){e=Math.max(e,t)}),e}function h(t,e,r){return t>=e&&t<=r}function u(t,e,r){return t>e&&t<r}function l(t,e,r){return t<e?e:t>r?r:t}function m(t,e,r){return Math.abs(t-e)<=r}function f(t){n(t),t.reverse()}function p(t){var e=s(t);return e.reverse(),e}function g(t,e){return Number.parseFloat(t.toFixed(null!=e?e:0))}function b(t){return t*(180/Math.PI)}function y(t){return t*(Math.PI/180)}function w(t,e){void 0===e&&(e=-Math.PI);var r=t-e;return e+((r%=2*Math.PI)>=0?r:r+2*Math.PI)}function v(t,e){var r=(e=w(e,t))-t;return(r<Math.PI/2||r>3*Math.PI/2)&&(t+=Math.PI),t}return e})()}},e={};function r(i){var n=e[i];if(void 0!==n)return n.exports;var o=e[i]={exports:{}};return t[i].call(o.exports,o,o.exports,r),o.exports}r.d=(t,e)=>{for(var i in e)r.o(e,i)&&!r.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var i={};return(()=>{"use strict";r.r(i),r.d(i,{Box:()=>e});var t=r(986);class e{static matching(t){let{x:r,y:i,width:n,height:o}=t;return new e(r,i,n,o)}static bounding(r){let i=[...r];if(0==i.length)throw new Error("An empty collection of boxes doesn't have a bounding box.");let n=i.map(t=>e.matching(t)),o=(0,t.min)(n.map(t=>t.left)),s=(0,t.min)(n.map(t=>t.top)),a=(0,t.max)(n.map(t=>t.right))-o,c=(0,t.max)(n.map(t=>t.bottom))-s;return new e(o,s,a,c)}constructor(t,e,r,i){this.x=t,this.y=e,this.width=r,this.height=i}get centerX(){return this.minX+this.width/2}get centerY(){return this.minY+this.height/2}get minX(){return this.x}get minY(){return this.y}get maxX(){return this.minX+this.width}get maxY(){return this.minY+this.height}get top(){return this.minY}get right(){return this.maxX}get bottom(){return this.maxY}get left(){return this.minX}bounds(t){let r=e.matching(t);return this.minX<=r.minX&&this.minY<=r.minY&&this.maxX>=r.maxX&&this.maxY>=r.maxY}padded(...t){let r="number"==typeof t[0]?t[0]:"factor"in t[0]?t[0].factor*this.width:t[0].percentage/100*this.width,i="number"==typeof t[0]&&"number"==typeof t[1]?t[1]:"number"==typeof t[0]?t[0]:"factor"in t[0]?t[0].factor*this.height:t[0].percentage/100*this.height;return new e(this.x-r,this.y-i,this.width+2*r,this.height+2*i)}get periphery(){return{atAngle:t=>{let e=this.width/2,r=this.height/2,i=Math.pow(Math.pow(e,2)+Math.pow(r,2),.5),n=this.centerX+i*Math.cos(t),o=this.centerY+i*Math.sin(t),s=i;return Math.abs(this.centerX-n)>e&&(s=Math.abs(e/Math.cos(t)),s=Number.isFinite(s)?s:r),Math.abs(this.centerY-o)>r&&(s=Math.abs(r/Math.sin(t)),s=Number.isFinite(s)?s:e),{x:this.centerX+s*Math.cos(t),y:this.centerY+s*Math.sin(t)}}}}}})(),i})(),t.exports=e()},731(t){var e;e=()=>(()=>{"use strict";var t={d:(e,r)=>{for(var i in r)t.o(r,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:r[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{CenterPoint:()=>d});var r,i,n,o,s,a=function(t,e,r,i,n){if("m"===i)throw new TypeError("Private method is not writable");if("a"===i&&!n)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e||!n:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===i?n.call(t,r):n?n.value=r:e.set(t,r),r},c=function(t,e,r,i){if("a"===r&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!i:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?i:"a"===r?i.call(t):i?i.value:e.get(t)};class d{constructor(t){r.add(this),i.set(this,void 0),n.set(this,{move:[]}),o.set(this,void 0),a(this,i,t,"f"),a(this,o,new MutationObserver(()=>c(this,r,"m",s).call(this,"move")),"f"),c(this,o,"f").observe(t,{attributes:!0,childList:!0,characterData:!0,subtree:!0})}get x(){let t=c(this,i,"f").getBBox();return t.x+t.width/2}set x(t){let e=this.x,r=[...c(this,i,"f").x.baseVal].map(t=>t.value);0!=r.length||r.push(0),r=r.map(r=>r+(t-e)),c(this,i,"f").setAttribute("x",r.join(", "))}get y(){let t=c(this,i,"f").getBBox();return t.y+t.height/2}set y(t){let e=this.y,r=[...c(this,i,"f").y.baseVal].map(t=>t.value);0!=r.length||r.push(0),r=r.map(r=>r+(t-e)),c(this,i,"f").setAttribute("y",r.join(", "))}addEventListener(t,e){c(this,n,"f")[t].push(e)}removeEventListener(t,e){c(this,n,"f")[t]=c(this,n,"f")[t].filter(t=>t!==e)}}return i=new WeakMap,n=new WeakMap,o=new WeakMap,r=new WeakSet,s=function(t){c(this,n,"f")[t].forEach(t=>t())},e})(),t.exports=e()},456(t){var e;e=()=>(()=>{var t={277(t){var e;e=()=>(()=>{"use strict";var t={d:(e,r)=>{for(var i in r)t.o(r,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:r[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{Vector:()=>r});class r{static matching(t){let e="x"in t?t.x:t.magnitude*Math.cos(t.direction),i="y"in t?t.y:t.magnitude*Math.sin(t.direction);return new r(e,i)}constructor(t,e){this.x=t,this.y=e}[Symbol.iterator](){return[this.x,this.y].values()}get magnitude(){return Math.sqrt(Math.pow(this.x,2)+Math.pow(this.y,2))}set magnitude(t){let e=this.direction;this.x=t*Math.cos(e),this.y=t*Math.sin(e)}get direction(){return Math.atan2(this.y,this.x)}set direction(t){let e=this.magnitude;this.x=e*Math.cos(t),this.y=e*Math.sin(t)}}return e})(),t.exports=e()}},e={};function r(i){var n=e[i];if(void 0!==n)return n.exports;var o=e[i]={exports:{}};return t[i].call(o.exports,o,o.exports,r),o.exports}r.d=(t,e)=>{for(var i in e)r.o(e,i)&&!r.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var i={};return(()=>{"use strict";r.r(i),r.d(i,{Point:()=>e,RelativePoint:()=>h});var t=r(277);class e{static matching(t){return new e(t.x,t.y)}constructor(t,e){this.x=t,this.y=e}[Symbol.iterator](){return[this.x,this.y].values()}displace(e){let r=t.Vector.matching(e);this.x+=r.x,this.y+=r.y}displaced(t){let r=e.matching(this);return r.displace(t),r}displacementTo(e){return new t.Vector(e.x-this.x,e.y-this.y)}displacementFrom(e){return new t.Vector(this.x-e.x,this.y-e.y)}distanceTo(t){return this.displacementTo(t).magnitude}distanceFrom(t){return this.distanceTo(t)}directionTo(t){return this.displacementTo(t).direction}directionFrom(t){return this.displacementFrom(t).direction}}var n,o,s,a,c,d=function(t,e,r,i){if("a"===r&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!i:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?i:"a"===r?i.call(t):i?i.value:e.get(t)};class h{constructor(e){n.add(this),o.set(this,void 0),s.set(this,new t.Vector(0,0)),a.set(this,{move:[]}),function(t,e,r){if("function"==typeof e||!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");e.set(t,r)}(this,o,e),e.addEventListener("move",()=>d(this,n,"m",c).call(this,"move"))}get x(){return d(this,o,"f").x+d(this,s,"f").x}set x(t){d(this,s,"f").x=t-d(this,o,"f").x,d(this,n,"m",c).call(this,"move")}get y(){return d(this,o,"f").y+d(this,s,"f").y}set y(t){d(this,s,"f").y=t-d(this,o,"f").y,d(this,n,"m",c).call(this,"move")}addEventListener(t,e){d(this,a,"f")[t].push(e)}removeEventListener(t,e){d(this,a,"f")[t]=d(this,a,"f")[t].filter(t=>t!==e)}}o=new WeakMap,s=new WeakMap,a=new WeakMap,n=new WeakSet,c=function(t){d(this,a,"f")[t].forEach(t=>t())}})(),i})(),t.exports=e()},854(t){t.exports=(()=>{"use strict";var t={d:(e,r)=>{for(var i in r)t.o(r,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:r[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function r(t){return"number"==typeof t}function i(t){return r(t)&&Number.isFinite(t)}function n(t){return r(t)&&!Number.isFinite(t)}function o(t){return i(t)&&t>0}function s(t){return i(t)&&t>=0}function a(t){return"string"==typeof t}function c(t){return null==t}function d(t){return"object"==typeof t&&null!==t}function h(t){return Array.isArray(t)}function u(t){return h(t)&&0==t.length}function l(t){return h(t)&&t.length>0}function m(t){return h(t)&&t.every(r)}function f(t){return m(t)&&t.length>0}function p(t){return h(t)&&t.every(i)}function g(t){return h(t)&&t.every(n)}function b(t){return h(t)&&t.every(a)}function y(t){return b(t)&&t.length>0}return t.r(e),t.d(e,{isArray:()=>h,isEmptyArray:()=>u,isFiniteNumber:()=>i,isFiniteNumbersArray:()=>p,isNonEmptyArray:()=>l,isNonEmptyNumbersArray:()=>f,isNonEmptyStringsArray:()=>y,isNonFiniteNumber:()=>n,isNonFiniteNumbersArray:()=>g,isNonNegativeFiniteNumber:()=>s,isNonNullObject:()=>d,isNullish:()=>c,isNumber:()=>r,isNumbersArray:()=>m,isPositiveFiniteNumber:()=>o,isString:()=>a,isStringsArray:()=>b}),e})()}},e={};function r(i){var n=e[i];if(void 0!==n)return n.exports;var o=e[i]={exports:{}};return t[i].call(o.exports,o,o.exports,r),o.exports}r.d=(t,e)=>{for(var i in e)r.o(e,i)&&!r.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var i={};return(()=>{"use strict";r.r(i),r.d(i,{Circle:()=>l,Rectangle:()=>v,Text:()=>u});const t={randomUUID:"undefined"!=typeof crypto&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};let e;const n=new Uint8Array(16),o=[];for(let t=0;t<256;++t)o.push((t+256).toString(16).slice(1));function s(t,r,i){const s=(t=t||{}).random??t.rng?.()??function(){if(!e){if("undefined"==typeof crypto||!crypto.getRandomValues)throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");e=crypto.getRandomValues.bind(crypto)}return e(n)}();if(s.length<16)throw new Error("Random bytes length must be >= 16");if(s[6]=15&s[6]|64,s[8]=63&s[8]|128,r){if((i=i||0)<0||i+16>r.length)throw new RangeError(`UUID byte range ${i}:${i+15} is out of buffer bounds`);for(let t=0;t<16;++t)r[i+t]=s[t];return r}return function(t,e=0){return(o[t[e+0]]+o[t[e+1]]+o[t[e+2]]+o[t[e+3]]+"-"+o[t[e+4]]+o[t[e+5]]+"-"+o[t[e+6]]+o[t[e+7]]+"-"+o[t[e+8]]+o[t[e+9]]+"-"+o[t[e+10]]+o[t[e+11]]+o[t[e+12]]+o[t[e+13]]+o[t[e+14]]+o[t[e+15]]).toLowerCase()}(s)}const a=function(e,r,i){return!t.randomUUID||r||e?s(e,r,i):t.randomUUID()};var c=r(645),d=r(731),h=r(854);class u{static create(t){let e=document.createElementNS("http://www.w3.org/2000/svg","text");return e.id="id-"+a(),e.textContent=null!=t?t:"",e.setAttribute("font-family","Arial"),e.setAttribute("font-size","9"),e.setAttribute("font-weight","700"),e.setAttribute("font-style","normal"),e.setAttribute("fill","black"),e.setAttribute("fill-opacity","1"),new u(e)}constructor(t){this.domNode=t}get id(){return this.domNode.id}get bbox(){return c.Box.matching(this.domNode.getBBox())}get centerX(){return this.bbox.centerX}set centerX(t){new d.CenterPoint(this.domNode).x=t}get centerY(){return this.bbox.centerY}set centerY(t){new d.CenterPoint(this.domNode).y=t}drag(t,e){this.centerX+=t,this.centerY+=e}serialized(){if(!this.id)throw new Error("Text element ID is falsy.");return{id:this.id}}static recreate(t,e){if(!(0,h.isNonNullObject)(t))throw new Error(`Saved text element is not an object: ${t}.`);if(!t.id)throw new Error("Saved text element ID is falsy.");if(!(0,h.isString)(t.id))throw new Error(`Saved text element ID is not a string: ${t.id}.`);let r=e.domNode.querySelector("#"+t.id);if(!r)throw new Error("Unable to find text element DOM node in parent drawing by ID.");if(!(r instanceof SVGTextElement))throw new Error(`Text element DOM node is not an SVG text element: ${r}.`);return new u(r)}}class l{static create(){let t=document.createElementNS("http://www.w3.org/2000/svg","circle");return t.id="id-"+a(),t.setAttribute("r","6"),t.setAttribute("stroke","black"),t.setAttribute("stroke-width","1"),t.setAttribute("stroke-opacity","1"),t.setAttribute("stroke-dasharray",""),t.setAttribute("stroke-linecap",""),t.setAttribute("fill","white"),t.setAttribute("fill-opacity","1"),new l(t)}constructor(t){this.domNode=t}get id(){return this.domNode.id}get centerX(){return this.domNode.cx.baseVal.value}set centerX(t){this.domNode.setAttribute("cx",`${t}`)}get centerY(){return this.domNode.cy.baseVal.value}set centerY(t){this.domNode.setAttribute("cy",`${t}`)}drag(t,e){this.centerX+=t,this.centerY+=e}serialized(){if(!this.id)throw new Error("Circle ID is falsy.");return{id:this.id}}static recreate(t,e){if(!(0,h.isNonNullObject)(t))throw new Error(`Saved circle must be an object: ${t}.`);if(!t.id)throw new Error("Saved circle ID is falsy.");if(!(0,h.isString)(t.id))throw new Error(`Saved circle ID must be a string: ${t.id}.`);let r=e.domNode.querySelector("#"+t.id);if(!r)throw new Error("Unable to find circle element DOM node by ID.");if(!(r instanceof SVGCircleElement))throw new Error(`Circle element DOM node is not an SVG circle element: ${r}.`);return new l(r)}}var m=r(456);class f{constructor(){this.centerX=0,this.centerY=0,this.direction=-Math.PI/2,this.width=0,this.height=0,this.cornerRadius=0}static matching(t){let e=new f;return e.centerX=t.centerX,e.centerY=t.centerY,e.direction=t.direction,e.width=t.width,e.height=t.height,e.cornerRadius=t.cornerRadius,e}toString(){let t=new m.Point(this.centerX,this.centerY);t.displace({magnitude:this.height/2,direction:this.direction}),t.displace({magnitude:this.width/2-this.cornerRadius,direction:this.direction+Math.PI/2});let e=`M ${t.x} ${t.y}`;return t.displace({magnitude:Math.SQRT2*this.cornerRadius,direction:this.direction+3*Math.PI/4}),e+=` A ${this.cornerRadius} ${this.cornerRadius} 90 0 1 ${t.x} ${t.y}`,t.displace({magnitude:this.height-2*this.cornerRadius,direction:this.direction+Math.PI}),e+=` L ${t.x} ${t.y}`,t.displace({magnitude:Math.SQRT2*this.cornerRadius,direction:this.direction+5*Math.PI/4}),e+=` A ${this.cornerRadius} ${this.cornerRadius} 90 0 1 ${t.x} ${t.y}`,t.displace({magnitude:this.width-2*this.cornerRadius,direction:this.direction+3*Math.PI/2}),e+=` L ${t.x} ${t.y}`,t.displace({magnitude:Math.SQRT2*this.cornerRadius,direction:this.direction+7*Math.PI/4}),e+=` A ${this.cornerRadius} ${this.cornerRadius} 90 0 1 ${t.x} ${t.y}`,t.displace({magnitude:this.height-2*this.cornerRadius,direction:this.direction}),e+=` L ${t.x} ${t.y}`,t.displace({magnitude:Math.SQRT2*this.cornerRadius,direction:this.direction+9*Math.PI/4}),e+=` A ${this.cornerRadius} ${this.cornerRadius} 90 0 1 ${t.x} ${t.y}`,e+=" Z",e}}var p,g,b,y,w=function(t,e,r,i){if("a"===r&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!i:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?i:"a"===r?i.call(t):i?i.value:e.get(t)};class v{static create(){let t=document.createElementNS("http://www.w3.org/2000/svg","path");t.id="id-"+a();let e=new v(t);return e.centerX=0,e.centerY=0,e.direction=-Math.PI/2,e.width=5.5,e.height=5.5,e.cornerRadius=0,e.domNode.setAttribute("stroke","black"),e.domNode.setAttribute("stroke-width","1"),e.domNode.setAttribute("stroke-opacity","1"),e.domNode.setAttribute("stroke-linejoin",""),e.domNode.setAttribute("stroke-dasharray",""),e.domNode.setAttribute("stroke-linecap",""),e.domNode.setAttribute("fill","white"),e.domNode.setAttribute("fill-opacity","1"),e}constructor(t){p.add(this),this.domNode=t,t.dataset.centerX||w(this,p,"m",g).call(this),t.dataset.centerY||w(this,p,"m",b).call(this)}get id(){return this.domNode.id}get centerX(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.centerX)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set centerX(t){Number.isFinite(t)?(this.domNode.dataset.centerX=`${t}`,w(this,p,"m",y).call(this)):console.error(`The specified center X coordinate is nonfinite: ${t}.`)}get centerY(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.centerY)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set centerY(t){Number.isFinite(t)?(this.domNode.dataset.centerY=`${t}`,w(this,p,"m",y).call(this)):console.error(`The specified center Y coordinate is nonfinite: ${t}.`)}drag(t,e){this.centerX+=t,this.centerY+=e}get direction(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.direction)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set direction(t){Number.isFinite(t)?(this.domNode.dataset.direction=`${t}`,w(this,p,"m",y).call(this)):console.error(`The specified direction angle is nonfinite: ${t}.`)}get width(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.width)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set width(t){Number.isFinite(t)?(this.domNode.dataset.width=`${t}`,w(this,p,"m",y).call(this)):console.error(`The specified width is nonfinite: ${t}.`)}get height(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.height)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set height(t){Number.isFinite(t)?(this.domNode.dataset.height=`${t}`,w(this,p,"m",y).call(this)):console.error(`The specified height is nonfinite: ${t}.`)}get cornerRadius(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.cornerRadius)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set cornerRadius(t){Number.isFinite(t)?(this.domNode.dataset.cornerRadius=`${t}`,w(this,p,"m",y).call(this)):console.error(`The specified corner radius is nonfinite: ${t}.`)}get bbox(){return c.Box.matching(this.domNode.getBBox())}serialized(){if(!this.id)throw new Error("Rectangle ID is falsy.");return{id:this.id}}static recreate(t,e){if(!(0,h.isNonNullObject)(t))throw new Error(`Saved rectangle is not an object: ${t}.`);if(!t.id)throw new Error("Saved rectangle ID is falsy.");if(!(0,h.isString)(t.id))throw new Error(`Saved rectangle ID is not a string: ${t.id}.`);let r=e.domNode.querySelector("#"+t.id);if(!r)throw new Error("Unable to find saved rectangle DOM node in parent drawing by ID.");if(!(r instanceof SVGPathElement))throw new Error(`DOM node found for saved rectangle is not an SVG path element: ${r}.`);return new v(r)}}p=new WeakSet,g=function(){let t=c.Box.matching(this.domNode.getBBox());this.domNode.dataset.centerX=`${t.centerX}`},b=function(){let t=c.Box.matching(this.domNode.getBBox());this.domNode.dataset.centerY=`${t.centerY}`},y=function(){let t=new f;t.centerX=this.centerX,t.centerY=this.centerY,t.direction=this.direction,t.width=this.width,t.height=this.height,t.cornerRadius=this.cornerRadius,this.domNode.setAttribute("d",t.toString())}})(),i})());
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports["draw.floating"]=e():t["draw.floating"]=e()}(this,()=>(()=>{var t={645(t){var e;e=()=>(()=>{var t={986(t){t.exports=(()=>{"use strict";var t={d:(e,r)=>{for(var i in r)t.o(r,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:r[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function r(t){var e=0;return t.forEach(function(t){return e+=t}),e}function i(t){return r(t)/t.length}function n(t){t.sort(function(t,e){return t-e})}t.r(e),t.d(e,{areWithin:()=>m,average:()=>i,clamp:()=>l,degrees:()=>b,flipAway:()=>v,isBetween:()=>h,isBetweenExclusive:()=>u,isBetweenInclusive:()=>h,max:()=>d,mean:()=>i,median:()=>a,min:()=>c,normalizeAngle:()=>w,radians:()=>y,round:()=>p,sortNumbers:()=>n,sortNumbersAscending:()=>n,sortNumbersDescending:()=>f,sortedNumbers:()=>s,sortedNumbersAscending:()=>s,sortedNumbersDescending:()=>g,sum:()=>r});var o=function(t,e,r){if(r||2===arguments.length)for(var i,n=0,o=e.length;n<o;n++)!i&&n in e||(i||(i=Array.prototype.slice.call(e,0,n)),i[n]=e[n]);return t.concat(i||Array.prototype.slice.call(e))};function s(t){var e=o([],t,!0);return n(e),e}function a(t){if(0==t.length)return NaN;var e=s(t);if(e.length%2!=0)return e[Math.floor(e.length/2)];var r=e.length/2,n=r-1;return i([e[r],e[n]])}function c(t){if(0==t.length)return 1/0;var e=t[0];return t.slice(1).forEach(function(t){e=Math.min(e,t)}),e}function d(t){if(0==t.length)return-1/0;var e=t[0];return t.slice(1).forEach(function(t){e=Math.max(e,t)}),e}function h(t,e,r){return t>=e&&t<=r}function u(t,e,r){return t>e&&t<r}function l(t,e,r){return t<e?e:t>r?r:t}function m(t,e,r){return Math.abs(t-e)<=r}function f(t){n(t),t.reverse()}function g(t){var e=s(t);return e.reverse(),e}function p(t,e){return Number.parseFloat(t.toFixed(null!=e?e:0))}function b(t){return t*(180/Math.PI)}function y(t){return t*(Math.PI/180)}function w(t,e){void 0===e&&(e=-Math.PI);var r=t-e;return e+((r%=2*Math.PI)>=0?r:r+2*Math.PI)}function v(t,e){var r=(e=w(e,t))-t;return(r<Math.PI/2||r>3*Math.PI/2)&&(t+=Math.PI),t}return e})()}},e={};function r(i){var n=e[i];if(void 0!==n)return n.exports;var o=e[i]={exports:{}};return t[i].call(o.exports,o,o.exports,r),o.exports}r.d=(t,e)=>{for(var i in e)r.o(e,i)&&!r.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var i={};return(()=>{"use strict";r.r(i),r.d(i,{Box:()=>e});var t=r(986);class e{static matching(t){let{x:r,y:i,width:n,height:o}=t;return new e(r,i,n,o)}static bounding(r){let i=[...r];if(0==i.length)throw new Error("An empty collection of boxes doesn't have a bounding box.");let n=i.map(t=>e.matching(t)),o=(0,t.min)(n.map(t=>t.left)),s=(0,t.min)(n.map(t=>t.top)),a=(0,t.max)(n.map(t=>t.right))-o,c=(0,t.max)(n.map(t=>t.bottom))-s;return new e(o,s,a,c)}constructor(t,e,r,i){this.x=t,this.y=e,this.width=r,this.height=i}get centerX(){return this.minX+this.width/2}get centerY(){return this.minY+this.height/2}get minX(){return this.x}get minY(){return this.y}get maxX(){return this.minX+this.width}get maxY(){return this.minY+this.height}get top(){return this.minY}get right(){return this.maxX}get bottom(){return this.maxY}get left(){return this.minX}bounds(t){let r=e.matching(t);return this.minX<=r.minX&&this.minY<=r.minY&&this.maxX>=r.maxX&&this.maxY>=r.maxY}padded(...t){let r="number"==typeof t[0]?t[0]:"factor"in t[0]?t[0].factor*this.width:t[0].percentage/100*this.width,i="number"==typeof t[0]&&"number"==typeof t[1]?t[1]:"number"==typeof t[0]?t[0]:"factor"in t[0]?t[0].factor*this.height:t[0].percentage/100*this.height;return new e(this.x-r,this.y-i,this.width+2*r,this.height+2*i)}get periphery(){return{atAngle:t=>{let e=this.width/2,r=this.height/2,i=Math.pow(Math.pow(e,2)+Math.pow(r,2),.5),n=this.centerX+i*Math.cos(t),o=this.centerY+i*Math.sin(t),s=i;return Math.abs(this.centerX-n)>e&&(s=Math.abs(e/Math.cos(t)),s=Number.isFinite(s)?s:r),Math.abs(this.centerY-o)>r&&(s=Math.abs(r/Math.sin(t)),s=Number.isFinite(s)?s:e),{x:this.centerX+s*Math.cos(t),y:this.centerY+s*Math.sin(t)}}}}}})(),i})(),t.exports=e()},731(t){var e;e=()=>(()=>{"use strict";var t={d:(e,r)=>{for(var i in r)t.o(r,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:r[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{CenterPoint:()=>d});var r,i,n,o,s,a=function(t,e,r,i,n){if("m"===i)throw new TypeError("Private method is not writable");if("a"===i&&!n)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e||!n:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===i?n.call(t,r):n?n.value=r:e.set(t,r),r},c=function(t,e,r,i){if("a"===r&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!i:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?i:"a"===r?i.call(t):i?i.value:e.get(t)};class d{constructor(t){r.add(this),i.set(this,void 0),n.set(this,{move:[]}),o.set(this,void 0),a(this,i,t,"f"),a(this,o,new MutationObserver(()=>c(this,r,"m",s).call(this,"move")),"f"),c(this,o,"f").observe(t,{attributes:!0,childList:!0,characterData:!0,subtree:!0})}get x(){let t=c(this,i,"f").getBBox();return t.x+t.width/2}set x(t){let e=this.x,r=[...c(this,i,"f").x.baseVal].map(t=>t.value);0!=r.length||r.push(0),r=r.map(r=>r+(t-e)),c(this,i,"f").setAttribute("x",r.join(", "))}get y(){let t=c(this,i,"f").getBBox();return t.y+t.height/2}set y(t){let e=this.y,r=[...c(this,i,"f").y.baseVal].map(t=>t.value);0!=r.length||r.push(0),r=r.map(r=>r+(t-e)),c(this,i,"f").setAttribute("y",r.join(", "))}addEventListener(t,e){c(this,n,"f")[t].push(e)}removeEventListener(t,e){c(this,n,"f")[t]=c(this,n,"f")[t].filter(t=>t!==e)}}return i=new WeakMap,n=new WeakMap,o=new WeakMap,r=new WeakSet,s=function(t){c(this,n,"f")[t].forEach(t=>t())},e})(),t.exports=e()},456(t){var e;e=()=>(()=>{var t={277(t){var e;e=()=>(()=>{"use strict";var t={d:(e,r)=>{for(var i in r)t.o(r,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:r[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.r(e),t.d(e,{Vector:()=>r});class r{static matching(t){let e="x"in t?t.x:t.magnitude*Math.cos(t.direction),i="y"in t?t.y:t.magnitude*Math.sin(t.direction);return new r(e,i)}constructor(t,e){this.x=t,this.y=e}[Symbol.iterator](){return[this.x,this.y].values()}get magnitude(){return Math.sqrt(Math.pow(this.x,2)+Math.pow(this.y,2))}set magnitude(t){let e=this.direction;this.x=t*Math.cos(e),this.y=t*Math.sin(e)}get direction(){return Math.atan2(this.y,this.x)}set direction(t){let e=this.magnitude;this.x=e*Math.cos(t),this.y=e*Math.sin(t)}}return e})(),t.exports=e()}},e={};function r(i){var n=e[i];if(void 0!==n)return n.exports;var o=e[i]={exports:{}};return t[i].call(o.exports,o,o.exports,r),o.exports}r.d=(t,e)=>{for(var i in e)r.o(e,i)&&!r.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var i={};return(()=>{"use strict";r.r(i),r.d(i,{Point:()=>e,RelativePoint:()=>h});var t=r(277);class e{static matching(t){return new e(t.x,t.y)}constructor(t,e){this.x=t,this.y=e}[Symbol.iterator](){return[this.x,this.y].values()}displace(e){let r=t.Vector.matching(e);this.x+=r.x,this.y+=r.y}displaced(t){let r=e.matching(this);return r.displace(t),r}displacementTo(e){return new t.Vector(e.x-this.x,e.y-this.y)}displacementFrom(e){return new t.Vector(this.x-e.x,this.y-e.y)}distanceTo(t){return this.displacementTo(t).magnitude}distanceFrom(t){return this.distanceTo(t)}directionTo(t){return this.displacementTo(t).direction}directionFrom(t){return this.displacementFrom(t).direction}}var n,o,s,a,c,d=function(t,e,r,i){if("a"===r&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!i:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?i:"a"===r?i.call(t):i?i.value:e.get(t)};class h{constructor(e){n.add(this),o.set(this,void 0),s.set(this,new t.Vector(0,0)),a.set(this,{move:[]}),function(t,e,r){if("function"==typeof e||!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");e.set(t,r)}(this,o,e),e.addEventListener("move",()=>d(this,n,"m",c).call(this,"move"))}get x(){return d(this,o,"f").x+d(this,s,"f").x}set x(t){d(this,s,"f").x=t-d(this,o,"f").x,d(this,n,"m",c).call(this,"move")}get y(){return d(this,o,"f").y+d(this,s,"f").y}set y(t){d(this,s,"f").y=t-d(this,o,"f").y,d(this,n,"m",c).call(this,"move")}addEventListener(t,e){d(this,a,"f")[t].push(e)}removeEventListener(t,e){d(this,a,"f")[t]=d(this,a,"f")[t].filter(t=>t!==e)}}o=new WeakMap,s=new WeakMap,a=new WeakMap,n=new WeakSet,c=function(t){d(this,a,"f")[t].forEach(t=>t())}})(),i})(),t.exports=e()},854(t){t.exports=(()=>{"use strict";var t={d:(e,r)=>{for(var i in r)t.o(r,i)&&!t.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:r[i]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function r(t){return"number"==typeof t}function i(t){return r(t)&&Number.isFinite(t)}function n(t){return r(t)&&!Number.isFinite(t)}function o(t){return i(t)&&t>0}function s(t){return i(t)&&t>=0}function a(t){return"string"==typeof t}function c(t){return null==t}function d(t){return"object"==typeof t&&null!==t}function h(t){return Array.isArray(t)}function u(t){return h(t)&&0==t.length}function l(t){return h(t)&&t.length>0}function m(t){return h(t)&&t.every(r)}function f(t){return m(t)&&t.length>0}function g(t){return h(t)&&t.every(i)}function p(t){return h(t)&&t.every(n)}function b(t){return h(t)&&t.every(a)}function y(t){return b(t)&&t.length>0}return t.r(e),t.d(e,{isArray:()=>h,isEmptyArray:()=>u,isFiniteNumber:()=>i,isFiniteNumbersArray:()=>g,isNonEmptyArray:()=>l,isNonEmptyNumbersArray:()=>f,isNonEmptyStringsArray:()=>y,isNonFiniteNumber:()=>n,isNonFiniteNumbersArray:()=>p,isNonNegativeFiniteNumber:()=>s,isNonNullObject:()=>d,isNullish:()=>c,isNumber:()=>r,isNumbersArray:()=>m,isPositiveFiniteNumber:()=>o,isString:()=>a,isStringsArray:()=>b}),e})()}},e={};function r(i){var n=e[i];if(void 0!==n)return n.exports;var o=e[i]={exports:{}};return t[i].call(o.exports,o,o.exports,r),o.exports}r.d=(t,e)=>{for(var i in e)r.o(e,i)&&!r.o(t,i)&&Object.defineProperty(t,i,{enumerable:!0,get:e[i]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var i={};return(()=>{"use strict";r.r(i),r.d(i,{Circle:()=>l,Rectangle:()=>v,Text:()=>u});const t={randomUUID:"undefined"!=typeof crypto&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};let e;const n=new Uint8Array(16),o=[];for(let t=0;t<256;++t)o.push((t+256).toString(16).slice(1));function s(t,r,i){const s=(t=t||{}).random??t.rng?.()??function(){if(!e){if("undefined"==typeof crypto||!crypto.getRandomValues)throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");e=crypto.getRandomValues.bind(crypto)}return e(n)}();if(s.length<16)throw new Error("Random bytes length must be >= 16");if(s[6]=15&s[6]|64,s[8]=63&s[8]|128,r){if((i=i||0)<0||i+16>r.length)throw new RangeError(`UUID byte range ${i}:${i+15} is out of buffer bounds`);for(let t=0;t<16;++t)r[i+t]=s[t];return r}return function(t,e=0){return(o[t[e+0]]+o[t[e+1]]+o[t[e+2]]+o[t[e+3]]+"-"+o[t[e+4]]+o[t[e+5]]+"-"+o[t[e+6]]+o[t[e+7]]+"-"+o[t[e+8]]+o[t[e+9]]+"-"+o[t[e+10]]+o[t[e+11]]+o[t[e+12]]+o[t[e+13]]+o[t[e+14]]+o[t[e+15]]).toLowerCase()}(s)}const a=function(e,r,i){return!t.randomUUID||r||e?s(e,r,i):t.randomUUID()};var c=r(645),d=r(731),h=r(854);class u{static create(t){let e=document.createElementNS("http://www.w3.org/2000/svg","text");return e.id="id-"+a(),e.textContent=null!=t?t:"",e.setAttribute("font-family","Arial"),e.setAttribute("font-size","9"),e.setAttribute("font-weight","700"),e.setAttribute("font-style","normal"),e.setAttribute("fill","black"),e.setAttribute("fill-opacity","1"),new u(e)}constructor(t){this.domNode=t}get id(){return this.domNode.id}get bbox(){return c.Box.matching(this.domNode.getBBox())}get centerX(){return this.bbox.centerX}set centerX(t){new d.CenterPoint(this.domNode).x=t}get centerY(){return this.bbox.centerY}set centerY(t){new d.CenterPoint(this.domNode).y=t}drag(t,e){this.centerX+=t,this.centerY+=e}serialized(){if(!this.id)throw new Error("Text element ID is falsy.");return{id:this.id}}static recreate(t,e){if(!(0,h.isNonNullObject)(t))throw new Error(`Saved text element is not an object: ${t}.`);if(!t.id)throw new Error("Saved text element ID is falsy.");if(!(0,h.isString)(t.id))throw new Error(`Saved text element ID is not a string: ${t.id}.`);let r=e.domNode.querySelector("#"+t.id);if(!r)throw new Error("Unable to find text element DOM node in parent drawing by ID.");if(!(r instanceof SVGTextElement))throw new Error(`Text element DOM node is not an SVG text element: ${r}.`);return new u(r)}}class l{static create(){let t=document.createElementNS("http://www.w3.org/2000/svg","circle");return t.id="id-"+a(),t.setAttribute("r","6"),t.setAttribute("stroke","black"),t.setAttribute("stroke-width","1"),t.setAttribute("stroke-opacity","1"),t.setAttribute("stroke-dasharray",""),t.setAttribute("stroke-linecap",""),t.setAttribute("fill","white"),t.setAttribute("fill-opacity","1"),new l(t)}constructor(t){this.domNode=t}get id(){return this.domNode.id}get centerX(){return this.domNode.cx.baseVal.value}set centerX(t){this.domNode.setAttribute("cx",`${t}`)}get centerY(){return this.domNode.cy.baseVal.value}set centerY(t){this.domNode.setAttribute("cy",`${t}`)}drag(t,e){this.centerX+=t,this.centerY+=e}serialized(){if(!this.id)throw new Error("Circle ID is falsy.");return{id:this.id}}static recreate(t,e){if(!(0,h.isNonNullObject)(t))throw new Error(`Saved circle must be an object: ${t}.`);if(!t.id)throw new Error("Saved circle ID is falsy.");if(!(0,h.isString)(t.id))throw new Error(`Saved circle ID must be a string: ${t.id}.`);let r=e.domNode.querySelector("#"+t.id);if(!r)throw new Error("Unable to find circle element DOM node by ID.");if(!(r instanceof SVGCircleElement))throw new Error(`Circle element DOM node is not an SVG circle element: ${r}.`);return new l(r)}}var m=r(456);class f{constructor(){this.centerX=0,this.centerY=0,this.direction=-Math.PI/2,this.width=0,this.height=0,this.cornerRadius=0}static matching(t){let e=new f;return e.centerX=t.centerX,e.centerY=t.centerY,e.direction=t.direction,e.width=t.width,e.height=t.height,e.cornerRadius=t.cornerRadius,e}toString(){let t=new m.Point(this.centerX,this.centerY);t.displace({magnitude:this.height/2,direction:this.direction}),t.displace({magnitude:this.width/2-this.cornerRadius,direction:this.direction+Math.PI/2});let e=`M ${t.x} ${t.y}`;return t.displace({magnitude:Math.SQRT2*this.cornerRadius,direction:this.direction+3*Math.PI/4}),e+=` A ${this.cornerRadius} ${this.cornerRadius} 90 0 1 ${t.x} ${t.y}`,t.displace({magnitude:this.height-2*this.cornerRadius,direction:this.direction+Math.PI}),e+=` L ${t.x} ${t.y}`,t.displace({magnitude:Math.SQRT2*this.cornerRadius,direction:this.direction+5*Math.PI/4}),e+=` A ${this.cornerRadius} ${this.cornerRadius} 90 0 1 ${t.x} ${t.y}`,t.displace({magnitude:this.width-2*this.cornerRadius,direction:this.direction+3*Math.PI/2}),e+=` L ${t.x} ${t.y}`,t.displace({magnitude:Math.SQRT2*this.cornerRadius,direction:this.direction+7*Math.PI/4}),e+=` A ${this.cornerRadius} ${this.cornerRadius} 90 0 1 ${t.x} ${t.y}`,t.displace({magnitude:this.height-2*this.cornerRadius,direction:this.direction}),e+=` L ${t.x} ${t.y}`,t.displace({magnitude:Math.SQRT2*this.cornerRadius,direction:this.direction+9*Math.PI/4}),e+=` A ${this.cornerRadius} ${this.cornerRadius} 90 0 1 ${t.x} ${t.y}`,e+=" Z",e}}var g,p,b,y,w=function(t,e,r,i){if("a"===r&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!i:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?i:"a"===r?i.call(t):i?i.value:e.get(t)};class v{static create(){let t=document.createElementNS("http://www.w3.org/2000/svg","path");t.id="id-"+a();let e=new v(t);return e.centerX=0,e.centerY=0,e.direction=-Math.PI/2,e.width=5.5,e.height=5.5,e.cornerRadius=0,e.domNode.setAttribute("stroke","black"),e.domNode.setAttribute("stroke-width","1"),e.domNode.setAttribute("stroke-opacity","1"),e.domNode.setAttribute("stroke-linejoin",""),e.domNode.setAttribute("stroke-dasharray",""),e.domNode.setAttribute("stroke-linecap",""),e.domNode.setAttribute("fill","white"),e.domNode.setAttribute("fill-opacity","1"),e}constructor(t){g.add(this),this.domNode=t,t.dataset.centerX||w(this,g,"m",p).call(this),t.dataset.centerY||w(this,g,"m",b).call(this)}get id(){return this.domNode.id}get centerX(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.centerX)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set centerX(t){Number.isFinite(t)?(this.domNode.dataset.centerX=`${t}`,w(this,g,"m",y).call(this)):console.error(`The specified center X coordinate is nonfinite: ${t}.`)}get centerY(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.centerY)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set centerY(t){Number.isFinite(t)?(this.domNode.dataset.centerY=`${t}`,w(this,g,"m",y).call(this)):console.error(`The specified center Y coordinate is nonfinite: ${t}.`)}drag(t,e){this.centerX+=t,this.centerY+=e}get direction(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.direction)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set direction(t){Number.isFinite(t)?(this.domNode.dataset.direction=`${t}`,w(this,g,"m",y).call(this)):console.error(`The specified direction angle is nonfinite: ${t}.`)}get width(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.width)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set width(t){Number.isFinite(t)?(this.domNode.dataset.width=`${t}`,w(this,g,"m",y).call(this)):console.error(`The specified width is nonfinite: ${t}.`)}get height(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.height)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set height(t){Number.isFinite(t)?(this.domNode.dataset.height=`${t}`,w(this,g,"m",y).call(this)):console.error(`The specified height is nonfinite: ${t}.`)}get cornerRadius(){var t;let e=Number.parseFloat(null!==(t=this.domNode.dataset.cornerRadius)&&void 0!==t?t:"");return Number.isFinite(e)?e:0}set cornerRadius(t){Number.isFinite(t)?(this.domNode.dataset.cornerRadius=`${t}`,w(this,g,"m",y).call(this)):console.error(`The specified corner radius is nonfinite: ${t}.`)}get bbox(){return c.Box.matching(this.domNode.getBBox())}serialized(){if(!this.id)throw new Error("Rectangle ID is falsy.");return{id:this.id}}static recreate(t,e){if(!(0,h.isNonNullObject)(t))throw new Error(`Saved rectangle is not an object: ${t}.`);if(!t.id)throw new Error("Saved rectangle ID is falsy.");if(!(0,h.isString)(t.id))throw new Error(`Saved rectangle ID is not a string: ${t.id}.`);let r=e.domNode.querySelector("#"+t.id);if(!r)throw new Error("Unable to find saved rectangle DOM node in parent drawing by ID.");if(!(r instanceof SVGPathElement))throw new Error(`DOM node found for saved rectangle is not an SVG path element: ${r}.`);let i=new v(r);return(0,h.isFiniteNumber)(t.width)&&(i.width=t.width),(0,h.isFiniteNumber)(t.height)&&(i.height=t.height),(0,h.isFiniteNumber)(t.borderRadius)&&(i.cornerRadius=t.borderRadius),(0,h.isFiniteNumber)(t.rotation)&&(i.direction=t.rotation-Math.PI/2),i}}g=new WeakSet,p=function(){let t=c.Box.matching(this.domNode.getBBox());this.domNode.dataset.centerX=`${t.centerX}`},b=function(){let t=c.Box.matching(this.domNode.getBBox());this.domNode.dataset.centerY=`${t.centerY}`},y=function(){let t=new f;t.centerX=this.centerX,t.centerY=this.centerY,t.direction=this.direction,t.width=this.width,t.height=this.height,t.cornerRadius=this.cornerRadius,this.domNode.setAttribute("d",t.toString())}})(),i})());
|