vue-data-ui 3.27.1 → 3.28.0

package/dist/vue-ui-annotator-CpTZHnPw.js

@@ -0,0 +1,331 @@
+import{t as e}from"./rolldown-runtime-DK3Fl9T5.js";import{t}from"./useConfig-DM9fSqjh.js";import{C as n,Vt as r,X as i,in as a}from"./lib-DqD8nbyX.js";import{n as o,t as s}from"./useHints-BH9r_0Vd.js";import{t as c}from"./_plugin-vue_export-helper-BDNMzG2s.js";import{t as l}from"./dom-to-png-Cp6rAdnI.js";import{t as u}from"./BaseIcon-DDctLkeT.js";import{t as ee}from"./usePrinter-Cj4eIYC_.js";import{t as te}from"./vue-ui-accordion-3lBpCjGm.js";import{t as ne}from"./ColorPicker-DHQvvLT9.js";import{Fragment as re,Teleport as ie,computed as ae,createBlock as d,createCommentVNode as f,createElementBlock as p,createElementVNode as m,createTextVNode as h,createVNode as oe,guardReactiveProps as se,nextTick as ce,normalizeClass as g,normalizeProps as le,normalizeStyle as _,onBeforeUnmount as ue,onMounted as de,openBlock as v,ref as y,renderList as fe,renderSlot as b,toDisplayString as x,unref as pe,vModelCheckbox as me,vModelText as he,watch as ge,withCtx as S,withDirectives as _e,withModifiers as ve}from"vue";function ye(e){let t=t=>e.isMacLike.value?t.metaKey:t.ctrlKey,n=e=>{let t=e;if(!t)return!1;let n=(t.tagName||``).toLowerCase();return t.isContentEditable||n===`input`||n===`textarea`||n===`select`},r=t=>!!(!e.isSummaryOpen.value||n(t.target)||e.isWriting.value),i=()=>{e.isDeleteMode.value=!1,e.isMoveMode.value=!1,e.isResizeMode.value=!1,e.isSelectMode.value=!1,e.isDrawMode.value=!1,e.isTextMode.value=!1,e.activeShape.value=void 0,e.showCaret.value=!1},a=t=>{switch(i(),t){case`m`:e.isMoveMode.value=!0;break;case`r`:e.isResizeMode.value=!0;break;case`d`:e.isDeleteMode.value=!0;break;case`g`:e.isSelectMode.value=!0,e.setShapeTo(`group`),e.activeShape.value=`group`;break;case`t`:e.isTextMode.value=!0,e.isWriting.value=!1,e.showCaret.value=!1}},o=t=>{switch(t){case`c`:e.setShapeTo(`circle`);break;case`s`:e.setShapeTo(`rect`);break;case`a`:e.setShapeTo(`arrow`);break;case`l`:e.setShapeTo(`line`)}},s=(t,n)=>{let r=e.lastSelectedShape.value;if(!r)return;let i=(e,t)=>{typeof r[e]==`number`&&(r[e]+=t)};switch(r.type){case`rect`:case`circle`:case`text`:i(`x`,t),i(`y`,n);break;case`arrow`:i(`x`,t),i(`y`,n),i(`endX`,t),i(`endY`,n)}},c=()=>{let t=e.lastSelectedShape.value;t&&(e.shapes.value=e.shapes.value.filter(e=>e.id!==t.id),e.lastSelectedShape.value=void 0)},l=!1,u=null,ee=()=>{l||(l=!0,e.history?.value?.begin?.(`nudge`))},te=()=>{l&&(clearTimeout(u),u=setTimeout(()=>{l=!1,e.history?.value?.end?.()},160))},ne=()=>{clearTimeout(u),l&&e.history?.value?.end?.(),l=!1},re=n=>{if(t(n)&&!n.shiftKey&&n.key.toLowerCase()===`z`){if(r(n))return;n.preventDefault(),e.undoLastShape?.();return}if(t(n)&&n.shiftKey&&n.key.toLowerCase()===`z`||t(n)&&n.key.toLowerCase()===`y`){if(r(n))return;n.preventDefault(),typeof e.redoLastShape==`function`?e.redoLastShape():e.history?.value?.redo?.();return}if(r(n))return;let l=n.key.toLowerCase();if(l===`escape`){n.preventDefault(),i();return}if(l===`delete`||l===`backspace`){n.preventDefault(),c();return}if([`m`,`r`,`d`,`g`,`t`].includes(l)){n.preventDefault(),a(l);return}if([`c`,`a`,`l`,`s`].includes(l)){n.preventDefault(),o(l);return}if(n.key===`ArrowUp`||n.key===`ArrowDown`||n.key===`ArrowLeft`||n.key===`ArrowRight`){n.preventDefault(),ee();let e=n.shiftKey?10:1;n.key===`ArrowUp`&&s(0,-e),n.key===`ArrowDown`&&s(0,e),n.key===`ArrowLeft`&&s(-e,0),n.key===`ArrowRight`&&s(e,0),te()}},ie=e=>{e.key.startsWith(`Arrow`)&&te()};return window.addEventListener(`keydown`,re),window.addEventListener(`keyup`,ie),function(){window.removeEventListener(`keydown`,re),window.removeEventListener(`keyup`,ie),ne()}}var be={class:`teleport-tooltip__inner`},C=/*#__PURE__*/ c({__name:`TeleportedTooltip`,props:{show:{type:Boolean,default:!1},x:{type:Number,required:!0},y:{type:Number,required:!0},placement:{type:String,default:`top`},styleObject:{type:Object,default(){return{}}},delay:{type:Number,default:0},delayIn:{type:Number,default:300},delayOut:{type:Number,default:0}},setup(e){let t=e,n=ae(()=>t.delayIn??t.delay),r=ae(()=>t.delayOut??t.delay),i=y(!1),a=null,o=null;function s(){a&&=(clearTimeout(a),null),o&&=(clearTimeout(o),null)}function c(){s();let e=Math.max(0,n.value||0);e===0?i.value=!0:a=setTimeout(()=>{i.value=!0,a=null},e)}function l(){s();let e=Math.max(0,r.value||0);e===0?i.value=!1:o=setTimeout(()=>{i.value=!1,o=null},e)}ge(()=>t.show,e=>{e?c():l()},{immediate:!0}),de(()=>{t.show&&c()}),ue(()=>{s()});let u=ae(()=>({position:`fixed`,zIndex:2147483647,top:`${t.y}px`,left:`${t.x}px`,transform:t.placement===`bottom`?`translate(-50%, 8px)`:`translate(-50%, -100%)`,pointerEvents:`none`,...t.styleObject}));return(t,n)=>(v(),d(ie,{to:`body`},[i.value?(v(),p(`div`,{key:0,class:g([`teleport-tooltip`,e.placement]),style:_(u.value),role:`tooltip`,"aria-hidden":`false`},[m(`div`,be,[b(t.$slots,`default`,{},void 0,!0)])],6)):f(``,!0)]))}},[[`__scopeId`,`data-v-c292996f`]]),xe=/* @__PURE__ */ e({default:()=>Dt}),Se={class:`vue-data-ui-component vue-ui-annotator`},Ce={"data-dom-to-png-ignore":``},we=[`id`],Te=[`id`],Ee={class:`tool-selection`},De=[`disabled`],Oe=[`disabled`],ke=[`disabled`],Ae=[`disabled`],je=[`disabled`],Me=[`disabled`],Ne=[`disabled`],Pe=[`disabled`],Fe=[`disabled`],Ie={class:`tool-selection`,style:{"margin-top":`6px`}},Le={viewBox:`0 0 12 12`,style:{width:`100%`}},Re=[`fill`],ze={key:0},Be={class:`tool-input`},Ve=[`checked`],He={viewBox:`0 0 12 12`,style:{width:`100%`}},Ue=[`fill`],We={key:1},Ge={class:`tool-input`},Ke=[`checked`],qe={viewBox:`0 0 24 24`,style:{width:`100%`}},Je=[`stroke`],Ye={key:2},Xe={style:{display:`flex`,"flex-direction":`column`,"align-items":`center`,"justify-content":`center`}},Ze={class:`tool-input`},Qe={key:3},$e={style:{display:`flex`,"flex-direction":`column`,"align-items":`center`,"justify-content":`center`}},et={class:`tool-input`},tt=[`checked`],nt={key:4},rt={style:{display:`flex`,"flex-direction":`column`,"align-items":`center`,"justify-content":`center`}},it={class:`tool-input`},at={key:5},ot={key:6},st=[`disabled`],ct={key:7},lt=[`disabled`],ut={key:8},dt={key:9},ft={key:10},pt={key:11},mt={style:{display:`flex`,"flex-direction":`column`,"align-items":`center`,"justify-content":`center`},class:`tooltip`},ht={style:{display:`flex`,"flex-direction":`column`,"align-items":`start`,"justify-content":`center`}},gt={class:`tool-input`,style:{"font-variant-numeric":`tabular-nums`}},_t=[`id`],vt=[`viewBox`,`width`,`height`],yt=[`width`,`height`,`pointer-events`],bt=[`innerHTML`,`onClick`,`onDblclick`],xt=[`x1`,`x2`,`y1`,`y2`,`stroke`],St=[`height`,`viewBox`,`width`],Ct=[`cx`,`cy`],wt=`annotations`,Tt=`‎`,Et=450,Dt=/*#__PURE__*/ c({__name:`vue-ui-annotator`,props:{config:{type:Object,default(){return{}}},dataset:{type:Object,default(){return{shapes:[],lastSelectedShape:void 0}}}},emits:[`toggleOpenState`,`saveAnnotations`],setup(e,{emit:c}){let be=e,xe=c,Dt=y(!1),Ot=y(!1);de(()=>Dt.value=!0);let kt=y(i()),{isImaging:At,generateImage:jt}=ee({elementId:kt.value,fileName:wt}),w=y(void 0),Mt=y(1),T=y({start:{x:0,y:0},end:{x:0,y:0}}),E=y(void 0),Nt=y(void 0),Pt=y(!1),Ft=y(!1),It=y(!1),D=y(!1),Lt=y(!1),Rt=y(!0),O=y(!1),zt=y(!1),Bt=y(!1),k=y(!1),Vt=y(!1),A=y(!1),j=y(!1),M=y(!1);ge(M,async e=>{if(Ot.value=!1,!e){F.value=void 0,E.value=void 0,Nt.value=void 0,Wt.value=[],j.value=!1;return}await ce(),Ot.value=!0});let N=y(!1),Ht=y(!1),P=y(!1),F=y(be.dataset?.lastSelectedShape??void 0),I=y({x:0,y:0}),Ut=y(!0),Wt=y([]),L=y(be.dataset?.shapes||[]);y([]);let Gt=y(Math.round(Math.random())*1e5),Kt=y(1e3),qt=y(1e3),R=y({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}}),z=y(!1),Jt=y(1),Yt=y(void 0),Xt=y(1),Zt=y(1),B=y(`start`),Qt=y(20),$t=y(100),en=r,tn=y(null),nn=y(null),V=y(null),rn=y(null),an=y(null),on=y(!1),sn=y({row:0,col:0}),H=y(null),U=y(!1),W=y(null),G=y({x:0,y:0}),cn=y(null),ln=y([]),un=y(!1),dn=y(null),fn=y({undo:0,redo:0}),pn=y(null);y(null),y(null);let mn=y(null),K=ae(()=>{let e=t().vue_ui_annotator;if(!Object.keys(be.config||{}).length)return e;let r=a({defaultConfig:e,userConfig:be.config});return n(r)}),hn=y(K.value.style.paletteColor),q=ae(()=>K.value.style.buttons),J=ae(()=>K.value.style);o({config:()=>K.value,dataset:()=>[],component:`VueUiAnnotator`,rules:[s.noHint]});let Y=ae(()=>K.value.useCursorPointer),X=ae(()=>{let e=J.value.tooltips;return{backgroundColor:e.backgroundColor,color:e.color,border:e.border,borderRadius:`${e.borderRadius}px`,boxShadow:e.boxShadow}}),gn=ae(()=>L.value.filter(e=>e.type!==`group`||Array.isArray(e.source)&&e.source.length>0).length>1),_n=ae(()=>en[$t.value>98?98:$t.value]),vn=ae(()=>{switch(!0){case D.value:return`default`;case k.value:return`move`;case N.value:return`text`;case A.value:return`move`;default:return``}}),yn=ae(()=>L.value),bn=y(null);function xn(e){return e?!!(F.value&&F.value.id===e.id):!1}function Sn(e=``){let t=String(e).trim().split(/\s+/).map(Number).filter(Number.isFinite),n=[];for(let e=0;e+1<t.length;e+=2)n.push({x:t[e],y:t[e+1]});return n}function Cn(e=[]){return e.map(({x:e,y:t})=>`${e} ${t}`).join(` `)}function wn(e=``){let t=Sn(e);if(!t.length)return null;let n=t.map(e=>e.x),r=t.map(e=>e.y),i=Math.min(...n),a=Math.max(...n),o=Math.min(...r),s=Math.max(...r);return{minX:i,minY:o,maxX:a,maxY:s,width:Math.max(1,a-i),height:Math.max(1,s-o)}}function Tn(e){if(!e||!M.value||!A.value||!F.value||F.value.id!==e.id)return``;let t=J.value.color||`grey`,n=J.value.backgroundColor||`rgba(255,255,255,0.95)`,r=({handle:r,x:i,y:a,cursor:o=`nwse-resize`})=>`
+        <circle
+            data-dom-to-png-ignore
+            id="${e.id}"
+            data-resize-handle="${r}"
+            cx="${i}"
+            cy="${a}"
+            r="7"
+            fill="${n}"
+            stroke="${t}"
+            stroke-width="2"
+            pointer-events="all"
+            style="cursor:${o}"
+        />
+    `;if(e.type===`arrow`)return`
+            ${r({handle:`arrow-start`,x:e.x,y:e.y,cursor:`move`})}
+            ${r({handle:`arrow-end`,x:e.endX,y:e.endY,cursor:`move`})}
+        `;if(e.type===`line`){let t=wn(e.path);return t?r({handle:`line-scale`,x:t.maxX,y:t.maxY}):``}if(e.type===`circle`){let t=Math.max(1,Number(e.circleRadius)||1),n=nn.value===`circle-radius`&&V.value?.shapeId===e.id&&V.value?.handlePoint?V.value.handlePoint:null;return r({handle:`circle-radius`,x:n?.x??e.x+t,y:n?.y??e.y,cursor:`move`})}if(e.type===`rect`){let t=Number(e.x)||0,n=Number(e.y)||0,i=t+Math.max(0,Number(e.rectWidth)||0),a=n+Math.max(0,Number(e.rectHeight)||0);return`
+            ${r({handle:`rect-nw`,x:t,y:n,cursor:`nwse-resize`})}
+            ${r({handle:`rect-ne`,x:i,y:n,cursor:`nesw-resize`})}
+            ${r({handle:`rect-se`,x:i,y:a,cursor:`nwse-resize`})}
+            ${r({handle:`rect-sw`,x:t,y:a,cursor:`nesw-resize`})}
+        `}return e.type===`group`?r({handle:`group-scale`,x:e.x+e.rectWidth,y:e.y+e.rectHeight}):``}function En(e){if(!e||e.type===`text`&&P.value&&rn.value===e.id)return``;let t=xn(e)?`initial`:`none`;switch(e.type){case`rect`:return`
+                <rect
+                    data-dom-to-png-ignore
+                    style="stroke-dasharray: 10; display:${t}"
+                    x="${e.x-20}"
+                    y="${e.y-20}"
+                    height="${e.rectHeight+40}"
+                    width="${e.rectWidth+40}"
+                    fill="transparent"
+                    stroke="grey"
+                    pointer-events="none"
+                />
+            `;case`circle`:return`
+                <rect
+                    data-dom-to-png-ignore
+                    style="stroke-dasharray: 10; display:${t}"
+                    x="${e.x-e.circleRadius-20}"
+                    y="${e.y-e.circleRadius-20}"
+                    height="${e.circleRadius*2+40}"
+                    width="${e.circleRadius*2+40}"
+                    fill="transparent"
+                    stroke="grey"
+                    pointer-events="none"
+                />
+            `;case`arrow`:{let n=Math.min(e.x,e.endX),r=Math.min(e.y,e.endY),i=Math.max(1,Math.abs(e.endX-e.x)),a=Math.max(1,Math.abs(e.endY-e.y));return`
+                <rect
+                    style="stroke-dasharray: 10; display:${t}"
+                    x="${n-20}"
+                    y="${r-20}"
+                    height="${a+40}"
+                    width="${i+40}"
+                    fill="transparent"
+                    stroke="grey"
+                    pointer-events="none"
+                />
+            `}case`line`:{let n=wn(e.path);return n?`
+                <rect
+                    style="stroke-dasharray: 10; display:${t}"
+                    x="${n.minX-20}"
+                    y="${n.minY-20}"
+                    height="${n.height+40}"
+                    width="${n.width+40}"
+                    fill="transparent"
+                    stroke="grey"
+                    pointer-events="none"
+                />
+            `:``}case`text`:{let n=bn.value?Array.from(bn.value.getElementsByTagName(`text`)).find(t=>t.getAttribute(`data-shape-id`)===e.id):null;if(!n)return``;let{x:r,y:i,width:a,height:o}=n.getBBox();return`
+                <rect
+                    style="stroke-dasharray: 10; display:${t}"
+                    x="${r-20}"
+                    y="${i-20}"
+                    height="${o+40}"
+                    width="${a+40}"
+                    fill="transparent"
+                    stroke="grey"
+                    pointer-events="none"
+                />
+            `}default:return``}}function Dn(e,t=!1){switch(!0){case e.type===`circle`:return`
+                <g id="${e.id}" style="display:${D.value?`initial`:`none`};">
+                    <circle id="${e.id}" cx="${e.x}" cy="${e.y}" r="12" fill="red"/>
+                    <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}"/>
+                    <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}"/>
+                </g>
+            `;case e.type===`text`:let n,r=[-8,-12,-4,-12,-4];switch(!0){case e.textAlign===`start`:n=t?[-20,-24,-16,-16,-24]:[-16,-20,-12,-12,-20];break;case e.textAlign===`middle`:n=[0,-4,4,4,-4],r=[-32,-36,-28,-36,-28];break;case e.textAlign===`end`:n=[16,20,12,12,20];break;default:n=[0,0,0]}return`
+                <g id="${e.id}" style="display:${D.value?`initial`:`none`};">
+                    <circle id="${e.id}" cx="${e.x+n[0]}" cy="${e.y+r[0]}" r="12" fill="red"/>
+                    <line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x+n[1]}" y1="${e.y+r[1]}" x2="${e.x+n[2]}" y2="${e.y+r[2]}"/>
+                    <line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x+n[3]}" y1="${e.y+r[3]}" x2="${e.x+n[4]}" y2="${e.y+r[4]}"/>
+                </g>
+            `;default:return`
+                <g id="${e.id}" style="display:${D.value?`initial`:`none`};">
+                    <circle id="${e.id}" cx="${e.x-4}" cy="${e.y-4}" r="12" fill="red"/>
+                    <line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x-8}" y1="${e.y-8}" x2="${e.x}" y2="${e.y}"/>
+                    <line stroke="white" stroke-width="2" id="${e.id}" x1="${e.x}" y1="${e.y-8}" x2="${e.x-8}" y2="${e.y}"/>
+                </g>
+            `}}function On(e=``){return String(e).replace(/&nbsp;/g,`\xA0`)}function kn(e){return String(e?.textContent??``).split(Tt).map(On)}function An(e,t){if(!e)return;let n=t.length?t:[``];e.textContent=n.join(Tt),e.lines=Math.max(0,n.length-1)}function jn(e=``){return String(e).replace(/&/g,`&amp;`).replace(/</g,`&lt;`).replace(/>/g,`&gt;`)}function Mn(e=``){return jn(On(e))||`&#8203;`}function Nn(e,t,n=!1){let r=kn(e),i=Math.max(1,r.length),a=r.reduce((e,t)=>Math.max(e,t.length),0),o=Math.max(24,a*e.fontSize*.7+16),s=e.textAlign===`middle`?e.x-o/2:e.textAlign===`end`?e.x-o:e.x,c=Math.max(e.fontSize*1.2,e.fontSize*i);return`
+        <g id="${e.id}">
+            <rect
+                id="${e.id}"
+                data-shape-hit-area="true"
+                x="${s-8}"
+                y="${e.y-e.fontSize}"
+                height="${c+8}"
+                width="${o+16}"
+                fill="transparent"
+                pointer-events="all"
+            />
+            <text
+                data-shape-id="${e.id}"
+                style="user-select:none;"
+                id="${e.id}"
+                x="${e.x}"
+                y="${e.y}"
+                text-anchor="${e.textAlign}"
+                font-size="${e.fontSize}"
+                fill="${e.color}"
+                font-weight="${e.isBold?`bold`:`normal`}"
+                font-style="${e.isItalic?`italic`:`normal`}"
+                text-decoration="${e.isUnderline?`underline`:`none`}"
+                pointer-events="bounding-box"
+            >
+                ${t.join(``)}
+            </text>
+            ${Dn(e,n)}
+        </g>
+    `}let Pn=ae(()=>yn.value.map(e=>{switch(!0){case e&&e.type===`arrow`:{let t=e.strokeWidth>3?5:10,n=e.strokeWidth>3?2.5:5,r=`marker_${e.id}`,i=Math.max(24,Number(e.strokeWidth||1)+24);return{html:`
+          <defs>
+          <marker
+              id="${r}"
+              markerWidth="${t}"
+              markerHeight="${t}"
+              refX="0"
+              refY="${n}"
+              orient="auto"
+          >
+              <polygon
+              points="0 0,${t} ${n}, 0 ${t}"
+              fill="${e.color}"
+              />
+          </marker>
+          </defs>
+          <g id="${e.id}">
+              ${En(e)}
+              <path
+                  id="${e.id}"
+                  data-shape-hit-area="true"
+                  d="M${e.x},${e.y} ${e.endX},${e.endY}"
+                  fill="none"
+                  stroke="transparent"
+                  stroke-width="${i}"
+                  pointer-events="stroke"
+              />
+              <path
+                  id="${e.id}"
+                  data-shape-visible="true"
+                  style="stroke-linecap: round !important; ${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:``}"
+                  stroke="${e.color}"
+                  d="M${e.x},${e.y} ${e.endX},${e.endY}"
+                  stroke-width="${e.strokeWidth}"
+                  fill="none"
+                  pointer-events="stroke"
+                  marker-end="url(#${r})"
+              />
+              ${Tn(e)}
+              ${Dn(e)}
+          </g>
+          `,id:e.id}}case e&&e.type===`circle`:return{html:`
+          <g id="${e.id}">
+              ${En(e)}
+              <circle 
+              id="${e.id}" 
+              cx="${e.x}" 
+              cy="${e.y}" 
+              r="${e.circleRadius?e.circleRadius:Number.MIN_VALUE}"
+              fill="${e.isFilled?e.color+e.alpha:`rgba(255,255,255,0.001)`}" 
+              stroke="${e.color+e.alpha}" 
+              stroke-width="${e.strokeWidth}"
+              style="${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:``}"
+              >
+              </circle>
+              ${Tn(e)}
+          </g>
+          
+          ${Dn(e)}`,id:e.id};case e&&e.type===`group`:return{html:`<g id="${e.id}">
+            <rect
+                data-dom-to-png-ignore
+                id="${A.value?``:e.id}"
+                x="${e.x}"
+                y="${e.y}"
+                fill="transparent"
+                height="${e.rectHeight}"
+                width="${e.rectWidth}"
+                stroke="grey"
+                stroke-width="1"
+                style="rx:1 !important; ry:1 !important; ${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:``}; display:${j.value||D.value||xn(e)?`initial`:`none`};"
+                        />
+            <g id="${e.id}">
+            ${e.content?e.content:``}
+            </g>
+            ${Tn(e)}
+            ${Dn(e)}
+            </g> `,id:e.id};case e&&e.type===`rect`:return{html:`<g id="${e.id}">
+            ${En(e)}
+            <rect
+                id="${A.value?``:e.id}"
+                x="${e.x}"
+                y="${e.y}"
+                fill="${e.isFilled?e.color+e.alpha:`rgba(255,255,255,0.001)`}"
+                height="${e.rectHeight}"
+                width="${e.rectWidth}"
+                stroke="${e.color+e.alpha}"
+                stroke-width="${e.strokeWidth}"
+                style="rx:1 !important; ry:1 !important; ${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:``}"
+            />
+            ${Tn(e)}
+            ${Dn(e)}
+            </g> `,id:e.id};case e&&e.type===`line`:{let t=Math.max(24,Number(e.strokeWidth||1)+24);return{html:`
+                <g id="${e.id}">
+                    ${En(e)}
+                    <path
+                        id="${e.id}"
+                        data-shape-hit-area="true"
+                        d="M${e.path?e.path:``}"
+                        fill="none"
+                        stroke="transparent"
+                        stroke-width="${t}"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        pointer-events="stroke"
+                    />
+                    <path
+                        id="${e.id}"
+                        data-shape-visible="true"
+                        d="M${e.path?e.path:``}"
+                        style="stroke:${e.color+e.alpha} !important; fill:none; stroke-width:${e.strokeWidth} !important; stroke-linecap: round !important; stroke-linejoin: round !important; ${e.isDash?`stroke-dasharray: ${e.strokeWidth*3}`:``}"
+                        pointer-events="stroke"
+                    />
+                    ${Tn(e)}
+                    ${Dn(e)}
+                </g>
+                `,id:e.id}}case e&&e.type===`text`:{let t=kn(e),n=[];for(let r=0;r<t.length;r+=1)n.push(`
+        ${e.isBulletTextMode?`<tspan
+                        data-bullet-line="${r}"
+                        x="${e.x-e.fontSize}"
+                        y="${e.y+e.fontSize*r}"
+                        id="${e.id}"
+                        font-size="${e.fontSize/2}"
+                    >⬤</tspan>`:``}
+                <tspan
+                    data-text-line="${r}"
+                    id="${e.id}"
+                    x="${e.x}"
+                    y="${e.y+e.fontSize*r}"
+                >${Mn(t[r])}</tspan>`);return{html:`
+            ${En(e)}
+            ${Nn(e,n,e.isBulletTextMode)}
+            `,id:e.id}}}}));function Z(e){if(e==null)return e;try{return typeof structuredClone==`function`?structuredClone(e):JSON.parse(JSON.stringify(e))}catch{return Array.isArray(e)?e.map(e=>Z(e)):typeof e==`object`?Object.fromEntries(Object.entries(e).map(([e,t])=>[e,Z(t)])):e}}function Fn(e=!1){if(!w.value||!Lt.value)return;T.value.end={x:I.value.x,y:I.value.y};let t;L.value.length>0&&E.value&&(t=[...L.value].find(e=>e.id===E.value.id));let n,r,i;t&&(n=t.x-T.value.end.x,r=t.y-T.value.end.y,i=Math.sqrt(n*n+r*r));let a,o;switch(e?(a=Math.max(T.value.end.x,t.x),o=Math.min(T.value.end.x,t.x),Math.max(T.value.end.y,t.y),Math.min(T.value.end.y,t.y)):(a=Math.max(T.value.end.x,T.value.start.x),o=Math.min(T.value.end.x,T.value.start.x),Math.max(T.value.end.y,T.value.start.y),Math.min(T.value.end.y,T.value.start.y)),!0){case w.value===`arrow`:L.value.at(-1).endX=T.value.end.x,L.value.at(-1).endY=T.value.end.y;break;case w.value===`circle`:L.value.at(-1).circleRadius=Rt.value?Z(a-o)+20:i+20;break;case w.value===`line`:L.value.at(-1).path+=` ${I.value.x} ${I.value.y} `;break;case[`rect`,`group`].includes(w.value):L.value.at(-1).rectWidth=Z(T.value.end.x-L.value.at(-1).x)>0?Z(T.value.end.x-L.value.at(-1).x):20,L.value.at(-1).rectHeight=Z(T.value.end.y-L.value.at(-1).y)>0?Z(T.value.end.y-L.value.at(-1).y):20}}function In(){if(!Lt.value){pn.value=null;return}Fn(),pn.value=requestAnimationFrame(In)}function Ln(e){let t=L.value.findIndex(t=>t.id===e);if(t>-1&&t!==L.value.length-1){let[e]=L.value.splice(t,1);L.value.push(e)}}function Rn(e){let t=e;for(;t&&t!==bn.value;){let e=t.id;if(e&&L.value.some(t=>t.id===e))return e;t=t.parentElement}return null}function zn(e){if(!M.value)return null;let t=Rn(e?.target);if(t)return t;let n=bn.value?.querySelector(`.annotator__glass`);if(!n)return null;let r=e?.touches?.[0]||e?.changedTouches?.[0],i=r?r.clientX:e?.clientX,a=r?r.clientY:e?.clientY;if(!Number.isFinite(i)||!Number.isFinite(a))return null;let o=n.style.pointerEvents;n.style.pointerEvents=`none`;let s=document.elementFromPoint(i,a);return n.style.pointerEvents=o||`all`,Rn(s)}function Bn(e={}){let{maxEntries:t=200,maxBytes:n=2e6}=e,r={open:!1,before:null,undo:[],redo:[]},i={undo:0,redo:0},a=e=>typeof e==`string`?e.length*2:0,o=()=>JSON.stringify({shapes:Z(L.value),lastSelectedShape:Z(F.value)}),s=e=>{let t=JSON.parse(e);L.value=t.shapes,F.value=t.lastSelectedShape?.id?L.value.find(e=>e.id===t.lastSelectedShape.id):void 0,E.value=F.value?{id:F.value.id}:void 0,rn.value=null,an.value=null,on.value=!1,P.value=!1,z.value=!1,H.value=null},c=()=>{fn.value.undo=r.undo.length,fn.value.redo=r.redo.length},l=(e,o)=>{let s=r[e];for(s.push(o),i[e]+=a(o);s.length>t||i[e]>n;){let t=s.shift();i[e]-=a(t)}};return{begin(){r.open||(r.open=!0,r.before=o())},end(){r.open&&(r.open=!1,o()!==r.before&&(l(`undo`,r.before),r.redo.length=0,i.redo=0),r.before=null,c())},undo(){let e=r.undo.pop();if(!e)return;i.undo-=a(e);let t=o();l(`redo`,t),s(e),c()},redo(){let e=r.redo.pop();if(!e)return;i.redo-=a(e);let t=o();l(`undo`,t),s(e),c()},size(){return{undo:r.undo.length,redo:r.redo.length,approxBytes:{undo:i.undo,redo:i.redo}}}}}function Vn(){if(!cn.value)return;let e=cn.value.getBoundingClientRect();G.value={x:e.left+e.width/2,y:e.top}}function Q(e,t,n=`top`){W.value=e,cn.value=t.currentTarget||t.target,Vn(),U.value=!0,window.addEventListener(`scroll`,Vn,!0),window.addEventListener(`resize`,Vn,{passive:!0})}function $(){U.value=!1,W.value=null,cn.value=null,window.removeEventListener(`scroll`,Vn,!0),window.removeEventListener(`resize`,Vn)}function Hn(e){let t=Rn(e?.target)||E.value?.id||Nt.value,n=L.value.find(e=>e.id===t);if(!n){tn.value=null;return}F.value=n,E.value={id:n.id};let r=I.value.x,i=I.value.y;switch(n.type){case`rect`:case`circle`:case`text`:tn.value={dx:r-n.x,dy:i-n.y};break;case`arrow`:tn.value={dx:r-n.x,dy:i-n.y,endDx:r-n.endX,endDy:i-n.endY};break;case`line`:tn.value={startX:r,startY:i,path:n.path};break;case`group`:tn.value={dx:r-(n.x||0),dy:i-(n.y||0)};break;default:tn.value={dx:0,dy:0}}}function Un(e,t){if(nn.value=t||null,V.value=null,e){if(e.type===`line`&&t===`line-scale`){let t=Sn(e.path),n=wn(e.path);if(!t.length||!n)return;V.value={shapeId:e.id,points:t,bounds:n};return}if(e.type===`rect`&&t?.startsWith(`rect-`)){let t=Number(e.x)||0,n=Number(e.y)||0,r=t+Math.max(0,Number(e.rectWidth)||0),i=n+Math.max(0,Number(e.rectHeight)||0);V.value={shapeId:e.id,bounds:{left:t,top:n,right:r,bottom:i}};return}if(e.type===`circle`&&t===`circle-radius`){let t=Math.max(1,Number(e.circleRadius)||1);V.value={shapeId:e.id,anchor:{x:(Number(e.x)||0)-t,y:Number(e.y)||0},handlePoint:{x:(Number(e.x)||0)+t,y:Number(e.y)||0}}}}}function Wn(e){let t=L.value.find(e=>e.id===F.value.id);switch(!0){case e===`front`:L.value=L.value.filter(e=>e.id!==t.id),L.value.push(t);break;case e===`back`:L.value=L.value.filter(e=>e.id!==t.id),L.value=[t,...L.value];break;default:return}}function Gn(){if(!F.value?.id)return;let e={...F.value,id:`${F.value.id}_copy_${i()}`,x:F.value.x-100<0?1:F.value.x-100,y:F.value.y-100<0?1:F.value.y-100};L.value.push(e)}function Kn(e){e&&(e.color&&(hn.value=e.color),Number.isFinite(Number(e.strokeWidth))&&(Mt.value=Number(e.strokeWidth)),`isDash`in e&&(It.value=!!e.isDash),e.type===`circle`?(R.value.circle.filled=!!e.isFilled,w.value=`circle`):e.type===`rect`?(R.value.rect.filled=!!e.isFilled,w.value=`rect`):e.type===`arrow`?w.value=`arrow`:e.type===`line`?w.value=`line`:e.type===`text`&&(B.value=e.textAlign||`start`,Qt.value=Number(e.fontSize)||Qt.value,Pt.value=!!e.isBold,zt.value=!!e.isItalic,Ht.value=!!e.isUnderline,Ft.value=!!e.isBulletTextMode))}function qn(e){if(!M.value){Nt.value=void 0;return}e.preventDefault(),Ut.value=!1,Nt.value=Rn(e.target)||void 0}function Jn(){let e=rn.value;if(!e||!bn.value||!P.value){H.value=null;return}ce(()=>{if(!bn.value||!P.value||rn.value!==e){H.value=null;return}let t=L.value.find(t=>t.id===e);if(!t||t.type!==`text`){H.value=null;return}let n=Array.from(bn.value.getElementsByTagName(`text`)).find(t=>t.getAttribute(`data-shape-id`)===e);if(!n){H.value=null;return}let r=kn(t),i=Math.max(0,Math.min(sn.value.row,r.length-1)),a=r[i]||``,o=Math.max(0,Math.min(sn.value.col,a.length)),s=a.slice(0,o),c=document.createElementNS(`http://www.w3.org/2000/svg`,`text`);c.setAttribute(`font-size`,String(t.fontSize)),c.setAttribute(`font-family`,n.getAttribute(`font-family`)||`Helvetica`),c.setAttribute(`font-weight`,t.isBold?`bold`:`normal`),c.setAttribute(`font-style`,t.isItalic?`italic`:`normal`),c.setAttribute(`visibility`,`hidden`),c.setAttribute(`pointer-events`,`none`),bn.value.appendChild(c);let l=e=>(c.textContent=e||`​`,typeof c.getComputedTextLength==`function`?c.getComputedTextLength():c.getBBox().width),u=l(s),ee=l(a);c.remove();let te=t.x;t.textAlign===`middle`?te-=ee/2:t.textAlign===`end`&&(te-=ee);let ne=t.y+t.fontSize*i;H.value={x:te+u,y1:ne-t.fontSize*.85,y2:ne+t.fontSize*.15,color:t.color||J.value.color}})}function Yn(e,{isNew:t=!1}={}){if(!e||e.type!==`text`)return;if(P.value&&rn.value===e.id){let t=kn(e),n=Math.max(0,t.length-1);sn.value={row:n,col:(t[n]||``).length},z.value=!0,Jn();return}P.value&&Xn(),t||ln.value?.begin?.(),F.value=e,E.value={id:e.id},rn.value=e.id,an.value=t?null:Z(e),on.value=t;let n=kn(e),r=Math.max(0,n.length-1);sn.value={row:r,col:(n[r]||``).length},Kn(e),N.value=!0,P.value=!0,z.value=!0,O.value=!1,w.value=void 0,H.value=null,Jn()}function Xn({cancel:e=!1}={}){let t=rn.value;if(!t){P.value=!1,z.value=!1,H.value=null;return}let n=L.value.find(e=>e.id===t);if(e){if(on.value)L.value=L.value.filter(e=>e.id!==t),n=null;else if(an.value){let e=L.value.findIndex(e=>e.id===t);e!==-1&&(L.value[e]=Z(an.value),n=L.value[e])}}else n&&kn(n).every(e=>e.length===0)&&(L.value=L.value.filter(e=>e.id!==t),n=null);rn.value=null,an.value=null,on.value=!1,sn.value={row:0,col:0},P.value=!1,z.value=!1,H.value=null,ln.value?.end?.(),n?(F.value=n,E.value={id:n.id}):F.value?.id===t&&(F.value=void 0,E.value=void 0)}function Zn(){if(P.value){Xn();return}let e=F.value;e&&e.type===`text`&&kn(e).every(e=>e.length===0)&&(L.value=L.value.filter(t=>t.id!==e.id),F.value=L.value.at(-1))}function Qn(){ln.value?.begin?.();let e={id:`text_${i()}`,type:`text`,lines:0,x:I.value.x,y:I.value.y,textContent:``,fontSize:Z(Qt.value),textAlign:Z(B.value),isBold:Z(Pt.value),isItalic:Z(zt.value),isUnderline:Z(Ht.value),color:Z(hn.value),isBulletTextMode:Z(Ft.value)};L.value.push(e),F.value=e,E.value={id:e.id},Yn(e,{isNew:!0})}let $n=0;function er(e){if(M.value&&!D.value&&(e.preventDefault(),e.stopPropagation(),Fr(e),!Rn(e.target)&&!(Date.now()<$n))){if(P.value&&Xn(),N.value&&!A.value){Qn();return}!O.value&&!j.value&&(F.value=void 0,E.value=void 0,Nt.value=void 0,k.value||(w.value=void 0)),z.value=!1,H.value=null}}function tr(e){F.value&&F.value.type===`text`&&(F.value.textAlign=e,B.value=e,Jn())}function nr(){P.value&&Xn(),ln.value?.undo?.()}function rr(){P.value&&Xn(),ln.value?.redo?.()}function ir(e){if(!P.value||!rn.value)return;let t=L.value.find(e=>e.id===rn.value);if(!t||t.type!==`text`){Xn();return}let n=kn(t);n.length||(n=[``]);let r=Math.max(0,Math.min(sn.value.row,n.length-1)),i=Math.max(0,Math.min(sn.value.col,n[r].length)),a=!1,o=!1;if(e.key===`Escape`){e.preventDefault(),Xn({cancel:!0});return}if(e.key===`Enter`){e.preventDefault();let t=n[r];n.splice(r,1,t.slice(0,i),t.slice(i)),r+=1,i=0,a=!0}else if(e.key===`Backspace`){if(e.preventDefault(),i>0)n[r]=n[r].slice(0,i-1)+n[r].slice(i),--i,a=!0;else if(r>0){let e=n[r-1].length;n[r-1]+=n[r],n.splice(r,1),--r,i=e,a=!0}}else if(e.key===`Delete`)e.preventDefault(),i<n[r].length?(n[r]=n[r].slice(0,i)+n[r].slice(i+1),a=!0):r<n.length-1&&(n[r]+=n[r+1],n.splice(r+1,1),a=!0);else if(e.key===`ArrowLeft`)e.preventDefault(),i>0?--i:r>0&&(--r,i=n[r].length),o=!0;else if(e.key===`ArrowRight`)e.preventDefault(),i<n[r].length?i+=1:r<n.length-1&&(r+=1,i=0),o=!0;else if(e.key===`ArrowUp`)e.preventDefault(),r>0&&(--r,i=Math.min(i,n[r].length)),o=!0;else if(e.key===`ArrowDown`)e.preventDefault(),r<n.length-1&&(r+=1,i=Math.min(i,n[r].length)),o=!0;else if(e.key===`Home`)e.preventDefault(),i=0,o=!0;else if(e.key===`End`)e.preventDefault(),i=n[r].length,o=!0;else if(e.key===`Tab`)e.preventDefault(),n[r]=n[r].slice(0,i)+`    `+n[r].slice(i),i+=4,a=!0;else if(e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey)e.preventDefault(),n[r]=n[r].slice(0,i)+e.key+n[r].slice(i),i+=e.key.length,a=!0;else return;a&&(t.isBold=Z(Pt.value),t.isItalic=Z(zt.value),t.isUnderline=Z(Ht.value),An(t,n)),(a||o)&&(sn.value={row:r,col:i},z.value=!0,Jn())}function ar(e){if(!e)return null;switch(e.type){case`arrow`:return{left:Math.min(e.x,e.endX),top:Math.min(e.y,e.endY),right:Math.max(e.x,e.endX),bottom:Math.max(e.y,e.endY)};case`circle`:{let t=Math.max(0,Number(e.circleRadius)||0);return{left:e.x-t,top:e.y-t,right:e.x+t,bottom:e.y+t}}case`rect`:case`group`:return{left:e.x,top:e.y,right:e.x+e.rectWidth,bottom:e.y+e.rectHeight};case`line`:{let t=wn(e.path);return t?{left:t.minX,top:t.minY,right:t.maxX,bottom:t.maxY}:null}case`text`:return{left:e.x,top:e.y,right:e.x,bottom:e.y};default:return null}}function or(e,t){let n=ar(e);if(!n)return!1;let r=Math.min(t.x,t.x+t.rectWidth),i=Math.min(t.y,t.y+t.rectHeight),a=Math.max(t.x,t.x+t.rectWidth),o=Math.max(t.y,t.y+t.rectHeight);return r<=n.left&&i<=n.top&&a>=n.right&&o>=n.bottom}function sr(e,t){let n=Z(e),r=Number(t.x)||0,i=Number(t.y)||0;switch(n.type){case`circle`:case`rect`:case`text`:n.x=r+(Number(n.diffX)||0),n.y=i+(Number(n.diffY)||0);break;case`arrow`:n.x=r+(Number(n.diffX)||0),n.y=i+(Number(n.diffY)||0),n.endX=r+(Number(n.diffEndX)||0),n.endY=i+(Number(n.diffEndY)||0);break;case`line`:Array.isArray(n.diffPoints)&&n.diffPoints.length&&(n.path=Cn(n.diffPoints.map(e=>({x:r+e.x,y:i+e.y}))))}return n.id=n.oldId||n.id,delete n.diffX,delete n.diffY,delete n.diffEndX,delete n.diffEndY,delete n.diffPoints,n}function cr(e){return e.type===`group`?(e.source||[]).flatMap(t=>t.type===`group`?cr(sr(t,e)):[sr(t,e)]):[Z(e)]}function lr(e,t){let n={...Z(e),id:t.id,oldId:e.oldId||e.id,diffX:(Number(e.x)||0)-t.x,diffY:(Number(e.y)||0)-t.y,diffEndX:Number.isFinite(Number(e.endX))?Number(e.endX)-t.x:0,diffEndY:Number.isFinite(Number(e.endY))?Number(e.endY)-t.y:0};return e.type===`line`&&(n.diffPoints=Sn(e.path).map(e=>({x:e.x-t.x,y:e.y-t.y}))),n}function ur(){if(Wt.value=[],w.value!==`group`)return j.value=!1,L.value=L.value.filter(e=>e.type!==`group`),null;let e=L.value.at(-1);if(!e||e.type!==`group`)return null;let t=L.value.filter(t=>t.id!==e.id&&or(t,e));if(t.length<2)return L.value=L.value.filter(t=>t.id!==e.id),null;let n=t.flatMap(e=>cr(e));Wt.value=n.map(t=>lr(t,e)),e.source=Wt.value,e.content=``;let r=new Set(t.map(e=>e.id));return L.value=L.value.filter(t=>t.id===e.id||!r.has(t.id)),dr(e),e}function dr(e){e.content=``;let t=e.x||0,n=e.y||0;(e.source||[]).forEach(r=>{switch(r.type){case`circle`:{let i=t+r.diffX,a=n+r.diffY;e.content+=`
+          <circle
+            id="${r.id}"
+            cx="${i}"
+            cy="${a}"
+            r="${r.circleRadius?r.circleRadius:Number.MIN_VALUE}"
+            fill="${r.isFilled?r.color+r.alpha:`rgba(255,255,255,0.001)`}"
+            stroke="${r.color+r.alpha}"
+            stroke-width="${r.strokeWidth}"
+            style="${r.isDash?`stroke-dasharray: ${r.strokeWidth*3}`:``}"
+          />
+        `;break}case`rect`:{let i=t+r.diffX,a=n+r.diffY;e.content+=`
+          <rect
+            id="${A.value?``:r.id}"
+            x="${i}"
+            y="${a}"
+            fill="${r.isFilled?r.color+r.alpha:`rgba(255,255,255,0.001)`}"
+            height="${r.rectHeight}"
+            width="${r.rectWidth}"
+            stroke="${r.color+r.alpha}"
+            stroke-width="${r.strokeWidth}"
+            style="rx:1 !important; ry:1 !important; ${r.isDash?`stroke-dasharray: ${r.strokeWidth*3}`:``}"
+          />
+        `;break}case`arrow`:{let a=t+r.diffX,o=n+r.diffY,s=t+r.diffEndX,c=n+r.diffEndY,l=r.strokeWidth>3?5:10,u=r.strokeWidth>3?2.5:5,ee=`m_${r.id}_${i()}`;e.content+=`
+          <g id="${r.id}">
+            <defs>
+              <marker 
+                id="${ee}" 
+                markerWidth="${l}" 
+                markerHeight="${l}" 
+                refX="0" 
+                refY="${u}" 
+                orient="auto">
+                <polygon points="0 0,${l} ${u}, 0 ${l}" fill="${r.color}" />
+              </marker>
+            </defs>
+            <path
+              style="stroke-linecap: round !important; ${r.isDash?`stroke-dasharray: ${r.strokeWidth*3}`:``}"
+              stroke="${r.color}"
+              id="${r.id}"
+              d="M${a},${o} ${s},${c}"
+              stroke-width="${r.strokeWidth}"
+              marker-end="url(#${ee})"
+            />
+          </g>
+        `;break}case`line`:{let i=Cn(Array.isArray(r.diffPoints)&&r.diffPoints.length?r.diffPoints.map(e=>({x:t+e.x,y:n+e.y})):Sn(r.path));e.content+=`
+          <path
+            id="${r.id}"
+            d="M${i}"
+            style="stroke:${r.color+r.alpha} !important; fill:none; stroke-width:${r.strokeWidth} !important; stroke-linecap:round !important; stroke-linejoin:round !important; ${r.isDash?`stroke-dasharray: ${r.strokeWidth*3}`:``}"
+          />
+        `;break}case`text`:{let i=(r.textContent||``).split(`‎`).map((e,i)=>`
+          ${r.isBulletTextMode?`<tspan x="${t+r.diffX-r.fontSize}" y="${n+r.diffY+r.fontSize*i}" id="${r.id}" font-size="${r.fontSize/2}">⬤</tspan>`:``}
+          <tspan id="${r.id}" x="${t+r.diffX}" y="${n+r.diffY+r.fontSize*i}">
+            ${e}
+          </tspan>
+        `).join(``);e.content+=`
+          <g id="${r.id}">
+            <text
+              style="user-select:none; height:100px;"
+              id="${r.id}"
+              x="${t+r.diffX}"
+              y="${n+r.diffY}"
+              text-anchor="${r.textAlign}"
+              font-size="${r.fontSize}"
+              fill="${r.color}"
+              font-weight="${r.isBold?`bold`:`normal`}"
+              font-style="${r.isItalic?`italic`:`normal`}"
+              text-decoration="${r.isUnderline?`underline`:`none`}">
+              ${i}
+            </text>
+          </g>
+        `;break}}})}function fr(e){e.relatedTarget&&bn.value&&bn.value.contains(e.relatedTarget)||(Ut.value=!0,Nt.value=void 0)}function pr(){if(Lt.value=!0,!w.value&&!j.value||!Lt.value)return;Rt.value=!0,T.value.start={x:I.value.x,y:I.value.y};let e=`${j.value?`group`:w.value}_${i()}`;switch(!0){case w.value===`arrow`:L.value.push({id:e,x:I.value.x,y:I.value.y,endX:I.value.x,endY:I.value.y,type:w.value,color:Z(hn.value),strokeWidth:Z(Math.abs(Mt.value)),isDash:Z(It.value)}),F.value=L.value.at(-1);break;case w.value===`circle`:L.value.push({alpha:R.value.circle.filled?_n.value:``,id:e,color:Z(hn.value),isFilled:Z(R.value.circle.filled),circleRadius:Z(R.value.circle.radius),circleStrokeWidth:Z(R.value.circle.strokeWidth),type:w.value,x:I.value.x,y:I.value.y,strokeWidth:Z(Math.abs(Mt.value)),isDash:Z(It.value)}),F.value=L.value.at(-1);break;case w.value===`line`:L.value.push({alpha:Z(_n.value),id:e,x:I.value.x,y:I.value.y,type:w.value,color:Z(hn.value),strokeWidth:Z(Math.abs(Mt.value)),isDash:Z(It.value),path:`${I.value.x} ${I.value.y}`}),F.value=L.value.at(-1);break;case w.value===`rect`:L.value.push({alpha:R.value.rect.filled?_n.value:``,id:e,color:Z(hn.value),isFilled:Z(R.value.rect.filled),rectStrokeWidth:Z(R.value.rect.strokeWidth),rectHeight:Z(R.value.rect.height),rectWidth:Z(R.value.rect.width),type:w.value,x:I.value.x,y:I.value.y,strokeWidth:Z(Math.abs(Mt.value)),isDash:Z(It.value)}),F.value=L.value.at(-1);break;case w.value===`group`:L.value.push({alpha:1,id:`group_${i()}`,x:I.value.x,y:I.value.y,isFilled:!1,rectHeight:Z(R.value.rect.height),rectWidth:Z(R.value.rect.width),rectStrokeWidth:1,type:`group`,color:`grey`,strokeWidth:1,isDash:!0,content:``})}pn.value||=requestAnimationFrame(In)}function mr(e){if(!M.value)return;Fr(e);let t=zn(e),n=t?L.value.find(e=>e.id===t):null;if(P.value&&rn.value&&t!==rn.value&&Xn(),D.value){Bt.value=!1;return}if(n){let t=Number.isFinite(e?.timeStamp)?e.timeStamp:Date.now(),r=br.id===n.id&&t-br.at>=0&&t-br.at<=Et;if(br=r?{id:null,at:0}:{id:n.id,at:t},r){e.preventDefault(),e.stopPropagation(),Bt.value=!1,tn.value=null,nn.value=null,V.value=null,yr(n);return}}else br={id:null,at:0};if(e.preventDefault(),e.stopPropagation(),Bt.value=!0,e.pointerId!=null){try{bn.value?.setPointerCapture?.(e.pointerId)}catch{}mn.value=e.pointerId}else mn.value=null;if(O.value){if(n){Bt.value=!1,O.value=!1,F.value=n,E.value={id:n.id},Kn(n);return}ln.value?.begin?.(),pr();return}if(j.value){ln.value?.begin?.(),pr();return}if(k.value){if(!n){Bt.value=!1,E.value=void 0;return}ln.value?.begin?.(),Ln(n.id);let t=L.value.find(e=>e.id===n.id);F.value=t,E.value={id:t.id},Hn({target:e.target});return}if(A.value){if(!n){Bt.value=!1,E.value=void 0,tn.value=null,nn.value=null,V.value=null;return}let t=e.target?.getAttribute?.(`data-resize-handle`)||null;F.value=n,E.value={id:n.id},Kn(n),t?(tn.value=null,Un(n,t)):(nn.value=null,V.value=null,Hn(e)),ln.value?.begin?.()}}function hr(e){if(!e||!e.id||!tn.value&&(Hn({target:{id:e.id}}),!tn.value))return;let t=I.value.x,n=I.value.y;switch(F.value=e,e.type){case`arrow`:{let{dx:r,dy:i,endDx:a,endDy:o}=tn.value;e.x=t-r,e.y=n-i,e.endX=t-(a??r),e.endY=n-(o??i);break}case`circle`:case`rect`:case`text`:{let{dx:r,dy:i}=tn.value;e.x=t-r,e.y=n-i;break}case`line`:{let{startX:r,startY:i,path:a}=tn.value,o=t-r,s=n-i;e.path=Cn(Sn(a).map(e=>({x:e.x+o,y:e.y+s})));let c=wn(e.path);c&&(e.x=c.minX,e.y=c.minY);break}case`group`:{let{dx:r,dy:i}=tn.value;e.x=t-r,e.y=n-i,dr(e);break}}}function gr(){let e=E.value?.id||Nt.value;if(!e)return;let t=L.value.find(t=>t.id===e);t&&hr(t)}function _r(){let e=E.value?.id;if(!e)return;let t=L.value.find(t=>t.id===e);if(!t)return;let n=I.value.x,r=I.value.y;switch(w.value=t.type,F.value=t,t.type){case`arrow`:nn.value===`arrow-start`?(t.x=n,t.y=r):nn.value===`arrow-end`&&(t.endX=n,t.endY=r);break;case`line`:{if(nn.value!==`line-scale`||!V.value?.bounds||!V.value?.points)return;let{bounds:e,points:i}=V.value,a=Math.max(1,n-e.minX),o=Math.max(1,r-e.minY),s=a/Math.max(1,e.width),c=o/Math.max(1,e.height);t.path=Cn(i.map(t=>({x:e.minX+(t.x-e.minX)*s,y:e.minY+(t.y-e.minY)*c}))),t.x=e.minX,t.y=e.minY;break}case`circle`:{if(nn.value!==`circle-radius`||V.value?.shapeId!==t.id||!V.value?.anchor)return;let e=V.value.anchor,i=n,a=r,o=i-e.x,s=a-e.y,c=Math.hypot(o,s);if(c<2){if(c>0){let e=2/c;o*=e,s*=e}else o=2,s=0;i=e.x+o,a=e.y+s,c=2}t.x=e.x+o/2,t.y=e.y+s/2,t.circleRadius=c/2,V.value.handlePoint={x:i,y:a};break}case`rect`:{let e=nn.value,i=V.value?.bounds;if(!e?.startsWith(`rect-`)||V.value?.shapeId!==t.id||!i)return;let a=i.left,o=i.top,s=i.right,c=i.bottom;switch(e){case`rect-nw`:a=Math.min(n,i.right-20),o=Math.min(r,i.bottom-20);break;case`rect-ne`:s=Math.max(n,i.left+20),o=Math.min(r,i.bottom-20);break;case`rect-se`:s=Math.max(n,i.left+20),c=Math.max(r,i.top+20);break;case`rect-sw`:a=Math.min(n,i.right-20),c=Math.max(r,i.top+20);break;default:return}t.x=a,t.y=o,t.rectWidth=s-a,t.rectHeight=c-o;break}case`group`:if(nn.value!==`group-scale`)return;t.rectWidth=Math.max(20,n-t.x),t.rectHeight=Math.max(20,r-t.y)}}function vr(e){if(!M.value||D.value)return;e.preventDefault(),e.stopPropagation(),Fr(e);let t=zn(e);t&&(Nt.value=t),k.value&&Bt.value?gr():A.value&&Bt.value&&(nn.value?_r():gr())}function yr(e){if(e){if(P.value&&rn.value!==e.id&&Xn(),F.value=e,E.value={id:e.id},k.value=!1,D.value=!1,A.value=!0,j.value=!1,O.value=!1,e.type===`text`){w.value=void 0,Kn(e),Yn(e);return}N.value=!1,P.value=!1,z.value=!1,H.value=null,Kn(e)}}let br={id:null,at:0},xr={id:null,at:0};function Sr(e,t){if(!M.value)return;let n=t||Rn(e.target);if(!n)return;xr={id:null,at:0};let r=L.value.find(e=>e.id===n);r&&yr(r)}function Cr(e,t){if(!M.value)return;let n=t||Rn(e.target);if(!n)return;let r=L.value.find(e=>e.id===n);if(!r)return;let i=Number.isFinite(e?.timeStamp)?e.timeStamp:Date.now(),a=xr.id===n&&i-xr.at>=0&&i-xr.at<=Et;if(xr=a?{id:null,at:0}:{id:n,at:i},a&&!D.value){yr(r);return}let o=F.value?.id===n,s=N.value;if(D.value){P.value&&Xn(),ln.value?.begin?.(),L.value=L.value.filter(e=>e.id!==n),F.value?.id===n&&(F.value=void 0),E.value=void 0,ln.value?.end?.();return}if(P.value&&rn.value&&rn.value!==n&&Xn(),F.value=r,E.value={id:r.id},k.value){z.value=!1,H.value=null;return}if(Kn(r),r.type===`text`){let e=!k.value&&!A.value&&!O.value&&!j.value;N.value=e,e&&(s||o)&&Yn(r);return}N.value=!1,z.value=!1,H.value=null}let wr=y(null);function Tr(e,t){for(t(e),e=e.firstChild;e;)Tr(e,t),e=e.nextSibling}function Er(){P.value&&Xn(),Vt.value=!0,D.value=!1,k.value=!1,A.value=!1,N.value=!1,P.value=!1,j.value=!1,w.value=void 0,z.value=!1,ce(async()=>{let e=wr.value;if(e){Tr(e,e=>{e&&e.nodeType===1&&(e.setAttribute(`font-family`,`Helvetica`),e.style.fontFamily=`Helvetica`)});try{let t;try{t=(await import(`jspdf`)).default}catch{throw Error(`jspdf is not installed. Run npm install jspdf`)}let n=await l({container:e,scale:2}),r=new Image;r.src=n,r.onload=()=>{let e={width:595.28,height:841.89},i=r.width,a=r.height,o=i/e.width*e.height,s=e.width,c=s/i*a,l=new t(``,`pt`,`a4`),u=0,ee=a;if(ee<o)l.addImage(n,`PNG`,0,0,s,c,``,`FAST`);else for(;ee>0;)l.addImage(n,`PNG`,0,u,s,c,``,`FAST`),ee-=o,u-=e.height,ee>0&&l.addPage();l.save(`${(/* @__PURE__ */ new Date()).toLocaleDateString()}_annotations.pdf`)}}catch(e){console.error(`Error generating image:`,e)}finally{Vt.value=!1,Tr(e,e=>{e&&e.nodeType===1&&(e.setAttribute(`font-family`,J.value.fontFamily),e.style.fontFamily=J.value.fontFamily)})}}})}function Dr(e){let t=O.value&&Lt.value&&F.value&&[`arrow`,`circle`,`line`,`rect`].includes(F.value.type)?L.value.find(e=>e.id===F.value.id):null;if(!D.value&&e&&(e.preventDefault(),e.stopPropagation()),Lt.value=!1,Bt.value=!1,tn.value=null,nn.value=null,V.value=null,mn.value!=null){try{bn.value?.releasePointerCapture?.(mn.value)}catch{}mn.value=null}pn.value&&=(cancelAnimationFrame(pn.value),null);let n=j.value?ur():null;ln.value?.end(),n&&(j.value=!1,k.value=!0,A.value=!1,O.value=!1,D.value=!1,N.value=!1,P.value=!1,z.value=!1,H.value=null,F.value=n,E.value={id:n.id},Nt.value=void 0,$n=Date.now()+250),t&&($n=Date.now()+250,yr(t))}function Or(){F.value&&F.value.id.includes(`rect`)&&(F.value.isFilled=!F.value.isFilled)}function kr(){F.value&&F.value.id.includes(`circle`)&&(F.value.isFilled=!F.value.isFilled)}function Ar(e=hn.value){let t=typeof e==`string`&&e.length?e:hn.value;if(hn.value=t,!F.value||k.value)return;let n=L.value.find(e=>e.id===F.value.id);if(n){if(n.color=Z(t),F.value=n,[`arrow`,`text`].includes(n.type)){Jn();return}n.alpha=Z(_n.value)}}function jr(){F.value&&F.value.type!==`text`&&(F.value.isDash=Z(It.value))}function Mr(){F.value&&![`arrow`,`text`].includes(F.value.type)&&(F.value.alpha=Z(_n.value))}function Nr(){F.value&&[`arrow`,`circle`,`rect`,`line`].includes(F.value.type)&&(F.value.strokeWidth=Z(Math.abs(Mt.value)))}function Pr(){F.value&&F.value.type===`text`&&(F.value.isBold=Z(Pt.value),F.value.isItalic=Z(zt.value),F.value.isUnderline=Z(Ht.value),F.value.fontSize=Z(Qt.value),F.value.isBulletTextMode=Z(Ft.value),Jn())}function Fr(e){if(e.preventDefault(),!bn.value)return;let t=bn.value.getBoundingClientRect(),n,r;e.touches&&e.touches.length>0?(n=e.touches[0].clientX,r=e.touches[0].clientY):(n=e.clientX,r=e.clientY),I.value.x=(n-t.left)/t.width*qt.value,I.value.y=(r-t.top)/t.height*Kt.value}function Ir(e){if(z.value=!1,Zn(),e===w.value){w.value=void 0,O.value=!1;return}O.value=!0,D.value=!1,k.value=!1,A.value=!1,N.value=!1,w.value=e}function Lr(){P.value&&Xn(),M.value=!M.value,M.value||(k.value=!1,A.value=!1,j.value=!1,N.value=!1,P.value=!1,w.value=void 0,F.value=void 0,E.value=void 0,Nt.value=void 0,Wt.value=[],z.value=!1,D.value=!1),xe(`toggleOpenState`,{isOpen:M.value})}function Rr(){P.value&&Xn(),xe(`saveAnnotations`,{shapes:L.value,lastSelectedShape:F.value})}let zr=null;return de(()=>{if(wr.value){let e=!1;Tr(wr.value,t=>{if(!e&&[`DIV`,`svg`,`section`,`canvas`].includes(t.tagName)){Yt.value=t,e=!0;return}})}un.value=(()=>{if(typeof navigator>`u`)return!1;let e=navigator.userAgentData?.platform??``;if(e)return/mac|ios/i.test(e);let t=navigator.userAgent??``;return/(Mac|iPhone|iPad|iPod)/i.test(t)})();let e=Yt?.value.getBoundingClientRect();if(Jt.value=e.height/e.width,qt.value=1e3,Kt.value=Jt.value*1e3,Xt.value=e.width,Zt.value=e.height,new ResizeObserver(e=>{e.forEach(e=>{Xt.value=e.contentRect.width,Zt.value=e.contentRect.height,Jt.value=e.contentRect.height/e.contentRect.width,Kt.value=Jt.value*1e3})}).observe(Yt.value),dn.value=e=>ir(e),window.addEventListener(`keydown`,dn.value),ln.value=Bn(),ln.value.size){let e=ln.value.size();fn.value.undo=e.undo,fn.value.redo=e.redo}zr=ye({isMacLike:un,isSummaryOpen:M,isWriting:P,isDeleteMode:D,isMoveMode:k,isResizeMode:A,isSelectMode:j,isDrawMode:O,isTextMode:N,activeShape:w,showCaret:z,lastSelectedShape:F,shapes:L,history:ln,setShapeTo:Ir,undoLastShape:nr,redoLastShape:rr})}),ue(()=>{$(),pn.value&&cancelAnimationFrame(pn.value),dn.value&&window.removeEventListener(`keydown`,dn.value),zr&&zr(),window.removeEventListener(`keydown`,ir)}),ge(L,e=>{e.length===0&&(F.value=void 0)}),ge(N,e=>{if(!e&&P.value){Xn();return}z.value=!!(e&&P.value),z.value&&Jn()}),(e,t)=>(v(),p(`div`,Se,[m(`div`,Ce,[b(e.$slots,`toggle`,le(se({toggle:Lr,isOpen:M.value})),()=>[oe(te,{config:{maxHeight:1e3,useCursorPointer:Y.value,head:{backgroundColor:J.value.backgroundColor,color:J.value.color,iconColor:J.value.color,iconSize:20,icon:M.value?`close`:`annotator`,padding:`6px`},body:{backgroundColor:J.value.backgroundColor,color:J.value.color}},onToggle:Lr},{title:S(({color:e})=>[m(`div`,{style:_({color:e})},x(K.value.translations.title),5)]),content:S(({backgroundColor:e})=>[m(`div`,{id:`toggle_default_${kt.value}`},null,8,we)]),_:1},8,[`config`])],!0),e.$slots.toggle&&M.value?(v(),p(`div`,{key:0,id:`toggle_slot_${kt.value}`},null,8,Te)):f(``,!0),Dt.value&&Ot.value?(v(),d(ie,{key:1,to:e.$slots.toggle?`#toggle_slot_${kt.value}`:`#toggle_default_${kt.value}`},[m(`div`,null,[m(`div`,Ee,[m(`button`,{disabled:L.value.length===0,style:_({background:k.value?q.value.controls.selected.backgroundColor:q.value.controls.backgroundColor,border:k.value?q.value.controls.selected.border:q.value.controls.border,color:k.value?q.value.controls.selected.color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,"button-tool--selected":k.value,tooltip:!0}),onClick:t[0]||=e=>{Zn(),k.value=!k.value,D.value=!1,O.value=!1,A.value=!1,j.value=!1,N.value=!1,P.value=!1,z.value=!1},onMouseenter:t[1]||=e=>J.value.showTooltips&&Q(`move`,e,`top`),onMouseleave:$,onFocus:t[2]||=e=>J.value.showTooltips&&Q(`move`,e,`top`),onBlur:$},[b(e.$slots,`icon-move`,le(se({active:k.value})),()=>[oe(u,{name:`move`,stroke:k.value?q.value.controls.selected.color:q.value.controls.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`move`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipMove)+` `,1),t[91]||=m(`kbd`,null,`M`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],46,De),m(`button`,{disabled:L.value.length===0,style:_({background:A.value?q.value.controls.selected.backgroundColor:q.value.controls.backgroundColor,border:A.value?q.value.controls.selected.border:q.value.controls.border,color:A.value?q.value.controls.selected.color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,"button-tool--selected":A.value,tooltip:!0}),onClick:t[3]||=e=>{Zn(),A.value=!A.value,k.value=!1,D.value=!1,O.value=!1,j.value=!1,N.value=!1,P.value=!1,w.value=void 0,z.value=!1},onMouseenter:t[4]||=e=>J.value.showTooltips&&Q(`resize`,e,`top`),onMouseleave:$,onFocus:t[5]||=e=>J.value.showTooltips&&Q(`resize`,e,`top`),onBlur:$},[b(e.$slots,`icon-resize`,le(se({active:A.value})),()=>[oe(u,{name:`resize`,stroke:A.value?q.value.controls.selected.color:q.value.controls.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`resize`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipResize)+` `,1),t[92]||=m(`kbd`,null,`R`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],46,Oe),m(`button`,{disabled:L.value.length===0,style:_({background:D.value?q.value.controls.selected.backgroundColor:q.value.controls.backgroundColor,border:D.value?q.value.controls.selected.border:q.value.controls.border,color:D.value?q.value.controls.selected.color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,"button-tool--selected":D.value,tooltip:!0}),onClick:t[6]||=e=>{Zn(),D.value=!D.value,k.value=!1,A.value=!1,j.value=!1,N.value=!1,P.value=!1,w.value=void 0,z.value=!1},onMouseenter:t[7]||=e=>J.value.showTooltips&&Q(`delete`,e,`top`),onMouseleave:$,onFocus:t[8]||=e=>J.value.showTooltips&&Q(`delete`,e,`top`),onBlur:$},[b(e.$slots,`icon-delete`,le(se({active:D.value})),()=>[oe(u,{name:`trash`,stroke:D.value?q.value.controls.selected.color:q.value.controls.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`delete`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipDelete)+` `,1),t[93]||=m(`kbd`,null,`D`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],46,ke),m(`button`,{disabled:!gn.value,style:_({background:j.value?q.value.controls.selected.backgroundColor:q.value.controls.backgroundColor,border:j.value?q.value.controls.selected.border:q.value.controls.border,color:j.value?q.value.controls.selected.color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,"button-tool--selected":j.value,tooltip:!0}),onClick:t[9]||=e=>{Zn(),Ir(`group`),j.value=!j.value,D.value=!1,k.value=!1,A.value=!1,N.value=!1,P.value=!1,w.value=`group`,z.value=!1},onMouseenter:t[10]||=e=>J.value.showTooltips&&Q(`selectAndGroup`,e,`top`),onMouseleave:$,onFocus:t[11]||=e=>J.value.showTooltips&&Q(`selectAndGroup`,e,`top`),onBlur:$},[b(e.$slots,`icon-select-group`,le(se({active:j.value})),()=>[oe(u,{name:`selectAndGroup`,stroke:j.value?q.value.controls.selected.color:q.value.controls.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`selectAndGroup`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipGroup)+` `,1),t[94]||=m(`kbd`,null,`G`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],46,Ae),m(`button`,{disabled:L.value.length===0,style:_({background:q.value.controls.backgroundColor,border:q.value.controls.border,color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,tooltip:!0}),onClick:t[12]||=e=>{A.value=!1,k.value=!0,D.value=!1,O.value=!1,j.value=!1,N.value=!1,P.value=!1,z.value=!1,Wn(`front`)},onMouseenter:t[13]||=e=>J.value.showTooltips&&Q(`bringToFront`,e,`top`),onMouseleave:$,onFocus:t[14]||=e=>J.value.showTooltips&&Q(`bringToFront`,e,`top`),onBlur:$},[b(e.$slots,`icon-bring-to-front`,{},()=>[oe(u,{name:`bringToFront`,stroke:q.value.controls.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`bringToFront`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipBringToFront),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],44,je),m(`button`,{disabled:L.value.length===0,style:_({background:q.value.controls.backgroundColor,border:q.value.controls.border,color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,tooltip:!0}),onClick:t[15]||=e=>{A.value=!1,k.value=!0,D.value=!1,O.value=!1,j.value=!1,N.value=!1,P.value=!1,z.value=!1,Wn(`back`)},onMouseenter:t[16]||=e=>J.value.showTooltips&&Q(`bringToBack`,e,`top`),onMouseleave:$,onFocus:t[17]||=e=>J.value.showTooltips&&Q(`bringToBack`,e,`top`),onBlur:$},[b(e.$slots,`icon-bring-to-back`,{},()=>[oe(u,{name:`bringToBack`,stroke:q.value.controls.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`bringToBack`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipBringToBack),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],44,Me),m(`button`,{disabled:L.value.length===0||w.value===`line`,style:_({background:q.value.controls.backgroundColor,border:q.value.controls.border,color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,tooltip:!0}),onClick:t[18]||=e=>{Zn(),A.value=!1,k.value=!0,D.value=!1,O.value=!1,j.value=!1,N.value=!1,P.value=!1,z.value=!1,Gn()},onMouseenter:t[19]||=e=>J.value.showTooltips&&Q(`duplicate`,e,`top`),onMouseleave:$,onFocus:t[20]||=e=>J.value.showTooltips&&Q(`duplicate`,e,`top`),onBlur:$},[b(e.$slots,`icon-copy`,{},()=>[oe(u,{name:`copy`,stroke:q.value.controls.color,size:18},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`duplicate`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipDuplicate),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],44,Ne),m(`button`,{disabled:fn.value.undo===0,style:_({background:q.value.controls.backgroundColor,border:q.value.controls.border,color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,"button-tool--one-shot":!0,tooltip:!0}),onClick:t[21]||=e=>{A.value=!1,k.value=!1,D.value=!1,O.value=!1,j.value=!1,N.value=!1,P.value=!1,w.value=void 0,z.value=!1,nr()},onMouseenter:t[22]||=e=>J.value.showTooltips&&Q(`undoLast`,e,`top`),onMouseleave:$,onFocus:t[23]||=e=>J.value.showTooltips&&Q(`undoLast`,e,`top`),onBlur:$},[b(e.$slots,`icon-undo`,{},()=>[oe(u,{name:`refresh`,stroke:q.value.controls.color,size:20},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`undoLast`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipUndo)+` `,1),m(`kbd`,null,x(un.value?`⌘`:`Ctrl`),1),t[95]||=m(`kbd`,null,`Z`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],44,Pe),m(`button`,{disabled:fn.value.redo===0,style:_({background:q.value.controls.backgroundColor,border:q.value.controls.border,color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,"button-tool--one-shot":!0,tooltip:!0}),onClick:t[24]||=e=>{A.value=!1,k.value=!1,D.value=!1,O.value=!1,j.value=!1,N.value=!1,P.value=!1,w.value=void 0,z.value=!1,rr()},onMouseenter:t[25]||=e=>J.value.showTooltips&&Q(`redoLast`,e,`top`),onMouseleave:$,onFocus:t[26]||=e=>J.value.showTooltips&&Q(`redoLast`,e,`top`),onBlur:$},[b(e.$slots,`icon-redo`,{},()=>[oe(u,{name:`refresh`,stroke:q.value.controls.color,size:20,style:{transform:`rotateX(0deg) rotateY(180deg)`}},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`redoLast`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipRedo)+` `,1),m(`kbd`,null,x(un.value?`⌘`:`Ctrl`),1),t[96]||=m(`kbd`,null,`Y`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],44,Fe),J.value.showPrint?(v(),p(`button`,{key:0,style:_({background:q.value.controls.backgroundColor,border:q.value.controls.border,color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,tooltip:!0}),onClick:Er,onMouseenter:t[27]||=e=>J.value.showTooltips&&Q(`printPdf`,e,`top`),onMouseleave:$,onFocus:t[28]||=e=>J.value.showTooltips&&Q(`printPdf`,e,`top`),onBlur:$},[b(e.$slots,`icon-print`,{},()=>[oe(u,{name:`printer`,stroke:q.value.controls.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`printPdf`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipPdf),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],36)):f(``,!0),J.value.showImage?(v(),p(`button`,{key:1,style:_({background:q.value.controls.backgroundColor,border:q.value.controls.border,color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,tooltip:!0}),onClick:t[29]||=(...e)=>pe(jt)&&pe(jt)(...e),onMouseenter:t[30]||=e=>J.value.showTooltips&&Q(`printImage`,e,`top`),onMouseleave:$,onFocus:t[31]||=e=>J.value.showTooltips&&Q(`printImage`,e,`top`),onBlur:$},[b(e.$slots,`icon-export-image`,{},()=>[oe(u,{name:`image`,stroke:q.value.controls.color,size:20},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`printImage`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipImage),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],36)):f(``,!0),J.value.showSave?(v(),p(`button`,{key:2,style:_({background:q.value.controls.backgroundColor,border:q.value.controls.border,color:q.value.controls.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),class:g({"button-tool":!0,tooltip:!0}),onClick:Rr,onMouseenter:t[32]||=e=>J.value.showTooltips&&Q(`saveAction`,e,`top`),onMouseleave:$,onFocus:t[33]||=e=>J.value.showTooltips&&Q(`saveAction`,e,`top`),onBlur:$},[b(e.$slots,`icon-save`,{},()=>[oe(u,{name:`save`,stroke:q.value.controls.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`saveAction`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipSave),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],36)):f(``,!0)]),m(`div`,Ie,[m(`button`,{class:g({"button-tool":!0,"button-tool--selected":w.value===`circle`,tooltip:!0}),style:_({background:w.value===`circle`?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:w.value===`circle`?q.value.shapes.selected.border:q.value.shapes.border,color:w.value===`circle`?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[34]||=e=>{Ir(`circle`),j.value=!1},onMouseenter:t[35]||=e=>J.value.showTooltips&&Q(`setCircle`,e,`top`),onMouseleave:$,onFocus:t[36]||=e=>J.value.showTooltips&&Q(`setCircle`,e,`top`),onBlur:$},[b(e.$slots,`icon-circle`,le(se({filled:R.value.circle.filled})),()=>[(v(),p(`svg`,Le,[m(`circle`,{cx:6,cy:6,r:`4`,fill:R.value.circle.filled?(w.value,hn.value+_n.value):`none`,stroke:`currentColor`},null,8,Re)]))],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setCircle`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeCircle)+` `,1),t[97]||=m(`kbd`,null,`C`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38),w.value===`circle`?(v(),p(`div`,ze,[m(`label`,Be,[h(x(K.value.translations.filled)+` `,1),_e(m(`input`,{type:`checkbox`,"onUpdate:modelValue":t[37]||=e=>R.value.circle.filled=e,onChange:kr,checked:R.value.circle.filled,style:_({all:`revert`,appearance:`auto`,"-webkit-appearance":`auto`,accentColor:J.value.color+` !important`})},null,44,Ve),[[me,R.value.circle.filled]])])])):f(``,!0),m(`button`,{class:g({"button-tool":!0,"button-tool--selected":w.value===`rect`,tooltip:!0}),style:_({background:w.value===`rect`?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:w.value===`rect`?q.value.shapes.selected.border:q.value.shapes.border,color:w.value===`rect`?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[38]||=e=>{Ir(`rect`),j.value=!1},onMouseenter:t[39]||=e=>J.value.showTooltips&&Q(`setRect`,e,`top`),onMouseleave:$,onFocus:t[40]||=e=>J.value.showTooltips&&Q(`setRect`,e,`top`),onBlur:$},[b(e.$slots,`icon-rect`,le(se({filled:R.value.rect.filled})),()=>[(v(),p(`svg`,He,[m(`rect`,{x:`3`,y:`3`,style:{rx:`0 !important`,ry:`0 !important`},height:`6`,width:`6`,fill:R.value.rect.filled?(w.value,hn.value+_n.value):`none`,stroke:`currentColor`},null,8,Ue)]))],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setRect`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeRect)+` `,1),t[98]||=m(`kbd`,null,`S`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38),w.value===`rect`?(v(),p(`div`,We,[m(`label`,Ge,[h(x(K.value.translations.filled)+` `,1),_e(m(`input`,{type:`checkbox`,"onUpdate:modelValue":t[41]||=e=>R.value.rect.filled=e,onChange:Or,checked:R.value.rect.filled,style:_({all:`revert`,appearance:`auto`,"-webkit-appearance":`auto`,accentColor:J.value.color+` !important`})},null,44,Ke),[[me,R.value.rect.filled]])])])):f(``,!0),m(`button`,{class:g({"button-tool":!0,"button-tool--selected":w.value===`arrow`,tooltip:!0}),style:_({background:w.value===`arrow`?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:w.value===`arrow`?q.value.shapes.selected.border:q.value.shapes.border,color:w.value===`arrow`?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[42]||=e=>{Ir(`arrow`),j.value=!1},onMouseenter:t[43]||=e=>J.value.showTooltips&&Q(`setArrow`,e,`top`),onMouseleave:$,onFocus:t[44]||=e=>J.value.showTooltips&&Q(`setArrow`,e,`top`),onBlur:$},[b(e.$slots,`icon-arrow`,{},()=>[(v(),p(`svg`,qe,[m(`path`,{stroke:R.value.arrow.filled?w.value===`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,Je)]))],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setArrow`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeArrow)+` `,1),t[99]||=m(`kbd`,null,`A`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38),m(`button`,{class:g({"button-tool":!0,"button-tool--selected":w.value===`line`,tooltip:!0}),style:_({background:w.value===`line`?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:w.value===`line`?q.value.shapes.selected.border:q.value.shapes.border,color:w.value===`line`?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[45]||=e=>{Ir(`line`),j.value=!1},onMouseenter:t[46]||=e=>J.value.showTooltips&&Q(`setFreehand`,e,`top`),onMouseleave:$,onFocus:t[47]||=e=>J.value.showTooltips&&Q(`setFreehand`,e,`top`),onBlur:$},[b(e.$slots,`icon-freehand`,{},()=>[t[100]||=m(`svg`,{width:`80%`,viewBox:`0 0 24 24`,"stroke-width":`2`,stroke:`currentColor`,fill:`none`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[m(`path`,{stroke:`none`,d:`M0 0h24v24H0z`,fill:`none`}),m(`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)],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setFreehand`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeFreehand)+` `,1),t[101]||=m(`kbd`,null,`L`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38),[`arrow`,`circle`,`rect`,`line`].includes(w.value)?(v(),p(`div`,Ye,[m(`div`,Xe,[m(`label`,Ze,[h(x(K.value.translations.thickness)+` `,1),_e(m(`input`,{type:`number`,"onUpdate:modelValue":t[48]||=e=>Mt.value=e,onInput:Nr,min:1,style:{padding:`0 4px`,width:`40px`,border:`1px solid #dadada`,"border-radius":`3px`}},null,544),[[he,Mt.value]])])])])):f(``,!0),[`arrow`,`circle`,`rect`].includes(w.value)?(v(),p(`div`,Qe,[m(`div`,$e,[m(`label`,et,[h(x(K.value.translations.dashedLines)+` `,1),_e(m(`input`,{name:`dashStyle`,type:`checkbox`,"onUpdate:modelValue":t[49]||=e=>It.value=e,onChange:jr,checked:It.value,style:_({all:`revert`,appearance:`auto`,"-webkit-appearance":`auto`,accentColor:J.value.color+` !important`})},null,44,tt),[[me,It.value]])])])])):f(``,!0),m(`button`,{class:g({"button-tool":!0,"button-tool--selected":N.value,tooltip:!0}),style:_({background:N.value?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:N.value?q.value.shapes.selected.border:q.value.shapes.border,color:N.value?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[50]||=e=>{Zn(),N.value=!N.value,D.value=!1,k.value=!1,A.value=!1,j.value=!1,O.value=!1,w.value=void 0},onMouseenter:t[51]||=e=>J.value.showTooltips&&Q(`setText`,e,`top`),onMouseleave:$,onFocus:t[52]||=e=>J.value.showTooltips&&Q(`setText`,e,`top`),onBlur:$},[b(e.$slots,`icon-text`,le(se({active:N.value})),()=>[oe(u,{name:`text`,stroke:N.value?q.value.shapes.selected.color:q.value.shapes.color},null,8,[`stroke`])],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setText`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeText)+` `,1),t[102]||=m(`kbd`,null,`T`,-1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38),N.value?(v(),p(`div`,nt,[m(`div`,rt,[m(`label`,it,[h(x(K.value.translations.fontSize)+` `,1),_e(m(`input`,{type:`number`,"onUpdate:modelValue":t[53]||=e=>Qt.value=e,onInput:Pr,style:{padding:`0 4px`,width:`40px`,border:`1px solid #dadada`,"border-radius":`3px`}},null,544),[[he,Qt.value]])])])])):f(``,!0),N.value?(v(),p(`div`,at,[m(`button`,{class:g({"button-tool":!0,"button-tool--selected":B.value===`start`,tooltip:!0}),style:_({background:B.value===`start`?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:B.value===`start`?q.value.shapes.selected.border:q.value.shapes.border,color:B.value===`start`?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[54]||=e=>{D.value=!1,k.value=!1,A.value=!1,O.value=!1,j.value=!1,w.value=void 0,B.value=`start`,tr(`start`)},onMouseenter:t[55]||=e=>J.value.showTooltips&&Q(`setAlignStart`,e,`top`),onMouseleave:$,onFocus:t[56]||=e=>J.value.showTooltips&&Q(`setAlignStart`,e,`top`),onBlur:$},[b(e.$slots,`icon-text-align-left`,{},()=>[t[103]||=m(`svg`,{width:`80%`,viewBox:`0 0 24 24`,"stroke-width":`2`,stroke:`currentColor`,fill:`none`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[m(`path`,{stroke:`none`,d:`M0 0h24v24H0z`,fill:`none`}),m(`path`,{d:`M4 6l16 0`}),m(`path`,{d:`M4 12l10 0`}),m(`path`,{d:`M4 18l14 0`})],-1)],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setAlignStart`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeTextLeft),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38)])):f(``,!0),N.value?(v(),p(`div`,ot,[m(`button`,{class:g({"button-tool":!0,"button-tool--selected":B.value===`middle`,tooltip:!0}),style:_({background:B.value===`middle`?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:B.value===`middle`?q.value.shapes.selected.border:q.value.shapes.border,color:B.value===`middle`?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),disabled:Ft.value,onClick:t[57]||=e=>{D.value=!1,k.value=!1,A.value=!1,O.value=!1,j.value=!1,w.value=void 0,B.value=`middle`,tr(`middle`)},onMouseenter:t[58]||=e=>J.value.showTooltips&&Q(`setAlignMiddle`,e,`top`),onMouseleave:$,onFocus:t[59]||=e=>J.value.showTooltips&&Q(`setAlignMiddle`,e,`top`),onBlur:$},[b(e.$slots,`icon-text-align-center`,{},()=>[t[104]||=m(`svg`,{width:`80%`,viewBox:`0 0 24 24`,"stroke-width":`2`,stroke:`currentColor`,fill:`none`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[m(`path`,{stroke:`none`,d:`M0 0h24v24H0z`,fill:`none`}),m(`path`,{d:`M4 6l16 0`}),m(`path`,{d:`M8 12l8 0`}),m(`path`,{d:`M6 18l12 0`})],-1)],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setAlignMiddle`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeTextCenter),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],46,st)])):f(``,!0),N.value?(v(),p(`div`,ct,[m(`button`,{class:g({"button-tool":!0,"button-tool--selected":B.value===`end`,tooltip:!0}),style:_({background:B.value===`end`?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:B.value===`end`?q.value.shapes.selected.border:q.value.shapes.border,color:B.value===`end`?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),disabled:Ft.value,onClick:t[60]||=e=>{D.value=!1,k.value=!1,A.value=!1,O.value=!1,j.value=!1,w.value=void 0,B.value=`end`,tr(`end`)},onMouseenter:t[61]||=e=>J.value.showTooltips&&Q(`setAlignEnd`,e,`top`),onMouseleave:$,onFocus:t[62]||=e=>J.value.showTooltips&&Q(`setAlignEnd`,e,`top`),onBlur:$},[b(e.$slots,`icon-text-align-right`,{},()=>[t[105]||=m(`svg`,{width:`80%`,viewBox:`0 0 24 24`,"stroke-width":`2`,stroke:`currentColor`,fill:`none`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[m(`path`,{stroke:`none`,d:`M0 0h24v24H0z`,fill:`none`}),m(`path`,{d:`M4 6l16 0`}),m(`path`,{d:`M10 12l10 0`}),m(`path`,{d:`M6 18l14 0`})],-1)],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setAlignEnd`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeTextRight),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],46,lt)])):f(``,!0),N.value?(v(),p(`div`,ut,[m(`button`,{class:g({"button-tool":!0,"button-tool--selected":Ft.value,tooltip:!0}),style:_({background:Ft.value?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:Ft.value?q.value.shapes.selected.border:q.value.shapes.border,color:Ft.value?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[63]||=e=>{D.value=!1,k.value=!1,A.value=!1,O.value=!1,j.value=!1,w.value=void 0,Ft.value=!Ft.value,B.value=`start`,tr(`start`),Pr()},onMouseenter:t[64]||=e=>J.value.showTooltips&&Q(`setBulletMode`,e,`top`),onMouseleave:$,onFocus:t[65]||=e=>J.value.showTooltips&&Q(`setBulletMode`,e,`top`),onBlur:$},[b(e.$slots,`icon-text-bullet-points`,{},()=>[t[106]||=m(`svg`,{width:`100%`,viewBox:`0 0 24 24`,"stroke-width":`2`,stroke:`currentColor`,fill:`none`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[m(`path`,{stroke:`none`,d:`M0 0h24v24H0z`,fill:`none`}),m(`path`,{d:`M9 6l11 0`}),m(`path`,{d:`M9 12l11 0`}),m(`path`,{d:`M9 18l11 0`}),m(`path`,{d:`M5 6l0 .01`}),m(`path`,{d:`M5 12l0 .01`}),m(`path`,{d:`M5 18l0 .01`})],-1)],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setBulletMode`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeTextBullet),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38)])):f(``,!0),N.value?(v(),p(`div`,dt,[m(`button`,{class:g({"button-tool":!0,"button-tool--selected":Pt.value,tooltip:!0}),style:_({background:Pt.value?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:Pt.value?q.value.shapes.selected.border:q.value.shapes.border,color:Pt.value?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[66]||=e=>{D.value=!1,k.value=!1,A.value=!1,O.value=!1,j.value=!1,w.value=void 0,Pt.value=!Pt.value,Pr()},onMouseenter:t[67]||=e=>J.value.showTooltips&&Q(`setBold`,e,`top`),onMouseleave:$,onFocus:t[68]||=e=>J.value.showTooltips&&Q(`setBold`,e,`top`),onBlur:$},[b(e.$slots,`icon-text-bold`,{},()=>[t[107]||=m(`svg`,{width:`100%`,viewBox:`0 0 24 24`,"stroke-width":`3`,stroke:`currentColor`,fill:`none`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[m(`path`,{stroke:`none`,d:`M0 0h24v24H0z`,fill:`none`}),m(`path`,{d:`M7 5h6a3.5 3.5 0 0 1 0 7h-6z`}),m(`path`,{d:`M13 12h1a3.5 3.5 0 0 1 0 7h-7v-7`})],-1)],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setBold`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeTextBold),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38)])):f(``,!0),N.value?(v(),p(`div`,ft,[m(`button`,{class:g({"button-tool":!0,"button-tool--selected":zt.value,tooltip:!0}),style:_({background:zt.value?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:zt.value?q.value.shapes.selected.border:q.value.shapes.border,color:zt.value?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[69]||=e=>{D.value=!1,k.value=!1,A.value=!1,O.value=!1,j.value=!1,w.value=void 0,zt.value=!zt.value,Pr()},onMouseenter:t[70]||=e=>J.value.showTooltips&&Q(`setItalic`,e,`top`),onMouseleave:$,onFocus:t[71]||=e=>J.value.showTooltips&&Q(`setItalic`,e,`top`),onBlur:$},[b(e.$slots,`icon-text-italic`,{},()=>[t[108]||=m(`svg`,{width:`100%`,height:`44`,viewBox:`0 0 24 24`,"stroke-width":`2`,stroke:`currentColor`,fill:`none`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[m(`path`,{stroke:`none`,d:`M0 0h24v24H0z`,fill:`none`}),m(`path`,{d:`M11 5l6 0`}),m(`path`,{d:`M7 19l6 0`}),m(`path`,{d:`M14 5l-4 14`})],-1)],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setItalic`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeTextItalic),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38)])):f(``,!0),N.value?(v(),p(`div`,pt,[m(`button`,{class:g({"button-tool":!0,"button-tool--selected":Ht.value,tooltip:!0}),style:_({background:Ht.value?q.value.shapes.selected.backgroundColor:q.value.shapes.backgroundColor,border:Ht.value?q.value.shapes.selected.border:q.value.shapes.border,color:Ht.value?q.value.shapes.selected.color:q.value.shapes.color,borderRadius:`${q.value.borderRadius}px`,cursor:Y.value?`pointer`:`default`}),onClick:t[72]||=e=>{D.value=!1,k.value=!1,A.value=!1,O.value=!1,j.value=!1,w.value=void 0,Ht.value=!Ht.value,Pr()},onMouseenter:t[73]||=e=>J.value.showTooltips&&Q(`setUnderline`,e,`top`),onMouseleave:$,onFocus:t[74]||=e=>J.value.showTooltips&&Q(`setUnderline`,e,`top`),onBlur:$},[b(e.$slots,`icon-text-underline`,{},()=>[t[109]||=m(`svg`,{width:`100%`,viewBox:`0 0 24 24`,"stroke-width":`2`,stroke:`currentColor`,fill:`none`,"stroke-linecap":`round`,"stroke-linejoin":`round`},[m(`path`,{stroke:`none`,d:`M0 0h24v24H0z`,fill:`none`}),m(`path`,{d:`M7 5v5a5 5 0 0 0 10 0v-5`}),m(`path`,{d:`M5 19h14`})],-1)],!0),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setUnderline`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeTextUnderline),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)],38)])):f(``,!0),m(`div`,mt,[m(`button`,{class:g({"button-tool":!0,tooltip:!0}),style:{borderRadius:`6px`},onMouseenter:t[77]||=e=>J.value.showTooltips&&Q(`setColor`,e,`top`),onMouseleave:$,onFocus:t[78]||=e=>J.value.showTooltips&&Q(`setColor`,e,`top`),onBlur:$},[oe(ne,{value:hn.value,"onUpdate:value":[t[75]||=e=>hn.value=e,t[76]||=e=>Ar(e)],backgroundColor:J.value.backgroundColor,buttonBorderColor:J.value.color,isCursorPointer:Y.value,palette:J.value.palette,teleported:``},{"annotator-action-color":S(({color:t})=>[b(e.$slots,`icon-color`,le(se({color:t,backgroundColor:hn.value})),void 0,!0)]),_:3},8,[`value`,`backgroundColor`,`buttonBorderColor`,`isCursorPointer`,`palette`])],32),J.value.showTooltips?(v(),d(C,{key:0,show:U.value&&W.value===`setColor`,x:G.value.x,y:G.value.y-6,placement:`top`,styleObject:X.value},{default:S(()=>[h(x(K.value.translations.tooltipShapeColor),1)]),_:1},8,[`show`,`x`,`y`,`styleObject`])):f(``,!0)]),m(`div`,ht,[m(`label`,gt,[h(x(K.value.translations.colorAlpha)+`: `+x($t.value>98?100:$t.value)+` % `,1),_e(m(`input`,{name:`colorTransparency`,type:`range`,"onUpdate:modelValue":t[79]||=e=>$t.value=e,onInput:Mr,min:0,max:100,style:_({width:`100%`,accentColor:J.value.color+` !important`})},null,36),[[he,$t.value]])])])])])],8,[`to`])):f(``,!0)]),m(`div`,{class:`annotator annotator__wrapper`,ref_key:`drawSvgContainer`,ref:wr,style:{position:`relative`},id:kt.value,"data-annotator-content":``},[m(`div`,{class:`annotator__content-layer`,style:_(`${M.value?`pointer-events: none;`:``}`)},[b(e.$slots,`default`,{},void 0,!0)],4),M.value||K.value.alwaysVisible?(v(),p(`svg`,{id:`annotatorSvg`,key:Gt.value,ref_key:`mainSvg`,ref:bn,class:g({annotator__overlay:!0,"annotator__overlay--inactive":!M.value,draw:!0,"draw--free":w.value===`line`}),viewBox:`0 0 ${qt.value} ${Kt.value}`,width:Xt.value,height:Zt.value,onPointerdown:t[83]||=e=>mr(e),onPointerup:t[84]||=e=>Dr(e),onTouchend:t[85]||=e=>Dr(e),onTouchstart:t[86]||=e=>Fr(e),onPointermove:t[87]||=e=>{Fr(e),vr(e)},onPointerout:t[88]||=e=>fr(e),onPointerover:t[89]||=e=>qn(e),onClick:t[90]||=e=>er(e),style:_({position:`absolute`,top:0,left:0,cursor:vn.value,fontFamily:`Helvetica`,zIndex:1e8,pointerEvents:M.value?`all`:`none`})},[m(`rect`,{class:`annotator__glass`,x:`0`,y:`0`,width:qt.value,height:Kt.value,fill:`transparent`,"pointer-events":M.value?`all`:`none`,style:{cursor:`inherit`},onPointerdown:t[80]||=ve(e=>mr(e),[`stop`,`prevent`]),onPointermove:t[81]||=ve(e=>{Fr(e),vr(e)},[`stop`,`prevent`]),onPointerup:ve(Dr,[`stop`,`prevent`]),onClick:t[82]||=ve(e=>er(e),[`stop`,`prevent`])},null,40,yt),(v(!0),p(re,null,fe(Pn.value,e=>(v(),p(`g`,{key:e.id,innerHTML:e.html,style:_({pointerEvents:M.value?null:`none`}),onClick:t=>Cr(t,e.id),onDblclick:ve(t=>Sr(t,e.id),[`stop`,`prevent`])},null,44,bt))),128)),H.value&&P.value?(v(),p(`line`,{key:0,class:`vue-ui-annotator-caret`,x1:H.value.x,x2:H.value.x,y1:H.value.y1,y2:H.value.y2,stroke:H.value.color,"stroke-width":`2`,"pointer-events":`none`,"vector-effect":`non-scaling-stroke`},null,8,xt)):f(``,!0)],46,vt)):f(``,!0),Vt.value||pe(At)?(v(),p(`svg`,{key:1,style:{position:`absolute`,top:`0`,left:`0`},height:Zt.value,viewBox:`0 0 ${qt.value} ${Kt.value}`,width:Xt.value,"data-dom-to-png-ignore":``},[m(`circle`,{class:`animated-circle-print`,cx:qt.value/2,cy:Kt.value/2,r:`50`,stroke:`#6376DD`,"stroke-width":`10`,fill:`none`},null,8,Ct)],8,St)):f(``,!0)],8,_t)]))}},[[`__scopeId`,`data-v-9a06c054`]]);export{xe as n,Dt as t};

package/dist/vue-ui-bullet-yvY_gdw2.js

@@ -0,0 +1,34 @@
+import{t as e}from"./rolldown-runtime-DK3Fl9T5.js";import{t}from"./useConfig-DM9fSqjh.js";import{$ as n,Ft as r,S as i,X as a,_ as ee,at as te,i as o,in as ne,t as re,yt as ie,zt as ae}from"./lib-DqD8nbyX.js";import{n as oe,t as se}from"./BaseScanner-8NdoBs7B.js";import{n as ce}from"./useHints-BH9r_0Vd.js";import{t as le}from"./_plugin-vue_export-helper-BDNMzG2s.js";import{t as ue}from"./resolveChartConfig-ChGWTt5l.js";import{t as de}from"./chartImage-r-G4CkRK.js";import{n as fe}from"./Title-BLA0tM3g.js";import{t as pe}from"./useChartExport-DtPNpc9M.js";import{n as me,t as he}from"./annotationSlots-BRR85CqJ.js";import{n as ge,t as _e}from"./userOptionsSlots-DYuo-E5m.js";import{t as ve}from"./usePrinter-Cj4eIYC_.js";import{l as ye,t as be}from"./useResponsive-D2CPcpda.js";import{t as xe}from"./useUserOptionState-CXlFnwPv.js";import{t as Se}from"./useChartAccessibility-DOMuYJfm.js";import{t as Ce}from"./Legend-D8NunRPr.js";import{t as we}from"./vue_ui_bullet-CwVYkpjd.js";import{Fragment as s,Teleport as Te,computed as c,createBlock as l,createCommentVNode as u,createElementBlock as d,createElementVNode as f,createSlots as Ee,createVNode as De,defineAsyncComponent as p,guardReactiveProps as m,normalizeClass as Oe,normalizeProps as h,normalizeStyle as g,onBeforeUnmount as ke,onMounted as Ae,openBlock as _,ref as v,renderList as y,renderSlot as b,toDisplayString as x,toRefs as je,unref as S,watch as Me,withCtx as C}from"vue";var Ne=/* @__PURE__ */ e({default:()=>w}),Pe=[`id`],Fe={key:1,ref:`noTitle`,class:`vue-data-ui-no-title-space`,style:`height:36px; width: 100%;background:transparent`},Ie=[`id`],Le=[`xmlns`,`viewBox`,`aria-labelledby`,`aria-describedby`],Re=[`id`],ze=[`id`],Be=[`width`,`height`],Ve={key:1},He=[`x`,`y`,`height`,`width`,`fill`,`stroke`],Ue=[`x`,`y`,`height`,`width`,`rx`,`fill`,`stroke`,`stroke-width`],We=[`x`,`y`,`height`,`width`,`fill`,`stroke`,`stroke-width`],Ge=[`x`,`y`,`font-size`,`font-weight`,`fill`],Ke=[`x`,`y`,`height`,`width`,`rx`,`fill`,`stroke`,`stroke-width`],qe={key:3},Je=[`x`,`y`,`fill`,`font-size`,`font-weight`],Ye={key:4},Xe=[`x1`,`x2`,`y1`,`y2`,`stroke`],Ze={key:4,class:`vue-data-ui-watermark`},Qe=[`id`],$e={key:0,class:`vue-ui-bullet-legend-item`,dir:`auto`},et={style:{"margin-right":`2px`}},w=/*#__PURE__*/ le({__name:`vue-ui-bullet`,props:{config:{type:Object,default(){return{}}},dataset:{type:Object,default(){return{}}}},emits:[`copyAlt`],setup(e,{expose:le,emit:Ne}){let w=p(()=>import(`./PackageVersion-ATrKWi8V.js`).then(e=>e.t)),tt=p(()=>import(`./PenAndPaper-BsBFp16i.js`).then(e=>e.t)),nt=p(()=>import(`./UserOptions-BSJ_S_us.js`).then(e=>e.n)),{vue_ui_bullet:rt}=t(),T=e,it=Ne,E=v(null),at=v(null),ot=v(0),st=v(null),ct=v(null),lt=v(0),D=v(null),O=v(null),ut=v(!1),k=c({get:()=>B.value.hasOwnProperty(`value`),set:e=>e}),A=v(R()),j=c(()=>A.value.debug),M=c(()=>A.value.style.chart.target),N=c(()=>A.value.style.chart.segments),P=c(()=>A.value.style.chart),F=c(()=>A.value.userOptions),I=c(()=>B.value.segments?Array.isArray(B.value.segments)?B.value.segments.length?!0:(j.value&&console.warn(`VueUiBullet: dataset segments is empty. Provide segments with this datastructure:
+
+    segments: [
+        {
+            name: string;
+            from: number;
+            to: number;
+            color?: string;
+        },
+        {...}
+    ]
+            `),k.value=!1,!1):(j.value&&console.warn(`VueUiBullet: dataset segments must be an array of objects with this datastructure:
+
+    segments: [
+        {
+            name: string;
+            from: number;
+            to: number;
+            color?: string;
+        },
+        {...}
+    ] 
+            `),k.value=!1,!1):(j.value&&console.warn(`VueUiBullet: dataset segments is empty. Provide segments with this datastructure:
+
+    segments: [
+        {
+            name: string;
+            from: number;
+            to: number;
+            color?: string;
+        },
+        {...}
+    ]
+            `),k.value=!1,!1)),dt=c(()=>{let{top:e,right:t,bottom:n,left:r}=P.value.padding;return{top:e,right:t,bottom:n,left:r}});function ft(){if(ae(B.value)?(te({componentName:`VueUiBullet`,type:`dataset`,debug:j.value}),V.value=!0):I.value?B.value.segments.forEach((e,t)=>{ie({datasetObject:e,requiredAttributes:[`name`,`from`,`to`]}).forEach(e=>{k.value=!1,te({componentName:`VueUiBullet segment`,type:`datasetSerieAttribute`,property:e,index:t,debug:j.value})})}):(k.value=!1,V.value=!0),ae(B.value)||(V.value=A.value.loading),A.value.responsive){let e=ye(()=>{let{width:e,height:t}=be({chart:E.value,title:P.value.title.text?at.value:null,legend:P.value.legend.show?st.value:null,source:ct.value,padding:dt.value}),n=(P.value.legend.show?24:0)||12;requestAnimationFrame(()=>{W.value.width=e,W.value.height=t-n})});D.value&&(O.value&&D.value.unobserve(O.value),D.value.disconnect()),D.value=new ResizeObserver(e),O.value=E.value.parentNode,D.value.observe(O.value)}P.value.animation.show&&!z.value&&St(B.value.value||0)}Ae(()=>{ut.value=!0,ft()});let L=v(a());function R(){return ue(T.config,rt,we)}ce({config:()=>A.value,dataset:()=>T.dataset,component:`VueUiBullet`,rules:[{test:e=>e?.segments&&e?.segments.length>8,message:[`👀 The number of target segments is > 8, which can make the chart hard to read and a large legend. Consider:`,``,`▶️ Using broader segments.`]}]});let pt=c(()=>A.value.userOptions.useCursorPointer),mt=c(()=>ne({defaultConfig:{userOptions:{show:!1},style:{chart:{backgroundColor:`#99999930`,segments:{dataLabels:{show:!1},ticks:{stroke:`#8A8A8A`}},valueBar:{label:{show:!1}}}}},userConfig:A.value.skeletonConfig??{}})),{loading:z,FINAL_DATASET:B,manualLoading:V}=oe({...je(T),FINAL_CONFIG:A,prepareConfig:R,skeletonDataset:T.config?.skeletonDataset??{value:100,target:100,segments:[{name:``,from:0,to:33,color:`#AAAAAA`},{name:``,from:33,to:66,color:`#BABABA`},{name:``,from:66,to:100,color:`#CACACA`}]},skeletonConfig:ne({defaultConfig:A.value,userConfig:mt.value})}),{userOptionsVisible:H,setUserOptionsVisibility:ht,keepUserOptionState:gt}=xe({config:A.value}),{svgRef:U}=Se({config:P.value.title}),W=v({width:P.value.width,height:P.value.height}),_t=c(()=>W.value.width),vt=c(()=>W.value.height);Me(()=>T.config,e=>{z.value||(A.value=R()),H.value=!A.value.userOptions.showOnChartHover,W.value.width=P.value.width,W.value.height=P.value.height,ft(),ot.value+=1},{deep:!0});let G=c(()=>{let e=vt.value,t=_t.value,n=P.value.padding.left,r=t-P.value.padding.right,i=P.value.padding.top,a=e-P.value.padding.bottom;return{height:Math.max(.001,e),width:Math.max(.001,t),left:n,right:r,top:i,bottom:a,chartWidth:Math.max(.001,r-n),chartHeight:Math.max(.001,a-i)}}),yt=c(()=>{if(!I.value)return[];let e=[];for(let t=0;t<B.value.segments.length;t+=1)e.push(r(N.value.baseColor,t/B.value.segments.length));return e}),K=c(()=>I.value?{min:Math.min(...B.value.segments.map(e=>e.from)),max:Math.max(...B.value.segments.map(e=>e.to))}:{min:0,max:1}),q=v(bt());Me(()=>B.value,e=>{e.hasOwnProperty(`value`)&&(V.value=!1),P.value.animation.show&&!z.value?St(e.value||0):q.value=e.value||0},{deep:!0});function bt(){return P.value.animation.show&&!z.value?K.value.min:B.value.value||0}let xt=v(null);function St(e){let t=Math.abs(e-q.value)/P.value.animation.animationFrames;function n(){q.value<e?q.value=Math.min(q.value+t,e):q.value>e&&(q.value=Math.max(q.value-t,e)),q.value!==e&&(xt.value=requestAnimationFrame(n))}n()}ke(()=>{cancelAnimationFrame(xt.value)});let J=c(()=>{if(!I.value)return[];let e=ee(K.value.min,K.value.max,N.value.ticks.divisions),t=e.min>=0?0:Math.abs(e.min);return{scale:e,target:{x:G.value.left+(B.value.target+t)/(e.max+t)*G.value.chartWidth-M.value.width/2},value:{width:(q.value+t)/(e.max+t)*G.value.chartWidth},ticks:e.ticks.map(n=>({value:n,y:G.value.bottom+N.value.dataLabels.fontSize+3+N.value.dataLabels.offsetY,x:G.value.left+(n+t)/(e.max+t)*G.value.chartWidth})),chunks:B.value.segments.map((n,r)=>({...n,color:n.color?i(n.color):yt.value[r],x:G.value.left+G.value.chartWidth*((n.from+t)/(e.max+t)),y:G.value.top,height:G.value.chartHeight,width:G.value.chartWidth*(Math.abs(n.to-n.from)/(e.max+t))}))}}),Y=c(()=>!J.value||!J.value.chunks||!J.value.chunks.length?[]:J.value.chunks.map(e=>{let t=`${o(N.value.dataLabels.formatter,e.from,n({p:N.value.dataLabels.prefix,v:e.from,s:N.value.dataLabels.suffix,r:N.value.dataLabels.rounding}))} — ${o(N.value.dataLabels.formatter,e.to,n({p:N.value.dataLabels.prefix,v:e.to,s:N.value.dataLabels.suffix,r:N.value.dataLabels.rounding}))}`;return{...e,shape:`square`,value:t,display:`${e.name}: ${t}`}})),Ct=c(()=>({cy:`bullet-div-legend`,backgroundColor:`transparent`,color:P.value.legend.color,fontSize:P.value.legend.fontSize,paddingBottom:6,fontWeight:P.value.legend.bold?`bold`:``})),{isPrinting:X,isImaging:Z,generatePdf:wt,generateImage:Tt}=ve({elementId:`bullet_${L.value}`,fileName:P.value.title.text||`vue-ui-bullet`,options:A.value.userOptions.print}),Et=c(()=>A.value.userOptions.show&&!P.value.title.text),Q=v(!1);function Dt(e){Q.value=e,lt.value+=1}function Ot(){return J.value}let $=v(!1);function kt(){$.value=!$.value}let At=de(E,()=>P.value.title.text),jt=c(()=>Y.value.map(e=>({...e,name:e.display}))),Mt=c(()=>P.value.backgroundColor),Nt=c(()=>P.value.legend),Pt=c(()=>P.value.title),{isCallbackImaging:Ft,isCallbackSvg:It,generateSvg:Lt,onGenerateImage:Rt}=pe({svg:U,title:Pt,legend:Nt,legendItems:jt,backgroundColor:Mt,getSvgCallback:()=>A.value.userOptions.callbacks.svg,generateImage:Tt});async function zt(){if(it(`copyAlt`,{config:A.value,dataset:B.value}),!A.value.userOptions.callbacks.altCopy){console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");return}await Promise.resolve(A.value.userOptions.callbacks.altCopy({config:A.value,dataset:B.value}))}return le({getData:Ot,getImage:At,generatePdf:wt,generateImage:Tt,generateSvg:Lt,toggleAnnotator:kt,toggleFullscreen:Dt,copyAlt:zt}),(e,t)=>(_(),d(`div`,{ref_key:`bulletChart`,ref:E,class:Oe(`vue-data-ui-component vue-ui-bullet ${Q.value?`vue-data-ui-wrapper-fullscreen`:``}`),style:g(`font-family:${A.value.style.fontFamily};width:100%;background:${P.value.backgroundColor};${A.value.responsive?`height:100%`:``}`),id:`bullet_${L.value}`,onMouseenter:t[0]||=()=>S(ht)(!0),onMouseleave:t[1]||=()=>S(ht)(!1)},[F.value.buttons.annotator?(_(),l(S(tt),{key:0,svgRef:S(U),backgroundColor:P.value.backgroundColor,color:P.value.color,active:$.value,isCursorPointer:pt.value,palette:F.value.annotatorPalette,onClose:kt},Ee({_:2},[y(S(he),t=>({name:t,fn:C(n=>[b(e.$slots,t,h(m(S(me)(t,n))),void 0,!0)])}))]),1032,[`svgRef`,`backgroundColor`,`color`,`active`,`isCursorPointer`,`palette`])):u(``,!0),Et.value?(_(),d(`div`,Fe,null,512)):u(``,!0),P.value.title.text?(_(),d(`div`,{key:2,ref_key:`chartTitle`,ref:at,style:`width:100%;background:transparent;`},[(_(),l(fe,{lineHeight:`1.3rem`,key:`title_${ot.value}`,config:{title:{cy:`bullet-div-title`,...P.value.title},subtitle:{cy:`bullet-div-subtitle`,...P.value.title.subtitle}}},null,8,[`config`]))],512)):u(``,!0),f(`div`,{id:`legend-top-${L.value}`},null,8,Ie),F.value.show&&k.value&&(S(gt)||S(H))?(_(),l(S(nt),{key:3,ref:`details`,backgroundColor:P.value.backgroundColor,color:P.value.color,isPrinting:S(X),isImaging:S(Z),uid:L.value,hasTooltip:!1,hasPdf:F.value.buttons.pdf,hasImg:F.value.buttons.img,hasSvg:F.value.buttons.svg,hasXls:!1,hasTable:!1,hasLabel:!1,hasFullscreen:F.value.buttons.fullscreen,hasAltCopy:F.value.buttons.altCopy,isFullscreen:Q.value,chartElement:E.value,position:F.value.position,titles:{...F.value.buttonTitles},hasAnnotator:F.value.buttons.annotator,isAnnotation:$.value,callbacks:F.value.callbacks,printScale:F.value.print.scale,isCursorPointer:pt.value,onToggleFullscreen:Dt,onGeneratePdf:S(wt),onGenerateImage:S(Rt),onGenerateSvg:S(Lt),onToggleAnnotator:kt,onCopyAlt:zt,style:g({visibility:S(gt)?S(H)?`visible`:`hidden`:`visible`})},Ee({_:2},[y(S(ge)(e.$slots,`menuIcon optionPdf optionImg optionSvg optionFullscreen optionAnnotator optionAltCopy custom-menu-before custom-menu-after`),t=>({name:t,fn:C(n=>[b(e.$slots,t,h(m(S(_e)(t,n))),void 0,!0)])}))]),1032,[`backgroundColor`,`color`,`isPrinting`,`isImaging`,`uid`,`hasPdf`,`hasImg`,`hasSvg`,`hasFullscreen`,`hasAltCopy`,`isFullscreen`,`chartElement`,`position`,`titles`,`hasAnnotator`,`isAnnotation`,`callbacks`,`printScale`,`isCursorPointer`,`onGeneratePdf`,`onGenerateImage`,`onGenerateSvg`,`style`])):u(``,!0),(_(),d(`svg`,{ref_key:`svgRef`,ref:U,xmlns:S(re),class:Oe({"vue-data-ui-fullscreen--on":Q.value,"vue-data-ui-fulscreen--off":!Q.value,"vue-ui-bullet-svg":!0}),viewBox:`0 0 ${G.value.width} ${G.value.height}`,style:g(`width: 100%; overflow: visible; background:transparent;color:${P.value.color}`),"aria-labelledby":`bullet-svg-title-${L.value}`,"aria-describedby":`bullet-svg-desc-${L.value}`},[De(S(w)),f(`title`,{id:`bullet-svg-title-${L.value}`},x(P.value.title.text||`Bullet chart`),9,Re),f(`desc`,{id:`bullet-svg-desc-${L.value}`},` Value: `+x(q.value)+`, Target: `+x(J.value.target?.value),9,ze),e.$slots[`chart-background`]?(_(),d(`foreignObject`,{key:0,x:0,y:0,width:G.value.width,height:G.value.height,style:{pointerEvents:`none`}},[b(e.$slots,`chart-background`,{},void 0,!0)],8,Be)):u(``,!0),I.value?(_(),d(`g`,Ve,[(_(!0),d(s,null,y(J.value.chunks,e=>(_(),d(`rect`,{x:e.x,y:e.y,height:e.height,width:e.width,fill:e.color,"stroke-width":1,stroke:P.value.backgroundColor,style:{transition:`x 0.3s ease-in-out, width 0.3s ease-in-out`}},null,8,He))),256)),!M.value.onTop&&M.value.show?(_(),d(`rect`,{key:0,x:J.value.target.x,y:G.value.top+(G.value.chartHeight-G.value.chartHeight*M.value.heightRatio)/2,height:G.value.chartHeight*M.value.heightRatio,width:M.value.width,rx:M.value.rounded?M.value.width/2:0,fill:M.value.color,stroke:M.value.stroke,"stroke-width":M.value.strokeWidth},null,8,Ue)):u(``,!0),f(`rect`,{x:G.value.left,y:G.value.top+(G.value.chartHeight-G.value.chartHeight*P.value.valueBar.heightRatio)/2,height:G.value.chartHeight*P.value.valueBar.heightRatio,width:J.value.value.width,fill:P.value.valueBar.color,stroke:P.value.valueBar.stroke,"stroke-width":P.value.valueBar.strokeWidth},null,8,We),P.value.valueBar.label.show?(_(),d(`text`,{key:1,x:G.value.left+J.value.value.width,y:G.value.top-6+P.value.valueBar.label.offsetY,"font-size":P.value.valueBar.label.fontSize,"font-weight":P.value.valueBar.label.bold?`bold`:`normal`,fill:P.value.valueBar.label.color,"text-anchor":`middle`},x(S(o)(N.value.dataLabels.formatter,q.value,S(n)({p:N.value.dataLabels.prefix,v:q.value,s:N.value.dataLabels.suffix,r:N.value.dataLabels.rounding}))),9,Ge)):u(``,!0),M.value.onTop&&M.value.show?(_(),d(`rect`,{key:2,x:J.value.target.x,y:G.value.top+(G.value.chartHeight-G.value.chartHeight*M.value.heightRatio)/2,height:G.value.chartHeight*M.value.heightRatio,width:M.value.width,rx:M.value.rounded?M.value.width/2:0,fill:M.value.color,stroke:M.value.stroke,"stroke-width":M.value.strokeWidth,style:{transition:`x 0.3s ease-in-out`}},null,8,Ke)):u(``,!0),N.value.dataLabels.show?(_(),d(`g`,qe,[(_(!0),d(s,null,y(J.value.ticks,e=>(_(),d(`text`,{x:e.x,y:e.y,"text-anchor":`middle`,fill:N.value.dataLabels.color,"font-size":N.value.dataLabels.fontSize+`px`,"font-weight":N.value.dataLabels.bold?`bold`:`normal`},x(S(o)(N.value.dataLabels.formatter,e.value,S(n)({p:N.value.dataLabels.prefix,v:e.value,s:N.value.dataLabels.suffix,r:N.value.dataLabels.rounding}))),9,Je))),256))])):u(``,!0),N.value.dataLabels.show&&N.value.ticks.show?(_(),d(`g`,Ye,[(_(!0),d(s,null,y(J.value.ticks,e=>(_(),d(`line`,{x1:e.x,x2:e.x,y1:G.value.bottom,y2:G.value.bottom+3,stroke:N.value.ticks.stroke,"stroke-width":1,"stroke-linecap":`round`},null,8,Xe))),256))])):u(``,!0)])):u(``,!0),b(e.$slots,`svg`,{svg:{...G.value,isPrintingImg:S(X)||S(Z)||S(Ft),isPrintingSvg:S(It)}},void 0,!0)],14,Le)),e.$slots.watermark?(_(),d(`div`,Ze,[b(e.$slots,`watermark`,h(m({isPrinting:S(X)||S(Z)||S(Ft)||S(It)})),void 0,!0)])):u(``,!0),f(`div`,{id:`legend-bottom-${L.value}`},null,8,Qe),ut.value&&(P.value.legend.show||e.$slots.legend)?(_(),l(Te,{key:5,to:P.value.legend.position===`top`?`#legend-top-${L.value}`:`#legend-bottom-${L.value}`},[f(`div`,{ref_key:`chartLegend`,ref:st},[b(e.$slots,`legend`,{legend:Y.value},()=>[P.value.legend.show?(_(),l(Ce,{key:0,clickable:!1,legendSet:Y.value,config:Ct.value},{item:C(({legend:e})=>[S(z)?u(``,!0):(_(),d(`div`,$e,[f(`span`,et,x(e.name)+`:`,1),f(`span`,null,x(e.value),1)]))]),_:1},8,[`legendSet`,`config`])):u(``,!0)],!0)],512)],8,[`to`])):u(``,!0),e.$slots.source?(_(),d(`div`,{key:6,ref_key:`source`,ref:ct,dir:`auto`},[b(e.$slots,`source`,{},void 0,!0)],512)):u(``,!0),b(e.$slots,`skeleton`,{},()=>[S(z)?(_(),l(se,{key:0})):u(``,!0)],!0)],46,Pe))}},[[`__scopeId`,`data-v-3432ada7`]]);export{Ne as n,w as t};