@swiftwc/ui 0.0.0-dev.40 → 0.0.0-dev.41

package/generated/components/picker-view.js

@@ -20,24 +20,40 @@ const update = (path, node, overwrite = true) => {
 };
 const reflectSpawnedElement = (current, source) => {
     const { page: oldSv, toolBarConfig: oldToolbar } = new NavigationPath(current).hydrate(), { page: newSv, toolBarConfig: newToolbar } = new NavigationPath(source).hydrate();
-    const oldVStack = oldSv?.querySelector(':scope>v-stack'), newVStack = newSv?.querySelector(':scope>v-stack'), oldBackBtn = oldToolbar?.at(0)?.querySelector('button'), newBackBtn = newToolbar?.at(0)?.querySelector('button');
-    // pre replace list (always exist)
-    const oldOpenedDetails = [...(oldVStack?.querySelectorAll('list-view details[open]>summary') ?? [])].map((item) => item.textContent.trim());
-    // replace list (always exist)
-    if (oldVStack && newVStack)
-        oldVStack.replaceWith(newVStack);
-    // post replace list (always exist)
+    const oldList = oldSv?.querySelector('list-view'), newList = newSv?.querySelector('list-view'), oldBackBtn = oldToolbar?.at(0)?.querySelector('button'), newBackBtn = newToolbar?.at(0)?.querySelector('button');
+    // pre replace list (always exists)
+    const oldOpenedDetails = [...(oldList?.querySelectorAll('list-view details[open]>summary') ?? [])].map((item) => item.textContent.trim());
+    // replace list (always exists)
+    if (oldList && newList)
+        oldList.replaceWith(newList);
+    // post replace list (always exists)
     for (const label of oldOpenedDetails)
-        for (const summary of newVStack?.querySelectorAll('list-view details>summary') ?? [])
+        for (const summary of newList?.querySelectorAll('list-view details>summary') ?? [])
             if (summary.textContent.trim() === label) {
                 summary.parentElement?.setAttribute('open', 'open');
                 break;
             }
-    // replace backbtns (always exist)
+    // replace backbtns (always exists)
     if (oldBackBtn && newBackBtn)
         oldBackBtn.replaceWith(newBackBtn);
-    // overwrite navtitle (always exist)
+    // overwrite navtitle (always exists)
     oldSv?.setAttribute('navigation-inline-title', newSv?.getAttribute('navigation-inline-title') ?? '');
+    // replace search (if exists)
+    oldList?.style.setProperty('--list--sticky-block-size', newList?.style.getPropertyValue('--list--sticky-block-size') ?? '');
+    // replace search (if exists)
+    const oldSearch = oldSv?.querySelector('sticky-container'), newSearch = newSv?.querySelector('sticky-container');
+    // if already exists, DO NOTHING dont mess up the input element
+    if (newSearch) {
+        if (!oldSearch)
+            oldSv?.insertAdjacentHTML('afterend', `<sticky-container edge="navbar" style="order: -1" padding>
+                <v-stack spacing="0" alignment="fill">
+                  <input is="search-view" placeholder="Search">
+                  <button type="button">Filters</button>
+                </v-stack>
+              </sticky-container>`);
+    }
+    else
+        oldSearch?.remove();
 };
 const extractTagFromOption = (node) => {
     return ((node.getAttribute('value') ?? node.textContent?.trim()) || node.getAttribute('label')) ?? '';
@@ -166,7 +182,7 @@ export class PickerView extends FormAssociatedBase {
                 const currentValueLabel = this.querySelector(':scope>label-view:not([slot])') ?? this.appendChild($(`<label-view></label-view>`, '>1'));
                 // reset state
                 currentValueLabel.setAttribute('system-image', 'dots-three'); // overwritten
-                currentValueLabel.setAttribute('title', this.#currentValueLabel); // overwritten
+                currentValueLabel.setAttribute('title', this.#selection); //, this.#currentValueLabel) // overwritten
                 // clear all siblings
                 for (const el of this.querySelectorAll(':scope>:not([slot])'))
                     if (currentValueLabel !== el)
@@ -202,7 +218,7 @@ export class PickerView extends FormAssociatedBase {
                         el.remove();
                 const currentValueLabel = menu.querySelector(':scope>label-view[slot=label]') ?? menu.appendChild($(`<label-view slot="label"></label-view>`, '>1'));
                 currentValueLabel.setAttribute('system-image', 'dots-three'); // overwritten
-                currentValueLabel.setAttribute('title', this.#currentValueLabel); // overwritten
+                currentValueLabel.setAttribute('title', this.#selection); //this.#currentValueLabel) // overwritten
                 _a.#reflectButtons([...(this.#slots?.get('list')?.assignedElements() ?? [])], menu);
                 break;
             }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swiftwc/ui",
-  "version": "0.0.0-dev.40",
+  "version": "0.0.0-dev.41",
   "description": "Elegant SwiftUI-inspired web components for standalone web apps and web extensions.",
   "publishConfig": {
     "access": "public"