@leavepulse/ui 0.59.0 → 0.60.0

package/dist/components/LpTable.vue.js

@@ -1,24 +1,24 @@
 import { defineComponent, computed, useAttrs, ref, shallowRef, watch, onMounted, onBeforeUnmount, openBlock, createElementBlock, normalizeClass, createVNode, withCtx, createTextVNode, toDisplayString, createCommentVNode, Fragment, renderList, createElementVNode, Transition, renderSlot, mergeProps, normalizeStyle, createBlock, TransitionGroup, unref, withModifiers, nextTick } from "vue";
-import { _ as _sfc_main$7 } from "../chunks/LpCheckbox-B_C8sOoT.js";
-import { _ as _sfc_main$6 } from "../chunks/LpContextMenu-DRFd-iyc.js";
-import { _ as _sfc_main$2 } from "../chunks/LpIcon-B5guGKrW.js";
-import { _ as _sfc_main$a } from "../chunks/LpPagination-DehAaJLY.js";
+import { _ as _sfc_main$7 } from "../chunks/LpCheckbox-DV9W6T3H.js";
+import { _ as _sfc_main$6 } from "../chunks/LpContextMenu-BnN1k7ga.js";
+import { _ as _sfc_main$2 } from "../chunks/LpIcon-CTuDVTYv.js";
+import { _ as _sfc_main$a } from "../chunks/LpPagination-BFl0I7tL.js";
 import { _ as _sfc_main$8 } from "../chunks/LpPopover-DCKeqiVn.js";
 import { _ as _sfc_main$5 } from "../chunks/LpScrollArea-Hz3-JWUG.js";
 import { _ as _sfc_main$4 } from "../chunks/LpRollingText-DB7upf-5.js";
 import { _ as _sfc_main$3 } from "../chunks/LpShift-DXNsauQZ.js";
-import { _ as _sfc_main$9 } from "../chunks/LpTableFilter-CwHXVxJt.js";
+import { _ as _sfc_main$9 } from "../chunks/LpTableFilter-Ba-rS4H1.js";
 import { useAsyncTask } from "../composables/useAsyncTask.js";
 import { useHotkeys } from "../composables/useHotkeys.js";
 import { usePaintSelect } from "../composables/usePaintSelect.js";
 import { useRovingFocus } from "../composables/useRovingFocus.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { compareValues } from "./tableSort.js";
-import { _ as _sfc_main$1 } from "../chunks/LpButton-vhlwmpBy.js";
+import { _ as _sfc_main$1 } from "../chunks/LpButton-CJSD7N0Z.js";
 import { toCsv, downloadFile, fileStem } from "./exportData.js";
 import { summarizeShown, parseTableState, serializeTableState, countValues } from "./tableFilter.js";
 import { _ as _export_sfc } from "../chunks/_plugin-vue_export-helper-1tPrXgE0.js";
-import '../assets/LpTable-B_QCQCbB.css';const _hoisted_1 = {
+import '../assets/LpTable-BZZf_rrt.css';const _hoisted_1 = {
   key: 0,
   class: "flex justify-end"
 };
@@ -760,7 +760,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           default: withCtx(() => [
             createVNode(_sfc_main$6, {
               items: contextMenu.value,
-              always: ""
+              always: "",
+              "no-hint": !__props.rowMenu
             }, {
               default: withCtx(() => [
                 createElementVNode("table", {
@@ -940,7 +941,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 ], 512)
               ]),
               _: 3
-            }, 8, ["items"])
+            }, 8, ["items", "no-hint"])
           ]),
           _: 3
         }, 16, ["style", "bar-inset-top"]),
@@ -956,7 +957,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LpTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-344d1bc2"]]);
+const LpTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1d2375a8"]]);
 export {
   LpTable as default
 };

package/dist/components/LpTableFilter.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpTableFilter-CwHXVxJt.js";
+import { _ as _sfc_main } from "../chunks/LpTableFilter-Ba-rS4H1.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpTabs.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpTabs-D01b8jBI.js";
+import { _ as _sfc_main } from "../chunks/LpTabs-00v3VQx4.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpTagsInput.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpTagsInput-CHbQoAAA.js";
+import { _ as _sfc_main } from "../chunks/LpTagsInput-Sc56iy_j.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpTextarea.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpTextarea-Bz2IWhTH.js";
+import { _ as _sfc_main } from "../chunks/LpTextarea-CQZccQI3.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpThemeSwitcher.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpThemeSwitcher-CbzL6ipO.js";
+import { _ as _sfc_main } from "../chunks/LpThemeSwitcher-CeBG0e_D.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpTimeField.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpTimeField-DvGXgdES.js";
+import { _ as _sfc_main } from "../chunks/LpTimeField-BTEt0kvL.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpToaster.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpToaster-C9EacEfR.js";
+import { _ as _sfc_main } from "../chunks/LpToaster-BcKs7vX7.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpTour.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpTour-D7m9ZxNk.js";
+import { _ as _sfc_main } from "../chunks/LpTour-C29-1wha.js";
 export {
   _sfc_main as default
 };

package/dist/components/MenuTitle.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/MenuTitle-B9HdaBwE.js";
+import { _ as _sfc_main } from "../chunks/MenuTitle-FeC6I24N.js";
 export {
   _sfc_main as default
 };

package/dist/components/TourCard.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/TourCard-DCHOjr6e.js";
+import { _ as _sfc_main } from "../chunks/TourCard-AjN0uhs1.js";
 export {
   _sfc_main as default
 };

package/dist/composables/useHintSystem.d.ts

@@ -44,6 +44,43 @@ export interface HintNudge {
     feature: string;
     text: string;
 }
+/**
+ * A better way to do something the user keeps doing the slow way: shown now
+ * and then (at most `max` times, `nudgeAgain` apart) and never again once the
+ * better way is used. `when` reads usage counters — kit components report
+ * their own (see HINT_SIGNALS), and `hints.use(name)` adds any of the app's.
+ */
+export interface HintTip {
+    id: string;
+    title: string;
+    text: string;
+    keys?: string;
+    max?: number;
+    when: (count: (signal: string) => number) => boolean;
+    /** What "show me" lights up on the current screen; without it the tip only informs. */
+    step?: () => TourStep | null;
+}
+/** Usage the kit reports by itself. */
+export declare const HINT_SIGNALS: {
+    /** A context menu was opened (right click or long press). */
+    readonly contextMenu: "lp.context-menu";
+    /** A "…" menu marked `rightClickToo` was opened: its items were one right click away. */
+    readonly menuButton: "lp.menu-button";
+    /** A left click on something that also has a context menu. */
+    readonly contextTarget: "lp.context-target";
+    /** The command palette was opened. */
+    readonly palette: "lp.palette";
+    /** The current hint page changed: a navigation. */
+    readonly navigate: "lp.navigate";
+    /** An item's actions were opened in the palette (Tab). */
+    readonly paletteActions: "lp.palette-actions";
+};
+/** Right click instead of the "…" button. */
+export declare function contextMenuTip(text?: Partial<Pick<HintTip, "title" | "text"> & {
+    stepText: string;
+}>): HintTip;
+/** The palette instead of walking the menu. */
+export declare function paletteTip(keys?: string, text?: Partial<Pick<HintTip, "title" | "text">>): HintTip;
 export type HintLevel = "seen" | "explained" | "used";
 export interface HintRecord {
     state: HintLevel;
@@ -76,6 +113,7 @@ export interface HintSystemOptions {
     features: Record<string, HintFeature>;
     pages?: Record<string, HintPage>;
     news?: HintNews[];
+    tips?: HintTip[];
     storage?: HintStorage;
     /** The current page id, read reactively (map your route to it). */
     page: () => string;
@@ -93,6 +131,10 @@ export type HintOffer = {
     kind: "nudge";
     page: string;
     nudge: HintNudge;
+} | {
+    kind: "tip";
+    page: string;
+    tip: HintTip;
 };
 /** Records in localStorage: for anonymous sessions and apps without a server. */
 export declare function localHintStorage(key?: string): HintStorage;
@@ -124,6 +166,7 @@ export declare function createHintSystem(options: HintSystemOptions): {
         }> & Omit<Map<string, HintRecord>, keyof Map<any, any>>;
         loaded: boolean;
         page: string;
+        overlay: string | null;
         tour: {
             open: boolean;
             step: number;
@@ -161,6 +204,18 @@ export declare function createHintSystem(options: HintSystemOptions): {
                 feature: string;
                 text: string;
             };
+        } | {
+            kind: "tip";
+            page: string;
+            tip: {
+                id: string;
+                title: string;
+                text: string;
+                keys?: string | undefined;
+                max?: number | undefined;
+                when: (count: (signal: string) => number) => boolean;
+                step?: (() => TourStep | null) | undefined;
+            };
         } | null;
         candidate: {
             id: string;
@@ -180,6 +235,14 @@ export declare function createHintSystem(options: HintSystemOptions): {
     load(): Promise<void>;
     /** Ask for a nudge; it shows when the budget and the page allow. */
     nudge(n: HintNudge): void;
+    /**
+     * A dialog acts as its own page while open (its dots and tour), then hands
+     * back. Pass null on close, and on unmount: a dialog left open by a route
+     * change would otherwise keep the page.
+     */
+    overlay(page: string | null): void;
+    /** How many times a signal was reported (for an app's own tips or reports). */
+    count: (name: string) => number;
     /** The user navigated on purpose (palette, notification): do not interrupt this arrival. */
     markIntent(): void;
     unreadNews: (page?: string) => HintNews[];
@@ -193,3 +256,5 @@ export declare function createHintSystem(options: HintSystemOptions): {
 export type HintSystem = ReturnType<typeof createHintSystem>;
 export declare function provideHintSystem(system: HintSystem): void;
 export declare function useHintSystem(): HintSystem | null;
+/** The mounted host's system, read reactively from anywhere. */
+export declare function runningHintSystem(): HintSystem | null;

package/dist/composables/useHintSystem.js

@@ -1,6 +1,44 @@
-import { provide, reactive, computed, inject, watch } from "vue";
+import { shallowRef, provide, onBeforeUnmount, reactive, computed, inject, watch } from "vue";
 import { anyModalOpen } from "../components/modalDepth.js";
 import { hints } from "./useHints.js";
+const HINT_SIGNALS = {
+  /** A context menu was opened (right click or long press). */
+  contextMenu: "lp.context-menu",
+  /** A "…" menu marked `rightClickToo` was opened: its items were one right click away. */
+  menuButton: "lp.menu-button",
+  /** A left click on something that also has a context menu. */
+  contextTarget: "lp.context-target",
+  /** The command palette was opened. */
+  palette: "lp.palette",
+  /** The current hint page changed: a navigation. */
+  navigate: "lp.navigate",
+  /** An item's actions were opened in the palette (Tab). */
+  paletteActions: "lp.palette-actions"
+};
+function contextMenuTip(text = {}) {
+  return {
+    id: "lp.tip.context-menu",
+    title: text.title ?? "Right-click works here",
+    text: text.text ?? "Rows and cards open their actions on right-click, even where no … button shows it.",
+    when: (count) => count(HINT_SIGNALS.contextMenu) === 0 && (count(HINT_SIGNALS.menuButton) >= 5 || count(HINT_SIGNALS.contextTarget) >= 25),
+    step: () => {
+      const target = [...document.querySelectorAll("[data-lp-context-menu]")].find((el) => {
+        const box = el.getBoundingClientRect();
+        return box.width > 0 && box.bottom > 0 && box.top < window.innerHeight;
+      });
+      return target ? { target, title: text.title ?? "Right-click works here", text: text.stepText ?? "Right-click this to see what it can do.", try: true } : null;
+    }
+  };
+}
+function paletteTip(keys = "Ctrl+K", text = {}) {
+  return {
+    id: "lp.tip.palette",
+    title: text.title ?? "Jump anywhere",
+    text: text.text ?? "Search pages, people and settings from anywhere instead of the menu.",
+    keys,
+    when: (count) => count(HINT_SIGNALS.navigate) >= 15 && count(HINT_SIGNALS.palette) === 0
+  };
+}
 const RANK = { seen: 0, explained: 1, used: 2 };
 const DAY = 24 * 3600 * 1e3;
 const DEFAULT_TIMING = {
@@ -69,12 +107,15 @@ function createHintSystem(options) {
   const features = options.features;
   const pages = options.pages ?? {};
   const news = options.news ?? [];
+  const tips = options.tips ?? [];
+  const TIP_MAX = 3;
   const storage = options.storage ?? localHintStorage();
   const sessionKey = options.sessionKey ?? "lp-hints:interrupted";
   const state = reactive({
     records: /* @__PURE__ */ new Map(),
     loaded: false,
     page: "",
+    overlay: null,
     tour: { open: false, step: 0, steps: [], ids: [], page: "" },
     offer: null,
     candidate: null,
@@ -87,6 +128,9 @@ function createHintSystem(options) {
   const pageKey = hintKey.page;
   const newsKey = hintKey.news;
   const nudgeKey = hintKey.nudge;
+  const signalKey = (name) => `u:${name}`;
+  const tipKey = (id) => `p:${id}`;
+  const count = (name) => state.records.get(signalKey(name))?.count ?? 0;
   function interrupted() {
     try {
       return sessionStorage.getItem(sessionKey) === "1";
@@ -213,21 +257,35 @@ function createHintSystem(options) {
       return;
     }
     const n = state.candidate;
-    if (!n || n.page !== page) return;
-    const seen = state.records.get(nudgeKey(n.id));
-    if (seen?.dismissed || state.records.get(featureKey(n.feature))?.state === "used" || !hints.present(n.feature)) return;
-    if (seen && Date.now() - Date.parse(seen.updatedAt) < timing.nudgeAgain) return;
-    state.candidate = null;
-    spend();
-    record(nudgeKey(n.id), { add: 1 });
-    state.offer = { kind: "nudge", page, nudge: n };
+    if (n && n.page === page) {
+      const seen = state.records.get(nudgeKey(n.id));
+      const f = features[n.feature];
+      const visible = !!f && (!!f.target || !!f.enter || hints.present(n.feature));
+      if (!seen?.dismissed && state.records.get(featureKey(n.feature))?.state !== "used" && visible && !(seen && Date.now() - Date.parse(seen.updatedAt) < timing.nudgeAgain)) {
+        state.candidate = null;
+        spend();
+        record(nudgeKey(n.id), { add: 1 });
+        state.offer = { kind: "nudge", page, nudge: n };
+        return;
+      }
+    }
+    for (const tip of tips) {
+      const seen = state.records.get(tipKey(tip.id));
+      if (seen?.dismissed || (seen?.count ?? 0) >= (tip.max ?? TIP_MAX)) continue;
+      if (seen && Date.now() - Date.parse(seen.updatedAt) < timing.nudgeAgain) continue;
+      if (!tip.when(count)) continue;
+      spend();
+      state.offer = { kind: "tip", page, tip };
+      return;
+    }
   }
   let stops = [];
   function start() {
     if (stops.length) return;
     const stopPage = watch(
-      options.page,
-      (page) => {
+      () => state.overlay ?? options.page(),
+      (page, previous) => {
+        if (previous !== void 0 && page !== previous && !state.overlay) record(signalKey(HINT_SIGNALS.navigate), { add: 1 });
         state.page = page;
         state.settledAt = Date.now();
         if (state.offer && state.offer.page !== page) state.offer = null;
@@ -249,6 +307,7 @@ function createHintSystem(options) {
       stopPage,
       hints.on("used", (id) => {
         if (features[id]) record(featureKey(id), { state: "used", add: 1 });
+        if (id.startsWith("lp.") || !features[id]) record(signalKey(id), { add: 1 });
       }),
       () => clearInterval(poll),
       () => window.removeEventListener("pagehide", flushOnLeave)
@@ -279,6 +338,16 @@ function createHintSystem(options) {
     nudge(n) {
       state.candidate = { ...n, page: state.page };
     },
+    /**
+     * A dialog acts as its own page while open (its dots and tour), then hands
+     * back. Pass null on close, and on unmount: a dialog left open by a route
+     * change would otherwise keep the page.
+     */
+    overlay(page) {
+      state.overlay = page;
+    },
+    /** How many times a signal was reported (for an app's own tips or reports). */
+    count,
     /** The user navigated on purpose (palette, notification): do not interrupt this arrival. */
     markIntent() {
       state.intent = true;
@@ -294,6 +363,7 @@ function createHintSystem(options) {
       if (id) record(featureKey(id), { state: "explained" });
     },
     tourEnded(finished) {
+      if (!state.tour.ids.length) return;
       record(pageKey(state.tour.page), finished ? { state: "explained" } : { add: 1 });
       baseline(state.tour.page);
     },
@@ -305,6 +375,10 @@ function createHintSystem(options) {
         const ids = offer.items.map((n) => n.feature).filter((id) => !!id);
         readNews(offer.page);
         if (choice === "show" && ids.length) startTour(offer.page, ids);
+      } else if (offer.kind === "tip") {
+        record(tipKey(offer.tip.id), { add: 1, dismissed: choice === "never" });
+        const step = choice === "show" ? offer.tip.step?.() : null;
+        if (step) Object.assign(state.tour, { open: true, step: 0, page: offer.page, ids: [], steps: [step] });
       } else if (offer.kind === "nudge") {
         if (choice === "show") startTour(features[offer.nudge.feature].page, [offer.nudge.feature]);
         else record(nudgeKey(offer.nudge.id), { dismissed: true });
@@ -318,17 +392,29 @@ function createHintSystem(options) {
   };
 }
 const HINT_SYSTEM = /* @__PURE__ */ Symbol.for("lp-hint-system");
+const running = shallowRef(null);
 function provideHintSystem(system) {
   provide(HINT_SYSTEM, system);
+  running.value = system;
+  onBeforeUnmount(() => {
+    if (running.value === system) running.value = null;
+  });
 }
 function useHintSystem() {
-  return inject(HINT_SYSTEM, null);
+  return inject(HINT_SYSTEM, null) ?? running.value;
+}
+function runningHintSystem() {
+  return running.value;
 }
 export {
+  HINT_SIGNALS,
+  contextMenuTip,
   createHintSystem,
   hintKey,
   hintSummary,
   localHintStorage,
+  paletteTip,
   provideHintSystem,
+  runningHintSystem,
   useHintSystem
 };

package/dist/icons-all.js

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

package/dist/index.d.ts

@@ -162,8 +162,8 @@ export type { TourContext, TourStep } from "./components/LpTour.vue";
 export { holeOf, openContextMenu, panelsAround } from "./components/tour";
 export { default as LpHintLayer } from "./components/LpHintLayer.vue";
 export { default as LpHints } from "./components/LpHints.vue";
-export { createHintSystem, hintKey, hintSummary, localHintStorage, provideHintSystem, useHintSystem } from "./composables/useHintSystem";
-export type { HintDelta, HintFeature, HintLevel, HintNews, HintNudge, HintOffer, HintPage, HintRecord, HintStorage, HintSummary, HintSystem, HintSystemOptions, HintTiming, } from "./composables/useHintSystem";
+export { HINT_SIGNALS, contextMenuTip, createHintSystem, hintKey, hintSummary, localHintStorage, paletteTip, provideHintSystem, runningHintSystem, useHintSystem } from "./composables/useHintSystem";
+export type { HintDelta, HintFeature, HintLevel, HintNews, HintNudge, HintOffer, HintPage, HintRecord, HintStorage, HintSummary, HintSystem, HintTip, HintSystemOptions, HintTiming, } from "./composables/useHintSystem";
 export type { HintNote } from "./components/LpHintLayer.vue";
 export { default as LpTooltipProvider } from "./components/LpTooltipProvider.vue";
 export { default as LpTopologyCanvas } from "./components/LpTopologyCanvas.vue";