@leavepulse/ui 0.78.3 → 0.80.1

package/dist/components/commandPalette.d.ts

@@ -202,3 +202,17 @@ export declare function modeChipLabel(command: {
     label: string;
     modeLabel?: string;
 }): string;
+/** What a fetcher may hand back: the rows, a promise of them, or batches of them. */
+export type FetchedRows<T> = T[] | Promise<T[]> | AsyncIterable<T[]>;
+/**
+ * Settles a fetcher's answer into its final rows. A plain list or a promise is
+ * passed through; batches are walked one by one, each handed to `onBatch` as
+ * it lands (each is the whole list so far, replacing the one before), and the
+ * last is the result — no batches at all is an empty list.
+ *
+ * An abort stops the walk at once rather than at the next batch: the iterator
+ * is closed (`return()`; a generator parked in an `await` closes at its next
+ * `yield`, running its `finally` there) and the wait for the pending batch is
+ * dropped. A batch that lands afterwards is not handed on.
+ */
+export declare function settleFetched<T>(result: FetchedRows<T>, signal: AbortSignal, onBatch: (rows: T[]) => void): Promise<T[]>;

package/dist/components/commandPalette.js

@@ -138,6 +138,47 @@ function modeChipLabel(command) {
   if (!command.label.includes("{query}")) return command.label;
   return command.label.replace(/\s*["'“”«»]?\{query\}["'“”«»]?/g, "").replace(/\s+(for|in|on|:)$/i, "").trim();
 }
+function isAsyncIterable(value) {
+  return value != null && typeof value[Symbol.asyncIterator] === "function";
+}
+async function settleFetched(result, signal, onBatch) {
+  if (!isAsyncIterable(result)) return result;
+  const iterator = result[Symbol.asyncIterator]();
+  let closed = false;
+  const close = () => {
+    if (closed) return;
+    closed = true;
+    void Promise.resolve(iterator.return?.()).catch(() => {
+    });
+  };
+  let stop;
+  const aborted = new Promise((resolve) => {
+    stop = () => resolve({ done: true, value: void 0 });
+    if (signal.aborted) stop();
+    else signal.addEventListener("abort", stop, { once: true });
+  });
+  let rows = [];
+  try {
+    for (; ; ) {
+      const step = await Promise.race([iterator.next(), aborted]);
+      if (signal.aborted) {
+        close();
+        return rows;
+      }
+      if (step.done) {
+        closed = true;
+        return rows;
+      }
+      rows = step.value;
+      onBatch(rows);
+    }
+  } catch (error) {
+    closed = true;
+    throw error;
+  } finally {
+    if (stop) signal.removeEventListener("abort", stop);
+  }
+}
 export {
   PALETTE_MODES,
   absoluteHref,
@@ -154,5 +195,6 @@ export {
   recentKey,
   recentVisible,
   resolveRecentItems,
+  settleFetched,
   toRecentItem
 };

package/dist/components/menuWhen.js

@@ -1,5 +1,5 @@
 import { defineComponent, h } from "vue";
-import { _ as _sfc_main } from "../chunks/LpContextMenu-Bx_IhQDS.js";
+import { _ as _sfc_main } from "../chunks/LpContextMenu-bn5bc9t7.js";
 const MenuWhen = defineComponent({
   name: "MenuWhen",
   inheritAttrs: false,

package/dist/components/notifications.d.ts

@@ -0,0 +1,156 @@
+import type { ContextMenuItemDef } from "./LpContextMenu.vue";
+import type { ToneName } from "./tone";
+/**
+ * A button on a notification itself: "Approve", "Reply", "View invoice". The
+ * thing the notification asks for, done where it is read instead of a page away.
+ */
+export interface NotificationAction {
+    label: string;
+    /**
+     * `primary` is the one answer the notification is waiting for; `danger` a
+     * destructive one ("Decline", "Revoke"). Unset is a quiet secondary button.
+     */
+    variant?: "primary" | "secondary" | "danger";
+    icon?: string;
+    /** A destination instead of a handler: the button is a link. */
+    href?: string;
+    /**
+     * Runs on press. A returned promise shows the button busy, and holds the
+     * row's other actions, until it settles; a rejection is left to the caller
+     * (toast it), and the row stays as it was.
+     */
+    onSelect?: (item: NotificationItem) => unknown;
+}
+/** Who a notification is from, drawn as their avatar in place of the icon. */
+export interface NotificationActor {
+    name: string;
+    /** Picture URL; the initials of `name` show without one. */
+    avatar?: string;
+}
+export interface NotificationItem {
+    id: string;
+    title: string;
+    body?: string;
+    /** Optional icon name (e.g. "lucide:check-circle"). With an `actor`, it is a small badge on the avatar. */
+    icon?: string;
+    /**
+     * Colours the row's icon by what KIND of notification it is — a billing
+     * notice and a security one should not look alike at a glance.
+     *
+     * A named tone rather than a class, so the categories stay themeable:
+     * consumers were mapping their own types onto raw palette classes, which is
+     * the one place a theme cannot follow them.
+     */
+    tone?: ToneName;
+    /** Who it is from; the row leads with their avatar. */
+    actor?: NotificationActor;
+    /** Optional deep link; the row becomes a link when set. */
+    link?: string;
+    /** ISO-8601 creation time; rendered as a relative label and used for the day groups. */
+    createdAt?: string;
+    /** Whether the notification has been read. */
+    read?: boolean;
+    /** Buttons on the notification itself. See `NotificationAction`. */
+    actions?: NotificationAction[];
+    /**
+     * What became of it, once acted on ("Approved", "Declined by Anna"). Shown
+     * in place of the actions, so a handled request reads as handled.
+     */
+    outcome?: string;
+    /** Which of the feed's `categories` tabs it belongs to. */
+    category?: string;
+}
+/** A tab of the feed beside All and Unread, keyed by `NotificationItem.category`. */
+export interface NotificationCategory {
+    value: string;
+    label: string;
+    icon?: string;
+}
+/**
+ * Every user-facing string the feed and the bell render on their own. Apps
+ * with i18n pass their translations in (or set the `notifications` scope in
+ * the kit config); the English defaults keep the components usable bare.
+ */
+export interface NotificationLabels {
+    title?: string;
+    markAllRead?: string;
+    clear?: string;
+    markAsRead?: string;
+    markAsUnread?: string;
+    open?: string;
+    dismiss?: string;
+    empty?: string;
+    /** The Unread tab's empty state. */
+    emptyUnread?: string;
+    ariaLabel?: string;
+    /** Appended to the button's name while there is unread news; `{count}` is filled in. */
+    unread?: string;
+    /** Screen-reader marker on an unread row. */
+    unreadItem?: string;
+    /** Tabs. */
+    all?: string;
+    unreadTab?: string;
+    /** Day groups. */
+    today?: string;
+    yesterday?: string;
+    earlier?: string;
+    /** The header's settings button. */
+    settings?: string;
+    /** The footer link (`allLink`). */
+    viewAll?: string;
+    loadMore?: string;
+    /** Actions of a row, as a group. */
+    actions?: string;
+    /**
+     * No longer read: times are worded by Intl in the app's locale. Still
+     * accepted so existing label objects keep type-checking.
+     * @deprecated
+     */
+    justNow?: string;
+    /** @deprecated See `justNow`. */
+    minutes?: string;
+    /** @deprecated See `justNow`. */
+    hours?: string;
+    /** @deprecated See `justNow`. */
+    days?: string;
+}
+export declare const NOTIFICATION_LABELS: {
+    title: string;
+    markAllRead: string;
+    clear: string;
+    markAsRead: string;
+    markAsUnread: string;
+    open: string;
+    dismiss: string;
+    empty: string;
+    emptyUnread: string;
+    ariaLabel: string;
+    unread: string;
+    unreadItem: string;
+    all: string;
+    unreadTab: string;
+    today: string;
+    yesterday: string;
+    earlier: string;
+    settings: string;
+    viewAll: string;
+    loadMore: string;
+    actions: string;
+};
+/** Extra right-click entries for a row, after the built-in ones. */
+export type NotificationMenu = (item: NotificationItem) => ContextMenuItemDef[];
+/** today | yesterday | earlier, in the viewer's own calendar. */
+export declare function dayOf(iso: string | undefined, now: number): "today" | "yesterday" | "earlier";
+export interface NotificationGroup {
+    key: string;
+    day: "today" | "yesterday" | "earlier" | null;
+    items: NotificationItem[];
+}
+/**
+ * Runs of consecutive items from the same day. Consecutive, not sorted: the
+ * feed keeps the caller's order, and an out-of-order item opens a new run
+ * rather than being moved away from where the caller put it.
+ */
+export declare function groupByDay(items: NotificationItem[], now: number, grouped: boolean): NotificationGroup[];
+/** The milliseconds until the next local midnight, when the day groups move. */
+export declare function untilMidnight(now: number): number;

package/dist/components/notifications.js

@@ -0,0 +1,59 @@
+const NOTIFICATION_LABELS = {
+  title: "Notifications",
+  markAllRead: "Mark all read",
+  clear: "Clear",
+  markAsRead: "Mark as read",
+  markAsUnread: "Mark as unread",
+  open: "Open",
+  dismiss: "Dismiss",
+  empty: "No notifications",
+  emptyUnread: "You're all caught up",
+  ariaLabel: "",
+  unread: "{count} unread",
+  unreadItem: "Unread",
+  all: "All",
+  unreadTab: "Unread",
+  today: "Today",
+  yesterday: "Yesterday",
+  earlier: "Earlier",
+  settings: "Notification settings",
+  viewAll: "View all notifications",
+  loadMore: "Load more",
+  actions: "Actions"
+};
+const DAY_MS = 864e5;
+function dayStart(time) {
+  const d = new Date(time);
+  d.setHours(0, 0, 0, 0);
+  return d.getTime();
+}
+function dayOf(iso, now) {
+  const time = iso ? Date.parse(iso) : Number.NaN;
+  if (Number.isNaN(time)) return "earlier";
+  const today = dayStart(now);
+  if (time >= today) return "today";
+  if (time >= dayStart(today - DAY_MS / 2)) return "yesterday";
+  return "earlier";
+}
+function groupByDay(items, now, grouped) {
+  if (!grouped || !items.some((item) => item.createdAt)) return [{ key: "all", day: null, items }];
+  const groups = [];
+  for (const item of items) {
+    const day = dayOf(item.createdAt, now);
+    const last = groups.at(-1);
+    if (last?.day === day) last.items.push(item);
+    else groups.push({ key: `${day}-${groups.length}`, day, items: [item] });
+  }
+  return groups;
+}
+function untilMidnight(now) {
+  const next = new Date(now);
+  next.setHours(24, 0, 0, 0);
+  return Math.max(1e3, next.getTime() - now);
+}
+export {
+  NOTIFICATION_LABELS,
+  dayOf,
+  groupByDay,
+  untilMidnight
+};

package/dist/components/relativeTime.js

@@ -26,6 +26,11 @@ function formatterFor(locale, style) {
   }
   return f;
 }
+const SIGNED = /^[-+\u2212]/;
+function say(fmt, locale, style, value, unit) {
+  const text = fmt.format(value, unit);
+  return style === "narrow" && SIGNED.test(text) ? formatterFor(locale, "short").format(value, unit) : text;
+}
 const MAX_REFRESH = HOUR;
 const MIN_REFRESH = SECOND;
 function formatRelativeTime(date, now = Date.now(), options = {}) {
@@ -47,7 +52,7 @@ function formatRelativeTime(date, now = Date.now(), options = {}) {
   const boundary = diff < 0 ? (Math.floor(units + 0.5) + 0.5) * step.ms : (Math.ceil(units - 0.5) - 0.5) * step.ms;
   const unitChange = diff < 0 ? step.until - abs : index > 0 ? abs - SCALE[index - 1].until : Infinity;
   const refreshIn = Math.min(diff < 0 ? boundary - abs : abs - boundary, unitChange);
-  return { text: fmt.format(value, step.unit), unit: step.unit, value, refreshIn: clampRefresh(refreshIn) };
+  return { text: say(fmt, locale, style, value, step.unit), unit: step.unit, value, refreshIn: clampRefresh(refreshIn) };
 }
 function clampRefresh(ms) {
   return clamp(Math.ceil(ms), MIN_REFRESH, MAX_REFRESH);

package/dist/composables/useAsyncTask.d.ts

@@ -12,10 +12,15 @@
  * and an error from a superseded run is dropped unseen. It is also one slot:
  * a new `run` replaces the last, and `pending` speaks for the latest only, so
  * independent requests each need their own `useAsyncTask`.
+ *
+ * A task that has something to show before it is done (the command palette's
+ * streamed results) calls `emit` with it: that reaches `apply` at once, for
+ * the latest run only, while `pending` stays true until the task settles. The
+ * value the task finally resolves to is applied as well, after the last emit.
  */
 export declare function useAsyncTask<T>(): {
     pending: import("vue").Ref<boolean, boolean>;
-    run: (task: (signal: AbortSignal) => T | Promise<T>, options: {
+    run: (task: (signal: AbortSignal, emit: (value: T) => void) => T | Promise<T>, options: {
         delay?: number;
         apply: (value: T) => void;
         fail?: (error: unknown) => void;

package/dist/composables/useAsyncTask.js

@@ -19,7 +19,10 @@ function useAsyncTask() {
     timer = setTimeout(async () => {
       controller = new AbortController();
       try {
-        const value = await task(controller.signal);
+        const emit = (value2) => {
+          if (mine === token) options.apply(value2);
+        };
+        const value = await task(controller.signal, emit);
         if (mine === token) options.apply(value);
       } catch (error) {
         if (mine === token) options.fail?.(error);

package/dist/icons-all.js

@@ -1,3 +1,3 @@
 import lucide from "@iconify-json/lucide/icons.json";
-import { a as registerIconCollection } from "./chunks/icons-CYfcpSDS.js";
+import { a as registerIconCollection } from "./chunks/icons-C1vppR4f.js";
 registerIconCollection(lucide);

package/dist/index.d.ts

@@ -108,7 +108,8 @@ export { default as LpMediaGallery } from "./components/LpMediaGallery.vue";
 export { default as LpModal } from "./components/LpModal.vue";
 export { default as LpModalNav } from "./components/LpModalNav.vue";
 export { default as LpNotificationBell } from "./components/LpNotificationBell.vue";
-export type { NotificationItem, NotificationLabels, } from "./components/LpNotificationBell.vue";
+export { default as LpNotificationFeed } from "./components/LpNotificationFeed.vue";
+export type { NotificationAction, NotificationActor, NotificationCategory, NotificationItem, NotificationLabels, NotificationMenu, } from "./components/notifications";
 export { default as LpNumberField } from "./components/LpNumberField.vue";
 export type { NumberFieldLabels } from "./components/LpNumberField.vue";
 export { default as LpTimeField } from "./components/LpTimeField.vue";