@processmaker/screen-builder 3.8.9 → 3.8.11

package/dist/vue-form-builder.es.js

@@ -14049,12 +14049,13 @@ const Fb = /* @__PURE__ */ Pr(YO), kr = typeof window > "u" ? global : window, J
     return {};
   },
   methods: {
-    loadFormDynamicPanelProperties({ properties: t, element: e }) {
-      const r = e.config.settings.varname, i = e.config.settings.indexName;
-      t[":itemData"] = `${r} && ${r}[${i}]`, e.config.settings.emptyStateMessage && (t[":emptyStateMessage"] = this.byRef(e.config.settings.emptyStateMessage)), t[":validationData"] = "getValidationData()", this.registerVariable(e.config.settings.varname, e);
-    },
-    loadFormDynamicPanelItems({ element: t, node: e, definition: r }) {
-      const i = {
+    /**
+     * Builds the nested configuration for dynamic panel items
+     * @param {Object} element - The dynamic panel element
+     * @returns {Object} The nested configuration
+     */
+    buildNestedConfig(t) {
+      return {
         config: [
           {
             items: t.items
@@ -14062,16 +14063,102 @@ const Fb = /* @__PURE__ */ Pr(YO), kr = typeof window > "u" ? global : window, J
         ],
         watchers: [],
         isMobile: !1
-      }, a = t.config.settings.varname, n = t.config.settings.indexName, s = this.createComponent("ScreenRenderer", {
-        ":definition": this.byRef(i),
-        ":value": `${a} && ${a}[${n}]`,
-        ":loop-context": `'${a} && ${a}[${n}]'`,
+      };
+    },
+    /**
+     * Creates expressions for value and loop context based on index availability
+     * @param {string} variableName - The variable name
+     * @param {string} index - The index name
+     * @returns {Object} Object containing valueExpression and loopContextExpression
+     */
+    buildExpressions(t, e) {
+      return e && e.trim() ? {
+        valueExpression: `${t} && ${t}[${e}]`,
+        loopContextExpression: `'${t} && ${t}[${e}]'`
+      } : {
+        valueExpression: t,
+        loopContextExpression: `'${t}'`
+      };
+    },
+    /**
+     * Creates a ScreenRenderer component for the dynamic panel
+     * @param {Object} nested - The nested configuration
+     * @param {string} valueExpression - The value expression
+     * @param {string} loopContextExpression - The loop context expression
+     * @param {Object} definition - The definition object
+     * @returns {Object} The created component
+     */
+    createScreenRenderer(t, e, r, i) {
+      return this.createComponent("ScreenRenderer", {
+        ":definition": this.byRef(t),
+        ":value": e,
+        ":loop-context": r,
         ":_parent": "getValidationData()",
         ":components": this.byRef(this.components),
-        ":config-ref": this.byRef(this.configRef || r.config),
+        ":config-ref": this.byRef(this.configRef || i.config),
         "@submit": "submitForm"
       });
-      e.appendChild(s);
+    },
+    /**
+     * Builds the itemData property based on variable name and index
+     * @param {string} variableName - The variable name
+     * @param {string} index - The index name
+     * @returns {string} The itemData expression
+     */
+    buildItemDataExpression(t, e) {
+      return e && e.trim() ? `${t} && ${t}[${e}]` : t;
+    },
+    /**
+     * Gets a helpful empty state message based on whether index is configured
+     * @param {string} index - The index name
+     * @param {string} customMessage - Custom message from settings
+     * @returns {string} The appropriate empty state message
+     */
+    getEmptyStateMessage(t, e) {
+      return e || (!t || !t.trim() ? (console.warn("FormDynamicPanel: No Index Name configured. The dynamic panel will not function properly without an index."), "No data available. Please configure an Index Name for this dynamic panel.") : "No data available for this dynamic panel.");
+    },
+    /**
+     * Validates that required settings are present
+     * @param {Object} element - The dynamic panel element
+     * @returns {boolean} True if valid, false otherwise
+     */
+    validateElementSettings(t) {
+      return !t.config || !t.config.settings ? (console.warn("FormDynamicPanel: Missing config or settings"), !1) : t.config.settings.varname ? !0 : (console.warn("FormDynamicPanel: Missing varname setting"), !1);
+    },
+    /**
+     * Safely extracts settings from element with validation
+     * @param {Object} element - The dynamic panel element
+     * @returns {Object|null} Settings object or null if invalid
+     */
+    extractValidatedSettings(t) {
+      return this.validateElementSettings(t) ? {
+        variableName: t.config.settings.varname,
+        index: t.config.settings.indexName || "",
+        emptyStateMessage: t.config.settings.emptyStateMessage
+      } : null;
+    },
+    /**
+     * Loads the properties for the FormDynamicPanel
+     * @param {Object} params - The parameters object
+     */
+    loadFormDynamicPanelProperties({ properties: t, element: e }) {
+      const r = this.extractValidatedSettings(e);
+      if (!r)
+        return;
+      t[":itemData"] = this.buildItemDataExpression(r.variableName, r.index);
+      const i = this.getEmptyStateMessage(r.index, r.emptyStateMessage);
+      t[":emptyStateMessage"] = this.byRef(i), t[":validationData"] = "getValidationData()", this.registerVariable(r.variableName, e);
+    },
+    /**
+     * Loads the items for the FormDynamicPanel
+     * @param {Object} params - The parameters object
+     */
+    loadFormDynamicPanelItems({ element: t, node: e, definition: r }) {
+      const i = this.extractValidatedSettings(t);
+      if (!i)
+        return;
+      const a = this.buildNestedConfig(t), { valueExpression: n, loopContextExpression: s } = this.buildExpressions(i.variableName, i.index), o = this.createScreenRenderer(a, n, s, r);
+      e.appendChild(o);
     }
   },
   mounted() {
@@ -47000,7 +47087,7 @@ const G_ = {
   ],
   computed: {
     classColor() {
-      return this.variantStyle === "link" ? `text-${this.variant}` : `btn btn-${this.variant}`;
+      return this.variantStyle === "button" ? `btn btn-${this.variant}` : `text-${this.variant}`;
     }
   }
 };
@@ -47013,7 +47100,7 @@ var Y_ = function() {
   Q_,
   !1,
   null,
-  "8414cd47",
+  "c0b7067a",
   null,
   null
 );
@@ -53132,7 +53219,7 @@ const gie = Ru(hie), rne = Ru(mie), ine = Ru([pie]), bie = Ru([gS, vS]), yie = v
           varname: "dynamic_panel",
           indexName: "",
           add: !1,
-          emptyStateMessage: "No data available for this dynamic panel"
+          emptyStateMessage: "No data available. Please configure an Index Name for this dynamic panel."
         }
       },
       inspector: [