@linkurious/ogma-annotations 2.1.1 → 2.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -173,6 +173,15 @@ export declare interface BoxStyle extends StrokeOptions {
173
173
  */
174
174
  export declare const brighten: (color: Color) => RgbaColor;
175
175
 
176
+ /**
177
+ * Move `el` to the end of `root`'s children. SVG paint order is DOM order,
178
+ * so this is how a shape gets raised to the top of its group. Safe to call
179
+ * every render even when `el` is already last - `appendChild` on an
180
+ * existing child just re-positions it, it doesn't clone or re-trigger
181
+ * insertion.
182
+ */
183
+ export declare function bringToTop(root: Element, el: Element): void;
184
+
176
185
  /**
177
186
  * Calculate optimal zoom threshold for auto-collapse based on comment dimensions
178
187
  *
@@ -324,6 +333,14 @@ export declare interface CommentStyle extends TextStyle {
324
333
  shadow?: boolean;
325
334
  /** Expand to full width when selected (default: false) */
326
335
  expandOnSelect?: boolean;
336
+ /**
337
+ * Connector-line behavior when the attachment point moves (default: "rigid").
338
+ * - "rigid": the comment translates by the same offset as the moved
339
+ * attachment point — the arrow keeps its length/angle, whole callout moves.
340
+ * - "elastic": the comment stays put; the arrow re-anchors to the nearest
341
+ * point on the comment box, so the line can stretch/rotate.
342
+ */
343
+ connectorMode?: "rigid" | "elastic";
327
344
  }
328
345
 
329
346
  /**
@@ -1472,6 +1489,42 @@ export { getBoxSize as getTextSize }
1472
1489
  /** @private */
1473
1490
  export declare function getBrowserWindow(): HTMLElement | undefined;
1474
1491
 
1492
+ /**
1493
+ * Ids that removing `id` should take with it: `id` itself, plus every arrow
1494
+ * attached to it when it's a comment or text annotation - deleting the
1495
+ * anchor takes its connectors along, since a detached comment-arrow has
1496
+ * nothing to point at.
1497
+ *
1498
+ * @param features - The full feature map (pre-deletion)
1499
+ * @param id - The id being removed
1500
+ * @returns The complete set of ids to delete
1501
+ */
1502
+ export declare function getCascadeDeleteIds(features: Record<Id, Annotation>, id: Id): Set<Id>;
1503
+
1504
+ /**
1505
+ * Comments must always keep at least one arrow. Returns the comment's id
1506
+ * when deleting `arrowId` would leave it with none, so the caller can block
1507
+ * the deletion instead - or `null` when it's safe to proceed.
1508
+ *
1509
+ * @param features - The full feature map (pre-deletion)
1510
+ * @param arrowId - The arrow being removed
1511
+ */
1512
+ export declare function getCommentLeftOrphanedBy(features: Record<Id, Annotation>, arrowId: Id): Id | null;
1513
+
1514
+ /**
1515
+ * Get the id of the comment an arrow is connected to, if any.
1516
+ *
1517
+ * A comment is one visual annotation together with the arrow that connects
1518
+ * it - callers that raise a comment's z-order (e.g. bringing a newly
1519
+ * created/selected comment to the front) should raise this arrow along with
1520
+ * it, not just the comment bubble.
1521
+ *
1522
+ * @param arrow - The arrow feature to check
1523
+ * @returns The linked comment's id, or undefined if the arrow isn't attached
1524
+ * to a comment
1525
+ */
1526
+ export declare function getCommentLinkId(arrow: Arrow): Id | undefined;
1527
+
1475
1528
  /**
1476
1529
  * Get the position (center) of a comment
1477
1530
  *
@@ -1567,9 +1620,8 @@ export declare const isComment: (a: AnnotationFeature<Geometry, AnnotationProps>
1567
1620
  * These functions provide utilities for:
1568
1621
  * - Checking if an arrow is connected to a comment
1569
1622
  * - Determining if arrow endpoints can be detached from comments
1570
- *
1571
- * Note: The core rule "comments must have at least one arrow" is enforced
1572
- * in store/index.ts removeFeature() method, not here.
1623
+ * - Cascading a comment's delete to its arrows, and blocking deletion of a
1624
+ * comment's last remaining arrow (store/index.ts:removeFeature uses both)
1573
1625
  */
1574
1626
  /**
1575
1627
  * Check if an arrow is connected to a comment
@@ -1603,6 +1655,16 @@ export declare function isRgbaColor(color: string): color is RgbaColor;
1603
1655
  */
1604
1656
  export declare function isRgbColor(color: string): color is RgbColor;
1605
1657
 
1658
+ /**
1659
+ * Whether a comment's connector line should rigidly follow its attachment
1660
+ * point (translate the comment by the same offset) rather than elastically
1661
+ * re-anchoring to the nearest point on the comment box.
1662
+ *
1663
+ * @param comment - Comment annotation
1664
+ * @returns True unless the comment's style explicitly sets `connectorMode: "elastic"`
1665
+ */
1666
+ export declare function isRigidConnector(comment: Comment_2): boolean;
1667
+
1606
1668
  export declare const isText: (a: AnnotationFeature<Geometry, AnnotationProps>) => a is Text_2;
1607
1669
 
1608
1670
  /** @private */
@@ -346,6 +346,14 @@ declare interface CommentStyle extends TextStyle {
346
346
  shadow?: boolean;
347
347
  /** Expand to full width when selected (default: false) */
348
348
  expandOnSelect?: boolean;
349
+ /**
350
+ * Connector-line behavior when the attachment point moves (default: "rigid").
351
+ * - "rigid": the comment translates by the same offset as the moved
352
+ * attachment point — the arrow keeps its length/angle, whole callout moves.
353
+ * - "elastic": the comment stays put; the arrow re-anchors to the nearest
354
+ * point on the comment box, so the line can stretch/rotate.
355
+ */
356
+ connectorMode?: "rigid" | "elastic";
349
357
  }
350
358
 
351
359
  /**
package/dist/ui.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var B=Object.defineProperty;var N=(r,t,e)=>t in r?B(r,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):r[t]=e;var a=(r,t,e)=>N(r,typeof t!="symbol"?t+"":t,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const D=require("vanilla-colorful/lib/entrypoints/rgba"),l=require("./Polygon-D6lGfOCn.cjs"),m="rgba-color-picker";class F extends D.RgbaBase{}function E(){return customElements.get(m)||customElements.define(m,F),document.createElement(m)}const C=[{value:"#f5f5f5",style:"--circle-color: #f5f5f5;"},{value:"#EDE6FF",style:"--circle-color: #EDE6FF;"},{value:"transparent",style:"--circle-color: white; border: 2px dashed #ccc;"}],y=[{value:"sans-serif",label:"Sans Serif",icon:"type"},{value:"serif",label:"Serif",icon:"italic"},{value:"monospace",label:"Monospace",icon:"code"}],b=[{value:"none",label:"None",icon:"x"},{value:"arrow",label:"Open Arrow",icon:"arrow-left"},{value:"arrow-plain",label:"Filled Arrow",icon:"play"},{value:"halo-dot",label:"Halo Dot",icon:"circle-dot"},{value:"dot",label:"Dot",icon:"dot"}],k=[{value:"plain",icon:"circle"},{value:"dashed",icon:"circle-dashed"}],A=["#0099FF","#FF7523","#44AA99"];function S(r){return`rgba(${r.r}, ${r.g}, ${r.b}, ${r.a})`}const w=3;function x(){return{colors:[...A],activeIndex:0}}function T(r,t){const e=r.colors.indexOf(t);return e===-1?{colors:[t,...r.colors].slice(0,w),activeIndex:0}:{colors:r.colors,activeIndex:e}}const M={"chevron-down":'<path d="m6 9 6 6 6-6"/>',x:'<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',"arrow-left":'<path d="m12 19-7-7 7-7"/><path d="M19 12H5"/>',"arrow-right":'<path d="M5 12h14"/><path d="m12 5 7 7-7 7"/>',play:'<polygon points="6 3 20 12 6 21 6 3"/>',"circle-dot":'<circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="1"/>',dot:'<circle cx="12.1" cy="12.1" r="1"/>',circle:'<circle cx="12" cy="12" r="10"/>',"circle-dashed":'<path d="M10.1 2.182a10 10 0 0 1 3.8 0"/><path d="M13.9 21.818a10 10 0 0 1-3.8 0"/><path d="M17.609 3.721a10 10 0 0 1 2.69 2.7"/><path d="M2.182 13.9a10 10 0 0 1 0-3.8"/><path d="M20.279 17.609a10 10 0 0 1-2.7 2.69"/><path d="M21.818 10.1a10 10 0 0 1 0 3.8"/><path d="M3.721 6.391a10 10 0 0 1 2.7-2.69"/><path d="M6.391 20.279a10 10 0 0 1-2.69-2.7"/>',type:'<path d="M4 7V4h16v3"/><path d="M9 20h6"/><path d="M12 4v16"/>',italic:'<line x1="19" x2="10" y1="4" y2="4"/><line x1="14" x2="5" y1="20" y2="20"/><line x1="15" x2="9" y1="4" y2="20"/>',code:'<polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/>',trash:'<path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/>',undo:'<path d="M3 7v6h6"/><path d="M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13"/>',redo:'<path d="M21 7v6h-6"/><path d="M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7"/>',pentagon:'<path d="M10.83 2.38a2 2 0 0 1 2.34 0l8 5.74a2 2 0 0 1 .73 2.25l-3.04 9.26a2 2 0 0 1-1.9 1.37H7.04a2 2 0 0 1-1.9-1.37L2.1 10.37a2 2 0 0 1 .73-2.25z"/>',"rectangle-horizontal":'<rect width="20" height="12" x="2" y="6" rx="2"/>',"message-square":'<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>',"sticky-note":'<path d="M21 9a2.4 2.4 0 0 0-.706-1.706l-3.588-3.588A2.4 2.4 0 0 0 15 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2z"/><path d="M15 3v5a1 1 0 0 0 1 1h5"/>',eraser:'<path d="M21 21H8a2 2 0 0 1-1.42-.587l-3.994-3.999a2 2 0 0 1 0-2.828l10-10a2 2 0 0 1 2.829 0l5.999 6a2 2 0 0 1 0 2.828L12.834 21"/><path d="m5.082 11.09 8.828 8.828"/>',download:'<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/>',camera:'<path d="M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z"/><circle cx="12" cy="13" r="3"/>',"rotate-cw":'<path d="M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8"/><path d="M21 3v5h-5"/>',"rotate-ccw":'<path d="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"/><path d="M3 3v5h5"/>',minimize:'<path d="M8 3v3a2 2 0 0 1-2 2H3"/><path d="M21 8h-3a2 2 0 0 1-2-2V3"/><path d="M3 16h3a2 2 0 0 1 2 2v3"/><path d="M16 21v-3a2 2 0 0 1 2-2h3"/>'};function v(r,t=18){return`<svg xmlns="http://www.w3.org/2000/svg" width="${t}" height="${t}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">${M[r]}</svg>`}const _=150;function $(r,{onShow:t,onHide:e}){let o=null,i=null;const n=()=>{i!==null&&(clearTimeout(i),i=null)},s=()=>{n(),o&&(t(o),o=null)},c=h=>{if(n(),h.ids.length===1){const p=r.getAnnotation(h.ids[0]);if(!p)return;if(o=p,r.isDrawing()){r.once("cancelDrawing",s),r.once("completeDrawing",s);return}i=setTimeout(s,_)}else o=null,e()},d=()=>{n(),o=null,e()},u=()=>{n(),o=null,e()};return r.on("select",c),r.on("click",s),r.on("dragend",s),r.on("dragstart",d),r.on("unselect",u),()=>{n(),r.off("select",c),r.off("click",s),r.off("dragend",s),r.off("dragstart",d),r.off("unselect",u),r.off("cancelDrawing",s),r.off("completeDrawing",s)}}const P="right",L="vertical";class R{constructor(t){a(this,"control");a(this,"panel");a(this,"panelBody");a(this,"mode",null);a(this,"currentAnnotation",null);a(this,"currentColor","#0099FF");a(this,"recent",x());a(this,"colorCircles",[]);a(this,"colorPickerOverlay",null);a(this,"colorPicker",null);a(this,"detachVisibility");a(this,"documentClickHandler");a(this,"hide",()=>{this.panel.style.display="none",this.closeColorPicker(),this.currentAnnotation=null,this.mode=null});this.control=t.control;const e=t.container??document.body;this.panel=document.createElement("div"),this.panel.className="annotation-panel",this.panel.style.display="none",this.panel.dataset.placement=t.placement??P,this.panel.dataset.orientation=t.orientation??L,this.panelBody=document.createElement("div"),this.panelBody.className="panel-body",this.panel.appendChild(this.panelBody),e.appendChild(this.panel),this.detachVisibility=$(this.control,{onShow:o=>{this.setAnnotation(o),this.show()},onHide:this.hide}),["click","mousedown","mousemove"].forEach(o=>this.panel.addEventListener(o,i=>i.stopPropagation())),this.documentClickHandler=o=>{this.colorPickerOverlay&&!this.colorPickerOverlay.contains(o.target)&&!this.colorCircles.some(i=>i.contains(o.target))&&this.closeColorPicker(),this.panelBody.querySelectorAll(".custom-select").forEach(i=>i.classList.remove("open"))},document.addEventListener("click",this.documentClickHandler)}setAnnotation(t){this.currentAnnotation=t,l.isArrow(t)?(this.mode="arrow",this.renderArrow(t)):l.isText(t)||l.isBox(t)||l.isComment(t)?(this.mode="text",this.renderText(t)):l.isPolygon(t)&&(this.mode="polygon",this.renderPolygon(t))}renderArrow(t){const e=t.properties.style||{};this.updateColorFromAnnotation(e.strokeColor||l.defaultArrowStyle.strokeColor),this.panelBody.innerHTML=`
1
+ "use strict";var B=Object.defineProperty;var N=(r,t,e)=>t in r?B(r,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):r[t]=e;var a=(r,t,e)=>N(r,typeof t!="symbol"?t+"":t,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const D=require("vanilla-colorful/lib/entrypoints/rgba"),l=require("./Polygon-D4SNG2xn.cjs"),m="rgba-color-picker";class F extends D.RgbaBase{}function E(){return customElements.get(m)||customElements.define(m,F),document.createElement(m)}const C=[{value:"#f5f5f5",style:"--circle-color: #f5f5f5;"},{value:"#EDE6FF",style:"--circle-color: #EDE6FF;"},{value:"transparent",style:"--circle-color: white; border: 2px dashed #ccc;"}],y=[{value:"sans-serif",label:"Sans Serif",icon:"type"},{value:"serif",label:"Serif",icon:"italic"},{value:"monospace",label:"Monospace",icon:"code"}],b=[{value:"none",label:"None",icon:"x"},{value:"arrow",label:"Open Arrow",icon:"arrow-left"},{value:"arrow-plain",label:"Filled Arrow",icon:"play"},{value:"halo-dot",label:"Halo Dot",icon:"circle-dot"},{value:"dot",label:"Dot",icon:"dot"}],k=[{value:"plain",icon:"circle"},{value:"dashed",icon:"circle-dashed"}],A=["#0099FF","#FF7523","#44AA99"];function S(r){return`rgba(${r.r}, ${r.g}, ${r.b}, ${r.a})`}const w=3;function x(){return{colors:[...A],activeIndex:0}}function T(r,t){const e=r.colors.indexOf(t);return e===-1?{colors:[t,...r.colors].slice(0,w),activeIndex:0}:{colors:r.colors,activeIndex:e}}const M={"chevron-down":'<path d="m6 9 6 6 6-6"/>',x:'<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',"arrow-left":'<path d="m12 19-7-7 7-7"/><path d="M19 12H5"/>',"arrow-right":'<path d="M5 12h14"/><path d="m12 5 7 7-7 7"/>',play:'<polygon points="6 3 20 12 6 21 6 3"/>',"circle-dot":'<circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="1"/>',dot:'<circle cx="12.1" cy="12.1" r="1"/>',circle:'<circle cx="12" cy="12" r="10"/>',"circle-dashed":'<path d="M10.1 2.182a10 10 0 0 1 3.8 0"/><path d="M13.9 21.818a10 10 0 0 1-3.8 0"/><path d="M17.609 3.721a10 10 0 0 1 2.69 2.7"/><path d="M2.182 13.9a10 10 0 0 1 0-3.8"/><path d="M20.279 17.609a10 10 0 0 1-2.7 2.69"/><path d="M21.818 10.1a10 10 0 0 1 0 3.8"/><path d="M3.721 6.391a10 10 0 0 1 2.7-2.69"/><path d="M6.391 20.279a10 10 0 0 1-2.69-2.7"/>',type:'<path d="M4 7V4h16v3"/><path d="M9 20h6"/><path d="M12 4v16"/>',italic:'<line x1="19" x2="10" y1="4" y2="4"/><line x1="14" x2="5" y1="20" y2="20"/><line x1="15" x2="9" y1="4" y2="20"/>',code:'<polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/>',trash:'<path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/>',undo:'<path d="M3 7v6h6"/><path d="M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13"/>',redo:'<path d="M21 7v6h-6"/><path d="M3 17a9 9 0 0 1 9-9 9 9 0 0 1 6 2.3l3 2.7"/>',pentagon:'<path d="M10.83 2.38a2 2 0 0 1 2.34 0l8 5.74a2 2 0 0 1 .73 2.25l-3.04 9.26a2 2 0 0 1-1.9 1.37H7.04a2 2 0 0 1-1.9-1.37L2.1 10.37a2 2 0 0 1 .73-2.25z"/>',"rectangle-horizontal":'<rect width="20" height="12" x="2" y="6" rx="2"/>',"message-square":'<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>',"sticky-note":'<path d="M21 9a2.4 2.4 0 0 0-.706-1.706l-3.588-3.588A2.4 2.4 0 0 0 15 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2z"/><path d="M15 3v5a1 1 0 0 0 1 1h5"/>',eraser:'<path d="M21 21H8a2 2 0 0 1-1.42-.587l-3.994-3.999a2 2 0 0 1 0-2.828l10-10a2 2 0 0 1 2.829 0l5.999 6a2 2 0 0 1 0 2.828L12.834 21"/><path d="m5.082 11.09 8.828 8.828"/>',download:'<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/>',camera:'<path d="M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z"/><circle cx="12" cy="13" r="3"/>',"rotate-cw":'<path d="M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8"/><path d="M21 3v5h-5"/>',"rotate-ccw":'<path d="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"/><path d="M3 3v5h5"/>',minimize:'<path d="M8 3v3a2 2 0 0 1-2 2H3"/><path d="M21 8h-3a2 2 0 0 1-2-2V3"/><path d="M3 16h3a2 2 0 0 1 2 2v3"/><path d="M16 21v-3a2 2 0 0 1 2-2h3"/>'};function v(r,t=18){return`<svg xmlns="http://www.w3.org/2000/svg" width="${t}" height="${t}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">${M[r]}</svg>`}const _=150;function $(r,{onShow:t,onHide:e}){let o=null,i=null;const n=()=>{i!==null&&(clearTimeout(i),i=null)},s=()=>{n(),o&&(t(o),o=null)},c=h=>{if(n(),h.ids.length===1){const p=r.getAnnotation(h.ids[0]);if(!p)return;if(o=p,r.isDrawing()){r.once("cancelDrawing",s),r.once("completeDrawing",s);return}i=setTimeout(s,_)}else o=null,e()},d=()=>{n(),o=null,e()},u=()=>{n(),o=null,e()};return r.on("select",c),r.on("click",s),r.on("dragend",s),r.on("dragstart",d),r.on("unselect",u),()=>{n(),r.off("select",c),r.off("click",s),r.off("dragend",s),r.off("dragstart",d),r.off("unselect",u),r.off("cancelDrawing",s),r.off("completeDrawing",s)}}const P="right",L="vertical";class R{constructor(t){a(this,"control");a(this,"panel");a(this,"panelBody");a(this,"mode",null);a(this,"currentAnnotation",null);a(this,"currentColor","#0099FF");a(this,"recent",x());a(this,"colorCircles",[]);a(this,"colorPickerOverlay",null);a(this,"colorPicker",null);a(this,"detachVisibility");a(this,"documentClickHandler");a(this,"hide",()=>{this.panel.style.display="none",this.closeColorPicker(),this.currentAnnotation=null,this.mode=null});this.control=t.control;const e=t.container??document.body;this.panel=document.createElement("div"),this.panel.className="annotation-panel",this.panel.style.display="none",this.panel.dataset.placement=t.placement??P,this.panel.dataset.orientation=t.orientation??L,this.panelBody=document.createElement("div"),this.panelBody.className="panel-body",this.panel.appendChild(this.panelBody),e.appendChild(this.panel),this.detachVisibility=$(this.control,{onShow:o=>{this.setAnnotation(o),this.show()},onHide:this.hide}),["click","mousedown","mousemove"].forEach(o=>this.panel.addEventListener(o,i=>i.stopPropagation())),this.documentClickHandler=o=>{this.colorPickerOverlay&&!this.colorPickerOverlay.contains(o.target)&&!this.colorCircles.some(i=>i.contains(o.target))&&this.closeColorPicker(),this.panelBody.querySelectorAll(".custom-select").forEach(i=>i.classList.remove("open"))},document.addEventListener("click",this.documentClickHandler)}setAnnotation(t){this.currentAnnotation=t,l.isArrow(t)?(this.mode="arrow",this.renderArrow(t)):l.isText(t)||l.isBox(t)||l.isComment(t)?(this.mode="text",this.renderText(t)):l.isPolygon(t)&&(this.mode="polygon",this.renderPolygon(t))}renderArrow(t){const e=t.properties.style||{};this.updateColorFromAnnotation(e.strokeColor||l.defaultArrowStyle.strokeColor),this.panelBody.innerHTML=`
2
2
  ${this.section("Color",this.colorSelector())}
3
3
  ${this.section("Extremities",`<div class="custom-select-section">
4
4
  ${this.extremitySelector("head",t)}
package/dist/ui.mjs CHANGED
@@ -2,7 +2,7 @@ var x = Object.defineProperty;
2
2
  var $ = (r, t, e) => t in r ? x(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
3
3
  var l = (r, t, e) => $(r, typeof t != "symbol" ? t + "" : t, e);
4
4
  import { RgbaBase as M } from "vanilla-colorful/lib/entrypoints/rgba";
5
- import { j as g, s as L, t as T, i as P, v as k, h as b, G as d, aH as B, D as C, ah as E, ac as S } from "./Polygon-DVFVmDbR.js";
5
+ import { j as g, s as L, t as T, i as P, v as k, h as b, G as d, aJ as B, D as C, ak as E, af as S } from "./Polygon-BsnVN6js.js";
6
6
  const y = "rgba-color-picker";
7
7
  class D extends M {
8
8
  }
@@ -350,7 +350,7 @@ class Z {
350
350
  this.closeColorPicker(), this.detachVisibility(), document.removeEventListener("click", this.documentClickHandler), this.panel.remove();
351
351
  }
352
352
  }
353
- const j = "bottom", X = "horizontal", A = [
353
+ const j = "bottom", J = "horizontal", A = [
354
354
  "arrow",
355
355
  "comment",
356
356
  "sticky-note",
@@ -369,7 +369,7 @@ class tt {
369
369
  l(this, "handleHistory", () => this.updateUndoRedo());
370
370
  this.control = t.control;
371
371
  const e = t.container ?? document.body;
372
- this.root = document.createElement("div"), this.root.className = "annotation-toolbar", this.root.dataset.placement = t.placement ?? j, this.root.dataset.orientation = t.orientation ?? X, e.appendChild(this.root), ["click", "mousedown", "mousemove"].forEach(
372
+ this.root = document.createElement("div"), this.root.className = "annotation-toolbar", this.root.dataset.placement = t.placement ?? j, this.root.dataset.orientation = t.orientation ?? J, e.appendChild(this.root), ["click", "mousedown", "mousemove"].forEach(
373
373
  (s) => this.root.addEventListener(s, (a) => a.stopPropagation())
374
374
  );
375
375
  const o = t.enabledTypes ?? A, i = t.styles ?? {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@linkurious/ogma-annotations",
3
- "version": "2.1.1",
3
+ "version": "2.1.2",
4
4
  "description": "Headless annotation plugin for Ogma",
5
5
  "type": "module",
6
6
  "main": "dist/index.mjs",