@leavepulse/ui 0.78.1 → 0.78.3

package/dist/chunks/LpSwitch-DyAYTchz.js

@@ -0,0 +1,122 @@
+import { defineComponent, useSlots, computed, useId, openBlock, createBlock, normalizeProps, guardReactiveProps, unref, withCtx, resolveDynamicComponent, normalizeClass, createElementBlock, renderSlot, createTextVNode, toDisplayString, createCommentVNode, createVNode, mergeProps } from "vue";
+import { _ as _sfc_main$1 } from "./FieldWrapper-DnuMTrqW.js";
+import { usePaletteControl } from "../composables/usePaletteCommands.js";
+import { SwitchRoot, SwitchThumb } from "reka-ui";
+import { useOwnField, mergeDescribedBy } from "../composables/useField.js";
+import { useOptimisticToggle } from "../composables/useOptimisticToggle.js";
+import { _ as _sfc_main$2 } from "./LpLoader-Bf1yZwaU.js";
+import { useMergedAttrs } from "../composables/useMergedClass.js";
+const _hoisted_1 = {
+  key: 0,
+  class: "flex min-w-0 flex-col"
+};
+const _hoisted_2 = {
+  key: 1,
+  class: "flex min-w-0 flex-col"
+};
+const __default__ = { inheritAttrs: false };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "LpSwitch",
+  props: {
+    palette: { type: [Boolean, Object], default: void 0 },
+    modelValue: { type: Boolean },
+    disabled: { type: Boolean },
+    error: {},
+    label: {},
+    description: {},
+    labelPosition: { default: "end" },
+    action: {}
+  },
+  emits: ["update:modelValue", "done", "error"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const { pending, set } = useOptimisticToggle(() => props.action, emit);
+    const slots = useSlots();
+    const labelled = computed(() => Boolean(props.label || props.description || slots.default));
+    const TRACK = "group/switch inline-flex h-5 w-9 shrink-0 items-center rounded-pill border border-line bg-surface-soft px-0.5 outline-none transition-colors duration-[var(--duration-fast)] focus-visible:ring-2 focus-visible:ring-ring data-[state=checked]:border-transparent data-[state=checked]:bg-brand disabled:cursor-not-allowed disabled:opacity-55";
+    const THUMB = "h-3.5 w-3.5 rounded-full bg-ink shadow transition-[translate,width,background-color] duration-[var(--duration-fast)] ease-[var(--ease-emphasized)] group-active/switch:w-5 group-data-[state=checked]/switch:translate-x-4 group-data-[state=checked]/switch:bg-ink-inverse group-data-[state=checked]/switch:group-active/switch:translate-x-2.5 motion-reduce:group-active/switch:w-3.5";
+    const { class: rootClass, attrs: rest } = useMergedAttrs(() => {
+      if (!labelled.value) return TRACK;
+      return props.labelPosition === "start" ? "flex w-full cursor-pointer items-center justify-between gap-3 text-sm text-ink" : "inline-flex cursor-pointer items-center gap-2 text-sm text-ink";
+    }, () => ownAttrs());
+    const { field, wrapper, ownAttrs } = useOwnField(() => ({
+      error: props.error,
+      id: typeof rest.value.id === "string" ? rest.value.id : void 0,
+      disabled: props.disabled
+    }));
+    const descriptionId = `${useId()}-description`;
+    const describedBy = computed(
+      () => mergeDescribedBy(rest.value["aria-describedby"], props.description && labelled.value ? descriptionId : void 0, field.value.describedBy)
+    );
+    function onUpdate(value) {
+      void set(value);
+    }
+    usePaletteControl({ label: () => props.label, disabled: () => field.value.disabled || pending.value, editorProps: () => ({ action: void 0, "onUpdate:modelValue": onUpdate }) });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$1, normalizeProps(guardReactiveProps(unref(wrapper))), {
+        default: withCtx(() => [
+          (openBlock(), createBlock(resolveDynamicComponent(labelled.value ? "label" : "span"), {
+            class: normalizeClass(labelled.value ? [unref(rootClass), unref(field).disabled && "cursor-not-allowed"] : "contents")
+          }, {
+            default: withCtx(() => [
+              labelled.value && __props.labelPosition === "start" ? (openBlock(), createElementBlock("span", _hoisted_1, [
+                renderSlot(_ctx.$slots, "default", {}, () => [
+                  createTextVNode(toDisplayString(__props.label), 1)
+                ]),
+                __props.description ? (openBlock(), createElementBlock("span", {
+                  key: 0,
+                  id: descriptionId,
+                  class: "text-xs text-muted"
+                }, toDisplayString(__props.description), 1)) : createCommentVNode("", true)
+              ])) : createCommentVNode("", true),
+              createVNode(unref(SwitchRoot), mergeProps(unref(rest), {
+                id: unref(field).id,
+                "model-value": __props.modelValue,
+                disabled: unref(field).disabled,
+                required: unref(field).required,
+                "aria-describedby": describedBy.value,
+                "aria-busy": unref(pending) || void 0,
+                class: labelled.value ? TRACK : unref(rootClass),
+                "onUpdate:modelValue": onUpdate
+              }), {
+                default: withCtx(() => [
+                  createVNode(unref(SwitchThumb), {
+                    class: normalizeClass([THUMB, "grid place-items-center"])
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(_sfc_main$2, {
+                        active: unref(pending),
+                        size: "inline",
+                        "aria-hidden": "true",
+                        class: "text-[10px] text-ink-inverse group-data-[state=checked]/switch:text-ink"
+                      }, null, 8, ["active"])
+                    ]),
+                    _: 1
+                  }, 8, ["class"])
+                ]),
+                _: 1
+              }, 16, ["id", "model-value", "disabled", "required", "aria-describedby", "aria-busy", "class"]),
+              labelled.value && __props.labelPosition === "end" ? (openBlock(), createElementBlock("span", _hoisted_2, [
+                renderSlot(_ctx.$slots, "default", {}, () => [
+                  createTextVNode(toDisplayString(__props.label), 1)
+                ]),
+                __props.description ? (openBlock(), createElementBlock("span", {
+                  key: 0,
+                  id: descriptionId,
+                  class: "text-xs text-muted"
+                }, toDisplayString(__props.description), 1)) : createCommentVNode("", true)
+              ])) : createCommentVNode("", true)
+            ]),
+            _: 3
+          }, 8, ["class"]))
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/{LpTableFilter-B_XMOeAh.js → LpTableFilter-CJg5eIcV.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, computed, openBlock, createElementBlock, createBlock, createCommentVNode, createElementVNode, Fragment, unref, normalizeClass, toDisplayString, createVNode, withCtx, renderList } from "vue";
-import { _ as _sfc_main$3 } from "./LpCheckbox-D6RuDW4X.js";
-import { _ as _sfc_main$1 } from "./LpInput-D0O6dpuA.js";
+import { _ as _sfc_main$3 } from "./LpCheckbox-CCWCwD0y.js";
+import { _ as _sfc_main$1 } from "./LpInput-CbI7z5fQ.js";
 import { _ as _sfc_main$2 } from "./LpShift-DAgS_d2x.js";
 import { usePaintSelect } from "../composables/usePaintSelect.js";
 import { matchesQuery, onlyValues, unhideValues, hideAllValues, invertHidden } from "../components/tableFilter.js";

package/dist/chunks/{LpTagsInput-Dt0mteSj.js → LpTagsInput-CkNxpNYa.js}

@@ -2,7 +2,7 @@ import { defineComponent, useAttrs, computed, ref, useId, watch, openBlock, crea
 import { isNode, isInputElement } from "../composables/realm.js";
 import { usePaletteControl } from "../composables/usePaletteCommands.js";
 import { TagsInputRoot, TagsInputItem, TagsInputItemText, TagsInputItemDelete, TagsInputInput, PopoverRoot, PopoverAnchor, PopoverPortal, PopoverContent } from "reka-ui";
-import { useField, useFieldControl, mergeDescribedBy, fieldWrapperBinds } from "../composables/useField.js";
+import { useField, wrapsItself, useFieldControl, mergeDescribedBy, fieldWrapperBinds } from "../composables/useField.js";
 import { prefersReducedMotion } from "../composables/easing.js";
 import { useFieldNotice } from "../composables/useFieldNotice.js";
 import { useShift } from "../composables/useShift.js";
@@ -82,9 +82,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       () => props.labels
     );
     const attrs = useAttrs();
-    const hasField = computed(() => !!props.label || !!props.hint || !!props.error);
+    const outerFieldOf = useField();
+    const hasField = computed(() => wrapsItself(props, outerFieldOf));
     const notice = useFieldNotice();
-    const outerField = useField();
+    const outerField = outerFieldOf;
     const ownField = ref(null);
     function bindField(c) {
       ownField.value = hasField.value && c ? c : null;

package/dist/chunks/{LpTextarea-Co0b9PVx.js → LpTextarea-CFK_5QB8.js}

@@ -1,7 +1,7 @@
 import { defineComponent, computed, useAttrs, ref, watch, nextTick, onMounted, openBlock, createBlock, normalizeProps, guardReactiveProps, unref, withCtx, createElementVNode, mergeProps } from "vue";
 import { nodeWindow } from "../composables/realm.js";
 import { usePaletteControl } from "../composables/usePaletteCommands.js";
-import { useFieldControl, fieldWrapperBinds, mergeDescribedBy } from "../composables/useField.js";
+import { useField, wrapsItself, useFieldControl, fieldWrapperBinds, mergeDescribedBy } from "../composables/useField.js";
 import { mergeClass } from "../composables/useMergedClass.js";
 import { _ as _sfc_main$1 } from "./FieldWrapper-DnuMTrqW.js";
 const _hoisted_1 = ["id", "value", "placeholder", "rows", "disabled", "required", "aria-invalid", "aria-describedby"];
@@ -26,7 +26,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["update:modelValue"],
   setup(__props, { expose: __expose }) {
     const props = __props;
-    const hasField = computed(() => !!props.label || !!props.hint || !!props.error);
+    const outerFieldOf = useField();
+    const hasField = computed(() => wrapsItself(props, outerFieldOf));
     const attrs = useAttrs();
     const textareaAttrs = computed(() => {
       const { class: _c, style: _s, ...rest } = attrs;

package/dist/chunks/{LpThemeStudio-ChU0_Ga8.js → LpThemeStudio-R-wohbCY.js}

@@ -4,9 +4,9 @@ import { useLabels } from "../composables/useLpConfig.js";
 import { useThemeStudio, STUDIO_BRANDS, STUDIO_SYSTEM } from "../theme/studio.js";
 import { _ as _sfc_main$1 } from "./LpButton-DSHioIfD.js";
 import { _ as _sfc_main$7 } from "./LpCodeBlock-DBqy4RLd.js";
-import { _ as _sfc_main$4 } from "./LpColorPicker-COHzV68R.js";
+import { _ as _sfc_main$4 } from "./LpColorPicker-BONURBFN.js";
 import { _ as _sfc_main$2 } from "./LpIcon-C6JpQ5td.js";
-import { _ as _sfc_main$5 } from "./LpSegmented-DbEJhbv-.js";
+import { _ as _sfc_main$5 } from "./LpSegmented-sskrJKJJ.js";
 import { _ as _sfc_main$6 } from "./LpDisclosure-DG7JCo-d.js";
 import { _ as _sfc_main$8 } from "./LpThemeProvider-XK6ZeWAE.js";
 import { _ as _sfc_main$3 } from "./LpThemeStudioSection-B7bt8Iyg.js";

package/dist/chunks/{LpThemeSwitcher-DmCZ21P_.js → LpThemeSwitcher-Bzy15MCP.js}

@@ -11,7 +11,7 @@ import { _ as _sfc_main$1 } from "./LpContextMenu-Bx_IhQDS.js";
 import { _ as _sfc_main$2 } from "./LpIcon-C6JpQ5td.js";
 import { _ as _sfc_main$4 } from "./LpRollingText-B54Pje7P.js";
 import { _ as _sfc_main$3 } from "./LpShift-DAgS_d2x.js";
-import { _ as _sfc_main$5 } from "./LpThemeStudio-ChU0_Ga8.js";
+import { _ as _sfc_main$5 } from "./LpThemeStudio-R-wohbCY.js";
 const _hoisted_1 = ["aria-label", "title"];
 const _hoisted_2 = {
   key: 1,

package/dist/chunks/LpTimeField-B5n0m8m0.js

@@ -0,0 +1,115 @@
+import { defineComponent, computed, openBlock, createBlock, normalizeProps, guardReactiveProps, unref, withCtx, createVNode, mergeProps, createCommentVNode, createElementBlock, Fragment, renderList, createTextVNode, toDisplayString } from "vue";
+import { _ as _sfc_main$1 } from "./FieldWrapper-DnuMTrqW.js";
+import { CONTROL_SIZE } from "../components/controlSize.js";
+import { usePaletteControl } from "../composables/usePaletteCommands.js";
+import { Time } from "@internationalized/date";
+import { TimeFieldRoot, TimeFieldInput } from "reka-ui";
+import { useOwnField, mergeDescribedBy, focusLeft } from "../composables/useField.js";
+import { useMergedAttrs } from "../composables/useMergedClass.js";
+import { _ as _sfc_main$2 } from "./LpIcon-C6JpQ5td.js";
+const __default__ = { inheritAttrs: false };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  __name: "LpTimeField",
+  props: {
+    palette: { type: [Boolean, Object], default: void 0 },
+    modelValue: {},
+    disabled: { type: Boolean },
+    invalid: { type: Boolean },
+    error: {},
+    size: { default: "md" },
+    hourCycle: { default: 24 },
+    locale: {},
+    icon: { type: Boolean, default: true }
+  },
+  emits: ["update:modelValue", "blur"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    function onFocusOut(event) {
+      if (focusLeft(event)) emit("blur", event);
+    }
+    const value = computed(() => {
+      const match = /^(\d{2}):(\d{2})/.exec(props.modelValue || "");
+      return match ? new Time(Number(match[1]), Number(match[2])) : void 0;
+    });
+    function onUpdate(next) {
+      if (!next || typeof next !== "object" || !("hour" in next) || !("minute" in next)) {
+        emit("update:modelValue", void 0);
+        return;
+      }
+      const pad = (n) => String(n).padStart(2, "0");
+      emit("update:modelValue", `${pad(next.hour)}:${pad(next.minute)}`);
+    }
+    const { field, wrapper, ownAttrs } = useOwnField(() => ({
+      error: props.error,
+      invalid: props.invalid,
+      disabled: props.disabled
+    }));
+    const shellSize = CONTROL_SIZE;
+    const { class: rootClass, attrs: rest } = useMergedAttrs(() => [
+      "flex w-full items-center gap-0.5 rounded-control border bg-surface-soft px-3 text-ink transition-colors duration-[var(--duration-fast)] focus-within:ring-2 focus-within:ring-ring data-[disabled]:cursor-not-allowed data-[disabled]:opacity-55",
+      shellSize[props.size],
+      field.value.invalid ? "border-danger focus-within:ring-danger-soft" : "border-line focus-within:border-brand"
+    ].join(" "), () => ownAttrs());
+    usePaletteControl({ disabled: () => field.value.disabled, invalid: () => field.value.invalid });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$1, normalizeProps(guardReactiveProps(unref(wrapper))), {
+        default: withCtx(() => [
+          createVNode(unref(TimeFieldRoot), mergeProps({
+            "model-value": value.value,
+            "hour-cycle": __props.hourCycle,
+            locale: __props.locale,
+            granularity: "minute",
+            disabled: unref(field).disabled,
+            required: unref(field).required,
+            "aria-invalid": unref(field).invalid || void 0,
+            "aria-labelledby": unref(field).labelId,
+            class: unref(rootClass)
+          }, unref(rest), {
+            "aria-describedby": unref(mergeDescribedBy)(unref(rest)["aria-describedby"], unref(field).describedBy),
+            "onUpdate:modelValue": onUpdate,
+            onFocusout: onFocusOut
+          }), {
+            default: withCtx(({ segments }) => [
+              __props.icon ? (openBlock(), createBlock(_sfc_main$2, {
+                key: 0,
+                name: "lucide:clock",
+                size: 15,
+                class: "mr-1.5 shrink-0 text-muted"
+              })) : createCommentVNode("", true),
+              (openBlock(true), createElementBlock(Fragment, null, renderList(segments, (item, i) => {
+                return openBlock(), createElementBlock(Fragment, { key: i }, [
+                  item.part === "literal" ? (openBlock(), createBlock(unref(TimeFieldInput), {
+                    key: 0,
+                    part: item.part,
+                    class: "text-muted"
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(item.value), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["part"])) : (openBlock(), createBlock(unref(TimeFieldInput), {
+                    key: 1,
+                    part: item.part,
+                    class: "rounded-sm px-0.5 tabular-nums outline-none focus:bg-brand-soft focus:text-brand data-[placeholder]:text-muted"
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(item.value), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["part"]))
+                ], 64);
+              }), 128))
+            ]),
+            _: 1
+          }, 16, ["model-value", "hour-cycle", "locale", "disabled", "required", "aria-invalid", "aria-labelledby", "class", "aria-describedby"])
+        ]),
+        _: 1
+      }, 16);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/{LpTopologyCanvas-jqz1KCq2.js → LpTopologyCanvas-BNgw9RyZ.js}

@@ -11,10 +11,10 @@ import { backgroundOf, resolveCssColor, svgToPng } from "../components/exportDat
 import { _ as _sfc_main$6 } from "./LpButton-DSHioIfD.js";
 import { _ as _sfc_main$7 } from "./LpIcon-C6JpQ5td.js";
 import { _ as _sfc_main$3 } from "./LpInfraNode-Bb5nbuFY.js";
-import { _ as _sfc_main$5 } from "./LpInput-D0O6dpuA.js";
+import { _ as _sfc_main$5 } from "./LpInput-CbI7z5fQ.js";
 import { _ as _sfc_main$1 } from "./LpLaneNode-Bqcdm8Rf.js";
 import { _ as _sfc_main$2 } from "./LpServiceNode-Cln2ntdw.js";
-import { _ as _sfc_main$8 } from "./LpSlider-A4ixovgS.js";
+import { _ as _sfc_main$8 } from "./LpSlider-C4ilCtZX.js";
 import { _ as _sfc_main$4 } from "./LpWaypointEdge-D8yHlQiw.js";
 import { diffTopology, detailAtZoom, collapseChildren, clusterGraph, findNodes, findPath, neighborhood, groupBoxes, nodeName, frameSize, edgeLabelText, nearestInDirection, absolutePositions, layeredLayout, topologyToSvg } from "../components/topologyGraph.js";
 const _hoisted_1 = {

package/dist/chunks/{LpWorkspaceSwitcher-BeNHCLd5.js → LpWorkspaceSwitcher-ugv-fyig.js}

@@ -2,7 +2,7 @@ import { defineComponent, computed, ref, openBlock, createElementBlock, Fragment
 import { useLabels } from "../composables/useLpConfig.js";
 import { _ as _sfc_main$2 } from "./LpButton-DSHioIfD.js";
 import { _ as _sfc_main$1 } from "./LpDropdownMenu-CLzxIOgM.js";
-import { _ as _sfc_main$4 } from "./LpInput-D0O6dpuA.js";
+import { _ as _sfc_main$4 } from "./LpInput-CbI7z5fQ.js";
 import { _ as _sfc_main$3 } from "./LpModal-DDvrSAnf.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpWorkspaceSwitcher",

package/dist/components/DropzoneLinkField.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/DropzoneLinkField-CLLhd3WB.js";
+import { _ as _sfc_main } from "../chunks/DropzoneLinkField-CyE7TJ5f.js";
 export {
   _sfc_main as default
 };

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

@@ -21,6 +21,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     disabled?: boolean;
     /** Mark every part of the address invalid (also set by a surrounding LpFormField's error). */
     invalid?: boolean;
+    /** A message under the control, as on LpInput: it marks it invalid and shows under it (what `form.field()` hands it). */
+    error?: string;
     size?: "sm" | "md" | "lg";
     /** Hide the map button when picking a point makes no sense. */
     hideMap?: boolean;
@@ -48,6 +50,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     disabled?: boolean;
     /** Mark every part of the address invalid (also set by a surrounding LpFormField's error). */
     invalid?: boolean;
+    /** A message under the control, as on LpInput: it marks it invalid and shows under it (what `form.field()` hands it). */
+    error?: string;
     size?: "sm" | "md" | "lg";
     /** Hide the map button when picking a point makes no sense. */
     hideMap?: boolean;

package/dist/components/LpAddressInput.vue.js

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

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

@@ -1,7 +1,7 @@
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
-    variant?: "info" | "success" | "warning" | "danger" | undefined;
+    variant?: "info" | "danger" | "success" | "warning" | undefined;
     title?: string;
     icon?: string;
     /**
@@ -19,7 +19,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      */
     busy?: boolean;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
-    variant?: "info" | "success" | "warning" | "danger" | undefined;
+    variant?: "info" | "danger" | "success" | "warning" | undefined;
     title?: string;
     icon?: string;
     /**
@@ -37,7 +37,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      */
     busy?: boolean;
 }> & Readonly<{}>, {
-    variant: "info" | "success" | "warning" | "danger";
+    variant: "info" | "danger" | "success" | "warning";
     busy: boolean;
     live: "assertive" | "polite" | false;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {

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

@@ -54,6 +54,15 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      * `min-h-[calc(100dvh-4rem)]` or `fullBleed`. `"region"`: the shell is
      * the viewport and the page scrolls inside main. Read once: changing it
      * remounts the page.
+     *
+     * A page's own sticky parts keep clear of the shell's with two variables
+     * set inside it: `--lp-shell-top`, how much of the window's top the shell
+     * covers (the header, 0 while `headerCollapse` has it away, plus the
+     * sub-page row), and `--lp-shell-bottom`, how much of its foot (the bottom
+     * bar). Both change as those do, and are 0px in `"region"` and on a
+     * `fullBleed` page, where nothing of the shell's lies over the page:
+     * `position: sticky; top: var(--lp-shell-top)`. Keep the page's sticky
+     * layers under `--z-sticky`, the shell's.
      */
     scroll?: "document" | "region";
     /**
@@ -210,6 +219,15 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      * `min-h-[calc(100dvh-4rem)]` or `fullBleed`. `"region"`: the shell is
      * the viewport and the page scrolls inside main. Read once: changing it
      * remounts the page.
+     *
+     * A page's own sticky parts keep clear of the shell's with two variables
+     * set inside it: `--lp-shell-top`, how much of the window's top the shell
+     * covers (the header, 0 while `headerCollapse` has it away, plus the
+     * sub-page row), and `--lp-shell-bottom`, how much of its foot (the bottom
+     * bar). Both change as those do, and are 0px in `"region"` and on a
+     * `fullBleed` page, where nothing of the shell's lies over the page:
+     * `position: sticky; top: var(--lp-shell-top)`. Keep the page's sticky
+     * layers under `--z-sticky`, the shell's.
      */
     scroll?: "document" | "region";
     /**
@@ -313,8 +331,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     "onNav-mode"?: ((mode: NavMode) => any) | undefined;
 }>, {
     scroll: "document" | "region";
-    contentClass: string;
     compact: boolean;
+    contentClass: string;
     mobileBreakpoint: "sm" | "md" | "lg" | "xl";
     divider: boolean;
     pageScrollbar: boolean;

package/dist/components/LpAppShell.vue.js

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

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

@@ -24,6 +24,8 @@ declare const __VLS_export: import("vue").DefineComponent<{
     size?: "sm" | "md" | "lg";
     icon?: string;
     invalid?: boolean;
+    /** A message under the control, as on LpInput: it marks it invalid and shows under it (what `form.field()` hands it). */
+    error?: string;
     emptyText?: string;
     loading?: boolean;
     loadingText?: string;
@@ -65,6 +67,8 @@ declare const __VLS_export: import("vue").DefineComponent<{
     size?: "sm" | "md" | "lg";
     icon?: string;
     invalid?: boolean;
+    /** A message under the control, as on LpInput: it marks it invalid and shows under it (what `form.field()` hands it). */
+    error?: string;
     emptyText?: string;
     loading?: boolean;
     loadingText?: string;

package/dist/components/LpAutocomplete.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpAutocomplete-DkY6CSyD.js";
+import { _ as _sfc_main } from "../chunks/LpAutocomplete-CrZbd0uv.js";
 export {
   _sfc_main as default
 };

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

@@ -1,7 +1,7 @@
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
-    tone?: "info" | "error" | "action" | "muted" | "outline" | "success" | "warning" | "accent" | "neutral" | "brand" | "danger" | "ok" | undefined;
+    tone?: "info" | "error" | "action" | "muted" | "outline" | "danger" | "accent" | "success" | "warning" | "neutral" | "brand" | "ok" | undefined;
     /** `sm` is the one that does not disturb a text-sm line it sits on. */
     size?: "md" | "sm" | "lg" | undefined;
     dot?: boolean;
@@ -12,7 +12,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     remove: () => any;
 }, string, import("vue").PublicProps, Readonly<{
-    tone?: "info" | "error" | "action" | "muted" | "outline" | "success" | "warning" | "accent" | "neutral" | "brand" | "danger" | "ok" | undefined;
+    tone?: "info" | "error" | "action" | "muted" | "outline" | "danger" | "accent" | "success" | "warning" | "neutral" | "brand" | "ok" | undefined;
     /** `sm` is the one that does not disturb a text-sm line it sits on. */
     size?: "md" | "sm" | "lg" | undefined;
     dot?: boolean;

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

@@ -261,8 +261,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     animate: boolean;
     height: number;
     smooth: number;
-    range: ChartRange | null;
     markers: ChartMarker[];
+    range: ChartRange | null;
     showGrid: boolean;
     showXAxis: boolean;
     showYAxis: boolean;

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

@@ -8,6 +8,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     /** Mixed state (e.g. a "select all" with a partial selection). Shows a dash. */
     indeterminate?: boolean;
     disabled?: boolean;
+    /** A message under the control, as on LpInput: it marks it invalid and shows under it (what `form.field()` hands it). */
+    error?: string;
     label?: string;
     /** Secondary line under the label, as on LpSwitch. */
     description?: string;
@@ -33,6 +35,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     /** Mixed state (e.g. a "select all" with a partial selection). Shows a dash. */
     indeterminate?: boolean;
     disabled?: boolean;
+    /** A message under the control, as on LpInput: it marks it invalid and shows under it (what `form.field()` hands it). */
+    error?: string;
     label?: string;
     /** Secondary line under the label, as on LpSwitch. */
     description?: string;

package/dist/components/LpCheckbox.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpCheckbox-D6RuDW4X.js";
+import { _ as _sfc_main } from "../chunks/LpCheckbox-CCWCwD0y.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpCodeDisplay.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpCodeDisplay-D3BUAhV1.js";
+import { _ as _sfc_main } from "../chunks/LpCodeDisplay-D59uPwRb.js";
 export {
   _sfc_main as default
 };

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

@@ -44,8 +44,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     onOpened?: (() => any) | undefined;
     onClosed?: (() => any) | undefined;
 }>, {
-    fade: boolean;
     axis: "height" | "width" | "both";
+    fade: boolean;
     keepMounted: boolean;
     lazy: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {

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

@@ -40,6 +40,8 @@ type __VLS_Props = {
     hideInput?: boolean;
     disabled?: boolean;
     invalid?: boolean;
+    /** A message under the control, as on LpInput: it marks it invalid and shows under it (what `form.field()` hands it). */
+    error?: string;
     size?: "sm" | "md" | "lg";
     /** Trigger text beside the swatch. Defaults to the colour's own value. */
     label?: string;
@@ -95,7 +97,7 @@ type __VLS_Props = {
      */
     copyToast?: string | false;
 };
-declare var __VLS_68: {
+declare var __VLS_74: {
     color: string;
     hsv: {
         h: number;
@@ -105,7 +107,7 @@ declare var __VLS_68: {
     };
 };
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_68) => any;
+    default?: (props: typeof __VLS_74) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     open: import("vue").Ref<boolean, boolean>;
@@ -121,12 +123,12 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     selected: boolean;
     align: "start" | "center" | "end";
     modelValue: string;
+    alpha: boolean;
     variant: "field" | "swatch";
     side: "top" | "right" | "bottom" | "left";
     recent: boolean;
     recentKey: string;
     recentLimit: number;
-    alpha: boolean;
     swatches: readonly string[];
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/components/LpColorPicker.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpColorPicker-COHzV68R.js";
+import { _ as _sfc_main } from "../chunks/LpColorPicker-BONURBFN.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpDatePicker.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpDatePicker-DwSDY0mt.js";
+import { _ as _sfc_main } from "../chunks/LpDatePicker-C2AOtxgF.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpDateRangePicker.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpDateRangePicker-CNQXdTVv.js";
+import { _ as _sfc_main } from "../chunks/LpDateRangePicker-CiXdIAyh.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpDropzone.vue.js

@@ -6,7 +6,7 @@ import { useLabels } from "../composables/useLpConfig.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useReveal } from "../composables/useReveal.js";
 import { PopoverRoot, PopoverAnchor, PopoverPortal, PopoverContent } from "reka-ui";
-import { _ as _sfc_main$1 } from "../chunks/DropzoneLinkField-CLLhd3WB.js";
+import { _ as _sfc_main$1 } from "../chunks/DropzoneLinkField-CyE7TJ5f.js";
 import { POPOVER_PANEL } from "./dropdown.js";
 import { _ as _sfc_main$2 } from "../chunks/LpIcon-C6JpQ5td.js";
 import { inTextField } from "../composables/textEntry.js";

package/dist/components/LpFileTree.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpFileTree-C-rJKzEQ.js";
+import { _ as _sfc_main } from "../chunks/LpFileTree-CpNurwZp.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpFileTreeNode.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpFileTreeNode-BgYn4U1J.js";
+import { _ as _sfc_main } from "../chunks/LpFileTreeNode-DdF8Cq-s.js";
 export {
   _sfc_main as default
 };