@openproject/primer-view-components 0.78.0 → 0.78.1-rc.e0961ba5b

package/app/components/primer/alpha/tree_view/tree_view.d.ts

@@ -38,6 +38,7 @@ export declare class TreeViewElement extends HTMLElement {
     changeSelectStrategy(newStrategy: SelectStrategy): void;
     infoFromNode(node: Element, newCheckedValue?: TreeViewCheckedValue): TreeViewNodeInfo | null;
     selectVariant(node: Element): SelectVariant;
+    updateHiddenFormInputs(): void;
 }
 declare global {
     interface Window {

package/app/components/primer/alpha/tree_view/tree_view.js

@@ -56,28 +56,17 @@ let TreeViewElement = class TreeViewElement extends HTMLElement {
             });
             if (!somethingChanged)
                 return;
-            const newInputs = [];
-            // eslint-disable-next-line custom-elements/no-dom-traversal-in-connectedcallback
-            for (const node of this.querySelectorAll('[role=treeitem][aria-checked=true]')) {
-                const newInput = this.formInputPrototype.cloneNode();
-                newInput.removeAttribute('data-target');
-                newInput.removeAttribute('form');
-                const payload = {
-                    path: this.getNodePath(node),
-                };
-                const inputValue = this.getFormInputValueForNode(node);
-                if (inputValue)
-                    payload.value = inputValue;
-                newInput.value = JSON.stringify(payload);
-                newInputs.push(newInput);
-            }
-            this.formInputContainer.replaceChildren(...newInputs);
+            this.updateHiddenFormInputs();
         });
         updateInputsObserver.observe(this, {
             childList: true,
             subtree: true,
             attributeFilter: ['aria-checked'],
         });
+        // Correctly initialize the form
+        if (this.formInputContainer) {
+            this.updateHiddenFormInputs();
+        }
         // eslint-disable-next-line github/no-then -- We don't want to wait for this to resolve, just get on with it
         customElements.whenDefined('tree-view-sub-tree-node').then(() => {
             // depends on TreeViewSubTreeNodeElement#eachAncestorSubTreeNode, which may not be defined yet
@@ -287,6 +276,24 @@ let TreeViewElement = class TreeViewElement extends HTMLElement {
     selectVariant(node) {
         return (node.getAttribute('data-select-variant') || 'none');
     }
+    updateHiddenFormInputs() {
+        const newInputs = [];
+        // eslint-disable-next-line custom-elements/no-dom-traversal-in-connectedcallback
+        for (const node of this.querySelectorAll('[role=treeitem][aria-checked=true]')) {
+            const newInput = this.formInputPrototype.cloneNode();
+            newInput.removeAttribute('data-target');
+            newInput.removeAttribute('form');
+            const payload = {
+                path: this.getNodePath(node),
+            };
+            const inputValue = this.getFormInputValueForNode(node);
+            if (inputValue)
+                payload.value = inputValue;
+            newInput.value = JSON.stringify(payload);
+            newInputs.push(newInput);
+        }
+        this.formInputContainer.replaceChildren(...newInputs);
+    }
 };
 _TreeViewElement_abortController = new WeakMap();
 _TreeViewElement_instances = new WeakSet();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openproject/primer-view-components",
-  "version": "0.78.0",
+  "version": "0.78.1-rc.e0961ba5b",
   "description": "ViewComponents of the Primer Design System for OpenProject",
   "main": "app/assets/javascripts/primer_view_components.js",
   "module": "app/components/primer/primer.js",