@wildwinter/app-shell 0.37.0 → 0.38.0

package/README.md

@@ -118,6 +118,19 @@ needing and never had.
   toast(`Save refused: ${err}`, "error");
   ```
 
+- **`revealRow`** - land on one row of a settings list. `expandableRow` takes a
+  `name` and stamps it on the row; `revealRow(within, name)` opens that row's
+  details, brings it to the middle of its scroller and lights it for a moment.
+  "Go to definition" in both apps opened the page a property is declared on and
+  stopped there, with the row off screen. It returns false when no row carries
+  the name, so a host whose page fills in late asks again on a later frame.
+  Brings nothing new: the light is in `settings.css`.
+
+  ```ts
+  list.append(expandableRow({ line, details, name: decl.name }));
+  revealRow(document, "mood");
+  ```
+
 - **`--ok`** joins `--danger` and `--warn` in `tokens.css`, with a `light-dark()`
   default every palette should override in its own `theme.css`. It is the only
   colour in the grammar layer, and it is there because it kept not being

package/dist/index.cjs

@@ -486,6 +486,7 @@ var PANE_MENU = {
 // src/settings.ts
 function expandableRow(opts) {
   const row = el("div", "set-row");
+  if (opts.name !== void 0) row.dataset.name = opts.name;
   const line = el("div", "set-rowline");
   if (opts.details && opts.details.length) {
     const details = el("div", "set-details");
@@ -511,6 +512,19 @@ function expandableRow(opts) {
   }
   return row;
 }
+function revealRow(within, name) {
+  const row = [...within.querySelectorAll(".set-row")].find((r) => r.dataset.name === name);
+  if (!row) return false;
+  const toggle = row.querySelector(".set-rowline > .set-expand");
+  if (toggle && toggle.getAttribute("aria-expanded") !== "true") toggle.click();
+  const still = typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
+  row.scrollIntoView({ block: "center", behavior: still ? "auto" : "smooth" });
+  row.classList.remove("landed");
+  void row.offsetWidth;
+  row.classList.add("landed");
+  row.addEventListener("animationend", () => row.classList.remove("landed"), { once: true });
+  return true;
+}
 function focusNewRow(listEl) {
   const last = listEl?.lastElementChild;
   if (!(last instanceof HTMLElement)) return;
@@ -1862,6 +1876,7 @@ exports.propertyNameify = propertyNameify;
 exports.propertyRefProblem = propertyRefProblem;
 exports.renderStepperBar = renderStepperBar;
 exports.revalidatePropertyRefs = revalidatePropertyRefs;
+exports.revealRow = revealRow;
 exports.saveIndicator = saveIndicator;
 exports.showAbout = showAbout;
 exports.staleBar = staleBar;