@songsid/agend 2.1.12-beta.9 → 2.2.0-alpha.1

package/dist/ui/shared/preact-hooks.module.js

@@ -0,0 +1,2 @@
+import{options as n}from"./preact.module.js";var t,r,u,i,o=0,f=[],c=n,e=c.__b,a=c.__r,v=c.diffed,l=c.__c,m=c.unmount,p=c.__;function s(n,t){c.__h&&c.__h(r,n,o||t),o=0;var u=r.__H||(r.__H={__:[],__h:[]});return n>=u.__.length&&u.__.push({}),u.__[n]}function d(n){return o=1,y(D,n)}function y(n,u,i){var o=s(t++,2);if(o.t=n,!o.__c&&(o.__=[i?i(u):D(void 0,u),function(n){var t=o.__N?o.__N[0]:o.__[0],r=o.t(t,n);t!==r&&(o.__N=[r,o.__[1]],o.__c.setState({}))}],o.__c=r,!r.__f)){var f=function(n,t,r){if(!o.__c.__H)return!0;var u=!1,i=o.__c.props!==n;if(o.__c.__H.__.some(function(n){if(n.__N){u=!0;var t=n.__[0];n.__=n.__N,n.__N=void 0,t!==n.__[0]&&(i=!0)}}),c){var f=c.call(this,n,t,r);return u?f||i:f}return!u||i};r.__f=!0;var c=r.shouldComponentUpdate,e=r.componentWillUpdate;r.componentWillUpdate=function(n,t,r){if(this.__e){var u=c;c=void 0,f(n,t,r),c=u}e&&e.call(this,n,t,r)},r.shouldComponentUpdate=f}return o.__N||o.__}function h(n,u){var i=s(t++,3);!c.__s&&C(i.__H,u)&&(i.__=n,i.u=u,r.__H.__h.push(i))}function _(n,u){var i=s(t++,4);!c.__s&&C(i.__H,u)&&(i.__=n,i.u=u,r.__h.push(i))}function A(n){return o=5,T(function(){return{current:n}},[])}function F(n,t,r){o=6,_(function(){if("function"==typeof n){var r=n(t());return function(){n(null),r&&"function"==typeof r&&r()}}if(n)return n.current=t(),function(){return n.current=null}},null==r?r:r.concat(n))}function T(n,r){var u=s(t++,7);return C(u.__H,r)&&(u.__=n(),u.__H=r,u.__h=n),u.__}function q(n,t){return o=8,T(function(){return n},t)}function x(n){var u=r.context[n.__c],i=s(t++,9);return i.c=n,u?(null==i.__&&(i.__=!0,u.sub(r)),u.props.value):n.__}function P(n,t){c.useDebugValue&&c.useDebugValue(t?t(n):n)}function b(n){var u=s(t++,10),i=d();return u.__=n,r.componentDidCatch||(r.componentDidCatch=function(n,t){u.__&&u.__(n,t),i[1](n)}),[i[0],function(){i[1](void 0)}]}function g(){var n=s(t++,11);if(!n.__){for(var u=r.__v;null!==u&&!u.__m&&null!==u.__;)u=u.__;var i=u.__m||(u.__m=[0,0]);n.__="P"+i[0]+"-"+i[1]++}return n.__}function j(){for(var n;n=f.shift();){var t=n.__H;if(n.__P&&t)try{t.__h.some(z),t.__h.some(B),t.__h=[]}catch(r){t.__h=[],c.__e(r,n.__v)}}}c.__b=function(n){r=null,e&&e(n)},c.__=function(n,t){n&&t.__k&&t.__k.__m&&(n.__m=t.__k.__m),p&&p(n,t)},c.__r=function(n){a&&a(n),t=0;var i=(r=n.__c).__H;i&&(u===r?(i.__h=[],r.__h=[],i.__.some(function(n){n.__N&&(n.__=n.__N),n.u=n.__N=void 0})):(i.__h.some(z),i.__h.some(B),i.__h=[],t=0)),u=r},c.diffed=function(n){v&&v(n);var t=n.__c;t&&t.__H&&(t.__H.__h.length&&(1!==f.push(t)&&i===c.requestAnimationFrame||((i=c.requestAnimationFrame)||w)(j)),t.__H.__.some(function(n){n.u&&(n.__H=n.u,n.u=void 0)})),u=r=null},c.__c=function(n,t){t.some(function(n){try{n.__h.some(z),n.__h=n.__h.filter(function(n){return!n.__||B(n)})}catch(r){t.some(function(n){n.__h&&(n.__h=[])}),t=[],c.__e(r,n.__v)}}),l&&l(n,t)},c.unmount=function(n){m&&m(n);var t,r=n.__c;r&&r.__H&&(r.__H.__.some(function(n){try{z(n)}catch(n){t=n}}),r.__H=void 0,t&&c.__e(t,r.__v))};var k="function"==typeof requestAnimationFrame;function w(n){var t,r=function(){clearTimeout(u),k&&cancelAnimationFrame(t),setTimeout(n)},u=setTimeout(r,35);k&&(t=requestAnimationFrame(r))}function z(n){var t=r,u=n.__c;"function"==typeof u&&(n.__c=void 0,u()),r=t}function B(n){var t=r;n.__c=n.__(),r=t}function C(n,t){return!n||n.length!==t.length||t.some(function(t,r){return t!==n[r]})}function D(n,t){return"function"==typeof t?t(n):t}export{q as useCallback,x as useContext,P as useDebugValue,h as useEffect,b as useErrorBoundary,g as useId,F as useImperativeHandle,_ as useLayoutEffect,T as useMemo,y as useReducer,A as useRef,d as useState};
+//# sourceMappingURL=hooks.module.js.map

package/dist/ui/shared/preact.module.js

@@ -0,0 +1,2 @@
+var n,l,u,t,i,r,o,e,f,c,a,s,h,p,v,y,d={},w=[],_=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,g=Array.isArray;function m(n,l){for(var u in l)n[u]=l[u];return n}function b(n){n&&n.parentNode&&n.parentNode.removeChild(n)}function k(l,u,t){var i,r,o,e={};for(o in u)"key"==o?i=u[o]:"ref"==o?r=u[o]:e[o]=u[o];if(arguments.length>2&&(e.children=arguments.length>3?n.call(arguments,2):t),"function"==typeof l&&null!=l.defaultProps)for(o in l.defaultProps)void 0===e[o]&&(e[o]=l.defaultProps[o]);return x(l,e,i,r,null)}function x(n,t,i,r,o){var e={type:n,props:t,key:i,ref:r,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:null==o?++u:o,__i:-1,__u:0};return null==o&&null!=l.vnode&&l.vnode(e),e}function M(){return{current:null}}function S(n){return n.children}function C(n,l){this.props=n,this.context=l}function $(n,l){if(null==l)return n.__?$(n.__,n.__i+1):null;for(var u;l<n.__k.length;l++)if(null!=(u=n.__k[l])&&null!=u.__e)return u.__e;return"function"==typeof n.type?$(n):null}function I(n){if(n.__P&&n.__d){var u=n.__v,t=u.__e,i=[],r=[],o=m({},u);o.__v=u.__v+1,l.vnode&&l.vnode(o),q(n.__P,o,u,n.__n,n.__P.namespaceURI,32&u.__u?[t]:null,i,null==t?$(u):t,!!(32&u.__u),r),o.__v=u.__v,o.__.__k[o.__i]=o,D(i,o,r),u.__e=u.__=null,o.__e!=t&&P(o)}}function P(n){if(null!=(n=n.__)&&null!=n.__c)return n.__e=n.__c.base=null,n.__k.some(function(l){if(null!=l&&null!=l.__e)return n.__e=n.__c.base=l.__e}),P(n)}function A(n){(!n.__d&&(n.__d=!0)&&i.push(n)&&!H.__r++||r!=l.debounceRendering)&&((r=l.debounceRendering)||o)(H)}function H(){try{for(var n,l=1;i.length;)i.length>l&&i.sort(e),n=i.shift(),l=i.length,I(n)}finally{i.length=H.__r=0}}function L(n,l,u,t,i,r,o,e,f,c,a){var s,h,p,v,y,_,g=t&&t.__k||w,m=l.length;for(f=T(u,l,g,f,m),s=0;s<m;s++)null!=(p=u.__k[s])&&(h=-1!=p.__i&&g[p.__i]||d,p.__i=s,_=q(n,p,h,i,r,o,e,f,c,a),v=p.__e,p.ref&&h.ref!=p.ref&&(h.ref&&J(h.ref,null,p),a.push(p.ref,p.__c||v,p)),null==y&&null!=v&&(y=v),4&p.__u?(f=j(p,f,n),h.__e&&(h.__e=null)):"function"==typeof p.type&&void 0!==_?f=_:v&&(f=v.nextSibling),p.__u&=-7);return u.__e=y,f}function T(n,l,u,t,i){var r,o,e,f,c,a=u.length,s=a,h=0;for(n.__k=new Array(i),r=0;r<i;r++)null!=(o=l[r])&&"boolean"!=typeof o&&"function"!=typeof o?("string"==typeof o||"number"==typeof o||"bigint"==typeof o||o.constructor==String?o=n.__k[r]=x(null,o,null,null,null):g(o)?o=n.__k[r]=x(S,{children:o},null,null,null):void 0===o.constructor&&o.__b>0?o=n.__k[r]=x(o.type,o.props,o.key,o.ref?o.ref:null,o.__v):n.__k[r]=o,f=r+h,o.__=n,o.__b=n.__b+1,e=null,-1!=(c=o.__i=O(o,u,f,s))&&(s--,(e=u[c])&&(e.__u|=2)),null==e||null==e.__v?(-1==c&&(i>a?h--:i<a&&h++),"function"!=typeof o.type&&(o.__u|=4)):c!=f&&(c==f-1?h--:c==f+1?h++:(c>f?h--:h++,o.__u|=4))):n.__k[r]=null;if(s)for(r=0;r<a;r++)null!=(e=u[r])&&0==(2&e.__u)&&(e.__e==t&&(t=$(e)),K(e,e));return t}function j(n,l,u){var t,i;if("function"==typeof n.type){for(t=n.__k,i=0;t&&i<t.length;i++)t[i]&&(t[i].__=n,l=j(t[i],l,u));return l}n.__e!=l&&(l&&n.type&&!l.parentNode&&(l=$(n)),l=u.insertBefore(n.__e,l||null));do{l=l&&l.nextSibling}while(null!=l&&8==l.nodeType);return l}function F(n,l){return l=l||[],null==n||"boolean"==typeof n||(g(n)?n.some(function(n){F(n,l)}):l.push(n)),l}function O(n,l,u,t){var i,r,o,e=n.key,f=n.type,c=l[u],a=null!=c&&0==(2&c.__u);if(null===c&&null==e||a&&e==c.key&&f==c.type)return u;if(t>(a?1:0))for(i=u-1,r=u+1;i>=0||r<l.length;)if(null!=(c=l[o=i>=0?i--:r++])&&0==(2&c.__u)&&e==c.key&&f==c.type)return o;return-1}function z(n,l,u){"-"==l[0]?n.setProperty(l,null==u?"":u):n[l]=null==u?"":"number"!=typeof u||_.test(l)?u:u+"px"}function N(n,l,u,t,i){var r,o;n:if("style"==l)if("string"==typeof u)n.style.cssText=u;else{if("string"==typeof t&&(n.style.cssText=t=""),t)for(l in t)u&&l in u||z(n.style,l,"");if(u)for(l in u)t&&u[l]==t[l]||z(n.style,l,u[l])}else if("o"==l[0]&&"n"==l[1])r=l!=(l=l.replace(s,"$1")),o=l.toLowerCase(),l=o in n||"onFocusOut"==l||"onFocusIn"==l?o.slice(2):l.slice(2),n.l||(n.l={}),n.l[l+r]=u,u?t?u[a]=t[a]:(u[a]=h,n.addEventListener(l,r?v:p,r)):n.removeEventListener(l,r?v:p,r);else{if("http://www.w3.org/2000/svg"==i)l=l.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if("width"!=l&&"height"!=l&&"href"!=l&&"list"!=l&&"form"!=l&&"tabIndex"!=l&&"download"!=l&&"rowSpan"!=l&&"colSpan"!=l&&"role"!=l&&"popover"!=l&&l in n)try{n[l]=null==u?"":u;break n}catch(n){}"function"==typeof u||(null==u||!1===u&&"-"!=l[4]?n.removeAttribute(l):n.setAttribute(l,"popover"==l&&1==u?"":u))}}function V(n){return function(u){if(this.l){var t=this.l[u.type+n];if(null==u[c])u[c]=h++;else if(u[c]<t[a])return;return t(l.event?l.event(u):u)}}}function q(n,u,t,i,r,o,e,f,c,a){var s,h,p,v,y,d,_,k,x,M,I,P,A,H,T,j,F=u.type;if(void 0!==u.constructor)return null;128&t.__u&&(c=!!(32&t.__u),o=[f=u.__e=t.__e]),(s=l.__b)&&s(u);n:if("function"==typeof F){h=e.length;try{if(x=u.props,M=F.prototype&&F.prototype.render,I=(s=F.contextType)&&i[s.__c],P=s?I?I.props.value:s.__:i,t.__c?k=(p=u.__c=t.__c).__=p.__E:(M?u.__c=p=new F(x,P):(u.__c=p=new C(x,P),p.constructor=F,p.render=Q),I&&I.sub(p),p.state||(p.state={}),p.__n=i,v=p.__d=!0,p.__h=[],p._sb=[]),M&&null==p.__s&&(p.__s=p.state),M&&null!=F.getDerivedStateFromProps&&(p.__s==p.state&&(p.__s=m({},p.__s)),m(p.__s,F.getDerivedStateFromProps(x,p.__s))),y=p.props,d=p.state,p.__v=u,v)M&&null==F.getDerivedStateFromProps&&null!=p.componentWillMount&&p.componentWillMount(),M&&null!=p.componentDidMount&&p.__h.push(p.componentDidMount);else{if(M&&null==F.getDerivedStateFromProps&&x!==y&&null!=p.componentWillReceiveProps&&p.componentWillReceiveProps(x,P),u.__v==t.__v||!p.__e&&null!=p.shouldComponentUpdate&&!1===p.shouldComponentUpdate(x,p.__s,P)){u.__v!=t.__v&&(p.props=x,p.state=p.__s,p.__d=!1),u.__e=t.__e,u.__k=t.__k,u.__k.some(function(n){n&&(n.__=u)}),w.push.apply(p.__h,p._sb),p._sb=[],p.__h.length&&e.push(p),f=$(t);break n}null!=p.componentWillUpdate&&p.componentWillUpdate(x,p.__s,P),M&&null!=p.componentDidUpdate&&p.__h.push(function(){p.componentDidUpdate(y,d,_)})}if(p.context=P,p.props=x,p.__P=n,p.__e=!1,A=l.__r,H=0,M)p.state=p.__s,p.__d=!1,A&&A(u),s=p.render(p.props,p.state,p.context),w.push.apply(p.__h,p._sb),p._sb=[];else do{p.__d=!1,A&&A(u),s=p.render(p.props,p.state,p.context),p.state=p.__s}while(p.__d&&++H<25);p.state=p.__s,null!=p.getChildContext&&(i=m(m({},i),p.getChildContext())),M&&!v&&null!=p.getSnapshotBeforeUpdate&&(_=p.getSnapshotBeforeUpdate(y,d)),T=null!=s&&s.type===S&&null==s.key?E(s.props.children):s,f=L(n,g(T)?T:[T],u,t,i,r,o,e,f,c,a),p.base=u.__e,u.__u&=-161,p.__h.length&&e.push(p),k&&(p.__E=p.__=null)}catch(n){if(e.length=h,u.__v=null,c||null!=o){if(n.then){for(u.__u|=c?160:128;f&&8==f.nodeType&&f.nextSibling;)f=f.nextSibling;null!=o&&(o[o.indexOf(f)]=null),u.__e=f}else if(null!=o)for(j=o.length;j--;)b(o[j])}else u.__e=t.__e;null==u.__k&&(u.__k=t.__k||[]),n.then||B(u),l.__e(n,u,t)}}else null==o&&u.__v==t.__v?(u.__k=t.__k,u.__e=t.__e):f=u.__e=G(t.__e,u,t,i,r,o,e,c,a);return(s=l.diffed)&&s(u),128&u.__u?void 0:f}function B(n){n&&(n.__c&&(n.__c.__e=!0),n.__k&&n.__k.some(B))}function D(n,u,t){for(var i=0;i<t.length;i++)J(t[i],t[++i],t[++i]);l.__c&&l.__c(u,n),n.some(function(u){try{n=u.__h,u.__h=[],n.some(function(n){n.call(u)})}catch(n){l.__e(n,u.__v)}})}function E(n){return"object"!=typeof n||null==n||n.__b>0?n:g(n)?n.map(E):void 0!==n.constructor?null:m({},n)}function G(u,t,i,r,o,e,f,c,a){var s,h,p,v,y,w,_,m=i.props||d,k=t.props,x=t.type;if("svg"==x?o="http://www.w3.org/2000/svg":"math"==x?o="http://www.w3.org/1998/Math/MathML":o||(o="http://www.w3.org/1999/xhtml"),null!=e)for(s=0;s<e.length;s++)if((y=e[s])&&"setAttribute"in y==!!x&&(x?y.localName==x:3==y.nodeType)){u=y,e[s]=null;break}if(null==u){if(null==x)return document.createTextNode(k);u=document.createElementNS(o,x,k.is&&k),c&&(l.__m&&l.__m(t,e),c=!1),e=null}if(null==x)m===k||c&&u.data==k||(u.data=k);else{if(e="textarea"==x&&null!=k.defaultValue?null:e&&n.call(u.childNodes),!c&&null!=e)for(m={},s=0;s<u.attributes.length;s++)m[(y=u.attributes[s]).name]=y.value;for(s in m)y=m[s],"dangerouslySetInnerHTML"==s?p=y:"children"==s||s in k||"value"==s&&"defaultValue"in k||"checked"==s&&"defaultChecked"in k||N(u,s,null,y,o);for(s in k)y=k[s],"children"==s?v=y:"dangerouslySetInnerHTML"==s?h=y:"value"==s?w=y:"checked"==s?_=y:c&&"function"!=typeof y||m[s]===y||N(u,s,y,m[s],o);if(h)c||p&&(h.__html==p.__html||h.__html==u.innerHTML)||(u.innerHTML=h.__html),t.__k=[];else if(p&&(u.innerHTML=""),L("template"==t.type?u.content:u,g(v)?v:[v],t,i,r,"foreignObject"==x?"http://www.w3.org/1999/xhtml":o,e,f,e?e[0]:i.__k&&$(i,0),c,a),null!=e)for(s=e.length;s--;)b(e[s]);c&&"textarea"!=x||(s="value","progress"==x&&null==w?u.removeAttribute("value"):null!=w&&(w!==u[s]||"progress"==x&&!w||"option"==x&&w!=m[s])&&N(u,s,w,m[s],o),s="checked",null!=_&&_!=u[s]&&N(u,s,_,m[s],o))}return u}function J(n,u,t){try{if("function"==typeof n){var i="function"==typeof n.__u;i&&n.__u(),i&&null==u||(n.__u=n(u))}else n.current=u}catch(n){l.__e(n,t)}}function K(n,u,t){var i,r;if(l.unmount&&l.unmount(n),(i=n.ref)&&(i.current&&i.current!=n.__e||J(i,null,u)),null!=(i=n.__c)){if(i.componentWillUnmount)try{i.componentWillUnmount()}catch(n){l.__e(n,u)}i.base=i.__P=i.__n=null}if(i=n.__k)for(r=0;r<i.length;r++)i[r]&&K(i[r],u,t||"function"!=typeof n.type);t||b(n.__e),n.__c=n.__=n.__e=void 0}function Q(n,l,u){return this.constructor(n,u)}function R(u,t,i){var r,o,e,f;t==document&&(t=document.documentElement),l.__&&l.__(u,t),o=(r="function"==typeof i)?null:i&&i.__k||t.__k,e=[],f=[],q(t,u=(!r&&i||t).__k=k(S,null,[u]),o||d,d,t.namespaceURI,!r&&i?[i]:o?null:t.firstChild?n.call(t.childNodes):null,e,!r&&i?i:o?o.__e:t.firstChild,r,f),D(e,u,f),u.props.children=null}function U(n,l){R(n,l,U)}function W(l,u,t){var i,r,o,e,f=m({},l.props);for(o in l.type&&l.type.defaultProps&&(e=l.type.defaultProps),u)"key"==o?i=u[o]:"ref"==o?r=u[o]:f[o]=void 0===u[o]&&null!=e?e[o]:u[o];return arguments.length>2&&(f.children=arguments.length>3?n.call(arguments,2):t),x(l.type,f,i||l.key,r||l.ref,null)}function X(n){function l(n){var u,t;return this.getChildContext||(u=new Set,(t={})[l.__c]=this,this.getChildContext=function(){return t},this.componentWillUnmount=function(){u=null},this.shouldComponentUpdate=function(n){this.props.value!=n.value&&u.forEach(function(n){n.__e=!0,A(n)})},this.sub=function(n){u.add(n);var l=n.componentWillUnmount;n.componentWillUnmount=function(){u&&u.delete(n),l&&l.call(n)}}),n.children}return l.__c="__cC"+y++,l.__=n,l.Provider=l.__l=(l.Consumer=function(n,l){return n.children(l)}).contextType=l,l}n=w.slice,l={__e:function(n,l,u,t){for(var i,r,o;l=l.__;)if((i=l.__c)&&!i.__)try{if((r=i.constructor)&&null!=r.getDerivedStateFromError&&(i.setState(r.getDerivedStateFromError(n)),o=i.__d),null!=i.componentDidCatch&&(i.componentDidCatch(n,t||{}),o=i.__d),o)return i.__E=i}catch(l){n=l}throw n}},u=0,t=function(n){return null!=n&&void 0===n.constructor},C.prototype.setState=function(n,l){var u;u=null!=this.__s&&this.__s!=this.state?this.__s:this.__s=m({},this.state),"function"==typeof n&&(n=n(m({},u),this.props)),n&&m(u,n),null!=n&&this.__v&&(l&&this._sb.push(l),A(this))},C.prototype.forceUpdate=function(n){this.__v&&(this.__e=!0,n&&this.__h.push(n),A(this))},C.prototype.render=S,i=[],o="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,e=function(n,l){return n.__v.__b-l.__v.__b},H.__r=0,f=Math.random().toString(8),c="__d"+f,a="__a"+f,s=/(PointerCapture)$|Capture$/i,h=0,p=V(!1),v=V(!0),y=0;export{C as Component,S as Fragment,W as cloneElement,X as createContext,k as createElement,M as createRef,k as h,U as hydrate,t as isValidElement,l as options,R as render,F as toChildArray};
+//# sourceMappingURL=preact.module.js.map

package/dist/ui/shared/signin.js

@@ -0,0 +1,130 @@
+// Sign-in page logic. Loaded from /assets/signin.js.
+//
+// Two jobs: (1) when the page is what a gated URL answered with because the browser sent no cookie
+// (a SameSite=Strict cookie is not sent on a navigation that came from a chat app), probe the session
+// from *here* — a same-site request does carry the cookie — and carry on to the page that was asked
+// for; (2) otherwise take the one-time code and exchange it.
+(() => {
+  "use strict";
+  const $ = (id) => document.getElementById(id);
+  const T = {
+    en: {
+      checking: "Checking your session…", title: "Sign in to AgEnD", lead: "Enter the one-time code from your chat channel.",
+      label: "One-time code", submit: "Sign in", working: "Signing in…",
+      hint: "Send /dashboard to your AgEnD bot, or run “agend web --code” on the host. A code works once and expires in 5 minutes.",
+      refused: "That code did not work — it may be wrong, expired or already used. Ask for a new one with /dashboard.",
+      paused: "Too many wrong codes — sign-in is paused for a few minutes.",
+      network: "Could not reach AgEnD. Check the connection and try again.",
+    },
+    "zh-TW": {
+      checking: "正在確認登入狀態…", title: "登入 AgEnD", lead: "請輸入聊天頻道給你的一次性登入碼。",
+      label: "一次性登入碼", submit: "登入", working: "登入中…",
+      hint: "在 AgEnD bot 傳 /dashboard，或在主機執行「agend web --code」。登入碼只能用一次，5 分鐘內有效。",
+      refused: "登入碼無效：可能輸入錯誤、已過期或已使用。請用 /dashboard 再要一個。",
+      paused: "錯誤次數過多，登入暫停幾分鐘。",
+      network: "連不上 AgEnD，請檢查連線後再試。",
+    },
+  };
+  const lang = /^zh/i.test(navigator.language || "") ? "zh-TW" : "en";
+  const t = (k) => T[lang][k] || T.en[k] || k;
+  document.documentElement.lang = lang === "zh-TW" ? "zh-Hant" : "en";
+
+  // An old dashboard link carries `?token=`. It is not a credential any more (the server ignored it and
+  // answered with this page), but it is still the fleet's token: take it out of the address bar and
+  // the history entry at once, so it is not copied, bookmarked or shared from here.
+  try {
+    const here = new URL(location.href);
+    if (here.searchParams.has("token")) {
+      here.searchParams.delete("token");
+      history.replaceState(null, "", here.pathname + here.search + here.hash);
+    }
+  } catch { /* nothing to clean */ }
+  document.querySelectorAll("[data-i18n]").forEach((el) => { el.textContent = t(el.getAttribute("data-i18n")); });
+
+  // An old deep link, /ui#instance=<name> (#1408 §3): the fragment never reaches the server, and the sign-in page is
+  // served at the URL that was asked for, so it is still in location.hash here. Exactly that one form becomes the new
+  // path /ui/chat/<name>; any other fragment is dropped. The name is held to the same rule as the server's.
+  function legacyChatTarget(pathname, hash) {
+    if (pathname !== "/ui") return null;
+    const m = /^#instance=([^&#]*)$/.exec(hash || "");
+    if (!m) return null;
+    let name;
+    try { name = decodeURIComponent(m[1]); } catch { return null; }
+    if (!name || name.length > 128 || /[/\\\u0000-\u001f\u007f]/.test(name) || name === "." || name.includes("..")) return null;
+    return "/ui/chat/" + encodeURIComponent(name);
+  }
+
+  // Where to go afterwards: only the app's pages, never an arbitrary URL.
+  function nextTarget() {
+    let candidate = new URLSearchParams(location.search).get("next");
+    if (!candidate && location.pathname !== "/signin") {
+      const legacy = legacyChatTarget(location.pathname, location.hash);
+      if (legacy) return legacy;
+      candidate = location.pathname + location.search;
+    }
+    try {
+      const u = new URL(candidate || "/ui", location.origin);
+      u.searchParams.delete("token");
+      const path = u.pathname;
+      if (u.origin === location.origin && /^\/(ui|view|settings)(\/|$)/.test(path) && !candidate.includes("\\")) return path + u.search;
+    } catch { /* fall through */ }
+    return "/ui";
+  }
+
+  const BOUNCE_KEY = "agend_signin_bounce";
+  function recentlyBounced() {
+    try { return Date.now() - Number(sessionStorage.getItem(BOUNCE_KEY) || 0) < 10000; } catch { return false; }
+  }
+  function markBounce() { try { sessionStorage.setItem(BOUNCE_KEY, String(Date.now())); } catch { /* private mode */ } }
+  function clearBounce() { try { sessionStorage.removeItem(BOUNCE_KEY); } catch { /* private mode */ } }
+
+  function showForm() {
+    $("checking").hidden = true;
+    $("form").hidden = false;
+    // A sign-out the server could not make durable says so here, once (agend-auth.js signOut).
+    try {
+      const note = sessionStorage.getItem("agend_signout_note");
+      if (note) { sessionStorage.removeItem("agend_signout_note"); $("msg").textContent = note; }
+    } catch { /* private mode */ }
+    $("code").focus();
+  }
+
+  async function probe() {
+    // A second bounce inside ten seconds means the cookie is valid but not being sent on the
+    // navigation; going round again would loop, so stop and let the person type a code.
+    if (recentlyBounced()) return false;
+    try {
+      const r = await fetch("/auth/session", { credentials: "same-origin", cache: "no-store" });
+      return r.ok;
+    } catch { return false; }
+  }
+
+  $("form").addEventListener("submit", async (event) => {
+    event.preventDefault();
+    const button = $("go");
+    const msg = $("msg");
+    msg.textContent = "";
+    button.disabled = true;
+    button.textContent = t("working");
+    try {
+      const r = await fetch("/auth/login", {
+        method: "POST",
+        credentials: "same-origin",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ code: $("code").value }),
+      });
+      if (r.ok) { clearBounce(); location.replace(nextTarget()); return; }
+      msg.textContent = r.status === 429 ? t("paused") : t("refused");
+    } catch {
+      msg.textContent = t("network");
+    }
+    button.disabled = false;
+    button.textContent = t("submit");
+    $("code").select();
+  });
+
+  probe().then((signedIn) => {
+    if (signedIn) { markBounce(); location.replace(nextTarget()); return; }
+    showForm();
+  });
+})();

package/dist/ui/shared/theme.js

@@ -0,0 +1,29 @@
+// Light / dark for a panel (#1307). Loaded from /assets/theme.js in <head>, before the page paints, so a chosen theme
+// never flashes the other one first. "system" (the default) follows the device's prefers-color-scheme through CSS;
+// "light" or "dark" is this browser's own choice and lives in localStorage, like agend_lang.
+//
+// A page's tokens follow the pattern: dark under :root, light under @media (prefers-color-scheme: light) for
+// :root:not([data-theme="dark"]), and again under :root[data-theme="light"].
+(function () {
+  "use strict";
+  var KEY = "agend_theme";
+  function valid(v) { return v === "light" || v === "dark" ? v : "system"; }
+  function read() {
+    try { return valid(localStorage.getItem(KEY)); } catch (e) { return "system"; }   // storage blocked: follow the device
+  }
+  function apply(v) {
+    var root = document.documentElement;
+    if (v === "system") root.removeAttribute("data-theme");
+    else root.setAttribute("data-theme", v);
+  }
+  apply(read());
+  window.AgendTheme = {
+    get: read,
+    /** Choose "system", "light" or "dark" for this browser; applied now even when it cannot be stored. */
+    set: function (v) {
+      v = valid(v);
+      try { if (v === "system") localStorage.removeItem(KEY); else localStorage.setItem(KEY, v); } catch (e) { /* this page only */ }
+      apply(v);
+    },
+  };
+})();

package/dist/ui/shared/tokens.css

@@ -0,0 +1,153 @@
+/* Design tokens for every web panel (#1408). Served as /assets/tokens.css; nothing here is a component.
+ *
+ * Semantic names only: a rule says what a colour is FOR (the page, the sidebar, secondary text), never which colour it
+ * is. The look is neutral greys with few borders: areas differ by background tone, not by lines (design §2).
+ *
+ * Themes follow /assets/theme.js: dark under :root; light under @media (prefers-color-scheme: light) for
+ * :root:not([data-theme="dark"]), and again under :root[data-theme="light"] for a browser that chose light. The two
+ * light blocks carry the same values (a test compares them). Every text colour meets WCAG AA (4.5:1) on the
+ * surfaces it is used on, and focus rings and strong borders meet 3:1 (tests/web-tokens-1408.test.ts).
+ *
+ * Inter is bundled (/assets/inter.woff2, SIL OFL 1.1 — see fonts/README.md): the CSP allows fonts from 'self' only,
+ * and nothing is loaded from another site. Chinese falls back to the system's CJK fonts, in the order below. */
+
+@font-face {
+  font-family: "Inter";
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url("/assets/inter.woff2") format("woff2");
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2190-2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+:root {
+  /* ── Type ── */
+  --font-ui: Inter, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
+  --fs-xs: 12px;  --lh-xs: 16px;
+  --fs-sm: 13px;  --lh-sm: 18px;
+  --fs-md: 15px;  --lh-md: 24px;   /* message text */
+  --fs-lg: 17px;  --lh-lg: 24px;
+  --fs-xl: 22px;  --lh-xl: 28px;
+  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
+
+  /* ── Space (a 4px grid) ── */
+  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-7: 32px; --s-8: 48px;
+
+  /* ── Shape and motion ── */
+  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 24px; --r-full: 999px;
+  --t-fast: 120ms; --t-med: 200ms; --ease: cubic-bezier(0.2, 0, 0, 1);
+
+  /* ── Layout ── */
+  --col: 768px;            /* the conversation column */
+  --sidebar-w: 260px;
+  --header-h: 52px;
+  --tap: 44px;             /* the smallest touch target on a phone */
+
+  /* ── Colour: dark ── */
+  color-scheme: dark;
+  --bg: #212121;           /* the main area */
+  --bg-sidebar: #171717;
+  --surface: #2f2f2f;      /* the composer, a user's bubble, cards, menus */
+  --surface-2: #3a3a3a;    /* hover and pressed rows, raised chips */
+  --border: #3d3d3d;       /* used rarely: tone separates areas */
+  --border-strong: #7a7a7a;
+  --text: #ececec;
+  --text-2: #b4b4b4;       /* secondary: senders, labels */
+  --text-3: #a3a3a3;       /* tertiary: times, hints, metadata */
+  --accent: #7ab7ff;       /* links and selected text */
+  --accent-fill: #ececec;  /* the primary button (Send) */
+  --on-accent: #0d0d0d;
+  --accent-dim: rgba(122, 183, 255, 0.14);
+  --focus: #7ab7ff;
+  --ok: #4cc38a;
+  --warn: #e3b341;
+  --danger: #ff8a80;
+  --danger-fill: #c9372c;  /* a destructive button; its text is --on-danger */
+  --on-danger: #ffffff;
+  --ok-bg: rgba(76, 195, 138, 0.14);
+  --warn-bg: rgba(227, 179, 65, 0.14);  --warn-line: rgba(227, 179, 65, 0.45);
+  --danger-bg: rgba(255, 138, 128, 0.14); --danger-line: rgba(255, 138, 128, 0.45);
+  --user-bubble: #2f2f2f;
+  --code-bg: #171717;
+  --code-head: #2a2a2a;
+  --inline-code: #383838;
+  --tk-k: #ff7b72; --tk-s: #a5d6ff; --tk-n: #79c0ff; --tk-c: #9da5ae;
+  --scrim: rgba(0, 0, 0, 0.55);
+  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
+  --shadow-2: 0 8px 28px rgba(0, 0, 0, 0.5);
+}
+
+@media (prefers-color-scheme: light) {
+  :root:not([data-theme="dark"]) {
+    color-scheme: light;
+    --bg: #ffffff;
+    --bg-sidebar: #f9f9f9;
+    --surface: #f4f4f4;
+    --surface-2: #ececec;
+    --border: #e5e5e5;
+    --border-strong: #858585;
+    --text: #0d0d0d;
+    --text-2: #5d5d5d;
+    --text-3: #696969;
+    --accent: #0a62c2;
+    --accent-fill: #0d0d0d;
+    --on-accent: #ffffff;
+    --accent-dim: rgba(10, 98, 194, 0.08);
+    --focus: #0a62c2;
+    --ok: #1a7f37;
+    --warn: #8a5a00;
+    --danger: #c4222b;
+    --danger-fill: #c4222b;
+    --on-danger: #ffffff;
+    --ok-bg: #e6f4ea;
+    --warn-bg: #fff6d6;  --warn-line: #e3b341;
+    --danger-bg: #ffebe9; --danger-line: #ff8182;
+    --user-bubble: #f4f4f4;
+    --code-bg: #f9f9f9;
+    --code-head: #ececec;
+    --inline-code: #ececec;
+    --tk-k: #c4222b; --tk-s: #0a3069; --tk-n: #0550ae; --tk-c: #5d646c;
+    --scrim: rgba(13, 13, 13, 0.4);
+    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.06);
+    --shadow-2: 0 8px 24px rgba(0, 0, 0, 0.12);
+  }
+}
+
+:root[data-theme="light"] {
+  color-scheme: light;
+  --bg: #ffffff;
+  --bg-sidebar: #f9f9f9;
+  --surface: #f4f4f4;
+  --surface-2: #ececec;
+  --border: #e5e5e5;
+  --border-strong: #858585;
+  --text: #0d0d0d;
+  --text-2: #5d5d5d;
+  --text-3: #696969;
+  --accent: #0a62c2;
+  --accent-fill: #0d0d0d;
+  --on-accent: #ffffff;
+  --accent-dim: rgba(10, 98, 194, 0.08);
+  --focus: #0a62c2;
+  --ok: #1a7f37;
+  --warn: #8a5a00;
+  --danger: #c4222b;
+  --danger-fill: #c4222b;
+  --on-danger: #ffffff;
+  --ok-bg: #e6f4ea;
+  --warn-bg: #fff6d6;  --warn-line: #e3b341;
+  --danger-bg: #ffebe9; --danger-line: #ff8182;
+  --user-bubble: #f4f4f4;
+  --code-bg: #f9f9f9;
+  --code-head: #ececec;
+  --inline-code: #ececec;
+  --tk-k: #c4222b; --tk-s: #0a3069; --tk-n: #0550ae; --tk-c: #5d646c;
+  --scrim: rgba(13, 13, 13, 0.4);
+  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.06);
+  --shadow-2: 0 8px 24px rgba(0, 0, 0, 0.12);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  :root { --t-fast: 0ms; --t-med: 0ms; }
+}

package/dist/ui/shared/ui-confirm.js

@@ -0,0 +1,43 @@
+// #1408 step 5: the app's own "are you sure?" — in place of the browser's confirm(), which looked like another
+// program and could not say which button does what. One at a time, in the app's dialog (focus trapped, Esc and the
+// backdrop say no, a bottom sheet on a phone). Text only.
+import { html } from "./app-html.js";
+import { createStore, useStore } from "./app-store.js";
+import { Dialog } from "./ui-dialog.js";
+import { t } from "./app-i18n.js";
+
+/** Pending questions, oldest first: { id, title, message, confirmLabel, danger, resolve }. */
+export const confirmStore = createStore({ queue: [] });
+let seq = 0;
+
+/**
+ * Ask. Resolves true for the confirm button, false for Cancel, Esc, the backdrop or ×.
+ * `message` may hold blank lines (paragraphs); it is shown as text.
+ */
+export function confirmDialog({ title, message, confirmLabel, danger = false } = {}) {
+  return new Promise((resolve) => {
+    const item = { id: ++seq, title: title || t("app.confirmTitle"), message: String(message || ""), confirmLabel: confirmLabel || t("app.confirmOk"), danger, resolve };
+    confirmStore.set((s) => ({ queue: [...s.queue, item] }));
+  });
+}
+
+/** Answer the oldest question (the host's buttons; tests may call it too). */
+export function answerConfirm(id, yes) {
+  const item = confirmStore.get().queue.find((q) => q.id === id);
+  if (!item) return;
+  confirmStore.set((s) => ({ queue: s.queue.filter((q) => q.id !== id) }));
+  item.resolve(!!yes);
+}
+
+/** The shell renders this once: the oldest question as a dialog. */
+export function ConfirmHost() {
+  const { queue } = useStore(confirmStore);
+  const q = queue[0];
+  if (!q) return null;
+  const paragraphs = q.message.split(/\n{2,}/);
+  return html`<${Dialog} key=${q.id} title=${q.title} onClose=${() => answerConfirm(q.id, false)}
+    actions=${html`<button type="button" class="btn" onClick=${() => answerConfirm(q.id, false)}>${t("app.cancel")}</button>
+      <button type="button" class=${`btn ${q.danger ? "btn-danger" : "btn-primary"}`} data-confirm="yes" onClick=${() => answerConfirm(q.id, true)}>${q.confirmLabel}</button>`}>
+    ${paragraphs.map((p, i) => html`<p key=${i} class="confirm-text">${p}</p>`)}
+  </${Dialog}>`;
+}

package/dist/ui/shared/ui-dialog.js

@@ -0,0 +1,45 @@
+// #1408 §7: one dialog for the whole app — the native <dialog> opened with showModal(), so the browser traps focus,
+// makes the rest inert and closes it on Esc. Focus goes back to whatever opened it. On a phone it is a bottom sheet
+// with its own × (app.css). Text and buttons only; no style attribute (#1300).
+import { html, useEffect, useLayoutEffect, useRef } from "./app-html.js";
+import { Icon } from "./ui-icons.js";
+import { t } from "./app-i18n.js";
+
+/**
+ * <${Dialog} title="Create task" onClose=${…} actions=${html`…`}>…body…</${Dialog}>
+ * Rendered = open; the parent unmounts it to close. `busy` keeps Esc and the backdrop from closing it mid-request.
+ */
+export function Dialog({ title, onClose, actions, children, busy = false, wide = false, label }) {
+  const ref = useRef(null);
+  const opener = useRef(null);
+  const busyRef = useRef(busy);
+  busyRef.current = busy;
+  useLayoutEffect(() => {
+    const d = ref.current;
+    opener.current = typeof document !== "undefined" ? document.activeElement : null;
+    if (d && typeof d.showModal === "function" && !d.open) d.showModal();
+    return () => {
+      if (d && d.open && typeof d.close === "function") d.close();
+      const back = opener.current;
+      if (back && typeof back.focus === "function" && document.contains?.(back)) back.focus();
+    };
+  }, []);
+  useEffect(() => {
+    const d = ref.current;
+    if (!d) return undefined;
+    // Esc: the browser fires "cancel"; we close through the parent so its state stays the truth.
+    const onCancel = (e) => { e.preventDefault(); if (!busyRef.current) onClose(); };
+    // A click on the backdrop lands on the <dialog> element itself, outside its inner box.
+    const onClick = (e) => { if (e.target === d && !busyRef.current) onClose(); };
+    d.addEventListener("cancel", onCancel);
+    d.addEventListener("click", onClick);
+    return () => { d.removeEventListener("cancel", onCancel); d.removeEventListener("click", onClick); };
+  }, [onClose]);
+  return html`<dialog ref=${ref} class=${`dlg${wide ? " dlg-wide" : ""}`} aria-label=${label || title}>
+    <div class="dlg-box">
+      <div class="dlg-head"><h2 class="dlg-title">${title}</h2>
+        <button type="button" class="icon-btn dlg-x" aria-label=${t("app.close")} title=${t("app.close")} onClick=${() => { if (!busyRef.current) onClose(); }}><${Icon} name="close" /></button></div>
+      <div class="dlg-body">${children}</div>
+      ${actions ? html`<div class="dlg-actions">${actions}</div>` : null}
+    </div></dialog>`;
+}

package/dist/ui/shared/ui-icons.js

@@ -0,0 +1,61 @@
+// #1408 §2: our own icon set — 24-px line icons, 2-px stroke, currentColor. No third-party or brand assets.
+// Each path is built fresh per use (a Preact vnode must not be mounted twice).
+// Decorative by default (aria-hidden); the button around one carries the label.
+import { html } from "./app-html.js";
+
+const P = {
+  menu: () => html`<path d="M4 6h16M4 12h16M4 18h16"/>`,
+  sidebar: () => html`<rect x="3" y="4" width="18" height="16" rx="2"/><path d="M9 4v16"/>`,
+  plus: () => html`<path d="M12 5v14M5 12h14"/>`,
+  edit: () => html`<path d="M12 20h9"/><path d="M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z"/>`,
+  more: () => html`<circle cx="5" cy="12" r="1.5"/><circle cx="12" cy="12" r="1.5"/><circle cx="19" cy="12" r="1.5"/>`,
+  chat: () => html`<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>`,
+  fleet: () => html`<rect x="2" y="3" width="20" height="14" rx="2"/><path d="M8 21h8M12 17v4"/>`,
+  view: () => html`<rect x="3" y="4" width="18" height="16" rx="2"/><path d="M7 9l3 3-3 3M13 15h4"/>`,
+  settings: () => html`<circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1.1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1a1.7 1.7 0 0 0 1.5-1.1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3H9a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8V9a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z"/>`,
+  attach: () => html`<path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"/>`,
+  send: () => html`<path d="M12 19V5M5 12l7-7 7 7"/>`,
+  stop: () => html`<rect x="6" y="6" width="12" height="12" rx="2"/>`,
+  copy: () => html`<rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>`,
+  file: () => html`<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/>`,
+  close: () => html`<path d="M18 6L6 18M6 6l12 12"/>`,
+  play: () => html`<path d="M6 4l14 8-14 8z"/>`,
+  restart: () => html`<path d="M1 4v6h6M23 20v-6h-6"/><path d="M20.49 9A9 9 0 0 0 5.64 5.64L1 10m22 4l-4.64 4.36A9 9 0 0 1 3.51 15"/>`,
+  trash: () => html`<path d="M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/>`,
+  info: () => html`<circle cx="12" cy="12" r="10"/><path d="M12 16v-4M12 8h.01"/>`,
+  sun: () => html`<circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/>`,
+  globe: () => html`<circle cx="12" cy="12" r="10"/><path d="M2 12h20M12 2a15 15 0 0 1 0 20M12 2a15 15 0 0 0 0 20"/>`,
+  user: () => html`<circle cx="12" cy="8" r="4"/><path d="M4 21a8 8 0 0 1 16 0"/>`,
+  tasks: () => html`<path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/>`,
+  clock: () => html`<circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/>`,
+  team: () => html`<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75"/>`,
+  sliders: () => html`<path d="M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1 14h6M9 8h6M17 16h6"/>`,
+  down: () => html`<path d="M12 5v14M19 12l-7 7-7-7"/>`,
+  alert: () => html`<path d="M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z"/><path d="M12 9v4M12 17h.01"/>`,
+  chevron: () => html`<path d="M6 9l6 6 6-6"/>`,
+  search: () => html`<circle cx="11" cy="11" r="7"/><path d="M20 20l-3.5-3.5"/>`,
+  type: () => html`<path d="M4 7V5h16v2M9 19h6M12 5v14"/>`,
+  chart: () => html`<path d="M3 20h18M6 16v-4M11 16V8M16 16v-6"/>`,
+  up: () => html`<path d="M12 19V5M5 12l7-7 7 7"/>`,
+  eye: () => html`<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/>`,
+  check: () => html`<path d="M20 6L9 17l-5-5"/>`,
+  inbox: () => html`<path d="M22 12h-6l-2 3h-4l-2-3H2"/><path d="M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z"/>`,
+  bell: () => html`<path d="M18 8a6 6 0 0 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.73 21a2 2 0 0 1-3.46 0"/>`,
+  bot: () => html`<rect x="4" y="8" width="16" height="12" rx="2"/><path d="M12 8V4M9 4h6"/><path d="M9 13h.01M15 13h.01M9 17h6"/>`,
+  plug: () => html`<path d="M9 2v6M15 2v6M6 8h12v4a6 6 0 0 1-12 0z"/><path d="M12 18v4"/>`,
+  room: () => html`<path d="M3 21V9l9-6 9 6v12"/><path d="M9 21v-6h6v6"/>`,
+  code: () => html`<path d="M16 18l6-6-6-6M8 6l-6 6 6 6"/>`,
+  wand: () => html`<path d="M15 4V2M15 10V8M11 6H9M21 6h-2M18.5 3.5l-1.4 1.4M18.5 8.5l-1.4-1.4"/><path d="M3 21l11-11"/>`,
+  key: () => html`<circle cx="7.5" cy="15.5" r="4.5"/><path d="M10.7 12.3L21 2M17 6l3 3M14 9l2 2"/>`,
+  pause: () => html`<path d="M8 5v14M16 5v14"/>`,
+  download: () => html`<path d="M12 3v12M7 10l5 5 5-5M5 21h14"/>`,
+  org: () => html`<rect x="9" y="2" width="6" height="5" rx="1"/><rect x="2" y="17" width="6" height="5" rx="1"/><rect x="16" y="17" width="6" height="5" rx="1"/><path d="M12 7v5M5 17v-5h14v5"/>`,
+  external: () => html`<path d="M14 4h6v6M20 4l-9 9"/><path d="M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5"/>`,
+};
+
+/** <${Icon} name="menu" />; `size` 16 / 18 / 20 / 24. */
+export function Icon({ name, size = 18, cls = "" }) {
+  return html`<svg class=${`icon ${cls}`} width=${size} height=${size} viewBox="0 0 24 24" fill="none" stroke="currentColor"
+    stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">${P[name] ? P[name]() : null}</svg>`;
+}
+export const ICON_NAMES = Object.keys(P);

package/dist/ui/shared/ui-menu.js

@@ -0,0 +1,39 @@
+// #1408 §7: the ⋯ menu — a button and a list of actions. Arrow keys move, Enter/Space choose, Esc closes and puts focus
+// back on the button. Esc inside the menu is the menu's: it never reaches the app (e.g. never stops an agent's reply).
+import { html, useEffect, useRef, useState } from "./app-html.js";
+import { Icon } from "./ui-icons.js";
+import { t } from "./app-i18n.js";
+
+/** items: [{ key, label, icon?, onSelect, danger?, disabled? }] (falsy entries are skipped). */
+export function Menu({ items, label, icon = "more", cls = "" }) {
+  const [open, setOpen] = useState(false);
+  const btn = useRef(null), list = useRef(null);
+  const shown = (items || []).filter(Boolean);
+  useEffect(() => {
+    if (!open) return undefined;
+    const first = list.current && list.current.querySelector("[role=menuitem]:not([disabled])");
+    if (first) first.focus();
+    const outside = (e) => { if (list.current && !list.current.contains(e.target) && btn.current && !btn.current.contains(e.target)) setOpen(false); };
+    document.addEventListener("pointerdown", outside, true);
+    return () => document.removeEventListener("pointerdown", outside, true);
+  }, [open]);
+  function onKey(e) {
+    const all = [...list.current.querySelectorAll("[role=menuitem]:not([disabled])")];
+    const i = all.indexOf(document.activeElement);
+    if (e.key === "Escape") { e.preventDefault(); e.stopPropagation(); setOpen(false); btn.current && btn.current.focus(); }
+    else if (e.key === "ArrowDown") { e.preventDefault(); (all[(i + 1) % all.length] || all[0])?.focus(); }
+    else if (e.key === "ArrowUp") { e.preventDefault(); (all[(i - 1 + all.length) % all.length] || all[0])?.focus(); }
+    else if (e.key === "Home") { e.preventDefault(); all[0]?.focus(); }
+    else if (e.key === "End") { e.preventDefault(); all[all.length - 1]?.focus(); }
+    else if (e.key === "Tab") setOpen(false);
+  }
+  function choose(item) { setOpen(false); btn.current && btn.current.focus(); item.onSelect(); }
+  return html`<div class=${`menu ${cls}`}>
+    <button ref=${btn} type="button" class="icon-btn" aria-haspopup="menu" aria-expanded=${open ? "true" : "false"}
+      aria-label=${label || t("app.more")} title=${label || t("app.more")} onClick=${() => setOpen(!open)}><${Icon} name=${icon} /></button>
+    ${open ? html`<div ref=${list} class="menu-list" role="menu" aria-label=${label || t("app.more")} onKeyDown=${onKey}>
+      ${shown.map(item => html`<button key=${item.key} type="button" role="menuitem" class=${`menu-item${item.danger ? " danger" : ""}`}
+        disabled=${!!item.disabled} onClick=${() => choose(item)}>${item.icon ? html`<${Icon} name=${item.icon} size=${16} />` : null}<span>${item.label}</span></button>`)}
+    </div>` : null}
+  </div>`;
+}

package/dist/ui/shared/ui-states.js

@@ -0,0 +1,20 @@
+// #1408 §6: one set of empty / loading / error states for every panel.
+import { html } from "./app-html.js";
+import { Icon } from "./ui-icons.js";
+import { t } from "./app-i18n.js";
+
+/** Placeholder lines while something loads. Shown only after 300 ms (CSS), so a fast load never flashes. */
+export function Skeleton({ lines = 3 }) {
+  return html`<div class="skeleton" aria-busy="true" aria-label=${t("app.loading")}>${Array.from({ length: lines }, (_, i) => html`<div key=${i} class="sk-line"></div>`)}</div>`;
+}
+
+export function Empty({ icon = "info", title, hint, action }) {
+  return html`<div class="empty"><${Icon} name=${icon} size=${32} cls="empty-icon" />
+    <p class="empty-title">${title}</p>${hint ? html`<p class="empty-hint">${hint}</p>` : null}${action || null}</div>`;
+}
+
+export function ErrorState({ message, onRetry }) {
+  return html`<div class="error-state" role="alert"><${Icon} name="alert" size=${24} />
+    <p>${message || t("app.loadFailed")}</p>
+    ${onRetry ? html`<button type="button" class="btn" onClick=${onRetry}>${t("app.retry")}</button>` : null}</div>`;
+}

package/dist/ui/shared/ui-toast.js

@@ -0,0 +1,18 @@
+// Toasts: one stack in a corner (under the header on a phone), each gone after a few seconds. Text only.
+import { html, useEffect, useState } from "./app-html.js";
+import { createStore } from "./app-store.js";
+
+const toasts = createStore([]);
+let seq = 0;
+
+export function toast(text, ok = true) {
+  const id = ++seq;
+  toasts.set(list => [...list, { id, text: String(text), ok }]);
+  setTimeout(() => toasts.set(list => list.filter(x => x.id !== id)), 4000);
+}
+
+export function Toasts() {
+  const [list, setList] = useState(toasts.get());
+  useEffect(() => toasts.subscribe(setList), []);
+  return html`<div class="toasts" role="status" aria-live="polite">${list.map(x => html`<div key=${x.id} class=${`toast ${x.ok ? "ok" : "err"}`}>${x.text}</div>`)}</div>`;
+}