@leavepulse/ui 0.41.0 → 0.43.0

package/src/components/LpLightbox.vue

@@ -21,10 +21,11 @@ import {
   DialogRoot,
   DialogTitle,
 } from "reka-ui"
-import { computed, nextTick, ref, watch } from "vue"
+import { computed, nextTick, onBeforeUnmount, ref, watch } from "vue"
 import { useZoomPan } from "../composables/useZoomPan"
 import { fileNameOf, type LightboxItem } from "./lightbox"
 import LpIcon from "./LpIcon.vue"
+import { useModalLayer } from "./modalDepth"
 
 const props = withDefaults(
   defineProps<{
@@ -67,6 +68,10 @@ const emit = defineEmits<{
   (e: "copy", item: LightboxItem, ok: boolean): void
 }>()
 
+const { claim, release, layer } = useModalLayer()
+watch(() => props.open, (open) => (open ? claim() : release()), { immediate: true })
+onBeforeUnmount(release)
+
 defineSlots<{
   /** Replace the caption block under the image. */
   caption(props: { item: LightboxItem; index: number; total: number }): unknown
@@ -335,13 +340,14 @@ const ARROW =
 <template>
   <DialogRoot :open="open" @update:open="(v) => emit('update:open', v)">
     <DialogPortal>
-      <!-- Sits on the lightbox rung, not the shared modal one: opening this
-           from inside a dialog must cover that dialog, not tie with it. -->
       <DialogOverlay
-        class="lp-scrim lp-scrim--deep fixed inset-0 z-(--z-lightbox-overlay) data-[state=open]:animate-[fade-in_var(--duration-medium)_var(--ease-emphasized)] data-[state=closed]:animate-[fade-out_120ms_ease]"
+        class="lp-scrim fixed inset-0 data-[state=open]:animate-[fade-in_var(--duration-medium)_var(--ease-emphasized)] data-[state=closed]:animate-[fade-out_120ms_ease]"
+        :class="{ 'lp-scrim--nested': layer.nested }"
+        :style="{ zIndex: layer.scrim }"
       />
       <DialogContent
-        class="fixed inset-0 z-(--z-lightbox) flex flex-col outline-none data-[state=open]:animate-[lightbox-in_var(--duration-medium)_var(--ease-emphasized)] data-[state=closed]:animate-[lightbox-out_140ms_cubic-bezier(0.4,0,1,1)] motion-reduce:animate-none"
+        class="fixed inset-0 flex flex-col outline-none data-[state=open]:animate-[lightbox-in_var(--duration-medium)_var(--ease-emphasized)] data-[state=closed]:animate-[lightbox-out_140ms_cubic-bezier(0.4,0,1,1)] motion-reduce:animate-none"
+        :style="{ zIndex: layer.panel }"
         @keydown="onKeydown"
       >
         <!-- reka wants both for a labelled dialog; the caption is the title. -->

package/src/components/LpModal.vue

@@ -232,7 +232,7 @@ watch(
   <DialogRoot :open="open" @update:open="(v) => $emit('update:open', v)">
     <DialogPortal>
       <DialogOverlay
-        :class="{ 'lp-scrim--light': frosted }"
+        :class="{ 'lp-scrim--light': frosted, 'lp-scrim--nested': layer.nested }"
         class="lp-scrim fixed inset-0 data-[state=open]:animate-[fade-in_var(--duration-medium)_var(--ease-emphasized)] data-[state=closed]:animate-[fade-out_120ms_ease]"
         :style="{ zIndex: layer.scrim }"
       />
@@ -302,7 +302,7 @@ watch(
       <div
         ref="panelRef"
         class="flex max-h-[min(90vh,calc(100dvh-2rem))] min-h-0 flex-col overflow-hidden rounded-card border border-line shadow-panel"
-        :class="[frosted ? 'lp-glass-overlay' : 'bg-surface-raised', widthClass, tweening ? 'transition-[height] duration-fast ease-[var(--ease-emphasized)] motion-reduce:transition-none' : '']"
+        :class="[frosted ? (layer.nested ? 'lp-glass-overlay--nested' : 'lp-glass-overlay') : 'bg-surface-raised', widthClass, tweening ? 'transition-[height] duration-fast ease-[var(--ease-emphasized)] motion-reduce:transition-none' : '']"
         :style="{ ...(width ? { width } : {}), ...(hasAside ? { alignSelf: 'stretch' } : {}) }"
       >
         <header v-if="title || $slots.title" class="flex shrink-0 items-start justify-between gap-4 p-5 pb-3">

package/src/components/commandSearch.ts

@@ -0,0 +1,92 @@
+export interface SearchableCommand {
+  label: string
+  description?: string
+  keywords?: string[]
+  group?: string
+}
+
+export interface CommandSearchTerms {
+  include: string[]
+  exclude: string[]
+  groups: string[]
+}
+
+const QUERY_TOKEN = /(-?)(?:(in):)?(?:"([^"]*)"|(\S+))/giu
+const LATIN = "qwertyuiop[]asdfghjkl;'zxcvbnm,.`"
+const CYRILLIC = "йцукенгшщзхъфывапролджэячсмитьбюё"
+const SWAP = new Map<string, string>()
+
+for (let i = 0; i < LATIN.length; i++) {
+  SWAP.set(LATIN[i]!, CYRILLIC[i]!)
+  SWAP.set(CYRILLIC[i]!, LATIN[i]!)
+}
+
+export function parseCommandQuery(value: string): CommandSearchTerms {
+  const out: CommandSearchTerms = { include: [], exclude: [], groups: [] }
+  QUERY_TOKEN.lastIndex = 0
+  for (let match; (match = QUERY_TOKEN.exec(value)); ) {
+    const text = (match[3] ?? match[4] ?? "").trim().toLowerCase()
+    if (!text) continue
+    if (match[2] && !match[1]) out.groups.push(text)
+    else if (match[1]) out.exclude.push(text)
+    else out.include.push(text)
+  }
+  return out
+}
+
+export function swapCommandTerms(terms: CommandSearchTerms): CommandSearchTerms {
+  const swap = (term: string) => [...term].map((ch) => SWAP.get(ch) ?? ch).join("")
+  return {
+    include: terms.include.map(swap),
+    exclude: terms.exclude.map(swap),
+    groups: terms.groups.map(swap),
+  }
+}
+
+function matches(command: SearchableCommand, term: string): boolean {
+  return (
+    command.label.toLowerCase().includes(term)
+    || (command.keywords ?? []).some((keyword) => keyword.toLowerCase().includes(term))
+    || (command.description?.toLowerCase().includes(term) ?? false)
+  )
+}
+
+function withinOne(a: string, b: string): boolean {
+  if (Math.abs(a.length - b.length) > 1) return false
+  let i = 0
+  while (i < a.length && i < b.length && a[i] === b[i]) i++
+  if (i === a.length || i === b.length) return true
+  const rest = (x: number, y: number) => a.slice(i + x) === b.slice(i + y)
+  return rest(1, 1) || rest(1, 0) || rest(0, 1) || (a[i] === b[i + 1] && a[i + 1] === b[i] && rest(2, 2))
+}
+
+function nearWord(term: string, label: string): boolean {
+  if (term.length < 5) return false
+  return label
+    .split(/[^\p{L}\p{N}]+/u)
+    .some((word) => withinOne(term, word) || (word.length > term.length && withinOne(term, word.slice(0, term.length))))
+}
+
+function score(command: SearchableCommand, terms: CommandSearchTerms): number {
+  const label = command.label.toLowerCase()
+  const keywords = (command.keywords ?? []).map((keyword) => keyword.toLowerCase())
+  const description = command.description?.toLowerCase() ?? ""
+  const group = command.group?.toLowerCase() ?? ""
+  if (terms.exclude.some((term) => matches(command, term)) || terms.groups.some((term) => !group.includes(term))) return 0
+  let total = terms.include.length ? 0 : 1
+  for (const term of terms.include) {
+    let hit = (label.includes(term) ? 4 : 0) + (keywords.some((keyword) => keyword.includes(term)) ? 3 : 0) + (description.includes(term) ? 2 : 0)
+    if (!hit && nearWord(term, label)) hit = 1
+    if (!hit) return 0
+    total += hit
+  }
+  return total
+}
+
+export function rankCommandItems<T extends SearchableCommand>(items: T[], terms: CommandSearchTerms): T[] {
+  return items
+    .map((command) => ({ command, score: score(command, terms) }))
+    .filter((entry) => entry.score > 0)
+    .sort((a, b) => b.score - a.score || a.command.label.localeCompare(b.command.label))
+    .map((entry) => entry.command)
+}

package/src/components/modalDepth.ts

@@ -1,61 +1,17 @@
-/*
- * Stacking order for dialogs that are open at the same time.
- *
- * Not provide/inject, which was the first shape tried: it only works when the
- * second dialog is rendered INSIDE the first one's subtree, and the ordinary
- * way to write a dialog opened from a dialog is to put both at the top level of
- * the same component and toggle them with separate flags. Those two are
- * siblings, so the inner one injects nothing and lands on the same rungs as the
- * outer — which is the bug.
- *
- * What decides the order is the sequence of OPENING: a dialog opened while
- * another is up belongs above it, wherever it sits in the markup.
- *
- * The newest dialog keeps the scale's own --z-overlay/--z-modal and the ones
- * beneath are pushed DOWN, rather than each new dialog climbing higher. Climbing
- * runs out of room immediately: --z-popover is only 10 above --z-modal, so the
- * second nested dialog would tie with every popover and the third with every
- * tooltip — and a select inside a dialog is ordinary. Descending has no such
- * ceiling, and it keeps the frontmost dialog exactly where a single one has
- * always been.
- */
 import { computed, ref, type ComputedRef } from "vue"
 
-/*
- * Rungs per level. Has to clear a whole level, not just its scrim: --z-overlay
- * is 100 and --z-modal 110, so a gap of 2 left the upper scrim under the lower
- * PANEL — it darkened that panel and could not blur it, a backdrop-filter
- * having nothing of it underneath to work on.
- *
- * Clearing it means strictly more than the 10 between the two rungs. A step of
- * exactly 10 put the lower panel at 100, level with the upper scrim, and a tie
- * in z-index is settled by DOM order. Siblings in one component happened to
- * come out right, but a dialog mounted once at the app root — opened from a
- * page dialog that teleported in later — lost the tie, and its scrim darkened
- * the page behind the first dialog instead of the first dialog itself.
- */
 const STEP = 20
 
-/** Levels currently claimed, oldest first. */
 const stack = ref<number[]>([])
 let nextId = 0
 
-/**
- * Register a dialog as open and get back the z-indexes it should paint with.
- * The result is reactive: opening another dialog moves this one down a step.
- */
 export function useModalLayer(): {
   claim: () => void
   release: () => void
-  layer: ComputedRef<{ scrim: string; panel: string }>
+  layer: ComputedRef<{ scrim: string; panel: string; nested: boolean }>
 } {
   const id = nextId++
 
-  /*
-   * How far from the TOP of the stack, so the newest dialog is 0 and keeps the
-   * unmodified rungs. A dialog that is not in the stack reads 0 too: it is
-   * either closed, or opening this very frame and about to claim.
-   */
   const fromTop = computed(() => {
     const at = stack.value.indexOf(id)
     return at === -1 ? 0 : stack.value.length - 1 - at
@@ -71,14 +27,14 @@ export function useModalLayer(): {
     layer: computed(() => {
       const drop = fromTop.value * STEP
       return {
-        scrim: `calc(var(--z-overlay) - ${drop})`,
-        panel: `calc(var(--z-modal) - ${drop})`,
+        scrim: `calc(var(--z-toast) - 20 - ${drop})`,
+        panel: `calc(var(--z-toast) - 10 - ${drop})`,
+        nested: stack.value.indexOf(id) > 0,
       }
     }),
   }
 }
 
-/** True while any dialog or drawer holds a level — e.g. to keep a gesture from opening another one over it. */
 export function anyModalOpen(): boolean {
   return stack.value.length > 0
 }

package/src/composables/useHotkeys.ts

@@ -142,6 +142,8 @@ function matches(event: KeyboardEvent, binding: HotkeyBinding): boolean {
  * formality.
  */
 export interface UseHotkeysOptions {
+  enabled?: MaybeRefOrGetter<boolean>
+  priority?: MaybeRefOrGetter<number>
   /**
    * Only act while the focus is inside this element.
    *
@@ -157,52 +159,70 @@ export interface UseHotkeysOptions {
   scope?: MaybeRefOrGetter<HTMLElement | null | undefined>
 }
 
-export function useHotkeys(
-  bindings: MaybeRefOrGetter<HotkeyBinding[]>,
-  options: UseHotkeysOptions = {},
-) {
-  function inScope(target: EventTarget | null): boolean {
-    const el = toValue(options.scope)
-    if (!el) return true
-    const node = target instanceof Node ? target : null
-    // The element itself counts: a focusable canvas holds the focus without
-    // containing anything that could.
-    return !!node && (el === node || el.contains(node))
-  }
+interface MountedHotkeys {
+  read: () => HotkeyBinding[]
+  scope: MaybeRefOrGetter<HTMLElement | null | undefined> | undefined
+  enabled: MaybeRefOrGetter<boolean> | undefined
+  priority: MaybeRefOrGetter<number> | undefined
+  order: number
+}
 
-  function onKeydown(event: KeyboardEvent) {
-    if (event.isComposing) return
-    if (!inScope(event.target)) return
-    const inTextEntry = isTextEntry(event.target)
-    for (const binding of toValue(bindings)) {
+const mounted = shallowReactive(new Set<MountedHotkeys>())
+let mountOrder = 0
+let listening = false
+
+function inScope(target: EventTarget | null, scope: MountedHotkeys["scope"]): boolean {
+  const el = toValue(scope)
+  if (!el) return true
+  const node = target instanceof Node ? target : null
+  return !!node && (el === node || el.contains(node))
+}
+
+function onKeydown(event: KeyboardEvent) {
+  if (event.isComposing) return
+  const inTextEntry = isTextEntry(event.target)
+  const entries = [...mounted].sort(
+    (a, b) => Number(toValue(b.priority) || 0) - Number(toValue(a.priority) || 0) || b.order - a.order,
+  )
+  for (const entry of entries) {
+    if (toValue(entry.enabled) === false || !inScope(event.target, entry.scope)) continue
+    for (const binding of entry.read()) {
       if (inTextEntry && !binding.allowInInput) continue
       if (!matches(event, binding)) continue
-      // Claimed only once the handler has run and not declined, so a binding
-      // that stands down leaves the key untouched for whoever handles it next.
       if (binding.handler(event) === false) continue
       event.preventDefault()
       return
     }
   }
+}
 
-  const read = () => toValue(bindings)
+export function useHotkeys(
+  bindings: MaybeRefOrGetter<HotkeyBinding[]>,
+  options: UseHotkeysOptions = {},
+) {
+  const entry: MountedHotkeys = {
+    read: () => toValue(bindings),
+    scope: options.scope,
+    enabled: options.enabled,
+    priority: options.priority,
+    order: ++mountOrder,
+  }
   onMounted(() => {
-    window.addEventListener("keydown", onKeydown)
-    mounted.add(read)
+    mounted.add(entry)
+    if (!listening) {
+      window.addEventListener("keydown", onKeydown)
+      listening = true
+    }
   })
   onBeforeUnmount(() => {
-    window.removeEventListener("keydown", onKeydown)
-    mounted.delete(read)
+    mounted.delete(entry)
+    if (!mounted.size && listening) {
+      window.removeEventListener("keydown", onKeydown)
+      listening = false
+    }
   })
 }
 
-/*
- * Every mounted binding list, in mount order. The lists are getters, so the
- * reference below follows the state behind them too: a binding that only
- * exists while a mode is on shows up and goes away with that mode.
- */
-const mounted = shallowReactive(new Set<() => HotkeyBinding[]>())
-
 const KEY_NAMES: Record<string, string> = {
   escape: "Esc",
   enter: "Enter",
@@ -230,8 +250,9 @@ function comboOf(binding: HotkeyBinding): string {
  */
 export const activeShortcuts = computed<ShortcutGroup[]>(() => {
   const groups = new Map<string, ShortcutEntry[]>()
-  for (const read of mounted) {
-    for (const binding of read()) {
+  for (const entry of mounted) {
+    if (toValue(entry.enabled) === false) continue
+    for (const binding of entry.read()) {
       if (!binding.help) continue
       const combo = binding.help.combo ?? comboOf(binding)
       const entries = groups.get(binding.help.group) ?? []

package/src/index.ts

@@ -65,6 +65,8 @@ export {
 export type { ColorFormat, Hsv, Rgb } from "./components/color"
 export { default as LpCommandPalette } from "./components/LpCommandPalette.vue"
 export type { Command, PaletteLabels } from "./components/LpCommandPalette.vue"
+export { parseCommandQuery, rankCommandItems, swapCommandTerms } from "./components/commandSearch"
+export type { CommandSearchTerms, SearchableCommand } from "./components/commandSearch"
 export { default as LpConfirmDialog } from "./components/LpConfirmDialog.vue"
 export { default as LpContextMenu } from "./components/LpContextMenu.vue"
 export type { ContextMenuItemDef } from "./components/LpContextMenu.vue"

package/src/tokens/tokens.css

@@ -171,14 +171,6 @@
   --z-tooltip: 130;
   --z-toast: 200;
 
-  /* A lightbox is usually opened FROM a dialog — click a thumbnail in a modal
-     and the full image comes up over it. Sharing --z-overlay/--z-modal left
-     that order to DOM insertion alone, so the lightbox's own scrim landed on
-     top of the modal panel and swallowed it while double-darkening the page
-     behind. Its own rung above the modal (but below tooltip/toast, which must
-     outrank everything) makes the stack explicit. */
-  --z-lightbox-overlay: 140;
-  --z-lightbox: 150;
 }
 
 /* ── overlay enter/exit animations ───────────────
@@ -511,17 +503,6 @@
   --scrim-opacity: 0.62;
 }
 
-/*
- * A lightbox is the one scrim that hides a whole page behind a photo, and it is
- * usually opened FROM a dialog — so it is the layer the mild shared tint serves
- * worst: without the blur, the content behind stayed readable around the image.
- * It gets its own value instead of raising the shared one, which would darken
- * every stacked pair.
- */
-:root[data-lp-no-backdrop] .lp-scrim--deep {
-  --scrim-opacity: 0.78;
-}
-
 /*
  * Under a glass panel (.lp-glass-overlay) the usual tint leaves nothing but
  * grey to see through it, so the scrim dims less and the panel's own blur
@@ -532,6 +513,12 @@
   --scrim-opacity: 0.32;
 }
 
+.lp-scrim--nested {
+  --scrim-opacity: 0.24;
+  -webkit-backdrop-filter: none;
+  backdrop-filter: none;
+}
+
 /*
  * Frosted overlay: a floating panel that lets the page show through, softened.
  * For surfaces that float over everything and are read briefly (the command
@@ -550,6 +537,13 @@
   backdrop-filter: blur(var(--glass-overlay-blur, 28px)) saturate(170%);
 }
 
+.lp-glass-overlay--nested {
+  background-color: color-mix(in srgb, var(--color-surface-raised) 88%, transparent);
+  background-image: none;
+  -webkit-backdrop-filter: none;
+  backdrop-filter: none;
+}
+
 :root[data-lp-no-backdrop] .lp-glass-overlay {
   background-color: var(--color-surface-raised);
   background-image: none;

package/dist/component-names.d.ts

@@ -1 +0,0 @@
-export declare const COMPONENT_NAMES: readonly ["LayoutCanvas", "LayoutNode", "LpActionBar", "LpAddressInput", "LpAlert", "LpAppShell", "LpAutocomplete", "LpAvatar", "LpBadge", "LpBreadcrumbs", "LpButton", "LpCalendar", "LpCard", "LpChart", "LpCheckbox", "LpCodeBlock", "LpColorPicker", "LpCommandPalette", "LpConfirmDialog", "LpContextMenu", "LpDatePicker", "LpDisclosure", "LpDivider", "LpDrawer", "LpDropdownMenu", "LpDropzone", "LpEmptyState", "LpFileTree", "LpFileTreeNode", "LpFormField", "LpIcon", "LpImageEditor", "LpInfraNode", "LpInput", "LpLaneNode", "LpLightbox", "LpLink", "LpLogViewer", "LpMapPicker", "LpMediaGallery", "LpModal", "LpModalNav", "LpNotificationBell", "LpNumberField", "LpNumberFlow", "LpOtpInput", "LpPagination", "LpPasswordInput", "LpPhoneInput", "LpPie", "LpPopover", "LpProgress", "LpRadio", "LpRadioGroup", "LpRollingText", "LpScrollArea", "LpSection", "LpSegmented", "LpSelect", "LpServiceNode", "LpShift", "LpShortcutsDialog", "LpSidebar", "LpSidebarNav", "LpSkeleton", "LpSlider", "LpSparkline", "LpStat", "LpStepper", "LpSwitch", "LpTable", "LpTableOfContents", "LpTabs", "LpTextarea", "LpThemeSwitcher", "LpTilt", "LpTimeField", "LpToaster", "LpTooltip", "LpTopologyCanvas", "LpUptimeBar", "LpWaypointEdge"];

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

@@ -1,28 +0,0 @@
-import { Split } from '../layout/tree';
-import { BlockRegistry } from '../layout/registry';
-type __VLS_Props = {
-    modelValue: Split;
-    edit?: boolean;
-    /** Catalogue mapping block ids to titles/icons for the tab bars. */
-    registry?: BlockRegistry;
-};
-type __VLS_Slots = {
-    block(props: {
-        block: string;
-        leafId: string;
-        edit: boolean;
-    }): unknown;
-};
-declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    "update:modelValue": (value: Split) => any;
-}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:modelValue"?: ((value: Split) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

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

@@ -1,40 +0,0 @@
-import { LayoutNode, Side, Split } from '../layout/tree';
-import { BlockRegistry } from '../layout/registry';
-type __VLS_Props = {
-    node: LayoutNode;
-    dragId: string | null;
-    edit: boolean;
-    registry?: BlockRegistry;
-};
-type __VLS_Slots = {
-    block(props: {
-        block: string;
-        leafId: string;
-        edit: boolean;
-    }): unknown;
-};
-declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    dragstart: (id: string) => any;
-    dragend: () => any;
-    drop: (targetId: string, side: Side) => any;
-    "set-active": (leafId: string, index: number) => any;
-    "remove-block": (leafId: string, index: number) => any;
-    "reorder-tab": (leafId: string, from: number, to: number) => any;
-    resize: (parent: Split, index: number, deltaFraction: number) => any;
-}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onDragstart?: ((id: string) => any) | undefined;
-    onDragend?: (() => any) | undefined;
-    onDrop?: ((targetId: string, side: Side) => any) | undefined;
-    "onSet-active"?: ((leafId: string, index: number) => any) | undefined;
-    "onRemove-block"?: ((leafId: string, index: number) => any) | undefined;
-    "onReorder-tab"?: ((leafId: string, from: number, to: number) => any) | undefined;
-    onResize?: ((parent: Split, index: number, deltaFraction: number) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

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

@@ -1,84 +0,0 @@
-export interface ActionBarAction {
-    label: string;
-    /** Leading icon (any name LpIcon takes). */
-    icon?: string;
-    /** Mirrors LpButton's variants; the default reads as the primary action. */
-    variant?: "solid" | "action" | "outline" | "soft" | "ghost" | "muted" | "light" | "danger";
-    disabled?: boolean;
-    /** Shows a spinner in place of the icon and blocks repeat clicks. */
-    loading?: boolean;
-    onClick?: () => void | Promise<void>;
-}
-type __VLS_Props = {
-    /** Shown or not (v-model:open, or a plain :open). */
-    open?: boolean;
-    /** Lead line — "You have unsaved changes". */
-    title?: string;
-    /** Second line, quieter. Long explanations belong here, not in the title. */
-    description?: string;
-    /** Leading icon. Omit for a bar that is purely text + buttons. */
-    icon?: string;
-    /**
-     * Buttons on the right, in reading order. The LAST one is the primary and
-     * gets the solid treatment unless it says otherwise — the confirming action
-     * sits closest to the edge the thumb and the eye finish on.
-     */
-    actions?: ActionBarAction[];
-    /** Adds a "✕" that emits `dismiss`. For notices, not for decisions. */
-    dismissible?: boolean;
-    /**
-     * Tone. `danger` for a destructive pending action; the default stays neutral
-     * because most of these bars are routine and a page edged in red for every
-     * unsaved field trains people to ignore red.
-     */
-    variant?: "default" | "danger";
-    /**
-     * How wide the bar runs.
-     *
-     * "contained" (the default) keeps it to the width of its own content, up to
-     * a cap, and centres it: a bar carrying six words and two buttons has no
-     * business spanning a 1920px display, and stretching it puts the buttons a
-     * screen away from the field you were editing.
-     *
-     * "full" spans the viewport edge to edge — for a cookie notice, which reads
-     * as part of the page frame rather than as a message about one thing on it.
-     * Its CONTENTS are still capped and centred, so the buttons stay beside the
-     * text instead of being flung to the far corner.
-     */
-    width?: "contained" | "full";
-    /**
-     * Cap for the bar (or, when `width="full"`, for the row inside it). Any CSS
-     * length. Defaults to a comfortable measure for a line of text and two or
-     * three buttons — wider for `full`, whose job is to span the page and whose
-     * contents therefore sit on the page's own measure, not a card's.
-     */
-    maxWidth?: string;
-    /** Accessible name for the landmark. Falls back to `title`. */
-    ariaLabel?: string;
-};
-declare var __VLS_18: {}, __VLS_20: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_18) => any;
-} & {
-    actions?: (props: typeof __VLS_20) => any;
-};
-declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    "update:open": (value: boolean) => any;
-    dismiss: () => any;
-}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    onDismiss?: (() => any) | undefined;
-}>, {
-    width: "contained" | "full";
-    open: boolean;
-    variant: "default" | "danger";
-    actions: ActionBarAction[];
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

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

@@ -1,70 +0,0 @@
-import { AddressLabels, AddressValue, GeocodeProvider, LatLon, TileSource } from './address';
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<import('vue').DefineComponent<{
-    /** The address. Bind with v-model. */
-    modelValue?: AddressValue;
-    /** Geocoder for suggestions and for the map's reverse lookup. */
-    provider?: GeocodeProvider;
-    /** Tile server handed to the built-in picker. */
-    tiles?: TileSource;
-    /** Restrict the country list (ISO2). Omit for every country. */
-    only?: string[];
-    /** Show the "apartment, suite" line. */
-    secondLine?: boolean;
-    /** Suggestions start after this many characters. */
-    minChars?: number;
-    /** Debounce before a suggestion request goes out. */
-    debounce?: number;
-    /** Accept-Language for the geocoder. */
-    language?: string;
-    disabled?: boolean;
-    size?: "sm" | "md" | "lg";
-    /** Hide the map button when picking a point makes no sense. */
-    hideMap?: boolean;
-    labels?: Partial<AddressLabels>;
-}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    "update:modelValue": (value: AddressValue) => any;
-    pick: (value: LatLon) => any;
-}, string, import('vue').PublicProps, Readonly<{
-    /** The address. Bind with v-model. */
-    modelValue?: AddressValue;
-    /** Geocoder for suggestions and for the map's reverse lookup. */
-    provider?: GeocodeProvider;
-    /** Tile server handed to the built-in picker. */
-    tiles?: TileSource;
-    /** Restrict the country list (ISO2). Omit for every country. */
-    only?: string[];
-    /** Show the "apartment, suite" line. */
-    secondLine?: boolean;
-    /** Suggestions start after this many characters. */
-    minChars?: number;
-    /** Debounce before a suggestion request goes out. */
-    debounce?: number;
-    /** Accept-Language for the geocoder. */
-    language?: string;
-    disabled?: boolean;
-    size?: "sm" | "md" | "lg";
-    /** Hide the map button when picking a point makes no sense. */
-    hideMap?: boolean;
-    labels?: Partial<AddressLabels>;
-}> & Readonly<{
-    "onUpdate:modelValue"?: ((value: AddressValue) => any) | undefined;
-    onPick?: ((value: LatLon) => any) | undefined;
-}>, {
-    size: "sm" | "md" | "lg";
-    minChars: number;
-    tiles: TileSource;
-    debounce: number;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, {
-    map?: (props: {
-        point: LatLon | undefined;
-        setPoint: (next: LatLon) => Promise<void>;
-        tiles: TileSource;
-    }) => any;
-}>;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};