jupiter-dynamic-forms 1.19.4 → 1.19.5

package/dist/index.mjs

@@ -4757,6 +4757,7 @@ let JupiterConceptTree = class extends LitElement {
     this.showAddButton = false;
     this.showRemoveButton = false;
     this.language = "en";
+    this.rowFocused = false;
     this._expanded = true;
   }
   connectedCallback() {
@@ -4934,7 +4935,7 @@ let JupiterConceptTree = class extends LitElement {
     const isAbstract = this.concept.abstract || false;
     return html`
       <!-- Concept Name Cell (Left Column) -->
-      <td class="concept-name-cell ${isAbstract ? "abstract" : hasChildren ? "" : "leaf"}">
+      <td class="concept-name-cell ${isAbstract ? "abstract" : hasChildren ? "" : "leaf"} ${this.rowFocused ? "row-focused" : ""}">
         <div class="concept-content" style="--level: ${level}">
           <div class="concept-indent"></div>
           <div class="concept-toggle ${hasChildren ? this._expanded ? "expanded" : "" : "no-children"}"
@@ -4970,7 +4971,7 @@ let JupiterConceptTree = class extends LitElement {
       const storedUnit = (_b = (_a = this.unitData) == null ? void 0 : _a[this.concept.id]) == null ? void 0 : _b[column2.id];
       const storedDecimals = (_d = (_c = this.decimalsData) == null ? void 0 : _c[this.concept.id]) == null ? void 0 : _d[column2.id];
       return html`
-          <td class="field-cell ${!shouldShowField ? "empty" : ""} ${isAbstract ? "abstract-row" : ""} ${this.highlightType && column2.id === this.highlightColumnId ? "highlight-" + this.highlightType : ""} ${((_e = this.calculationErrorKeys) == null ? void 0 : _e.has(`${this.concept.id}__${column2.id}`)) ? "calc-error" : ""}">
+          <td class="field-cell ${!shouldShowField ? "empty" : ""} ${isAbstract ? "abstract-row" : ""} ${this.highlightType && column2.id === this.highlightColumnId ? "highlight-" + this.highlightType : ""} ${((_e = this.calculationErrorKeys) == null ? void 0 : _e.has(`${this.concept.id}__${column2.id}`)) ? "calc-error" : ""} ${this.rowFocused ? "row-focused" : ""}">
             ${shouldShowField ? html`
               <jupiter-form-field
                 .field="${field2}"
@@ -5176,6 +5177,18 @@ JupiterConceptTree.styles = css`
       box-shadow: inset 0 0 0 2px var(--jupiter-error-color, #d32f2f);
     }
 
+    /* Row-level highlight while a field in this row has focus. Applied to every
+       cell so the row stays identifiable even after the user scrolls the table
+       horizontally away from the focused input. */
+    .concept-name-cell.row-focused,
+    .field-cell.row-focused {
+      background: var(--jupiter-row-focus-background, rgba(25, 118, 210, 0.14));
+    }
+
+    .concept-name-cell.row-focused {
+      box-shadow: inset 3px 0 0 0 var(--jupiter-primary-color, #1976d2);
+    }
+
     .concept-info-btn {
       flex-shrink: 0;
       width: 22px;
@@ -5296,6 +5309,9 @@ __decorateClass$5([
 __decorateClass$5([
   n2({ type: String })
 ], JupiterConceptTree.prototype, "language", 2);
+__decorateClass$5([
+  n2({ type: Boolean })
+], JupiterConceptTree.prototype, "rowFocused", 2);
 __decorateClass$5([
   r()
 ], JupiterConceptTree.prototype, "_expanded", 2);
@@ -5993,10 +6009,12 @@ let JupiterFormSection = class extends LitElement {
     this._insertAfterColumnId = null;
     this._boundFieldBlur = (e2) => {
       this._clearHighlights();
+      this._focusedConceptId = null;
     };
     this._expandedConcepts = /* @__PURE__ */ new Set();
     this._allTreeExpanded = false;
     this._highlightMap = /* @__PURE__ */ new Map();
+    this._focusedConceptId = null;
     this._calculationErrorKeys = /* @__PURE__ */ new Set();
     this._totalChildrenMap = /* @__PURE__ */ new Map();
     this._memberParentMap = /* @__PURE__ */ new Map();
@@ -6336,6 +6354,7 @@ let JupiterFormSection = class extends LitElement {
     const columnId = (_b = event.detail) == null ? void 0 : _b.columnId;
     if (!conceptId || !columnId)
       return;
+    this._focusedConceptId = conceptId;
     const newMap = /* @__PURE__ */ new Map();
     const isSelfTotal = this._totalChildrenMap.has(conceptId);
     if (isSelfTotal) {
@@ -6423,6 +6442,7 @@ let JupiterFormSection = class extends LitElement {
         .showRemoveButton="${opts.showRemove || false}"
         .highlightType="${(_a2 = this._highlightMap.get(instanceConcept.id)) == null ? void 0 : _a2.type}"
         .highlightColumnId="${(_b = this._highlightMap.get(instanceConcept.id)) == null ? void 0 : _b.columnId}"
+        .rowFocused="${this._focusedConceptId === instanceConcept.id}"
         .calculationErrorKeys="${this._calculationErrorKeys}"
         @field-change="${this._handleFieldChange}"
         @field-focus="${this._handleFieldFocusForHighlight}"
@@ -6960,6 +6980,9 @@ __decorateClass$3([
 __decorateClass$3([
   r()
 ], JupiterFormSection.prototype, "_highlightMap", 2);
+__decorateClass$3([
+  r()
+], JupiterFormSection.prototype, "_focusedConceptId", 2);
 __decorateClass$3([
   r()
 ], JupiterFormSection.prototype, "_calculationErrorKeys", 2);