@sfgrp/pinpoint/dist/pinpoint.umd.cjs

Pinpoint is a engine for displaying hierarchical keys that identify the Earth's species.

(function(d,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(d=typeof globalThis<"u"?globalThis:d||self,e(d.pinpoint={},d.Vue))})(this,function(d,e){"use strict";var de=Object.defineProperty;var ce=(d,e,u)=>e in d?de(d,e,{enumerable:!0,configurable:!0,writable:!0,value:u}):d[e]=u;var b=(d,e,u)=>ce(d,typeof e!="symbol"?e+"":e,u);function u(r){return String(r).replace(/(\d+)(\.)?/,(o,t,n)=>{const s=parseInt(t,10)-1;return n?`${s}.`:`${s}`})}function y(r,o){const t=new URL(r);return o&&Object.entries(o).forEach(([n,s])=>{t.searchParams.append(n,s.toString())}),t.toString()}async function C(r,{method:o,data:t,parameters:n}={}){try{const s={method:o||"GET",headers:{"Content-Type":"application/json"},body:t?JSON.stringify(t):void 0},l=await fetch(y(r,n),s);if(!l.ok)throw new Error(`Error response: ${l.status} ${l.statusText}`);return await l.json()}catch(s){throw console.error("Error:",s),s}}class N{constructor(o){b(this,"baseUrl");b(this,"projectToken");this.baseUrl=o.baseUrl,this.projectToken=o.projectToken}getDichotomousKey(o){return C(`${this.baseUrl}/leads/key/${o}`,{parameters:{project_token:this.projectToken}})}}function $(r){return{children:r.children||[],coupletNumber:r.couplet_number,parentId:r.parent_id,depth:r.depth,position:r.position}}function V(r,{baseUrl:o,projectToken:t}){var n;return{caption:r.caption,label:r.label,position:r.position,image:r.medium,original:`${o}/${(n=r.original_png)==null?void 0:n.substring(8)}?project_token=${t}`}}function S(r,o){var t;return{text:r.text,parentId:r.parent_id,targetId:r.target_id,targetLabel:r.target_label,targetType:r.target_type,position:r.position,figures:((t=r.figures)==null?void 0:t.map(n=>V(n,o)))||[]}}function _(r){return{currentNode:null,metadata:null,entries:{},leads:{},nodes:{},config:r}}function j(r){let o=new N(r);const t=e.reactive(_(r));function n(a){return Object.fromEntries(Object.entries(a).map(([m,p])=>[m,$(p)]))}function s(a){t.config=a,o=new N(a)}function l(){Object.assign(t,_(r))}function i(a){return Object.fromEntries(Object.entries(a).map(([m,p])=>[m,S(p,t.config)]))}function k(a,m){const p={};for(const[g,ie]of Object.entries(m)){const h=a[g];p[g]={id:parseInt(g,10),...ie,...h},h||Object.assign(p[g],{children:[]})}return p}return{state:t,loadKey:a=>o.getDichotomousKey(a).then(({data:m,metadata:p})=>{t.entries=n(m.entries),t.leads=i(m.leads),t.nodes=k(t.entries,t.leads),t.currentNode=Object.values(t.nodes)[0],t.metadata=p}),setCurrentNode:a=>{t.currentNode=t.nodes[a]},setConfig:s,reset:l}}const L={class:"pinpoint-tree"},T=["innerHTML"],w={key:0},B=e.defineComponent({__name:"Tree",props:{node:{},coupletNumber:{}},setup(r){const o=e.inject("store");return(t,n)=>(e.openBlock(),e.createElementBlock("ul",L,[e.createElementVNode("li",null,[e.createElementVNode("span",{onClick:n[0]||(n[0]=()=>e.unref(o).setCurrentNode(t.node.parentId))},[e.createTextVNode(" ["+e.toDisplayString(t.coupletNumber)+"] ",1),e.createElementVNode("span",{innerHTML:t.node.text},null,8,T),isNaN(t.node.targetLabel)?(e.openBlock(),e.createElementBlock("span",w,"["+e.toDisplayString(t.node.targetLabel)+"]",1)):e.createCommentVNode("",!0)]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.node.children,s=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.unref(o).state.nodes[s]?(e.openBlock(),e.createBlock(B,{key:0,node:e.unref(o).state.nodes[s],"couplet-number":t.node.coupletNumber},null,8,["node","couplet-number"])):e.createCommentVNode("",!0)],64))),256))])]))}}),I={class:"pinpoint-modal-panel"},D={__name:"Modal",emits:["close"],setup(r,{emit:o}){const t=o,n=s=>{s.key==="Escape"&&(s.stopPropagation(),t("close"))};return e.onMounted(()=>{document.addEventListener("keydown",n),document.body.classList.add("overflow-hidden")}),e.onUnmounted(()=>{document.removeEventListener("keydown",n),document.body.classList.remove("overflow-hidden")}),(s,l)=>(e.openBlock(),e.createElementBlock("div",{class:"pinpoint-modal-wrapper",onClick:l[1]||(l[1]=i=>t("close")),onKey:l[2]||(l[2]=e.withModifiers(i=>t("close"),["stop"]))},[e.createElementVNode("div",{class:"pinpoint-modal-container",onClick:l[0]||(l[0]=e.withModifiers(()=>{},["stop"]))},[e.createElementVNode("div",I,[e.renderSlot(s.$slots,"default")])])],32))}},O=["src"],U=["src"],P=e.defineComponent({__name:"FigureItem",props:{figure:{}},setup(r){const o=e.ref(!1);return(t,n)=>(e.openBlock(),e.createElementBlock("div",null,[e.createElementVNode("img",{src:t.figure.image,class:"pinpoint-figure",onClick:n[0]||(n[0]=()=>o.value=!o.value)},null,8,O),o.value?(e.openBlock(),e.createBlock(D,{key:0,onClose:n[2]||(n[2]=()=>o.value=!1)},{default:e.withCtx(()=>[e.createElementVNode("img",{class:"pinpoint-figure-image",src:t.figure.original,onClick:n[1]||(n[1]=()=>o.value=!0)},null,8,U)]),_:1})):e.createCommentVNode("",!0)]))}}),F={class:"pinpoint-figure-list"},K=e.defineComponent({__name:"FigureList",props:{figures:{}},setup(r){return(o,t)=>(e.openBlock(),e.createElementBlock("div",F,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.figures,n=>(e.openBlock(),e.createBlock(P,{key:n.image,figure:n},null,8,["figure"]))),128))]))}}),M={class:"pinpoint-node-container"},R={class:"pinpoint-node"},q={class:"pinpoint-node-text"},G={key:1,class:"pinpoint-node-target"},H={key:0,class:"pinpoint-node-children-container"},x={class:"pinpoint-node-next-container"},A=e.defineComponent({__name:"Node",props:{node:{}},setup(r){const o=e.inject("store");return(t,n)=>(e.openBlock(),e.createElementBlock("div",M,[t.node?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("div",R,[t.node.children.length?(e.openBlock(),e.createElementBlock("button",{key:0,class:"pinpoint-button-go",type:"button",onClick:n[0]||(n[0]=()=>e.unref(o).state.currentNode=t.node)}," Go ")):e.createCommentVNode("",!0),e.createElementVNode("p",q,e.toDisplayString(t.node.text),1),isNaN(t.node.targetLabel)?(e.openBlock(),e.createElementBlock("p",G,[e.renderSlot(t.$slots,"target",{label:t.node.targetLabel,id:t.node.targetId},()=>[e.createTextVNode(e.toDisplayString(t.node.targetLabel),1)])])):e.createCommentVNode("",!0),e.createVNode(K,{figures:t.node.figures},null,8,["figures"])]),t.node.children.length?(e.openBlock(),e.createElementBlock("div",H,[e.createElementVNode("div",x,[e.createElementVNode("button",{class:"pinpoint-node-next-button",type:"button",onClick:n[1]||(n[1]=s=>e.unref(o).setCurrentNode(e.unref(o).state.nodes[t.node.children[0]].parentId))},[e.renderSlot(t.$slots,"button-next-label",{},()=>[n[2]||(n[2]=e.createTextVNode(" Next "))])])]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.node.children.map(s=>e.unref(o).state.nodes[s]),s=>(e.openBlock(),e.createBlock(B,{"couplet-number":t.node.coupletNumber,node:s},null,8,["couplet-number","node"]))),256))])):e.createCommentVNode("",!0)],64)):e.createCommentVNode("",!0)]))}}),J={class:"pinpoint-couplet"},W={class:"pinpoint-couplet-container"},z={class:"pinpoint-couplet-node"},Q={key:0},X={key:1,class:"pinpoint-node-target"},Y={class:"pinpoint-couplet-children-container"},Z={__name:"Couplet",setup(r){const o=e.inject("store"),t=e.computed(()=>o.state.currentNode),n=e.computed(()=>o.state.currentNode.children.map(l=>o.state.nodes[l]));return(s,l)=>(e.openBlock(),e.createElementBlock("div",J,[e.createElementVNode("div",W,[e.unref(o).state.currentNode.parentId?(e.openBlock(),e.createElementBlock("button",{key:0,class:"pinpoint-button-up",type:"button",onClick:l[0]||(l[0]=()=>e.unref(o).state.currentNode=e.unref(o).state.nodes[t.value.parentId])},[e.renderSlot(s.$slots,"button-up-label",{},()=>[l[1]||(l[1]=e.createTextVNode("Up"))])])):e.createCommentVNode("",!0),e.createElementVNode("div",z,[t.value.parentId?(e.openBlock(),e.createElementBlock("h1",Q," Couplet "+e.toDisplayString(t.value.coupletNumber),1)):e.createCommentVNode("",!0),isNaN(t.value.targetLabel)&&!t.value.parentId?(e.openBlock(),e.createElementBlock("p",X,[e.renderSlot(s.$slots,"target",{label:t.value.targetLabel,id:t.value.targetId},()=>[e.createTextVNode(e.toDisplayString(t.value.targetLabel),1)])])):e.createCommentVNode("",!0)])]),e.createElementVNode("div",Y,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.value,i=>(e.openBlock(),e.createBlock(A,{node:i,key:i.id},{target:e.withCtx(({id:k,label:c})=>[e.renderSlot(s.$slots,"target",{id:k,label:c})]),"button-next-label":e.withCtx(()=>[e.renderSlot(s.$slots,"button-next-label")]),_:2},1032,["node"]))),128))])]))}},v={key:0},E=e.defineComponent({__name:"PreviousList",props:{nodes:{}},setup(r){const o=e.inject("store");return(t,n)=>{var s;return(s=t.nodes)!=null&&s.length?(e.openBlock(),e.createElementBlock("ul",v,[e.createElementVNode("li",null,[e.createElementVNode("span",{class:"pinpoint-previous-list-item",onClick:n[0]||(n[0]=()=>e.unref(o).setCurrentNode(t.nodes[0].parentId))},"["+e.toDisplayString(e.unref(u)(t.nodes[0].coupletNumber))+"] "+e.toDisplayString(t.nodes[0].text),1),e.createVNode(E,{nodes:t.nodes.slice(1)},null,8,["nodes"])])])):e.createCommentVNode("",!0)}}}),ee={class:"pinpoint-previous-couplets"},te={class:"pinpoint-previous-list"},ne=e.defineComponent({__name:"PreviousCouplets",props:{node:{}},setup(r){const o=r,t=e.inject("store"),n=e.computed(()=>{const s=[];let l=o.node.id;for(;l!==null;){const i=t.state.nodes[l];l=i.parentId,s.unshift(i)}return s.splice(0,1),s});return(s,l)=>(e.openBlock(),e.createElementBlock("div",ee,[l[0]||(l[0]=e.createElementVNode("h2",null,"Previous couplets",-1)),e.createElementVNode("div",te,[e.createVNode(E,{nodes:n.value},null,8,["nodes"])])]))}}),f={Loading:"loading",Error:"error",End:"end",Start:"start"},oe={class:"pinpoint-app"},re={key:0,class:"pinpoint-key-title"},se={key:3},le=e.defineComponent({__name:"VuePinpoint",props:{leadId:{},projectToken:{},baseUrl:{}},emits:Object.values(f),setup(r,{expose:o,emit:t}){const n=r,s=t,l=j(n),i=e.computed(()=>l.state.currentNode),k=e.ref(null);return e.provide("store",l),e.watch([()=>n.leadId,()=>n.projectToken,()=>n.baseUrl],()=>{l.reset(),l.setConfig(n),k.value=null,n.leadId&&n.baseUrl&&n.projectToken&&n.baseUrl&&(s(f.Start),s(f.Loading),l.loadKey(n.leadId).then(c=>{s(f.End,c)}).catch(c=>{s(f.Error,c),k.value=c}))},{immediate:!0}),o({getState:()=>l.state}),(c,ae)=>{var a;return e.openBlock(),e.createElementBlock("div",oe,[e.unref(l).state.metadata?(e.openBlock(),e.createElementBlock("div",re,[e.renderSlot(c.$slots,"title",{title:e.unref(l).state.metadata.title,metadata:e.unref(l).state.metadata},()=>[e.createTextVNode(e.toDisplayString(e.unref(l).state.metadata.title),1)])])):e.createCommentVNode("",!0),(a=i.value)!=null&&a.parentId?(e.openBlock(),e.createBlock(ne,{key:1,node:i.value},null,8,["node"])):e.createCommentVNode("",!0),i.value?(e.openBlock(),e.createBlock(Z,{key:2},{target:e.withCtx(({id:m,label:p})=>[e.renderSlot(c.$slots,"target",{label:p,id:m})]),"button-up-label":e.withCtx(()=>[e.renderSlot(c.$slots,"button-up-label")]),"button-next-label":e.withCtx(()=>[e.renderSlot(c.$slots,"button-next-label")]),_:3})):e.createCommentVNode("",!0),k.value?(e.openBlock(),e.createElementBlock("div",se,e.toDisplayString(k.value.message),1)):e.createCommentVNode("",!0)])}}});d.VuePinpoint=le,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});