@leavepulse/ui 0.71.2 → 0.72.1

package/dist/chunks/{LpNotificationBell-BdUQqZhs.js → LpNotificationBell-CrywodQ_.js}

@@ -1,17 +1,17 @@
 import { defineComponent, computed, useModel, getCurrentInstance, openBlock, createBlock, withCtx, createElementVNode, toDisplayString, createElementBlock, createCommentVNode, createVNode, Fragment, renderList, resolveDynamicComponent, normalizeClass, unref, createTextVNode, Transition, mergeModels } from "vue";
 import { useLabels } from "../composables/useLpConfig.js";
 import { useNow } from "../composables/useNow.js";
-import { _ as _sfc_main$a } from "./LpBadge-C8fKEmTF.js";
-import { _ as _sfc_main$9 } from "./LpButton-BQDAFXBd.js";
-import { _ as _sfc_main$6 } from "./LpContextMenu-DXpFJjlO.js";
-import { _ as _sfc_main$4 } from "./LpEmptyState-CKFTtQgJ.js";
-import { _ as _sfc_main$7 } from "./LpIcon-DkP-9mzK.js";
+import { _ as _sfc_main$a } from "./LpBadge-Huo8EKew.js";
+import { _ as _sfc_main$9 } from "./LpButton-CW34A1e4.js";
+import { _ as _sfc_main$6 } from "./LpContextMenu-rx2tCjwk.js";
+import { _ as _sfc_main$4 } from "./LpEmptyState-EQHiRYhG.js";
+import { _ as _sfc_main$7 } from "./LpIcon--5WSb3jJ.js";
 import { _ as _sfc_main$1 } from "./LpPopover-DmZ3wUtP.js";
-import { _ as _sfc_main$8 } from "./LpRelativeTime-UM8EkfrN.js";
-import { _ as _sfc_main$b } from "./LpRollingText-DiL717LK.js";
+import { _ as _sfc_main$8 } from "./LpRelativeTime-DwgCb5-8.js";
+import { _ as _sfc_main$b } from "./LpRollingText-B54Pje7P.js";
 import { _ as _sfc_main$5 } from "./LpScrollArea-Hz3-JWUG.js";
 import { _ as _sfc_main$3 } from "./LpSkeleton-BB6XIV-w.js";
-import { _ as _sfc_main$2 } from "./LpShift-DXNsauQZ.js";
+import { _ as _sfc_main$2 } from "./LpShift-C-UGuKMN.js";
 import { toneLook } from "../components/tone.js";
 const _hoisted_1 = { class: "flex items-center justify-between gap-2 px-3 py-2.5" };
 const _hoisted_2 = { class: "text-sm font-semibold" };

package/dist/chunks/{LpNumberField-DZY3Z670.js → LpNumberField-e0IBkWU1.js}

@@ -1,7 +1,7 @@
 import { defineComponent, useId, useAttrs, computed, openBlock, createBlock, unref, normalizeStyle, normalizeClass, withCtx, createVNode, createCommentVNode, mergeProps, createElementBlock, toDisplayString } from "vue";
 import { usePaletteControl } from "../composables/usePaletteCommands.js";
 import { NumberFieldRoot, NumberFieldDecrement, NumberFieldInput, NumberFieldIncrement } from "reka-ui";
-import { _ as _sfc_main$1 } from "./LpIcon-DkP-9mzK.js";
+import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
 import { useFieldControl, focusLeft } from "../composables/useField.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { useMergedClass } from "../composables/useMergedClass.js";

package/dist/chunks/{LpNumberFlow-Dwb9MV1A.js → LpNumberFlow-CcxEGUy0.js}

@@ -6,7 +6,8 @@ import { useRevealedValue } from "../composables/useRevealedValue.js";
 import '../assets/LpNumberFlow-Chp9pEDe.css';const _hoisted_1 = { class: "sr-only" };
 const _hoisted_2 = {
   key: 0,
-  "aria-hidden": "true"
+  "aria-hidden": "true",
+  class: "whitespace-pre"
 };
 const _hoisted_3 = {
   class: "lp-nf__track inline-flex items-baseline",
@@ -14,7 +15,8 @@ const _hoisted_3 = {
 };
 const _hoisted_4 = {
   key: 1,
-  "aria-hidden": "true"
+  "aria-hidden": "true",
+  class: "whitespace-pre"
 };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LpNumberFlow",

package/dist/chunks/{LpPagination-DbeACavM.js → LpPagination-BIIiYHXR.js}

@@ -1,7 +1,7 @@
 import { defineComponent, computed, ref, useId, openBlock, createElementBlock, mergeProps, unref, createElementVNode, normalizeClass, createVNode, Fragment, renderList, createBlock, createCommentVNode, toDisplayString } from "vue";
 import { Motion } from "motion-v";
 import { usePillTransition } from "../composables/usePillTransition.js";
-import { _ as _sfc_main$1 } from "./LpIcon-DkP-9mzK.js";
+import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { useResizeObserver } from "../composables/useResizeObserver.js";

package/dist/chunks/{LpPaletteTheme-DkikZ362.js → LpPaletteTheme-BzHBh-mN.js}

@@ -1,10 +1,10 @@
 import { defineComponent, ref, computed, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, createTextVNode, toDisplayString, unref } from "vue";
 import { useLabels } from "../composables/useLpConfig.js";
 import { suppressPaletteDiscovery } from "../composables/usePaletteCommands.js";
-import { _ as _sfc_main$4 } from "./LpThemeStudio-IupHqP0x.js";
-import { _ as _sfc_main$2 } from "./LpThemeProvider-DcbfOxsU.js";
-import { _ as _sfc_main$1 } from "./LpButton-BQDAFXBd.js";
-import { _ as _sfc_main$3 } from "./LpInput-2H-5ILOB.js";
+import { _ as _sfc_main$4 } from "./LpThemeStudio-B0Kk1bX0.js";
+import { _ as _sfc_main$2 } from "./LpThemeProvider-8MG6yqU9.js";
+import { _ as _sfc_main$1 } from "./LpButton-CW34A1e4.js";
+import { _ as _sfc_main$3 } from "./LpInput-DqmL-438.js";
 const _hoisted_1 = { class: "flex min-w-0 flex-col gap-4" };
 const _hoisted_2 = { class: "sticky top-0 z-10 flex gap-2 border-b border-line bg-surface-overlay pb-3" };
 const _hoisted_3 = { class: "text-sm font-semibold" };

package/dist/chunks/{LpPasswordInput-BzAZsf5V.js → LpPasswordInput-DVgRgTVx.js}

@@ -2,8 +2,8 @@ import { defineComponent, useModel, ref, openBlock, createBlock, mergeProps, unr
 import { suppressPaletteDiscovery } from "../composables/usePaletteCommands.js";
 import { useFieldControl } from "../composables/useField.js";
 import { useLabels } from "../composables/useLpConfig.js";
-import { _ as _sfc_main$1 } from "./LpInput-2H-5ILOB.js";
-import { _ as _sfc_main$2 } from "./RevealToggle-BVFM_FAU.js";
+import { _ as _sfc_main$1 } from "./LpInput-DqmL-438.js";
+import { _ as _sfc_main$2 } from "./RevealToggle-jBLJwVwO.js";
 const __default__ = { inheritAttrs: false };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,

package/dist/chunks/{LpPhoneInput-BMpd-0QR.js → LpPhoneInput-CETEp5W7.js}

@@ -6,8 +6,8 @@ import { useInputFilter } from "../composables/useInputFilter.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { matchCountryByValue, filterCountries, loadCountries, flagEmoji } from "../components/countries.js";
 import { POPOVER_PANEL, OPTION_ITEM, optionStagger } from "../components/dropdown.js";
-import { _ as _sfc_main$2 } from "./LpFieldNotice-CPI8EwtU.js";
-import { _ as _sfc_main$1 } from "./LpIcon-DkP-9mzK.js";
+import { _ as _sfc_main$2 } from "./LpFieldNotice-CzQ2_5rQ.js";
+import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
 import { loadPhoneLib, formatPhone, loadPhoneExamples, digitsBefore, caretAfterDigits, digitsOf } from "../components/phone.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { usePortalTarget, useOutsideGuard } from "../composables/useView.js";

package/dist/chunks/{LpPie-C1uIUFxu.js → LpPie-BjDbeytx.js}

@@ -4,13 +4,13 @@ import { useReveal } from "../composables/useReveal.js";
 import { useTween, lerp, mixColor } from "../composables/useTween.js";
 import { resolveSlices, arcPath, calloutLabels, formatTick } from "../components/chart.js";
 import { _ as _sfc_main$9 } from "./LegendSwatch-BhRjrtzv.js";
-import { _ as _sfc_main$4 } from "./LpContextMenu-DXpFJjlO.js";
-import { _ as _sfc_main$3 } from "./LpEmptyState-CKFTtQgJ.js";
-import { _ as _sfc_main$6 } from "./LpNumberFlow-Dwb9MV1A.js";
-import { _ as _sfc_main$7 } from "./LpRollingText-DiL717LK.js";
-import { _ as _sfc_main$8 } from "./LpShift-DXNsauQZ.js";
+import { _ as _sfc_main$4 } from "./LpContextMenu-rx2tCjwk.js";
+import { _ as _sfc_main$3 } from "./LpEmptyState-EQHiRYhG.js";
+import { _ as _sfc_main$6 } from "./LpNumberFlow-CcxEGUy0.js";
+import { _ as _sfc_main$7 } from "./LpRollingText-B54Pje7P.js";
+import { _ as _sfc_main$8 } from "./LpShift-C-UGuKMN.js";
 import { _ as _sfc_main$2 } from "./LpSkeleton-BB6XIV-w.js";
-import { _ as _sfc_main$1 } from "./LpSwap-DzE6M3Mg.js";
+import { _ as _sfc_main$1 } from "./LpSwap-Xi4j9PR_.js";
 import { _ as _sfc_main$5 } from "./LpTooltip-BcBvIx4z.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useLabels } from "../composables/useLpConfig.js";

package/dist/chunks/{LpPipeline-zjEM1Lwc.js → LpPipeline-zZUj7I6K.js}

@@ -4,10 +4,10 @@ import { useLabels } from "../composables/useLpConfig.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useNow } from "../composables/useNow.js";
 import { _ as _sfc_main$6 } from "./LpCollapse-CWS9M_lm.js";
-import { _ as _sfc_main$5 } from "./LpIcon-DkP-9mzK.js";
-import { _ as _sfc_main$4 } from "./LpRollingText-DiL717LK.js";
-import { _ as _sfc_main$3 } from "./LpShift-DXNsauQZ.js";
-import { _ as _sfc_main$1 } from "./LpStepMark-CXa7DJy_.js";
+import { _ as _sfc_main$5 } from "./LpIcon--5WSb3jJ.js";
+import { _ as _sfc_main$4 } from "./LpRollingText-B54Pje7P.js";
+import { _ as _sfc_main$3 } from "./LpShift-C-UGuKMN.js";
+import { _ as _sfc_main$1 } from "./LpStepMark-DU7xalwW.js";
 import { _ as _sfc_main$7 } from "./LpTooltip-BcBvIx4z.js";
 import { _ as _sfc_main$2 } from "./StepConnector-37OgEOXA.js";
 import { stepKey, connectorFilled, currentStepIndex, stepElapsed, childProgress } from "../components/pipeline.js";

package/dist/chunks/{LpProgress-WNaH4emv.js → LpProgress-rOlyafqp.js}

@@ -2,7 +2,7 @@ import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, w
 import { ProgressRoot, ProgressIndicator } from "reka-ui";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useRevealedValue } from "../composables/useRevealedValue.js";
-import { _ as _sfc_main$1 } from "./LpNumberFlow-Dwb9MV1A.js";
+import { _ as _sfc_main$1 } from "./LpNumberFlow-CcxEGUy0.js";
 import { meterFraction, toneAt, capacityThresholds, METER_HEADER, METER_TRACK } from "../components/meter.js";
 import { toneLook } from "../components/tone.js";
 const _hoisted_1 = ["width", "height"];

package/dist/chunks/{LpQuota-Cz9PvklM.js → LpQuota-B12yijdB.js}

@@ -3,9 +3,9 @@ import { useLabels } from "../composables/useLpConfig.js";
 import { useLocale } from "../composables/useLocale.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useRevealedValue } from "../composables/useRevealedValue.js";
-import { _ as _sfc_main$2 } from "./LpIcon-DkP-9mzK.js";
-import { _ as _sfc_main$1 } from "./LpNumberFlow-Dwb9MV1A.js";
-import { _ as _sfc_main$3 } from "./LpRollingText-DiL717LK.js";
+import { _ as _sfc_main$2 } from "./LpIcon--5WSb3jJ.js";
+import { _ as _sfc_main$1 } from "./LpNumberFlow-CcxEGUy0.js";
+import { _ as _sfc_main$3 } from "./LpRollingText-B54Pje7P.js";
 import { METER_HEADER, METER_TRACK } from "../components/meter.js";
 import { quotaState, quotaSegments, formatAmount } from "../components/quota.js";
 import { toneLook } from "../components/tone.js";

package/dist/chunks/{LpRadioGroup-CsXeV9Ct.js → LpRadioGroup-ggaPL92T.js}

@@ -3,7 +3,7 @@ import { usePaletteControl } from "../composables/usePaletteCommands.js";
 import { RadioGroupRoot, RadioGroupItem, RadioGroupIndicator } from "reka-ui";
 import { useFieldControl } from "../composables/useField.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
-import { _ as _sfc_main$1 } from "./LpIcon-DkP-9mzK.js";
+import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
 const _hoisted_1 = {
   key: 1,
   class: "flex min-w-0 flex-col"

package/dist/chunks/{LpRangeCalendar-l-0nSFmY.js → LpRangeCalendar-CYYUYqJ7.js}

@@ -5,7 +5,7 @@ import { useLabels } from "../composables/useLpConfig.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { CALENDAR_LABELS, CALENDAR_NAV, CALENDAR_FRAME } from "../components/calendar.js";
 import { normalizeRange, parseIsoDay, reshapeRange } from "../components/dateRange.js";
-import { _ as _sfc_main$1 } from "./LpIcon-DkP-9mzK.js";
+import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
 const _hoisted_1 = { class: "flex gap-4" };
 const __default__ = { inheritAttrs: false };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/chunks/{LpRelativeTime-UM8EkfrN.js → LpRelativeTime-DwgCb5-8.js}

@@ -2,7 +2,7 @@ import { defineComponent, computed, openBlock, createBlock, withCtx, createEleme
 import { useLocale } from "../composables/useLocale.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useNow } from "../composables/useNow.js";
-import { _ as _sfc_main$2 } from "./LpRollingText-DiL717LK.js";
+import { _ as _sfc_main$2 } from "./LpRollingText-B54Pje7P.js";
 import { _ as _sfc_main$1 } from "./LpTooltip-BcBvIx4z.js";
 import { formatRelativeTime } from "../components/relativeTime.js";
 import { toEpoch } from "../components/timeSpan.js";

package/dist/chunks/{LpRepeater-OvzByE5L.js → LpRepeater-BQB0twJ5.js}

@@ -4,9 +4,9 @@ import { useLabels } from "../composables/useLpConfig.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useRepeater } from "../composables/useRepeater.js";
 import { usePrefersReducedMotion } from "../composables/useReducedMotion.js";
-import { _ as _sfc_main$1 } from "./LpButton-BQDAFXBd.js";
-import { _ as _sfc_main$2 } from "./LpIcon-DkP-9mzK.js";
-import { _ as _sfc_main$3 } from "./LpShift-DXNsauQZ.js";
+import { _ as _sfc_main$1 } from "./LpButton-CW34A1e4.js";
+import { _ as _sfc_main$2 } from "./LpIcon--5WSb3jJ.js";
+import { _ as _sfc_main$3 } from "./LpShift-C-UGuKMN.js";
 import '../assets/LpRepeater-C1Cw27hj.css';const _hoisted_1 = { class: "flex items-center justify-between gap-2" };
 const _hoisted_2 = {
   key: 0,

package/dist/chunks/LpRollingText-B54Pje7P.js

@@ -0,0 +1,86 @@
+import { defineComponent, computed, useSlots, ref, watch, openBlock, createElementBlock, normalizeStyle, normalizeClass, Fragment, toDisplayString, createCommentVNode, createElementVNode, createVNode, Transition, withCtx, createBlock, renderSlot, createTextVNode } from "vue";
+import { splitChange } from "../components/rolling.js";
+import '../assets/LpRollingText-dyOXedGO.css';const _hoisted_1 = {
+  key: 0,
+  class: "whitespace-pre"
+};
+const _hoisted_2 = { class: "relative inline-flex overflow-hidden" };
+const _hoisted_3 = {
+  key: 1,
+  class: "whitespace-pre"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpRollingText",
+  props: {
+    value: {},
+    mode: { default: "slide" },
+    direction: { default: "up" },
+    duration: { default: 320 },
+    align: { default: "center" },
+    wrap: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const key = computed(() => String(props.value));
+    const slots = useSlots();
+    const partial = computed(() => !slots.default && !props.wrap);
+    const parts = ref({ head: "", mid: String(props.value), tail: "" });
+    watch(
+      () => String(props.value),
+      (next, was) => parts.value = splitChange(was, next)
+    );
+    const midKey = computed(() => `${parts.value.head.length}:${parts.value.mid}`);
+    const name = computed(
+      () => props.mode === "flip" ? "lp-roll-flip" : `lp-roll-${props.direction}`
+    );
+    const justify = computed(
+      () => ({ start: "justify-start", center: "justify-center", end: "justify-end" })[props.align]
+    );
+    const style = computed(() => ({
+      "--lp-roll-duration": `${props.duration}ms`,
+      // The leaving copy is taken out of flow so both can occupy the same line;
+      // without this the box would grow to hold two lines mid-transition.
+      "--lp-roll-perspective": props.mode === "flip" ? "300px" : "none"
+    }));
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("span", {
+        class: normalizeClass(["lp-roll relative inline-flex overflow-hidden align-bottom", [justify.value, __props.wrap && "lp-roll--wrap"]]),
+        style: normalizeStyle(style.value)
+      }, [
+        partial.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+          parts.value.head ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(parts.value.head), 1)) : createCommentVNode("", true),
+          createElementVNode("span", _hoisted_2, [
+            createVNode(Transition, { name: name.value }, {
+              default: withCtx(() => [
+                (openBlock(), createElementBlock("span", {
+                  key: midKey.value,
+                  class: "lp-roll__item whitespace-pre"
+                }, toDisplayString(parts.value.mid), 1))
+              ]),
+              _: 1
+            }, 8, ["name"])
+          ]),
+          parts.value.tail ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(parts.value.tail), 1)) : createCommentVNode("", true)
+        ], 64)) : (openBlock(), createBlock(Transition, {
+          key: 1,
+          name: name.value
+        }, {
+          default: withCtx(() => [
+            (openBlock(), createElementBlock("span", {
+              key: key.value,
+              class: "lp-roll__item"
+            }, [
+              renderSlot(_ctx.$slots, "default", { value: __props.value }, () => [
+                createTextVNode(toDisplayString(__props.value), 1)
+              ])
+            ]))
+          ]),
+          _: 3
+        }, 8, ["name"]))
+      ], 6);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/chunks/{LpScramble-TDO5Kdou.js → LpScramble-DbQyBjUY.js}

@@ -3,7 +3,7 @@ import { prefersReducedMotion } from "../composables/easing.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { useReveal } from "../composables/useReveal.js";
 import { useScramble } from "../composables/useScramble.js";
-import { _ as _sfc_main$1 } from "./LpShift-DXNsauQZ.js";
+import { _ as _sfc_main$1 } from "./LpShift-C-UGuKMN.js";
 const _hoisted_1 = { class: "sr-only" };
 const _hoisted_2 = {
   key: 1,

package/dist/chunks/{LpSecretField-DwQiPOko.js → LpSecretField-uoD6Fngf.js}

@@ -5,14 +5,14 @@ import { useScramble } from "../composables/useScramble.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { useFieldControl } from "../composables/useField.js";
 import { mergeClass } from "../composables/useMergedClass.js";
-import { _ as _sfc_main$5 } from "./FieldWrapper-YzbvvC3M.js";
-import { _ as _sfc_main$3 } from "./LpButton-BQDAFXBd.js";
-import { _ as _sfc_main$2 } from "./LpCopyButton-Dmq7DmFw.js";
-import { _ as _sfc_main$4 } from "./LpIcon-DkP-9mzK.js";
-import { _ as _sfc_main$1 } from "./LpPasswordInput-BzAZsf5V.js";
-import { _ as _sfc_main$6 } from "./LpShift-DXNsauQZ.js";
+import { _ as _sfc_main$5 } from "./FieldWrapper-DHhRxO5G.js";
+import { _ as _sfc_main$3 } from "./LpButton-CW34A1e4.js";
+import { _ as _sfc_main$2 } from "./LpCopyButton-BNcGbVXF.js";
+import { _ as _sfc_main$4 } from "./LpIcon--5WSb3jJ.js";
+import { _ as _sfc_main$1 } from "./LpPasswordInput-DVgRgTVx.js";
+import { _ as _sfc_main$6 } from "./LpShift-C-UGuKMN.js";
 import { _ as _sfc_main$8 } from "./LpTooltip-BcBvIx4z.js";
-import { _ as _sfc_main$7 } from "./RevealToggle-BVFM_FAU.js";
+import { _ as _sfc_main$7 } from "./RevealToggle-jBLJwVwO.js";
 const _hoisted_1 = ["id", "aria-label"];
 const _hoisted_2 = {
   key: "empty",

package/dist/chunks/{LpSection-DcQsieHG.js → LpSection-DFK_uoJE.js}

@@ -1,6 +1,6 @@
 import { defineComponent, useSlots, computed, openBlock, createElementBlock, normalizeClass, createElementVNode, createBlock, createCommentVNode, resolveDynamicComponent, withCtx, renderSlot, createTextVNode, toDisplayString } from "vue";
 import { tv } from "tailwind-variants";
-import { _ as _sfc_main$1 } from "./LpIcon-DkP-9mzK.js";
+import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
 const _hoisted_1 = { class: "min-w-0 flex-1 break-words" };
 const _hoisted_2 = { class: "flex flex-wrap items-center gap-2" };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/chunks/{LpSegmented-D2VST0o3.js → LpSegmented-CeACsMMA.js}

@@ -6,7 +6,7 @@ import { useFieldControl } from "../composables/useField.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { usePillTransition } from "../composables/usePillTransition.js";
 import { _ as _sfc_main$2 } from "./AttentionDot-DCBf4aWg.js";
-import { _ as _sfc_main$1 } from "./LpIcon-DkP-9mzK.js";
+import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
 const _hoisted_1 = {
   key: 1,
   class: "relative z-10 inline-flex shrink-0"
@@ -44,7 +44,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       () => [
         "inline-flex items-center gap-1 rounded-control border border-line bg-surface-soft p-1",
         sizeCls[props.size],
-        props.block ? "flex w-full" : ""
+        // `w-fit`, not left to the parent: in a column a flex item stretches, and
+        // the options sat on the left of an empty bar (the theme studio met it).
+        props.block ? "flex w-full" : "w-fit"
       ].join(" ")
     );
     const field = useFieldControl(() => ({ wrapped: false, disabled: props.disabled }));

package/dist/chunks/{LpSelect-D3pRJfRY.js → LpSelect-Cxq4yBGd.js}

@@ -5,9 +5,9 @@ import { useFieldControl, useFieldBlur } from "../composables/useField.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { useMergedAttrs } from "../composables/useMergedClass.js";
 import { POPOVER_PANEL, OPTION_ITEM, optionStagger } from "../components/dropdown.js";
-import { _ as _sfc_main$1 } from "./LpIcon-DkP-9mzK.js";
-import { _ as _sfc_main$3 } from "./OptionContent-DPzNsybd.js";
-import { _ as _sfc_main$2 } from "./LpRollingText-DiL717LK.js";
+import { _ as _sfc_main$1 } from "./LpIcon--5WSb3jJ.js";
+import { _ as _sfc_main$3 } from "./OptionContent-22UT8zLn.js";
+import { _ as _sfc_main$2 } from "./LpRollingText-B54Pje7P.js";
 import { fitChips, toggledValues } from "../components/select.js";
 import { usePortalTarget, useOutsideGuard } from "../composables/useView.js";
 import { useResizeObserver } from "../composables/useResizeObserver.js";

package/dist/chunks/LpShift-C-UGuKMN.js

@@ -0,0 +1,171 @@
+import { defineComponent, computed, watch, onBeforeUnmount, openBlock, createElementBlock, normalizeClass, unref, renderSlot } from "vue";
+import { prefersReducedMotion } from "../composables/easing.js";
+import { useShift } from "../composables/useShift.js";
+const PRESENCE_MS = 200;
+const MOVE_MS = 160;
+const EASE = "cubic-bezier(0.2, 0, 0, 1)";
+const GHOST = "data-lp-shift-ghost";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "LpShift",
+  props: {
+    axis: { default: "height" },
+    duration: {},
+    disabled: { type: Boolean, default: false },
+    anchor: { default: "start" },
+    presence: { type: Boolean, default: false }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const { el, tweening, resizing } = useShift({
+      axis: () => props.axis,
+      duration: () => props.duration,
+      enabled: () => !props.disabled
+    });
+    const TRANSITION_CLASS = {
+      height: "transition-[height]",
+      width: "transition-[width]",
+      both: "transition-[height,width]"
+    };
+    const transitionClass = computed(() => TRANSITION_CLASS[props.axis]);
+    const seen = /* @__PURE__ */ new WeakMap();
+    let presenceObserver;
+    let rememberTimer;
+    let presenceSize;
+    function rememberSoon(box, wait = PRESENCE_MS + 80) {
+      clearTimeout(rememberTimer);
+      rememberTimer = setTimeout(() => remember(box), wait);
+    }
+    function elementsOf(box) {
+      return [...box.querySelectorAll("*")].filter((node) => !node.closest(`[${GHOST}]`) && !(node instanceof SVGElement && !(node instanceof SVGSVGElement)));
+    }
+    function remember(box) {
+      const outer = box.getBoundingClientRect();
+      for (const node of elementsOf(box)) {
+        const r = node.getBoundingClientRect();
+        seen.set(node, {
+          from: props.anchor === "end" ? outer.right - r.right : r.left - outer.left,
+          top: r.top - outer.top,
+          width: r.width,
+          height: r.height,
+          x: r.left,
+          y: r.top
+        });
+      }
+    }
+    const offset = () => props.anchor === "end" ? -6 : 6;
+    function ghost(box, node) {
+      const at = seen.get(node);
+      if (!at || !(node instanceof HTMLElement) || node.hasAttribute(GHOST) || at.width === 0) return;
+      const copy = node.cloneNode(true);
+      copy.setAttribute(GHOST, "");
+      copy.setAttribute("aria-hidden", "true");
+      copy.inert = true;
+      Object.assign(copy.style, {
+        position: "absolute",
+        top: `${at.top}px`,
+        [props.anchor === "end" ? "right" : "left"]: `${at.from}px`,
+        width: `${at.width}px`,
+        height: `${at.height}px`,
+        margin: "0",
+        pointerEvents: "none"
+      });
+      box.appendChild(copy);
+      copy.animate(
+        [
+          { opacity: 1, transform: "none", filter: "blur(0)" },
+          { opacity: 0, transform: `translateX(${offset()}px) scale(0.96)`, filter: "blur(2px)" }
+        ],
+        { duration: PRESENCE_MS, easing: EASE }
+      ).finished.catch(() => void 0).finally(() => copy.remove());
+    }
+    function arrive(node) {
+      if (!(node instanceof HTMLElement) || node.hasAttribute(GHOST)) return;
+      node.animate(
+        [
+          { opacity: 0, transform: `translateX(${offset()}px) scale(0.96)`, filter: "blur(2px)" },
+          { opacity: 1, transform: "none", filter: "blur(0)" }
+        ],
+        { duration: PRESENCE_MS, delay: 40, easing: EASE, fill: "backwards" }
+      );
+    }
+    function glide(node) {
+      const was = seen.get(node);
+      if (!was || !(node instanceof HTMLElement)) return;
+      const now = node.getBoundingClientRect();
+      const dx = was.x - now.left;
+      const dy = was.y - now.top;
+      if (Math.abs(dx) < 0.5 && Math.abs(dy) < 0.5) return;
+      node.animate([{ transform: `translate(${dx}px, ${dy}px)` }, { transform: "none" }], { duration: MOVE_MS, easing: EASE });
+    }
+    watch(
+      [el, () => props.presence && !props.disabled],
+      ([box, on]) => {
+        presenceObserver?.disconnect();
+        presenceObserver = void 0;
+        presenceSize?.disconnect();
+        presenceSize = void 0;
+        if (!box || !on) return;
+        remember(box);
+        presenceObserver = new MutationObserver((records) => {
+          const real = records.filter(
+            (r) => ![...r.addedNodes, ...r.removedNodes].every((n) => n instanceof Element && n.hasAttribute(GHOST))
+          );
+          if (real.length && !prefersReducedMotion()) {
+            const added = /* @__PURE__ */ new Set();
+            for (const record of real) {
+              record.removedNodes.forEach((node) => node instanceof Element && ghost(box, node));
+              record.addedNodes.forEach((node) => {
+                added.add(node);
+                if (node instanceof Element) arrive(node);
+              });
+            }
+            const parents = real.map((r) => r.target).filter((t) => t instanceof Element && !t.hasAttribute(GHOST));
+            requestAnimationFrame(() => {
+              for (const parent of parents) for (const child of parent.children) if (!added.has(child)) glide(child);
+            });
+          }
+          rememberSoon(box);
+        });
+        presenceObserver.observe(box, { childList: true, subtree: true });
+        presenceSize = new ResizeObserver(() => rememberSoon(box, 60));
+        presenceSize.observe(box);
+        void document.fonts?.ready.then(() => rememberSoon(box, 0));
+      },
+      { flush: "post" }
+    );
+    watch(resizing, (now) => {
+      const box = el.value;
+      if (!now || !box || !presenceObserver || prefersReducedMotion()) return;
+      requestAnimationFrame(() => {
+        for (const child of box.children) if (!child.hasAttribute(GHOST)) glide(child);
+      });
+    });
+    onBeforeUnmount(() => {
+      presenceObserver?.disconnect();
+      presenceSize?.disconnect();
+      clearTimeout(rememberTimer);
+    });
+    __expose({ resizing });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "el",
+        ref: el,
+        class: normalizeClass([
+          unref(tweening) && !__props.disabled ? `${transitionClass.value} duration-fast ease-[var(--ease-emphasized)] motion-reduce:transition-none` : "",
+          unref(resizing) ? "overflow-hidden" : "",
+          // While the box holds a width its content has outgrown, a flex row would
+          // squeeze its children to fit (a button's keys folding into a column)
+          // instead of letting the easing edge clip them.
+          unref(resizing) && __props.axis !== "height" ? "[&>*]:shrink-0" : "",
+          unref(resizing) && __props.anchor === "end" ? "justify-end" : "",
+          __props.presence ? "relative" : ""
+        ])
+      }, [
+        renderSlot(_ctx.$slots, "default", { resizing: unref(resizing) })
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};