@kit-data-manager/pid-component
Version:
The PID-Component is a web component that can be used to evaluate and display FAIR Digital Objects, PIDs, ORCiDs, and possibly other identifiers in a user-friendly way. It is easily extensible to support other identifier types.
19 lines • 31.2 kB
JavaScript
/*!
*
* Copyright 2024-2026 Karlsruhe Institute of Technology.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*
*/
import{p as t,H as e,d as i,h as s,t as o,c as n}from"./p-Bw7bVt6t.js";import{r as a,c as r}from"./p-FpFz--Uf.js";import{d as l}from"./p-ClvEqYNC.js";import{d as c}from"./p-BeD5v0lO.js";import{d}from"./p-Cxrz0dd5.js";import{d as h}from"./p-BIghWu1E.js";import{d as u}from"./p-DvNxtQhL.js";function f(t){if(!t||t.length===0){return a}const e=[];for(const i of t){const t=a.find((t=>t.key===i));if(t){e.push(t)}else{console.warn(`Parser: Unknown renderer key "${i}" in ordered renderer list, skipping.`)}}return e}class p{static async getEstimatedPriority(t){for(let e=0;e<a.length;e++){const i=new a[e].constructor(t);const s=i.quickCheck();if(s===true){return e}if(s===undefined){const t=await i.hasMeaningfulInformation();if(t){return e}}}return 0}static getBestFitQuick(t,e){const i=f(e);if(e&&e.length>0){for(const e of i){const i=new e.constructor(t);if(i.quickCheck()){return e.key}}return null}let s=null;for(let e=i.length-1;e>=0;e--){const o=i[e];const n=new o.constructor(t);if(n.quickCheck()&&o.key!=="FallbackType"){s=o.key}}return s}static async getBestFit(t,e,i,s=true){const o=f(i);const n=i&&i.length>0;if(n){for(const i of o){const s=new i.constructor(t);const o=s.quickCheck();if(o===true){p.applySettings(s,e);await s.init();return s}if(o===undefined||!o){if(await s.hasMeaningfulInformation()){p.applySettings(s,e);await s.init();return s}}}if(s){return p.getBestFit(t,e,undefined,false)}return null}const a=[];for(let e=0;e<o.length;e++){const i=new o[e].constructor(t);const s=i.quickCheck();if(s===true||s===undefined){a.push({index:e,obj:i,uncertain:s===undefined})}}if(a.length===0){return null}const r=await Promise.all(a.map((async({index:t,obj:e})=>{const i=await e.hasMeaningfulInformation();const s=this.calculateRelevance(e,t);return{obj:e,meaningful:i,relevance:s,index:t}})));const l=r.filter((t=>t.meaningful));if(l.length===0){return null}l.sort(((t,e)=>{if(e.relevance!==t.relevance){return e.relevance-t.relevance}return t.index-e.index}));const c=l[0].obj;p.applySettings(c,e);await c.init();return c}static calculateRelevance(t,e){const i=1e3;const s=1;const o=1;const n=(a.length-e)*i;const r=t.items.length*s;const l=t.actions.length*o;return n+r+l}static applySettings(t,e){var i;try{const s=t.getSettingsKey();const o=(i=e.find((t=>t.type===s)))===null||i===void 0?void 0:i.values;if(o)t.settings=o}catch(t){console.warn("Error while adding settings to object:",t)}}}const m=(t,e)=>e.some((e=>t instanceof e));let b;let w;function g(){return b||(b=[IDBDatabase,IDBObjectStore,IDBIndex,IDBCursor,IDBTransaction])}function y(){return w||(w=[IDBCursor.prototype.advance,IDBCursor.prototype.continue,IDBCursor.prototype.continuePrimaryKey])}const v=new WeakMap;const x=new WeakMap;const k=new WeakMap;function P(t){const e=new Promise(((e,i)=>{const s=()=>{t.removeEventListener("success",o);t.removeEventListener("error",n)};const o=()=>{e(B(t.result));s()};const n=()=>{i(t.error);s()};t.addEventListener("success",o);t.addEventListener("error",n)}));k.set(e,t);return e}function D(t){if(v.has(t))return;const e=new Promise(((e,i)=>{const s=()=>{t.removeEventListener("complete",o);t.removeEventListener("error",n);t.removeEventListener("abort",n)};const o=()=>{e();s()};const n=()=>{i(t.error||new DOMException("AbortError","AbortError"));s()};t.addEventListener("complete",o);t.addEventListener("error",n);t.addEventListener("abort",n)}));v.set(t,e)}let I={get(t,e,i){if(t instanceof IDBTransaction){if(e==="done")return v.get(t);if(e==="store"){return i.objectStoreNames[1]?undefined:i.objectStore(i.objectStoreNames[0])}}return B(t[e])},set(t,e,i){t[e]=i;return true},has(t,e){if(t instanceof IDBTransaction&&(e==="done"||e==="store")){return true}return e in t}};function C(t){I=t(I)}function E(t){if(y().includes(t)){return function(...e){t.apply($(this),e);return B(this.request)}}return function(...e){return B(t.apply($(this),e))}}function S(t){if(typeof t==="function")return E(t);if(t instanceof IDBTransaction)D(t);if(m(t,g()))return new Proxy(t,I);return t}function B(t){if(t instanceof IDBRequest)return P(t);if(x.has(t))return x.get(t);const e=S(t);if(e!==t){x.set(t,e);k.set(e,t)}return e}const $=t=>k.get(t);function M(t,e,{blocked:i,upgrade:s,blocking:o,terminated:n}={}){const a=indexedDB.open(t,e);const r=B(a);if(s){a.addEventListener("upgradeneeded",(t=>{s(B(a.result),t.oldVersion,t.newVersion,B(a.transaction),t)}))}if(i){a.addEventListener("blocked",(t=>i(t.oldVersion,t.newVersion,t)))}r.then((t=>{if(n)t.addEventListener("close",(()=>n()));if(o){t.addEventListener("versionchange",(t=>o(t.oldVersion,t.newVersion,t)))}})).catch((()=>{}));return r}const O=["get","getKey","getAll","getAllKeys","count"];const T=["put","add","delete","clear"];const z=new Map;function F(t,e){if(!(t instanceof IDBDatabase&&!(e in t)&&typeof e==="string")){return}if(z.get(e))return z.get(e);const i=e.replace(/FromIndex$/,"");const s=e!==i;const o=T.includes(i);if(!(i in(s?IDBIndex:IDBObjectStore).prototype)||!(o||O.includes(i))){return}const n=async function(t,...e){const n=this.transaction(t,o?"readwrite":"readonly");let a=n.store;if(s)a=a.index(e.shift());return(await Promise.all([a[i](...e),o&&n.done]))[0]};z.set(e,n);return n}C((t=>({...t,get:(e,i,s)=>F(e,i)||t.get(e,i,s),has:(e,i)=>!!F(e,i)||t.has(e,i)})));const L=["continue","continuePrimaryKey","advance"];const j={};const N=new WeakMap;const A=new WeakMap;const K={get(t,e){if(!L.includes(e))return t[e];let i=j[e];if(!i){i=j[e]=function(...t){N.set(this,A.get(this)[e](...t))}}return i}};async function*W(...t){let e=this;if(!(e instanceof IDBCursor)){e=await e.openCursor(...t)}if(!e)return;e=e;const i=new Proxy(e,K);A.set(i,e);k.set(i,$(e));while(e){yield i;e=await(N.get(i)||e.continue());N.delete(i)}}function q(t,e){return e===Symbol.asyncIterator&&m(t,[IDBIndex,IDBObjectStore,IDBCursor])||e==="iterate"&&m(t,[IDBIndex,IDBObjectStore])}C((t=>({...t,get(e,i,s){if(q(e,i))return W;return t.get(e,i,s)},has(e,i){return q(e,i)||t.has(e,i)}})));const J="pid-component";const R=1;class V{constructor(){this.dbPromise=M(J,R,{upgrade(t){const e=t.createObjectStore("entities",{keyPath:"value"});e.createIndex("by-context","context",{unique:false});const i=t.createObjectStore("relations",{autoIncrement:true});i.createIndex("by-start","start",{unique:false});i.createIndex("by-description","description",{unique:false});i.createIndex("by-end","end",{unique:false})}})}async addEntity(t,e){const i=document.documentURI;const s=await this.dbPromise;const o=this.normalizeKey(t.value);await s.add("entities",{value:o,rendererKey:t.getSettingsKey(),orderedRendererKeys:e!==null&&e!==void 0?e:null,context:i,lastAccess:new Date,lastData:t.data}).catch((t=>{if(t.name==="ConstraintError"){console.debug("Entity already exists",t)}else console.error("Could not add entity",t)}));console.debug("added entity",t);const n=s.transaction("relations","readwrite");const a=[];for(const e of t.items){const i={start:t.value,description:e.keyTitle,end:e.value};const s=n.store.index("by-start");let o=await s.openCursor();let r=false;while(o){if(o.value.start===i.start&&o.value.end===i.end&&o.value.description===i.description){r=true;break}o=await o.continue()}if(!r){a.push(n.store.add(i))}}a.push(n.done);await Promise.all(a);console.debug("added relations",a)}async getEntity(t,e,i,s=true){var o,n;const r=this.normalizeKey(t);try{const s=await this.dbPromise;const n=await s.get("entities",r);if(n!==undefined){const s=n.orderedRendererKeys;const r=i!==null&&i!==void 0?i:null;const l=JSON.stringify(s)!==JSON.stringify(r);if(l||i&&i.length>0&&!i.includes(n.rendererKey)){console.debug("Ordered renderer keys changed or cached renderer not in ordered list, re-detecting",{cached:s,current:r,cachedRendererKey:n.rendererKey,currentAllowedKeys:i});await this.deleteEntity(t)}else{console.debug("Found entity for value in db",n,t);const i=(o=e.find((t=>t.type===n.rendererKey)))===null||o===void 0?void 0:o.values;const s=i===null||i===void 0?void 0:i.find((t=>t.name==="ttl"));if(s!=undefined&&s.value!=undefined&&((new Date).getTime()-n.lastAccess.getTime()>s.value||s.value===0)){console.log("TTL expired! Deleting entry in db",s.value,(new Date).getTime()-n.lastAccess.getTime());await this.deleteEntity(t)}else{console.log("TTL not expired or undefined",(new Date).getTime()-n.lastAccess.getTime());const e=new(a.find((t=>t.key===n.rendererKey)).constructor)(t,i);e.settings=i;await e.init(n.lastData);return e}}}}catch(t){console.error("Could not get entity from db",t)}console.debug("No valid entity found for value in db",t);const l=await p.getBestFit(t,e,i,s);if(l===null){console.debug("No renderer matched for value",t);return null}l.settings=(n=e.find((t=>t.type===l.getSettingsKey())))===null||n===void 0?void 0:n.values;await l.init();if(l.isResolvable()){await this.addEntity(l,i);console.debug("added entity to db",t,l)}else{console.debug("renderer not resolvable, skipping IndexedDB cache",t,l.getSettingsKey())}return l}async deleteEntity(t){const e=await this.dbPromise;const i=this.normalizeKey(t);await e.delete("entities",i);const s=e.transaction("relations","readwrite");const o=s.store.index("by-start");let n=await o.openCursor();while(n){if(n.value.start===t||n.value.end===t){await s.store.delete(n.primaryKey)}n=await n.continue()}console.log("deleted entity",t);await s.done}async clearEntities(){const t=await this.dbPromise;await t.clear("entities");await t.clear("relations");console.log("cleared entities")}normalizeKey(t){let e=t;if(typeof e!=="string"&&typeof e!=="number"){try{e=JSON.stringify(e)}catch(t){e=String(e)}console.warn("Converted entity value to string for IndexedDB key (delete):",e)}return e}}const H=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.pageChange=i(this,"pageChange");this.itemsPerPageChange=i(this,"itemsPerPageChange");this.items=[];this.itemsPerPage=10;this.currentPage=0;this.pageSizes=[5,10,25,50,100];this.loadSubcomponents=false;this.hideSubcomponents=false;this.currentLevelOfSubcomponents=0;this.levelOfSubcomponents=1;this.settings="[]";this.darkMode="system";this.filteredItems=[];this.tableId=`pid-data-table-${Math.random().toString(36).substring(2,9)}`}updateFilteredItems(){this.filteredItems=this.items.filter(((t,e)=>e>=this.currentPage*this.itemsPerPage&&e<this.currentPage*this.itemsPerPage+this.itemsPerPage));const t=Math.ceil(this.items.length/this.itemsPerPage)-1;if(this.currentPage>t&&t>=0){this.currentPage=t}this.recalculateContentDimensions()}componentWillLoad(){this.updateFilteredItems()}componentDidLoad(){setTimeout((()=>{this.recalculateContentDimensions()}),0)}render(){const t=this.darkMode==="dark"||this.darkMode==="system"&&window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches;if(this.items.length===0){return s("div",{class:t?"m-1 rounded-lg border border-gray-700 bg-gray-800 p-4 text-center text-gray-300":"m-1 rounded-lg border border-gray-200 bg-gray-50 p-4 text-center text-gray-500",role:"status","aria-live":"polite","aria-label":"No data available"},s("p",{class:"m-0"},"No data available"))}return s("table",{id:this.tableId,class:`w-full h-full table-auto border-collapse text-left font-sans text-sm select-text rounded-md overflow-y-auto ${t?"text-gray-200 bg-gray-800":"bg-gray-50"}`,"aria-label":"Data table with properties and values",role:"table"},s("thead",{class:"sticky top-0 z-20 p-1 rounded-md bg-slate-600 text-slate-200"},s("tr",{class:"font-semibold flex-col",role:"row"},s("th",{class:"w-1/5 flex-2 resize-x rounded-l-md p-1",scope:"col",role:"columnheader"},"Key"),s("th",{class:"min-w-36 w-4/5 flex-6 resize-x rounded-r-md p-1",scope:"col",role:"columnheader"},"Value"))),s("tbody",{class:t?"bg-gray-800 overflow-y-auto relative":"bg-gray-50 overflow-y-auto relative",role:"rowgroup"},this.filteredItems.map(((e,i)=>s("tr",{key:`item-${e.keyTitle}-${i}`,class:t?`odd:bg-gray-700 even:bg-gray-800 border-b border-gray-700 flex-col`:`odd:bg-slate-200 even:bg-gray-50 border-b border-gray-200 flex-col`,"aria-label":`Row for ${e.keyTitle} with value ${e.value}`,role:"row"},s("td",{class:"w-auto p-1 align-top font-mono flex-2 resize-x",role:"cell"},s("pid-tooltip",{text:e.keyTooltip||`Details for ${e.keyTitle}`,position:"top",maxHeight:"200px","aria-label":`Information about ${e.keyTitle}`},s("div",{slot:"trigger",class:"flex min-h-7 w-full items-center overflow-hidden"},s("a",{href:e.keyLink,target:"_blank",rel:"noopener noreferrer",class:"mr-2 truncate rounded-sm text-blue-600 underline hover:text-blue-800 focus:text-blue-900 focus:ring-2 focus:ring-blue-500 focus:ring-offset-1 focus:outline-hidden",onClick:t=>t.stopPropagation(),"aria-label":`Open ${e.keyTitle} in new tab`},e.keyTitle)))),s("td",{class:"relative w-full p-1 align-top text-sm select-text flex-6 resize-x",role:"cell"},s("div",{class:"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-2"},s("div",{class:"min-w-0 overflow-x-auto whitespace-normal"},this.loadSubcomponents&&!this.hideSubcomponents&&e.renderDynamically?s("pid-component",{value:e.value,levelOfSubcomponents:this.levelOfSubcomponents,currentLevelOfSubcomponents:this.currentLevelOfSubcomponents+1,itemsPerPage:this.itemsPerPage,settings:this.settings,openByDefault:false,darkMode:this.darkMode,class:"block w-full min-w-0"}):!this.hideSubcomponents&&this.currentLevelOfSubcomponents===this.levelOfSubcomponents&&e.renderDynamically?s("pid-component",{value:e.value,levelOfSubcomponents:this.currentLevelOfSubcomponents,currentLevelOfSubcomponents:this.currentLevelOfSubcomponents+1,itemsPerPage:this.itemsPerPage,settings:this.settings,hideSubcomponents:true,openByDefault:false,darkMode:this.darkMode,class:"block w-full min-w-0"}):s("span",{class:"inline-block w-full max-w-full overflow-x-auto font-mono text-sm break-words whitespace-normal"},e.value)),s("div",{class:"shrink-0 px-2"},s("copy-button",{value:e.value,"dark-mode":this.darkMode,class:`visible z-50 cursor-pointer rounded-xs ${t?"bg-gray-700/90 hover:bg-gray-600":"bg-white/90 hover:bg-white"} opacity-100 shadow-xs transition-all duration-200 hover:shadow-md`,"aria-label":`Copy ${e.keyTitle} value to clipboard`,title:`Copy ${e.keyTitle} value to clipboard`})))))))))}recalculateContentDimensions(){requestAnimationFrame((()=>{requestAnimationFrame((()=>{const t=this.el.closest("pid-collapsible");if(t&&typeof t.recalculateContentDimensions==="function"){t.recalculateContentDimensions()}}))}))}get el(){return this}static get watchers(){return{items:[{updateFilteredItems:0}],currentPage:[{updateFilteredItems:0}],itemsPerPage:[{updateFilteredItems:0}]}}},[0,"pid-data-table",{items:[16],itemsPerPage:[1026,"items-per-page"],currentPage:[1026,"current-page"],pageSizes:[16],loadSubcomponents:[4,"load-subcomponents"],hideSubcomponents:[4,"hide-subcomponents"],currentLevelOfSubcomponents:[2,"current-level-of-subcomponents"],levelOfSubcomponents:[2,"level-of-subcomponents"],settings:[1],darkMode:[1,"dark-mode"],filteredItems:[32]},undefined,{items:[{updateFilteredItems:0}],currentPage:[{updateFilteredItems:0}],itemsPerPage:[{updateFilteredItems:0}]}]);function Q(){if(typeof customElements==="undefined"){return}const t=["pid-data-table","copy-button","pid-actions","pid-collapsible","pid-component","pid-data-table","pid-pagination","pid-tooltip"];t.forEach((t=>{switch(t){case"pid-data-table":if(!customElements.get(o(t))){customElements.define(o(t),H)}break;case"copy-button":if(!customElements.get(o(t))){l()}break;case"pid-actions":if(!customElements.get(o(t))){c()}break;case"pid-collapsible":if(!customElements.get(o(t))){d()}break;case"pid-component":if(!customElements.get(o(t))){Y()}break;case"pid-data-table":if(!customElements.get(o(t))){Q()}break;case"pid-pagination":if(!customElements.get(o(t))){h()}break;case"pid-tooltip":if(!customElements.get(o(t))){u()}break}}))}const U=()=>`details summary::-webkit-details-marker{display:none}:host{display:inline-block;vertical-align:baseline}::slotted(slot[name=summary]){max-width:50vw}:host([expanded]){max-width:100%;overflow:visible}.pid-preview-wrapper{max-width:50vw;overflow:hidden;text-overflow:ellipsis}.pid-preview-scroll{max-width:50vw;overflow-x:auto;white-space:nowrap;scrollbar-width:thin}.pid-preview-scroll::-webkit-scrollbar{height:4px}.pid-preview-scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}.border{border-width:1px;border-style:solid}.border-gray-300{border-color:#d1d5db}.border-gray-600{border-color:#4b5563}.rounded-md{border-radius:.375rem}.shadow-xs{box-shadow:0 1px 2px 0 rgba(0,0,0,.05)}.bg-white{background-color:#fff}.border-b{border-bottom-width:1px;border-bottom-style:solid}.border-gray-100{border-color:#f3f4f6}.border-gray-700{border-color:#374151}.overflow-x-auto{overflow-x:auto;scrollbar-width:thin}.overflow-x-auto::-webkit-scrollbar{height:3px}.overflow-x-auto::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}.overflow-x-auto::-webkit-scrollbar-track{background:transparent}`;const _=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.settings="[]";this.itemsPerPage=10;this.levelOfSubcomponents=1;this.currentLevelOfSubcomponents=0;this.emphasizeComponent=true;this.showTopLevelCopy=true;this.defaultTTL=24*60*60*1e3;this.darkMode="light";this.fallbackToAll=true;this.isDarkMode=false;this.items=[];this.actions=[];this.loadSubcomponents=false;this.displayStatus="loading";this.tablePage=0;this.temporarilyEmphasized=false;this.isExpanded=false;this._lineHeight=24;this.toggleSubcomponents=t=>{if(t){t.stopPropagation();this.isExpanded=t.detail;if(t.detail){if(!this.hideSubcomponents&&this.levelOfSubcomponents-this.currentLevelOfSubcomponents>0){this.loadSubcomponents=true;setTimeout((()=>{var t;const e=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector("pid-collapsible");if(e&&typeof e.recalculateContentDimensions==="function"){e.recalculateContentDimensions()}}),50)}}else{this.loadSubcomponents=false}}};this.handleDarkModeChange=()=>{this.updateDarkMode()};this.blockEventPropagation=t=>{t.stopPropagation()}}get shouldShowFooter(){const t=this.actions.length>0;const e=this.items.length>this.itemsPerPage;return t||e}get shouldShowCollapsedPreview(){var t;return this.items.length===0&&this.actions.length===0&&!((t=this.identifierObject)===null||t===void 0?void 0:t.renderBody())||this.hideSubcomponents}componentDidLoad(){this.ensureComponentId();setTimeout((()=>{var t;const e=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector("pid-collapsible");if(e&&typeof e.recalculateContentDimensions==="function"){e.recalculateContentDimensions()}}),50)}async watchValue(){this.displayStatus="loading";await this.componentWillLoad();setTimeout((()=>{var t;const e=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector("pid-collapsible");if(e&&typeof e.recalculateContentDimensions==="function"){e.recalculateContentDimensions()}}),10)}async watchLoadSubcomponents(){this.temporarilyEmphasized=this.emphasizeComponent||this.loadSubcomponents;this._lineHeight=24}watchEmphasizeComponent(){this.temporarilyEmphasized=this.emphasizeComponent||this.loadSubcomponents}watchOpenByDefault(){this.isExpanded=this.openByDefault}watchIsExpanded(){if(this.isExpanded){this.el.setAttribute("expanded","")}else{this.el.removeAttribute("expanded")}}onItemsChange(){const t=Math.ceil(this.items.length/this.itemsPerPage)-1;if(this.tablePage>t&&t>=0){this.tablePage=t}}validateItemsPerPage(t){if(t<=0){console.warn(`pid-component: itemsPerPage prop must be positive. Received ${t}, defaulting to 10.`);this.itemsPerPage=10}}watchDarkMode(){this.updateDarkMode();if(this.identifierObject){const t=this.identifierObject.settings||[];const e=t.findIndex((t=>t.name==="darkMode"));if(e>=0){t[e].value=this.darkMode}else{t.push({name:"darkMode",value:this.darkMode})}this.identifierObject.settings=t}}async componentWillLoad(){var t,e;this.ensureComponentId();this.validateItemsPerPage(this.itemsPerPage);this.temporarilyEmphasized=this.emphasizeComponent||this.loadSubcomponents;if(this.openByDefault){if(!this.hideSubcomponents&&this.levelOfSubcomponents-this.currentLevelOfSubcomponents>0){this.isExpanded=true;this.loadSubcomponents=true}}this.initializeDarkMode();this.items=[];this.actions=[];let i;if(typeof this.settings==="string"&&this.settings.trim().length>0){try{i=JSON.parse(this.settings)}catch(t){console.error("Failed to parse settings.",t);i=[]}}else{i=[]}if(i.length===0){i.push({type:"default",values:[{name:"ttl",value:this.defaultTTL},{name:"darkMode",value:this.darkMode}]})}else{i.forEach((t=>{if(!t.values.some((t=>t.name==="ttl"))){t.values.push({name:"ttl",value:this.defaultTTL})}const e=t.values.findIndex((t=>t.name==="darkMode"));if(e>=0){t.values[e].value=this.darkMode}else{t.values.push({name:"darkMode",value:this.darkMode})}}))}let s;if(typeof this.renderers==="string"&&this.renderers.trim().length>0){try{s=JSON.parse(this.renderers);if(!Array.isArray(s)){console.error("renderers prop must be a JSON array of strings, got:",this.renderers);s=undefined}}catch(t){console.error("Failed to parse renderers prop:",t);s=undefined}}try{const t=new V;const e=await t.getEntity(this.value,i,s,this.fallbackToAll);if(e===null){this.displayStatus="unmatched";this.identifierObject=undefined;this.items=[];this.actions=[];return}this.identifierObject=e}catch(t){console.error("Failed to get entity from db",t);this.displayStatus="error";this.identifierObject=undefined;this.items=[];this.actions=[];return}if(!this.hideSubcomponents){const i=[];(((t=this.identifierObject)===null||t===void 0?void 0:t.items)||[]).forEach((t=>{if(!i.some((e=>t.equals(e)))){i.push(t)}}));this.items=i;this.items.sort(((t,e)=>{if(t.priority>e.priority)return 1;if(t.priority<e.priority)return-1;if(t.estimatedTypePriority>e.estimatedTypePriority)return 1;if(t.estimatedTypePriority<e.estimatedTypePriority)return-1;if(t.keyTitle&&e.keyTitle){return t.keyTitle.localeCompare(e.keyTitle)}return 0}));const s=[];(((e=this.identifierObject)===null||e===void 0?void 0:e.actions)||[]).forEach((t=>{if(!s.some((e=>t.equals(e)))){s.push(t)}}));this.actions=s;this.actions.sort(((t,e)=>t.priority-e.priority))}this.displayStatus="loaded";await r()}disconnectedCallback(){this.identifierObject=undefined;this.items=[];this.actions=[];if(this._abortController){this._abortController.abort();this._abortController=undefined}this.cleanupDarkModeListener()}render(){if(this.displayStatus==="unmatched"){return s(n,{class:"relative font-sans",style:{display:"none"}})}if(this.shouldShowCollapsedPreview){if(this.identifierObject!==undefined&&this.displayStatus==="loaded"){return s(n,{class:"relative font-sans","aria-label":`This component displays information about the identifier ${this.value}.`},this.renderCollapsedPreviewContent())}return s(n,{class:"relative font-sans","aria-label":`This component displays information about the identifier ${this.value}.`},this.renderStatusMessage())}return this.renderExpandedState()}ensureComponentId(){if(!this.el.id){this.el.id=`pid-component-${Math.random().toString(36).substring(2,9)}`}}initializeDarkMode(){if(window.matchMedia){this.darkModeMediaQuery=window.matchMedia("(prefers-color-scheme: dark)");this.updateDarkMode();if(this.darkModeMediaQuery.addEventListener){this.darkModeMediaQuery.addEventListener("change",this.handleDarkModeChange)}else if(this.darkModeMediaQuery.addListener){this.darkModeMediaQuery.addListener(this.handleDarkModeChange)}}else{this.isDarkMode=this.darkMode==="dark"}}updateDarkMode(){if(this.darkMode==="dark"){this.isDarkMode=true}else if(this.darkMode==="light"){this.isDarkMode=false}else if(this.darkMode==="system"&&this.darkModeMediaQuery){this.isDarkMode=this.darkModeMediaQuery.matches}}cleanupDarkModeListener(){if(this.darkModeMediaQuery){if(this.darkModeMediaQuery.removeEventListener){this.darkModeMediaQuery.removeEventListener("change",this.handleDarkModeChange)}else if(this.darkModeMediaQuery.removeListener){this.darkModeMediaQuery.removeListener(this.handleDarkModeChange)}}}shouldShowCopyButtonOnTopLevel(){return this.currentLevelOfSubcomponents===0&&this.showTopLevelCopy&&(this.emphasizeComponent||this.temporarilyEmphasized||this.isExpanded)}getPreviewClasses(){if(this.currentLevelOfSubcomponents===0){const t=this.emphasizeComponent||this.temporarilyEmphasized?"group rounded-md border py-0 shadow-sm "+(this.isDarkMode?"border-gray-600 bg-gray-800":"border-gray-300 bg-white")+" inline-flex cursor-pointer list-none flex-nowrap items-center overflow-hidden font-mono font-bold text-clip":(this.isDarkMode?"bg-gray-800/60":"")+" inline-flex cursor-pointer list-none flex-nowrap items-center font-mono font-bold";return t+(!this.isExpanded?` h-[${this._lineHeight||24}px] leading-[${this._lineHeight||24}px]`:"")}return""}renderCollapsedPreviewContent(){var t;return s("span",{class:this.getPreviewClasses(),tabIndex:0,role:"button","aria-label":`Identifier preview for ${this.value}`,"aria-expanded":this.isExpanded},s("span",{class:`inline-block font-mono font-medium select-all ${this.isExpanded?"text-xs":"text-sm"} ${this.isExpanded?"max-w-[60vw] overflow-x-auto whitespace-nowrap":"max-w-full truncate"}`},(t=this.identifierObject)===null||t===void 0?void 0:t.renderPreview()),this.shouldShowCopyButtonOnTopLevel()?s("copy-button",{value:this.identifierObject.value,class:"ml-auto shrink-0","aria-label":`Copy value: ${this.identifierObject.value}`,onClick:this.blockEventPropagation,"dark-mode":this.darkMode}):null)}renderStatusMessage(){if(this.displayStatus==="error"){return s("span",{class:"inline-flex items-center font-mono text-sm text-gray-600 dark:text-gray-300",role:"status"},this.value)}return s("span",{class:"inline-flex items-center font-mono text-sm text-gray-500",role:"status","aria-live":"polite"},this.value)}renderExpandedState(){var t,e;return s(n,{class:"relative font-sans","aria-label":`This component displays information about the identifier ${this.value}. It can be expanded to show more details.`},s("pid-collapsible",{expanded:this.isExpanded,open:this.isExpanded,previewScrollable:this.isExpanded,emphasize:this.emphasizeComponent||this.temporarilyEmphasized,initialWidth:this.currentLevelOfSubcomponents>0?"100%":this.width,initialHeight:this.height,lineHeight:this._lineHeight,showFooter:this.shouldShowFooter,darkMode:this.darkMode,onCollapsibleToggle:t=>this.toggleSubcomponents(t),onClick:this.blockEventPropagation,"aria-label":`Collapsible section for ${this.value}`,"aria-describedby":`${this.el.id}-description`},s("span",{slot:"summary",class:`font-mono font-medium select-all text-sm ${this.isExpanded?"overflow-x-auto whitespace-nowrap":"max-w-full truncate"}`,"aria-label":`Preview of ${this.value}`},(t=this.identifierObject)===null||t===void 0?void 0:t.renderPreview()),this.shouldShowCopyButtonOnTopLevel()?s("copy-button",{slot:"summary-actions",value:this.value,class:"ml-auto pl-2 shrink-0","aria-label":`Copy value: ${this.value}`,onClick:this.blockEventPropagation,"dark-mode":this.darkMode}):null,this.items.length>0?s("pid-data-table",{items:this.items,itemsPerPage:this.itemsPerPage,currentPage:this.tablePage,loadSubcomponents:this.loadSubcomponents,hideSubcomponents:this.hideSubcomponents,currentLevelOfSubcomponents:this.currentLevelOfSubcomponents,levelOfSubcomponents:this.levelOfSubcomponents,settings:this.settings,darkMode:this.darkMode,onPageChange:t=>this.tablePage=t.detail,class:"w-full grow overflow-x-clip overflow-y-auto","aria-label":`Data table for ${this.value}`,"aria-describedby":`${this.el.id}-table-description`}):null,this.items.length>0&&s("span",{id:`${this.el.id}-table-description`,class:"sr-only fixed"},"This table displays properties and values associated with the identifier ",this.value,"."),(e=this.identifierObject)===null||e===void 0?void 0:e.renderBody(),this.items.length>0&&s("div",{slot:"footer",class:`relative z-50 w-full overflow-visible ${this.isDarkMode?"bg-gray-800":"bg-white"}`},s("pid-pagination",{currentPage:this.tablePage,totalItems:this.items.length,itemsPerPage:this.itemsPerPage,darkMode:this.darkMode,onPageChange:t=>this.tablePage=t.detail,onItemsPerPageChange:t=>this.itemsPerPage=t.detail,"aria-label":`Pagination controls for ${this.value} data`,"aria-controls":`${this.el.id}-table`})),this.actions.length>0&&s("pid-actions",{slot:"footer-actions",actions:this.actions,darkMode:this.darkMode,class:"my-0 shrink-0 overflow-x-auto","aria-label":`Available actions for ${this.value}`})))}get el(){return this}static get watchers(){return{value:[{watchValue:0}],loadSubcomponents:[{watchLoadSubcomponents:0}],emphasizeComponent:[{watchEmphasizeComponent:0}],openByDefault:[{watchOpenByDefault:0}],isExpanded:[{watchIsExpanded:0}],items:[{onItemsChange:0}],itemsPerPage:[{validateItemsPerPage:0}],darkMode:[{watchDarkMode:0}]}}static get style(){return U()}},[1,"pid-component",{value:[1],settings:[1],openByDefault:[4,"open-by-default"],itemsPerPage:[2,"items-per-page"],levelOfSubcomponents:[2,"level-of-subcomponents"],currentLevelOfSubcomponents:[2,"current-level-of-subcomponents"],hideSubcomponents:[4,"hide-subcomponents"],emphasizeComponent:[4,"emphasize-component"],showTopLevelCopy:[4,"show-top-level-copy"],defaultTTL:[2,"default-t-t-l"],width:[1],height:[1],darkMode:[1,"dark-mode"],renderers:[1],fallbackToAll:[4,"fallback-to-all"],identifierObject:[32],isDarkMode:[32],items:[32],actions:[32],loadSubcomponents:[32],displayStatus:[32],tablePage:[32],temporarilyEmphasized:[32],isExpanded:[32]},undefined,{value:[{watchValue:0}],loadSubcomponents:[{watchLoadSubcomponents:0}],emphasizeComponent:[{watchEmphasizeComponent:0}],openByDefault:[{watchOpenByDefault:0}],isExpanded:[{watchIsExpanded:0}],items:[{onItemsChange:0}],itemsPerPage:[{validateItemsPerPage:0}],darkMode:[{watchDarkMode:0}]}]);function Y(){if(typeof customElements==="undefined"){return}const t=["pid-component","copy-button","pid-actions","pid-collapsible","pid-component","pid-data-table","pid-pagination","pid-tooltip"];t.forEach((t=>{switch(t){case"pid-component":if(!customElements.get(o(t))){customElements.define(o(t),_)}break;case"copy-button":if(!customElements.get(o(t))){l()}break;case"pid-actions":if(!customElements.get(o(t))){c()}break;case"pid-collapsible":if(!customElements.get(o(t))){d()}break;case"pid-component":if(!customElements.get(o(t))){Y()}break;case"pid-data-table":if(!customElements.get(o(t))){Q()}break;case"pid-pagination":if(!customElements.get(o(t))){h()}break;case"pid-tooltip":if(!customElements.get(o(t))){u()}break}}))}export{_ as P,H as a,Q as b,Y as d};
//# sourceMappingURL=p-CJAlmDgx.js.map