dev-process-kit 0.3.0-beta.2 → 0.3.0

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.
Files changed (36) hide show
  1. package/README.md +8 -8
  2. package/dist/boards.js +1 -1
  3. package/dist/chunks/shared-BFraiskj.js +3662 -0
  4. package/dist/chunks/{shared-B-DAJvq3.js → shared-BYbcHniE.js} +34 -34
  5. package/dist/chunks/{shared-D2qgtKhc.js → shared-B_Tiv_T3.js} +1 -1
  6. package/dist/chunks/shared-BfByEotW.js +6322 -0
  7. package/dist/chunks/{shared-CPNa9lTa.js → shared-Bs2YYFvO.js} +1 -1
  8. package/dist/chunks/shared-D4PPk0Dk.js +1 -0
  9. package/dist/chunks/shared-DMksNmni.js +1 -0
  10. package/dist/chunks/{shared-Dgse8blZ.js → shared-DNsl9DK1.js} +1 -1
  11. package/dist/chunks/shared-DYDJzB79.js +5222 -0
  12. package/dist/chunks/shared-DegJ_tfw.js +767 -0
  13. package/dist/chunks/{shared-C7wOrDIL.js → shared-DqlTHpRQ.js} +1 -1
  14. package/dist/chunks/{shared-BdIN9A6O.js → shared-FMBoDqPg.js} +1 -1
  15. package/dist/chunks/shared-Ln6ei2B2.js +1864 -0
  16. package/dist/chunks/shared-RvLH2Fqp.js +1598 -0
  17. package/dist/chunks/{shared-BT5Ayp_z.js → shared-TtB-p2Zh.js} +1 -1
  18. package/dist/chunks/{shared-DOKOFdYm.js → shared-WtWbdwp_.js} +3 -3
  19. package/dist/chunks/{shared-CPwjSgu0.js → shared-epAjO2d1.js} +1 -1
  20. package/dist/components.js +1 -1
  21. package/dist/index.js +1 -1
  22. package/dist/views/delegation-poker.js +1 -1
  23. package/dist/views/plain.js +1 -1
  24. package/dist/views/prototype.js +1 -1
  25. package/dist/views/slides.js +1 -1
  26. package/dist/views/task-board.js +1 -1
  27. package/dist/views/usm.js +1 -1
  28. package/package.json +1 -1
  29. package/dist/chunks/shared-BTf38OnF.js +0 -1
  30. package/dist/chunks/shared-BXejn2ZQ.js +0 -4928
  31. package/dist/chunks/shared-CE8X9qCv.js +0 -1636
  32. package/dist/chunks/shared-CpJDPnHA.js +0 -573
  33. package/dist/chunks/shared-DgexE4u1.js +0 -1862
  34. package/dist/chunks/shared-DnJcdL52.js +0 -3586
  35. package/dist/chunks/shared-HdOOfyqP.js +0 -6208
  36. package/dist/chunks/shared-TrlnHjrJ.js +0 -1
@@ -1,1636 +0,0 @@
1
- import{au as Re,bf as P,av as b,aw as i,aa as x,ac as c,az as $,aM as h,aB as Z,aN as W,ax as ee,ay as ae,p as y,t as Ie,aC as Qe,aO as Ue,aA as He,ab as R,N as Me,e as Ke,a5 as Fe,S as je,P as z,ai as d,as as n,z as Ye,aH as w,bc as te,bd as Ve,I as Xe,bz as I,ah as Je,V as oe,bh as Ze,l as ea,b9 as aa}from"./shared-BXejn2ZQ.js";import{a as ta}from"./shared-BdIN9A6O.js";import{D as oa,d as ra}from"./shared-C7wOrDIL.js";import{o as T}from"./shared-BTf38OnF.js";const re=["working","waiting","blocked","done"],A=["todo","doing","blocked","done"],ne=["agent","human"],q=["why","what","goals","nonGoals"],O=ee(c(),ae(1)),na=b({id:h,name:O,kind:i($(ne),"agent")}),sa=b({id:h,title:O,status:i($(A),"todo"),assignee:i(h),note:i(c()),proposed:i(Z(),!1),reason:i(c()),questions:W}),da=b({id:h,label:i(c()),href:O,kind:i(c()),description:i(c()),questions:W}),ia=b({why:i(c()),what:i(c()),goals:i(x(c()),[]),nonGoals:i(x(c()),[])}),la=b({id:h,from:i(h),at:i(c()),title:i(c()),body:i(c()),points:i(x(c()),[]),questions:W}),pa=b({id:h,ref:i(O),title:O,description:i(c()),blocking:i(Z(),!1),assumption:i(c())}),se=b({title:i(c(),""),status:i($(re)),updatedAt:i(c()),context:i(ia,{}),members:i(x(na),[]),todos:i(x(sa),[]),outputs:i(x(da),[]),log:i(x(la),[]),questions:i(x(pa),[])}),S=(a,e)=>{const t=new Set;for(const o of e){if(t.has(o))throw new Error(`duplicate ${a} id: ${o}`);t.add(o)}},u=a=>a===void 0||a.trim()===""?null:a,Q=a=>a.filter(e=>e.trim()!==""),de=a=>{const e=Re(se,a);S("member",e.members.map(o=>o.id)),S("todo",e.todos.map(o=>o.id)),S("output",e.outputs.map(o=>o.id)),S("log",e.log.map(o=>o.id)),S("question",e.questions.map(o=>o.id));const t=new Set(e.members.map(o=>o.id));for(const o of e.todos)if(o.assignee!==void 0&&!t.has(o.assignee))throw new Error(`todo ${o.id} is assigned to ${o.assignee}, which is not in members`);for(const o of e.log){if(o.from!==void 0&&!t.has(o.from))throw new Error(`log entry ${o.id} is from ${o.from}, which is not in members`);if(u(o.title)===null&&u(o.body)===null)throw new Error(`log entry ${o.id} needs a title or a body`)}for(const o of e.questions)if(!o.blocking&&u(o.assumption)===null)throw new Error(`question ${o.id} does not block, so it needs the assumption the agent works on`);return{title:e.title,status:e.status??null,updatedAt:u(e.updatedAt),context:{why:u(e.context.why),what:u(e.context.what),goals:Q(e.context.goals),nonGoals:Q(e.context.nonGoals)},members:e.members,todos:e.todos.map(o=>({id:o.id,title:o.title,status:o.status,assignee:o.assignee??null,note:u(o.note),proposed:o.proposed,reason:u(o.reason),added:!1,...P(o.questions)})),outputs:e.outputs.map(o=>({id:o.id,label:u(o.label),href:o.href,kind:u(o.kind),description:u(o.description),...P(o.questions)})),log:e.log.map(o=>({id:o.id,from:o.from??null,at:u(o.at),title:u(o.title),body:u(o.body),points:Q(o.points),...P(o.questions)})),questions:e.questions.map((o,r)=>({id:o.id,ref:o.ref??`Q${r+1}`,title:o.title,description:u(o.description),blocking:o.blocking,assumption:u(o.assumption)})),answers:{},decisions:{}}},ie=()=>({title:"",status:null,updatedAt:null,context:{why:null,what:null,goals:[],nonGoals:[]},members:[],todos:[],outputs:[],log:[],questions:[],answers:{},decisions:{}}),D=(a,e)=>e===null?void 0:a.members.find(t=>t.id===e),k=(a,e)=>a.todos.find(t=>t.id===e),le=(a,e)=>a.log.find(t=>t.id===e),pe=a=>q.includes(a),U=(a,e)=>{const t=a.context[e];return typeof t=="string"||t!==null&&t.length>0},L=(a,e)=>a.questions.find(t=>t.id===e),ce=(a,e)=>{const t=a.answers[e.id];return t===void 0?!1:t.kind==="approve"||t.text.trim()!==""},H=(a,e)=>!e.proposed||a.decisions[e.id]==="accept",_=(a,e)=>H(a,e)&&D(a,e.assignee)?.kind==="human",ue=(a,e,t)=>{const o={...a};return t===null?delete o[e]:o[e]=t,o},M=(a,e,t)=>({...a,answers:ue(a.answers,e,t)}),ca=(a,e,t)=>({...a,decisions:ue(a.decisions,e,t)}),ua=(a,e,t)=>({...a,todos:a.todos.map(o=>o.id===e?t(o):o)}),m={ANSWER_QUESTION:y("ANSWER_QUESTION","question",Qe("kind",[b({kind:R("approve")}),b({kind:R("answer"),text:c()}),b({kind:R("clear")})])),DECIDE_PROPOSAL:y("DECIDE_PROPOSAL","todo",b({decision:$(["accept","decline","clear"])})),SET_TODO_STATUS:y("SET_TODO_STATUS","todo",b({status:$(A)})),ADD_TODO:y("ADD_TODO","page",b({id:h,title:ee(c(),He(),ae(1)),assignee:Ue(h)}),{dedupeKey:Ie}),DELETE_TODO:y("DELETE_TODO","todo",b({}))},be={type:"page",id:"task-board"},K=(a,e)=>({type:"ANSWER_QUESTION",target:{type:"question",id:a},payload:e}),ge=(a,e)=>({type:"DECIDE_PROPOSAL",target:{type:"todo",id:a},payload:{decision:e}}),F=(a,e)=>({type:"SET_TODO_STATUS",target:{type:"todo",id:a},payload:{status:e}}),he=(a,e,t)=>({type:"ADD_TODO",target:be,payload:{id:a,title:e,assignee:t}}),ke=a=>({type:"DELETE_TODO",target:{type:"todo",id:a},payload:{}}),fe=(a,e)=>{const t=Me(m,e);if(t===null)return null;const o=t.target.id;switch(t.type){case"ANSWER_QUESTION":{const r=L(a,o);if(r===void 0)return null;const s=t.payload;return s.kind==="clear"?M(a,o,null):s.kind==="approve"?r.assumption===null?null:M(a,o,{kind:"approve"}):M(a,o,{kind:"answer",text:s.text})}case"DECIDE_PROPOSAL":{if(k(a,o)?.proposed!==!0)return null;const{decision:r}=t.payload;return ca(a,o,r==="clear"?null:r)}case"SET_TODO_STATUS":{const r=k(a,o);if(r===void 0||!_(a,r))return null;const{status:s}=t.payload;return ua(a,o,l=>({...l,status:s}))}case"ADD_TODO":{const{payload:r}=t;return k(a,r.id)!==void 0||r.assignee!==null&&D(a,r.assignee)===void 0?null:{...a,todos:[...a.todos,{id:r.id,title:r.title,status:"todo",assignee:r.assignee,note:null,proposed:!1,reason:null,added:!0}]}}case"DELETE_TODO":return k(a,o)?.added!==!0?null:{...a,todos:a.todos.filter(r=>r.id!==o)};default:return Ke(t)}},j=Fe({en:{wholeBoard:"Whole board",statusWorking:"Working",statusWaiting:"Waiting on you",statusBlocked:"Blocked",statusDone:"Done",todoTodo:"To do",todoDoing:"In progress",todoBlocked:"Blocked",todoDone:"Done",kindAgent:"Agent",kindHuman:"Human",updatedAt:a=>`Updated ${a}`,context:"What this task is about",contextWhy:"Why",contextWhat:"What",contextGoals:"Goals",contextNonGoals:"Non-goals",noContext:"The agent has not written down why and what yet.",tabs:"Board sections",tabContext:"Context",tabLog:"Work log",tabQuestions:"Questions",tabTasks:"Tasks",openCount:a=>`${a} open`,noQuestions:"The agent has nothing to ask right now.",questions:"Questions from the agent",questionsProgress:(a,e)=>`${a} of ${e} replied`,blockingGroup:"Blocking \u2014 the agent waits for your decision",provisionalGroup:"Going ahead on an assumption \u2014 the agent adjusts if you answer otherwise",blockingTag:"Blocking",assumption:"Assumption",recommendation:"Agent recommends",approveAssumption:"OK, go with this",approveRecommendation:"OK, go with the recommendation",answerOther:"Answer differently",answerOf:a=>`Your answer to ${a}`,answerPlaceholder:"What you expect instead\u2026",blockingPlaceholder:"Your decision\u2026",approvedTag:"Approved",answeredTag:"Answered",progress:(a,e)=>`${a} of ${e} done`,noTodosYet:"No todos yet",tasksBoard:"Tasks by status",laneCount:a=>a===1?"1 task":`${a} tasks`,laneEmpty:"Nothing here",dragHint:"Drop on another column to change the status",assignee:"Assignee",unassigned:"Unassigned",memberOption:(a,e)=>`${a} (${e})`,statusOf:a=>`Status of \u201C${a}\u201D`,filterTodos:"Show todos",filterAll:"All",filterHuman:"People",addedTag:"Added by you",changedTag:"Changed",removeAdded:"Remove this todo you added",newTodo:"New todo",newTodoPlaceholder:"Add a todo for the agent\u2026",newTodoAssignee:"Assignee of the new todo",addTodo:"Add",proposedMark:"Proposed by the agent",reason:"Why",accept:"Accept",decline:"Decline",decisionOf:a=>`Decision on \u201C${a}\u201D`,acceptedTag:"Accepted",declinedTag:"Declined",undoDecision:"Undo",outputs:"Outputs",noOutputs:"Nothing has been produced yet.",copy:a=>`Copy ${a}`,copied:"Copied",log:"Conversation with the agent",logLede:"Newest first",noLog:"Nothing has been exchanged yet.",fromAgent:"Agent",latestTag:"Latest",commentOn:a=>`Comment on ${a}`,todoGroup:"Todo",logGroup:"Log",contextGroup:"Context",proposalGroup:"Proposal",questionGroup:"Question",approved:"Approve the assumption",answered:"Answer",answerCleared:"Clear the reply",accepted:"Accept the proposal",declined:"Decline the proposal",decisionCleared:"Clear the decision",statusChanged:"Change the status",todoAdded:"Add a todo",todoRemoved:"Remove the added todo",quoted:a=>`\u2192 \u201C${a}\u201D`,change:(a,e)=>`${a} \u2192 ${e}`},ja:{wholeBoard:"\u30DC\u30FC\u30C9\u5168\u4F53",statusWorking:"\u4F5C\u696D\u4E2D",statusWaiting:"\u3042\u306A\u305F\u306E\u8FD4\u7B54\u5F85\u3061",statusBlocked:"\u30D6\u30ED\u30C3\u30AF\u4E2D",statusDone:"\u5B8C\u4E86",todoTodo:"\u672A\u7740\u624B",todoDoing:"\u9032\u884C\u4E2D",todoBlocked:"\u30D6\u30ED\u30C3\u30AF",todoDone:"\u5B8C\u4E86",kindAgent:"Agent",kindHuman:"\u4EBA\u9593",updatedAt:a=>`\u66F4\u65B0 ${a}`,context:"\u3053\u306E\u30BF\u30B9\u30AF\u306E\u524D\u63D0",contextWhy:"Why \u2014 \u306A\u305C\u3084\u308B\u304B",contextWhat:"What \u2014 \u4F55\u3092\u3084\u308B\u304B",contextGoals:"\u30B4\u30FC\u30EB",contextNonGoals:"\u3084\u3089\u306A\u3044\u3053\u3068",noContext:"Agent \u306F\u307E\u3060 Why / What \u3092\u66F8\u3044\u3066\u3044\u307E\u305B\u3093\u3002",tabs:"\u30DC\u30FC\u30C9\u306E\u533A\u5206",tabContext:"Context",tabLog:"\u4F5C\u696D\u30ED\u30B0",tabQuestions:"\u8CEA\u554F",tabTasks:"\u30BF\u30B9\u30AF",openCount:a=>`\u672A\u56DE\u7B54 ${a} \u4EF6`,noQuestions:"\u4ECA Agent \u304B\u3089\u805E\u304D\u305F\u3044\u3053\u3068\u306F\u3042\u308A\u307E\u305B\u3093\u3002",questions:"Agent \u304B\u3089\u306E\u8CEA\u554F",questionsProgress:(a,e)=>`\u8FD4\u7B54\u6E08\u307F ${a} / ${e}`,blockingGroup:"\u30D6\u30ED\u30C3\u30AB\u30FC \u2014 \u6C7A\u3081\u3066\u3082\u3089\u3046\u307E\u3067\u5148\u306B\u9032\u3081\u306A\u3044",provisionalGroup:"\u4EEE\u306E\u524D\u63D0\u3067\u9032\u884C\u4E2D \u2014 \u9055\u3048\u3070\u65B9\u91DD\u3092\u76F4\u3059",blockingTag:"\u30D6\u30ED\u30C3\u30AB\u30FC",assumption:"\u4EEE\u56DE\u7B54",recommendation:"Agent \u306E\u63A8\u5968",approveAssumption:"\u3053\u306E\u524D\u63D0\u3067 OK",approveRecommendation:"\u63A8\u5968\u3069\u304A\u308A\u3067 OK",answerOther:"\u5225\u306E\u56DE\u7B54\u3092\u3059\u308B",answerOf:a=>`${a} \u3078\u306E\u56DE\u7B54`,answerPlaceholder:"\u671F\u5F85\u3059\u308B\u56DE\u7B54\u3092\u5165\u529B\u2026",blockingPlaceholder:"\u3069\u3046\u3059\u308B\u304B\u3092\u5165\u529B\u2026",approvedTag:"\u627F\u8A8D\u6E08\u307F",answeredTag:"\u56DE\u7B54\u6E08\u307F",progress:(a,e)=>`${e} \u4EF6\u4E2D ${a} \u4EF6\u5B8C\u4E86`,noTodosYet:"Todo \u306F\u307E\u3060\u3042\u308A\u307E\u305B\u3093",tasksBoard:"\u72B6\u614B\u3054\u3068\u306E\u30BF\u30B9\u30AF",laneCount:a=>`${a} \u4EF6`,laneEmpty:"\u306A\u3057",dragHint:"\u5225\u306E\u5217\u306B\u30C9\u30ED\u30C3\u30D7\u3059\u308B\u3068\u72B6\u614B\u304C\u5909\u308F\u308A\u307E\u3059",assignee:"\u62C5\u5F53",unassigned:"\u672A\u5272\u308A\u5F53\u3066",memberOption:(a,e)=>`${a}\uFF08${e}\uFF09`,statusOf:a=>`\u300C${a}\u300D\u306E\u72B6\u614B`,filterTodos:"\u8868\u793A\u3059\u308B Todo",filterAll:"\u3059\u3079\u3066",filterHuman:"\u4EBA\u9593\u306E\u62C5\u5F53",addedTag:"\u3042\u306A\u305F\u304C\u8FFD\u52A0",changedTag:"\u5909\u66F4\u3042\u308A",removeAdded:"\u8FFD\u52A0\u3057\u305F Todo \u3092\u53D6\u308A\u6D88\u3059",newTodo:"\u65B0\u3057\u3044 Todo",newTodoPlaceholder:"Agent \u306B\u983C\u3080 Todo \u3092\u8FFD\u52A0\u2026",newTodoAssignee:"\u65B0\u3057\u3044 Todo \u306E\u62C5\u5F53",addTodo:"\u8FFD\u52A0",proposedMark:"Agent \u304B\u3089\u306E\u63D0\u6848",reason:"\u306A\u305C",accept:"\u627F\u8A8D",decline:"\u898B\u9001\u308A",decisionOf:a=>`\u300C${a}\u300D\u306E\u5224\u65AD`,acceptedTag:"\u627F\u8A8D\u6E08\u307F",declinedTag:"\u898B\u9001\u308A",undoDecision:"\u53D6\u308A\u6D88\u3059",outputs:"\u6210\u679C\u7269",noOutputs:"\u307E\u3060\u6210\u679C\u7269\u306F\u3042\u308A\u307E\u305B\u3093\u3002",copy:a=>`${a} \u3092\u30B3\u30D4\u30FC`,copied:"\u30B3\u30D4\u30FC\u3057\u307E\u3057\u305F",log:"Agent \u3068\u306E\u3084\u308A\u3068\u308A",logLede:"\u65B0\u3057\u3044\u9806",noLog:"\u307E\u3060\u3084\u308A\u3068\u308A\u306F\u3042\u308A\u307E\u305B\u3093\u3002",fromAgent:"Agent",latestTag:"\u6700\u65B0",commentOn:a=>`${a} \u306B\u30B3\u30E1\u30F3\u30C8`,todoGroup:"Todo",logGroup:"\u4F5C\u696D\u30ED\u30B0",contextGroup:"Context",proposalGroup:"\u63D0\u6848",questionGroup:"\u8CEA\u554F",approved:"\u524D\u63D0\u3092\u627F\u8A8D",answered:"\u56DE\u7B54",answerCleared:"\u8FD4\u7B54\u3092\u30AF\u30EA\u30A2",accepted:"\u63D0\u6848\u3092\u627F\u8A8D",declined:"\u63D0\u6848\u3092\u898B\u9001\u308A",decisionCleared:"\u63D0\u6848\u306E\u5224\u65AD\u3092\u30AF\u30EA\u30A2",statusChanged:"\u72B6\u614B\u3092\u5909\u66F4",todoAdded:"Todo \u3092\u8FFD\u52A0",todoRemoved:"\u8FFD\u52A0\u3057\u305F Todo \u3092\u53D6\u308A\u6D88\u3057",quoted:a=>`\u2192 \u300C${a}\u300D`,change:(a,e)=>`${a} \u2192 ${e}`}}),xe=(a,e)=>{switch(e){case"working":return a.statusWorking;case"waiting":return a.statusWaiting;case"blocked":return a.statusBlocked;case"done":return a.statusDone}},E=(a,e)=>{switch(e){case"todo":return a.todoTodo;case"doing":return a.todoDoing;case"blocked":return a.todoBlocked;case"done":return a.todoDone}},ba=(a,e)=>e==="agent"?a.kindAgent:a.kindHuman,B=(a,e)=>{switch(e){case"why":return a.contextWhy;case"what":return a.contextWhat;case"goals":return a.contextGoals;case"nonGoals":return a.contextNonGoals}},me=48,Y=a=>{const e=a.title??a.body??a.id;return e.length<=me?e:`${e.slice(0,me-1)}\u2026`},ga=(a,e,t)=>t===null?a.unassigned:D(e,t)?.name??t,ve=a=>a.title===""?"Task Context Board":a.title,we=(a,e,t)=>{switch(t.type){case"todo":{const o=k(e,t.id);return`${o?.proposed===!0?a.proposalGroup:a.todoGroup} \xB7 ${o?.title??t.id}`}case"log":{const o=le(e,t.id);return`${a.logGroup} \xB7 ${o===void 0?t.id:Y(o)}`}case"context":return`${a.contextGroup} \xB7 ${pe(t.id)?B(a,t.id):t.id}`;case"question":{const o=L(e,t.id);return o===void 0?t.id:`${o.ref} \xB7 ${o.title}`}case"page":return a.wholeBoard;default:return t.id}},ha=(a,e)=>{switch(e){case"accept":return{title:a.accepted,tone:"update"};case"decline":return{title:a.declined,tone:"update"};case"clear":return{title:a.decisionCleared,tone:"delete"}}},ka=(a,e,t)=>{switch(t.type){case"ANSWER_QUESTION":{const o=z(m.ANSWER_QUESTION,t);if(o.kind==="clear")return{title:a.answerCleared,tone:"delete"};if(o.kind==="approve"){const r=L(e,t.target.id)?.assumption??null;return{title:a.approved,tone:"update",...r===null?{}:{body:a.quoted(r)}}}return{title:a.answered,tone:"update",body:a.quoted(o.text.slice(0,120))}}case"DECIDE_PROPOSAL":return ha(a,z(m.DECIDE_PROPOSAL,t).decision);case"SET_TODO_STATUS":{const{status:o}=z(m.SET_TODO_STATUS,t),r=k(e,t.target.id)?.status,s=E(a,o);return{title:a.statusChanged,tone:"update",body:r===void 0?s:a.change(E(a,r),s)}}case"ADD_TODO":{const o=z(m.ADD_TODO,t);return{title:a.todoAdded,tone:"create",targetLabel:`${a.todoGroup} \xB7 ${o.title}`,...o.assignee===null?{}:{body:`${a.assignee}: ${ga(a,e,o.assignee)}`}}}case"DELETE_TODO":return{title:a.todoRemoved,tone:"delete"};default:return{title:t.type,tone:"meta"}}},$e=(a,e,t,o)=>{let r;try{r=ka(a,o??t,e)}catch{r={title:e.type,tone:"meta"}}return{title:r.title,targetLabel:r.targetLabel??we(a,t,e.target),tone:r.tone,...r.body===void 0?{}:{summary:r.body}}},ye=a=>`${a.type} ${je(a.target)} ${JSON.stringify(a.payload)}`,Te=(a,e)=>[...e.questions.map(t=>({value:`question:${t.id}`,label:`${t.ref} \xB7 ${t.title}`,group:a.questionGroup})),...e.todos.map(t=>({value:`todo:${t.id}`,label:t.title,group:t.proposed?a.proposalGroup:a.todoGroup})),...e.log.map(t=>({value:`log:${t.id}`,label:Y(t),group:a.logGroup})),...q.filter(t=>U(e,t)).map(t=>({value:`context:${t}`,label:B(a,t),group:a.contextGroup}))],Ae=(a,e)=>e,Oe=(a,e,t)=>({parts:q.filter(o=>U(e,o)).map(o=>{const r=e.context[o];return{id:o,title:B(a,o),text:typeof r=="string"?r:null,items:typeof r=="string"||r===null?[]:r,comments:t(`context:${o}`)}})}),fa=(a,e,t)=>{const o=a.answers[e.id];return{id:e.id,ref:e.ref,title:e.title,description:e.description,blocking:e.blocking,assumption:e.assumption,reply:o?.kind??"none",resolved:ce(a,e),draft:o?.kind==="answer"?o.text:"",comments:t(`question:${e.id}`)}},Se=(a,e)=>{const t=a.questions.map(r=>fa(a,r,e)),o=t.filter(r=>r.resolved).length;return{blocking:t.filter(r=>r.blocking),provisional:t.filter(r=>!r.blocking),resolved:o,total:t.length,open:t.length-o,blockingOpen:t.filter(r=>r.blocking&&!r.resolved).length}},xa={todo:"gray",doing:"blue",blocked:"red",done:"green"},ma=(a,e,t,o,r)=>{const s=k(t,o.id),l=D(e,o.assignee);return{id:o.id,title:o.title,note:o.note,reason:o.reason,status:o.status,statusLabel:E(a,o.status),assignee:o.assignee,assigneeName:l?.name??null,assigneeKind:l?.kind??null,editable:_(e,o),proposal:o.proposed?e.decisions[o.id]??"pending":null,added:o.added,changed:s!==void 0&&s.status!==o.status,comments:r(`todo:${o.id}`),...o.questions===void 0?{}:{questions:o.questions}}},De=(a,e,t,o,r="all")=>{const s=e.members.some(p=>p.kind==="human"),l=s?r:"all",g=e.todos.map(p=>ma(a,e,t,p,o)),f=p=>p.assigneeKind==="human",Pe=l==="human"?g.filter(f):g,C=e.todos.filter(p=>H(e,p)),J=C.filter(p=>p.status==="done").length;return{lanes:A.map(p=>({status:p,label:E(a,p),tone:xa[p],cards:Pe.filter(We=>We.status===p)})),filter:l,canFilter:s,humanCount:g.filter(f).length,progress:{done:J,total:C.length,label:C.length===0?a.noTodosYet:a.progress(J,C.length)},statuses:A.map(p=>({value:p,label:E(a,p)})),members:e.members.map(p=>({id:p.id,label:a.memberOption(p.name,ba(a,p.kind))}))}},Ee=a=>{if(!/^[a-z][a-z\d+.-]*:\/\//i.test(a))return{kind:"path"};try{return{kind:"url",host:new URL(a).host}}catch{return{kind:"path"}}},Ce=a=>a.outputs.map(e=>({id:e.id,title:e.label??e.href,labelled:e.label!==null,href:e.href,kind:e.kind,description:e.description,place:Ee(e.href),...e.questions===void 0?{}:{questions:e.questions}})),ze=(a,e,t)=>({entries:e.log.map((o,r)=>{const s=D(e,o.from);return{id:o.id,author:s===void 0?null:{name:s.name,kind:s.kind},at:o.at,title:o.title,body:o.body,points:o.points,label:Y(o),latest:r===e.log.length-1,comments:t(`log:${o.id}`),...o.questions===void 0?{}:{questions:o.questions}}}).reverse(),status:e.status===null&&e.updatedAt===null?null:{status:e.status,label:e.status===null?null:xe(a,e.status),updatedAt:e.updatedAt}}),qe=(a,e)=>{switch(e.type){case"todo":return k(a,e.id)!==void 0;case"log":return le(a,e.id)!==void 0;case"context":return pe(e.id)&&U(a,e.id);case"question":return L(a,e.id)!==void 0;case"page":return!0;default:return!1}},Le=a=>{const e=j(a);return{kind:"view",name:"task-board",label:"Task Context Board",addable:!1,parseBase:de,emptyBase:ie,actions:m,apply:fe,hasTarget:qe,describe:(t,o,r)=>$e(e,t,o,r),serialize:ye,resolveNavigation:Ae,commentTargets:t=>Te(e,t),title:ve}},G=(a,e,t,o)=>n`
2
- <button
3
- class="dpk-icon-btn board-comment"
4
- type="button"
5
- data-comment=${a}
6
- aria-label=${e}
7
- title=${e}
8
- @click=${()=>o.comment(a)}
9
- >
10
- ${Ye()} ${t>0?n`<span class="dpk-icon-badge">${t}</span>`:d}
11
- </button>
12
- `,V=(a,e,t,o=null)=>n`
13
- <header class="board-section-head">
14
- <h2 id=${a}>${e}</h2>
15
- ${t===null?d:n`<span class="board-section-meta">${t}</span>`}
16
- </header>
17
- ${o===null?d:n`<p class="board-lede">${o}</p>`}
18
- `,va=(a,e,t,o)=>n`
19
- <section class="board-context" aria-label=${a.context}>
20
- ${e.parts.length===0&&!t?n`<p class="dpk-empty board-empty" data-variant="dashed">${a.noContext}</p>`:d}
21
- ${e.parts.length===0?d:n`<div class="board-context-parts">
22
- ${w(e.parts,r=>r.id,r=>wa(a,r,o))}
23
- </div>`}
24
- <div class="board-figures"><slot name="main"></slot></div>
25
- </section>
26
- `,wa=(a,e,t)=>n`
27
- <article
28
- class="dpk-card board-context-part"
29
- data-context=${e.id}
30
- data-dpk-target=${`context:${e.id}`}
31
- aria-labelledby=${`board-context-${e.id}`}
32
- >
33
- <header class="board-context-head">
34
- <h3 class="board-context-title" id=${`board-context-${e.id}`}>${e.title}</h3>
35
- ${G(`context:${e.id}`,a.commentOn(e.title),e.comments,t)}
36
- </header>
37
- ${e.text===null?d:n`<p class="board-context-text">${e.text}</p>`}
38
- ${e.items.length===0?d:n`<ul class="board-context-items">
39
- ${e.items.map(o=>n`<li>${o}</li>`)}
40
- </ul>`}
41
- </article>
42
- `,$a=(a,e,t)=>e.total===0?d:n`
43
- <section class="board-section" data-section="questions" aria-labelledby="board-questions">
44
- ${V("board-questions",a.questions,a.questionsProgress(e.resolved,e.total))}
45
- ${_e(a,"blocking",a.blockingGroup,e.blocking,t)}
46
- ${_e(a,"provisional",a.provisionalGroup,e.provisional,t)}
47
- </section>
48
- `,_e=(a,e,t,o,r)=>o.length===0?d:n`<div class="board-group" data-group=${e}>
49
- <h3 class="board-group-title">${t}</h3>
50
- <ol class="board-questions">
51
- ${w(o,s=>s.id,s=>ya(a,s,r))}
52
- </ol>
53
- </div>`,ya=(a,e,t)=>{const o=e.assumption!==null;return n`
54
- <li
55
- class="dpk-card board-question"
56
- data-question=${e.id}
57
- data-dpk-target=${`question:${e.id}`}
58
- data-blocking=${String(e.blocking)}
59
- data-reply=${e.reply}
60
- data-resolved=${String(e.resolved)}
61
- >
62
- <div class="dpk-card-head board-question-head">
63
- <span class="board-ref">${e.ref}</span>
64
- <h4 class="dpk-card-title board-question-title">${e.title}</h4>
65
- ${e.resolved?n`<span class="board-tag" data-tone="done">
66
- ${e.reply==="approve"?a.approvedTag:a.answeredTag}
67
- </span>`:d}
68
- ${G(`question:${e.id}`,a.commentOn(e.ref),e.comments,t)}
69
- </div>
70
- ${e.description===null?d:n`<p class="board-question-text">${e.description}</p>`}
71
- ${o?Ta(a,e,t):d}
72
- <textarea
73
- class="dpk-textarea board-answer"
74
- data-answer-text=${e.id}
75
- rows="2"
76
- aria-label=${a.answerOf(e.ref)}
77
- placeholder=${o?a.answerPlaceholder:a.blockingPlaceholder}
78
- .value=${e.draft}
79
- ?hidden=${o&&e.reply!=="answer"}
80
- @input=${r=>{const s=r.currentTarget;s instanceof HTMLTextAreaElement&&t.answer(e.id,!o&&s.value===""?{kind:"clear"}:{kind:"answer",text:s.value})}}
81
- ></textarea>
82
- </li>
83
- `},Ta=(a,e,t)=>n`
84
- <div class="board-assumption">
85
- <span class="board-assumption-label">${e.blocking?a.recommendation:a.assumption}</span>
86
- <p class="board-assumption-text">${e.assumption}</p>
87
- </div>
88
- <div class="board-reply" role="group" aria-label=${a.answerOf(e.ref)}>
89
- <button
90
- type="button"
91
- class="dpk-btn board-approve"
92
- aria-pressed=${e.reply==="approve"?"true":"false"}
93
- @click=${()=>t.answer(e.id,e.reply==="approve"?{kind:"clear"}:{kind:"approve"})}
94
- >
95
- ${te()} ${e.blocking?a.approveRecommendation:a.approveAssumption}
96
- </button>
97
- <button
98
- type="button"
99
- class="dpk-btn dpk-btn--ghost board-other"
100
- aria-pressed=${e.reply==="answer"?"true":"false"}
101
- @click=${()=>e.reply==="answer"?t.answer(e.id,{kind:"clear"}):t.answerOther(e.id)}
102
- >
103
- ${a.answerOther}
104
- </button>
105
- </div>
106
- `,Aa=(a,e,t,o)=>n`
107
- <section class="board-section board-rail-section" data-section="outputs" aria-labelledby="board-outputs">
108
- ${V("board-outputs",a.outputs,e.length===0?null:String(e.length))}
109
- ${e.length===0?n`<p class="dpk-empty board-empty" data-variant="dashed">${a.noOutputs}</p>`:n`<ul class="board-outputs">
110
- ${w(e,r=>r.id,r=>Oa(a,r,t===r.id,o))}
111
- </ul>`}
112
- </section>
113
- `,Oa=(a,e,t,o)=>{const r=e.place,s=t?a.copied:a.copy(e.href);return n`
114
- <li
115
- class="dpk-list-row board-output"
116
- data-output=${e.id}
117
- data-place=${r.kind}
118
- data-grill-questions=${T(e.questions)}
119
- >
120
- <div class="board-output-body">
121
- <div class="board-output-head">
122
- ${e.kind===null?d:n`<span class="board-kind">${e.kind}</span>`}
123
- ${r.kind==="url"?n`<a class="board-output-link" href=${e.href} target="_blank" rel="noopener noreferrer"
124
- >${e.title}</a
125
- >`:e.labelled?n`<span class="board-output-label">${e.title}</span>`:n`<code class="board-output-path">${e.href}</code>`}
126
- </div>
127
- ${r.kind==="url"?n`<span class="board-output-sub">${r.host}</span>`:e.labelled?n`<code class="board-output-path board-output-sub">${e.href}</code>`:d}
128
- ${e.description===null?d:n`<p class="board-output-text">${e.description}</p>`}
129
- </div>
130
- <button
131
- class="dpk-icon-btn board-copy"
132
- type="button"
133
- data-copied=${String(t)}
134
- aria-label=${s}
135
- title=${s}
136
- @click=${()=>o.copy(e.id,e.href)}
137
- >
138
- ${t?te():Ve()}
139
- </button>
140
- </li>
141
- `},Be=(a,e)=>n`
142
- <div class="board-log-now">
143
- ${e.status===null?d:n`<span class="dpk-status board-status" data-status=${e.status}>${e.label}</span>`}
144
- ${e.updatedAt===null?d:n`<span class="board-updated">${a.updatedAt(e.updatedAt)}</span>`}
145
- </div>
146
- `,Sa=(a,e,t)=>n`
147
- <section class="board-section" data-section="log" aria-labelledby="board-log">
148
- ${V("board-log",a.log,e.entries.length===0?null:a.logLede)}
149
- ${e.entries.length===0?n`${e.status===null?d:Be(a,e.status)}
150
- <p class="dpk-empty board-empty" data-variant="dashed">${a.noLog}</p>`:n`<ol class="board-log">
151
- ${w(e.entries,o=>o.id,o=>Da(a,o,o.latest?e.status:null,t))}
152
- </ol>`}
153
- </section>
154
- `,Da=(a,e,t,o)=>{const r=e.author?.name??a.fromAgent;return n`
155
- <li
156
- class="board-log-entry"
157
- data-log=${e.id}
158
- data-dpk-target=${`log:${e.id}`}
159
- data-grill-questions=${T(e.questions)}
160
- data-from=${e.author?.kind??"agent"}
161
- data-latest=${String(e.latest)}
162
- >
163
- <span class="board-log-avatar" aria-hidden="true">${r.slice(0,1)}</span>
164
- <div class="board-log-body">
165
- ${t===null?d:Be(a,t)}
166
- <div class="board-log-head">
167
- <span class="board-log-author">${r}</span>
168
- ${e.at===null?d:n`<time class="board-log-at">${e.at}</time>`}
169
- ${e.latest?n`<span class="board-log-latest">${a.latestTag}</span>`:d}
170
- ${G(`log:${e.id}`,a.commentOn(e.label),e.comments,o)}
171
- </div>
172
- ${e.title===null?d:n`<h3 class="board-log-title">${e.title}</h3>`}
173
- ${e.body===null?d:n`<p class="board-log-text">${e.body}</p>`}
174
- ${e.points.length===0?d:n`<ul class="board-log-points">
175
- ${e.points.map(s=>n`<li>${s}</li>`)}
176
- </ul>`}
177
- </div>
178
- </li>
179
- `},v=["context","log","questions","tasks"],Ea=(a,e)=>{const t=v.indexOf(a),o=v.length-1;switch(e){case"ArrowRight":return v[t===o?0:t+1]??null;case"ArrowLeft":return v[t===0?o:t-1]??null;case"Home":return v[0];case"End":return v[o]??null;default:return null}},Ca=(a,e)=>{switch(e){case"context":return a.tabContext;case"log":return a.tabLog;case"questions":return a.tabQuestions;case"tasks":return a.tabTasks}},za=(a,e)=>{switch(a){case"context":case"tasks":return null;case"log":return e.log;case"questions":return e.questions}},qa=(a,e,t,o,r)=>n`
180
- <div class="board-tabs" role="tablist" aria-label=${a.tabs}>
181
- ${v.map(s=>{const l=za(s,t);return n`<button
182
- type="button"
183
- role="tab"
184
- id=${`board-tab-${s}`}
185
- data-tab=${s}
186
- data-alert=${s==="questions"?String(t.alert):d}
187
- aria-controls=${`board-panel-${s}`}
188
- aria-selected=${String(e===s)}
189
- tabindex=${e===s?0:-1}
190
- title=${s==="questions"&&t.questions>0?a.openCount(t.questions):d}
191
- @click=${()=>o(s)}
192
- @keydown=${r}
193
- >
194
- <span class="board-tab-label">${Ca(a,s)}</span
195
- >${l===null||l===0?d:n`<span class="board-tab-count">${l}</span>`}
196
- </button>`})}
197
- </div>
198
- `,N=(a,e,t)=>n`
199
- <div
200
- class="board-panel"
201
- id=${`board-panel-${a}`}
202
- role="tabpanel"
203
- aria-labelledby=${`board-tab-${a}`}
204
- ?hidden=${e!==a}
205
- >
206
- ${t}
207
- </div>
208
- `,X="",La=(a,e)=>e.statuses.some(t=>t.value===a),_a=(a,e,t,o)=>n`
209
- <section class="board-tasks" data-section="tasks" aria-label=${a.tasksBoard}>
210
- ${Ba(a,e,t)}
211
- <div class="board-kanban" role="group" aria-label=${a.tasksBoard}>
212
- ${w(e.lanes,r=>r.status,r=>Na(a,e,r,t,o))}
213
- </div>
214
- </section>
215
- `,Ba=(a,e,t)=>n`
216
- <div class="board-tasks-bar">
217
- <div class="board-tasks-progress">
218
- <span class="board-tasks-progress-label">${e.progress.label}</span>
219
- ${e.progress.total===0?d:n`<div
220
- class="board-progress"
221
- role="progressbar"
222
- aria-label=${e.progress.label}
223
- aria-valuemin="0"
224
- aria-valuemax=${e.progress.total}
225
- aria-valuenow=${e.progress.done}
226
- >
227
- <span
228
- class="board-progress-fill"
229
- style=${`width: ${e.progress.done/e.progress.total*100}%`}
230
- ></span>
231
- </div>`}
232
- </div>
233
- ${e.canFilter?Ga(a,e,t):d}
234
- </div>
235
- `,Ga=(a,e,t)=>{const o=(r,s,l)=>n`
236
- <button
237
- type="button"
238
- class="board-filter-option"
239
- data-filter=${r}
240
- aria-pressed=${e.filter===r?"true":"false"}
241
- @click=${()=>t.filterTodos(r)}
242
- >
243
- ${s}${l===null?d:n`<span class="board-filter-count">${l}</span>`}
244
- </button>
245
- `;return n`<div class="board-filter" role="group" aria-label=${a.filterTodos}>
246
- ${o("all",a.filterAll,null)} ${o("human",a.filterHuman,e.humanCount)}
247
- </div>`},Na=(a,e,t,o,r)=>n`
248
- <section
249
- class="board-lane"
250
- data-column=${t.status}
251
- data-tone=${t.tone}
252
- aria-label=${t.label}
253
- @dragover=${o.allowTodoDrop}
254
- @drop=${s=>{s.preventDefault(),o.dropTodo(t.status)}}
255
- >
256
- <header class="board-lane-head">
257
- <h3 class="board-lane-title">${t.label}</h3>
258
- <span class="board-lane-count" title=${a.laneCount(t.cards.length)}>${t.cards.length}</span>
259
- </header>
260
- ${t.cards.length===0?n`<p class="board-lane-empty">${a.laneEmpty}</p>`:n`<ul class="board-cards">
261
- ${w(t.cards,s=>s.id,s=>Ra(a,e,s,o,r))}
262
- </ul>`}
263
- ${t.status==="todo"?Ua(a,e,o):d}
264
- </section>
265
- `,Pa=(a,e)=>e.proposal==="pending"||e.proposal==="decline"?n`<span
266
- class="board-card-mark"
267
- data-proposal=${e.proposal}
268
- role="img"
269
- aria-label=${a.proposedMark}
270
- title=${a.proposedMark}
271
- >?</span
272
- >`:d,Wa=(a,e)=>n`
273
- ${e.proposal==="accept"?n`<span class="board-tag" data-tone="done">${a.acceptedTag}</span>`:d}
274
- ${e.proposal==="decline"?n`<span class="board-tag" data-tone="muted">${a.declinedTag}</span>`:d}
275
- ${e.added?n`<span class="board-tag" data-tone="new">${a.addedTag}</span>`:d}
276
- ${e.changed?n`<span class="board-tag" data-tone="changed">${a.changedTag}</span>`:d}
277
- `,Ra=(a,e,t,o,r)=>n`
278
- <li class="board-card-slot">
279
- <article
280
- class="dpk-card board-card"
281
- data-todo=${t.id}
282
- data-dpk-target=${`todo:${t.id}`}
283
- data-grill-questions=${T(t.questions)}
284
- data-status=${t.status}
285
- data-proposal=${t.proposal??"none"}
286
- data-added=${String(t.added)}
287
- data-changed=${String(t.changed)}
288
- draggable=${T(t.editable?"true":void 0)}
289
- title=${T(t.editable?a.dragHint:void 0)}
290
- @dragstart=${()=>o.beginTodoDrag(t.id)}
291
- @dragend=${()=>o.endTodoDrag()}
292
- >
293
- <div class="board-card-head">
294
- ${Pa(a,t)}
295
- <h4 class="dpk-card-title board-card-title">${t.title}</h4>
296
- <div class="board-card-tags">${Wa(a,t)}</div>
297
- </div>
298
- ${t.note===null?d:n`<p class="dpk-card-text board-card-note">${t.note}</p>`}
299
- ${t.reason===null||t.proposal==="accept"?d:n`<p class="board-reason"><span class="board-reason-label">${a.reason}</span>${t.reason}</p>`}
300
- <div class="board-card-controls">
301
- ${t.proposal==="pending"?Ia(a,t,o):t.proposal==="decline"?d:Qa(a,e,t,o,r)}
302
- ${t.assigneeName===null?d:n`<span class="board-assignee" data-kind=${t.assigneeKind??"agent"} title=${a.assignee}
303
- >${t.assigneeName}</span
304
- >`}
305
- ${t.proposal==="accept"||t.proposal==="decline"?n`<button
306
- type="button"
307
- class="dpk-btn dpk-btn--ghost board-undo"
308
- @click=${()=>o.decide(t.id,"clear")}
309
- >
310
- ${a.undoDecision}
311
- </button>`:d}
312
- ${G(`todo:${t.id}`,a.commentOn(t.title),t.comments,o)}
313
- ${t.added?n`<button
314
- class="dpk-icon-btn board-todo-remove"
315
- type="button"
316
- aria-label=${a.removeAdded}
317
- title=${a.removeAdded}
318
- @click=${()=>o.deleteTodo(t.id)}
319
- >
320
- ${Xe()}
321
- </button>`:d}
322
- </div>
323
- </article>
324
- </li>
325
- `,Ia=(a,e,t)=>n`
326
- <div class="board-decision" role="group" aria-label=${a.decisionOf(e.title)}>
327
- <button
328
- type="button"
329
- class="dpk-btn board-decide"
330
- data-decision="accept"
331
- @click=${()=>t.decide(e.id,"accept")}
332
- >
333
- ${a.accept}
334
- </button>
335
- <button
336
- type="button"
337
- class="dpk-btn dpk-btn--ghost board-decide"
338
- data-decision="decline"
339
- @click=${()=>t.decide(e.id,"decline")}
340
- >
341
- ${a.decline}
342
- </button>
343
- </div>
344
- `,Qa=(a,e,t,o,r)=>t.editable?r.get(t.id).render({options:e.statuses.map(s=>({value:s.value,label:s.label})),value:t.status,onChange:s=>{La(s,e)&&s!==t.status&&o.setStatus(t.id,s)},ariaLabel:a.statusOf(t.title),className:"board-todo-status"}):n`<span class="board-todo-state" data-status=${t.status}>${t.statusLabel}</span>`,Ua=(a,e,t)=>n`
345
- <form
346
- class="board-add-todo"
347
- @submit=${o=>{o.preventDefault();const r=I(o.currentTarget,HTMLFormElement);if(r===null)return;const s=I(r.elements.namedItem("title"),HTMLInputElement),l=I(r.querySelector('dpk-select[name="assignee"]'),oa),g=s?.value.trim()??"";s===null||g===""||(t.addTodo(g,l===null||l.value===X?null:l.value),s.value="")}}
348
- >
349
- <input
350
- class="dpk-input board-add-title"
351
- name="title"
352
- type="text"
353
- autocomplete="off"
354
- aria-label=${a.newTodo}
355
- placeholder=${a.newTodoPlaceholder}
356
- />
357
- <div class="board-add-row">
358
- ${e.members.length===0?d:n`<dpk-select
359
- class="board-add-assignee"
360
- name="assignee"
361
- aria-label=${a.newTodoAssignee}
362
- .options=${[{value:X,label:a.unassigned},...e.members.map(o=>({value:o.id,label:o.label}))]}
363
- .value=${X}
364
- ></dpk-select>`}
365
- <button class="dpk-btn board-add-submit" type="submit">${a.addTodo}</button>
366
- </div>
367
- </form>
368
- `,Ha=Je`
369
- /* The shell's sidebar is a left-hand rail (see \`sidebarLayout\`), a drawer on a phone. */
370
- :host {
371
- --dpk-sidebar-padding: 12px 16px;
372
- --dpk-sidebar-padding-end: 20px;
373
- }
374
-
375
- .board-rail {
376
- display: grid;
377
- gap: 14px;
378
- }
379
-
380
- .board {
381
- display: grid;
382
- gap: 18px;
383
- max-width: 1100px;
384
- width: 100%;
385
- margin: 0 auto;
386
- }
387
-
388
- /* A tab that reads keeps a comfortable measure; the task board takes the whole column. */
389
- .board-panel > .board-context,
390
- .board-panel > .board-section,
391
- .board-panel > .board-empty {
392
- max-width: 880px;
393
- }
394
-
395
- /* Stacked, the column is what ends the page: it clears the hand-off dock. */
396
- @media (max-width: 760px) {
397
- .dpk-main-body {
398
- padding-bottom: 24px;
399
- }
400
- }
401
-
402
- [data-status='working'],
403
- [data-status='doing'] {
404
- --board-tone: var(--dpk-blue);
405
- --board-tone-soft: var(--dpk-blue-soft);
406
- --tone: var(--dpk-blue);
407
- --tone-soft: var(--dpk-blue-soft);
408
- }
409
-
410
- [data-status='waiting'] {
411
- --board-tone: var(--dpk-amber);
412
- --board-tone-soft: var(--dpk-amber-soft);
413
- --tone: var(--dpk-amber);
414
- --tone-soft: var(--dpk-amber-soft);
415
- }
416
-
417
- [data-status='blocked'] {
418
- --board-tone: var(--dpk-danger);
419
- --board-tone-soft: var(--dpk-danger-soft);
420
- --tone: var(--dpk-danger);
421
- --tone-soft: var(--dpk-danger-soft);
422
- }
423
-
424
- [data-status='done'] {
425
- --board-tone: var(--dpk-green);
426
- --board-tone-soft: var(--dpk-green-soft);
427
- --tone: var(--dpk-green);
428
- --tone-soft: var(--dpk-green-soft);
429
- }
430
-
431
- [data-status='todo'] {
432
- --board-tone: var(--dpk-rule-strong);
433
- --board-tone-soft: var(--dpk-paper-sunken);
434
- --tone: var(--dpk-rule-strong);
435
- --tone-soft: var(--dpk-paper-sunken);
436
- }
437
-
438
- /* ------------------------------------------------------------- status */
439
-
440
- .board-status {
441
- box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tone) 28%, transparent);
442
- }
443
-
444
- /* On a phone the header has no room; the Context tab says the same. */
445
- @media (max-width: 720px) {
446
- .board-status--header {
447
- display: none;
448
- }
449
- }
450
-
451
- .board-status[data-status='working']::before {
452
- animation: board-pulse 1.8s var(--dpk-ease) infinite;
453
- }
454
-
455
- @keyframes board-pulse {
456
- 50% {
457
- box-shadow: 0 0 0 6px color-mix(in srgb, var(--tone) 0%, transparent);
458
- }
459
- }
460
-
461
- /* --------------------------------------------------------------- tabs */
462
-
463
- /* Stays at the top of the main area while a long log or question list scrolls. */
464
- .board-tabs {
465
- position: sticky;
466
- top: 0;
467
- z-index: 2;
468
- display: flex;
469
- gap: 3px;
470
- padding: 3px;
471
- border: 1px solid var(--dpk-rule);
472
- border-radius: var(--dpk-radius);
473
- background: var(--dpk-paper-sunken);
474
- box-shadow:
475
- inset 0 1px 2px var(--dpk-shade-1),
476
- 0 6px 14px -10px var(--dpk-shade-3);
477
- }
478
-
479
- .board-tabs [role='tab'] {
480
- flex: 1 1 0;
481
- display: inline-flex;
482
- align-items: center;
483
- justify-content: center;
484
- gap: 7px;
485
- min-width: 0;
486
- padding: 7px 10px;
487
- border: 1px solid transparent;
488
- border-radius: var(--dpk-radius-sm);
489
- background: transparent;
490
- color: var(--dpk-ink-soft);
491
- font: inherit;
492
- font-size: 13px;
493
- font-weight: 550;
494
- white-space: nowrap;
495
- cursor: pointer;
496
- transition:
497
- color 140ms var(--dpk-ease),
498
- background 140ms var(--dpk-ease);
499
- }
500
-
501
- .board-tabs [role='tab']:hover {
502
- color: var(--dpk-ink);
503
- }
504
-
505
- .board-tabs [role='tab']:focus-visible {
506
- outline: none;
507
- box-shadow: var(--dpk-focus);
508
- }
509
-
510
- .board-tabs [role='tab'][aria-selected='true'] {
511
- background: var(--dpk-paper-raised);
512
- color: var(--dpk-ink);
513
- font-weight: 700;
514
- box-shadow: var(--dpk-bevel), var(--dpk-shadow-xs);
515
- }
516
-
517
- @media (max-width: 400px) {
518
- .board-tabs [role='tab'] {
519
- gap: 5px;
520
- padding-inline: 6px;
521
- }
522
- }
523
-
524
- /* Too narrow for every label whole, a label gives way before its count does. */
525
- .board-tab-label {
526
- min-width: 0;
527
- overflow: hidden;
528
- text-overflow: ellipsis;
529
- }
530
-
531
- .board-tab-count {
532
- flex: none;
533
- min-width: 18px;
534
- padding: 0 6px;
535
- border-radius: 999px;
536
- background: var(--dpk-rule);
537
- color: var(--dpk-ink-soft);
538
- font-family: var(--dpk-mono);
539
- font-size: 10.5px;
540
- font-weight: 650;
541
- font-variant-numeric: tabular-nums;
542
- line-height: 17px;
543
- text-align: center;
544
- }
545
-
546
- /* An open blocker: the agent is stuck until the reader answers. */
547
- .board-tabs [data-alert='true'] .board-tab-count {
548
- background: var(--dpk-danger);
549
- color: #fff;
550
- }
551
-
552
- .board-panel {
553
- display: grid;
554
- gap: 18px;
555
- min-width: 0;
556
- animation: board-fade 180ms var(--dpk-ease);
557
- }
558
-
559
- .board-panel[hidden] {
560
- display: none;
561
- }
562
-
563
- @keyframes board-fade {
564
- from {
565
- opacity: 0;
566
- transform: translateY(4px);
567
- }
568
- }
569
-
570
- /* ------------------------------------------------------------ context */
571
-
572
- .board-context {
573
- display: grid;
574
- gap: 14px;
575
- min-width: 0;
576
- }
577
-
578
- /* Why / What side by side, then Goals / Non-goals: a design doc at a glance. */
579
- .board-context-parts {
580
- display: grid;
581
- grid-template-columns: repeat(2, minmax(0, 1fr));
582
- gap: 12px;
583
- }
584
-
585
- @media (max-width: 760px) {
586
- .board-context-parts {
587
- grid-template-columns: minmax(0, 1fr);
588
- }
589
- }
590
-
591
- /* A part is the kit's card (the card atom), roomier for prose. */
592
- .board-context-part {
593
- --dpk-card-gap: 6px;
594
- padding: 14px 16px;
595
- }
596
-
597
- .board-context-part[data-context='why'],
598
- .board-context-part[data-context='what'] {
599
- border-top: 3px solid var(--dpk-accent);
600
- }
601
-
602
- .board-context-head {
603
- display: flex;
604
- align-items: center;
605
- justify-content: space-between;
606
- gap: 8px;
607
- }
608
-
609
- .board-context-title {
610
- margin: 0;
611
- color: var(--dpk-ink-soft);
612
- font-size: 12px;
613
- font-weight: 700;
614
- letter-spacing: 0.04em;
615
- text-transform: uppercase;
616
- }
617
-
618
- .board-context-text {
619
- color: var(--dpk-ink);
620
- font-size: 14px;
621
- line-height: 1.7;
622
- white-space: pre-line;
623
- }
624
-
625
- .board-context-items {
626
- display: grid;
627
- gap: 4px;
628
- padding: 0;
629
- list-style: none;
630
- color: var(--dpk-ink);
631
- font-size: 13.5px;
632
- line-height: 1.6;
633
- }
634
-
635
- .board-context-items li {
636
- position: relative;
637
- padding-left: 20px;
638
- }
639
-
640
- .board-context-items li::before {
641
- position: absolute;
642
- left: 0;
643
- font-weight: 700;
644
- }
645
-
646
- .board-context-part[data-context='goals'] li::before {
647
- content: '✓';
648
- color: var(--dpk-green);
649
- }
650
-
651
- .board-context-part[data-context='nonGoals'] li::before {
652
- content: '−';
653
- color: var(--dpk-ink-faint);
654
- }
655
-
656
- .board-context-part[data-context='nonGoals'] .board-context-items {
657
- color: var(--dpk-ink-soft);
658
- }
659
-
660
- .board-figures {
661
- display: grid;
662
- gap: 14px;
663
- min-width: 0;
664
- }
665
-
666
- .board-figures ::slotted(*) {
667
- min-width: 0;
668
- }
669
-
670
- .board-updated {
671
- color: var(--dpk-ink-faint);
672
- font-size: 12px;
673
- font-variant-numeric: tabular-nums;
674
- }
675
-
676
- /* ----------------------------------------------------------- sections */
677
-
678
- .board-section {
679
- display: grid;
680
- gap: 12px;
681
- min-width: 0;
682
- }
683
-
684
- .board-rail-section {
685
- gap: 6px;
686
- }
687
-
688
- .board-section-head {
689
- display: flex;
690
- align-items: baseline;
691
- justify-content: space-between;
692
- gap: 12px;
693
- padding-bottom: 8px;
694
- border-bottom: 1px solid var(--dpk-rule);
695
- }
696
-
697
- .board-section-head h2 {
698
- margin: 0;
699
- color: var(--dpk-ink);
700
- font-size: 15px;
701
- font-weight: 700;
702
- letter-spacing: -0.01em;
703
- }
704
-
705
- /* The rail is narrow and always in view: its headings are labels, not breaks. */
706
- .board-rail-section .board-section-head {
707
- padding-bottom: 3px;
708
- line-height: 1.3;
709
- }
710
-
711
- .board-rail-section .board-section-head h2 {
712
- font-size: 11.5px;
713
- text-transform: uppercase;
714
- letter-spacing: 0.04em;
715
- color: var(--dpk-ink-soft);
716
- }
717
-
718
- .board-section-meta {
719
- color: var(--dpk-ink-faint);
720
- font-size: 12px;
721
- font-variant-numeric: tabular-nums;
722
- }
723
-
724
- .board-lede {
725
- margin: -4px 0 0;
726
- color: var(--dpk-ink-soft);
727
- font-size: 12.5px;
728
- }
729
-
730
- .board-empty {
731
- display: block;
732
- max-width: none;
733
- margin: 0;
734
- padding: 12px 14px;
735
- border-radius: var(--dpk-radius);
736
- background: transparent;
737
- font-size: 13px;
738
- line-height: 1.5;
739
- text-align: start;
740
- }
741
-
742
- .board-tag {
743
- flex: 0 0 auto;
744
- padding: 1px 7px;
745
- border-radius: 999px;
746
- font-size: 11px;
747
- font-weight: 650;
748
- line-height: 1.6;
749
- white-space: nowrap;
750
- }
751
-
752
- .board-tag[data-tone='done'] {
753
- background: var(--dpk-green-soft);
754
- color: color-mix(in srgb, var(--dpk-green) 75%, var(--dpk-ink));
755
- }
756
-
757
- .board-tag[data-tone='new'] {
758
- background: var(--dpk-accent-soft);
759
- color: var(--dpk-accent-ink);
760
- }
761
-
762
- .board-tag[data-tone='changed'] {
763
- background: var(--dpk-blue-soft);
764
- color: color-mix(in srgb, var(--dpk-blue) 75%, var(--dpk-ink));
765
- }
766
-
767
- .board-tag[data-tone='muted'] {
768
- background: var(--dpk-paper-inset);
769
- color: var(--dpk-ink-soft);
770
- }
771
-
772
- .board-comment {
773
- flex: 0 0 auto;
774
- position: relative;
775
- }
776
-
777
- /* ---------------------------------------------------------- questions */
778
-
779
- /* Blocking questions are red: the agent is waiting. The rest are amber: the
780
- agent goes on under its assumption. Either turns green once replied to. */
781
- .board-group {
782
- --board-group-tone: var(--dpk-amber);
783
- --board-group-soft: var(--dpk-amber-soft);
784
- display: grid;
785
- gap: 8px;
786
- }
787
-
788
- .board-group[data-group='blocking'] {
789
- --board-group-tone: var(--dpk-danger);
790
- --board-group-soft: var(--dpk-danger-soft);
791
- }
792
-
793
- .board-group-title {
794
- display: flex;
795
- align-items: center;
796
- gap: 8px;
797
- margin: 0;
798
- color: color-mix(in srgb, var(--board-group-tone) 75%, var(--dpk-ink));
799
- font-size: 12.5px;
800
- font-weight: 700;
801
- }
802
-
803
- .board-group-title::before {
804
- content: '';
805
- width: 8px;
806
- height: 8px;
807
- border-radius: 50%;
808
- background: var(--board-group-tone);
809
- }
810
-
811
- .board-group + .board-group {
812
- margin-top: 6px;
813
- }
814
-
815
- .board-questions {
816
- display: grid;
817
- gap: 10px;
818
- margin: 0;
819
- padding: 0;
820
- list-style: none;
821
- }
822
-
823
- /* A question is the kit's card (the card atom) in its group's tone: green once replied to. */
824
- .board-question {
825
- --dpk-card-tone: var(--board-group-tone);
826
- --dpk-card-gap: 10px;
827
- padding: 14px 16px;
828
- }
829
-
830
- .board-question[data-resolved='true'] {
831
- --dpk-card-tone: var(--dpk-green);
832
- }
833
-
834
- .board-question-head {
835
- gap: 10px;
836
- }
837
-
838
- .board-question-title {
839
- margin: 0;
840
- font-size: 14px;
841
- font-weight: 650;
842
- line-height: 1.5;
843
- }
844
-
845
- .board-question-text {
846
- color: var(--dpk-ink-soft);
847
- font-size: 13px;
848
- line-height: 1.65;
849
- white-space: pre-line;
850
- }
851
-
852
- .board-ref {
853
- flex: 0 0 auto;
854
- padding: 2px 7px;
855
- border-radius: var(--dpk-radius-xs);
856
- background: var(--board-group-soft);
857
- color: color-mix(in srgb, var(--board-group-tone) 75%, var(--dpk-ink));
858
- font-family: var(--dpk-mono);
859
- font-size: 11.5px;
860
- font-weight: 700;
861
- line-height: 1.6;
862
- }
863
-
864
- .board-question[data-resolved='true'] .board-ref {
865
- background: var(--dpk-green-soft);
866
- color: color-mix(in srgb, var(--dpk-green) 75%, var(--dpk-ink));
867
- }
868
-
869
- .board-assumption {
870
- display: grid;
871
- gap: 3px;
872
- padding: 9px 12px;
873
- border-radius: var(--dpk-radius-sm);
874
- background: var(--dpk-paper-sunken);
875
- }
876
-
877
- .board-assumption-label {
878
- color: var(--dpk-ink-faint);
879
- font-size: 11px;
880
- font-weight: 700;
881
- letter-spacing: 0.03em;
882
- }
883
-
884
- .board-assumption-text {
885
- margin: 0;
886
- color: var(--dpk-ink);
887
- font-size: 13.5px;
888
- line-height: 1.55;
889
- white-space: pre-line;
890
- }
891
-
892
- .board-question[data-reply='answer'] .board-assumption-text {
893
- color: var(--dpk-ink-faint);
894
- text-decoration: line-through;
895
- text-decoration-color: color-mix(in srgb, var(--dpk-ink-faint) 60%, transparent);
896
- }
897
-
898
- .board-reply {
899
- display: flex;
900
- flex-wrap: wrap;
901
- gap: 8px;
902
- }
903
-
904
- .board-approve svg {
905
- width: 14px;
906
- height: 14px;
907
- }
908
-
909
- .board-approve[aria-pressed='true'] {
910
- border-color: var(--dpk-green);
911
- background: var(--dpk-green-soft);
912
- color: color-mix(in srgb, var(--dpk-green) 70%, var(--dpk-ink));
913
- }
914
-
915
- .board-other[aria-pressed='true'] {
916
- border-color: color-mix(in srgb, var(--dpk-accent) 55%, var(--dpk-rule));
917
- background: var(--dpk-accent-soft);
918
- color: var(--dpk-accent-ink);
919
- }
920
-
921
- .board-answer {
922
- width: 100%;
923
- box-sizing: border-box;
924
- resize: vertical;
925
- }
926
-
927
- .board-answer[hidden] {
928
- display: none;
929
- }
930
-
931
- /* -------------------------------------------------------------- tasks */
932
-
933
- .board-tasks {
934
- display: grid;
935
- gap: 12px;
936
- min-width: 0;
937
- }
938
-
939
- .board-tasks-bar {
940
- display: flex;
941
- flex-wrap: wrap;
942
- align-items: center;
943
- gap: 8px 16px;
944
- }
945
-
946
- .board-tasks-progress {
947
- display: grid;
948
- flex: 1 1 240px;
949
- gap: 4px;
950
- min-width: 0;
951
- }
952
-
953
- .board-tasks-progress-label {
954
- color: var(--dpk-ink-soft);
955
- font-size: 12.5px;
956
- font-weight: 600;
957
- font-variant-numeric: tabular-nums;
958
- }
959
-
960
- .board-progress {
961
- height: 6px;
962
- border-radius: 999px;
963
- background: var(--dpk-rule);
964
- overflow: hidden;
965
- }
966
-
967
- .board-progress-fill {
968
- display: block;
969
- height: 100%;
970
- border-radius: inherit;
971
- background: var(--dpk-green);
972
- transition: width 240ms var(--dpk-ease);
973
- }
974
-
975
- /*
976
- * The board itself, drawn the way \`dpk-board-kanban\` draws one: lanes side by
977
- * side in reading order, taking an equal share of the column and scrolling
978
- * sideways on their own — never the page — once they no longer fit.
979
- */
980
- .board-kanban {
981
- display: flex;
982
- align-items: flex-start;
983
- gap: 12px;
984
- max-width: 100%;
985
- padding-bottom: 4px;
986
- overflow-x: auto;
987
- overscroll-behavior-x: contain;
988
- }
989
-
990
- .board-lane {
991
- display: flex;
992
- flex: 1 1 232px;
993
- flex-direction: column;
994
- gap: 8px;
995
- min-width: 232px;
996
- max-width: 340px;
997
- padding: 10px;
998
- border: 1px solid var(--dpk-rule);
999
- border-radius: var(--dpk-radius-lg);
1000
- background: var(--dpk-paper-sunken);
1001
- box-shadow: inset 0 1px 3px var(--dpk-shade-1);
1002
- }
1003
-
1004
- /* The lane's own tone, from the shared \`data-tone\` map; grey has no entry there. */
1005
- .board-lane[data-tone='gray'] {
1006
- --tone: var(--dpk-ink-soft);
1007
- --tone-soft: var(--dpk-paper-raised);
1008
- }
1009
-
1010
- /* Blocked reads red: the shared map names that tone \`danger\`, and the lane spells it \`red\`. */
1011
- .board-lane[data-tone='red'] {
1012
- --tone: var(--dpk-danger);
1013
- --tone-soft: var(--dpk-danger-soft);
1014
- }
1015
-
1016
- .board-lane-head {
1017
- display: flex;
1018
- align-items: center;
1019
- gap: 8px;
1020
- padding: 0 2px;
1021
- }
1022
-
1023
- .board-lane-title {
1024
- margin: 0;
1025
- padding: 2px 9px;
1026
- border-radius: 999px;
1027
- background: color-mix(in srgb, var(--tone, var(--dpk-ink-soft)) 14%, transparent);
1028
- color: var(--tone, var(--dpk-ink-soft));
1029
- font-size: 12px;
1030
- font-weight: 650;
1031
- letter-spacing: 0.01em;
1032
- white-space: nowrap;
1033
- }
1034
-
1035
- .board-lane-count {
1036
- flex: none;
1037
- margin-left: auto;
1038
- padding: 1px 7px;
1039
- border-radius: 999px;
1040
- background: var(--dpk-paper-raised);
1041
- color: var(--dpk-ink-soft);
1042
- font-family: var(--dpk-mono);
1043
- font-size: 11px;
1044
- font-weight: 600;
1045
- font-variant-numeric: tabular-nums;
1046
- box-shadow: var(--dpk-bevel), var(--dpk-shadow-xs);
1047
- }
1048
-
1049
- .board-cards {
1050
- display: flex;
1051
- flex-direction: column;
1052
- gap: 8px;
1053
- min-height: 44px;
1054
- margin: 0;
1055
- padding: 0;
1056
- list-style: none;
1057
- }
1058
-
1059
- .board-card-slot {
1060
- min-width: 0;
1061
- }
1062
-
1063
- /* A todo is the kit's card (the card atom), tighter for a lane. */
1064
- .board-card {
1065
- --dpk-card-gap: 6px;
1066
- padding: 10px 11px;
1067
- overflow-wrap: anywhere;
1068
- }
1069
-
1070
- /* Only a todo a person has can be dragged: its status is the reader's to set. */
1071
- .board-card[draggable='true'] {
1072
- cursor: grab;
1073
- }
1074
-
1075
- .board-card[data-added='true'] {
1076
- background: color-mix(in srgb, var(--dpk-accent) 6%, var(--dpk-paper-raised));
1077
- }
1078
-
1079
- .board-card[data-proposal='pending'] {
1080
- --dpk-card-tone: var(--dpk-violet);
1081
- }
1082
-
1083
- .board-card[data-proposal='decline'] {
1084
- background: var(--dpk-paper-sunken);
1085
- }
1086
-
1087
- .board-card[data-proposal='decline'] .board-card-title,
1088
- .board-card[data-proposal='decline'] .board-reason {
1089
- color: var(--dpk-ink-faint);
1090
- }
1091
-
1092
- .board-card[data-proposal='decline'] .board-card-title {
1093
- text-decoration: line-through;
1094
- }
1095
-
1096
- .board-card[data-status='done'] .board-card-title {
1097
- color: var(--dpk-ink-faint);
1098
- text-decoration: line-through;
1099
- text-decoration-color: color-mix(in srgb, var(--dpk-ink-faint) 60%, transparent);
1100
- }
1101
-
1102
- .board-card-head {
1103
- display: flex;
1104
- align-items: flex-start;
1105
- gap: 6px;
1106
- }
1107
-
1108
- .board-card-title {
1109
- flex: 1 1 auto;
1110
- min-width: 0;
1111
- font-size: 13px;
1112
- line-height: 1.5;
1113
- }
1114
-
1115
- .board-card-tags {
1116
- display: flex;
1117
- flex: 0 0 auto;
1118
- flex-wrap: wrap;
1119
- gap: 4px;
1120
- }
1121
-
1122
- /* A proposal is not work yet: a question mark beside its title. */
1123
- .board-card-mark {
1124
- flex: none;
1125
- display: grid;
1126
- place-items: center;
1127
- width: 16px;
1128
- height: 16px;
1129
- margin-top: 1px;
1130
- border: 1.5px dashed var(--dpk-violet);
1131
- border-radius: 50%;
1132
- background: var(--dpk-violet-soft);
1133
- color: var(--dpk-violet);
1134
- font-size: 10.5px;
1135
- font-weight: 800;
1136
- line-height: 1;
1137
- }
1138
-
1139
- .board-card-mark[data-proposal='decline'] {
1140
- border-color: var(--dpk-rule-strong);
1141
- background: transparent;
1142
- color: var(--dpk-ink-faint);
1143
- }
1144
-
1145
- .board-card-note,
1146
- .board-reason {
1147
- margin: 0;
1148
- color: var(--dpk-ink-soft);
1149
- font-size: 12px;
1150
- line-height: 1.55;
1151
- }
1152
-
1153
- .board-reason-label {
1154
- margin-right: 6px;
1155
- padding: 0 5px;
1156
- border-radius: var(--dpk-radius-xs);
1157
- background: var(--dpk-violet-soft);
1158
- color: var(--dpk-violet);
1159
- font-size: 10.5px;
1160
- font-weight: 700;
1161
- }
1162
-
1163
- .board-card-controls {
1164
- display: flex;
1165
- flex-wrap: wrap;
1166
- align-items: center;
1167
- gap: 6px;
1168
- }
1169
-
1170
- .board-card-controls .board-comment {
1171
- margin-left: auto;
1172
- }
1173
-
1174
- /* A lane with nothing in it keeps its place, so the board's shape still says where the work is. */
1175
- .board-lane-empty {
1176
- margin: 0;
1177
- padding: 10px 8px;
1178
- border: 1px dashed var(--dpk-rule-strong);
1179
- border-radius: var(--dpk-radius-sm);
1180
- color: var(--dpk-ink-faint);
1181
- font-size: 11.5px;
1182
- text-align: center;
1183
- }
1184
-
1185
- /* ------------------------------------------------------ status / filter */
1186
-
1187
- .board-todo-status {
1188
- width: auto;
1189
- min-width: 0;
1190
- min-height: 26px;
1191
- height: 26px;
1192
- padding-top: 0;
1193
- padding-bottom: 0;
1194
- font-size: 12px;
1195
- border-color: color-mix(in srgb, var(--board-tone) 45%, var(--dpk-rule));
1196
- background-color: var(--board-tone-soft);
1197
- color: var(--dpk-ink);
1198
- font-weight: 600;
1199
- }
1200
-
1201
- /* The agent's own status: it reports it by rewriting the board. */
1202
- .board-todo-state {
1203
- display: inline-flex;
1204
- align-items: center;
1205
- height: 22px;
1206
- padding: 0 8px;
1207
- border-radius: 999px;
1208
- background: var(--board-tone-soft);
1209
- color: color-mix(in srgb, var(--board-tone) 75%, var(--dpk-ink));
1210
- font-size: 11.5px;
1211
- font-weight: 600;
1212
- white-space: nowrap;
1213
- }
1214
-
1215
- .board-todo-state[data-status='todo'] {
1216
- color: var(--dpk-ink-soft);
1217
- }
1218
-
1219
- .board-assignee {
1220
- display: inline-flex;
1221
- align-items: center;
1222
- max-width: 140px;
1223
- height: 22px;
1224
- padding: 0 8px;
1225
- border: 1px solid var(--dpk-rule);
1226
- border-radius: 999px;
1227
- color: var(--dpk-ink-soft);
1228
- font-size: 11.5px;
1229
- white-space: nowrap;
1230
- overflow: hidden;
1231
- text-overflow: ellipsis;
1232
- }
1233
-
1234
- .board-assignee::before {
1235
- content: '@';
1236
- margin-right: 1px;
1237
- color: var(--dpk-ink-faint);
1238
- }
1239
-
1240
- .board-assignee[data-kind='human'] {
1241
- border-color: color-mix(in srgb, var(--dpk-violet) 35%, var(--dpk-rule));
1242
- background: var(--dpk-violet-soft);
1243
- color: var(--dpk-violet);
1244
- font-weight: 600;
1245
- }
1246
-
1247
- .board-assignee[data-kind='human']::before {
1248
- color: inherit;
1249
- }
1250
-
1251
- .board-filter {
1252
- display: inline-flex;
1253
- gap: 2px;
1254
- padding: 2px;
1255
- border: 1px solid var(--dpk-rule);
1256
- border-radius: var(--dpk-radius-sm);
1257
- background: var(--dpk-paper-sunken);
1258
- }
1259
-
1260
- .board-tasks-bar .board-filter {
1261
- margin-left: auto;
1262
- }
1263
-
1264
- .board-filter-option {
1265
- display: inline-flex;
1266
- align-items: center;
1267
- gap: 5px;
1268
- padding: 3px 10px;
1269
- border: 0;
1270
- border-radius: var(--dpk-radius-xs);
1271
- background: transparent;
1272
- color: var(--dpk-ink-soft);
1273
- font: inherit;
1274
- font-size: 12px;
1275
- cursor: pointer;
1276
- }
1277
-
1278
- .board-filter-option:hover {
1279
- color: var(--dpk-ink);
1280
- }
1281
-
1282
- .board-filter-option:focus-visible {
1283
- outline: none;
1284
- box-shadow: var(--dpk-focus);
1285
- }
1286
-
1287
- .board-filter-option[aria-pressed='true'] {
1288
- background: var(--dpk-paper-raised);
1289
- color: var(--dpk-ink);
1290
- font-weight: 650;
1291
- box-shadow: var(--dpk-bevel), var(--dpk-shadow-xs);
1292
- }
1293
-
1294
- .board-filter-count {
1295
- font-family: var(--dpk-mono);
1296
- font-size: 10.5px;
1297
- color: var(--dpk-violet);
1298
- }
1299
-
1300
- .board-decision {
1301
- display: flex;
1302
- gap: 6px;
1303
- }
1304
-
1305
- .board-decide,
1306
- .board-undo {
1307
- min-height: 26px;
1308
- height: 26px;
1309
- padding: 0 10px;
1310
- font-size: 12px;
1311
- }
1312
-
1313
- .board-decide[data-decision='accept'] {
1314
- border-color: color-mix(in srgb, var(--dpk-green) 50%, var(--dpk-rule));
1315
- color: color-mix(in srgb, var(--dpk-green) 70%, var(--dpk-ink));
1316
- }
1317
-
1318
- .board-decide[data-decision='accept']:hover {
1319
- background: var(--dpk-green-soft);
1320
- }
1321
-
1322
- .board-add-todo {
1323
- display: grid;
1324
- gap: 6px;
1325
- }
1326
-
1327
- .board-add-row {
1328
- display: flex;
1329
- gap: 6px;
1330
- }
1331
-
1332
- .board-add-assignee {
1333
- flex: 1 1 auto;
1334
- width: auto;
1335
- min-width: 0;
1336
- }
1337
-
1338
- .board-add-submit {
1339
- flex: 0 0 auto;
1340
- }
1341
-
1342
- /* A phone shows one lane and a hint of the next: the board still scrolls sideways, never the page. */
1343
- @media (max-width: 640px) {
1344
- .board-lane {
1345
- flex-basis: 208px;
1346
- min-width: 208px;
1347
- }
1348
- }
1349
-
1350
- /* ------------------------------------------------------------ outputs */
1351
-
1352
- .board-outputs {
1353
- display: grid;
1354
- margin: 0;
1355
- padding: 0;
1356
- list-style: none;
1357
- border: 1px solid var(--dpk-rule);
1358
- border-radius: var(--dpk-radius);
1359
- background: var(--dpk-paper-raised);
1360
- box-shadow: var(--dpk-shadow-xs);
1361
- overflow: hidden;
1362
- }
1363
-
1364
- .board-output {
1365
- grid-template-columns: minmax(0, 1fr) auto;
1366
- gap: 8px;
1367
- padding: 6px 6px 6px 10px;
1368
- border-radius: 0;
1369
- border-top: 1px solid var(--dpk-rule);
1370
- }
1371
-
1372
- .board-output:first-child {
1373
- border-top: 0;
1374
- }
1375
-
1376
- .board-output-body {
1377
- display: grid;
1378
- gap: 1px;
1379
- min-width: 0;
1380
- }
1381
-
1382
- .board-output-head {
1383
- display: flex;
1384
- align-items: baseline;
1385
- gap: 6px;
1386
- min-width: 0;
1387
- }
1388
-
1389
- .board-kind {
1390
- flex: 0 0 auto;
1391
- padding: 0 5px;
1392
- border-radius: var(--dpk-radius-xs);
1393
- background: var(--dpk-paper-sunken);
1394
- color: var(--dpk-ink-soft);
1395
- font-family: var(--dpk-mono);
1396
- font-size: 10px;
1397
- font-weight: 700;
1398
- line-height: 1.7;
1399
- text-transform: uppercase;
1400
- letter-spacing: 0.04em;
1401
- }
1402
-
1403
- .board-output-link,
1404
- .board-output-label,
1405
- .board-output-head .board-output-path {
1406
- min-width: 0;
1407
- overflow: hidden;
1408
- text-overflow: ellipsis;
1409
- white-space: nowrap;
1410
- color: var(--dpk-ink);
1411
- font-size: 13px;
1412
- font-weight: 600;
1413
- }
1414
-
1415
- .board-output-link {
1416
- text-decoration: none;
1417
- }
1418
-
1419
- .board-output-link:hover {
1420
- color: var(--dpk-blue);
1421
- text-decoration: underline;
1422
- }
1423
-
1424
- .board-output-link:focus-visible {
1425
- outline: none;
1426
- border-radius: var(--dpk-radius-xs);
1427
- box-shadow: var(--dpk-focus);
1428
- }
1429
-
1430
- .board-output-path {
1431
- font-family: var(--dpk-mono);
1432
- font-size: 12px;
1433
- }
1434
-
1435
- .board-output-head .board-output-path {
1436
- font-size: 12px;
1437
- }
1438
-
1439
- .board-output-sub {
1440
- overflow: hidden;
1441
- text-overflow: ellipsis;
1442
- white-space: nowrap;
1443
- color: var(--dpk-ink-faint);
1444
- font-family: var(--dpk-mono);
1445
- font-size: 11px;
1446
- font-weight: 400;
1447
- }
1448
-
1449
- .board-output-text {
1450
- margin: 2px 0 0;
1451
- color: var(--dpk-ink-soft);
1452
- font-size: 12px;
1453
- line-height: 1.5;
1454
- }
1455
-
1456
- .board-copy[data-copied='true'] {
1457
- color: var(--dpk-green);
1458
- }
1459
-
1460
- /* ---------------------------------------------------------------- log */
1461
-
1462
- .board-log {
1463
- display: grid;
1464
- margin: 0;
1465
- padding: 0;
1466
- list-style: none;
1467
- }
1468
-
1469
- .board-log-entry {
1470
- position: relative;
1471
- display: grid;
1472
- grid-template-columns: 28px minmax(0, 1fr);
1473
- gap: 10px;
1474
- padding-bottom: 14px;
1475
- }
1476
-
1477
- /* The line that joins the exchanges into one conversation. */
1478
- .board-log-entry::before {
1479
- content: '';
1480
- position: absolute;
1481
- left: 13px;
1482
- top: 30px;
1483
- bottom: 0;
1484
- width: 2px;
1485
- background: var(--dpk-rule);
1486
- }
1487
-
1488
- .board-log-entry:last-child::before {
1489
- display: none;
1490
- }
1491
-
1492
- .board-log-avatar {
1493
- display: grid;
1494
- place-items: center;
1495
- width: 28px;
1496
- height: 28px;
1497
- border-radius: 50%;
1498
- background: var(--dpk-accent-soft);
1499
- color: var(--dpk-accent-strong);
1500
- font-size: 12px;
1501
- font-weight: 700;
1502
- }
1503
-
1504
- .board-log-entry[data-from='human'] .board-log-avatar {
1505
- background: var(--dpk-violet-soft);
1506
- color: var(--dpk-violet);
1507
- }
1508
-
1509
- .board-log-body {
1510
- min-width: 0;
1511
- padding: 10px 14px 12px;
1512
- border: 1px solid var(--dpk-rule);
1513
- border-radius: var(--dpk-radius);
1514
- background: var(--dpk-paper-raised);
1515
- }
1516
-
1517
- .board-log-entry[data-from='human'] .board-log-body {
1518
- background: color-mix(in srgb, var(--dpk-violet) 4%, var(--dpk-paper-raised));
1519
- border-color: color-mix(in srgb, var(--dpk-violet) 22%, var(--dpk-rule));
1520
- }
1521
-
1522
- .board-log-entry[data-latest='true'] .board-log-body {
1523
- border-color: color-mix(in srgb, var(--dpk-accent) 45%, var(--dpk-rule));
1524
- box-shadow:
1525
- var(--dpk-shadow-sm),
1526
- 0 0 0 3px var(--dpk-accent-soft);
1527
- }
1528
-
1529
- /* Where the task stands, on the newest entry only. */
1530
- .board-log-now {
1531
- display: flex;
1532
- flex-wrap: wrap;
1533
- align-items: center;
1534
- gap: 10px;
1535
- margin: -2px 0 10px;
1536
- padding-bottom: 10px;
1537
- border-bottom: 1px dashed var(--dpk-rule);
1538
- }
1539
-
1540
- .board-section > .board-log-now {
1541
- margin: 0;
1542
- padding-bottom: 0;
1543
- border-bottom: 0;
1544
- }
1545
-
1546
- .board-log-head {
1547
- display: flex;
1548
- align-items: center;
1549
- gap: 8px;
1550
- min-height: 24px;
1551
- }
1552
-
1553
- .board-log-author {
1554
- color: var(--dpk-ink);
1555
- font-size: 12.5px;
1556
- font-weight: 700;
1557
- }
1558
-
1559
- .board-log-entry[data-from='human'] .board-log-author {
1560
- color: var(--dpk-violet);
1561
- }
1562
-
1563
- .board-log-at {
1564
- color: var(--dpk-ink-faint);
1565
- font-size: 11.5px;
1566
- font-variant-numeric: tabular-nums;
1567
- }
1568
-
1569
- .board-log-latest {
1570
- padding: 1px 7px;
1571
- border-radius: 999px;
1572
- background: var(--dpk-accent-soft);
1573
- color: var(--dpk-accent-strong);
1574
- font-size: 10.5px;
1575
- font-weight: 700;
1576
- }
1577
-
1578
- .board-log-head .board-comment {
1579
- margin-left: auto;
1580
- }
1581
-
1582
- .board-log-title {
1583
- margin: 4px 0 0;
1584
- color: var(--dpk-ink);
1585
- font-size: 14px;
1586
- font-weight: 650;
1587
- line-height: 1.5;
1588
- }
1589
-
1590
- .board-log-text {
1591
- margin: 4px 0 0;
1592
- color: var(--dpk-ink);
1593
- font-size: 13.5px;
1594
- line-height: 1.65;
1595
- white-space: pre-line;
1596
- }
1597
-
1598
- .board-log-title + .board-log-text {
1599
- color: var(--dpk-ink-soft);
1600
- font-size: 13px;
1601
- }
1602
-
1603
- .board-log-points {
1604
- margin: 6px 0 0;
1605
- padding-left: 18px;
1606
- color: var(--dpk-ink-soft);
1607
- font-size: 12.5px;
1608
- line-height: 1.6;
1609
- }
1610
-
1611
- @media (prefers-reduced-motion: reduce) {
1612
- .board-status[data-status='working']::before {
1613
- animation: none;
1614
- }
1615
-
1616
- .board-progress-fill {
1617
- transition: none;
1618
- }
1619
-
1620
- .board-panel {
1621
- animation: none;
1622
- }
1623
- }
1624
- `,Ma=1500;class Ge extends oe{static{this.styles=[oe.styles,ta,Ha]}static{this.properties={tab:{state:!0},todoFilter:{state:!0}}}#a=null;#t=null;#o;#e=null;#r=new Ze(this);constructor(){super(),this.tab="context",this.todoFilter="all"}get sidebarLayout(){return{side:"left",defaultWidth:288,narrow:"drawer"}}definitionFor(e){return Le(e)}showTarget(e){switch(e.type){case"context":case"log":this.tab=e.type;return;case"question":this.tab="questions";return;case"todo":this.tab="tasks",this.todoFilter="all";return}}disconnectedCallback(){super.disconnectedCallback(),clearTimeout(this.#o)}renderRegions(e){const t=j(this.locale),o=f=>e.commentCount(f),r=Se(e.state,o),s=ze(t,e.state,o),l=this.#i(),g=this.tab;return{header:this.#s(t,e.state),sidebar:n`<div class="board-rail">
1625
- ${Aa(t,Ce(e.state),this.#t,l)}
1626
- </div>`,main:n`
1627
- <div class="board">
1628
- ${qa(t,g,{log:s.entries.length,questions:r.open,alert:r.blockingOpen>0},f=>{this.tab=f},f=>this.#n(f))}
1629
- ${N("context",g,va(t,Oe(t,e.state,o),this.#d(),l))}
1630
- ${N("log",g,Sa(t,s,l))}
1631
- ${N("questions",g,r.total===0?n`<p class="dpk-empty board-empty" data-variant="dashed">${t.noQuestions}</p>`:$a(t,r,l))}
1632
- ${N("tasks",g,_a(t,De(t,e.state,e.base,o,this.todoFilter),l,this.#r))}
1633
- </div>
1634
- `}}updated(){super.updated();const e=this.#a;e!==null&&(this.#a=null,this.renderRoot.querySelector(`[data-answer-text="${e}"]`)?.focus())}#n(e){const t=Ea(this.tab,e.key);t!==null&&(e.preventDefault(),this.tab=t,this.updateComplete.then(()=>this.renderRoot.querySelector(`[data-tab="${t}"]`)?.focus()))}#s(e,t){return t.status===null?d:n`<span class="dpk-status board-status board-status--header" data-status=${t.status}>
1635
- ${xe(e,t.status)}
1636
- </span>`}#d(){return this.querySelector(':scope > [slot="main"]')!==null}#i(){return{answer:(e,t)=>this.#p(e,t),answerOther:e=>this.#c(e),decide:(e,t)=>this.dispatch(ge(e,t)),setStatus:(e,t)=>this.dispatch(F(e,t)),filterTodos:e=>{this.todoFilter=e},addTodo:(e,t)=>this.#u(e,t),deleteTodo:e=>this.dispatch(ke(e)),beginTodoDrag:e=>{this.#e=e},endTodoDrag:()=>{this.#e=null},allowTodoDrop:e=>{this.#e!==null&&e.preventDefault()},dropTodo:e=>this.#l(e),copy:(e,t)=>{this.#b(e,t)},comment:e=>this.requestComment(e)}}#l(e){const t=this.#e;if(this.#e=null,t===null)return;const{state:o}=this.derivation,r=k(o,t);r===void 0||r.status===e||!_(o,r)||this.dispatch(F(t,e))}#p(e,t){this.dispatch(K(e,t))}#c(e){this.dispatch(K(e,{kind:"answer",text:""})).ok&&(this.#a=e)}#u(e,t){const{base:o,state:r}=this.derivation,s=[...o.todos,...r.todos].map(l=>l.id);this.dispatch(he(ea(e,s),e,t))}async#b(e,t){await aa(t)&&(clearTimeout(this.#o),this.#t=e,this.requestUpdate(),this.#o=setTimeout(()=>{this.#t=null,this.requestUpdate()},Ma))}}const Ne=()=>{ra(),customElements.get("dpk-view-task-board")||customElements.define("dpk-view-task-board",Ge)},Ka=Object.freeze(Object.defineProperty({__proto__:null,CONTEXT_PARTS:q,DpkViewTaskBoard:Ge,MEMBER_KINDS:ne,TASK_BOARD_PAGE:be,TASK_STATUSES:re,TODO_STATUSES:A,addTodo:he,answerQuestion:K,applyTaskBoardAction:fe,contextPartTitle:B,decideProposal:ge,defineTaskBoardElement:Ne,deleteTodo:ke,describeTaskBoardAction:$e,emptyTaskBoardBase:ie,isAnswered:ce,isHumanTodo:_,isPlanned:H,outputLocation:Ee,parseTaskBoardBase:de,presentContext:Oe,presentLog:ze,presentOutputs:Ce,presentQuestions:Se,presentTasks:De,resolveTaskBoardNavigation:Ae,serializeTaskBoardAction:ye,setTodoStatus:F,taskBoardActions:m,taskBoardBaseSchema:se,taskBoardCommentTargets:Te,taskBoardDefinitionFor:Le,taskBoardHasTarget:qe,taskBoardMessages:j,taskBoardTitle:ve,taskPageTargetLabel:we},Symbol.toStringTag,{value:"Module"}));export{Ne as d,Ka as i};