diff --git a/apps/identity.json b/apps/identity.json deleted file mode 100644 index a4c28e41..00000000 --- a/apps/identity.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "type": "tildefriends-app", - "emoji": "🪪", - "previous": "&kgukkyDk1RxgfzgMH6H/0QeDPIuwPZypLuAFax21ljk=.sha256" -} diff --git a/apps/identity/app.js b/apps/identity/app.js deleted file mode 100644 index a56e5572..00000000 --- a/apps/identity/app.js +++ /dev/null @@ -1,93 +0,0 @@ -import * as tfrpc from '/tfrpc.js'; - -tfrpc.register(async function get_private_key(id) { - return bip39Words(await ssb.getPrivateKey(id)); -}); -tfrpc.register(async function create_id(id) { - return await ssb.createIdentity(); -}); -tfrpc.register(async function add_id(id) { - return await ssb.addIdentity(bip39Bytes(id)); -}); -tfrpc.register(async function delete_id(id) { - return await ssb.deleteIdentity(id); -}); -tfrpc.register(async function reload() { - await main(); -}); - -async function main() { - let ids = await ssb.getIdentities(); - await app.setDocument( - ` - - -

SSB Identity Management

-

Create a new identity

- -

Import an SSB Identity from 12 BIP39 English Words

- -

Identities

- - ` - ); -} - -main(); diff --git a/apps/user_settings.json b/apps/user_settings.json new file mode 100644 index 00000000..38c6b2d0 --- /dev/null +++ b/apps/user_settings.json @@ -0,0 +1 @@ +{"type": "tildefriends-app", "emoji": "⚙️"} diff --git a/apps/user_settings/app.js b/apps/user_settings/app.js new file mode 100644 index 00000000..ca60d601 --- /dev/null +++ b/apps/user_settings/app.js @@ -0,0 +1,60 @@ +import * as tfrpc from '/tfrpc.js'; + +tfrpc.register(async function getIdentities() { + return ssb.getIdentities(); +}); +tfrpc.register(async function createID(id) { + return await ssb.createIdentity(); +}); +tfrpc.register(async function getPrivateKey(id) { + return bip39Words(await ssb.getPrivateKey(id)); +}); +tfrpc.register(async function addID(id) { + return await ssb.addIdentity(bip39Bytes(id)); +}); +tfrpc.register(async function deleteID(id) { + return await ssb.deleteIdentity(id); +}); +tfrpc.register(async function getThemes() { + // TODO + return ['solarized', 'gruvbox', 'light']; +}); +tfrpc.register(async function getTheme() { + // TODO + return 'gruvbox'; +}); +tfrpc.register(async function setTheme() { + // TODO + console.warn('setTheme called - not implemented'); + return null; +}); +tfrpc.register(async function reload() { + await main(); +}); + +async function main() { + // Get body.html + const body = utf8Decode(await getFile('body.html')); + + // Build the document + const document = ` + + + + + + + + + + + + ${body} + + `; + + // Send it to the browser + app.setDocument(document); +} + +main(); diff --git a/apps/user_settings/body.html b/apps/user_settings/body.html new file mode 100644 index 00000000..54dc3198 --- /dev/null +++ b/apps/user_settings/body.html @@ -0,0 +1,20 @@ +

Your settings

+ +
+

Appearance

+ + +
+ +
+

Danger Zone

+ +

Manage your identities

+ + +

Change my password

+ + +

Delete your account

+ +
diff --git a/apps/user_settings/lit-all.min.js b/apps/user_settings/lit-all.min.js new file mode 100644 index 00000000..871d24fb --- /dev/null +++ b/apps/user_settings/lit-all.min.js @@ -0,0 +1,120 @@ +/** + * @license + * Copyright 2019 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ +const t=globalThis,s=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,i=Symbol(),e=new WeakMap;class n{constructor(t,s,e){if(this._$cssResult$=!0,e!==i)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=s}get styleSheet(){let t=this.i;const i=this.t;if(s&&void 0===t){const s=void 0!==i&&1===i.length;s&&(t=e.get(i)),void 0===t&&((this.i=t=new CSSStyleSheet).replaceSync(this.cssText),s&&e.set(i,t))}return t}toString(){return this.cssText}}const r=t=>new n("string"==typeof t?t:t+"",void 0,i),o=(t,...s)=>{const e=1===t.length?t[0]:s.reduce(((s,i,e)=>s+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(i)+t[e+1]),t[0]);return new n(e,t,i)},h=(i,e)=>{if(s)i.adoptedStyleSheets=e.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const s of e){const e=document.createElement("style"),n=t.litNonce;void 0!==n&&e.setAttribute("nonce",n),e.textContent=s.cssText,i.appendChild(e)}},c=s?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let s="";for(const i of t.cssRules)s+=i.cssText;return r(s)})(t):t +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */,{is:l,defineProperty:a,getOwnPropertyDescriptor:u,getOwnPropertyNames:d,getOwnPropertySymbols:f,getPrototypeOf:p}=Object,v=globalThis,y=v.trustedTypes,m=y?y.emptyScript:"",b=v.reactiveElementPolyfillSupport,g=(t,s)=>t,w={toAttribute(t,s){switch(s){case Boolean:t=t?m:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},_=(t,s)=>!l(t,s),S={attribute:!0,type:String,converter:w,reflect:!1,hasChanged:_};Symbol.metadata??=Symbol("metadata"),v.litPropertyMetadata??=new WeakMap;class $ extends HTMLElement{static addInitializer(t){this.o(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this.u&&[...this.u.keys()]}static createProperty(t,s=S){if(s.state&&(s.attribute=!1),this.o(),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),e=this.getPropertyDescriptor(t,i,s);void 0!==e&&a(this.prototype,t,e)}}static getPropertyDescriptor(t,s,i){const{get:e,set:n}=u(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t}};return{get(){return e?.call(this)},set(s){const r=e?.call(this);n.call(this,s),this.requestUpdate(t,r,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??S}static o(){if(this.hasOwnProperty(g("elementProperties")))return;const t=p(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(g("finalized")))return;if(this.finalized=!0,this.o(),this.hasOwnProperty(g("properties"))){const t=this.properties,s=[...d(t),...f(t)];for(const i of s)this.createProperty(i,t[i])}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i)}this.u=new Map;for(const[t,s]of this.elementProperties){const i=this.p(t,s);void 0!==i&&this.u.set(i,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const s=[];if(Array.isArray(t)){const i=new Set(t.flat(1/0).reverse());for(const t of i)s.unshift(c(t))}else void 0!==t&&s.push(c(t));return s}static p(t,s){const i=s.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this.v=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this.m=null,this._()}_(){this.S=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this.$(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this.P??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this.P?.delete(t)}$(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this.v=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return h(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this.P?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this.P?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,s,i){this._$AK(t,i)}C(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor.p(t,i);if(void 0!==e&&!0===i.reflect){const n=(void 0!==i.converter?.toAttribute?i.converter:w).toAttribute(s,i.type);this.m=t,null==n?this.removeAttribute(e):this.setAttribute(e,n),this.m=null}}_$AK(t,s){const i=this.constructor,e=i.u.get(t);if(void 0!==e&&this.m!==e){const t=i.getPropertyOptions(e),n="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:w;this.m=e,this[e]=n.fromAttribute(s,t.type),this.m=null}}requestUpdate(t,s,i){if(void 0!==t){if(i??=this.constructor.getPropertyOptions(t),!(i.hasChanged??_)(this[t],s))return;this.T(t,s,i)}!1===this.isUpdatePending&&(this.S=this.A())}T(t,s,i){this._$AL.has(t)||this._$AL.set(t,s),!0===i.reflect&&this.m!==t&&(this.M??=new Set).add(t)}async A(){this.isUpdatePending=!0;try{await this.S}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this.v){for(const[t,s]of this.v)this[t]=s;this.v=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t)!0!==i.wrapped||this._$AL.has(s)||void 0===this[s]||this.T(s,this[s],i)}let t=!1;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this.P?.forEach((t=>t.hostUpdate?.())),this.update(s)):this.k()}catch(s){throw t=!1,this.k(),s}t&&this._$AE(s)}willUpdate(t){}_$AE(t){this.P?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}k(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this.S}shouldUpdate(t){return!0}update(t){this.M&&=this.M.forEach((t=>this.C(t,this[t]))),this.k()}updated(t){}firstUpdated(t){}}$.elementStyles=[],$.shadowRootOptions={mode:"open"},$[g("elementProperties")]=new Map,$[g("finalized")]=new Map,b?.({ReactiveElement:$}),(v.reactiveElementVersions??=[]).push("2.0.4"); +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ +const T=globalThis,x=T.trustedTypes,E=x?x.createPolicy("lit-html",{createHTML:t=>t}):void 0,C="$lit$",P=`lit$${(Math.random()+"").slice(9)}$`,A="?"+P,k=`<${A}>`,M=document,U=()=>M.createComment(""),V=t=>null===t||"object"!=typeof t&&"function"!=typeof t,O=Array.isArray,R=t=>O(t)||"function"==typeof t?.[Symbol.iterator],N="[ \t\n\f\r]",z=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,L=/-->/g,j=/>/g,H=RegExp(`>|${N}(?:([^\\s"'>=/]+)(${N}*=${N}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),I=/'/g,D=/"/g,B=/^(?:script|style|textarea|title)$/i,W=t=>(s,...i)=>({_$litType$:t,strings:s,values:i}),Z=W(1),q=W(2),F=Symbol.for("lit-noChange"),G=Symbol.for("lit-nothing"),J=new WeakMap,K=M.createTreeWalker(M,129);function Y(t,s){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==E?E.createHTML(s):s}const Q=(t,s)=>{const i=t.length-1,e=[];let n,r=2===s?"":"",o=z;for(let s=0;s"===c[0]?(o=n??z,l=-1):void 0===c[1]?l=-2:(l=o.lastIndex-c[2].length,h=c[1],o=void 0===c[3]?H:'"'===c[3]?D:I):o===D||o===I?o=H:o===L||o===j?o=z:(o=H,n=void 0);const u=o===H&&t[s+1].startsWith("/>")?" ":"";r+=o===z?i+k:l>=0?(e.push(h),i.slice(0,l)+C+i.slice(l)+P+u):i+P+(-2===l?s:u)}return[Y(t,r+(t[i]||"")+(2===s?"":"")),e]};class X{constructor({strings:t,_$litType$:s},i){let e;this.parts=[];let n=0,r=0;const o=t.length-1,h=this.parts,[c,l]=Q(t,s);if(this.el=X.createElement(c,i),K.currentNode=this.el.content,2===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes)}for(;null!==(e=K.nextNode())&&h.length0){e.textContent=x?x.emptyScript:"";for(let i=0;i2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=G}_$AI(t,s=this,i,e){const n=this.strings;let r=!1;if(void 0===n)t=tt(this,t,s,0),r=!V(t)||t!==this._$AH&&t!==F,r&&(this._$AH=t);else{const e=t;let o,h;for(t=n[0],o=0;o{const e=i?.renderBefore??s;let n=e._$litPart$;if(void 0===n){const t=i?.renderBefore??null;e._$litPart$=n=new it(s.insertBefore(U(),t),t,void 0,i??{})}return n._$AI(t),n}; +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */class ut extends ${constructor(){super(...arguments),this.renderOptions={host:this},this.ht=void 0}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const s=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this.ht=at(s,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this.ht?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this.ht?.setConnected(!1)}render(){return F}}ut._$litElement$=!0,ut[("finalized","finalized")]=!0,globalThis.litElementHydrateSupport?.({LitElement:ut});const dt=globalThis.litElementPolyfillSupport;dt?.({LitElement:ut});const ft={_$AK:(t,s,i)=>{t._$AK(s,i)},_$AL:t=>t._$AL};(globalThis.litElementVersions??=[]).push("4.0.4"); +/** + * @license + * Copyright 2022 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ +const pt=!1,{Y:vt}=ct,yt=t=>null===t||"object"!=typeof t&&"function"!=typeof t,mt={HTML:1,SVG:2},bt=(t,s)=>void 0===s?void 0!==t?._$litType$:t?._$litType$===s,gt=t=>null!=t?._$litType$?.h,wt=t=>void 0!==t?._$litDirective$,_t=t=>t?._$litDirective$,St=t=>void 0===t.strings,$t=()=>document.createComment(""),Tt=(t,s,i)=>{const e=t._$AA.parentNode,n=void 0===s?t._$AB:s._$AA;if(void 0===i){const s=e.insertBefore($t(),n),r=e.insertBefore($t(),n);i=new vt(s,r,t,t.options)}else{const s=i._$AB.nextSibling,r=i._$AM,o=r!==t;if(o){let s;i._$AQ?.(t),i._$AM=t,void 0!==i._$AP&&(s=t._$AU)!==r._$AU&&i._$AP(s)}if(s!==n||o){let t=i._$AA;for(;t!==s;){const s=t.nextSibling;e.insertBefore(t,n),t=s}}}return i},xt=(t,s,i=t)=>(t._$AI(s,i),t),Et={},Ct=(t,s=Et)=>t._$AH=s,Pt=t=>t._$AH,At=t=>{t._$AP?.(!1,!0);let s=t._$AA;const i=t._$AB.nextSibling;for(;s!==i;){const t=s.nextSibling;s.remove(),s=t}},kt=t=>{t._$AR()},Mt={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},Ut=t=>(...s)=>({_$litDirective$:t,values:s});class Vt{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,s,i){this.nt=t,this._$AM=s,this.rt=i}_$AS(t,s){return this.update(t,s)}update(t,s){return this.render(...s)}} +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */const Ot=(t,s)=>{const i=t._$AN;if(void 0===i)return!1;for(const t of i)t._$AO?.(s,!1),Ot(t,s);return!0},Rt=t=>{let s,i;do{if(void 0===(s=t._$AM))break;i=s._$AN,i.delete(t),t=s}while(0===i?.size)},Nt=t=>{for(let s;s=t._$AM;t=s){let i=s._$AN;if(void 0===i)s._$AN=i=new Set;else if(i.has(t))break;i.add(t),jt(s)}};function zt(t){void 0!==this._$AN?(Rt(this),this._$AM=t,Nt(this)):this._$AM=t}function Lt(t,s=!1,i=0){const e=this._$AH,n=this._$AN;if(void 0!==n&&0!==n.size)if(s)if(Array.isArray(e))for(let t=i;t{2==t.type&&(t._$AP??=Lt,t._$AQ??=zt)};class Ht extends Vt{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,s,i){super._$AT(t,s,i),Nt(this),this.isConnected=t._$AU}_$AO(t,s=!0){t!==this.isConnected&&(this.isConnected=t,t?this.reconnected?.():this.disconnected?.()),s&&(Ot(this,t),Rt(this))}setValue(t){if(St(this.nt))this.nt._$AI(t,this);else{const s=[...this.nt._$AH];s[this.rt]=t,this.nt._$AI(s,this,0)}}disconnected(){}reconnected(){}} +/** + * @license + * Copyright 2021 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */class It{constructor(t){this.ct=t}disconnect(){this.ct=void 0}reconnect(t){this.ct=t}deref(){return this.ct}}class Dt{constructor(){this.lt=void 0,this.ut=void 0}get(){return this.lt}pause(){this.lt??=new Promise((t=>this.ut=t))}resume(){this.ut?.(),this.lt=this.ut=void 0}} +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */class Bt extends Ht{constructor(){super(...arguments),this.dt=new It(this),this.ft=new Dt}render(t,s){return F}update(t,[s,i]){if(this.isConnected||this.disconnected(),s===this.vt)return F;this.vt=s;let e=0;const{dt:n,ft:r}=this;return(async(t,s)=>{for await(const i of t)if(!1===await s(i))return})(s,(async t=>{for(;r.get();)await r.get();const o=n.deref();if(void 0!==o){if(o.vt!==s)return!1;void 0!==i&&(t=i(t,e)),o.commitValue(t,e),e++}return!0})),F}commitValue(t,s){this.setValue(t)}disconnected(){this.dt.disconnect(),this.ft.pause()}reconnected(){this.dt.reconnect(this),this.ft.resume()}}const Wt=Ut(Bt),Zt=Ut( +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ +class extends Bt{constructor(t){if(super(t),2!==t.type)throw Error("asyncAppend can only be used in child expressions")}update(t,s){return this.ht=t,super.update(t,s)}commitValue(t,s){0===s&&kt(this.ht);const i=Tt(this.ht);xt(i,t)}}),qt=t=>gt(t)?t._$litType$.h:t.strings,Ft=Ut(class extends Vt{constructor(t){super(t),this.yt=new WeakMap}render(t){return[t]}update(t,[s]){const i=bt(this.bt)?qt(this.bt):null,e=bt(s)?qt(s):null;if(null!==i&&(null===e||i!==e)){const s=Pt(t).pop();let e=this.yt.get(i);if(void 0===e){const t=document.createDocumentFragment();e=at(G,t),e.setConnected(!1),this.yt.set(i,e)}Ct(e,[s]),Tt(e,void 0,s)}if(null!==e){if(null===i||i!==e){const s=this.yt.get(e);if(void 0!==s){const i=Pt(s).pop();kt(t),Tt(t,void 0,i),Ct(t,[i])}}this.bt=s}else this.bt=void 0;return this.render(s)}}),Gt=(t,s,i)=>{for(const i of s)if(i[0]===t)return(0,i[1])();return i?.()},Jt=Ut( +/** + * @license + * Copyright 2018 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ +class extends Vt{constructor(t){if(super(t),1!==t.type||"class"!==t.name||t.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(t,[s]){if(void 0===this.gt){this.gt=new Set,void 0!==t.strings&&(this.wt=new Set(t.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in s)s[t]&&!this.wt?.has(t)&&this.gt.add(t);return this.render(s)}const i=t.element.classList;for(const t of this.gt)t in s||(i.remove(t),this.gt.delete(t));for(const t in s){const e=!!s[t];e===this.gt.has(t)||this.wt?.has(t)||(e?(i.add(t),this.gt.add(t)):(i.remove(t),this.gt.delete(t)))}return F}}),Kt={},Yt=Ut(class extends Vt{constructor(){super(...arguments),this._t=Kt}render(t,s){return s()}update(t,[s,i]){if(Array.isArray(s)){if(Array.isArray(this._t)&&this._t.length===s.length&&s.every(((t,s)=>t===this._t[s])))return F}else if(this._t===s)return F;return this._t=Array.isArray(s)?Array.from(s):s,this.render(s,i)}}),Qt=t=>t??G +/** + * @license + * Copyright 2021 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */;function*Xt(t,s){const i="function"==typeof s;if(void 0!==t){let e=-1;for(const n of t)e>-1&&(yield i?s(e):s),e++,yield n}} +/** + * @license + * Copyright 2021 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */const ts=Ut(class extends Vt{constructor(){super(...arguments),this.key=G}render(t,s){return this.key=t,s}update(t,[s,i]){return s!==this.key&&(Ct(t),this.key=s),i}}),ss=Ut( +/** + * @license + * Copyright 2020 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ +class extends Vt{constructor(t){if(super(t),3!==t.type&&1!==t.type&&4!==t.type)throw Error("The `live` directive is not allowed on child or event bindings");if(!St(t))throw Error("`live` bindings can only contain a single expression")}render(t){return t}update(t,[s]){if(s===F||s===G)return s;const i=t.element,e=t.name;if(3===t.type){if(s===i[e])return F}else if(4===t.type){if(!!s===i.hasAttribute(e))return F}else if(1===t.type&&i.getAttribute(e)===s+"")return F;return Ct(t),s}}); +/** + * @license + * Copyright 2021 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ +function*is(t,s){if(void 0!==t){let i=0;for(const e of t)yield s(e,i++)}} +/** + * @license + * Copyright 2021 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */function*es(t,s,i=1){const e=void 0===s?0:t;s??=t;for(let t=e;i>0?tnew rs;class rs{}const os=new WeakMap,hs=Ut(class extends Ht{render(t){return G}update(t,[s]){const i=s!==this.ct;return i&&void 0!==this.ct&&this.St(void 0),(i||this.$t!==this.Tt)&&(this.ct=s,this.xt=t.options?.host,this.St(this.Tt=t.element)),G}St(t){if("function"==typeof this.ct){const s=this.xt??globalThis;let i=os.get(s);void 0===i&&(i=new WeakMap,os.set(s,i)),void 0!==i.get(this.ct)&&this.ct.call(this.xt,void 0),i.set(this.ct,t),void 0!==t&&this.ct.call(this.xt,t)}else this.ct.value=t}get $t(){return"function"==typeof this.ct?os.get(this.xt??globalThis)?.get(this.ct):this.ct?.value}disconnected(){this.$t===this.Tt&&this.St(void 0)}reconnected(){this.St(this.Tt)}}),cs=(t,s,i)=>{const e=new Map;for(let n=s;n<=i;n++)e.set(t[n],n);return e},ls=Ut(class extends Vt{constructor(t){if(super(t),2!==t.type)throw Error("repeat() can only be used in text expressions")}Et(t,s,i){let e;void 0===i?i=s:void 0!==s&&(e=s);const n=[],r=[];let o=0;for(const s of t)n[o]=e?e(s,o):o,r[o]=i(s,o),o++;return{values:r,keys:n}}render(t,s,i){return this.Et(t,s,i).values}update(t,[s,i,e]){const n=Pt(t),{values:r,keys:o}=this.Et(s,i,e);if(!Array.isArray(n))return this.Ct=o,r;const h=this.Ct??=[],c=[];let l,a,u=0,d=n.length-1,f=0,p=r.length-1;for(;u<=d&&f<=p;)if(null===n[u])u++;else if(null===n[d])d--;else if(h[u]===o[f])c[f]=xt(n[u],r[f]),u++,f++;else if(h[d]===o[p])c[p]=xt(n[d],r[p]),d--,p--;else if(h[u]===o[p])c[p]=xt(n[u],r[p]),Tt(t,c[p+1],n[u]),u++,p--;else if(h[d]===o[f])c[f]=xt(n[d],r[f]),Tt(t,n[u],n[d]),d--,f++;else if(void 0===l&&(l=cs(o,f,p),a=cs(h,u,d)),l.has(h[u]))if(l.has(h[d])){const s=a.get(o[f]),i=void 0!==s?n[s]:null;if(null===i){const s=Tt(t,n[u]);xt(s,r[f]),c[f]=s}else c[f]=xt(i,r[f]),Tt(t,n[u],i),n[s]=null;f++}else At(n[d]),d--;else At(n[u]),u++;for(;f<=p;){const s=Tt(t,c[p+1]);xt(s,r[f]),c[f++]=s}for(;u<=d;){const t=n[u++];null!==t&&At(t)}return this.Ct=o,Ct(t,c),F}}),as="important",us=" !"+as,ds=Ut(class extends Vt{constructor(t){if(super(t),1!==t.type||"style"!==t.name||t.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce(((s,i)=>{const e=t[i];return null==e?s:s+`${i=i.includes("-")?i:i.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${e};`}),"")}update(t,[s]){const{style:i}=t.element;if(void 0===this.Pt)return this.Pt=new Set(Object.keys(s)),this.render(s);for(const t of this.Pt)null==s[t]&&(this.Pt.delete(t),t.includes("-")?i.removeProperty(t):i[t]=null);for(const t in s){const e=s[t];if(null!=e){this.Pt.add(t);const s="string"==typeof e&&e.endsWith(us);t.includes("-")||s?i.setProperty(t,s?e.slice(0,-11):e,s?as:""):i[t]=e}}return F}}),fs=Ut( +/** + * @license + * Copyright 2020 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ +class extends Vt{constructor(t){if(super(t),2!==t.type)throw Error("templateContent can only be used in child bindings")}render(t){return this.At===t?F:(this.At=t,document.importNode(t.content,!0))}});class ps extends Vt{constructor(t){if(super(t),this.bt=G,2!==t.type)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===G||null==t)return this.kt=void 0,this.bt=t;if(t===F)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.bt)return this.kt;this.bt=t;const s=[t];return s.raw=s,this.kt={_$litType$:this.constructor.resultType,strings:s,values:[]}}}ps.directiveName="unsafeHTML",ps.resultType=1;const vs=Ut(ps); +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */class ys extends ps{}ys.directiveName="unsafeSVG",ys.resultType=2;const ms=Ut(ys),bs=t=>!yt(t)&&"function"==typeof t.then,gs=1073741823; +/** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */class ws extends Ht{constructor(){super(...arguments),this.Mt=gs,this.Ut=[],this.dt=new It(this),this.ft=new Dt}render(...t){return t.find((t=>!bs(t)))??F}update(t,s){const i=this.Ut;let e=i.length;this.Ut=s;const n=this.dt,r=this.ft;this.isConnected||this.disconnected();for(let t=0;tthis.Mt);t++){const o=s[t];if(!bs(o))return this.Mt=t,o;t{for(;r.get();)await r.get();const s=n.deref();if(void 0!==s){const i=s.Ut.indexOf(o);i>-1&&i{if(t?.r===$s)return t?._$litStatic$},xs=t=>({_$litStatic$:t,r:$s}),Es=(t,...s)=>({_$litStatic$:s.reduce(((s,i,e)=>s+(t=>{if(void 0!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(i)+t[e+1]),t[0]),r:$s}),Cs=new Map,Ps=t=>(s,...i)=>{const e=i.length;let n,r;const o=[],h=[];let c,l=0,a=!1;for(;l;\n\n/**\n * A single CSSResult, CSSStyleSheet, or an array or nested arrays of those.\n */\nexport type CSSResultGroup = CSSResultOrNative | CSSResultArray;\n\nconst constructionToken = Symbol();\n\nconst cssTagCache = new WeakMap();\n\n/**\n * A container for a string of CSS text, that may be used to create a CSSStyleSheet.\n *\n * CSSResult is the return value of `css`-tagged template literals and\n * `unsafeCSS()`. In order to ensure that CSSResults are only created via the\n * `css` tag and `unsafeCSS()`, CSSResult cannot be constructed directly.\n */\nexport class CSSResult {\n // This property needs to remain unminified.\n ['_$cssResult$'] = true;\n readonly cssText: string;\n private _styleSheet?: CSSStyleSheet;\n private _strings: TemplateStringsArray | undefined;\n\n private constructor(\n cssText: string,\n strings: TemplateStringsArray | undefined,\n safeToken: symbol\n ) {\n if (safeToken !== constructionToken) {\n throw new Error(\n 'CSSResult is not constructable. Use `unsafeCSS` or `css` instead.'\n );\n }\n this.cssText = cssText;\n this._strings = strings;\n }\n\n // This is a getter so that it's lazy. In practice, this means stylesheets\n // are not created until the first element instance is made.\n get styleSheet(): CSSStyleSheet | undefined {\n // If `supportsAdoptingStyleSheets` is true then we assume CSSStyleSheet is\n // constructable.\n let styleSheet = this._styleSheet;\n const strings = this._strings;\n if (supportsAdoptingStyleSheets && styleSheet === undefined) {\n const cacheable = strings !== undefined && strings.length === 1;\n if (cacheable) {\n styleSheet = cssTagCache.get(strings);\n }\n if (styleSheet === undefined) {\n (this._styleSheet = styleSheet = new CSSStyleSheet()).replaceSync(\n this.cssText\n );\n if (cacheable) {\n cssTagCache.set(strings, styleSheet);\n }\n }\n }\n return styleSheet;\n }\n\n toString(): string {\n return this.cssText;\n }\n}\n\ntype ConstructableCSSResult = CSSResult & {\n new (\n cssText: string,\n strings: TemplateStringsArray | undefined,\n safeToken: symbol\n ): CSSResult;\n};\n\nconst textFromCSSResult = (value: CSSResultGroup | number) => {\n // This property needs to remain unminified.\n if ((value as CSSResult)['_$cssResult$'] === true) {\n return (value as CSSResult).cssText;\n } else if (typeof value === 'number') {\n return value;\n } else {\n throw new Error(\n `Value passed to 'css' function must be a 'css' function result: ` +\n `${value}. Use 'unsafeCSS' to pass non-literal values, but take care ` +\n `to ensure page security.`\n );\n }\n};\n\n/**\n * Wrap a value for interpolation in a {@linkcode css} tagged template literal.\n *\n * This is unsafe because untrusted CSS text can be used to phone home\n * or exfiltrate data to an attacker controlled site. Take care to only use\n * this with trusted input.\n */\nexport const unsafeCSS = (value: unknown) =>\n new (CSSResult as ConstructableCSSResult)(\n typeof value === 'string' ? value : String(value),\n undefined,\n constructionToken\n );\n\n/**\n * A template literal tag which can be used with LitElement's\n * {@linkcode LitElement.styles} property to set element styles.\n *\n * For security reasons, only literal string values and number may be used in\n * embedded expressions. To incorporate non-literal values {@linkcode unsafeCSS}\n * may be used inside an expression.\n */\nexport const css = (\n strings: TemplateStringsArray,\n ...values: (CSSResultGroup | number)[]\n): CSSResult => {\n const cssText =\n strings.length === 1\n ? strings[0]\n : values.reduce(\n (acc, v, idx) => acc + textFromCSSResult(v) + strings[idx + 1],\n strings[0]\n );\n return new (CSSResult as ConstructableCSSResult)(\n cssText,\n strings,\n constructionToken\n );\n};\n\n/**\n * Applies the given styles to a `shadowRoot`. When Shadow DOM is\n * available but `adoptedStyleSheets` is not, styles are appended to the\n * `shadowRoot` to [mimic spec behavior](https://wicg.github.io/construct-stylesheets/#using-constructed-stylesheets).\n * Note, when shimming is used, any styles that are subsequently placed into\n * the shadowRoot should be placed *before* any shimmed adopted styles. This\n * will match spec behavior that gives adopted sheets precedence over styles in\n * shadowRoot.\n */\nexport const adoptStyles = (\n renderRoot: ShadowRoot,\n styles: Array\n) => {\n if (supportsAdoptingStyleSheets) {\n (renderRoot as ShadowRoot).adoptedStyleSheets = styles.map((s) =>\n s instanceof CSSStyleSheet ? s : s.styleSheet!\n );\n } else {\n for (const s of styles) {\n const style = document.createElement('style');\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const nonce = (global as any)['litNonce'];\n if (nonce !== undefined) {\n style.setAttribute('nonce', nonce);\n }\n style.textContent = (s as CSSResult).cssText;\n renderRoot.appendChild(style);\n }\n }\n};\n\nconst cssResultFromStyleSheet = (sheet: CSSStyleSheet) => {\n let cssText = '';\n for (const rule of sheet.cssRules) {\n cssText += rule.cssText;\n }\n return unsafeCSS(cssText);\n};\n\nexport const getCompatibleStyle =\n supportsAdoptingStyleSheets ||\n (NODE_MODE && global.CSSStyleSheet === undefined)\n ? (s: CSSResultOrNative) => s\n : (s: CSSResultOrNative) =>\n s instanceof CSSStyleSheet ? cssResultFromStyleSheet(s) : s;\n","/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Use this module if you want to create your own base class extending\n * {@link ReactiveElement}.\n * @packageDocumentation\n */\n\nimport {\n getCompatibleStyle,\n adoptStyles,\n CSSResultGroup,\n CSSResultOrNative,\n} from './css-tag.js';\nimport type {\n ReactiveController,\n ReactiveControllerHost,\n} from './reactive-controller.js';\n\n// In the Node build, this import will be injected by Rollup:\n// import {HTMLElement, customElements} from '@lit-labs/ssr-dom-shim';\n\nexport * from './css-tag.js';\nexport type {\n ReactiveController,\n ReactiveControllerHost,\n} from './reactive-controller.js';\n\n/**\n * Removes the `readonly` modifier from properties in the union K.\n *\n * This is a safer way to cast a value to a type with a mutable version of a\n * readonly field, than casting to an interface with the field re-declared\n * because it preserves the type of all the fields and warns on typos.\n */\ntype Mutable = Omit & {\n -readonly [P in keyof Pick]: P extends K ? T[P] : never;\n};\n\n// TODO (justinfagnani): Add `hasOwn` here when we ship ES2022\nconst {\n is,\n defineProperty,\n getOwnPropertyDescriptor,\n getOwnPropertyNames,\n getOwnPropertySymbols,\n getPrototypeOf,\n} = Object;\n\nconst NODE_MODE = false;\n\n// Lets a minifier replace globalThis references with a minified name\nconst global = globalThis;\n\nif (NODE_MODE) {\n global.customElements ??= customElements;\n}\n\nconst DEV_MODE = true;\n\nlet issueWarning: (code: string, warning: string) => void;\n\nconst trustedTypes = (global as unknown as {trustedTypes?: {emptyScript: ''}})\n .trustedTypes;\n\n// Temporary workaround for https://crbug.com/993268\n// Currently, any attribute starting with \"on\" is considered to be a\n// TrustedScript source. Such boolean attributes must be set to the equivalent\n// trusted emptyScript value.\nconst emptyStringForBooleanAttribute = trustedTypes\n ? (trustedTypes.emptyScript as unknown as '')\n : '';\n\nconst polyfillSupport = DEV_MODE\n ? global.reactiveElementPolyfillSupportDevMode\n : global.reactiveElementPolyfillSupport;\n\nif (DEV_MODE) {\n // Ensure warnings are issued only 1x, even if multiple versions of Lit\n // are loaded.\n const issuedWarnings: Set = (global.litIssuedWarnings ??=\n new Set());\n\n // Issue a warning, if we haven't already.\n issueWarning = (code: string, warning: string) => {\n warning += ` See https://lit.dev/msg/${code} for more information.`;\n if (!issuedWarnings.has(warning)) {\n console.warn(warning);\n issuedWarnings.add(warning);\n }\n };\n\n issueWarning(\n 'dev-mode',\n `Lit is in dev mode. Not recommended for production!`\n );\n\n // Issue polyfill support warning.\n if (global.ShadyDOM?.inUse && polyfillSupport === undefined) {\n issueWarning(\n 'polyfill-support-missing',\n `Shadow DOM is being polyfilled via \\`ShadyDOM\\` but ` +\n `the \\`polyfill-support\\` module has not been loaded.`\n );\n }\n}\n\n/**\n * Contains types that are part of the unstable debug API.\n *\n * Everything in this API is not stable and may change or be removed in the future,\n * even on patch releases.\n */\n// eslint-disable-next-line @typescript-eslint/no-namespace\nexport namespace ReactiveUnstable {\n /**\n * When Lit is running in dev mode and `window.emitLitDebugLogEvents` is true,\n * we will emit 'lit-debug' events to window, with live details about the update and render\n * lifecycle. These can be useful for writing debug tooling and visualizations.\n *\n * Please be aware that running with window.emitLitDebugLogEvents has performance overhead,\n * making certain operations that are normally very cheap (like a no-op render) much slower,\n * because we must copy data and dispatch events.\n */\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace DebugLog {\n export type Entry = Update;\n export interface Update {\n kind: 'update';\n }\n }\n}\n\ninterface DebugLoggingWindow {\n // Even in dev mode, we generally don't want to emit these events, as that's\n // another level of cost, so only emit them when DEV_MODE is true _and_ when\n // window.emitLitDebugEvents is true.\n emitLitDebugLogEvents?: boolean;\n}\n\n/**\n * Useful for visualizing and logging insights into what the Lit template system is doing.\n *\n * Compiled out of prod mode builds.\n */\nconst debugLogEvent = DEV_MODE\n ? (event: ReactiveUnstable.DebugLog.Entry) => {\n const shouldEmit = (global as unknown as DebugLoggingWindow)\n .emitLitDebugLogEvents;\n if (!shouldEmit) {\n return;\n }\n global.dispatchEvent(\n new CustomEvent('lit-debug', {\n detail: event,\n })\n );\n }\n : undefined;\n\n/*\n * When using Closure Compiler, JSCompiler_renameProperty(property, object) is\n * replaced at compile time by the munged name for object[property]. We cannot\n * alias this function, so we have to use a small shim that has the same\n * behavior when not compiling.\n */\n/*@__INLINE__*/\nconst JSCompiler_renameProperty =

(\n prop: P,\n _obj: unknown\n): P => prop;\n\n/**\n * Converts property values to and from attribute values.\n */\nexport interface ComplexAttributeConverter {\n /**\n * Called to convert an attribute value to a property\n * value.\n */\n fromAttribute?(value: string | null, type?: TypeHint): Type;\n\n /**\n * Called to convert a property value to an attribute\n * value.\n *\n * It returns unknown instead of string, to be compatible with\n * https://github.com/WICG/trusted-types (and similar efforts).\n */\n toAttribute?(value: Type, type?: TypeHint): unknown;\n}\n\ntype AttributeConverter =\n | ComplexAttributeConverter\n | ((value: string | null, type?: TypeHint) => Type);\n\n/**\n * Defines options for a property accessor.\n */\nexport interface PropertyDeclaration {\n /**\n * When set to `true`, indicates the property is internal private state. The\n * property should not be set by users. When using TypeScript, this property\n * should be marked as `private` or `protected`, and it is also a common\n * practice to use a leading `_` in the name. The property is not added to\n * `observedAttributes`.\n */\n readonly state?: boolean;\n\n /**\n * Indicates how and whether the property becomes an observed attribute.\n * If the value is `false`, the property is not added to `observedAttributes`.\n * If true or absent, the lowercased property name is observed (e.g. `fooBar`\n * becomes `foobar`). If a string, the string value is observed (e.g\n * `attribute: 'foo-bar'`).\n */\n readonly attribute?: boolean | string;\n\n /**\n * Indicates the type of the property. This is used only as a hint for the\n * `converter` to determine how to convert the attribute\n * to/from a property.\n */\n readonly type?: TypeHint;\n\n /**\n * Indicates how to convert the attribute to/from a property. If this value\n * is a function, it is used to convert the attribute value a the property\n * value. If it's an object, it can have keys for `fromAttribute` and\n * `toAttribute`. If no `toAttribute` function is provided and\n * `reflect` is set to `true`, the property value is set directly to the\n * attribute. A default `converter` is used if none is provided; it supports\n * `Boolean`, `String`, `Number`, `Object`, and `Array`. Note,\n * when a property changes and the converter is used to update the attribute,\n * the property is never updated again as a result of the attribute changing,\n * and vice versa.\n */\n readonly converter?: AttributeConverter;\n\n /**\n * Indicates if the property should reflect to an attribute.\n * If `true`, when the property is set, the attribute is set using the\n * attribute name determined according to the rules for the `attribute`\n * property option and the value of the property converted using the rules\n * from the `converter` property option.\n */\n readonly reflect?: boolean;\n\n /**\n * A function that indicates if a property should be considered changed when\n * it is set. The function should take the `newValue` and `oldValue` and\n * return `true` if an update should be requested.\n */\n hasChanged?(value: Type, oldValue: Type): boolean;\n\n /**\n * Indicates whether an accessor will be created for this property. By\n * default, an accessor will be generated for this property that requests an\n * update when set. If this flag is `true`, no accessor will be created, and\n * it will be the user's responsibility to call\n * `this.requestUpdate(propertyName, oldValue)` to request an update when\n * the property changes.\n */\n readonly noAccessor?: boolean;\n\n /**\n * Whether this property is wrapping accessors. This is set by `@property`\n * to control the initial value change and reflection logic.\n *\n * @internal\n */\n wrapped?: boolean;\n}\n\n/**\n * Map of properties to PropertyDeclaration options. For each property an\n * accessor is made, and the property is processed according to the\n * PropertyDeclaration options.\n */\nexport interface PropertyDeclarations {\n readonly [key: string]: PropertyDeclaration;\n}\n\ntype PropertyDeclarationMap = Map;\n\ntype AttributeMap = Map;\n\n/**\n * A Map of property keys to values.\n *\n * Takes an optional type parameter T, which when specified as a non-any,\n * non-unknown type, will make the Map more strongly-typed, associating the map\n * keys with their corresponding value type on T.\n *\n * Use `PropertyValues` when overriding ReactiveElement.update() and\n * other lifecycle methods in order to get stronger type-checking on keys\n * and values.\n */\n// This type is conditional so that if the parameter T is not specified, or\n// is `any`, the type will include `Map`. Since T is not\n// given in the uses of PropertyValues in this file, all uses here fallback to\n// meaning `Map`, but if a developer uses\n// `PropertyValues` (or any other value for T) they will get a\n// strongly-typed Map type.\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type PropertyValues = T extends object\n ? PropertyValueMap\n : Map;\n\n/**\n * Do not use, instead prefer {@linkcode PropertyValues}.\n */\n// This type must be exported such that JavaScript generated by the Google\n// Closure Compiler can import a type reference.\nexport interface PropertyValueMap extends Map {\n get(k: K): T[K] | undefined;\n set(key: K, value: T[K]): this;\n has(k: K): boolean;\n delete(k: K): boolean;\n}\n\nexport const defaultConverter: ComplexAttributeConverter = {\n toAttribute(value: unknown, type?: unknown): unknown {\n switch (type) {\n case Boolean:\n value = value ? emptyStringForBooleanAttribute : null;\n break;\n case Object:\n case Array:\n // if the value is `null` or `undefined` pass this through\n // to allow removing/no change behavior.\n value = value == null ? value : JSON.stringify(value);\n break;\n }\n return value;\n },\n\n fromAttribute(value: string | null, type?: unknown) {\n let fromValue: unknown = value;\n switch (type) {\n case Boolean:\n fromValue = value !== null;\n break;\n case Number:\n fromValue = value === null ? null : Number(value);\n break;\n case Object:\n case Array:\n // Do *not* generate exception when invalid JSON is set as elements\n // don't normally complain on being mis-configured.\n // TODO(sorvell): Do generate exception in *dev mode*.\n try {\n // Assert to adhere to Bazel's \"must type assert JSON parse\" rule.\n fromValue = JSON.parse(value!) as unknown;\n } catch (e) {\n fromValue = null;\n }\n break;\n }\n return fromValue;\n },\n};\n\nexport interface HasChanged {\n (value: unknown, old: unknown): boolean;\n}\n\n/**\n * Change function that returns true if `value` is different from `oldValue`.\n * This method is used as the default for a property's `hasChanged` function.\n */\nexport const notEqual: HasChanged = (value: unknown, old: unknown): boolean =>\n !is(value, old);\n\nconst defaultPropertyDeclaration: PropertyDeclaration = {\n attribute: true,\n type: String,\n converter: defaultConverter,\n reflect: false,\n hasChanged: notEqual,\n};\n\n/**\n * A string representing one of the supported dev mode warning categories.\n */\nexport type WarningKind =\n | 'change-in-update'\n | 'migration'\n | 'async-perform-update';\n\nexport type Initializer = (element: ReactiveElement) => void;\n\n// Temporary, until google3 is on TypeScript 5.2\ndeclare global {\n interface SymbolConstructor {\n readonly metadata: unique symbol;\n }\n}\n\n// Ensure metadata is enabled. TypeScript does not polyfill\n// Symbol.metadata, so we must ensure that it exists.\n(Symbol as {metadata: symbol}).metadata ??= Symbol('metadata');\n\ndeclare global {\n // This is public global API, do not change!\n // eslint-disable-next-line no-var\n var litPropertyMetadata: WeakMap<\n object,\n Map\n >;\n}\n\n// Map from a class's metadata object to property options\n// Note that we must use nullish-coalescing assignment so that we only use one\n// map even if we load multiple version of this module.\nglobal.litPropertyMetadata ??= new WeakMap<\n object,\n Map\n>();\n\n/**\n * Base element class which manages element properties and attributes. When\n * properties change, the `update` method is asynchronously called. This method\n * should be supplied by subclasses to render updates as desired.\n * @noInheritDoc\n */\nexport abstract class ReactiveElement\n // In the Node build, this `extends` clause will be substituted with\n // `(globalThis.HTMLElement ?? HTMLElement)`.\n //\n // This way, we will first prefer any global `HTMLElement` polyfill that the\n // user has assigned, and then fall back to the `HTMLElement` shim which has\n // been imported (see note at the top of this file about how this import is\n // generated by Rollup). Note that the `HTMLElement` variable has been\n // shadowed by this import, so it no longer refers to the global.\n extends HTMLElement\n implements ReactiveControllerHost\n{\n // Note: these are patched in only in DEV_MODE.\n /**\n * Read or set all the enabled warning categories for this class.\n *\n * This property is only used in development builds.\n *\n * @nocollapse\n * @category dev-mode\n */\n static enabledWarnings?: WarningKind[];\n\n /**\n * Enable the given warning category for this class.\n *\n * This method only exists in development builds, so it should be accessed\n * with a guard like:\n *\n * ```ts\n * // Enable for all ReactiveElement subclasses\n * ReactiveElement.enableWarning?.('migration');\n *\n * // Enable for only MyElement and subclasses\n * MyElement.enableWarning?.('migration');\n * ```\n *\n * @nocollapse\n * @category dev-mode\n */\n static enableWarning?: (warningKind: WarningKind) => void;\n\n /**\n * Disable the given warning category for this class.\n *\n * This method only exists in development builds, so it should be accessed\n * with a guard like:\n *\n * ```ts\n * // Disable for all ReactiveElement subclasses\n * ReactiveElement.disableWarning?.('migration');\n *\n * // Disable for only MyElement and subclasses\n * MyElement.disableWarning?.('migration');\n * ```\n *\n * @nocollapse\n * @category dev-mode\n */\n static disableWarning?: (warningKind: WarningKind) => void;\n\n /**\n * Adds an initializer function to the class that is called during instance\n * construction.\n *\n * This is useful for code that runs against a `ReactiveElement`\n * subclass, such as a decorator, that needs to do work for each\n * instance, such as setting up a `ReactiveController`.\n *\n * ```ts\n * const myDecorator = (target: typeof ReactiveElement, key: string) => {\n * target.addInitializer((instance: ReactiveElement) => {\n * // This is run during construction of the element\n * new MyController(instance);\n * });\n * }\n * ```\n *\n * Decorating a field will then cause each instance to run an initializer\n * that adds a controller:\n *\n * ```ts\n * class MyElement extends LitElement {\n * @myDecorator foo;\n * }\n * ```\n *\n * Initializers are stored per-constructor. Adding an initializer to a\n * subclass does not add it to a superclass. Since initializers are run in\n * constructors, initializers will run in order of the class hierarchy,\n * starting with superclasses and progressing to the instance's class.\n *\n * @nocollapse\n */\n static addInitializer(initializer: Initializer) {\n this.__prepare();\n (this._initializers ??= []).push(initializer);\n }\n\n static _initializers?: Initializer[];\n\n /*\n * Due to closure compiler ES6 compilation bugs, @nocollapse is required on\n * all static methods and properties with initializers. Reference:\n * - https://github.com/google/closure-compiler/issues/1776\n */\n\n /**\n * Maps attribute names to properties; for example `foobar` attribute to\n * `fooBar` property. Created lazily on user subclasses when finalizing the\n * class.\n * @nocollapse\n */\n private static __attributeToPropertyMap: AttributeMap;\n\n /**\n * Marks class as having been finalized, which includes creating properties\n * from `static properties`, but does *not* include all properties created\n * from decorators.\n * @nocollapse\n */\n protected static finalized: true | undefined;\n\n /**\n * Memoized list of all element properties, including any superclass\n * properties. Created lazily on user subclasses when finalizing the class.\n *\n * @nocollapse\n * @category properties\n */\n static elementProperties: PropertyDeclarationMap;\n\n /**\n * User-supplied object that maps property names to `PropertyDeclaration`\n * objects containing options for configuring reactive properties. When\n * a reactive property is set the element will update and render.\n *\n * By default properties are public fields, and as such, they should be\n * considered as primarily settable by element users, either via attribute or\n * the property itself.\n *\n * Generally, properties that are changed by the element should be private or\n * protected fields and should use the `state: true` option. Properties\n * marked as `state` do not reflect from the corresponding attribute\n *\n * However, sometimes element code does need to set a public property. This\n * should typically only be done in response to user interaction, and an event\n * should be fired informing the user; for example, a checkbox sets its\n * `checked` property when clicked and fires a `changed` event. Mutating\n * public properties should typically not be done for non-primitive (object or\n * array) properties. In other cases when an element needs to manage state, a\n * private property set with the `state: true` option should be used. When\n * needed, state properties can be initialized via public properties to\n * facilitate complex interactions.\n * @nocollapse\n * @category properties\n */\n static properties: PropertyDeclarations;\n\n /**\n * Memoized list of all element styles.\n * Created lazily on user subclasses when finalizing the class.\n * @nocollapse\n * @category styles\n */\n static elementStyles: Array = [];\n\n /**\n * Array of styles to apply to the element. The styles should be defined\n * using the {@linkcode css} tag function, via constructible stylesheets, or\n * imported from native CSS module scripts.\n *\n * Note on Content Security Policy:\n *\n * Element styles are implemented with ` + +

Create a new identity

+ + +

Import an SSB Identity from 12 BIP39 English Words

+ + + +

Warning !

+ Anybody that knows your private key can gain total access over your + account. +

+ Tilde Friends' contributors will never ask you for your private key ! + +
    + ${this.ids.map( + (id) => + html`
  • + + + ${id} +
  • ` + )} +
`; + } +} + +customElements.define('tf-identity-manager', TfIdentityManagerElement); diff --git a/apps/user_settings/tf-password-form.js b/apps/user_settings/tf-password-form.js new file mode 100644 index 00000000..5a0e52cd --- /dev/null +++ b/apps/user_settings/tf-password-form.js @@ -0,0 +1,82 @@ +import {LitElement, html} from './lit-all.min.js'; +import * as tfrpc from '/static/tfrpc.js'; + +class TfPasswordFormElement extends LitElement { + static get properties() { + return { + //selected: {type: String}, + }; + } + + constructor() { + super(); + } + + /** + * Checks a password against different requirements + * @param {string} password the password to validate + * @returns + */ + validatePassword(password) { + // TODO(tasiaiso) + return true; + } + + submitPassword() { + const currentPwd = this.shadowRoot.getElementById('current').value; + const newPwd = this.shadowRoot.getElementById('new').value; + const repeatPwd = this.shadowRoot.getElementById('Repeat').value; + + if (!(newPwd === repeatPwd)) { + return; + } + + // TODO + // tfrpc.changePassword() + } + + render() { + return html` + + + + +
+ + + + + + + + +
+ + + `; + } +} + +customElements.define('tf-password-form', TfPasswordFormElement); diff --git a/apps/user_settings/tf-theme-picker.js b/apps/user_settings/tf-theme-picker.js new file mode 100644 index 00000000..48d6f794 --- /dev/null +++ b/apps/user_settings/tf-theme-picker.js @@ -0,0 +1,51 @@ +import {LitElement, html, nothing} from './lit-all.min.js'; +import * as tfrpc from '/static/tfrpc.js'; + +class TfThemePickerElement extends LitElement { + static get properties() { + return { + selected: {type: String}, + themes: {type: Array}, + }; + } + + constructor() { + super(); + this.load(); + } + + async load() { + this.themes = await tfrpc.rpc.getThemes(); + this.selected = await tfrpc.rpc.getTheme(); + + let select = this.renderRoot?.querySelector('#theme-select'); + select.value = this.selected; + } + + changed(event) { + this.selected = event.srcElement.value; + console.log('selected theme', this.selected); + // TODO + } + + render() { + return html` + + + + + + `; + } +} + +customElements.define('tf-theme-picker', TfThemePickerElement); diff --git a/core/tildefriends-v1.css b/core/tildefriends-v1.css new file mode 100644 index 00000000..7bb33999 --- /dev/null +++ b/core/tildefriends-v1.css @@ -0,0 +1,114 @@ +/* + * Tilde Friends core stylesheet + * + * This Software is an external library that is part of + * Tilde Friends and is shared under the MIT license. + * + * Inject this file in your app at tildefriends.css + * and use this tag to import it: + * + * + * v1.0 / 2024 M03 21 + */ + +body { + color: white; + font-family: sans-serif; +} + +button, +.button, +input[type='button'], +input[type='submit'], +select { + border: none; + border-radius: 8px; + padding: 8px 12px; + text-align: center; + text-decoration: none; + display: inline-block; + margin: 4px; + + &.red { + background-color: #bd1e24; + color: white; + } + + &.green { + background-color: #18922d; + color: white; + } + + &.blue { + background-color: #0067a7; + color: white; + } + + &.yellow { + background-color: #ee9600; + color: black; + } + + &:hover { + filter: brightness(0.75); + } +} + +a:link { + color: #268bd2; +} + +a:visited { + color: #6c71c4; +} + +a:hover { + color: #859900; +} + +a:active { + color: #2aa198; +} + +table { + border-collapse: collapse; + width: 100%; +} + +td, +th { + border: 1px solid #ffffff40; + text-align: left; + padding: 8px; +} + +tr:nth-child(even) { + background-color: #ffffff20; +} + +.flex { + display: flex; +} + +.flex-column { + display: flex; + flex-direction: column; +} + +.flex-row { + display: flex; + flex-direction: row; +} + +.inline-flex-row { + display: inline-flex; + flex-direction: row; +} + +.box { + background-color: #00000020; + border: 1px solid grey; + border-radius: 8px; + padding: 16px; + margin: 4px; +} diff --git a/src/httpd.js.c b/src/httpd.js.c index c11204d8..3e978f73 100644 --- a/src/httpd.js.c +++ b/src/httpd.js.c @@ -644,6 +644,7 @@ static void _httpd_endpoint_static(tf_http_request_t* request) "style.css", "tfrpc.js", "w3.css", + "tildefriends-v1.css" }; const char* k_map[][2] = {