@leavepulse/ui 0.75.0 → 0.76.0

package/README.md

@@ -83,6 +83,50 @@ app.use(lpConfig({
 
 A component's own `labels` prop wins over the configuration.
 
+### Back and Forward for overlays
+
+`provideOverlayHistory()` (at the app root, like `provideGlass()`) makes the
+browser's Back button close overlays instead of leaving the page:
+
+```ts
+import { provideOverlayHistory } from "@leavepulse/ui"
+
+// in App.vue's setup; pass the router so a Back that only closes a dialog is not a navigation
+provideOverlayHistory(true, { router })
+```
+
+- Opening an `LpModal` or `LpDrawer` (and what is built on them:
+  `LpConfirmDialog`, `LpShortcutsDialog`) adds one history entry. Back closes
+  the topmost overlay; nested ones close one per press, top first.
+- Closing through the UI (close button, Escape, the scrim, the app setting
+  `open` to false) takes the entry back out, so Back is never spent on a step
+  that shows nothing. A `guard` that keeps the overlay open on Back keeps its
+  entry too.
+- `LpTabs` inside an open overlay record each switch: Back returns to the
+  previous tab before it closes the overlay. Page-level tabs stay out (an app
+  keeps those in its URL); `history` on `LpTabs` opts out inside an overlay or
+  in on a page without a router.
+- Forward after Back does nothing by default: the step is undone at once, so
+  no dead entry is left. The kit only sees a boolean `open`, and what the app
+  put into the overlay may be gone by then. `history="reopen"` (or
+  `provideOverlayHistory("reopen")`) re-opens it on Forward by emitting
+  `update:open` true while the overlay is still mounted.
+- `history` on a single overlay wins over the app-wide mode: `false` keeps an
+  overlay out of history, for one the app already opens from its route query
+  (it would otherwise take two entries for one dialog).
+- A real navigation (a link, `router.push` to another path) closes the open
+  overlays, and the entries they leave under the new page are skipped, so Back
+  from it lands on the page in one press. A push that keeps the path (a query
+  or hash, such as an overlay driven by the route query) leaves them open.
+
+The URL never changes and the router's own `history.state` data is copied into
+each entry. The `router` option is vue-router's instance (anything with a
+`listening` switch works): without it the router sees each Back that closes an
+overlay as a visit to the page it is already on (guards and `afterEach` run
+again, nothing remounts). A Forward onto a kit entry still reaches it that
+way, because the entry it starts from belongs to the router. Plain
+`pushState` and `popstate` only, so WebKit (Safari, WebKitGTK) works too.
+
 ### Nuxt
 
 ```ts

package/dist/assets/{LpShortcutsDialog-BUp_BX4s.css → LpShortcutsDialog-C6uzPeMf.css}

@@ -1,12 +1,12 @@
 
 /* Two columns where there is room: the list is long enough that one column
    pushes the last group off a laptop screen. */
-.shortcut-groups[data-v-611c415f] {
+.shortcut-groups[data-v-f948ed00] {
   display: grid;
   gap: 18px;
   grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
 }
-.shortcut-group h3[data-v-611c415f] {
+.shortcut-group h3[data-v-f948ed00] {
   margin: 0 0 6px;
   color: var(--color-muted);
   font-size: 0.7rem;
@@ -14,25 +14,25 @@
   letter-spacing: 0.06em;
   text-transform: uppercase;
 }
-.shortcut-group dl[data-v-611c415f] {
+.shortcut-group dl[data-v-f948ed00] {
   display: flex;
   flex-direction: column;
   gap: 1px;
   margin: 0;
 }
-.shortcut-row[data-v-611c415f] {
+.shortcut-row[data-v-f948ed00] {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
   padding: 5px 0;
 }
-.shortcut-row dt[data-v-611c415f] {
+.shortcut-row dt[data-v-f948ed00] {
   color: var(--color-ink);
   font-size: 0.82rem;
   min-width: 0;
 }
-.shortcut-conflict[data-v-611c415f] {
+.shortcut-conflict[data-v-f948ed00] {
   display: inline-flex;
   width: 14px;
   height: 14px;
@@ -47,7 +47,7 @@
   vertical-align: middle;
   cursor: help;
 }
-.shortcut-row dd[data-v-611c415f] {
+.shortcut-row dd[data-v-f948ed00] {
   display: flex;
   flex-shrink: 0;
   gap: 3px;

package/dist/assets/LpTabs-CJ0rYQbx.css

@@ -0,0 +1,18 @@
+
+.lp-tab-badge-enter-active[data-v-1d673b52],
+.lp-tab-badge-leave-active[data-v-1d673b52] {
+  transition:
+    opacity var(--duration-fast) var(--ease-emphasized),
+    transform var(--duration-fast) var(--ease-emphasized);
+}
+.lp-tab-badge-enter-from[data-v-1d673b52],
+.lp-tab-badge-leave-to[data-v-1d673b52] {
+  opacity: 0;
+  transform: scale(0.6);
+}
+@media (prefers-reduced-motion: reduce) {
+.lp-tab-badge-enter-active[data-v-1d673b52],
+  .lp-tab-badge-leave-active[data-v-1d673b52] {
+    transition: none;
+}
+}

package/dist/chunks/{LpAddressInput-Al3HT5ey.js → LpAddressInput-De_LTYM7.js}

@@ -7,7 +7,7 @@ import { _ as _sfc_main$3 } from "./LpButton-CFb44IjC.js";
 import { _ as _sfc_main$1 } from "./LpFormField-Ch69Jd-X.js";
 import { _ as _sfc_main$4 } from "./LpIcon--5WSb3jJ.js";
 import { _ as _sfc_main$5 } from "./LpInput-Tw-yxT4I.js";
-import { _ as _sfc_main$7 } from "./LpModal-BnjZ2iem.js";
+import { _ as _sfc_main$7 } from "./LpModal-C0tGg_D_.js";
 import { _ as _sfc_main$6 } from "./LpSelect-Cxq4yBGd.js";
 import { useFieldControl } from "../composables/useField.js";
 import { useLabels } from "../composables/useLpConfig.js";

package/dist/chunks/{LpAppShell-CpSSm5WT.js → LpAppShell-Cpy_t1U_.js}

@@ -7,7 +7,7 @@ import { _ as _sfc_main$3 } from "./LpButton-CFb44IjC.js";
 import { _ as _sfc_main$4 } from "./LpIcon--5WSb3jJ.js";
 import { _ as _sfc_main$6 } from "./LpScrollArea-Hz3-JWUG.js";
 import { _ as _sfc_main$5 } from "./LpShift-CCq7dofl.js";
-import { _ as _sfc_main$1 } from "./LpSidebar-BoNLKgh-.js";
+import { _ as _sfc_main$1 } from "./LpSidebar-D6zO8vLm.js";
 import { useMergedAttrs, mergeClass } from "../composables/useMergedClass.js";
 const _hoisted_1 = ["href"];
 const _hoisted_2 = { class: "flex min-w-0 flex-1 flex-col" };

package/dist/chunks/{LpConfirmDialog-DY2VjDji.js → LpConfirmDialog-CphJR6Q9.js}

@@ -2,7 +2,7 @@ import { defineComponent, computed, ref, watch, openBlock, createBlock, createSl
 import { useLabels } from "../composables/useLpConfig.js";
 import { _ as _sfc_main$2 } from "./LpButton-CFb44IjC.js";
 import { _ as _sfc_main$3 } from "./LpIcon--5WSb3jJ.js";
-import { _ as _sfc_main$1 } from "./LpModal-BnjZ2iem.js";
+import { _ as _sfc_main$1 } from "./LpModal-C0tGg_D_.js";
 const _hoisted_1 = { class: "inline-flex items-center gap-2.5" };
 const _hoisted_2 = {
   key: 0,
@@ -23,6 +23,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     loadingLabel: {},
     action: {},
     glass: { type: Boolean, default: void 0 },
+    history: { type: [Boolean, String], default: void 0 },
     labels: {}
   },
   emits: ["update:open", "confirm", "cancel"],
@@ -76,6 +77,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createBlock(_sfc_main$1, {
         glass: __props.glass,
+        history: __props.history,
         open: __props.open,
         title: __props.title,
         description: __props.description,
@@ -130,7 +132,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ]),
           key: "0"
         } : void 0
-      ]), 1032, ["glass", "open", "title", "description"]);
+      ]), 1032, ["glass", "history", "open", "title", "description"]);
     };
   }
 });

package/dist/chunks/{LpConfirmHost-DvSZTJ4N.js → LpConfirmHost-QSJ0zl63.js}

@@ -1,6 +1,6 @@
 import { defineComponent, computed, ref, watch, openBlock, createBlock, createCommentVNode } from "vue";
 import { confirmQueue, settleConfirm } from "../components/confirm.js";
-import { _ as _sfc_main$1 } from "./LpConfirmDialog-DY2VjDji.js";
+import { _ as _sfc_main$1 } from "./LpConfirmDialog-CphJR6Q9.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpConfirmHost",
   props: {

package/dist/chunks/{LpDrawer-RRamxbLV.js → LpDrawer-DQZixOqJ.js}

@@ -4,6 +4,7 @@ import { CLOSE_ICON } from "../components/dropdown.js";
 import { prefersReducedMotion } from "../composables/easing.js";
 import { useCloseGuard } from "../composables/useCloseGuard.js";
 import { useGlass } from "../composables/useGlass.js";
+import { useOverlayHistory } from "../composables/useOverlayHistory.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { usePersisted } from "../composables/usePersisted.js";
 import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
@@ -48,6 +49,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     guard: { type: [Boolean, Function] },
     glass: { type: Boolean, default: void 0 },
     ariaLabel: {},
+    history: { type: [Boolean, String], default: void 0 },
     labels: {}
   },
   emits: ["update:open"],
@@ -87,6 +89,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (await allowClose()) emit("update:open", false);
     }
     __expose({ close: requestClose });
+    useOverlayHistory({
+      mode: () => props.history,
+      open: () => !!props.open,
+      close: async () => {
+        if (!await allowClose()) return false;
+        emit("update:open", false);
+        return true;
+      },
+      reopen: () => emit("update:open", true),
+      navigated: () => emit("update:open", false)
+    });
     function guardClose(event) {
       if (!armed()) return;
       event.preventDefault();

package/dist/chunks/{LpModal-BnjZ2iem.js → LpModal-C0tGg_D_.js}

@@ -2,6 +2,7 @@ import { defineComponent, ref, computed, useSlots, watch, onBeforeUnmount, openB
 import { DialogRoot, DialogPortal, DialogOverlay, DialogContent, DialogTitle, DialogDescription, DialogClose } from "reka-ui";
 import { useCloseGuard } from "../composables/useCloseGuard.js";
 import { useGlass } from "../composables/useGlass.js";
+import { useOverlayHistory } from "../composables/useOverlayHistory.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { useShift } from "../composables/useShift.js";
 import { useModalLayer } from "../components/modalDepth.js";
@@ -47,6 +48,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     role: {},
     dismissible: { type: Boolean, default: true },
     guard: { type: [Boolean, Function], default: void 0 },
+    history: { type: [Boolean, String], default: void 0 },
     labels: {}
   },
   emits: ["update:open"],
@@ -64,6 +66,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     function close() {
       void onOpenChange(false);
     }
+    useOverlayHistory({
+      mode: () => props.history,
+      open: () => !!props.open,
+      close: async () => {
+        if (!await allowClose()) return false;
+        emit("update:open", false);
+        return true;
+      },
+      reopen: () => emit("update:open", true),
+      navigated: () => emit("update:open", false)
+    });
     __expose({ close });
     function onEscape(event) {
       guardOutside(event);

package/dist/chunks/{LpModalNav-DQpV2kdn.js → LpModalNav-iDDtT9c1.js}

@@ -3,8 +3,8 @@ import { useGlass } from "../composables/useGlass.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { _ as _sfc_main$2 } from "./LpButton-CFb44IjC.js";
 import { _ as _sfc_main$3 } from "./LpIcon--5WSb3jJ.js";
-import { _ as _sfc_main$1 } from "./LpModal-BnjZ2iem.js";
-import { _ as _sfc_main$4 } from "./LpSidebar-BoNLKgh-.js";
+import { _ as _sfc_main$1 } from "./LpModal-C0tGg_D_.js";
+import { _ as _sfc_main$4 } from "./LpSidebar-D6zO8vLm.js";
 const _hoisted_1 = { class: "flex items-center gap-2" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpModalNav",

package/dist/chunks/{LpSidebar-BoNLKgh-.js → LpSidebar-D6zO8vLm.js}

@@ -2,7 +2,7 @@ import { defineComponent, computed, ref, useId, openBlock, createElementBlock, F
 import { useHotkeys, parseCombo } from "../composables/useHotkeys.js";
 import { usePersisted } from "../composables/usePersisted.js";
 import { useLabels } from "../composables/useLpConfig.js";
-import { _ as _sfc_main$5 } from "./LpDrawer-RRamxbLV.js";
+import { _ as _sfc_main$5 } from "./LpDrawer-DQZixOqJ.js";
 import { _ as _sfc_main$2 } from "./LpIcon--5WSb3jJ.js";
 import { _ as _sfc_main$3 } from "./LpInput-Tw-yxT4I.js";
 import { _ as _sfc_main$1 } from "./LpTooltip-BcBvIx4z.js";

package/dist/components/LpAddressInput.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpAddressInput-Al3HT5ey.js";
+import { _ as _sfc_main } from "../chunks/LpAddressInput-De_LTYM7.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpAppShell.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpAppShell-CpSSm5WT.js";
+import { _ as _sfc_main } from "../chunks/LpAppShell-Cpy_t1U_.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpConfirmDialog.vue.d.ts

@@ -1,3 +1,4 @@
+import type { OverlayHistoryMode } from "../composables/useOverlayHistory";
 export type ConfirmLabels = {
     confirm: string;
     cancel: string;
@@ -44,6 +45,8 @@ type __VLS_Props = {
     action?: () => unknown;
     /** Frosted glass panel, passed to LpModal. Follows `provideGlass` when unset. */
     glass?: boolean;
+    /** Browser history for the dialog, passed to LpModal. Follows `provideOverlayHistory` when unset. */
+    history?: OverlayHistoryMode;
     labels?: Partial<ConfirmLabels>;
 };
 declare var __VLS_16: {};
@@ -59,6 +62,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {},
     "onUpdate:open"?: ((value: boolean) => any) | undefined;
     onConfirm?: (() => any) | undefined;
 }>, {
+    history: OverlayHistoryMode;
     glass: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/components/LpConfirmDialog.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpConfirmDialog-DY2VjDji.js";
+import { _ as _sfc_main } from "../chunks/LpConfirmDialog-CphJR6Q9.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpConfirmHost.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpConfirmHost-DvSZTJ4N.js";
+import { _ as _sfc_main } from "../chunks/LpConfirmHost-QSJ0zl63.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpDrawer.vue.d.ts

@@ -1,4 +1,5 @@
 import { type CloseGuard } from "../composables/useCloseGuard";
+import { type OverlayHistoryMode } from "../composables/useOverlayHistory";
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
@@ -86,6 +87,13 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     glass?: boolean;
     /** Accessible name for a drawer without a visible `title`. */
     ariaLabel?: string;
+    /**
+     * Browser Back closes it, and opening it adds a history entry. Unset
+     * follows `provideOverlayHistory` (off without one); `"reopen"` also
+     * opens it again on Forward; `false` keeps it out of history, for an
+     * overlay the app already drives from its route.
+     */
+    history?: OverlayHistoryMode;
     labels?: Partial<{
         close: string;
     }>;
@@ -178,12 +186,20 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     glass?: boolean;
     /** Accessible name for a drawer without a visible `title`. */
     ariaLabel?: string;
+    /**
+     * Browser Back closes it, and opening it adds a history entry. Unset
+     * follows `provideOverlayHistory` (off without one); `"reopen"` also
+     * opens it again on Forward; `false` keeps it out of history, for an
+     * overlay the app already drives from its route.
+     */
+    history?: OverlayHistoryMode;
     labels?: Partial<{
         close: string;
     }>;
 }> & Readonly<{
     "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
+    history: OverlayHistoryMode;
     size: "sm" | "md" | "lg" | "xl";
     side: "left" | "right";
     glass: boolean;

package/dist/components/LpDrawer.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpDrawer-RRamxbLV.js";
+import { _ as _sfc_main } from "../chunks/LpDrawer-DQZixOqJ.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpModal.vue.d.ts

@@ -1,4 +1,5 @@
 import { type CloseGuard } from "../composables/useCloseGuard";
+import { type OverlayHistoryMode } from "../composables/useOverlayHistory";
 type __VLS_Props = {
     open?: boolean;
     title?: string;
@@ -52,6 +53,13 @@ type __VLS_Props = {
      * form's state, `:guard="form.dirty"`. See `useCloseGuard`.
      */
     guard?: CloseGuard;
+    /**
+     * Browser Back closes it, and opening it adds a history entry. Unset
+     * follows `provideOverlayHistory` (off without one); `"reopen"` also
+     * opens it again on Forward; `false` keeps it out of history, for an
+     * overlay the app already drives from its route.
+     */
+    history?: OverlayHistoryMode;
     labels?: Partial<{
         close: string;
     }>;
@@ -91,6 +99,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
+    history: OverlayHistoryMode;
     size: "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full";
     autoFocus: "auto" | "none" | string;
     glass: boolean;

package/dist/components/LpModal.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpModal-BnjZ2iem.js";
+import { _ as _sfc_main } from "../chunks/LpModal-C0tGg_D_.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpModalNav.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpModalNav-DQpV2kdn.js";
+import { _ as _sfc_main } from "../chunks/LpModalNav-iDDtT9c1.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpShortcutsDialog.vue.d.ts

@@ -1,3 +1,4 @@
+import type { OverlayHistoryMode } from "../composables/useOverlayHistory";
 import { type ShortcutGroup } from "../composables/useHotkeys";
 type __VLS_Props = {
     open?: boolean;
@@ -8,6 +9,8 @@ type __VLS_Props = {
     description?: string;
     /** Frosted glass panel, passed to LpModal. Follows `provideGlass` when unset. */
     glass?: boolean;
+    /** Browser history for the dialog, passed to LpModal. Follows `provideOverlayHistory` when unset. */
+    history?: OverlayHistoryMode;
     /**
      * A key that toggles the reference, e.g. "F1". Bound only while the dialog
      * is mounted, also inside inputs and over other overlays, and the browser's
@@ -20,6 +23,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
+    history: OverlayHistoryMode;
     title: string;
     open: boolean;
     glass: boolean;

package/dist/components/LpShortcutsDialog.vue.js

@@ -1,10 +1,10 @@
 import { defineComponent, computed, openBlock, createBlock, unref, withCtx, createElementVNode, createElementBlock, Fragment, renderList, toDisplayString, createTextVNode, createCommentVNode, createVNode } from "vue";
 import LpKeys from "./LpKeys.vue.js";
-import { _ as _sfc_main$1 } from "../chunks/LpModal-BnjZ2iem.js";
+import { _ as _sfc_main$1 } from "../chunks/LpModal-C0tGg_D_.js";
 import { mergeShortcutGroups, activeShortcuts, useHotkeys } from "../composables/useHotkeys.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { _ as _export_sfc } from "../chunks/_plugin-vue_export-helper-1tPrXgE0.js";
-import '../assets/LpShortcutsDialog-BUp_BX4s.css';const _hoisted_1 = { class: "shortcut-groups" };
+import '../assets/LpShortcutsDialog-C6uzPeMf.css';const _hoisted_1 = { class: "shortcut-groups" };
 const _hoisted_2 = ["aria-label", "title"];
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpShortcutsDialog",
@@ -15,6 +15,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     title: { default: void 0 },
     description: {},
     glass: { type: Boolean, default: void 0 },
+    history: { type: [Boolean, String], default: void 0 },
     hotkey: {}
   },
   emits: ["update:open"],
@@ -42,6 +43,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createBlock(_sfc_main$1, {
         glass: props.glass,
+        history: props.history,
         open: props.open,
         size: "lg",
         title: props.title ?? unref(text).title,
@@ -85,11 +87,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ])
         ]),
         _: 1
-      }, 8, ["glass", "open", "title", "description"]);
+      }, 8, ["glass", "history", "open", "title", "description"]);
     };
   }
 });
-const LpShortcutsDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-611c415f"]]);
+const LpShortcutsDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f948ed00"]]);
 export {
   LpShortcutsDialog as default
 };

package/dist/components/LpSidebar.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpSidebar-BoNLKgh-.js";
+import { _ as _sfc_main } from "../chunks/LpSidebar-D6zO8vLm.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpTabs.vue.d.ts

@@ -52,6 +52,14 @@ type __VLS_Props = {
      * icon keep their label.
      */
     compact?: boolean;
+    /**
+     * Record each switch as a browser history entry, so Back returns to the
+     * previous tab. Unset follows the overlay the tabs sit in (a modal or a
+     * drawer with history on, see `provideOverlayHistory`) and is off
+     * elsewhere: a page's own tabs belong in its URL. `false` opts out inside
+     * an overlay, `true` opts in on a page that keeps no URL of its own.
+     */
+    history?: boolean;
 };
 declare var __VLS_67: {
     value: string;
@@ -66,6 +74,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {},
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
+    history: boolean;
     block: boolean;
     variant: "contained" | "plain" | "underline" | "bottom";
     accent: boolean;

package/dist/components/LpTabs.vue.js

@@ -3,13 +3,14 @@ import { usePaletteScope, usePaletteCommands } from "../composables/usePaletteCo
 import { Motion } from "motion-v";
 import { TabsRoot, TabsList, TabsTrigger, TabsContent } from "reka-ui";
 import { usePillTransition } from "../composables/usePillTransition.js";
+import { useStepHistory } from "../composables/useOverlayHistory.js";
 import { prefersReducedMotion } from "../composables/easing.js";
 import { _ as _sfc_main$1 } from "../chunks/LpContextMenu-rx2tCjwk.js";
 import { _ as _sfc_main$3 } from "../chunks/LpSkeleton-BB6XIV-w.js";
 import { _ as _sfc_main$2 } from "../chunks/LpTabFace-DPCwKkH2.js";
 import { pickTab, BOTTOM_BAR, BOTTOM_ITEM, BOTTOM_MARKER } from "./tabs.js";
 import { _ as _export_sfc } from "../chunks/_plugin-vue_export-helper-1tPrXgE0.js";
-import '../assets/LpTabs-CDchzoRL.css';const _sfc_main = /* @__PURE__ */ defineComponent({
+import '../assets/LpTabs-CJ0rYQbx.css';const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpTabs",
   props: {
     modelValue: {},
@@ -20,7 +21,8 @@ import '../assets/LpTabs-CDchzoRL.css';const _sfc_main = /* @__PURE__ */ defineC
     block: { type: Boolean, default: false },
     label: {},
     hoverFollow: { type: Boolean, default: true },
-    compact: { type: Boolean, default: false }
+    compact: { type: Boolean, default: false },
+    history: { type: Boolean, default: void 0 }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
@@ -54,10 +56,22 @@ import '../assets/LpTabs-CDchzoRL.css';const _sfc_main = /* @__PURE__ */ defineC
         row.scrollTo({ left, behavior: prefersReducedMotion() ? "auto" : "smooth" });
       });
     });
-    function select(value) {
+    function show(value) {
       if (props.modelValue === void 0) current.value = value;
       emit("update:modelValue", value);
     }
+    const { record } = useStepHistory({
+      mode: () => props.history,
+      set: show,
+      has: (value) => props.items.some((item) => item.value === value && !item.disabled)
+    });
+    function select(value) {
+      const from = current.value;
+      show(value);
+      void nextTick(() => {
+        if (from !== void 0 && current.value === value) record(from, value);
+      });
+    }
     const pillId = `lp-tab-indicator-${useId()}`;
     const hovered = ref(null);
     const pillTransition = usePillTransition();
@@ -195,7 +209,7 @@ import '../assets/LpTabs-CDchzoRL.css';const _sfc_main = /* @__PURE__ */ defineC
     };
   }
 });
-const LpTabs = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9f51a497"]]);
+const LpTabs = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1d673b52"]]);
 export {
   LpTabs as default
 };

package/dist/composables/overlayHistory.d.ts

@@ -0,0 +1,33 @@
+export interface HistoryEntry {
+    /** Back left this entry: undo what it recorded (close the overlay, restore the tab). */
+    back: () => void;
+    /** Forward came back to it: redo it, and say whether that happened. */
+    forward?: () => boolean;
+    /** The page moved on to another path while this entry was live. */
+    navigated?: () => void;
+    /** The component that pushed it is still mounted. */
+    alive: boolean;
+}
+/**
+ * What the kit needs of a router: vue-router's `listening` switch, or the same
+ * flag on any router that skips its popstate handling while it is false.
+ */
+export interface HistoryRouter {
+    listening: boolean;
+}
+/** The app's router, told not to listen while a step only concerns the kit. */
+export declare function setHistoryRouter(router: HistoryRouter | null): void;
+/** Record an entry on top of the history, under the current address. */
+export declare function pushEntry(entry: HistoryEntry): void;
+/**
+ * The thing behind an entry ended without Back (a close button, Escape, the
+ * app setting `open` to false, an unmount): take the entry and everything
+ * pushed above it out of history, so Back is never spent on a dead step.
+ * When the page is not sitting on the kit's entries (another push came on top),
+ * the entry stays in place and is skipped when Back or Forward lands on it.
+ */
+export declare function dropEntry(entry: HistoryEntry): void;
+/** Whether the entry is live: pushed and not yet popped or dropped. */
+export declare function isLive(entry: HistoryEntry): boolean;
+/** Live entries, bottom first. For tests and devtools. */
+export declare function liveEntries(): number;