@seed-ship/mcp-ui-solid 6.20.0 → 6.21.0

package/src/services/validation.ts

@@ -689,6 +689,42 @@ export function validateIframeDomain(
   }
 }
 
+/**
+ * Is this URL's host a trusted iframe host?
+ *
+ * A host matches when it equals an entry of `TRUSTED_IFRAME_DOMAINS` (plus
+ * `options.customTrustedDomains`) or is a subdomain of one. Trusted hosts
+ * need their own cookies/storage to authenticate, which is why they receive
+ * `allow-same-origin` in `getIframeSandbox` and deliberately do NOT receive
+ * the `credentialless` iframe attribute (an authenticated embed loaded
+ * without its cookies only shows a login screen).
+ *
+ * An unparsable URL is never trusted.
+ *
+ * @param url - The iframe URL
+ * @param options - Optional custom trusted domains, merged over the defaults
+ * @returns `true` when the URL's host is trusted
+ * @since v6.21.0 — extracted from `getIframeSandbox`, identical matching.
+ */
+export function isTrustedIframeDomain(
+  url: string,
+  options?: { customTrustedDomains?: string[] }
+): boolean {
+  try {
+    const domain = new URL(url).hostname;
+    const trustedList = options?.customTrustedDomains
+      ? [...TRUSTED_IFRAME_DOMAINS, ...options.customTrustedDomains]
+      : TRUSTED_IFRAME_DOMAINS;
+
+    return trustedList.some(
+      (trusted) => domain === trusted || domain.endsWith(`.${trusted}`)
+    );
+  } catch {
+    // Invalid URL — never trusted.
+    return false;
+  }
+}
+
 /**
  * Get the appropriate sandbox attribute for an iframe URL.
  *
@@ -707,22 +743,8 @@ export function getIframeSandbox(
 ): string {
   const baseSandbox = 'allow-scripts allow-popups';
 
-  try {
-    const domain = new URL(url).hostname;
-    let trustedList = TRUSTED_IFRAME_DOMAINS;
-    if (options?.customTrustedDomains) {
-      trustedList = [...TRUSTED_IFRAME_DOMAINS, ...options.customTrustedDomains];
-    }
-
-    const isTrusted = trustedList.some(
-      (trusted) => domain === trusted || domain.endsWith(`.${trusted}`)
-    );
-
-    if (isTrusted) {
-      return `${baseSandbox} allow-same-origin allow-forms`;
-    }
-  } catch {
-    // Invalid URL — use restrictive sandbox
+  if (isTrustedIframeDomain(url, options)) {
+    return `${baseSandbox} allow-same-origin allow-forms`;
   }
 
   return baseSandbox;

package/src/solid-jsx-attrs.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Solid JSX augmentation — `attr:credentialless` (v6.21.0).
+ *
+ * `credentialless` is listed in dom-expressions' `Properties` set, so the
+ * plain `credentialless={…}` form compiles to a JS property assignment
+ * (`el.credentialless = v`) and never reaches the DOM as an attribute in an
+ * engine that does not reflect it (jsdom, and any pre-110 browser). The
+ * `attr:` namespace forces `setAttribute` / `ssrAttribute` instead.
+ *
+ * Solid types `attr:*` only for keys declared in `JSX.ExplicitAttributes`,
+ * which ships empty — hence this augmentation. The value type is
+ * `true | undefined` on purpose: `undefined` removes the attribute, so the
+ * boolean attribute is never emitted as `credentialless="false"`.
+ */
+
+import 'solid-js'
+
+declare module 'solid-js' {
+  namespace JSX {
+    interface ExplicitAttributes {
+      credentialless: true | undefined
+    }
+  }
+}

package/src/utils/iframe-coep.ts

@@ -0,0 +1,74 @@
+/**
+ * COEP helpers for the two iframes the library renders
+ * (`IframeRenderer` in `UIResourceRenderer.tsx`, and the YouTube / Vimeo
+ * embed in `VideoRenderer.tsx`).
+ *
+ * @since v6.21.0
+ *
+ * A host that serves `Cross-Origin-Embedder-Policy: credentialless` makes the
+ * browser refuse any cross-origin iframe whose own document sends no COEP
+ * header. The HTML attribute `credentialless` on the `<iframe>` lifts that,
+ * at the price of the embedded document losing access to the cookies and
+ * storage of its own origin — see `MCPUIConfigContext` for the policy.
+ */
+
+import { createSignal, onMount, type Accessor } from 'solid-js'
+import { isTrustedIframeDomain } from '../services/validation'
+import type { MCPUIConfig } from '../context/MCPUIConfigContext'
+
+/**
+ * Does this iframe get the boolean `credentialless` attribute?
+ *
+ * `'auto'` (the default) says yes only when the embed has nothing to lose:
+ * the host is not trusted AND the iframe already runs without cookies because
+ * its `sandbox` has no `allow-same-origin` (`sandboxedWithoutSameOrigin`).
+ * The video embed carries no sandbox, so in `'auto'` it keeps its provider
+ * cookies and a COEP host must opt in with `'always'`.
+ *
+ * An unparsable URL is not trusted, so it gets the attribute.
+ */
+export function shouldSetCredentialless(
+  url: string,
+  config: MCPUIConfig,
+  options: { sandboxedWithoutSameOrigin: boolean }
+): boolean {
+  const mode = config.iframeCredentialless
+  if (mode === 'always') return true
+  if (mode === 'never') return false
+  if (!options.sandboxedWithoutSameOrigin) return false
+  return !isTrustedIframeDomain(url, {
+    customTrustedDomains: config.customTrustedIframeDomains,
+  })
+}
+
+/**
+ * `window.crossOriginIsolated`, read **after mount** into a signal.
+ *
+ * Reading it during render would make the server emit markup the client
+ * cannot reproduce; the signal starts at `false` (the SSR value) and flips
+ * once mounted, so hydration always matches.
+ */
+export function createCrossOriginIsolated(): Accessor<boolean> {
+  const [isolated, setIsolated] = createSignal(false)
+  onMount(() => {
+    setIsolated(typeof window !== 'undefined' && window.crossOriginIsolated === true)
+  })
+  return isolated
+}
+
+/**
+ * Does the "open in a new tab" link show under an embed?
+ *
+ * `'auto'` shows it only on a cross-origin-isolated page — exactly where COEP
+ * can block the frame, and where the blocking is silent (a refused
+ * cross-origin document fires no `error` event the parent can observe).
+ */
+export function shouldShowIframeFallbackLink(
+  config: MCPUIConfig,
+  crossOriginIsolated: boolean
+): boolean {
+  const mode = config.iframeFallbackLink
+  if (mode === 'always') return true
+  if (mode === 'never') return false
+  return crossOriginIsolated
+}

package/src/validation.ts

@@ -19,6 +19,10 @@ export {
   validateTableComponent,
   validatePayloadSize,
   validateIframeDomain,
+  getIframeSandbox,
+  // v6.21.0 — trusted-host test shared by the sandbox and the
+  // `credentialless` iframe attribute.
+  isTrustedIframeDomain,
   sanitizeString,
   DEFAULT_RESOURCE_LIMITS,
   // v6.20.0 — end-user form validation with injectable wording.