kritzel-stencil 0.3.33 → 0.3.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index-Xav9JFHg.js +2 -2
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/{kritzel-active-users_45.cjs.entry.js → kritzel-active-users_46.cjs.entry.js} +3223 -76
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{schema.constants-BHr5Bcqs.js → schema.constants-Di56GD6q.js} +16 -3
- package/dist/cjs/stencil.cjs.js +1 -1
- package/dist/collection/classes/objects/shape.class.js +14 -3
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.css +5 -0
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +26 -18
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.css +0 -41
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +20 -2
- package/dist/collection/components/core/kritzel-watermark/kritzel-watermark.js +1 -1
- package/dist/collection/components/shared/kritzel-avatar/kritzel-avatar.js +3 -3
- package/dist/collection/components/shared/kritzel-button/kritzel-button.css +1 -0
- package/dist/collection/components/shared/kritzel-button/kritzel-button.js +2 -2
- package/dist/collection/components/shared/kritzel-color/kritzel-color.js +2 -2
- package/dist/collection/components/shared/kritzel-color-palette/kritzel-color-palette.js +1 -1
- package/dist/collection/components/shared/kritzel-font/kritzel-font.js +1 -1
- package/dist/collection/components/shared/kritzel-font-size/kritzel-font-size.js +1 -1
- package/dist/collection/components/shared/kritzel-input/kritzel-input.js +1 -1
- package/dist/collection/components/shared/kritzel-master-detail/kritzel-master-detail.js +3 -3
- package/dist/collection/components/shared/kritzel-menu/kritzel-menu.js +1 -1
- package/dist/collection/components/shared/kritzel-menu-item/kritzel-menu-item.js +2 -2
- package/dist/collection/components/shared/kritzel-numeric-input/kritzel-numeric-input.js +1 -1
- package/dist/collection/components/shared/kritzel-opacity-slider/kritzel-opacity-slider.js +1 -1
- package/dist/collection/components/shared/kritzel-pill-tabs/kritzel-pill-tabs.css +10 -0
- package/dist/collection/components/shared/kritzel-portal/kritzel-portal.js +1 -1
- package/dist/collection/components/shared/kritzel-slide-toggle/kritzel-slide-toggle.js +1 -1
- package/dist/collection/components/shared/kritzel-split-button/kritzel-split-button.js +1 -1
- package/dist/collection/components/shared/kritzel-stroke-size/kritzel-stroke-size.js +1 -1
- package/dist/collection/components/shared/kritzel-tooltip/kritzel-tooltip.js +2 -2
- package/dist/collection/components/ui/kritzel-back-to-content/kritzel-back-to-content.js +1 -1
- package/dist/collection/components/ui/kritzel-controls/kritzel-controls.js +6 -6
- package/dist/collection/components/ui/kritzel-current-user/kritzel-current-user.js +1 -8
- package/dist/collection/components/ui/kritzel-current-user-dialog/kritzel-current-user-dialog.css +10 -0
- package/dist/collection/components/ui/kritzel-current-user-dialog/kritzel-current-user-dialog.js +25 -1
- package/dist/collection/components/ui/kritzel-export/kritzel-export.js +1 -1
- package/dist/collection/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.css +50 -0
- package/dist/collection/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.js +70 -0
- package/dist/collection/components/ui/kritzel-login-dialog/kritzel-login-dialog.js +1 -1
- package/dist/collection/components/ui/kritzel-more-menu/kritzel-more-menu.js +1 -1
- package/dist/collection/components/ui/kritzel-settings/kritzel-settings.js +1 -1
- package/dist/collection/components/ui/kritzel-share-dialog/kritzel-share-dialog.css +17 -0
- package/dist/collection/components/ui/kritzel-share-dialog/kritzel-share-dialog.js +44 -3
- package/dist/collection/components/ui/kritzel-utility-panel/kritzel-utility-panel.js +1 -1
- package/dist/collection/components/ui/kritzel-zoom-panel/kritzel-zoom-panel.js +1 -1
- package/dist/collection/constants/version.js +1 -1
- package/dist/collection/themes/dark-theme.js +1 -0
- package/dist/collection/themes/light-theme.js +1 -0
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.js +1 -1
- package/dist/components/kritzel-active-users.js +1 -1
- package/dist/components/kritzel-avatar.js +1 -1
- package/dist/components/kritzel-awareness-cursors.js +1 -1
- package/dist/components/kritzel-back-to-content.js +1 -1
- package/dist/components/kritzel-button.js +1 -1
- package/dist/components/kritzel-color-palette.js +1 -1
- package/dist/components/kritzel-color.js +1 -1
- package/dist/components/kritzel-controls.js +1 -1
- package/dist/components/kritzel-current-user-dialog.js +1 -1
- package/dist/components/kritzel-current-user.js +1 -1
- package/dist/components/kritzel-editor.js +1 -1
- package/dist/components/kritzel-engine.js +1 -1
- package/dist/components/kritzel-export.js +1 -1
- package/dist/components/kritzel-font-size.js +1 -1
- package/dist/components/kritzel-font.js +1 -1
- package/dist/components/kritzel-input.js +1 -1
- package/dist/components/kritzel-loading-overlay.d.ts +11 -0
- package/dist/components/kritzel-loading-overlay.js +1 -0
- package/dist/components/kritzel-login-dialog.js +1 -1
- package/dist/components/kritzel-master-detail.js +1 -1
- package/dist/components/kritzel-menu-item.js +1 -1
- package/dist/components/kritzel-menu.js +1 -1
- package/dist/components/kritzel-more-menu.js +1 -1
- package/dist/components/kritzel-numeric-input.js +1 -1
- package/dist/components/kritzel-opacity-slider.js +1 -1
- package/dist/components/kritzel-pill-tabs.js +1 -1
- package/dist/components/kritzel-portal.js +1 -1
- package/dist/components/kritzel-settings.js +1 -1
- package/dist/components/kritzel-share-dialog.js +1 -1
- package/dist/components/kritzel-slide-toggle.js +1 -1
- package/dist/components/kritzel-split-button.js +1 -1
- package/dist/components/kritzel-stroke-size.js +1 -1
- package/dist/components/kritzel-tool-config.js +1 -1
- package/dist/components/kritzel-tooltip.js +1 -1
- package/dist/components/kritzel-utility-panel.js +1 -1
- package/dist/components/kritzel-watermark.js +1 -1
- package/dist/components/kritzel-workspace-manager.js +1 -1
- package/dist/components/kritzel-zoom-panel.js +1 -1
- package/dist/components/{p-CO0eEzos.js → p-1nG2hxfJ.js} +1 -1
- package/dist/components/{p-DfIknZRl.js → p-2Swq9rEm.js} +1 -1
- package/dist/components/{p-Cb5YwXbC.js → p-8xkoVMfO.js} +1 -1
- package/dist/components/p-BFTU3MAI.js +1 -0
- package/dist/components/{p-14NPx-_P.js → p-BH4AasB1.js} +1 -1
- package/dist/components/{p-Dl3MwBL1.js → p-BJlf4iHH.js} +1 -1
- package/dist/components/{p-BntMEYss.js → p-BKOsmXB5.js} +1 -1
- package/dist/components/{p-DSd5xTAH.js → p-BLOPBDUF.js} +1 -1
- package/dist/components/p-B_6RNask.js +1 -0
- package/dist/components/{p-NwN6r0N0.js → p-Bd_yPNfg.js} +1 -1
- package/dist/components/{p-COhjyuRa.js → p-BlozPPKi.js} +1 -1
- package/dist/components/{p-C1jg5IQi.js → p-Bm_BWQa4.js} +1 -1
- package/dist/components/p-BmyTdQGy.js +1 -0
- package/dist/components/{p-BmX2Vb4Z.js → p-BoA6RXEA.js} +1 -1
- package/dist/components/{p-BixEMVtW.js → p-BulDbBWB.js} +1 -1
- package/dist/components/{p-D0RYktBV.js → p-BzJEwFtn.js} +1 -1
- package/dist/components/{p-CdkNxxut.js → p-BzrxIesp.js} +1 -1
- package/dist/components/{p-vf28uSsc.js → p-CMphprF1.js} +1 -1
- package/dist/components/{p-D0v9WP5w.js → p-CVhcOiEA.js} +1 -1
- package/dist/components/{p-CC0J_kEP.js → p-CwuGA058.js} +1 -1
- package/dist/components/p-D09kgc5Q.js +1 -0
- package/dist/components/p-D52oKO_e.js +1 -0
- package/dist/components/{p-M9m9-OEY.js → p-D8TOEhPY.js} +1 -1
- package/dist/components/p-D9BugXUi.js +9 -0
- package/dist/components/p-DEqpY4K2.js +1 -0
- package/dist/components/{p-BrAeYciD.js → p-DIMNEOTW.js} +1 -1
- package/dist/components/{p-DeqALrzV.js → p-DMAScsJF.js} +1 -1
- package/dist/components/{p-y5T0_Wvi.js → p-DPpPd5GI.js} +1 -1
- package/dist/components/{p-Bg0xIZiR.js → p-DSOc0eIT.js} +1 -1
- package/dist/components/{p-W1ZwImdd.js → p-DXcjIb_a.js} +1 -1
- package/dist/components/{p-DPlEzPKO.js → p-DZcwchEg.js} +1 -1
- package/dist/components/{p-BX-nQAyH.js → p-DgnK50xO.js} +1 -1
- package/dist/components/p-Di5dpXrF.js +1 -0
- package/dist/components/{p-CZQz_mul.js → p-Ds-P2bYH.js} +1 -1
- package/dist/components/{p-meY80XnF.js → p-jzuGPW5o.js} +1 -1
- package/dist/components/p-oGAPPwAL.js +1 -0
- package/dist/components/{p-BEucPbiz.js → p-sLHApVnR.js} +1 -1
- package/dist/components/{p-DEpnJBA3.js → p-yD_3Z3K1.js} +1 -1
- package/dist/components/{p-C4-Som48.js → p-zd7zXld8.js} +1 -1
- package/dist/esm/index-Dhio9uis.js +2 -2
- package/dist/esm/index.js +2 -2
- package/dist/esm/{kritzel-active-users_45.entry.js → kritzel-active-users_46.entry.js} +3223 -77
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{schema.constants-3oYjlURq.js → schema.constants-Cphx5M7a.js} +16 -3
- package/dist/esm/stencil.js +1 -1
- package/dist/stencil/index.esm.js +1 -1
- package/dist/stencil/p-Cphx5M7a.js +1 -0
- package/dist/stencil/p-ac77b486.entry.js +9 -0
- package/dist/stencil/stencil.esm.js +1 -1
- package/dist/types/components/core/kritzel-editor/kritzel-editor.d.ts +5 -0
- package/dist/types/components/core/kritzel-engine/kritzel-engine.d.ts +2 -0
- package/dist/types/components/ui/kritzel-current-user/kritzel-current-user.d.ts +0 -3
- package/dist/types/components/ui/kritzel-current-user-dialog/kritzel-current-user-dialog.d.ts +4 -0
- package/dist/types/components/ui/kritzel-loading-overlay/kritzel-loading-overlay.d.ts +11 -0
- package/dist/types/components/ui/kritzel-share-dialog/kritzel-share-dialog.d.ts +4 -0
- package/dist/types/components.d.ts +61 -0
- package/dist/types/constants/version.d.ts +1 -1
- package/dist/types/interfaces/theme.interface.d.ts +8 -0
- package/package.json +6 -4
- package/dist/components/p-BG6hOSrm.js +0 -1
- package/dist/components/p-COdwK_mi.js +0 -1
- package/dist/components/p-CQZYGZzF.js +0 -9
- package/dist/components/p-Ckpa5tHF.js +0 -1
- package/dist/components/p-CpzicliK.js +0 -1
- package/dist/components/p-XDNjFYRB.js +0 -1
- package/dist/components/p-X_pyPCe8.js +0 -1
- package/dist/stencil/p-3oYjlURq.js +0 -1
- package/dist/stencil/p-767b5a14.entry.js +0 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
import{O as t}from"./p-Dd-pMvlr.js";import{a as i}from"./p-CpzicliK.js";class s{static doPolygonsIntersect(t,i){const s=[t.bottomLeft,t.bottomRight,t.topRight,t.topLeft],h=[i.bottomLeft,i.bottomRight,i.topRight,i.topLeft];for(const t of s)if(this.isPointInPolygon(t,h))return!0;for(const t of h)if(this.isPointInPolygon(t,s))return!0;for(let t=0;t<s.length;t++){const i=s[t],e=s[(t+1)%s.length];for(let t=0;t<h.length;t++)if(this.intersectLines(i,e,h[t],h[(t+1)%h.length]))return!0}return!1}static isPointInPolygon(t,i){let s=!1;for(let h=0,e=i.length-1;h<i.length;e=h++){const n=i[h].x,r=i[h].y,o=i[e].y;r>t.y!=o>t.y&&t.x<(i[e].x-n)*(t.y-r)/(o-r)+n&&(s=!s)}return s}static intersectLines(t,i,s,h){const e=(i.x-t.x)*(h.y-s.y)-(i.y-t.y)*(h.x-s.x);if(0===e)return!1;const n=((s.x-t.x)*(h.y-s.y)-(s.y-t.y)*(h.x-s.x))/e,r=-((t.x-s.x)*(i.y-t.y)-(t.y-s.y)*(i.x-t.x))/e;return n>=0&&n<=1&&r>=0&&r<=1}static getLineIntersectionPoint(t,i,s,h){const e=(i.x-t.x)*(h.y-s.y)-(i.y-t.y)*(h.x-s.x);if(0===e)return null;const n=((s.x-t.x)*(h.y-s.y)-(s.y-t.y)*(h.x-s.x))/e,r=-((t.x-s.x)*(i.y-t.y)-(t.y-s.y)*(i.x-t.x))/e;return n>=0&&n<=1&&r>=0&&r<=1?{x:t.x+n*(i.x-t.x),y:t.y+n*(i.y-t.y)}:null}static getLinePolygonIntersection(t,i,s){const h=[s.topLeft,s.topRight,s.bottomRight,s.bottomLeft];let e=null,n=1/0;for(let s=0;s<h.length;s++){const r=this.getLineIntersectionPoint(t,i,h[s],h[(s+1)%h.length]);if(r){const i=Math.sqrt(Math.pow(r.x-t.x,2)+Math.pow(r.y-t.y,2));i<n&&(n=i,e=r)}}return e}static getEllipsePolygonApproximation(t,i,s,h,e=32,n=0){const r=[],o=Math.cos(n),a=Math.sin(n);for(let n=0;n<e;n++){const u=2*Math.PI*n/e,l=s*Math.cos(u),c=h*Math.sin(u);r.push({x:t+l*o-c*a,y:i+l*a+c*o})}return r}static getLinePointsArrayIntersection(t,i,s){let h=null,e=1/0;for(let n=0;n<s.length;n++){const r=this.getLineIntersectionPoint(t,i,s[n],s[(n+1)%s.length]);if(r){const i=Math.sqrt(Math.pow(r.x-t.x,2)+Math.pow(r.y-t.y,2));i<e&&(e=i,h=r)}}return h}static isPointInPolygonPoints(t,i){return this.isPointInPolygon(t,i)}}class h{__class__="KritzelBaseObject";_core;_elementRef;id;workspaceId;x;y;translateX;translateY;height;width;backgroundColor;borderColor;borderWidth=0;opacity=1;padding=0;scale;resizing=!1;rotation=0;markedForRemoval=!1;zIndex=0;userId;isVisible=!0;isSelected=!1;isHovered=!1;isMounted=!1;isEditable=!1;isInteractive=!1;isResizable=!0;isRotatable=!0;get totalWidth(){return this.width+2*this.padding}get totalHeight(){return this.height+2*this.padding}set elementRef(t){this._elementRef=t}get elementRef(){return this._elementRef}get boundingBox(){return{x:this.translateX,y:this.translateY,z:this.scale,width:this.totalWidth/this.scale,height:this.totalHeight/this.scale}}get rotatedBoundingBox(){const t=this.rotatedPolygon,i=[t.topLeft.x,t.topRight.x,t.bottomRight.x,t.bottomLeft.x],s=[t.topLeft.y,t.topRight.y,t.bottomRight.y,t.bottomLeft.y],h=Math.min(...i),e=Math.max(...i),n=Math.min(...s),r=Math.max(...s);return{x:h,y:n,z:this.scale,width:e-h,height:r-n}}get rotatedPolygon(){const t=this.translateX+this.totalWidth/2/this.scale,i=this.translateY+this.totalHeight/2/this.scale,s=this.rotation,h=Math.cos(s),e=Math.sin(s),n=this.translateX,r=this.translateY,o=n+this.totalWidth/this.scale,a=r+this.totalHeight/this.scale,u=(s,n)=>({x:h*(s-t)-e*(n-i)+t,y:e*(s-t)+h*(n-i)+i});return{topLeft:u(n,r),topRight:u(o,r),bottomRight:u(o,a),bottomLeft:u(n,a)}}get minXRotated(){return Math.min(this.rotatedPolygon.topLeft.x,this.rotatedPolygon.topRight.x,this.rotatedPolygon.bottomRight.x,this.rotatedPolygon.bottomLeft.x)}get minYRotated(){return Math.min(this.rotatedPolygon.topLeft.y,this.rotatedPolygon.topRight.y,this.rotatedPolygon.bottomRight.y,this.rotatedPolygon.bottomLeft.y)}get maxXRotated(){return Math.max(this.rotatedPolygon.topLeft.x,this.rotatedPolygon.topRight.x,this.rotatedPolygon.bottomRight.x,this.rotatedPolygon.bottomLeft.x)}get maxYRotated(){return Math.max(this.rotatedPolygon.topLeft.y,this.rotatedPolygon.topRight.y,this.rotatedPolygon.bottomRight.y,this.rotatedPolygon.bottomLeft.y)}get transformationMatrix(){const t=1/this.scale;return`matrix(${t}, 0, 0, ${t}, ${this.translateX}, ${this.translateY})`}get rotationDegrees(){return this.rotation*(180/Math.PI)}get centerX(){return this.translateX+this.totalWidth/2/this.scale}get centerY(){return this.translateY+this.totalHeight/2/this.scale}constructor(){this.id=this.generateId()}static create(t){const i=new h;return i._core=t,i.zIndex=t.store.currentZIndex,i.workspaceId=t.store.state.activeWorkspace.id,i.userId=t.user?.id,i}mount(t){this.isMounted||(this.elementRef=t,this.isMounted=!0)}generateId(){return t.generateUUID()}isInViewport(){const t=this._core.store.state.scale;if(this.boundingBox.width*t*(this.boundingBox.height*t)<.5)return!1;const i=-this._core.store.state.translateX/this._core.store.state.scale,s=-this._core.store.state.translateY/this._core.store.state.scale;return this.rotatedBoundingBox.x<i+this._core.store.state.viewportWidth/this._core.store.state.scale&&this.rotatedBoundingBox.x+this.rotatedBoundingBox.width>i&&this.rotatedBoundingBox.y<s+this._core.store.state.viewportHeight/this._core.store.state.scale&&this.rotatedBoundingBox.y+this.rotatedBoundingBox.height>s}centerInViewport(){const{viewportWidth:t,viewportHeight:i,translateX:s,translateY:h,scale:e}=this._core.store.state,{x:n,y:r,width:o,height:a}=this.rotatedBoundingBox;this.updatePosition(this.translateX+((t/2-s)/e-(n+o/2)),this.translateY+((i/2-h)/e-(r+a/2)))}update(){this._core.store.objects.update(this)}move(t,i,s,h){const e=(i-h)/this._core.store.state.scale;this.translateX+=(t-s)/this._core.store.state.scale,this.translateY+=e,this._core.store.objects.update(this)}resize(t,i,s,h){s<=1||h<=1||(this.width=s,this.height=h,this.translateX=t,this.translateY=i,this._core.store.objects.update(this),this._core.anchorManager.updateAnchorsForObject(this.id))}rotate(t){this.rotation=t,this._core.store.objects.update(this)}clone(){const t=Object.create(Object.getPrototypeOf(this));return Object.assign(t,this),t.id=this.id,t}copy(){const t=Object.create(Object.getPrototypeOf(this));return Object.assign(t,this),t.id=this.generateId(),t.isMounted=!1,t.isSelected=!1,t.isHovered=!1,t.isInteractive=!1,t.resizing=!1,t.markedForRemoval=!1,t.isVisible=!0,t}serialize(){const{_core:t,_elementRef:i,element:s,totalWidth:h,totalHeight:e,isSelected:n,isHovered:r,isMounted:o,isInteractive:a,resizing:u,markedForRemoval:l,isVisible:c,...f}=this;return structuredClone(f)}deserialize(t){return Object.assign(this,t),this.isSelected=!1,this.isHovered=!1,this.isMounted=!1,this.isInteractive=!1,this.resizing=!1,this.markedForRemoval=!1,this.isVisible=!0,"_adjustedPoints"in this&&(this._adjustedPoints=null),"_clipInfo"in this&&(this._clipInfo=null),this}adoptTransientStateFrom(t){}isClass(t){return this.__class__===t}edit(t){}onAfterUpdate(t){}hitTest(t,i){return!0}hitTestPolygon(t){return s.doPolygonsIntersect(this.rotatedPolygon,t)}updatePosition(t,i){this.translateX=t,this.translateY=i,this._core.store.objects.update(this)}}class e{static average(t,i){return(t+i)/2}static degreesToRadians(t){return t*(Math.PI/180)}}var n,r={},o=(n||(n=1,function(t){Object.defineProperties(t,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const{PI:i}=Math,s=i+1e-4,h=[1,1];function e(t,i,s,h=t=>t){return t*h(.5-i*(.5-s))}const{min:n}=Math;function r(t,i,s){let h=n(1,i/s);return n(1,t+(n(1,1-h)-t)*(.275*h))}function o(t,i){return[t[0]+i[0],t[1]+i[1]]}function a(t,i,s){return t[0]=i[0]+s[0],t[1]=i[1]+s[1],t}function u(t,i){return[t[0]-i[0],t[1]-i[1]]}function l(t,i,s){return t[0]=i[0]-s[0],t[1]=i[1]-s[1],t}function c(t,i){return[t[0]*i,t[1]*i]}function f(t,i,s){return t[0]=i[0]*s,t[1]=i[1]*s,t}function d(t){return[t[1],-t[0]]}function M(t,i){let s=i[0];return t[0]=i[1],t[1]=-s,t}function g(t,i){return t[0]*i[0]+t[1]*i[1]}function m(t,i){return t[0]===i[0]&&t[1]===i[1]}function p(t,i){let s=t[0]-i[0],h=t[1]-i[1];return s*s+h*h}function x(t){return function(t,i){return[t[0]/i,t[1]/i]}(t,function(t){return Math.hypot(t[0],t[1])}(t))}function y(t,i){return Math.hypot(t[1]-i[1],t[0]-i[0])}function v(t,i,s){let h=Math.sin(s),e=Math.cos(s),n=t[0]-i[0],r=t[1]-i[1];return[n*e-r*h+i[0],n*h+r*e+i[1]]}function P(t,i,s,h){let e=Math.sin(h),n=Math.cos(h),r=i[0]-s[0],o=i[1]-s[1],a=r*e+o*n;return t[0]=r*n-o*e+s[0],t[1]=a+s[1],t}function $(t,i,s){return o(t,c(u(i,t),s))}function b(t,i,s,h){let e=s[1]-i[1];return t[0]=i[0]+(s[0]-i[0])*h,t[1]=i[1]+e*h,t}function w(t,i,s){return o(t,c(i,s))}const z=[0,0],L=[0,0],_=[0,0];function I(t,i){let h=w(t,x(d(u(t,o(t,[1,1])))),-i),e=[],n=1/13;for(let i=n;i<=1;i+=n)e.push(v(h,t,2*s*i));return e}function X(t,i,h){let e=[],n=1/h;for(let h=n;h<=1;h+=n)e.push(v(i,t,s*h));return e}function Y(t,i,s){let h=u(i,s),e=c(h,.5),n=c(h,.51);return[u(t,e),u(t,n),o(t,n),o(t,e)]}function k(t,i,h,e){let n=[],r=w(t,i,h),o=1/e;for(let i=o;i<1;i+=o)n.push(v(r,t,3*s*i));return n}function R(t,i,s){return[o(t,c(i,s)),o(t,c(i,.99*s)),u(t,c(i,.99*s)),u(t,c(i,s))]}function j(t,i,s){return!1===t||void 0===t?0:!0===t?Math.max(i,s):t}function A(t,i={}){let{size:h=16,smoothing:n=.5,thinning:c=.5,simulatePressure:m=!0,easing:x=t=>t,start:y={},end:v={},last:$=!1}=i,{cap:w=!0,easing:A=t=>t*(2-t)}=y,{cap:B=!0,easing:S=t=>--t*t*t+1}=v;if(0===t.length||h<=0)return[];let T,C=t[t.length-1].runningLength,O=j(y.taper,h,C),D=j(v.taper,h,C),V=(h*n)**2,W=[],F=[],H=function(t,i,s){return t.slice(0,10).reduce(((t,h)=>{let e=h.pressure;return i&&(e=r(t,h.distance,s)),(t+e)/2}),t[0].pressure)}(t,m,h),K=e(h,c,t[t.length-1].pressure,x),E=t[0].vector,Q=t[0].point,U=Q,Z=Q,q=U,G=!1;for(let i=0;i<t.length;i++){let{pressure:n}=t[i],{point:d,vector:y,distance:v,runningLength:$}=t[i],w=i===t.length-1;if(!w&&C-$<3)continue;c?(m&&(n=r(H,v,h)),K=e(h,c,n,x)):K=h/2,void 0===T&&(T=K);let I=$<O?A($/O):1,X=C-$<D?S((C-$)/D):1;K=Math.max(.01,K*Math.min(I,X));let Y=(w?t[i]:t[i+1]).vector,k=w?1:g(y,Y),R=null!==k&&k<0;if(g(y,E)<0&&!G||R){M(z,E),f(z,z,K);for(let t=0;t<=1;t+=.07692307692307693)l(L,d,z),P(L,L,d,s*t),Z=[L[0],L[1]],W.push(Z),a(_,d,z),P(_,_,d,s*-t),q=[_[0],_[1]],F.push(q);Q=Z,U=q,R&&(G=!0)}else G=!1,w?(M(z,y),f(z,z,K),W.push(u(d,z)),F.push(o(d,z))):(b(z,Y,y,k),M(z,z),f(z,z,K),l(L,d,z),Z=[L[0],L[1]],(i<=1||p(Q,Z)>V)&&(W.push(Z),Q=Z),a(_,d,z),q=[_[0],_[1]],(i<=1||p(U,q)>V)&&(F.push(q),U=q),H=n,E=y)}let J=[t[0].point[0],t[0].point[1]],N=t.length>1?[t[t.length-1].point[0],t[t.length-1].point[1]]:o(t[0].point,[1,1]),tt=[],it=[];if(1===t.length){if(!O&&!D||$)return I(J,T||K)}else{O||D&&1===t.length||(w?tt.push(...X(J,F[0],13)):tt.push(...Y(J,W[0],F[0])));let i=d(function(t){return[-t[0],-t[1]]}(t[t.length-1].vector));D||O&&1===t.length?it.push(N):B?it.push(...k(N,i,K,29)):it.push(...R(N,i,K))}return W.concat(it,F.reverse(),tt)}const B=[0,0];function S(t){return null!=t&&t>=0}function T(t,i={}){let{streamline:s=.5,size:e=16,last:n=!1}=i;if(0===t.length)return[];let r=.15+.85*(1-s),a=Array.isArray(t[0])?t:t.map((({x:t,y:i,pressure:s=.5})=>[t,i,s]));if(2===a.length){let t=a[1];a=a.slice(0,-1);for(let i=1;i<5;i++)a.push($(a[0],t,i/4))}1===a.length&&(a=[...a,[...o(a[0],h),...a[0].slice(2)]]);let u=[{point:[a[0][0],a[0][1]],pressure:S(a[0][2])?a[0][2]:.25,vector:[...h],distance:0,runningLength:0}],c=!1,f=0,d=u[0],M=a.length-1;for(let t=1;t<a.length;t++){let i=n&&t===M?[a[t][0],a[t][1]]:$(d.point,a[t],r);if(m(d.point,i))continue;let s=y(i,d.point);if(f+=s,t<M&&!c){if(f<e)continue;c=!0}l(B,d.point,i),d={point:i,pressure:S(a[t][2])?a[t][2]:.5,vector:x(B),distance:s,runningLength:f},u.push(d)}return u[0].vector=u[1]?.vector||[0,0],u}function C(t,i={}){return A(T(t,i),i)}t.default=C,t.getStroke=C,t.getStrokeOutlinePoints=A,t.getStrokePoints=T}(r)),r);class a extends h{__class__="KritzelPath";points;d;stroke={light:"none",dark:"none"};strokeWidth;lineSlack=.5;fill;x=0;y=0;height=0;width=0;scale=1;options;isVisible=!0;isDebugInfoVisible=!0;isCompleted=!1;_adjustedPoints=null;get viewBox(){return`${this.x} ${this.y} ${this.width} ${this.height}`}constructor(t){super(),this.options=t,this.points=t?.points??[],this.translateX=t?.translateX??0,this.translateY=t?.translateY??0,this.rotation=e.degreesToRadians(t?.rotation??0),this.scale=t?.scale??1,this.strokeWidth=t?.strokeWidth??8,this.fill=t?.fill??{light:"#000000",dark:"#ffffff"},this.d=this.generateSvgPath(),this.updateDimensions()}static create(t,i){const s=new a;return s._core=t,s.id=s.generateId(),s.workspaceId=t.store.state.activeWorkspace.id,s.userId=t.user?.id,s.options=i,s.points=i?.points??[],s.translateX=i?.translateX??0,s.translateY=i?.translateY??0,s.rotation=e.degreesToRadians(i?.rotation??0),s.scale=i?.scale??1,s.strokeWidth=i?.strokeWidth??8,s.fill=i?.fill??{light:"#000000",dark:"#ffffff"},s.opacity=i?.opacity??1,s.zIndex=t.store.currentZIndex,s.d=s.generateSvgPath(),s.updateDimensions(),s}copy(){const t=super.copy();return this.points&&(t.points=this.points.map((t=>[...t]))),t}resize(t,i,s,h){if(s<=1||h<=1)return;const e=s/this.width,n=h/this.height;if(this.width=s,this.height=h,1===this.points.length){const t=this.points[0],i=Math.max(0,s-this.strokeWidth)/e,r=Math.max(0,h-this.strokeWidth)/n;this.points.push([t[0]+i,t[1]+r])}this.points=this.points.map((([t,i])=>[t*e,i*n])),this.d=this.generateSvgPath(),this.width=Math.max(...this.points.map((t=>t[0])))-Math.min(...this.points.map((t=>t[0])))+this.strokeWidth,this.height=Math.max(...this.points.map((t=>t[1])))-Math.min(...this.points.map((t=>t[1])))+this.strokeWidth,this.x=Math.min(...this.points.map((t=>t[0])))-this.strokeWidth/2,this.y=Math.min(...this.points.map((t=>t[1])))-this.strokeWidth/2,null!==t&&(this.translateX=t),null!==i&&(this.translateY=i),this._adjustedPoints=null,this._core.store.objects.update(this)}rotate(t){this.rotation=t,this._adjustedPoints=null,this._core.store.objects.update(this)}move(t,i,s,h){const e=(i-h)/this._core.store.state.scale;this.translateX+=(t-s)/this._core.store.state.scale,this.translateY+=e,this._adjustedPoints=null,this._core.store.objects.update(this)}hitTest(t,i){const s=this.strokeWidth/this.scale/2;if(null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints()),1===this._adjustedPoints.length){const h=this._adjustedPoints[0];return this.pointToLineSegmentDistance(t,i,h[0],h[1],h[0],h[1])<=s}for(let h=0;h<this._adjustedPoints.length-1;h++){const e=this._adjustedPoints[h],n=this._adjustedPoints[h+1];if(this.pointToLineSegmentDistance(t,i,e[0],e[1],n[0],n[1])<=s)return!0}return!1}hitTestPolygon(t){const i=this.strokeWidth/this.scale/2;null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints());const h=[{x:t.bottomLeft.x,y:t.bottomLeft.y},{x:t.bottomRight.x,y:t.bottomRight.y},{x:t.topRight.x,y:t.topRight.y},{x:t.topLeft.x,y:t.topLeft.y}];for(const[t,i]of this._adjustedPoints)if(s.isPointInPolygon({x:t,y:i},h))return!0;for(const t of h)if(this.hitTest(t.x,t.y))return!0;for(let t=0;t<this._adjustedPoints.length-1;t++){const i={x:this._adjustedPoints[t][0],y:this._adjustedPoints[t][1]},e={x:this._adjustedPoints[t+1][0],y:this._adjustedPoints[t+1][1]};for(let t=0;t<h.length;t++)if(s.intersectLines(i,e,h[t],h[(t+1)%h.length]))return!0}for(let t=0;t<this._adjustedPoints.length-1;t++){const s=this._adjustedPoints[t],e=this._adjustedPoints[t+1];for(let t=0;t<h.length;t++){const n=h[t],r=h[(t+1)%h.length],o=this.pointToLineSegmentDistance(n.x,n.y,s[0],s[1],e[0],e[1]),a=this.pointToLineSegmentDistance(r.x,r.y,s[0],s[1],e[0],e[1]),u=this.pointToLineSegmentDistance(s[0],s[1],n.x,n.y,r.x,r.y),l=this.pointToLineSegmentDistance(e[0],e[1],n.x,n.y,r.x,r.y);if(Math.min(o,a,u,l)<=i)return!0}}return!1}updatePosition(t,i){this.translateX=t,this.translateY=i,this._adjustedPoints=null,this._core.store.objects.update(this)}onAfterUpdate(t){t.includes("strokeWidth")&&(this.d=this.generateSvgPath(),this.updateBoundingBox(),this._adjustedPoints=null)}computeAdjustedPoints(){if(!this.points?.length)return[];const t=this.rotation,i=Math.cos(t),s=Math.sin(t),h=this.points.map((t=>t[0])),e=this.points.map((t=>t[1])),n={x:(Math.min(...h)+Math.max(...h))/2,y:(Math.min(...e)+Math.max(...e))/2},{x:r,y:o}=n;return this.points.map((([t,h])=>{const e=t-r,n=h-o;return[r+e*i-n*s,o+e*s+n*i]})).map((([t,i])=>[Math.abs(t-this.x)/this.scale+this.translateX,Math.abs(i-this.y)/this.scale+this.translateY]))}pointToLineSegmentDistance(t,i,s,h,e,n){const r=e-s,o=n-h,a=r*r+o*o;let u,l,c=-1;0!==a&&(c=((t-s)*r+(i-h)*o)/a),c<0?(u=s,l=h):c>1?(u=e,l=n):(u=s+c*r,l=h+c*o);const f=t-u,d=i-l;return Math.sqrt(f*f+d*d)}updateDimensions(){const t=Math.min(...this.points.map((t=>t[0])))-this.strokeWidth/2,i=Math.min(...this.points.map((t=>t[1])))-this.strokeWidth/2,s=Math.max(...this.points.map((t=>t[0])))+this.strokeWidth/2,h=Math.max(...this.points.map((t=>t[1])))+this.strokeWidth/2;this.width=s-t+this.lineSlack,this.height=h-i+this.lineSlack,this.x=t,this.y=i,this.translateX=(this.x+this.translateX)/this.scale,this.translateY=(this.y+this.translateY)/this.scale}updateBoundingBox(){const t=Math.min(...this.points.map((t=>t[0])))-this.strokeWidth/2,i=Math.min(...this.points.map((t=>t[1])))-this.strokeWidth/2,s=Math.max(...this.points.map((t=>t[0])))+this.strokeWidth/2,h=Math.max(...this.points.map((t=>t[1])))+this.strokeWidth/2;this.width=s-t+this.lineSlack,this.height=h-i+this.lineSlack,this.x=t,this.y=i}generateSvgPath(){const t=this.getStrokeFromPoints(this.points,this.strokeWidth);return this.getSvgPathFromStroke(t)}getStrokeFromPoints(t,i){return o.getStroke(t,{size:i,thinning:.5,smoothing:.5,streamline:.5,easing:t=>t,simulatePressure:!0,last:!0,start:{cap:!0,taper:0,easing:t=>t},end:{cap:!0,taper:0,easing:t=>t}})}getSvgPathFromStroke(t,i=!0){const s=t.length;if(s<4)return"";let h=t[0],n=t[1];const r=t[2];let o=`M${h[0].toFixed(2)},${h[1].toFixed(2)} Q${n[0].toFixed(2)},${n[1].toFixed(2)} ${e.average(n[0],r[0]).toFixed(2)},${e.average(n[1],r[1]).toFixed(2)} T`;for(let i=2,r=s-1;i<r;i++)h=t[i],n=t[i+1],o+=`${e.average(h[0],n[0]).toFixed(2)},${e.average(h[1],n[1]).toFixed(2)} `;return i&&(o+="Z"),o}isLowRes(){if(!this._core)return!1;const t=this._core.store.state.scale;return this.boundingBox.width*t*(this.boundingBox.height*t)<500}getClipPoint(t){const i=this.centerX,s=this.centerY,h=this.strokeWidth/this.scale/2;if(null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints()),this._adjustedPoints.length<1)return null;let e=!0;for(let n=1;n<=32;n++){const r=n/32,o=t.x+(i-t.x)*r,a=t.y+(s-t.y)*r;let u=1/0;if(1===this._adjustedPoints.length){const t=this._adjustedPoints[0],i=o-t[0],s=a-t[1];u=Math.sqrt(i*i+s*s)}else for(let t=0;t<this._adjustedPoints.length-1;t++){const i=this._adjustedPoints[t],s=this._adjustedPoints[t+1],h=this.pointToLineSegmentDistance(o,a,i[0],i[1],s[0],s[1]);h<u&&(u=h)}const l=u<=h;if(e&&l){let e=(n-1)/32,o=r;for(let n=0;n<8;n++){const n=(e+o)/2,r=t.x+(i-t.x)*n,a=t.y+(s-t.y)*n;let u=1/0;if(1===this._adjustedPoints.length){const t=this._adjustedPoints[0],i=r-t[0],s=a-t[1];u=Math.sqrt(i*i+s*s)}else for(let t=0;t<this._adjustedPoints.length-1;t++){const i=this._adjustedPoints[t],s=this._adjustedPoints[t+1],h=this.pointToLineSegmentDistance(r,a,i[0],i[1],s[0],s[1]);h<u&&(u=h)}u<=h?o=n:e=n}const a=(e+o)/2;return{x:t.x+(i-t.x)*a,y:t.y+(s-t.y)*a}}e=!l}return null}}class u extends h{__class__="KritzelLine";startX;startY;endX;endY;controlX;controlY;stroke;strokeWidth;scale=1;options;startAnchor;endAnchor;arrows;isVisible=!0;isDebugInfoVisible=!0;isCompleted=!1;_adjustedPoints=null;_clipInfo=null;get d(){return void 0!==this.controlX&&void 0!==this.controlY?`M ${this.startX} ${this.startY} Q ${this.controlX} ${this.controlY} ${this.endX} ${this.endY}`:`M ${this.startX} ${this.startY} L ${this.endX} ${this.endY}`}get viewBox(){return`${this.x} ${this.y} ${this.width} ${this.height}`}constructor(t){super(),this.options=t,this.startX=t?.startX??0,this.startY=t?.startY??0,this.endX=t?.endX??0,this.endY=t?.endY??0,this.controlX=t?.controlX,this.controlY=t?.controlY,this.translateX=t?.translateX??0,this.translateY=t?.translateY??0,this.rotation=e.degreesToRadians(t?.rotation??0),this.scale=t?.scale??1,this.strokeWidth=t?.strokeWidth??4,this.stroke=t?.stroke??{light:"#000000",dark:"#ffffff"},this.startAnchor=t?.startAnchor,this.endAnchor=t?.endAnchor,this.arrows=t?.arrows,this.updateDimensions()}static create(t,i){const s=new u;return s._core=t,s.id=s.generateId(),s.workspaceId=t.store.state.activeWorkspace.id,s.userId=t.user?.id,s.options=i,s.startX=i?.startX??0,s.startY=i?.startY??0,s.endX=i?.endX??0,s.endY=i?.endY??0,s.controlX=i?.controlX,s.controlY=i?.controlY,s.translateX=i?.translateX??0,s.translateY=i?.translateY??0,s.rotation=e.degreesToRadians(i?.rotation??0),s.scale=i?.scale??1,s.strokeWidth=i?.strokeWidth??4,s.stroke=i?.stroke??{light:"#000000",dark:"#ffffff"},s.opacity=i?.opacity??1,s.startAnchor=i?.startAnchor,s.endAnchor=i?.endAnchor,s.arrows=i?.arrows,s.zIndex=t.store.currentZIndex,s.updateDimensions(),s}resize(t,i,s,h){if(s<=1||h<=1)return;const e=s/this.width,n=h/this.height;this.startX=this.startX*e,this.startY=this.startY*n,this.endX=this.endX*e,this.endY=this.endY*n,void 0!==this.controlX&&void 0!==this.controlY&&(this.controlX=this.controlX*e,this.controlY=this.controlY*n);const{minX:r,minY:o,maxX:a,maxY:u}=this.calculateBoundingBox();this.width=a-r,this.height=u-o,this.x=r,this.y=o,this.translateX=t,this.translateY=i,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this),this._core.anchorManager.updateAnchorsForObject(this.id),this.startAnchor&&this._core.anchorManager.updateAnchorsForObject(this.startAnchor.objectId),this.endAnchor&&this._core.anchorManager.updateAnchorsForObject(this.endAnchor.objectId)}rotate(t){this.rotation=t,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}move(t,i,s,h){const e=(i-h)/this._core.store.state.scale;this.translateX+=(t-s)/this._core.store.state.scale,this.translateY+=e,this.startAnchor&&this._core.anchorManager.updateAnchorsForObject(this.startAnchor.objectId),this.endAnchor&&this._core.anchorManager.updateAnchorsForObject(this.endAnchor.objectId),this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}hitTest(t,i){const s=Math.max(this.strokeWidth,20)/this.scale/2;if(null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints()),void 0!==this.controlX&&void 0!==this.controlY){const h=this.getClipInfo();return this.pointToBezierDistance(t,i,h.start?.t??0,h.end?.t??1)<=s}const h=this.getClipInfo(),e=h.start?[h.start.x,h.start.y]:this._adjustedPoints[0],n=h.end?[h.end.x,h.end.y]:this._adjustedPoints[1];return this.pointToLineSegmentDistance(t,i,e[0],e[1],n[0],n[1])<=s}hitTestPolygon(t){const i=this.strokeWidth/this.scale/2;null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints());const h=this.getClipInfo(),e=[{x:t.bottomLeft.x,y:t.bottomLeft.y},{x:t.bottomRight.x,y:t.bottomRight.y},{x:t.topRight.x,y:t.topRight.y},{x:t.topLeft.x,y:t.topLeft.y}],n=h.start?[h.start.x,h.start.y]:this._adjustedPoints[0],r=h.end?[h.end.x,h.end.y]:this._adjustedPoints[1],o=[n,r];for(const[t,i]of o)if(s.isPointInPolygon({x:t,y:i},e))return!0;for(const t of e)if(this.hitTest(t.x,t.y))return!0;if(void 0!==this.controlX&&void 0!==this.controlY){const t=this._adjustedPoints[0],n=this._adjustedPoints[1],r=this.computeAdjustedControlPoint(),o=h.start?.t??0,a=h.end?.t??1,u=20;for(let h=0;h<=u;h++){const l=o+h/u*(a-o),c=1-l,f=c*c*t[0]+2*c*l*r[0]+l*l*n[0],d=c*c*t[1]+2*c*l*r[1]+l*l*n[1];if(s.isPointInPolygon({x:f,y:d},e))return!0;for(let t=0;t<e.length;t++){const s=e[t],h=e[(t+1)%e.length];if(this.pointToLineSegmentDistance(f,d,s.x,s.y,h.x,h.y)<=i)return!0}}return!1}const a={x:n[0],y:n[1]},u={x:r[0],y:r[1]};for(let t=0;t<e.length;t++){const h=e[t],n=e[(t+1)%e.length];if(s.intersectLines(a,u,h,n))return!0;const r=this.pointToLineSegmentDistance(h.x,h.y,a.x,a.y,u.x,u.y),o=this.pointToLineSegmentDistance(n.x,n.y,a.x,a.y,u.x,u.y),l=this.pointToLineSegmentDistance(a.x,a.y,h.x,h.y,n.x,n.y),c=this.pointToLineSegmentDistance(u.x,u.y,h.x,h.y,n.x,n.y);if(Math.min(r,o,l,c)<=i)return!0}return!1}updatePosition(t,i){this.translateX=t,this.translateY=i,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}updateEndpoint(t,i,s){"start"===t?(this.startX=i,this.startY=s):(this.endX=i,this.endY=s);const h=this.width,e=this.height,{minX:n,minY:r,maxX:o,maxY:a}=this.calculateBoundingBox(),u=n-this.x,l=r-this.y,c=o-n,f=a-r,d=(c-h)/2,M=(f-e)/2;this.x=n,this.y=r,this.width=c,this.height=f;const g=Math.cos(this.rotation),m=Math.sin(this.rotation),p=u+d,x=l+M,y=p*m+x*g-M;this.translateX+=(p*g-x*m-d)/this.scale,this.translateY+=y/this.scale,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}updateControlPoint(t,i){this.controlX=t,this.controlY=i;const s=this.width,h=this.height,{minX:e,minY:n,maxX:r,maxY:o}=this.calculateBoundingBox(),a=e-this.x,u=n-this.y,l=r-e,c=o-n,f=(l-s)/2,d=(c-h)/2;this.x=e,this.y=n,this.width=l,this.height=c;const M=Math.cos(this.rotation),g=Math.sin(this.rotation),m=a+f,p=u+d,x=m*g+p*M-d;this.translateX+=(m*M-p*g-f)/this.scale,this.translateY+=x/this.scale,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}computeAdjustedPoints(){const t=[[this.startX,this.startY],[this.endX,this.endY]],i=this.rotation,s=Math.cos(i),h=Math.sin(i),e=t.map((t=>t[0])),n=t.map((t=>t[1])),r={x:(Math.min(...e)+Math.max(...e))/2,y:(Math.min(...n)+Math.max(...n))/2},{x:o,y:a}=r;return t.map((([t,i])=>{const e=t-o,n=i-a;return[o+e*s-n*h,a+e*h+n*s]})).map((([t,i])=>[(t-this.x)/this.scale+this.translateX,(i-this.y)/this.scale+this.translateY]))}pointToLineSegmentDistance(t,i,s,h,e,n){const r=e-s,o=n-h,a=r*r+o*o;let u,l,c=-1;0!==a&&(c=((t-s)*r+(i-h)*o)/a),c<0?(u=s,l=h):c>1?(u=e,l=n):(u=s+c*r,l=h+c*o);const f=t-u,d=i-l;return Math.sqrt(f*f+d*d)}pointToBezierDistance(t,i,s=0,h=1){null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints());const e=this._adjustedPoints[0],n=this._adjustedPoints[1],r=this.computeAdjustedControlPoint();let o=1/0;for(let a=0;a<=20;a++){const u=s+a/20*(h-s),l=1-u,c=t-(l*l*e[0]+2*l*u*r[0]+u*u*n[0]),f=i-(l*l*e[1]+2*l*u*r[1]+u*u*n[1]),d=Math.sqrt(c*c+f*f);d<o&&(o=d)}return o}getClipInfo(){if(this._clipInfo)return this._clipInfo;const t=this.endAnchor,i={};if(this.startAnchor){const t=this._core.anchorManager.findAnchorTarget(this,"start");if(t){const s=this._core.anchorManager.computeAnchorClipInfo(this,"start",t);s&&(i.start={x:s.worldX,y:s.worldY,t:s.t})}}if(t){const t=this._core.anchorManager.findAnchorTarget(this,"end");if(t){const s=this._core.anchorManager.computeAnchorClipInfo(this,"end",t);s&&(i.end={x:s.worldX,y:s.worldY,t:s.t})}}return this._clipInfo=i,i}computeAdjustedControlPoint(){if(void 0===this.controlX||void 0===this.controlY)return[(this.startX+this.endX)/2,(this.startY+this.endY)/2];const t=this.rotation,i=Math.cos(t),s=Math.sin(t),h=[this.startX,this.endX],e=[this.startY,this.endY],n={x:(Math.min(...h)+Math.max(...h))/2,y:(Math.min(...e)+Math.max(...e))/2},{x:r,y:o}=n,a=this.controlX-r,u=this.controlY-o;return[(r+a*i-u*s-this.x)/this.scale+this.translateX,(o+a*s+u*i-this.y)/this.scale+this.translateY]}get rotatedPolygon(){const t=this.padding,{minX:i,minY:s,maxX:h,maxY:e}=u.calculateBoundingBox(this.startX,this.startY,this.endX,this.endY,this.controlX,this.controlY,this.strokeWidth),n=i-this.x+t,r=s-this.y+t,o=h-this.x+t,a=e-this.y+t,l={x:n,y:r},c={x:o,y:r},f={x:o,y:a},d={x:n,y:a},M=this.totalWidth/2,g=this.totalHeight/2,m=this.rotation,p=Math.cos(m),x=Math.sin(m),y=t=>({x:((t.x-M)*p-(t.y-g)*x+M)/this.scale+this.translateX,y:((t.x-M)*x+(t.y-g)*p+g)/this.scale+this.translateY});return{topLeft:y(l),topRight:y(c),bottomRight:y(f),bottomLeft:y(d)}}static calculateBoundingBox(t,i,s,h,e,n,r){let o=Math.min(t,s),a=Math.min(i,h),u=Math.max(t,s),l=Math.max(i,h);if(void 0!==e&&void 0!==n){const r=t-2*e+s;if(0!==r){const i=(t-e)/r;if(i>0&&i<1){const h=(1-i)*(1-i)*t+2*(1-i)*i*e+i*i*s;o=Math.min(o,h),u=Math.max(u,h)}}const c=i-2*n+h;if(0!==c){const t=(i-n)/c;if(t>0&&t<1){const s=(1-t)*(1-t)*i+2*(1-t)*t*n+t*t*h;a=Math.min(a,s),l=Math.max(l,s)}}}const c=r/2;return{minX:o-c,minY:a-c,maxX:u+c,maxY:l+c}}calculateBoundingBox(){return u.calculateBoundingBox(this.startX,this.startY,this.endX,this.endY,this.controlX,this.controlY,this.strokeWidth)}serialize(){const t=super.serialize();return delete t._adjustedPoints,delete t._clipInfo,t}deserialize(t){const i=super.deserialize(t);return this._adjustedPoints=null,this._clipInfo=null,i}updateDimensions(){const{minX:t,minY:i,maxX:s,maxY:h}=this.calculateBoundingBox();this.width=s-t,this.height=h-i,this.x=t,this.y=i,this.translateX=(this.x+this.translateX)/this.scale,this.translateY=(this.y+this.translateY)/this.scale}get startMarkerId(){return`arrow-start-${this.id}`}get endMarkerId(){return`arrow-end-${this.id}`}getArrowSize(t){const i="start"===t?this.arrows?.start:this.arrows?.end;return i?.size??3*this.strokeWidth}getArrowFill(t){const s="start"===t?this.arrows?.start:this.arrows?.end;return i.resolveThemeColor(s?.fill??this.stroke)}getArrowPath(t="triangle"){switch(t){case"triangle":default:return"M 0 0 L 10 5 L 0 10 z";case"open":return"M 0 0 L 10 5 L 0 10";case"diamond":return"M 0 5 L 5 0 L 10 5 L 5 10 z";case"circle":return"M 5,0 A 5,5 0 1,1 5,10 A 5,5 0 1,1 5,0"}}get hasStartArrow(){return!0===this.arrows?.start?.enabled}get hasEndArrow(){return!0===this.arrows?.end?.enabled}}export{h as K,a,u as b,e as c,s as d}
|
|
1
|
+
import{O as t}from"./p-Dd-pMvlr.js";import{a as i}from"./p-BmyTdQGy.js";class s{static doPolygonsIntersect(t,i){const s=[t.bottomLeft,t.bottomRight,t.topRight,t.topLeft],h=[i.bottomLeft,i.bottomRight,i.topRight,i.topLeft];for(const t of s)if(this.isPointInPolygon(t,h))return!0;for(const t of h)if(this.isPointInPolygon(t,s))return!0;for(let t=0;t<s.length;t++){const i=s[t],e=s[(t+1)%s.length];for(let t=0;t<h.length;t++)if(this.intersectLines(i,e,h[t],h[(t+1)%h.length]))return!0}return!1}static isPointInPolygon(t,i){let s=!1;for(let h=0,e=i.length-1;h<i.length;e=h++){const n=i[h].x,r=i[h].y,o=i[e].y;r>t.y!=o>t.y&&t.x<(i[e].x-n)*(t.y-r)/(o-r)+n&&(s=!s)}return s}static intersectLines(t,i,s,h){const e=(i.x-t.x)*(h.y-s.y)-(i.y-t.y)*(h.x-s.x);if(0===e)return!1;const n=((s.x-t.x)*(h.y-s.y)-(s.y-t.y)*(h.x-s.x))/e,r=-((t.x-s.x)*(i.y-t.y)-(t.y-s.y)*(i.x-t.x))/e;return n>=0&&n<=1&&r>=0&&r<=1}static getLineIntersectionPoint(t,i,s,h){const e=(i.x-t.x)*(h.y-s.y)-(i.y-t.y)*(h.x-s.x);if(0===e)return null;const n=((s.x-t.x)*(h.y-s.y)-(s.y-t.y)*(h.x-s.x))/e,r=-((t.x-s.x)*(i.y-t.y)-(t.y-s.y)*(i.x-t.x))/e;return n>=0&&n<=1&&r>=0&&r<=1?{x:t.x+n*(i.x-t.x),y:t.y+n*(i.y-t.y)}:null}static getLinePolygonIntersection(t,i,s){const h=[s.topLeft,s.topRight,s.bottomRight,s.bottomLeft];let e=null,n=1/0;for(let s=0;s<h.length;s++){const r=this.getLineIntersectionPoint(t,i,h[s],h[(s+1)%h.length]);if(r){const i=Math.sqrt(Math.pow(r.x-t.x,2)+Math.pow(r.y-t.y,2));i<n&&(n=i,e=r)}}return e}static getEllipsePolygonApproximation(t,i,s,h,e=32,n=0){const r=[],o=Math.cos(n),a=Math.sin(n);for(let n=0;n<e;n++){const u=2*Math.PI*n/e,l=s*Math.cos(u),c=h*Math.sin(u);r.push({x:t+l*o-c*a,y:i+l*a+c*o})}return r}static getLinePointsArrayIntersection(t,i,s){let h=null,e=1/0;for(let n=0;n<s.length;n++){const r=this.getLineIntersectionPoint(t,i,s[n],s[(n+1)%s.length]);if(r){const i=Math.sqrt(Math.pow(r.x-t.x,2)+Math.pow(r.y-t.y,2));i<e&&(e=i,h=r)}}return h}static isPointInPolygonPoints(t,i){return this.isPointInPolygon(t,i)}}class h{__class__="KritzelBaseObject";_core;_elementRef;id;workspaceId;x;y;translateX;translateY;height;width;backgroundColor;borderColor;borderWidth=0;opacity=1;padding=0;scale;resizing=!1;rotation=0;markedForRemoval=!1;zIndex=0;userId;isVisible=!0;isSelected=!1;isHovered=!1;isMounted=!1;isEditable=!1;isInteractive=!1;isResizable=!0;isRotatable=!0;get totalWidth(){return this.width+2*this.padding}get totalHeight(){return this.height+2*this.padding}set elementRef(t){this._elementRef=t}get elementRef(){return this._elementRef}get boundingBox(){return{x:this.translateX,y:this.translateY,z:this.scale,width:this.totalWidth/this.scale,height:this.totalHeight/this.scale}}get rotatedBoundingBox(){const t=this.rotatedPolygon,i=[t.topLeft.x,t.topRight.x,t.bottomRight.x,t.bottomLeft.x],s=[t.topLeft.y,t.topRight.y,t.bottomRight.y,t.bottomLeft.y],h=Math.min(...i),e=Math.max(...i),n=Math.min(...s),r=Math.max(...s);return{x:h,y:n,z:this.scale,width:e-h,height:r-n}}get rotatedPolygon(){const t=this.translateX+this.totalWidth/2/this.scale,i=this.translateY+this.totalHeight/2/this.scale,s=this.rotation,h=Math.cos(s),e=Math.sin(s),n=this.translateX,r=this.translateY,o=n+this.totalWidth/this.scale,a=r+this.totalHeight/this.scale,u=(s,n)=>({x:h*(s-t)-e*(n-i)+t,y:e*(s-t)+h*(n-i)+i});return{topLeft:u(n,r),topRight:u(o,r),bottomRight:u(o,a),bottomLeft:u(n,a)}}get minXRotated(){return Math.min(this.rotatedPolygon.topLeft.x,this.rotatedPolygon.topRight.x,this.rotatedPolygon.bottomRight.x,this.rotatedPolygon.bottomLeft.x)}get minYRotated(){return Math.min(this.rotatedPolygon.topLeft.y,this.rotatedPolygon.topRight.y,this.rotatedPolygon.bottomRight.y,this.rotatedPolygon.bottomLeft.y)}get maxXRotated(){return Math.max(this.rotatedPolygon.topLeft.x,this.rotatedPolygon.topRight.x,this.rotatedPolygon.bottomRight.x,this.rotatedPolygon.bottomLeft.x)}get maxYRotated(){return Math.max(this.rotatedPolygon.topLeft.y,this.rotatedPolygon.topRight.y,this.rotatedPolygon.bottomRight.y,this.rotatedPolygon.bottomLeft.y)}get transformationMatrix(){const t=1/this.scale;return`matrix(${t}, 0, 0, ${t}, ${this.translateX}, ${this.translateY})`}get rotationDegrees(){return this.rotation*(180/Math.PI)}get centerX(){return this.translateX+this.totalWidth/2/this.scale}get centerY(){return this.translateY+this.totalHeight/2/this.scale}constructor(){this.id=this.generateId()}static create(t){const i=new h;return i._core=t,i.zIndex=t.store.currentZIndex,i.workspaceId=t.store.state.activeWorkspace.id,i.userId=t.user?.id,i}mount(t){this.isMounted||(this.elementRef=t,this.isMounted=!0)}generateId(){return t.generateUUID()}isInViewport(){const t=this._core.store.state.scale;if(this.boundingBox.width*t*(this.boundingBox.height*t)<.5)return!1;const i=-this._core.store.state.translateX/this._core.store.state.scale,s=-this._core.store.state.translateY/this._core.store.state.scale;return this.rotatedBoundingBox.x<i+this._core.store.state.viewportWidth/this._core.store.state.scale&&this.rotatedBoundingBox.x+this.rotatedBoundingBox.width>i&&this.rotatedBoundingBox.y<s+this._core.store.state.viewportHeight/this._core.store.state.scale&&this.rotatedBoundingBox.y+this.rotatedBoundingBox.height>s}centerInViewport(){const{viewportWidth:t,viewportHeight:i,translateX:s,translateY:h,scale:e}=this._core.store.state,{x:n,y:r,width:o,height:a}=this.rotatedBoundingBox;this.updatePosition(this.translateX+((t/2-s)/e-(n+o/2)),this.translateY+((i/2-h)/e-(r+a/2)))}update(){this._core.store.objects.update(this)}move(t,i,s,h){const e=(i-h)/this._core.store.state.scale;this.translateX+=(t-s)/this._core.store.state.scale,this.translateY+=e,this._core.store.objects.update(this)}resize(t,i,s,h){s<=1||h<=1||(this.width=s,this.height=h,this.translateX=t,this.translateY=i,this._core.store.objects.update(this),this._core.anchorManager.updateAnchorsForObject(this.id))}rotate(t){this.rotation=t,this._core.store.objects.update(this)}clone(){const t=Object.create(Object.getPrototypeOf(this));return Object.assign(t,this),t.id=this.id,t}copy(){const t=Object.create(Object.getPrototypeOf(this));return Object.assign(t,this),t.id=this.generateId(),t.isMounted=!1,t.isSelected=!1,t.isHovered=!1,t.isInteractive=!1,t.resizing=!1,t.markedForRemoval=!1,t.isVisible=!0,t}serialize(){const{_core:t,_elementRef:i,element:s,totalWidth:h,totalHeight:e,isSelected:n,isHovered:r,isMounted:o,isInteractive:a,resizing:u,markedForRemoval:l,isVisible:c,...f}=this;return structuredClone(f)}deserialize(t){return Object.assign(this,t),this.isSelected=!1,this.isHovered=!1,this.isMounted=!1,this.isInteractive=!1,this.resizing=!1,this.markedForRemoval=!1,this.isVisible=!0,"_adjustedPoints"in this&&(this._adjustedPoints=null),"_clipInfo"in this&&(this._clipInfo=null),this}adoptTransientStateFrom(t){}isClass(t){return this.__class__===t}edit(t){}onAfterUpdate(t){}hitTest(t,i){return!0}hitTestPolygon(t){return s.doPolygonsIntersect(this.rotatedPolygon,t)}updatePosition(t,i){this.translateX=t,this.translateY=i,this._core.store.objects.update(this)}}class e{static average(t,i){return(t+i)/2}static degreesToRadians(t){return t*(Math.PI/180)}}var n,r={},o=(n||(n=1,function(t){Object.defineProperties(t,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const{PI:i}=Math,s=i+1e-4,h=[1,1];function e(t,i,s,h=t=>t){return t*h(.5-i*(.5-s))}const{min:n}=Math;function r(t,i,s){let h=n(1,i/s);return n(1,t+(n(1,1-h)-t)*(.275*h))}function o(t,i){return[t[0]+i[0],t[1]+i[1]]}function a(t,i,s){return t[0]=i[0]+s[0],t[1]=i[1]+s[1],t}function u(t,i){return[t[0]-i[0],t[1]-i[1]]}function l(t,i,s){return t[0]=i[0]-s[0],t[1]=i[1]-s[1],t}function c(t,i){return[t[0]*i,t[1]*i]}function f(t,i,s){return t[0]=i[0]*s,t[1]=i[1]*s,t}function d(t){return[t[1],-t[0]]}function M(t,i){let s=i[0];return t[0]=i[1],t[1]=-s,t}function g(t,i){return t[0]*i[0]+t[1]*i[1]}function m(t,i){return t[0]===i[0]&&t[1]===i[1]}function p(t,i){let s=t[0]-i[0],h=t[1]-i[1];return s*s+h*h}function x(t){return function(t,i){return[t[0]/i,t[1]/i]}(t,function(t){return Math.hypot(t[0],t[1])}(t))}function y(t,i){return Math.hypot(t[1]-i[1],t[0]-i[0])}function v(t,i,s){let h=Math.sin(s),e=Math.cos(s),n=t[0]-i[0],r=t[1]-i[1];return[n*e-r*h+i[0],n*h+r*e+i[1]]}function P(t,i,s,h){let e=Math.sin(h),n=Math.cos(h),r=i[0]-s[0],o=i[1]-s[1],a=r*e+o*n;return t[0]=r*n-o*e+s[0],t[1]=a+s[1],t}function $(t,i,s){return o(t,c(u(i,t),s))}function b(t,i,s,h){let e=s[1]-i[1];return t[0]=i[0]+(s[0]-i[0])*h,t[1]=i[1]+e*h,t}function w(t,i,s){return o(t,c(i,s))}const z=[0,0],L=[0,0],_=[0,0];function I(t,i){let h=w(t,x(d(u(t,o(t,[1,1])))),-i),e=[],n=1/13;for(let i=n;i<=1;i+=n)e.push(v(h,t,2*s*i));return e}function X(t,i,h){let e=[],n=1/h;for(let h=n;h<=1;h+=n)e.push(v(i,t,s*h));return e}function Y(t,i,s){let h=u(i,s),e=c(h,.5),n=c(h,.51);return[u(t,e),u(t,n),o(t,n),o(t,e)]}function k(t,i,h,e){let n=[],r=w(t,i,h),o=1/e;for(let i=o;i<1;i+=o)n.push(v(r,t,3*s*i));return n}function R(t,i,s){return[o(t,c(i,s)),o(t,c(i,.99*s)),u(t,c(i,.99*s)),u(t,c(i,s))]}function j(t,i,s){return!1===t||void 0===t?0:!0===t?Math.max(i,s):t}function A(t,i={}){let{size:h=16,smoothing:n=.5,thinning:c=.5,simulatePressure:m=!0,easing:x=t=>t,start:y={},end:v={},last:$=!1}=i,{cap:w=!0,easing:A=t=>t*(2-t)}=y,{cap:B=!0,easing:S=t=>--t*t*t+1}=v;if(0===t.length||h<=0)return[];let T,C=t[t.length-1].runningLength,O=j(y.taper,h,C),D=j(v.taper,h,C),V=(h*n)**2,W=[],F=[],H=function(t,i,s){return t.slice(0,10).reduce(((t,h)=>{let e=h.pressure;return i&&(e=r(t,h.distance,s)),(t+e)/2}),t[0].pressure)}(t,m,h),E=e(h,c,t[t.length-1].pressure,x),K=t[0].vector,Q=t[0].point,U=Q,G=Q,Z=U,q=!1;for(let i=0;i<t.length;i++){let{pressure:n}=t[i],{point:d,vector:y,distance:v,runningLength:$}=t[i],w=i===t.length-1;if(!w&&C-$<3)continue;c?(m&&(n=r(H,v,h)),E=e(h,c,n,x)):E=h/2,void 0===T&&(T=E);let I=$<O?A($/O):1,X=C-$<D?S((C-$)/D):1;E=Math.max(.01,E*Math.min(I,X));let Y=(w?t[i]:t[i+1]).vector,k=w?1:g(y,Y),R=null!==k&&k<0;if(g(y,K)<0&&!q||R){M(z,K),f(z,z,E);for(let t=0;t<=1;t+=.07692307692307693)l(L,d,z),P(L,L,d,s*t),G=[L[0],L[1]],W.push(G),a(_,d,z),P(_,_,d,s*-t),Z=[_[0],_[1]],F.push(Z);Q=G,U=Z,R&&(q=!0)}else q=!1,w?(M(z,y),f(z,z,E),W.push(u(d,z)),F.push(o(d,z))):(b(z,Y,y,k),M(z,z),f(z,z,E),l(L,d,z),G=[L[0],L[1]],(i<=1||p(Q,G)>V)&&(W.push(G),Q=G),a(_,d,z),Z=[_[0],_[1]],(i<=1||p(U,Z)>V)&&(F.push(Z),U=Z),H=n,K=y)}let J=[t[0].point[0],t[0].point[1]],N=t.length>1?[t[t.length-1].point[0],t[t.length-1].point[1]]:o(t[0].point,[1,1]),tt=[],it=[];if(1===t.length){if(!O&&!D||$)return I(J,T||E)}else{O||D&&1===t.length||(w?tt.push(...X(J,F[0],13)):tt.push(...Y(J,W[0],F[0])));let i=d(function(t){return[-t[0],-t[1]]}(t[t.length-1].vector));D||O&&1===t.length?it.push(N):B?it.push(...k(N,i,E,29)):it.push(...R(N,i,E))}return W.concat(it,F.reverse(),tt)}const B=[0,0];function S(t){return null!=t&&t>=0}function T(t,i={}){let{streamline:s=.5,size:e=16,last:n=!1}=i;if(0===t.length)return[];let r=.15+.85*(1-s),a=Array.isArray(t[0])?t:t.map((({x:t,y:i,pressure:s=.5})=>[t,i,s]));if(2===a.length){let t=a[1];a=a.slice(0,-1);for(let i=1;i<5;i++)a.push($(a[0],t,i/4))}1===a.length&&(a=[...a,[...o(a[0],h),...a[0].slice(2)]]);let u=[{point:[a[0][0],a[0][1]],pressure:S(a[0][2])?a[0][2]:.25,vector:[...h],distance:0,runningLength:0}],c=!1,f=0,d=u[0],M=a.length-1;for(let t=1;t<a.length;t++){let i=n&&t===M?[a[t][0],a[t][1]]:$(d.point,a[t],r);if(m(d.point,i))continue;let s=y(i,d.point);if(f+=s,t<M&&!c){if(f<e)continue;c=!0}l(B,d.point,i),d={point:i,pressure:S(a[t][2])?a[t][2]:.5,vector:x(B),distance:s,runningLength:f},u.push(d)}return u[0].vector=u[1]?.vector||[0,0],u}function C(t,i={}){return A(T(t,i),i)}t.default=C,t.getStroke=C,t.getStrokeOutlinePoints=A,t.getStrokePoints=T}(r)),r);class a extends h{__class__="KritzelPath";points;d;stroke={light:"none",dark:"none"};strokeWidth;lineSlack=.5;fill;x=0;y=0;height=0;width=0;scale=1;options;isVisible=!0;isDebugInfoVisible=!0;isCompleted=!1;_adjustedPoints=null;get viewBox(){return`${this.x} ${this.y} ${this.width} ${this.height}`}constructor(t){super(),this.options=t,this.points=t?.points??[],this.translateX=t?.translateX??0,this.translateY=t?.translateY??0,this.rotation=e.degreesToRadians(t?.rotation??0),this.scale=t?.scale??1,this.strokeWidth=t?.strokeWidth??8,this.fill=t?.fill??{light:"#000000",dark:"#ffffff"},this.d=this.generateSvgPath(),this.updateDimensions()}static create(t,i){const s=new a;return s._core=t,s.id=s.generateId(),s.workspaceId=t.store.state.activeWorkspace.id,s.userId=t.user?.id,s.options=i,s.points=i?.points??[],s.translateX=i?.translateX??0,s.translateY=i?.translateY??0,s.rotation=e.degreesToRadians(i?.rotation??0),s.scale=i?.scale??1,s.strokeWidth=i?.strokeWidth??8,s.fill=i?.fill??{light:"#000000",dark:"#ffffff"},s.opacity=i?.opacity??1,s.zIndex=t.store.currentZIndex,s.d=s.generateSvgPath(),s.updateDimensions(),s}copy(){const t=super.copy();return this.points&&(t.points=this.points.map((t=>[...t]))),t}resize(t,i,s,h){if(s<=1||h<=1)return;const e=s/this.width,n=h/this.height;if(this.width=s,this.height=h,1===this.points.length){const t=this.points[0],i=Math.max(0,s-this.strokeWidth)/e,r=Math.max(0,h-this.strokeWidth)/n;this.points.push([t[0]+i,t[1]+r])}this.points=this.points.map((([t,i])=>[t*e,i*n])),this.d=this.generateSvgPath(),this.width=Math.max(...this.points.map((t=>t[0])))-Math.min(...this.points.map((t=>t[0])))+this.strokeWidth,this.height=Math.max(...this.points.map((t=>t[1])))-Math.min(...this.points.map((t=>t[1])))+this.strokeWidth,this.x=Math.min(...this.points.map((t=>t[0])))-this.strokeWidth/2,this.y=Math.min(...this.points.map((t=>t[1])))-this.strokeWidth/2,null!==t&&(this.translateX=t),null!==i&&(this.translateY=i),this._adjustedPoints=null,this._core.store.objects.update(this)}rotate(t){this.rotation=t,this._adjustedPoints=null,this._core.store.objects.update(this)}move(t,i,s,h){const e=(i-h)/this._core.store.state.scale;this.translateX+=(t-s)/this._core.store.state.scale,this.translateY+=e,this._adjustedPoints=null,this._core.store.objects.update(this)}hitTest(t,i){const s=this.strokeWidth/this.scale/2;if(null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints()),1===this._adjustedPoints.length){const h=this._adjustedPoints[0];return this.pointToLineSegmentDistance(t,i,h[0],h[1],h[0],h[1])<=s}for(let h=0;h<this._adjustedPoints.length-1;h++){const e=this._adjustedPoints[h],n=this._adjustedPoints[h+1];if(this.pointToLineSegmentDistance(t,i,e[0],e[1],n[0],n[1])<=s)return!0}return!1}hitTestPolygon(t){const i=this.strokeWidth/this.scale/2;null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints());const h=[{x:t.bottomLeft.x,y:t.bottomLeft.y},{x:t.bottomRight.x,y:t.bottomRight.y},{x:t.topRight.x,y:t.topRight.y},{x:t.topLeft.x,y:t.topLeft.y}];for(const[t,i]of this._adjustedPoints)if(s.isPointInPolygon({x:t,y:i},h))return!0;for(const t of h)if(this.hitTest(t.x,t.y))return!0;for(let t=0;t<this._adjustedPoints.length-1;t++){const i={x:this._adjustedPoints[t][0],y:this._adjustedPoints[t][1]},e={x:this._adjustedPoints[t+1][0],y:this._adjustedPoints[t+1][1]};for(let t=0;t<h.length;t++)if(s.intersectLines(i,e,h[t],h[(t+1)%h.length]))return!0}for(let t=0;t<this._adjustedPoints.length-1;t++){const s=this._adjustedPoints[t],e=this._adjustedPoints[t+1];for(let t=0;t<h.length;t++){const n=h[t],r=h[(t+1)%h.length],o=this.pointToLineSegmentDistance(n.x,n.y,s[0],s[1],e[0],e[1]),a=this.pointToLineSegmentDistance(r.x,r.y,s[0],s[1],e[0],e[1]),u=this.pointToLineSegmentDistance(s[0],s[1],n.x,n.y,r.x,r.y),l=this.pointToLineSegmentDistance(e[0],e[1],n.x,n.y,r.x,r.y);if(Math.min(o,a,u,l)<=i)return!0}}return!1}updatePosition(t,i){this.translateX=t,this.translateY=i,this._adjustedPoints=null,this._core.store.objects.update(this)}onAfterUpdate(t){t.includes("strokeWidth")&&(this.d=this.generateSvgPath(),this.updateBoundingBox(),this._adjustedPoints=null)}computeAdjustedPoints(){if(!this.points?.length)return[];const t=this.rotation,i=Math.cos(t),s=Math.sin(t),h=this.points.map((t=>t[0])),e=this.points.map((t=>t[1])),n={x:(Math.min(...h)+Math.max(...h))/2,y:(Math.min(...e)+Math.max(...e))/2},{x:r,y:o}=n;return this.points.map((([t,h])=>{const e=t-r,n=h-o;return[r+e*i-n*s,o+e*s+n*i]})).map((([t,i])=>[Math.abs(t-this.x)/this.scale+this.translateX,Math.abs(i-this.y)/this.scale+this.translateY]))}pointToLineSegmentDistance(t,i,s,h,e,n){const r=e-s,o=n-h,a=r*r+o*o;let u,l,c=-1;0!==a&&(c=((t-s)*r+(i-h)*o)/a),c<0?(u=s,l=h):c>1?(u=e,l=n):(u=s+c*r,l=h+c*o);const f=t-u,d=i-l;return Math.sqrt(f*f+d*d)}updateDimensions(){const t=Math.min(...this.points.map((t=>t[0])))-this.strokeWidth/2,i=Math.min(...this.points.map((t=>t[1])))-this.strokeWidth/2,s=Math.max(...this.points.map((t=>t[0])))+this.strokeWidth/2,h=Math.max(...this.points.map((t=>t[1])))+this.strokeWidth/2;this.width=s-t+this.lineSlack,this.height=h-i+this.lineSlack,this.x=t,this.y=i,this.translateX=(this.x+this.translateX)/this.scale,this.translateY=(this.y+this.translateY)/this.scale}updateBoundingBox(){const t=Math.min(...this.points.map((t=>t[0])))-this.strokeWidth/2,i=Math.min(...this.points.map((t=>t[1])))-this.strokeWidth/2,s=Math.max(...this.points.map((t=>t[0])))+this.strokeWidth/2,h=Math.max(...this.points.map((t=>t[1])))+this.strokeWidth/2;this.width=s-t+this.lineSlack,this.height=h-i+this.lineSlack,this.x=t,this.y=i}generateSvgPath(){const t=this.getStrokeFromPoints(this.points,this.strokeWidth);return this.getSvgPathFromStroke(t)}getStrokeFromPoints(t,i){return o.getStroke(t,{size:i,thinning:.5,smoothing:.5,streamline:.5,easing:t=>t,simulatePressure:!0,last:!0,start:{cap:!0,taper:0,easing:t=>t},end:{cap:!0,taper:0,easing:t=>t}})}getSvgPathFromStroke(t,i=!0){const s=t.length;if(s<4)return"";let h=t[0],n=t[1];const r=t[2];let o=`M${h[0].toFixed(2)},${h[1].toFixed(2)} Q${n[0].toFixed(2)},${n[1].toFixed(2)} ${e.average(n[0],r[0]).toFixed(2)},${e.average(n[1],r[1]).toFixed(2)} T`;for(let i=2,r=s-1;i<r;i++)h=t[i],n=t[i+1],o+=`${e.average(h[0],n[0]).toFixed(2)},${e.average(h[1],n[1]).toFixed(2)} `;return i&&(o+="Z"),o}isLowRes(){if(!this._core)return!1;const t=this._core.store.state.scale;return this.boundingBox.width*t*(this.boundingBox.height*t)<500}getClipPoint(t){const i=this.centerX,s=this.centerY,h=this.strokeWidth/this.scale/2;if(null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints()),this._adjustedPoints.length<1)return null;let e=!0;for(let n=1;n<=32;n++){const r=n/32,o=t.x+(i-t.x)*r,a=t.y+(s-t.y)*r;let u=1/0;if(1===this._adjustedPoints.length){const t=this._adjustedPoints[0],i=o-t[0],s=a-t[1];u=Math.sqrt(i*i+s*s)}else for(let t=0;t<this._adjustedPoints.length-1;t++){const i=this._adjustedPoints[t],s=this._adjustedPoints[t+1],h=this.pointToLineSegmentDistance(o,a,i[0],i[1],s[0],s[1]);h<u&&(u=h)}const l=u<=h;if(e&&l){let e=(n-1)/32,o=r;for(let n=0;n<8;n++){const n=(e+o)/2,r=t.x+(i-t.x)*n,a=t.y+(s-t.y)*n;let u=1/0;if(1===this._adjustedPoints.length){const t=this._adjustedPoints[0],i=r-t[0],s=a-t[1];u=Math.sqrt(i*i+s*s)}else for(let t=0;t<this._adjustedPoints.length-1;t++){const i=this._adjustedPoints[t],s=this._adjustedPoints[t+1],h=this.pointToLineSegmentDistance(r,a,i[0],i[1],s[0],s[1]);h<u&&(u=h)}u<=h?o=n:e=n}const a=(e+o)/2;return{x:t.x+(i-t.x)*a,y:t.y+(s-t.y)*a}}e=!l}return null}}class u extends h{__class__="KritzelLine";startX;startY;endX;endY;controlX;controlY;stroke;strokeWidth;scale=1;options;startAnchor;endAnchor;arrows;isVisible=!0;isDebugInfoVisible=!0;isCompleted=!1;_adjustedPoints=null;_clipInfo=null;get d(){return void 0!==this.controlX&&void 0!==this.controlY?`M ${this.startX} ${this.startY} Q ${this.controlX} ${this.controlY} ${this.endX} ${this.endY}`:`M ${this.startX} ${this.startY} L ${this.endX} ${this.endY}`}get viewBox(){return`${this.x} ${this.y} ${this.width} ${this.height}`}constructor(t){super(),this.options=t,this.startX=t?.startX??0,this.startY=t?.startY??0,this.endX=t?.endX??0,this.endY=t?.endY??0,this.controlX=t?.controlX,this.controlY=t?.controlY,this.translateX=t?.translateX??0,this.translateY=t?.translateY??0,this.rotation=e.degreesToRadians(t?.rotation??0),this.scale=t?.scale??1,this.strokeWidth=t?.strokeWidth??4,this.stroke=t?.stroke??{light:"#000000",dark:"#ffffff"},this.startAnchor=t?.startAnchor,this.endAnchor=t?.endAnchor,this.arrows=t?.arrows,this.updateDimensions()}static create(t,i){const s=new u;return s._core=t,s.id=s.generateId(),s.workspaceId=t.store.state.activeWorkspace.id,s.userId=t.user?.id,s.options=i,s.startX=i?.startX??0,s.startY=i?.startY??0,s.endX=i?.endX??0,s.endY=i?.endY??0,s.controlX=i?.controlX,s.controlY=i?.controlY,s.translateX=i?.translateX??0,s.translateY=i?.translateY??0,s.rotation=e.degreesToRadians(i?.rotation??0),s.scale=i?.scale??1,s.strokeWidth=i?.strokeWidth??4,s.stroke=i?.stroke??{light:"#000000",dark:"#ffffff"},s.opacity=i?.opacity??1,s.startAnchor=i?.startAnchor,s.endAnchor=i?.endAnchor,s.arrows=i?.arrows,s.zIndex=t.store.currentZIndex,s.updateDimensions(),s}resize(t,i,s,h){if(s<=1||h<=1)return;const e=s/this.width,n=h/this.height;this.startX=this.startX*e,this.startY=this.startY*n,this.endX=this.endX*e,this.endY=this.endY*n,void 0!==this.controlX&&void 0!==this.controlY&&(this.controlX=this.controlX*e,this.controlY=this.controlY*n);const{minX:r,minY:o,maxX:a,maxY:u}=this.calculateBoundingBox();this.width=a-r,this.height=u-o,this.x=r,this.y=o,this.translateX=t,this.translateY=i,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this),this._core.anchorManager.updateAnchorsForObject(this.id),this.startAnchor&&this._core.anchorManager.updateAnchorsForObject(this.startAnchor.objectId),this.endAnchor&&this._core.anchorManager.updateAnchorsForObject(this.endAnchor.objectId)}rotate(t){this.rotation=t,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}move(t,i,s,h){const e=(i-h)/this._core.store.state.scale;this.translateX+=(t-s)/this._core.store.state.scale,this.translateY+=e,this.startAnchor&&this._core.anchorManager.updateAnchorsForObject(this.startAnchor.objectId),this.endAnchor&&this._core.anchorManager.updateAnchorsForObject(this.endAnchor.objectId),this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}hitTest(t,i){const s=Math.max(this.strokeWidth,20)/this.scale/2;if(null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints()),void 0!==this.controlX&&void 0!==this.controlY){const h=this.getClipInfo();return this.pointToBezierDistance(t,i,h.start?.t??0,h.end?.t??1)<=s}const h=this.getClipInfo(),e=h.start?[h.start.x,h.start.y]:this._adjustedPoints[0],n=h.end?[h.end.x,h.end.y]:this._adjustedPoints[1];return this.pointToLineSegmentDistance(t,i,e[0],e[1],n[0],n[1])<=s}hitTestPolygon(t){const i=this.strokeWidth/this.scale/2;null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints());const h=this.getClipInfo(),e=[{x:t.bottomLeft.x,y:t.bottomLeft.y},{x:t.bottomRight.x,y:t.bottomRight.y},{x:t.topRight.x,y:t.topRight.y},{x:t.topLeft.x,y:t.topLeft.y}],n=h.start?[h.start.x,h.start.y]:this._adjustedPoints[0],r=h.end?[h.end.x,h.end.y]:this._adjustedPoints[1],o=[n,r];for(const[t,i]of o)if(s.isPointInPolygon({x:t,y:i},e))return!0;for(const t of e)if(this.hitTest(t.x,t.y))return!0;if(void 0!==this.controlX&&void 0!==this.controlY){const t=this._adjustedPoints[0],n=this._adjustedPoints[1],r=this.computeAdjustedControlPoint(),o=h.start?.t??0,a=h.end?.t??1,u=20;for(let h=0;h<=u;h++){const l=o+h/u*(a-o),c=1-l,f=c*c*t[0]+2*c*l*r[0]+l*l*n[0],d=c*c*t[1]+2*c*l*r[1]+l*l*n[1];if(s.isPointInPolygon({x:f,y:d},e))return!0;for(let t=0;t<e.length;t++){const s=e[t],h=e[(t+1)%e.length];if(this.pointToLineSegmentDistance(f,d,s.x,s.y,h.x,h.y)<=i)return!0}}return!1}const a={x:n[0],y:n[1]},u={x:r[0],y:r[1]};for(let t=0;t<e.length;t++){const h=e[t],n=e[(t+1)%e.length];if(s.intersectLines(a,u,h,n))return!0;const r=this.pointToLineSegmentDistance(h.x,h.y,a.x,a.y,u.x,u.y),o=this.pointToLineSegmentDistance(n.x,n.y,a.x,a.y,u.x,u.y),l=this.pointToLineSegmentDistance(a.x,a.y,h.x,h.y,n.x,n.y),c=this.pointToLineSegmentDistance(u.x,u.y,h.x,h.y,n.x,n.y);if(Math.min(r,o,l,c)<=i)return!0}return!1}updatePosition(t,i){this.translateX=t,this.translateY=i,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}updateEndpoint(t,i,s){"start"===t?(this.startX=i,this.startY=s):(this.endX=i,this.endY=s);const h=this.width,e=this.height,{minX:n,minY:r,maxX:o,maxY:a}=this.calculateBoundingBox(),u=n-this.x,l=r-this.y,c=o-n,f=a-r,d=(c-h)/2,M=(f-e)/2;this.x=n,this.y=r,this.width=c,this.height=f;const g=Math.cos(this.rotation),m=Math.sin(this.rotation),p=u+d,x=l+M,y=p*m+x*g-M;this.translateX+=(p*g-x*m-d)/this.scale,this.translateY+=y/this.scale,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}updateControlPoint(t,i){this.controlX=t,this.controlY=i;const s=this.width,h=this.height,{minX:e,minY:n,maxX:r,maxY:o}=this.calculateBoundingBox(),a=e-this.x,u=n-this.y,l=r-e,c=o-n,f=(l-s)/2,d=(c-h)/2;this.x=e,this.y=n,this.width=l,this.height=c;const M=Math.cos(this.rotation),g=Math.sin(this.rotation),m=a+f,p=u+d,x=m*g+p*M-d;this.translateX+=(m*M-p*g-f)/this.scale,this.translateY+=x/this.scale,this._adjustedPoints=null,this._clipInfo=null,this._core.store.objects.update(this)}computeAdjustedPoints(){const t=[[this.startX,this.startY],[this.endX,this.endY]],i=this.rotation,s=Math.cos(i),h=Math.sin(i),e=t.map((t=>t[0])),n=t.map((t=>t[1])),r={x:(Math.min(...e)+Math.max(...e))/2,y:(Math.min(...n)+Math.max(...n))/2},{x:o,y:a}=r;return t.map((([t,i])=>{const e=t-o,n=i-a;return[o+e*s-n*h,a+e*h+n*s]})).map((([t,i])=>[(t-this.x)/this.scale+this.translateX,(i-this.y)/this.scale+this.translateY]))}pointToLineSegmentDistance(t,i,s,h,e,n){const r=e-s,o=n-h,a=r*r+o*o;let u,l,c=-1;0!==a&&(c=((t-s)*r+(i-h)*o)/a),c<0?(u=s,l=h):c>1?(u=e,l=n):(u=s+c*r,l=h+c*o);const f=t-u,d=i-l;return Math.sqrt(f*f+d*d)}pointToBezierDistance(t,i,s=0,h=1){null===this._adjustedPoints&&(this._adjustedPoints=this.computeAdjustedPoints());const e=this._adjustedPoints[0],n=this._adjustedPoints[1],r=this.computeAdjustedControlPoint();let o=1/0;for(let a=0;a<=20;a++){const u=s+a/20*(h-s),l=1-u,c=t-(l*l*e[0]+2*l*u*r[0]+u*u*n[0]),f=i-(l*l*e[1]+2*l*u*r[1]+u*u*n[1]),d=Math.sqrt(c*c+f*f);d<o&&(o=d)}return o}getClipInfo(){if(this._clipInfo)return this._clipInfo;const t=this.endAnchor,i={};if(this.startAnchor){const t=this._core.anchorManager.findAnchorTarget(this,"start");if(t){const s=this._core.anchorManager.computeAnchorClipInfo(this,"start",t);s&&(i.start={x:s.worldX,y:s.worldY,t:s.t})}}if(t){const t=this._core.anchorManager.findAnchorTarget(this,"end");if(t){const s=this._core.anchorManager.computeAnchorClipInfo(this,"end",t);s&&(i.end={x:s.worldX,y:s.worldY,t:s.t})}}return this._clipInfo=i,i}computeAdjustedControlPoint(){if(void 0===this.controlX||void 0===this.controlY)return[(this.startX+this.endX)/2,(this.startY+this.endY)/2];const t=this.rotation,i=Math.cos(t),s=Math.sin(t),h=[this.startX,this.endX],e=[this.startY,this.endY],n={x:(Math.min(...h)+Math.max(...h))/2,y:(Math.min(...e)+Math.max(...e))/2},{x:r,y:o}=n,a=this.controlX-r,u=this.controlY-o;return[(r+a*i-u*s-this.x)/this.scale+this.translateX,(o+a*s+u*i-this.y)/this.scale+this.translateY]}get rotatedPolygon(){const t=this.padding,{minX:i,minY:s,maxX:h,maxY:e}=u.calculateBoundingBox(this.startX,this.startY,this.endX,this.endY,this.controlX,this.controlY,this.strokeWidth),n=i-this.x+t,r=s-this.y+t,o=h-this.x+t,a=e-this.y+t,l={x:n,y:r},c={x:o,y:r},f={x:o,y:a},d={x:n,y:a},M=this.totalWidth/2,g=this.totalHeight/2,m=this.rotation,p=Math.cos(m),x=Math.sin(m),y=t=>({x:((t.x-M)*p-(t.y-g)*x+M)/this.scale+this.translateX,y:((t.x-M)*x+(t.y-g)*p+g)/this.scale+this.translateY});return{topLeft:y(l),topRight:y(c),bottomRight:y(f),bottomLeft:y(d)}}static calculateBoundingBox(t,i,s,h,e,n,r){let o=Math.min(t,s),a=Math.min(i,h),u=Math.max(t,s),l=Math.max(i,h);if(void 0!==e&&void 0!==n){const r=t-2*e+s;if(0!==r){const i=(t-e)/r;if(i>0&&i<1){const h=(1-i)*(1-i)*t+2*(1-i)*i*e+i*i*s;o=Math.min(o,h),u=Math.max(u,h)}}const c=i-2*n+h;if(0!==c){const t=(i-n)/c;if(t>0&&t<1){const s=(1-t)*(1-t)*i+2*(1-t)*t*n+t*t*h;a=Math.min(a,s),l=Math.max(l,s)}}}const c=r/2;return{minX:o-c,minY:a-c,maxX:u+c,maxY:l+c}}calculateBoundingBox(){return u.calculateBoundingBox(this.startX,this.startY,this.endX,this.endY,this.controlX,this.controlY,this.strokeWidth)}serialize(){const t=super.serialize();return delete t._adjustedPoints,delete t._clipInfo,t}deserialize(t){const i=super.deserialize(t);return this._adjustedPoints=null,this._clipInfo=null,i}updateDimensions(){const{minX:t,minY:i,maxX:s,maxY:h}=this.calculateBoundingBox();this.width=s-t,this.height=h-i,this.x=t,this.y=i,this.translateX=(this.x+this.translateX)/this.scale,this.translateY=(this.y+this.translateY)/this.scale}get startMarkerId(){return`arrow-start-${this.id}`}get endMarkerId(){return`arrow-end-${this.id}`}getArrowSize(t){const i="start"===t?this.arrows?.start:this.arrows?.end;return i?.size??3*this.strokeWidth}getArrowFill(t){const s="start"===t?this.arrows?.start:this.arrows?.end;return i.resolveThemeColor(s?.fill??this.stroke)}getArrowPath(t="triangle"){switch(t){case"triangle":default:return"M 0 0 L 10 5 L 0 10 z";case"open":return"M 0 0 L 10 5 L 0 10";case"diamond":return"M 0 5 L 5 0 L 10 5 L 5 10 z";case"circle":return"M 5,0 A 5,5 0 1,1 5,10 A 5,5 0 1,1 5,0"}}get hasStartArrow(){return!0===this.arrows?.start?.enabled}get hasEndArrow(){return!0===this.arrows?.end?.enabled}}export{h as K,a,u as b,e as c,s as d}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,H as t,c as s,h as i,d as r,t as o}from"./p-B43upypT.js";import{d as n}from"./p-
|
|
1
|
+
import{p as e,H as t,c as s,h as i,d as r,t as o}from"./p-B43upypT.js";import{d as n}from"./p-DgnK50xO.js";const l=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.sizeChange=s(this,"sizeChange")}sizes=[8,10,12,16,20,24];selectedSize=null;fontFamily="Arial";sizeChange;handleSizeClick(e){this.selectedSize=e,this.sizeChange.emit(e)}handleKeyDown(e,t){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.handleSizeClick(t))}render(){return i(r,{key:"56eb19367abe312bac3b626cfcae3b1ff6e90d21"},(this.sizes??[]).map((e=>i("div",{tabIndex:0,class:{"size-container":!0,selected:this.selectedSize===e},onClick:()=>this.handleSizeClick(e),onKeyDown:t=>this.handleKeyDown(t,e)},i("kritzel-font",{fontFamily:this.fontFamily,size:e,color:"var(--kritzel-global-text-primary)"})))))}static get style(){return":host{display:flex;align-items:flex-start;gap:8px;padding:0;box-sizing:border-box}.size-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:4px;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;border-radius:50%}.size-container:hover{background-color:var(--kritzel-font-size-hover-background-color, #ebebeb)}.size-container.selected{border-color:var(--kritzel-selection-border-color, #007AFF);background-color:var(--kritzel-font-size-selected-background-color, #e0e0e0)}"}},[513,"kritzel-font-size",{sizes:[16],selectedSize:[1026,"selected-size"],fontFamily:[1,"font-family"]}]);function a(){"undefined"!=typeof customElements&&["kritzel-font-size","kritzel-font"].forEach((e=>{switch(e){case"kritzel-font-size":customElements.get(o(e))||customElements.define(o(e),l);break;case"kritzel-font":customElements.get(o(e))||n()}}))}export{l as K,a as d}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
var e="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};function n(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}export{e as c,n as g}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as t,H as o,c as e,h as r,d as i,t as l}from"./p-B43upypT.js";import{f as n,e as s}from"./p-Dl3MwBL1.js";import{K as a}from"./p-jGOpkGDl.js";import{K as c,d}from"./p-COhjyuRa.js";import{a as h}from"./p-CpzicliK.js";import{d as p}from"./p-C4-Som48.js";import{d as k}from"./p-CO0eEzos.js";import{d as f}from"./p-Df3BwVGy.js";import{d as b}from"./p-BX-nQAyH.js";import{d as u}from"./p-JhOYwUOj.js";import{d as g}from"./p-Cb5YwXbC.js";import{d as z}from"./p-CdR76C4L.js";import{d as m}from"./p-CXpv9Rxe.js";import{d as v}from"./p-CdkNxxut.js";import{d as y}from"./p-BFYtCsZu.js";import{d as x}from"./p-C1jg5IQi.js";import{d as w}from"./p-DPlEzPKO.js";import{d as C}from"./p-NwN6r0N0.js";const j=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.isControlsReady=e(this,"isControlsReady")}get host(){return this}visible=!0;controls=[];activeControl=null;isUtilityPanelVisible=!0;undoState=null;theme="light";terms={};isControlsReady;firstConfig=null;isTouchDevice=a.isTouchDevice();selectedSubOptions=new Map;canScrollLeft=!1;canScrollRight=!1;needsScrolling=!1;displayValues=null;internalControls=[];handleActiveToolChangeBound=this.handleActiveToolChange.bind(this);handleSelectionChangeBound=this.handleSelectionChange.bind(this);handleKeyDown(t){"Escape"===t.key&&(t.preventDefault(),this.closeTooltip(),this.kritzelEngine?.enable())}async handleActiveToolChange(t){this.activeControl=this.internalControls.find((o=>o.tool===t.detail))||null,this.activeControl?.tool&&this.updateDisplayValues(this.activeControl.tool),this.closeTooltip()}handleSelectionChange(){this.activeControl?.tool instanceof n&&this.updateDisplayValues(this.activeControl.tool)}async onControlsChange(){this.kritzelEngine&&await this.initializeTools()}onThemeChange(){this.activeControl?.tool&&this.updateDisplayValues(this.activeControl.tool)}async closeTooltip(){document.dispatchEvent(new CustomEvent("kritzelTooltipCloseAll"))}kritzelEngine=null;toolsScrollRef=null;configTriggerRef=null;get activeToolAsTextTool(){return this.activeControl?.tool}get activeToolAsBrushTool(){return this.activeControl?.tool}get activeToolAsLineTool(){return this.activeControl?.tool}get activeToolAsShapeTool(){return this.activeControl?.tool}handleDisplayValuesChange=t=>{const o=t.detail;this.displayValues&&this.displayValues.color===o.color&&this.displayValues.size===o.size&&this.displayValues.fontFamily===o.fontFamily||(this.displayValues=o)};updateDisplayValues(t){const o=c.getToolConfig(t);if(!o)return void(this.displayValues=null);const e=t[o.sizeProperty],r={color:h.applyOpacity(t[o.colorProperty],t[o.opacityProperty]??1,this.theme),size:e};t instanceof s&&(r.fontFamily=t.fontFamily),this.displayValues&&this.displayValues.color===r.color&&this.displayValues.size===r.size&&this.displayValues.fontFamily===r.fontFamily||(this.displayValues=r)}async componentWillLoad(){await this.initializeEngine(),await this.initializeTools(),this.isControlsReady.emit()}componentDidLoad(){this.updateScrollIndicators()}componentDidRender(){this.updateScrollIndicators()}disconnectedCallback(){this.kritzelEngine&&(this.kritzelEngine.removeEventListener("activeToolChange",this.handleActiveToolChangeBound),this.kritzelEngine.removeEventListener("objectsSelectionChange",this.handleSelectionChangeBound))}updateScrollIndicators(){if(!this.toolsScrollRef)return;const{scrollLeft:t,scrollWidth:o,clientWidth:e}=this.toolsScrollRef,r=t>2,i=t+e<o-2,l=o>e;this.canScrollLeft!==r&&(this.canScrollLeft=r),this.canScrollRight!==i&&(this.canScrollRight=i),this.needsScrolling!==l&&(this.needsScrolling=l)}handleToolsScroll=()=>{this.updateScrollIndicators()};async initializeEngine(){if(await customElements.whenDefined("kritzel-engine"),this.kritzelEngine=this.host.parentElement.querySelector("kritzel-engine"),!this.kritzelEngine)throw new Error("kritzel-engine not found in parent element.");this.kritzelEngine.addEventListener("activeToolChange",this.handleActiveToolChangeBound),this.kritzelEngine.addEventListener("objectsSelectionChange",this.handleSelectionChangeBound)}async initializeTools(){let t=!1;const o=this.controls.map((t=>({...t})));for(const e of o){if("tool"===e.type&&e.tool){let t=e.tool;"function"!=typeof t&&(t=t.constructor);const o=await this.kritzelEngine.registerTool(e.name,t,e.config);o&&(e.tool=o)}"tool"===e.type&&e.isDefault&&e.tool&&(await this.kritzelEngine.changeActiveTool(e.tool),this.activeControl=e,this.updateDisplayValues(e.tool),t=!0),"config"===e.type&&(null===this.firstConfig?this.firstConfig=e:console.warn("Only one config control is allowed. The first one will be used."))}if(this.internalControls=o,!t){const t=this.internalControls.find((t=>"tool"===t.type&&t.tool));t&&(await this.kritzelEngine.changeActiveTool(t.tool),this.activeControl=t,this.updateDisplayValues(t.tool))}}async handleControlClick(t){this.activeControl=t,"tool"===this.activeControl.type&&(this.updateDisplayValues(this.activeControl.tool),await this.kritzelEngine.changeActiveTool(this.activeControl.tool))}async handleToolChange(t){this.activeControl={...this.activeControl,tool:t.detail},await this.kritzelEngine.changeActiveTool(this.activeControl.tool)}getSelectedSubOption(t){if(t.subOptions?.length)return this.selectedSubOptions.get(t.name)||t.subOptions[0]}async selectSubOption(t,o){const e=new Map(this.selectedSubOptions);e.set(t.name,o),this.selectedSubOptions=e,t.tool&&"function"!=typeof t.tool&&(t.tool[o.toolProperty]=o.value),this.closeTooltip(),await this.handleControlClick(t)}render(){const t=null!==(this.activeControl?.tool?c.getToolConfig(this.activeControl.tool):null),o=this.internalControls.filter((t=>"tool"===t.type||"separator"===t.type)),e=this.internalControls.find((t=>"config"===t.type&&t.name===this.firstConfig?.name));return r(i,{key:"266e38cdeffb8c22a7f778e865e5fab6b461f5b6",style:{display:this.visible?"":"none"},class:{mobile:this.isTouchDevice}},this.isUtilityPanelVisible&&r("kritzel-utility-panel",{key:"5e75ece000ac02675d3d226461b7f522dcf5ead9",style:{position:"absolute",bottom:"56px",left:"12px"},undoState:this.undoState,terms:this.terms,onUndo:()=>this.kritzelEngine?.undo(),onRedo:()=>this.kritzelEngine?.redo(),onDelete:()=>this.kritzelEngine?.delete()}),r("div",{key:"fc98b1675afe1abb6a8d391c4ace34c7f0e46677",class:"kritzel-controls"},r("div",{key:"b17bc9e9a65646735c56f78a326a281229fa9790",class:{"scroll-indicator-left":!0,visible:this.canScrollLeft}}),r("div",{key:"9ab9d5c44e515551d75f27c31875de72e9d3407c",class:"kritzel-tools-scroll",ref:t=>this.toolsScrollRef=t,onScroll:this.handleToolsScroll},o.map((t=>{if(t.subOptions?.length){const o=this.getSelectedSubOption(t),e=this.activeControl?.name===t.name;return r("div",{class:{"kritzel-control-split":!0,selected:e},key:t.name,"data-testid":`tool-${t.name}`,ref:o=>{o&&(t._anchorRef=o)}},r("button",{class:"kritzel-control-main",onClick:()=>this.handleControlClick(t),"aria-label":o?.label,"data-testid":`tool-${t.name}-main`},r("kritzel-icon",{name:o?.icon||t.icon})),r("button",{class:{"kritzel-control-dropdown":!0,visible:e},ref:o=>{o&&(t._triggerRef=o)},"aria-label":`Select ${t.name} options`,"data-testid":`tool-${t.name}-dropdown`,tabIndex:e?0:-1},r("kritzel-icon",{name:"chevron-down",size:12})),r("kritzel-tooltip",{anchorElement:t._anchorRef,triggerElement:t._triggerRef},r("div",{class:"kritzel-submenu-content"},t.subOptions.map((e=>r("button",{class:{"kritzel-submenu-item":!0,active:e.id===o?.id},key:e.id,"data-testid":`suboption-${e.id}`,onClick:()=>this.selectSubOption(t,e)},r("kritzel-icon",{name:e.icon,size:20}),r("span",null,e.label)))))))}return"separator"===t.type?r("div",{class:"kritzel-control-separator",key:t.name}):r("button",{class:{"kritzel-control":!0,selected:this.activeControl?.name===t?.name},key:t.name,"data-testid":`tool-${t.name}`,onClick:()=>this.handleControlClick?.(t),"aria-label":t.name.charAt(0).toUpperCase()+t.name.slice(1)},r("kritzel-icon",{name:t.icon}))}))),r("div",{key:"fad7512f5d1aa68905a56b8f22d498380f166f9f",class:{"scroll-indicator-right":!0,visible:this.canScrollRight&&!(e&&this.activeControl&&t)}}),e&&this.activeControl&&r("div",{class:{"kritzel-config-container":!0,visible:t},key:e.name},r("div",{key:"2ff7cb3ad18608102f3d8188b5936cf00b00451f",class:{"config-gradient-left":!0,visible:this.needsScrolling}}),r("kritzel-tooltip",{key:"10f15f717c8573cbad6ea53b412ad56254099ad1",anchorElement:this.host.shadowRoot?.querySelector(".kritzel-config-container"),triggerElement:this.configTriggerRef},r("kritzel-tool-config",{key:"a1b0ed8ecc2696a591e32add642a3d5cb2bf7f4a",tool:this.activeControl.tool,theme:this.theme,engine:this.kritzelEngine,terms:this.terms,onToolChange:t=>this.handleToolChange?.(t),onDisplayValuesChange:this.handleDisplayValuesChange,style:{width:"100%",height:"100%"}})),r("div",{key:"7ac8214a3dbad5323a38cad3ff7324b57f9dbfb5",tabIndex:t?0:-1,class:"kritzel-config","data-testid":"tool-config",ref:t=>{t&&(this.configTriggerRef=t)},onKeyDown:t=>{"Enter"===t.key&&t.target.click()},style:{cursor:"pointer"}},this.displayValues&&r("div",{key:"7e64f79859f7f2b03d72bb7a93fb295e7d2b2ac0",class:"color-container"},r("kritzel-color",{key:"b87d9861949379d84954ef1ecb554e13317b3287",value:this.displayValues.color,theme:this.theme,size:18,style:{borderRadius:"50%",border:"none"}}))))))}static get assetsDirs(){return["../assets"]}static get watchers(){return{controls:[{onControlsChange:0}],theme:[{onThemeChange:0}]}}static get style(){return":host{display:flex;flex-direction:column;user-select:none;max-width:100%;z-index:1}:host(.mobile){--kritzel-controls-control-hover-background-color:transparent;--kritzel-controls-control-active-background-color:transparent}.kritzel-controls{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--kritzel-controls-gap, 8px);height:100%;padding:var(--kritzel-controls-padding, 8px);background-color:var(--kritzel-controls-background-color, #ffffff);border-radius:var(--kritzel-controls-border-radius, 16px);box-shadow:var(--kritzel-controls-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-controls-border, 1px solid #ebebeb);z-index:1;position:relative;max-width:100%;overflow:hidden}.kritzel-tools-scroll{display:flex;flex-direction:row;align-items:center;gap:var(--kritzel-controls-gap, 8px);overflow-x:auto;overflow-y:hidden;flex:1 1 auto;min-width:0;padding:4px;margin:-4px;scrollbar-width:none;-ms-overflow-style:none}.kritzel-tools-scroll::-webkit-scrollbar{display:none}.scroll-indicator-left,.scroll-indicator-right{position:absolute;top:0;bottom:0;width:32px;pointer-events:none;opacity:0;transition:opacity 0.2s ease-out;z-index:1}.scroll-indicator-left{left:0;background:linear-gradient(to right, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:var(--kritzel-controls-border-radius, 16px) 0 0 var(--kritzel-controls-border-radius, 16px)}.scroll-indicator-right{right:0;background:linear-gradient(to left, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:0 var(--kritzel-controls-border-radius, 16px) var(--kritzel-controls-border-radius, 16px) 0}.scroll-indicator-left.visible,.scroll-indicator-right.visible{opacity:1}.kritzel-control{display:flex;justify-content:center;align-items:center;color:var(--kritzel-controls-control-color, #000000);border-radius:var(--kritzel-controls-control-border-radius, 12px);padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;font-weight:bold}.kritzel-control:focus,.kritzel-control:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control.selected,.kritzel-control.selected:hover,.kritzel-control.selected:active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control.selected:focus{background-color:var(--kritzel-controls-control-selected-background-color, #007bffe3) !important}.kritzel-control-separator{width:1px;height:24px;background-color:var(--kritzel-controls-separator-color, #ebebeb);margin:0 4px}.kritzel-control-split{position:relative;display:flex;align-items:center;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:var(--kritzel-controls-control-color, #000000)}.kritzel-control-split .kritzel-control-main{display:flex;justify-content:center;align-items:center;padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:inherit}.kritzel-control-split.selected .kritzel-control-main{border-radius:var(--kritzel-controls-control-border-radius, 12px) 0 0 var(--kritzel-controls-control-border-radius, 12px)}.kritzel-control-split .kritzel-control-dropdown{display:flex;justify-content:center;align-items:center;align-self:stretch;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:0 var(--kritzel-controls-control-border-radius, 12px) var(--kritzel-controls-control-border-radius, 12px) 0;color:inherit;width:0;padding:0;opacity:0;overflow:hidden;pointer-events:none;transition:width 0.15s ease-out, padding 0.15s ease-out, opacity 0.15s ease-out}.kritzel-control-split .kritzel-control-dropdown.visible{width:auto;padding:0 6px;opacity:1;pointer-events:auto}.kritzel-control-split .kritzel-control-main:focus,.kritzel-control-split .kritzel-control-main:hover,.kritzel-control-split .kritzel-control-dropdown:focus,.kritzel-control-split .kritzel-control-dropdown:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control-split .kritzel-control-main:active,.kritzel-control-split .kritzel-control-dropdown:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control-split.selected{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control-split.selected .kritzel-control-main:hover,.kritzel-control-split.selected .kritzel-control-dropdown:hover{background-color:rgba(255, 255, 255, 0.15)}.kritzel-submenu-content{display:flex;flex-direction:column;gap:var(--kritzel-submenu-gap, 4px);min-width:140px}.kritzel-submenu-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:8px;color:var(--kritzel-controls-control-color, #000000);font-size:14px;text-align:left;white-space:nowrap;-webkit-tap-highlight-color:transparent}.kritzel-submenu-item:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-submenu-item.active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF);color:var(--kritzel-controls-control-selected-color, #ffffff)}.kritzel-submenu-item.active:hover{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF)}.kritzel-config-container{position:relative;display:flex;justify-content:center;align-items:center;height:40px;box-sizing:border-box;-webkit-tap-highlight-color:transparent;flex-shrink:0;width:0;opacity:0;overflow:hidden;pointer-events:none;margin-left:calc(-1 * var(--kritzel-controls-gap, 8px));transition:width 0.2s ease-out, opacity 0.2s ease-out, margin-left 0.2s ease-out}.kritzel-config-container.visible{width:40px;opacity:1;pointer-events:auto;margin-left:0;overflow:visible}.config-gradient-left{position:absolute;top:0;bottom:0;left:-32px;width:32px;background:linear-gradient(to right, transparent, var(--kritzel-controls-background-color, #ffffff));pointer-events:none;z-index:1;opacity:0;transition:opacity 0.2s ease-out}.config-gradient-left.visible{opacity:1}.kritzel-config{display:flex;justify-content:center;align-items:center;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:50%}.color-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.font-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.no-config{height:24px;width:24px;border-radius:50%;border:1px dashed gray}kritzel-tooltip{z-index:10001}"}},[513,"kritzel-controls",{visible:[4],controls:[16],activeControl:[1040],isUtilityPanelVisible:[4,"is-utility-panel-visible"],undoState:[16],theme:[1],terms:[16],firstConfig:[32],isTouchDevice:[32],selectedSubOptions:[32],canScrollLeft:[32],canScrollRight:[32],needsScrolling:[32],displayValues:[32],internalControls:[32],closeTooltip:[64]},[[8,"keydown","handleKeyDown"]],{controls:[{onControlsChange:0}],theme:[{onThemeChange:0}]}]);function E(){"undefined"!=typeof customElements&&["kritzel-controls","kritzel-color","kritzel-color-palette","kritzel-dropdown","kritzel-font","kritzel-font-family","kritzel-font-size","kritzel-icon","kritzel-line-endings","kritzel-opacity-slider","kritzel-shape-fill","kritzel-stroke-size","kritzel-tool-config","kritzel-tooltip","kritzel-utility-panel"].forEach((t=>{switch(t){case"kritzel-controls":customElements.get(l(t))||customElements.define(l(t),j);break;case"kritzel-color":customElements.get(l(t))||p();break;case"kritzel-color-palette":customElements.get(l(t))||k();break;case"kritzel-dropdown":customElements.get(l(t))||f();break;case"kritzel-font":customElements.get(l(t))||b();break;case"kritzel-font-family":customElements.get(l(t))||u();break;case"kritzel-font-size":customElements.get(l(t))||g();break;case"kritzel-icon":customElements.get(l(t))||z();break;case"kritzel-line-endings":customElements.get(l(t))||m();break;case"kritzel-opacity-slider":customElements.get(l(t))||v();break;case"kritzel-shape-fill":customElements.get(l(t))||y();break;case"kritzel-stroke-size":customElements.get(l(t))||x();break;case"kritzel-tool-config":customElements.get(l(t))||d();break;case"kritzel-tooltip":customElements.get(l(t))||w();break;case"kritzel-utility-panel":customElements.get(l(t))||C()}}))}export{j as K,E as d}
|
|
1
|
+
import{p as t,H as o,c as e,h as r,d as i,t as l}from"./p-B43upypT.js";import{f as n,e as s}from"./p-BJlf4iHH.js";import{K as a}from"./p-jGOpkGDl.js";import{K as c,d}from"./p-BlozPPKi.js";import{a as h}from"./p-BmyTdQGy.js";import{d as p}from"./p-zd7zXld8.js";import{d as k}from"./p-1nG2hxfJ.js";import{d as f}from"./p-Df3BwVGy.js";import{d as u}from"./p-DgnK50xO.js";import{d as b}from"./p-JhOYwUOj.js";import{d as g}from"./p-8xkoVMfO.js";import{d as z}from"./p-CdR76C4L.js";import{d as m}from"./p-CXpv9Rxe.js";import{d as v}from"./p-BzrxIesp.js";import{d as y}from"./p-BFYtCsZu.js";import{d as x}from"./p-Bm_BWQa4.js";import{d as w}from"./p-DZcwchEg.js";import{d as C}from"./p-Bd_yPNfg.js";const j=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.isControlsReady=e(this,"isControlsReady")}get host(){return this}visible=!0;controls=[];activeControl=null;isUtilityPanelVisible=!0;undoState=null;theme="light";terms={};isControlsReady;firstConfig=null;isTouchDevice=a.isTouchDevice();selectedSubOptions=new Map;canScrollLeft=!1;canScrollRight=!1;needsScrolling=!1;displayValues=null;internalControls=[];handleActiveToolChangeBound=this.handleActiveToolChange.bind(this);handleSelectionChangeBound=this.handleSelectionChange.bind(this);handleKeyDown(t){"Escape"===t.key&&(t.preventDefault(),this.closeTooltip(),this.kritzelEngine?.enable())}async handleActiveToolChange(t){this.activeControl=this.internalControls.find((o=>o.tool===t.detail))||null,this.activeControl?.tool&&this.updateDisplayValues(this.activeControl.tool),this.closeTooltip()}handleSelectionChange(){this.activeControl?.tool instanceof n&&this.updateDisplayValues(this.activeControl.tool)}async onControlsChange(){this.kritzelEngine&&await this.initializeTools()}onThemeChange(){this.activeControl?.tool&&this.updateDisplayValues(this.activeControl.tool)}async closeTooltip(){document.dispatchEvent(new CustomEvent("kritzelTooltipCloseAll"))}kritzelEngine=null;toolsScrollRef=null;configTriggerRef=null;get activeToolAsTextTool(){return this.activeControl?.tool}get activeToolAsBrushTool(){return this.activeControl?.tool}get activeToolAsLineTool(){return this.activeControl?.tool}get activeToolAsShapeTool(){return this.activeControl?.tool}handleDisplayValuesChange=t=>{const o=t.detail;this.displayValues&&this.displayValues.color===o.color&&this.displayValues.size===o.size&&this.displayValues.fontFamily===o.fontFamily||(this.displayValues=o)};updateDisplayValues(t){const o=c.getToolConfig(t);if(!o)return void(this.displayValues=null);const e=t[o.sizeProperty],r={color:h.applyOpacity(t[o.colorProperty],t[o.opacityProperty]??1,this.theme),size:e};t instanceof s&&(r.fontFamily=t.fontFamily),this.displayValues&&this.displayValues.color===r.color&&this.displayValues.size===r.size&&this.displayValues.fontFamily===r.fontFamily||(this.displayValues=r)}async componentWillLoad(){await this.initializeEngine(),await this.initializeTools(),this.isControlsReady.emit()}componentDidLoad(){this.updateScrollIndicators()}componentDidRender(){this.updateScrollIndicators()}disconnectedCallback(){this.kritzelEngine&&(this.kritzelEngine.removeEventListener("activeToolChange",this.handleActiveToolChangeBound),this.kritzelEngine.removeEventListener("objectsSelectionChange",this.handleSelectionChangeBound))}updateScrollIndicators(){if(!this.toolsScrollRef)return;const{scrollLeft:t,scrollWidth:o,clientWidth:e}=this.toolsScrollRef,r=t>2,i=t+e<o-2,l=o>e;this.canScrollLeft!==r&&(this.canScrollLeft=r),this.canScrollRight!==i&&(this.canScrollRight=i),this.needsScrolling!==l&&(this.needsScrolling=l)}handleToolsScroll=()=>{this.updateScrollIndicators()};async initializeEngine(){if(await customElements.whenDefined("kritzel-engine"),this.kritzelEngine=this.host.parentElement.querySelector("kritzel-engine"),!this.kritzelEngine)throw new Error("kritzel-engine not found in parent element.");this.kritzelEngine.addEventListener("activeToolChange",this.handleActiveToolChangeBound),this.kritzelEngine.addEventListener("objectsSelectionChange",this.handleSelectionChangeBound)}async initializeTools(){let t=!1;const o=this.controls.map((t=>({...t})));for(const e of o){if("tool"===e.type&&e.tool){let t=e.tool;"function"!=typeof t&&(t=t.constructor);const o=await this.kritzelEngine.registerTool(e.name,t,e.config);o&&(e.tool=o)}"tool"===e.type&&e.isDefault&&e.tool&&(await this.kritzelEngine.changeActiveTool(e.tool),this.activeControl=e,this.updateDisplayValues(e.tool),t=!0),"config"===e.type&&(null===this.firstConfig?this.firstConfig=e:console.warn("Only one config control is allowed. The first one will be used."))}if(this.internalControls=o,!t){const t=this.internalControls.find((t=>"tool"===t.type&&t.tool));t&&(await this.kritzelEngine.changeActiveTool(t.tool),this.activeControl=t,this.updateDisplayValues(t.tool))}}async handleControlClick(t){this.activeControl=t,"tool"===this.activeControl.type&&(this.updateDisplayValues(this.activeControl.tool),await this.kritzelEngine.changeActiveTool(this.activeControl.tool))}async handleToolChange(t){this.activeControl={...this.activeControl,tool:t.detail},await this.kritzelEngine.changeActiveTool(this.activeControl.tool)}getSelectedSubOption(t){if(t.subOptions?.length)return this.selectedSubOptions.get(t.name)||t.subOptions[0]}async selectSubOption(t,o){const e=new Map(this.selectedSubOptions);e.set(t.name,o),this.selectedSubOptions=e,t.tool&&"function"!=typeof t.tool&&(t.tool[o.toolProperty]=o.value),this.closeTooltip(),await this.handleControlClick(t)}render(){const t=null!==(this.activeControl?.tool?c.getToolConfig(this.activeControl.tool):null),o=this.internalControls.filter((t=>"tool"===t.type||"separator"===t.type)),e=this.internalControls.find((t=>"config"===t.type&&t.name===this.firstConfig?.name));return r(i,{key:"f66fd3057bd88d31d7d585f2c286feb7e33c3611",style:{display:this.visible?"":"none"},class:{mobile:this.isTouchDevice}},this.isUtilityPanelVisible&&r("kritzel-utility-panel",{key:"4841cd070407422f0081dd528566d3943d2db7cd",style:{position:"absolute",bottom:"56px",left:"12px"},undoState:this.undoState,terms:this.terms,onUndo:()=>this.kritzelEngine?.undo(),onRedo:()=>this.kritzelEngine?.redo(),onDelete:()=>this.kritzelEngine?.delete()}),r("div",{key:"54fb1da3f8b070c4c75e27930c95ca06f46f48f1",class:"kritzel-controls"},r("div",{key:"9ce27b621a8fb668716f1eb15f3b01302e476d86",class:{"scroll-indicator-left":!0,visible:this.canScrollLeft}}),r("div",{key:"eb9f499b5139c481b5748b09ecf21cd414918a11",class:"kritzel-tools-scroll",ref:t=>this.toolsScrollRef=t,onScroll:this.handleToolsScroll},o.map((t=>{if(t.subOptions?.length){const o=this.getSelectedSubOption(t),e=this.activeControl?.name===t.name;return r("div",{class:{"kritzel-control-split":!0,selected:e},key:t.name,"data-testid":`tool-${t.name}`,ref:o=>{o&&(t._anchorRef=o)}},r("button",{class:"kritzel-control-main",onClick:()=>this.handleControlClick(t),"aria-label":o?.label,"data-testid":`tool-${t.name}-main`},r("kritzel-icon",{name:o?.icon||t.icon})),r("button",{class:{"kritzel-control-dropdown":!0,visible:e},ref:o=>{o&&(t._triggerRef=o)},"aria-label":`Select ${t.name} options`,"data-testid":`tool-${t.name}-dropdown`,tabIndex:e?0:-1},r("kritzel-icon",{name:"chevron-down",size:12})),r("kritzel-tooltip",{anchorElement:t._anchorRef,triggerElement:t._triggerRef},r("div",{class:"kritzel-submenu-content"},t.subOptions.map((e=>r("button",{class:{"kritzel-submenu-item":!0,active:e.id===o?.id},key:e.id,"data-testid":`suboption-${e.id}`,onClick:()=>this.selectSubOption(t,e)},r("kritzel-icon",{name:e.icon,size:20}),r("span",null,e.label)))))))}return"separator"===t.type?r("div",{class:"kritzel-control-separator",key:t.name}):r("button",{class:{"kritzel-control":!0,selected:this.activeControl?.name===t?.name},key:t.name,"data-testid":`tool-${t.name}`,onClick:()=>this.handleControlClick?.(t),"aria-label":t.name.charAt(0).toUpperCase()+t.name.slice(1)},r("kritzel-icon",{name:t.icon}))}))),r("div",{key:"c990abf4ff2970e6519c605135f3fbded691e91a",class:{"scroll-indicator-right":!0,visible:this.canScrollRight&&!(e&&this.activeControl&&t)}}),e&&this.activeControl&&r("div",{class:{"kritzel-config-container":!0,visible:t},key:e.name},r("div",{key:"1c163b818eed3a76bda9e802b083d2bfe8431c87",class:{"config-gradient-left":!0,visible:this.needsScrolling}}),r("kritzel-tooltip",{key:"f7252d9aa17bdde580ca31cd558ba93d99822937",anchorElement:this.host.shadowRoot?.querySelector(".kritzel-config-container"),triggerElement:this.configTriggerRef},r("kritzel-tool-config",{key:"a15a873d8740d5c45a657bb4677a514fe9e183de",tool:this.activeControl.tool,theme:this.theme,engine:this.kritzelEngine,terms:this.terms,onToolChange:t=>this.handleToolChange?.(t),onDisplayValuesChange:this.handleDisplayValuesChange,style:{width:"100%",height:"100%"}})),r("div",{key:"ffbf1e35387ee732c6877f8425dbe07234d8233f",tabIndex:t?0:-1,class:"kritzel-config","data-testid":"tool-config",ref:t=>{t&&(this.configTriggerRef=t)},onKeyDown:t=>{"Enter"===t.key&&t.target.click()},style:{cursor:"pointer"}},this.displayValues&&r("div",{key:"eb272119da9354eb069231c3d29a196c5b0e4aa2",class:"color-container"},r("kritzel-color",{key:"465b3af943d740b83bd260ee493840edd235a9af",value:this.displayValues.color,theme:this.theme,size:18,style:{borderRadius:"50%",border:"none"}}))))))}static get assetsDirs(){return["../assets"]}static get watchers(){return{controls:[{onControlsChange:0}],theme:[{onThemeChange:0}]}}static get style(){return":host{display:flex;flex-direction:column;user-select:none;max-width:100%;z-index:1}:host(.mobile){--kritzel-controls-control-hover-background-color:transparent;--kritzel-controls-control-active-background-color:transparent}.kritzel-controls{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--kritzel-controls-gap, 8px);height:100%;padding:var(--kritzel-controls-padding, 8px);background-color:var(--kritzel-controls-background-color, #ffffff);border-radius:var(--kritzel-controls-border-radius, 16px);box-shadow:var(--kritzel-controls-box-shadow, 0 0 3px rgba(0, 0, 0, 0.08));border:var(--kritzel-controls-border, 1px solid #ebebeb);z-index:1;position:relative;max-width:100%;overflow:hidden}.kritzel-tools-scroll{display:flex;flex-direction:row;align-items:center;gap:var(--kritzel-controls-gap, 8px);overflow-x:auto;overflow-y:hidden;flex:1 1 auto;min-width:0;padding:4px;margin:-4px;scrollbar-width:none;-ms-overflow-style:none}.kritzel-tools-scroll::-webkit-scrollbar{display:none}.scroll-indicator-left,.scroll-indicator-right{position:absolute;top:0;bottom:0;width:32px;pointer-events:none;opacity:0;transition:opacity 0.2s ease-out;z-index:1}.scroll-indicator-left{left:0;background:linear-gradient(to right, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:var(--kritzel-controls-border-radius, 16px) 0 0 var(--kritzel-controls-border-radius, 16px)}.scroll-indicator-right{right:0;background:linear-gradient(to left, var(--kritzel-controls-background-color, #ffffff), transparent);border-radius:0 var(--kritzel-controls-border-radius, 16px) var(--kritzel-controls-border-radius, 16px) 0}.scroll-indicator-left.visible,.scroll-indicator-right.visible{opacity:1}.kritzel-control{display:flex;justify-content:center;align-items:center;color:var(--kritzel-controls-control-color, #000000);border-radius:var(--kritzel-controls-control-border-radius, 12px);padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;font-weight:bold}.kritzel-control:focus,.kritzel-control:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control.selected,.kritzel-control.selected:hover,.kritzel-control.selected:active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control.selected:focus{background-color:var(--kritzel-controls-control-selected-background-color, #007bffe3) !important}.kritzel-control-separator{width:1px;height:24px;background-color:var(--kritzel-controls-separator-color, #ebebeb);margin:0 4px}.kritzel-control-split{position:relative;display:flex;align-items:center;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:var(--kritzel-controls-control-color, #000000)}.kritzel-control-split .kritzel-control-main{display:flex;justify-content:center;align-items:center;padding:var(--kritzel-controls-control-padding, 8px);border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:var(--kritzel-controls-control-border-radius, 12px);color:inherit}.kritzel-control-split.selected .kritzel-control-main{border-radius:var(--kritzel-controls-control-border-radius, 12px) 0 0 var(--kritzel-controls-control-border-radius, 12px)}.kritzel-control-split .kritzel-control-dropdown{display:flex;justify-content:center;align-items:center;align-self:stretch;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);-webkit-tap-highlight-color:transparent;border-radius:0 var(--kritzel-controls-control-border-radius, 12px) var(--kritzel-controls-control-border-radius, 12px) 0;color:inherit;width:0;padding:0;opacity:0;overflow:hidden;pointer-events:none;transition:width 0.15s ease-out, padding 0.15s ease-out, opacity 0.15s ease-out}.kritzel-control-split .kritzel-control-dropdown.visible{width:auto;padding:0 6px;opacity:1;pointer-events:auto}.kritzel-control-split .kritzel-control-main:focus,.kritzel-control-split .kritzel-control-main:hover,.kritzel-control-split .kritzel-control-dropdown:focus,.kritzel-control-split .kritzel-control-dropdown:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-control-split .kritzel-control-main:active,.kritzel-control-split .kritzel-control-dropdown:active{background-color:var(--kritzel-controls-control-active-background-color, hsl(0, 0%, 0%, 8.6%))}.kritzel-control-split.selected{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF) !important;color:var(--kritzel-controls-control-selected-color, #ffffff) !important}.kritzel-control-split.selected .kritzel-control-main:hover,.kritzel-control-split.selected .kritzel-control-dropdown:hover{background-color:rgba(255, 255, 255, 0.15)}.kritzel-submenu-content{display:flex;flex-direction:column;gap:var(--kritzel-submenu-gap, 4px);min-width:140px}.kritzel-submenu-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:none;background:none;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:8px;color:var(--kritzel-controls-control-color, #000000);font-size:14px;text-align:left;white-space:nowrap;-webkit-tap-highlight-color:transparent}.kritzel-submenu-item:hover{background-color:var(--kritzel-controls-control-hover-background-color, hsl(0, 0%, 0%, 4.3%))}.kritzel-submenu-item.active{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF);color:var(--kritzel-controls-control-selected-color, #ffffff)}.kritzel-submenu-item.active:hover{background-color:var(--kritzel-controls-control-selected-background-color, #007AFF)}.kritzel-config-container{position:relative;display:flex;justify-content:center;align-items:center;height:40px;box-sizing:border-box;-webkit-tap-highlight-color:transparent;flex-shrink:0;width:0;opacity:0;overflow:hidden;pointer-events:none;margin-left:calc(-1 * var(--kritzel-controls-gap, 8px));transition:width 0.2s ease-out, opacity 0.2s ease-out, margin-left 0.2s ease-out}.kritzel-config-container.visible{width:40px;opacity:1;pointer-events:auto;margin-left:0;overflow:visible}.config-gradient-left{position:absolute;top:0;bottom:0;left:-32px;width:32px;background:linear-gradient(to right, transparent, var(--kritzel-controls-background-color, #ffffff));pointer-events:none;z-index:1;opacity:0;transition:opacity 0.2s ease-out}.config-gradient-left.visible{opacity:1}.kritzel-config{display:flex;justify-content:center;align-items:center;cursor:var(--kritzel-global-pointer-cursor, pointer);border-radius:50%}.color-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.font-container{display:flex;justify-content:center;align-items:center;width:32px;height:32px;border-radius:50%;cursor:var(--kritzel-global-pointer-cursor, pointer);border:2px solid transparent;box-sizing:border-box;background-color:var(--kritzel-color-palette-hover-background-color, #ebebeb)}.no-config{height:24px;width:24px;border-radius:50%;border:1px dashed gray}kritzel-tooltip{z-index:10001}"}},[513,"kritzel-controls",{visible:[4],controls:[16],activeControl:[1040],isUtilityPanelVisible:[4,"is-utility-panel-visible"],undoState:[16],theme:[1],terms:[16],firstConfig:[32],isTouchDevice:[32],selectedSubOptions:[32],canScrollLeft:[32],canScrollRight:[32],needsScrolling:[32],displayValues:[32],internalControls:[32],closeTooltip:[64]},[[8,"keydown","handleKeyDown"]],{controls:[{onControlsChange:0}],theme:[{onThemeChange:0}]}]);function E(){"undefined"!=typeof customElements&&["kritzel-controls","kritzel-color","kritzel-color-palette","kritzel-dropdown","kritzel-font","kritzel-font-family","kritzel-font-size","kritzel-icon","kritzel-line-endings","kritzel-opacity-slider","kritzel-shape-fill","kritzel-stroke-size","kritzel-tool-config","kritzel-tooltip","kritzel-utility-panel"].forEach((t=>{switch(t){case"kritzel-controls":customElements.get(l(t))||customElements.define(l(t),j);break;case"kritzel-color":customElements.get(l(t))||p();break;case"kritzel-color-palette":customElements.get(l(t))||k();break;case"kritzel-dropdown":customElements.get(l(t))||f();break;case"kritzel-font":customElements.get(l(t))||u();break;case"kritzel-font-family":customElements.get(l(t))||b();break;case"kritzel-font-size":customElements.get(l(t))||g();break;case"kritzel-icon":customElements.get(l(t))||z();break;case"kritzel-line-endings":customElements.get(l(t))||m();break;case"kritzel-opacity-slider":customElements.get(l(t))||v();break;case"kritzel-shape-fill":customElements.get(l(t))||y();break;case"kritzel-stroke-size":customElements.get(l(t))||x();break;case"kritzel-tool-config":customElements.get(l(t))||d();break;case"kritzel-tooltip":customElements.get(l(t))||w();break;case"kritzel-utility-panel":customElements.get(l(t))||C()}}))}export{j as K,E as d}
|