@dmitryvim/form-builder 0.2.14 → 0.2.16

package/dist/cjs/index.cjs

@@ -1589,8 +1589,7 @@ function renderLocalVideoPreview(container, file, videoType, resourceId, state,
   }
   newContainer.innerHTML = `
     <div class="relative group h-full">
-      <video class="w-full h-full object-contain" controls preload="auto" muted>
-        <source src="${videoUrl}" type="${videoType}">
+      <video class="w-full h-full object-contain" controls preload="auto" muted src="${videoUrl}">
         ${escapeHtml(t("videoNotSupported", state))}
       </video>
       <div class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity z-10 flex gap-1">
@@ -1652,16 +1651,13 @@ function handleVideoDelete(container, resourceId, state, deps) {
     </div>
   `;
 }
-function renderUploadedVideoPreview(container, thumbnailUrl, videoType, state) {
+function renderUploadedVideoPreview(container, thumbnailUrl, _videoType, state) {
   const video = document.createElement("video");
   video.className = "w-full h-full object-contain";
   video.controls = true;
   video.preload = "metadata";
   video.muted = true;
-  const source = document.createElement("source");
-  source.src = thumbnailUrl;
-  source.type = videoType;
-  video.appendChild(source);
+  video.src = thumbnailUrl;
   video.appendChild(
     document.createTextNode(t("videoNotSupported", state))
   );
@@ -1813,8 +1809,7 @@ async function renderFilePreviewReadonly(resourceId, state, fileName) {
         if (videoUrl) {
           previewContainer.innerHTML = `
             <div class="relative group">
-              <video class="w-full h-auto" controls preload="auto" muted>
-                <source src="${videoUrl}" type="${(meta == null ? void 0 : meta.type) || "video/mp4"}">
+              <video class="w-full h-auto" controls preload="auto" muted src="${videoUrl}">
                 ${escapeHtml(t("videoNotSupported", state))}
               </video>
               <div class="absolute inset-0 bg-black bg-opacity-20 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center pointer-events-none">
@@ -2038,8 +2033,7 @@ async function renderThumbnailForResource(slot, rid, meta, state) {
       const videoUrl = URL.createObjectURL(meta.file);
       slot.innerHTML = `
         <div class="relative group h-full w-full">
-          <video class="w-full h-full object-contain" preload="metadata" muted>
-            <source src="${videoUrl}" type="${meta.type}">
+          <video class="w-full h-full object-contain" preload="metadata" muted src="${videoUrl}">
           </video>
           <div class="absolute inset-0 bg-black bg-opacity-30 flex items-center justify-center">
             <div class="bg-white bg-opacity-90 rounded-full p-1">
@@ -2056,8 +2050,7 @@ async function renderThumbnailForResource(slot, rid, meta, state) {
         if (videoUrl) {
           slot.innerHTML = `
             <div class="relative group h-full w-full">
-              <video class="w-full h-full object-contain" preload="metadata" muted>
-                <source src="${videoUrl}" type="${meta.type}">
+              <video class="w-full h-full object-contain" preload="metadata" muted src="${videoUrl}">
               </video>
               <div class="absolute inset-0 bg-black bg-opacity-30 flex items-center justify-center">
                 <div class="bg-white bg-opacity-90 rounded-full p-1">
@@ -3746,6 +3739,18 @@ function updateSliderField(element, fieldPath, value, context) {
 }
 
 // src/components/container.ts
+function extractChildDefaults(elements) {
+  const defaults = {};
+  for (const child of elements) {
+    if ("default" in child && child.default !== void 0) {
+      defaults[child.key] = child.default;
+    }
+  }
+  return defaults;
+}
+function mergeWithDefaults(prefill, defaults) {
+  return { ...defaults, ...prefill };
+}
 function extractRootFormData(formRoot) {
   const data = {};
   const inputs = formRoot.querySelectorAll(
@@ -3821,10 +3826,13 @@ function renderSingleContainerElement(element, ctx, wrapper, pathKey) {
       containerWrap.appendChild(hintsElement);
     }
   }
+  const childDefaults = extractChildDefaults(element.elements);
+  const containerPrefill = ((_a = ctx.prefill) == null ? void 0 : _a[element.key]) || {};
+  const mergedPrefill = mergeWithDefaults(containerPrefill, childDefaults);
   const subCtx = {
     path: pathJoin(ctx.path, element.key),
-    prefill: ((_a = ctx.prefill) == null ? void 0 : _a[element.key]) || {},
-    // Sliced data for value population
+    prefill: mergedPrefill,
+    // Merged prefill with defaults for enableIf evaluation
     formData: (_b = ctx.formData) != null ? _b : ctx.prefill,
     // Complete root data for enableIf evaluation
     state: ctx.state
@@ -3855,6 +3863,7 @@ function renderMultipleContainerElement(element, ctx, wrapper, _pathKey) {
   const min = (_a = element.minCount) != null ? _a : 0;
   const max = (_b = element.maxCount) != null ? _b : Infinity;
   const pre = Array.isArray((_c = ctx.prefill) == null ? void 0 : _c[element.key]) ? ctx.prefill[element.key] : null;
+  const childDefaults = extractChildDefaults(element.elements);
   const countItems = () => itemsWrap.querySelectorAll(":scope > .containerItem").length;
   const createAddButton = () => {
     const add = document.createElement("button");
@@ -3881,7 +3890,8 @@ function renderMultipleContainerElement(element, ctx, wrapper, _pathKey) {
         const subCtx = {
           state: ctx.state,
           path: pathJoin(ctx.path, `${element.key}[${idx}]`),
-          prefill: {},
+          prefill: childDefaults,
+          // Defaults for enableIf evaluation
           formData: currentFormData
           // Current root data from DOM for enableIf
         };
@@ -3945,10 +3955,12 @@ function renderMultipleContainerElement(element, ctx, wrapper, _pathKey) {
   if (pre && Array.isArray(pre)) {
     pre.forEach((prefillObj, idx) => {
       var _a2;
+      const mergedPrefill = mergeWithDefaults(prefillObj || {}, childDefaults);
       const subCtx = {
         state: ctx.state,
         path: pathJoin(ctx.path, `${element.key}[${idx}]`),
-        prefill: prefillObj || {},
+        prefill: mergedPrefill,
+        // Merged prefill with defaults for enableIf
         formData: (_a2 = ctx.formData) != null ? _a2 : ctx.prefill
         // Complete root data for enableIf
       };
@@ -4000,7 +4012,8 @@ function renderMultipleContainerElement(element, ctx, wrapper, _pathKey) {
       const subCtx = {
         state: ctx.state,
         path: pathJoin(ctx.path, `${element.key}[${idx}]`),
-        prefill: {},
+        prefill: childDefaults,
+        // Defaults for enableIf evaluation
         formData: (_d = ctx.formData) != null ? _d : ctx.prefill
         // Complete root data for enableIf
       };
@@ -4355,13 +4368,14 @@ if (typeof document !== "undefined") {
   });
 }
 function shouldDisableElement(element, ctx) {
-  var _a, _b;
+  var _a, _b, _c;
   if (!element.enableIf) {
     return false;
   }
   try {
     const rootFormData = (_b = (_a = ctx.formData) != null ? _a : ctx.prefill) != null ? _b : {};
-    const containerData = ctx.path ? getValueByPath(rootFormData, ctx.path) : void 0;
+    const scope = (_c = element.enableIf.scope) != null ? _c : "relative";
+    const containerData = scope === "relative" && ctx.path ? ctx.prefill : void 0;
     const shouldEnable = evaluateEnableCondition(
       element.enableIf,
       rootFormData,