@runwisp/ui 1.5.0 → 1.7.0

package/src/lib/components/FilterBar.svelte

@@ -11,7 +11,7 @@
   shown as pills; every other field stays behind "+ Add filter" until the user
   adds it, then lives as a pill. Each pill is self-contained (label + value +
   clear in one element, see FilterPill) so activating a filter never adds a
-  second row — the table below never jumps. Data-mode agnostic: the parent feeds
+  second row, the table below never jumps. Data-mode agnostic: the parent feeds
   `values` to applyFilters (client) or maps it to query params (server).
 -->
 
@@ -20,6 +20,7 @@
     import SearchInput from "./SearchInput.svelte";
     import FilterPill from "./FilterPill.svelte";
     import Popover from "./Popover.svelte";
+    import { isTypingTarget } from "../utils/typing-target.js";
     import { Plus, RotateCcw } from "@lucide/svelte";
     import {
         type FilterField,
@@ -83,12 +84,7 @@
     // `/` focuses the search box, unless the user is already typing somewhere.
     function onWindowKeydown(e: KeyboardEvent) {
         if (e.key !== "/" || !searchEl) return;
-        const t = e.target;
-        if (
-            t instanceof HTMLElement &&
-            (t.tagName === "INPUT" || t.tagName === "TEXTAREA" || t.isContentEditable)
-        )
-            return;
+        if (isTypingTarget(e.target)) return;
         e.preventDefault();
         searchEl.focus();
     }

package/src/lib/components/FilterPill.svelte

@@ -4,7 +4,7 @@
 <!--
   One filter, one element. The pill is both the control and its own "chip":
   inactive it reads `Label ▾` (muted); active it reads `Label: value ✕` (accent)
-  with an inline clear. Active vs inactive is a restyle of the SAME element — it
+  with an inline clear. Active vs inactive is a restyle of the SAME element, it
   never spawns a second row, so the table below never jumps. Clicking the body
   opens a type-specific editor popover (select menu / number / date range).
 -->
@@ -26,7 +26,7 @@
     let {
         field,
         values = $bindable({}),
-        // Open the editor on mount — set when the pill was just added from the
+        // Open the editor on mount, set when the pill was just added from the
         // "+ Add filter" menu, so the user lands straight in the value picker.
         autoOpen = false,
         onClose,

package/src/lib/components/FormField.svelte

@@ -13,7 +13,7 @@
         children: Snippet;
         class?: string;
         // The id of the control this field labels. Pass the SAME id to the wrapped
-        // input/select so the <label for> actually points at it — otherwise the
+        // input/select so the <label for> actually points at it, otherwise the
         // label is dead (clicking it does nothing; screen readers can't associate
         // it). Falls back to a generated id when the field has no focusable target.
         id?: string;

package/src/lib/components/Link.svelte

@@ -5,12 +5,14 @@
     import type { Snippet } from "svelte";
     import type { HTMLAnchorAttributes } from "svelte/elements";
 
-    type LinkVariant = "default" | "muted" | "primary" | "danger";
+    type LinkVariant = "default" | "muted" | "primary" | "danger" | "unstyled";
     type LinkUnderline = "always" | "hover" | "none";
 
     // Use Link for off-site URLs (`external` opens a new tab with rel=noopener
-    // noreferrer). An in-app href must still come from SvelteKit's resolve():
-    // being a component, Link sits outside svelte/no-navigation-without-resolve.
+    // noreferrer). `unstyled` adds no classes beyond `class` (no `underline`
+    // either), for nav rows and menu items that bring their own layout. An
+    // in-app href must still come from SvelteKit's resolve(): being a
+    // component, Link sits outside svelte/no-navigation-without-resolve.
     interface Props extends Omit<HTMLAnchorAttributes, "href" | "children" | "class"> {
         href: string;
         variant?: LinkVariant;
@@ -41,6 +43,7 @@
         muted: "text-on-surface-muted hover:text-on-surface",
         primary: "text-primary hover:text-primary-hover",
         danger: "text-danger-surface hover:text-danger-hover",
+        unstyled: "",
     };
 
     const underlineClasses: Record<LinkUnderline, string> = {
@@ -52,7 +55,9 @@
 
 <a
     {href}
-    class="{baseClasses} {variantClasses[variant]} {underlineClasses[underline]} {className}"
+    class={variant === "unstyled"
+        ? className
+        : `${baseClasses} ${variantClasses[variant]} ${underlineClasses[underline]} ${className}`}
     target={external ? "_blank" : undefined}
     rel={external ? "noopener noreferrer" : undefined}
     {...restProps}