@pitcher/canvas-ui 2025.12.11-121707 → 2025.12.11-122950-beta

package/canvas-ui.js

@@ -141647,61 +141647,88 @@ const _hoisted_40$3 = { class: "block mb-1 text-sm" };
 const _hoisted_41$3 = { key: 0 };
 const _hoisted_42$3 = { class: "block mb-1 text-sm" };
 const _hoisted_43$3 = ["onClick"];
-const _hoisted_44$3 = { class: "p-4 min-w-[400px] max-h-[400px] overflow-auto" };
-const _hoisted_45$3 = { class: "text-sm mb-2" };
-const _hoisted_46$3 = ["onClick"];
-const _hoisted_47$3 = { class: "p-4 min-w-[400px] max-h-[400px] overflow-auto" };
-const _hoisted_48$3 = { class: "text-sm mb-2" };
-const _hoisted_49$3 = { class: "flex justify-center mt-2" };
-const _hoisted_50$3 = { class: "text-sm font-semibold mb-3 mt-6 text-gray-600 dark:text-gray-400 uppercase tracking-wide border-t border-gray-200 dark:border-gray-700 pt-6" };
-const _hoisted_51$2 = { class: "mb-4" };
-const _hoisted_52$2 = { class: "block mb-2" };
-const _hoisted_53$2 = { class: "mb-4" };
-const _hoisted_54$1 = { class: "block mb-2" };
-const _hoisted_55$1 = { class: "mb-4" };
-const _hoisted_56$1 = { class: "block mb-2" };
-const _hoisted_57$1 = { class: "mb-4" };
-const _hoisted_58$1 = { class: "block mb-2" };
-const _hoisted_59$1 = {
+const _hoisted_44$3 = { class: "p-4 min-w-[400px] max-h-[400px]" };
+const _hoisted_45$3 = { class: "flex gap-4 h-full" };
+const _hoisted_46$3 = { class: "flex-1 flex flex-col" };
+const _hoisted_47$3 = { class: "text-sm mb-2" };
+const _hoisted_48$3 = { class: "overflow-auto" };
+const _hoisted_49$3 = {
+  key: 0,
+  class: "flex-1 border-l pl-4"
+};
+const _hoisted_50$3 = { class: "text-sm font-medium mb-2" };
+const _hoisted_51$2 = { class: "flex flex-col gap-2" };
+const _hoisted_52$2 = { class: "block mb-1 text-sm" };
+const _hoisted_53$2 = { class: "block mb-1 text-sm" };
+const _hoisted_54$1 = { class: "block mb-1 text-sm" };
+const _hoisted_55$1 = { key: 0 };
+const _hoisted_56$1 = { class: "block mb-1 text-sm" };
+const _hoisted_57$1 = ["onClick"];
+const _hoisted_58$1 = { class: "p-4 min-w-[400px] max-h-[400px]" };
+const _hoisted_59$1 = { class: "flex gap-4 h-full" };
+const _hoisted_60$1 = { class: "flex-1 flex flex-col" };
+const _hoisted_61$1 = { class: "text-sm mb-2" };
+const _hoisted_62$1 = { class: "overflow-auto" };
+const _hoisted_63$1 = {
+  key: 0,
+  class: "flex-1 border-l pl-4"
+};
+const _hoisted_64$1 = { class: "text-sm font-medium mb-2" };
+const _hoisted_65$1 = { class: "flex flex-col gap-2" };
+const _hoisted_66$1 = { class: "block mb-1 text-sm" };
+const _hoisted_67$1 = { class: "block mb-1 text-sm" };
+const _hoisted_68$1 = { class: "block mb-1 text-sm" };
+const _hoisted_69 = { class: "block mb-1 text-sm" };
+const _hoisted_70 = { class: "flex justify-center mt-2" };
+const _hoisted_71 = { class: "text-sm font-semibold mb-3 mt-6 text-gray-600 dark:text-gray-400 uppercase tracking-wide border-t border-gray-200 dark:border-gray-700 pt-6" };
+const _hoisted_72 = { class: "mb-4" };
+const _hoisted_73 = { class: "block mb-2" };
+const _hoisted_74 = { class: "mb-4" };
+const _hoisted_75 = { class: "block mb-2" };
+const _hoisted_76 = { class: "mb-4" };
+const _hoisted_77 = { class: "block mb-2" };
+const _hoisted_78 = { class: "mb-4" };
+const _hoisted_79 = { class: "block mb-2" };
+const _hoisted_80 = {
   key: 2,
   class: "mb-4"
 };
-const _hoisted_60$1 = { class: "block mb-2" };
-const _hoisted_61$1 = {
+const _hoisted_81 = { class: "block mb-2" };
+const _hoisted_82 = {
   key: 3,
   class: "mb-4"
 };
-const _hoisted_62$1 = { class: "block mb-2" };
-const _hoisted_63$1 = { class: "mb-4" };
-const _hoisted_64$1 = { class: "block mb-2" };
-const _hoisted_65$1 = { class: "mb-4" };
-const _hoisted_66$1 = { class: "block mb-2" };
-const _hoisted_67$1 = { class: "mb-4" };
-const _hoisted_68$1 = { class: "block mb-2" };
-const _hoisted_69 = { class: "flex items-center gap-2" };
-const _hoisted_70 = { class: "text-sm text-gray-500" };
-const _hoisted_71 = { class: "mb-4" };
-const _hoisted_72 = { class: "block mb-2" };
-const _hoisted_73 = { class: "flex flex-col gap-2" };
-const _hoisted_74 = { class: "flex items-center gap-2" };
-const _hoisted_75 = { class: "text-sm" };
-const _hoisted_76 = { class: "text-sm" };
-const _hoisted_77 = { class: "flex items-center gap-2" };
-const _hoisted_78 = { class: "text-sm" };
-const _hoisted_79 = { class: "mb-4" };
-const _hoisted_80 = { class: "block mb-2" };
-const _hoisted_81 = { class: "flex flex-col gap-3" };
-const _hoisted_82 = { class: "flex items-center gap-2" };
-const _hoisted_83 = { class: "text-sm w-16" };
-const _hoisted_84 = { class: "flex items-center gap-2" };
-const _hoisted_85 = { class: "text-sm w-16" };
-const _hoisted_86 = { class: "cb-data-charts-settings__preview flex-1 border-l border-[#eee] pl-4" };
-const _hoisted_87 = { class: "text-sm font-medium mb-4" };
-const _hoisted_88 = {
+const _hoisted_83 = { class: "block mb-2" };
+const _hoisted_84 = { class: "mb-4" };
+const _hoisted_85 = { class: "block mb-2" };
+const _hoisted_86 = { class: "mb-4" };
+const _hoisted_87 = { class: "block mb-2" };
+const _hoisted_88 = { class: "mb-4" };
+const _hoisted_89 = { class: "block mb-2" };
+const _hoisted_90 = { class: "flex items-center gap-2" };
+const _hoisted_91 = { class: "text-sm text-gray-500" };
+const _hoisted_92 = { class: "mb-4" };
+const _hoisted_93 = { class: "block mb-2" };
+const _hoisted_94 = { class: "flex flex-col gap-2" };
+const _hoisted_95 = { class: "flex items-center gap-2" };
+const _hoisted_96 = { class: "text-sm" };
+const _hoisted_97 = { class: "text-sm" };
+const _hoisted_98 = { class: "flex items-center gap-2" };
+const _hoisted_99 = { class: "text-sm" };
+const _hoisted_100 = { class: "mb-4" };
+const _hoisted_101 = { class: "block mb-2" };
+const _hoisted_102 = { class: "flex flex-col gap-3" };
+const _hoisted_103 = { class: "flex items-center gap-2" };
+const _hoisted_104 = { class: "text-sm w-16" };
+const _hoisted_105 = { class: "flex items-center gap-2" };
+const _hoisted_106 = { class: "text-sm w-16" };
+const _hoisted_107 = { class: "cb-data-charts-settings__preview flex-1 border-l border-[#eee] pl-4" };
+const _hoisted_108 = { class: "text-sm font-medium mb-4" };
+const _hoisted_109 = {
   class: "preview-container",
   style: { "height": "300px" }
 };
-const _hoisted_89 = { class: "flex justify-between gap-4" };
+const _hoisted_110 = { class: "flex justify-between gap-4" };
 const _sfc_main$2E = /* @__PURE__ */ defineComponent({
   __name: "DataCharts.settings",
   props: {
@@ -141946,6 +141973,46 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
     function isArrayOrObject(value) {
       return Array.isArray(value) || typeof value === "object" && value !== null;
     }
+    function parsePathIntoParts(path) {
+      const parts = [];
+      let current = "";
+      for (let i = 0; i < path.length; i++) {
+        const char = path[i];
+        if (char === ".") {
+          if (current) {
+            parts.push(current);
+            current = "";
+          }
+        } else if (char === "[") {
+          if (current) {
+            parts.push(current);
+            current = "";
+          }
+          const closingIdx = path.indexOf("]", i);
+          if (closingIdx !== -1) {
+            parts.push(path.substring(i, closingIdx + 1));
+            i = closingIdx;
+          }
+        } else {
+          current += char;
+        }
+      }
+      if (current) {
+        parts.push(current);
+      }
+      return parts;
+    }
+    function convertBracketsToDotsPath(path) {
+      if (!path) return "";
+      if (!path.includes("[")) return path;
+      const convertedPath = path.replace(/\[(\d+)\]/g, ".$1");
+      return convertedPath.startsWith(".") ? convertedPath.slice(1) : convertedPath;
+    }
+    function generateHandlebarsExpression(path) {
+      if (!path) return "";
+      const cleanPath = convertBracketsToDotsPath(path);
+      return `{{${cleanPath}}}`;
+    }
     function getFieldOptions(data) {
       if (!data || typeof data !== "object") return [];
       const firstItem = Array.isArray(data) ? data[0] : data;
@@ -141963,8 +142030,15 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
       if (!path) {
         return;
       }
-      point.label = `{{#each ${path}}}{{lookup this "${point.arrayConfig.labelField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
-      point.value = `{{#each ${path}}}{{lookup this "${point.arrayConfig.valueField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
+      const isArray = Array.isArray(point.selectedValue);
+      if (isArray) {
+        point.label = `{{#each ${path}}}{{lookup this "${point.arrayConfig.labelField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
+        point.value = `{{#each ${path}}}{{lookup this "${point.arrayConfig.valueField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
+      } else {
+        const cleanPath = convertBracketsToDotsPath(path);
+        point.label = `{{${cleanPath}.${point.arrayConfig.labelField}}}`;
+        point.value = `{{${cleanPath}.${point.arrayConfig.valueField}}}`;
+      }
       point.dynamicValue = {
         path,
         value: point.value
@@ -141972,20 +142046,53 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
       closePopover();
     }
     function updateXYDynamicValueExpression(point) {
-      if (!point.selectedXValue || !point.arrayConfig?.labelField || !point.arrayConfig?.xField || !point.arrayConfig?.yField) {
+      if (!point.arrayConfig?.labelField || !point.arrayConfig?.xField || !point.arrayConfig?.yField) {
         return;
       }
       const isBubble = isActiveSeriesXYRChart.value;
       if (isBubble && !point.arrayConfig?.rField) {
         return;
       }
-      const path = point.dynamicXValue?.path;
-      if (!path) {
+      let selectedValue = null;
+      let path = void 0;
+      if (point.selectedXValue && isArrayOrObject(point.selectedXValue)) {
+        selectedValue = point.selectedXValue;
+        path = point.dynamicXValue?.path;
+      } else if (point.selectedYValue && isArrayOrObject(point.selectedYValue)) {
+        selectedValue = point.selectedYValue;
+        path = point.dynamicYValue?.path;
+      } else if (point.selectedRValue && isArrayOrObject(point.selectedRValue)) {
+        selectedValue = point.selectedRValue;
+        path = point.dynamicRValue?.path;
+      }
+      if (!selectedValue || !path) {
         return;
       }
-      point.label = `{{#each ${path}}}{{lookup this "${point.arrayConfig.labelField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
-      point.xValue = `{{#each ${path}}}{{lookup this "${point.arrayConfig.xField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
-      point.yValue = `{{#each ${path}}}{{lookup this "${point.arrayConfig.yField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
+      const isArray = Array.isArray(selectedValue);
+      if (isArray) {
+        point.label = `{{#each ${path}}}{{lookup this "${point.arrayConfig.labelField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
+        point.xValue = `{{#each ${path}}}{{lookup this "${point.arrayConfig.xField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
+        point.yValue = `{{#each ${path}}}{{lookup this "${point.arrayConfig.yField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
+        if (isBubble && point.arrayConfig.rField) {
+          point.rValue = `{{#each ${path}}}{{lookup this "${point.arrayConfig.rField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
+          point.dynamicRValue = {
+            path,
+            value: point.rValue
+          };
+        }
+      } else {
+        const cleanPath = convertBracketsToDotsPath(path);
+        point.label = `{{${cleanPath}.${point.arrayConfig.labelField}}}`;
+        point.xValue = `{{${cleanPath}.${point.arrayConfig.xField}}}`;
+        point.yValue = `{{${cleanPath}.${point.arrayConfig.yField}}}`;
+        if (isBubble && point.arrayConfig.rField) {
+          point.rValue = `{{${cleanPath}.${point.arrayConfig.rField}}}`;
+          point.dynamicRValue = {
+            path,
+            value: point.rValue
+          };
+        }
+      }
       point.dynamicXValue = {
         path,
         value: point.xValue
@@ -141994,37 +142101,40 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
         path,
         value: point.yValue
       };
-      if (isBubble && point.arrayConfig.rField) {
-        point.rValue = `{{#each ${path}}}{{lookup this "${point.arrayConfig.rField}"}}{{#unless @last}},{{/unless}}{{/each}}`;
-        point.dynamicRValue = {
-          path,
-          value: point.rValue
-        };
-      }
       closePopover();
     }
     const dynamicValueTreeData = computed(() => {
-      function processObject(obj, path = []) {
+      function buildPathString(pathParts) {
+        return pathParts.reduce((acc, part, index) => {
+          if (part.startsWith("[")) {
+            return acc + part;
+          }
+          return index === 0 ? part : `${acc}.${part}`;
+        }, "");
+      }
+      function processObject(obj, pathParts = []) {
         const result = [];
         for (const key in obj) {
           if (key === "[[Prototype]]") continue;
           const value = obj[key];
-          const currentPath = [...path, key];
-          const pathString = currentPath.join(".");
+          const currentPathParts = [...pathParts, key];
+          const pathString = buildPathString(currentPathParts);
           if (Array.isArray(value)) {
             const arrayNode = {
               key: pathString,
               label: key,
               children: value.map((item, index) => {
+                const arrayItemPath = [...currentPathParts.slice(0, -1), `${key}[${index}]`];
+                const arrayItemPathString = buildPathString(arrayItemPath);
                 if (typeof item === "object" && item !== null) {
                   return {
-                    key: `${pathString}[${index}]`,
+                    key: arrayItemPathString,
                     label: `[${index}]`,
-                    children: processObject(item, [...currentPath, `[${index}]`])
+                    children: processObject(item, arrayItemPath)
                   };
                 }
                 return {
-                  key: `${pathString}[${index}]`,
+                  key: arrayItemPathString,
                   label: `[${index}]: ${item}`,
                   isLeaf: true
                 };
@@ -142035,7 +142145,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
             result.push({
               key: pathString,
               label: key,
-              children: processObject(value, currentPath)
+              children: processObject(value, currentPathParts)
             });
           } else {
             result.push({
@@ -142061,25 +142171,18 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
           point.selectedValue = void 0;
           point.dynamicValue = void 0;
           point.arrayConfig = void 0;
-          point.value = "";
         } else if (field === "x") {
           point.selectedXValue = void 0;
           point.dynamicXValue = void 0;
-          point.dynamicYValue = void 0;
-          point.dynamicRValue = void 0;
           point.arrayConfig = void 0;
-          point.xValue = "";
-          point.yValue = "";
-          point.rValue = "";
-          point.label = "";
         } else if (field === "y") {
           point.selectedYValue = void 0;
           point.dynamicYValue = void 0;
-          point.yValue = "";
+          point.arrayConfig = void 0;
         } else if (field === "r") {
           point.selectedRValue = void 0;
           point.dynamicRValue = void 0;
-          point.rValue = "";
+          point.arrayConfig = void 0;
         }
         activePopoverPoint.value = point;
         activePopoverField.value = field;
@@ -142108,14 +142211,13 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
         closePopover();
         return;
       }
-      const pathParts = selectedKey.split(/\.(?![^[]*])/) || [];
+      const pathParts = parsePathIntoParts(selectedKey);
       let currentValue = crmShape.value;
       for (const part of pathParts) {
         if (!currentValue) break;
-        if (part.includes("[") && part.includes("]")) {
-          const arrayPath = part.split("[")[0];
-          const index = parseInt(part.split("[")[1].split("]")[0]);
-          currentValue = currentValue?.[arrayPath]?.[index];
+        if (part.startsWith("[") && part.endsWith("]")) {
+          const index = parseInt(part.slice(1, -1));
+          currentValue = currentValue?.[index];
         } else {
           currentValue = currentValue?.[part];
         }
@@ -142136,19 +142238,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
           };
           return;
         }
-        const rootPart = pathParts[0];
-        let expression = "";
-        if (pathParts.length === 1) {
-          expression = `{{${rootPart}}}`;
-        } else {
-          const restOfPath = pathParts.slice(1).map((part) => {
-            if (part.includes("[") && part.includes("]")) {
-              return part.split("[")[1].split("]")[0];
-            }
-            return part;
-          });
-          expression = `{{lookup (lookup ${rootPart} ${restOfPath[0]}) "${restOfPath[1]}"}}`;
-        }
+        const expression = generateHandlebarsExpression(selectedKey);
         point.dynamicXValue = { path: selectedKey, value: expression };
         point.xValue = expression;
         closePopover();
@@ -142156,19 +142246,21 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
       }
       if (field === "y") {
         point.selectedYValue = currentValue;
-        const rootPart = pathParts[0];
-        let expression = "";
-        if (pathParts.length === 1) {
-          expression = `{{${rootPart}}}`;
-        } else {
-          const restOfPath = pathParts.slice(1).map((part) => {
-            if (part.includes("[") && part.includes("]")) {
-              return part.split("[")[1].split("]")[0];
-            }
-            return part;
-          });
-          expression = `{{lookup (lookup ${rootPart} ${restOfPath[0]}) "${restOfPath[1]}"}}`;
+        if (Array.isArray(currentValue) || typeof currentValue === "object" && currentValue !== null) {
+          point.arrayConfig = {
+            labelField: "",
+            valueField: "",
+            xField: "",
+            yField: "",
+            rField: ""
+          };
+          point.dynamicYValue = {
+            path: selectedKey,
+            value: ""
+          };
+          return;
         }
+        const expression = generateHandlebarsExpression(selectedKey);
         point.dynamicYValue = { path: selectedKey, value: expression };
         point.yValue = expression;
         closePopover();
@@ -142176,19 +142268,21 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
       }
       if (field === "r") {
         point.selectedRValue = currentValue;
-        const rootPart = pathParts[0];
-        let expression = "";
-        if (pathParts.length === 1) {
-          expression = `{{${rootPart}}}`;
-        } else {
-          const restOfPath = pathParts.slice(1).map((part) => {
-            if (part.includes("[") && part.includes("]")) {
-              return part.split("[")[1].split("]")[0];
-            }
-            return part;
-          });
-          expression = `{{lookup (lookup ${rootPart} ${restOfPath[0]}) "${restOfPath[1]}"}}`;
+        if (Array.isArray(currentValue) || typeof currentValue === "object" && currentValue !== null) {
+          point.arrayConfig = {
+            labelField: "",
+            valueField: "",
+            xField: "",
+            yField: "",
+            rField: ""
+          };
+          point.dynamicRValue = {
+            path: selectedKey,
+            value: ""
+          };
+          return;
         }
+        const expression = generateHandlebarsExpression(selectedKey);
         point.dynamicRValue = { path: selectedKey, value: expression };
         point.rValue = expression;
         closePopover();
@@ -142205,19 +142299,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
           value: ""
         };
       } else {
-        const rootPart = pathParts[0];
-        let expression = "";
-        if (pathParts.length === 1) {
-          expression = `{{${rootPart}}}`;
-        } else {
-          const restOfPath = pathParts.slice(1).map((part) => {
-            if (part.includes("[") && part.includes("]")) {
-              return part.split("[")[1].split("]")[0];
-            }
-            return part;
-          });
-          expression = `{{lookup (lookup ${rootPart} ${restOfPath[0]}) "${restOfPath[1]}"}}`;
-        }
+        const expression = generateHandlebarsExpression(selectedKey);
         point.dynamicValue = {
           path: selectedKey,
           value: expression
@@ -142514,7 +142596,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
         onClose: _cache[16] || (_cache[16] = ($event) => unref(setComponentEditMode)(false))
       }, {
         footer: withCtx(() => [
-          createElementVNode("div", _hoisted_89, [
+          createElementVNode("div", _hoisted_110, [
             createVNode(CButton, { onClick: onCancel }, {
               default: withCtx(() => [
                 createTextVNode(toDisplayString(unref(t)("canvasUI.common.cancel")), 1)
@@ -142630,14 +142712,12 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                               value: point.label,
                               "onUpdate:value": ($event) => point.label = $event,
                               class: "flex-1",
-                              disabled: !!point.arrayConfig,
                               placeholder: "Label"
-                            }, null, 8, ["value", "onUpdate:value", "disabled"]),
+                            }, null, 8, ["value", "onUpdate:value"]),
                             createVNode(unref(NInput), {
                               value: point.value,
                               "onUpdate:value": ($event) => point.value = $event,
                               class: "flex-1",
-                              disabled: !!point.dynamicValue,
                               placeholder: "Value",
                               type: "text"
                             }, {
@@ -142703,7 +142783,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                                 }, 1032, ["show"])
                               ]),
                               _: 2
-                            }, 1032, ["value", "onUpdate:value", "disabled"]),
+                            }, 1032, ["value", "onUpdate:value"]),
                             createVNode(CButton, {
                               circle: "",
                               class: "bg-error2 self-center",
@@ -142732,14 +142812,12 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                               value: point.label,
                               "onUpdate:value": ($event) => point.label = $event,
                               class: "flex-1",
-                              disabled: !!point.arrayConfig,
                               placeholder: "Label"
-                            }, null, 8, ["value", "onUpdate:value", "disabled"]),
+                            }, null, 8, ["value", "onUpdate:value"]),
                             createVNode(unref(NInput), {
                               value: point.xValue,
                               "onUpdate:value": ($event) => point.xValue = $event,
                               class: "flex-1",
-                              disabled: !!point.dynamicXValue,
                               placeholder: "X Value",
                               type: "text"
                             }, {
@@ -142821,12 +142899,11 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                                 }, 1032, ["show"])
                               ]),
                               _: 2
-                            }, 1032, ["value", "onUpdate:value", "disabled"]),
+                            }, 1032, ["value", "onUpdate:value"]),
                             createVNode(unref(NInput), {
                               value: point.yValue,
                               "onUpdate:value": ($event) => point.yValue = $event,
                               class: "flex-1",
-                              disabled: !!point.dynamicYValue,
                               placeholder: "Y Value",
                               type: "text"
                             }, {
@@ -142850,28 +142927,70 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                                   ]),
                                   default: withCtx(() => [
                                     createElementVNode("div", _hoisted_44$3, [
-                                      createElementVNode("div", _hoisted_45$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.selectDynamicValue")), 1),
-                                      createVNode(unref(NTree), {
-                                        "block-line": "",
-                                        class: "max-h-[300px]",
-                                        data: dynamicValueTreeData.value,
-                                        "render-label": renderDynamicValueTreeLabel,
-                                        "selected-keys": [point.dynamicYValue?.path ?? ""],
-                                        "onUpdate:selectedKeys": (keys) => handleDynamicValueSelect(keys, point, "y")
-                                      }, null, 8, ["data", "selected-keys", "onUpdate:selectedKeys"])
+                                      createElementVNode("div", _hoisted_45$3, [
+                                        createElementVNode("div", _hoisted_46$3, [
+                                          createElementVNode("div", _hoisted_47$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.selectDynamicValue")), 1),
+                                          createElementVNode("div", _hoisted_48$3, [
+                                            createVNode(unref(NTree), {
+                                              "block-line": "",
+                                              class: "max-h-[300px]",
+                                              data: dynamicValueTreeData.value,
+                                              "render-label": renderDynamicValueTreeLabel,
+                                              "selected-keys": [point.dynamicYValue?.path ?? ""],
+                                              "onUpdate:selectedKeys": (keys) => handleDynamicValueSelect(keys, point, "y")
+                                            }, null, 8, ["data", "selected-keys", "onUpdate:selectedKeys"])
+                                          ])
+                                        ]),
+                                        point.selectedYValue && point.arrayConfig && isArrayOrObject(point.selectedYValue) ? (openBlock(), createElementBlock("div", _hoisted_49$3, [
+                                          createElementVNode("div", _hoisted_50$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.configureArrayObjectFields")), 1),
+                                          createElementVNode("div", _hoisted_51$2, [
+                                            createElementVNode("div", null, [
+                                              createElementVNode("label", _hoisted_52$2, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.labelField")), 1),
+                                              createVNode(unref(NSelect), {
+                                                value: point.arrayConfig.labelField,
+                                                "onUpdate:value": [($event) => point.arrayConfig.labelField = $event, ($event) => updateXYDynamicValueExpression(point)],
+                                                options: getFieldOptions(point.selectedYValue)
+                                              }, null, 8, ["value", "onUpdate:value", "options"])
+                                            ]),
+                                            createElementVNode("div", null, [
+                                              createElementVNode("label", _hoisted_53$2, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.xValueField")), 1),
+                                              createVNode(unref(NSelect), {
+                                                value: point.arrayConfig.xField,
+                                                "onUpdate:value": [($event) => point.arrayConfig.xField = $event, ($event) => updateXYDynamicValueExpression(point)],
+                                                options: getFieldOptions(point.selectedYValue)
+                                              }, null, 8, ["value", "onUpdate:value", "options"])
+                                            ]),
+                                            createElementVNode("div", null, [
+                                              createElementVNode("label", _hoisted_54$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.yValueField")), 1),
+                                              createVNode(unref(NSelect), {
+                                                value: point.arrayConfig.yField,
+                                                "onUpdate:value": [($event) => point.arrayConfig.yField = $event, ($event) => updateXYDynamicValueExpression(point)],
+                                                options: getFieldOptions(point.selectedYValue)
+                                              }, null, 8, ["value", "onUpdate:value", "options"])
+                                            ]),
+                                            isActiveSeriesXYRChart.value ? (openBlock(), createElementBlock("div", _hoisted_55$1, [
+                                              createElementVNode("label", _hoisted_56$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.rValueField")), 1),
+                                              createVNode(unref(NSelect), {
+                                                value: point.arrayConfig.rField,
+                                                "onUpdate:value": [($event) => point.arrayConfig.rField = $event, ($event) => updateXYDynamicValueExpression(point)],
+                                                options: getFieldOptions(point.selectedYValue)
+                                              }, null, 8, ["value", "onUpdate:value", "options"])
+                                            ])) : createCommentVNode("", true)
+                                          ])
+                                        ])) : createCommentVNode("", true)
+                                      ])
                                     ])
                                   ]),
                                   _: 2
                                 }, 1032, ["show"])
                               ]),
                               _: 2
-                            }, 1032, ["value", "onUpdate:value", "disabled"]),
+                            }, 1032, ["value", "onUpdate:value"]),
                             isActiveSeriesXYRChart.value ? (openBlock(), createBlock(unref(NInput), {
                               key: 0,
                               value: point.rValue,
                               "onUpdate:value": ($event) => point.rValue = $event,
                               class: "flex-1",
-                              disabled: !!point.dynamicRValue,
                               placeholder: "Size (R)",
                               type: "text"
                             }, {
@@ -142891,26 +143010,69 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                                         class: normalizeClass(point.dynamicRValue ? "text-blue-500" : ""),
                                         icon: "caret-down"
                                       }, null, 8, ["class"])
-                                    ], 8, _hoisted_46$3)
+                                    ], 8, _hoisted_57$1)
                                   ]),
                                   default: withCtx(() => [
-                                    createElementVNode("div", _hoisted_47$3, [
-                                      createElementVNode("div", _hoisted_48$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.selectDynamicValue")), 1),
-                                      createVNode(unref(NTree), {
-                                        "block-line": "",
-                                        class: "max-h-[300px]",
-                                        data: dynamicValueTreeData.value,
-                                        "render-label": renderDynamicValueTreeLabel,
-                                        "selected-keys": [point.dynamicRValue?.path ?? ""],
-                                        "onUpdate:selectedKeys": (keys) => handleDynamicValueSelect(keys, point, "r")
-                                      }, null, 8, ["data", "selected-keys", "onUpdate:selectedKeys"])
+                                    createElementVNode("div", _hoisted_58$1, [
+                                      createElementVNode("div", _hoisted_59$1, [
+                                        createElementVNode("div", _hoisted_60$1, [
+                                          createElementVNode("div", _hoisted_61$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.selectDynamicValue")), 1),
+                                          createElementVNode("div", _hoisted_62$1, [
+                                            createVNode(unref(NTree), {
+                                              "block-line": "",
+                                              class: "max-h-[300px]",
+                                              data: dynamicValueTreeData.value,
+                                              "render-label": renderDynamicValueTreeLabel,
+                                              "selected-keys": [point.dynamicRValue?.path ?? ""],
+                                              "onUpdate:selectedKeys": (keys) => handleDynamicValueSelect(keys, point, "r")
+                                            }, null, 8, ["data", "selected-keys", "onUpdate:selectedKeys"])
+                                          ])
+                                        ]),
+                                        point.selectedRValue && point.arrayConfig && isArrayOrObject(point.selectedRValue) ? (openBlock(), createElementBlock("div", _hoisted_63$1, [
+                                          createElementVNode("div", _hoisted_64$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.configureArrayObjectFields")), 1),
+                                          createElementVNode("div", _hoisted_65$1, [
+                                            createElementVNode("div", null, [
+                                              createElementVNode("label", _hoisted_66$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.labelField")), 1),
+                                              createVNode(unref(NSelect), {
+                                                value: point.arrayConfig.labelField,
+                                                "onUpdate:value": [($event) => point.arrayConfig.labelField = $event, ($event) => updateXYDynamicValueExpression(point)],
+                                                options: getFieldOptions(point.selectedRValue)
+                                              }, null, 8, ["value", "onUpdate:value", "options"])
+                                            ]),
+                                            createElementVNode("div", null, [
+                                              createElementVNode("label", _hoisted_67$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.xValueField")), 1),
+                                              createVNode(unref(NSelect), {
+                                                value: point.arrayConfig.xField,
+                                                "onUpdate:value": [($event) => point.arrayConfig.xField = $event, ($event) => updateXYDynamicValueExpression(point)],
+                                                options: getFieldOptions(point.selectedRValue)
+                                              }, null, 8, ["value", "onUpdate:value", "options"])
+                                            ]),
+                                            createElementVNode("div", null, [
+                                              createElementVNode("label", _hoisted_68$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.yValueField")), 1),
+                                              createVNode(unref(NSelect), {
+                                                value: point.arrayConfig.yField,
+                                                "onUpdate:value": [($event) => point.arrayConfig.yField = $event, ($event) => updateXYDynamicValueExpression(point)],
+                                                options: getFieldOptions(point.selectedRValue)
+                                              }, null, 8, ["value", "onUpdate:value", "options"])
+                                            ]),
+                                            createElementVNode("div", null, [
+                                              createElementVNode("label", _hoisted_69, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.rValueField")), 1),
+                                              createVNode(unref(NSelect), {
+                                                value: point.arrayConfig.rField,
+                                                "onUpdate:value": [($event) => point.arrayConfig.rField = $event, ($event) => updateXYDynamicValueExpression(point)],
+                                                options: getFieldOptions(point.selectedRValue)
+                                              }, null, 8, ["value", "onUpdate:value", "options"])
+                                            ])
+                                          ])
+                                        ])) : createCommentVNode("", true)
+                                      ])
                                     ])
                                   ]),
                                   _: 2
                                 }, 1032, ["show"])
                               ]),
                               _: 2
-                            }, 1032, ["value", "onUpdate:value", "disabled"])) : createCommentVNode("", true),
+                            }, 1032, ["value", "onUpdate:value"])) : createCommentVNode("", true),
                             createVNode(CButton, {
                               circle: "",
                               class: "bg-error2 self-center",
@@ -142931,7 +143093,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                             }, 1032, ["style", "onClick"])
                           ]);
                         }), 128)),
-                        createElementVNode("div", _hoisted_49$3, [
+                        createElementVNode("div", _hoisted_70, [
                           createVNode(CButton, {
                             class: "mt-2",
                             "icon-placement": "left",
@@ -142951,9 +143113,9 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                           })
                         ])
                       ]),
-                      createElementVNode("div", _hoisted_50$3, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartSettings")), 1),
-                      createElementVNode("div", _hoisted_51$2, [
-                        createElementVNode("label", _hoisted_52$2, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartTitle")), 1),
+                      createElementVNode("div", _hoisted_71, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartSettings")), 1),
+                      createElementVNode("div", _hoisted_72, [
+                        createElementVNode("label", _hoisted_73, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartTitle")), 1),
                         createVNode(unref(NInput), {
                           value: chartTitle.value,
                           "onUpdate:value": _cache[2] || (_cache[2] = ($event) => chartTitle.value = $event),
@@ -142961,24 +143123,24 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                         }, null, 8, ["value"])
                       ]),
                       ["bar", "line"].includes(primaryChartType.value) ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                        createElementVNode("div", _hoisted_53$2, [
-                          createElementVNode("label", _hoisted_54$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.xAxisLabel")), 1),
+                        createElementVNode("div", _hoisted_74, [
+                          createElementVNode("label", _hoisted_75, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.xAxisLabel")), 1),
                           createVNode(unref(NInput), {
                             value: xAxisLabel.value,
                             "onUpdate:value": _cache[3] || (_cache[3] = ($event) => xAxisLabel.value = $event),
                             type: "text"
                           }, null, 8, ["value"])
                         ]),
-                        createElementVNode("div", _hoisted_55$1, [
-                          createElementVNode("label", _hoisted_56$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.yAxisLabel")), 1),
+                        createElementVNode("div", _hoisted_76, [
+                          createElementVNode("label", _hoisted_77, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.yAxisLabel")), 1),
                           createVNode(unref(NInput), {
                             value: yAxisLabel.value,
                             "onUpdate:value": _cache[4] || (_cache[4] = ($event) => yAxisLabel.value = $event),
                             type: "text"
                           }, null, 8, ["value"])
                         ]),
-                        createElementVNode("div", _hoisted_57$1, [
-                          createElementVNode("label", _hoisted_58$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.orientation")), 1),
+                        createElementVNode("div", _hoisted_78, [
+                          createElementVNode("label", _hoisted_79, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.orientation")), 1),
                           createVNode(unref(NSelect), {
                             value: orientation.value,
                             "onUpdate:value": _cache[5] || (_cache[5] = ($event) => orientation.value = $event),
@@ -142986,24 +143148,24 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                           }, null, 8, ["value"])
                         ])
                       ], 64)) : createCommentVNode("", true),
-                      ["pie", "doughnut", "polarArea"].includes(primaryChartType.value) ? (openBlock(), createElementBlock("div", _hoisted_59$1, [
-                        createElementVNode("label", _hoisted_60$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.legendPosition")), 1),
+                      ["pie", "doughnut", "polarArea"].includes(primaryChartType.value) ? (openBlock(), createElementBlock("div", _hoisted_80, [
+                        createElementVNode("label", _hoisted_81, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.legendPosition")), 1),
                         createVNode(unref(NSelect), {
                           value: legendPosition.value,
                           "onUpdate:value": _cache[6] || (_cache[6] = ($event) => legendPosition.value = $event),
                           options: legendPositionOptions
                         }, null, 8, ["value"])
                       ])) : createCommentVNode("", true),
-                      ["line", "scatter", "area"].includes(primaryChartType.value) ? (openBlock(), createElementBlock("div", _hoisted_61$1, [
-                        createElementVNode("label", _hoisted_62$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.pointStyle")), 1),
+                      ["line", "scatter", "area"].includes(primaryChartType.value) ? (openBlock(), createElementBlock("div", _hoisted_82, [
+                        createElementVNode("label", _hoisted_83, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.pointStyle")), 1),
                         createVNode(unref(NSelect), {
                           value: pointStyle.value,
                           "onUpdate:value": _cache[7] || (_cache[7] = ($event) => pointStyle.value = $event),
                           options: pointStyleOptions
                         }, null, 8, ["value"])
                       ])) : createCommentVNode("", true),
-                      createElementVNode("div", _hoisted_63$1, [
-                        createElementVNode("label", _hoisted_64$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.colorScheme")), 1),
+                      createElementVNode("div", _hoisted_84, [
+                        createElementVNode("label", _hoisted_85, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.colorScheme")), 1),
                         createVNode(unref(NSelect), {
                           value: colorSchemeType.value,
                           "onUpdate:value": _cache[8] || (_cache[8] = ($event) => colorSchemeType.value = $event),
@@ -143023,32 +143185,32 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                           "onUpdate:palette": updateChartColors
                         }, null, 8, ["allow-add", "allow-delete", "allow-edit", "initial-palette"]))
                       ]),
-                      createElementVNode("div", _hoisted_65$1, [
-                        createElementVNode("label", _hoisted_66$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.animation")), 1),
+                      createElementVNode("div", _hoisted_86, [
+                        createElementVNode("label", _hoisted_87, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.animation")), 1),
                         createVNode(unref(NSwitch), {
                           value: enableAnimation.value,
                           "onUpdate:value": _cache[9] || (_cache[9] = ($event) => enableAnimation.value = $event)
                         }, null, 8, ["value"])
                       ]),
-                      createElementVNode("div", _hoisted_67$1, [
-                        createElementVNode("label", _hoisted_68$1, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.percentDisplay")), 1),
-                        createElementVNode("div", _hoisted_69, [
+                      createElementVNode("div", _hoisted_88, [
+                        createElementVNode("label", _hoisted_89, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.percentDisplay")), 1),
+                        createElementVNode("div", _hoisted_90, [
                           createVNode(unref(NSwitch), {
                             value: percentDisplay.value,
                             "onUpdate:value": _cache[10] || (_cache[10] = ($event) => percentDisplay.value = $event)
                           }, null, 8, ["value"]),
-                          createElementVNode("span", _hoisted_70, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.percentDisplayHint")), 1)
+                          createElementVNode("span", _hoisted_91, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.percentDisplayHint")), 1)
                         ])
                       ]),
-                      createElementVNode("div", _hoisted_71, [
-                        createElementVNode("label", _hoisted_72, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.viewModeControls")), 1),
-                        createElementVNode("div", _hoisted_73, [
-                          createElementVNode("div", _hoisted_74, [
+                      createElementVNode("div", _hoisted_92, [
+                        createElementVNode("label", _hoisted_93, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.viewModeControls")), 1),
+                        createElementVNode("div", _hoisted_94, [
+                          createElementVNode("div", _hoisted_95, [
                             createVNode(unref(NSwitch), {
                               value: enableFullscreenBtn.value,
                               "onUpdate:value": _cache[11] || (_cache[11] = ($event) => enableFullscreenBtn.value = $event)
                             }, null, 8, ["value"]),
-                            createElementVNode("span", _hoisted_75, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableFullscreenBtn")), 1)
+                            createElementVNode("span", _hoisted_96, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableFullscreenBtn")), 1)
                           ]),
                           createVNode(unref(NTooltip), {
                             disabled: !isMultiSeries.value,
@@ -143063,7 +143225,7 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                                   "onUpdate:value": _cache[12] || (_cache[12] = ($event) => enableChartTypeSwitcher.value = $event),
                                   disabled: isMultiSeries.value
                                 }, null, 8, ["value", "disabled"]),
-                                createElementVNode("span", _hoisted_76, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableChartTypeSwitcher")), 1)
+                                createElementVNode("span", _hoisted_97, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableChartTypeSwitcher")), 1)
                               ], 2)
                             ]),
                             default: withCtx(() => [
@@ -143071,20 +143233,20 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                             ]),
                             _: 1
                           }, 8, ["disabled"]),
-                          createElementVNode("div", _hoisted_77, [
+                          createElementVNode("div", _hoisted_98, [
                             createVNode(unref(NSwitch), {
                               value: enableDataEntry.value,
                               "onUpdate:value": _cache[13] || (_cache[13] = ($event) => enableDataEntry.value = $event)
                             }, null, 8, ["value"]),
-                            createElementVNode("span", _hoisted_78, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableDataEntry")), 1)
+                            createElementVNode("span", _hoisted_99, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.enableDataEntry")), 1)
                           ])
                         ])
                       ]),
-                      createElementVNode("div", _hoisted_79, [
-                        createElementVNode("label", _hoisted_80, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartSize")), 1),
-                        createElementVNode("div", _hoisted_81, [
-                          createElementVNode("div", _hoisted_82, [
-                            createElementVNode("label", _hoisted_83, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.height")), 1),
+                      createElementVNode("div", _hoisted_100, [
+                        createElementVNode("label", _hoisted_101, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.chartSize")), 1),
+                        createElementVNode("div", _hoisted_102, [
+                          createElementVNode("div", _hoisted_103, [
+                            createElementVNode("label", _hoisted_104, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.height")), 1),
                             createVNode(unref(NInputNumber), {
                               value: chartHeight.value,
                               "onUpdate:value": _cache[14] || (_cache[14] = ($event) => chartHeight.value = $event),
@@ -143099,8 +143261,8 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                               _: 1
                             }, 8, ["value"])
                           ]),
-                          createElementVNode("div", _hoisted_84, [
-                            createElementVNode("label", _hoisted_85, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.width")), 1),
+                          createElementVNode("div", _hoisted_105, [
+                            createElementVNode("label", _hoisted_106, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.width")), 1),
                             createVNode(unref(NInputNumber), {
                               value: chartWidth.value,
                               "onUpdate:value": _cache[15] || (_cache[15] = ($event) => chartWidth.value = $event),
@@ -143120,9 +143282,9 @@ const _sfc_main$2E = /* @__PURE__ */ defineComponent({
                     ])
                   ])
                 ]),
-                createElementVNode("div", _hoisted_86, [
-                  createElementVNode("div", _hoisted_87, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.preview")), 1),
-                  createElementVNode("div", _hoisted_88, [
+                createElementVNode("div", _hoisted_107, [
+                  createElementVNode("div", _hoisted_108, toDisplayString(unref(t)("canvasUI.canvasBuilder.dataCharts.preview")), 1),
+                  createElementVNode("div", _hoisted_109, [
                     createVNode(unref(NCard), { bordered: false }, {
                       default: withCtx(() => [
                         (openBlock(), createBlock(RawDataCharts, {