dev-process-kit 0.0.18 → 0.2.0

package/dist/chunks/shared-C-7mxPbV.js

@@ -0,0 +1,301 @@
+import{p as I,au as M,ak as E,al as N,ai as $,bk as V,bl as G,bm as k,bn as W,C as J,bo as D,bp as T,V as R,bq as S,br as q,bs as m,bt as y,bu as K,bv as j,ae as Y,P as _,bw as Z,ag as Q,a0 as X,aZ as u,a2 as ee,T as te,bx as ae,aa as ie,ax as se,by as oe,bz as P,bA as w,a3 as v,J as ne,a4 as f,bB as re,bC as de,bD as pe,bE as le,A as ce,bF as he}from"./shared-DnJBtKmH.js";const be=[["path",{d:"M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z"}],["path",{d:"M14 2v5a1 1 0 0 0 1 1h5"}],["path",{d:"M10 9H8"}],["path",{d:"M16 13H8"}],["path",{d:"M16 17H8"}]],ue=[["rect",{width:"18",height:"7",x:"3",y:"3",rx:"1"}],["rect",{width:"9",height:"7",x:"3",y:"14",rx:"1"}],["rect",{width:"5",height:"7",x:"16",y:"14",rx:"1"}]],ge=[["path",{d:"M13 5h8"}],["path",{d:"M13 12h8"}],["path",{d:"M13 19h8"}],["path",{d:"m3 17 2 2 4-4"}],["path",{d:"m3 7 2 2 4-4"}]],me=[["path",{d:"M14.106 5.553a2 2 0 0 0 1.788 0l3.659-1.83A1 1 0 0 1 21 4.619v12.764a1 1 0 0 1-.553.894l-4.553 2.277a2 2 0 0 1-1.788 0l-4.212-2.106a2 2 0 0 0-1.788 0l-3.659 1.83A1 1 0 0 1 3 19.381V6.618a1 1 0 0 1 .553-.894l4.553-2.277a2 2 0 0 1 1.788 0z"}],["path",{d:"M15 5.764v15"}],["path",{d:"M9 3.236v15"}]],fe=[["path",{d:"M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8"}],["path",{d:"M10 19v-3.96 3.15"}],["path",{d:"M7 19h5"}],["rect",{width:"6",height:"10",x:"16",y:"12",rx:"2"}]],ve=[["path",{d:"m18 13-.654-4.736a4 4 0 00-2.756-3.266l-9.163-2.9a2 2 0 00-2.017.493l-.82.819a2 2 0 00-.492 2.017l2.9 9.163a4 4 0 003.266 2.756L13 18"}],["path",{d:"M18.648 12.352a1.205 1.205 0 011.704 0l1.296 1.296a1.205 1.205 0 010 1.704l-6.296 6.296a1.205 1.205 0 01-1.704 0l-1.296-1.296a1.205 1.205 0 010-1.704z"}],["path",{d:"m3 3 6.586 6.586"}],["circle",{cx:"11",cy:"11",r:"2"}]],ke=[["path",{d:"M2 3h20"}],["path",{d:"M21 3v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V3"}],["path",{d:"m7 21 5-5 5 5"}]],ye=[["path",{d:"M12 18v4"}],["path",{d:"M2 14.499a5.5 5.5 0 0 0 9.591 3.675.6.6 0 0 1 .818.001A5.5 5.5 0 0 0 22 14.5c0-2.29-1.5-4-3-5.5l-5.492-5.312a2 2 0 0 0-3-.02L5 8.999c-1.5 1.5-3 3.2-3 5.5"}]],xe=[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2"}],["path",{d:"M8 7v7"}],["path",{d:"M12 7v4"}],["path",{d:"M16 7v9"}]],Ae=[["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"}]],H=E($(),V(G)),x={ADD_BOARD:I("ADD_BOARD","page",M({board:H,template:E($(),N(1)),label:E($(),N(1))}),{mode:"append"}),REMOVE_BOARD:I("REMOVE_BOARD","page",M({board:H}),{mode:"append"})},$e="## How to apply",we=(r,e)=>{const t=new Map;for(const o of e){const l=k(o.target)?.board;if(l===void 0||W(o))continue;const p=t.get(l)??{changes:0,comments:0};o.type===J?p.comments+=1:p.changes+=1,t.set(l,p)}return[`## Boards (${r.length})`,"","This page is a `<dpk-page>` holding several templates as boards. Every target ending in `@<board>` belongs to that board: apply it to the `dpk-template-*` child with that `board` attribute, against its own base JSON and action vocabulary, with the qualifier removed. `page:page` is the page as a whole.","",'`ADD_BOARD` on `page:page` asks for a new child `<dpk-template-<template> board="<board>" label="<label>">` whose base JSON is built from the actions on `@<board>`; `REMOVE_BOARD` asks to take that child out, with everything the draft says about it.',"",...r.map(o=>{const l=t.get(o.id)??{changes:0,comments:0};return`- \`${o.id}\` \u2014 ${o.label} (\`${o.definition.name}\`): ${l.changes} change(s), ${l.comments} comment(s)`}),""]},Be=(r,e)=>{const t=r.indexOf($e),o=`${e.join(`
+`)}
+`;return t<0?`${r}
+${o}`:`${r.slice(0,t)}${o}${r.slice(t)}`},Oe=M({title:Q($())}),Me={schema:Z(),mode:"append",targetType:"unknown"},Ee="page",De=(r,e)=>{if(!e.has(r))return r;let t=2;for(;e.has(`${r}-${t}`);)t+=1;return`${r}-${t}`},Te=r=>{const e=r.messages,t=a=>r.catalog().find(s=>s.name===a),o=(a,s)=>{const i=a.layout.find(c=>c.id===s);if(i===void 0||!Object.hasOwn(a.boards,s))return;const n=r.boards().find(c=>c.id===s)?.definition??t(i.template);return n===void 0?void 0:{id:s,label:i.label,definition:n}},l=a=>a.layout.flatMap(s=>{const i=o(a,s.id);return i===void 0?[]:[i]}),p=(a,s)=>{const i=k(s);return i===null?null:{...i,spec:o(a,i.board)}},d=(a,s)=>({...a,target:s}),h=(a,s,i)=>({...a,boards:{...a.boards,[s]:i}}),g=(a,s)=>{const i=l(a);return i.find(n=>n.id===s[m])??i[0]},A=(a,s)=>({title:a.type==="comment"?e.comment:a.type,targetLabel:s,tone:a.type==="comment"?"comment":"meta"}),C=a=>{const s=r.base();return{title:a,layout:s.layout,boards:s.boards}},F=(a,s)=>{const i=_(x,s);if(i===null)return null;const{board:n}=i.payload,c=a.layout.some(b=>b.id===n);if(i.type==="ADD_BOARD"){const b=t(i.payload.template);if(c||b===void 0)return null;const z=b.emptyBase();return{...a,layout:[...a.layout,{id:n,template:b.name,label:i.payload.label}],boards:{...a.boards,[n]:z}}}return c?{...a,layout:a.layout.filter(b=>b.id!==n),boards:Object.fromEntries(Object.entries(a.boards).filter(([b])=>b!==n))}:null},U=a=>{const s=_(x,a);if(s===null)return A(a,e.wholePage);if(s.type==="ADD_BOARD"){const n=t(s.payload.template)?.label??s.payload.template;return{title:e.boardAdded,targetLabel:`${s.payload.label} (${n})`,tone:"create"}}const i=r.base().layout.find(n=>n.id===s.payload.board)?.label;return{title:e.boardRemoved,targetLabel:i??s.payload.board,tone:"delete"}};return{name:Ee,label:e.label,parseBase:a=>C(Y(Oe,a).title??e.untitled),emptyBase:()=>C(e.untitled),get actions(){return Object.fromEntries([...r.boards().flatMap(a=>Object.entries(a.definition.actions)),...Object.entries(x)])},actionFor:(a,s)=>{if(s===void 0||y(s))return j(x,a);const i=k(s);if(i===null)return;const n=r.boards().find(c=>c.id===i.board);return n===void 0?Me:j(n.definition.actions,a)},apply:(a,s)=>{if(y(s.target))return F(a,s);const i=p(a,s.target);if(i?.spec===void 0)return null;const n=i.spec.definition.apply(a.boards[i.board],d(s,i.target));return n===null?null:h(a,i.board,n)},canonicalState:a=>({...a,boards:Object.fromEntries(Object.entries(a.boards).map(([s,i])=>{const n=o(a,s)?.definition;return[s,n?.canonicalState?n.canonicalState(i):i]}))}),canonicalTarget:(a,s)=>{const i=p(a,s),n=i?.spec?.definition;return i===null||n?.canonicalTarget===void 0?s:K(n.canonicalTarget(a.boards[i.board],i.target),i.board)},hasTarget:(a,s)=>{if(y(s))return!0;const i=p(a,s);return i?.spec===void 0?!1:i.spec.definition.hasTarget(a.boards[i.board],i.target)},pageTargetExists:(a,s)=>y(s)||p(a,s)?.spec!==void 0,describe:(a,s,i)=>{if(y(a.target))return a.type==="comment"?A(a,e.wholePage):U(a);const n=p(s,a.target);if(n===null)return A(a,R(a.target));if(n.spec===void 0)return A(a,e.missingBoard(n.board));const c=n.spec.definition.describe(d(a,n.target),s.boards[n.board],i?.boards[n.board]);return{...c,targetLabel:`${n.spec.label} \u203A ${c.targetLabel}`}},serialize:a=>{const s=k(a.target),i=s===null?void 0:r.boards().find(n=>n.id===s.board);return s===null||i===void 0?`${a.type} ${R(a.target)} ${JSON.stringify(a.payload)}`:`${i.definition.serialize(d(a,s.target))} @${s.board}`},resolveNavigation:(a,s)=>{const i=g(a,s),n=i===void 0?{}:{[m]:i.id};for(const c of l(a)){const b=c.definition.resolveNavigation(a.boards[c.id],D(s,c.id));Object.assign(n,q(c.id,b))}return n},navigationFor:(a,s)=>{const i=p(a,s);if(i?.spec===void 0)return null;const n=i.spec.definition.navigationFor?.(a.boards[i.board],i.target)??null;return{[m]:i.board,...q(i.board,n??{})}},commentTargets:(a,s)=>[{value:R(S),label:e.wholePage,group:e.pageGroup},...l(a).flatMap(i=>i.definition.commentTargets(a.boards[i.id],D(s,i.id)).map(n=>({value:T(n.value,i.id),label:n.label,group:n.group===void 0?i.label:`${i.label} \xB7 ${n.group}`})))],currentTarget:(a,s)=>{const i=g(a,s);if(i===void 0)return null;const n=i.definition.currentTarget?.(a.boards[i.id],D(s,i.id));return n==null?{value:T(`page:${i.definition.name}`,i.id),label:i.label}:{...n,value:T(n.value,i.id),label:`${i.label} \u203A ${n.label}`}},title:a=>a.title}},B=X({en:{label:"Page",wholePage:"Whole page",boards:"Boards",pageGroup:"Page",comment:"Comment",missingBoard:r=>`Board "${r}" (no longer on the page)`,untitled:"Untitled page",addBoard:"Add a board",removeBoard:r=>`Remove board "${r}"`,boardAdded:"Board added",boardRemoved:"Board removed"},ja:{label:"\u30DA\u30FC\u30B8",wholePage:"\u30DA\u30FC\u30B8\u5168\u4F53",boards:"\u30DC\u30FC\u30C9",pageGroup:"\u30DA\u30FC\u30B8",comment:"\u30B3\u30E1\u30F3\u30C8",missingBoard:r=>`\u30DC\u30FC\u30C9\u300C${r}\u300D\uFF08\u30DA\u30FC\u30B8\u304B\u3089\u7121\u304F\u306A\u308A\u307E\u3057\u305F\uFF09`,untitled:"\u7121\u984C\u306E\u30DA\u30FC\u30B8",addBoard:"\u30DC\u30FC\u30C9\u3092\u8FFD\u52A0",removeBoard:r=>`\u30DC\u30FC\u30C9\u300C${r}\u300D\u3092\u524A\u9664`,boardAdded:"\u30DC\u30FC\u30C9\u3092\u8FFD\u52A0",boardRemoved:"\u30DC\u30FC\u30C9\u3092\u524A\u9664"}}),Re=r=>r instanceof HTMLElement&&"definition"in r&&"api"in r&&he(r)!==null,Se=r=>typeof r=="object"&&r!==null&&"name"in r&&"emptyBase"in r,L=(r,e)=>r.flatMap(t=>{const o=k(t.target);return o?.board===e?[{...t,target:o.target}]:[]}),_e=r=>{try{return r.matches(":popover-open")}catch{return!1}},Pe=u(ue),O="dpk-page-add-menu",Ce={width:260,height:420},Ie=ee`
+  .dpk-main {
+    overflow: hidden;
+  }
+
+  .dpk-main-body {
+    display: flex;
+    flex: 1 1 0%;
+    min-height: 0;
+    padding: 0;
+    animation: none;
+  }
+
+  .dpk-page {
+    flex: 1 1 auto;
+    display: grid;
+    grid-template-columns: auto minmax(0, 1fr);
+    min-width: 0;
+    min-height: 0;
+  }
+
+  .dpk-page-rail {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 4px;
+    padding: 6px 4px;
+    border-right: 1px solid var(--dpk-rule);
+    background: var(--dpk-paper-sunken);
+    overflow-y: auto;
+  }
+
+  .dpk-page-tabs {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+  }
+
+  .dpk-page-tab-item {
+    position: relative;
+  }
+
+  .dpk-page-tab {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 3px;
+    width: 52px;
+    padding: 6px 2px 5px;
+    border: 1px solid transparent;
+    border-radius: var(--dpk-radius);
+    background: transparent;
+    color: var(--dpk-ink-soft);
+    font: 600 10px / 1.2 var(--dpk-body);
+    overflow-wrap: anywhere;
+    text-align: center;
+    cursor: pointer;
+    transition:
+      background 160ms var(--dpk-ease),
+      color 160ms var(--dpk-ease);
+  }
+
+  .dpk-page-tab-icon {
+    display: grid;
+    place-items: center;
+  }
+
+  .dpk-page-tab-icon svg {
+    width: 22px;
+    height: 22px;
+    stroke-width: 1.75;
+  }
+
+  .dpk-page-tab:hover {
+    background: var(--dpk-paper-raised);
+    color: var(--dpk-ink);
+  }
+
+  .dpk-page-tab[aria-selected='true'] {
+    border-color: var(--dpk-rule-strong);
+    background: var(--dpk-paper-raised);
+    color: var(--dpk-accent);
+    box-shadow: var(--dpk-shadow-xs);
+  }
+
+  .dpk-page-tab:focus-visible,
+  .dpk-page-tab-remove:focus-visible,
+  .dpk-page-add:focus-visible {
+    outline: 2px solid var(--dpk-focus);
+    outline-offset: 2px;
+  }
+
+  .dpk-page-tab-count {
+    position: absolute;
+    top: -3px;
+    right: -3px;
+    min-width: 16px;
+    height: 16px;
+    padding: 0 4px;
+    border: 2px solid var(--dpk-paper-sunken);
+    border-radius: 999px;
+    background: var(--dpk-accent);
+    color: var(--dpk-accent-ink);
+    font-size: 9px;
+    line-height: 12px;
+  }
+
+  /* Shown on the board under the pointer or keyboard focus, opposite its count. */
+  .dpk-page-tab-remove {
+    position: absolute;
+    top: -3px;
+    left: -3px;
+    display: grid;
+    place-items: center;
+    width: 18px;
+    height: 18px;
+    padding: 0;
+    border: 1px solid var(--dpk-rule-strong);
+    border-radius: 999px;
+    background: var(--dpk-paper-raised);
+    color: var(--dpk-ink-soft);
+    cursor: pointer;
+    opacity: 0;
+    transition: opacity 120ms var(--dpk-ease);
+  }
+
+  .dpk-page-tab-remove svg {
+    width: 11px;
+    height: 11px;
+  }
+
+  .dpk-page-tab-remove:hover {
+    color: var(--dpk-danger, var(--dpk-ink));
+  }
+
+  .dpk-page-tab-item:hover > .dpk-page-tab-remove,
+  .dpk-page-tab-item:focus-within > .dpk-page-tab-remove {
+    opacity: 1;
+  }
+
+  .dpk-page-add {
+    display: grid;
+    place-items: center;
+    width: 32px;
+    height: 32px;
+    margin-top: 2px;
+    padding: 0;
+    border: 1px dashed var(--dpk-rule-strong);
+    border-radius: var(--dpk-radius);
+    background: transparent;
+    color: var(--dpk-ink-soft);
+    cursor: pointer;
+  }
+
+  .dpk-page-add:hover,
+  .dpk-page-add[aria-expanded='true'] {
+    border-style: solid;
+    background: var(--dpk-paper-raised);
+    color: var(--dpk-ink);
+  }
+
+  .dpk-page-add svg {
+    width: 16px;
+    height: 16px;
+  }
+
+  .dpk-page-add-option .dpk-settings-check svg {
+    width: 16px;
+    height: 16px;
+  }
+
+  /* The header reads "title / board ⚙": the title keeps its width and the board follows it. */
+  .dpk-title {
+    flex: 0 1 auto;
+  }
+
+  .dpk-header-slot {
+    flex: 1 1 0%;
+  }
+
+  .dpk-page-heading {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    min-width: 0;
+  }
+
+  .dpk-page-crumb {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    min-width: 0;
+    color: var(--dpk-ink-soft);
+    font-size: 13px;
+    font-weight: 600;
+    white-space: nowrap;
+  }
+
+  .dpk-page-crumb::before {
+    content: '/';
+    color: var(--dpk-rule-strong);
+    font-weight: 400;
+  }
+
+  .dpk-page-crumb svg {
+    width: 15px;
+    height: 15px;
+  }
+
+  .dpk-page-boards {
+    display: grid;
+    min-width: 0;
+    min-height: 0;
+  }
+
+  ::slotted(*) {
+    min-width: 0;
+    min-height: 0;
+  }
+
+  /* Important: the page's own CSS often gives a template display: block. */
+  ::slotted([hidden]) {
+    display: none !important;
+  }
+`;class Ne extends te{static{this.styles=[ae,Ie]}#s=!1;#a=!1;#o="";#n=new WeakMap;#i=new WeakMap;#b=new Map;#u;#t=!1;#k=new ie(this);constructor(){super(),new se(this,{open:()=>this.#t,closesOn:e=>!e.some(t=>t instanceof Element&&(t.id===O||t.matches(".dpk-page-add"))),ownsEscape:()=>!0,dismiss:()=>this.#h(!1)})}boardTemplates(){return[]}definitionFor(e){return Te({boards:()=>this.#y(),base:()=>this.#d(),catalog:()=>this.#p(),messages:B(e)})}connectedCallback(){super.connectedCallback(),this.api.ready.then(()=>{this.#a=!0,this.#o=this.#m(this.#r()),this.requestUpdate()})}get[oe](){if(this.#a)return this.#u??={locale:()=>this.locale,theme:()=>this.dataset.theme,navigation:()=>this.navigation,boardIds:()=>new Set(this.#e().map(e=>e.board??"")),dispatch:e=>this.dispatch(e),dispatchBatch:e=>this.dispatchBatch(e),editComment:(e,t)=>this.editComment(e,t),removeAction:e=>this.removeAction(e),clearActions:()=>this.clearActions(),navigate:(e,t)=>this.navigate(e,t),hashFor:e=>this.hashFor(e),requestComment:e=>this.requestComment(e)},this.#u}#e(){return Array.from(this.children).filter(Re)}#r(){return this.#e().filter(e=>!e.hasAttribute(P))}#g(e){return e.getAttribute("label")??e.definition.label}#d(){const e=this.#r();return{layout:e.map(t=>({id:t.board??"",template:t.definition.name,label:this.#g(t)})),boards:Object.fromEntries(e.map(t=>[t.board??"",t.api.base]))}}#m(e){return e.map(t=>t.board??"").join(" ")}#y(){return this.#e().map(e=>({id:e.board??"",label:this.#g(e),definition:e.definition}))}#p(){const e=this.locale,t=this.#b.get(e);if(t!==void 0)return t;const o=this.boardTemplates(),l=o.flatMap(({name:p})=>{const d=`dpk-template-${p}`;if(customElements.get(d)===void 0)return[];const h=document.createElement(d);h.setAttribute("lang",e);const g="definition"in h?h.definition:void 0;return Se(g)?[g]:[]});return l.length===o.length&&this.#b.set(e,l),l}#l(e){return this.#e().find(t=>t.board===e.id)?.definition??this.#p().find(t=>t.name===e.template)}#c(e){return this.boardTemplates().find(t=>t.name===e)?.icon??Pe}pendingStart(){return this.#s?null:this.#f().then(()=>{this.#s=!0;for(const e of this.#e())this.#i.set(e,!0)})}#f(){const e=new Set(Array.from(this.children).filter(t=>t.hasAttribute(w)).map(t=>t.localName));return Promise.all(Array.from(e,t=>customElements.whenDefined(t))).then(()=>Promise.all(this.#e().map(t=>t.api.ready))).then(()=>{})}#x(){this.#a&&this.#f().then(()=>{const e=this.#m(this.#r());e!==this.#o&&(this.#o=e,this.#n=new WeakMap,this.controller.setBase({...this.controller.base,...this.#d()}))})}scriptOf(e){return this.querySelector(`:scope > ${e}`)}hasSidebarContent(){return!1}hasFooterContent(){return this.querySelector(':scope > [slot="footer"]')!==null}buildBrief(e){const t=e.state.layout.flatMap(o=>{const l=this.#l(o);return l===void 0?[]:[{id:o.id,label:o.label,definition:l}]});return Be(super.buildBrief(e),we(t,e.actions))}templateIdentity(){const e=this.#a?this.#v(this.api.state,this.navigation):void 0;return(e===void 0?void 0:this.#l(e))??super.templateIdentity()}#v(e,t){return e.layout.find(o=>o.id===t[m])}renderRegions(e){const t=B(this.locale),o=e.state.layout,l=this.#v(e.state,e.navigation),p=this.#p();return{sidebarHidden:!0,header:l===void 0?v:this.#A(e,l),main:f`<div class="dpk-page">
+        <nav class="dpk-page-rail" aria-label=${t.boards}>
+          <div
+            class="dpk-page-tabs"
+            role="tablist"
+            aria-orientation="vertical"
+            @keydown=${d=>this.#M(d,o)}
+          >
+            ${o.map(d=>this.#$(d,d.id===l?.id,L(e.actions,d.id).length,o.length))}
+          </div>
+          ${p.length===0?v:f`<button
+                  class="dpk-page-add"
+                  type="button"
+                  aria-label=${t.addBoard}
+                  title=${t.addBoard}
+                  aria-haspopup="menu"
+                  aria-controls=${O}
+                  aria-expanded=${this.#t?"true":"false"}
+                  @click=${()=>this.#h(!this.#t)}
+                >
+                  ${ne()}
+                </button>`}
+          ${this.#t?this.#w(p):v}
+        </nav>
+        <div class="dpk-page-boards"><slot @slotchange=${()=>this.#x()}></slot></div>
+      </div>`}}#A(e,t){const o=this.#e().find(g=>g.board===t.id),l=o?.definition.settings?.(e.state.boards[t.id]),p=o!==void 0&&l!==void 0&&l.items.length>0,d=re(this.locale),h={toggle:()=>{this.settingsOpen=!this.settingsOpen},flip:g=>{o?.api.dispatch(g)}};return f`<div class="dpk-page-heading ${de}">
+      <span class="dpk-page-crumb">${this.#c(t.template)()} ${t.label}</span>
+      ${p?pe(this.settingsOpen,d,h):v}
+      ${p&&this.settingsOpen?le(l,d,h):v}
+    </div>`}#$(e,t,o,l){const p=B(this.locale),d=this.#l(e)?.label??e.template;return f`<div class="dpk-page-tab-item" role="presentation">
+      <button
+        class="dpk-page-tab"
+        type="button"
+        role="tab"
+        data-board=${e.id}
+        aria-selected=${t?"true":"false"}
+        tabindex=${t?0:-1}
+        title=${`${e.label} \xB7 ${d}`}
+        @click=${()=>this.navigate({[m]:e.id})}
+      >
+        <span class="dpk-page-tab-icon">${this.#c(e.template)()}</span>
+        <span class="dpk-page-tab-label">${e.label}</span>
+        ${o>0?f`<span class="dpk-page-tab-count">${o}</span>`:v}
+      </button>
+      ${l>1?f`<button
+              class="dpk-page-tab-remove"
+              type="button"
+              data-board=${e.id}
+              tabindex="-1"
+              aria-label=${p.removeBoard(e.label)}
+              title=${p.removeBoard(e.label)}
+              @click=${()=>this.#O(e.id)}
+            >
+              ${ce()}
+            </button>`:v}
+    </div>`}#w(e){const t=B(this.locale);return f`<div
+      id=${O}
+      class="dpk-settings dpk-page-add-menu"
+      popover="manual"
+      role="menu"
+      aria-label=${t.addBoard}
+    >
+      ${e.map(o=>f`<button
+            class="dpk-settings-option dpk-page-add-option"
+            type="button"
+            role="menuitem"
+            data-template=${o.name}
+            @click=${()=>this.#B(o)}
+          >
+            <span class="dpk-settings-check" aria-hidden="true">${this.#c(o.name)()}</span>
+            <span class="dpk-settings-text"><span class="dpk-settings-name">${o.label}</span></span>
+          </button>`)}
+    </div>`}#h(e){this.#t!==e&&(this.#t=e,this.requestUpdate())}#B(e){this.#h(!1);const t=new Set([...this.api.state.layout.map(p=>p.id),...Array.from(this.children,p=>p.getAttribute(w)??"")]),o=De(e.name,t);this.dispatch({type:"ADD_BOARD",target:S,payload:{board:o,template:e.name,label:e.label}}).ok&&this.navigate({[m]:o})}#O(e){const t=this.controller.actions,o=t.find(p=>{if(!y(p.target))return!1;const d=_(x,p);return d?.type==="ADD_BOARD"&&d.payload.board===e}),l=this.#d().layout.some(p=>p.id===e);if(o===void 0||l){this.dispatch({type:"REMOVE_BOARD",target:S,payload:{board:e}});return}for(const p of t)k(p.target)?.board===e&&this.removeAction(p.id);this.removeAction(o.id)}#M(e,t){const o=t.findIndex(h=>h.id===this.navigation[m]),l=t.length-1,p=e.key==="ArrowDown"?Math.min(l,o+1):e.key==="ArrowUp"?Math.max(0,o-1):e.key==="Home"?0:e.key==="End"?l:null,d=p===null?void 0:t[p];d!==void 0&&(e.preventDefault(),this.navigate({[m]:d.id}),this.updateComplete.then(()=>this.renderRoot.querySelector(`.dpk-page-tab[data-board="${d.id}"]`)?.focus()))}updated(){super.updated(),this.#E(),this.#D()}#E(){const e=this.renderRoot.querySelector(`#${O}`),t=this.renderRoot.querySelector(".dpk-page-add");!e||!t||_e(e)||this.#k.open(e,t,Ce,{placement:"right-end"})}#D(){if(!this.#s)return;const e=this.api.state.layout,t=new Set(e.map(d=>d.id));for(const d of this.#e())d.hasAttribute(P)&&!t.has(d.board??"")&&d.remove();const o=new Set(Array.from(this.children,d=>d.getAttribute(w)));for(const d of e)o.has(d.id)||this.#T(d);const l=this.controller.actions,p=this.navigation[m];for(const d of this.#e()){const h=d.board??"";d.hidden=h!==p||!t.has(h),this.#R(d)&&(this.#n.get(d)!==l&&(this.#n.set(d,l),d.controller.replaceActions(L(l,h))),d.requestUpdate())}}#T(e){const t=`dpk-template-${e.template}`;if(customElements.get(t)===void 0)return;const o=document.createElement(t);o.setAttribute(w,e.id),o.setAttribute("label",e.label),o.setAttribute(P,""),o.hidden=!0,this.append(o)}#R(e){const t=this.#i.get(e);return t!==void 0?t:(this.#i.set(e,!1),e.api.ready.then(()=>{this.#i.set(e,!0),this.requestUpdate()}),!1)}}const qe=[{name:"usm",icon:u(me)},{name:"event-storming",icon:u(Ae)},{name:"example-mapping",icon:u(ge)},{name:"prototype",icon:u(fe)},{name:"task-board",icon:u(xe)},{name:"delegation-poker",icon:u(ye)},{name:"whiteboard",icon:u(ve)},{name:"slides",icon:u(ke)},{name:"plain",icon:u(be)}];class je extends Ne{boardTemplates(){return qe}}const He=()=>{customElements.get("dpk-page")||customElements.define("dpk-page",je)};export{He as d};