diff options
author | Tobias Lütke <tobi@shopify.com> | 2023-07-04 10:05:27 -0400 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-07-04 16:05:27 +0200 |
commit | 7ee76e45afae7f9a7a53e93393accfb5b36684e1 (patch) | |
tree | 113fc52e6b154de3d1b1c39fbcae1ab002f884e6 /examples/server/public | |
parent | acc111caf93fc6681450924df9f99679c384c59e (diff) |
Simple webchat for server (#1998)
* expose simple web interface on root domain
* embed index and add --path for choosing static dir
* allow server to multithread
because web browsers send a lot of garbage requests we want the server
to multithread when serving 404s for favicon's etc. To avoid blowing up
llama we just take a mutex when it's invoked.
* let's try this with the xxd tool instead and see if msvc is happier with that
* enable server in Makefiles
* add /completion.js file to make it easy to use the server from js
* slightly nicer css
* rework state management into session, expose historyTemplate to settings
---------
Co-authored-by: Georgi Gerganov <ggerganov@gmail.com>
Diffstat (limited to 'examples/server/public')
-rw-r--r-- | examples/server/public/completion.js | 81 | ||||
-rw-r--r-- | examples/server/public/index.html | 359 | ||||
-rw-r--r-- | examples/server/public/index.js | 1 |
3 files changed, 441 insertions, 0 deletions
diff --git a/examples/server/public/completion.js b/examples/server/public/completion.js new file mode 100644 index 0000000..4f5005c --- /dev/null +++ b/examples/server/public/completion.js @@ -0,0 +1,81 @@ +const paramDefaults = { + stream: true, + n_predict: 500, + temperature: 0.2, + stop: ["</s>"] +}; + +/** + * This function completes the input text using a llama dictionary. + * @param {object} params - The parameters for the completion request. + * @param {object} controller - an instance of AbortController if you need one, or null. + * @param {function} callback - The callback function to call when the completion is done. + * @returns {string} the completed text as a string. Ideally ignored, and you get at it via the callback. + */ +export const llamaComplete = async (params, controller, callback) => { + if (!controller) { + controller = new AbortController(); + } + const completionParams = { ...paramDefaults, ...params }; + + // we use fetch directly here becasue the built in fetchEventSource does not support POST + const response = await fetch("/completion", { + method: 'POST', + body: JSON.stringify(completionParams), + headers: { + 'Connection': 'keep-alive', + 'Content-Type': 'application/json', + 'Accept': 'text/event-stream' + }, + signal: controller.signal, + }); + + const reader = response.body.getReader(); + const decoder = new TextDecoder(); + + let content = ""; + + try { + + let cont = true; + + while (cont) { + const result = await reader.read(); + if (result.done) { + break; + } + + // sse answers in the form multiple lines of: value\n with data always present as a key. in our case we + // mainly care about the data: key here, which we expect as json + const text = decoder.decode(result.value); + + // parse all sse events and add them to result + const regex = /^(\S+):\s(.*)$/gm; + for (const match of text.matchAll(regex)) { + result[match[1]] = match[2] + } + + // since we know this is llama.cpp, let's just decode the json in data + result.data = JSON.parse(result.data); + content += result.data.content; + + // callack + if (callback) { + cont = callback(result) != false; + } + + // if we got a stop token from server, we will break here + if (result.data.stop) { + break; + } + } + } catch (e) { + console.error("llama error: ", e); + throw e; + } + finally { + controller.abort(); + } + + return content; +} diff --git a/examples/server/public/index.html b/examples/server/public/index.html new file mode 100644 index 0000000..6393e2e --- /dev/null +++ b/examples/server/public/index.html @@ -0,0 +1,359 @@ +<html> + +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /> + <title>llama.cpp - chat</title> + + <style> + + body { + background-color: #fff; + color: #000; + font-family: system-ui; + font-size: 90%; + } + + #container { + margin: 0em auto; + display: flex; + flex-direction: column; + justify-content: space-between; + height: 100%; + } + + header, footer { + text-align: center; + } + + main { + margin: 3px; + display: flex; + flex-direction: column; + justify-content: space-between; + gap: 1em; + + flex-grow: 1; + overflow-y: auto; + + border: 1px solid #ccc; + border-radius: 5px; + padding: 0.5em; + } + + body { + max-width: 600px; + min-width: 300px; + line-height: 1.2; + margin: 0 auto; + padding: 0 0.5em; + } + + p { + overflow-wrap: break-word; + word-wrap: break-word; + hyphens: auto; + margin-top: 0.5em; + margin-bottom: 0.5em; + } + + #write form { + margin: 1em 0 0 0; + display: flex; + flex-direction: column; + gap: 0.5em; + align-items: stretch; + } + + .right { + display: flex; + flex-direction: row; + gap: 0.5em; + justify-content: flex-end; + } + + fieldset { + border: none; + padding: 0; + margin: 0; + } + + textarea { + padding: 5px; + flex-grow: 1; + width: 100%; + } + + pre code { + display: block; + background-color: #222; + color: #ddd; + } + code { + font-family: monospace; + padding: 0.1em 0.3em; + border-radius: 3px; + } + + fieldset label { + margin: 0.5em 0; + display: block; + } + </style> + + <script type="module"> + import { + html, h, signal, effect, computed, render, useSignal, useEffect, useRef + } from '/index.js'; + + import { llamaComplete } from '/completion.js'; + + const session = signal({ + prompt: "This is a conversation between user and llama, a friendly chatbot. respond in markdown.", + template: "{{prompt}}\n\n{{history}}\n{{char}}:", + historyTemplate: "{{name}}: {{message}}", + transcript: [], + type: "chat", + char: "llama", + user: "User", + }) + + const transcriptUpdate = (transcript) => { + session.value = { + ...session.value, + transcript + } + } + + const chatStarted = computed(() => session.value.transcript.length > 0) + + const params = signal({ + n_predict: 400, + temperature: 0.7, + repeat_last_n: 256, + repeat_penalty: 1.18, + top_k: 40, + top_p: 0.5, + }) + + const controller = signal(null) + const generating = computed(() => controller.value == null ) + + // simple template replace + const template = (str, extraSettings) => { + let settings = session.value; + if (extraSettings) { + settings = { ...settings, ...extraSettings }; + } + return String(str).replaceAll(/\{\{(.*?)\}\}/g, (_, key) => template(settings[key])); + } + + // send message to server + const chat = async (msg) => { + if (controller.value) { + console.log('already running...'); + return; + } + controller.value = new AbortController(); + + transcriptUpdate([...session.value.transcript, ["{{user}}", msg]]) + + const payload = template(session.value.template, { + message: msg, + history: session.value.transcript.flatMap(([name, message]) => template(session.value.historyTemplate, {name, message})).join("\n"), + }); + + let currentMessage = ''; + const history = session.value.transcript + + const llamaParams = { + ...params.value, + prompt: payload, + stop: ["</s>", template("{{char}}:"), template("{{user}}:")], + } + + await llamaComplete(llamaParams, controller.value, (message) => { + const data = message.data; + currentMessage += data.content; + // remove leading whitespace + currentMessage = currentMessage.replace(/^\s+/, "") + + transcriptUpdate([...history, ["{{char}}", currentMessage]]) + + if (data.stop) { + console.log("-->", data, ' response was:', currentMessage, 'transcript state:', session.value.transcript); + } + }) + + controller.value = null; + } + + function MessageInput() { + const message = useSignal("") + + const stop = (e) => { + e.preventDefault(); + if (controller.value) { + controller.value.abort(); + controller.value = null; + } + } + + const reset = (e) => { + stop(e); + transcriptUpdate([]); + } + + const submit = (e) => { + stop(e); + chat(message.value); + message.value = ""; + } + + const enterSubmits = (event) => { + if (event.which === 13 && !event.shiftKey) { + submit(event); + } + } + + return html` + <form onsubmit=${submit}> + <div> + <textarea type="text" rows=2 onkeypress=${enterSubmits} value="${message}" oninput=${(e) => message.value = e.target.value} placeholder="Say something..."/> + + </div> + <div class="right"> + <button type="submit" disabled=${!generating.value} >Send</button> + <button onclick=${stop} disabled=${generating}>Stop</button> + <button onclick=${reset}>Reset</button> + </div> + </form> + ` + } + + const ChatLog = (props) => { + const messages = session.value.transcript; + const container = useRef(null) + + useEffect(() => { + // scroll to bottom (if needed) + if (container.current && container.current.scrollHeight <= container.current.scrollTop + container.current.offsetHeight + 300) { + container.current.scrollTo(0, container.current.scrollHeight) + } + }, [messages]) + + const chatLine = ([user, msg]) => { + return html`<p key=${msg}><strong>${template(user)}:</strong> <${Markdown} text=${template(msg)} /></p>` + }; + + return html` + <section id="chat" ref=${container}> + ${messages.flatMap(chatLine)} + </section>`; + }; + + const ConfigForm = (props) => { + const updateSession = (el) => session.value = { ...session.value, [el.target.name]: el.target.value } + const updateParams = (el) => params.value = { ...params.value, [el.target.name]: el.target.value } + const updateParamsFloat = (el) => params.value = { ...params.value, [el.target.name]: parseFloat(el.target.value) } + + return html` + <form> + <fieldset> + <div> + <label for="prompt">Prompt</label> + <textarea type="text" name="prompt" value="${session.value.prompt}" rows=4 oninput=${updateSession}/> + </div> + + <div> + <label for="user">User name</label> + <input type="text" name="user" value="${session.value.user}" oninput=${updateSession} /> + </div> + + <div> + <label for="bot">Bot name</label> + <input type="text" name="char" value="${session.value.char}" oninput=${updateSession} /> + </div> + + <div> + <label for="template">Prompt template</label> + <textarea id="template" name="template" value="${session.value.template}" rows=4 oninput=${updateSession}/> + </div> + + <div> + <label for="template">Chat history template</label> + <textarea id="template" name="historyTemplate" value="${session.value.historyTemplate}" rows=1 oninput=${updateSession}/> + </div> + + <div> + <label for="temperature">Temperature</label> + <input type="range" id="temperature" min="0.0" max="1.0" step="0.01" name="temperature" value="${params.value.temperature}" oninput=${updateParamsFloat} /> + <span>${params.value.temperature}</span> + </div> + + <div> + <label for="nPredict">Predictions</label> + <input type="range" id="nPredict" min="1" max="2048" step="1" name="n_predict" value="${params.value.n_predict}" oninput=${updateParamsFloat} /> + <span>${params.value.n_predict}</span> + </div> + + <div> + <label for="repeat_penalty">Penalize repeat sequence</label> + <input type="range" id="repeat_penalty" min="0.0" max="2.0" step="0.01" name="repeat_penalty" value="${params.value.repeat_penalty}" oninput=${updateParamsFloat} /> + <span>${params.value.repeat_penalty}</span> + </div> + + <div> + <label for="repeat_last_n">Consider N tokens for penalize</label> + <input type="range" id="repeat_last_n" min="0.0" max="2048" name="repeat_last_n" value="${params.value.repeat_last_n}" oninput=${updateParamsFloat} /> + <span>${params.value.repeat_last_n}</span> + </div> + + </fieldset> + </form> + ` + } +const Markdown = (params) => { + const md = params.text + .replace(/^#{1,6} (.*)$/gim, '<h3>$1</h3>') + .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>') + .replace(/__(.*?)__/g, '<strong>$1</strong>') + .replace(/\*(.*?)\*/g, '<em>$1</em>') + .replace(/_(.*?)_/g, '<em>$1</em>') + .replace(/```.*?\n([\s\S]*?)```/g, '<pre><code>$1</code></pre>') + .replace(/`(.*?)`/g, '<code>$1</code>') + .replace(/\n/gim, '<br />'); + return html`<span dangerouslySetInnerHTML=${{ __html: md }} />`; +}; + + function App(props) { + + return html` + <div id="container"> + <header> + <h1>llama.cpp</h1> + </header> + + <main id="content"> + <${chatStarted.value ? ChatLog : ConfigForm} /> + </main> + + <footer id="write"> + <${MessageInput} /> + </footer> + + <footer> + <p>Powered by <a href="https://github.com/ggerganov/llama.cpp">llama.cpp</a> and <a href="https://ggml.ai">ggml.ai</a></p> + </footer> + </div> + `; + } + + render(h(App), document.body); + </script> +</head> + +<body> +</body> + +</html> diff --git a/examples/server/public/index.js b/examples/server/public/index.js new file mode 100644 index 0000000..4fa725a --- /dev/null +++ b/examples/server/public/index.js @@ -0,0 +1 @@ +function t(){throw new Error("Cycle detected")}function n(){if(o>1){o--;return}let t,n=!1;while(void 0!==_){let i=_;_=void 0;r++;while(void 0!==i){const _=i.o;i.o=void 0;i.f&=-3;if(!(8&i.f)&&c(i))try{i.c()}catch(e){if(!n){t=e;n=!0}}i=_}}r=0;o--;if(n)throw t}function e(t){if(o>0)return t();o++;try{return t()}finally{n()}}let i,_,o=0,r=0,u=0;function l(t){if(void 0===i)return;let n=t.n;if(void 0===n||n.t!==i){n={i:0,S:t,p:i.s,n:void 0,t:i,e:void 0,x:void 0,r:n};if(void 0!==i.s)i.s.n=n;i.s=n;t.n=n;if(32&i.f)t.S(n);return n}else if(-1===n.i){n.i=0;if(void 0!==n.n){n.n.p=n.p;if(void 0!==n.p)n.p.n=n.n;n.p=i.s;n.n=void 0;i.s.n=n;i.s=n}return n}}function f(t){this.v=t;this.i=0;this.n=void 0;this.t=void 0}f.prototype.h=function(){return!0};f.prototype.S=function(t){if(this.t!==t&&void 0===t.e){t.x=this.t;if(void 0!==this.t)this.t.e=t;this.t=t}};f.prototype.U=function(t){if(void 0!==this.t){const n=t.e,e=t.x;if(void 0!==n){n.x=e;t.e=void 0}if(void 0!==e){e.e=n;t.x=void 0}if(t===this.t)this.t=e}};f.prototype.subscribe=function(t){const n=this;return b((function(){const e=n.value,i=32&this.f;this.f&=-33;try{t(e)}finally{this.f|=i}}))};f.prototype.valueOf=function(){return this.value};f.prototype.toString=function(){return this.value+""};f.prototype.toJSON=function(){return this.value};f.prototype.peek=function(){return this.v};Object.defineProperty(f.prototype,"value",{get(){const t=l(this);if(void 0!==t)t.i=this.i;return this.v},set(e){if(i instanceof p)!function(){throw new Error("Computed cannot have side-effects")}();if(e!==this.v){if(r>100)t();this.v=e;this.i++;u++;o++;try{for(let t=this.t;void 0!==t;t=t.x)t.t.N()}finally{n()}}}});function s(t){return new f(t)}function c(t){for(let n=t.s;void 0!==n;n=n.n)if(n.S.i!==n.i||!n.S.h()||n.S.i!==n.i)return!0;return!1}function h(t){for(let n=t.s;void 0!==n;n=n.n){const e=n.S.n;if(void 0!==e)n.r=e;n.S.n=n;n.i=-1;if(void 0===n.n){t.s=n;break}}}function a(t){let n,e=t.s;while(void 0!==e){const t=e.p;if(-1===e.i){e.S.U(e);if(void 0!==t)t.n=e.n;if(void 0!==e.n)e.n.p=t}else n=e;e.S.n=e.r;if(void 0!==e.r)e.r=void 0;e=t}t.s=n}function p(t){f.call(this,void 0);this.x=t;this.s=void 0;this.g=u-1;this.f=4}(p.prototype=new f).h=function(){this.f&=-3;if(1&this.f)return!1;if(32==(36&this.f))return!0;this.f&=-5;if(this.g===u)return!0;this.g=u;this.f|=1;if(this.i>0&&!c(this)){this.f&=-2;return!0}const t=i;try{h(this);i=this;const t=this.x();if(16&this.f||this.v!==t||0===this.i){this.v=t;this.f&=-17;this.i++}}catch(t){this.v=t;this.f|=16;this.i++}i=t;a(this);this.f&=-2;return!0};p.prototype.S=function(t){if(void 0===this.t){this.f|=36;for(let t=this.s;void 0!==t;t=t.n)t.S.S(t)}f.prototype.S.call(this,t)};p.prototype.U=function(t){if(void 0!==this.t){f.prototype.U.call(this,t);if(void 0===this.t){this.f&=-33;for(let t=this.s;void 0!==t;t=t.n)t.S.U(t)}}};p.prototype.N=function(){if(!(2&this.f)){this.f|=6;for(let t=this.t;void 0!==t;t=t.x)t.t.N()}};p.prototype.peek=function(){if(!this.h())t();if(16&this.f)throw this.v;return this.v};Object.defineProperty(p.prototype,"value",{get(){if(1&this.f)t();const n=l(this);this.h();if(void 0!==n)n.i=this.i;if(16&this.f)throw this.v;return this.v}});function d(t){return new p(t)}function v(t){const e=t.u;t.u=void 0;if("function"==typeof e){o++;const _=i;i=void 0;try{e()}catch(n){t.f&=-2;t.f|=8;y(t);throw n}finally{i=_;n()}}}function y(t){for(let n=t.s;void 0!==n;n=n.n)n.S.U(n);t.x=void 0;t.s=void 0;v(t)}function m(t){if(i!==this)throw new Error("Out-of-order effect");a(this);i=t;this.f&=-2;if(8&this.f)y(this);n()}function g(t){this.x=t;this.u=void 0;this.s=void 0;this.o=void 0;this.f=32}g.prototype.c=function(){const t=this.S();try{if(8&this.f)return;if(void 0===this.x)return;const n=this.x();if("function"==typeof n)this.u=n}finally{t()}};g.prototype.S=function(){if(1&this.f)t();this.f|=1;this.f&=-9;v(this);h(this);o++;const n=i;i=this;return m.bind(this,n)};g.prototype.N=function(){if(!(2&this.f)){this.f|=2;this.o=_;_=this}};g.prototype.d=function(){this.f|=8;if(!(1&this.f))y(this)};function b(t){const n=new g(t);try{n.c()}catch(t){n.d();throw t}return n.d.bind(n)}var k,S,x,w,C,E,U,H,N,P={},D=[],$=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,T=Array.isArray;function V(t,n){for(var e in n)t[e]=n[e];return t}function A(t){var n=t.parentNode;n&&n.removeChild(t)}function F(t,n,e){var i,_,o,r={};for(o in n)"key"==o?i=n[o]:"ref"==o?_=n[o]:r[o]=n[o];if(arguments.length>2&&(r.children=arguments.length>3?k.call(arguments,2):e),"function"==typeof t&&null!=t.defaultProps)for(o in t.defaultProps)void 0===r[o]&&(r[o]=t.defaultProps[o]);return M(t,r,i,_,null)}function M(t,n,e,i,_){var o={type:t,props:n,key:e,ref:i,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:null==_?++x:_};return null==_&&null!=S.vnode&&S.vnode(o),o}function W(){return{current:null}}function O(t){return t.children}function L(t,n){this.props=t,this.context=n}function R(t,n){if(null==n)return t.__?R(t.__,t.__.__k.indexOf(t)+1):null;for(var e;n<t.__k.length;n++)if(null!=(e=t.__k[n])&&null!=e.__e)return e.__e;return"function"==typeof t.type?R(t):null}function I(t){var n,e;if(null!=(t=t.__)&&null!=t.__c){for(t.__e=t.__c.base=null,n=0;n<t.__k.length;n++)if(null!=(e=t.__k[n])&&null!=e.__e){t.__e=t.__c.base=e.__e;break}return I(t)}}function j(t){(!t.__d&&(t.__d=!0)&&C.push(t)&&!q.__r++||E!==S.debounceRendering)&&((E=S.debounceRendering)||U)(q)}function q(){var t,n,e,i,_,o,r,u;for(C.sort(H);t=C.shift();)t.__d&&(n=C.length,i=void 0,_=void 0,r=(o=(e=t).__v).__e,(u=e.__P)&&(i=[],(_=V({},o)).__v=o.__v+1,nt(u,o,_,e.__n,void 0!==u.ownerSVGElement,null!=o.__h?[r]:null,i,null==r?R(o):r,o.__h),et(i,o),o.__e!=r&&I(o)),C.length>n&&C.sort(H));q.__r=0}function B(t,n,e,i,_,o,r,u,l,f){var s,c,h,a,p,d,v,y=i&&i.__k||D,m=y.length;for(e.__k=[],s=0;s<n.length;s++)if(null!=(a=e.__k[s]=null==(a=n[s])||"boolean"==typeof a||"function"==typeof a?null:"string"==typeof a||"number"==typeof a||"bigint"==typeof a?M(null,a,null,null,a):T(a)?M(O,{children:a},null,null,null):a.__b>0?M(a.type,a.props,a.key,a.ref?a.ref:null,a.__v):a)){if(a.__=e,a.__b=e.__b+1,null===(h=y[s])||h&&a.key==h.key&&a.type===h.type)y[s]=void 0;else for(c=0;c<m;c++){if((h=y[c])&&a.key==h.key&&a.type===h.type){y[c]=void 0;break}h=null}nt(t,a,h=h||P,_,o,r,u,l,f),p=a.__e,(c=a.ref)&&h.ref!=c&&(v||(v=[]),h.ref&&v.push(h.ref,null,a),v.push(c,a.__c||p,a)),null!=p?(null==d&&(d=p),"function"==typeof a.type&&a.__k===h.__k?a.__d=l=G(a,l,t):l=J(t,a,h,y,p,l),"function"==typeof e.type&&(e.__d=l)):l&&h.__e==l&&l.parentNode!=t&&(l=R(h))}for(e.__e=d,s=m;s--;)null!=y[s]&&("function"==typeof e.type&&null!=y[s].__e&&y[s].__e==e.__d&&(e.__d=K(i).nextSibling),ot(y[s],y[s]));if(v)for(s=0;s<v.length;s++)_t(v[s],v[++s],v[++s])}function G(t,n,e){for(var i,_=t.__k,o=0;_&&o<_.length;o++)(i=_[o])&&(i.__=t,n="function"==typeof i.type?G(i,n,e):J(e,i,i,_,i.__e,n));return n}function z(t,n){return n=n||[],null==t||"boolean"==typeof t||(T(t)?t.some((function(t){z(t,n)})):n.push(t)),n}function J(t,n,e,i,_,o){var r,u,l;if(void 0!==n.__d)r=n.__d,n.__d=void 0;else if(null==e||_!=o||null==_.parentNode)t:if(null==o||o.parentNode!==t)t.appendChild(_),r=null;else{for(u=o,l=0;(u=u.nextSibling)&&l<i.length;l+=1)if(u==_)break t;t.insertBefore(_,o),r=o}return void 0!==r?r:_.nextSibling}function K(t){var n,e,i;if(null==t.type||"string"==typeof t.type)return t.__e;if(t.__k)for(n=t.__k.length-1;n>=0;n--)if((e=t.__k[n])&&(i=K(e)))return i;return null}function Q(t,n,e,i,_){var o;for(o in e)"children"===o||"key"===o||o in n||Y(t,o,null,e[o],i);for(o in n)_&&"function"!=typeof n[o]||"children"===o||"key"===o||"value"===o||"checked"===o||e[o]===n[o]||Y(t,o,n[o],e[o],i)}function X(t,n,e){"-"===n[0]?t.setProperty(n,null==e?"":e):t[n]=null==e?"":"number"!=typeof e||$.test(n)?e:e+"px"}function Y(t,n,e,i,_){var o;t:if("style"===n)if("string"==typeof e)t.style.cssText=e;else{if("string"==typeof i&&(t.style.cssText=i=""),i)for(n in i)e&&n in e||X(t.style,n,"");if(e)for(n in e)i&&e[n]===i[n]||X(t.style,n,e[n])}else if("o"===n[0]&&"n"===n[1])o=n!==(n=n.replace(/Capture$/,"")),n=n.toLowerCase()in t?n.toLowerCase().slice(2):n.slice(2),t.l||(t.l={}),t.l[n+o]=e,e?i||t.addEventListener(n,o?tt:Z,o):t.removeEventListener(n,o?tt:Z,o);else if("dangerouslySetInnerHTML"!==n){if(_)n=n.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if("width"!==n&&"height"!==n&&"href"!==n&&"list"!==n&&"form"!==n&&"tabIndex"!==n&&"download"!==n&&"rowSpan"!==n&&"colSpan"!==n&&n in t)try{t[n]=null==e?"":e;break t}catch(t){}"function"==typeof e||(null==e||!1===e&&"-"!==n[4]?t.removeAttribute(n):t.setAttribute(n,e))}}function Z(t){return this.l[t.type+!1](S.event?S.event(t):t)}function tt(t){return this.l[t.type+!0](S.event?S.event(t):t)}function nt(t,n,e,i,_,o,r,u,l){var f,s,c,h,a,p,d,v,y,m,g,b,k,x,w,C=n.type;if(void 0!==n.constructor)return null;null!=e.__h&&(l=e.__h,u=n.__e=e.__e,n.__h=null,o=[u]),(f=S.__b)&&f(n);try{t:if("function"==typeof C){if(v=n.props,y=(f=C.contextType)&&i[f.__c],m=f?y?y.props.value:f.__:i,e.__c?d=(s=n.__c=e.__c).__=s.__E:("prototype"in C&&C.prototype.render?n.__c=s=new C(v,m):(n.__c=s=new L(v,m),s.constructor=C,s.render=rt),y&&y.sub(s),s.props=v,s.state||(s.state={}),s.context=m,s.__n=i,c=s.__d=!0,s.__h=[],s._sb=[]),null==s.__s&&(s.__s=s.state),null!=C.getDerivedStateFromProps&&(s.__s==s.state&&(s.__s=V({},s.__s)),V(s.__s,C.getDerivedStateFromProps(v,s.__s))),h=s.props,a=s.state,s.__v=n,c)null==C.getDerivedStateFromProps&&null!=s.componentWillMount&&s.componentWillMount(),null!=s.componentDidMount&&s.__h.push(s.componentDidMount);else{if(null==C.getDerivedStateFromProps&&v!==h&&null!=s.componentWillReceiveProps&&s.componentWillReceiveProps(v,m),!s.__e&&null!=s.shouldComponentUpdate&&!1===s.shouldComponentUpdate(v,s.__s,m)||n.__v===e.__v){for(n.__v!==e.__v&&(s.props=v,s.state=s.__s,s.__d=!1),s.__e=!1,n.__e=e.__e,n.__k=e.__k,n.__k.forEach((function(t){t&&(t.__=n)})),g=0;g<s._sb.length;g++)s.__h.push(s._sb[g]);s._sb=[],s.__h.length&&r.push(s);break t}null!=s.componentWillUpdate&&s.componentWillUpdate(v,s.__s,m),null!=s.componentDidUpdate&&s.__h.push((function(){s.componentDidUpdate(h,a,p)}))}if(s.context=m,s.props=v,s.__P=t,b=S.__r,k=0,"prototype"in C&&C.prototype.render){for(s.state=s.__s,s.__d=!1,b&&b(n),f=s.render(s.props,s.state,s.context),x=0;x<s._sb.length;x++)s.__h.push(s._sb[x]);s._sb=[]}else do{s.__d=!1,b&&b(n),f=s.render(s.props,s.state,s.context),s.state=s.__s}while(s.__d&&++k<25);s.state=s.__s,null!=s.getChildContext&&(i=V(V({},i),s.getChildContext())),c||null==s.getSnapshotBeforeUpdate||(p=s.getSnapshotBeforeUpdate(h,a)),B(t,T(w=null!=f&&f.type===O&&null==f.key?f.props.children:f)?w:[w],n,e,i,_,o,r,u,l),s.base=n.__e,n.__h=null,s.__h.length&&r.push(s),d&&(s.__E=s.__=null),s.__e=!1}else null==o&&n.__v===e.__v?(n.__k=e.__k,n.__e=e.__e):n.__e=it(e.__e,n,e,i,_,o,r,l);(f=S.diffed)&&f(n)}catch(t){n.__v=null,(l||null!=o)&&(n.__e=u,n.__h=!!l,o[o.indexOf(u)]=null),S.__e(t,n,e)}}function et(t,n){S.__c&&S.__c(n,t),t.some((function(n){try{t=n.__h,n.__h=[],t.some((function(t){t.call(n)}))}catch(t){S.__e(t,n.__v)}}))}function it(t,n,e,i,_,o,r,u){var l,f,s,c=e.props,h=n.props,a=n.type,p=0;if("svg"===a&&(_=!0),null!=o)for(;p<o.length;p++)if((l=o[p])&&"setAttribute"in l==!!a&&(a?l.localName===a:3===l.nodeType)){t=l,o[p]=null;break}if(null==t){if(null===a)return document.createTextNode(h);t=_?document.createElementNS("http://www.w3.org/2000/svg",a):document.createElement(a,h.is&&h),o=null,u=!1}if(null===a)c===h||u&&t.data===h||(t.data=h);else{if(o=o&&k.call(t.childNodes),f=(c=e.props||P).dangerouslySetInnerHTML,s=h.dangerouslySetInnerHTML,!u){if(null!=o)for(c={},p=0;p<t.attributes.length;p++)c[t.attributes[p].name]=t.attributes[p].value;(s||f)&&(s&&(f&&s.__html==f.__html||s.__html===t.innerHTML)||(t.innerHTML=s&&s.__html||""))}if(Q(t,h,c,_,u),s)n.__k=[];else if(B(t,T(p=n.props.children)?p:[p],n,e,i,_&&"foreignObject"!==a,o,r,o?o[0]:e.__k&&R(e,0),u),null!=o)for(p=o.length;p--;)null!=o[p]&&A(o[p]);u||("value"in h&&void 0!==(p=h.value)&&(p!==t.value||"progress"===a&&!p||"option"===a&&p!==c.value)&&Y(t,"value",p,c.value,!1),"checked"in h&&void 0!==(p=h.checked)&&p!==t.checked&&Y(t,"checked",p,c.checked,!1))}return t}function _t(t,n,e){try{"function"==typeof t?t(n):t.current=n}catch(t){S.__e(t,e)}}function ot(t,n,e){var i,_;if(S.unmount&&S.unmount(t),(i=t.ref)&&(i.current&&i.current!==t.__e||_t(i,null,n)),null!=(i=t.__c)){if(i.componentWillUnmount)try{i.componentWillUnmount()}catch(t){S.__e(t,n)}i.base=i.__P=null,t.__c=void 0}if(i=t.__k)for(_=0;_<i.length;_++)i[_]&&ot(i[_],n,e||"function"!=typeof t.type);e||null==t.__e||A(t.__e),t.__=t.__e=t.__d=void 0}function rt(t,n,e){return this.constructor(t,e)}function ut(t,n,e){var i,_,o;S.__&&S.__(t,n),_=(i="function"==typeof e)?null:e&&e.__k||n.__k,o=[],nt(n,t=(!i&&e||n).__k=F(O,null,[t]),_||P,P,void 0!==n.ownerSVGElement,!i&&e?[e]:_?null:n.firstChild?k.call(n.childNodes):null,o,!i&&e?e:_?_.__e:n.firstChild,i),et(o,t)}function lt(t,n){ut(t,n,lt)}function ft(t,n,e){var i,_,o,r,u=V({},t.props);for(o in t.type&&t.type.defaultProps&&(r=t.type.defaultProps),n)"key"==o?i=n[o]:"ref"==o?_=n[o]:u[o]=void 0===n[o]&&void 0!==r?r[o]:n[o];return arguments.length>2&&(u.children=arguments.length>3?k.call(arguments,2):e),M(t.type,u,i||t.key,_||t.ref,null)}function st(t,n){var e={__c:n="__cC"+N++,__:t,Consumer:function(t,n){return t.children(n)},Provider:function(t){var e,i;return this.getChildContext||(e=[],(i={})[n]=this,this.getChildContext=function(){return i},this.shouldComponentUpdate=function(t){this.props.value!==t.value&&e.some((function(t){t.__e=!0,j(t)}))},this.sub=function(t){e.push(t);var n=t.componentWillUnmount;t.componentWillUnmount=function(){e.splice(e.indexOf(t),1),n&&n.call(t)}}),t.children}};return e.Provider.__=e.Consumer.contextType=e}k=D.slice,S={__e:function(t,n,e,i){for(var _,o,r;n=n.__;)if((_=n.__c)&&!_.__)try{if((o=_.constructor)&&null!=o.getDerivedStateFromError&&(_.setState(o.getDerivedStateFromError(t)),r=_.__d),null!=_.componentDidCatch&&(_.componentDidCatch(t,i||{}),r=_.__d),r)return _.__E=_}catch(n){t=n}throw t}},x=0,w=function(t){return null!=t&&void 0===t.constructor},L.prototype.setState=function(t,n){var e;e=null!=this.__s&&this.__s!==this.state?this.__s:this.__s=V({},this.state),"function"==typeof t&&(t=t(V({},e),this.props)),t&&V(e,t),null!=t&&this.__v&&(n&&this._sb.push(n),j(this))},L.prototype.forceUpdate=function(t){this.__v&&(this.__e=!0,t&&this.__h.push(t),j(this))},L.prototype.render=O,C=[],U="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,H=function(t,n){return t.__v.__b-n.__v.__b},q.__r=0,N=0;var ct,ht,at,pt,dt=0,vt=[],yt=[],mt=S.__b,gt=S.__r,bt=S.diffed,kt=S.__c,St=S.unmount;function xt(t,n){S.__h&&S.__h(ht,t,dt||n),dt=0;var e=ht.__H||(ht.__H={__:[],__h:[]});return t>=e.__.length&&e.__.push({__V:yt}),e.__[t]}function wt(t){return dt=1,Ct(It,t)}function Ct(t,n,e){var i=xt(ct++,2);if(i.t=t,!i.__c&&(i.__=[e?e(n):It(void 0,n),function(t){var n=i.__N?i.__N[0]:i.__[0],e=i.t(n,t);n!==e&&(i.__N=[e,i.__[1]],i.__c.setState({}))}],i.__c=ht,!ht.u)){var _=function(t,n,e){if(!i.__c.__H)return!0;var _=i.__c.__H.__.filter((function(t){return t.__c}));if(_.every((function(t){return!t.__N})))return!o||o.call(this,t,n,e);var r=!1;return _.forEach((function(t){if(t.__N){var n=t.__[0];t.__=t.__N,t.__N=void 0,n!==t.__[0]&&(r=!0)}})),!(!r&&i.__c.props===t)&&(!o||o.call(this,t,n,e))};ht.u=!0;var o=ht.shouldComponentUpdate,r=ht.componentWillUpdate;ht.componentWillUpdate=function(t,n,e){if(this.__e){var i=o;o=void 0,_(t,n,e),o=i}r&&r.call(this,t,n,e)},ht.shouldComponentUpdate=_}return i.__N||i.__}function Et(t,n){var e=xt(ct++,3);!S.__s&&Rt(e.__H,n)&&(e.__=t,e.i=n,ht.__H.__h.push(e))}function Ut(t,n){var e=xt(ct++,4);!S.__s&&Rt(e.__H,n)&&(e.__=t,e.i=n,ht.__h.push(e))}function Ht(t){return dt=5,Pt((function(){return{current:t}}),[])}function Nt(t,n,e){dt=6,Ut((function(){return"function"==typeof t?(t(n()),function(){return t(null)}):t?(t.current=n(),function(){return t.current=null}):void 0}),null==e?e:e.concat(t))}function Pt(t,n){var e=xt(ct++,7);return Rt(e.__H,n)?(e.__V=t(),e.i=n,e.__h=t,e.__V):e.__}function Dt(t,n){return dt=8,Pt((function(){return t}),n)}function $t(t){var n=ht.context[t.__c],e=xt(ct++,9);return e.c=t,n?(null==e.__&&(e.__=!0,n.sub(ht)),n.props.value):t.__}function Tt(t,n){S.useDebugValue&&S.useDebugValue(n?n(t):t)}function Vt(t){var n=xt(ct++,10),e=wt();return n.__=t,ht.componentDidCatch||(ht.componentDidCatch=function(t,i){n.__&&n.__(t,i),e[1](t)}),[e[0],function(){e[1](void 0)}]}function At(){var t=xt(ct++,11);if(!t.__){for(var n=ht.__v;null!==n&&!n.__m&&null!==n.__;)n=n.__;var e=n.__m||(n.__m=[0,0]);t.__="P"+e[0]+"-"+e[1]++}return t.__}function Ft(){for(var t;t=vt.shift();)if(t.__P&&t.__H)try{t.__H.__h.forEach(Ot),t.__H.__h.forEach(Lt),t.__H.__h=[]}catch(u){t.__H.__h=[],S.__e(u,t.__v)}}S.__b=function(t){ht=null,mt&&mt(t)},S.__r=function(t){gt&>(t),ct=0;var n=(ht=t.__c).__H;n&&(at===ht?(n.__h=[],ht.__h=[],n.__.forEach((function(t){t.__N&&(t.__=t.__N),t.__V=yt,t.__N=t.i=void 0}))):(n.__h.forEach(Ot),n.__h.forEach(Lt),n.__h=[],ct=0)),at=ht},S.diffed=function(t){bt&&bt(t);var n=t.__c;n&&n.__H&&(n.__H.__h.length&&(1!==vt.push(n)&&pt===S.requestAnimationFrame||((pt=S.requestAnimationFrame)||Wt)(Ft)),n.__H.__.forEach((function(t){t.i&&(t.__H=t.i),t.__V!==yt&&(t.__=t.__V),t.i=void 0,t.__V=yt}))),at=ht=null},S.__c=function(t,n){n.some((function(t){try{t.__h.forEach(Ot),t.__h=t.__h.filter((function(t){return!t.__||Lt(t)}))}catch(s){n.some((function(t){t.__h&&(t.__h=[])})),n=[],S.__e(s,t.__v)}})),kt&&kt(t,n)},S.unmount=function(t){St&&St(t);var n,e=t.__c;e&&e.__H&&(e.__H.__.forEach((function(t){try{Ot(t)}catch(t){n=t}})),e.__H=void 0,n&&S.__e(n,e.__v))};var Mt="function"==typeof requestAnimationFrame;function Wt(t){var n,e=function(){clearTimeout(i),Mt&&cancelAnimationFrame(n),setTimeout(t)},i=setTimeout(e,100);Mt&&(n=requestAnimationFrame(e))}function Ot(t){var n=ht,e=t.__c;"function"==typeof e&&(t.__c=void 0,e()),ht=n}function Lt(t){var n=ht;t.__c=t.__(),ht=n}function Rt(t,n){return!t||t.length!==n.length||n.some((function(n,e){return n!==t[e]}))}function It(t,n){return"function"==typeof n?n(t):n}function jt(t,n){S[t]=n.bind(null,S[t]||(()=>{}))}let qt,Bt;function Gt(t){if(Bt)Bt();Bt=t&&t.S()}function zt({data:t}){const n=Kt(t);n.value=t;const e=Pt(()=>{let t=this.__v;while(t=t.__)if(t.__c){t.__c.__$f|=4;break}this.__$u.c=()=>{this.base.data=e.peek()};return d(()=>{let t=n.value.value;return 0===t?0:!0===t?"":t||""})},[]);return e.value}zt.displayName="_st";Object.defineProperties(f.prototype,{constructor:{configurable:!0,value:void 0},type:{configurable:!0,value:zt},props:{configurable:!0,get(){return{data:this}}},__b:{configurable:!0,value:1}});jt("__b",(t,n)=>{if("string"==typeof n.type){let t,e=n.props;for(let i in e){if("children"===i)continue;let _=e[i];if(_ instanceof f){if(!t)n.__np=t={};t[i]=_;e[i]=_.peek()}}}t(n)});jt("__r",(t,n)=>{Gt();let e,i=n.__c;if(i){i.__$f&=-2;e=i.__$u;if(void 0===e)i.__$u=e=function(t){let n;b((function(){n=this}));n.c=()=>{i.__$f|=1;i.setState({})};return n}()}qt=i;Gt(e);t(n)});jt("__e",(t,n,e,i)=>{Gt();qt=void 0;t(n,e,i)});jt("diffed",(t,n)=>{Gt();qt=void 0;let e;if("string"==typeof n.type&&(e=n.__e)){let t=n.__np,i=n.props;if(t){let n=e.U;if(n)for(let e in n){let i=n[e];if(void 0!==i&&!(e in t)){i.d();n[e]=void 0}}else{n={};e.U=n}for(let _ in t){let o=n[_],r=t[_];if(void 0===o){o=Jt(e,_,r,i);n[_]=o}else o.o(r,i)}}}t(n)});function Jt(t,n,e,i){const _=n in t&&void 0===t.ownerSVGElement,o=s(e);return{o:(t,n)=>{o.value=t;i=n},d:b(()=>{const e=o.value.value;if(i[n]!==e){i[n]=e;if(_)t[n]=e;else if(e)t.setAttribute(n,e);else t.removeAttribute(n)}})}}jt("unmount",(t,n)=>{if("string"==typeof n.type){let t=n.__e;if(t){const n=t.U;if(n){t.U=void 0;for(let t in n){let e=n[t];if(e)e.d()}}}}else{let t=n.__c;if(t){const n=t.__$u;if(n){t.__$u=void 0;n.d()}}}t(n)});jt("__h",(t,n,e,i)=>{if(i<3)n.__$f|=2;t(n,e,i)});L.prototype.shouldComponentUpdate=function(t,n){const e=this.__$u;if(!(e&&void 0!==e.s||4&this.__$f))return!0;if(3&this.__$f)return!0;for(let i in n)return!0;for(let i in t)if("__source"!==i&&t[i]!==this.props[i])return!0;for(let i in this.props)if(!(i in t))return!0;return!1};function Kt(t){return Pt(()=>s(t),[])}function Qt(t){const n=Ht(t);n.current=t;qt.__$f|=4;return Pt(()=>d(()=>n.current()),[])}function Xt(t){const n=Ht(t);n.current=t;Et(()=>b(()=>n.current()),[])}var Yt=function(t,n,e,i){var _;n[0]=0;for(var o=1;o<n.length;o++){var r=n[o++],u=n[o]?(n[0]|=r?1:2,e[n[o++]]):n[++o];3===r?i[0]=u:4===r?i[1]=Object.assign(i[1]||{},u):5===r?(i[1]=i[1]||{})[n[++o]]=u:6===r?i[1][n[++o]]+=u+"":r?(_=t.apply(u,Yt(t,u,e,["",null])),i.push(_),u[0]?n[0]|=2:(n[o-2]=0,n[o]=_)):i.push(u)}return i},Zt=new Map;function tn(t){var n=Zt.get(this);return n||(n=new Map,Zt.set(this,n)),(n=Yt(this,n.get(t)||(n.set(t,n=function(t){for(var n,e,i=1,_="",o="",r=[0],u=function(t){1===i&&(t||(_=_.replace(/^\s*\n\s*|\s*\n\s*$/g,"")))?r.push(0,t,_):3===i&&(t||_)?(r.push(3,t,_),i=2):2===i&&"..."===_&&t?r.push(4,t,0):2===i&&_&&!t?r.push(5,0,!0,_):i>=5&&((_||!t&&5===i)&&(r.push(i,0,_,e),i=6),t&&(r.push(i,t,0,e),i=6)),_=""},l=0;l<t.length;l++){l&&(1===i&&u(),u(l));for(var f=0;f<t[l].length;f++)n=t[l][f],1===i?"<"===n?(u(),r=[r],i=3):_+=n:4===i?"--"===_&&">"===n?(i=1,_=""):_=n+_[0]:o?n===o?o="":_+=n:'"'===n||"'"===n?o=n:">"===n?(u(),i=1):i&&("="===n?(i=5,e=_,_=""):"/"===n&&(i<5||">"===t[l][f+1])?(u(),3===i&&(r=r[0]),i=r,(r=r[0]).push(2,0,i),i=0):" "===n||"\t"===n||"\n"===n||"\r"===n?(u(),i=2):_+=n),3===i&&"!--"===_&&(i=4,r=r[0])}return u(),r}(t)),n),arguments,[])).length>1?n:n[0]}var nn=tn.bind(F);export{L as Component,O as Fragment,f as Signal,e as batch,ft as cloneElement,d as computed,st as createContext,F as createElement,W as createRef,b as effect,F as h,nn as html,lt as hydrate,w as isValidElement,S as options,ut as render,s as signal,z as toChildArray,Dt as useCallback,Qt as useComputed,$t as useContext,Tt as useDebugValue,Et as useEffect,Vt as useErrorBoundary,At as useId,Nt as useImperativeHandle,Ut as useLayoutEffect,Pt as useMemo,Ct as useReducer,Ht as useRef,Kt as useSignal,Xt as useSignalEffect,wt as useState}; |