arcane-os 0.47.0 → 0.48.0

package/runtime/arcane/modules/PrintView.js

@@ -1,5 +1,13 @@
 import Is from 'strong-type';
-import {arcaneLightThemeTokens} from '../entities/Theme.js';
+
+// Components import this module independently of their rendering. Await only
+// the required print stylesheet here so every registered view is ready for the
+// synchronous native beforeprint event, with no stylesheet fetch during print.
+const printResponse=await fetch(new URL('../css/print.css',import.meta.url));
+if(!printResponse.ok){
+    throw new Error(`Unable to load shared print styles: HTTP ${printResponse.status}.`);
+}
+const printStyles=await printResponse.text();
 
 const is=new Is(false);
 const registries=new WeakMap();
@@ -401,38 +409,13 @@ function capture(registry,session){
     const heading=document.createElement('h1');
     heading.textContent=session.title;
     const rendered=copyRendered(session.content,state,true);
-    // Screen layout and fonts describe the rendered content; screen-theme paint
-    // does not describe a readable paper surface. Keep this palette in the
-    // snapshot, including its pseudo-elements, without recoloring SVG artwork.
-    styles.textContent=`
-        :host{color-scheme:light!important;color:${arcaneLightThemeTokens.text}!important;background:${arcaneLightThemeTokens.surface}!important;font:12pt/1.5 serif}
-        :host>h1{margin:0 0 .75em;font-size:1.5em;line-height:1.2}
-        [data-arcane-print-node]:not(svg,svg *,img,video,audio),
-        [data-arcane-print-node]:not(svg,svg *,img,video,audio)::before,
-        [data-arcane-print-node]:not(svg,svg *,img,video,audio)::after{
-            color:${arcaneLightThemeTokens.text}!important;background-color:transparent!important;
-            border-color:${arcaneLightThemeTokens.border}!important;color-scheme:light!important;
-            -webkit-text-fill-color:currentColor!important;-webkit-text-stroke:0!important;
-            text-decoration-color:currentColor!important;text-shadow:none!important;box-shadow:none!important
-        }
-        a[data-arcane-print-node]:not(svg *){text-decoration:underline!important}
-        table[data-arcane-print-node]:not(svg *){border-collapse:collapse!important}
-        th[data-arcane-print-node]:not(svg *),td[data-arcane-print-node]:not(svg *){border:1px solid ${arcaneLightThemeTokens.border}!important;padding:.35em .5em!important}
-        ${state.rules.join('\n')}
-    `;
+    // Only captured pseudo-element declarations are generated here. Authored
+    // print palette, page margins, and expansion rules share the CSS owner.
+    styles.textContent=printStyles+'\n'+state.rules.join('\n');
     root.append(styles,heading,rendered);
     const sheet=document.createElement('style');
     session.sheet=sheet;
-    sheet.textContent=`
-        [data-arcane-print-stage]{display:none!important}
-        @media print{
-            @page{margin:15mm}
-            html:root,html:root>body{display:block!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;contain:none!important;margin:0!important;padding:0!important;border:0!important;background:${arcaneLightThemeTokens.surface}!important;color:${arcaneLightThemeTokens.text}!important;color-scheme:light!important}
-            html:root>body>*:not([data-arcane-print-stage]){display:none!important}
-            html:root>body::before,html:root>body::after{display:none!important}
-            html:root>body>[data-arcane-print-stage]{display:block!important;position:static!important;width:auto!important;height:auto!important;overflow:visible!important;margin:0!important;padding:0!important;border:0!important}
-        }
-    `;
+    sheet.textContent=printStyles;
     document.head.append(sheet);
     document.body.append(stage);
     session.originalTitle=document.title;
@@ -523,36 +506,17 @@ function copyRendered(source,state,root=false){
         clone.selected=source.selected;
     }
     if(!['img','svg','video','audio','input','canvas'].includes(name)){
-        for(const [property,value] of [
-            ['height','auto'],['min-height','0'],['max-height','none'],
-            ['width','auto'],['min-width','0'],['max-width','100%'],['overflow','visible'],
-            ['contain','none'],['content-visibility','visible'],['grid-template-rows','none'],
-            ['break-inside','auto']
-        ]){
-            clone.style.setProperty(property,value);
-        }
-    }else if(name==='img'||name==='canvas'){
-        clone.style.setProperty('max-width','100%');
-        clone.style.setProperty('height','auto');
+        clone.setAttribute('data-arcane-print-expand','');
     }
     if(['absolute','fixed','sticky'].includes(appearance.position)){
-        clone.style.setProperty('position','static');
+        clone.setAttribute('data-arcane-print-static','');
     }
     if(root||name==='iframe'){
         clone.hidden=false;
-        clone.style.setProperty('display',appearance.display==='none'?'block':appearance.display);
-        clone.style.setProperty('visibility','visible');
-    }
-    if(name==='pre'){
-        clone.style.setProperty('white-space','pre-wrap');
-        clone.style.setProperty('overflow-wrap','anywhere');
-    }
-    if(name==='table'){
-        clone.style.setProperty('table-layout','auto');
-    }
-    if(name==='td'||name==='th'){
-        clone.style.setProperty('overflow-wrap','anywhere');
-        clone.style.setProperty('white-space','normal');
+        clone.setAttribute('data-arcane-print-root','');
+        if(appearance.display==='none'){
+            clone.setAttribute('data-arcane-print-block','');
+        }
     }
     if(name==='iframe'){
         const embedded=frameDocument(source);