@zubra/runtime 5.0.3 → 5.1.0

package/dist/production/element.js

@@ -49,6 +49,12 @@ export function isSafeUrl(value) {
   return ['http', 'https', 'mailto', 'tel'].includes(beforePath.slice(0, colon).toLowerCase());
 }
 
+/** A srcset whose every candidate's URL is safe (src/validate.rs `is_safe_srcset`). */
+export function isSafeSrcset(value) {
+  const urls = String(value).split(',').map((candidate) => candidate.trim().split(/\s+/)[0]).filter(Boolean);
+  return urls.length > 0 && urls.every(isSafeUrl);
+}
+
 const clone = (value) => (value && typeof value === 'object' ? structuredClone(value) : value);
 
 /** Attribute text → prop value, typed by the prop's default (JSON for arrays and objects). */
@@ -1075,6 +1081,11 @@ function bindAttribute(part, node) {
     const text = typeof value === 'object' ? JSON.stringify(value) : String(value);
     // No URL yet (a prop's "" default, before the app sets it): no attribute, and nothing to report.
     if (part.url && text.trim() === '') return node.removeAttribute(name);
+    if (part.srcset && text.trim() === '') return node.removeAttribute(name);
+    if (part.srcset && !isSafeSrcset(text)) {
+      console.error(`zubra: blocked an unsafe URL in "${name}"${see('safety')}:`, text);
+      return node.removeAttribute(name);
+    }
     if (part.url && !isSafeUrl(text)) {
       console.error(`zubra: blocked an unsafe URL in "${name}"${see('safety')}:`, text);
       return node.removeAttribute(name);

package/dist/production/index.js

@@ -8,5 +8,5 @@ export {
   createContext, provide, inject, ContextRequestEvent, ContextProviderEvent,
   formValue, validity, onFormReset, onFormRestore, onFormDisabled,
   prevent, stop, selfOnly, submit, keys, model, hasSlot, hydrated, signal, from, raw,
-  isSafeUrl, $r, $t,
+  isSafeUrl, isSafeSrcset, $r, $t,
 } from './element.js';

package/dist/production/spread.js

@@ -2,7 +2,7 @@
 // {...spread} in compiled components: an object's entries as an element's attributes,
 // properties and listeners. Its own entry (`@zubra/runtime/spread`), which a compiled module imports
 // only when its template spreads, so components that don't, don't load it.
-import { $r, isSafeUrl } from './element.js';
+import { $r, isSafeSrcset, isSafeUrl } from './element.js';
 import { effect } from './effect.js';
 
 const see = (section) => ` (see https://github.com/journey-to-code-org/zubra#${section})`;
@@ -130,6 +130,13 @@ export function spread(part, node) {
         continue;
       }
       const text = String(value);
+      if (name.toLowerCase() === 'srcset') {
+        if (text.trim() === '' || !isSafeSrcset(text)) {
+          if (text.trim() !== '') console.error(`zubra: blocked an unsafe URL in "${name}"${see('safety')}:`, text);
+          node.removeAttribute(name);
+          continue;
+        }
+      }
       if (SPREAD_URLS.has(name.toLowerCase())) {
         if (text.trim() === '') {
           node.removeAttribute(name);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zubra/runtime",
-  "version": "5.0.3",
+  "version": "5.1.0",
   "description": "Browser runtime for Zubra compiled components, built on the TC39 Signals API",
   "license": "ISC",
   "repository": {

package/src/element.js

@@ -48,6 +48,12 @@ export function isSafeUrl(value) {
   return ['http', 'https', 'mailto', 'tel'].includes(beforePath.slice(0, colon).toLowerCase());
 }
 
+/** A srcset whose every candidate's URL is safe (src/validate.rs `is_safe_srcset`). */
+export function isSafeSrcset(value) {
+  const urls = String(value).split(',').map((candidate) => candidate.trim().split(/\s+/)[0]).filter(Boolean);
+  return urls.length > 0 && urls.every(isSafeUrl);
+}
+
 const clone = (value) => (value && typeof value === 'object' ? structuredClone(value) : value);
 
 /** Attribute text → prop value, typed by the prop's default (JSON for arrays and objects). */
@@ -1090,6 +1096,11 @@ function bindAttribute(part, node) {
     const text = typeof value === 'object' ? JSON.stringify(value) : String(value);
     // No URL yet (a prop's "" default, before the app sets it): no attribute, and nothing to report.
     if (part.url && text.trim() === '') return node.removeAttribute(name);
+    if (part.srcset && text.trim() === '') return node.removeAttribute(name);
+    if (part.srcset && !isSafeSrcset(text)) {
+      console.error(`zubra: blocked an unsafe URL in "${name}"${see('safety')}:`, text);
+      return node.removeAttribute(name);
+    }
     if (part.url && !isSafeUrl(text)) {
       console.error(`zubra: blocked an unsafe URL in "${name}"${see('safety')}:`, text);
       return node.removeAttribute(name);

package/src/index.js

@@ -7,5 +7,5 @@ export {
   createContext, provide, inject, ContextRequestEvent, ContextProviderEvent,
   formValue, validity, onFormReset, onFormRestore, onFormDisabled,
   prevent, stop, selfOnly, submit, keys, model, hasSlot, hydrated, signal, from, raw,
-  isSafeUrl, $r, $t,
+  isSafeUrl, isSafeSrcset, $r, $t,
 } from './element.js';

package/src/spread.js

@@ -1,7 +1,7 @@
 // {...spread} in compiled components: an object's entries as an element's attributes,
 // properties and listeners. Its own entry (`@zubra/runtime/spread`), which a compiled module imports
 // only when its template spreads, so components that don't, don't load it.
-import { $r, isSafeUrl } from './element.js';
+import { $r, isSafeSrcset, isSafeUrl } from './element.js';
 import { effect } from './effect.js';
 
 const see = (section) => ` (see https://github.com/journey-to-code-org/zubra#${section})`;
@@ -129,6 +129,13 @@ export function spread(part, node) {
         continue;
       }
       const text = String(value);
+      if (name.toLowerCase() === 'srcset') {
+        if (text.trim() === '' || !isSafeSrcset(text)) {
+          if (text.trim() !== '') console.error(`zubra: blocked an unsafe URL in "${name}"${see('safety')}:`, text);
+          node.removeAttribute(name);
+          continue;
+        }
+      }
       if (SPREAD_URLS.has(name.toLowerCase())) {
         if (text.trim() === '') {
           node.removeAttribute(name);

package/types/index.d.ts

@@ -199,6 +199,8 @@ export declare const ABI: number;
 
 /** Whether a URL is safe for `href`/`src`: relative, or http(s), mailto or tel. */
 export declare function isSafeUrl(value: string): boolean;
+/** True when every candidate in a srcset has a safe URL (the check a dynamic `srcset` gets). */
+export declare function isSafeSrcset(value: string): boolean;
 /** @internal Read a value that may be a signal. */
 export declare function $r<T>(value: MaybeSignal<T>): T;
 /** @internal A value as template text. */