meno-core 1.0.54 → 1.1.1

package/lib/shared/permissions.ts

@@ -0,0 +1,162 @@
+/**
+ * Permission resolver
+ *
+ * Pure functions that turn a {@link PermissionsPolicy} + a
+ * {@link PermissionIdentity} into a queryable {@link ResolvedPermissions}, and
+ * answer "can this identity edit this resource?". No IO — the policy is loaded
+ * and the identity gathered by the caller. Shared by the studio client (UI
+ * gating) and any future server-side mirror.
+ *
+ * See `./types/permissions.ts` for the data model and the SOFT-enforcement
+ * caveat.
+ */
+
+import type {
+  PermissionGrant,
+  PermissionIdentity,
+  PermissionRole,
+  PermissionRule,
+  PermissionsPolicy,
+  ResolvedPermissions,
+  ResourceKind,
+  ResourceRef,
+} from './types/permissions';
+
+/** Role capability ordering, low → high. */
+const ROLE_RANK: Record<PermissionRole, number> = { viewer: 0, editor: 1, admin: 2 };
+
+/** Maps a {@link ResourceKind} to its {@link PermissionRule} key. */
+const RULE_KEY: Record<ResourceKind, keyof PermissionRule> = {
+  page: 'pages',
+  component: 'components',
+  cms: 'cms',
+  config: 'config',
+};
+
+/** The empty (all-kinds-present) allow rule used as a merge seed. */
+function emptyAllow(): Required<PermissionRule> {
+  return { pages: [], components: [], cms: [], config: [] };
+}
+
+function higherRole(a: PermissionRole, b: PermissionRole): PermissionRole {
+  return ROLE_RANK[b] > ROLE_RANK[a] ? b : a;
+}
+
+/** A grant's role: explicit, else `editor` when it carries an allow-list, else `viewer`. */
+function grantRole(grant: PermissionGrant): PermissionRole {
+  if (grant.role) return grant.role;
+  return grant.allow ? 'editor' : 'viewer';
+}
+
+function mergeAllow(grants: PermissionGrant[]): Required<PermissionRule> {
+  const merged = emptyAllow();
+  for (const grant of grants) {
+    const allow = grant.allow;
+    if (!allow) continue;
+    for (const kind of Object.keys(merged) as (keyof PermissionRule)[]) {
+      const patterns = allow[kind];
+      if (patterns) merged[kind].push(...patterns);
+    }
+  }
+  // Dedupe each list while preserving order.
+  for (const kind of Object.keys(merged) as (keyof PermissionRule)[]) {
+    merged[kind] = [...new Set(merged[kind])];
+  }
+  return merged;
+}
+
+const REGEX_SPECIALS = /[.+?^${}()|[\]\\]/g;
+
+/**
+ * Glob match for a single permission pattern against a value. `*` matches any
+ * run of characters (including `/`); every other character is literal. An exact
+ * (wildcard-free) pattern must equal the value.
+ */
+export function matchesPermissionPattern(pattern: string, value: string): boolean {
+  if (pattern === value) return true;
+  if (!pattern.includes('*')) return false;
+  const source = pattern
+    .split('*')
+    .map((segment) => segment.replace(REGEX_SPECIALS, '\\$&'))
+    .join('.*');
+  return new RegExp(`^${source}$`).test(value);
+}
+
+/** True if `value` matches any pattern in `patterns`. */
+export function matchesAnyPermissionPattern(patterns: string[] | undefined, value: string): boolean {
+  return !!patterns && patterns.some((pattern) => matchesPermissionPattern(pattern, value));
+}
+
+/**
+ * Resolve a policy + identity into a capability set.
+ *
+ * - `policy == null` → an UNMANAGED project: everyone edits everything (status
+ *   quo). `canManagePolicy` (who may create the first policy) is gated to repo
+ *   admins, or anyone on a local/unauthenticated run.
+ * - With a policy present, an identity not listed in `members`/`teams` gets
+ *   `defaultRole` (default `viewer`). `login: null` is treated the same way —
+ *   callers that want to bypass gating for local runs should skip resolution
+ *   rather than pass a null login.
+ * - A GitHub repo admin (`identity.isRepoAdmin`) is ALWAYS an admin here,
+ *   regardless of the policy (bootstrap safety against lockout).
+ */
+export function resolvePermissions(
+  policy: PermissionsPolicy | null | undefined,
+  identity: PermissionIdentity,
+): ResolvedPermissions {
+  const login = identity.login ?? null;
+  const isRepoAdmin = identity.isRepoAdmin === true;
+
+  if (!policy) {
+    return {
+      login,
+      role: 'admin',
+      isAdmin: true,
+      canManagePolicy: login == null || isRepoAdmin,
+      allow: emptyAllow(),
+    };
+  }
+
+  const grants: PermissionGrant[] = [];
+
+  const lookupLogin = login?.toLowerCase() ?? null;
+  if (lookupLogin && policy.members) {
+    for (const [key, grant] of Object.entries(policy.members)) {
+      if (key.toLowerCase() === lookupLogin) grants.push(grant);
+    }
+  }
+
+  if (policy.teams && identity.teams && identity.teams.length > 0) {
+    const teamSet = new Set(identity.teams.map((team) => team.toLowerCase()));
+    for (const [key, grant] of Object.entries(policy.teams)) {
+      if (teamSet.has(key.toLowerCase())) grants.push(grant);
+    }
+  }
+
+  const defaultRole: PermissionRole = policy.defaultRole ?? 'viewer';
+  const baseRole =
+    grants.length === 0
+      ? defaultRole
+      : grants.reduce<PermissionRole>((acc, g) => higherRole(acc, grantRole(g)), 'viewer');
+
+  const isAdmin = isRepoAdmin || baseRole === 'admin';
+
+  return {
+    login,
+    role: isAdmin ? 'admin' : baseRole,
+    isAdmin,
+    canManagePolicy: isAdmin,
+    allow: mergeAllow(grants),
+  };
+}
+
+/**
+ * May this identity edit this resource? Admins edit everything; viewers edit
+ * nothing; editors edit only resources whose id matches the merged allow-list
+ * for the resource's kind.
+ */
+export function canEdit(resolved: ResolvedPermissions, ref: ResourceRef): boolean {
+  if (resolved.isAdmin) return true;
+  if (resolved.role === 'viewer') return false;
+  return matchesAnyPermissionPattern(resolved.allow[RULE_KEY[ref.kind]], ref.id);
+}

package/lib/shared/propResolver.test.ts

@@ -1,4 +1,4 @@
-import { test, expect, describe, beforeEach } from 'bun:test';
+import { test, expect, describe } from 'bun:test';
 import { resolveComponentProps, resolvePropsFromDefinition, isRichTextMarker } from './propResolver';
 import type { StructuredComponentDefinition, ComponentNode, I18nConfig, PropDefinition } from './types';
 

package/lib/shared/propResolver.ts

@@ -146,7 +146,7 @@ export function resolveComponentProps(options: ResolvePropsOptions): Record<stri
     // Wrap rich-text props in marker objects for HTML rendering
     // Must happen AFTER i18n resolution so HTML strings get properly wrapped
     return wrapRichTextProps(result, propDefs);
-  } catch (error) {
+  } catch (_error) {
     // Fallback to original behavior if validation fails (backward compatibility)
     const resolvedProps: Record<string, unknown> = {};
 

package/lib/shared/registry/BaseNodeTypeRegistry.test.ts

@@ -4,7 +4,6 @@
 
 import { describe, it, expect, beforeEach } from 'bun:test';
 import { ClientNodeTypeRegistry } from './ClientNodeTypeRegistry';
-import { SSRNodeTypeRegistry } from './SSRNodeTypeRegistry';
 import { NodeTypeManager, globalNodeTypeManager } from './NodeTypeManager';
 import { defineNodeType } from './defineNodeType';
 import { registerBuiltInNodeTypes, builtInNodeTypes } from './nodeTypes';
@@ -42,10 +41,11 @@ describe('BaseNodeTypeRegistry', () => {
   describe('registerAll', () => {
     it('should register multiple node type definitions', () => {
       registry.registerAll(builtInNodeTypes);
-      expect(registry.size).toBe(7); // 7 node types after cms-list merged into list
+      expect(registry.size).toBe(10); // node, component, slot, embed, link, locale-list, list, island, markdown, custom
       expect(registry.has(NODE_TYPE.NODE)).toBe(true);
       expect(registry.has(NODE_TYPE.COMPONENT)).toBe(true);
       expect(registry.has(NODE_TYPE.EMBED)).toBe(true);
+      expect(registry.has(NODE_TYPE.ISLAND)).toBe(true);
     });
   });
 
@@ -189,6 +189,8 @@ describe('globalNodeTypeManager', () => {
     registerBuiltInNodeTypes();
     expect(globalNodeTypeManager.has(NODE_TYPE.NODE)).toBe(true);
     expect(globalNodeTypeManager.has(NODE_TYPE.EMBED)).toBe(true);
-    expect(globalNodeTypeManager.getAll().length).toBe(7); // 7 node types after cms-list merged into list
+    expect(globalNodeTypeManager.has(NODE_TYPE.ISLAND)).toBe(true);
+    expect(globalNodeTypeManager.has(NODE_TYPE.MARKDOWN)).toBe(true);
+    expect(globalNodeTypeManager.getAll().length).toBe(10); // node, component, slot, embed, link, locale-list, list, island, markdown, custom
   });
 });

package/lib/shared/registry/ClientRegistry.ts

@@ -4,7 +4,6 @@
  */
 
 import { BaseComponentRegistry } from './ComponentRegistry';
-import type { ComponentDefinition } from '../types';
 
 export class ClientRegistry extends BaseComponentRegistry {
   /**

package/lib/shared/registry/ComponentRegistry.test.ts

@@ -133,8 +133,8 @@ describe('BaseComponentRegistry', () => {
 
       const all = registry.getAll();
 
-      expect(all['Button']).toEqual(component1);
-      expect(all['Card']).toEqual(component2);
+      expect(all.Button).toEqual(component1);
+      expect(all.Card).toEqual(component2);
       expect(Object.keys(all).length).toBe(2);
     });
 
@@ -146,7 +146,7 @@ describe('BaseComponentRegistry', () => {
       registry.register('Button', component);
 
       const all = registry.getAll();
-      delete all['Button'];
+      delete all.Button;
 
       expect(registry.has('Button')).toBe(true);
     });

package/lib/shared/registry/ComponentRegistry.ts

@@ -5,6 +5,7 @@
  */
 
 import type { ComponentDefinition } from '../types';
+import { logRuntimeError } from '../errorLogger';
 
 /**
  * Base registry class with common functionality
@@ -92,7 +93,11 @@ export abstract class BaseComponentRegistry {
     for (const listener of this.listeners) {
       try {
         listener();
-      } catch (err) {}
+      } catch (err) {
+        // One throwing subscriber must not stop the rest from being notified, but
+        // a swallowed listener error hides real store-update bugs — surface it.
+        logRuntimeError('ComponentRegistry.notify', err);
+      }
     }
   }
 }

package/lib/shared/registry/NodeTypeDefinition.ts

@@ -6,7 +6,6 @@
 import type { ReactElement } from 'react';
 import type { ZodType } from 'zod';
 import type { ComponentNode } from '../types/nodes';
-import type { StyleValue } from '../types/styles';
 
 /**
  * Tree icon types for node display
@@ -21,7 +20,8 @@ export type TreeIcon =
   | 'ARRAY'
   | 'UNKNOWN'
   | 'FORM'
-  | 'LINK';
+  | 'LINK'
+  | 'CODE';
 
 /**
  * Node category for grouping in command palette

package/lib/shared/registry/SSRRegistry.ts

@@ -4,7 +4,6 @@
  */
 
 import { BaseComponentRegistry } from './ComponentRegistry';
-import type { ComponentDefinition } from '../types';
 
 export class SSRRegistry extends BaseComponentRegistry {
   /**

package/lib/shared/registry/fieldPresets.ts

@@ -33,7 +33,9 @@ interface TextFieldConfig extends BaseFieldConfig {
 }
 
 interface SelectFieldConfig extends BaseFieldConfig {
-  options: string[];
+  // Bare strings are value-is-label options; the object form carries a distinct
+  // display label (e.g. an empty-value `{ value: '', label: 'None' }` entry).
+  options: (string | { value: string | boolean; label: string })[];
 }
 
 // ============================================

package/lib/shared/registry/nodeTypes/CustomNodeType.ts

@@ -0,0 +1,103 @@
+/**
+ * Custom Node Type Definition
+ *
+ * Represents a hand-authored, opaque `.astro` component (under `src/custom/`) that Meno
+ * treats as a BLACK BOX: it renders server-side in a real `astro build` / play preview
+ * (the meno-astro codec emits `<Fancy … />` + the import), but Meno doesn't model its
+ * internals — you can place it, pass props, and slot children, but not edit what's inside.
+ * The native-Astro sibling of an island (no framework renderer, no hydration).
+ *
+ * meno-core can't execute a foreign `.astro` file, so the editor canvas renders a quiet
+ * placeholder (its slotted children, or an inline marker) — real rendering is play/build
+ * only. The on-disk `.astro` form and the round-trip codec live in `meno-astro`; this file
+ * only models the node so it validates, persists, and renders a placeholder.
+ */
+
+import { z } from 'zod';
+import { createElement as h } from 'react';
+import type { ComponentNode } from '../../types/nodes';
+import { IfConditionSchema } from '../../validation/schemas';
+import { createNodeType } from '../createNodeType';
+import { textField } from '../fieldPresets';
+
+// Schema is the SINGLE source of truth
+const CustomNodeSchemaInternal = z
+  .object({
+    type: z.literal('custom'),
+    // Path to the hand-authored .astro component relative to `src/custom/`
+    // (e.g. "Fancy.astro", "widgets/Banner.astro").
+    src: z.string(),
+    props: z.record(z.string(), z.any()).optional(),
+    if: IfConditionSchema.optional(), // Conditional rendering - skip node when false
+    // Slotted children (rendered server-side into the component's default <slot/>).
+    children: z.union([z.array(z.any()), z.string()]).optional(),
+  })
+  .passthrough();
+
+// TypeScript type inferred from schema
+export type CustomNode = z.infer<typeof CustomNodeSchemaInternal>;
+
+// Export schema for validation/schemas.ts
+export const CustomNodeSchema = CustomNodeSchemaInternal;
+
+/** Basename of the custom source (drops directory + `.astro` extension) for display. */
+function customName(src: string): string {
+  const base = src.split('/').pop() ?? src;
+  return base.replace(/\.astro$/i, '') || base;
+}
+
+/** Slotted children, normalized to the shape `buildChildren`/`renderChildren` accept. */
+function customChildren(node: CustomNode): Array<ComponentNode | string> | string | undefined {
+  const { children } = node;
+  if (Array.isArray(children)) return children.length > 0 ? (children as Array<ComponentNode | string>) : undefined;
+  if (typeof children === 'string') return children.length > 0 ? children : undefined;
+  return undefined;
+}
+
+export const CustomNodeType = createNodeType({
+  type: 'custom',
+  displayName: 'Custom Component',
+  category: 'special',
+  schema: CustomNodeSchemaInternal,
+
+  defaultValues: {
+    src: '',
+  },
+
+  treeDisplay: {
+    icon: 'COMPONENT',
+    getLabel: (node) => `Custom: ${customName(node.src) || '?'}`,
+  },
+
+  editableFields: [textField({ name: 'src', label: 'Custom .astro file', required: true, placeholder: 'Fancy.astro' })],
+
+  // meno-core can't run a foreign `.astro` file. Render the slotted children as normal
+  // content and fall back to a quiet inline marker when there are none. The wrapper keeps
+  // `data-custom` for selection/identification only. Real rendering is play/build only.
+  clientRenderer: (node, context) => {
+    const children = customChildren(node);
+    const inner = children
+      ? context.buildChildren(children, context.elementPath)
+      : h('span', { style: { color: '#9ca3af', fontSize: '13px' } }, customName(node.src) || '?');
+    return h('div', { key: context.key, 'data-custom': node.src, style: { display: 'contents' } }, inner);
+  },
+
+  ssrRenderer: (node, context) => {
+    const children = customChildren(node);
+    const inner = children
+      ? context.renderChildren(children, context)
+      : `<span style="color:#9ca3af;font-size:13px">${escapeHtml(customName(node.src) || '?')}</span>`;
+    return `<div data-custom="${escapeHtml(node.src)}" style="display:contents">${inner}</div>`;
+  },
+
+  capabilities: {
+    canHaveChildren: true,
+    canHaveStyle: false,
+    canHaveAttributes: false,
+    requiresProps: ['src'],
+  },
+});
+
+function escapeHtml(value: string): string {
+  return value.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+}

package/lib/shared/registry/nodeTypes/HtmlNodeType.ts

@@ -51,7 +51,7 @@ export const HtmlNodeType = createNodeType({
   },
 
   clientRenderer: (node, context) => {
-    const props: Record<string, any> = { key: context.key };
+    const props: Record<string, unknown> = { key: context.key };
 
     // Prevent form submission in editor
     if (node.tag === 'form') {

package/lib/shared/registry/nodeTypes/IslandNodeType.ts

@@ -0,0 +1,129 @@
+/**
+ * Island Node Type Definition
+ *
+ * Represents a BYO framework component (React/Preact/Vue/Svelte) rendered as an
+ * Astro island. The actual hydration only happens in a real `astro build` / play
+ * preview (the meno-astro codec emits `<Counter client:visible … />`). meno-core
+ * itself can't run a framework component, so the editor canvas renders a visible
+ * placeholder — design-time positioning works, interactivity is play/build only.
+ *
+ * The on-disk `.astro` form and the round-trip codec live in `meno-astro`; this
+ * file only models the node so it validates, persists, and renders a placeholder.
+ */
+
+import { z } from 'zod';
+import { createElement as h } from 'react';
+import type { ComponentNode } from '../../types/nodes';
+import { IfConditionSchema } from '../../validation/schemas';
+import { createNodeType } from '../createNodeType';
+import { textField, selectField } from '../fieldPresets';
+
+/**
+ * Client (hydration) directive for an island.
+ * `directive` maps to Astro's `client:*` directive; `value` carries the media
+ * query (`client:media="(max-width: 50em)"`) or the framework name
+ * (`client:only="react"`). When omitted entirely, the island is server-rendered
+ * with no JS (a valid, zero-hydration Astro island).
+ */
+export const IslandClientDirectiveSchema = z
+  .object({
+    directive: z.enum(['load', 'idle', 'visible', 'media', 'only']),
+    value: z.string().optional(),
+  })
+  .passthrough();
+
+// Schema is the SINGLE source of truth
+const IslandNodeSchemaInternal = z
+  .object({
+    type: z.literal('island'),
+    // Path to the framework component file relative to `src/islands/`
+    // (e.g. "Counter.tsx", "widgets/Chart.vue"). The extension derives the
+    // framework, which drives the Astro integration that gets provisioned.
+    src: z.string(),
+    client: IslandClientDirectiveSchema.optional(),
+    props: z.record(z.string(), z.any()).optional(),
+    if: IfConditionSchema.optional(), // Conditional rendering - skip node when false
+    // Slotted children (rendered server-side into the island's <slot/>).
+    children: z.union([z.array(z.any()), z.string()]).optional(),
+  })
+  .passthrough();
+
+// TypeScript type inferred from schema
+export type IslandNode = z.infer<typeof IslandNodeSchemaInternal>;
+
+// Export schema for validation/schemas.ts
+export const IslandNodeSchema = IslandNodeSchemaInternal;
+
+/** Basename of the island source (drops directory + extension) for display. */
+function islandName(src: string): string {
+  const base = src.split('/').pop() ?? src;
+  return base.replace(/\.(tsx|jsx|vue|svelte)$/i, '') || base;
+}
+
+/** Slotted children, normalized to the shape `buildChildren`/`renderChildren` accept. */
+function islandChildren(node: IslandNode): Array<ComponentNode | string> | string | undefined {
+  const { children } = node;
+  if (Array.isArray(children)) return children.length > 0 ? (children as Array<ComponentNode | string>) : undefined;
+  if (typeof children === 'string') return children.length > 0 ? children : undefined;
+  return undefined;
+}
+
+export const IslandNodeType = createNodeType({
+  type: 'island',
+  displayName: 'Island',
+  category: 'special',
+  schema: IslandNodeSchemaInternal,
+
+  defaultValues: {
+    src: '',
+    client: { directive: 'load' },
+  },
+
+  treeDisplay: {
+    icon: 'COMPONENT',
+    getLabel: (node) => `Island: ${islandName(node.src) || '?'}`,
+  },
+
+  editableFields: [
+    textField({ name: 'src', label: 'Island file', required: true, placeholder: 'Counter.tsx' }),
+    selectField({
+      name: 'client.directive',
+      label: 'Hydration',
+      // The empty-value entry clears `client` entirely → a server-rendered island
+      // with zero JS (a valid Astro pattern); the rest map to `client:<directive>`.
+      options: [{ value: '', label: 'None (server-only, no JS)' }, 'load', 'idle', 'visible', 'media', 'only'],
+    }),
+  ],
+
+  // meno-core can't run a framework component. Instead of a loud highlight box
+  // (which made island-heavy pages unreadable), render the island's slotted
+  // children as normal content and fall back to a quiet inline marker when there
+  // are none. The wrapper keeps `data-island` for selection/identification only.
+  // Real hydration is play/build only.
+  clientRenderer: (node, context) => {
+    const children = islandChildren(node);
+    const inner = children
+      ? context.buildChildren(children, context.elementPath)
+      : h('span', { style: { color: '#9ca3af', fontSize: '13px' } }, islandName(node.src) || '?');
+    return h('div', { key: context.key, 'data-island': node.src, style: { display: 'contents' } }, inner);
+  },
+
+  ssrRenderer: (node, context) => {
+    const children = islandChildren(node);
+    const inner = children
+      ? context.renderChildren(children, context)
+      : `<span style="color:#9ca3af;font-size:13px">${escapeHtml(islandName(node.src) || '?')}</span>`;
+    return `<div data-island="${escapeHtml(node.src)}" style="display:contents">${inner}</div>`;
+  },
+
+  capabilities: {
+    canHaveChildren: true,
+    canHaveStyle: false,
+    canHaveAttributes: false,
+    requiresProps: ['src'],
+  },
+});
+
+function escapeHtml(value: string): string {
+  return value.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+}

package/lib/shared/registry/nodeTypes/ListNodeType.ts

@@ -41,14 +41,38 @@ const ListNodeSchemaInternal = z
      * Data source type:
      * - 'prop': Read items from component props (default)
      * - 'collection': Query items from CMS collection
+     * - 'remote': Fetch items from a public HTTP/JSON endpoint at build/SSR time
+     * - 'sanity': Fetch a Sanity document type via GROQ at build/SSR time (read-only, public dataset)
+     * - 'expression': Iterate a verbatim JS expression (`source`) that yields an array — a
+     *   `.map()` over arbitrary frontmatter data (e.g. an Astro Action / supabase query) the
+     *   dialect can't model as a prop/collection. The item template (`children` + `itemAs`) IS
+     *   editable; the source itself is a read-only black box (edit it in the .astro frontmatter).
+     *   The editor has no data for it, so it renders empty in the design canvas (real Astro play
+     *   renders it for real at build/SSR).
      */
-    sourceType: z.enum(['prop', 'collection']).default('prop'),
+    sourceType: z.enum(['prop', 'collection', 'remote', 'sanity', 'expression']).default('prop'),
     /**
-     * Source identifier:
+     * Source identifier (sourceType 'prop'/'collection'/'expression'; 'remote' uses `url`):
      * - For sourceType 'prop': Prop name (e.g., "items") or template expression (e.g., "{{category.items}}")
      * - For sourceType 'collection': Collection name (e.g., "posts", "authors")
+     * - For sourceType 'expression': the verbatim JS expression iterated by `.map()` (e.g. "notes?")
      */
-    source: z.string(),
+    source: z.string().optional(),
+
+    // Remote-only options (sourceType: 'remote')
+    /** HTTP(S) endpoint returning JSON, fetched at build/SSR time (e.g. a public REST API). */
+    url: z.string().optional(),
+    /**
+     * Dot-path into the JSON response to reach the items array (e.g. "data.items").
+     * Empty/absent = the response body is itself the array.
+     */
+    path: z.string().optional(),
+
+    // Sanity-only options (sourceType: 'sanity')
+    /** Sanity document `_type` to fetch (`*[_type == "<documentType>"]`). projectId/dataset come from project config. */
+    documentType: z.string().optional(),
+    /** Field used as the URL slug (for synthesizing item links); defaults to 'slug'. */
+    slugField: z.string().optional(),
     label: z.string().optional(), // Custom label displayed in structure tree
     if: IfConditionSchema.optional(), // Conditional rendering - skip node when false
     /**
@@ -111,8 +135,19 @@ export const ListNodeType = createNodeType({
     getLabel: (node) => {
       const listNode = node as ListNode;
       const sourceType = listNode.sourceType || 'prop';
-      const prefix = sourceType === 'collection' ? 'CMS List' : 'List';
-      return listNode.source ? `${prefix}: ${listNode.source}` : prefix;
+      const prefix =
+        sourceType === 'collection'
+          ? 'CMS List'
+          : sourceType === 'remote'
+            ? 'Remote List'
+            : sourceType === 'sanity'
+              ? 'Sanity List'
+              : sourceType === 'expression'
+                ? 'Loop'
+                : 'List';
+      const src =
+        sourceType === 'remote' ? listNode.url : sourceType === 'sanity' ? listNode.documentType : listNode.source;
+      return src ? `${prefix}: ${src}` : prefix;
     },
   },
 
@@ -132,7 +167,8 @@ export const ListNodeType = createNodeType({
         key: context.key,
         'data-list': 'true',
         'data-source-type': sourceType,
-        'data-source': listNode.source,
+        'data-source':
+          sourceType === 'remote' ? listNode.url : sourceType === 'sanity' ? listNode.documentType : listNode.source,
         style: {
           padding: '8px 12px',
           background: bgColor,
@@ -162,7 +198,7 @@ export const ListNodeType = createNodeType({
       label: 'Source Type',
       type: 'select',
       required: false,
-      options: ['prop', 'collection'],
+      options: ['prop', 'collection', 'remote', 'sanity'],
     },
     {
       name: 'source',