vue-data-ui 2.6.51 → 2.6.52-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -3
- package/dist/{Arrow-zUP7YWwK.js → Arrow-BrgzjEu9.js} +1 -1
- package/dist/{Arrow-BgUU76S-.cjs → Arrow-i892KlJJ.cjs} +1 -1
- package/dist/{BaseIcon-CTAy5_xi.js → BaseIcon-1Kh1hniD.js} +1 -1
- package/dist/{BaseIcon-C86xshge.cjs → BaseIcon-OIGwOnCM.cjs} +1 -1
- package/dist/{ColorPicker-D0HD4Quw.cjs → ColorPicker-C5fe9E7-.cjs} +1 -1
- package/dist/{ColorPicker-Bytmrdr3.js → ColorPicker-Cxeiob9V.js} +3 -3
- package/dist/{DataTable-BciZ6nvV.js → DataTable-C4Zf4XLF.js} +15 -15
- package/dist/DataTable-DJyyRRlW.cjs +1 -0
- package/dist/{Legend-Cz7Cx76P.js → Legend-1pyX_J1z.js} +2 -2
- package/dist/{Legend-DgFKLfrI.cjs → Legend-Dx4tku_Q.cjs} +1 -1
- package/dist/{PackageVersion-o03zxIgy.js → PackageVersion-BPpaTwrM.js} +1 -1
- package/dist/{PackageVersion-t17AmNwO.cjs → PackageVersion-Di08b2vs.cjs} +1 -1
- package/dist/{PenAndPaper-CkHrxfug.js → PenAndPaper-B21RAf9P.js} +5 -5
- package/dist/PenAndPaper-C0I2pjPq.cjs +1 -0
- package/dist/{Shape-CGopvwTa.cjs → Shape-Bn0OAR4-.cjs} +1 -1
- package/dist/{Shape-D-YK0lYU.js → Shape-BrtnGizi.js} +1 -1
- package/dist/{Slicer-AvtKQlUL.js → Slicer-BeRcAG--.js} +25 -25
- package/dist/Slicer-BrIoq1c-.cjs +1 -0
- package/dist/{Title-BJ2lOafm.cjs → Title-CcW9kRtT.cjs} +1 -1
- package/dist/{Title-D-dsYBke.js → Title-rbJs8Cs3.js} +1 -1
- package/dist/{Tooltip-7LYTKhzY.cjs → Tooltip-BzDUupFB.cjs} +1 -1
- package/dist/{Tooltip-DFPLXjvj.js → Tooltip-DZGBhn8l.js} +1 -1
- package/dist/documentation/installation.md +0 -1
- package/dist/dom-to-png-BpstRczV.cjs +1 -0
- package/dist/dom-to-png-DFDQ3B5I.js +119 -0
- package/dist/img-DN4K4BLQ.cjs +1 -0
- package/dist/img-hntVQbmL.js +19 -0
- package/dist/index-CuIvJLJx.cjs +9 -0
- package/dist/{index-C3amwS0l.js → index-DYjLUPYr.js} +291 -349
- package/dist/pdf-BwewXrne.js +46 -0
- package/dist/pdf-ClzzT4YP.cjs +1 -0
- package/dist/style.css +1 -1
- package/dist/types/vue-data-ui.d.cts +0 -64
- package/dist/types/vue-data-ui.d.ts +0 -64
- package/dist/{useNestedProp-Cf-JPzTa.cjs → useNestedProp-B3OcLUMU.cjs} +1 -1
- package/dist/{useNestedProp-D9I77VlT.js → useNestedProp-DPpLpUNG.js} +1 -1
- package/dist/usePrinter-BwwdT1Uh.cjs +1 -0
- package/dist/{usePrinter-CUdxA1Bg.js → usePrinter-GOjH1UQd.js} +5 -5
- package/dist/{vue-data-ui-DH842rfS.js → vue-data-ui-CgYIT4l6.js} +60 -62
- package/dist/vue-data-ui-XSn3UFqP.cjs +9 -0
- package/dist/vue-data-ui.cjs +1 -1
- package/dist/vue-data-ui.js +35 -36
- package/dist/{vue-ui-3d-bar-Bd6XLFya.js → vue-ui-3d-bar-BFA4GviN.js} +11 -11
- package/dist/{vue-ui-3d-bar-CJfSnDyo.cjs → vue-ui-3d-bar-d2lzwwD0.cjs} +2 -2
- package/dist/{vue-ui-accordion-B-rPe8KM.cjs → vue-ui-accordion-ZlcsLKVn.cjs} +1 -1
- package/dist/{vue-ui-accordion-BBc1ZMpG.js → vue-ui-accordion-zFcofzrb.js} +3 -3
- package/dist/{vue-ui-age-pyramid-BNj-4LHe.cjs → vue-ui-age-pyramid-BrS-QXEl.cjs} +1 -1
- package/dist/{vue-ui-age-pyramid-Bn_mzS13.js → vue-ui-age-pyramid-HYnV6m7j.js} +10 -10
- package/dist/{vue-ui-annotator-vFbCgJEZ.js → vue-ui-annotator-Bnl6xoGx.js} +84 -85
- package/dist/vue-ui-annotator-DpcBNv4G.cjs +371 -0
- package/dist/{vue-ui-bullet-DyGZmH-g.js → vue-ui-bullet-BMAoQg9X.js} +8 -8
- package/dist/{vue-ui-bullet-B6KpjWl_.cjs → vue-ui-bullet-CUg-Tqm5.cjs} +1 -1
- package/dist/{vue-ui-candlestick-BoH-d4sf.cjs → vue-ui-candlestick-BB_TlvHs.cjs} +1 -1
- package/dist/{vue-ui-candlestick-DUfXOizp.js → vue-ui-candlestick-D99-OMzs.js} +11 -11
- package/dist/{vue-ui-carousel-table-Cbl6UzEH.cjs → vue-ui-carousel-table-BLMby8AI.cjs} +1 -1
- package/dist/{vue-ui-carousel-table-DZzht2CZ.js → vue-ui-carousel-table-Cj28UhyG.js} +4 -4
- package/dist/{vue-ui-chestnut-DWQumnLS.js → vue-ui-chestnut-BcHI2rpx.js} +8 -8
- package/dist/{vue-ui-chestnut-DWPp1zKx.cjs → vue-ui-chestnut-CK_b_ta8.cjs} +1 -1
- package/dist/{vue-ui-circle-pack-SLB70Z_8.js → vue-ui-circle-pack-BYhg53UE.js} +9 -9
- package/dist/{vue-ui-circle-pack-1RcCvaYs.cjs → vue-ui-circle-pack-ClzkEDGg.cjs} +1 -1
- package/dist/vue-ui-cursor-B3u3ldcD.cjs +1 -0
- package/dist/{vue-ui-cursor-DqwobFdf.js → vue-ui-cursor-DkcChdeb.js} +4 -4
- package/dist/{vue-ui-dashboard-BoVqjFT-.js → vue-ui-dashboard-BdnlFgl5.js} +8 -8
- package/dist/vue-ui-dashboard-Nt0DdH9L.cjs +1 -0
- package/dist/{vue-ui-digits-CkqC9SEJ.js → vue-ui-digits-D_BKH_j3.js} +2 -2
- package/dist/{vue-ui-digits-CicHxnLg.cjs → vue-ui-digits-LJ5NoBDi.cjs} +1 -1
- package/dist/{vue-ui-donut-BIJLbkro.js → vue-ui-donut-DKIAm-ME.js} +12 -12
- package/dist/{vue-ui-donut-evolution-Bu7kKtpK.js → vue-ui-donut-evolution-B_aFgOze.js} +14 -14
- package/dist/{vue-ui-donut-evolution-LqcL3OxY.cjs → vue-ui-donut-evolution-BtnTa4le.cjs} +1 -1
- package/dist/{vue-ui-donut-D03_Yedr.cjs → vue-ui-donut-kRhrhvjt.cjs} +1 -1
- package/dist/{vue-ui-dumbbell-Drrm__Nn.cjs → vue-ui-dumbbell-BFYVlYa4.cjs} +1 -1
- package/dist/{vue-ui-dumbbell-B3sbV0fk.js → vue-ui-dumbbell-jzYimGnw.js} +10 -10
- package/dist/{vue-ui-flow-NPMbdbtS.cjs → vue-ui-flow-BuXSGu-i.cjs} +1 -1
- package/dist/{vue-ui-flow-DMK3963a.js → vue-ui-flow-CqihZo8O.js} +9 -9
- package/dist/{vue-ui-funnel-C7EwDAdS.js → vue-ui-funnel-B9OFgkeR.js} +9 -9
- package/dist/{vue-ui-funnel-BiSRxqzO.cjs → vue-ui-funnel-CpaBBSbU.cjs} +1 -1
- package/dist/{vue-ui-galaxy-CaDXpBs3.cjs → vue-ui-galaxy-BCQr-U2u.cjs} +1 -1
- package/dist/{vue-ui-galaxy-Cotibz3o.js → vue-ui-galaxy-FOIZdAZe.js} +11 -11
- package/dist/{vue-ui-gauge-DKNwFB05.js → vue-ui-gauge-B42XWwB2.js} +7 -7
- package/dist/{vue-ui-gauge-DK2g4x7s.cjs → vue-ui-gauge-kZxueLp8.cjs} +1 -1
- package/dist/{vue-ui-gizmo-DO5PUFbp.js → vue-ui-gizmo-DNzFp5mg.js} +3 -3
- package/dist/{vue-ui-gizmo-DhSfekXS.cjs → vue-ui-gizmo-DtQnmFnB.cjs} +1 -1
- package/dist/{vue-ui-heatmap-DulCLx2a.js → vue-ui-heatmap-CBahWBfm.js} +10 -10
- package/dist/{vue-ui-heatmap-DbWoJVGe.cjs → vue-ui-heatmap-DwTkeSCE.cjs} +1 -1
- package/dist/{vue-ui-history-plot-H6t6DvQ_.cjs → vue-ui-history-plot-BLZfokqh.cjs} +1 -1
- package/dist/{vue-ui-history-plot-BcLWVk_q.js → vue-ui-history-plot-JF7Cxj70.js} +11 -11
- package/dist/{vue-ui-kpi-CG43D1rb.js → vue-ui-kpi-Dd7_MpTH.js} +3 -3
- package/dist/{vue-ui-kpi-CdnXw9hF.cjs → vue-ui-kpi-DgYNzLPE.cjs} +1 -1
- package/dist/{vue-ui-mini-loader-DXU3rfwQ.cjs → vue-ui-mini-loader-AnEvVAeN.cjs} +1 -1
- package/dist/{vue-ui-mini-loader-CLjqXzvH.js → vue-ui-mini-loader-CYlUH9YB.js} +2 -2
- package/dist/{vue-ui-molecule-BYetzB_N.js → vue-ui-molecule-CwjSX0qp.js} +14 -14
- package/dist/vue-ui-molecule-DenzPBhZ.cjs +1 -0
- package/dist/{vue-ui-mood-radar-BnUc15e9.js → vue-ui-mood-radar-B_ZdNRq7.js} +11 -11
- package/dist/{vue-ui-mood-radar-B4mRD0GQ.cjs → vue-ui-mood-radar-oZi1r3t2.cjs} +1 -1
- package/dist/{vue-ui-nested-donuts-B_29kUHS.cjs → vue-ui-nested-donuts-1iw0Uhgn.cjs} +1 -1
- package/dist/{vue-ui-nested-donuts-Dk7fcRR3.js → vue-ui-nested-donuts-u6o7Mo5w.js} +11 -11
- package/dist/{vue-ui-onion-BbucE7AX.js → vue-ui-onion-BIgB8q-o.js} +11 -11
- package/dist/{vue-ui-onion-CtI9xbLn.cjs → vue-ui-onion-nSs841wa.cjs} +1 -1
- package/dist/{vue-ui-parallel-coordinate-plot-CFWG0onH.cjs → vue-ui-parallel-coordinate-plot-CLZbLwv6.cjs} +1 -1
- package/dist/{vue-ui-parallel-coordinate-plot-CLIOyXQc.js → vue-ui-parallel-coordinate-plot-CzdztQbb.js} +12 -12
- package/dist/{vue-ui-quadrant-BFu1K90E.cjs → vue-ui-quadrant-DVJk4jVY.cjs} +1 -1
- package/dist/{vue-ui-quadrant-DinfyJBM.js → vue-ui-quadrant-Dqj0kKDK.js} +12 -12
- package/dist/{vue-ui-quick-chart-D5JhRHUd.js → vue-ui-quick-chart-C16V9Aae.js} +9 -9
- package/dist/{vue-ui-quick-chart-Dp6hQbfz.cjs → vue-ui-quick-chart-DseczpPU.cjs} +1 -1
- package/dist/{vue-ui-radar-Ds39hdq4.cjs → vue-ui-radar-BAeIHJpy.cjs} +1 -1
- package/dist/{vue-ui-radar-CUFZHgr3.js → vue-ui-radar-Db7iB_Qj.js} +12 -12
- package/dist/{vue-ui-rating-BfqOFA-n.cjs → vue-ui-rating-D0Dx6ZXa.cjs} +1 -1
- package/dist/{vue-ui-rating-D1EUcFL0.js → vue-ui-rating-JEdFnT3W.js} +2 -2
- package/dist/{vue-ui-relation-circle-CiULD7PK.cjs → vue-ui-relation-circle-DQna8U5y.cjs} +1 -1
- package/dist/{vue-ui-relation-circle-D65EImKT.js → vue-ui-relation-circle-gakSZ4S6.js} +7 -7
- package/dist/{vue-ui-rings-9zTtxZif.js → vue-ui-rings-D5n6DT_A.js} +12 -12
- package/dist/{vue-ui-rings-DtMD95_q.cjs → vue-ui-rings-DtRyfbLl.cjs} +1 -1
- package/dist/{vue-ui-scatter-DXzppvmP.cjs → vue-ui-scatter-Bi6D12HK.cjs} +1 -1
- package/dist/{vue-ui-scatter-DsF27c6e.js → vue-ui-scatter-PREHAey0.js} +12 -12
- package/dist/{vue-ui-skeleton-a_FvGOK6.cjs → vue-ui-skeleton-B3iHjtI-.cjs} +1 -1
- package/dist/{vue-ui-skeleton-CrT5EE2W.js → vue-ui-skeleton-Bvgys0sE.js} +3 -3
- package/dist/{vue-ui-smiley-DK8TadZl.js → vue-ui-smiley-Bbz2pMRt.js} +2 -2
- package/dist/{vue-ui-smiley-CpC75CYj.cjs → vue-ui-smiley-CPZZHQxU.cjs} +1 -1
- package/dist/{vue-ui-spark-trend-oZCQCarV.cjs → vue-ui-spark-trend-BQJgJLH1.cjs} +1 -1
- package/dist/{vue-ui-spark-trend-BCN37BvU.js → vue-ui-spark-trend-OSzSYi-e.js} +5 -5
- package/dist/{vue-ui-sparkbar-CoCEXvSI.cjs → vue-ui-sparkbar-CMXau9-B.cjs} +1 -1
- package/dist/{vue-ui-sparkbar-CE8WVA2T.js → vue-ui-sparkbar-CTBKE2AF.js} +4 -4
- package/dist/{vue-ui-sparkgauge-DoZQ6ZYY.js → vue-ui-sparkgauge-Cut-q8bg.js} +4 -4
- package/dist/{vue-ui-sparkgauge-DRGJ2R72.cjs → vue-ui-sparkgauge-DXGiSj1v.cjs} +1 -1
- package/dist/{vue-ui-sparkhistogram-Bol-aQuY.js → vue-ui-sparkhistogram-Bc9284wI.js} +5 -5
- package/dist/{vue-ui-sparkhistogram-wzpO76Dd.cjs → vue-ui-sparkhistogram-D0JFcRmB.cjs} +1 -1
- package/dist/{vue-ui-sparkline-BdBLfCAO.cjs → vue-ui-sparkline-BjuntN3v.cjs} +1 -1
- package/dist/{vue-ui-sparkline-C9FJaLay.js → vue-ui-sparkline-JtLdV2lv.js} +4 -4
- package/dist/{vue-ui-sparkstackbar-CQSP1urd.js → vue-ui-sparkstackbar-Dnb7y-aL.js} +5 -5
- package/dist/{vue-ui-sparkstackbar-DcGfGfpf.cjs → vue-ui-sparkstackbar-UHMiNIcM.cjs} +1 -1
- package/dist/{vue-ui-stackbar-DZEOEvnN.cjs → vue-ui-stackbar-B3tfGGNG.cjs} +2 -2
- package/dist/{vue-ui-stackbar-CDFfxSCS.js → vue-ui-stackbar-Do4pbvT_.js} +15 -15
- package/dist/{vue-ui-strip-plot-cwg3sgfW.cjs → vue-ui-strip-plot-BL_QIbRg.cjs} +1 -1
- package/dist/{vue-ui-strip-plot-Mroaxrtl.js → vue-ui-strip-plot-DpEyBQVy.js} +11 -11
- package/dist/{vue-ui-table-JunVPtv-.cjs → vue-ui-table-Bo6YTb5z.cjs} +1 -1
- package/dist/{vue-ui-table-DMGZN-3h.js → vue-ui-table-DOy0Vino.js} +1 -1
- package/dist/{vue-ui-table-heatmap-Cvd3LF-p.js → vue-ui-table-heatmap-BBtNwXmc.js} +4 -4
- package/dist/{vue-ui-table-heatmap-B-K-sXUr.cjs → vue-ui-table-heatmap-BEyXNXkX.cjs} +1 -1
- package/dist/{vue-ui-table-sparkline-D6LrWje8.js → vue-ui-table-sparkline-CgMtPPVk.js} +5 -5
- package/dist/{vue-ui-table-sparkline-DZcJ1rQX.cjs → vue-ui-table-sparkline-CjOt6yUn.cjs} +1 -1
- package/dist/{vue-ui-thermometer-61KP0jn1.cjs → vue-ui-thermometer-DDzJGu-3.cjs} +1 -1
- package/dist/{vue-ui-thermometer-BSMW00bJ.js → vue-ui-thermometer-mxQsDV23.js} +7 -7
- package/dist/{vue-ui-timer-jeD5NmuN.cjs → vue-ui-timer-BoHc9W-g.cjs} +1 -1
- package/dist/{vue-ui-timer-B2iP7RSf.js → vue-ui-timer-py5C5kre.js} +5 -5
- package/dist/{vue-ui-tiremarks-D2kbp6KR.cjs → vue-ui-tiremarks-DfzjVsQy.cjs} +1 -1
- package/dist/{vue-ui-tiremarks-C1WyRyfc.js → vue-ui-tiremarks-cOumsgMp.js} +7 -7
- package/dist/vue-ui-treemap-BapuAvm_.cjs +1 -0
- package/dist/{vue-ui-treemap-DyJ_Ath1.js → vue-ui-treemap-D52gL3aO.js} +185 -185
- package/dist/{vue-ui-vertical-bar-yzivBWJt.js → vue-ui-vertical-bar-B7xGhcol.js} +12 -12
- package/dist/{vue-ui-vertical-bar-C0cbPo6B.cjs → vue-ui-vertical-bar-tUOVTrhe.cjs} +1 -1
- package/dist/{vue-ui-waffle-CF3e6ft5.cjs → vue-ui-waffle-D_eTTi3G.cjs} +1 -1
- package/dist/{vue-ui-waffle-BByWdS7G.js → vue-ui-waffle-Dl3103a6.js} +12 -12
- package/dist/{vue-ui-wheel-D7R1yr52.cjs → vue-ui-wheel-BF-ixbP0.cjs} +1 -1
- package/dist/{vue-ui-wheel-iDX0u5LU.js → vue-ui-wheel-j5qr7c2B.js} +7 -7
- package/dist/{vue-ui-word-cloud-BPQFUEFg.js → vue-ui-word-cloud-CDCHlEtX.js} +13 -13
- package/dist/vue-ui-word-cloud-DzhX3V-T.cjs +1 -0
- package/dist/{vue-ui-xy-DmwPJ7Bc.js → vue-ui-xy-Cqd9LwBJ.js} +18 -18
- package/dist/vue-ui-xy-DXp678aj.cjs +3 -0
- package/dist/{vue-ui-xy-canvas-aZQ9FHGI.cjs → vue-ui-xy-canvas-DfYwxC06.cjs} +2 -2
- package/dist/{vue-ui-xy-canvas-CmXVo7kC.js → vue-ui-xy-canvas-byW5VmrH.js} +16 -16
- package/package.json +2 -3
- package/dist/DataTable-Bm_s0nuy.cjs +0 -1
- package/dist/PenAndPaper-aD8jM7bo.cjs +0 -1
- package/dist/Slicer-B8Egk1-K.cjs +0 -1
- package/dist/img-BIeSHu0f.js +0 -15
- package/dist/img-D6uvziU0.cjs +0 -1
- package/dist/index-BprEQiKM.cjs +0 -9
- package/dist/pdf-BpXLKlRx.cjs +0 -1
- package/dist/pdf-H8Iw_Wax.js +0 -44
- package/dist/usePrinter-CAGQW2cC.cjs +0 -1
- package/dist/vue-data-ui-Banpw0iL.cjs +0 -9
- package/dist/vue-ui-annotator-Ye4UmfpY.cjs +0 -371
- package/dist/vue-ui-cursor-DMCSD6tW.cjs +0 -1
- package/dist/vue-ui-dashboard-Cewv6xvc.cjs +0 -1
- package/dist/vue-ui-molecule-fuZ8vxv7.cjs +0 -1
- package/dist/vue-ui-screenshot-C8TpXNBS.cjs +0 -3
- package/dist/vue-ui-screenshot-CQHpwksn.js +0 -161
- package/dist/vue-ui-treemap-BxbeEbWT.cjs +0 -1
- package/dist/vue-ui-word-cloud-CSnrXzqi.cjs +0 -1
- package/dist/vue-ui-xy-uJqJ5M1Y.cjs +0 -3
|
@@ -0,0 +1,371 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./index-CuIvJLJx.cjs"),N=require("./dom-to-png-BpstRczV.cjs"),I=require("./jspdf.es.min-C518mmma.cjs"),i=require("vue"),b=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),F={props:{config:{type:Object,default(){return{}}},dataset:{type:Object,default(){return{shapes:[],lastSelectedShape:void 0}}}},data(){return{activeShape:void 0,strokeSize:1,currentPointer:{start:{x:0,y:0},end:{x:0,end:0}},currentTarget:void 0,hoveredShapeId:void 0,isBold:!1,isBulletTextMode:!1,isDash:!1,isDeleteMode:!1,isDrawing:!1,isDrawingNewShape:!0,isDrawMode:!1,isItalic:!1,isMouseDown:!1,isMoveMode:!1,isPrinting:!1,isResizeMode:!1,isSelectMode:!1,isSummaryOpen:!1,isTextMode:!1,isUnderline:!1,isWriting:!1,lastSelectedShape:this.dataset.lastSelectedShape,pointerDownId:-1,pointerPosition:{x:0,y:0},preventEdit:!0,selectedGroup:[],shapes:this.dataset.shapes?this.dataset.shapes:[],shapesOrder:[],step:Math.round(Math.random())*1e5,svgHeight:1e3,svgWidth:1e3,options:{arrow:{color:"grey",filled:!0},circle:{color:"grey",filled:!1,radius:3,strokeWidth:2},rect:{color:"grey",filled:!1,strokeWidth:2,height:12,width:12}},selectedColor:"#000000",showCaret:!1,sizeRatio:1,slottedSvg:void 0,sourceWidth:1,sourceHeight:1,textAlign:"start",textFont:20,transparency:100,transparencyCodes:u.opacity}},watch:{shapes:{handler(e){e.length===0&&(this.lastSelectedShape=void 0)}}},computed:{FINAL_CONFIG(){const e=u.useConfig().vue_ui_annotator;if(!Object.keys(this.config||{}).length)return e;const o=this.treeShake({defaultConfig:e,userConfig:this.config});return this.convertConfigColors(o)},canSelect(){return this.shapes.filter(e=>!["line","group"].includes(e.type)).length>1},colorTransparency(){return this.transparencyCodes[this.transparency>98?98:this.transparency]},cursorClass(){switch(!0){case this.isDeleteMode:return"default";case this.isMoveMode:return"move";case this.isTextMode:return"text";case this.isResizeMode:return"se-resize";default:return""}},records(){return this.shapes},userShapes(){return this.records.map(e=>{switch(!0){case(e&&e.type==="arrow"):const o=e.strokeWidth>3?5:10,s=e.strokeWidth>3?2.5:5;return`
|
|
2
|
+
<defs>
|
|
3
|
+
<marker
|
|
4
|
+
id="${e.id}"
|
|
5
|
+
markerWidth="${o}"
|
|
6
|
+
markerHeight="${o}"
|
|
7
|
+
refX="0"
|
|
8
|
+
refY="${s}"
|
|
9
|
+
orient="auto"
|
|
10
|
+
>
|
|
11
|
+
<polygon
|
|
12
|
+
points="0 0,${o} ${s}, 0 ${o}"
|
|
13
|
+
fill="${e.color}"
|
|
14
|
+
/>
|
|
15
|
+
</marker>
|
|
16
|
+
</defs>
|
|
17
|
+
${this.includeSelectionIndicator(e)}
|
|
18
|
+
<g id="${e.id}">
|
|
19
|
+
<path
|
|
20
|
+
style="stroke-linecap: round !important; ${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:""}"
|
|
21
|
+
stroke="${e.color}"
|
|
22
|
+
id="${e.id}"
|
|
23
|
+
d="M${e.x},${e.y} ${e.endX},${e.endY}"
|
|
24
|
+
stroke-width="${e.strokeWidth}"
|
|
25
|
+
marker-end="url(#${e.id})"
|
|
26
|
+
/>
|
|
27
|
+
</g>
|
|
28
|
+
<g id="${e.id}">
|
|
29
|
+
<rect
|
|
30
|
+
id="${e.id}"
|
|
31
|
+
x="${e.x-10}"
|
|
32
|
+
y="${e.y-10}"
|
|
33
|
+
height="20"
|
|
34
|
+
width="20"
|
|
35
|
+
fill="rgba(0,0,0,0.3)"
|
|
36
|
+
style="display:${this.isResizeMode||this.isMoveMode?"initial":"none"}; rx:1 !important; ry:1 !important;"
|
|
37
|
+
/>
|
|
38
|
+
</g>
|
|
39
|
+
${this.includeDeleteButton(e)}
|
|
40
|
+
</g>
|
|
41
|
+
`;case(e&&e.type==="circle"):return`
|
|
42
|
+
<g id="${e.id}">
|
|
43
|
+
${this.includeSelectionIndicator(e)}
|
|
44
|
+
<circle
|
|
45
|
+
id="${e.id}"
|
|
46
|
+
cx="${e.x}"
|
|
47
|
+
cy="${e.y}"
|
|
48
|
+
r="${e.circleRadius?e.circleRadius:Number.MIN_VALUE}"
|
|
49
|
+
fill="${e.isFilled?e.color+e.alpha:"rgba(255,255,255,0.001)"}"
|
|
50
|
+
stroke="${e.color+e.alpha}"
|
|
51
|
+
stroke-width="${e.strokeWidth}"
|
|
52
|
+
style="${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:""}"
|
|
53
|
+
>
|
|
54
|
+
</circle>
|
|
55
|
+
</g>
|
|
56
|
+
|
|
57
|
+
${this.includeDeleteButton(e)}`;case(e&&e.type==="group"):return`<g id="${e.id}">
|
|
58
|
+
<rect
|
|
59
|
+
id="${this.isResizeMode?"":e.id}"
|
|
60
|
+
x="${e.x}"
|
|
61
|
+
y="${e.y}"
|
|
62
|
+
fill="transparent"
|
|
63
|
+
height="${e.rectHeight}"
|
|
64
|
+
width="${e.rectWidth}"
|
|
65
|
+
stroke="grey"
|
|
66
|
+
stroke-width="1"
|
|
67
|
+
style="rx:1 !important; ry:1 !important; ${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:""}; display:${this.isSelectMode||this.isDeleteMode||this.hoveredShapeId&&this.hoveredShapeId===e.id?"initial":"none"};"
|
|
68
|
+
/>
|
|
69
|
+
<g id="${e.id}">
|
|
70
|
+
${e.content?e.content:""}
|
|
71
|
+
</g>
|
|
72
|
+
${this.includeDeleteButton(e)}
|
|
73
|
+
</g> `;case(e&&e.type==="rect"):return`<g id="${e.id}">
|
|
74
|
+
${this.includeSelectionIndicator(e)}
|
|
75
|
+
<rect
|
|
76
|
+
id="${this.isResizeMode?"":e.id}"
|
|
77
|
+
x="${e.x}"
|
|
78
|
+
y="${e.y}"
|
|
79
|
+
fill="${e.isFilled?e.color+e.alpha:"rgba(255,255,255,0.001)"}"
|
|
80
|
+
height="${e.rectHeight}"
|
|
81
|
+
width="${e.rectWidth}"
|
|
82
|
+
stroke="${e.color+e.alpha}"
|
|
83
|
+
stroke-width="${e.strokeWidth}"
|
|
84
|
+
style="rx:1 !important; ry:1 !important; ${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:""}"
|
|
85
|
+
/>
|
|
86
|
+
<rect id="${e.id}"
|
|
87
|
+
x="${e.x+e.rectWidth}"
|
|
88
|
+
y="${e.y+e.rectHeight}"
|
|
89
|
+
height="20"
|
|
90
|
+
width="20"
|
|
91
|
+
fill="rgba(0,0,0,0.3)"
|
|
92
|
+
style="display:${this.isResizeMode?"initial":"none"}; rx:1 !important; ry:1 !important;"
|
|
93
|
+
/>
|
|
94
|
+
${this.includeDeleteButton(e)}
|
|
95
|
+
</g> `;case(e&&e.type==="line"):return`
|
|
96
|
+
<g id="${e.id}">
|
|
97
|
+
<path
|
|
98
|
+
id="${e.id}"
|
|
99
|
+
d="M${e.path?e.path:""}"
|
|
100
|
+
style="stroke:${e.color+e.alpha} !important; fill:none; stroke-width:${e.strokeWidth} !important; stroke-linecap: round !important; stroke-linejoin: round !important;"
|
|
101
|
+
/>
|
|
102
|
+
${this.includeDeleteButton(e)}
|
|
103
|
+
</g>
|
|
104
|
+
`;case(e&&e.type==="text"):const n=e.textContent.split(""),l=[];for(let t=0;t<n.length;t+=1)l.push(`
|
|
105
|
+
${e.isBulletTextMode?`<tspan x="${e.x-e.fontSize}" y="${e.y+e.fontSize*t}" id="${e.id}" font-size="${e.fontSize/2}">⬤</tspan>`:""}
|
|
106
|
+
<tspan id="${e.id}" x="${e.x}" y="${e.y+e.fontSize*t}">
|
|
107
|
+
${n[t]}
|
|
108
|
+
</tspan>`);return`
|
|
109
|
+
${this.includeSelectionIndicator(e)}
|
|
110
|
+
${this.computeTextElement(e,l,e.isBulletTextMode)}
|
|
111
|
+
`}})}},mounted(){const e=this.$refs.drawSvgContainer;let o=!1;this.walkTheDOM(e,l=>{if(!o&&["DIV","svg","section","canvas"].includes(l.tagName)){this.slottedSvg=l,o=!0;return}});const s=this.slottedSvg.getBoundingClientRect();this.sizeRatio=s.height/s.width,this.svgWidth=1e3,this.svgHeight=this.sizeRatio*1e3,this.sourceWidth=s.width,this.sourceHeight=s.height,new ResizeObserver(l=>{l.forEach(t=>{this.sourceWidth=t.contentRect.width,this.sourceHeight=t.contentRect.height,this.sizeRatio=t.contentRect.height/t.contentRect.width,this.svgHeight=this.sizeRatio*1e3})}).observe(this.slottedSvg),window.addEventListener("keydown",l=>{this.write(l)})},destroyed(){window.removeEventListener("keydown",e=>{this.write(e)})},methods:{treeShake:u.treeShake,convertConfigColors:u.convertConfigColors,bringShapeTo(e){const o=this.shapes.find(s=>s.id===this.lastSelectedShape.id);switch(!0){case e==="front":this.shapes=this.shapes.filter(s=>s.id!==o.id),this.shapes.push(o);break;case e==="back":this.shapes=this.shapes.filter(s=>s.id!==o.id),this.shapes=[o,...this.shapes];break;default:return}},clickSvg(e){if(this.isDeleteMode)return;this.deleteEmptyTextElement(),this.isTextMode?(this.isWriting=!0,this.showCaret=!0):(this.isWriting=!1,this.showCaret=!1,this.isTextMode=!1);let o=`text_${Math.random()*1e4}_${Math.random()*99999}`;if(this.isWriting){this.shapes.push({id:o,type:"text",lines:0,x:this.pointerPosition.x,y:this.pointerPosition.y,textContent:"",fontSize:this.copy(this.textFont),textAlign:this.copy(this.textAlign),isBold:this.copy(this.isBold),isItalic:this.copy(this.isItalic),isUnderline:this.copy(this.isUnderline),color:this.copy(this.selectedColor),isBulletTextMode:this.copy(this.isBulletTextMode)}),this.currentTarget=this.shapes.at(-1),this.lastSelectedShape=this.shapes.at(-1);return}const s=()=>{this.isDash=this.shapes.find(l=>l.id===e.target.id).isDash},n=()=>{this.strokeSize=this.shapes.find(l=>l.id===e.target.id).strokeWidth};if(this.isSelectMode=!1,e.target.id.includes("arrow")){this.activeShape="arrow",s(),n();return}if(e.target.id.includes("circle")){this.activeShape="circle",this.options.circle.filled=this.shapes.find(l=>l.id===e.target.id).isFilled,s(),n();return}if(e.target.id.includes("rect")){this.activeShape="rect",this.options.rect.filled=this.shapes.find(l=>l.id===e.target.id).isFilled,s(),n();return}if(e.target.id.includes("line")){this.activeShape="line",n();return}if(e.target.id.includes("text")){this.isTextMode=!0,this.isWriting=!0,this.showCaret=!0;const l=this.shapes.find(t=>t.id===e.target.id);l&&l.textAlign&&(this.textAlign=this.shapes.find(t=>t.id===e.target.id).textAlign),l&&(this.isBulletTextMode=this.shapes.find(t=>t.id===e.target.id).isBulletTextMode);return}},copyPaste(){const e={...this.lastSelectedShape,id:`${this.lastSelectedShape.id}_copy`,x:this.lastSelectedShape.x-100<0?1:this.lastSelectedShape.x-100,y:this.lastSelectedShape.y-100<0?1:this.lastSelectedShape.y-100};this.shapes.push(e)},includeDeleteButton(e,o=!1){switch(!0){case e.type==="circle":return`
|
|
112
|
+
<g id="${e.id}" style="display:${this.isDeleteMode?"initial":"none"};">
|
|
113
|
+
<circle id="${e.id}" cx="${e.x}" cy="${e.y}" r="12" fill="red"/>
|
|
114
|
+
<line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x-4}" y1="${e.y-4}" x2="${e.x+4}" y2="${e.y+4}"/>
|
|
115
|
+
<line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x+4}" y1="${e.y-4}" x2="${e.x-4}" y2="${e.y+4}"/>
|
|
116
|
+
</g>
|
|
117
|
+
`;case e.type==="text":let s,n=[-8,-12,-4,-12,-4];switch(!0){case e.textAlign==="start":o?s=[-20,-24,-16,-16,-24]:s=[-16,-20,-12,-12,-20];break;case e.textAlign==="middle":s=[0,-4,4,4,-4],n=[-32,-36,-28,-36,-28];break;case e.textAlign==="end":s=[16,20,12,12,20];break;default:s=[0,0,0];break}return`
|
|
118
|
+
<g id="${e.id}" style="display:${this.isDeleteMode?"initial":"none"};">
|
|
119
|
+
<circle id="${e.id}" cx="${e.x+s[0]}" cy="${e.y+n[0]}" r="12" fill="red"/>
|
|
120
|
+
<line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x+s[1]}" y1="${e.y+n[1]}" x2="${e.x+s[2]}" y2="${e.y+n[2]}"/>
|
|
121
|
+
<line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x+s[3]}" y1="${e.y+n[3]}" x2="${e.x+s[4]}" y2="${e.y+n[4]}"/>
|
|
122
|
+
</g>
|
|
123
|
+
`;default:return`
|
|
124
|
+
<g id="${e.id}" style="display:${this.isDeleteMode?"initial":"none"};">
|
|
125
|
+
<circle id="${e.id}" cx="${e.x-4}" cy="${e.y-4}" r="12" fill="red"/>
|
|
126
|
+
<line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x-8}" y1="${e.y-8}" x2="${e.x}" y2="${e.y}"/>
|
|
127
|
+
<line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x}" y1="${e.y-8}" x2="${e.x-8}" y2="${e.y}"/>
|
|
128
|
+
</g>
|
|
129
|
+
`}},includeSelectionIndicator(e){if(e)switch(!0){case e.type==="rect":return`
|
|
130
|
+
<rect
|
|
131
|
+
id="${e.id}"
|
|
132
|
+
style="stroke-dasharray: 10; display:${this.hoveredShapeId&&this.hoveredShapeId===e.id?"initial":"none"}"
|
|
133
|
+
x="${e.x-20}"
|
|
134
|
+
y="${e.y-20}"
|
|
135
|
+
height="${e.rectHeight+40}"
|
|
136
|
+
width="${e.rectWidth+40}"
|
|
137
|
+
fill="transparent"
|
|
138
|
+
stroke="grey"
|
|
139
|
+
/>
|
|
140
|
+
`;case e.type==="circle":return`
|
|
141
|
+
<rect
|
|
142
|
+
id="${e.id}"
|
|
143
|
+
style="stroke-dasharray: 10; display:${this.hoveredShapeId&&this.hoveredShapeId===e.id?"initial":"none"}"
|
|
144
|
+
x="${e.x-e.circleRadius-20}"
|
|
145
|
+
y="${e.y-e.circleRadius-20}"
|
|
146
|
+
height="${e.circleRadius*2+40}"
|
|
147
|
+
width="${e.circleRadius*2+40}"
|
|
148
|
+
fill="transparent"
|
|
149
|
+
stroke="grey"
|
|
150
|
+
/>
|
|
151
|
+
`;case e.type==="arrow":const o=e.endX-e.x>0,s=e.endY-e.y>0;return`
|
|
152
|
+
<rect
|
|
153
|
+
id="${e.id}"
|
|
154
|
+
style="stroke-dasharray: 10; display:${this.hoveredShapeId&&this.hoveredShapeId===e.id?"initial":"none"}"
|
|
155
|
+
x="${o?e.x-20:e.endX-20}"
|
|
156
|
+
y="${s?e.y-20:e.endY-20}"
|
|
157
|
+
height="${s?e.endY-e.y+40:e.y-e.endY+40}"
|
|
158
|
+
width="${o?e.endX-e.x+40:e.x-e.endX+40}"
|
|
159
|
+
fill="transparent"
|
|
160
|
+
stroke="grey"
|
|
161
|
+
/>
|
|
162
|
+
`;case e.type==="text":const n=Array.from(document.getElementsByTagName("text")).find(c=>c.id===e.id);if(!n)return;const{x:l,y:t,width:r,height:d}=n.getBBox();return`
|
|
163
|
+
<rect
|
|
164
|
+
id="${e.id}"
|
|
165
|
+
style="stroke-dasharray: 10; display:${this.hoveredShapeId&&this.hoveredShapeId===e.id?"initial":"none"}"
|
|
166
|
+
x="${l-20}"
|
|
167
|
+
y="${t-20}"
|
|
168
|
+
height="${d+40}"
|
|
169
|
+
width="${r+40}"
|
|
170
|
+
fill="transparent"
|
|
171
|
+
stroke="grey"
|
|
172
|
+
/>
|
|
173
|
+
`;default:return""}},allowEditAndHoverShapes(e){e.preventDefault(),this.preventEdit=!1,e.target&&e.target.id&&(this.hoveredShapeId=e.target.id)},setSelectedTextAlignTo(e){!this.lastSelectedShape||this.lastSelectedShape.type!=="text"||(this.lastSelectedShape.textAlign=e)},undoLastShape(){this.lastSelectedShape=void 0,this.shapes=this.shapes.slice(0,-1)},write(e){if(this.preventEdit)return;e.preventDefault();const o=e.keyCode;if(!this.isWriting)return;this.showCaret=!0;let s;if(this.lastSelectedShape.type==="text"?s=this.shapes.find(l=>l.id===this.lastSelectedShape.id):s=this.shapes.at(-1),this.currentTarget=s,s.type!=="text")return;this.currentTarget.isBold=this.copy(this.isBold),this.currentTarget.isItalic=this.copy(this.isItalic),this.currentTarget.isUnderline=this.copy(this.isUnderline);const n=[16,17,18,20,27,33,34,35,36,37,38,39,40,45,91,112,113,114,115,116,117,118,119,120,121,122,123,221,255,"Unidentified"];switch(!0){case o===8:s.textContent=s.textContent.slice(0,-1);break;case o===9:s.textContent+=" ";break;case o===13:s.lines+=1,s.textContent+="";return;case n.includes(o):return;default:s.textContent+=e.key}},groupShapes(){if(this.selectedGroup=[],this.activeShape!=="group"){this.isSelectMode=!1,this.shapes=this.shapes.filter(o=>o.type!=="group");return}const e=this.shapes.at(-1);if(this.shapes.forEach(o=>{if(o.type!=="group")switch(!0){case o.type==="arrow":const s=o.x<=o.endX&&o.y<=o.endY&&e.x<=o.x&&e.y<=o.y&&e.x+e.rectWidth>=o.endX&&e.y+e.rectHeight>=o.endY,n=o.endY<o.y&&o.x<o.endX&&e.x<=o.x&&e.y<=o.y&&e.x+e.rectWidth>=o.endX&&e.y+e.rectHeight>=o.y,l=o.x>o.endX&&o.y<o.endY&&e.x<=o.endX&&e.y<=o.endY&&e.x+e.rectWidth>=o.x&&e.y+e.rectHeight>=o.endY,t=o.x>o.endX&&o.y>o.endY&&e.x<=o.endX&&e.y<=o.endY&&e.x+e.rectWidth>=o.x&&e.y+e.rectHeight>=o.y;(s||n||l||t)&&this.selectedGroup.push(o);break;case o.type==="circle":e.x<=o.x+o.circleRadius&&e.y<=o.y+o.circleRadius&&o.x+o.circleRadius<=e.x+e.rectWidth&&o.y+o.circleRadius<=e.y+e.rectHeight&&this.selectedGroup.push(o);break;case o.type==="rect":e.x<=o.x&&e.y<=o.y&&o.x<=e.x+e.rectWidth&&o.y<=e.y+e.rectHeight&&o.x+o.rectWidth<=e.x+e.rectWidth&&o.y+o.rectHeight<=e.y+e.rectHeight&&o.rectWidth<=e.rectWidth&&o.rectHeight<=e.rectHeight&&this.selectedGroup.push(o);break;case o.type==="text":e.x<=o.x&&e.y<=o.y&&this.selectedGroup.push(o);break}}),this.selectedGroup=this.selectedGroup.map(o=>({...o,id:e.id,oldId:o.id,diffX:o.x-e.x,diffY:o.y-e.y,diffEndX:o.endX?o.endX-e.x:0,diffEndY:o.endY?o.endY-e.y:0})),e.source=this.selectedGroup,this.selectedGroup.length>1){const o=this.copy(this.selectedGroup).map(s=>s.oldId);this.shapes=this.shapes.filter(s=>!o.includes(s.id)),this.selectedGroup.forEach(s=>{switch(!0){case s.type==="circle":e.content+=`
|
|
174
|
+
<circle
|
|
175
|
+
id="${s.id}"
|
|
176
|
+
cx="${s.x}"
|
|
177
|
+
cy="${s.y}"
|
|
178
|
+
r="${s.circleRadius?s.circleRadius:Number.MIN_VALUE}"
|
|
179
|
+
fill="${s.isFilled?s.color+s.alpha:"rgba(255,255,255,0.001)"}"
|
|
180
|
+
stroke="${s.color+s.alpha}"
|
|
181
|
+
stroke-width="${s.strokeWidth}"
|
|
182
|
+
style="${s.isDash?`stroke-dasharray: ${s.strokeWidth*3}`:""}"
|
|
183
|
+
/>
|
|
184
|
+
`;break;case s.type==="rect":e.content+=`
|
|
185
|
+
<rect
|
|
186
|
+
id="${this.isResizeMode?"":s.id}"
|
|
187
|
+
x="${s.x}"
|
|
188
|
+
y="${s.y}"
|
|
189
|
+
fill="${s.isFilled?s.color+s.alpha:"rgba(255,255,255,0.001)"}"
|
|
190
|
+
height="${s.rectHeight}"
|
|
191
|
+
width="${s.rectWidth}"
|
|
192
|
+
stroke="${s.color+s.alpha}"
|
|
193
|
+
stroke-width="${s.strokeWidth}"
|
|
194
|
+
style="rx:1 !important; ry:1 !important; ${s.isDash?`stroke-dasharray: ${s.strokeWidth*3}`:""}"
|
|
195
|
+
/>
|
|
196
|
+
`;break;case s.type==="arrow":const n=s.strokeWidth>3?5:10,l=s.strokeWidth>3?2.5:5,t=Date.now();e.content+=`
|
|
197
|
+
<g id="${s.id}">
|
|
198
|
+
<defs>
|
|
199
|
+
<marker
|
|
200
|
+
id="${t}"
|
|
201
|
+
markerWidth="${n}"
|
|
202
|
+
markerHeight="${n}"
|
|
203
|
+
refX="0"
|
|
204
|
+
refY="${l}"
|
|
205
|
+
orient="auto"
|
|
206
|
+
>
|
|
207
|
+
<polygon
|
|
208
|
+
points="0 0,${n} ${l}, 0 ${n}"
|
|
209
|
+
fill="${s.color}"
|
|
210
|
+
/>
|
|
211
|
+
</marker>
|
|
212
|
+
</defs>
|
|
213
|
+
|
|
214
|
+
<path
|
|
215
|
+
style="stroke-linecap: round !important; ${s.isDash?`stroke-dasharray: ${s.strokeWidth*3}`:""}"
|
|
216
|
+
stroke="${s.color}"
|
|
217
|
+
id="${s.id}"
|
|
218
|
+
d="M${s.x},${s.y} ${s.endX},${s.endY}"
|
|
219
|
+
stroke-width="${s.strokeWidth}"
|
|
220
|
+
marker-end="url(#${t})"
|
|
221
|
+
/>
|
|
222
|
+
</g>
|
|
223
|
+
`;break;case s.type==="text":const r=s.textContent.split(""),d=[];for(let c=0;c<r.length;c+=1)d.push(`
|
|
224
|
+
${s.isBulletTextMode?`<tspan x="${s.x-s.fontSize}" y="${s.y+s.fontSize*c}" id="${s.id}" font-size="${s.fontSize/2}">⬤</tspan>`:""}
|
|
225
|
+
<tspan id="${s.id}" x="${s.x}" y="${s.y+s.fontSize*c}">
|
|
226
|
+
${r[c]}
|
|
227
|
+
</tspan>`);e.content+=`
|
|
228
|
+
${this.computeTextElement(s,d,s.isBulletTextMode)}
|
|
229
|
+
`;break}})}else this.shapes=this.shapes.filter(o=>o.id!==e.id)},moveGroup(e){e.content="",e.x=this.copy(this.pointerPosition.x)-e.rectWidth/2,e.y=this.copy(this.pointerPosition.y)-e.rectHeight/2,e.source.forEach(o=>{switch(!0){case o.type==="circle":e.content+=`
|
|
230
|
+
<circle
|
|
231
|
+
id="${o.id}"
|
|
232
|
+
cx="${this.copy(this.pointerPosition.x)+o.diffX-e.rectWidth/2}"
|
|
233
|
+
cy="${this.copy(this.pointerPosition.y)+o.diffY-e.rectHeight/2}"
|
|
234
|
+
r="${o.circleRadius?o.circleRadius:Number.MIN_VALUE}"
|
|
235
|
+
fill="${o.isFilled?o.color+o.alpha:"rgba(255,255,255,0.001)"}"
|
|
236
|
+
stroke="${o.color+o.alpha}"
|
|
237
|
+
stroke-width="${o.strokeWidth}"
|
|
238
|
+
style="${o.isDash?`stroke-dasharray: ${o.strokeWidth*3}`:""}"
|
|
239
|
+
/>
|
|
240
|
+
`;break;case o.type==="rect":e.content+=`
|
|
241
|
+
<rect
|
|
242
|
+
id="${this.isResizeMode?"":o.id}"
|
|
243
|
+
x="${this.copy(this.pointerPosition.x)+o.diffX-e.rectWidth/2}"
|
|
244
|
+
y="${this.copy(this.pointerPosition.y)+o.diffY-e.rectHeight/2}"
|
|
245
|
+
fill="${o.isFilled?o.color+o.alpha:"rgba(255,255,255,0.001)"}"
|
|
246
|
+
height="${o.rectHeight}"
|
|
247
|
+
width="${o.rectWidth}"
|
|
248
|
+
stroke="${o.color+o.alpha}"
|
|
249
|
+
stroke-width="${o.strokeWidth}"
|
|
250
|
+
style="rx:1 !important; ry:1 !important; ${o.isDash?`stroke-dasharray: ${o.strokeWidth*3}`:""}"
|
|
251
|
+
/>
|
|
252
|
+
`;break;case o.type==="arrow":const s=o.strokeWidth>3?5:10,n=o.strokeWidth>3?2.5:5,l=Date.now();e.content+=`
|
|
253
|
+
<g id="${o.id}">
|
|
254
|
+
<defs>
|
|
255
|
+
<marker
|
|
256
|
+
id="${l}"
|
|
257
|
+
markerWidth="${s}"
|
|
258
|
+
markerHeight="${s}"
|
|
259
|
+
refX="0"
|
|
260
|
+
refY="${n}"
|
|
261
|
+
orient="auto"
|
|
262
|
+
>
|
|
263
|
+
<polygon
|
|
264
|
+
points="0 0,${s} ${n}, 0 ${s}"
|
|
265
|
+
fill="${o.color}"
|
|
266
|
+
/>
|
|
267
|
+
</marker>
|
|
268
|
+
</defs>
|
|
269
|
+
|
|
270
|
+
<path
|
|
271
|
+
style="stroke-linecap: round !important; ${o.isDash?`stroke-dasharray: ${o.strokeWidth*3}`:""}"
|
|
272
|
+
stroke="${o.color}"
|
|
273
|
+
id="${o.id}"
|
|
274
|
+
d="M${this.copy(this.pointerPosition.x)+o.diffX-e.rectWidth/2},${this.copy(this.pointerPosition.y)+o.diffY-e.rectHeight/2} ${this.copy(this.pointerPosition.x)+o.diffEndX-e.rectWidth/2},${this.copy(this.pointerPosition.y)+o.diffEndY-e.rectHeight/2}"
|
|
275
|
+
stroke-width="${o.strokeWidth}"
|
|
276
|
+
marker-end="url(#${l})"
|
|
277
|
+
/>
|
|
278
|
+
</g>
|
|
279
|
+
`;break;case o.type==="text":const t=o.textContent.split(""),r=[];for(let d=0;d<t.length;d+=1)r.push(`
|
|
280
|
+
${o.isBulletTextMode?`<tspan x="${this.copy(this.pointerPosition.x)+o.diffX-o.fontSize-e.rectWidth/2}" y="${this.copy(this.pointerPosition.y)+o.diffY+o.fontSize*d-e.rectHeight/2}" id="${o.id}" font-size="${o.fontSize/2}">⬤</tspan>`:""}
|
|
281
|
+
<tspan id="${o.id}" x="${this.copy(this.pointerPosition.x)+o.diffX-e.rectWidth/2}" y="${this.copy(this.pointerPosition.y)+o.diffY+o.fontSize*d-e.rectHeight/2}">
|
|
282
|
+
${t[d]}
|
|
283
|
+
</tspan>`);e.content+=`
|
|
284
|
+
${this.computeTextElement(o,r,o.isBulletTextMode)}
|
|
285
|
+
`;break}})},chooseAction(e){switch(e.preventDefault(),this.isMouseDown=!0,!0){case this.isDrawMode:this.drawDown();break}},chooseMove(e){switch(e.preventDefault(),e.target.localName!=="svg"&&(this.currentTarget=e.target),!0){case(this.isMoveMode&&this.isMouseDown):this.moveDown();break;case(this.isResizeMode&&this.isMouseDown):this.resize();break}},computeCaretPosition(e){switch(!0){case e.textAlign==="middle":return`<path stroke="black" stroke-width="2" d="M${e.x},${e.y-e.fontSize} ${e.x},${e.y-e.fontSize-15}" /> <path stroke="black" stroke-width="2" d="M${e.x-3},${e.y-e.fontSize-5} ${e.x},${e.y-e.fontSize} ${e.x+3},${e.y-e.fontSize-5}"/>`;case e.textAlign==="start":const o=e.isBulletTextMode?e.fontSize:0;return`<path d="M${e.x-20-o},${e.y-e.fontSize/6} ${e.x-5-o},${e.y-e.fontSize/6}" stroke="black" stroke-width="2" />
|
|
286
|
+
<path d="M${e.x-10-o},${e.y-e.fontSize/3} ${e.x-5-o},${e.y-e.fontSize/6} ${e.x-10-o},${e.y}" stroke="black" stroke-width="2">`;case e.textAlign==="end":return`<path d="M${e.x+20},${e.y-e.fontSize/6} ${e.x+5},${e.y-e.fontSize/6}" stroke="black" stroke-width="2" />
|
|
287
|
+
<path d="M${e.x+10},${e.y-e.fontSize/3} ${e.x+5},${e.y-e.fontSize/6} ${e.x+10},${e.y}" stroke="black" stroke-width="2">`;default:return""}},computeTextElement(e,o,s=!1){switch(!0){case e.textAlign==="start":return`
|
|
288
|
+
<g id="${e.id}">
|
|
289
|
+
<rect
|
|
290
|
+
id="${e.id}"
|
|
291
|
+
style="display:${this.lastSelectedShape&&this.lastSelectedShape.id===e.id?"initial":"none"};"
|
|
292
|
+
x="${e.x}"
|
|
293
|
+
y="${e.y-50}"
|
|
294
|
+
height="${e.lines===0||e.lines===1?e.fontSize*4:e.fontSize*2*e.lines}"
|
|
295
|
+
width="100"
|
|
296
|
+
fill="rgba(0,0,0,0)"
|
|
297
|
+
/>
|
|
298
|
+
<text
|
|
299
|
+
style="user-select:none; height:100px;"
|
|
300
|
+
id="${e.id}"
|
|
301
|
+
x="${e.x}"
|
|
302
|
+
y="${e.y}"
|
|
303
|
+
text-anchor="${e.textAlign}"
|
|
304
|
+
font-size="${e.fontSize}"
|
|
305
|
+
fill="${e.color}"
|
|
306
|
+
font-weight="${e.isBold?"bold":"normal"}"
|
|
307
|
+
font-style="${e.isItalic?"italic":"normal"}"
|
|
308
|
+
text-decoration="${e.isUnderline?"underline":"none"}"
|
|
309
|
+
>
|
|
310
|
+
${o.join("")}
|
|
311
|
+
</text>
|
|
312
|
+
${this.showCaret&&this.lastSelectedShape&&this.lastSelectedShape.id===e.id?this.computeCaretPosition(e):""}
|
|
313
|
+
${this.includeDeleteButton(e,s)}
|
|
314
|
+
</g>
|
|
315
|
+
`;case e.textAlign==="middle":return`
|
|
316
|
+
<g id="${e.id}">
|
|
317
|
+
<rect
|
|
318
|
+
id="${e.id}"
|
|
319
|
+
style="display:${this.lastSelectedShape&&this.lastSelectedShape.id===e.id?"initial":"none"};"
|
|
320
|
+
x="${e.x-50}"
|
|
321
|
+
y="${e.y-50}"
|
|
322
|
+
height="${e.lines===0||e.lines===1?e.fontSize*4:e.fontSize*2*e.lines}"
|
|
323
|
+
width="100"
|
|
324
|
+
fill="rgba(0,0,0,0)"
|
|
325
|
+
/>
|
|
326
|
+
<text
|
|
327
|
+
style="user-select:none; height:100px;"
|
|
328
|
+
id="${e.id}"
|
|
329
|
+
x="${e.x}"
|
|
330
|
+
y="${e.y}"
|
|
331
|
+
text-anchor="${e.textAlign}"
|
|
332
|
+
font-size="${e.fontSize}"
|
|
333
|
+
fill="${e.color}"
|
|
334
|
+
font-weight="${e.isBold?"bold":"normal"}"
|
|
335
|
+
font-style="${e.isItalic?"italic":"normal"}"
|
|
336
|
+
text-decoration="${e.isUnderline?"underline":"none"}"
|
|
337
|
+
>
|
|
338
|
+
${o.join("")}
|
|
339
|
+
</text>
|
|
340
|
+
${this.showCaret&&this.lastSelectedShape&&this.lastSelectedShape.id===e.id?this.computeCaretPosition(e):""}
|
|
341
|
+
${this.includeDeleteButton(e)}
|
|
342
|
+
</g>
|
|
343
|
+
`;case e.textAlign==="end":return`
|
|
344
|
+
<g id="${e.id}">
|
|
345
|
+
<rect
|
|
346
|
+
id="${e.id}"
|
|
347
|
+
style="display:${this.lastSelectedShape&&this.lastSelectedShape.id===e.id?"initial":"none"};"
|
|
348
|
+
x="${e.x-100}"
|
|
349
|
+
y="${e.y-50}"
|
|
350
|
+
height="${e.lines===0||e.lines===1?e.fontSize*4:e.fontSize*2*e.lines}"
|
|
351
|
+
width="100"
|
|
352
|
+
fill="rgba(0,0,0,0)"
|
|
353
|
+
/>
|
|
354
|
+
<text
|
|
355
|
+
style="user-select:none; height:100px;"
|
|
356
|
+
id="${e.id}"
|
|
357
|
+
x="${e.x}"
|
|
358
|
+
y="${e.y}"
|
|
359
|
+
text-anchor="${e.textAlign}"
|
|
360
|
+
font-size="${e.fontSize}"
|
|
361
|
+
fill="${e.color}"
|
|
362
|
+
font-weight="${e.isBold?"bold":"normal"}"
|
|
363
|
+
font-style="${e.isItalic?"italic":"normal"}"
|
|
364
|
+
text-decoration="${e.isUnderline?"underline":"none"}"
|
|
365
|
+
>
|
|
366
|
+
${o.join("")}
|
|
367
|
+
</text>
|
|
368
|
+
${this.showCaret&&this.lastSelectedShape&&this.lastSelectedShape.id===e.id?this.computeCaretPosition(e):""}
|
|
369
|
+
${this.includeDeleteButton(e)}
|
|
370
|
+
</g>
|
|
371
|
+
`;default:return""}},copy(e){return JSON.parse(JSON.stringify(e))},clickShape(e){const o=e.target.id;switch(!0){case this.isDeleteMode:this.shapes=[...this.shapes].filter(s=>s.id!==o),this.lastSelectedShape=void 0;break;default:this.lastSelectedShape=this.shapes.find(s=>s.id===o);break}},deleteEmptyTextElement(){!this.lastSelectedShape||!this.lastSelectedShape.id.includes("text")||this.lastSelectedShape.textContent===""&&(this.shapes=this.shapes.filter(e=>e.id!==this.lastSelectedShape.id),this.lastSelectedShape=this.shapes.at(-1))},drawUp(e=!1){if(!this.activeShape||!this.isDrawing)return;this.currentPointer.end={x:this.pointerPosition.x,y:this.pointerPosition.y};let o;this.shapes.length>0&&this.currentTarget&&(o=[...this.shapes].find(d=>d.id===this.currentTarget.id));let s,n,l;o&&(s=o.x-this.currentPointer.end.x,n=o.y-this.currentPointer.end.y,l=Math.sqrt(s*s+n*n));let t,r;e?(t=Math.max(this.currentPointer.end.x,o.x),r=Math.min(this.currentPointer.end.x,o.x),Math.max(this.currentPointer.end.y,o.y),Math.min(this.currentPointer.end.y,o.y)):(t=Math.max(this.currentPointer.end.x,this.currentPointer.start.x),r=Math.min(this.currentPointer.end.x,this.currentPointer.start.x),Math.max(this.currentPointer.end.y,this.currentPointer.start.y),Math.min(this.currentPointer.end.y,this.currentPointer.start.y)),this.$nextTick(()=>{switch(!0){case this.activeShape==="arrow":this.shapes.at(-1).endX=this.currentPointer.end.x,this.shapes.at(-1).endY=this.currentPointer.end.y;break;case this.activeShape==="circle":const d=20;this.shapes.at(-1).circleRadius=this.isDrawingNewShape?this.copy(t-r)+d:l+d;break;case this.activeShape==="line":this.shapes.at(-1).path+=` ${this.pointerPosition.x} ${this.pointerPosition.y} `;break;case["rect","group"].includes(this.activeShape):const c=20;this.shapes.at(-1).rectWidth=this.copy(this.currentPointer.end.x-this.shapes.at(-1).x)>0?this.copy(this.currentPointer.end.x-this.shapes.at(-1).x):c,this.shapes.at(-1).rectHeight=this.copy(this.currentPointer.end.y-this.shapes.at(-1).y)>0?this.copy(this.currentPointer.end.y-this.shapes.at(-1).y):c}})},drawDown(){if(this.isDrawing=!0,!this.activeShape&&!this.isSelectMode||!this.isDrawing)return;this.isDrawingNewShape=!0,this.currentPointer.start={x:this.pointerPosition.x,y:this.pointerPosition.y};let e=`${this.isSelectMode?"group":this.activeShape}_${Math.random()*1e4}_${Date.now()}`;switch(!0){case this.activeShape==="arrow":this.shapes.push({id:e,x:this.pointerPosition.x,y:this.pointerPosition.y,endX:this.pointerPosition.x,endY:this.pointerPosition.y,type:this.activeShape,color:this.copy(this.selectedColor),strokeWidth:this.copy(Math.abs(this.strokeSize)),isDash:this.copy(this.isDash)}),this.lastSelectedShape=this.shapes.at(-1);break;case this.activeShape==="circle":this.shapes.push({alpha:this.options.circle.filled?this.colorTransparency:"",id:e,color:this.copy(this.selectedColor),isFilled:this.copy(this.options.circle.filled),circleRadius:this.copy(this.options.circle.radius),circleStrokeWidth:this.copy(this.options.circle.strokeWidth),type:this.activeShape,x:this.pointerPosition.x,y:this.pointerPosition.y,strokeWidth:this.copy(Math.abs(this.strokeSize)),isDash:this.copy(this.isDash)}),this.lastSelectedShape=this.shapes.at(-1);break;case this.activeShape==="line":this.shapes.push({alpha:this.copy(this.colorTransparency),id:e,x:this.pointerPosition.x,y:this.pointerPosition.y,type:this.activeShape,color:this.copy(this.selectedColor),strokeWidth:this.copy(Math.abs(this.strokeSize)),isDash:this.copy(this.isDash),path:`${this.pointerPosition.x} ${this.pointerPosition.y}`}),this.lastSelectedShape=this.shapes.at(-1);break;case this.activeShape==="rect":this.shapes.push({alpha:this.options.rect.filled?this.colorTransparency:"",id:e,color:this.copy(this.selectedColor),isFilled:this.copy(this.options.rect.filled),rectStrokeWidth:this.copy(this.options.rect.strokeWidth),rectHeight:this.copy(this.options.rect.height),rectWidth:this.copy(this.options.rect.width),type:this.activeShape,x:this.pointerPosition.x,y:this.pointerPosition.y,strokeWidth:this.copy(Math.abs(this.strokeSize)),isDash:this.copy(this.isDash)}),this.lastSelectedShape=this.shapes.at(-1);break;case this.activeShape==="group":this.shapes.push({alpha:1,id:`group_${Math.random()*1e4}_${Date.now()}`,x:this.pointerPosition.x,y:this.pointerPosition.y,isFilled:!1,rectHeight:this.copy(this.options.rect.height),rectWidth:this.copy(this.options.rect.width),rectStrokeWidth:1,type:"group",color:"grey",strokeWidth:1,isDash:!0,content:""});break}if((this.pointerDownId!==-1||!this.isDrawing)&&(clearInterval(this.pointerDownId),this.pointerDownId=-1),this.pointerDownId===-1&&this.isDrawing){this.pointerDownId=setInterval(this.drawUp,1);return}},move(e){if(!(!e||!e.id||e.type==="line"))switch(this.lastSelectedShape=e,!0){case e.type==="arrow":e.x=this.copy(this.pointerPosition.x),e.y=this.copy(this.pointerPosition.y);break;case e.type==="circle":e.x=this.copy(this.pointerPosition.x),e.y=this.copy(this.pointerPosition.y);break;case e.type==="group":this.moveGroup(e);break;case e.type==="rect":e.x=this.copy(this.pointerPosition.x-e.rectWidth/2),e.y=this.copy(this.pointerPosition.y-e.rectHeight/2);break;case e.type==="text":const o=Array.from(document.getElementsByTagName("text")).find(r=>r.id===e.id);if(!o)return;const{x:s,y:n,width:l,height:t}=o.getBBox();e.textAlign==="start"&&(e.x=this.copy(this.pointerPosition.x-l/2)),e.textAlign==="middle"&&(e.x=this.copy(this.pointerPosition.x)),e.textAlign==="end"&&(e.x=this.copy(this.pointerPosition.x+l/2)),e.lines>1?e.y=this.copy(this.pointerPosition.y-t/3):e.y=this.copy(this.pointerPosition.y+e.fontSize/2);break}},moveDown(){if(!this.currentTarget||!this.currentTarget.id)return;const e=this.currentTarget.id,o=this.shapes.find(s=>s.id===e);this.shapes=this.shapes.filter(s=>s.id!==e),this.shapes.push(o),this.pointerDownId===-1&&e&&this.move(o)},print(){this.isPrinting=!0,this.isDeleteMode=!1,this.isMoveMode=!1,this.isResizeMode=!1,this.isTextMode=!1,this.isWriting=!1,this.isSelectMode=!1,this.activeShape=void 0,this.showCaret=!1,this.$nextTick(async()=>{const e=this.$refs.drawSvgContainer;this.walkTheDOM(e,o=>{o&&o.nodeType===1&&(o.setAttribute("font-family","Helvetica"),o.style.fontFamily="Helvetica")});try{const o=await N.domToPng({container:e,scale:2}),s=new Image;s.src=o,s.onload=()=>{const n={width:595.28,height:841.89},l=s.width,t=s.height,r=l/n.width*n.height,d=n.width,c=d/l*t,a=new I.E("","pt","a4");let y=0,h=t;if(h<r)a.addImage(o,"PNG",0,0,d,c,"","FAST");else for(;h>0;)a.addImage(o,"PNG",0,y,d,c,"","FAST"),h-=r,y-=n.height,h>0&&a.addPage();a.save(`${new Date().toLocaleDateString()}_annotations.pdf`)}}catch(o){console.error("Error generating image:",o)}finally{this.isPrinting=!1,this.walkTheDOM(e,o=>{o&&o.nodeType===1&&(o.setAttribute("font-family",this.FINAL_CONFIG.style.fontFamily),o.style.fontFamily=this.FINAL_CONFIG.style.fontFamily)})}})},resetDraw(){this.isDrawing=!1,this.isMouseDown=!1,this.pointerDownId=-1,this.isSelectMode&&this.groupShapes(),clearInterval(this.pointerDownId)},resize(){this.isDrawingNewShape=!1;const e=this.currentTarget.id;if(!e)return;this.isDrawing=!0;const o=this.shapes.find(s=>s.id===e);this.activeShape=o.type,this.shapes=this.shapes.filter(s=>s.id!==e),this.shapes.push(o),this.drawUp(!0)},setFillOfSelectedRect(){!this.lastSelectedShape||!this.lastSelectedShape.id.includes("rect")||(this.lastSelectedShape.isFilled=!this.lastSelectedShape.isFilled)},setFillOfSelectedCircle(){!this.lastSelectedShape||!this.lastSelectedShape.id.includes("circle")||(this.lastSelectedShape.isFilled=!this.lastSelectedShape.isFilled)},setColorOfSelectedShape(){this.lastSelectedShape&&(this.lastSelectedShape.color=this.copy(this.selectedColor),!["arrow","text"].includes(this.lastSelectedShape.id)&&(this.lastSelectedShape.alpha=this.copy(this.colorTransparency)))},setSelectedShapeToDash(){!this.lastSelectedShape||this.lastSelectedShape.type==="text"||(this.lastSelectedShape.isDash=this.copy(this.isDash))},setTransparencyOfSelectedShape(){!this.lastSelectedShape||["arrow","text"].includes(this.lastSelectedShape.id)||(this.lastSelectedShape.alpha=this.copy(this.colorTransparency))},setStrokeWidthOfSelectedShape(){!this.lastSelectedShape||!["arrow","circle","rect","line"].includes(this.lastSelectedShape.type)||(this.lastSelectedShape.strokeWidth=this.copy(Math.abs(this.strokeSize)))},setCurrentStyleOfSelectedText(){!this.lastSelectedShape||this.lastSelectedShape.type!=="text"||(this.lastSelectedShape.isBold=this.copy(this.isBold),this.lastSelectedShape.isItalic=this.copy(this.isItalic),this.lastSelectedShape.isUnderline=this.copy(this.isUnderline),this.lastSelectedShape.fontSize=this.copy(this.textFont),this.lastSelectedShape.isBulletTextMode=this.copy(this.isBulletTextMode))},setPointer(e){e.preventDefault();const s=this.$refs.mainSvg.getBoundingClientRect();let n,l;e.touches&&e.touches.length>0?(n=e.touches[0].clientX,l=e.touches[0].clientY):(n=e.clientX,l=e.clientY),this.pointerPosition.x=(n-s.left)/s.width*this.svgWidth,this.pointerPosition.y=(l-s.top)/s.height*this.svgHeight},setShapeTo(e){if(this.showCaret=!1,this.deleteEmptyTextElement(),e===this.activeShape){this.activeShape=void 0,this.isDrawMode=!1;return}this.isDrawMode=!0,this.isDeleteMode=!1,this.isMoveMode=!1,this.isResizeMode=!1,this.isTextMode=!1,this.activeShape=e},toggleSummary(){this.isSummaryOpen=!this.isSummaryOpen,this.isSummaryOpen||(this.isMoveMode=!1,this.isResizeMode=!1,this.isTextMode=!1,this.isWriting=!1,this.activeShape=void 0,this.showCaret=!1,this.isDeleteMode=!1,this.isWriting=!1),this.$emit("toggleOpenState",{isOpen:this.isSummaryOpen})},walkTheDOM(e,o){for(o(e),e=e.firstChild;e;)this.walkTheDOM(e,o),e=e.nextSibling},save(){this.$emit("saveAnnotations",{shapes:this.shapes,lastSelectedShape:this.lastSelectedShape})}}},C={class:"vue-ui-annotator"},S={"data-dom-to-png-ignore":""},x={class:"tool-selection",style:{"margin-top":"24px"}},f=["disabled"],k=["disabled"],g=["disabled"],m=["disabled"],p={style:{width:"80%"},viewBox:"0 0 24 24"},v=["disabled"],w={style:{width:"80%"},viewBox:"0 0 24 24"},A=["disabled"],M={style:{width:"80%"},viewBox:"0 0 24 24"},O=["disabled"],L=["disabled"],G={class:"tool-selection",style:{"margin-top":"6px"}},_={viewBox:"0 0 12 12",style:{width:"100%"}},z=["fill"],T={key:0,class:"tool-input"},B={for:"circleFill"},D=["checked"],V={viewBox:"0 0 12 12",style:{width:"100%"}},E=["fill"],R={key:1,class:"tool-input"},H={for:"rectFill"},W=["checked"],P={viewBox:"0 0 24 24",style:{width:"100%"}},X=["stroke"],U={key:2},Y={style:{display:"flex","flex-direction":"column","align-items":"center","justify-content":"center"}},j={for:"textFont",style:{"font-size":"0.7em"}},q={key:3},Z={style:{display:"flex","flex-direction":"column","align-items":"center","justify-content":"center"}},J={for:"dashStyle",style:{"font-size":"0.7em"}},K={viewBox:"0 0 24 24",height:"24",width:"24",style:{"margin-bottom":"-5px","margin-top":"-10px"}},Q=["checked"],$={style:{width:"80%"},viewBox:"0 0 24 24",fill:"currentColor"},ee={key:4},te={style:{display:"flex","flex-direction":"column","align-items":"center","justify-content":"center"}},oe={for:"textFont",style:{"font-size":"0.7em"}},ie={key:5},le={key:6},se=["disabled"],re={key:7},ne=["disabled"],de={key:8},ce={key:9},ae={key:10},he={key:11},ue={style:{display:"flex","flex-direction":"column","align-items":"center","justify-content":"center"},class:"tooltip"},ye={style:{display:"flex","flex-direction":"column","align-items":"start","justify-content":"center"}},Ne={for:"colorTransparency",style:{"font-size":"0.7em"}},Ie={class:"annotator annotator__wrapper",ref:"drawSvgContainer",style:{position:"relative"}},be=["viewBox","width","height"],Fe=["id","innerHTML"],Ce=["height","viewBox","width"],Se=["cx","cy"];function xe(e,o,s,n,l,t){return i.openBlock(),i.createElementBlock("div",C,[i.createElementVNode("div",S,[i.createElementVNode("details",{class:"vue-ui-annotator-summary",onToggle:o[36]||(o[36]=(...r)=>t.toggleSummary&&t.toggleSummary(...r)),style:i.normalizeStyle(`${l.isSummaryOpen?"padding-bottom: 12px":""}; background: ${t.FINAL_CONFIG.style.backgroundColor}; color:${t.FINAL_CONFIG.style.color}; ${t.FINAL_CONFIG.style.fixedTools&&l.isSummaryOpen?"position: fixed; top: 0; left: 50%; transform: translateX(-50%); z-index: 1;":""}`)},[i.createElementVNode("summary",null,i.toDisplayString(t.FINAL_CONFIG.translations.title),1),i.createElementVNode("div",x,[i.createElementVNode("button",{disabled:l.shapes.length===0,style:i.normalizeStyle({background:l.isMoveMode?t.FINAL_CONFIG.style.buttons.controls.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:l.isMoveMode?t.FINAL_CONFIG.style.buttons.controls.selected.border:t.FINAL_CONFIG.style.buttons.controls.border,color:l.isMoveMode?t.FINAL_CONFIG.style.buttons.controls.selected.color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isMoveMode,tooltip:!0}),onClick:o[0]||(o[0]=r=>{t.deleteEmptyTextElement(),l.isMoveMode=!l.isMoveMode,l.activeShape=void 0,l.isDeleteMode=!1,l.isDrawMode=!1,l.isResizeMode=!1,l.isSelectMode=!1,l.isTextMode=!1,l.isWriting=!1,l.showCaret=!1})},[o[46]||(o[46]=i.createStaticVNode('<svg xmlns="http://www.w3.org/2000/svg" width="80%" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M18 9l3 3l-3 3" data-v-1756cea7></path><path d="M15 12h6" data-v-1756cea7></path><path d="M6 9l-3 3l3 3" data-v-1756cea7></path><path d="M3 12h6" data-v-1756cea7></path><path d="M9 18l3 3l3 -3" data-v-1756cea7></path><path d="M12 15v6" data-v-1756cea7></path><path d="M15 6l-3 -3l-3 3" data-v-1756cea7></path><path d="M12 3v6" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipMove),5)):i.createCommentVNode("",!0)],14,f),i.createElementVNode("button",{disabled:l.shapes.length===0||l.activeShape==="line",style:i.normalizeStyle({background:l.isResizeMode?t.FINAL_CONFIG.style.buttons.controls.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:l.isResizeMode?t.FINAL_CONFIG.style.buttons.controls.selected.border:t.FINAL_CONFIG.style.buttons.controls.border,color:l.isResizeMode?t.FINAL_CONFIG.style.buttons.controls.selected.color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isResizeMode,tooltip:!0}),onClick:o[1]||(o[1]=r=>{t.deleteEmptyTextElement(),l.isResizeMode=!l.isResizeMode,l.isMoveMode=!1,l.isDeleteMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.isTextMode=!1,l.isWriting=!1,l.activeShape=void 0,l.showCaret=!1})},[o[47]||(o[47]=i.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",width:"80%",viewBox:"0 0 24 24","stroke-width":"2",stroke:"currentColor",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},[i.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),i.createElementVNode("path",{d:"M4 11v8a1 1 0 0 0 1 1h8m-9 -14v-1a1 1 0 0 1 1 -1h1m5 0h2m5 0h1a1 1 0 0 1 1 1v1m0 5v2m0 5v1a1 1 0 0 1 -1 1h-1"}),i.createElementVNode("path",{d:"M4 12h7a1 1 0 0 1 1 1v7"})],-1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipResize),5)):i.createCommentVNode("",!0)],14,k),i.createElementVNode("button",{disabled:l.shapes.length===0,style:i.normalizeStyle({background:l.isDeleteMode?t.FINAL_CONFIG.style.buttons.controls.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:l.isDeleteMode?t.FINAL_CONFIG.style.buttons.controls.selected.border:t.FINAL_CONFIG.style.buttons.controls.border,color:l.isDeleteMode?t.FINAL_CONFIG.style.buttons.controls.selected.color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isDeleteMode,tooltip:!0}),onClick:o[2]||(o[2]=r=>{t.deleteEmptyTextElement(),l.isDeleteMode=!l.isDeleteMode,l.isMoveMode=!1,l.isResizeMode=!1,l.isSelectMode=!1,l.isTextMode=!1,l.isWriting=!1,l.activeShape=void 0,l.showCaret=!1})},[o[48]||(o[48]=i.createStaticVNode('<svg width="80%" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M4 7l16 0" data-v-1756cea7></path><path d="M10 11l0 6" data-v-1756cea7></path><path d="M14 11l0 6" data-v-1756cea7></path><path d="M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12" data-v-1756cea7></path><path d="M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipDelete),5)):i.createCommentVNode("",!0)],14,g),i.createElementVNode("button",{disabled:!t.canSelect,style:i.normalizeStyle({background:l.isSelectMode?t.FINAL_CONFIG.style.buttons.controls.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:l.isSelectMode?t.FINAL_CONFIG.style.buttons.controls.selected.border:t.FINAL_CONFIG.style.buttons.controls.border,color:l.isSelectMode?t.FINAL_CONFIG.style.buttons.controls.selected.color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isSelectMode,tooltip:!0}),onClick:o[3]||(o[3]=r=>{t.deleteEmptyTextElement(),t.setShapeTo("group"),l.isSelectMode=!l.isSelectMode,l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isTextMode=!1,l.isWriting=!1,l.activeShape="group",l.showCaret=!1})},[(i.openBlock(),i.createElementBlock("svg",p,o[49]||(o[49]=[i.createElementVNode("path",{fill:"currentColor",d:"M1,1V5H2V19H1V23H5V22H19V23H23V19H22V5H23V1H19V2H5V1M5,4H19V5H20V19H19V20H5V19H4V5H5M6,6V14H9V18H18V9H14V6M8,8H12V12H8M14,11H16V16H11V14H14"},null,-1)]))),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipGroup),5)):i.createCommentVNode("",!0)],14,m),i.createElementVNode("button",{disabled:l.shapes.length===0,style:i.normalizeStyle({background:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:t.FINAL_CONFIG.style.buttons.controls.border,color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,tooltip:!0}),onClick:o[4]||(o[4]=r=>{l.isResizeMode=!1,l.isMoveMode=!0,l.isDeleteMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.isTextMode=!1,l.isWriting=!1,l.showCaret=!1,t.bringShapeTo("front")})},[(i.openBlock(),i.createElementBlock("svg",w,o[50]||(o[50]=[i.createElementVNode("path",{fill:"currentColor",d:"M2,2H11V6H9V4H4V9H6V11H2V2M22,13V22H13V18H15V20H20V15H18V13H22M8,8H16V16H8V8Z"},null,-1)]))),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipBringToFront),5)):i.createCommentVNode("",!0)],12,v),i.createElementVNode("button",{disabled:l.shapes.length===0,style:i.normalizeStyle({background:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:t.FINAL_CONFIG.style.buttons.controls.border,color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,tooltip:!0}),onClick:o[5]||(o[5]=r=>{l.isResizeMode=!1,l.isMoveMode=!0,l.isDeleteMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.isTextMode=!1,l.isWriting=!1,l.showCaret=!1,t.bringShapeTo("back")})},[(i.openBlock(),i.createElementBlock("svg",M,o[51]||(o[51]=[i.createElementVNode("path",{fill:"currentColor",d:"M2,2H11V11H2V2M9,4H4V9H9V4M22,13V22H13V13H22M15,20H20V15H15V20M16,8V11H13V8H16M11,16H8V13H11V16Z"},null,-1)]))),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipBringToBack),5)):i.createCommentVNode("",!0)],12,A),i.createElementVNode("button",{disabled:l.shapes.length===0||l.activeShape==="line",style:i.normalizeStyle({background:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:t.FINAL_CONFIG.style.buttons.controls.border,color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,tooltip:!0}),onClick:o[6]||(o[6]=r=>{t.deleteEmptyTextElement(),l.isResizeMode=!1,l.isMoveMode=!0,l.isDeleteMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.isTextMode=!1,l.isWriting=!1,l.showCaret=!1,t.copyPaste()})},[o[52]||(o[52]=i.createElementVNode("svg",{width:"80%",viewBox:"0 0 24 24","stroke-width":"2",stroke:"currentColor",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},[i.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),i.createElementVNode("path",{d:"M7 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z"}),i.createElementVNode("path",{d:"M17 17v2a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2"})],-1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipDuplicate),5)):i.createCommentVNode("",!0)],12,O),i.createElementVNode("button",{disabled:l.shapes.length===0,style:i.normalizeStyle({background:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:t.FINAL_CONFIG.style.buttons.controls.border,color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,"button-tool--one-shot":!0,tooltip:!0}),onClick:o[7]||(o[7]=r=>{l.isResizeMode=!1,l.isMoveMode=!1,l.isDeleteMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.isTextMode=!1,l.isWriting=!1,l.activeShape=void 0,l.showCaret=!1,t.undoLastShape()})},[o[53]||(o[53]=i.createElementVNode("svg",{width:"80%",viewBox:"0 0 24 24","stroke-width":"2",stroke:"currentColor",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},[i.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),i.createElementVNode("path",{d:"M9 14l-4 -4l4 -4"}),i.createElementVNode("path",{d:"M5 10h11a4 4 0 1 1 0 8h-1"})],-1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipUndo),5)):i.createCommentVNode("",!0)],12,L),t.FINAL_CONFIG.style.showPrint?(i.openBlock(),i.createElementBlock("button",{key:0,style:i.normalizeStyle({background:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:t.FINAL_CONFIG.style.buttons.controls.border,color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,tooltip:!0}),onClick:o[8]||(o[8]=(...r)=>t.print&&t.print(...r))},[o[54]||(o[54]=i.createStaticVNode('<svg width="80%" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M17 17h2a2 2 0 0 0 2 -2v-4a2 2 0 0 0 -2 -2h-14a2 2 0 0 0 -2 2v4a2 2 0 0 0 2 2h2" data-v-1756cea7></path><path d="M17 9v-4a2 2 0 0 0 -2 -2h-6a2 2 0 0 0 -2 2v4" data-v-1756cea7></path><path d="M7 13m0 2a2 2 0 0 1 2 -2h6a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-6a2 2 0 0 1 -2 -2z" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipPdf),5)):i.createCommentVNode("",!0)],4)):i.createCommentVNode("",!0),t.FINAL_CONFIG.style.showSave?(i.openBlock(),i.createElementBlock("button",{key:1,style:i.normalizeStyle({background:t.FINAL_CONFIG.style.buttons.controls.backgroundColor,border:t.FINAL_CONFIG.style.buttons.controls.border,color:t.FINAL_CONFIG.style.buttons.controls.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),class:i.normalizeClass({"button-tool":!0,tooltip:!0}),onClick:o[9]||(o[9]=(...r)=>t.save&&t.save(...r))},[o[55]||(o[55]=i.createStaticVNode('<svg width="100%" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M6 4h10l4 4v10a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2" data-v-1756cea7></path><path d="M12 14m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" data-v-1756cea7></path><path d="M14 4l0 4l-6 0l0 -4" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipSave),5)):i.createCommentVNode("",!0)],4)):i.createCommentVNode("",!0)]),i.createElementVNode("div",G,[i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.activeShape==="circle",tooltip:!0}),style:i.normalizeStyle({background:l.activeShape==="circle"?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.activeShape==="circle"?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.activeShape==="circle"?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[10]||(o[10]=r=>{t.setShapeTo("circle"),l.isSelectMode=!1})},[(i.openBlock(),i.createElementBlock("svg",_,[i.createElementVNode("circle",{cx:6,cy:6,r:"4",fill:l.options.circle.filled?(l.activeShape==="circle",l.selectedColor+t.colorTransparency):"none",stroke:"currentColor"},null,8,z)])),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeCircle),5)):i.createCommentVNode("",!0)],6),l.activeShape==="circle"?(i.openBlock(),i.createElementBlock("div",T,[i.createElementVNode("label",B,i.toDisplayString(t.FINAL_CONFIG.translations.filled),1),i.withDirectives(i.createElementVNode("input",{type:"checkbox","onUpdate:modelValue":o[11]||(o[11]=r=>l.options.circle.filled=r),onChange:o[12]||(o[12]=(...r)=>t.setFillOfSelectedCircle&&t.setFillOfSelectedCircle(...r)),checked:l.options.circle.filled},null,40,D),[[i.vModelCheckbox,l.options.circle.filled]])])):i.createCommentVNode("",!0),i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.activeShape==="rect",tooltip:!0}),style:i.normalizeStyle({background:l.activeShape==="rect"?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.activeShape==="rect"?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.activeShape==="rect"?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[13]||(o[13]=r=>{t.setShapeTo("rect"),l.isSelectMode=!1})},[(i.openBlock(),i.createElementBlock("svg",V,[i.createElementVNode("rect",{x:"3",y:"3",style:{rx:"0 !important",ry:"0 !important"},height:"6",width:"6",fill:l.options.rect.filled?(l.activeShape==="rect",l.selectedColor+t.colorTransparency):"none",stroke:"currentColor"},null,8,E)])),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeRect),5)):i.createCommentVNode("",!0)],6),l.activeShape==="rect"?(i.openBlock(),i.createElementBlock("div",R,[i.createElementVNode("label",H,i.toDisplayString(t.FINAL_CONFIG.translations.filled),1),i.withDirectives(i.createElementVNode("input",{id:"rectFill",type:"checkbox","onUpdate:modelValue":o[14]||(o[14]=r=>l.options.rect.filled=r),onChange:o[15]||(o[15]=(...r)=>t.setFillOfSelectedRect&&t.setFillOfSelectedRect(...r)),checked:l.options.rect.filled},null,40,W),[[i.vModelCheckbox,l.options.rect.filled]])])):i.createCommentVNode("",!0),i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.activeShape==="arrow",tooltip:!0}),style:i.normalizeStyle({background:l.activeShape==="arrow"?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.activeShape==="arrow"?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.activeShape==="arrow"?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[16]||(o[16]=r=>{t.setShapeTo("arrow"),l.isSelectMode=!1})},[(i.openBlock(),i.createElementBlock("svg",P,[i.createElementVNode("path",{stroke:l.options.arrow.filled?l.activeShape==="arrow"?"white":"grey":"none","stroke-width":"2",d:"M5,19 19,5 14,5 19,10.5 19,5",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},null,8,X)])),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeArrow),5)):i.createCommentVNode("",!0)],6),i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.activeShape==="line",tooltip:!0}),style:i.normalizeStyle({background:l.activeShape==="line"?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.activeShape==="line"?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.activeShape==="line"?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[17]||(o[17]=r=>{t.setShapeTo("line"),l.isSelectMode=!1})},[o[56]||(o[56]=i.createElementVNode("svg",{width:"80%",viewBox:"0 0 24 24","stroke-width":"2",stroke:"currentColor",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},[i.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),i.createElementVNode("path",{d:"M3 15c2 3 4 4 7 4s7 -3 7 -7s-3 -7 -6 -7s-5 1.5 -5 4s2 5 6 5s8.408 -2.453 10 -5"})],-1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeFreehand),5)):i.createCommentVNode("",!0)],6),["arrow","circle","rect","line"].includes(l.activeShape)?(i.openBlock(),i.createElementBlock("div",U,[i.createElementVNode("div",Y,[i.createElementVNode("label",j,i.toDisplayString(t.FINAL_CONFIG.translations.thickness),1),i.withDirectives(i.createElementVNode("input",{id:"textFont",type:"number","onUpdate:modelValue":o[18]||(o[18]=r=>l.strokeSize=r),onInput:o[19]||(o[19]=(...r)=>t.setStrokeWidthOfSelectedShape&&t.setStrokeWidthOfSelectedShape(...r)),style:{padding:"0 4px",width:"40px",border:"1px solid #dadada","border-radius":"3px"}},null,544),[[i.vModelText,l.strokeSize]])])])):i.createCommentVNode("",!0),["arrow","circle","rect"].includes(l.activeShape)?(i.openBlock(),i.createElementBlock("div",q,[i.createElementVNode("div",Z,[i.createElementVNode("label",J,i.toDisplayString(t.FINAL_CONFIG.translations.dashedLines),1),(i.openBlock(),i.createElementBlock("svg",K,o[57]||(o[57]=[i.createElementVNode("line",{x1:"0",x2:"24",y1:"12",y2:"12","stroke-width":"2",stroke:"black","stroke-dasharray":"3"},null,-1)]))),i.withDirectives(i.createElementVNode("input",{id:"dashStyle",name:"dashStyle",type:"checkbox","onUpdate:modelValue":o[20]||(o[20]=r=>l.isDash=r),onChange:o[21]||(o[21]=(...r)=>t.setSelectedShapeToDash&&t.setSelectedShapeToDash(...r)),checked:l.isDash},null,40,Q),[[i.vModelCheckbox,l.isDash]])])])):i.createCommentVNode("",!0),i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isTextMode,tooltip:!0}),style:i.normalizeStyle({background:l.isTextMode?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.isTextMode?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.isTextMode?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[22]||(o[22]=r=>{t.deleteEmptyTextElement(),l.isTextMode=!l.isTextMode,l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isSelectMode=!1,l.isDrawMode=!1,l.activeShape=void 0})},[(i.openBlock(),i.createElementBlock("svg",$,o[58]||(o[58]=[i.createElementVNode("path",{d:"M18.5,4L19.66,8.35L18.7,8.61C18.25,7.74 17.79,6.87 17.26,6.43C16.73,6 16.11,6 15.5,6H13V16.5C13,17 13,17.5 13.33,17.75C13.67,18 14.33,18 15,18V19H9V18C9.67,18 10.33,18 10.67,17.75C11,17.5 11,17 11,16.5V6H8.5C7.89,6 7.27,6 6.74,6.43C6.21,6.87 5.75,7.74 5.3,8.61L4.34,8.35L5.5,4H18.5Z"},null,-1)]))),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeText),5)):i.createCommentVNode("",!0)],6),l.isTextMode?(i.openBlock(),i.createElementBlock("div",ee,[i.createElementVNode("div",te,[i.createElementVNode("label",oe,i.toDisplayString(t.FINAL_CONFIG.translations.fontSize),1),i.withDirectives(i.createElementVNode("input",{id:"textFont",type:"number","onUpdate:modelValue":o[23]||(o[23]=r=>l.textFont=r),onInput:o[24]||(o[24]=(...r)=>t.setCurrentStyleOfSelectedText&&t.setCurrentStyleOfSelectedText(...r)),style:{padding:"0 4px",width:"40px",border:"1px solid #dadada","border-radius":"3px"}},null,544),[[i.vModelText,l.textFont]])])])):i.createCommentVNode("",!0),l.isTextMode?(i.openBlock(),i.createElementBlock("div",ie,[i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.textAlign==="start",tooltip:!0}),style:i.normalizeStyle({background:l.textAlign==="start"?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.textAlign==="start"?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.textAlign==="start"?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[25]||(o[25]=r=>{l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.activeShape=void 0,l.textAlign="start",t.setSelectedTextAlignTo("start")})},[o[59]||(o[59]=i.createStaticVNode('<svg width="80%" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M4 6l16 0" data-v-1756cea7></path><path d="M4 12l10 0" data-v-1756cea7></path><path d="M4 18l14 0" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeTextLeft),5)):i.createCommentVNode("",!0)],6)])):i.createCommentVNode("",!0),l.isTextMode?(i.openBlock(),i.createElementBlock("div",le,[i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.textAlign==="middle",tooltip:!0}),style:i.normalizeStyle({background:l.textAlign==="middle"?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.textAlign==="middle"?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.textAlign==="middle"?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),disabled:l.isBulletTextMode,onClick:o[26]||(o[26]=r=>{l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.activeShape=void 0,l.textAlign="middle",t.setSelectedTextAlignTo("middle")})},[o[60]||(o[60]=i.createStaticVNode('<svg width="80%" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M4 6l16 0" data-v-1756cea7></path><path d="M8 12l8 0" data-v-1756cea7></path><path d="M6 18l12 0" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeTextCenter),5)):i.createCommentVNode("",!0)],14,se)])):i.createCommentVNode("",!0),l.isTextMode?(i.openBlock(),i.createElementBlock("div",re,[i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.textAlign==="end",tooltip:!0}),style:i.normalizeStyle({background:l.textAlign==="end"?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.textAlign==="end"?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.textAlign==="end"?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),disabled:l.isBulletTextMode,onClick:o[27]||(o[27]=r=>{l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.activeShape=void 0,l.textAlign="end",t.setSelectedTextAlignTo("end")})},[o[61]||(o[61]=i.createStaticVNode('<svg width="80%" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M4 6l16 0" data-v-1756cea7></path><path d="M10 12l10 0" data-v-1756cea7></path><path d="M6 18l14 0" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeTextRight),5)):i.createCommentVNode("",!0)],14,ne)])):i.createCommentVNode("",!0),l.isTextMode?(i.openBlock(),i.createElementBlock("div",de,[i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isBulletTextMode,tooltip:!0}),style:i.normalizeStyle({background:l.isBulletTextMode?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.isBulletTextMode?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.isBulletTextMode?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[28]||(o[28]=r=>{l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.activeShape=void 0,l.isBulletTextMode=!l.isBulletTextMode,l.textAlign="start",t.setSelectedTextAlignTo("start"),t.setCurrentStyleOfSelectedText()})},[o[62]||(o[62]=i.createStaticVNode('<svg width="100%" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M9 6l11 0" data-v-1756cea7></path><path d="M9 12l11 0" data-v-1756cea7></path><path d="M9 18l11 0" data-v-1756cea7></path><path d="M5 6l0 .01" data-v-1756cea7></path><path d="M5 12l0 .01" data-v-1756cea7></path><path d="M5 18l0 .01" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeTextBullet),5)):i.createCommentVNode("",!0)],6)])):i.createCommentVNode("",!0),l.isTextMode?(i.openBlock(),i.createElementBlock("div",ce,[i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isBold,tooltip:!0}),style:i.normalizeStyle({background:l.isBold?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.isBold?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.isBold?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[29]||(o[29]=r=>{l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.activeShape=void 0,l.isBold=!l.isBold,t.setCurrentStyleOfSelectedText()})},[o[63]||(o[63]=i.createElementVNode("svg",{width:"100%",viewBox:"0 0 24 24","stroke-width":"3",stroke:"currentColor",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},[i.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),i.createElementVNode("path",{d:"M7 5h6a3.5 3.5 0 0 1 0 7h-6z"}),i.createElementVNode("path",{d:"M13 12h1a3.5 3.5 0 0 1 0 7h-7v-7"})],-1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeTextBold),5)):i.createCommentVNode("",!0)],6)])):i.createCommentVNode("",!0),l.isTextMode?(i.openBlock(),i.createElementBlock("div",ae,[i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isItalic,tooltip:!0}),style:i.normalizeStyle({background:l.isItalic?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.isItalic?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.isItalic?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[30]||(o[30]=r=>{l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.activeShape=void 0,l.isItalic=!l.isItalic,t.setCurrentStyleOfSelectedText()})},[o[64]||(o[64]=i.createStaticVNode('<svg width="100%" height="44" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" data-v-1756cea7><path stroke="none" d="M0 0h24v24H0z" fill="none" data-v-1756cea7></path><path d="M11 5l6 0" data-v-1756cea7></path><path d="M7 19l6 0" data-v-1756cea7></path><path d="M14 5l-4 14" data-v-1756cea7></path></svg>',1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeTextItalic),5)):i.createCommentVNode("",!0)],6)])):i.createCommentVNode("",!0),l.isTextMode?(i.openBlock(),i.createElementBlock("div",he,[i.createElementVNode("button",{class:i.normalizeClass({"button-tool":!0,"button-tool--selected":l.isUnderline,tooltip:!0}),style:i.normalizeStyle({background:l.isUnderline?t.FINAL_CONFIG.style.buttons.shapes.selected.backgroundColor:t.FINAL_CONFIG.style.buttons.shapes.backgroundColor,border:l.isUnderline?t.FINAL_CONFIG.style.buttons.shapes.selected.border:t.FINAL_CONFIG.style.buttons.shapes.border,color:l.isUnderline?t.FINAL_CONFIG.style.buttons.shapes.selected.color:t.FINAL_CONFIG.style.buttons.shapes.color,borderRadius:`${t.FINAL_CONFIG.style.buttons.borderRadius}px`}),onClick:o[31]||(o[31]=r=>{l.isDeleteMode=!1,l.isMoveMode=!1,l.isResizeMode=!1,l.isDrawMode=!1,l.isSelectMode=!1,l.activeShape=void 0,l.isUnderline=!l.isUnderline,t.setCurrentStyleOfSelectedText()})},[o[65]||(o[65]=i.createElementVNode("svg",{width:"100%",viewBox:"0 0 24 24","stroke-width":"2",stroke:"currentColor",fill:"none","stroke-linecap":"round","stroke-linejoin":"round"},[i.createElementVNode("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),i.createElementVNode("path",{d:"M7 5v5a5 5 0 0 0 10 0v-5"}),i.createElementVNode("path",{d:"M5 19h14"})],-1)),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeTextUnderline),5)):i.createCommentVNode("",!0)],6)])):i.createCommentVNode("",!0),i.createElementVNode("div",ue,[i.withDirectives(i.createElementVNode("input",{type:"color",id:"colorPicker",name:"colorPicker","onUpdate:modelValue":o[32]||(o[32]=r=>l.selectedColor=r),onInput:o[33]||(o[33]=(...r)=>t.setColorOfSelectedShape&&t.setColorOfSelectedShape(...r)),style:i.normalizeStyle(`height: 30px; width: 30px; border-radius: ${t.FINAL_CONFIG.style.buttons.borderRadius}px; cursor: pointer`)},null,36),[[i.vModelText,l.selectedColor]]),t.FINAL_CONFIG.style.showTooltips?(i.openBlock(),i.createElementBlock("span",{key:0,class:"tooltiptext",style:i.normalizeStyle({backgroundColor:t.FINAL_CONFIG.style.tooltips.backgroundColor,color:t.FINAL_CONFIG.style.tooltips.color,border:t.FINAL_CONFIG.style.tooltips.border,borderRadius:`${t.FINAL_CONFIG.style.tooltips.borderRadius}px`,boxShadow:t.FINAL_CONFIG.style.tooltips.boxShadow})},i.toDisplayString(t.FINAL_CONFIG.translations.tooltipShapeColor),5)):i.createCommentVNode("",!0)]),i.createElementVNode("div",ye,[i.createElementVNode("label",Ne,i.toDisplayString(t.FINAL_CONFIG.translations.colorAlpha)+": "+i.toDisplayString(l.transparency>98?100:l.transparency)+" % ",1),i.withDirectives(i.createElementVNode("input",{id:"colorTransparency",name:"colorTransparency",type:"range","onUpdate:modelValue":o[34]||(o[34]=r=>l.transparency=r),onInput:o[35]||(o[35]=(...r)=>t.setTransparencyOfSelectedShape&&t.setTransparencyOfSelectedShape(...r)),min:0,max:100,style:{width:"100px"}},null,544),[[i.vModelText,l.transparency]])])])],36)]),i.createElementVNode("div",Ie,[i.renderSlot(e.$slots,"default",{},void 0,!0),l.isSummaryOpen?(i.openBlock(),i.createElementBlock("svg",{id:"annotatorSvg",key:l.step,ref:"mainSvg",class:i.normalizeClass({draw:!0,"draw--free":l.activeShape==="line"}),style:i.normalizeStyle([`cursor:${t.cursorClass}; font-family: Helvetica; z-index: 100000000;`,{position:"absolute",top:"0",left:"0"}]),viewBox:`0 0 ${l.svgWidth} ${l.svgHeight}`,width:l.sourceWidth,height:l.sourceHeight,onPointerdown:o[38]||(o[38]=r=>t.chooseAction(r)),onPointerup:o[39]||(o[39]=(...r)=>t.resetDraw&&t.resetDraw(...r)),onTouchend:o[40]||(o[40]=(...r)=>t.resetDraw&&t.resetDraw(...r)),onTouchstart:o[41]||(o[41]=r=>{t.setPointer(r),t.clickSvg(r)}),onPointermove:o[42]||(o[42]=r=>{t.setPointer(r),t.chooseMove(r)}),onPointerout:o[43]||(o[43]=r=>{l.preventEdit=!0,l.hoveredShapeId=void 0}),onPointerover:o[44]||(o[44]=r=>t.allowEditAndHoverShapes(r)),onClick:o[45]||(o[45]=r=>t.clickSvg(r))},[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(t.userShapes,(r,d)=>(i.openBlock(),i.createElementBlock("g",{key:`shape_${d}`,id:r.id,innerHTML:r,onClick:o[37]||(o[37]=c=>{t.clickShape(c),l.isMoveMode=!1})},null,8,Fe))),128))],46,be)):i.createCommentVNode("",!0),l.isPrinting?(i.openBlock(),i.createElementBlock("svg",{key:1,style:{position:"absolute",top:"0",left:"0"},height:l.sourceHeight,viewBox:`0 0 ${l.svgWidth} ${l.svgHeight}`,width:l.sourceWidth},[i.createElementVNode("circle",{class:"animated-circle-print",cx:l.svgWidth/2,cy:l.svgHeight/2,r:"50",stroke:"#6376DD","stroke-width":"10",fill:"none"},null,8,Se)],8,Ce)):i.createCommentVNode("",!0)],512)])}const fe=b._export_sfc(F,[["render",xe],["__scopeId","data-v-1756cea7"]]);exports.default=fe;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { ref as g, computed as f, onMounted as ge, watch as K, onBeforeUnmount as fe, createElementBlock as o, openBlock as r, unref as u, normalizeStyle as H, normalizeClass as Q, createBlock as w, createCommentVNode as i, createElementVNode as x, createSlots as me, withCtx as p, renderSlot as m, normalizeProps as L, guardReactiveProps as $, createVNode as ye, Fragment as M, renderList as T, toDisplayString as O } from "vue";
|
|
2
|
-
import { u as pe, o as be, e as Z, g as ke, c as we, l as xe, D as _e, d as Ce, i as A, f as B, X as Le, a as $e } from "./index-
|
|
3
|
-
import { u as ee } from "./useNestedProp-
|
|
4
|
-
import { _ as Oe } from "./Title-
|
|
5
|
-
import { L as Ae } from "./Legend-
|
|
6
|
-
import { u as Be, U as Pe } from "./usePrinter-
|
|
7
|
-
import { _ as Fe } from "./PackageVersion-
|
|
8
|
-
import { P as Ie } from "./PenAndPaper-
|
|
9
|
-
import Se from "./vue-ui-skeleton-
|
|
2
|
+
import { u as pe, o as be, e as Z, g as ke, c as we, l as xe, D as _e, d as Ce, i as A, f as B, X as Le, a as $e } from "./index-DYjLUPYr.js";
|
|
3
|
+
import { u as ee } from "./useNestedProp-DPpLpUNG.js";
|
|
4
|
+
import { _ as Oe } from "./Title-rbJs8Cs3.js";
|
|
5
|
+
import { L as Ae } from "./Legend-1pyX_J1z.js";
|
|
6
|
+
import { u as Be, U as Pe } from "./usePrinter-GOjH1UQd.js";
|
|
7
|
+
import { _ as Fe } from "./PackageVersion-BPpaTwrM.js";
|
|
8
|
+
import { P as Ie } from "./PenAndPaper-B21RAf9P.js";
|
|
9
|
+
import Se from "./vue-ui-skeleton-Bvgys0sE.js";
|
|
10
10
|
import { u as He } from "./useUserOptionState-BIvW1Kz7.js";
|
|
11
11
|
import { u as Me } from "./useChartAccessibility-BWojgys7.js";
|
|
12
12
|
import { _ as Te } from "./_plugin-vue_export-helper-CHgC5LLL.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),s=require("./index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),s=require("./index-CuIvJLJx.cjs"),F=require("./useNestedProp-B3OcLUMU.cjs"),J=require("./Title-CcW9kRtT.cjs"),K=require("./Legend-Dx4tku_Q.cjs"),I=require("./usePrinter-BwwdT1Uh.cjs"),Q=require("./PackageVersion-Di08b2vs.cjs"),Z=require("./PenAndPaper-C0I2pjPq.cjs"),ee=require("./vue-ui-skeleton-B3iHjtI-.cjs"),te=require("./useUserOptionState-BgepsfED.cjs"),ae=require("./useChartAccessibility-Cm7nkzTG.cjs"),le=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),re=["id"],oe={key:1,ref:"noTitle",class:"vue-data-ui-no-title-space",style:"height:36px; width: 100%;background:transparent"},se=["xmlns","viewBox"],ne=["width","height"],ue={key:1},ie=["x","y","height","width","fill","stroke"],ce=["x","y","height","width","rx","fill","stroke","stroke-width"],de=["x","y","height","width","fill","stroke","stroke-width"],he=["x","y","font-size","font-weight","fill"],ve=["x","y","height","width","rx","fill","stroke","stroke-width"],me={key:3},ge=["x","y","fill","font-size","font-weight"],fe={key:4},ye=["x1","x2","y1","y2","stroke"],pe={key:5,class:"vue-data-ui-watermark"},ke={class:"vue-ui-bullet-legend-item",dir:"auto"},be={style:{"margin-right":"2px"}},we={key:7,ref:"source",dir:"auto"},Be={__name:"vue-ui-bullet",props:{config:{type:Object,default(){return{}}},dataset:{type:Object,default(){return{}}}},setup(z,{expose:H}){const{vue_ui_bullet:T}=s.useConfig(),n=z,w=e.ref(null),q=e.ref(null),B=e.ref(0),M=e.ref(null),U=e.ref(0),h=e.computed({get:()=>n.dataset.hasOwnProperty("value"),set:a=>a}),v=e.computed(()=>n.dataset.segments?Array.isArray(n.dataset.segments)?n.dataset.segments.length?!0:(console.warn(`VueUiBullet: dataset segments is empty. Provide segments with this datastructure:
|
|
2
2
|
|
|
3
3
|
segments: [
|
|
4
4
|
{
|