npm - js-draw - Versions diffs - 0.0.9 → 0.0.10 - Mend

js-draw 0.0.9 → 0.0.10

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.

Files changed (24) hide show

package/CHANGELOG.md +4 -0
package/dist/bundle.js +1 -1
package/dist/src/Display.d.ts +1 -0
package/dist/src/Display.js +3 -0
package/dist/src/Editor.js +2 -0
package/dist/src/rendering/AbstractRenderer.d.ts +1 -0
package/dist/src/rendering/AbstractRenderer.js +1 -0
package/dist/src/rendering/CanvasRenderer.d.ts +4 -0
package/dist/src/rendering/CanvasRenderer.js +22 -6
package/dist/src/toolbar/HTMLToolbar.js +10 -1
package/dist/src/toolbar/localization.d.ts +1 -0
package/dist/src/toolbar/localization.js +1 -0
package/dist/src/tools/PanZoom.js +3 -0
package/dist/src/tools/SelectionTool.d.ts +3 -0
package/dist/src/tools/SelectionTool.js +13 -0
package/package.json +1 -1
package/src/Display.ts +4 -0
package/src/Editor.ts +2 -0
package/src/rendering/AbstractRenderer.ts +2 -0
package/src/rendering/CanvasRenderer.ts +35 -6
package/src/toolbar/HTMLToolbar.ts +12 -1
package/src/toolbar/localization.ts +2 -0
package/src/tools/PanZoom.ts +3 -0
package/src/tools/SelectionTool.ts +16 -0

package/dist/bundle.js CHANGED Viewed

	@@ -1 +1 @@
1	- (()=>{"use strict";var e={786:(t,e,n)=>{n.d(e,{Z:()=>a});var r=n(81),i=n.n(r),o=n(645),s=n.n(o)()(i());s.push([t.id,'.clr-picker {\r\n display: none;\r\n flex-wrap: wrap;\r\n position: absolute;\r\n width: 200px;\r\n z-index: 1000;\r\n border-radius: 10px;\r\n background-color: #fff;\r\n justify-content: space-between;\r\n box-shadow: 0 0 5px rgba(0,0,0,.05), 0 5px 20px rgba(0,0,0,.1);\r\n -moz-user-select: none;\r\n -webkit-user-select: none;\r\n user-select: none;\r\n}\r\n\r\n.clr-picker.clr-open,\r\n.clr-picker[data-inline="true"] {\r\n display: flex;\r\n}\r\n\r\n.clr-picker[data-inline="true"] {\r\n position: relative;\r\n}\r\n\r\n.clr-gradient {\r\n position: relative;\r\n width: 100%;\r\n height: 100px;\r\n margin-bottom: 15px;\r\n border-radius: 3px 3px 0 0;\r\n background-image: linear-gradient(rgba(0,0,0,0), #000), linear-gradient(90deg, #fff, currentColor);\r\n cursor: pointer;\r\n}\r\n\r\n.clr-marker {\r\n position: absolute;\r\n width: 12px;\r\n height: 12px;\r\n margin: -6px 0 0 -6px;\r\n border: 1px solid #fff;\r\n border-radius: 50%;\r\n background-color: currentColor;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-picker input[type="range"]::-webkit-slider-runnable-track {\r\n width: 100%;\r\n height: 8px;\r\n}\r\n\r\n.clr-picker input[type="range"]::-webkit-slider-thumb {\r\n width: 8px;\r\n height: 8px;\r\n -webkit-appearance: none;\r\n}\r\n\r\n.clr-picker input[type="range"]::-moz-range-track {\r\n width: 100%;\r\n height: 8px;\r\n border: 0;\r\n}\r\n\r\n.clr-picker input[type="range"]::-moz-range-thumb {\r\n width: 8px;\r\n height: 8px;\r\n border: 0;\r\n}\r\n\r\n.clr-hue {\r\n background-image: linear-gradient(to right, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f 83.33%, #f00 100%);\r\n}\r\n\r\n.clr-hue,\r\n.clr-alpha {\r\n position: relative;\r\n width: calc(100% - 40px);\r\n height: 8px;\r\n margin: 5px 20px;\r\n border-radius: 4px;\r\n}\r\n\r\n.clr-alpha span {\r\n display: block;\r\n height: 100%;\r\n width: 100%;\r\n border-radius: inherit;\r\n background-image: linear-gradient(90deg, rgba(0,0,0,0), currentColor);\r\n}\r\n\r\n.clr-hue input,\r\n.clr-alpha input {\r\n position: absolute;\r\n width: calc(100% + 16px);\r\n height: 16px;\r\n left: -8px;\r\n top: -4px;\r\n margin: 0;\r\n background-color: transparent;\r\n opacity: 0;\r\n cursor: pointer;\r\n appearance: none;\r\n -webkit-appearance: none;\r\n}\r\n\r\n.clr-hue div,\r\n.clr-alpha div {\r\n position: absolute;\r\n width: 16px;\r\n height: 16px;\r\n left: 0;\r\n top: 50%;\r\n margin-left: -8px;\r\n transform: translateY(-50%);\r\n border: 2px solid #fff;\r\n border-radius: 50%;\r\n background-color: currentColor;\r\n box-shadow: 0 0 1px #888;\r\n pointer-events: none;\r\n}\r\n\r\n.clr-alpha div:before {\r\n content: \'\';\r\n position: absolute;\r\n height: 100%;\r\n width: 100%;\r\n left: 0;\r\n top: 0;\r\n border-radius: 50%;\r\n background-color: currentColor;\r\n}\r\n\r\n.clr-format {\r\n display: none;\r\n order: 1;\r\n width: calc(100% - 40px);\r\n margin: 0 20px 20px;\r\n}\r\n\r\n.clr-segmented {\r\n display: flex;\r\n position: relative;\r\n width: 100%;\r\n margin: 0;\r\n padding: 0;\r\n border: 1px solid #ddd;\r\n border-radius: 15px;\r\n box-sizing: border-box;\r\n color: #999;\r\n font-size: 12px;\r\n}\r\n\r\n.clr-segmented input,\r\n.clr-segmented legend {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n border: 0;\r\n left: 0;\r\n top: 0;\r\n opacity: 0;\r\n pointer-events: none;\r\n}\r\n\r\n.clr-segmented label {\r\n flex-grow: 1;\r\n padding: 4px 0;\r\n text-align: center;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-segmented label:first-of-type {\r\n border-radius: 10px 0 0 10px;\r\n}\r\n\r\n.clr-segmented label:last-of-type {\r\n border-radius: 0 10px 10px 0;\r\n}\r\n\r\n.clr-segmented input:checked + label {\r\n color: #fff;\r\n background-color: #666;\r\n}\r\n\r\n.clr-swatches {\r\n order: 2;\r\n width: calc(100% - 32px);\r\n margin: 0 16px;\r\n}\r\n\r\n.clr-swatches div {\r\n display: flex;\r\n flex-wrap: wrap;\r\n padding-bottom: 12px;\r\n justify-content: center;\r\n}\r\n\r\n.clr-swatches button {\r\n position: relative;\r\n width: 20px;\r\n height: 20px;\r\n margin: 0 4px 6px 4px;\r\n border: 0;\r\n border-radius: 50%;\r\n color: inherit;\r\n text-indent: -1000px;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-swatches button:after {\r\n content: \'\';\r\n display: block;\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n border-radius: inherit;\r\n background-color: currentColor;\r\n box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);\r\n}\r\n\r\ninput.clr-color {\r\n order: 1;\r\n width: calc(100% - 80px);\r\n height: 32px;\r\n margin: 15px 20px 20px 0;\r\n padding: 0 10px;\r\n border: 1px solid #ddd;\r\n border-radius: 16px;\r\n color: #444;\r\n background-color: #fff;\r\n font-family: sans-serif;\r\n font-size: 14px;\r\n text-align: center;\r\n box-shadow: none;\r\n}\r\n\r\ninput.clr-color:focus {\r\n outline: none;\r\n border: 1px solid #1e90ff;\r\n}\r\n\r\n.clr-clear {\r\n display: none;\r\n order: 2;\r\n height: 24px;\r\n margin: 0 20px 20px auto;\r\n padding: 0 20px;\r\n border: 0;\r\n border-radius: 12px;\r\n color: #fff;\r\n background-color: #666;\r\n font-family: inherit;\r\n font-size: 12px;\r\n font-weight: 400;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-preview {\r\n position: relative;\r\n width: 32px;\r\n height: 32px;\r\n margin: 15px 0 20px 20px;\r\n border: 0;\r\n border-radius: 50%;\r\n overflow: hidden;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-preview:before,\r\n.clr-preview:after {\r\n content: \'\';\r\n position: absolute;\r\n height: 100%;\r\n width: 100%;\r\n left: 0;\r\n top: 0;\r\n border: 1px solid #fff;\r\n border-radius: 50%;\r\n}\r\n\r\n.clr-preview:after {\r\n border: 0;\r\n background-color: currentColor;\r\n box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);\r\n}\r\n\r\n.clr-marker,\r\n.clr-hue div,\r\n.clr-alpha div,\r\n.clr-color {\r\n box-sizing: border-box;\r\n}\r\n\r\n.clr-field {\r\n display: inline-block;\r\n position: relative;\r\n color: transparent;\r\n}\r\n\r\n.clr-field button {\r\n position: absolute;\r\n width: 30px;\r\n height: 100%;\r\n right: 0;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n border: 0;\r\n color: inherit;\r\n text-indent: -1000px;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n pointer-events: none;\r\n}\r\n\r\n.clr-field button:after {\r\n content: \'\';\r\n display: block;\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n border-radius: inherit;\r\n background-color: currentColor;\r\n box-shadow: inset 0 0 1px rgba(0,0,0,.5);\r\n}\r\n\r\n.clr-alpha,\r\n.clr-alpha div,\r\n.clr-swatches button,\r\n.clr-preview:before,\r\n.clr-field button {\r\n background-image: repeating-linear-gradient(45deg, #aaa 25%, transparent 25%, transparent 75%, #aaa 75%, #aaa), repeating-linear-gradient(45deg, #aaa 25%, #fff 25%, #fff 75%, #aaa 75%, #aaa);\r\n background-position: 0 0, 4px 4px;\r\n background-size: 8px 8px;\r\n}\r\n\r\n.clr-marker:focus {\r\n outline: none;\r\n}\r\n\r\n.clr-keyboard-nav .clr-marker:focus,\r\n.clr-keyboard-nav .clr-hue input:focus + div,\r\n.clr-keyboard-nav .clr-alpha input:focus + div,\r\n.clr-keyboard-nav .clr-segmented input:focus + label {\r\n outline: none;\r\n box-shadow: 0 0 0 2px #1e90ff, 0 0 2px 2px #fff;\r\n}\r\n\r\n.clr-picker[data-alpha="false"] .clr-alpha {\r\n display: none;\r\n}\r\n\r\n.clr-picker[data-minimal="true"] {\r\n padding-top: 16px;\r\n}\r\n\r\n.clr-picker[data-minimal="true"] .clr-gradient,\r\n.clr-picker[data-minimal="true"] .clr-hue,\r\n.clr-picker[data-minimal="true"] .clr-alpha,\r\n.clr-picker[data-minimal="true"] .clr-color,\r\n.clr-picker[data-minimal="true"] .clr-preview {\r\n display: none;\r\n}\r\n\r\n/ Dark theme /\r\n\r\n.clr-dark {\r\n background-color: #444;\r\n}\r\n\r\n.clr-dark .clr-segmented {\r\n border-color: #777;\r\n}\r\n\r\n.clr-dark .clr-swatches button:after {\r\n box-shadow: inset 0 0 0 1px rgba(255,255,255,.3);\r\n}\r\n\r\n.clr-dark input.clr-color {\r\n color: #fff;\r\n border-color: #777;\r\n background-color: #555;\r\n}\r\n\r\n.clr-dark input.clr-color:focus {\r\n border-color: #1e90ff;\r\n}\r\n\r\n.clr-dark .clr-preview:after {\r\n box-shadow: inset 0 0 0 1px rgba(255,255,255,.5);\r\n}\r\n\r\n.clr-dark .clr-alpha,\r\n.clr-dark .clr-alpha div,\r\n.clr-dark .clr-swatches button,\r\n.clr-dark .clr-preview:before {\r\n background-image: repeating-linear-gradient(45deg, #666 25%, transparent 25%, transparent 75%, #888 75%, #888), repeating-linear-gradient(45deg, #888 25%, #444 25%, #444 75%, #888 75%, #888);\r\n}\r\n\r\n/ Polaroid theme /\r\n\r\n.clr-picker.clr-polaroid {\r\n border-radius: 6px;\r\n box-shadow: 0 0 5px rgba(0,0,0,.1), 0 5px 30px rgba(0,0,0,.2);\r\n}\r\n\r\n.clr-picker.clr-polaroid:before {\r\n content: \'\';\r\n display: block;\r\n position: absolute;\r\n width: 16px;\r\n height: 10px;\r\n left: 20px;\r\n top: -10px;\r\n border: solid transparent;\r\n border-width: 0 8px 10px 8px;\r\n border-bottom-color: currentColor;\r\n box-sizing: border-box;\r\n color: #fff;\r\n filter: drop-shadow(0 -4px 3px rgba(0,0,0,.1));\r\n pointer-events: none;\r\n}\r\n\r\n.clr-picker.clr-polaroid.clr-dark:before {\r\n color: #444;\r\n}\r\n\r\n.clr-picker.clr-polaroid.clr-left:before {\r\n left: auto;\r\n right: 20px;\r\n}\r\n\r\n.clr-picker.clr-polaroid.clr-top:before {\r\n top: auto;\r\n bottom: -10px;\r\n transform: rotateZ(180deg);\r\n}\r\n\r\n.clr-polaroid .clr-gradient {\r\n width: calc(100% - 20px);\r\n height: 120px;\r\n margin: 10px;\r\n border-radius: 3px;\r\n}\r\n\r\n.clr-polaroid .clr-hue,\r\n.clr-polaroid .clr-alpha {\r\n width: calc(100% - 30px);\r\n height: 10px;\r\n margin: 6px 15px;\r\n border-radius: 5px;\r\n}\r\n\r\n.clr-polaroid .clr-hue div,\r\n.clr-polaroid .clr-alpha div {\r\n box-shadow: 0 0 5px rgba(0,0,0,.2);\r\n}\r\n\r\n.clr-polaroid .clr-format {\r\n width: calc(100% - 20px);\r\n margin: 0 10px 15px;\r\n}\r\n\r\n.clr-polaroid .clr-swatches {\r\n width: calc(100% - 12px);\r\n margin: 0 6px;\r\n}\r\n.clr-polaroid .clr-swatches div {\r\n padding-bottom: 10px;\r\n}\r\n\r\n.clr-polaroid .clr-swatches button {\r\n width: 22px;\r\n height: 22px;\r\n}\r\n\r\n.clr-polaroid input.clr-color {\r\n width: calc(100% - 60px);\r\n margin: 10px 10px 15px 0;\r\n}\r\n\r\n.clr-polaroid .clr-clear {\r\n margin: 0 10px 15px auto;\r\n}\r\n\r\n.clr-polaroid .clr-preview {\r\n margin: 10px 0 15px 10px;\r\n}\r\n\r\n/ Large theme /\r\n\r\n.clr-picker.clr-large {\r\n width: 275px;\r\n}\r\n\r\n.clr-large .clr-gradient {\r\n height: 150px;\r\n}\r\n\r\n.clr-large .clr-swatches button {\r\n width: 22px;\r\n height: 22px;\r\n}\r\n\r\n/ Pill (horizontal) theme /\r\n\r\n.clr-picker.clr-pill {\r\n width: 380px;\r\n padding-left: 180px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.clr-pill .clr-gradient {\r\n position: absolute;\r\n width: 180px;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n margin-bottom: 0;\r\n border-radius: 3px 0 0 3px;\r\n}\r\n\r\n.clr-pill .clr-hue {\r\n margin-top: 20px;\r\n}',""]);const a=s},59:(t,e,n)=>{n.d(e,{Z:()=>c});var r=n(81),i=n.n(r),o=n(645),s=n.n(o),a=n(771),l=s()(i());l.i(a.Z),l.push([t.id,"\n.imageEditorContainer {\n\t/* Deafult colors for the editor /\n --primary-background-color: white;\n --primary-background-color-transparent: rgba(255, 255, 255, 0.5);\n --secondary-background-color: #faf;\n --primary-foreground-color: black;\n --secondary-foreground-color: black;\n}\n\n@media (prefers-color-scheme: dark) {\n\t.imageEditorContainer {\n\t\t--primary-background-color: #151515;\n\t\t--primary-background-color-transparent: rgba(50, 50, 50, 0.5);\n\t\t--secondary-background-color: #607;\n\t\t--primary-foreground-color: white;\n\t\t--secondary-foreground-color: white;\n\t}\n}\n\n.imageEditorContainer {\n\tcolor: var(--primary-foreground-color);\n\tfont-family: system-ui, -apple-system, sans-serif;\n\tbackground-color: var(--primary-background-color);\n\n\tdisplay: flex;\n\tflex-direction: column-reverse;\n}\n\n.imageEditorContainer .imageEditorRenderArea {\n\tdisplay: grid;\n\tgrid-template-columns: 1fr;\n\tflex-grow: 2;\n\tflex-shrink: 1;\n\tmin-height: 100px;\n}\n\n.imageEditorContainer .imageEditorRenderArea canvas {\n\t/ Stack all canvases on top of each other /\n\tgrid-row: 1 / 1;\n\tgrid-column: 1 / 1;\n\ttouch-action: none;\n\n\t/ Fill the container /\n\tbox-sizing: border-box;\n\twidth: 100%;\n\theight: 100%;\n}\n\n.imageEditorContainer .loadingMessage {\n\tposition: fixed;\n\ttext-align: center;\n\tfont-size: 2em;\n\n\tbottom: 0;\n\tleft: 0;\n\tright: 0;\n}\n\n.imageEditorContainer .accessibilityAnnouncement {\n\topacity: 0;\n\twidth: 0;\n\theight: 0;\n\toverflow: hidden;\n\tpointer-events: none;\n}\n",""]);const c=l},771:(t,e,n)=>{n.d(e,{Z:()=>a});var r=n(81),i=n.n(r),o=n(645),s=n.n(o)()(i());s.push([t.id,".toolbar-root {\n background-color: var(--primary-background-color);\n\n border: 1px solid var(--secondary-background-color);\n border-radius: 2px;\n flex-wrap: wrap;\n\n box-sizing: border-box;\n width: 100%;\n\n display: flex;\n flex-direction: row;\n justify-content: center;\n\n font-family: system-ui, -apple-system, sans-serif;\n}\n\n.toolbar-button, .toolbar-root button {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n\n text-align: center;\n border-radius: 6px;\n cursor: pointer;\n\n padding-left: 3px;\n padding-right: 3px;\n margin-left: 3px;\n margin-right: 3px;\n\n min-width: 40px;\n max-width: 70px;\n font-size: 11pt;\n\n cursor: pointer;\n\n height: min(20vh, 60px);\n background-color: var(--primary-background-color);\n color: var(--primary-foreground-color);\n border: none;\n box-shadow: 0px 0px 2px var(--primary-foreground-color);\n\n transition: background-color 0.25s ease, box-shadow 0.25s ease, opacity 0.3s ease;\n}\n\n.toolbar-button:hover, .toolbar-root button:not(:disabled):hover {\n box-shadow: 0px 2px 4px var(--primary-foreground-color);\n}\n\n.toolbar-root button {\n height: auto;\n}\n\n.toolbar-root button:disabled {\n cursor: inherit;\n filter: opacity(0.5);\n}\n\n.toolbar-button .toolbar-icon {\n flex-shrink: 1;\n min-width: 30px;\n}\n\n.toolbar-toolContainer.selected .toolbar-button {\n background-color: var(--secondary-background-color);\n color: var(--secondary-foreground-color);\n}\n\n.toolbar-toolContainer:not(.selected) .toolbar-showHideDropdownIcon {\n display: none;\n}\n\n.toolbar-toolContainer.selected .toolbar-showHideDropdownIcon {\n height: 10px;\n transition: transform 0.5s ease;\n}\n\n.toolbar-toolContainer.dropdownVisible .toolbar-showHideDropdownIcon {\n transform: rotate(180deg);\n}\n\n.toolbar-dropdown.hidden, .toolbar-toolContainer:not(.selected) > .toolbar-dropdown {\n display: none;\n}\n\n.toolbar-dropdown {\n position: absolute;\n padding: 15px;\n padding-top: 5px;\n / Prevent overlap/being displayed under the undo/redo buttons /\n z-index: 2;\n background-color: var(--primary-background-color);\n box-shadow: 0px 3px 3px var(--primary-foreground-color);\n}\n\n.toolbar-buttonGroup {\n display: flex;\n flex-direction: row;\n}\n\n.toolbar-closeColorPickerOverlay {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n\n background-color: var(--primary-background-color);\n opacity: 0.3;\n}\n\n/ Make color selection buttons fill their containing label /\n.toolbar-dropdown .clr-field button {\n width: 100%;\n height: 100%;\n border-radius: 2px;\n margin-left: 0;\n margin-right: 0;\n}\n",""]);const a=s},645:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",r=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),r&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),r&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,r,i,o){"string"==typeof t&&(t=[[null,t,void 0]]);var s={};if(r)for(var a=0;a<this.length;a++){var l=this[a][0];null!=l&&(s[l]=!0)}for(var c=0;c<t.length;c++){var h=[].concat(t[c]);r&&s[h[0]]\|\|(void 0!==o&&(void 0===h[5]\|\|(h[1]="@layer".concat(h[5].length>0?" ".concat(h[5]):""," {").concat(h[1],"}")),h[5]=o),n&&(h[2]?(h[1]="@media ".concat(h[2]," {").concat(h[1],"}"),h[2]=n):h[2]=n),i&&(h[4]?(h[1]="@supports (".concat(h[4],") {").concat(h[1],"}"),h[4]=i):h[4]="".concat(i)),e.push(h))}},e}},81:t=>{t.exports=function(t){return t[1]}},379:t=>{var e=[];function n(t){for(var n=-1,r=0;r<e.length;r++)if(e[r].identifier===t){n=r;break}return n}function r(t,r){for(var o={},s=[],a=0;a<t.length;a++){var l=t[a],c=r.base?l[0]+r.base:l[0],h=o[c]\|\|0,d="".concat(c," ").concat(h);o[c]=h+1;var u=n(d),p={css:l[1],media:l[2],sourceMap:l[3],supports:l[4],layer:l[5]};if(-1!==u)e[u].references++,e[u].updater(p);else{var f=i(p,r);r.byIndex=a,e.splice(a,0,{identifier:d,updater:f,references:1})}s.push(d)}return s}function i(t,e){var n=e.domAPI(e);n.update(t);return function(e){if(e){if(e.css===t.css&&e.media===t.media&&e.sourceMap===t.sourceMap&&e.supports===t.supports&&e.layer===t.layer)return;n.update(t=e)}else n.remove()}}t.exports=function(t,i){var o=r(t=t\|\|[],i=i\|\|{});return function(t){t=t\|\|[];for(var s=0;s<o.length;s++){var a=n(o[s]);e[a].references--}for(var l=r(t,i),c=0;c<o.length;c++){var h=n(o[c]);0===e[h].references&&(e[h].updater(),e.splice(h,1))}o=l}}},569:t=>{var e={};t.exports=function(t,n){var r=function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(t){n=null}e[t]=n}return e[t]}(t);if(!r)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");r.appendChild(n)}},216:t=>{t.exports=function(t){var e=document.createElement("style");return t.setAttributes(e,t.attributes),t.insert(e,t.options),e}},565:(t,e,n)=>{t.exports=function(t){var e=n.nc;e&&t.setAttribute("nonce",e)}},795:t=>{t.exports=function(t){var e=t.insertStyleElement(t);return{update:function(n){!function(t,e,n){var r="";n.supports&&(r+="@supports (".concat(n.supports,") {")),n.media&&(r+="@media ".concat(n.media," {"));var i=void 0!==n.layer;i&&(r+="@layer".concat(n.layer.length>0?" ".concat(n.layer):""," {")),r+=n.css,i&&(r+="}"),n.media&&(r+="}"),n.supports&&(r+="}");var o=n.sourceMap;o&&"undefined"!=typeof btoa&&(r+="\n/# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(o))))," /")),e.styleTagTransform(r,t,e.options)}(e,t,n)},remove:function(){!function(t){if(null===t.parentNode)return!1;t.parentNode.removeChild(t)}(e)}}}},589:t=>{t.exports=function(t,e){if(e.styleSheet)e.styleSheet.cssText=t;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(t))}}}},n={};function r(t){var i=n[t];if(void 0!==i)return i.exports;var o=n[t]={id:t,exports:{}};return e[t](o,o.exports,r),o.exports}r.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return r.d(e,{a:e}),e},r.d=(t,e)=>{for(var n in e)r.o(e,n)&&!r.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},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})},r.nc=void 0;var i={};(()=>{r.r(i),r.d(i,{Editor:()=>be,default:()=>xe});var e=r(379),n=r.n(e),o=r(795),s=r.n(o),a=r(569),l=r.n(a),c=r(565),h=r.n(c),d=r(216),u=r.n(d),p=r(589),f=r.n(p),m=r(59),g={};g.styleTagTransform=f(),g.setAttributes=h(),g.insert=l().bind(null,"head"),g.domAPI=s(),g.insertStyleElement=u();n()(m.Z,g);m.Z&&m.Z.locals&&m.Z.locals;var v=r(786),b={};b.styleTagTransform=f(),b.setAttributes=h(),b.insert=l().bind(null,"head"),b.domAPI=s(),b.insertStyleElement=u();n()(v.Z,b);v.Z&&v.Z.locals&&v.Z.locals;class x{constructor(t,e,n){this.x=t,this.y=e,this.z=n}get xy(){return{x:this.x,y:this.y}}static of(t,e,n){return new x(t,e,n)}at(t){if(0===t)return this.x;if(1===t)return this.y;if(2===t)return this.z;throw new Error(`${t} out of bounds!`)}length(){return this.magnitude()}magnitude(){return Math.sqrt(this.dot(this))}magnitudeSquared(){return this.dot(this)}angle(){return Math.atan2(this.y,this.x)}normalized(){const t=this.magnitude();return x.of(this.x/t,this.y/t,this.z/t)}times(t){return x.of(this.xt,this.yt,this.zt)}plus(t){return x.of(this.x+t.x,this.y+t.y,this.z+t.z)}minus(t){return this.plus(t.times(-1))}dot(t){return this.xt.x+this.yt.y+this.zt.z}cross(t){return x.of(this.yt.z-t.ythis.z,t.xthis.z-this.xt.z,this.xt.y-t.xthis.y)}orthog(){return 0===this.dot(x.unitX)&&0===this.dot(x.unitY)?0===this.dot(x.unitX)?x.unitX:this.cross(x.unitX).normalized():this.cross(x.unitZ.times(-1)).normalized()}extend(t,e){return this.plus(e.normalized().times(t))}lerp(t,e){return this.times(1-e).plus(t.times(e))}zip(t,e){return x.of(e(t.x,this.x),e(t.y,this.y),e(t.z,this.z))}map(t){return x.of(t(this.x),t(this.y),t(this.z))}asArray(){return[this.x,this.y,this.z]}eq(t,e){for(let n=0;n<3;n++)if(Math.abs(t.at(n)-this.at(n))>e)return!1;return!0}toString(){return`Vec(${this.x}, ${this.y}, ${this.z})`}}var y;x.unitX=x.of(1,0,0),x.unitY=x.of(0,1,0),x.unitZ=x.of(0,0,1),x.zero=x.of(0,0,0),function(t){t.of=(t,e)=>x.of(t,e,0),t.ofXY=({x:t,y:e})=>x.of(t,e,0),t.unitX=t.of(1,0),t.unitY=t.of(0,1),t.zero=t.of(0,0)}(y\|\|(y={}));class w{constructor(t,e){this.point1=t,this.point2=e,this.bbox=k.bboxOf([t,e]),this.direction=e.minus(t),this.length=this.direction.magnitude(),this.length>0&&(this.direction=this.direction.times(1/this.length))}get p1(){return this.point1}get p2(){return this.point2}get(t){return this.point1.plus(this.direction.times(t))}intersection(t){let e,n;if(0===this.direction.x){if(0===t.direction.x\|\|0===this.direction.y)return null;const r=this.point1.x,i=(this.point1.x-t.point1.x)t.direction.y/t.direction.x+t.point1.y;e=y.of(r,i),n=(i-this.point1.y)/this.direction.y}else{const r=(this.point1.y-t.point1.y)this.direction.xt.direction.x+this.direction.xt.direction.yt.point1.x-this.direction.yt.direction.xthis.point1.x,i=t.direction.ythis.direction.x-this.direction.yt.direction.x;if(0===i)return null;const o=r/i,s=(o-this.point1.x)/this.direction.x,a=this.point1.y+this.direction.ys;e=y.of(o,a),n=(o-this.point1.x)/this.direction.x}const r=e.minus(this.point1).magnitude(),i=e.minus(this.point2).magnitude(),o=e.minus(t.point1).magnitude(),s=e.minus(t.point2).magnitude();return r>this.length\|\|i>this.length\|\|o>t.length\|\|s>t.length?null:{point:e,t:n}}}class k{constructor(t,e,n,r){this.x=t,this.y=e,this.w=n,this.h=r,n<0&&(this.x+=n,this.w=Math.abs(n)),r<0&&(this.y+=r,this.h=Math.abs(r)),this.topLeft=y.of(this.x,this.y),this.size=y.of(this.w,this.h),this.bottomRight=this.topLeft.plus(this.size),this.center=this.topLeft.plus(this.size.times(.5)),this.area=this.wthis.h}translatedBy(t){return new k(t.x+this.x,t.y+this.y,this.w,this.h)}resizedTo(t){return new k(this.x,this.y,t.x,t.y)}containsPoint(t){return this.x<=t.x&&this.y<=t.y&&this.x+this.w>=t.x&&this.y+this.h>=t.y}containsRect(t){return this.x<=t.x&&this.y<=t.y&&this.bottomRight.x>=t.bottomRight.x&&this.bottomRight.y>=t.bottomRight.y}intersects(t){return null!==this.intersection(t)}intersection(t){const e=this.topLeft.zip(t.topLeft,Math.max),n=this.bottomRight.zip(t.bottomRight,Math.min);return this.containsPoint(e)&&this.containsPoint(n)&&t.containsPoint(e)&&t.containsPoint(n)?k.fromCorners(e,n):null}union(t){const e=this.topLeft.zip(t.topLeft,Math.min),n=this.bottomRight.zip(t.bottomRight,Math.max);return k.fromCorners(e,n)}grownToPoint(t,e=0){const n=new k(t.x-e,t.y-e,2e,2e);return this.union(n)}grownBy(t){return new k(this.x-t,this.y-t,this.w+2t,this.h+2t)}get corners(){return[this.bottomRight,this.topRight,this.topLeft,this.bottomLeft]}get maxDimension(){return Math.max(this.w,this.h)}get topRight(){return this.bottomRight.plus(y.of(0,-this.h))}get bottomLeft(){return this.topLeft.plus(y.of(0,this.h))}getEdges(){const t=this.corners;return[new w(t[0],t[1]),new w(t[1],t[2]),new w(t[2],t[3]),new w(t[3],t[0])]}transformedBoundingBox(t){return k.bboxOf(this.corners.map((e=>t.transformVec2(e))))}eq(t,e=0){return this.topLeft.eq(t.topLeft,e)&&this.size.eq(t.size,e)}toString(){return`Rect(point(${this.x}, ${this.y}), size(${this.w}, ${this.h}))`}static fromCorners(t,e){return new k(Math.min(t.x,e.x),Math.min(t.y,e.y),Math.abs(t.x-e.x),Math.abs(t.y-e.y))}static bboxOf(t,e=0){let n=0,r=0,i=0,o=0,s=!0;for(const e of t)s&&(n=e.x,r=e.y,i=e.x,o=e.y,s=!1),n=Math.min(n,e.x),r=Math.min(r,e.y),i=Math.max(i,e.x),o=Math.max(o,e.y);return k.fromCorners(y.of(n-e,r-e),y.of(i+e,o+e))}static of(t){var e,n,r,i;const o=null!==(n=null!==(e=t.width)&&void 0!==e?e:t.w)&&void 0!==n?n:0,s=null!==(i=null!==(r=t.height)&&void 0!==r?r:t.h)&&void 0!==i?i:0;return new k(t.x,t.y,o,s)}}k.empty=new k(0,0,0,0),k.unitSquare=new k(0,0,1,1);var P,T,C,E,S,z,B=function(t,e,n,r,i){if("m"===r)throw new TypeError("Private method is not writable");if("a"===r&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e\|\|!i:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===r?i.call(t,n):i?i.value=n:e.set(t,n),n},R=function(t,e,n,r){if("a"===n&&!r)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e\|\|!r:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?r:"a"===n?r.call(t):r?r.value:e.get(t)};class L{constructor(){this.root=new A}addElement(t){return this.root.addLeaf(t)}findParent(t){const e=this.root.getLeavesInRegion(t.getBBox());for(const n of e)if(n.getContent()===t)return n;return null}sortLeaves(t){t.sort(((t,e)=>t.getContent().zIndex-e.getContent().zIndex))}render(t,e,n=.001){const r=this.root.getLeavesInRegion(e.visibleRect,n);this.sortLeaves(r);for(const n of r)n.getContent().render(t,e.visibleRect)}renderAll(t){const e=this.root.getLeaves();this.sortLeaves(e);for(const n of e)n.getContent().render(t,n.getBBox())}getElementsIntersectingRegion(t){const e=this.root.getLeavesInRegion(t);return this.sortLeaves(e),e.map((t=>t.getContent()))}}L.AddElementCommand=(C=class{constructor(t,e=!1){P.set(this,void 0),T.set(this,!1),B(this,P,t,"f"),B(this,T,e,"f")}apply(t){t.image.addElement(R(this,P,"f")),R(this,T,"f")?(B(this,T,!1,"f"),t.display.flatten()):t.queueRerender()}unapply(t){const e=t.image.findParent(R(this,P,"f"));null==e\|\|e.remove(),t.queueRerender()}description(t){return t.addElementAction(R(this,P,"f").description(t))}},P=new WeakMap,T=new WeakMap,C);class A{constructor(t=null){this.parent=t,this.targetChildCount=30,this.children=[],this.bbox=k.empty,this.content=null,this.minZIndex=null,this.maxZIndex=null}getContent(){return this.content}getParent(){return this.parent}getChildrenInRegion(t){return this.children.filter((e=>e.getBBox().intersects(t)))}getLeavesInRegion(t,e=0){const n=[];if(this.bbox.maxDimension/t.maxDimension<=e)return[];null!==this.content&&this.getBBox().intersects(t)&&n.push(this);const r=this.getChildrenInRegion(t);for(const i of r)n.push(...i.getLeavesInRegion(t,e));return n}getLeaves(){if(this.content)return[this];const t=[];for(const e of this.children)t.push(...e.getLeaves());return t}addLeaf(t){if(null===this.content&&0===this.children.length)return this.content=t,this.recomputeBBox(!0),this;if(null!==this.content){console.assert(0===this.children.length);const t=new A(this);t.content=this.content,this.content=null,this.children.push(t),t.recomputeBBox(!1)}const e=t.getBBox();if(e.containsRect(this.getBBox())){const e=new A(this),n=new A(this);return n.children=this.children,this.children=[e,n],n.recomputeBBox(!0),e.addLeaf(t)}const n=this.children.filter((t=>t.getBBox().containsRect(e)));if(n.length>0&&this.children.length>=this.targetChildCount){n.sort(((t,e)=>t.getBBox().area-e.getBBox().area));const e=n[0].addLeaf(t);return e.rebalance(),e}const r=new A(this);return this.children.push(r),r.content=t,r.recomputeBBox(!0),r}getBBox(){return this.bbox}recomputeBBox(t){var e,n,r;const i=this.bbox;if(null!==this.content)this.bbox=this.content.getBBox(),this.minZIndex=this.content.zIndex,this.maxZIndex=this.content.zIndex;else{this.bbox=k.empty,this.minZIndex=null,this.maxZIndex=null;let t=!0;for(const r of this.children)t?(this.bbox=r.getBBox(),t=!1):this.bbox=this.bbox.union(r.getBBox()),null!==(e=this.minZIndex)&&void 0!==e\|\|(this.minZIndex=r.minZIndex),null!==(n=this.maxZIndex)&&void 0!==n\|\|(this.maxZIndex=r.maxZIndex),null!==r.minZIndex&&null!==this.minZIndex&&(this.minZIndex=Math.min(r.minZIndex,this.minZIndex)),null!==r.maxZIndex&&null!==this.maxZIndex&&(this.maxZIndex=Math.max(r.maxZIndex,this.maxZIndex))}t&&!i.eq(this.bbox)&&(null===(r=this.parent)\|\|void 0===r\|\|r.recomputeBBox(!0))}rebalance(){if(this.parent&&1===this.parent.children.length){console.assert(null===this.parent.content),console.assert(this.parent.children[0]===this);const t=this.parent;null!==t.parent?(t.children=[],this.parent=t.parent,this.parent.children.push(this),t.parent=null,this.parent.recomputeBBox(!1)):null===this.content&&(this.parent.children=this.children,this.parent=null)}}remove(){if(this.minZIndex=null,this.maxZIndex=null,!this.parent)return this.content=null,void(this.children=[]);const t=this.parent.children.length;this.parent.children=this.parent.children.filter((t=>t!==this)),console.assert(this.parent.children.length===t-1),this.parent.children.forEach((t=>{t.rebalance()})),this.parent.recomputeBBox(!0),this.content=null,this.parent=null,this.children=[]}}!function(t){t[t.PointerDownEvt=0]="PointerDownEvt",t[t.PointerMoveEvt=1]="PointerMoveEvt",t[t.PointerUpEvt=2]="PointerUpEvt",t[t.GestureCancelEvt=3]="GestureCancelEvt",t[t.WheelEvt=4]="WheelEvt",t[t.KeyPressEvent=5]="KeyPressEvent"}(E\|\|(E={})),function(t){t[t.ToolEnabled=0]="ToolEnabled",t[t.ToolDisabled=1]="ToolDisabled",t[t.ToolUpdated=2]="ToolUpdated",t[t.UndoRedoStackUpdated=3]="UndoRedoStackUpdated",t[t.ObjectAdded=4]="ObjectAdded",t[t.ViewportChanged=5]="ViewportChanged",t[t.DisplayResized=6]="DisplayResized",t[t.ColorPickerToggled=7]="ColorPickerToggled"}(S\|\|(S={}));class M{constructor(t,e,n,r,i,o,s,a,l){this.a1=t,this.a2=e,this.a3=n,this.b1=r,this.b2=i,this.b3=o,this.c1=s,this.c2=a,this.c3=l,this.cachedInverse=void 0,this.rows=[x.of(t,e,n),x.of(r,i,o),x.of(s,a,l)]}static ofRows(t,e,n){return new M(t.x,t.y,t.z,e.x,e.y,e.z,n.x,n.y,n.z)}inverse(){var t;return null!==(t=this.computeInverse())&&void 0!==t?t:M.identity}invertable(){return null!==this.computeInverse()}computeInverse(){if(void 0!==this.cachedInverse)return this.cachedInverse;const t=[this.rows[0],this.rows[1],this.rows[2]],e=[x.unitX,x.unitY,x.unitZ];for(let n=0;n<3;n++){let r=t[n].at(n);const i=1e-10;if(Math.abs(r)<i){let o=-1;for(let e=1;e<=2;e++){const r=(n+e)%3;if(Math.abs(t[r].at(n))>=i){o=r;break}}if(-1===o)return this.cachedInverse=null,null;const s=t[n],a=e[n];t[n]=t[o],e[n]=e[o],t[o]=s,e[o]=a,r=t[n].at(n)}let o=1/r;t[n]=t[n].times(o),e[n]=e[n].times(o);const s=t[n],a=e[n];for(let r=1;r<=2;r++){const i=(n+r)%3;o=-t[i].at(n),t[i]=t[i].plus(s.times(o)),e[i]=e[i].plus(a.times(o))}}const n=M.ofRows(e[0],e[1],e[2]);return this.cachedInverse=n,n}transposed(){return new M(this.a1,this.b1,this.c1,this.a2,this.b2,this.c2,this.a3,this.b3,this.c3)}rightMul(t){t=t.transposed();const e=(e,n)=>this.rows[e].dot(t.rows[n]);return new M(e(0,0),e(0,1),e(0,2),e(1,0),e(1,1),e(1,2),e(2,0),e(2,1),e(2,2))}transformVec2(t){let e=x.of(t.x,t.y,1);return e=this.transformVec3(e),y.of(e.x,e.y)}transformVec3(t){return x.of(this.rows[0].dot(t),this.rows[1].dot(t),this.rows[2].dot(t))}eq(t,e=0){for(let n=0;n<3;n++)if(!this.rows[n].eq(t.rows[n],e))return!1;return!0}toString(){return`\n⎡ ${this.a1},\t ${this.a2},\t ${this.a3}\t ⎤\n⎢ ${this.b1},\t ${this.b2},\t ${this.b3}\t ⎥\n⎣ ${this.c1},\t ${this.c2},\t ${this.c3}\t ⎦\n\t\t`.trimRight()}toArray(){return[this.a1,this.a2,this.a3,this.b1,this.b2,this.b3,this.c1,this.c2,this.c3]}static translation(t){return new M(1,0,t.x,0,1,t.y,0,0,1)}static zRotation(t,e=y.zero){const n=Math.cos(t),r=Math.sin(t);let i=M.translation(e);return i=i.rightMul(new M(n,-r,0,r,n,0,0,0,1)),i.rightMul(M.translation(e.times(-1)))}static scaling2D(t,e=y.zero){let n,r,i=M.translation(e);return"number"==typeof t?(n=t,r=t):(n=t.x,r=t.y),i=i.rightMul(new M(n,0,0,0,r,0,0,0,1)),i.rightMul(M.translation(e.times(-1)))}}M.identity=new M(1,0,0,0,1,0,0,0,1),function(t){t[t.Pen=0]="Pen",t[t.Eraser=1]="Eraser",t[t.Touch=2]="Touch",t[t.Mouse=3]="Mouse",t[t.Other=4]="Other"}(z\|\|(z={}));class I{constructor(t,e,n,r,i,o,s,a){this.screenPos=t,this.canvasPos=e,this.pressure=n,this.isPrimary=r,this.down=i,this.device=o,this.id=s,this.timeStamp=a}static ofEvent(t,e,n){var r,i;const o=y.of(t.offsetX,t.offsetY);let s=null!==(r={mouse:z.Mouse,pen:z.Pen,touch:z.Touch}[t.pointerType])&&void 0!==r?r:z.Other;s===z.Pen&&0!=(32&t.buttons)&&(s=z.Eraser);const a=(new Date).getTime(),l=n.roundPoint(n.screenToCanvas(o));return new I(o,l,null!==(i=t.pressure)&&void 0!==i?i:null,t.isPrimary,e,s,t.pointerId,a)}static ofCanvasPoint(t,e,n,r=0,i=z.Pen,o=!0,s=null){const a=n.canvasToScreen(t),l=(new Date).getTime();return new I(a,t,s,o,e,i,r,l)}}var D,O,j=function(t,e,n,r,i){if("m"===r)throw new TypeError("Private method is not writable");if("a"===r&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e\|\|!i:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===r?i.call(t,n):i?i.value=n:e.set(t,n),n},N=function(t,e,n,r){if("a"===n&&!r)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e\|\|!r:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?r:"a"===n?r.call(t):r?r.value:e.get(t)};class V{constructor(t){this.notifier=t,this.resetTransform(M.identity),this.screenRect=k.empty}updateScreenSize(t){this.screenRect=this.screenRect.resizedTo(t)}get visibleRect(){return this.screenRect.transformedBoundingBox(this.inverseTransform)}screenToCanvas(t){return this.inverseTransform.transformVec2(t)}canvasToScreen(t){return this.transform.transformVec2(t)}resetTransform(t){this.transform=t,this.inverseTransform=t.inverse(),this.notifier.dispatch(S.ViewportChanged,{kind:S.ViewportChanged,newTransform:t})}get screenToCanvasTransform(){return this.inverseTransform}get canvasToScreenTransform(){return this.transform}getScaleFactor(){return this.transform.transformVec3(x.unitX).magnitude()}getRotationAngle(){return this.transform.transformVec3(x.unitX).angle()}static roundPoint(t,e){const n=Math.pow(10,Math.floor(Math.log10(e))),r=t=>Math.round(t/n)n;return"number"==typeof t?r(t):t.map(r)}roundPoint(t){return V.roundPoint(t,1/this.getScaleFactor())}}V.ViewportTransform=(O=class{constructor(t){this.transform=t,D.set(this,void 0),j(this,D,t.inverse(),"f")}apply(t){const e=t.viewport;e.resetTransform(e.transform.rightMul(this.transform)),t.queueRerender()}unapply(t){const e=t.viewport;e.resetTransform(e.transform.rightMul(N(this,D,"f"))),t.queueRerender()}description(t){const e=[],n=y.unitX,r=this.transform.transformVec3(y.unitX),i=this.transform.transformVec2(y.unitX),o=r.magnitude(),s=180/Math.PIr.angle(),a=i.minus(n);o>1.2?e.push(t.zoomedIn):o<.8&&e.push(t.zoomedOut),Math.floor(Math.abs(s))>0&&e.push(t.rotatedBy(Math.round(s)));const l=1e-4;return a.x>l?e.push(t.movedLeft):a.x<-1e-4&&e.push(t.movedRight),a.y<l?e.push(t.movedDown):a.y>l&&e.push(t.movedUp),e.join("; ")}},D=new WeakMap,O);const $=V;class F{constructor(t,e){this.notifier=t,this.description=e,this.enabled=!0,this.group=null}onPointerDown(t){return!1}onPointerMove(t){}onPointerUp(t){}onGestureCancel(){}onWheel(t){return!1}onKeyPress(t){return!1}setEnabled(t){var e;this.enabled=t,t?(null===(e=this.group)\|\|void 0===e\|\|e.notifyEnabled(this),this.notifier.dispatch(S.ToolEnabled,{kind:S.ToolEnabled,tool:this})):this.notifier.dispatch(S.ToolDisabled,{kind:S.ToolDisabled,tool:this})}isEnabled(){return this.enabled}setToolGroup(t){this.isEnabled()&&t.notifyEnabled(this),this.group=t}}var U;!function(t){t[t.OneFingerGestures=1]="OneFingerGestures",t[t.TwoFingerGestures=2]="TwoFingerGestures",t[t.AnyDevice=4]="AnyDevice"}(U\|\|(U={}));class _ extends F{constructor(t,e,n){super(t.notifier,n),this.editor=t,this.mode=e,this.kind=At.PanZoom,this.transform=null,e===U.OneFingerGestures&&(this.kind=At.TouchPanZoom)}computePinchData(t,e){const n=e.screenPos.minus(t.screenPos),r=n.angle(),i=n.magnitude();return{canvasCenter:e.canvasPos.plus(t.canvasPos).times(.5),screenCenter:e.screenPos.plus(t.screenPos).times(.5),angle:r,dist:i}}pointersHaveCorrectDeviceType(t){return this.mode&U.AnyDevice\|\|t.every((t=>t.device===z.Touch))}onPointerDown({allPointers:t}){var e;let n=!1;if(this.pointersHaveCorrectDeviceType(t))if(2===t.length&&this.mode&U.TwoFingerGestures){const{screenCenter:e,angle:r,dist:i}=this.computePinchData(t[0],t[1]);this.lastAngle=r,this.lastDist=i,this.lastScreenCenter=e,n=!0}else 1===t.length&&this.mode&U.OneFingerGestures&&(this.lastScreenCenter=t[0].screenPos,n=!0);else n=!1;return n&&(null!==(e=this.transform)&&void 0!==e\|\|(this.transform=new V.ViewportTransform(M.identity))),n}getCenterDelta(t){return this.editor.viewport.screenToCanvasTransform.transformVec3(t.minus(this.lastScreenCenter))}handleTwoFingerMove(t){const{screenCenter:e,canvasCenter:n,angle:r,dist:i}=this.computePinchData(t[0],t[1]),o=this.getCenterDelta(e),s=M.translation(o).rightMul(M.scaling2D(i/this.lastDist,n)).rightMul(M.zRotation(r-this.lastAngle,n));this.lastScreenCenter=e,this.lastDist=i,this.lastAngle=r,this.transform=new V.ViewportTransform(this.transform.transform.rightMul(s))}handleOneFingerMove(t){const e=this.getCenterDelta(t.screenPos);this.transform=new V.ViewportTransform(this.transform.transform.rightMul(M.translation(e))),this.lastScreenCenter=t.screenPos}onPointerMove({allPointers:t}){var e;null!==(e=this.transform)&&void 0!==e\|\|(this.transform=new V.ViewportTransform(M.identity));const n=this.transform;2===t.length&&this.mode&U.TwoFingerGestures?this.handleTwoFingerMove(t):1===t.length&&this.mode&U.OneFingerGestures&&this.handleOneFingerMove(t[0]),n.unapply(this.editor),this.transform.apply(this.editor)}onPointerUp(t){this.transform&&(this.transform.unapply(this.editor),this.editor.dispatch(this.transform,!1)),this.transform=null}onGestureCancel(){var t;null===(t=this.transform)\|\|void 0===t\|\|t.unapply(this.editor),this.transform=null}updateTransform(t){var e;let n=t;this.transform&&(n=this.transform.transform.rightMul(t)),null===(e=this.transform)\|\|void 0===e\|\|e.unapply(this.editor),this.transform=new V.ViewportTransform(n),this.transform.apply(this.editor)}onWheel({delta:t,screenPos:e}){null===this.transform&&(this.transform=new V.ViewportTransform(M.identity));const n=this.editor.viewport.screenToCanvas(e),r=this.editor.viewport.screenToCanvasTransform.transformVec3(x.of(-t.x,-t.y,0)),i=M.scaling2D(Math.pow(1.04,-t.z),n).rightMul(M.translation(r));return this.updateTransform(i),!0}onKeyPress({key:t}){let e=y.zero,n=1,r=0;switch(t){case"a":case"h":case"ArrowLeft":e=y.of(-1,0);break;case"d":case"l":case"ArrowRight":e=y.of(1,0);break;case"k":case"ArrowUp":e=y.of(0,-1);break;case"j":case"ArrowDown":e=y.of(0,1);break;case"w":n=.5;break;case"s":n=2;break;case"r":r=1;break;case"R":r=-1;break;default:return!1}e=e.times(30),r=Math.PI/8,e=e.times(-1),r=-1,n=1/n;e=this.editor.viewport.screenToCanvasTransform.transformVec3(e);const i=this.editor.viewport.visibleRect.center,o=M.scaling2D(n,i).rightMul(M.zRotation(r,i)).rightMul(M.translation(e));return this.updateTransform(o),!0}}const{abs:G,cos:W,sin:H,acos:Z,atan2:q,sqrt:X,pow:Q}=Math;function Y(t){return t<0?-Q(-t,1/3):Q(t,1/3)}const K=Math.PI,J=2K,tt=K/2,et=Number.MAX_SAFE_INTEGER\|\|9007199254740991,nt=Number.MIN_SAFE_INTEGER\|\|-9007199254740991,rt={x:0,y:0,z:0},it={Tvalues:[-.06405689286260563,.06405689286260563,-.1911188674736163,.1911188674736163,-.3150426796961634,.3150426796961634,-.4337935076260451,.4337935076260451,-.5454214713888396,.5454214713888396,-.6480936519369755,.6480936519369755,-.7401241915785544,.7401241915785544,-.820001985973903,.820001985973903,-.8864155270044011,.8864155270044011,-.9382745520027328,.9382745520027328,-.9747285559713095,.9747285559713095,-.9951872199970213,.9951872199970213],Cvalues:[.12793819534675216,.12793819534675216,.1258374563468283,.1258374563468283,.12167047292780339,.12167047292780339,.1155056680537256,.1155056680537256,.10744427011596563,.10744427011596563,.09761865210411388,.09761865210411388,.08619016153195327,.08619016153195327,.0733464814110803,.0733464814110803,.05929858491543678,.05929858491543678,.04427743881741981,.04427743881741981,.028531388628933663,.028531388628933663,.0123412297999872,.0123412297999872],arcfn:function(t,e){const n=e(t);let r=n.xn.x+n.yn.y;return void 0!==n.z&&(r+=n.zn.z),X(r)},compute:function(t,e,n){if(0===t)return e[0].t=0,e[0];const r=e.length-1;if(1===t)return e[r].t=1,e[r];const i=1-t;let o=e;if(0===r)return e[0].t=t,e[0];if(1===r){const e={x:io[0].x+to[1].x,y:io[0].y+to[1].y,t};return n&&(e.z=io[0].z+to[1].z),e}if(r<4){let e,s,a,l=ii,c=tt,h=0;2===r?(o=[o[0],o[1],o[2],rt],e=l,s=it2,a=c):3===r&&(e=li,s=lt3,a=ic3,h=tc);const d={x:eo[0].x+so[1].x+ao[2].x+ho[3].x,y:eo[0].y+so[1].y+ao[2].y+ho[3].y,t};return n&&(d.z=eo[0].z+so[1].z+ao[2].z+ho[3].z),d}const s=JSON.parse(JSON.stringify(e));for(;s.length>1;){for(let e=0;e<s.length-1;e++)s[e]={x:s[e].x+(s[e+1].x-s[e].x)t,y:s[e].y+(s[e+1].y-s[e].y)t},void 0!==s[e].z&&(s[e]=s[e].z+(s[e+1].z-s[e].z)t);s.splice(s.length-1,1)}return s[0].t=t,s[0]},computeWithRatios:function(t,e,n,r){const i=1-t,o=n,s=e;let a,l=o[0],c=o[1],h=o[2],d=o[3];return l=i,c=t,2===s.length?(a=l+c,{x:(ls[0].x+cs[1].x)/a,y:(ls[0].y+cs[1].y)/a,z:!!r&&(ls[0].z+cs[1].z)/a,t}):(l=i,c=2i,h=tt,3===s.length?(a=l+c+h,{x:(ls[0].x+cs[1].x+hs[2].x)/a,y:(ls[0].y+cs[1].y+hs[2].y)/a,z:!!r&&(ls[0].z+cs[1].z+hs[2].z)/a,t}):(l=i,c=1.5i,h=3i,d=ttt,4===s.length?(a=l+c+h+d,{x:(ls[0].x+cs[1].x+hs[2].x+ds[3].x)/a,y:(ls[0].y+cs[1].y+hs[2].y+ds[3].y)/a,z:!!r&&(ls[0].z+cs[1].z+hs[2].z+ds[3].z)/a,t}):void 0))},derive:function(t,e){const n=[];for(let r=t,i=r.length,o=i-1;i>1;i--,o--){const t=[];for(let n,i=0;i<o;i++)n={x:o(r[i+1].x-r[i].x),y:o(r[i+1].y-r[i].y)},e&&(n.z=o(r[i+1].z-r[i].z)),t.push(n);n.push(t),r=t}return n},between:function(t,e,n){return e<=t&&t<=n\|\|it.approximately(t,e)\|\|it.approximately(t,n)},approximately:function(t,e,n){return G(t-e)<=(n\|\|1e-6)},length:function(t){const e=it.Tvalues.length;let n=0;for(let r,i=0;i<e;i++)r=.5it.Tvalues[i]+.5,n+=it.Cvalues[i]it.arcfn(r,t);return.5n},map:function(t,e,n,r,i){return r+(i-r)((t-e)/(n-e))},lerp:function(t,e,n){const r={x:e.x+t(n.x-e.x),y:e.y+t(n.y-e.y)};return void 0!==e.z&&void 0!==n.z&&(r.z=e.z+t(n.z-e.z)),r},pointToString:function(t){let e=t.x+"/"+t.y;return void 0!==t.z&&(e+="/"+t.z),e},pointsToString:function(t){return"["+t.map(it.pointToString).join(", ")+"]"},copy:function(t){return JSON.parse(JSON.stringify(t))},angle:function(t,e,n){const r=e.x-t.x,i=e.y-t.y,o=n.x-t.x,s=n.y-t.y;return q(rs-io,ro+is)},round:function(t,e){const n=""+t,r=n.indexOf(".");return parseFloat(n.substring(0,r+1+e))},dist:function(t,e){const n=t.x-e.x,r=t.y-e.y;return X(nn+rr)},closest:function(t,e){let n,r,i=Q(2,63);return t.forEach((function(t,o){r=it.dist(e,t),r<i&&(i=r,n=o)})),{mdist:i,mpos:n}},abcratio:function(t,e){if(2!==e&&3!==e)return!1;if(void 0===t)t=.5;else if(0===t\|\|1===t)return t;const n=Q(t,e)+Q(1-t,e);return G((n-1)/n)},projectionratio:function(t,e){if(2!==e&&3!==e)return!1;if(void 0===t)t=.5;else if(0===t\|\|1===t)return t;const n=Q(1-t,e);return n/(Q(t,e)+n)},lli8:function(t,e,n,r,i,o,s,a){const l=(t-n)(o-a)-(e-r)(i-s);return 0!=l&&{x:((tr-en)(i-s)-(t-n)(ia-os))/l,y:((tr-en)(o-a)-(e-r)(ia-os))/l}},lli4:function(t,e,n,r){const i=t.x,o=t.y,s=e.x,a=e.y,l=n.x,c=n.y,h=r.x,d=r.y;return it.lli8(i,o,s,a,l,c,h,d)},lli:function(t,e){return it.lli4(t,t.c,e,e.c)},makeline:function(t,e){return new ft(t.x,t.y,(t.x+e.x)/2,(t.y+e.y)/2,e.x,e.y)},findbbox:function(t){let e=et,n=et,r=nt,i=nt;return t.forEach((function(t){const o=t.bbox();e>o.x.min&&(e=o.x.min),n>o.y.min&&(n=o.y.min),r<o.x.max&&(r=o.x.max),i<o.y.max&&(i=o.y.max)})),{x:{min:e,mid:(e+r)/2,max:r,size:r-e},y:{min:n,mid:(n+i)/2,max:i,size:i-n}}},shapeintersections:function(t,e,n,r,i){if(!it.bboxoverlap(e,r))return[];const o=[],s=[t.startcap,t.forward,t.back,t.endcap],a=[n.startcap,n.forward,n.back,n.endcap];return s.forEach((function(e){e.virtual\|\|a.forEach((function(r){if(r.virtual)return;const s=e.intersects(r,i);s.length>0&&(s.c1=e,s.c2=r,s.s1=t,s.s2=n,o.push(s))}))})),o},makeshape:function(t,e,n){const r=e.points.length,i=t.points.length,o=it.makeline(e.points[r-1],t.points[0]),s=it.makeline(t.points[i-1],e.points[0]),a={startcap:o,forward:t,back:e,endcap:s,bbox:it.findbbox([o,t,e,s]),intersections:function(t){return it.shapeintersections(a,a.bbox,t,t.bbox,n)}};return a},getminmax:function(t,e,n){if(!n)return{min:0,max:0};let r,i,o=et,s=nt;-1===n.indexOf(0)&&(n=[0].concat(n)),-1===n.indexOf(1)&&n.push(1);for(let a=0,l=n.length;a<l;a++)r=n[a],i=t.get(r),i[e]<o&&(o=i[e]),i[e]>s&&(s=i[e]);return{min:o,mid:(o+s)/2,max:s,size:s-o}},align:function(t,e){const n=e.p1.x,r=e.p1.y,i=-q(e.p2.y-r,e.p2.x-n);return t.map((function(t){return{x:(t.x-n)W(i)-(t.y-r)H(i),y:(t.x-n)H(i)+(t.y-r)W(i)}}))},roots:function(t,e){e=e\|\|{p1:{x:0,y:0},p2:{x:1,y:0}};const n=t.length-1,r=it.align(t,e),i=function(t){return 0<=t&&t<=1};if(2===n){const t=r[0].y,e=r[1].y,n=r[2].y,o=t-2e+n;if(0!==o){const r=-X(ee-tn),s=-t+e;return[-(r+s)/o,-(-r+s)/o].filter(i)}return e!==n&&0===o?[(2e-n)/(2e-2n)].filter(i):[]}const o=r[0].y,s=r[1].y,a=r[2].y;let l=3s-o-3a+r[3].y,c=3o-6s+3a,h=-3o+3s,d=o;if(it.approximately(l,0)){if(it.approximately(c,0))return it.approximately(h,0)?[]:[-d/h].filter(i);const t=X(hh-4cd),e=2c;return[(t-h)/e,(-h-t)/e].filter(i)}c/=l,h/=l,d/=l;const u=(3h-cc)/3,p=u/3,f=(2ccc-9ch+27d)/27,m=f/2,g=mm+ppp;let v,b,x,y,w;if(g<0){const t=-u/3,e=X(ttt),n=-f/(2e),r=Z(n<-1?-1:n>1?1:n),o=2Y(e);return x=oW(r/3)-c/3,y=oW((r+J)/3)-c/3,w=oW((r+2J)/3)-c/3,[x,y,w].filter(i)}if(0===g)return v=m<0?Y(-m):-Y(m),x=2v-c/3,y=-v-c/3,[x,y].filter(i);{const t=X(g);return v=Y(-m+t),b=Y(m+t),[v-b-c/3].filter(i)}},droots:function(t){if(3===t.length){const e=t[0],n=t[1],r=t[2],i=e-2n+r;if(0!==i){const t=-X(nn-er),o=-e+n;return[-(t+o)/i,-(-t+o)/i]}return n!==r&&0===i?[(2n-r)/(2(n-r))]:[]}if(2===t.length){const e=t[0],n=t[1];return e!==n?[e/(e-n)]:[]}return[]},curvature:function(t,e,n,r,i){let o,s,a,l,c=0,h=0;const d=it.compute(t,e),u=it.compute(t,n),p=d.xd.x+d.yd.y;if(r?(o=X(Q(d.yu.z-u.yd.z,2)+Q(d.zu.x-u.zd.x,2)+Q(d.xu.y-u.xd.y,2)),s=Q(p+d.zd.z,1.5)):(o=d.xu.y-d.yu.x,s=Q(p,1.5)),0===o\|\|0===s)return{k:0,r:0};if(c=o/s,h=s/o,!i){const i=it.curvature(t-.001,e,n,r,!0).k,o=it.curvature(t+.001,e,n,r,!0).k;l=(o-c+(c-i))/2,a=(G(o-c)+G(c-i))/2}return{k:c,r:h,dk:l,adk:a}},inflections:function(t){if(t.length<4)return[];const e=it.align(t,{p1:t[0],p2:t.slice(-1)[0]}),n=e[2].xe[1].y,r=e[3].xe[1].y,i=e[1].xe[2].y,o=18(-3n+2r+3i-e[3].xe[2].y),s=18(3n-r-3i),a=18(i-n);if(it.approximately(o,0)){if(!it.approximately(s,0)){let t=-a/s;if(0<=t&&t<=1)return[t]}return[]}const l=2o;if(it.approximately(l,0))return[];const c=ss-4oa;if(c<0)return[];const h=Math.sqrt(c);return[(h-s)/l,-(s+h)/l].filter((function(t){return 0<=t&&t<=1}))},bboxoverlap:function(t,e){const n=["x","y"],r=n.length;for(let i,o,s,a,l=0;l<r;l++)if(i=n[l],o=t[i].mid,s=e[i].mid,a=(t[i].size+e[i].size)/2,G(o-s)>=a)return!1;return!0},expandbox:function(t,e){e.x.min<t.x.min&&(t.x.min=e.x.min),e.y.min<t.y.min&&(t.y.min=e.y.min),e.z&&e.z.min<t.z.min&&(t.z.min=e.z.min),e.x.max>t.x.max&&(t.x.max=e.x.max),e.y.max>t.y.max&&(t.y.max=e.y.max),e.z&&e.z.max>t.z.max&&(t.z.max=e.z.max),t.x.mid=(t.x.min+t.x.max)/2,t.y.mid=(t.y.min+t.y.max)/2,t.z&&(t.z.mid=(t.z.min+t.z.max)/2),t.x.size=t.x.max-t.x.min,t.y.size=t.y.max-t.y.min,t.z&&(t.z.size=t.z.max-t.z.min)},pairiteration:function(t,e,n){const r=t.bbox(),i=e.bbox(),o=1e5,s=n\|\|.5;if(r.x.size+r.y.size<s&&i.x.size+i.y.size<s)return[(o(t._t1+t._t2)/2\|0)/o+"/"+(o(e._t1+e._t2)/2\|0)/o];let a=t.split(.5),l=e.split(.5),c=[{left:a.left,right:l.left},{left:a.left,right:l.right},{left:a.right,right:l.right},{left:a.right,right:l.left}];c=c.filter((function(t){return it.bboxoverlap(t.left.bbox(),t.right.bbox())}));let h=[];return 0===c.length\|\|(c.forEach((function(t){h=h.concat(it.pairiteration(t.left,t.right,s))})),h=h.filter((function(t,e){return h.indexOf(t)===e}))),h},getccenter:function(t,e,n){const r=e.x-t.x,i=e.y-t.y,o=n.x-e.x,s=n.y-e.y,a=rW(tt)-iH(tt),l=rH(tt)+iW(tt),c=oW(tt)-sH(tt),h=oH(tt)+sW(tt),d=(t.x+e.x)/2,u=(t.y+e.y)/2,p=(e.x+n.x)/2,f=(e.y+n.y)/2,m=d+a,g=u+l,v=p+c,b=f+h,x=it.lli8(d,u,m,g,p,f,v,b),y=it.dist(x,t);let w,k=q(t.y-x.y,t.x-x.x),P=q(e.y-x.y,e.x-x.x),T=q(n.y-x.y,n.x-x.x);return k<T?((k>P\|\|P>T)&&(k+=J),k>T&&(w=T,T=k,k=w)):T<P&&P<k?(w=T,T=k,k=w):T+=J,x.s=k,x.e=T,x.r=y,x},numberSort:function(t,e){return t-e}};class ot{constructor(t){this.curves=[],this._3d=!1,t&&(this.curves=t,this._3d=this.curves[0]._3d)}valueOf(){return this.toString()}toString(){return"["+this.curves.map((function(t){return it.pointsToString(t.points)})).join(", ")+"]"}addCurve(t){this.curves.push(t),this._3d=this._3d\|\|t._3d}length(){return this.curves.map((function(t){return t.length()})).reduce((function(t,e){return t+e}))}curve(t){return this.curves[t]}bbox(){const t=this.curves;for(var e=t[0].bbox(),n=1;n<t.length;n++)it.expandbox(e,t[n].bbox());return e}offset(t){const e=[];return this.curves.forEach((function(n){e.push(...n.offset(t))})),new ot(e)}}const{abs:st,min:at,max:lt,cos:ct,sin:ht,acos:dt,sqrt:ut}=Math,pt=Math.PI;class ft{constructor(t){let e=t&&t.forEach?t:Array.from(arguments).slice(),n=!1;if("object"==typeof e[0]){n=e.length;const t=[];e.forEach((function(e){["x","y","z"].forEach((function(n){void 0!==e[n]&&t.push(e[n])}))})),e=t}let r=!1;const i=e.length;if(n){if(n>4){if(1!==arguments.length)throw new Error("Only new Bezier(point[]) is accepted for 4th and higher order curves");r=!0}}else if(6!==i&&8!==i&&9!==i&&12!==i&&1!==arguments.length)throw new Error("Only new Bezier(point[]) is accepted for 4th and higher order curves");const o=this._3d=!r&&(9===i\|\|12===i)\|\|t&&t[0]&&void 0!==t[0].z,s=this.points=[];for(let t=0,n=o?3:2;t<i;t+=n){var a={x:e[t],y:e[t+1]};o&&(a.z=e[t+2]),s.push(a)}const l=this.order=s.length-1,c=this.dims=["x","y"];o&&c.push("z"),this.dimlen=c.length;const h=it.align(s,{p1:s[0],p2:s[l]}),d=it.dist(s[0],s[l]);this._linear=h.reduce(((t,e)=>t+st(e.y)),0)<d/50,this._lut=[],this._t1=0,this._t2=1,this.update()}static quadraticFromPoints(t,e,n,r){if(void 0===r&&(r=.5),0===r)return new ft(e,e,n);if(1===r)return new ft(t,e,e);const i=ft.getABC(2,t,e,n,r);return new ft(t,i.A,n)}static cubicFromPoints(t,e,n,r,i){void 0===r&&(r=.5);const o=ft.getABC(3,t,e,n,r);void 0===i&&(i=it.dist(e,o.C));const s=i(1-r)/r,a=it.dist(t,n),l=(n.x-t.x)/a,c=(n.y-t.y)/a,h=il,d=ic,u=sl,p=sc,f=e.x-h,m=e.y-d,g=e.x+u,v=e.y+p,b=o.A,x=b.x+(f-b.x)/(1-r),y=b.y+(m-b.y)/(1-r),w=b.x+(g-b.x)/r,k=b.y+(v-b.y)/r,P={x:t.x+(x-t.x)/r,y:t.y+(y-t.y)/r},T={x:n.x+(w-n.x)/(1-r),y:n.y+(k-n.y)/(1-r)};return new ft(t,P,T,n)}static getUtils(){return it}getUtils(){return ft.getUtils()}static get PolyBezier(){return ot}valueOf(){return this.toString()}toString(){return it.pointsToString(this.points)}toSVG(){if(this._3d)return!1;const t=this.points,e=["M",t[0].x,t[0].y,2===this.order?"Q":"C"];for(let n=1,r=t.length;n<r;n++)e.push(t[n].x),e.push(t[n].y);return e.join(" ")}setRatios(t){if(t.length!==this.points.length)throw new Error("incorrect number of ratio values");this.ratios=t,this._lut=[]}verify(){const t=this.coordDigest();t!==this._print&&(this._print=t,this.update())}coordDigest(){return this.points.map((function(t,e){return""+e+t.x+t.y+(t.z?t.z:0)})).join("")}update(){this._lut=[],this.dpoints=it.derive(this.points,this._3d),this.computedirection()}computedirection(){const t=this.points,e=it.angle(t[0],t[this.order],t[1]);this.clockwise=e>0}length(){return it.length(this.derivative.bind(this))}static getABC(t=2,e,n,r,i=.5){const o=it.projectionratio(i,t),s=1-o,a={x:oe.x+sr.x,y:oe.y+sr.y},l=it.abcratio(i,t);return{A:{x:n.x+(n.x-a.x)/l,y:n.y+(n.y-a.y)/l},B:n,C:a,S:e,E:r}}getABC(t,e){e=e\|\|this.get(t);let n=this.points[0],r=this.points[this.order];return ft.getABC(this.order,n,e,r,t)}getLUT(t){if(this.verify(),t=t\|\|100,this._lut.length===t)return this._lut;this._lut=[],t++,this._lut=[];for(let e,n,r=0;r<t;r++)n=r/(t-1),e=this.compute(n),e.t=n,this._lut.push(e);return this._lut}on(e,n){n=n\|\|5;const r=this.getLUT(),i=[];for(let t,o=0,s=0;o<r.length;o++)t=r[o],it.dist(t,e)<n&&(i.push(t),s+=o/r.length);return!!i.length&&(t/=i.length)}project(t){const e=this.getLUT(),n=e.length-1,r=it.closest(e,t),i=r.mpos,o=(i-1)/n,s=(i+1)/n,a=.1/n;let l,c,h=r.mdist,d=o,u=d;for(h+=1;d<s+a;d+=a)l=this.compute(d),c=it.dist(t,l),c<h&&(h=c,u=d);return u=u<0?0:u>1?1:u,l=this.compute(u),l.t=u,l.d=h,l}get(t){return this.compute(t)}point(t){return this.points[t]}compute(t){return this.ratios?it.computeWithRatios(t,this.points,this.ratios,this._3d):it.compute(t,this.points,this._3d,this.ratios)}raise(){const t=this.points,e=[t[0]],n=t.length;for(let r,i,o=1;o<n;o++)r=t[o],i=t[o-1],e[o]={x:(n-o)/nr.x+o/ni.x,y:(n-o)/nr.y+o/ni.y};return e[n]=t[n-1],new ft(e)}derivative(t){return it.compute(t,this.dpoints[0],this._3d)}dderivative(t){return it.compute(t,this.dpoints[1],this._3d)}align(){let t=this.points;return new ft(it.align(t,{p1:t[0],p2:t[t.length-1]}))}curvature(t){return it.curvature(t,this.dpoints[0],this.dpoints[1],this._3d)}inflections(){return it.inflections(this.points)}normal(t){return this._3d?this.__normal3(t):this.__normal2(t)}__normal2(t){const e=this.derivative(t),n=ut(e.xe.x+e.ye.y);return{t,x:-e.y/n,y:e.x/n}}__normal3(t){const e=this.derivative(t),n=this.derivative(t+.01),r=ut(e.xe.x+e.ye.y+e.ze.z),i=ut(n.xn.x+n.yn.y+n.zn.z);e.x/=r,e.y/=r,e.z/=r,n.x/=i,n.y/=i,n.z/=i;const o={x:n.ye.z-n.ze.y,y:n.ze.x-n.xe.z,z:n.xe.y-n.ye.x},s=ut(o.xo.x+o.yo.y+o.zo.z);o.x/=s,o.y/=s,o.z/=s;const a=[o.xo.x,o.xo.y-o.z,o.xo.z+o.y,o.xo.y+o.z,o.yo.y,o.yo.z-o.x,o.xo.z-o.y,o.yo.z+o.x,o.zo.z];return{t,x:a[0]e.x+a[1]e.y+a[2]e.z,y:a[3]e.x+a[4]e.y+a[5]e.z,z:a[6]e.x+a[7]e.y+a[8]e.z}}hull(t){let e=this.points,n=[],r=[],i=0;for(r[i++]=e[0],r[i++]=e[1],r[i++]=e[2],3===this.order&&(r[i++]=e[3]);e.length>1;){n=[];for(let o,s=0,a=e.length-1;s<a;s++)o=it.lerp(t,e[s],e[s+1]),r[i++]=o,n.push(o);e=n}return r}split(t,e){if(0===t&&e)return this.split(e).left;if(1===e)return this.split(t).right;const n=this.hull(t),r={left:2===this.order?new ft([n[0],n[3],n[5]]):new ft([n[0],n[4],n[7],n[9]]),right:2===this.order?new ft([n[5],n[4],n[2]]):new ft([n[9],n[8],n[6],n[3]]),span:n};return r.left._t1=it.map(0,0,1,this._t1,this._t2),r.left._t2=it.map(t,0,1,this._t1,this._t2),r.right._t1=it.map(t,0,1,this._t1,this._t2),r.right._t2=it.map(1,0,1,this._t1,this._t2),e?(e=it.map(e,t,1,0,1),r.right.split(e).left):r}extrema(){const t={};let e=[];return this.dims.forEach(function(n){let r=function(t){return t[n]},i=this.dpoints[0].map(r);t[n]=it.droots(i),3===this.order&&(i=this.dpoints[1].map(r),t[n]=t[n].concat(it.droots(i))),t[n]=t[n].filter((function(t){return t>=0&&t<=1})),e=e.concat(t[n].sort(it.numberSort))}.bind(this)),t.values=e.sort(it.numberSort).filter((function(t,n){return e.indexOf(t)===n})),t}bbox(){const t=this.extrema(),e={};return this.dims.forEach(function(n){e[n]=it.getminmax(this,n,t[n])}.bind(this)),e}overlaps(t){const e=this.bbox(),n=t.bbox();return it.bboxoverlap(e,n)}offset(t,e){if(void 0!==e){const n=this.get(t),r=this.normal(t),i={c:n,n:r,x:n.x+r.xe,y:n.y+r.ye};return this._3d&&(i.z=n.z+r.ze),i}if(this._linear){const e=this.normal(0),n=this.points.map((function(n){const r={x:n.x+te.x,y:n.y+te.y};return n.z&&e.z&&(r.z=n.z+te.z),r}));return[new ft(n)]}return this.reduce().map((function(e){return e._linear?e.offset(t)[0]:e.scale(t)}))}simple(){if(3===this.order){const t=it.angle(this.points[0],this.points[3],this.points[1]),e=it.angle(this.points[0],this.points[3],this.points[2]);if(t>0&&e<0\|\|t<0&&e>0)return!1}const t=this.normal(0),e=this.normal(1);let n=t.xe.x+t.ye.y;return this._3d&&(n+=t.ze.z),st(dt(n))<pt/3}reduce(){let t,e,n=0,r=0,i=.01,o=[],s=[],a=this.extrema().values;for(-1===a.indexOf(0)&&(a=[0].concat(a)),-1===a.indexOf(1)&&a.push(1),n=a[0],t=1;t<a.length;t++)r=a[t],e=this.split(n,r),e._t1=n,e._t2=r,o.push(e),n=r;return o.forEach((function(t){for(n=0,r=0;r<=1;)for(r=n+i;r<=1.01;r+=i)if(e=t.split(n,r),!e.simple()){if(r-=i,st(n-r)<i)return[];e=t.split(n,r),e._t1=it.map(n,0,1,t._t1,t._t2),e._t2=it.map(r,0,1,t._t1,t._t2),s.push(e),n=r;break}n<1&&(e=t.split(n,1),e._t1=it.map(n,0,1,t._t1,t._t2),e._t2=t._t2,s.push(e))})),s}translate(t,e,n){n="number"==typeof n?n:e;const r=this.order;let i=this.points.map(((t,i)=>(1-i/r)e+i/rn));return new ft(this.points.map(((e,n)=>({x:e.x+t.xi[n],y:e.y+t.yi[n]}))))}scale(t){const e=this.order;let n=!1;if("function"==typeof t&&(n=t),n&&2===e)return this.raise().scale(n);const r=this.clockwise,i=this.points;if(this._linear)return this.translate(this.normal(0),n?n(0):t,n?n(1):t);const o=n?n(0):t,s=n?n(1):t,a=[this.offset(0,10),this.offset(1,10)],l=[],c=it.lli4(a[0],a[0].c,a[1],a[1].c);if(!c)throw new Error("cannot scale this curve. Try reducing it first.");return[0,1].forEach((function(t){const n=l[te]=it.copy(i[te]);n.x+=(t?s:o)a[t].n.x,n.y+=(t?s:o)a[t].n.y})),n?([0,1].forEach((function(o){if(2!==e\|\|!o){var s=i[o+1],a={x:s.x-c.x,y:s.y-c.y},h=n?n((o+1)/e):t;n&&!r&&(h=-h);var d=ut(a.xa.x+a.ya.y);a.x/=d,a.y/=d,l[o+1]={x:s.x+ha.x,y:s.y+ha.y}}})),new ft(l)):([0,1].forEach((t=>{if(2===e&&t)return;const n=l[te],r=this.derivative(t),o={x:n.x+r.x,y:n.y+r.y};l[t+1]=it.lli4(n,o,c,i[t+1])})),new ft(l))}outline(t,e,n,r){if(e=void 0===e?t:e,this._linear){const i=this.normal(0),o=this.points[0],s=this.points[this.points.length-1];let a,l,c;void 0===n&&(n=t,r=e),a={x:o.x+i.xt,y:o.y+i.yt},c={x:s.x+i.xn,y:s.y+i.yn},l={x:(a.x+c.x)/2,y:(a.y+c.y)/2};const h=[a,l,c];a={x:o.x-i.xe,y:o.y-i.ye},c={x:s.x-i.xr,y:s.y-i.yr},l={x:(a.x+c.x)/2,y:(a.y+c.y)/2};const d=[c,l,a],u=it.makeline(d[2],h[0]),p=it.makeline(h[2],d[0]),f=[u,new ft(h),p,new ft(d)];return new ot(f)}const i=this.reduce(),o=i.length,s=[];let a,l=[],c=0,h=this.length();const d=void 0!==n&&void 0!==r;function u(t,e,n,r,i){return function(o){const s=r/n,a=(r+i)/n,l=e-t;return it.map(o,0,1,t+sl,t+al)}}i.forEach((function(i){const o=i.length();d?(s.push(i.scale(u(t,n,h,c,o))),l.push(i.scale(u(-e,-r,h,c,o)))):(s.push(i.scale(t)),l.push(i.scale(-e))),c+=o})),l=l.map((function(t){return a=t.points,a[3]?t.points=[a[3],a[2],a[1],a[0]]:t.points=[a[2],a[1],a[0]],t})).reverse();const p=s[0].points[0],f=s[o-1].points[s[o-1].points.length-1],m=l[o-1].points[l[o-1].points.length-1],g=l[0].points[0],v=it.makeline(m,p),b=it.makeline(f,g),x=[v].concat(s).concat([b]).concat(l);return new ot(x)}outlineshapes(t,e,n){e=e\|\|t;const r=this.outline(t,e).curves,i=[];for(let t=1,e=r.length;t<e/2;t++){const o=it.makeshape(r[t],r[e-t],n);o.startcap.virtual=t>1,o.endcap.virtual=t<e/2-1,i.push(o)}return i}intersects(t,e){return t?t.p1&&t.p2?this.lineIntersects(t):(t instanceof ft&&(t=t.reduce()),this.curveintersects(this.reduce(),t,e)):this.selfintersects(e)}lineIntersects(t){const e=at(t.p1.x,t.p2.x),n=at(t.p1.y,t.p2.y),r=lt(t.p1.x,t.p2.x),i=lt(t.p1.y,t.p2.y);return it.roots(this.points,t).filter((t=>{var o=this.get(t);return it.between(o.x,e,r)&&it.between(o.y,n,i)}))}selfintersects(t){const e=this.reduce(),n=e.length-2,r=[];for(let i,o,s,a=0;a<n;a++)o=e.slice(a,a+1),s=e.slice(a+2),i=this.curveintersects(o,s,t),r.push(...i);return r}curveintersects(t,e,n){const r=[];t.forEach((function(t){e.forEach((function(e){t.overlaps(e)&&r.push({left:t,right:e})}))}));let i=[];return r.forEach((function(t){const e=it.pairiteration(t.left,t.right,n);e.length>0&&(i=i.concat(e))})),i}arcs(t){return t=t\|\|.5,this._iterate(t,[])}_error(t,e,n,r){const i=(r-n)/4,o=this.get(n+i),s=this.get(r-i),a=it.dist(t,e),l=it.dist(t,o),c=it.dist(t,s);return st(l-a)+st(c-a)}_iterate(t,e){let n,r=0,i=1;do{n=0,i=1;let o,s,a,l,c,h=this.get(r),d=!1,u=!1,p=i,f=1,m=0;do{if(u=d,l=a,p=(r+i)/2,m++,o=this.get(p),s=this.get(i),a=it.getccenter(h,o,s),a.interval={start:r,end:i},d=this._error(a,h,r,i)<=t,c=u&&!d,c\|\|(f=i),d){if(i>=1){if(a.interval.end=f=1,l=a,i>1){let t={x:a.x+a.rct(a.e),y:a.y+a.rht(a.e)};a.e+=it.angle({x:a.x,y:a.y},t,this.get(1))}break}i+=(i-r)/2}else i=p}while(!c&&n++<100);if(n>=100)break;l=l\|\|a,e.push(l),r=f}while(i<1);return e}}var mt;!function(t){t[t.LineTo=0]="LineTo",t[t.MoveTo=1]="MoveTo",t[t.CubicBezierTo=2]="CubicBezierTo",t[t.QuadraticBezierTo=3]="QuadraticBezierTo"}(mt\|\|(mt={}));class gt{constructor(t,e){this.startPoint=t,this.parts=e,this.cachedGeometry=null,this.bbox=k.bboxOf([t]);for(const n of e)this.bbox=this.bbox.union(gt.computeBBoxForSegment(t,n))}get geometry(){if(this.cachedGeometry)return this.cachedGeometry;let t=this.startPoint;const e=[];for(const n of this.parts)switch(n.kind){case mt.CubicBezierTo:e.push(new ft(t.xy,n.controlPoint1.xy,n.controlPoint2.xy,n.endPoint.xy)),t=n.endPoint;break;case mt.QuadraticBezierTo:e.push(new ft(t.xy,n.controlPoint.xy,n.endPoint.xy)),t=n.endPoint;break;case mt.LineTo:e.push(new w(t,n.point)),t=n.point;break;case mt.MoveTo:t=n.point}return this.cachedGeometry=e,this.cachedGeometry}static computeBBoxForSegment(t,e){const n=[t];let r;switch(e.kind){case mt.MoveTo:case mt.LineTo:n.push(e.point);break;case mt.CubicBezierTo:n.push(e.controlPoint1,e.controlPoint2,e.endPoint);break;case mt.QuadraticBezierTo:n.push(e.controlPoint,e.endPoint);break;default:return r=e,r}return k.bboxOf(n)}intersection(t){const e=[];for(const n of this.geometry)if(n instanceof w){const r=n.intersection(t);r&&e.push({curve:n,parameterValue:r.t,point:r.point})}else{const r=n.intersects(t).map((e=>{"string"==typeof e&&(e=parseFloat(e));const r=y.ofXY(n.get(e));return r.minus(t.p1).magnitude()>t.length\|\|r.minus(t.p2).magnitude()>t.length?null:{point:r,parameterValue:e,curve:n}})).filter((t=>null!==t));e.push(...r)}return e}transformedBy(t){const e=t.transformVec2(this.startPoint),n=[];let r;for(const e of this.parts)switch(e.kind){case mt.MoveTo:case mt.LineTo:n.push({kind:e.kind,point:t.transformVec2(e.point)});break;case mt.CubicBezierTo:n.push({kind:e.kind,controlPoint1:t.transformVec2(e.controlPoint1),controlPoint2:t.transformVec2(e.controlPoint2),endPoint:t.transformVec2(e.endPoint)});break;case mt.QuadraticBezierTo:n.push({kind:e.kind,controlPoint:t.transformVec2(e.controlPoint),endPoint:t.transformVec2(e.endPoint)});break;default:return r=e,r}return new gt(e,n)}union(t){return t?new gt(this.startPoint,[...this.parts,{kind:mt.MoveTo,point:t.startPoint},...t.parts]):this}static fromRect(t,e=null){const n=[];let r,i;if(null!==e){const n=y.of(e,e).times(.5),o=k.fromCorners(t.topLeft.plus(n),t.bottomRight.minus(n)),s=k.fromCorners(t.topLeft.minus(n),t.bottomRight.plus(n));r=[o.corners[3],...o.corners,...s.corners.reverse()],i=s.corners[3]}else r=t.corners.slice(1),i=t.corners[0];for(const t of r)n.push({kind:mt.LineTo,point:t});return new gt(i,n)}static fromRenderable(t){return new gt(t.startPoint,t.commands)}toRenderable(t){return{startPoint:this.startPoint,style:t,commands:this.parts}}toString(){return gt.toString(this.startPoint,this.parts)}static toString(t,e){const n=[],r=t=>{let e=t.toString();if(-1===e.indexOf("."))return e;const n=/^([-]?)(\d)\.(\d9{4,}\d)$/.exec(e);if(n){const t=n[1],r=parseInt(e.charAt(e.length-1),10),i=parseInt(n[3],10),o=parseInt(n[2],10);let s=(i+10-r).toString(),a=0;s.length>i.toString().length&&(s=s.substring(1),a=1),e=`${t+(o+a).toString()}.${s}`}return e=e.replace(/^([-]?\d\.?\d[1-9.])0{4,}\d$/,"$1"),e.replace(/[.]$/,"")},i=(t,...e)=>{const i=[];for(const t of e){const e=r(t.x),n=r(t.y);i.push(`${e},${n}`)}n.push(`${t}${i.join(" ")}`)};let o;i("M",t);for(const t of e)switch(t.kind){case mt.MoveTo:i("M",t.point);break;case mt.LineTo:i("L",t.point);break;case mt.CubicBezierTo:i("C",t.controlPoint1,t.controlPoint2,t.endPoint);break;case mt.QuadraticBezierTo:i("Q",t.controlPoint,t.endPoint);break;default:return o=t,o}return n.join("")}static fromString(t){t=t.split("\n").join(" ");let e=y.zero,n=null,r=!0;const i=[],o=t=>{r?r=!1:i.push({kind:mt.LineTo,point:t})},s=/([MmZzLlHhVvCcSsQqTtAa])\s([^a-zA-Z])/g;let a;for(;null!==(a=s.exec(t));){const t=a[2].trim().split(/[^0-9.-]/).filter((t=>t.length>0)).map((t=>parseFloat(t))),s=a[1],f=s!==s.toLowerCase(),m=t.reduce(((t,e,n,r)=>{if(n%2!=0){const i=e,o=r[n-1];return t.concat(y.of(o,i))}return t}),[]).map((t=>f?(e=t,t):(e=e.plus(t),e)));let g;switch(s.toLowerCase()){case"m":g=1,p=m[0],r?r=!1:i.push({kind:mt.MoveTo,point:p});break;case"l":g=1,o(m[0]);break;case"z":g=0,n&&o(n);break;case"c":g=3,h=m[0],d=m[1],u=m[2],i.push({kind:mt.CubicBezierTo,controlPoint1:h,controlPoint2:d,endPoint:u});break;case"q":g=2,l=m[0],c=m[1],i.push({kind:mt.QuadraticBezierTo,controlPoint:l,endPoint:c});break;case"h":g=0,o(f?y.of(t[0],e.y):e.plus(y.of(t[0],0)));break;case"v":g=0,o(f?y.of(e.x,t[1]):e.plus(y.of(0,t[1])));break;default:throw new Error(`Unknown path command ${s}`)}if(m.length!==g)throw new Error(`\n\t\t\t\t\tIncorrect number of arguments: got ${JSON.stringify(m)} with a length of ${m.length} ≠ ${g}.\n\t\t\t\t`.trim());m.length>0&&(null!=n\|\|(n=m[0])),r=!1}var l,c,h,d,u,p;return new gt(null!=n?n:y.zero,i)}}class vt{constructor(){this.lastChangedTime=(new Date).getTime(),this.zIndex=vt.zIndexCounter++}getBBox(){return this.contentBBox}transformBy(t){const e=(t,e)=>{const n=t.image.findParent(this);let r=!1;n&&(n.remove(),r=!0),this.applyTransformation(e),r&&new L.AddElementCommand(this).apply(t)},n=this.zIndex;return{apply:n=>{this.zIndex=vt.zIndexCounter++,e(n,t),n.queueRerender()},unapply:r=>{this.zIndex=n,e(r,t.inverse()),r.queueRerender()},description:t=>t.transformedElements(1)}}}vt.zIndexCounter=0;class bt extends vt{constructor(t){var e;super(),this.parts=t.map((t=>{const e=gt.fromRenderable(t),n=this.bboxForPart(e.bbox,t.style);return this.contentBBox?this.contentBBox=this.contentBBox.union(n):this.contentBBox=n,{path:e,bbox:n,startPoint:e.startPoint,style:t.style,commands:e.parts}})),null!==(e=this.contentBBox)&&void 0!==e\|\|(this.contentBBox=k.empty)}intersects(t){for(const e of this.parts)if(e.path.intersection(t).length>0)return!0;return!1}render(t,e){t.startObject(this.getBBox());for(const n of this.parts){const r=n.bbox;e&&!r.intersects(e)\|\|t.drawPath(n)}t.endObject()}bboxForPart(t,e){return e.stroke?t.grownBy(e.stroke.width/2):t}applyTransformation(t){this.contentBBox=k.empty;let e=!0;this.parts=this.parts.map((n=>{const r=n.path.transformedBy(t),i=this.bboxForPart(r.bbox,n.style);return e?(this.contentBBox=i,e=!1):this.contentBBox=this.contentBBox.union(i),{path:r,bbox:i,startPoint:r.startPoint,commands:r.parts,style:n.style}}))}description(t){return t.stroke}}const xt=(t,e)=>{const n=e.screenToCanvasTransform,r=7n.transformVec3(y.unitX).magnitude(),i=2n.transformVec3(y.unitX).magnitude();return new yt(t,i,r)};class yt{constructor(t,e,n){this.startPoint=t,this.minFitAllowed=e,this.maxFitAllowed=n,this.currentCurve=null,this.lastPoint=this.startPoint,this.segments=[],this.buffer=[this.startPoint.pos],this.momentum=y.zero,this.currentCurve=null,this.bbox=new k(this.startPoint.pos.x,this.startPoint.pos.y,0,0)}getBBox(){return this.bbox}getRenderingStyle(){var t;return{fill:null!==(t=this.lastPoint.color)&&void 0!==t?t:null}}getPreview(){if(this.currentCurve&&this.lastPoint){const t=this.currentSegmentToPath();return this.segments.concat(t)}return this.segments}preview(t){for(const e of this.getPreview())t.drawPath(e)}build(){return this.lastPoint&&this.finalizeCurrentCurve(),new bt(this.segments)}roundPoint(t){return $.roundPoint(t,this.minFitAllowed)}finalizeCurrentCurve(){if(!this.currentCurve){if(this.segments.length>0)return;const t=$.roundPoint(this.startPoint.width/3,this.minFitAllowed),e=this.roundPoint(this.startPoint.pos);return void this.segments.push({startPoint:this.startPoint.pos.plus(y.of(t,0)),commands:[{kind:mt.QuadraticBezierTo,controlPoint:e.plus(y.of(t,t)),endPoint:e.plus(y.of(0,t))},{kind:mt.QuadraticBezierTo,controlPoint:e.plus(y.of(-t,t)),endPoint:e.plus(y.of(-t,0))},{kind:mt.QuadraticBezierTo,controlPoint:e.plus(y.of(-t,-t)),endPoint:e.plus(y.of(0,-t))},{kind:mt.QuadraticBezierTo,controlPoint:e.plus(y.of(t,-t)),endPoint:e.plus(y.of(t,0))}],style:this.getRenderingStyle()})}this.segments.push(this.currentSegmentToPath());const t=this.buffer[this.buffer.length-1];this.lastExitingVec=y.ofXY(this.currentCurve.points[2]).minus(y.ofXY(this.currentCurve.points[1])),console.assert(0!==this.lastExitingVec.magnitude()),this.buffer=[this.buffer[this.buffer.length-2],t],this.currentCurve=null}currentSegmentToPath(){if(null==this.currentCurve)throw new Error("Invalid State: currentCurve is null!");let t=y.ofXY(this.currentCurve.normal(0)).normalized(),e=y.ofXY(this.currentCurve.normal(1)).normalized();t=t.times(this.curveStartWidth/2),e=e.times(this.curveEndWidth/2),isNaN(t.magnitude())&&(console.error("startVec is NaN",t,e,this.currentCurve),t=e);const n=y.ofXY(this.currentCurve.get(0)),r=y.ofXY(this.currentCurve.get(1)),i=y.ofXY(this.currentCurve.points[1]);let o=this.currentCurve.project(i.xy).t;o\|\|(o=n.minus(i).magnitudeSquared()<r.minus(i).magnitudeSquared()?.1:.9);const s=o;let a=y.ofXY(this.currentCurve.normal(s)).normalized().times(this.curveStartWidth/2s+this.curveEndWidth/2(1-s));const l=(o,s)=>new ft(n.plus(t.times(o)),i.plus(s.times(o)),r.plus(e.times(o))),c=l(1,a),h=l(-1,a);2===c.intersects(h).length&&(a=a.times(2));const d=[{kind:mt.QuadraticBezierTo,controlPoint:this.roundPoint(i.plus(a)),endPoint:this.roundPoint(r.plus(e))},{kind:mt.LineTo,point:this.roundPoint(r.minus(e))},{kind:mt.QuadraticBezierTo,controlPoint:this.roundPoint(i.minus(a)),endPoint:this.roundPoint(n.minus(t))}];return{startPoint:this.roundPoint(n.plus(t)),commands:d,style:this.getRenderingStyle()}}computeExitingVec(){return this.momentum.normalized().times(this.lastPoint.width/2)}addPoint(t){var e,n;if(this.lastPoint){const e=1e-10,n=t.time-this.lastPoint.time;if(t.pos.eq(this.lastPoint.pos,e)\|\|0===n)return void console.warn("Discarding identical point");if(isNaN(t.pos.magnitude()))return void console.warn("Discarding NaN point.",t);const r=Math.min(this.lastPoint.width,t.width)/4;if(this.startPoint.pos.minus(t.pos).magnitude()<r&&0===this.segments.length)return;const i=t.pos.minus(this.lastPoint.pos).times(1/n1e3);this.momentum=this.momentum.lerp(i,.9)}const r=null!==(e=this.lastPoint)&&void 0!==e?e:t;this.lastPoint=t,this.buffer.push(t.pos);const i=t.width/2,o=this.curveEndWidth;if(this.curveEndWidth=i,this.bbox=this.bbox.grownToPoint(t.pos,i),null===this.currentCurve){const e=r.pos,i=r.pos.plus(null!==(n=this.lastExitingVec)&&void 0!==n?n:y.unitX),o=t.pos;this.currentCurve=new ft(e.xy,i.xy,o.xy),this.curveStartWidth=r.width/2,console.assert(!isNaN(e.magnitude())&&!isNaN(i.magnitude())&&!isNaN(o.magnitude()),"Expected !NaN")}let s=this.lastExitingVec;if(!s){let t=Math.ceil(this.buffer.length/3);0===t&&(t=this.buffer.length-1),s=this.buffer[t].minus(this.buffer[0])}let a=this.computeExitingVec();const l=this.buffer[0],c=t.pos,h=c.minus(l).magnitude(),d=2h;if(0===d\|\|0===a.magnitude()\|\|isNaN(a.magnitude()))return;console.assert(!isNaN(s.magnitude())),s=s.normalized(),a=a.normalized(),console.assert(!isNaN(s.magnitude()));const u=new w(l,l.plus(s.times(d))),p=new w(c.minus(a.times(d)),c).intersection(u);let f;f=p?p.point:l.plus(s.times(h/4)),(isNaN(f.magnitude())\|\|isNaN(l.magnitude()))&&console.error("controlPoint is NaN",p,"Start:",l,"End:",c,"in:",s,"out:",a);const m=this.currentCurve;this.currentCurve=new ft(l.xy,f.xy,c.xy),isNaN(y.ofXY(this.currentCurve.normal(0)).magnitude())&&(console.error("NaN normal at 0. Curve:",this.currentCurve),this.currentCurve=m);const g=t=>{for(const e of this.buffer){const n=y.ofXY(t.project(e.xy)).minus(e).magnitude();if(n>Math.max(Math.min(this.curveStartWidth,this.curveEndWidth)/2,this.minFitAllowed)\|\|n>this.maxFitAllowed)return!1}return!0};return this.buffer.length>3&&!g(this.currentCurve)?(this.currentCurve=m,this.curveEndWidth=o,this.lastPoint=r,void this.finalizeCurrentCurve()):void 0}}class wt extends F{constructor(t,e,n){super(t.notifier,e),this.editor=t,this.style=n,this.builder=null,this.builderFactory=xt,this.lastPoint=null,this.kind=At.Pen}getPressureMultiplier(){return 1/this.editor.viewport.getScaleFactor()this.style.thickness}getStrokePoint(t){var e;const n=Math.max(null!==(e=t.pressure)&&void 0!==e?e:1,.3);return{pos:t.canvasPos,width:nthis.getPressureMultiplier(),color:this.style.color,time:t.timeStamp}}previewStroke(){var t;this.editor.clearWetInk(),null===(t=this.builder)\|\|void 0===t\|\|t.preview(this.editor.display.getWetInkRenderer())}addPointToStroke(t){if(!this.builder)throw new Error("No stroke is currently being generated.");this.builder.addPoint(t),this.lastPoint=t,this.previewStroke()}onPointerDown({current:t,allPointers:e}){return t.device!==z.Eraser&&((1===e.length\|\|t.device===z.Pen)&&(this.builder=this.builderFactory(this.getStrokePoint(t),this.editor.viewport),!0))}onPointerMove({current:t}){this.addPointToStroke(this.getStrokePoint(t))}onPointerUp({current:t}){var e,n;if(!this.builder)return;const r=this.getStrokePoint(t),i=Object.assign(Object.assign({},r),{width:null!==(n=null===(e=this.lastPoint)\|\|void 0===e?void 0:e.width)&&void 0!==n?n:r.width});if(this.addPointToStroke(i),this.builder&&t.isPrimary){const t=this.builder.build();this.previewStroke();const e=!0,n=new L.AddElementCommand(t,e);this.editor.dispatch(n)}this.builder=null,this.editor.clearWetInk()}onGestureCancel(){this.editor.clearWetInk()}noteUpdated(){this.editor.notifier.dispatch(S.ToolUpdated,{kind:S.ToolUpdated,tool:this})}setColor(t){t.toHexString()!==this.style.color.toHexString()&&(this.style=Object.assign(Object.assign({},this.style),{color:t}),this.noteUpdated())}setThickness(t){t!==this.style.thickness&&(this.style=Object.assign(Object.assign({},this.style),{thickness:t}),this.noteUpdated())}setStrokeFactory(t){t!==this.builderFactory&&(this.builderFactory=t,this.noteUpdated())}getThickness(){return this.style.thickness}getColor(){return this.style.color}getStrokeFactory(){return this.builderFactory}}class kt{constructor(){}notifyEnabled(t){var e;t!==this.activeTool&&(null===(e=this.activeTool)\|\|void 0===e\|\|e.setEnabled(!1),this.activeTool=t)}}class Pt{constructor(t){this.toRemove=t.map((t=>t))}apply(t){for(const e of this.toRemove){const n=t.image.findParent(e);n&&n.remove()}t.queueRerender()}unapply(t){for(const e of this.toRemove)t.image.findParent(e)\|\|new L.AddElementCommand(e).apply(t);t.queueRerender()}description(t){if(0===this.toRemove.length)return t.erasedNoElements;let e=this.toRemove[0].description(t);for(const n of this.toRemove)if(n.description(t)!==e){e=t.elements;break}return t.eraseAction(e,this.toRemove.length)}}class Tt extends F{constructor(t,e){super(t.notifier,e),this.editor=t,this.command=null,this.kind=At.Eraser}onPointerDown(t){return(1===t.allPointers.length\|\|t.current.device===z.Eraser)&&(this.lastPoint=t.current.canvasPos,this.toRemove=[],!0)}onPointerMove(t){var e;const n=t.current.canvasPos;if(0===n.minus(this.lastPoint).magnitude())return;const r=new w(this.lastPoint,n),i=r.bbox;this.toRemove.push(...this.editor.image.getElementsIntersectingRegion(i).filter((t=>t.intersects(r)))),null===(e=this.command)\|\|void 0===e\|\|e.unapply(this.editor),this.command=new Pt(this.toRemove),this.command.apply(this.editor),this.lastPoint=n}onPointerUp(t){var e;this.command&&this.toRemove.length>0&&(null===(e=this.command)\|\|void 0===e\|\|e.unapply(this.editor),this.editor.dispatch(this.command)),this.command=null}onGestureCancel(){var t;null===(t=this.command)\|\|void 0===t\|\|t.unapply(this.editor),this.command=null}}var Ct=function(t,e,n,r){return new(n\|\|(n=Promise))((function(i,o){function s(t){try{l(r.next(t))}catch(t){o(t)}}function a(t){try{l(r.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,a)}l((r=r.apply(t,e\|\|[])).next())}))};const Et=30,St=(t,e,n)=>{t.style.touchAction="none";let r,i,o=!1;t.addEventListener("touchstart",(t=>t.preventDefault())),t.addEventListener("pointerdown",(e=>!!e.isPrimary&&(o=!0,t.setPointerCapture(e.pointerId),r=e.pageX,i=e.pageY,!0))),t.addEventListener("pointermove",(t=>{if(t.isPrimary&&o){const n=y.of(t.pageX-r,t.pageY-i);return e(n,y.of(t.offsetX,t.offsetY)),r=t.pageX,i=t.pageY,!0}return!1}));const s=t=>!!t.isPrimary&&(o=!1,n(),!0);t.addEventListener("pointerup",s),t.addEventListener("pointercancel",s)};class zt{constructor(t,e){this.startPoint=t,this.editor=e,this.boxRotation=this.editor.viewport.getRotationAngle(),this.selectedElems=[],this.region=k.bboxOf([t]),this.backgroundBox=document.createElement("div");const n=document.createElement("div"),r=document.createElement("div");this.rotateCircle=document.createElement("div");const i=document.createElement("div");this.backgroundBox.classList.add("selectionBox"),n.classList.add("draggableBackground"),r.classList.add("resizeCorner"),this.rotateCircle.classList.add("rotateCircle"),i.classList.add("rotateCircleContainer"),i.appendChild(this.rotateCircle),this.backgroundBox.appendChild(n),this.backgroundBox.appendChild(i),this.backgroundBox.appendChild(r),this.transformationCommands=[],this.transform=M.identity,St(n,(t=>{this.handleBackgroundDrag(t)}),(()=>this.finishDragging())),St(r,(t=>{this.handleResizeCornerDrag(t)}),(()=>this.finishDragging())),St(this.rotateCircle,((t,e)=>{this.handleRotateCircleDrag(e)}),(()=>this.finishDragging()))}handleBackgroundDrag(t){t=this.editor.viewport.screenToCanvasTransform.transformVec3(t),t=this.editor.viewport.roundPoint(t),this.region=this.region.translatedBy(t),this.transform=this.transform.rightMul(M.translation(t)),this.previewTransformCmds()}handleResizeCornerDrag(t){t=this.editor.viewport.screenToCanvasTransform.transformVec3(t),t=this.editor.viewport.roundPoint(t);const e=this.region.w,n=this.region.h,r=this.region.size.plus(t);if(r.y>0&&r.x>0){this.region=this.region.resizedTo(r);const t=y.of(this.region.w/e,this.region.h/n),i=M.scaling2D(t,this.region.topLeft);this.transform=this.transform.rightMul(i),this.previewTransformCmds()}}handleRotateCircleDrag(t){this.boxRotation=this.boxRotation%(2Math.PI),this.boxRotation<0&&(this.boxRotation+=2Math.PI);let e=t.angle();e%=2Math.PI,e<0&&(e+=2Math.PI);let n=e-this.boxRotation;const r=Math.PI/12;if(!(Math.abs(n)<r)&&isFinite(n)){{const t=Math.sign(n);n=Math.floor(Math.abs(n)/r)r,n=t}this.transform=this.transform.rightMul(M.zRotation(n,this.region.center)),this.boxRotation+=n,this.previewTransformCmds()}}computeTransformCommands(){return this.selectedElems.map((t=>t.transformBy(this.transform)))}finishDragging(){this.transformationCommands.forEach((t=>{t.unapply(this.editor)}));const t=this.transform,e=this.transform.inverse(),n=this.boxRotation,r=this.computeTransformCommands();this.transformationCommands=[],this.transform=M.identity,this.region=this.region.transformedBoundingBox(e),this.editor.dispatch({apply:e=>Ct(this,void 0,void 0,(function(){this.region=this.region.transformedBoundingBox(t),this.boxRotation+=n,this.updateUI(),yield e.asyncApplyCommands(r,50),this.recomputeRegion(),this.updateUI()})),unapply:t=>Ct(this,void 0,void 0,(function(){this.region=this.region.transformedBoundingBox(e),this.boxRotation-=n,this.updateUI(),yield t.asyncUnapplyCommands(r,50),this.recomputeRegion(),this.updateUI()})),description:t=>t.transformedElements(r.length)})}previewTransformCmds(){this.selectedElems.length>50\|\|(this.transformationCommands.forEach((t=>t.unapply(this.editor))),this.transformationCommands=this.computeTransformCommands(),this.transformationCommands.forEach((t=>t.apply(this.editor)))),this.updateUI()}appendBackgroundBoxTo(t){this.backgroundBox.parentElement&&this.backgroundBox.remove(),t.appendChild(this.backgroundBox)}setToPoint(t){this.region=this.region.grownToPoint(t),this.recomputeBoxRotation(),this.updateUI()}cancelSelection(){this.backgroundBox.parentElement&&this.backgroundBox.remove(),this.region=k.empty}resolveToObjects(){if(0===this.region.w\|\|0===this.region.h){const t=this.editor.viewport.visibleRect.maxDimension/100;this.region=k.bboxOf(this.region.corners,t)}return this.selectedElems=this.editor.image.getElementsIntersectingRegion(this.region).filter((t=>!!this.region.containsRect(t.getBBox())\|\|!!this.region.getEdges().some((e=>t.intersects(e))))),!!this.recomputeRegion()&&(this.updateUI(),!0)}recomputeRegion(){const t=this.selectedElems.reduce(((t,e)=>(null!=t?t:e.getBBox()).union(e.getBBox())),null);if(!t)return this.cancelSelection(),!1;this.region=t;const e=this.getMinCanvasSize();if(this.region.w<e\|\|this.region.h<e){const t=e/2;this.region=k.bboxOf(this.region.corners,t)}return this.recomputeBoxRotation(),!0}getMinCanvasSize(){return 2(Et/this.editor.viewport.getScaleFactor())}recomputeBoxRotation(){this.boxRotation=this.editor.viewport.getRotationAngle()}getSelectedItemCount(){return this.selectedElems.length}updateUI(){if(!this.backgroundBox)return;const t=this.region.topRight.minus(this.region.bottomRight),e=this.region.topLeft.minus(this.region.topRight),n=this.editor.viewport.canvasToScreenTransform,r=n.transformVec2(this.region.center),i=n.transformVec3(t).magnitude(),o=n.transformVec3(e).magnitude();this.backgroundBox.style.marginLeft=r.x-o/2+"px",this.backgroundBox.style.marginTop=r.y-i/2+"px",this.backgroundBox.style.width=`${o}px`,this.backgroundBox.style.height=`${i}px`;const s=180this.boxRotation/Math.PI;this.backgroundBox.style.transform=`rotate(${s}deg)`,this.rotateCircle.style.transform=`rotate(${-s}deg)`}}class Bt extends F{constructor(t,e){super(t.notifier,e),this.editor=t,this.kind=At.Selection,this.handleOverlay=document.createElement("div"),t.createHTMLOverlay(this.handleOverlay),t.addStyleSheet("\n\t.handleOverlay {\n\t}\n\n\t.handleOverlay > .selectionBox {\n\t\tposition: absolute;\n\t\tz-index: 0;\n\t\ttransform-origin: center;\n\t}\n\n\t.handleOverlay > .selectionBox .draggableBackground {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\n\t\tbackground-color: var(--secondary-background-color);\n\t\topacity: 0.8;\n\t\tborder: 1px solid var(--primary-background-color);\n\t}\n\n\t.handleOverlay .resizeCorner {\n\t\twidth: 30px;\n\t\theight: 30px;\n\t\tmargin-right: -15px;\n\t\tmargin-bottom: -15px;\n\n\t\tposition: absolute;\n\t\tbottom: 0;\n\t\tright: 0;\n\n\t\topacity: 0.8;\n\t\tbackground-color: var(--primary-background-color);\n\t\tborder: 1px solid var(--primary-foreground-color);\n\t}\n\n\t.handleOverlay > .selectionBox .rotateCircleContainer {\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\tbottom: 50%;\n\t\tleft: 50%;\n\t\tright: 50%;\n\t}\n\n\t.handleOverlay .rotateCircle {\n\t\twidth: 30px;\n\t\theight: 30px;\n\t\tmargin-left: -15px;\n\t\tmargin-top: -15px;\n\t\topacity: 0.8;\n\n\t\tborder: 1px solid var(--primary-foreground-color);\n\t\tbackground-color: var(--primary-background-color);\n\t\tborder-radius: 100%;\n\t}\n"),this.handleOverlay.style.display="none",this.handleOverlay.classList.add("handleOverlay"),t.notifier.on(S.ViewportChanged,(t=>{var e,n;null===(e=this.selectionBox)\|\|void 0===e\|\|e.recomputeRegion(),null===(n=this.selectionBox)\|\|void 0===n\|\|n.updateUI()}))}onPointerDown(t){return!(1!==t.allPointers.length\|\|!t.current.isPrimary)&&(this.prevSelectionBox=this.selectionBox,this.selectionBox=new zt(t.current.canvasPos,this.editor),this.handleOverlay.replaceChildren(),this.selectionBox.appendBackgroundBoxTo(this.handleOverlay),!0)}onPointerMove(t){this.selectionBox&&this.selectionBox.setToPoint(t.current.canvasPos)}onGestureEnd(){if(!this.selectionBox)return;const t=this.selectionBox.resolveToObjects();if(this.editor.notifier.dispatch(S.ToolUpdated,{kind:S.ToolUpdated,tool:this}),t){const t=this.editor.viewport.visibleRect,e=this.selectionBox.region;this.editor.announceForAccessibility(this.editor.localization.selectedElements(this.selectionBox.getSelectedItemCount()));const n=t.transformedBoundingBox(M.scaling2D(2/3,t.center));if(n.w<e.w\|\|n.h<e.h){const t=Math.max(e.w/n.w,e.h/n.h),r=M.scaling2D(t,n.topLeft).inverse();new $.ViewportTransform(r).apply(this.editor)}if(!n.containsRect(e)){const t=e.center.minus(n.center),r=M.translation(t).inverse();new $.ViewportTransform(r).apply(this.editor)}}}onPointerUp(t){this.selectionBox&&(this.selectionBox.setToPoint(t.current.canvasPos),this.onGestureEnd())}onGestureCancel(){var t,e;null===(t=this.selectionBox)\|\|void 0===t\|\|t.cancelSelection(),this.selectionBox=this.prevSelectionBox,null===(e=this.selectionBox)\|\|void 0===e\|\|e.appendBackgroundBoxTo(this.handleOverlay)}setEnabled(t){super.setEnabled(t),this.handleOverlay.replaceChildren(),this.selectionBox=null,this.handleOverlay.style.display=t?"block":"none"}getSelection(){return this.selectionBox}}class Rt{constructor(t,e,n,r){this.r=t,this.g=e,this.b=n,this.a=r,this.hexString=null}static ofRGB(t,e,n){return new Rt(t,e,n,1)}static ofRGBA(t,e,n,r){return new Rt(t,e,n,r)}static fromHex(t){var e;if(!(t=(t=(null!==(e=t.match(/^[#]?(.)$/))&&void 0!==e?e:[])[1]).toUpperCase()).match(/^[0-9A-F]+$/))throw new Error(`${t} is not in a valid format.`);if(3===t.length\|\|4===t.length){const e=t.split("");t=e.map((t=>`${t}0`)).join("")}6===t.length&&(t+="FF");const n=[];for(let e=2;e<=t.length;e+=2){const r=t.substring(e-2,e);n.push(parseInt(r,16)/255)}if(4!==n.length)throw new Error(`Unable to parse ${t}: Wrong number of components.`);return new Rt(n[0],n[1],n[2],n[3])}static fromString(t){if(t.startsWith("#"))return Rt.fromHex(t);{const e=document.createElement("canvas");e.width=1,e.height=1;const n=e.getContext("2d");n.fillStyle=t,n.fillRect(0,0,1,1);const r=n.getImageData(0,0,1,1),i=r.data[0]/255,o=r.data[1]/255,s=r.data[2]/255,a=r.data[3]/255;return Rt.ofRGBA(i,o,s,a)}}eq(t){return null!=t&&this.toHexString()===t.toHexString()}toHexString(){if(this.hexString)return this.hexString;const t=t=>{const e=Math.round(255t).toString(16);return 1===e.length?`0${e}`:e},e=t(this.a),n=t(this.r),r=t(this.g),i=t(this.b);return"ff"===e?`#${n}${r}${i}`:(this.hexString=`#${n}${r}${i}${e}`,this.hexString)}}Rt.transparent=Rt.ofRGBA(0,0,0,0),Rt.red=Rt.ofRGB(1,0,0),Rt.green=Rt.ofRGB(0,1,0),Rt.blue=Rt.ofRGB(0,0,1),Rt.purple=Rt.ofRGB(.5,.2,.5),Rt.yellow=Rt.ofRGB(1,1,.1),Rt.clay=Rt.ofRGB(.8,.4,.2),Rt.black=Rt.ofRGB(0,0,0),Rt.white=Rt.ofRGB(1,1,1);class Lt extends F{constructor(t){super(t.notifier,t.localization.undoRedoTool),this.editor=t,this.kind=At.UndoRedoShortcut}onKeyPress({key:t,ctrlKey:e}){if(e){if("z"===t)return this.editor.history.undo(),!0;if("Z"===t)return this.editor.history.redo(),!0}return!1}}var At;!function(t){t[t.TouchPanZoom=0]="TouchPanZoom",t[t.Pen=1]="Pen",t[t.Selection=2]="Selection",t[t.Eraser=3]="Eraser",t[t.PanZoom=4]="PanZoom",t[t.UndoRedoShortcut=5]="UndoRedoShortcut"}(At\|\|(At={}));class Mt{constructor(t,e){const n=new kt,r=new _(t,U.OneFingerGestures,e.touchPanTool),i=new wt(t,e.penTool(1),{color:Rt.purple,thickness:16}),o=[new Bt(t,e.selectionTool),new Tt(t,e.eraserTool),i,new wt(t,e.penTool(2),{color:Rt.clay,thickness:8}),new wt(t,e.penTool(3),{color:Rt.ofRGBA(1,1,0,.5),thickness:64})];this.tools=[r,...o,new _(t,U.TwoFingerGestures\|U.AnyDevice,e.twoFingerPanZoomTool),new Lt(t)],o.forEach((t=>t.setToolGroup(n))),r.setEnabled(!1),i.setEnabled(!0),t.notifier.on(S.ToolEnabled,(n=>{n.kind===S.ToolEnabled&&t.announceForAccessibility(e.toolEnabledAnnouncement(n.tool.description))})),t.notifier.on(S.ToolDisabled,(n=>{n.kind===S.ToolDisabled&&t.announceForAccessibility(e.toolDisabledAnnouncement(n.tool.description))})),this.activeTool=null}dispatchInputEvent(t){var e,n;let r=!1;if(t.kind===E.PointerDownEvt){for(const n of this.tools)if(n.isEnabled()&&n.onPointerDown(t)){this.activeTool!==n&&(null===(e=this.activeTool)\|\|void 0===e\|\|e.onGestureCancel()),this.activeTool=n,r=!0;break}}else if(t.kind===E.PointerUpEvt)null===(n=this.activeTool)\|\|void 0===n\|\|n.onPointerUp(t),this.activeTool=null,r=!0;else if(t.kind===E.WheelEvt\|\|t.kind===E.KeyPressEvent){const e=t.kind===E.KeyPressEvent,n=t.kind===E.WheelEvt;for(const i of this.tools){if(!i.isEnabled())continue;const o=n&&i.onWheel(t);if(r=e&&i.onKeyPress(t)\|\|o,r)break}}else if(null!==this.activeTool){let e;switch(t.kind){case E.PointerMoveEvt:this.activeTool.onPointerMove(t);break;case E.GestureCancelEvt:this.activeTool.onGestureCancel(),this.activeTool=null;break;default:return e=t,e}r=!0}else r=!1;return r}getMatchingTools(t){return this.tools.filter((e=>e.kind===t))}}const It=class{constructor(t,e,n){this.editor=t,this.announceRedoCallback=e,this.announceUndoCallback=n,this.undoStack=[],this.redoStack=[]}fireUpdateEvent(){this.editor.notifier.dispatch(S.UndoRedoStackUpdated,{kind:S.UndoRedoStackUpdated,undoStackSize:this.undoStack.length,redoStackSize:this.redoStack.length})}push(t,e=!0){e&&t.apply(this.editor),this.undoStack.push(t),this.redoStack=[],this.fireUpdateEvent()}undo(){const t=this.undoStack.pop();t&&(this.redoStack.push(t),t.unapply(this.editor),this.announceUndoCallback(t)),this.fireUpdateEvent()}redo(){const t=this.redoStack.pop();t&&(this.undoStack.push(t),t.apply(this.editor),this.announceRedoCallback(t)),this.fireUpdateEvent()}get undoStackSize(){return this.undoStack.length}get redoStackSize(){return this.redoStack.length}};class Dt{constructor(){this.listeners={}}dispatch(t,e){const n=this.listeners[t];if(n)for(let t=0;t<n.length;t++)n[t](e)}on(t,e){return this.listeners[t]\|\|(this.listeners[t]=[]),this.listeners[t].push(e),{remove:()=>{const n=this.listeners[t];return this.off(t,e),n.length!==this.listeners[t].length}}}off(t,e){const n=this.listeners[t];n&&(this.listeners[t]=n.filter((t=>t!==e)))}}var Ot=function(t,e,n){var r,i,o,s,a,l,c,h,d,u,p,f,m,g,v,b=e.createElement("canvas").getContext("2d"),x={r:0,g:0,b:0,h:0,s:0,v:0,a:1},y={el:"[data-coloris]",parent:"body",theme:"default",themeMode:"light",wrap:!0,margin:2,format:"hex",formatToggle:!1,swatches:[],swatchesOnly:!1,alpha:!0,forceAlpha:!1,focusInput:!0,selectInput:!1,inline:!1,defaultColor:"#000000",clearButton:!1,clearLabel:"Clear",a11y:{open:"Open color picker",close:"Close color picker",marker:"Saturation: {s}. Brightness: {v}.",hueSlider:"Hue slider",alphaSlider:"Opacity slider",input:"Color value field",format:"Color format",swatch:"Color swatch",instruction:"Saturation and brightness selector. Use up, down, left and right arrow keys to select."}},w={},k="",P={},T=!1;function C(n){if("object"==typeof n)for(var s in n)switch(s){case"el":B(n.el),!1!==n.wrap&&L(n.el);break;case"parent":(r=e.querySelector(n.parent))&&(r.appendChild(i),y.parent=n.parent,r===e.body&&(r=null));break;case"themeMode":y.themeMode=n.themeMode,"auto"===n.themeMode&&t.matchMedia&&t.matchMedia("(prefers-color-scheme: dark)").matches&&(y.themeMode="dark");case"theme":n.theme&&(y.theme=n.theme),i.className="clr-picker clr-"+y.theme+" clr-"+y.themeMode,y.inline&&R();break;case"margin":n.margin=1,y.margin=isNaN(n.margin)?y.margin:n.margin;break;case"wrap":n.el&&n.wrap&&L(n.el);break;case"formatToggle":y.formatToggle=!!n.formatToggle,G("clr-format").style.display=y.formatToggle?"block":"none",y.formatToggle&&(y.format="auto");break;case"swatches":Array.isArray(n.swatches)&&function(){var t=[];n.swatches.forEach((function(e,n){t.push('<button type="button" id="clr-swatch-'+n+'" aria-labelledby="clr-swatch-label clr-swatch-'+n+'" style="color: '+e+';">'+e+"</button>")})),G("clr-swatches").innerHTML=t.length?"<div>"+t.join("")+"</div>":"",y.swatches=n.swatches.slice()}();break;case"swatchesOnly":y.swatchesOnly=!!n.swatchesOnly,i.setAttribute("data-minimal",y.swatchesOnly);break;case"alpha":y.alpha=!!n.alpha,i.setAttribute("data-alpha",y.alpha);break;case"inline":if(y.inline=!!n.inline,i.setAttribute("data-inline",y.inline),y.inline){var a=n.defaultColor\|\|y.defaultColor;g=I(a),R(),M(a)}break;case"clearButton":"object"==typeof n.clearButton&&(n.clearButton.label&&(y.clearLabel=n.clearButton.label,h.innerHTML=y.clearLabel),n.clearButton=n.clearButton.show),y.clearButton=!!n.clearButton,h.style.display=y.clearButton?"block":"none";break;case"clearLabel":y.clearLabel=n.clearLabel,h.innerHTML=y.clearLabel;break;case"a11y":var u=n.a11y,f=!1;if("object"==typeof u)for(var m in u)u[m]&&y.a11y[m]&&(y.a11y[m]=u[m],f=!0);if(f){var v=G("clr-open-label"),b=G("clr-swatch-label");v.innerHTML=y.a11y.open,b.innerHTML=y.a11y.swatch,l.setAttribute("aria-label",y.a11y.close),d.setAttribute("aria-label",y.a11y.hueSlider),p.setAttribute("aria-label",y.a11y.alphaSlider),c.setAttribute("aria-label",y.a11y.input),o.setAttribute("aria-label",y.a11y.instruction)}default:y[s]=n[s]}}function E(t,e){"string"==typeof t&&"object"==typeof e&&(w[t]=e,T=!0)}function S(t){delete w[t],0===Object.keys(w).length&&(T=!1,t===k&&z())}function z(){Object.keys(P).length>0&&(C(P),k="",P={})}function B(t){W(e,"click",t,(function(t){y.inline\|\|(function(t){if(T){var e=["el","wrap","inline","defaultColor","a11y"],n=function(n){var r=w[n];if(t.matches(n)){for(var i in k=n,P={},e.forEach((function(t){return delete r[t]})),r)P[i]=Array.isArray(y[i])?y[i].slice():y[i];return C(r),"break"}};for(var r in w)if("break"===n(r))break}}(t.target),m=t.target,v=m.value,g=I(v),i.classList.add("clr-open"),R(),M(v),(y.focusInput\|\|y.selectInput)&&c.focus({preventScroll:!0}),y.selectInput&&c.select(),m.dispatchEvent(new Event("open",{bubbles:!0})))})),W(e,"input",t,(function(t){var e=t.target.parentNode;e.classList.contains("clr-field")&&(e.style.color=t.target.value)}))}function R(){var n,a,l,c=r,h=t.scrollY,d=i.offsetWidth,u=i.offsetHeight,p={left:!1,top:!1},f={x:0,y:0};if(c&&(n=t.getComputedStyle(c),a=parseFloat(n.marginTop),l=parseFloat(n.borderTopWidth),(f=c.getBoundingClientRect()).y+=l+h),!y.inline){var g=m.getBoundingClientRect(),v=g.x,b=h+g.y+g.height+y.margin;c?(v-=f.x,b-=f.y,v+d>c.clientWidth&&(v+=g.width-d,p.left=!0),b+u>c.clientHeight-a&&u+y.margin<=g.top-(f.y-h)&&(b-=g.height+u+2y.margin,p.top=!0),b+=c.scrollTop):(v+d>e.documentElement.clientWidth&&(v+=g.width-d,p.left=!0),b+u-h>e.documentElement.clientHeight&&u+y.margin<=g.top&&(b=h+g.y-u-y.margin,p.top=!0)),i.classList.toggle("clr-left",p.left),i.classList.toggle("clr-top",p.top),i.style.left=v+"px",i.style.top=b+"px"}s={width:o.offsetWidth,height:o.offsetHeight,x:i.offsetLeft+o.offsetLeft+f.x,y:i.offsetTop+o.offsetTop+f.y}}function L(t){e.querySelectorAll(t).forEach((function(t){var n=t.parentNode;if(!n.classList.contains("clr-field")){var r=e.createElement("div");r.innerHTML='<button type="button" aria-labelledby="clr-open-label"></button>',n.insertBefore(r,t),r.setAttribute("class","clr-field"),r.style.color=t.value,r.appendChild(t)}}))}function A(t){m&&!y.inline&&(t&&v!==m.value&&(m.value=v,m.dispatchEvent(new Event("input",{bubbles:!0}))),v!==m.value&&m.dispatchEvent(new Event("change",{bubbles:!0})),i.classList.remove("clr-open"),T&&z(),m.dispatchEvent(new Event("close",{bubbles:!0})),y.focusInput&&m.focus({preventScroll:!0}),m=null)}function M(t){var e=function(t){var e,n,r=/^((rgba)\|rgb)[\D]+([\d.]+)[\D]+([\d.]+)[\D]+([\d.]+)[\D]?([\d.]+\|$)/i;return b.fillStyle="#000",b.fillStyle=t,(e=r.exec(b.fillStyle))?(n={r:1e[3],g:1e[4],b:1e[5],a:1e[6]}).a=+n.a.toFixed(2):n={r:(e=b.fillStyle.replace("#","").match(/.{2}/g).map((function(t){return parseInt(t,16)})))[0],g:e[1],b:e[2],a:1},n}(t),r=function(t){var e=t.r/255,r=t.g/255,i=t.b/255,o=n.max(e,r,i),s=n.min(e,r,i),a=o-s,l=o,c=0,h=0;return a&&(o===e&&(c=(r-i)/a),o===r&&(c=2+(i-e)/a),o===i&&(c=4+(e-r)/a),o&&(h=a/o)),{h:(c=n.floor(60c))<0?c+360:c,s:n.round(100h),v:n.round(100l),a:t.a}}(e);j(r.s,r.v),$(e,r),d.value=r.h,i.style.color="hsl("+r.h+", 100%, 50%)",u.style.left=r.h/360100+"%",a.style.left=s.widthr.s/100+"px",a.style.top=s.height-s.heightr.v/100+"px",p.value=100r.a,f.style.left=100r.a+"%"}function I(t){var e=t.substring(0,3).toLowerCase();return"rgb"===e\|\|"hsl"===e?e:"hex"}function D(t){t=void 0!==t?t:c.value,m&&(m.value=t,m.dispatchEvent(new Event("input",{bubbles:!0}))),e.dispatchEvent(new CustomEvent("coloris:pick",{detail:{color:t}}))}function O(t,e){var r={h:1d.value,s:t/s.width100,v:100-e/s.height100,a:p.value/100},i=function(t){var e=t.s/100,r=t.v/100,i=er,o=t.h/60,s=i(1-n.abs(o%2-1)),a=r-i;i+=a,s+=a;var l=n.floor(o)%6,c=[i,s,a,a,s,i][l],h=[s,i,i,s,a,a][l],d=[a,a,s,i,i,s][l];return{r:n.round(255c),g:n.round(255h),b:n.round(255d),a:t.a}}(r);j(r.s,r.v),$(i,r),D()}function j(t,e){var n=y.a11y.marker;t=1t.toFixed(1),e=1e.toFixed(1),n=(n=n.replace("{s}",t)).replace("{v}",e),a.setAttribute("aria-label",n)}function N(t){var e=function(t){return{pageX:t.changedTouches?t.changedTouches[0].pageX:t.pageX,pageY:t.changedTouches?t.changedTouches[0].pageY:t.pageY}}(t),n=e.pageX-s.x,i=e.pageY-s.y;r&&(i+=r.scrollTop),n=n<0?0:n>s.width?s.width:n,i=i<0?0:i>s.height?s.height:i,a.style.left=n+"px",a.style.top=i+"px",O(n,i),t.preventDefault(),t.stopPropagation()}function V(t,e){var n=1a.style.left.replace("px","")+t,r=1a.style.top.replace("px","")+e;a.style.left=n+"px",a.style.top=r+"px",O(n,r)}function $(t,r){void 0===t&&(t={}),void 0===r&&(r={});var i=y.format;for(var s in t)x[s]=t[s];for(var h in r)x[h]=r[h];var d,u=function(t){var e=t.r.toString(16),n=t.g.toString(16),r=t.b.toString(16),i="";if(t.r<16&&(e="0"+e),t.g<16&&(n="0"+n),t.b<16&&(r="0"+r),y.alpha&&(t.a<1\|\|y.forceAlpha)){var o=255t.a\|0;i=o.toString(16),o<16&&(i="0"+i)}return"#"+e+n+r+i}(x),p=u.substring(0,7);switch(a.style.color=p,f.parentNode.style.color=p,f.style.color=u,l.style.color=u,o.style.display="none",o.offsetHeight,o.style.display="",f.nextElementSibling.style.display="none",f.nextElementSibling.offsetHeight,f.nextElementSibling.style.display="","mixed"===i?i=1===x.a?"hex":"rgb":"auto"===i&&(i=g),i){case"hex":c.value=u;break;case"rgb":c.value=function(t){return!y.alpha\|\|1===t.a&&!y.forceAlpha?"rgb("+t.r+", "+t.g+", "+t.b+")":"rgba("+t.r+", "+t.g+", "+t.b+", "+t.a+")"}(x);break;case"hsl":c.value=(d=function(t){var e,r=t.v/100,i=r(1-t.s/100/2);return i>0&&i<1&&(e=n.round((r-i)/n.min(i,1-i)100)),{h:t.h,s:e\|\|0,l:n.round(100i),a:t.a}}(x),!y.alpha\|\|1===d.a&&!y.forceAlpha?"hsl("+d.h+", "+d.s+"%, "+d.l+"%)":"hsla("+d.h+", "+d.s+"%, "+d.l+"%, "+d.a+")")}e.querySelector('.clr-format [value="'+i+'"]').checked=!0}function F(){var t=1d.value,e=1a.style.left.replace("px",""),n=1a.style.top.replace("px","");i.style.color="hsl("+t+", 100%, 50%)",u.style.left=t/360100+"%",O(e,n)}function U(){var t=p.value/100;f.style.left=100t+"%",$({a:t}),D()}function _(){r=null,(i=e.createElement("div")).setAttribute("id","clr-picker"),i.className="clr-picker",i.innerHTML='<input id="clr-color-value" class="clr-color" type="text" value="" spellcheck="false" aria-label="'+y.a11y.input+'"><div id="clr-color-area" class="clr-gradient" role="application" aria-label="'+y.a11y.instruction+'"><div id="clr-color-marker" class="clr-marker" tabindex="0"></div></div><div class="clr-hue"><input id="clr-hue-slider" type="range" min="0" max="360" step="1" aria-label="'+y.a11y.hueSlider+'"><div id="clr-hue-marker"></div></div><div class="clr-alpha"><input id="clr-alpha-slider" type="range" min="0" max="100" step="1" aria-label="'+y.a11y.alphaSlider+'"><div id="clr-alpha-marker"></div><span></span></div><div id="clr-format" class="clr-format"><fieldset class="clr-segmented"><legend>'+y.a11y.format+'</legend><input id="clr-f1" type="radio" name="clr-format" value="hex"><label for="clr-f1">Hex</label><input id="clr-f2" type="radio" name="clr-format" value="rgb"><label for="clr-f2">RGB</label><input id="clr-f3" type="radio" name="clr-format" value="hsl"><label for="clr-f3">HSL</label><span></span></fieldset></div><div id="clr-swatches" class="clr-swatches"></div><button type="button" id="clr-clear" class="clr-clear">'+y.clearLabel+'</button><button type="button" id="clr-color-preview" class="clr-preview" aria-label="'+y.a11y.close+'"></button><span id="clr-open-label" hidden>'+y.a11y.open+'</span><span id="clr-swatch-label" hidden>'+y.a11y.swatch+"</span>",e.body.appendChild(i),o=G("clr-color-area"),a=G("clr-color-marker"),h=G("clr-clear"),l=G("clr-color-preview"),c=G("clr-color-value"),d=G("clr-hue-slider"),u=G("clr-hue-marker"),p=G("clr-alpha-slider"),f=G("clr-alpha-marker"),B(y.el),L(y.el),W(i,"mousedown",(function(t){i.classList.remove("clr-keyboard-nav"),t.stopPropagation()})),W(o,"mousedown",(function(t){W(e,"mousemove",N)})),W(o,"touchstart",(function(t){e.addEventListener("touchmove",N,{passive:!1})})),W(a,"mousedown",(function(t){W(e,"mousemove",N)})),W(a,"touchstart",(function(t){e.addEventListener("touchmove",N,{passive:!1})})),W(c,"change",(function(t){M(c.value),D()})),W(h,"click",(function(t){D(""),A()})),W(l,"click",(function(t){D(),A()})),W(e,"click",".clr-format input",(function(t){g=t.target.value,$(),D()})),W(i,"click",".clr-swatches button",(function(t){M(t.target.textContent),D(),y.swatchesOnly&&A()})),W(e,"mouseup",(function(t){e.removeEventListener("mousemove",N)})),W(e,"touchend",(function(t){e.removeEventListener("touchmove",N)})),W(e,"mousedown",(function(t){i.classList.remove("clr-keyboard-nav"),A()})),W(e,"keydown",(function(t){"Escape"===t.key?A(!0):"Tab"===t.key&&i.classList.add("clr-keyboard-nav")})),W(e,"click",".clr-field button",(function(t){T&&z(),t.target.nextElementSibling.dispatchEvent(new Event("click",{bubbles:!0}))})),W(a,"keydown",(function(t){var e={ArrowUp:[0,-1],ArrowDown:[0,1],ArrowLeft:[-1,0],ArrowRight:[1,0]};-1!==Object.keys(e).indexOf(t.key)&&(V.apply(void 0,e[t.key]),t.preventDefault())})),W(o,"click",N),W(d,"input",F),W(p,"input",U)}function G(t){return e.getElementById(t)}function W(t,e,n,r){var i=Element.prototype.matches\|\|Element.prototype.msMatchesSelector;"string"==typeof n?t.addEventListener(e,(function(t){i.call(t.target,n)&&r.call(t.target,t)})):(r=n,t.addEventListener(e,r))}function H(t,n){n=void 0!==n?n:[],"loading"!==e.readyState?t.apply(void 0,n):e.addEventListener("DOMContentLoaded",(function(){t.apply(void 0,n)}))}void 0!==NodeList&&NodeList.prototype&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach);var Z=function(){var t={init:_,set:C,wrap:L,close:A,setInstance:E,removeInstance:S,updatePosition:R};function e(t){H((function(){t&&("string"==typeof t?B(t):C(t))}))}var n=function(n){e[n]=function(){for(var e=arguments.length,r=new Array(e),i=0;i<e;i++)r[i]=arguments[i];H(t[n],r)}};for(var r in t)n(r);return e}();return Z.coloris=Z,Z}(window,document,Math),jt=Ot.coloris,Nt=Ot.init;Ot.set,Ot.wrap,Ot.close;const Vt=(t,e)=>{var n,r,i,o,s;return t===e\|\|t.fill.eq(e.fill)&&(null===(r=null===(n=t.stroke)\|\|void 0===n?void 0:n.color)\|\|void 0===r?void 0:r.eq(null===(i=e.stroke)\|\|void 0===i?void 0:i.color))&&(null===(o=t.stroke)\|\|void 0===o?void 0:o.width)===(null===(s=e.stroke)\|\|void 0===s?void 0:s.width)};class $t{constructor(t){this.viewport=t,this.objectLevel=0,this.currentPaths=null}flushPath(){if(!this.currentPaths)return;let t=null;for(const e of this.currentPaths){const{startPoint:n,commands:r,style:i}=e;t&&Vt(t,i)?this.moveTo(n):(t&&this.endPath(t),this.beginPath(n),t=i);for(const t of r)t.kind===mt.LineTo?this.lineTo(t.point):t.kind===mt.MoveTo?this.moveTo(t.point):t.kind===mt.CubicBezierTo?this.traceCubicBezierCurve(t.controlPoint1,t.controlPoint2,t.endPoint):t.kind===mt.QuadraticBezierTo&&this.traceQuadraticBezierCurve(t.controlPoint,t.endPoint)}t&&this.endPath(t)}drawPath(t){0===this.objectLevel?(this.currentPaths=[t],this.flushPath(),this.currentPaths=null):this.currentPaths.push(t)}drawRect(t,e,n){const r=gt.fromRect(t,e);this.drawPath(r.toRenderable(n))}startObject(t){this.currentPaths=[],this.objectLevel++}endObject(){if(this.flushPath(),this.currentPaths=null,this.objectLevel--,this.objectLevel<0)throw new Error("More objects have ended than have been started (negative object nesting level)!")}getNestingLevel(){return this.objectLevel}}const Ft="http://www.w3.org/2000/svg";class Ut extends $t{constructor(t,e){super(e),this.elem=t,this.overwrittenAttrs={},this.clear()}setRootSVGAttribute(t,e){t in this.overwrittenAttrs\|\|(this.overwrittenAttrs[t]=this.elem.getAttribute(t)),null!==e?this.elem.setAttribute(t,e):this.elem.removeAttribute(t)}displaySize(){return y.of(this.elem.clientWidth,this.elem.clientHeight)}clear(){this.mainGroup=document.createElementNS(Ft,"g");for(const t in this.overwrittenAttrs){const e=this.overwrittenAttrs[t];e?this.elem.setAttribute(t,e):this.elem.removeAttribute(t)}this.overwrittenAttrs={},this.elem.replaceChildren(this.mainGroup)}beginPath(t){var e;this.currentPath=[],this.pathStart=this.viewport.canvasToScreen(t),null!==(e=this.lastPathStart)&&void 0!==e\|\|(this.lastPathStart=this.pathStart)}endPath(t){var e;if(null==this.currentPath)throw new Error("No path exists to end! Make sure beginPath was called!");t.fill.eq(null===(e=this.lastPathStyle)\|\|void 0===e?void 0:e.fill)&&null!=this.lastPath?(this.lastPath.push({kind:mt.MoveTo,point:this.pathStart},...this.currentPath),this.pathStart=null,this.currentPath=null):(this.addPathToSVG(),this.lastPathStart=this.pathStart,this.lastPathStyle=t,this.lastPath=this.currentPath,this.pathStart=null,this.currentPath=null)}addPathToSVG(){if(!this.lastPathStyle\|\|!this.lastPath)return;const t=document.createElementNS(Ft,"path");t.setAttribute("d",gt.toString(this.lastPathStart,this.lastPath));const e=this.lastPathStyle;t.setAttribute("fill",e.fill.toHexString()),e.stroke&&(t.setAttribute("stroke",e.stroke.color.toHexString()),t.setAttribute("stroke-width",e.stroke.width.toString())),this.mainGroup.appendChild(t)}startObject(t){super.startObject(t),this.lastPath=null,this.lastPathStart=null,this.lastPathStyle=null}endObject(){super.endObject(),this.addPathToSVG()}lineTo(t){t=this.viewport.canvasToScreen(t),this.currentPath.push({kind:mt.LineTo,point:t})}moveTo(t){t=this.viewport.canvasToScreen(t),this.currentPath.push({kind:mt.MoveTo,point:t})}traceCubicBezierCurve(t,e,n){t=this.viewport.canvasToScreen(t),e=this.viewport.canvasToScreen(e),n=this.viewport.canvasToScreen(n),this.currentPath.push({kind:mt.CubicBezierTo,controlPoint1:t,controlPoint2:e,endPoint:n})}traceQuadraticBezierCurve(t,e){t=this.viewport.canvasToScreen(t),e=this.viewport.canvasToScreen(e),this.currentPath.push({kind:mt.QuadraticBezierTo,controlPoint:t,endPoint:e})}drawPoints(...t){t.map((t=>{const e=document.createElementNS(Ft,"circle");e.setAttribute("cx",`${t.x}`),e.setAttribute("cy",`${t.y}`),e.setAttribute("r","15"),this.mainGroup.appendChild(e)}))}drawSVGElem(t){this.elem.appendChild(t.cloneNode(!0))}}const _t=(t,e)=>new Gt(t);class Gt{constructor(t){this.startPoint=t,this.endPoint=t}getLineWidth(){return Math.max(this.endPoint.width,this.startPoint.width)}getBBox(){return this.buildPreview().getBBox()}buildPreview(){const t=this.startPoint.pos,e=this.endPoint.pos,n=e.minus(t).normalized(),r=e.minus(t).length(),i=Math.min(this.getLineWidth(),r/2),o=this.startPoint.width/2,s=this.endPoint.width/2,a=e.minus(n.times(i)),l=n.orthog(),c=l.times(o),h=l.times(s);return new bt([{startPoint:a.minus(h),commands:[{kind:mt.LineTo,point:t.minus(c)},{kind:mt.LineTo,point:t.plus(c)},{kind:mt.LineTo,point:a.plus(h)},{kind:mt.LineTo,point:a.plus(l.times(i).plus(h))},{kind:mt.LineTo,point:e.plus(n.times(s))},{kind:mt.LineTo,point:a.plus(l.times(-i).minus(h))},{kind:mt.LineTo,point:a.minus(h)}],style:{fill:this.startPoint.color}}])}build(){return this.buildPreview()}preview(t){this.buildPreview().render(t)}addPoint(t){this.endPoint=t}}const Wt=(t,e)=>new Ht(t);class Ht{constructor(t){this.startPoint=t,this.endPoint=t}getBBox(){return this.buildPreview().getBBox()}buildPreview(){const t=this.startPoint.pos,e=this.endPoint.pos,n=e.minus(t).normalized(),r=this.startPoint.width/2,i=this.endPoint.width/2,o=n.orthog(),s=o.times(r),a=o.times(i);return new bt([{startPoint:t.minus(s),commands:[{kind:mt.LineTo,point:t.plus(s)},{kind:mt.LineTo,point:e.plus(a)},{kind:mt.LineTo,point:e.minus(a)}],style:{fill:this.startPoint.color}}])}build(){return this.buildPreview()}preview(t){this.buildPreview().render(t)}addPoint(t){this.endPoint=t}}const Zt=(t,e)=>new Xt(t,!0),qt=(t,e)=>new Xt(t,!1);class Xt{constructor(t,e){this.startPoint=t,this.filled=e,this.endPoint=t}getBBox(){return this.buildPreview().getBBox()}buildPreview(){const t=this.startPoint.pos,e=this.endPoint.pos,n=gt.fromRect(k.fromCorners(t,e),this.filled?null:this.endPoint.width);return new bt([n.toRenderable({fill:this.endPoint.color})])}build(){return this.buildPreview()}preview(t){this.buildPreview().render(t)}addPoint(t){this.endPoint=t}}const Qt={pen:"Pen",eraser:"Eraser",select:"Select",touchDrawing:"Touch Drawing",thicknessLabel:"Thickness: ",colorLabel:"Color: ",resizeImageToSelection:"Resize image to selection",undo:"Undo",redo:"Redo",selectObjectType:"Object type: ",freehandPen:"Freehand",arrowPen:"Arrow",linePen:"Line",outlinedRectanglePen:"Outlined rectangle",filledRectanglePen:"Filled rectangle",dropdownShown:t=>`Dropdown for ${t} shown`,dropdownHidden:t=>`Dropdown for ${t} hidden`},Yt="\n\tstyle='fill: var(--primary-foreground-color);'\n",Kt="\n\tstyle='fill: var(--primary-foreground-color); stroke: var(--primary-foreground-color);'\n",Jt="http://www.w3.org/2000/svg";class te{constructor(t,e,n){this.editor=t,this.targetTool=e,this.localizationTable=n,this.icon=null,this.container=document.createElement("div"),this.container.classList.add("toolbar-toolContainer"),this.dropdownContainer=document.createElement("div"),this.dropdownContainer.classList.add("toolbar-dropdown"),this.dropdownContainer.classList.add("hidden"),this.hasDropdown=!1,this.button=document.createElement("div"),this.button.classList.add("toolbar-button"),this.label=document.createElement("label"),this.button.setAttribute("role","button"),this.button.tabIndex=0,this.button.onclick=()=>{this.handleClick()},t.notifier.on(S.ToolEnabled,(t=>{if(t.kind!==S.ToolEnabled)throw new Error("Incorrect event type! (Expected ToolEnabled)");t.tool===e&&this.updateSelected(!0)})),t.notifier.on(S.ToolDisabled,(t=>{if(t.kind!==S.ToolDisabled)throw new Error("Incorrect event type! (Expected ToolDisabled)");t.tool===e&&(this.updateSelected(!1),this.setDropdownVisible(!1))}))}handleClick(){this.hasDropdown?this.targetTool.isEnabled()?this.setDropdownVisible(!this.isDropdownVisible()):this.targetTool.setEnabled(!0):this.targetTool.setEnabled(!this.targetTool.isEnabled())}addTo(t){this.label.innerText=this.getTitle(),this.icon=null,this.updateIcon(),this.updateSelected(this.targetTool.isEnabled()),this.button.replaceChildren(this.icon,this.label),this.container.appendChild(this.button),this.hasDropdown=this.fillDropdown(this.dropdownContainer),this.hasDropdown&&(this.dropdownIcon=this.createDropdownIcon(),this.button.appendChild(this.dropdownIcon),this.container.appendChild(this.dropdownContainer)),this.setDropdownVisible(!1),t.appendChild(this.container)}updateIcon(){var t;const e=this.createIcon();null===(t=this.icon)\|\|void 0===t\|\|t.replaceWith(e),this.icon=e,this.icon.classList.add("toolbar-icon")}updateSelected(t){this.container.classList.contains("selected")!==t&&(t?(this.container.classList.add("selected"),this.button.ariaSelected="true"):(this.container.classList.remove("selected"),this.button.ariaSelected="false"))}setDropdownVisible(t){this.container.classList.contains("dropdownVisible")!==t&&(t?(this.dropdownContainer.classList.remove("hidden"),this.container.classList.add("dropdownVisible"),this.editor.announceForAccessibility(this.localizationTable.dropdownShown(this.targetTool.description))):(this.dropdownContainer.classList.add("hidden"),this.container.classList.remove("dropdownVisible"),this.editor.announceForAccessibility(this.localizationTable.dropdownHidden(this.targetTool.description))))}isDropdownVisible(){return!this.dropdownContainer.classList.contains("hidden")}createDropdownIcon(){const t=document.createElementNS(Jt,"svg");return t.innerHTML=`\n\t\t<g>\n\t\t\t<path\n\t\t\t\td='M5,10 L50,90 L95,10 Z'\n\t\t\t\t${Yt}\n\t\t\t/>\n\t\t</g>\n\t\t`,t.classList.add("toolbar-showHideDropdownIcon"),t.setAttribute("viewBox","0 0 100 100"),t}}class ee extends te{getTitle(){return this.localizationTable.eraser}createIcon(){const t=document.createElementNS(Jt,"svg");return t.innerHTML=`\n\t\t<g>\n\t\t\t<rect x=10 y=50 width=80 height=30 rx=10 fill='pink' />\n\t\t\t<rect\n\t\t\t\tx=10 y=10 width=80 height=50\n\t\t\t\t${Yt}\n\t\t\t/>\n\t\t</g>\n\t\t`,t.setAttribute("viewBox","0 0 100 100"),t}fillDropdown(t){return!1}}class ne extends te{constructor(t,e,n){super(t,e,n),this.tool=e}getTitle(){return this.localizationTable.select}createIcon(){const t=document.createElementNS(Jt,"svg");return t.innerHTML="\n\t\t<g>\n\t\t\t<rect x=10 y=10 width=70 height=70 fill='pink' stroke='black'/>\n\t\t\t<rect x=75 y=75 width=10 height=10 fill='white' stroke='black'/>\n\t\t</g>\n\t\t",t.setAttribute("viewBox","0 0 100 100"),t}fillDropdown(t){const e=document.createElement("div"),n=document.createElement("button");return n.innerText=this.localizationTable.resizeImageToSelection,n.disabled=!0,n.onclick=()=>{const t=this.tool.getSelection();this.editor.dispatch(this.editor.setImportExportRect(t.region))},this.editor.notifier.on(S.ToolUpdated,(t=>{if(t.kind!==S.ToolUpdated)throw new Error("Invalid event type!");if(t.tool===this.tool){const t=this.tool.getSelection(),e=t&&t.region.area>0;n.disabled=!e}})),e.replaceChildren(n),t.appendChild(e),!0}}class re extends te{getTitle(){return this.localizationTable.touchDrawing}createIcon(){const t=document.createElementNS(Jt,"svg");return t.innerHTML=`\n\t\t<g>\n\t\t\t<path d='M11,-30 Q0,10 20,20 Q40,20 40,-30 Z' fill='blue' stroke='black'/>\n\t\t\t<path d='\n\t\t\t\tM0,90 L0,50 Q5,40 10,50\n\t\t\t\tL10,20 Q20,15 30,20\n\t\t\t\tL30,50 Q50,40 80,50\n\t\t\t\tL80,90 L10,90 Z'\n\t\t\t\t\n\t\t\t\t${Kt}\n\t\t\t/>\n\t\t</g>\n\t\t`,t.setAttribute("viewBox","-10 -30 100 100"),t}fillDropdown(t){return!1}updateSelected(t){t?this.container.classList.remove("selected"):this.container.classList.add("selected")}}class ie extends te{constructor(t,e,n,r){super(t,e,n),this.tool=e,this.penTypes=r,this.updateInputs=()=>{},this.editor.notifier.on(S.ToolUpdated,(t=>{if(t.kind!==S.ToolUpdated)throw new Error("Invalid event type!");t.tool===this.tool&&(this.updateIcon(),this.updateInputs())}))}getTitle(){return this.targetTool.description}makePenIcon(t){const e=Math.round(2Math.sqrt(this.tool.getThickness())),n=this.tool.getColor(),r=`M14,63 L${50-e},95 L${50+e},90 L88,60 Z`,i=`M14,63 L${50-e},85 L${50+e},83 L88,60 Z`;t.innerHTML=`\n\t\t<defs>\n\t\t\t<pattern\n\t\t\t\tid='checkerboard'\n\t\t\t\tviewBox='0,0,10,10'\n\t\t\t\twidth='20%'\n\t\t\t\theight='20%'\n\t\t\t\tpatternUnits='userSpaceOnUse'\n\t\t\t>\n\t\t\t\t<rect x=0 y=0 width=10 height=10 fill='white'/>\n\t\t\t\t<rect x=0 y=0 width=5 height=5 fill='gray'/>\n\t\t\t\t<rect x=5 y=5 width=5 height=5 fill='gray'/>\n\t\t\t</pattern>\n\t\t</defs>\n\t\t<g>\n\t\t\t\x3c!-- Pen grip --\x3e\n\t\t\t<path\n\t\t\t\td='M10,10 L90,10 L90,60 L${50+e},80 L${50-e},80 L10,60 Z'\n\t\t\t\t${Kt}\n\t\t\t/>\n\t\t</g>\n\t\t<g>\n\t\t\t\x3c!-- Checkerboard background for slightly transparent pens --\x3e\n\t\t\t<path d='${i}' fill='url(#checkerboard)'/>\n\n\t\t\t\x3c!-- Actual pen tip --\x3e\n\t\t\t<path\n\t\t\t\td='${r}'\n\t\t\t\tfill='${n.toHexString()}'\n\t\t\t\tstroke='${n.toHexString()}'\n\t\t\t/>\n\t\t</g>\n\t\t`}makeDrawnIcon(t){const e=this.tool.getStrokeFactory(),n=this.tool.getThickness(),r=(new Date).getTime(),i={pos:y.of(10,10),width:n/5,color:this.tool.getColor(),time:r-100},o={pos:y.of(90,90),width:n/5,color:this.tool.getColor(),time:r},s=e(i,this.editor.viewport);s.addPoint(o);const a=new $(new Dt);a.updateScreenSize(y.of(100,100));const l=new Ut(t,a);s.preview(l)}createIcon(){const t=document.createElementNS(Jt,"svg");t.setAttribute("viewBox","0 0 100 100");return this.tool.getStrokeFactory()===xt?this.makePenIcon(t):this.makeDrawnIcon(t),t}fillDropdown(t){const e=document.createElement("div"),n=document.createElement("div"),r=document.createElement("div"),i=document.createElement("label"),o=document.createElement("input"),s=document.createElement("label"),a=document.createElement("select");o.id="toolbar-thicknessInput"+ie.idCounter++,a.id="toolbar-builderSelect"+ie.idCounter++,i.innerText=this.localizationTable.thicknessLabel,i.setAttribute("for",o.id),s.innerText=this.localizationTable.selectObjectType,s.setAttribute("for",a.id),o.type="range",o.min="1",o.max="20",o.step="1",o.oninput=()=>{this.tool.setThickness(Math.pow(parseFloat(o.value),2))},n.appendChild(i),n.appendChild(o),a.oninput=()=>{const t=parseInt(a.value);t<0\|\|t>=this.penTypes.length?console.error("Invalid pen type index",t):this.tool.setStrokeFactory(this.penTypes[t].factory)},r.appendChild(s),r.appendChild(a);const l=document.createElement("div"),c=document.createElement("label"),h=document.createElement("input");return h.id="toolbar-colorInput"+ie.idCounter++,c.innerText=this.localizationTable.colorLabel,c.setAttribute("for",h.id),h.className="coloris_input",h.type="button",h.oninput=()=>{this.tool.setColor(Rt.fromHex(h.value))},h.addEventListener("open",(()=>{this.editor.notifier.dispatch(S.ColorPickerToggled,{kind:S.ColorPickerToggled,open:!0})})),h.addEventListener("close",(()=>{this.editor.notifier.dispatch(S.ColorPickerToggled,{kind:S.ColorPickerToggled,open:!1})})),l.appendChild(c),l.appendChild(h),this.updateInputs=()=>{h.value=this.tool.getColor().toHexString(),o.value=Math.sqrt(this.tool.getThickness()).toString(),a.replaceChildren();for(let t=0;t<this.penTypes.length;t++){const e=this.penTypes[t],n=document.createElement("option");n.value=t.toString(),n.innerText=e.name,a.appendChild(n),e.factory===this.tool.getStrokeFactory()&&(a.value=t.toString())}},this.updateInputs(),e.replaceChildren(l,n,r),t.replaceChildren(e),!0}}ie.idCounter=0;class oe{constructor(t,e,n=Qt){this.editor=t,this.localizationTable=n,this.container=document.createElement("div"),this.container.classList.add("toolbar-root"),this.container.setAttribute("role","toolbar"),e.appendChild(this.container),Nt(),this.setupColorPickers(),this.penTypes=[{name:n.freehandPen,factory:xt},{name:n.arrowPen,factory:_t},{name:n.linePen,factory:Wt},{name:n.filledRectanglePen,factory:Zt},{name:n.outlinedRectanglePen,factory:qt}]}setupColorPickers(){const t=document.createElement("div");t.className="toolbar-closeColorPickerOverlay",this.editor.createHTMLOverlay(t),jt({el:".coloris_input",format:"hex",selectInput:!1,focusInput:!1,themeMode:"auto",swatches:[Rt.red.toHexString(),Rt.purple.toHexString(),Rt.blue.toHexString(),Rt.clay.toHexString(),Rt.black.toHexString(),Rt.white.toHexString()]}),this.editor.notifier.on(S.ColorPickerToggled,(e=>{e.kind===S.ColorPickerToggled&&(t.style.display=e.open?"block":"none")}))}addActionButton(t,e,n){const r=document.createElement("button");return r.innerText=t,r.classList.add("toolbar-toolButton"),r.onclick=e,(null!=n?n:this.container).appendChild(r),r}addUndoRedoButtons(){const t=document.createElement("div");t.classList.add("toolbar-buttonGroup");const e=this.addActionButton("Undo",(()=>{this.editor.history.undo()}),t),n=this.addActionButton("Redo",(()=>{this.editor.history.redo()}),t);this.container.appendChild(t),e.disabled=!0,n.disabled=!0,this.editor.notifier.on(S.UndoRedoStackUpdated,(t=>{if(t.kind!==S.UndoRedoStackUpdated)throw new Error("Wrong event type!");e.disabled=0===t.undoStackSize,n.disabled=0===t.redoStackSize}))}addDefaultToolWidgets(){const t=this.editor.toolController;for(const e of t.getMatchingTools(At.Pen)){if(!(e instanceof wt))throw new Error("All `Pen` tools must have kind === ToolType.Pen");new ie(this.editor,e,this.localizationTable,this.penTypes).addTo(this.container)}for(const e of t.getMatchingTools(At.Eraser)){if(!(e instanceof Tt))throw new Error("All Erasers must have kind === ToolType.Eraser!");new ee(this.editor,e,this.localizationTable).addTo(this.container)}for(const e of t.getMatchingTools(At.Selection)){if(!(e instanceof Bt))throw new Error("All SelectionTools must have kind === ToolType.Selection");new ne(this.editor,e,this.localizationTable).addTo(this.container)}for(const e of t.getMatchingTools(At.TouchPanZoom))new re(this.editor,e,this.localizationTable).addTo(this.container);this.setupColorPickers()}addDefaultActionButtons(){this.addUndoRedoButtons()}}class se extends $t{constructor(t,e){super(e),this.ctx=t,this.ignoreObjectsAboveLevel=null,this.ignoringObject=!1}displaySize(){return y.of(this.ctx.canvas.clientWidth,this.ctx.canvas.clientHeight)}clear(){this.ctx.clearRect(0,0,this.ctx.canvas.width,this.ctx.canvas.height)}beginPath(t){t=this.viewport.canvasToScreen(t),this.ctx.beginPath(),this.ctx.moveTo(t.x,t.y)}endPath(t){this.ctx.fillStyle=t.fill.toHexString(),this.ctx.fill(),t.stroke&&(this.ctx.strokeStyle=t.stroke.color.toHexString(),this.ctx.lineWidth=this.viewport.getScaleFactor()t.stroke.width,this.ctx.stroke()),this.ctx.closePath()}lineTo(t){t=this.viewport.canvasToScreen(t),this.ctx.lineTo(t.x,t.y)}moveTo(t){t=this.viewport.canvasToScreen(t),this.ctx.moveTo(t.x,t.y)}traceCubicBezierCurve(t,e,n){t=this.viewport.canvasToScreen(t),e=this.viewport.canvasToScreen(e),n=this.viewport.canvasToScreen(n);const r=e.minus(t),i=n.minus(e);r.magnitudeSquared()<25&&i.magnitudeSquared()<25?this.ctx.lineTo(n.x,n.y):this.ctx.bezierCurveTo(t.x,t.y,e.x,e.y,n.x,n.y)}traceQuadraticBezierCurve(t,e){t=this.viewport.canvasToScreen(t),e=this.viewport.canvasToScreen(e);t.minus(e).magnitudeSquared()<25?this.ctx.lineTo(e.x,e.y):this.ctx.quadraticCurveTo(t.x,t.y,e.x,e.y)}drawPath(t){this.ignoringObject\|\|super.drawPath(t)}startObject(t){const e=this.viewport.canvasToScreenTransform.transformVec3(t.size);Math.abs(e.x)<4&&Math.abs(e.y)<4&&(this.ignoreObjectsAboveLevel=this.getNestingLevel(),this.ignoringObject=!0),super.startObject(t)}endObject(){super.endObject(),null!==this.ignoreObjectsAboveLevel&&this.getNestingLevel()<=this.ignoreObjectsAboveLevel&&(this.ignoreObjectsAboveLevel=null,this.ignoringObject=!1)}drawPoints(...t){for(let e=0;e<t.length;e++){const n=this.viewport.canvasToScreen(t[e]);this.ctx.beginPath(),this.ctx.arc(n.x,n.y,10,0,2Math.PI),this.ctx.fillStyle=Rt.ofRGBA(.5+Math.sin(e)/2,1,.5+Math.cos(.2e)/4,.5).toHexString(),this.ctx.fill(),this.ctx.stroke(),this.ctx.closePath(),this.ctx.textAlign="center",this.ctx.textBaseline="middle",this.ctx.fillStyle="black",this.ctx.fillText(`${e}`,n.x,n.y,20)}}}class ae extends $t{constructor(t){super(t),this.clearedCount=0,this.renderedPathCount=0,this.lastFillStyle=null,this.lastPoint=null,this.objectNestingLevel=0,this.pointBuffer=[]}displaySize(){return y.of(640,480)}clear(){if(this.clearedCount++,this.renderedPathCount=0,this.pointBuffer=[],this.objectNestingLevel>0)throw new Error(`Within an object while clearing! Nesting level: ${this.objectNestingLevel}`)}beginPath(t){this.lastPoint=t,this.pointBuffer.push(t)}endPath(t){this.renderedPathCount++,this.lastFillStyle=t}lineTo(t){this.lastPoint=t,this.pointBuffer.push(t)}moveTo(t){this.lastPoint=t,this.pointBuffer.push(t)}traceCubicBezierCurve(t,e,n){this.lastPoint=n,this.pointBuffer.push(t,e,n)}traceQuadraticBezierCurve(t,e){this.lastPoint=e,this.pointBuffer.push(t,e)}drawPoints(...t){}startObject(t){super.startObject(t),this.objectNestingLevel+=1}endObject(){super.endObject(),this.objectNestingLevel-=1}}var le;!function(t){t[t.DummyRenderer=0]="DummyRenderer",t[t.CanvasRenderer=1]="CanvasRenderer"}(le\|\|(le={}));class ce{constructor(t,e,n){if(this.editor=t,this.parent=n,e===le.CanvasRenderer)this.initializeCanvasRendering();else{if(e!==le.DummyRenderer)throw new Error(`Unknown rendering mode, ${e}!`);this.dryInkRenderer=new ae(t.viewport),this.wetInkRenderer=new ae(t.viewport)}this.editor.notifier.on(S.DisplayResized,(t=>{var e;if(t.kind!==S.DisplayResized)throw new Error("Mismatched event.kinds!");null===(e=this.resizeSurfacesCallback)\|\|void 0===e\|\|e.call(this)}))}get width(){return this.dryInkRenderer.displaySize().x}get height(){return this.dryInkRenderer.displaySize().y}initializeCanvasRendering(){const t=document.createElement("canvas"),e=document.createElement("canvas"),n=t.getContext("2d"),r=e.getContext("2d");this.dryInkRenderer=new se(n,this.editor.viewport),this.wetInkRenderer=new se(r,this.editor.viewport),t.className="dryInkCanvas",e.className="wetInkCanvas",this.parent&&(this.parent.appendChild(t),this.parent.appendChild(e)),this.resizeSurfacesCallback=()=>{const n=t=>t.clientHeight!==t.height\|\|t.clientWidth!==t.width;(n(t)\|\|n(e))&&(t.width=t.clientWidth,t.height=t.clientHeight,e.width=e.clientWidth,e.height=e.clientHeight,this.editor.notifier.dispatch(S.DisplayResized,{kind:S.DisplayResized,newSize:y.of(this.width,this.height)}))},this.resizeSurfacesCallback(),this.flattenCallback=()=>{n.drawImage(e,0,0)}}startRerender(){var t;return null===(t=this.resizeSurfacesCallback)\|\|void 0===t\|\|t.call(this),this.wetInkRenderer.clear(),this.dryInkRenderer.clear(),this.dryInkRenderer}getDryInkRenderer(){return this.dryInkRenderer}getWetInkRenderer(){return this.wetInkRenderer}flatten(){var t;null===(t=this.flattenCallback)\|\|void 0===t\|\|t.call(this)}}class he extends vt{constructor(t){super(),this.attrs=t,this.contentBBox=k.empty}render(t,e){if(t instanceof Ut){console.log("Rendering to SVG.",this.attrs);for(const[e,n]of this.attrs)t.setRootSVGAttribute(e,n)}}intersects(t){return!1}applyTransformation(t){}description(t){return t.svgObject}}class de extends vt{constructor(t){super(),this.svgObject=t,this.contentBBox=k.of(t.getBoundingClientRect())}render(t,e){t instanceof Ut&&t.drawSVGElem(this.svgObject)}intersects(t){return this.contentBBox.getEdges().some((e=>null!==e.intersection(t)))}applyTransformation(t){}description(t){return t.svgObject}}var ue=function(t,e,n,r){return new(n\|\|(n=Promise))((function(i,o){function s(t){try{l(r.next(t))}catch(t){o(t)}}function a(t){try{l(r.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,a)}l((r=r.apply(t,e\|\|[])).next())}))};const pe=new k(0,0,500,500);class fe{constructor(t,e){this.source=t,this.onFinish=e,this.onAddComponent=null,this.onProgress=null,this.processedCount=0,this.totalToProcess=0}getStyle(t){var e,n,r;const i={fill:Rt.transparent},o=null!==(e=t.getAttribute("fill"))&&void 0!==e?e:t.style.fill;if(o)try{i.fill=Rt.fromString(o)}catch(t){console.error("Unknown fill color,",o)}const s=null!==(n=t.getAttribute("stroke"))&&void 0!==n?n:t.style.stroke,a=null!==(r=t.getAttribute("stroke-width"))&&void 0!==r?r:t.style.strokeWidth;if(s)try{let t=parseFloat(null!=a?a:"1");isFinite(t)\|\|(t=0),i.stroke={width:t,color:Rt.fromString(s)}}catch(t){console.error("Error parsing stroke data:",t)}return i}strokeDataFromElem(t){var e;const n=[],r=null!==(e=t.getAttribute("d"))&&void 0!==e?e:"",i=this.getStyle(t),o=r.split("M");let s=!0;for(const t of o){const e=/^[0-9., \t\n]+$/.exec(t);if(""!==t&&!e){const e=s?t:`M${t}`,r=gt.fromString(e).toRenderable(i);n.push(r)}s=!1}return n}addPath(t){var e;let n;try{const e=this.strokeDataFromElem(t);n=new bt(e)}catch(e){console.error("Invalid path in node",t,"\nError:",e,"\nAdding as an unknown object."),n=new de(t)}null===(e=this.onAddComponent)\|\|void 0===e\|\|e.call(this,n)}addUnknownNode(t){var e;const n=new de(t);null===(e=this.onAddComponent)\|\|void 0===e\|\|e.call(this,n)}updateViewBox(t){const e=t.getAttribute("viewBox");if(this.rootViewBox\|\|!e)return;const n=e.split(/[ \t,]/),r=parseFloat(n[0]),i=parseFloat(n[1]),o=parseFloat(n[2]),s=parseFloat(n[3]);isNaN(r)\|\|isNaN(i)\|\|isNaN(o)\|\|isNaN(s)\|\|(this.rootViewBox=new k(r,i,o,s))}updateSVGAttrs(t){var e;null===(e=this.onAddComponent)\|\|void 0===e\|\|e.call(this,new he(this.getSourceAttrs(t)))}visit(t){var e;return ue(this,void 0,void 0,(function(){switch(this.totalToProcess+=t.childElementCount,t.tagName.toLowerCase()){case"g":break;case"path":this.addPath(t);break;case"svg":this.updateViewBox(t),this.updateSVGAttrs(t);break;default:return console.warn("Unknown SVG element,",t),t instanceof SVGElement\|\|console.warn("Element",t,"is not an SVGElement! Continuing anyway."),void this.addUnknownNode(t)}for(const e of t.children)yield this.visit(e);this.processedCount++,yield null===(e=this.onProgress)\|\|void 0===e?void 0:e.call(this,this.processedCount,this.totalToProcess)}))}getSourceAttrs(t){return t.getAttributeNames().map((e=>[e,t.getAttribute(e)]))}start(t,e){var n;return ue(this,void 0,void 0,(function(){this.onAddComponent=t,this.onProgress=e,this.totalToProcess=this.source.childElementCount,this.processedCount=0,this.rootViewBox=null,yield this.visit(this.source);const r=this.rootViewBox;let i=pe;return r&&(i=k.of(r)),null===(n=this.onFinish)\|\|void 0===n\|\|n.call(this),i}))}static fromString(t){var e,n;const r=document.createElement("iframe");if(r.src="about:blank",r.setAttribute("sandbox","allow-same-origin"),r.setAttribute("csp","default-src 'about:blank'"),r.style.display="none",document.body.appendChild(r),!r.hasAttribute("sandbox"))throw r.remove(),new Error("SVG loading iframe is not sandboxed.");const i=null!==(n=null===(e=r.contentWindow)\|\|void 0===e?void 0:e.document)&&void 0!==n?n:r.contentDocument;if(null==i)throw new Error("Unable to open a sandboxed iframe!");i.open(),i.write("\n\t\t\t<!DOCTYPE html>\n\t\t\t<html>\n\t\t\t\t<head>\n\t\t\t\t\t<title>SVG Loading Sandbox</title>\n\t\t\t\t</head>\n\t\t\t\t<body>\n\t\t\t\t\t<script>\n\t\t\t\t\t\tconsole.error('JavaScript should not be able to run here!');\n\t\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\t\t'The SVG sandbox is broken! Please double-check the sandboxing setting.'\n\t\t\t\t\t\t);\n\t\t\t\t\t<\/script>\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t"),i.close();const o=i.createElementNS("http://www.w3.org/2000/svg","svg");return o.innerHTML=t,new fe(o,(()=>{r.remove()}))}}const me={updatedViewport:"Transformed Viewport",transformedElements:t=>`Transformed ${t} element${1===t?"":"s"}`,resizeOutputCommand:t=>`Resized image to ${t.w}x${t.h}`,addElementAction:t=>`Added ${t}`,eraseAction:(t,e)=>`Erased ${e} ${t}`,elements:"Elements",erasedNoElements:"Erased nothing",rotatedBy:t=>`Rotated by ${Math.abs(t)} degrees ${t<0?"clockwise":"counter-clockwise"}`,movedLeft:"Moved left",movedUp:"Moved up",movedDown:"Moved down",movedRight:"Moved right",zoomedOut:"Zoomed out",zoomedIn:"Zoomed in",selectedElements:t=>`Selected ${t} element${1===t?"":"s"}`},ge=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},Qt),{penTool:t=>`Pen ${t}`,selectionTool:"Selection",eraserTool:"Eraser",touchPanTool:"Touch Panning",twoFingerPanZoomTool:"Panning and Zooming",undoRedoTool:"Undo/Redo",toolEnabledAnnouncement:t=>`${t} enabled`,toolDisabledAnnouncement:t=>`${t} disabled`}),me),{stroke:"Stroke",svgObject:"SVG Object"}),{loading:t=>`Loading ${t}%...`,imageEditor:"Image Editor",doneLoading:"Done loading",undoAnnouncement:t=>`Undid ${t}`,redoAnnouncement:t=>`Redid ${t}`});var ve=function(t,e,n,r){return new(n\|\|(n=Promise))((function(i,o){function s(t){try{l(r.next(t))}catch(t){o(t)}}function a(t){try{l(r.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,a)}l((r=r.apply(t,e\|\|[])).next())}))};const be=class{constructor(t,e={}){var n,r;this.localization=ge,this.announceUndoCallback=t=>{this.announceForAccessibility(this.localization.undoAnnouncement(t.description(this.localization)))},this.announceRedoCallback=t=>{this.announceForAccessibility(this.localization.redoAnnouncement(t.description(this.localization)))},this.rerenderQueued=!1,this.localization=Object.assign(Object.assign({},this.localization),e.localization),this.settings={wheelEventsEnabled:null===(n=e.wheelEventsEnabled)\|\|void 0===n\|\|n,renderingMode:null!==(r=e.renderingMode)&&void 0!==r?r:le.CanvasRenderer,localization:this.localization},this.container=document.createElement("div"),this.renderingRegion=document.createElement("div"),this.container.appendChild(this.renderingRegion),this.container.className="imageEditorContainer",this.loadingWarning=document.createElement("div"),this.loadingWarning.classList.add("loadingMessage"),this.loadingWarning.ariaLive="polite",this.container.appendChild(this.loadingWarning),this.accessibilityAnnounceArea=document.createElement("div"),this.accessibilityAnnounceArea.ariaLive="assertive",this.accessibilityAnnounceArea.className="accessibilityAnnouncement",this.container.appendChild(this.accessibilityAnnounceArea),this.renderingRegion.style.touchAction="none",this.renderingRegion.className="imageEditorRenderArea",this.renderingRegion.setAttribute("tabIndex","0"),this.renderingRegion.ariaLabel=this.localization.imageEditor,this.notifier=new Dt,this.importExportViewport=new $(this.notifier),this.viewport=new $(this.notifier),this.display=new ce(this,this.settings.renderingMode,this.renderingRegion),this.image=new L,this.history=new It(this,this.announceRedoCallback,this.announceUndoCallback),this.toolController=new Mt(this,this.localization),t.appendChild(this.container),this.importExportViewport.updateScreenSize(y.of(500,500)),this.viewport.updateScreenSize(y.of(this.display.width,this.display.height)),this.registerListeners(),this.rerender(),this.hideLoadingWarning()}getRootElement(){return this.container}showLoadingWarning(t){const e=Math.round(100t);this.loadingWarning.innerText=this.localization.loading(e),this.loadingWarning.style.display="block"}hideLoadingWarning(){this.loadingWarning.style.display="none",this.announceForAccessibility(this.localization.doneLoading)}announceForAccessibility(t){this.accessibilityAnnounceArea.innerText=t}addToolbar(t=!0){const e=new oe(this,this.container,this.localization);return t&&(e.addDefaultToolWidgets(),e.addDefaultActionButtons()),e}registerListeners(){const t={},e=()=>{const e=(new Date).getTime(),n=[];for(const r in t){const i=2e3;t[r]&&e-t[r].timeStamp<i&&n.push(t[r])}return n};this.renderingRegion.addEventListener("touchstart",(t=>t.preventDefault())),this.renderingRegion.addEventListener("pointerdown",(n=>{const r=I.ofEvent(n,!0,this.viewport);t[r.id]=r,this.renderingRegion.setPointerCapture(r.id);const i={kind:E.PointerDownEvt,current:r,allPointers:e()};return this.toolController.dispatchInputEvent(i),!0})),this.renderingRegion.addEventListener("pointermove",(n=>{var r,i;const o=I.ofEvent(n,null!==(i=null===(r=t[n.pointerId])\|\|void 0===r?void 0:r.down)&&void 0!==i&&i,this.viewport);if(o.down){const r=t[o.id];if(r){if(o.screenPos.minus(r.screenPos).magnitude()<2)return}t[o.id]=o,this.toolController.dispatchInputEvent({kind:E.PointerMoveEvt,current:o,allPointers:e()})&&n.preventDefault()}}));const n=n=>{const r=I.ofEvent(n,!1,this.viewport);t[r.id]&&(t[r.id]=r,this.renderingRegion.releasePointerCapture(r.id),this.toolController.dispatchInputEvent({kind:E.PointerUpEvt,current:r,allPointers:e()})&&n.preventDefault(),delete t[r.id])};this.renderingRegion.addEventListener("pointerup",(t=>{n(t)})),this.renderingRegion.addEventListener("pointercancel",(t=>{n(t)})),this.renderingRegion.addEventListener("keydown",(t=>{this.toolController.dispatchInputEvent({kind:E.KeyPressEvent,key:t.key,ctrlKey:t.ctrlKey})&&t.preventDefault()})),this.container.addEventListener("wheel",(t=>{let e=x.of(t.deltaX,t.deltaY,t.deltaZ);if(!this.settings.wheelEventsEnabled&&!t.ctrlKey)return;t.deltaMode===WheelEvent.DOM_DELTA_LINE?e=e.times(15):t.deltaMode===WheelEvent.DOM_DELTA_PAGE&&(e=e.times(100)),t.ctrlKey&&(e=x.of(0,0,t.deltaY));const n=y.of(t.clientX,t.clientY);return!!this.toolController.dispatchInputEvent({kind:E.WheelEvt,delta:e,screenPos:n})&&(t.preventDefault(),!0)})),this.notifier.on(S.DisplayResized,(t=>{this.viewport.updateScreenSize(y.of(this.display.width,this.display.height))})),window.addEventListener("resize",(()=>{this.notifier.dispatch(S.DisplayResized,{kind:S.DisplayResized,newSize:y.of(this.display.width,this.display.height)}),this.queueRerender()}))}dispatch(t,e=!0){e?this.history.push(t):t.apply(this),this.announceForAccessibility(t.description(this.localization))}asyncApplyOrUnapplyCommands(t,e,n){return ve(this,void 0,void 0,(function(){for(let r=0;r<t.length;r+=n){this.showLoadingWarning(r/t.length);for(let i=r;i<t.length&&i<r+n;i++){const n=t[i];e?n.apply(this):n.unapply(this)}r+n<t.length&&(yield new Promise((t=>{this.rerender(),requestAnimationFrame(t)})))}this.hideLoadingWarning()}))}asyncApplyCommands(t,e){return this.asyncApplyOrUnapplyCommands(t,!0,e)}asyncUnapplyCommands(t,e){return this.asyncApplyOrUnapplyCommands(t,!1,e)}queueRerender(){this.rerenderQueued\|\|(this.rerenderQueued=!0,requestAnimationFrame((()=>{this.rerender(),this.rerenderQueued=!1})))}rerender(t=!0){this.display.startRerender();const e=this.display.getDryInkRenderer();if(t){const t={fill:Rt.fromHex("#44444455")},n=12;e.drawRect(this.importExportViewport.visibleRect,n,t)}this.image.render(e,this.viewport),this.rerenderQueued=!1}drawWetInk(...t){for(const e of t)this.display.getWetInkRenderer().drawPath(e)}clearWetInk(){this.display.getWetInkRenderer().clear()}createHTMLOverlay(t){return t.classList.add("overlay"),this.container.appendChild(t),{remove:()=>t.remove()}}addStyleSheet(t){const e=document.createElement("style");return e.innerText=t,this.container.appendChild(e),e}sendPenEvent(t,e,n){const r=I.ofCanvasPoint(e,t!==E.PointerUpEvt,this.viewport);this.toolController.dispatchInputEvent({kind:t,allPointers:null!=n?n:[r],current:r})}toSVG(){const t=this.importExportViewport,e="http://www.w3.org/2000/svg",n=document.createElementNS(e,"svg"),r=new Ut(n,t),i=t.canvasToScreenTransform;t.resetTransform(M.identity),this.image.renderAll(r),t.resetTransform(i);const o=t.visibleRect;return n.setAttribute("viewBox",`${o.x} ${o.y} ${o.w} ${o.h}`),n.setAttribute("width",`${o.w}`),n.setAttribute("height",`${o.h}`),n.setAttribute("version","1.1"),n.setAttribute("baseProfile","full"),n.setAttribute("xmlns",e),n}loadFrom(t){return ve(this,void 0,void 0,(function(){this.showLoadingWarning(0);const e=yield t.start((t=>{new L.AddElementCommand(t).apply(this)}),((t,e)=>t%100==0?(this.showLoadingWarning(t/e),this.rerender(!1),new Promise((t=>{requestAnimationFrame((()=>t()))}))):null));this.hideLoadingWarning(),this.setImportExportRect(e).apply(this)}))}getImportExportRect(){return this.importExportViewport.visibleRect}setImportExportRect(t){const e=this.importExportViewport.visibleRect.size,n=this.importExportViewport.canvasToScreenTransform;return{apply(e){const n=e.importExportViewport;n.updateScreenSize(t.size),n.resetTransform(M.translation(t.topLeft.times(-1))),e.queueRerender()},unapply(t){const r=t.importExportViewport;r.updateScreenSize(e),r.resetTransform(n),t.queueRerender()},description:e=>e.resizeOutputCommand(t)}}loadFromSVG(t){return ve(this,void 0,void 0,(function(){const e=fe.fromString(t);yield this.loadFrom(e)}))}},xe=be})(),window.jsdraw=i})();
1	+ (()=>{"use strict";var e={786:(t,e,n)=>{n.d(e,{Z:()=>a});var r=n(81),i=n.n(r),o=n(645),s=n.n(o)()(i());s.push([t.id,'.clr-picker {\r\n display: none;\r\n flex-wrap: wrap;\r\n position: absolute;\r\n width: 200px;\r\n z-index: 1000;\r\n border-radius: 10px;\r\n background-color: #fff;\r\n justify-content: space-between;\r\n box-shadow: 0 0 5px rgba(0,0,0,.05), 0 5px 20px rgba(0,0,0,.1);\r\n -moz-user-select: none;\r\n -webkit-user-select: none;\r\n user-select: none;\r\n}\r\n\r\n.clr-picker.clr-open,\r\n.clr-picker[data-inline="true"] {\r\n display: flex;\r\n}\r\n\r\n.clr-picker[data-inline="true"] {\r\n position: relative;\r\n}\r\n\r\n.clr-gradient {\r\n position: relative;\r\n width: 100%;\r\n height: 100px;\r\n margin-bottom: 15px;\r\n border-radius: 3px 3px 0 0;\r\n background-image: linear-gradient(rgba(0,0,0,0), #000), linear-gradient(90deg, #fff, currentColor);\r\n cursor: pointer;\r\n}\r\n\r\n.clr-marker {\r\n position: absolute;\r\n width: 12px;\r\n height: 12px;\r\n margin: -6px 0 0 -6px;\r\n border: 1px solid #fff;\r\n border-radius: 50%;\r\n background-color: currentColor;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-picker input[type="range"]::-webkit-slider-runnable-track {\r\n width: 100%;\r\n height: 8px;\r\n}\r\n\r\n.clr-picker input[type="range"]::-webkit-slider-thumb {\r\n width: 8px;\r\n height: 8px;\r\n -webkit-appearance: none;\r\n}\r\n\r\n.clr-picker input[type="range"]::-moz-range-track {\r\n width: 100%;\r\n height: 8px;\r\n border: 0;\r\n}\r\n\r\n.clr-picker input[type="range"]::-moz-range-thumb {\r\n width: 8px;\r\n height: 8px;\r\n border: 0;\r\n}\r\n\r\n.clr-hue {\r\n background-image: linear-gradient(to right, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f 83.33%, #f00 100%);\r\n}\r\n\r\n.clr-hue,\r\n.clr-alpha {\r\n position: relative;\r\n width: calc(100% - 40px);\r\n height: 8px;\r\n margin: 5px 20px;\r\n border-radius: 4px;\r\n}\r\n\r\n.clr-alpha span {\r\n display: block;\r\n height: 100%;\r\n width: 100%;\r\n border-radius: inherit;\r\n background-image: linear-gradient(90deg, rgba(0,0,0,0), currentColor);\r\n}\r\n\r\n.clr-hue input,\r\n.clr-alpha input {\r\n position: absolute;\r\n width: calc(100% + 16px);\r\n height: 16px;\r\n left: -8px;\r\n top: -4px;\r\n margin: 0;\r\n background-color: transparent;\r\n opacity: 0;\r\n cursor: pointer;\r\n appearance: none;\r\n -webkit-appearance: none;\r\n}\r\n\r\n.clr-hue div,\r\n.clr-alpha div {\r\n position: absolute;\r\n width: 16px;\r\n height: 16px;\r\n left: 0;\r\n top: 50%;\r\n margin-left: -8px;\r\n transform: translateY(-50%);\r\n border: 2px solid #fff;\r\n border-radius: 50%;\r\n background-color: currentColor;\r\n box-shadow: 0 0 1px #888;\r\n pointer-events: none;\r\n}\r\n\r\n.clr-alpha div:before {\r\n content: \'\';\r\n position: absolute;\r\n height: 100%;\r\n width: 100%;\r\n left: 0;\r\n top: 0;\r\n border-radius: 50%;\r\n background-color: currentColor;\r\n}\r\n\r\n.clr-format {\r\n display: none;\r\n order: 1;\r\n width: calc(100% - 40px);\r\n margin: 0 20px 20px;\r\n}\r\n\r\n.clr-segmented {\r\n display: flex;\r\n position: relative;\r\n width: 100%;\r\n margin: 0;\r\n padding: 0;\r\n border: 1px solid #ddd;\r\n border-radius: 15px;\r\n box-sizing: border-box;\r\n color: #999;\r\n font-size: 12px;\r\n}\r\n\r\n.clr-segmented input,\r\n.clr-segmented legend {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n border: 0;\r\n left: 0;\r\n top: 0;\r\n opacity: 0;\r\n pointer-events: none;\r\n}\r\n\r\n.clr-segmented label {\r\n flex-grow: 1;\r\n padding: 4px 0;\r\n text-align: center;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-segmented label:first-of-type {\r\n border-radius: 10px 0 0 10px;\r\n}\r\n\r\n.clr-segmented label:last-of-type {\r\n border-radius: 0 10px 10px 0;\r\n}\r\n\r\n.clr-segmented input:checked + label {\r\n color: #fff;\r\n background-color: #666;\r\n}\r\n\r\n.clr-swatches {\r\n order: 2;\r\n width: calc(100% - 32px);\r\n margin: 0 16px;\r\n}\r\n\r\n.clr-swatches div {\r\n display: flex;\r\n flex-wrap: wrap;\r\n padding-bottom: 12px;\r\n justify-content: center;\r\n}\r\n\r\n.clr-swatches button {\r\n position: relative;\r\n width: 20px;\r\n height: 20px;\r\n margin: 0 4px 6px 4px;\r\n border: 0;\r\n border-radius: 50%;\r\n color: inherit;\r\n text-indent: -1000px;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-swatches button:after {\r\n content: \'\';\r\n display: block;\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n border-radius: inherit;\r\n background-color: currentColor;\r\n box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);\r\n}\r\n\r\ninput.clr-color {\r\n order: 1;\r\n width: calc(100% - 80px);\r\n height: 32px;\r\n margin: 15px 20px 20px 0;\r\n padding: 0 10px;\r\n border: 1px solid #ddd;\r\n border-radius: 16px;\r\n color: #444;\r\n background-color: #fff;\r\n font-family: sans-serif;\r\n font-size: 14px;\r\n text-align: center;\r\n box-shadow: none;\r\n}\r\n\r\ninput.clr-color:focus {\r\n outline: none;\r\n border: 1px solid #1e90ff;\r\n}\r\n\r\n.clr-clear {\r\n display: none;\r\n order: 2;\r\n height: 24px;\r\n margin: 0 20px 20px auto;\r\n padding: 0 20px;\r\n border: 0;\r\n border-radius: 12px;\r\n color: #fff;\r\n background-color: #666;\r\n font-family: inherit;\r\n font-size: 12px;\r\n font-weight: 400;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-preview {\r\n position: relative;\r\n width: 32px;\r\n height: 32px;\r\n margin: 15px 0 20px 20px;\r\n border: 0;\r\n border-radius: 50%;\r\n overflow: hidden;\r\n cursor: pointer;\r\n}\r\n\r\n.clr-preview:before,\r\n.clr-preview:after {\r\n content: \'\';\r\n position: absolute;\r\n height: 100%;\r\n width: 100%;\r\n left: 0;\r\n top: 0;\r\n border: 1px solid #fff;\r\n border-radius: 50%;\r\n}\r\n\r\n.clr-preview:after {\r\n border: 0;\r\n background-color: currentColor;\r\n box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);\r\n}\r\n\r\n.clr-marker,\r\n.clr-hue div,\r\n.clr-alpha div,\r\n.clr-color {\r\n box-sizing: border-box;\r\n}\r\n\r\n.clr-field {\r\n display: inline-block;\r\n position: relative;\r\n color: transparent;\r\n}\r\n\r\n.clr-field button {\r\n position: absolute;\r\n width: 30px;\r\n height: 100%;\r\n right: 0;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n border: 0;\r\n color: inherit;\r\n text-indent: -1000px;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n pointer-events: none;\r\n}\r\n\r\n.clr-field button:after {\r\n content: \'\';\r\n display: block;\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n border-radius: inherit;\r\n background-color: currentColor;\r\n box-shadow: inset 0 0 1px rgba(0,0,0,.5);\r\n}\r\n\r\n.clr-alpha,\r\n.clr-alpha div,\r\n.clr-swatches button,\r\n.clr-preview:before,\r\n.clr-field button {\r\n background-image: repeating-linear-gradient(45deg, #aaa 25%, transparent 25%, transparent 75%, #aaa 75%, #aaa), repeating-linear-gradient(45deg, #aaa 25%, #fff 25%, #fff 75%, #aaa 75%, #aaa);\r\n background-position: 0 0, 4px 4px;\r\n background-size: 8px 8px;\r\n}\r\n\r\n.clr-marker:focus {\r\n outline: none;\r\n}\r\n\r\n.clr-keyboard-nav .clr-marker:focus,\r\n.clr-keyboard-nav .clr-hue input:focus + div,\r\n.clr-keyboard-nav .clr-alpha input:focus + div,\r\n.clr-keyboard-nav .clr-segmented input:focus + label {\r\n outline: none;\r\n box-shadow: 0 0 0 2px #1e90ff, 0 0 2px 2px #fff;\r\n}\r\n\r\n.clr-picker[data-alpha="false"] .clr-alpha {\r\n display: none;\r\n}\r\n\r\n.clr-picker[data-minimal="true"] {\r\n padding-top: 16px;\r\n}\r\n\r\n.clr-picker[data-minimal="true"] .clr-gradient,\r\n.clr-picker[data-minimal="true"] .clr-hue,\r\n.clr-picker[data-minimal="true"] .clr-alpha,\r\n.clr-picker[data-minimal="true"] .clr-color,\r\n.clr-picker[data-minimal="true"] .clr-preview {\r\n display: none;\r\n}\r\n\r\n/ Dark theme /\r\n\r\n.clr-dark {\r\n background-color: #444;\r\n}\r\n\r\n.clr-dark .clr-segmented {\r\n border-color: #777;\r\n}\r\n\r\n.clr-dark .clr-swatches button:after {\r\n box-shadow: inset 0 0 0 1px rgba(255,255,255,.3);\r\n}\r\n\r\n.clr-dark input.clr-color {\r\n color: #fff;\r\n border-color: #777;\r\n background-color: #555;\r\n}\r\n\r\n.clr-dark input.clr-color:focus {\r\n border-color: #1e90ff;\r\n}\r\n\r\n.clr-dark .clr-preview:after {\r\n box-shadow: inset 0 0 0 1px rgba(255,255,255,.5);\r\n}\r\n\r\n.clr-dark .clr-alpha,\r\n.clr-dark .clr-alpha div,\r\n.clr-dark .clr-swatches button,\r\n.clr-dark .clr-preview:before {\r\n background-image: repeating-linear-gradient(45deg, #666 25%, transparent 25%, transparent 75%, #888 75%, #888), repeating-linear-gradient(45deg, #888 25%, #444 25%, #444 75%, #888 75%, #888);\r\n}\r\n\r\n/ Polaroid theme /\r\n\r\n.clr-picker.clr-polaroid {\r\n border-radius: 6px;\r\n box-shadow: 0 0 5px rgba(0,0,0,.1), 0 5px 30px rgba(0,0,0,.2);\r\n}\r\n\r\n.clr-picker.clr-polaroid:before {\r\n content: \'\';\r\n display: block;\r\n position: absolute;\r\n width: 16px;\r\n height: 10px;\r\n left: 20px;\r\n top: -10px;\r\n border: solid transparent;\r\n border-width: 0 8px 10px 8px;\r\n border-bottom-color: currentColor;\r\n box-sizing: border-box;\r\n color: #fff;\r\n filter: drop-shadow(0 -4px 3px rgba(0,0,0,.1));\r\n pointer-events: none;\r\n}\r\n\r\n.clr-picker.clr-polaroid.clr-dark:before {\r\n color: #444;\r\n}\r\n\r\n.clr-picker.clr-polaroid.clr-left:before {\r\n left: auto;\r\n right: 20px;\r\n}\r\n\r\n.clr-picker.clr-polaroid.clr-top:before {\r\n top: auto;\r\n bottom: -10px;\r\n transform: rotateZ(180deg);\r\n}\r\n\r\n.clr-polaroid .clr-gradient {\r\n width: calc(100% - 20px);\r\n height: 120px;\r\n margin: 10px;\r\n border-radius: 3px;\r\n}\r\n\r\n.clr-polaroid .clr-hue,\r\n.clr-polaroid .clr-alpha {\r\n width: calc(100% - 30px);\r\n height: 10px;\r\n margin: 6px 15px;\r\n border-radius: 5px;\r\n}\r\n\r\n.clr-polaroid .clr-hue div,\r\n.clr-polaroid .clr-alpha div {\r\n box-shadow: 0 0 5px rgba(0,0,0,.2);\r\n}\r\n\r\n.clr-polaroid .clr-format {\r\n width: calc(100% - 20px);\r\n margin: 0 10px 15px;\r\n}\r\n\r\n.clr-polaroid .clr-swatches {\r\n width: calc(100% - 12px);\r\n margin: 0 6px;\r\n}\r\n.clr-polaroid .clr-swatches div {\r\n padding-bottom: 10px;\r\n}\r\n\r\n.clr-polaroid .clr-swatches button {\r\n width: 22px;\r\n height: 22px;\r\n}\r\n\r\n.clr-polaroid input.clr-color {\r\n width: calc(100% - 60px);\r\n margin: 10px 10px 15px 0;\r\n}\r\n\r\n.clr-polaroid .clr-clear {\r\n margin: 0 10px 15px auto;\r\n}\r\n\r\n.clr-polaroid .clr-preview {\r\n margin: 10px 0 15px 10px;\r\n}\r\n\r\n/ Large theme /\r\n\r\n.clr-picker.clr-large {\r\n width: 275px;\r\n}\r\n\r\n.clr-large .clr-gradient {\r\n height: 150px;\r\n}\r\n\r\n.clr-large .clr-swatches button {\r\n width: 22px;\r\n height: 22px;\r\n}\r\n\r\n/ Pill (horizontal) theme /\r\n\r\n.clr-picker.clr-pill {\r\n width: 380px;\r\n padding-left: 180px;\r\n box-sizing: border-box;\r\n}\r\n\r\n.clr-pill .clr-gradient {\r\n position: absolute;\r\n width: 180px;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n margin-bottom: 0;\r\n border-radius: 3px 0 0 3px;\r\n}\r\n\r\n.clr-pill .clr-hue {\r\n margin-top: 20px;\r\n}',""]);const a=s},59:(t,e,n)=>{n.d(e,{Z:()=>c});var r=n(81),i=n.n(r),o=n(645),s=n.n(o),a=n(771),l=s()(i());l.i(a.Z),l.push([t.id,"\n.imageEditorContainer {\n\t/* Deafult colors for the editor /\n --primary-background-color: white;\n --primary-background-color-transparent: rgba(255, 255, 255, 0.5);\n --secondary-background-color: #faf;\n --primary-foreground-color: black;\n --secondary-foreground-color: black;\n}\n\n@media (prefers-color-scheme: dark) {\n\t.imageEditorContainer {\n\t\t--primary-background-color: #151515;\n\t\t--primary-background-color-transparent: rgba(50, 50, 50, 0.5);\n\t\t--secondary-background-color: #607;\n\t\t--primary-foreground-color: white;\n\t\t--secondary-foreground-color: white;\n\t}\n}\n\n.imageEditorContainer {\n\tcolor: var(--primary-foreground-color);\n\tfont-family: system-ui, -apple-system, sans-serif;\n\tbackground-color: var(--primary-background-color);\n\n\tdisplay: flex;\n\tflex-direction: column-reverse;\n}\n\n.imageEditorContainer .imageEditorRenderArea {\n\tdisplay: grid;\n\tgrid-template-columns: 1fr;\n\tflex-grow: 2;\n\tflex-shrink: 1;\n\tmin-height: 100px;\n}\n\n.imageEditorContainer .imageEditorRenderArea canvas {\n\t/ Stack all canvases on top of each other /\n\tgrid-row: 1 / 1;\n\tgrid-column: 1 / 1;\n\ttouch-action: none;\n\n\t/ Fill the container /\n\tbox-sizing: border-box;\n\twidth: 100%;\n\theight: 100%;\n}\n\n.imageEditorContainer .loadingMessage {\n\tposition: fixed;\n\ttext-align: center;\n\tfont-size: 2em;\n\n\tbottom: 0;\n\tleft: 0;\n\tright: 0;\n}\n\n.imageEditorContainer .accessibilityAnnouncement {\n\topacity: 0;\n\twidth: 0;\n\theight: 0;\n\toverflow: hidden;\n\tpointer-events: none;\n}\n",""]);const c=l},771:(t,e,n)=>{n.d(e,{Z:()=>a});var r=n(81),i=n.n(r),o=n(645),s=n.n(o)()(i());s.push([t.id,".toolbar-root {\n background-color: var(--primary-background-color);\n\n border: 1px solid var(--secondary-background-color);\n border-radius: 2px;\n flex-wrap: wrap;\n\n box-sizing: border-box;\n width: 100%;\n\n display: flex;\n flex-direction: row;\n justify-content: center;\n\n font-family: system-ui, -apple-system, sans-serif;\n}\n\n.toolbar-button, .toolbar-root button {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n\n text-align: center;\n border-radius: 6px;\n cursor: pointer;\n\n padding-left: 3px;\n padding-right: 3px;\n margin-left: 3px;\n margin-right: 3px;\n\n min-width: 40px;\n max-width: 70px;\n font-size: 11pt;\n\n cursor: pointer;\n\n height: min(20vh, 60px);\n background-color: var(--primary-background-color);\n color: var(--primary-foreground-color);\n border: none;\n box-shadow: 0px 0px 2px var(--primary-foreground-color);\n\n transition: background-color 0.25s ease, box-shadow 0.25s ease, opacity 0.3s ease;\n}\n\n.toolbar-button:hover, .toolbar-root button:not(:disabled):hover {\n box-shadow: 0px 2px 4px var(--primary-foreground-color);\n}\n\n.toolbar-root button {\n height: auto;\n}\n\n.toolbar-root button:disabled {\n cursor: inherit;\n filter: opacity(0.5);\n}\n\n.toolbar-button .toolbar-icon {\n flex-shrink: 1;\n min-width: 30px;\n}\n\n.toolbar-toolContainer.selected .toolbar-button {\n background-color: var(--secondary-background-color);\n color: var(--secondary-foreground-color);\n}\n\n.toolbar-toolContainer:not(.selected) .toolbar-showHideDropdownIcon {\n display: none;\n}\n\n.toolbar-toolContainer.selected .toolbar-showHideDropdownIcon {\n height: 10px;\n transition: transform 0.5s ease;\n}\n\n.toolbar-toolContainer.dropdownVisible .toolbar-showHideDropdownIcon {\n transform: rotate(180deg);\n}\n\n.toolbar-dropdown.hidden, .toolbar-toolContainer:not(.selected) > .toolbar-dropdown {\n display: none;\n}\n\n.toolbar-dropdown {\n position: absolute;\n padding: 15px;\n padding-top: 5px;\n / Prevent overlap/being displayed under the undo/redo buttons /\n z-index: 2;\n background-color: var(--primary-background-color);\n box-shadow: 0px 3px 3px var(--primary-foreground-color);\n}\n\n.toolbar-buttonGroup {\n display: flex;\n flex-direction: row;\n}\n\n.toolbar-closeColorPickerOverlay {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n\n background-color: var(--primary-background-color);\n opacity: 0.3;\n}\n\n/ Make color selection buttons fill their containing label /\n.toolbar-dropdown .clr-field button {\n width: 100%;\n height: 100%;\n border-radius: 2px;\n margin-left: 0;\n margin-right: 0;\n}\n",""]);const a=s},645:t=>{t.exports=function(t){var e=[];return e.toString=function(){return this.map((function(e){var n="",r=void 0!==e[5];return e[4]&&(n+="@supports (".concat(e[4],") {")),e[2]&&(n+="@media ".concat(e[2]," {")),r&&(n+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),n+=t(e),r&&(n+="}"),e[2]&&(n+="}"),e[4]&&(n+="}"),n})).join("")},e.i=function(t,n,r,i,o){"string"==typeof t&&(t=[[null,t,void 0]]);var s={};if(r)for(var a=0;a<this.length;a++){var l=this[a][0];null!=l&&(s[l]=!0)}for(var c=0;c<t.length;c++){var h=[].concat(t[c]);r&&s[h[0]]\|\|(void 0!==o&&(void 0===h[5]\|\|(h[1]="@layer".concat(h[5].length>0?" ".concat(h[5]):""," {").concat(h[1],"}")),h[5]=o),n&&(h[2]?(h[1]="@media ".concat(h[2]," {").concat(h[1],"}"),h[2]=n):h[2]=n),i&&(h[4]?(h[1]="@supports (".concat(h[4],") {").concat(h[1],"}"),h[4]=i):h[4]="".concat(i)),e.push(h))}},e}},81:t=>{t.exports=function(t){return t[1]}},379:t=>{var e=[];function n(t){for(var n=-1,r=0;r<e.length;r++)if(e[r].identifier===t){n=r;break}return n}function r(t,r){for(var o={},s=[],a=0;a<t.length;a++){var l=t[a],c=r.base?l[0]+r.base:l[0],h=o[c]\|\|0,d="".concat(c," ").concat(h);o[c]=h+1;var u=n(d),p={css:l[1],media:l[2],sourceMap:l[3],supports:l[4],layer:l[5]};if(-1!==u)e[u].references++,e[u].updater(p);else{var f=i(p,r);r.byIndex=a,e.splice(a,0,{identifier:d,updater:f,references:1})}s.push(d)}return s}function i(t,e){var n=e.domAPI(e);n.update(t);return function(e){if(e){if(e.css===t.css&&e.media===t.media&&e.sourceMap===t.sourceMap&&e.supports===t.supports&&e.layer===t.layer)return;n.update(t=e)}else n.remove()}}t.exports=function(t,i){var o=r(t=t\|\|[],i=i\|\|{});return function(t){t=t\|\|[];for(var s=0;s<o.length;s++){var a=n(o[s]);e[a].references--}for(var l=r(t,i),c=0;c<o.length;c++){var h=n(o[c]);0===e[h].references&&(e[h].updater(),e.splice(h,1))}o=l}}},569:t=>{var e={};t.exports=function(t,n){var r=function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(t){n=null}e[t]=n}return e[t]}(t);if(!r)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");r.appendChild(n)}},216:t=>{t.exports=function(t){var e=document.createElement("style");return t.setAttributes(e,t.attributes),t.insert(e,t.options),e}},565:(t,e,n)=>{t.exports=function(t){var e=n.nc;e&&t.setAttribute("nonce",e)}},795:t=>{t.exports=function(t){var e=t.insertStyleElement(t);return{update:function(n){!function(t,e,n){var r="";n.supports&&(r+="@supports (".concat(n.supports,") {")),n.media&&(r+="@media ".concat(n.media," {"));var i=void 0!==n.layer;i&&(r+="@layer".concat(n.layer.length>0?" ".concat(n.layer):""," {")),r+=n.css,i&&(r+="}"),n.media&&(r+="}"),n.supports&&(r+="}");var o=n.sourceMap;o&&"undefined"!=typeof btoa&&(r+="\n/# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(o))))," /")),e.styleTagTransform(r,t,e.options)}(e,t,n)},remove:function(){!function(t){if(null===t.parentNode)return!1;t.parentNode.removeChild(t)}(e)}}}},589:t=>{t.exports=function(t,e){if(e.styleSheet)e.styleSheet.cssText=t;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(t))}}}},n={};function r(t){var i=n[t];if(void 0!==i)return i.exports;var o=n[t]={id:t,exports:{}};return e[t](o,o.exports,r),o.exports}r.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return r.d(e,{a:e}),e},r.d=(t,e)=>{for(var n in e)r.o(e,n)&&!r.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},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})},r.nc=void 0;var i={};(()=>{r.r(i),r.d(i,{Editor:()=>be,default:()=>xe});var e=r(379),n=r.n(e),o=r(795),s=r.n(o),a=r(569),l=r.n(a),c=r(565),h=r.n(c),d=r(216),u=r.n(d),p=r(589),f=r.n(p),m=r(59),g={};g.styleTagTransform=f(),g.setAttributes=h(),g.insert=l().bind(null,"head"),g.domAPI=s(),g.insertStyleElement=u();n()(m.Z,g);m.Z&&m.Z.locals&&m.Z.locals;var v=r(786),b={};b.styleTagTransform=f(),b.setAttributes=h(),b.insert=l().bind(null,"head"),b.domAPI=s(),b.insertStyleElement=u();n()(v.Z,b);v.Z&&v.Z.locals&&v.Z.locals;class x{constructor(t,e,n){this.x=t,this.y=e,this.z=n}get xy(){return{x:this.x,y:this.y}}static of(t,e,n){return new x(t,e,n)}at(t){if(0===t)return this.x;if(1===t)return this.y;if(2===t)return this.z;throw new Error(`${t} out of bounds!`)}length(){return this.magnitude()}magnitude(){return Math.sqrt(this.dot(this))}magnitudeSquared(){return this.dot(this)}angle(){return Math.atan2(this.y,this.x)}normalized(){const t=this.magnitude();return x.of(this.x/t,this.y/t,this.z/t)}times(t){return x.of(this.xt,this.yt,this.zt)}plus(t){return x.of(this.x+t.x,this.y+t.y,this.z+t.z)}minus(t){return this.plus(t.times(-1))}dot(t){return this.xt.x+this.yt.y+this.zt.z}cross(t){return x.of(this.yt.z-t.ythis.z,t.xthis.z-this.xt.z,this.xt.y-t.xthis.y)}orthog(){return 0===this.dot(x.unitX)&&0===this.dot(x.unitY)?0===this.dot(x.unitX)?x.unitX:this.cross(x.unitX).normalized():this.cross(x.unitZ.times(-1)).normalized()}extend(t,e){return this.plus(e.normalized().times(t))}lerp(t,e){return this.times(1-e).plus(t.times(e))}zip(t,e){return x.of(e(t.x,this.x),e(t.y,this.y),e(t.z,this.z))}map(t){return x.of(t(this.x),t(this.y),t(this.z))}asArray(){return[this.x,this.y,this.z]}eq(t,e){for(let n=0;n<3;n++)if(Math.abs(t.at(n)-this.at(n))>e)return!1;return!0}toString(){return`Vec(${this.x}, ${this.y}, ${this.z})`}}var y;x.unitX=x.of(1,0,0),x.unitY=x.of(0,1,0),x.unitZ=x.of(0,0,1),x.zero=x.of(0,0,0),function(t){t.of=(t,e)=>x.of(t,e,0),t.ofXY=({x:t,y:e})=>x.of(t,e,0),t.unitX=t.of(1,0),t.unitY=t.of(0,1),t.zero=t.of(0,0)}(y\|\|(y={}));class w{constructor(t,e){this.point1=t,this.point2=e,this.bbox=k.bboxOf([t,e]),this.direction=e.minus(t),this.length=this.direction.magnitude(),this.length>0&&(this.direction=this.direction.times(1/this.length))}get p1(){return this.point1}get p2(){return this.point2}get(t){return this.point1.plus(this.direction.times(t))}intersection(t){let e,n;if(0===this.direction.x){if(0===t.direction.x\|\|0===this.direction.y)return null;const r=this.point1.x,i=(this.point1.x-t.point1.x)t.direction.y/t.direction.x+t.point1.y;e=y.of(r,i),n=(i-this.point1.y)/this.direction.y}else{const r=(this.point1.y-t.point1.y)this.direction.xt.direction.x+this.direction.xt.direction.yt.point1.x-this.direction.yt.direction.xthis.point1.x,i=t.direction.ythis.direction.x-this.direction.yt.direction.x;if(0===i)return null;const o=r/i,s=(o-this.point1.x)/this.direction.x,a=this.point1.y+this.direction.ys;e=y.of(o,a),n=(o-this.point1.x)/this.direction.x}const r=e.minus(this.point1).magnitude(),i=e.minus(this.point2).magnitude(),o=e.minus(t.point1).magnitude(),s=e.minus(t.point2).magnitude();return r>this.length\|\|i>this.length\|\|o>t.length\|\|s>t.length?null:{point:e,t:n}}}class k{constructor(t,e,n,r){this.x=t,this.y=e,this.w=n,this.h=r,n<0&&(this.x+=n,this.w=Math.abs(n)),r<0&&(this.y+=r,this.h=Math.abs(r)),this.topLeft=y.of(this.x,this.y),this.size=y.of(this.w,this.h),this.bottomRight=this.topLeft.plus(this.size),this.center=this.topLeft.plus(this.size.times(.5)),this.area=this.wthis.h}translatedBy(t){return new k(t.x+this.x,t.y+this.y,this.w,this.h)}resizedTo(t){return new k(this.x,this.y,t.x,t.y)}containsPoint(t){return this.x<=t.x&&this.y<=t.y&&this.x+this.w>=t.x&&this.y+this.h>=t.y}containsRect(t){return this.x<=t.x&&this.y<=t.y&&this.bottomRight.x>=t.bottomRight.x&&this.bottomRight.y>=t.bottomRight.y}intersects(t){return null!==this.intersection(t)}intersection(t){const e=this.topLeft.zip(t.topLeft,Math.max),n=this.bottomRight.zip(t.bottomRight,Math.min);return this.containsPoint(e)&&this.containsPoint(n)&&t.containsPoint(e)&&t.containsPoint(n)?k.fromCorners(e,n):null}union(t){const e=this.topLeft.zip(t.topLeft,Math.min),n=this.bottomRight.zip(t.bottomRight,Math.max);return k.fromCorners(e,n)}grownToPoint(t,e=0){const n=new k(t.x-e,t.y-e,2e,2e);return this.union(n)}grownBy(t){return new k(this.x-t,this.y-t,this.w+2t,this.h+2t)}get corners(){return[this.bottomRight,this.topRight,this.topLeft,this.bottomLeft]}get maxDimension(){return Math.max(this.w,this.h)}get topRight(){return this.bottomRight.plus(y.of(0,-this.h))}get bottomLeft(){return this.topLeft.plus(y.of(0,this.h))}getEdges(){const t=this.corners;return[new w(t[0],t[1]),new w(t[1],t[2]),new w(t[2],t[3]),new w(t[3],t[0])]}transformedBoundingBox(t){return k.bboxOf(this.corners.map((e=>t.transformVec2(e))))}eq(t,e=0){return this.topLeft.eq(t.topLeft,e)&&this.size.eq(t.size,e)}toString(){return`Rect(point(${this.x}, ${this.y}), size(${this.w}, ${this.h}))`}static fromCorners(t,e){return new k(Math.min(t.x,e.x),Math.min(t.y,e.y),Math.abs(t.x-e.x),Math.abs(t.y-e.y))}static bboxOf(t,e=0){let n=0,r=0,i=0,o=0,s=!0;for(const e of t)s&&(n=e.x,r=e.y,i=e.x,o=e.y,s=!1),n=Math.min(n,e.x),r=Math.min(r,e.y),i=Math.max(i,e.x),o=Math.max(o,e.y);return k.fromCorners(y.of(n-e,r-e),y.of(i+e,o+e))}static of(t){var e,n,r,i;const o=null!==(n=null!==(e=t.width)&&void 0!==e?e:t.w)&&void 0!==n?n:0,s=null!==(i=null!==(r=t.height)&&void 0!==r?r:t.h)&&void 0!==i?i:0;return new k(t.x,t.y,o,s)}}k.empty=new k(0,0,0,0),k.unitSquare=new k(0,0,1,1);var P,T,C,E,S,z,B=function(t,e,n,r,i){if("m"===r)throw new TypeError("Private method is not writable");if("a"===r&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e\|\|!i:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===r?i.call(t,n):i?i.value=n:e.set(t,n),n},R=function(t,e,n,r){if("a"===n&&!r)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e\|\|!r:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?r:"a"===n?r.call(t):r?r.value:e.get(t)};class L{constructor(){this.root=new A}addElement(t){return this.root.addLeaf(t)}findParent(t){const e=this.root.getLeavesInRegion(t.getBBox());for(const n of e)if(n.getContent()===t)return n;return null}sortLeaves(t){t.sort(((t,e)=>t.getContent().zIndex-e.getContent().zIndex))}render(t,e,n=.001){const r=this.root.getLeavesInRegion(e.visibleRect,n);this.sortLeaves(r);for(const n of r)n.getContent().render(t,e.visibleRect)}renderAll(t){const e=this.root.getLeaves();this.sortLeaves(e);for(const n of e)n.getContent().render(t,n.getBBox())}getElementsIntersectingRegion(t){const e=this.root.getLeavesInRegion(t);return this.sortLeaves(e),e.map((t=>t.getContent()))}}L.AddElementCommand=(C=class{constructor(t,e=!1){P.set(this,void 0),T.set(this,!1),B(this,P,t,"f"),B(this,T,e,"f")}apply(t){t.image.addElement(R(this,P,"f")),R(this,T,"f")?(B(this,T,!1,"f"),t.display.flatten()):t.queueRerender()}unapply(t){const e=t.image.findParent(R(this,P,"f"));null==e\|\|e.remove(),t.queueRerender()}description(t){return t.addElementAction(R(this,P,"f").description(t))}},P=new WeakMap,T=new WeakMap,C);class A{constructor(t=null){this.parent=t,this.targetChildCount=30,this.children=[],this.bbox=k.empty,this.content=null,this.minZIndex=null,this.maxZIndex=null}getContent(){return this.content}getParent(){return this.parent}getChildrenInRegion(t){return this.children.filter((e=>e.getBBox().intersects(t)))}getLeavesInRegion(t,e=0){const n=[];if(this.bbox.maxDimension/t.maxDimension<=e)return[];null!==this.content&&this.getBBox().intersects(t)&&n.push(this);const r=this.getChildrenInRegion(t);for(const i of r)n.push(...i.getLeavesInRegion(t,e));return n}getLeaves(){if(this.content)return[this];const t=[];for(const e of this.children)t.push(...e.getLeaves());return t}addLeaf(t){if(null===this.content&&0===this.children.length)return this.content=t,this.recomputeBBox(!0),this;if(null!==this.content){console.assert(0===this.children.length);const t=new A(this);t.content=this.content,this.content=null,this.children.push(t),t.recomputeBBox(!1)}const e=t.getBBox();if(e.containsRect(this.getBBox())){const e=new A(this),n=new A(this);return n.children=this.children,this.children=[e,n],n.recomputeBBox(!0),e.addLeaf(t)}const n=this.children.filter((t=>t.getBBox().containsRect(e)));if(n.length>0&&this.children.length>=this.targetChildCount){n.sort(((t,e)=>t.getBBox().area-e.getBBox().area));const e=n[0].addLeaf(t);return e.rebalance(),e}const r=new A(this);return this.children.push(r),r.content=t,r.recomputeBBox(!0),r}getBBox(){return this.bbox}recomputeBBox(t){var e,n,r;const i=this.bbox;if(null!==this.content)this.bbox=this.content.getBBox(),this.minZIndex=this.content.zIndex,this.maxZIndex=this.content.zIndex;else{this.bbox=k.empty,this.minZIndex=null,this.maxZIndex=null;let t=!0;for(const r of this.children)t?(this.bbox=r.getBBox(),t=!1):this.bbox=this.bbox.union(r.getBBox()),null!==(e=this.minZIndex)&&void 0!==e\|\|(this.minZIndex=r.minZIndex),null!==(n=this.maxZIndex)&&void 0!==n\|\|(this.maxZIndex=r.maxZIndex),null!==r.minZIndex&&null!==this.minZIndex&&(this.minZIndex=Math.min(r.minZIndex,this.minZIndex)),null!==r.maxZIndex&&null!==this.maxZIndex&&(this.maxZIndex=Math.max(r.maxZIndex,this.maxZIndex))}t&&!i.eq(this.bbox)&&(null===(r=this.parent)\|\|void 0===r\|\|r.recomputeBBox(!0))}rebalance(){if(this.parent&&1===this.parent.children.length){console.assert(null===this.parent.content),console.assert(this.parent.children[0]===this);const t=this.parent;null!==t.parent?(t.children=[],this.parent=t.parent,this.parent.children.push(this),t.parent=null,this.parent.recomputeBBox(!1)):null===this.content&&(this.parent.children=this.children,this.parent=null)}}remove(){if(this.minZIndex=null,this.maxZIndex=null,!this.parent)return this.content=null,void(this.children=[]);const t=this.parent.children.length;this.parent.children=this.parent.children.filter((t=>t!==this)),console.assert(this.parent.children.length===t-1),this.parent.children.forEach((t=>{t.rebalance()})),this.parent.recomputeBBox(!0),this.content=null,this.parent=null,this.children=[]}}!function(t){t[t.PointerDownEvt=0]="PointerDownEvt",t[t.PointerMoveEvt=1]="PointerMoveEvt",t[t.PointerUpEvt=2]="PointerUpEvt",t[t.GestureCancelEvt=3]="GestureCancelEvt",t[t.WheelEvt=4]="WheelEvt",t[t.KeyPressEvent=5]="KeyPressEvent"}(E\|\|(E={})),function(t){t[t.ToolEnabled=0]="ToolEnabled",t[t.ToolDisabled=1]="ToolDisabled",t[t.ToolUpdated=2]="ToolUpdated",t[t.UndoRedoStackUpdated=3]="UndoRedoStackUpdated",t[t.ObjectAdded=4]="ObjectAdded",t[t.ViewportChanged=5]="ViewportChanged",t[t.DisplayResized=6]="DisplayResized",t[t.ColorPickerToggled=7]="ColorPickerToggled"}(S\|\|(S={}));class M{constructor(t,e,n,r,i,o,s,a,l){this.a1=t,this.a2=e,this.a3=n,this.b1=r,this.b2=i,this.b3=o,this.c1=s,this.c2=a,this.c3=l,this.cachedInverse=void 0,this.rows=[x.of(t,e,n),x.of(r,i,o),x.of(s,a,l)]}static ofRows(t,e,n){return new M(t.x,t.y,t.z,e.x,e.y,e.z,n.x,n.y,n.z)}inverse(){var t;return null!==(t=this.computeInverse())&&void 0!==t?t:M.identity}invertable(){return null!==this.computeInverse()}computeInverse(){if(void 0!==this.cachedInverse)return this.cachedInverse;const t=[this.rows[0],this.rows[1],this.rows[2]],e=[x.unitX,x.unitY,x.unitZ];for(let n=0;n<3;n++){let r=t[n].at(n);const i=1e-10;if(Math.abs(r)<i){let o=-1;for(let e=1;e<=2;e++){const r=(n+e)%3;if(Math.abs(t[r].at(n))>=i){o=r;break}}if(-1===o)return this.cachedInverse=null,null;const s=t[n],a=e[n];t[n]=t[o],e[n]=e[o],t[o]=s,e[o]=a,r=t[n].at(n)}let o=1/r;t[n]=t[n].times(o),e[n]=e[n].times(o);const s=t[n],a=e[n];for(let r=1;r<=2;r++){const i=(n+r)%3;o=-t[i].at(n),t[i]=t[i].plus(s.times(o)),e[i]=e[i].plus(a.times(o))}}const n=M.ofRows(e[0],e[1],e[2]);return this.cachedInverse=n,n}transposed(){return new M(this.a1,this.b1,this.c1,this.a2,this.b2,this.c2,this.a3,this.b3,this.c3)}rightMul(t){t=t.transposed();const e=(e,n)=>this.rows[e].dot(t.rows[n]);return new M(e(0,0),e(0,1),e(0,2),e(1,0),e(1,1),e(1,2),e(2,0),e(2,1),e(2,2))}transformVec2(t){let e=x.of(t.x,t.y,1);return e=this.transformVec3(e),y.of(e.x,e.y)}transformVec3(t){return x.of(this.rows[0].dot(t),this.rows[1].dot(t),this.rows[2].dot(t))}eq(t,e=0){for(let n=0;n<3;n++)if(!this.rows[n].eq(t.rows[n],e))return!1;return!0}toString(){return`\n⎡ ${this.a1},\t ${this.a2},\t ${this.a3}\t ⎤\n⎢ ${this.b1},\t ${this.b2},\t ${this.b3}\t ⎥\n⎣ ${this.c1},\t ${this.c2},\t ${this.c3}\t ⎦\n\t\t`.trimRight()}toArray(){return[this.a1,this.a2,this.a3,this.b1,this.b2,this.b3,this.c1,this.c2,this.c3]}static translation(t){return new M(1,0,t.x,0,1,t.y,0,0,1)}static zRotation(t,e=y.zero){const n=Math.cos(t),r=Math.sin(t);let i=M.translation(e);return i=i.rightMul(new M(n,-r,0,r,n,0,0,0,1)),i.rightMul(M.translation(e.times(-1)))}static scaling2D(t,e=y.zero){let n,r,i=M.translation(e);return"number"==typeof t?(n=t,r=t):(n=t.x,r=t.y),i=i.rightMul(new M(n,0,0,0,r,0,0,0,1)),i.rightMul(M.translation(e.times(-1)))}}M.identity=new M(1,0,0,0,1,0,0,0,1),function(t){t[t.Pen=0]="Pen",t[t.Eraser=1]="Eraser",t[t.Touch=2]="Touch",t[t.Mouse=3]="Mouse",t[t.Other=4]="Other"}(z\|\|(z={}));class I{constructor(t,e,n,r,i,o,s,a){this.screenPos=t,this.canvasPos=e,this.pressure=n,this.isPrimary=r,this.down=i,this.device=o,this.id=s,this.timeStamp=a}static ofEvent(t,e,n){var r,i;const o=y.of(t.offsetX,t.offsetY);let s=null!==(r={mouse:z.Mouse,pen:z.Pen,touch:z.Touch}[t.pointerType])&&void 0!==r?r:z.Other;s===z.Pen&&0!=(32&t.buttons)&&(s=z.Eraser);const a=(new Date).getTime(),l=n.roundPoint(n.screenToCanvas(o));return new I(o,l,null!==(i=t.pressure)&&void 0!==i?i:null,t.isPrimary,e,s,t.pointerId,a)}static ofCanvasPoint(t,e,n,r=0,i=z.Pen,o=!0,s=null){const a=n.canvasToScreen(t),l=(new Date).getTime();return new I(a,t,s,o,e,i,r,l)}}var D,O,j=function(t,e,n,r,i){if("m"===r)throw new TypeError("Private method is not writable");if("a"===r&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e\|\|!i:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===r?i.call(t,n):i?i.value=n:e.set(t,n),n},N=function(t,e,n,r){if("a"===n&&!r)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e\|\|!r:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?r:"a"===n?r.call(t):r?r.value:e.get(t)};class V{constructor(t){this.notifier=t,this.resetTransform(M.identity),this.screenRect=k.empty}updateScreenSize(t){this.screenRect=this.screenRect.resizedTo(t)}get visibleRect(){return this.screenRect.transformedBoundingBox(this.inverseTransform)}screenToCanvas(t){return this.inverseTransform.transformVec2(t)}canvasToScreen(t){return this.transform.transformVec2(t)}resetTransform(t){this.transform=t,this.inverseTransform=t.inverse(),this.notifier.dispatch(S.ViewportChanged,{kind:S.ViewportChanged,newTransform:t})}get screenToCanvasTransform(){return this.inverseTransform}get canvasToScreenTransform(){return this.transform}getScaleFactor(){return this.transform.transformVec3(x.unitX).magnitude()}getRotationAngle(){return this.transform.transformVec3(x.unitX).angle()}static roundPoint(t,e){const n=Math.pow(10,Math.floor(Math.log10(e))),r=t=>Math.round(t/n)n;return"number"==typeof t?r(t):t.map(r)}roundPoint(t){return V.roundPoint(t,1/this.getScaleFactor())}}V.ViewportTransform=(O=class{constructor(t){this.transform=t,D.set(this,void 0),j(this,D,t.inverse(),"f")}apply(t){const e=t.viewport;e.resetTransform(e.transform.rightMul(this.transform)),t.queueRerender()}unapply(t){const e=t.viewport;e.resetTransform(e.transform.rightMul(N(this,D,"f"))),t.queueRerender()}description(t){const e=[],n=y.unitX,r=this.transform.transformVec3(y.unitX),i=this.transform.transformVec2(y.unitX),o=r.magnitude(),s=180/Math.PIr.angle(),a=i.minus(n);o>1.2?e.push(t.zoomedIn):o<.8&&e.push(t.zoomedOut),Math.floor(Math.abs(s))>0&&e.push(t.rotatedBy(Math.round(s)));const l=1e-4;return a.x>l?e.push(t.movedLeft):a.x<-1e-4&&e.push(t.movedRight),a.y<l?e.push(t.movedDown):a.y>l&&e.push(t.movedUp),e.join("; ")}},D=new WeakMap,O);const $=V;class F{constructor(t,e){this.notifier=t,this.description=e,this.enabled=!0,this.group=null}onPointerDown(t){return!1}onPointerMove(t){}onPointerUp(t){}onGestureCancel(){}onWheel(t){return!1}onKeyPress(t){return!1}setEnabled(t){var e;this.enabled=t,t?(null===(e=this.group)\|\|void 0===e\|\|e.notifyEnabled(this),this.notifier.dispatch(S.ToolEnabled,{kind:S.ToolEnabled,tool:this})):this.notifier.dispatch(S.ToolDisabled,{kind:S.ToolDisabled,tool:this})}isEnabled(){return this.enabled}setToolGroup(t){this.isEnabled()&&t.notifyEnabled(this),this.group=t}}var U;!function(t){t[t.OneFingerGestures=1]="OneFingerGestures",t[t.TwoFingerGestures=2]="TwoFingerGestures",t[t.AnyDevice=4]="AnyDevice"}(U\|\|(U={}));class _ extends F{constructor(t,e,n){super(t.notifier,n),this.editor=t,this.mode=e,this.kind=At.PanZoom,this.transform=null,e===U.OneFingerGestures&&(this.kind=At.TouchPanZoom)}computePinchData(t,e){const n=e.screenPos.minus(t.screenPos),r=n.angle(),i=n.magnitude();return{canvasCenter:e.canvasPos.plus(t.canvasPos).times(.5),screenCenter:e.screenPos.plus(t.screenPos).times(.5),angle:r,dist:i}}pointersHaveCorrectDeviceType(t){return this.mode&U.AnyDevice\|\|t.every((t=>t.device===z.Touch))}onPointerDown({allPointers:t}){var e;let n=!1;if(this.pointersHaveCorrectDeviceType(t))if(2===t.length&&this.mode&U.TwoFingerGestures){const{screenCenter:e,angle:r,dist:i}=this.computePinchData(t[0],t[1]);this.lastAngle=r,this.lastDist=i,this.lastScreenCenter=e,n=!0}else 1===t.length&&this.mode&U.OneFingerGestures&&(this.lastScreenCenter=t[0].screenPos,n=!0);else n=!1;return n&&(null!==(e=this.transform)&&void 0!==e\|\|(this.transform=new V.ViewportTransform(M.identity)),this.editor.display.setDraftMode(!0)),n}getCenterDelta(t){return this.editor.viewport.screenToCanvasTransform.transformVec3(t.minus(this.lastScreenCenter))}handleTwoFingerMove(t){const{screenCenter:e,canvasCenter:n,angle:r,dist:i}=this.computePinchData(t[0],t[1]),o=this.getCenterDelta(e),s=M.translation(o).rightMul(M.scaling2D(i/this.lastDist,n)).rightMul(M.zRotation(r-this.lastAngle,n));this.lastScreenCenter=e,this.lastDist=i,this.lastAngle=r,this.transform=new V.ViewportTransform(this.transform.transform.rightMul(s))}handleOneFingerMove(t){const e=this.getCenterDelta(t.screenPos);this.transform=new V.ViewportTransform(this.transform.transform.rightMul(M.translation(e))),this.lastScreenCenter=t.screenPos}onPointerMove({allPointers:t}){var e;null!==(e=this.transform)&&void 0!==e\|\|(this.transform=new V.ViewportTransform(M.identity));const n=this.transform;2===t.length&&this.mode&U.TwoFingerGestures?this.handleTwoFingerMove(t):1===t.length&&this.mode&U.OneFingerGestures&&this.handleOneFingerMove(t[0]),n.unapply(this.editor),this.transform.apply(this.editor)}onPointerUp(t){this.transform&&(this.transform.unapply(this.editor),this.editor.dispatch(this.transform,!1)),this.editor.display.setDraftMode(!1),this.transform=null}onGestureCancel(){var t;null===(t=this.transform)\|\|void 0===t\|\|t.unapply(this.editor),this.editor.display.setDraftMode(!1),this.transform=null}updateTransform(t){var e;let n=t;this.transform&&(n=this.transform.transform.rightMul(t)),null===(e=this.transform)\|\|void 0===e\|\|e.unapply(this.editor),this.transform=new V.ViewportTransform(n),this.transform.apply(this.editor)}onWheel({delta:t,screenPos:e}){null===this.transform&&(this.transform=new V.ViewportTransform(M.identity));const n=this.editor.viewport.screenToCanvas(e),r=this.editor.viewport.screenToCanvasTransform.transformVec3(x.of(-t.x,-t.y,0)),i=M.scaling2D(Math.pow(1.04,-t.z),n).rightMul(M.translation(r));return this.updateTransform(i),!0}onKeyPress({key:t}){let e=y.zero,n=1,r=0;switch(t){case"a":case"h":case"ArrowLeft":e=y.of(-1,0);break;case"d":case"l":case"ArrowRight":e=y.of(1,0);break;case"k":case"ArrowUp":e=y.of(0,-1);break;case"j":case"ArrowDown":e=y.of(0,1);break;case"w":n=.5;break;case"s":n=2;break;case"r":r=1;break;case"R":r=-1;break;default:return!1}e=e.times(30),r=Math.PI/8,e=e.times(-1),r=-1,n=1/n;e=this.editor.viewport.screenToCanvasTransform.transformVec3(e);const i=this.editor.viewport.visibleRect.center,o=M.scaling2D(n,i).rightMul(M.zRotation(r,i)).rightMul(M.translation(e));return this.updateTransform(o),!0}}const{abs:G,cos:W,sin:H,acos:Z,atan2:q,sqrt:X,pow:Q}=Math;function Y(t){return t<0?-Q(-t,1/3):Q(t,1/3)}const K=Math.PI,J=2K,tt=K/2,et=Number.MAX_SAFE_INTEGER\|\|9007199254740991,nt=Number.MIN_SAFE_INTEGER\|\|-9007199254740991,rt={x:0,y:0,z:0},it={Tvalues:[-.06405689286260563,.06405689286260563,-.1911188674736163,.1911188674736163,-.3150426796961634,.3150426796961634,-.4337935076260451,.4337935076260451,-.5454214713888396,.5454214713888396,-.6480936519369755,.6480936519369755,-.7401241915785544,.7401241915785544,-.820001985973903,.820001985973903,-.8864155270044011,.8864155270044011,-.9382745520027328,.9382745520027328,-.9747285559713095,.9747285559713095,-.9951872199970213,.9951872199970213],Cvalues:[.12793819534675216,.12793819534675216,.1258374563468283,.1258374563468283,.12167047292780339,.12167047292780339,.1155056680537256,.1155056680537256,.10744427011596563,.10744427011596563,.09761865210411388,.09761865210411388,.08619016153195327,.08619016153195327,.0733464814110803,.0733464814110803,.05929858491543678,.05929858491543678,.04427743881741981,.04427743881741981,.028531388628933663,.028531388628933663,.0123412297999872,.0123412297999872],arcfn:function(t,e){const n=e(t);let r=n.xn.x+n.yn.y;return void 0!==n.z&&(r+=n.zn.z),X(r)},compute:function(t,e,n){if(0===t)return e[0].t=0,e[0];const r=e.length-1;if(1===t)return e[r].t=1,e[r];const i=1-t;let o=e;if(0===r)return e[0].t=t,e[0];if(1===r){const e={x:io[0].x+to[1].x,y:io[0].y+to[1].y,t};return n&&(e.z=io[0].z+to[1].z),e}if(r<4){let e,s,a,l=ii,c=tt,h=0;2===r?(o=[o[0],o[1],o[2],rt],e=l,s=it2,a=c):3===r&&(e=li,s=lt3,a=ic3,h=tc);const d={x:eo[0].x+so[1].x+ao[2].x+ho[3].x,y:eo[0].y+so[1].y+ao[2].y+ho[3].y,t};return n&&(d.z=eo[0].z+so[1].z+ao[2].z+ho[3].z),d}const s=JSON.parse(JSON.stringify(e));for(;s.length>1;){for(let e=0;e<s.length-1;e++)s[e]={x:s[e].x+(s[e+1].x-s[e].x)t,y:s[e].y+(s[e+1].y-s[e].y)t},void 0!==s[e].z&&(s[e]=s[e].z+(s[e+1].z-s[e].z)t);s.splice(s.length-1,1)}return s[0].t=t,s[0]},computeWithRatios:function(t,e,n,r){const i=1-t,o=n,s=e;let a,l=o[0],c=o[1],h=o[2],d=o[3];return l=i,c=t,2===s.length?(a=l+c,{x:(ls[0].x+cs[1].x)/a,y:(ls[0].y+cs[1].y)/a,z:!!r&&(ls[0].z+cs[1].z)/a,t}):(l=i,c=2i,h=tt,3===s.length?(a=l+c+h,{x:(ls[0].x+cs[1].x+hs[2].x)/a,y:(ls[0].y+cs[1].y+hs[2].y)/a,z:!!r&&(ls[0].z+cs[1].z+hs[2].z)/a,t}):(l=i,c=1.5i,h=3i,d=ttt,4===s.length?(a=l+c+h+d,{x:(ls[0].x+cs[1].x+hs[2].x+ds[3].x)/a,y:(ls[0].y+cs[1].y+hs[2].y+ds[3].y)/a,z:!!r&&(ls[0].z+cs[1].z+hs[2].z+ds[3].z)/a,t}):void 0))},derive:function(t,e){const n=[];for(let r=t,i=r.length,o=i-1;i>1;i--,o--){const t=[];for(let n,i=0;i<o;i++)n={x:o(r[i+1].x-r[i].x),y:o(r[i+1].y-r[i].y)},e&&(n.z=o(r[i+1].z-r[i].z)),t.push(n);n.push(t),r=t}return n},between:function(t,e,n){return e<=t&&t<=n\|\|it.approximately(t,e)\|\|it.approximately(t,n)},approximately:function(t,e,n){return G(t-e)<=(n\|\|1e-6)},length:function(t){const e=it.Tvalues.length;let n=0;for(let r,i=0;i<e;i++)r=.5it.Tvalues[i]+.5,n+=it.Cvalues[i]it.arcfn(r,t);return.5n},map:function(t,e,n,r,i){return r+(i-r)((t-e)/(n-e))},lerp:function(t,e,n){const r={x:e.x+t(n.x-e.x),y:e.y+t(n.y-e.y)};return void 0!==e.z&&void 0!==n.z&&(r.z=e.z+t(n.z-e.z)),r},pointToString:function(t){let e=t.x+"/"+t.y;return void 0!==t.z&&(e+="/"+t.z),e},pointsToString:function(t){return"["+t.map(it.pointToString).join(", ")+"]"},copy:function(t){return JSON.parse(JSON.stringify(t))},angle:function(t,e,n){const r=e.x-t.x,i=e.y-t.y,o=n.x-t.x,s=n.y-t.y;return q(rs-io,ro+is)},round:function(t,e){const n=""+t,r=n.indexOf(".");return parseFloat(n.substring(0,r+1+e))},dist:function(t,e){const n=t.x-e.x,r=t.y-e.y;return X(nn+rr)},closest:function(t,e){let n,r,i=Q(2,63);return t.forEach((function(t,o){r=it.dist(e,t),r<i&&(i=r,n=o)})),{mdist:i,mpos:n}},abcratio:function(t,e){if(2!==e&&3!==e)return!1;if(void 0===t)t=.5;else if(0===t\|\|1===t)return t;const n=Q(t,e)+Q(1-t,e);return G((n-1)/n)},projectionratio:function(t,e){if(2!==e&&3!==e)return!1;if(void 0===t)t=.5;else if(0===t\|\|1===t)return t;const n=Q(1-t,e);return n/(Q(t,e)+n)},lli8:function(t,e,n,r,i,o,s,a){const l=(t-n)(o-a)-(e-r)(i-s);return 0!=l&&{x:((tr-en)(i-s)-(t-n)(ia-os))/l,y:((tr-en)(o-a)-(e-r)(ia-os))/l}},lli4:function(t,e,n,r){const i=t.x,o=t.y,s=e.x,a=e.y,l=n.x,c=n.y,h=r.x,d=r.y;return it.lli8(i,o,s,a,l,c,h,d)},lli:function(t,e){return it.lli4(t,t.c,e,e.c)},makeline:function(t,e){return new ft(t.x,t.y,(t.x+e.x)/2,(t.y+e.y)/2,e.x,e.y)},findbbox:function(t){let e=et,n=et,r=nt,i=nt;return t.forEach((function(t){const o=t.bbox();e>o.x.min&&(e=o.x.min),n>o.y.min&&(n=o.y.min),r<o.x.max&&(r=o.x.max),i<o.y.max&&(i=o.y.max)})),{x:{min:e,mid:(e+r)/2,max:r,size:r-e},y:{min:n,mid:(n+i)/2,max:i,size:i-n}}},shapeintersections:function(t,e,n,r,i){if(!it.bboxoverlap(e,r))return[];const o=[],s=[t.startcap,t.forward,t.back,t.endcap],a=[n.startcap,n.forward,n.back,n.endcap];return s.forEach((function(e){e.virtual\|\|a.forEach((function(r){if(r.virtual)return;const s=e.intersects(r,i);s.length>0&&(s.c1=e,s.c2=r,s.s1=t,s.s2=n,o.push(s))}))})),o},makeshape:function(t,e,n){const r=e.points.length,i=t.points.length,o=it.makeline(e.points[r-1],t.points[0]),s=it.makeline(t.points[i-1],e.points[0]),a={startcap:o,forward:t,back:e,endcap:s,bbox:it.findbbox([o,t,e,s]),intersections:function(t){return it.shapeintersections(a,a.bbox,t,t.bbox,n)}};return a},getminmax:function(t,e,n){if(!n)return{min:0,max:0};let r,i,o=et,s=nt;-1===n.indexOf(0)&&(n=[0].concat(n)),-1===n.indexOf(1)&&n.push(1);for(let a=0,l=n.length;a<l;a++)r=n[a],i=t.get(r),i[e]<o&&(o=i[e]),i[e]>s&&(s=i[e]);return{min:o,mid:(o+s)/2,max:s,size:s-o}},align:function(t,e){const n=e.p1.x,r=e.p1.y,i=-q(e.p2.y-r,e.p2.x-n);return t.map((function(t){return{x:(t.x-n)W(i)-(t.y-r)H(i),y:(t.x-n)H(i)+(t.y-r)W(i)}}))},roots:function(t,e){e=e\|\|{p1:{x:0,y:0},p2:{x:1,y:0}};const n=t.length-1,r=it.align(t,e),i=function(t){return 0<=t&&t<=1};if(2===n){const t=r[0].y,e=r[1].y,n=r[2].y,o=t-2e+n;if(0!==o){const r=-X(ee-tn),s=-t+e;return[-(r+s)/o,-(-r+s)/o].filter(i)}return e!==n&&0===o?[(2e-n)/(2e-2n)].filter(i):[]}const o=r[0].y,s=r[1].y,a=r[2].y;let l=3s-o-3a+r[3].y,c=3o-6s+3a,h=-3o+3s,d=o;if(it.approximately(l,0)){if(it.approximately(c,0))return it.approximately(h,0)?[]:[-d/h].filter(i);const t=X(hh-4cd),e=2c;return[(t-h)/e,(-h-t)/e].filter(i)}c/=l,h/=l,d/=l;const u=(3h-cc)/3,p=u/3,f=(2ccc-9ch+27d)/27,m=f/2,g=mm+ppp;let v,b,x,y,w;if(g<0){const t=-u/3,e=X(ttt),n=-f/(2e),r=Z(n<-1?-1:n>1?1:n),o=2Y(e);return x=oW(r/3)-c/3,y=oW((r+J)/3)-c/3,w=oW((r+2J)/3)-c/3,[x,y,w].filter(i)}if(0===g)return v=m<0?Y(-m):-Y(m),x=2v-c/3,y=-v-c/3,[x,y].filter(i);{const t=X(g);return v=Y(-m+t),b=Y(m+t),[v-b-c/3].filter(i)}},droots:function(t){if(3===t.length){const e=t[0],n=t[1],r=t[2],i=e-2n+r;if(0!==i){const t=-X(nn-er),o=-e+n;return[-(t+o)/i,-(-t+o)/i]}return n!==r&&0===i?[(2n-r)/(2(n-r))]:[]}if(2===t.length){const e=t[0],n=t[1];return e!==n?[e/(e-n)]:[]}return[]},curvature:function(t,e,n,r,i){let o,s,a,l,c=0,h=0;const d=it.compute(t,e),u=it.compute(t,n),p=d.xd.x+d.yd.y;if(r?(o=X(Q(d.yu.z-u.yd.z,2)+Q(d.zu.x-u.zd.x,2)+Q(d.xu.y-u.xd.y,2)),s=Q(p+d.zd.z,1.5)):(o=d.xu.y-d.yu.x,s=Q(p,1.5)),0===o\|\|0===s)return{k:0,r:0};if(c=o/s,h=s/o,!i){const i=it.curvature(t-.001,e,n,r,!0).k,o=it.curvature(t+.001,e,n,r,!0).k;l=(o-c+(c-i))/2,a=(G(o-c)+G(c-i))/2}return{k:c,r:h,dk:l,adk:a}},inflections:function(t){if(t.length<4)return[];const e=it.align(t,{p1:t[0],p2:t.slice(-1)[0]}),n=e[2].xe[1].y,r=e[3].xe[1].y,i=e[1].xe[2].y,o=18(-3n+2r+3i-e[3].xe[2].y),s=18(3n-r-3i),a=18(i-n);if(it.approximately(o,0)){if(!it.approximately(s,0)){let t=-a/s;if(0<=t&&t<=1)return[t]}return[]}const l=2o;if(it.approximately(l,0))return[];const c=ss-4oa;if(c<0)return[];const h=Math.sqrt(c);return[(h-s)/l,-(s+h)/l].filter((function(t){return 0<=t&&t<=1}))},bboxoverlap:function(t,e){const n=["x","y"],r=n.length;for(let i,o,s,a,l=0;l<r;l++)if(i=n[l],o=t[i].mid,s=e[i].mid,a=(t[i].size+e[i].size)/2,G(o-s)>=a)return!1;return!0},expandbox:function(t,e){e.x.min<t.x.min&&(t.x.min=e.x.min),e.y.min<t.y.min&&(t.y.min=e.y.min),e.z&&e.z.min<t.z.min&&(t.z.min=e.z.min),e.x.max>t.x.max&&(t.x.max=e.x.max),e.y.max>t.y.max&&(t.y.max=e.y.max),e.z&&e.z.max>t.z.max&&(t.z.max=e.z.max),t.x.mid=(t.x.min+t.x.max)/2,t.y.mid=(t.y.min+t.y.max)/2,t.z&&(t.z.mid=(t.z.min+t.z.max)/2),t.x.size=t.x.max-t.x.min,t.y.size=t.y.max-t.y.min,t.z&&(t.z.size=t.z.max-t.z.min)},pairiteration:function(t,e,n){const r=t.bbox(),i=e.bbox(),o=1e5,s=n\|\|.5;if(r.x.size+r.y.size<s&&i.x.size+i.y.size<s)return[(o(t._t1+t._t2)/2\|0)/o+"/"+(o(e._t1+e._t2)/2\|0)/o];let a=t.split(.5),l=e.split(.5),c=[{left:a.left,right:l.left},{left:a.left,right:l.right},{left:a.right,right:l.right},{left:a.right,right:l.left}];c=c.filter((function(t){return it.bboxoverlap(t.left.bbox(),t.right.bbox())}));let h=[];return 0===c.length\|\|(c.forEach((function(t){h=h.concat(it.pairiteration(t.left,t.right,s))})),h=h.filter((function(t,e){return h.indexOf(t)===e}))),h},getccenter:function(t,e,n){const r=e.x-t.x,i=e.y-t.y,o=n.x-e.x,s=n.y-e.y,a=rW(tt)-iH(tt),l=rH(tt)+iW(tt),c=oW(tt)-sH(tt),h=oH(tt)+sW(tt),d=(t.x+e.x)/2,u=(t.y+e.y)/2,p=(e.x+n.x)/2,f=(e.y+n.y)/2,m=d+a,g=u+l,v=p+c,b=f+h,x=it.lli8(d,u,m,g,p,f,v,b),y=it.dist(x,t);let w,k=q(t.y-x.y,t.x-x.x),P=q(e.y-x.y,e.x-x.x),T=q(n.y-x.y,n.x-x.x);return k<T?((k>P\|\|P>T)&&(k+=J),k>T&&(w=T,T=k,k=w)):T<P&&P<k?(w=T,T=k,k=w):T+=J,x.s=k,x.e=T,x.r=y,x},numberSort:function(t,e){return t-e}};class ot{constructor(t){this.curves=[],this._3d=!1,t&&(this.curves=t,this._3d=this.curves[0]._3d)}valueOf(){return this.toString()}toString(){return"["+this.curves.map((function(t){return it.pointsToString(t.points)})).join(", ")+"]"}addCurve(t){this.curves.push(t),this._3d=this._3d\|\|t._3d}length(){return this.curves.map((function(t){return t.length()})).reduce((function(t,e){return t+e}))}curve(t){return this.curves[t]}bbox(){const t=this.curves;for(var e=t[0].bbox(),n=1;n<t.length;n++)it.expandbox(e,t[n].bbox());return e}offset(t){const e=[];return this.curves.forEach((function(n){e.push(...n.offset(t))})),new ot(e)}}const{abs:st,min:at,max:lt,cos:ct,sin:ht,acos:dt,sqrt:ut}=Math,pt=Math.PI;class ft{constructor(t){let e=t&&t.forEach?t:Array.from(arguments).slice(),n=!1;if("object"==typeof e[0]){n=e.length;const t=[];e.forEach((function(e){["x","y","z"].forEach((function(n){void 0!==e[n]&&t.push(e[n])}))})),e=t}let r=!1;const i=e.length;if(n){if(n>4){if(1!==arguments.length)throw new Error("Only new Bezier(point[]) is accepted for 4th and higher order curves");r=!0}}else if(6!==i&&8!==i&&9!==i&&12!==i&&1!==arguments.length)throw new Error("Only new Bezier(point[]) is accepted for 4th and higher order curves");const o=this._3d=!r&&(9===i\|\|12===i)\|\|t&&t[0]&&void 0!==t[0].z,s=this.points=[];for(let t=0,n=o?3:2;t<i;t+=n){var a={x:e[t],y:e[t+1]};o&&(a.z=e[t+2]),s.push(a)}const l=this.order=s.length-1,c=this.dims=["x","y"];o&&c.push("z"),this.dimlen=c.length;const h=it.align(s,{p1:s[0],p2:s[l]}),d=it.dist(s[0],s[l]);this._linear=h.reduce(((t,e)=>t+st(e.y)),0)<d/50,this._lut=[],this._t1=0,this._t2=1,this.update()}static quadraticFromPoints(t,e,n,r){if(void 0===r&&(r=.5),0===r)return new ft(e,e,n);if(1===r)return new ft(t,e,e);const i=ft.getABC(2,t,e,n,r);return new ft(t,i.A,n)}static cubicFromPoints(t,e,n,r,i){void 0===r&&(r=.5);const o=ft.getABC(3,t,e,n,r);void 0===i&&(i=it.dist(e,o.C));const s=i(1-r)/r,a=it.dist(t,n),l=(n.x-t.x)/a,c=(n.y-t.y)/a,h=il,d=ic,u=sl,p=sc,f=e.x-h,m=e.y-d,g=e.x+u,v=e.y+p,b=o.A,x=b.x+(f-b.x)/(1-r),y=b.y+(m-b.y)/(1-r),w=b.x+(g-b.x)/r,k=b.y+(v-b.y)/r,P={x:t.x+(x-t.x)/r,y:t.y+(y-t.y)/r},T={x:n.x+(w-n.x)/(1-r),y:n.y+(k-n.y)/(1-r)};return new ft(t,P,T,n)}static getUtils(){return it}getUtils(){return ft.getUtils()}static get PolyBezier(){return ot}valueOf(){return this.toString()}toString(){return it.pointsToString(this.points)}toSVG(){if(this._3d)return!1;const t=this.points,e=["M",t[0].x,t[0].y,2===this.order?"Q":"C"];for(let n=1,r=t.length;n<r;n++)e.push(t[n].x),e.push(t[n].y);return e.join(" ")}setRatios(t){if(t.length!==this.points.length)throw new Error("incorrect number of ratio values");this.ratios=t,this._lut=[]}verify(){const t=this.coordDigest();t!==this._print&&(this._print=t,this.update())}coordDigest(){return this.points.map((function(t,e){return""+e+t.x+t.y+(t.z?t.z:0)})).join("")}update(){this._lut=[],this.dpoints=it.derive(this.points,this._3d),this.computedirection()}computedirection(){const t=this.points,e=it.angle(t[0],t[this.order],t[1]);this.clockwise=e>0}length(){return it.length(this.derivative.bind(this))}static getABC(t=2,e,n,r,i=.5){const o=it.projectionratio(i,t),s=1-o,a={x:oe.x+sr.x,y:oe.y+sr.y},l=it.abcratio(i,t);return{A:{x:n.x+(n.x-a.x)/l,y:n.y+(n.y-a.y)/l},B:n,C:a,S:e,E:r}}getABC(t,e){e=e\|\|this.get(t);let n=this.points[0],r=this.points[this.order];return ft.getABC(this.order,n,e,r,t)}getLUT(t){if(this.verify(),t=t\|\|100,this._lut.length===t)return this._lut;this._lut=[],t++,this._lut=[];for(let e,n,r=0;r<t;r++)n=r/(t-1),e=this.compute(n),e.t=n,this._lut.push(e);return this._lut}on(e,n){n=n\|\|5;const r=this.getLUT(),i=[];for(let t,o=0,s=0;o<r.length;o++)t=r[o],it.dist(t,e)<n&&(i.push(t),s+=o/r.length);return!!i.length&&(t/=i.length)}project(t){const e=this.getLUT(),n=e.length-1,r=it.closest(e,t),i=r.mpos,o=(i-1)/n,s=(i+1)/n,a=.1/n;let l,c,h=r.mdist,d=o,u=d;for(h+=1;d<s+a;d+=a)l=this.compute(d),c=it.dist(t,l),c<h&&(h=c,u=d);return u=u<0?0:u>1?1:u,l=this.compute(u),l.t=u,l.d=h,l}get(t){return this.compute(t)}point(t){return this.points[t]}compute(t){return this.ratios?it.computeWithRatios(t,this.points,this.ratios,this._3d):it.compute(t,this.points,this._3d,this.ratios)}raise(){const t=this.points,e=[t[0]],n=t.length;for(let r,i,o=1;o<n;o++)r=t[o],i=t[o-1],e[o]={x:(n-o)/nr.x+o/ni.x,y:(n-o)/nr.y+o/ni.y};return e[n]=t[n-1],new ft(e)}derivative(t){return it.compute(t,this.dpoints[0],this._3d)}dderivative(t){return it.compute(t,this.dpoints[1],this._3d)}align(){let t=this.points;return new ft(it.align(t,{p1:t[0],p2:t[t.length-1]}))}curvature(t){return it.curvature(t,this.dpoints[0],this.dpoints[1],this._3d)}inflections(){return it.inflections(this.points)}normal(t){return this._3d?this.__normal3(t):this.__normal2(t)}__normal2(t){const e=this.derivative(t),n=ut(e.xe.x+e.ye.y);return{t,x:-e.y/n,y:e.x/n}}__normal3(t){const e=this.derivative(t),n=this.derivative(t+.01),r=ut(e.xe.x+e.ye.y+e.ze.z),i=ut(n.xn.x+n.yn.y+n.zn.z);e.x/=r,e.y/=r,e.z/=r,n.x/=i,n.y/=i,n.z/=i;const o={x:n.ye.z-n.ze.y,y:n.ze.x-n.xe.z,z:n.xe.y-n.ye.x},s=ut(o.xo.x+o.yo.y+o.zo.z);o.x/=s,o.y/=s,o.z/=s;const a=[o.xo.x,o.xo.y-o.z,o.xo.z+o.y,o.xo.y+o.z,o.yo.y,o.yo.z-o.x,o.xo.z-o.y,o.yo.z+o.x,o.zo.z];return{t,x:a[0]e.x+a[1]e.y+a[2]e.z,y:a[3]e.x+a[4]e.y+a[5]e.z,z:a[6]e.x+a[7]e.y+a[8]e.z}}hull(t){let e=this.points,n=[],r=[],i=0;for(r[i++]=e[0],r[i++]=e[1],r[i++]=e[2],3===this.order&&(r[i++]=e[3]);e.length>1;){n=[];for(let o,s=0,a=e.length-1;s<a;s++)o=it.lerp(t,e[s],e[s+1]),r[i++]=o,n.push(o);e=n}return r}split(t,e){if(0===t&&e)return this.split(e).left;if(1===e)return this.split(t).right;const n=this.hull(t),r={left:2===this.order?new ft([n[0],n[3],n[5]]):new ft([n[0],n[4],n[7],n[9]]),right:2===this.order?new ft([n[5],n[4],n[2]]):new ft([n[9],n[8],n[6],n[3]]),span:n};return r.left._t1=it.map(0,0,1,this._t1,this._t2),r.left._t2=it.map(t,0,1,this._t1,this._t2),r.right._t1=it.map(t,0,1,this._t1,this._t2),r.right._t2=it.map(1,0,1,this._t1,this._t2),e?(e=it.map(e,t,1,0,1),r.right.split(e).left):r}extrema(){const t={};let e=[];return this.dims.forEach(function(n){let r=function(t){return t[n]},i=this.dpoints[0].map(r);t[n]=it.droots(i),3===this.order&&(i=this.dpoints[1].map(r),t[n]=t[n].concat(it.droots(i))),t[n]=t[n].filter((function(t){return t>=0&&t<=1})),e=e.concat(t[n].sort(it.numberSort))}.bind(this)),t.values=e.sort(it.numberSort).filter((function(t,n){return e.indexOf(t)===n})),t}bbox(){const t=this.extrema(),e={};return this.dims.forEach(function(n){e[n]=it.getminmax(this,n,t[n])}.bind(this)),e}overlaps(t){const e=this.bbox(),n=t.bbox();return it.bboxoverlap(e,n)}offset(t,e){if(void 0!==e){const n=this.get(t),r=this.normal(t),i={c:n,n:r,x:n.x+r.xe,y:n.y+r.ye};return this._3d&&(i.z=n.z+r.ze),i}if(this._linear){const e=this.normal(0),n=this.points.map((function(n){const r={x:n.x+te.x,y:n.y+te.y};return n.z&&e.z&&(r.z=n.z+te.z),r}));return[new ft(n)]}return this.reduce().map((function(e){return e._linear?e.offset(t)[0]:e.scale(t)}))}simple(){if(3===this.order){const t=it.angle(this.points[0],this.points[3],this.points[1]),e=it.angle(this.points[0],this.points[3],this.points[2]);if(t>0&&e<0\|\|t<0&&e>0)return!1}const t=this.normal(0),e=this.normal(1);let n=t.xe.x+t.ye.y;return this._3d&&(n+=t.ze.z),st(dt(n))<pt/3}reduce(){let t,e,n=0,r=0,i=.01,o=[],s=[],a=this.extrema().values;for(-1===a.indexOf(0)&&(a=[0].concat(a)),-1===a.indexOf(1)&&a.push(1),n=a[0],t=1;t<a.length;t++)r=a[t],e=this.split(n,r),e._t1=n,e._t2=r,o.push(e),n=r;return o.forEach((function(t){for(n=0,r=0;r<=1;)for(r=n+i;r<=1.01;r+=i)if(e=t.split(n,r),!e.simple()){if(r-=i,st(n-r)<i)return[];e=t.split(n,r),e._t1=it.map(n,0,1,t._t1,t._t2),e._t2=it.map(r,0,1,t._t1,t._t2),s.push(e),n=r;break}n<1&&(e=t.split(n,1),e._t1=it.map(n,0,1,t._t1,t._t2),e._t2=t._t2,s.push(e))})),s}translate(t,e,n){n="number"==typeof n?n:e;const r=this.order;let i=this.points.map(((t,i)=>(1-i/r)e+i/rn));return new ft(this.points.map(((e,n)=>({x:e.x+t.xi[n],y:e.y+t.yi[n]}))))}scale(t){const e=this.order;let n=!1;if("function"==typeof t&&(n=t),n&&2===e)return this.raise().scale(n);const r=this.clockwise,i=this.points;if(this._linear)return this.translate(this.normal(0),n?n(0):t,n?n(1):t);const o=n?n(0):t,s=n?n(1):t,a=[this.offset(0,10),this.offset(1,10)],l=[],c=it.lli4(a[0],a[0].c,a[1],a[1].c);if(!c)throw new Error("cannot scale this curve. Try reducing it first.");return[0,1].forEach((function(t){const n=l[te]=it.copy(i[te]);n.x+=(t?s:o)a[t].n.x,n.y+=(t?s:o)a[t].n.y})),n?([0,1].forEach((function(o){if(2!==e\|\|!o){var s=i[o+1],a={x:s.x-c.x,y:s.y-c.y},h=n?n((o+1)/e):t;n&&!r&&(h=-h);var d=ut(a.xa.x+a.ya.y);a.x/=d,a.y/=d,l[o+1]={x:s.x+ha.x,y:s.y+ha.y}}})),new ft(l)):([0,1].forEach((t=>{if(2===e&&t)return;const n=l[te],r=this.derivative(t),o={x:n.x+r.x,y:n.y+r.y};l[t+1]=it.lli4(n,o,c,i[t+1])})),new ft(l))}outline(t,e,n,r){if(e=void 0===e?t:e,this._linear){const i=this.normal(0),o=this.points[0],s=this.points[this.points.length-1];let a,l,c;void 0===n&&(n=t,r=e),a={x:o.x+i.xt,y:o.y+i.yt},c={x:s.x+i.xn,y:s.y+i.yn},l={x:(a.x+c.x)/2,y:(a.y+c.y)/2};const h=[a,l,c];a={x:o.x-i.xe,y:o.y-i.ye},c={x:s.x-i.xr,y:s.y-i.yr},l={x:(a.x+c.x)/2,y:(a.y+c.y)/2};const d=[c,l,a],u=it.makeline(d[2],h[0]),p=it.makeline(h[2],d[0]),f=[u,new ft(h),p,new ft(d)];return new ot(f)}const i=this.reduce(),o=i.length,s=[];let a,l=[],c=0,h=this.length();const d=void 0!==n&&void 0!==r;function u(t,e,n,r,i){return function(o){const s=r/n,a=(r+i)/n,l=e-t;return it.map(o,0,1,t+sl,t+al)}}i.forEach((function(i){const o=i.length();d?(s.push(i.scale(u(t,n,h,c,o))),l.push(i.scale(u(-e,-r,h,c,o)))):(s.push(i.scale(t)),l.push(i.scale(-e))),c+=o})),l=l.map((function(t){return a=t.points,a[3]?t.points=[a[3],a[2],a[1],a[0]]:t.points=[a[2],a[1],a[0]],t})).reverse();const p=s[0].points[0],f=s[o-1].points[s[o-1].points.length-1],m=l[o-1].points[l[o-1].points.length-1],g=l[0].points[0],v=it.makeline(m,p),b=it.makeline(f,g),x=[v].concat(s).concat([b]).concat(l);return new ot(x)}outlineshapes(t,e,n){e=e\|\|t;const r=this.outline(t,e).curves,i=[];for(let t=1,e=r.length;t<e/2;t++){const o=it.makeshape(r[t],r[e-t],n);o.startcap.virtual=t>1,o.endcap.virtual=t<e/2-1,i.push(o)}return i}intersects(t,e){return t?t.p1&&t.p2?this.lineIntersects(t):(t instanceof ft&&(t=t.reduce()),this.curveintersects(this.reduce(),t,e)):this.selfintersects(e)}lineIntersects(t){const e=at(t.p1.x,t.p2.x),n=at(t.p1.y,t.p2.y),r=lt(t.p1.x,t.p2.x),i=lt(t.p1.y,t.p2.y);return it.roots(this.points,t).filter((t=>{var o=this.get(t);return it.between(o.x,e,r)&&it.between(o.y,n,i)}))}selfintersects(t){const e=this.reduce(),n=e.length-2,r=[];for(let i,o,s,a=0;a<n;a++)o=e.slice(a,a+1),s=e.slice(a+2),i=this.curveintersects(o,s,t),r.push(...i);return r}curveintersects(t,e,n){const r=[];t.forEach((function(t){e.forEach((function(e){t.overlaps(e)&&r.push({left:t,right:e})}))}));let i=[];return r.forEach((function(t){const e=it.pairiteration(t.left,t.right,n);e.length>0&&(i=i.concat(e))})),i}arcs(t){return t=t\|\|.5,this._iterate(t,[])}_error(t,e,n,r){const i=(r-n)/4,o=this.get(n+i),s=this.get(r-i),a=it.dist(t,e),l=it.dist(t,o),c=it.dist(t,s);return st(l-a)+st(c-a)}_iterate(t,e){let n,r=0,i=1;do{n=0,i=1;let o,s,a,l,c,h=this.get(r),d=!1,u=!1,p=i,f=1,m=0;do{if(u=d,l=a,p=(r+i)/2,m++,o=this.get(p),s=this.get(i),a=it.getccenter(h,o,s),a.interval={start:r,end:i},d=this._error(a,h,r,i)<=t,c=u&&!d,c\|\|(f=i),d){if(i>=1){if(a.interval.end=f=1,l=a,i>1){let t={x:a.x+a.rct(a.e),y:a.y+a.rht(a.e)};a.e+=it.angle({x:a.x,y:a.y},t,this.get(1))}break}i+=(i-r)/2}else i=p}while(!c&&n++<100);if(n>=100)break;l=l\|\|a,e.push(l),r=f}while(i<1);return e}}var mt;!function(t){t[t.LineTo=0]="LineTo",t[t.MoveTo=1]="MoveTo",t[t.CubicBezierTo=2]="CubicBezierTo",t[t.QuadraticBezierTo=3]="QuadraticBezierTo"}(mt\|\|(mt={}));class gt{constructor(t,e){this.startPoint=t,this.parts=e,this.cachedGeometry=null,this.bbox=k.bboxOf([t]);for(const n of e)this.bbox=this.bbox.union(gt.computeBBoxForSegment(t,n))}get geometry(){if(this.cachedGeometry)return this.cachedGeometry;let t=this.startPoint;const e=[];for(const n of this.parts)switch(n.kind){case mt.CubicBezierTo:e.push(new ft(t.xy,n.controlPoint1.xy,n.controlPoint2.xy,n.endPoint.xy)),t=n.endPoint;break;case mt.QuadraticBezierTo:e.push(new ft(t.xy,n.controlPoint.xy,n.endPoint.xy)),t=n.endPoint;break;case mt.LineTo:e.push(new w(t,n.point)),t=n.point;break;case mt.MoveTo:t=n.point}return this.cachedGeometry=e,this.cachedGeometry}static computeBBoxForSegment(t,e){const n=[t];let r;switch(e.kind){case mt.MoveTo:case mt.LineTo:n.push(e.point);break;case mt.CubicBezierTo:n.push(e.controlPoint1,e.controlPoint2,e.endPoint);break;case mt.QuadraticBezierTo:n.push(e.controlPoint,e.endPoint);break;default:return r=e,r}return k.bboxOf(n)}intersection(t){const e=[];for(const n of this.geometry)if(n instanceof w){const r=n.intersection(t);r&&e.push({curve:n,parameterValue:r.t,point:r.point})}else{const r=n.intersects(t).map((e=>{"string"==typeof e&&(e=parseFloat(e));const r=y.ofXY(n.get(e));return r.minus(t.p1).magnitude()>t.length\|\|r.minus(t.p2).magnitude()>t.length?null:{point:r,parameterValue:e,curve:n}})).filter((t=>null!==t));e.push(...r)}return e}transformedBy(t){const e=t.transformVec2(this.startPoint),n=[];let r;for(const e of this.parts)switch(e.kind){case mt.MoveTo:case mt.LineTo:n.push({kind:e.kind,point:t.transformVec2(e.point)});break;case mt.CubicBezierTo:n.push({kind:e.kind,controlPoint1:t.transformVec2(e.controlPoint1),controlPoint2:t.transformVec2(e.controlPoint2),endPoint:t.transformVec2(e.endPoint)});break;case mt.QuadraticBezierTo:n.push({kind:e.kind,controlPoint:t.transformVec2(e.controlPoint),endPoint:t.transformVec2(e.endPoint)});break;default:return r=e,r}return new gt(e,n)}union(t){return t?new gt(this.startPoint,[...this.parts,{kind:mt.MoveTo,point:t.startPoint},...t.parts]):this}static fromRect(t,e=null){const n=[];let r,i;if(null!==e){const n=y.of(e,e).times(.5),o=k.fromCorners(t.topLeft.plus(n),t.bottomRight.minus(n)),s=k.fromCorners(t.topLeft.minus(n),t.bottomRight.plus(n));r=[o.corners[3],...o.corners,...s.corners.reverse()],i=s.corners[3]}else r=t.corners.slice(1),i=t.corners[0];for(const t of r)n.push({kind:mt.LineTo,point:t});return new gt(i,n)}static fromRenderable(t){return new gt(t.startPoint,t.commands)}toRenderable(t){return{startPoint:this.startPoint,style:t,commands:this.parts}}toString(){return gt.toString(this.startPoint,this.parts)}static toString(t,e){const n=[],r=t=>{let e=t.toString();if(-1===e.indexOf("."))return e;const n=/^([-]?)(\d)\.(\d9{4,}\d)$/.exec(e);if(n){const t=n[1],r=parseInt(e.charAt(e.length-1),10),i=parseInt(n[3],10),o=parseInt(n[2],10);let s=(i+10-r).toString(),a=0;s.length>i.toString().length&&(s=s.substring(1),a=1),e=`${t+(o+a).toString()}.${s}`}return e=e.replace(/^([-]?\d\.?\d[1-9.])0{4,}\d$/,"$1"),e.replace(/[.]$/,"")},i=(t,...e)=>{const i=[];for(const t of e){const e=r(t.x),n=r(t.y);i.push(`${e},${n}`)}n.push(`${t}${i.join(" ")}`)};let o;i("M",t);for(const t of e)switch(t.kind){case mt.MoveTo:i("M",t.point);break;case mt.LineTo:i("L",t.point);break;case mt.CubicBezierTo:i("C",t.controlPoint1,t.controlPoint2,t.endPoint);break;case mt.QuadraticBezierTo:i("Q",t.controlPoint,t.endPoint);break;default:return o=t,o}return n.join("")}static fromString(t){t=t.split("\n").join(" ");let e=y.zero,n=null,r=!0;const i=[],o=t=>{r?r=!1:i.push({kind:mt.LineTo,point:t})},s=/([MmZzLlHhVvCcSsQqTtAa])\s([^a-zA-Z])/g;let a;for(;null!==(a=s.exec(t));){const t=a[2].trim().split(/[^0-9.-]/).filter((t=>t.length>0)).map((t=>parseFloat(t))),s=a[1],f=s!==s.toLowerCase(),m=t.reduce(((t,e,n,r)=>{if(n%2!=0){const i=e,o=r[n-1];return t.concat(y.of(o,i))}return t}),[]).map((t=>f?(e=t,t):(e=e.plus(t),e)));let g;switch(s.toLowerCase()){case"m":g=1,p=m[0],r?r=!1:i.push({kind:mt.MoveTo,point:p});break;case"l":g=1,o(m[0]);break;case"z":g=0,n&&o(n);break;case"c":g=3,h=m[0],d=m[1],u=m[2],i.push({kind:mt.CubicBezierTo,controlPoint1:h,controlPoint2:d,endPoint:u});break;case"q":g=2,l=m[0],c=m[1],i.push({kind:mt.QuadraticBezierTo,controlPoint:l,endPoint:c});break;case"h":g=0,o(f?y.of(t[0],e.y):e.plus(y.of(t[0],0)));break;case"v":g=0,o(f?y.of(e.x,t[1]):e.plus(y.of(0,t[1])));break;default:throw new Error(`Unknown path command ${s}`)}if(m.length!==g)throw new Error(`\n\t\t\t\t\tIncorrect number of arguments: got ${JSON.stringify(m)} with a length of ${m.length} ≠ ${g}.\n\t\t\t\t`.trim());m.length>0&&(null!=n\|\|(n=m[0])),r=!1}var l,c,h,d,u,p;return new gt(null!=n?n:y.zero,i)}}class vt{constructor(){this.lastChangedTime=(new Date).getTime(),this.zIndex=vt.zIndexCounter++}getBBox(){return this.contentBBox}transformBy(t){const e=(t,e)=>{const n=t.image.findParent(this);let r=!1;n&&(n.remove(),r=!0),this.applyTransformation(e),r&&new L.AddElementCommand(this).apply(t)},n=this.zIndex;return{apply:n=>{this.zIndex=vt.zIndexCounter++,e(n,t),n.queueRerender()},unapply:r=>{this.zIndex=n,e(r,t.inverse()),r.queueRerender()},description:t=>t.transformedElements(1)}}}vt.zIndexCounter=0;class bt extends vt{constructor(t){var e;super(),this.parts=t.map((t=>{const e=gt.fromRenderable(t),n=this.bboxForPart(e.bbox,t.style);return this.contentBBox?this.contentBBox=this.contentBBox.union(n):this.contentBBox=n,{path:e,bbox:n,startPoint:e.startPoint,style:t.style,commands:e.parts}})),null!==(e=this.contentBBox)&&void 0!==e\|\|(this.contentBBox=k.empty)}intersects(t){for(const e of this.parts)if(e.path.intersection(t).length>0)return!0;return!1}render(t,e){t.startObject(this.getBBox());for(const n of this.parts){const r=n.bbox;e&&!r.intersects(e)\|\|t.drawPath(n)}t.endObject()}bboxForPart(t,e){return e.stroke?t.grownBy(e.stroke.width/2):t}applyTransformation(t){this.contentBBox=k.empty;let e=!0;this.parts=this.parts.map((n=>{const r=n.path.transformedBy(t),i=this.bboxForPart(r.bbox,n.style);return e?(this.contentBBox=i,e=!1):this.contentBBox=this.contentBBox.union(i),{path:r,bbox:i,startPoint:r.startPoint,commands:r.parts,style:n.style}}))}description(t){return t.stroke}}const xt=(t,e)=>{const n=e.screenToCanvasTransform,r=7n.transformVec3(y.unitX).magnitude(),i=2n.transformVec3(y.unitX).magnitude();return new yt(t,i,r)};class yt{constructor(t,e,n){this.startPoint=t,this.minFitAllowed=e,this.maxFitAllowed=n,this.currentCurve=null,this.lastPoint=this.startPoint,this.segments=[],this.buffer=[this.startPoint.pos],this.momentum=y.zero,this.currentCurve=null,this.bbox=new k(this.startPoint.pos.x,this.startPoint.pos.y,0,0)}getBBox(){return this.bbox}getRenderingStyle(){var t;return{fill:null!==(t=this.lastPoint.color)&&void 0!==t?t:null}}getPreview(){if(this.currentCurve&&this.lastPoint){const t=this.currentSegmentToPath();return this.segments.concat(t)}return this.segments}preview(t){for(const e of this.getPreview())t.drawPath(e)}build(){return this.lastPoint&&this.finalizeCurrentCurve(),new bt(this.segments)}roundPoint(t){return $.roundPoint(t,this.minFitAllowed)}finalizeCurrentCurve(){if(!this.currentCurve){if(this.segments.length>0)return;const t=$.roundPoint(this.startPoint.width/3,this.minFitAllowed),e=this.roundPoint(this.startPoint.pos);return void this.segments.push({startPoint:this.startPoint.pos.plus(y.of(t,0)),commands:[{kind:mt.QuadraticBezierTo,controlPoint:e.plus(y.of(t,t)),endPoint:e.plus(y.of(0,t))},{kind:mt.QuadraticBezierTo,controlPoint:e.plus(y.of(-t,t)),endPoint:e.plus(y.of(-t,0))},{kind:mt.QuadraticBezierTo,controlPoint:e.plus(y.of(-t,-t)),endPoint:e.plus(y.of(0,-t))},{kind:mt.QuadraticBezierTo,controlPoint:e.plus(y.of(t,-t)),endPoint:e.plus(y.of(t,0))}],style:this.getRenderingStyle()})}this.segments.push(this.currentSegmentToPath());const t=this.buffer[this.buffer.length-1];this.lastExitingVec=y.ofXY(this.currentCurve.points[2]).minus(y.ofXY(this.currentCurve.points[1])),console.assert(0!==this.lastExitingVec.magnitude()),this.buffer=[this.buffer[this.buffer.length-2],t],this.currentCurve=null}currentSegmentToPath(){if(null==this.currentCurve)throw new Error("Invalid State: currentCurve is null!");let t=y.ofXY(this.currentCurve.normal(0)).normalized(),e=y.ofXY(this.currentCurve.normal(1)).normalized();t=t.times(this.curveStartWidth/2),e=e.times(this.curveEndWidth/2),isNaN(t.magnitude())&&(console.error("startVec is NaN",t,e,this.currentCurve),t=e);const n=y.ofXY(this.currentCurve.get(0)),r=y.ofXY(this.currentCurve.get(1)),i=y.ofXY(this.currentCurve.points[1]);let o=this.currentCurve.project(i.xy).t;o\|\|(o=n.minus(i).magnitudeSquared()<r.minus(i).magnitudeSquared()?.1:.9);const s=o;let a=y.ofXY(this.currentCurve.normal(s)).normalized().times(this.curveStartWidth/2s+this.curveEndWidth/2(1-s));const l=(o,s)=>new ft(n.plus(t.times(o)),i.plus(s.times(o)),r.plus(e.times(o))),c=l(1,a),h=l(-1,a);2===c.intersects(h).length&&(a=a.times(2));const d=[{kind:mt.QuadraticBezierTo,controlPoint:this.roundPoint(i.plus(a)),endPoint:this.roundPoint(r.plus(e))},{kind:mt.LineTo,point:this.roundPoint(r.minus(e))},{kind:mt.QuadraticBezierTo,controlPoint:this.roundPoint(i.minus(a)),endPoint:this.roundPoint(n.minus(t))}];return{startPoint:this.roundPoint(n.plus(t)),commands:d,style:this.getRenderingStyle()}}computeExitingVec(){return this.momentum.normalized().times(this.lastPoint.width/2)}addPoint(t){var e,n;if(this.lastPoint){const e=1e-10,n=t.time-this.lastPoint.time;if(t.pos.eq(this.lastPoint.pos,e)\|\|0===n)return void console.warn("Discarding identical point");if(isNaN(t.pos.magnitude()))return void console.warn("Discarding NaN point.",t);const r=Math.min(this.lastPoint.width,t.width)/4;if(this.startPoint.pos.minus(t.pos).magnitude()<r&&0===this.segments.length)return;const i=t.pos.minus(this.lastPoint.pos).times(1/n1e3);this.momentum=this.momentum.lerp(i,.9)}const r=null!==(e=this.lastPoint)&&void 0!==e?e:t;this.lastPoint=t,this.buffer.push(t.pos);const i=t.width/2,o=this.curveEndWidth;if(this.curveEndWidth=i,this.bbox=this.bbox.grownToPoint(t.pos,i),null===this.currentCurve){const e=r.pos,i=r.pos.plus(null!==(n=this.lastExitingVec)&&void 0!==n?n:y.unitX),o=t.pos;this.currentCurve=new ft(e.xy,i.xy,o.xy),this.curveStartWidth=r.width/2,console.assert(!isNaN(e.magnitude())&&!isNaN(i.magnitude())&&!isNaN(o.magnitude()),"Expected !NaN")}let s=this.lastExitingVec;if(!s){let t=Math.ceil(this.buffer.length/3);0===t&&(t=this.buffer.length-1),s=this.buffer[t].minus(this.buffer[0])}let a=this.computeExitingVec();const l=this.buffer[0],c=t.pos,h=c.minus(l).magnitude(),d=2h;if(0===d\|\|0===a.magnitude()\|\|isNaN(a.magnitude()))return;console.assert(!isNaN(s.magnitude())),s=s.normalized(),a=a.normalized(),console.assert(!isNaN(s.magnitude()));const u=new w(l,l.plus(s.times(d))),p=new w(c.minus(a.times(d)),c).intersection(u);let f;f=p?p.point:l.plus(s.times(h/4)),(isNaN(f.magnitude())\|\|isNaN(l.magnitude()))&&console.error("controlPoint is NaN",p,"Start:",l,"End:",c,"in:",s,"out:",a);const m=this.currentCurve;this.currentCurve=new ft(l.xy,f.xy,c.xy),isNaN(y.ofXY(this.currentCurve.normal(0)).magnitude())&&(console.error("NaN normal at 0. Curve:",this.currentCurve),this.currentCurve=m);const g=t=>{for(const e of this.buffer){const n=y.ofXY(t.project(e.xy)).minus(e).magnitude();if(n>Math.max(Math.min(this.curveStartWidth,this.curveEndWidth)/2,this.minFitAllowed)\|\|n>this.maxFitAllowed)return!1}return!0};return this.buffer.length>3&&!g(this.currentCurve)?(this.currentCurve=m,this.curveEndWidth=o,this.lastPoint=r,void this.finalizeCurrentCurve()):void 0}}class wt extends F{constructor(t,e,n){super(t.notifier,e),this.editor=t,this.style=n,this.builder=null,this.builderFactory=xt,this.lastPoint=null,this.kind=At.Pen}getPressureMultiplier(){return 1/this.editor.viewport.getScaleFactor()this.style.thickness}getStrokePoint(t){var e;const n=Math.max(null!==(e=t.pressure)&&void 0!==e?e:1,.3);return{pos:t.canvasPos,width:nthis.getPressureMultiplier(),color:this.style.color,time:t.timeStamp}}previewStroke(){var t;this.editor.clearWetInk(),null===(t=this.builder)\|\|void 0===t\|\|t.preview(this.editor.display.getWetInkRenderer())}addPointToStroke(t){if(!this.builder)throw new Error("No stroke is currently being generated.");this.builder.addPoint(t),this.lastPoint=t,this.previewStroke()}onPointerDown({current:t,allPointers:e}){return t.device!==z.Eraser&&((1===e.length\|\|t.device===z.Pen)&&(this.builder=this.builderFactory(this.getStrokePoint(t),this.editor.viewport),!0))}onPointerMove({current:t}){this.addPointToStroke(this.getStrokePoint(t))}onPointerUp({current:t}){var e,n;if(!this.builder)return;const r=this.getStrokePoint(t),i=Object.assign(Object.assign({},r),{width:null!==(n=null===(e=this.lastPoint)\|\|void 0===e?void 0:e.width)&&void 0!==n?n:r.width});if(this.addPointToStroke(i),this.builder&&t.isPrimary){const t=this.builder.build();this.previewStroke();const e=!0,n=new L.AddElementCommand(t,e);this.editor.dispatch(n)}this.builder=null,this.editor.clearWetInk()}onGestureCancel(){this.editor.clearWetInk()}noteUpdated(){this.editor.notifier.dispatch(S.ToolUpdated,{kind:S.ToolUpdated,tool:this})}setColor(t){t.toHexString()!==this.style.color.toHexString()&&(this.style=Object.assign(Object.assign({},this.style),{color:t}),this.noteUpdated())}setThickness(t){t!==this.style.thickness&&(this.style=Object.assign(Object.assign({},this.style),{thickness:t}),this.noteUpdated())}setStrokeFactory(t){t!==this.builderFactory&&(this.builderFactory=t,this.noteUpdated())}getThickness(){return this.style.thickness}getColor(){return this.style.color}getStrokeFactory(){return this.builderFactory}}class kt{constructor(){}notifyEnabled(t){var e;t!==this.activeTool&&(null===(e=this.activeTool)\|\|void 0===e\|\|e.setEnabled(!1),this.activeTool=t)}}class Pt{constructor(t){this.toRemove=t.map((t=>t))}apply(t){for(const e of this.toRemove){const n=t.image.findParent(e);n&&n.remove()}t.queueRerender()}unapply(t){for(const e of this.toRemove)t.image.findParent(e)\|\|new L.AddElementCommand(e).apply(t);t.queueRerender()}description(t){if(0===this.toRemove.length)return t.erasedNoElements;let e=this.toRemove[0].description(t);for(const n of this.toRemove)if(n.description(t)!==e){e=t.elements;break}return t.eraseAction(e,this.toRemove.length)}}class Tt extends F{constructor(t,e){super(t.notifier,e),this.editor=t,this.command=null,this.kind=At.Eraser}onPointerDown(t){return(1===t.allPointers.length\|\|t.current.device===z.Eraser)&&(this.lastPoint=t.current.canvasPos,this.toRemove=[],!0)}onPointerMove(t){var e;const n=t.current.canvasPos;if(0===n.minus(this.lastPoint).magnitude())return;const r=new w(this.lastPoint,n),i=r.bbox;this.toRemove.push(...this.editor.image.getElementsIntersectingRegion(i).filter((t=>t.intersects(r)))),null===(e=this.command)\|\|void 0===e\|\|e.unapply(this.editor),this.command=new Pt(this.toRemove),this.command.apply(this.editor),this.lastPoint=n}onPointerUp(t){var e;this.command&&this.toRemove.length>0&&(null===(e=this.command)\|\|void 0===e\|\|e.unapply(this.editor),this.editor.dispatch(this.command)),this.command=null}onGestureCancel(){var t;null===(t=this.command)\|\|void 0===t\|\|t.unapply(this.editor),this.command=null}}var Ct=function(t,e,n,r){return new(n\|\|(n=Promise))((function(i,o){function s(t){try{l(r.next(t))}catch(t){o(t)}}function a(t){try{l(r.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,a)}l((r=r.apply(t,e\|\|[])).next())}))};const Et=30,St=(t,e,n)=>{t.style.touchAction="none";let r,i,o=!1;t.addEventListener("touchstart",(t=>t.preventDefault())),t.addEventListener("pointerdown",(e=>!!e.isPrimary&&(o=!0,t.setPointerCapture(e.pointerId),r=e.pageX,i=e.pageY,!0))),t.addEventListener("pointermove",(t=>{if(t.isPrimary&&o){const n=y.of(t.pageX-r,t.pageY-i);return e(n,y.of(t.offsetX,t.offsetY)),r=t.pageX,i=t.pageY,!0}return!1}));const s=t=>!!t.isPrimary&&(o=!1,n(),!0);t.addEventListener("pointerup",s),t.addEventListener("pointercancel",s)};class zt{constructor(t,e){this.startPoint=t,this.editor=e,this.boxRotation=this.editor.viewport.getRotationAngle(),this.selectedElems=[],this.region=k.bboxOf([t]),this.backgroundBox=document.createElement("div");const n=document.createElement("div"),r=document.createElement("div");this.rotateCircle=document.createElement("div");const i=document.createElement("div");this.backgroundBox.classList.add("selectionBox"),n.classList.add("draggableBackground"),r.classList.add("resizeCorner"),this.rotateCircle.classList.add("rotateCircle"),i.classList.add("rotateCircleContainer"),i.appendChild(this.rotateCircle),this.backgroundBox.appendChild(n),this.backgroundBox.appendChild(i),this.backgroundBox.appendChild(r),this.transformationCommands=[],this.transform=M.identity,St(n,(t=>{this.handleBackgroundDrag(t)}),(()=>this.finishDragging())),St(r,(t=>{this.handleResizeCornerDrag(t)}),(()=>this.finishDragging())),St(this.rotateCircle,((t,e)=>{this.handleRotateCircleDrag(e)}),(()=>this.finishDragging()))}handleBackgroundDrag(t){t=this.editor.viewport.screenToCanvasTransform.transformVec3(t),t=this.editor.viewport.roundPoint(t),this.region=this.region.translatedBy(t),this.transform=this.transform.rightMul(M.translation(t)),this.previewTransformCmds()}handleResizeCornerDrag(t){t=this.editor.viewport.screenToCanvasTransform.transformVec3(t),t=this.editor.viewport.roundPoint(t);const e=this.region.w,n=this.region.h,r=this.region.size.plus(t);if(r.y>0&&r.x>0){this.region=this.region.resizedTo(r);const t=y.of(this.region.w/e,this.region.h/n),i=M.scaling2D(t,this.region.topLeft);this.transform=this.transform.rightMul(i),this.previewTransformCmds()}}handleRotateCircleDrag(t){this.boxRotation=this.boxRotation%(2Math.PI),this.boxRotation<0&&(this.boxRotation+=2Math.PI);let e=t.angle();e%=2Math.PI,e<0&&(e+=2Math.PI);let n=e-this.boxRotation;const r=Math.PI/12;if(!(Math.abs(n)<r)&&isFinite(n)){{const t=Math.sign(n);n=Math.floor(Math.abs(n)/r)r,n=t}this.transform=this.transform.rightMul(M.zRotation(n,this.region.center)),this.boxRotation+=n,this.previewTransformCmds()}}computeTransformCommands(){return this.selectedElems.map((t=>t.transformBy(this.transform)))}finishDragging(){this.transformationCommands.forEach((t=>{t.unapply(this.editor)}));const t=this.transform,e=this.transform.inverse(),n=this.boxRotation,r=this.computeTransformCommands();this.transformationCommands=[],this.transform=M.identity,this.region=this.region.transformedBoundingBox(e),this.editor.dispatch({apply:e=>Ct(this,void 0,void 0,(function(){this.region=this.region.transformedBoundingBox(t),this.boxRotation+=n,this.updateUI(),yield e.asyncApplyCommands(r,50),this.recomputeRegion(),this.updateUI()})),unapply:t=>Ct(this,void 0,void 0,(function(){this.region=this.region.transformedBoundingBox(e),this.boxRotation-=n,this.updateUI(),yield t.asyncUnapplyCommands(r,50),this.recomputeRegion(),this.updateUI()})),description:t=>t.transformedElements(r.length)})}previewTransformCmds(){this.selectedElems.length>50\|\|(this.transformationCommands.forEach((t=>t.unapply(this.editor))),this.transformationCommands=this.computeTransformCommands(),this.transformationCommands.forEach((t=>t.apply(this.editor)))),this.updateUI()}appendBackgroundBoxTo(t){this.backgroundBox.parentElement&&this.backgroundBox.remove(),t.appendChild(this.backgroundBox)}setToPoint(t){this.region=this.region.grownToPoint(t),this.recomputeBoxRotation(),this.updateUI()}cancelSelection(){this.backgroundBox.parentElement&&this.backgroundBox.remove(),this.region=k.empty}resolveToObjects(){if(0===this.region.w\|\|0===this.region.h){const t=this.editor.viewport.visibleRect.maxDimension/100;this.region=k.bboxOf(this.region.corners,t)}return this.selectedElems=this.editor.image.getElementsIntersectingRegion(this.region).filter((t=>!!this.region.containsRect(t.getBBox())\|\|!!this.region.getEdges().some((e=>t.intersects(e))))),!!this.recomputeRegion()&&(this.updateUI(),!0)}recomputeRegion(){const t=this.selectedElems.reduce(((t,e)=>(null!=t?t:e.getBBox()).union(e.getBBox())),null);if(!t)return this.cancelSelection(),!1;this.region=t;const e=this.getMinCanvasSize();if(this.region.w<e\|\|this.region.h<e){const t=e/2;this.region=k.bboxOf(this.region.corners,t)}return this.recomputeBoxRotation(),!0}getMinCanvasSize(){return 2(Et/this.editor.viewport.getScaleFactor())}recomputeBoxRotation(){this.boxRotation=this.editor.viewport.getRotationAngle()}getSelectedItemCount(){return this.selectedElems.length}updateUI(){if(!this.backgroundBox)return;const t=this.region.topRight.minus(this.region.bottomRight),e=this.region.topLeft.minus(this.region.topRight),n=this.editor.viewport.canvasToScreenTransform,r=n.transformVec2(this.region.center),i=n.transformVec3(t).magnitude(),o=n.transformVec3(e).magnitude();this.backgroundBox.style.marginLeft=r.x-o/2+"px",this.backgroundBox.style.marginTop=r.y-i/2+"px",this.backgroundBox.style.width=`${o}px`,this.backgroundBox.style.height=`${i}px`;const s=180this.boxRotation/Math.PI;this.backgroundBox.style.transform=`rotate(${s}deg)`,this.rotateCircle.style.transform=`rotate(${-s}deg)`}deleteSelectedObjects(){return new Pt(this.selectedElems)}}class Bt extends F{constructor(t,e){super(t.notifier,e),this.editor=t,this.kind=At.Selection,this.handleOverlay=document.createElement("div"),t.createHTMLOverlay(this.handleOverlay),t.addStyleSheet("\n\t.handleOverlay {\n\t}\n\n\t.handleOverlay > .selectionBox {\n\t\tposition: absolute;\n\t\tz-index: 0;\n\t\ttransform-origin: center;\n\t}\n\n\t.handleOverlay > .selectionBox .draggableBackground {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\n\t\tbackground-color: var(--secondary-background-color);\n\t\topacity: 0.8;\n\t\tborder: 1px solid var(--primary-background-color);\n\t}\n\n\t.handleOverlay .resizeCorner {\n\t\twidth: 30px;\n\t\theight: 30px;\n\t\tmargin-right: -15px;\n\t\tmargin-bottom: -15px;\n\n\t\tposition: absolute;\n\t\tbottom: 0;\n\t\tright: 0;\n\n\t\topacity: 0.8;\n\t\tbackground-color: var(--primary-background-color);\n\t\tborder: 1px solid var(--primary-foreground-color);\n\t}\n\n\t.handleOverlay > .selectionBox .rotateCircleContainer {\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\tbottom: 50%;\n\t\tleft: 50%;\n\t\tright: 50%;\n\t}\n\n\t.handleOverlay .rotateCircle {\n\t\twidth: 30px;\n\t\theight: 30px;\n\t\tmargin-left: -15px;\n\t\tmargin-top: -15px;\n\t\topacity: 0.8;\n\n\t\tborder: 1px solid var(--primary-foreground-color);\n\t\tbackground-color: var(--primary-background-color);\n\t\tborder-radius: 100%;\n\t}\n"),this.handleOverlay.style.display="none",this.handleOverlay.classList.add("handleOverlay"),t.notifier.on(S.ViewportChanged,(t=>{var e,n;null===(e=this.selectionBox)\|\|void 0===e\|\|e.recomputeRegion(),null===(n=this.selectionBox)\|\|void 0===n\|\|n.updateUI()}))}onPointerDown(t){return!(1!==t.allPointers.length\|\|!t.current.isPrimary)&&(this.prevSelectionBox=this.selectionBox,this.selectionBox=new zt(t.current.canvasPos,this.editor),this.handleOverlay.replaceChildren(),this.selectionBox.appendBackgroundBoxTo(this.handleOverlay),!0)}onPointerMove(t){this.selectionBox&&this.selectionBox.setToPoint(t.current.canvasPos)}onGestureEnd(){if(!this.selectionBox)return;const t=this.selectionBox.resolveToObjects();if(this.editor.notifier.dispatch(S.ToolUpdated,{kind:S.ToolUpdated,tool:this}),t){const t=this.editor.viewport.visibleRect,e=this.selectionBox.region;this.editor.announceForAccessibility(this.editor.localization.selectedElements(this.selectionBox.getSelectedItemCount()));const n=t.transformedBoundingBox(M.scaling2D(2/3,t.center));if(n.w<e.w\|\|n.h<e.h){const t=Math.max(e.w/n.w,e.h/n.h),r=M.scaling2D(t,n.topLeft).inverse();new $.ViewportTransform(r).apply(this.editor)}if(!n.containsRect(e)){const t=e.center.minus(n.center),r=M.translation(t).inverse();new $.ViewportTransform(r).apply(this.editor)}}}onPointerUp(t){this.selectionBox&&(this.selectionBox.setToPoint(t.current.canvasPos),this.onGestureEnd())}onGestureCancel(){var t,e;null===(t=this.selectionBox)\|\|void 0===t\|\|t.cancelSelection(),this.selectionBox=this.prevSelectionBox,null===(e=this.selectionBox)\|\|void 0===e\|\|e.appendBackgroundBoxTo(this.handleOverlay)}setEnabled(t){super.setEnabled(t),this.handleOverlay.replaceChildren(),this.selectionBox=null,this.handleOverlay.style.display=t?"block":"none"}getSelection(){return this.selectionBox}clearSelection(){this.handleOverlay.replaceChildren(),this.prevSelectionBox=this.selectionBox,this.selectionBox=null,this.editor.notifier.dispatch(S.ToolUpdated,{kind:S.ToolUpdated,tool:this})}}class Rt{constructor(t,e,n,r){this.r=t,this.g=e,this.b=n,this.a=r,this.hexString=null}static ofRGB(t,e,n){return new Rt(t,e,n,1)}static ofRGBA(t,e,n,r){return new Rt(t,e,n,r)}static fromHex(t){var e;if(!(t=(t=(null!==(e=t.match(/^[#]?(.)$/))&&void 0!==e?e:[])[1]).toUpperCase()).match(/^[0-9A-F]+$/))throw new Error(`${t} is not in a valid format.`);if(3===t.length\|\|4===t.length){const e=t.split("");t=e.map((t=>`${t}0`)).join("")}6===t.length&&(t+="FF");const n=[];for(let e=2;e<=t.length;e+=2){const r=t.substring(e-2,e);n.push(parseInt(r,16)/255)}if(4!==n.length)throw new Error(`Unable to parse ${t}: Wrong number of components.`);return new Rt(n[0],n[1],n[2],n[3])}static fromString(t){if(t.startsWith("#"))return Rt.fromHex(t);{const e=document.createElement("canvas");e.width=1,e.height=1;const n=e.getContext("2d");n.fillStyle=t,n.fillRect(0,0,1,1);const r=n.getImageData(0,0,1,1),i=r.data[0]/255,o=r.data[1]/255,s=r.data[2]/255,a=r.data[3]/255;return Rt.ofRGBA(i,o,s,a)}}eq(t){return null!=t&&this.toHexString()===t.toHexString()}toHexString(){if(this.hexString)return this.hexString;const t=t=>{const e=Math.round(255t).toString(16);return 1===e.length?`0${e}`:e},e=t(this.a),n=t(this.r),r=t(this.g),i=t(this.b);return"ff"===e?`#${n}${r}${i}`:(this.hexString=`#${n}${r}${i}${e}`,this.hexString)}}Rt.transparent=Rt.ofRGBA(0,0,0,0),Rt.red=Rt.ofRGB(1,0,0),Rt.green=Rt.ofRGB(0,1,0),Rt.blue=Rt.ofRGB(0,0,1),Rt.purple=Rt.ofRGB(.5,.2,.5),Rt.yellow=Rt.ofRGB(1,1,.1),Rt.clay=Rt.ofRGB(.8,.4,.2),Rt.black=Rt.ofRGB(0,0,0),Rt.white=Rt.ofRGB(1,1,1);class Lt extends F{constructor(t){super(t.notifier,t.localization.undoRedoTool),this.editor=t,this.kind=At.UndoRedoShortcut}onKeyPress({key:t,ctrlKey:e}){if(e){if("z"===t)return this.editor.history.undo(),!0;if("Z"===t)return this.editor.history.redo(),!0}return!1}}var At;!function(t){t[t.TouchPanZoom=0]="TouchPanZoom",t[t.Pen=1]="Pen",t[t.Selection=2]="Selection",t[t.Eraser=3]="Eraser",t[t.PanZoom=4]="PanZoom",t[t.UndoRedoShortcut=5]="UndoRedoShortcut"}(At\|\|(At={}));class Mt{constructor(t,e){const n=new kt,r=new _(t,U.OneFingerGestures,e.touchPanTool),i=new wt(t,e.penTool(1),{color:Rt.purple,thickness:16}),o=[new Bt(t,e.selectionTool),new Tt(t,e.eraserTool),i,new wt(t,e.penTool(2),{color:Rt.clay,thickness:8}),new wt(t,e.penTool(3),{color:Rt.ofRGBA(1,1,0,.5),thickness:64})];this.tools=[r,...o,new _(t,U.TwoFingerGestures\|U.AnyDevice,e.twoFingerPanZoomTool),new Lt(t)],o.forEach((t=>t.setToolGroup(n))),r.setEnabled(!1),i.setEnabled(!0),t.notifier.on(S.ToolEnabled,(n=>{n.kind===S.ToolEnabled&&t.announceForAccessibility(e.toolEnabledAnnouncement(n.tool.description))})),t.notifier.on(S.ToolDisabled,(n=>{n.kind===S.ToolDisabled&&t.announceForAccessibility(e.toolDisabledAnnouncement(n.tool.description))})),this.activeTool=null}dispatchInputEvent(t){var e,n;let r=!1;if(t.kind===E.PointerDownEvt){for(const n of this.tools)if(n.isEnabled()&&n.onPointerDown(t)){this.activeTool!==n&&(null===(e=this.activeTool)\|\|void 0===e\|\|e.onGestureCancel()),this.activeTool=n,r=!0;break}}else if(t.kind===E.PointerUpEvt)null===(n=this.activeTool)\|\|void 0===n\|\|n.onPointerUp(t),this.activeTool=null,r=!0;else if(t.kind===E.WheelEvt\|\|t.kind===E.KeyPressEvent){const e=t.kind===E.KeyPressEvent,n=t.kind===E.WheelEvt;for(const i of this.tools){if(!i.isEnabled())continue;const o=n&&i.onWheel(t);if(r=e&&i.onKeyPress(t)\|\|o,r)break}}else if(null!==this.activeTool){let e;switch(t.kind){case E.PointerMoveEvt:this.activeTool.onPointerMove(t);break;case E.GestureCancelEvt:this.activeTool.onGestureCancel(),this.activeTool=null;break;default:return e=t,e}r=!0}else r=!1;return r}getMatchingTools(t){return this.tools.filter((e=>e.kind===t))}}const It=class{constructor(t,e,n){this.editor=t,this.announceRedoCallback=e,this.announceUndoCallback=n,this.undoStack=[],this.redoStack=[]}fireUpdateEvent(){this.editor.notifier.dispatch(S.UndoRedoStackUpdated,{kind:S.UndoRedoStackUpdated,undoStackSize:this.undoStack.length,redoStackSize:this.redoStack.length})}push(t,e=!0){e&&t.apply(this.editor),this.undoStack.push(t),this.redoStack=[],this.fireUpdateEvent()}undo(){const t=this.undoStack.pop();t&&(this.redoStack.push(t),t.unapply(this.editor),this.announceUndoCallback(t)),this.fireUpdateEvent()}redo(){const t=this.redoStack.pop();t&&(this.undoStack.push(t),t.apply(this.editor),this.announceRedoCallback(t)),this.fireUpdateEvent()}get undoStackSize(){return this.undoStack.length}get redoStackSize(){return this.redoStack.length}};class Dt{constructor(){this.listeners={}}dispatch(t,e){const n=this.listeners[t];if(n)for(let t=0;t<n.length;t++)n[t](e)}on(t,e){return this.listeners[t]\|\|(this.listeners[t]=[]),this.listeners[t].push(e),{remove:()=>{const n=this.listeners[t];return this.off(t,e),n.length!==this.listeners[t].length}}}off(t,e){const n=this.listeners[t];n&&(this.listeners[t]=n.filter((t=>t!==e)))}}var Ot=function(t,e,n){var r,i,o,s,a,l,c,h,d,u,p,f,m,g,v,b=e.createElement("canvas").getContext("2d"),x={r:0,g:0,b:0,h:0,s:0,v:0,a:1},y={el:"[data-coloris]",parent:"body",theme:"default",themeMode:"light",wrap:!0,margin:2,format:"hex",formatToggle:!1,swatches:[],swatchesOnly:!1,alpha:!0,forceAlpha:!1,focusInput:!0,selectInput:!1,inline:!1,defaultColor:"#000000",clearButton:!1,clearLabel:"Clear",a11y:{open:"Open color picker",close:"Close color picker",marker:"Saturation: {s}. Brightness: {v}.",hueSlider:"Hue slider",alphaSlider:"Opacity slider",input:"Color value field",format:"Color format",swatch:"Color swatch",instruction:"Saturation and brightness selector. Use up, down, left and right arrow keys to select."}},w={},k="",P={},T=!1;function C(n){if("object"==typeof n)for(var s in n)switch(s){case"el":B(n.el),!1!==n.wrap&&L(n.el);break;case"parent":(r=e.querySelector(n.parent))&&(r.appendChild(i),y.parent=n.parent,r===e.body&&(r=null));break;case"themeMode":y.themeMode=n.themeMode,"auto"===n.themeMode&&t.matchMedia&&t.matchMedia("(prefers-color-scheme: dark)").matches&&(y.themeMode="dark");case"theme":n.theme&&(y.theme=n.theme),i.className="clr-picker clr-"+y.theme+" clr-"+y.themeMode,y.inline&&R();break;case"margin":n.margin=1,y.margin=isNaN(n.margin)?y.margin:n.margin;break;case"wrap":n.el&&n.wrap&&L(n.el);break;case"formatToggle":y.formatToggle=!!n.formatToggle,G("clr-format").style.display=y.formatToggle?"block":"none",y.formatToggle&&(y.format="auto");break;case"swatches":Array.isArray(n.swatches)&&function(){var t=[];n.swatches.forEach((function(e,n){t.push('<button type="button" id="clr-swatch-'+n+'" aria-labelledby="clr-swatch-label clr-swatch-'+n+'" style="color: '+e+';">'+e+"</button>")})),G("clr-swatches").innerHTML=t.length?"<div>"+t.join("")+"</div>":"",y.swatches=n.swatches.slice()}();break;case"swatchesOnly":y.swatchesOnly=!!n.swatchesOnly,i.setAttribute("data-minimal",y.swatchesOnly);break;case"alpha":y.alpha=!!n.alpha,i.setAttribute("data-alpha",y.alpha);break;case"inline":if(y.inline=!!n.inline,i.setAttribute("data-inline",y.inline),y.inline){var a=n.defaultColor\|\|y.defaultColor;g=I(a),R(),M(a)}break;case"clearButton":"object"==typeof n.clearButton&&(n.clearButton.label&&(y.clearLabel=n.clearButton.label,h.innerHTML=y.clearLabel),n.clearButton=n.clearButton.show),y.clearButton=!!n.clearButton,h.style.display=y.clearButton?"block":"none";break;case"clearLabel":y.clearLabel=n.clearLabel,h.innerHTML=y.clearLabel;break;case"a11y":var u=n.a11y,f=!1;if("object"==typeof u)for(var m in u)u[m]&&y.a11y[m]&&(y.a11y[m]=u[m],f=!0);if(f){var v=G("clr-open-label"),b=G("clr-swatch-label");v.innerHTML=y.a11y.open,b.innerHTML=y.a11y.swatch,l.setAttribute("aria-label",y.a11y.close),d.setAttribute("aria-label",y.a11y.hueSlider),p.setAttribute("aria-label",y.a11y.alphaSlider),c.setAttribute("aria-label",y.a11y.input),o.setAttribute("aria-label",y.a11y.instruction)}default:y[s]=n[s]}}function E(t,e){"string"==typeof t&&"object"==typeof e&&(w[t]=e,T=!0)}function S(t){delete w[t],0===Object.keys(w).length&&(T=!1,t===k&&z())}function z(){Object.keys(P).length>0&&(C(P),k="",P={})}function B(t){W(e,"click",t,(function(t){y.inline\|\|(function(t){if(T){var e=["el","wrap","inline","defaultColor","a11y"],n=function(n){var r=w[n];if(t.matches(n)){for(var i in k=n,P={},e.forEach((function(t){return delete r[t]})),r)P[i]=Array.isArray(y[i])?y[i].slice():y[i];return C(r),"break"}};for(var r in w)if("break"===n(r))break}}(t.target),m=t.target,v=m.value,g=I(v),i.classList.add("clr-open"),R(),M(v),(y.focusInput\|\|y.selectInput)&&c.focus({preventScroll:!0}),y.selectInput&&c.select(),m.dispatchEvent(new Event("open",{bubbles:!0})))})),W(e,"input",t,(function(t){var e=t.target.parentNode;e.classList.contains("clr-field")&&(e.style.color=t.target.value)}))}function R(){var n,a,l,c=r,h=t.scrollY,d=i.offsetWidth,u=i.offsetHeight,p={left:!1,top:!1},f={x:0,y:0};if(c&&(n=t.getComputedStyle(c),a=parseFloat(n.marginTop),l=parseFloat(n.borderTopWidth),(f=c.getBoundingClientRect()).y+=l+h),!y.inline){var g=m.getBoundingClientRect(),v=g.x,b=h+g.y+g.height+y.margin;c?(v-=f.x,b-=f.y,v+d>c.clientWidth&&(v+=g.width-d,p.left=!0),b+u>c.clientHeight-a&&u+y.margin<=g.top-(f.y-h)&&(b-=g.height+u+2y.margin,p.top=!0),b+=c.scrollTop):(v+d>e.documentElement.clientWidth&&(v+=g.width-d,p.left=!0),b+u-h>e.documentElement.clientHeight&&u+y.margin<=g.top&&(b=h+g.y-u-y.margin,p.top=!0)),i.classList.toggle("clr-left",p.left),i.classList.toggle("clr-top",p.top),i.style.left=v+"px",i.style.top=b+"px"}s={width:o.offsetWidth,height:o.offsetHeight,x:i.offsetLeft+o.offsetLeft+f.x,y:i.offsetTop+o.offsetTop+f.y}}function L(t){e.querySelectorAll(t).forEach((function(t){var n=t.parentNode;if(!n.classList.contains("clr-field")){var r=e.createElement("div");r.innerHTML='<button type="button" aria-labelledby="clr-open-label"></button>',n.insertBefore(r,t),r.setAttribute("class","clr-field"),r.style.color=t.value,r.appendChild(t)}}))}function A(t){m&&!y.inline&&(t&&v!==m.value&&(m.value=v,m.dispatchEvent(new Event("input",{bubbles:!0}))),v!==m.value&&m.dispatchEvent(new Event("change",{bubbles:!0})),i.classList.remove("clr-open"),T&&z(),m.dispatchEvent(new Event("close",{bubbles:!0})),y.focusInput&&m.focus({preventScroll:!0}),m=null)}function M(t){var e=function(t){var e,n,r=/^((rgba)\|rgb)[\D]+([\d.]+)[\D]+([\d.]+)[\D]+([\d.]+)[\D]?([\d.]+\|$)/i;return b.fillStyle="#000",b.fillStyle=t,(e=r.exec(b.fillStyle))?(n={r:1e[3],g:1e[4],b:1e[5],a:1e[6]}).a=+n.a.toFixed(2):n={r:(e=b.fillStyle.replace("#","").match(/.{2}/g).map((function(t){return parseInt(t,16)})))[0],g:e[1],b:e[2],a:1},n}(t),r=function(t){var e=t.r/255,r=t.g/255,i=t.b/255,o=n.max(e,r,i),s=n.min(e,r,i),a=o-s,l=o,c=0,h=0;return a&&(o===e&&(c=(r-i)/a),o===r&&(c=2+(i-e)/a),o===i&&(c=4+(e-r)/a),o&&(h=a/o)),{h:(c=n.floor(60c))<0?c+360:c,s:n.round(100h),v:n.round(100l),a:t.a}}(e);j(r.s,r.v),$(e,r),d.value=r.h,i.style.color="hsl("+r.h+", 100%, 50%)",u.style.left=r.h/360100+"%",a.style.left=s.widthr.s/100+"px",a.style.top=s.height-s.heightr.v/100+"px",p.value=100r.a,f.style.left=100r.a+"%"}function I(t){var e=t.substring(0,3).toLowerCase();return"rgb"===e\|\|"hsl"===e?e:"hex"}function D(t){t=void 0!==t?t:c.value,m&&(m.value=t,m.dispatchEvent(new Event("input",{bubbles:!0}))),e.dispatchEvent(new CustomEvent("coloris:pick",{detail:{color:t}}))}function O(t,e){var r={h:1d.value,s:t/s.width100,v:100-e/s.height100,a:p.value/100},i=function(t){var e=t.s/100,r=t.v/100,i=er,o=t.h/60,s=i(1-n.abs(o%2-1)),a=r-i;i+=a,s+=a;var l=n.floor(o)%6,c=[i,s,a,a,s,i][l],h=[s,i,i,s,a,a][l],d=[a,a,s,i,i,s][l];return{r:n.round(255c),g:n.round(255h),b:n.round(255d),a:t.a}}(r);j(r.s,r.v),$(i,r),D()}function j(t,e){var n=y.a11y.marker;t=1t.toFixed(1),e=1e.toFixed(1),n=(n=n.replace("{s}",t)).replace("{v}",e),a.setAttribute("aria-label",n)}function N(t){var e=function(t){return{pageX:t.changedTouches?t.changedTouches[0].pageX:t.pageX,pageY:t.changedTouches?t.changedTouches[0].pageY:t.pageY}}(t),n=e.pageX-s.x,i=e.pageY-s.y;r&&(i+=r.scrollTop),n=n<0?0:n>s.width?s.width:n,i=i<0?0:i>s.height?s.height:i,a.style.left=n+"px",a.style.top=i+"px",O(n,i),t.preventDefault(),t.stopPropagation()}function V(t,e){var n=1a.style.left.replace("px","")+t,r=1a.style.top.replace("px","")+e;a.style.left=n+"px",a.style.top=r+"px",O(n,r)}function $(t,r){void 0===t&&(t={}),void 0===r&&(r={});var i=y.format;for(var s in t)x[s]=t[s];for(var h in r)x[h]=r[h];var d,u=function(t){var e=t.r.toString(16),n=t.g.toString(16),r=t.b.toString(16),i="";if(t.r<16&&(e="0"+e),t.g<16&&(n="0"+n),t.b<16&&(r="0"+r),y.alpha&&(t.a<1\|\|y.forceAlpha)){var o=255t.a\|0;i=o.toString(16),o<16&&(i="0"+i)}return"#"+e+n+r+i}(x),p=u.substring(0,7);switch(a.style.color=p,f.parentNode.style.color=p,f.style.color=u,l.style.color=u,o.style.display="none",o.offsetHeight,o.style.display="",f.nextElementSibling.style.display="none",f.nextElementSibling.offsetHeight,f.nextElementSibling.style.display="","mixed"===i?i=1===x.a?"hex":"rgb":"auto"===i&&(i=g),i){case"hex":c.value=u;break;case"rgb":c.value=function(t){return!y.alpha\|\|1===t.a&&!y.forceAlpha?"rgb("+t.r+", "+t.g+", "+t.b+")":"rgba("+t.r+", "+t.g+", "+t.b+", "+t.a+")"}(x);break;case"hsl":c.value=(d=function(t){var e,r=t.v/100,i=r(1-t.s/100/2);return i>0&&i<1&&(e=n.round((r-i)/n.min(i,1-i)100)),{h:t.h,s:e\|\|0,l:n.round(100i),a:t.a}}(x),!y.alpha\|\|1===d.a&&!y.forceAlpha?"hsl("+d.h+", "+d.s+"%, "+d.l+"%)":"hsla("+d.h+", "+d.s+"%, "+d.l+"%, "+d.a+")")}e.querySelector('.clr-format [value="'+i+'"]').checked=!0}function F(){var t=1d.value,e=1a.style.left.replace("px",""),n=1a.style.top.replace("px","");i.style.color="hsl("+t+", 100%, 50%)",u.style.left=t/360100+"%",O(e,n)}function U(){var t=p.value/100;f.style.left=100t+"%",$({a:t}),D()}function _(){r=null,(i=e.createElement("div")).setAttribute("id","clr-picker"),i.className="clr-picker",i.innerHTML='<input id="clr-color-value" class="clr-color" type="text" value="" spellcheck="false" aria-label="'+y.a11y.input+'"><div id="clr-color-area" class="clr-gradient" role="application" aria-label="'+y.a11y.instruction+'"><div id="clr-color-marker" class="clr-marker" tabindex="0"></div></div><div class="clr-hue"><input id="clr-hue-slider" type="range" min="0" max="360" step="1" aria-label="'+y.a11y.hueSlider+'"><div id="clr-hue-marker"></div></div><div class="clr-alpha"><input id="clr-alpha-slider" type="range" min="0" max="100" step="1" aria-label="'+y.a11y.alphaSlider+'"><div id="clr-alpha-marker"></div><span></span></div><div id="clr-format" class="clr-format"><fieldset class="clr-segmented"><legend>'+y.a11y.format+'</legend><input id="clr-f1" type="radio" name="clr-format" value="hex"><label for="clr-f1">Hex</label><input id="clr-f2" type="radio" name="clr-format" value="rgb"><label for="clr-f2">RGB</label><input id="clr-f3" type="radio" name="clr-format" value="hsl"><label for="clr-f3">HSL</label><span></span></fieldset></div><div id="clr-swatches" class="clr-swatches"></div><button type="button" id="clr-clear" class="clr-clear">'+y.clearLabel+'</button><button type="button" id="clr-color-preview" class="clr-preview" aria-label="'+y.a11y.close+'"></button><span id="clr-open-label" hidden>'+y.a11y.open+'</span><span id="clr-swatch-label" hidden>'+y.a11y.swatch+"</span>",e.body.appendChild(i),o=G("clr-color-area"),a=G("clr-color-marker"),h=G("clr-clear"),l=G("clr-color-preview"),c=G("clr-color-value"),d=G("clr-hue-slider"),u=G("clr-hue-marker"),p=G("clr-alpha-slider"),f=G("clr-alpha-marker"),B(y.el),L(y.el),W(i,"mousedown",(function(t){i.classList.remove("clr-keyboard-nav"),t.stopPropagation()})),W(o,"mousedown",(function(t){W(e,"mousemove",N)})),W(o,"touchstart",(function(t){e.addEventListener("touchmove",N,{passive:!1})})),W(a,"mousedown",(function(t){W(e,"mousemove",N)})),W(a,"touchstart",(function(t){e.addEventListener("touchmove",N,{passive:!1})})),W(c,"change",(function(t){M(c.value),D()})),W(h,"click",(function(t){D(""),A()})),W(l,"click",(function(t){D(),A()})),W(e,"click",".clr-format input",(function(t){g=t.target.value,$(),D()})),W(i,"click",".clr-swatches button",(function(t){M(t.target.textContent),D(),y.swatchesOnly&&A()})),W(e,"mouseup",(function(t){e.removeEventListener("mousemove",N)})),W(e,"touchend",(function(t){e.removeEventListener("touchmove",N)})),W(e,"mousedown",(function(t){i.classList.remove("clr-keyboard-nav"),A()})),W(e,"keydown",(function(t){"Escape"===t.key?A(!0):"Tab"===t.key&&i.classList.add("clr-keyboard-nav")})),W(e,"click",".clr-field button",(function(t){T&&z(),t.target.nextElementSibling.dispatchEvent(new Event("click",{bubbles:!0}))})),W(a,"keydown",(function(t){var e={ArrowUp:[0,-1],ArrowDown:[0,1],ArrowLeft:[-1,0],ArrowRight:[1,0]};-1!==Object.keys(e).indexOf(t.key)&&(V.apply(void 0,e[t.key]),t.preventDefault())})),W(o,"click",N),W(d,"input",F),W(p,"input",U)}function G(t){return e.getElementById(t)}function W(t,e,n,r){var i=Element.prototype.matches\|\|Element.prototype.msMatchesSelector;"string"==typeof n?t.addEventListener(e,(function(t){i.call(t.target,n)&&r.call(t.target,t)})):(r=n,t.addEventListener(e,r))}function H(t,n){n=void 0!==n?n:[],"loading"!==e.readyState?t.apply(void 0,n):e.addEventListener("DOMContentLoaded",(function(){t.apply(void 0,n)}))}void 0!==NodeList&&NodeList.prototype&&!NodeList.prototype.forEach&&(NodeList.prototype.forEach=Array.prototype.forEach);var Z=function(){var t={init:_,set:C,wrap:L,close:A,setInstance:E,removeInstance:S,updatePosition:R};function e(t){H((function(){t&&("string"==typeof t?B(t):C(t))}))}var n=function(n){e[n]=function(){for(var e=arguments.length,r=new Array(e),i=0;i<e;i++)r[i]=arguments[i];H(t[n],r)}};for(var r in t)n(r);return e}();return Z.coloris=Z,Z}(window,document,Math),jt=Ot.coloris,Nt=Ot.init;Ot.set,Ot.wrap,Ot.close;const Vt=(t,e)=>{var n,r,i,o,s;return t===e\|\|t.fill.eq(e.fill)&&(null===(r=null===(n=t.stroke)\|\|void 0===n?void 0:n.color)\|\|void 0===r?void 0:r.eq(null===(i=e.stroke)\|\|void 0===i?void 0:i.color))&&(null===(o=t.stroke)\|\|void 0===o?void 0:o.width)===(null===(s=e.stroke)\|\|void 0===s?void 0:s.width)};class $t{constructor(t){this.viewport=t,this.objectLevel=0,this.currentPaths=null}setDraftMode(t){}flushPath(){if(!this.currentPaths)return;let t=null;for(const e of this.currentPaths){const{startPoint:n,commands:r,style:i}=e;t&&Vt(t,i)?this.moveTo(n):(t&&this.endPath(t),this.beginPath(n),t=i);for(const t of r)t.kind===mt.LineTo?this.lineTo(t.point):t.kind===mt.MoveTo?this.moveTo(t.point):t.kind===mt.CubicBezierTo?this.traceCubicBezierCurve(t.controlPoint1,t.controlPoint2,t.endPoint):t.kind===mt.QuadraticBezierTo&&this.traceQuadraticBezierCurve(t.controlPoint,t.endPoint)}t&&this.endPath(t)}drawPath(t){0===this.objectLevel?(this.currentPaths=[t],this.flushPath(),this.currentPaths=null):this.currentPaths.push(t)}drawRect(t,e,n){const r=gt.fromRect(t,e);this.drawPath(r.toRenderable(n))}startObject(t){this.currentPaths=[],this.objectLevel++}endObject(){if(this.flushPath(),this.currentPaths=null,this.objectLevel--,this.objectLevel<0)throw new Error("More objects have ended than have been started (negative object nesting level)!")}getNestingLevel(){return this.objectLevel}}const Ft="http://www.w3.org/2000/svg";class Ut extends $t{constructor(t,e){super(e),this.elem=t,this.overwrittenAttrs={},this.clear()}setRootSVGAttribute(t,e){t in this.overwrittenAttrs\|\|(this.overwrittenAttrs[t]=this.elem.getAttribute(t)),null!==e?this.elem.setAttribute(t,e):this.elem.removeAttribute(t)}displaySize(){return y.of(this.elem.clientWidth,this.elem.clientHeight)}clear(){this.mainGroup=document.createElementNS(Ft,"g");for(const t in this.overwrittenAttrs){const e=this.overwrittenAttrs[t];e?this.elem.setAttribute(t,e):this.elem.removeAttribute(t)}this.overwrittenAttrs={},this.elem.replaceChildren(this.mainGroup)}beginPath(t){var e;this.currentPath=[],this.pathStart=this.viewport.canvasToScreen(t),null!==(e=this.lastPathStart)&&void 0!==e\|\|(this.lastPathStart=this.pathStart)}endPath(t){var e;if(null==this.currentPath)throw new Error("No path exists to end! Make sure beginPath was called!");t.fill.eq(null===(e=this.lastPathStyle)\|\|void 0===e?void 0:e.fill)&&null!=this.lastPath?(this.lastPath.push({kind:mt.MoveTo,point:this.pathStart},...this.currentPath),this.pathStart=null,this.currentPath=null):(this.addPathToSVG(),this.lastPathStart=this.pathStart,this.lastPathStyle=t,this.lastPath=this.currentPath,this.pathStart=null,this.currentPath=null)}addPathToSVG(){if(!this.lastPathStyle\|\|!this.lastPath)return;const t=document.createElementNS(Ft,"path");t.setAttribute("d",gt.toString(this.lastPathStart,this.lastPath));const e=this.lastPathStyle;t.setAttribute("fill",e.fill.toHexString()),e.stroke&&(t.setAttribute("stroke",e.stroke.color.toHexString()),t.setAttribute("stroke-width",e.stroke.width.toString())),this.mainGroup.appendChild(t)}startObject(t){super.startObject(t),this.lastPath=null,this.lastPathStart=null,this.lastPathStyle=null}endObject(){super.endObject(),this.addPathToSVG()}lineTo(t){t=this.viewport.canvasToScreen(t),this.currentPath.push({kind:mt.LineTo,point:t})}moveTo(t){t=this.viewport.canvasToScreen(t),this.currentPath.push({kind:mt.MoveTo,point:t})}traceCubicBezierCurve(t,e,n){t=this.viewport.canvasToScreen(t),e=this.viewport.canvasToScreen(e),n=this.viewport.canvasToScreen(n),this.currentPath.push({kind:mt.CubicBezierTo,controlPoint1:t,controlPoint2:e,endPoint:n})}traceQuadraticBezierCurve(t,e){t=this.viewport.canvasToScreen(t),e=this.viewport.canvasToScreen(e),this.currentPath.push({kind:mt.QuadraticBezierTo,controlPoint:t,endPoint:e})}drawPoints(...t){t.map((t=>{const e=document.createElementNS(Ft,"circle");e.setAttribute("cx",`${t.x}`),e.setAttribute("cy",`${t.y}`),e.setAttribute("r","15"),this.mainGroup.appendChild(e)}))}drawSVGElem(t){this.elem.appendChild(t.cloneNode(!0))}}const _t=(t,e)=>new Gt(t);class Gt{constructor(t){this.startPoint=t,this.endPoint=t}getLineWidth(){return Math.max(this.endPoint.width,this.startPoint.width)}getBBox(){return this.buildPreview().getBBox()}buildPreview(){const t=this.startPoint.pos,e=this.endPoint.pos,n=e.minus(t).normalized(),r=e.minus(t).length(),i=Math.min(this.getLineWidth(),r/2),o=this.startPoint.width/2,s=this.endPoint.width/2,a=e.minus(n.times(i)),l=n.orthog(),c=l.times(o),h=l.times(s);return new bt([{startPoint:a.minus(h),commands:[{kind:mt.LineTo,point:t.minus(c)},{kind:mt.LineTo,point:t.plus(c)},{kind:mt.LineTo,point:a.plus(h)},{kind:mt.LineTo,point:a.plus(l.times(i).plus(h))},{kind:mt.LineTo,point:e.plus(n.times(s))},{kind:mt.LineTo,point:a.plus(l.times(-i).minus(h))},{kind:mt.LineTo,point:a.minus(h)}],style:{fill:this.startPoint.color}}])}build(){return this.buildPreview()}preview(t){this.buildPreview().render(t)}addPoint(t){this.endPoint=t}}const Wt=(t,e)=>new Ht(t);class Ht{constructor(t){this.startPoint=t,this.endPoint=t}getBBox(){return this.buildPreview().getBBox()}buildPreview(){const t=this.startPoint.pos,e=this.endPoint.pos,n=e.minus(t).normalized(),r=this.startPoint.width/2,i=this.endPoint.width/2,o=n.orthog(),s=o.times(r),a=o.times(i);return new bt([{startPoint:t.minus(s),commands:[{kind:mt.LineTo,point:t.plus(s)},{kind:mt.LineTo,point:e.plus(a)},{kind:mt.LineTo,point:e.minus(a)}],style:{fill:this.startPoint.color}}])}build(){return this.buildPreview()}preview(t){this.buildPreview().render(t)}addPoint(t){this.endPoint=t}}const Zt=(t,e)=>new Xt(t,!0),qt=(t,e)=>new Xt(t,!1);class Xt{constructor(t,e){this.startPoint=t,this.filled=e,this.endPoint=t}getBBox(){return this.buildPreview().getBBox()}buildPreview(){const t=this.startPoint.pos,e=this.endPoint.pos,n=gt.fromRect(k.fromCorners(t,e),this.filled?null:this.endPoint.width);return new bt([n.toRenderable({fill:this.endPoint.color})])}build(){return this.buildPreview()}preview(t){this.buildPreview().render(t)}addPoint(t){this.endPoint=t}}const Qt={pen:"Pen",eraser:"Eraser",select:"Select",touchDrawing:"Touch Drawing",thicknessLabel:"Thickness: ",colorLabel:"Color: ",resizeImageToSelection:"Resize image to selection",deleteSelection:"Delete selection",undo:"Undo",redo:"Redo",selectObjectType:"Object type: ",freehandPen:"Freehand",arrowPen:"Arrow",linePen:"Line",outlinedRectanglePen:"Outlined rectangle",filledRectanglePen:"Filled rectangle",dropdownShown:t=>`Dropdown for ${t} shown`,dropdownHidden:t=>`Dropdown for ${t} hidden`},Yt="\n\tstyle='fill: var(--primary-foreground-color);'\n",Kt="\n\tstyle='fill: var(--primary-foreground-color); stroke: var(--primary-foreground-color);'\n",Jt="http://www.w3.org/2000/svg";class te{constructor(t,e,n){this.editor=t,this.targetTool=e,this.localizationTable=n,this.icon=null,this.container=document.createElement("div"),this.container.classList.add("toolbar-toolContainer"),this.dropdownContainer=document.createElement("div"),this.dropdownContainer.classList.add("toolbar-dropdown"),this.dropdownContainer.classList.add("hidden"),this.hasDropdown=!1,this.button=document.createElement("div"),this.button.classList.add("toolbar-button"),this.label=document.createElement("label"),this.button.setAttribute("role","button"),this.button.tabIndex=0,this.button.onclick=()=>{this.handleClick()},t.notifier.on(S.ToolEnabled,(t=>{if(t.kind!==S.ToolEnabled)throw new Error("Incorrect event type! (Expected ToolEnabled)");t.tool===e&&this.updateSelected(!0)})),t.notifier.on(S.ToolDisabled,(t=>{if(t.kind!==S.ToolDisabled)throw new Error("Incorrect event type! (Expected ToolDisabled)");t.tool===e&&(this.updateSelected(!1),this.setDropdownVisible(!1))}))}handleClick(){this.hasDropdown?this.targetTool.isEnabled()?this.setDropdownVisible(!this.isDropdownVisible()):this.targetTool.setEnabled(!0):this.targetTool.setEnabled(!this.targetTool.isEnabled())}addTo(t){this.label.innerText=this.getTitle(),this.icon=null,this.updateIcon(),this.updateSelected(this.targetTool.isEnabled()),this.button.replaceChildren(this.icon,this.label),this.container.appendChild(this.button),this.hasDropdown=this.fillDropdown(this.dropdownContainer),this.hasDropdown&&(this.dropdownIcon=this.createDropdownIcon(),this.button.appendChild(this.dropdownIcon),this.container.appendChild(this.dropdownContainer)),this.setDropdownVisible(!1),t.appendChild(this.container)}updateIcon(){var t;const e=this.createIcon();null===(t=this.icon)\|\|void 0===t\|\|t.replaceWith(e),this.icon=e,this.icon.classList.add("toolbar-icon")}updateSelected(t){this.container.classList.contains("selected")!==t&&(t?(this.container.classList.add("selected"),this.button.ariaSelected="true"):(this.container.classList.remove("selected"),this.button.ariaSelected="false"))}setDropdownVisible(t){this.container.classList.contains("dropdownVisible")!==t&&(t?(this.dropdownContainer.classList.remove("hidden"),this.container.classList.add("dropdownVisible"),this.editor.announceForAccessibility(this.localizationTable.dropdownShown(this.targetTool.description))):(this.dropdownContainer.classList.add("hidden"),this.container.classList.remove("dropdownVisible"),this.editor.announceForAccessibility(this.localizationTable.dropdownHidden(this.targetTool.description))))}isDropdownVisible(){return!this.dropdownContainer.classList.contains("hidden")}createDropdownIcon(){const t=document.createElementNS(Jt,"svg");return t.innerHTML=`\n\t\t<g>\n\t\t\t<path\n\t\t\t\td='M5,10 L50,90 L95,10 Z'\n\t\t\t\t${Yt}\n\t\t\t/>\n\t\t</g>\n\t\t`,t.classList.add("toolbar-showHideDropdownIcon"),t.setAttribute("viewBox","0 0 100 100"),t}}class ee extends te{getTitle(){return this.localizationTable.eraser}createIcon(){const t=document.createElementNS(Jt,"svg");return t.innerHTML=`\n\t\t<g>\n\t\t\t<rect x=10 y=50 width=80 height=30 rx=10 fill='pink' />\n\t\t\t<rect\n\t\t\t\tx=10 y=10 width=80 height=50\n\t\t\t\t${Yt}\n\t\t\t/>\n\t\t</g>\n\t\t`,t.setAttribute("viewBox","0 0 100 100"),t}fillDropdown(t){return!1}}class ne extends te{constructor(t,e,n){super(t,e,n),this.tool=e}getTitle(){return this.localizationTable.select}createIcon(){const t=document.createElementNS(Jt,"svg");return t.innerHTML="\n\t\t<g>\n\t\t\t<rect x=10 y=10 width=70 height=70 fill='pink' stroke='black'/>\n\t\t\t<rect x=75 y=75 width=10 height=10 fill='white' stroke='black'/>\n\t\t</g>\n\t\t",t.setAttribute("viewBox","0 0 100 100"),t}fillDropdown(t){const e=document.createElement("div"),n=document.createElement("button"),r=document.createElement("button");return n.innerText=this.localizationTable.resizeImageToSelection,n.disabled=!0,r.innerText=this.localizationTable.deleteSelection,r.disabled=!0,n.onclick=()=>{const t=this.tool.getSelection();this.editor.dispatch(this.editor.setImportExportRect(t.region))},r.onclick=()=>{const t=this.tool.getSelection();this.editor.dispatch(t.deleteSelectedObjects()),this.tool.clearSelection()},this.editor.notifier.on(S.ToolUpdated,(t=>{if(t.kind!==S.ToolUpdated)throw new Error("Invalid event type!");if(t.tool===this.tool){const t=this.tool.getSelection(),e=t&&t.region.area>0;n.disabled=!e,r.disabled=n.disabled}})),e.replaceChildren(n,r),t.appendChild(e),!0}}class re extends te{getTitle(){return this.localizationTable.touchDrawing}createIcon(){const t=document.createElementNS(Jt,"svg");return t.innerHTML=`\n\t\t<g>\n\t\t\t<path d='M11,-30 Q0,10 20,20 Q40,20 40,-30 Z' fill='blue' stroke='black'/>\n\t\t\t<path d='\n\t\t\t\tM0,90 L0,50 Q5,40 10,50\n\t\t\t\tL10,20 Q20,15 30,20\n\t\t\t\tL30,50 Q50,40 80,50\n\t\t\t\tL80,90 L10,90 Z'\n\t\t\t\t\n\t\t\t\t${Kt}\n\t\t\t/>\n\t\t</g>\n\t\t`,t.setAttribute("viewBox","-10 -30 100 100"),t}fillDropdown(t){return!1}updateSelected(t){t?this.container.classList.remove("selected"):this.container.classList.add("selected")}}class ie extends te{constructor(t,e,n,r){super(t,e,n),this.tool=e,this.penTypes=r,this.updateInputs=()=>{},this.editor.notifier.on(S.ToolUpdated,(t=>{if(t.kind!==S.ToolUpdated)throw new Error("Invalid event type!");t.tool===this.tool&&(this.updateIcon(),this.updateInputs())}))}getTitle(){return this.targetTool.description}makePenIcon(t){const e=Math.round(2Math.sqrt(this.tool.getThickness())),n=this.tool.getColor(),r=`M14,63 L${50-e},95 L${50+e},90 L88,60 Z`,i=`M14,63 L${50-e},85 L${50+e},83 L88,60 Z`;t.innerHTML=`\n\t\t<defs>\n\t\t\t<pattern\n\t\t\t\tid='checkerboard'\n\t\t\t\tviewBox='0,0,10,10'\n\t\t\t\twidth='20%'\n\t\t\t\theight='20%'\n\t\t\t\tpatternUnits='userSpaceOnUse'\n\t\t\t>\n\t\t\t\t<rect x=0 y=0 width=10 height=10 fill='white'/>\n\t\t\t\t<rect x=0 y=0 width=5 height=5 fill='gray'/>\n\t\t\t\t<rect x=5 y=5 width=5 height=5 fill='gray'/>\n\t\t\t</pattern>\n\t\t</defs>\n\t\t<g>\n\t\t\t\x3c!-- Pen grip --\x3e\n\t\t\t<path\n\t\t\t\td='M10,10 L90,10 L90,60 L${50+e},80 L${50-e},80 L10,60 Z'\n\t\t\t\t${Kt}\n\t\t\t/>\n\t\t</g>\n\t\t<g>\n\t\t\t\x3c!-- Checkerboard background for slightly transparent pens --\x3e\n\t\t\t<path d='${i}' fill='url(#checkerboard)'/>\n\n\t\t\t\x3c!-- Actual pen tip --\x3e\n\t\t\t<path\n\t\t\t\td='${r}'\n\t\t\t\tfill='${n.toHexString()}'\n\t\t\t\tstroke='${n.toHexString()}'\n\t\t\t/>\n\t\t</g>\n\t\t`}makeDrawnIcon(t){const e=this.tool.getStrokeFactory(),n=this.tool.getThickness(),r=(new Date).getTime(),i={pos:y.of(10,10),width:n/5,color:this.tool.getColor(),time:r-100},o={pos:y.of(90,90),width:n/5,color:this.tool.getColor(),time:r},s=e(i,this.editor.viewport);s.addPoint(o);const a=new $(new Dt);a.updateScreenSize(y.of(100,100));const l=new Ut(t,a);s.preview(l)}createIcon(){const t=document.createElementNS(Jt,"svg");t.setAttribute("viewBox","0 0 100 100");return this.tool.getStrokeFactory()===xt?this.makePenIcon(t):this.makeDrawnIcon(t),t}fillDropdown(t){const e=document.createElement("div"),n=document.createElement("div"),r=document.createElement("div"),i=document.createElement("label"),o=document.createElement("input"),s=document.createElement("label"),a=document.createElement("select");o.id="toolbar-thicknessInput"+ie.idCounter++,a.id="toolbar-builderSelect"+ie.idCounter++,i.innerText=this.localizationTable.thicknessLabel,i.setAttribute("for",o.id),s.innerText=this.localizationTable.selectObjectType,s.setAttribute("for",a.id),o.type="range",o.min="1",o.max="20",o.step="1",o.oninput=()=>{this.tool.setThickness(Math.pow(parseFloat(o.value),2))},n.appendChild(i),n.appendChild(o),a.oninput=()=>{const t=parseInt(a.value);t<0\|\|t>=this.penTypes.length?console.error("Invalid pen type index",t):this.tool.setStrokeFactory(this.penTypes[t].factory)},r.appendChild(s),r.appendChild(a);const l=document.createElement("div"),c=document.createElement("label"),h=document.createElement("input");return h.id="toolbar-colorInput"+ie.idCounter++,c.innerText=this.localizationTable.colorLabel,c.setAttribute("for",h.id),h.className="coloris_input",h.type="button",h.oninput=()=>{this.tool.setColor(Rt.fromHex(h.value))},h.addEventListener("open",(()=>{this.editor.notifier.dispatch(S.ColorPickerToggled,{kind:S.ColorPickerToggled,open:!0})})),h.addEventListener("close",(()=>{this.editor.notifier.dispatch(S.ColorPickerToggled,{kind:S.ColorPickerToggled,open:!1})})),l.appendChild(c),l.appendChild(h),this.updateInputs=()=>{h.value=this.tool.getColor().toHexString(),o.value=Math.sqrt(this.tool.getThickness()).toString(),a.replaceChildren();for(let t=0;t<this.penTypes.length;t++){const e=this.penTypes[t],n=document.createElement("option");n.value=t.toString(),n.innerText=e.name,a.appendChild(n),e.factory===this.tool.getStrokeFactory()&&(a.value=t.toString())}},this.updateInputs(),e.replaceChildren(l,n,r),t.replaceChildren(e),!0}}ie.idCounter=0;class oe{constructor(t,e,n=Qt){this.editor=t,this.localizationTable=n,this.container=document.createElement("div"),this.container.classList.add("toolbar-root"),this.container.setAttribute("role","toolbar"),e.appendChild(this.container),Nt(),this.setupColorPickers(),this.penTypes=[{name:n.freehandPen,factory:xt},{name:n.arrowPen,factory:_t},{name:n.linePen,factory:Wt},{name:n.filledRectanglePen,factory:Zt},{name:n.outlinedRectanglePen,factory:qt}]}setupColorPickers(){const t=document.createElement("div");t.className="toolbar-closeColorPickerOverlay",this.editor.createHTMLOverlay(t),jt({el:".coloris_input",format:"hex",selectInput:!1,focusInput:!1,themeMode:"auto",swatches:[Rt.red.toHexString(),Rt.purple.toHexString(),Rt.blue.toHexString(),Rt.clay.toHexString(),Rt.black.toHexString(),Rt.white.toHexString()]}),this.editor.notifier.on(S.ColorPickerToggled,(e=>{e.kind===S.ColorPickerToggled&&(t.style.display=e.open?"block":"none")}))}addActionButton(t,e,n){const r=document.createElement("button");return r.innerText=t,r.classList.add("toolbar-toolButton"),r.onclick=e,(null!=n?n:this.container).appendChild(r),r}addUndoRedoButtons(){const t=document.createElement("div");t.classList.add("toolbar-buttonGroup");const e=this.addActionButton("Undo",(()=>{this.editor.history.undo()}),t),n=this.addActionButton("Redo",(()=>{this.editor.history.redo()}),t);this.container.appendChild(t),e.disabled=!0,n.disabled=!0,this.editor.notifier.on(S.UndoRedoStackUpdated,(t=>{if(t.kind!==S.UndoRedoStackUpdated)throw new Error("Wrong event type!");e.disabled=0===t.undoStackSize,n.disabled=0===t.redoStackSize}))}addDefaultToolWidgets(){const t=this.editor.toolController;for(const e of t.getMatchingTools(At.Pen)){if(!(e instanceof wt))throw new Error("All `Pen` tools must have kind === ToolType.Pen");new ie(this.editor,e,this.localizationTable,this.penTypes).addTo(this.container)}for(const e of t.getMatchingTools(At.Eraser)){if(!(e instanceof Tt))throw new Error("All Erasers must have kind === ToolType.Eraser!");new ee(this.editor,e,this.localizationTable).addTo(this.container)}for(const e of t.getMatchingTools(At.Selection)){if(!(e instanceof Bt))throw new Error("All SelectionTools must have kind === ToolType.Selection");new ne(this.editor,e,this.localizationTable).addTo(this.container)}for(const e of t.getMatchingTools(At.TouchPanZoom))new re(this.editor,e,this.localizationTable).addTo(this.container);this.setupColorPickers()}addDefaultActionButtons(){this.addUndoRedoButtons()}}class se extends $t{constructor(t,e){super(e),this.ctx=t,this.ignoreObjectsAboveLevel=null,this.ignoringObject=!1,this.setDraftMode(!1)}setDraftMode(t){t?(this.minSquareCurveApproxDist=64,this.minRenderSizeBothDimens=8,this.minRenderSizeAnyDimen=2):(this.minSquareCurveApproxDist=1,this.minRenderSizeBothDimens=1,this.minRenderSizeAnyDimen=0)}displaySize(){return y.of(this.ctx.canvas.clientWidth,this.ctx.canvas.clientHeight)}clear(){this.ctx.clearRect(0,0,this.ctx.canvas.width,this.ctx.canvas.height)}beginPath(t){t=this.viewport.canvasToScreen(t),this.ctx.beginPath(),this.ctx.moveTo(t.x,t.y)}endPath(t){this.ctx.fillStyle=t.fill.toHexString(),this.ctx.fill(),t.stroke&&(this.ctx.strokeStyle=t.stroke.color.toHexString(),this.ctx.lineWidth=this.viewport.getScaleFactor()t.stroke.width,this.ctx.stroke()),this.ctx.closePath()}lineTo(t){t=this.viewport.canvasToScreen(t),this.ctx.lineTo(t.x,t.y)}moveTo(t){t=this.viewport.canvasToScreen(t),this.ctx.moveTo(t.x,t.y)}traceCubicBezierCurve(t,e,n){t=this.viewport.canvasToScreen(t),e=this.viewport.canvasToScreen(e),n=this.viewport.canvasToScreen(n);const r=e.minus(t),i=n.minus(e);r.magnitudeSquared()<this.minSquareCurveApproxDist&&i.magnitudeSquared()<this.minSquareCurveApproxDist?this.ctx.lineTo(n.x,n.y):this.ctx.bezierCurveTo(t.x,t.y,e.x,e.y,n.x,n.y)}traceQuadraticBezierCurve(t,e){t=this.viewport.canvasToScreen(t),e=this.viewport.canvasToScreen(e);t.minus(e).magnitudeSquared()<this.minSquareCurveApproxDist?this.ctx.lineTo(e.x,e.y):this.ctx.quadraticCurveTo(t.x,t.y,e.x,e.y)}drawPath(t){this.ignoringObject\|\|super.drawPath(t)}startObject(t){const e=this.viewport.canvasToScreenTransform.transformVec3(t.size),n=this.minRenderSizeBothDimens,r=Math.abs(e.x)<n&&Math.abs(e.y)<n,i=this.minRenderSizeAnyDimen,o=Math.abs(e.x)<i\|\|Math.abs(e.y)<i;(r\|\|o)&&(this.ignoreObjectsAboveLevel=this.getNestingLevel(),this.ignoringObject=!0),super.startObject(t)}endObject(){super.endObject(),null!==this.ignoreObjectsAboveLevel&&this.getNestingLevel()<=this.ignoreObjectsAboveLevel&&(this.ignoreObjectsAboveLevel=null,this.ignoringObject=!1)}drawPoints(...t){for(let e=0;e<t.length;e++){const n=this.viewport.canvasToScreen(t[e]);this.ctx.beginPath(),this.ctx.arc(n.x,n.y,10,0,2Math.PI),this.ctx.fillStyle=Rt.ofRGBA(.5+Math.sin(e)/2,1,.5+Math.cos(.2e)/4,.5).toHexString(),this.ctx.fill(),this.ctx.stroke(),this.ctx.closePath(),this.ctx.textAlign="center",this.ctx.textBaseline="middle",this.ctx.fillStyle="black",this.ctx.fillText(`${e}`,n.x,n.y,20)}}}class ae extends $t{constructor(t){super(t),this.clearedCount=0,this.renderedPathCount=0,this.lastFillStyle=null,this.lastPoint=null,this.objectNestingLevel=0,this.pointBuffer=[]}displaySize(){return y.of(640,480)}clear(){if(this.clearedCount++,this.renderedPathCount=0,this.pointBuffer=[],this.objectNestingLevel>0)throw new Error(`Within an object while clearing! Nesting level: ${this.objectNestingLevel}`)}beginPath(t){this.lastPoint=t,this.pointBuffer.push(t)}endPath(t){this.renderedPathCount++,this.lastFillStyle=t}lineTo(t){this.lastPoint=t,this.pointBuffer.push(t)}moveTo(t){this.lastPoint=t,this.pointBuffer.push(t)}traceCubicBezierCurve(t,e,n){this.lastPoint=n,this.pointBuffer.push(t,e,n)}traceQuadraticBezierCurve(t,e){this.lastPoint=e,this.pointBuffer.push(t,e)}drawPoints(...t){}startObject(t){super.startObject(t),this.objectNestingLevel+=1}endObject(){super.endObject(),this.objectNestingLevel-=1}}var le;!function(t){t[t.DummyRenderer=0]="DummyRenderer",t[t.CanvasRenderer=1]="CanvasRenderer"}(le\|\|(le={}));class ce{constructor(t,e,n){if(this.editor=t,this.parent=n,e===le.CanvasRenderer)this.initializeCanvasRendering();else{if(e!==le.DummyRenderer)throw new Error(`Unknown rendering mode, ${e}!`);this.dryInkRenderer=new ae(t.viewport),this.wetInkRenderer=new ae(t.viewport)}this.editor.notifier.on(S.DisplayResized,(t=>{var e;if(t.kind!==S.DisplayResized)throw new Error("Mismatched event.kinds!");null===(e=this.resizeSurfacesCallback)\|\|void 0===e\|\|e.call(this)}))}get width(){return this.dryInkRenderer.displaySize().x}get height(){return this.dryInkRenderer.displaySize().y}initializeCanvasRendering(){const t=document.createElement("canvas"),e=document.createElement("canvas"),n=t.getContext("2d"),r=e.getContext("2d");this.dryInkRenderer=new se(n,this.editor.viewport),this.wetInkRenderer=new se(r,this.editor.viewport),t.className="dryInkCanvas",e.className="wetInkCanvas",this.parent&&(this.parent.appendChild(t),this.parent.appendChild(e)),this.resizeSurfacesCallback=()=>{const n=t=>t.clientHeight!==t.height\|\|t.clientWidth!==t.width;(n(t)\|\|n(e))&&(t.width=t.clientWidth,t.height=t.clientHeight,e.width=e.clientWidth,e.height=e.clientHeight,this.editor.notifier.dispatch(S.DisplayResized,{kind:S.DisplayResized,newSize:y.of(this.width,this.height)}))},this.resizeSurfacesCallback(),this.flattenCallback=()=>{n.drawImage(e,0,0)}}startRerender(){var t;return null===(t=this.resizeSurfacesCallback)\|\|void 0===t\|\|t.call(this),this.wetInkRenderer.clear(),this.dryInkRenderer.clear(),this.dryInkRenderer}setDraftMode(t){this.dryInkRenderer.setDraftMode(t)}getDryInkRenderer(){return this.dryInkRenderer}getWetInkRenderer(){return this.wetInkRenderer}flatten(){var t;null===(t=this.flattenCallback)\|\|void 0===t\|\|t.call(this)}}class he extends vt{constructor(t){super(),this.attrs=t,this.contentBBox=k.empty}render(t,e){if(t instanceof Ut){console.log("Rendering to SVG.",this.attrs);for(const[e,n]of this.attrs)t.setRootSVGAttribute(e,n)}}intersects(t){return!1}applyTransformation(t){}description(t){return t.svgObject}}class de extends vt{constructor(t){super(),this.svgObject=t,this.contentBBox=k.of(t.getBoundingClientRect())}render(t,e){t instanceof Ut&&t.drawSVGElem(this.svgObject)}intersects(t){return this.contentBBox.getEdges().some((e=>null!==e.intersection(t)))}applyTransformation(t){}description(t){return t.svgObject}}var ue=function(t,e,n,r){return new(n\|\|(n=Promise))((function(i,o){function s(t){try{l(r.next(t))}catch(t){o(t)}}function a(t){try{l(r.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,a)}l((r=r.apply(t,e\|\|[])).next())}))};const pe=new k(0,0,500,500);class fe{constructor(t,e){this.source=t,this.onFinish=e,this.onAddComponent=null,this.onProgress=null,this.processedCount=0,this.totalToProcess=0}getStyle(t){var e,n,r;const i={fill:Rt.transparent},o=null!==(e=t.getAttribute("fill"))&&void 0!==e?e:t.style.fill;if(o)try{i.fill=Rt.fromString(o)}catch(t){console.error("Unknown fill color,",o)}const s=null!==(n=t.getAttribute("stroke"))&&void 0!==n?n:t.style.stroke,a=null!==(r=t.getAttribute("stroke-width"))&&void 0!==r?r:t.style.strokeWidth;if(s)try{let t=parseFloat(null!=a?a:"1");isFinite(t)\|\|(t=0),i.stroke={width:t,color:Rt.fromString(s)}}catch(t){console.error("Error parsing stroke data:",t)}return i}strokeDataFromElem(t){var e;const n=[],r=null!==(e=t.getAttribute("d"))&&void 0!==e?e:"",i=this.getStyle(t),o=r.split("M");let s=!0;for(const t of o){const e=/^[0-9., \t\n]+$/.exec(t);if(""!==t&&!e){const e=s?t:`M${t}`,r=gt.fromString(e).toRenderable(i);n.push(r)}s=!1}return n}addPath(t){var e;let n;try{const e=this.strokeDataFromElem(t);n=new bt(e)}catch(e){console.error("Invalid path in node",t,"\nError:",e,"\nAdding as an unknown object."),n=new de(t)}null===(e=this.onAddComponent)\|\|void 0===e\|\|e.call(this,n)}addUnknownNode(t){var e;const n=new de(t);null===(e=this.onAddComponent)\|\|void 0===e\|\|e.call(this,n)}updateViewBox(t){const e=t.getAttribute("viewBox");if(this.rootViewBox\|\|!e)return;const n=e.split(/[ \t,]/),r=parseFloat(n[0]),i=parseFloat(n[1]),o=parseFloat(n[2]),s=parseFloat(n[3]);isNaN(r)\|\|isNaN(i)\|\|isNaN(o)\|\|isNaN(s)\|\|(this.rootViewBox=new k(r,i,o,s))}updateSVGAttrs(t){var e;null===(e=this.onAddComponent)\|\|void 0===e\|\|e.call(this,new he(this.getSourceAttrs(t)))}visit(t){var e;return ue(this,void 0,void 0,(function(){switch(this.totalToProcess+=t.childElementCount,t.tagName.toLowerCase()){case"g":break;case"path":this.addPath(t);break;case"svg":this.updateViewBox(t),this.updateSVGAttrs(t);break;default:return console.warn("Unknown SVG element,",t),t instanceof SVGElement\|\|console.warn("Element",t,"is not an SVGElement! Continuing anyway."),void this.addUnknownNode(t)}for(const e of t.children)yield this.visit(e);this.processedCount++,yield null===(e=this.onProgress)\|\|void 0===e?void 0:e.call(this,this.processedCount,this.totalToProcess)}))}getSourceAttrs(t){return t.getAttributeNames().map((e=>[e,t.getAttribute(e)]))}start(t,e){var n;return ue(this,void 0,void 0,(function(){this.onAddComponent=t,this.onProgress=e,this.totalToProcess=this.source.childElementCount,this.processedCount=0,this.rootViewBox=null,yield this.visit(this.source);const r=this.rootViewBox;let i=pe;return r&&(i=k.of(r)),null===(n=this.onFinish)\|\|void 0===n\|\|n.call(this),i}))}static fromString(t){var e,n;const r=document.createElement("iframe");if(r.src="about:blank",r.setAttribute("sandbox","allow-same-origin"),r.setAttribute("csp","default-src 'about:blank'"),r.style.display="none",document.body.appendChild(r),!r.hasAttribute("sandbox"))throw r.remove(),new Error("SVG loading iframe is not sandboxed.");const i=null!==(n=null===(e=r.contentWindow)\|\|void 0===e?void 0:e.document)&&void 0!==n?n:r.contentDocument;if(null==i)throw new Error("Unable to open a sandboxed iframe!");i.open(),i.write("\n\t\t\t<!DOCTYPE html>\n\t\t\t<html>\n\t\t\t\t<head>\n\t\t\t\t\t<title>SVG Loading Sandbox</title>\n\t\t\t\t</head>\n\t\t\t\t<body>\n\t\t\t\t\t<script>\n\t\t\t\t\t\tconsole.error('JavaScript should not be able to run here!');\n\t\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\t\t'The SVG sandbox is broken! Please double-check the sandboxing setting.'\n\t\t\t\t\t\t);\n\t\t\t\t\t<\/script>\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t"),i.close();const o=i.createElementNS("http://www.w3.org/2000/svg","svg");return o.innerHTML=t,new fe(o,(()=>{r.remove()}))}}const me={updatedViewport:"Transformed Viewport",transformedElements:t=>`Transformed ${t} element${1===t?"":"s"}`,resizeOutputCommand:t=>`Resized image to ${t.w}x${t.h}`,addElementAction:t=>`Added ${t}`,eraseAction:(t,e)=>`Erased ${e} ${t}`,elements:"Elements",erasedNoElements:"Erased nothing",rotatedBy:t=>`Rotated by ${Math.abs(t)} degrees ${t<0?"clockwise":"counter-clockwise"}`,movedLeft:"Moved left",movedUp:"Moved up",movedDown:"Moved down",movedRight:"Moved right",zoomedOut:"Zoomed out",zoomedIn:"Zoomed in",selectedElements:t=>`Selected ${t} element${1===t?"":"s"}`},ge=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},Qt),{penTool:t=>`Pen ${t}`,selectionTool:"Selection",eraserTool:"Eraser",touchPanTool:"Touch Panning",twoFingerPanZoomTool:"Panning and Zooming",undoRedoTool:"Undo/Redo",toolEnabledAnnouncement:t=>`${t} enabled`,toolDisabledAnnouncement:t=>`${t} disabled`}),me),{stroke:"Stroke",svgObject:"SVG Object"}),{loading:t=>`Loading ${t}%...`,imageEditor:"Image Editor",doneLoading:"Done loading",undoAnnouncement:t=>`Undid ${t}`,redoAnnouncement:t=>`Redid ${t}`});var ve=function(t,e,n,r){return new(n\|\|(n=Promise))((function(i,o){function s(t){try{l(r.next(t))}catch(t){o(t)}}function a(t){try{l(r.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,a)}l((r=r.apply(t,e\|\|[])).next())}))};const be=class{constructor(t,e={}){var n,r;this.localization=ge,this.announceUndoCallback=t=>{this.announceForAccessibility(this.localization.undoAnnouncement(t.description(this.localization)))},this.announceRedoCallback=t=>{this.announceForAccessibility(this.localization.redoAnnouncement(t.description(this.localization)))},this.rerenderQueued=!1,this.localization=Object.assign(Object.assign({},this.localization),e.localization),this.settings={wheelEventsEnabled:null===(n=e.wheelEventsEnabled)\|\|void 0===n\|\|n,renderingMode:null!==(r=e.renderingMode)&&void 0!==r?r:le.CanvasRenderer,localization:this.localization},this.container=document.createElement("div"),this.renderingRegion=document.createElement("div"),this.container.appendChild(this.renderingRegion),this.container.className="imageEditorContainer",this.loadingWarning=document.createElement("div"),this.loadingWarning.classList.add("loadingMessage"),this.loadingWarning.ariaLive="polite",this.container.appendChild(this.loadingWarning),this.accessibilityAnnounceArea=document.createElement("div"),this.accessibilityAnnounceArea.ariaLive="assertive",this.accessibilityAnnounceArea.className="accessibilityAnnouncement",this.container.appendChild(this.accessibilityAnnounceArea),this.renderingRegion.style.touchAction="none",this.renderingRegion.className="imageEditorRenderArea",this.renderingRegion.setAttribute("tabIndex","0"),this.renderingRegion.ariaLabel=this.localization.imageEditor,this.notifier=new Dt,this.importExportViewport=new $(this.notifier),this.viewport=new $(this.notifier),this.display=new ce(this,this.settings.renderingMode,this.renderingRegion),this.image=new L,this.history=new It(this,this.announceRedoCallback,this.announceUndoCallback),this.toolController=new Mt(this,this.localization),t.appendChild(this.container),this.importExportViewport.updateScreenSize(y.of(500,500)),this.viewport.updateScreenSize(y.of(this.display.width,this.display.height)),this.registerListeners(),this.rerender(),this.hideLoadingWarning()}getRootElement(){return this.container}showLoadingWarning(t){const e=Math.round(100t);this.loadingWarning.innerText=this.localization.loading(e),this.loadingWarning.style.display="block"}hideLoadingWarning(){this.loadingWarning.style.display="none",this.announceForAccessibility(this.localization.doneLoading)}announceForAccessibility(t){this.accessibilityAnnounceArea.innerText=t}addToolbar(t=!0){const e=new oe(this,this.container,this.localization);return t&&(e.addDefaultToolWidgets(),e.addDefaultActionButtons()),e}registerListeners(){const t={},e=()=>{const e=(new Date).getTime(),n=[];for(const r in t){const i=2e3;t[r]&&e-t[r].timeStamp<i&&n.push(t[r])}return n};this.renderingRegion.addEventListener("touchstart",(t=>t.preventDefault())),this.renderingRegion.addEventListener("pointerdown",(n=>{const r=I.ofEvent(n,!0,this.viewport);t[r.id]=r,this.renderingRegion.setPointerCapture(r.id);const i={kind:E.PointerDownEvt,current:r,allPointers:e()};return this.toolController.dispatchInputEvent(i),!0})),this.renderingRegion.addEventListener("pointermove",(n=>{var r,i;const o=I.ofEvent(n,null!==(i=null===(r=t[n.pointerId])\|\|void 0===r?void 0:r.down)&&void 0!==i&&i,this.viewport);if(o.down){const r=t[o.id];if(r){if(o.screenPos.minus(r.screenPos).magnitude()<2)return}t[o.id]=o,this.toolController.dispatchInputEvent({kind:E.PointerMoveEvt,current:o,allPointers:e()})&&n.preventDefault()}}));const n=n=>{const r=I.ofEvent(n,!1,this.viewport);t[r.id]&&(t[r.id]=r,this.renderingRegion.releasePointerCapture(r.id),this.toolController.dispatchInputEvent({kind:E.PointerUpEvt,current:r,allPointers:e()})&&n.preventDefault(),delete t[r.id])};this.renderingRegion.addEventListener("pointerup",(t=>{n(t)})),this.renderingRegion.addEventListener("pointercancel",(t=>{n(t)})),this.renderingRegion.addEventListener("keydown",(t=>{this.toolController.dispatchInputEvent({kind:E.KeyPressEvent,key:t.key,ctrlKey:t.ctrlKey})&&t.preventDefault()})),this.container.addEventListener("wheel",(t=>{let e=x.of(t.deltaX,t.deltaY,t.deltaZ);if(!this.settings.wheelEventsEnabled&&!t.ctrlKey)return;t.deltaMode===WheelEvent.DOM_DELTA_LINE?e=e.times(15):t.deltaMode===WheelEvent.DOM_DELTA_PAGE&&(e=e.times(100)),t.ctrlKey&&(e=x.of(0,0,t.deltaY));const n=y.of(t.clientX,t.clientY);return!!this.toolController.dispatchInputEvent({kind:E.WheelEvt,delta:e,screenPos:n})&&(t.preventDefault(),!0)})),this.notifier.on(S.DisplayResized,(t=>{this.viewport.updateScreenSize(y.of(this.display.width,this.display.height))})),window.addEventListener("resize",(()=>{this.notifier.dispatch(S.DisplayResized,{kind:S.DisplayResized,newSize:y.of(this.display.width,this.display.height)}),this.queueRerender()}))}dispatch(t,e=!0){e?this.history.push(t):t.apply(this),this.announceForAccessibility(t.description(this.localization))}asyncApplyOrUnapplyCommands(t,e,n){return ve(this,void 0,void 0,(function(){this.display.setDraftMode(!0);for(let r=0;r<t.length;r+=n){this.showLoadingWarning(r/t.length);for(let i=r;i<t.length&&i<r+n;i++){const n=t[i];e?n.apply(this):n.unapply(this)}r+n<t.length&&(yield new Promise((t=>{this.rerender(),requestAnimationFrame(t)})))}this.display.setDraftMode(!1),this.hideLoadingWarning()}))}asyncApplyCommands(t,e){return this.asyncApplyOrUnapplyCommands(t,!0,e)}asyncUnapplyCommands(t,e){return this.asyncApplyOrUnapplyCommands(t,!1,e)}queueRerender(){this.rerenderQueued\|\|(this.rerenderQueued=!0,requestAnimationFrame((()=>{this.rerender(),this.rerenderQueued=!1})))}rerender(t=!0){this.display.startRerender();const e=this.display.getDryInkRenderer();if(t){const t={fill:Rt.fromHex("#44444455")},n=12;e.drawRect(this.importExportViewport.visibleRect,n,t)}this.image.render(e,this.viewport),this.rerenderQueued=!1}drawWetInk(...t){for(const e of t)this.display.getWetInkRenderer().drawPath(e)}clearWetInk(){this.display.getWetInkRenderer().clear()}createHTMLOverlay(t){return t.classList.add("overlay"),this.container.appendChild(t),{remove:()=>t.remove()}}addStyleSheet(t){const e=document.createElement("style");return e.innerText=t,this.container.appendChild(e),e}sendPenEvent(t,e,n){const r=I.ofCanvasPoint(e,t!==E.PointerUpEvt,this.viewport);this.toolController.dispatchInputEvent({kind:t,allPointers:null!=n?n:[r],current:r})}toSVG(){const t=this.importExportViewport,e="http://www.w3.org/2000/svg",n=document.createElementNS(e,"svg"),r=new Ut(n,t),i=t.canvasToScreenTransform;t.resetTransform(M.identity),this.image.renderAll(r),t.resetTransform(i);const o=t.visibleRect;return n.setAttribute("viewBox",`${o.x} ${o.y} ${o.w} ${o.h}`),n.setAttribute("width",`${o.w}`),n.setAttribute("height",`${o.h}`),n.setAttribute("version","1.1"),n.setAttribute("baseProfile","full"),n.setAttribute("xmlns",e),n}loadFrom(t){return ve(this,void 0,void 0,(function(){this.showLoadingWarning(0);const e=yield t.start((t=>{new L.AddElementCommand(t).apply(this)}),((t,e)=>t%100==0?(this.showLoadingWarning(t/e),this.rerender(!1),new Promise((t=>{requestAnimationFrame((()=>t()))}))):null));this.hideLoadingWarning(),this.setImportExportRect(e).apply(this)}))}getImportExportRect(){return this.importExportViewport.visibleRect}setImportExportRect(t){const e=this.importExportViewport.visibleRect.size,n=this.importExportViewport.canvasToScreenTransform;return{apply(e){const n=e.importExportViewport;n.updateScreenSize(t.size),n.resetTransform(M.translation(t.topLeft.times(-1))),e.queueRerender()},unapply(t){const r=t.importExportViewport;r.updateScreenSize(e),r.resetTransform(n),t.queueRerender()},description:e=>e.resizeOutputCommand(t)}}loadFromSVG(t){return ve(this,void 0,void 0,(function(){const e=fe.fromString(t);yield this.loadFrom(e)}))}},xe=be})(),window.jsdraw=i})();