arcane-os 0.2.3 → 0.3.0

package/runtime/arcane/components/voice-transcription.html

@@ -60,7 +60,29 @@
 </section>
 
 <script type="module">
+    const {
+        createArcaneEventSource,
+        projectArcaneDOMEvent
+    }=await import('arcane-os/event-manager');
+
     const host=this;
+    const events=createArcaneEventSource(
+        host,
+        {
+            source:'arcane.component.voice-transcription',
+            eventTypes:[
+                'voice-transcription-ready',
+                'voice-transcription-state',
+                'voice-transcription-segment',
+                'voice-transcription-change',
+                'voice-transcription-complete',
+                'speech-transcription-complete',
+                'speech-transcription-cancelled',
+                'speech-stt-activation-request',
+                'speech-stt-activation-error'
+            ]
+        }
+    );
     const componentURL=new URL(
         host.getAttribute('href')||'./arcane/components/voice-transcription.html',
         document.baseURI
@@ -94,9 +116,72 @@
     let transcript='';
     let sessionGeneration=0;
     let transcriptionAbortController=null;
+    let eventOperationSequence=0;
+    let voiceOperationId=null;
     let destroyed=false;
     let options=normalizeVoiceOptions(optionsFromDataset());
 
+    function nextVoiceOperationId(kind){
+        eventOperationSequence+=1;
+        return `${events.descriptor.instanceId}:${kind}:${eventOperationSequence}`;
+    }
+
+    function currentVoiceOperationId(kind='transcription'){
+        voiceOperationId=voiceOperationId||nextVoiceOperationId(kind);
+        return voiceOperationId;
+    }
+
+    function canonicalSTTCancellationReason(reason){
+        if(reason==='runtime-unready'){
+            return 'stt-role-unready';
+        }
+        if(reason==='stt-provider-request-cancelled'){
+            return 'stt-provider-transcription-cancelled';
+        }
+        return String(reason||'stt-transcription-cancelled');
+    }
+
+    function dispatchVoiceEvent(
+        type,
+        compatibilityDetail={},
+        {
+            publicDetail={},
+            operationId=null,
+            beginOperation=null,
+            bubbles=false,
+            composed=false,
+            cancelable=false
+        }={}
+    ){
+        if(destroyed&&type!=='speech-transcription-cancelled'){
+            return false;
+        }
+        if(beginOperation!==null){
+            voiceOperationId=nextVoiceOperationId(beginOperation);
+        }
+        const publication=events.dispatch(
+            type,
+            compatibilityDetail,
+            {
+                publicDetail,
+                operationId:operationId||currentVoiceOperationId(),
+                cancelable
+            }
+        );
+        if(!publication.accepted){
+            return false;
+        }
+        return projectArcaneDOMEvent(
+            host,
+            publication.occurrence,
+            {
+                bubbles,
+                composed,
+                cancelable
+            }
+        );
+    }
+
     host.clear=clear;
     host.completeTranscription=completeStream;
     host.configure=configure;
@@ -118,16 +203,24 @@
         }
     );
 
-    startButton.addEventListener('click',startRecording);
-    stopButton.addEventListener('click',stopRecording);
-    completeButton.addEventListener('click',completeStream);
-    window.addEventListener('pagehide',destroy,{once:true});
+    const lifecycleListenerOptions=Object.freeze(
+        {signal:runtimeStateAbortController.signal}
+    );
+    startButton.addEventListener('click',startRecording,lifecycleListenerOptions);
+    stopButton.addEventListener('click',stopRecording,lifecycleListenerOptions);
+    completeButton.addEventListener('click',completeStream,lifecycleListenerOptions);
+    window.addEventListener(
+        'pagehide',
+        destroy,
+        {once:true,signal:runtimeStateAbortController.signal}
+    );
 
     const sttActivationController=createSTTActivationController(
         {
             host,
             button:sttActivationButton,
-            onChange:renderState
+            onChange:renderState,
+            eventSource:events
         }
     );
 
@@ -178,8 +271,20 @@
     }
 
     function configure(input={}){
+        if(destroyed){
+            return getOptions();
+        }
         const setInitial=Object.prototype.hasOwnProperty.call(input||{},'initialValue');
-        options=normalizeVoiceOptions(input,options);
+        const nextOptions=normalizeVoiceOptions(input,options);
+        if(!setInitial){
+            if(supersedeForConfigurationReplacement()){
+                reportSTTCancellation(
+                    'configuration-replaced',
+                    'Transcription configuration replaced.'
+                );
+            }
+        }
+        options=nextOptions;
         renderOptions();
         if(setInitial){
             setValue(options.initialValue);
@@ -203,7 +308,9 @@
 
         const generation=++sessionGeneration;
         chunks=[];
-        setState('starting',options.messages.requesting);
+        setState('starting',options.messages.requesting,{
+            beginOperation:'transcription'
+        });
         if(!recordingStartIsCurrent(generation,'starting')){
             return rejectRecordingStart(generation);
         }
@@ -293,7 +400,7 @@
     }
 
     function stopRecording(){
-        if(state!=='recording'||recorder?.state!=='recording'){
+        if(destroyed||state!=='recording'||recorder?.state!=='recording'){
             return false;
         }
         const generation=sessionGeneration;
@@ -321,6 +428,15 @@
             setState('error',options.messages.emptyAudio);
             return false;
         }
+        if(sttRole.state!=='ready'||sttRole.busy){
+            reportSTTCancellation(
+                sttRole.busy?'stt-role-busy':'runtime-unready',
+                sttRole.busy
+                    ?'Transcription stopped because the selected service is busy.'
+                    :'Transcription stopped because the selected service became unavailable.'
+            );
+            return false;
+        }
 
         try{
             controller=new AbortController();
@@ -345,6 +461,7 @@
             if(controller.signal.aborted
                 ||generation!==sessionGeneration
                 ||sttRole.state!=='ready'
+                ||sttRole.busy
                 ||destroyed){
                 return false;
             }
@@ -393,7 +510,8 @@
                 detail,
                 options.persist
                     ?options.messages.saved
-                    :options.messages.transcribed
+                    :options.messages.transcribed,
+                currentVoiceOperationId()
             );
         }catch(error){
             if(generation!==sessionGeneration||destroyed){
@@ -419,25 +537,40 @@
         generation,
         expectedState,
         detail,
-        message
+        message,
+        operationId=null
     ){
         if(!isCurrentVoiceOperation(generation,expectedState)){
             return false;
         }
-        host.dispatchEvent(
-            new CustomEvent(
-                'speech-transcription-complete',
-                {bubbles:true,composed:true,detail}
-            )
+        dispatchVoiceEvent(
+            'speech-transcription-complete',
+            detail,
+            {
+                bubbles:true,
+                composed:true,
+                operationId,
+                publicDetail:{
+                    segmentCharacterCount:detail.text.length,
+                    transcriptCharacterCount:detail.transcript.length
+                }
+            }
         );
         if(!isCurrentVoiceOperation(generation,expectedState)){
             return false;
         }
-        host.dispatchEvent(
-            new CustomEvent(
-                'voice-transcription-segment',
-                {bubbles:true,composed:true,detail}
-            )
+        dispatchVoiceEvent(
+            'voice-transcription-segment',
+            detail,
+            {
+                bubbles:true,
+                composed:true,
+                operationId,
+                publicDetail:{
+                    segmentCharacterCount:detail.text.length,
+                    transcriptCharacterCount:detail.transcript.length
+                }
+            }
         );
         if(!isCurrentVoiceOperation(generation,expectedState)){
             return false;
@@ -459,10 +592,12 @@
             return options.transcribe(file,context);
         }
         if(typeof globalThis.ai?.fetchSTT!=='function'){
-            await import(moduleURL('AI.js?v=7'));
+            await import(moduleURL('AI.js'));
         }
         if(typeof globalThis.ai?.fetchSTT!=='function'){
-            throw new Error('Speech transcription is not configured.');
+            const error=new Error('Speech transcription is not configured.');
+            error.code='ARCANE_VOICE_TRANSCRIPTION_STT_RUNTIME_METHOD_UNAVAILABLE';
+            throw error;
         }
         return globalThis.ai.fetchSTT(file,undefined,signal);
     }
@@ -510,7 +645,9 @@
         const complete=options.onComplete||(
             typeof host.complete==='function'?host.complete.bind(host):null
         );
-        setState('completing',options.messages.completing);
+        setState('completing',options.messages.completing,{
+            beginOperation:'completion'
+        });
         if(!isCurrentVoiceOperation(generation,'completing')){
             return false;
         }
@@ -521,15 +658,16 @@
             if(!isCurrentVoiceOperation(generation,'completing')){
                 return false;
             }
-            host.dispatchEvent(
-                new CustomEvent(
-                    'voice-transcription-complete',
-                    {
-                        bubbles:true,
-                        composed:true,
-                        detail:{transcript:completionTranscript}
+            dispatchVoiceEvent(
+                'voice-transcription-complete',
+                {transcript:completionTranscript},
+                {
+                    bubbles:true,
+                    composed:true,
+                    publicDetail:{
+                        transcriptCharacterCount:completionTranscript.length
                     }
-                )
+                }
             );
             if(!isCurrentVoiceOperation(generation,'completing')){
                 return false;
@@ -563,7 +701,28 @@
         return true;
     }
 
+    function supersedeForConfigurationReplacement(){
+        const hadActiveOperation=[
+            'starting',
+            'recording',
+            'transcribing',
+            'saving',
+            'completing'
+        ].includes(state)||Boolean(transcriptionAbortController);
+        if(!hadActiveOperation){
+            return false;
+        }
+        sessionGeneration+=1;
+        transcriptionAbortController?.abort();
+        transcriptionAbortController=null;
+        releaseMicrophone();
+        return true;
+    }
+
     function setValue(value=''){
+        if(destroyed){
+            return transcript;
+        }
         const operationSuperseded=
             supersedeForTranscriptReplacement();
         transcript=`${value??''}`;
@@ -576,24 +735,23 @@
         }else if(state!=='recording'){
             setState('idle',options.messages.ready);
         }
-        if(destroyed){
-            return transcript;
-        }
-        host.dispatchEvent(
-            new CustomEvent(
-                'voice-transcription-change',
-                {
-                    bubbles:true,
-                    composed:true,
-                    detail:{transcript}
+        dispatchVoiceEvent(
+            'voice-transcription-change',
+            {transcript},
+            {
+                beginOperation:'transcript-change',
+                bubbles:true,
+                composed:true,
+                publicDetail:{
+                    transcriptCharacterCount:transcript.length
                 }
-            )
+            }
         );
         return transcript;
     }
 
     function clear(){
-        if(!['complete','error','idle'].includes(state)){
+        if(destroyed||!['complete','error','idle'].includes(state)){
             return false;
         }
         transcript='';
@@ -646,10 +804,17 @@
         }
     }
 
-    function setState(nextState,message=''){
+    function setState(nextState,message='',{beginOperation=null}={}){
+        if(destroyed){
+            return false;
+        }
+        if(beginOperation!==null){
+            voiceOperationId=nextVoiceOperationId(beginOperation);
+        }
         state=nextState;
         stateMessage=message||nextState;
         renderState();
+        return true;
     }
 
     function synchronizeAIRuntimeState(snapshot){
@@ -683,18 +848,18 @@
         return true;
     }
 
-    function reportSTTCancellation(reason,message){
+    function reportSTTCancellation(reason,message,operationId=null){
         state='idle';
         stateMessage=message;
-        host.dispatchEvent(
-            new CustomEvent(
-                'speech-transcription-cancelled',
-                {
-                    bubbles:true,
-                    composed:true,
-                    detail:Object.freeze({reason})
-                }
-            )
+        dispatchVoiceEvent(
+            'speech-transcription-cancelled',
+            Object.freeze({reason}),
+            {
+                bubbles:true,
+                composed:true,
+                operationId:operationId||currentVoiceOperationId(),
+                publicDetail:{reason:canonicalSTTCancellationReason(reason)}
+            }
         );
         if(!destroyed){
             renderState();
@@ -738,21 +903,23 @@
                 ||['loading','unloading'].includes(sttRole.state)
             )
         );
-        host.dispatchEvent(
-            new CustomEvent(
-                'voice-transcription-state',
+        dispatchVoiceEvent(
+            'voice-transcription-state',
+            Object.freeze(
                 {
-                    bubbles:true,
-                    composed:true,
-                    detail:Object.freeze(
-                        {
-                            message:status.innerText,
-                            state,
-                            stt:sttRole
-                        }
-                    )
+                    message:status.innerText,
+                    state,
+                    stt:sttRole
                 }
-            )
+            ),
+            {
+                bubbles:true,
+                composed:true,
+                publicDetail:{
+                    state,
+                    sttState:sttRole.state
+                }
+            }
         );
     }
 
@@ -820,6 +987,7 @@
         stateMessage='Transcription unavailable.';
         host.ready=false;
         renderState();
+        events.dispose();
         return true;
     }
 
@@ -835,11 +1003,15 @@
     }
     if(!destroyed){
         host.ready=true;
-        host.dispatchEvent(
-            new CustomEvent(
-                'voice-transcription-ready',
-                {bubbles:true,composed:true}
-            )
+        dispatchVoiceEvent(
+            'voice-transcription-ready',
+            {},
+            {
+                beginOperation:'ready',
+                bubbles:true,
+                composed:true,
+                publicDetail:{ready:true}
+            }
         );
     }
 </script>

package/runtime/arcane/components/weather-widget.html

@@ -1,8 +1,10 @@
 <link rel="stylesheet" href="./arcane/css/theme.css?v=1"><link rel="stylesheet" href="./arcane/css/primitives.css?v=1">
 <style>:host{display:block}.widget{display:grid;gap:var(--arcane-space-4)}.current{align-items:center;display:grid;gap:var(--arcane-space-4);grid-template-columns:auto 1fr auto}.symbol{font-size:clamp(2.5rem,8vw,5rem);line-height:1}.temperature{font-size:clamp(2.2rem,7vw,4.5rem);font-weight:760;line-height:1}.location h2,.location p{margin:0}.location p,.details{color:var(--arcane-muted)}.details{display:grid;gap:var(--arcane-space-1);text-align:right}.forecast{display:grid;gap:var(--arcane-space-2);grid-template-columns:repeat(7,minmax(5.5rem,1fr));overflow:auto}.day{display:grid;gap:var(--arcane-space-2);padding:var(--arcane-space-3);text-align:center;background:var(--arcane-surface-muted);border:1px solid var(--arcane-border);border-radius:var(--arcane-radius-medium)}.day strong{white-space:nowrap}.day-symbol{font-size:1.8rem}.empty{padding:var(--arcane-space-6);text-align:center;color:var(--arcane-muted)}.footer{display:flex;align-items:center;justify-content:space-between;gap:var(--arcane-space-3)}@media(max-width:36rem){.current{grid-template-columns:auto 1fr}.details{grid-column:1/-1;text-align:left;grid-template-columns:repeat(3,1fr)}}</style>
 <section class="widget arcane-card"><div id="empty" class="empty"><strong>Weather is ready for a location</strong><p>Search for a city or postal code to load current conditions and the forecast.</p></div><div id="content" hidden><div class="arcane-card__body current"><span id="symbol" class="symbol" aria-hidden="true"></span><div class="location"><h2 id="location" class="arcane-section-heading"></h2><p id="condition"></p><div><span id="temperature" class="temperature"></span></div></div><div class="details"><span id="feels"></span><span id="humidity"></span><span id="wind"></span></div></div><div id="forecast" class="arcane-card__body forecast"></div><footer class="arcane-card__footer footer"><span id="source" class="arcane-help"></span><button id="refresh" class="arcane-button arcane-button--secondary" type="button">Refresh</button></footer></div></section>
-<script type="module">const host=this,root=host.shadowRoot,empty=root.querySelector('#empty'),content=root.querySelector('#content'),forecast=root.querySelector('#forecast');let weather=null;const conditions=new Map([[0,['Clear','☀️']],[1,['Mostly clear','🌤️']],[2,['Partly cloudy','⛅']],[3,['Overcast','☁️']],[45,['Fog','🌫️']],[48,['Freezing fog','🌫️']],[51,['Light drizzle','🌦️']],[53,['Drizzle','🌦️']],[55,['Heavy drizzle','🌧️']],[61,['Light rain','🌦️']],[63,['Rain','🌧️']],[65,['Heavy rain','🌧️']],[71,['Light snow','🌨️']],[73,['Snow','🌨️']],[75,['Heavy snow','❄️']],[80,['Rain showers','🌦️']],[81,['Rain showers','🌧️']],[82,['Heavy showers','⛈️']],[95,['Thunderstorm','⛈️']],[96,['Thunderstorm with hail','⛈️']],[99,['Severe thunderstorm','⛈️']]]);
-host.setWeather=setWeather;host.clear=()=>{weather=null;empty.hidden=false;content.hidden=true};root.querySelector('#refresh').addEventListener('click',()=>host.dispatchEvent(new CustomEvent('weather-refresh',{bubbles:true,composed:true,detail:{weather}})));
+<script type="module">const host=this,root=host.shadowRoot,empty=root.querySelector('#empty'),content=root.querySelector('#content'),forecast=root.querySelector('#forecast');const {createArcaneEventSource,projectArcaneDOMEvent}=await import('arcane-os/event-manager');const events=createArcaneEventSource(host,{source:'arcane.component.weather-widget',eventTypes:['weather-refresh','weather-widget-ready']});let weather=null,destroyed=false;const conditions=new Map([[0,['Clear','☀️']],[1,['Mostly clear','🌤️']],[2,['Partly cloudy','⛅']],[3,['Overcast','☁️']],[45,['Fog','🌫️']],[48,['Freezing fog','🌫️']],[51,['Light drizzle','🌦️']],[53,['Drizzle','🌦️']],[55,['Heavy drizzle','🌧️']],[61,['Light rain','🌦️']],[63,['Rain','🌧️']],[65,['Heavy rain','🌧️']],[71,['Light snow','🌨️']],[73,['Snow','🌨️']],[75,['Heavy snow','❄️']],[80,['Rain showers','🌦️']],[81,['Rain showers','🌧️']],[82,['Heavy showers','⛈️']],[95,['Thunderstorm','⛈️']],[96,['Thunderstorm with hail','⛈️']],[99,['Severe thunderstorm','⛈️']]]);
+function emit(type,detail={},publicDetail={}){if(destroyed)return false;const publication=events.dispatch(type,detail,{publicDetail});return projectArcaneDOMEvent(host,publication.occurrence,{bubbles:true,composed:true})}
+host.destroy=()=>{if(destroyed)return false;destroyed=true;host.ready=false;events.dispose();return true};
+host.setWeather=setWeather;host.clear=()=>{weather=null;empty.hidden=false;content.hidden=true};root.querySelector('#refresh').addEventListener('click',()=>emit('weather-refresh',{weather},{hasWeather:Boolean(weather)}));
 function info(code,isDay=true){const value=conditions.get(Number(code))||['Conditions unavailable','🌡️'];if(!isDay&&Number(code)<=1)return ['Clear night','🌙'];return value}
 function setWeather(value){weather=value;if(!value)return host.clear();empty.hidden=true;content.hidden=false;const current=value.current,[label,symbol]=info(current.weatherCode,current.isDay);root.querySelector('#symbol').textContent=symbol;root.querySelector('#location').textContent=[value.location.name,value.location.region,value.location.country].filter(Boolean).join(', ');root.querySelector('#condition').textContent=label;root.querySelector('#temperature').textContent=`${Math.round(current.temperature)}${current.temperatureUnit}`;root.querySelector('#feels').textContent=`Feels ${Math.round(current.apparentTemperature)}${current.temperatureUnit}`;root.querySelector('#humidity').textContent=`Humidity ${Math.round(current.humidity)}%`;root.querySelector('#wind').textContent=`Wind ${Math.round(current.windSpeed)} ${current.windUnit}`;root.querySelector('#source').textContent=`${value.source||'Weather source'} · updated ${new Intl.DateTimeFormat(undefined,{timeStyle:'short'}).format(new Date(value.fetchedAt))}`;forecast.replaceChildren(...Array.from(value.daily||[]).map(day=>{const section=document.createElement('section'),name=document.createElement('strong'),icon=document.createElement('span'),temperatures=document.createElement('span'),rain=document.createElement('span');section.className='day';name.textContent=new Intl.DateTimeFormat(undefined,{weekday:'short'}).format(new Date(day.date));icon.className='day-symbol';icon.textContent=info(day.weatherCode)[1];temperatures.textContent=`${Math.round(day.temperatureMax)}° / ${Math.round(day.temperatureMin)}°`;rain.textContent=`${Math.round(day.precipitationProbability)}% rain`;section.append(name,icon,temperatures,rain);return section}));return weather}
-host.ready=true;host.dispatchEvent(new CustomEvent('weather-widget-ready',{bubbles:true,composed:true}));</script>
+host.ready=true;emit('weather-widget-ready',{}, {ready:true});</script>

package/runtime/arcane/components/web-navigator.html

@@ -61,6 +61,8 @@ button{min-width:2.5rem}
 <script type="module">
 const host=this;
 const root=host.shadowRoot;
+const {createArcaneEventSource,projectArcaneDOMEvent}=await import('arcane-os/event-manager');
+const events=createArcaneEventSource(host,{source:'arcane.component.web-navigator',eventTypes:['web-navigation-blocked','web-navigate','web-open-external','web-navigator-ready']});
 const address=root.querySelector('#address');
 const frame=root.querySelector('#frame');
 const blocked=root.querySelector('#blocked');
@@ -72,6 +74,20 @@ let history=[];
 let position=-1;
 let navigationGuard=null;
 let navigationSequence=0;
+let eventOperationSequence=0;
+let destroyed=false;
+
+function emit(type,detail={},publicDetail={}){
+    if(destroyed)return false;
+    const operationId=
+        `${events.instanceId}:${type}:${(++eventOperationSequence).toString(36)}`;
+    const publication=events.dispatch(
+        type,
+        detail,
+        {operationId,publicDetail:{...publicDetail,reason:type}}
+    );
+    return projectArcaneDOMEvent(host,publication.occurrence,{bubbles:true,composed:true});
+}
 
 function normalize(value){
     let text=String(value||'').trim();
@@ -143,7 +159,7 @@ function showBlocked(url,decision){
     root.querySelector('#blockedEvidence').textContent=[decision.ruleId&&`Rule ${decision.ruleId}`,decision.policyGeneration&&`Policy generation ${decision.policyGeneration}`,decision.decisionId&&`Decision ${decision.decisionId}`,decision.decidedAt].filter(Boolean).join(' · ');
     status.textContent='Blocked by the Arcane global deny policy.';
     blocked.focus();
-    host.dispatchEvent(new CustomEvent('web-navigation-blocked',{bubbles:true,composed:true,detail:{url,decision}}));
+    emit('web-navigation-blocked',{url,decision},{blocked:true,ruleId:String(decision.ruleId||''),policyGeneration:decision.policyGeneration??null});
 }
 
 function showFrame(url){
@@ -151,17 +167,18 @@ function showFrame(url){
     frame.hidden=false;
     frame.src=url;
     status.textContent='Loading…';
-    host.dispatchEvent(new CustomEvent('web-navigate',{bubbles:true,composed:true,detail:{url}}));
+    emit('web-navigate',{url},{intent:'embedded'});
 }
 
 async function navigate(value,{record=true}={}){
+    if(destroyed)return '';
     const sequence=++navigationSequence;
     try{
         const url=normalize(value);
         address.value=url;
         status.textContent='Checking the global deny policy…';
         const decision=await evaluate(url,'embedded');
-        if(sequence!==navigationSequence)return'';
+        if(destroyed||sequence!==navigationSequence)return'';
         recordHistory(url,record);
         updateButtons();
         if(decision.blocked){
@@ -177,26 +194,29 @@ async function navigate(value,{record=true}={}){
 }
 
 async function openExternal(){
+    if(destroyed)return false;
     const sequence=++navigationSequence;
     try{
         const url=normalize(currentUrl()||address.value||homeUrl);
         status.textContent='Checking the global deny policy…';
         const decision=await evaluate(url,'external');
-        if(sequence!==navigationSequence)return;
+        if(destroyed||sequence!==navigationSequence)return false;
         if(decision.blocked){
             showBlocked(url,decision);
             return;
         }
         status.textContent='Handing the allowed address to the system browser…';
-        host.dispatchEvent(new CustomEvent('web-open-external',{bubbles:true,composed:true,detail:{url}}));
+        emit('web-open-external',{url},{intent:'external'});
+        return true;
     }catch(error){
-        if(sequence===navigationSequence)status.textContent=error.message;
+        if(!destroyed&&sequence===navigationSequence)status.textContent=error.message;
+        return false;
     }
 }
 
 function ownNavigation(operation){
     operation.catch(function reportUnexpectedNavigationFailure(error){
-        status.textContent=error.message;
+        if(!destroyed)status.textContent=error.message;
     });
 }
 
@@ -208,6 +228,7 @@ function move(amount){
 }
 
 function configure(options){
+    if(destroyed)return false;
     if(options?.homeUrl)homeUrl=normalize(options.homeUrl);
     navigationGuard=typeof options?.navigationGuard==='function'?options.navigationGuard:null;
     if(options?.initialUrl)ownNavigation(navigate(options.initialUrl));
@@ -223,7 +244,26 @@ function handleBackClick(){move(-1);}
 function handleForwardClick(){move(1);}
 function handleFrameLoad(){if(blocked.hidden)status.textContent='Loaded. If the page is blank, its site does not permit embedded viewing.';}
 
+function destroy(){
+    if(destroyed)return false;
+    destroyed=true;
+    navigationSequence+=1;
+    navigationGuard=null;
+    host.ready=false;
+    root.querySelector('#addressForm').removeEventListener('submit',handleAddressSubmit);
+    root.querySelector('#home').removeEventListener('click',handleHomeClick);
+    root.querySelector('#reload').removeEventListener('click',handleReloadClick);
+    root.querySelector('#external').removeEventListener('click',handleExternalClick);
+    back.removeEventListener('click',handleBackClick);
+    forward.removeEventListener('click',handleForwardClick);
+    frame.removeEventListener('load',handleFrameLoad);
+    frame.removeAttribute('src');
+    events.dispose();
+    return true;
+}
+
 host.configure=configure;
+host.destroy=destroy;
 host.navigate=navigate;
 host.currentUrl=currentUrl;
 root.querySelector('#addressForm').addEventListener('submit',handleAddressSubmit);
@@ -235,5 +275,5 @@ forward.addEventListener('click',handleForwardClick);
 frame.addEventListener('load',handleFrameLoad);
 updateButtons();
 host.ready=true;
-host.dispatchEvent(new CustomEvent('web-navigator-ready',{bubbles:true,composed:true}));
+emit('web-navigator-ready',{}, {ready:true});
 </script>

package/runtime/arcane/entities/Chat.js

@@ -1,6 +1,6 @@
 import Is from '../../node_modules/strong-type/index.js';
 import '../modules/DBOPFS.js';
-import '../modules/AI.js?v=8';
+import '../modules/AI.js';
 import {hasUserEntry} from '../modules/ChatRecords.js';
 import {normalizeMemoryContent} from '../modules/MemoryRecords.js';