jupiter-dynamic-forms 1.18.6 → 1.18.8

package/dist/index.mjs

@@ -3056,6 +3056,16 @@ function determineInputTypeFromBaseChain(baseTypeChain, datatypes) {
       placeholder: I18n.t("field.enterWholeNumber")
     };
   }
+  if (chainLower.some((type) => type.includes("percent") || type.includes("pure"))) {
+    return {
+      fieldType: "percentage",
+      htmlInputType: "text",
+      inputMode: "decimal",
+      allowDecimals: true,
+      step: 0.01,
+      placeholder: I18n.t("field.enterPercentage")
+    };
+  }
   if (chainLower.some((type) => type.includes("decimal") || type === "decimal")) {
     if (chainString.includes("monetary") || chainString.includes("currency")) {
       if (chainString.includes("nodecimals") || chainString.includes("no-decimals") || chainString.includes("nodecimals20")) {
@@ -3230,6 +3240,17 @@ let JupiterFormField = class extends LitElement {
       }
       this._numericDraftValue = null;
     }
+    if (this._isPercentItemType() && this.value !== null && this.value !== void 0) {
+      const numVal = Number(this.value);
+      if (!isNaN(numVal) && Math.abs(numVal) >= 1) {
+        this.value = numVal / 100;
+        const oldValue = numVal;
+        this.dispatchEvent(new CustomEvent("field-change", {
+          detail: { fieldId: this.field.id, conceptId: this.conceptId, columnId: this.columnId, value: this.value, oldValue },
+          bubbles: true
+        }));
+      }
+    }
     this._touched = true;
     this._validateXBRLDatatype();
     this._validateUnitSelection();
@@ -3264,6 +3285,16 @@ let JupiterFormField = class extends LitElement {
       (type) => type.includes("monetary") || type.includes("Monetary")
     );
   }
+  _isPercentItemType() {
+    if (!this.conceptType)
+      return false;
+    if (this.conceptType.toLowerCase().includes("percent"))
+      return true;
+    if (!this.datatypes)
+      return false;
+    const baseTypeChain = resolveBaseTypeChain(this.conceptType, this.datatypes);
+    return baseTypeChain.some((type) => type.toLowerCase().includes("percent"));
+  }
   /**
    * Prevents non-numeric input in number fields for Firefox compatibility
    * Firefox allows typing any character in type="number" inputs
@@ -3779,7 +3810,14 @@ let JupiterFormField = class extends LitElement {
     const step = typeConfig.step !== void 0 ? typeConfig.step : isNumericType(effectiveFieldType) ? "any" : void 0;
     const min = typeConfig.min;
     const max = typeConfig.max;
-    const renderedInputValue = this._isNumericField() && this._numericDraftValue !== null ? this._numericDraftValue : effectiveValue ?? "";
+    let renderedInputValue;
+    if (this._isNumericField() && this._numericDraftValue !== null) {
+      renderedInputValue = this._numericDraftValue;
+    } else if (effectiveFieldType === "percentage" && effectiveValue !== null && effectiveValue !== void 0 && effectiveValue !== "") {
+      renderedInputValue = Number(effectiveValue).toFixed(4);
+    } else {
+      renderedInputValue = effectiveValue ?? "";
+    }
     return html`
       <input
         id="${fieldId}"
@@ -3973,7 +4011,7 @@ let JupiterFormField = class extends LitElement {
               </div>
             ` : ""}
 
-            ${this._isMonetaryType() ? html`
+            ${this._isMonetaryType() || this._isPercentItemType() ? html`
               <div class="period-controls">
                 <label>${I18n.t("field.scale")}:</label>
                 <input
@@ -3981,7 +4019,7 @@ let JupiterFormField = class extends LitElement {
                   min="0"
                   class="typed-member-input"
                   placeholder="Leave blank for INF"
-                  .value="${this.decimals !== void 0 && this.decimals !== null && this.decimals !== "" ? this.decimals : this.globalDecimals !== "INF" ? this.globalDecimals : ""}"
+                  .value="${this.decimals !== void 0 && this.decimals !== null && this.decimals !== "" ? this.decimals : this._isPercentItemType() ? "4" : this.globalDecimals !== "INF" ? this.globalDecimals : ""}"
                   @input="${this._handleDecimalsChange}"
                   ?disabled="${this.disabled}"
                 />
@@ -11268,7 +11306,7 @@ let JupiterDynamicForm = class extends LitElement {
     return null;
   }
   _addConceptDataToSubmission(concept, columnId, value, submissionData, section2) {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f, _g;
     const field2 = concept.fields.find((f2) => f2.columnId === columnId);
     if (!field2)
       return;
@@ -11280,6 +11318,12 @@ let JupiterDynamicForm = class extends LitElement {
     const periodStartDate = (fieldPeriodData == null ? void 0 : fieldPeriodData.startDate) || (column2 == null ? void 0 : column2.periodStartDate) || field2.periodStartDate || this.periodStartDate;
     const periodEndDate = (fieldPeriodData == null ? void 0 : fieldPeriodData.endDate) || (column2 == null ? void 0 : column2.periodEndDate) || field2.periodEndDate || this.periodEndDate;
     const periodInstantDate = (fieldPeriodData == null ? void 0 : fieldPeriodData.instantDate) || field2.periodInstantDate || periodEndDate || periodStartDate;
+    if ((_c = concept.type) == null ? void 0 : _c.toLowerCase().includes("percentitemtype")) {
+      const numericValue = Number(value);
+      if (!isNaN(numericValue) && Math.abs(numericValue) >= 1) {
+        value = numericValue / 100;
+      }
+    }
     const entry = {
       conceptId: concept.originalConceptId || concept.id,
       columnId,
@@ -11296,14 +11340,16 @@ let JupiterDynamicForm = class extends LitElement {
       entry.unit = fieldUnit;
       console.log(`✅ [Submission] Adding unit to entry: ${fieldUnit} for ${concept.id}/${columnId}`);
     }
-    const isMonetary = (_c = concept.type) == null ? void 0 : _c.toLowerCase().includes("monetary");
-    const fieldDecimals = (_d = this._decimalsData[concept.id]) == null ? void 0 : _d[columnId];
-    const decimalsValue = fieldDecimals || (this.decimals !== "INF" ? this.decimals : void 0);
-    if (isMonetary && decimalsValue) {
+    const isMonetary = (_d = concept.type) == null ? void 0 : _d.toLowerCase().includes("monetary");
+    const isPercent = (_e = concept.type) == null ? void 0 : _e.toLowerCase().includes("percentitemtype");
+    const fieldDecimals = (_f = this._decimalsData[concept.id]) == null ? void 0 : _f[columnId];
+    const globalFallback = isPercent ? "4" : this.decimals !== "INF" ? this.decimals : void 0;
+    const decimalsValue = fieldDecimals || globalFallback;
+    if ((isMonetary || isPercent) && decimalsValue) {
       const parsed = parseFloat(decimalsValue);
       entry.decimals = isNaN(parsed) ? decimalsValue : String(-Math.abs(parsed));
     }
-    if ((_e = column2 == null ? void 0 : column2.dimensionData) == null ? void 0 : _e.memberLabel) {
+    if ((_g = column2 == null ? void 0 : column2.dimensionData) == null ? void 0 : _g.memberLabel) {
       entry.dimension = column2.dimensionData.memberLabel;
     }
     console.log(`📤 [Submission Entry] Created entry:`, JSON.stringify(entry, null, 2));
@@ -11441,7 +11487,7 @@ let JupiterDynamicForm = class extends LitElement {
       }
       if (concept.fields && concept.fields.length > 0) {
         concept.fields.forEach((field2) => {
-          var _a, _b, _c, _d, _e, _f, _g, _h;
+          var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
           const conceptData = this._formData[concept.id];
           let fieldValue = conceptData == null ? void 0 : conceptData[field2.columnId];
           const baseConceptId = field2.conceptId || concept.id.split("__").slice(0, -1).join("__") || concept.id;
@@ -11459,8 +11505,14 @@ let JupiterDynamicForm = class extends LitElement {
             }
           }
           if (fieldValue !== void 0 && fieldValue !== null && fieldValue !== "") {
+            if ((_b = concept.type) == null ? void 0 : _b.toLowerCase().includes("percentitemtype")) {
+              const numericFieldValue = Number(fieldValue);
+              if (!isNaN(numericFieldValue) && Math.abs(numericFieldValue) >= 1) {
+                fieldValue = numericFieldValue / 100;
+              }
+            }
             const column2 = this._findColumnByIdInSection(field2.columnId, section2);
-            const fieldPeriodData = (_b = this._periodData[concept.id]) == null ? void 0 : _b[field2.columnId];
+            const fieldPeriodData = (_c = this._periodData[concept.id]) == null ? void 0 : _c[field2.columnId];
             const submissionEntry = {
               conceptId: concept.id,
               draftInstanceId: concept.id,
@@ -11482,21 +11534,23 @@ let JupiterDynamicForm = class extends LitElement {
               submissionEntry.period.endDate = endDate;
             }
             console.log(`🔍 [Submission] Concept: ${concept.id}, Column: ${field2.columnId}, Field Period: ${fieldPeriodData ? JSON.stringify(fieldPeriodData) : "none"}, Column Period: ${(column2 == null ? void 0 : column2.periodStartDate) || "none"} - ${(column2 == null ? void 0 : column2.periodEndDate) || "none"}, Used Period: ${submissionEntry.period.type === "instant" ? submissionEntry.period.date : `${submissionEntry.period.startDate} - ${submissionEntry.period.endDate}`}`);
-            const fieldUnit = (_c = this._unitData[concept.id]) == null ? void 0 : _c[field2.columnId];
+            const fieldUnit = (_d = this._unitData[concept.id]) == null ? void 0 : _d[field2.columnId];
             if (fieldUnit) {
               submissionEntry.unit = fieldUnit;
               console.log(`✅ [Submission] Adding unit to entry: ${fieldUnit} for ${concept.id}/${field2.columnId}`);
             } else {
               console.log(`⚠️ [Submission] No unit found in _unitData for ${concept.id}/${field2.columnId}. _unitData state:`, JSON.stringify(this._unitData, null, 2));
             }
-            const isMonetary = (_d = concept.type) == null ? void 0 : _d.toLowerCase().includes("monetary");
-            const fieldDecimals = (_e = this._decimalsData[concept.id]) == null ? void 0 : _e[field2.columnId];
-            const decimalsValue = fieldDecimals || (this.decimals !== "INF" ? this.decimals : void 0);
-            if (isMonetary && decimalsValue) {
+            const isMonetary = (_e = concept.type) == null ? void 0 : _e.toLowerCase().includes("monetary");
+            const isPercent = (_f = concept.type) == null ? void 0 : _f.toLowerCase().includes("percentitemtype");
+            const fieldDecimals = (_g = this._decimalsData[concept.id]) == null ? void 0 : _g[field2.columnId];
+            const globalFallback = isPercent ? "4" : this.decimals !== "INF" ? this.decimals : void 0;
+            const decimalsValue = fieldDecimals || globalFallback;
+            if ((isMonetary || isPercent) && decimalsValue) {
               const parsed = parseFloat(decimalsValue);
               submissionEntry.decimals = isNaN(parsed) ? decimalsValue : String(-Math.abs(parsed));
             }
-            if ((column2 == null ? void 0 : column2.type) === "dimension" && ((_f = column2.dimensionData) == null ? void 0 : _f.dimensionIdKey)) {
+            if ((column2 == null ? void 0 : column2.type) === "dimension" && ((_h = column2.dimensionData) == null ? void 0 : _h.dimensionIdKey)) {
               submissionEntry.dimension = column2.dimensionData.dimensionIdKey;
               console.log(`🔍 [DynamicForm] Using dimension key from field's column (${field2.columnId}):`, column2.dimensionData.dimensionIdKey);
             } else {
@@ -11532,12 +11586,12 @@ let JupiterDynamicForm = class extends LitElement {
                 console.log(`🔍 [DynamicForm] Column details:`, {
                   id: column2.id,
                   type: column2.type,
-                  hasTypedMembers: (_g = column2.dimensionData) == null ? void 0 : _g.hasTypedMembers,
+                  hasTypedMembers: (_i = column2.dimensionData) == null ? void 0 : _i.hasTypedMembers,
                   dimensionData: column2.dimensionData
                 });
               }
             }
-            if (!submissionEntry.typedMembers && ((_h = field2.crossRoleTypedMembers) == null ? void 0 : _h.length)) {
+            if (!submissionEntry.typedMembers && ((_j = field2.crossRoleTypedMembers) == null ? void 0 : _j.length)) {
               const crossRoleKey = `${concept.id}__${field2.columnId}`;
               const crossRoleValues = this._typedMemberData[crossRoleKey];
               if (crossRoleValues) {
@@ -11904,8 +11958,17 @@ let JupiterDynamicForm = class extends LitElement {
       return result;
     }
     const query = searchText.toLowerCase().trim();
+    const addAllDescendants = (concepts) => {
+      var _a2;
+      for (const concept of concepts) {
+        result.add(concept.id);
+        if ((_a2 = concept.children) == null ? void 0 : _a2.length) {
+          addAllDescendants(concept.children);
+        }
+      }
+    };
     const walkConcepts = (concepts) => {
-      var _a2, _b2, _c2;
+      var _a2, _b2, _c2, _d;
       for (const concept of concepts) {
         let matches = ((_a2 = concept.conceptName) == null ? void 0 : _a2.toLowerCase().includes(query)) || ((_b2 = concept.id) == null ? void 0 : _b2.toLowerCase().includes(query));
         if (!matches && Array.isArray(concept.labels)) {
@@ -11916,8 +11979,10 @@ let JupiterDynamicForm = class extends LitElement {
         }
         if (matches) {
           result.add(concept.id);
-        }
-        if ((_c2 = concept.children) == null ? void 0 : _c2.length) {
+          if ((_c2 = concept.children) == null ? void 0 : _c2.length) {
+            addAllDescendants(concept.children);
+          }
+        } else if ((_d = concept.children) == null ? void 0 : _d.length) {
           walkConcepts(concept.children);
         }
       }
@@ -12616,7 +12681,8 @@ let JupiterDynamicForm = class extends LitElement {
     })) == null ? void 0 : _a.id;
   }
   async scrollToConcept(conceptName, dimensions, match) {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+    console.log(`[scrollToConcept] ▶ START conceptName=${conceptName} value=${match == null ? void 0 : match.value} dims=${JSON.stringify(dimensions)}`);
     let targetSection = null;
     let targetConcept = null;
     const sectionsToSearch = [
@@ -12626,18 +12692,35 @@ let JupiterDynamicForm = class extends LitElement {
         return !((_a2 = this._currentSchema) == null ? void 0 : _a2.sections.find((cs) => cs.id === s2.id));
       })
     ];
+    console.log(`[scrollToConcept] Searching ${sectionsToSearch.length} sections`);
     for (const section2 of sectionsToSearch) {
       const found = this._findConceptByName(section2.concepts, conceptName);
       if (found) {
-        targetSection = section2;
-        targetConcept = found;
-        break;
+        if (dimensions == null ? void 0 : dimensions.length) {
+          const cols = section2.columns ?? this._columns;
+          const colId = this._findColumnByDimensions(cols, dimensions);
+          console.log(`[scrollToConcept] Section "${section2.id}" has concept "${found.id}" | colMatch=${colId ?? "null"} | cols=${cols.map((c2) => c2.id).join(",")}`);
+          if (colId) {
+            targetSection = section2;
+            targetConcept = found;
+            break;
+          } else if (!targetSection) {
+            targetSection = section2;
+            targetConcept = found;
+          }
+        } else {
+          console.log(`[scrollToConcept] Section "${section2.id}" has concept "${found.id}" (no dims, taking first)`);
+          targetSection = section2;
+          targetConcept = found;
+          break;
+        }
       }
     }
     if (!targetSection || !targetConcept) {
       console.warn(`[scrollToConcept] Concept not found: ${conceptName}`);
       return;
     }
+    console.log(`[scrollToConcept] → targetSection="${targetSection.id}" targetConceptId="${targetConcept.id}"`);
     targetSection.expanded = true;
     if (this.display === "sidePanel" && this._activeSidePanelRoleId !== targetSection.id) {
       this._activeSidePanelRoleId = targetSection.id;
@@ -12651,10 +12734,12 @@ let JupiterDynamicForm = class extends LitElement {
     } else if (!hasValueMatch) {
       targetColumnId = ((_b = columns[0]) == null ? void 0 : _b.id) ?? null;
     }
+    console.log(`[scrollToConcept] targetColumnId=${targetColumnId} hasValueMatch=${hasValueMatch} targetValue=${targetValue}`);
     this.requestUpdate();
     await this.updateComplete;
     await new Promise((resolve) => setTimeout(resolve, 300));
     const sectionElements = (_c = this.shadowRoot) == null ? void 0 : _c.querySelectorAll("jupiter-form-section");
+    console.log(`[scrollToConcept] DOM: found ${(sectionElements == null ? void 0 : sectionElements.length) ?? 0} jupiter-form-section elements`);
     let targetSectionEl = null;
     sectionElements == null ? void 0 : sectionElements.forEach((el) => {
       var _a2;
@@ -12667,8 +12752,13 @@ let JupiterDynamicForm = class extends LitElement {
     }
     await targetSectionEl.updateComplete;
     const conceptTrees = (_d = targetSectionEl.shadowRoot) == null ? void 0 : _d.querySelectorAll("jupiter-concept-tree");
+    console.log(`[scrollToConcept] conceptTrees in targetSection: ${(conceptTrees == null ? void 0 : conceptTrees.length) ?? 0}`);
     let targetFieldEl = null;
     const conceptId = targetConcept.id;
+    const conceptIdBase = conceptId.includes("__") ? conceptId.split("__")[0] : conceptId;
+    console.log(`[scrollToConcept] conceptId="${conceptId}" conceptIdBase="${conceptIdBase}"`);
+    const sameBaseConcept = (fieldConceptId) => fieldConceptId === conceptId || fieldConceptId.includes("__") && fieldConceptId.split("__")[0] === conceptIdBase;
+    let phase1FieldCount = 0;
     conceptTrees == null ? void 0 : conceptTrees.forEach((ct) => {
       var _a2;
       if (targetFieldEl)
@@ -12679,31 +12769,72 @@ let JupiterDynamicForm = class extends LitElement {
           return;
         const columnMatch = targetColumnId ? fieldEl.conceptId === conceptId && fieldEl.columnId === targetColumnId : fieldEl.conceptId === conceptId;
         const valueMatch = !hasValueMatch || String(fieldEl.value ?? "") === targetValue;
+        if (columnMatch) {
+          phase1FieldCount++;
+          console.log(`[scrollToConcept] Phase1 candidate: conceptId=${fieldEl.conceptId} columnId=${fieldEl.columnId} value=${fieldEl.value} valueMatch=${valueMatch}`);
+        }
         if (columnMatch && valueMatch)
           targetFieldEl = fieldEl;
       });
     });
-    if (!targetFieldEl && hasValueMatch && !targetColumnId) {
-      for (const ct of Array.from(conceptTrees ?? [])) {
+    console.log(`[scrollToConcept] Phase1: scanned ${phase1FieldCount} candidates, found=${!!targetFieldEl}`);
+    if (!targetFieldEl && hasValueMatch) {
+      console.log(`[scrollToConcept] Phase2: searching ALL sections by base concept name + value`);
+      const allSectionEls = ((_e = this.shadowRoot) == null ? void 0 : _e.querySelectorAll("jupiter-form-section")) ?? [];
+      for (const secEl of Array.from(allSectionEls)) {
         if (targetFieldEl)
           break;
-        const fields = (_e = ct.shadowRoot) == null ? void 0 : _e.querySelectorAll("jupiter-form-field");
-        fields == null ? void 0 : fields.forEach((fieldEl) => {
+        const cts = ((_f = secEl.shadowRoot) == null ? void 0 : _f.querySelectorAll("jupiter-concept-tree")) ?? [];
+        for (const ct of Array.from(cts)) {
           if (targetFieldEl)
-            return;
-          const columnMatch = targetColumnId ? fieldEl.conceptId === conceptId && fieldEl.columnId === targetColumnId : fieldEl.conceptId === conceptId;
-          if (columnMatch)
-            targetFieldEl = fieldEl;
-        });
+            break;
+          const fields = ((_g = ct.shadowRoot) == null ? void 0 : _g.querySelectorAll("jupiter-form-field")) ?? [];
+          fields.forEach((fieldEl) => {
+            if (targetFieldEl)
+              return;
+            const baseMatch = sameBaseConcept(fieldEl.conceptId);
+            const valMatch = String(fieldEl.value ?? "") === targetValue;
+            if (baseMatch) {
+              console.log(`[scrollToConcept] Phase2 candidate: conceptId=${fieldEl.conceptId} value=${fieldEl.value} valMatch=${valMatch}`);
+            }
+            if (baseMatch && valMatch) {
+              console.log(`[scrollToConcept] Phase2 ✅ MATCH: conceptId=${fieldEl.conceptId} columnId=${fieldEl.columnId} value=${fieldEl.value}`);
+              targetFieldEl = fieldEl;
+            }
+          });
+        }
+      }
+    }
+    if (!targetFieldEl) {
+      const allSectionEls = ((_h = this.shadowRoot) == null ? void 0 : _h.querySelectorAll("jupiter-form-section")) ?? [];
+      for (const secEl of Array.from(allSectionEls)) {
+        if (targetFieldEl)
+          break;
+        const cts = ((_i = secEl.shadowRoot) == null ? void 0 : _i.querySelectorAll("jupiter-concept-tree")) ?? [];
+        for (const ct of Array.from(cts)) {
+          if (targetFieldEl)
+            break;
+          const fields = ((_j = ct.shadowRoot) == null ? void 0 : _j.querySelectorAll("jupiter-form-field")) ?? [];
+          fields.forEach((fieldEl) => {
+            if (targetFieldEl)
+              return;
+            const columnMatch = targetColumnId ? sameBaseConcept(fieldEl.conceptId) && fieldEl.columnId === targetColumnId : sameBaseConcept(fieldEl.conceptId);
+            if (columnMatch) {
+              console.log(`[scrollToConcept] Phase3 ✅ fallback: conceptId=${fieldEl.conceptId} columnId=${fieldEl.columnId} value=${fieldEl.value}`);
+              targetFieldEl = fieldEl;
+            }
+          });
+        }
       }
     }
     if (!targetFieldEl) {
       console.warn(`[scrollToConcept] Field element not found for concept: ${conceptName}`);
       return;
     }
+    console.log(`[scrollToConcept] ✅ HIGHLIGHTING conceptId=${targetFieldEl.conceptId} columnId=${targetFieldEl.columnId} value=${targetFieldEl.value}`);
     targetFieldEl.scrollIntoView({ behavior: "smooth", block: "center" });
     targetFieldEl.classList.add("concept-highlight");
-    const focusTarget = (_f = targetFieldEl.shadowRoot) == null ? void 0 : _f.querySelector(
+    const focusTarget = (_k = targetFieldEl.shadowRoot) == null ? void 0 : _k.querySelector(
       'input:not([type="hidden"]), select, textarea, button, [tabindex]:not([tabindex="-1"])'
     );
     focusTarget == null ? void 0 : focusTarget.focus({ preventScroll: true });