@json-render/vue 0.20.0 → 0.21.1

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import {
   schema
-} from "./chunk-F4CKBTOP.mjs";
+} from "./chunk-34A2QV2X.mjs";
 
 // src/composables/state.ts
 import {
@@ -1276,6 +1276,7 @@ import {
   isDevtoolsActive,
   subscribeDevtoolsActive
 } from "@json-render/core";
+var registryMetadata = /* @__PURE__ */ new WeakMap();
 var EMPTY_FUNCTIONS = {};
 var FUNCTIONS_KEY = /* @__PURE__ */ Symbol("json-render:functions");
 var FunctionsProvider = defineComponent6({
@@ -1500,18 +1501,28 @@ var ElementRenderer = defineComponent6({
         );
         return null;
       }
-      const childrenVNodes = resolvedElement.repeat ? h2(RepeatChildren, {
-        element: resolvedElement,
-        spec: props.spec,
-        registry: props.registry,
-        loading: props.loading,
-        fallback: props.fallback
-      }) : resolvedElement.children?.map((childKey) => {
+      const metadata = registryMetadata.get(props.registry)?.[resolvedElement.type];
+      if (resolvedElement.slots && metadata?.slots) {
+        const availableSlots = new Set(metadata.slots);
+        for (const slotName of Object.keys(resolvedElement.slots)) {
+          if (slotName === "default") {
+            console.warn(
+              `[json-render] Component "${resolvedElement.type}" uses slots.default. Use "children" for default slot content.`
+            );
+          } else if (!availableSlots.has(slotName)) {
+            console.warn(
+              `[json-render] Unknown slot "${slotName}" on component "${resolvedElement.type}". Available slots: ${metadata.slots.join(", ")}`
+            );
+          }
+        }
+      }
+      const renderChildKeys = (childKeys, slotName) => childKeys.map((childKey) => {
         const childElement = props.spec.elements[childKey];
         if (!childElement) {
           if (!props.loading) {
+            const location = slotName ? `in slot "${slotName}" of "${resolvedElement.type}"` : `as child of "${resolvedElement.type}"`;
             console.warn(
-              `[json-render] Missing element "${childKey}" referenced as child of "${resolvedElement.type}". This element will not render.`
+              `[json-render] Missing element "${childKey}" referenced ${location}. This element will not render.`
             );
           }
           return null;
@@ -1525,7 +1536,20 @@ var ElementRenderer = defineComponent6({
           loading: props.loading,
           fallback: props.fallback
         });
-      }).filter((n) => n !== null) ?? void 0;
+      }).filter((node) => node !== null);
+      const childrenVNodes = resolvedElement.repeat ? h2(RepeatChildren, {
+        element: resolvedElement,
+        spec: props.spec,
+        registry: props.registry,
+        loading: props.loading,
+        fallback: props.fallback
+      }) : resolvedElement.children ? renderChildKeys(resolvedElement.children) : void 0;
+      const namedSlots = resolvedElement.slots ? Object.fromEntries(
+        Object.entries(resolvedElement.slots).filter(([slotName]) => slotName !== "default").map(([slotName, childKeys]) => [
+          slotName,
+          () => renderChildKeys(childKeys, slotName)
+        ])
+      ) : {};
       const componentVNode = h2(
         Component,
         {
@@ -1535,7 +1559,7 @@ var ElementRenderer = defineComponent6({
           bindings: elementBindings,
           loading: props.loading
         },
-        { default: () => childrenVNodes }
+        { default: () => childrenVNodes, ...namedSlots }
       );
       const tagged = devtoolsActive.value && props.elementKey ? h2(
         "span",
@@ -1764,7 +1788,7 @@ var JSONUIProvider = defineComponent6({
     );
   }
 });
-function defineRegistry(_catalog, options) {
+function defineRegistry(catalog, options) {
   const registry = {};
   if (options.components) {
     for (const [name, componentFn] of Object.entries(options.components)) {
@@ -1796,6 +1820,7 @@ function defineRegistry(_catalog, options) {
           return () => componentFn({
             props: registryProps.element.props,
             children: slots.default?.(),
+            slots,
             emit: registryProps.emit,
             on: registryProps.on,
             bindings: registryProps.bindings,
@@ -1805,6 +1830,10 @@ function defineRegistry(_catalog, options) {
       });
     }
   }
+  const catalogComponents = catalog.data?.components;
+  if (catalogComponents) {
+    registryMetadata.set(registry, catalogComponents);
+  }
   const actionMap = options.actions ? Object.entries(options.actions) : [];
   const handlers = (getSetState, getState) => {
     const result = {};
@@ -1831,6 +1860,10 @@ function defineRegistry(_catalog, options) {
 }
 function createRenderer(catalog, components) {
   const registry = components;
+  const catalogComponents = catalog.data.components;
+  if (catalogComponents) {
+    registryMetadata.set(registry, catalogComponents);
+  }
   return defineComponent6({
     name: "CatalogRenderer",
     props: {