@bearmenu/ui 0.8.12 → 0.8.14

package/dist/components/motion-icon-actions.js

@@ -0,0 +1,336 @@
+import { beats, pivot, poses, MotionIcon, returnTransition, useSvgId } from '../chunk-L3VEMP5A.js';
+import '../chunk-FEK5XGZW.js';
+import { __objRest, __spreadProps, __spreadValues } from '../chunk-MMUBH76A.js';
+import { motion } from 'framer-motion';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function returning(play, transition) {
+  const held = {};
+  for (const key of Object.keys(play)) held[key] = play[key][0];
+  return poses(held, held, play, transition);
+}
+var flip = (values, direction) => direction === "right" ? values : values.map((v) => -v);
+var ARROW = beats([0, 0.14, 0.42, 0.58, 0.82, 1], 0.6);
+function arrowParts(direction) {
+  const tailX = direction === "right" ? 5 : 19;
+  return {
+    head: returning({ x: flip([0, -2.5, 9, 8, -1, 0], direction) }, ARROW),
+    shaft: returning({ scaleX: [1, 0.82, 1, 1.45, 0.93, 1] }, ARROW),
+    tail: pivot(tailX, 12),
+    headD: direction === "right" ? "m12 5 7 7-7 7" : "m12 19-7-7 7-7",
+    shaftD: direction === "right" ? "M5 12h14" : "M19 12H5"
+  };
+}
+var ARROW_RIGHT = arrowParts("right");
+var ARROW_LEFT = arrowParts("left");
+function MotionArrow(_a) {
+  var _b = _a, {
+    direction = "right"
+  } = _b, props = __objRest(_b, [
+    "direction"
+  ]);
+  const parts = direction === "right" ? ARROW_RIGHT : ARROW_LEFT;
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(motion.path, { variants: parts.shaft, style: parts.tail, d: parts.shaftD }),
+    /* @__PURE__ */ jsx(motion.path, { variants: parts.head, d: parts.headD })
+  ] }));
+}
+var CARET = beats([0, 0.14, 0.4, 0.56, 0.8, 1], 0.56);
+function caretParts(direction) {
+  const apexX = direction === "right" ? 15 : 9;
+  const armX = direction === "right" ? 9 : 15;
+  const upperSwing = flip([0, 8, -25, -20, 6, 0], direction);
+  return {
+    body: returning({ x: flip([0, -2, 7, 6.5, -1, 0], direction) }, CARET),
+    upper: returning({ rotate: upperSwing }, CARET),
+    lower: returning({ rotate: upperSwing.map((v) => -v) }, CARET),
+    apex: pivot(apexX, 12),
+    upperD: `M${apexX} 12 ${armX} 6`,
+    lowerD: `M${apexX} 12 ${armX} 18`
+  };
+}
+var CARET_RIGHT = caretParts("right");
+var CARET_LEFT = caretParts("left");
+function MotionCaret(_a) {
+  var _b = _a, {
+    direction = "right"
+  } = _b, props = __objRest(_b, [
+    "direction"
+  ]);
+  const parts = direction === "right" ? CARET_RIGHT : CARET_LEFT;
+  return /* @__PURE__ */ jsx(MotionIcon, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsxs(motion.g, { variants: parts.body, children: [
+    /* @__PURE__ */ jsx(motion.path, { variants: parts.upper, style: parts.apex, d: parts.upperD }),
+    /* @__PURE__ */ jsx(motion.path, { variants: parts.lower, style: parts.apex, d: parts.lowerD })
+  ] }) }));
+}
+var X_TIMES = beats([0, 0.15, 0.42, 0.56, 0.8, 1], 0.56);
+var bladeA = returning({ rotate: [0, 7, -48, -45, 5, 0] }, X_TIMES);
+var bladeB = returning({ rotate: [0, -7, 48, 45, -5, 0] }, X_TIMES);
+function MotionX(props) {
+  const crossing = pivot(12, 12);
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(motion.path, { variants: bladeA, style: crossing, d: "M18 6 6 18" }),
+    /* @__PURE__ */ jsx(motion.path, { variants: bladeB, style: crossing, d: "m6 6 12 12" })
+  ] }));
+}
+var CLEAR = beats([0, 0.18, 0.4, 0.54, 0.72, 1], 0.6);
+var clearRing = returning(
+  { scaleY: [1, 0.66, 1.06, 1, 0.9, 1], scaleX: [1, 1.1, 1, 1, 1, 1] },
+  CLEAR
+);
+var clearX = returning(
+  {
+    y: [0, 0, -11, -11, 1, 0],
+    scaleY: [1, 0.66, 1, 1, 1, 1],
+    opacity: [1, 1, 1, 0, 1, 1]
+  },
+  CLEAR
+);
+function MotionCircleX(props) {
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(motion.circle, { variants: clearRing, style: pivot(12, 22), cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsxs(motion.g, { variants: clearX, style: pivot(12, 12), children: [
+      /* @__PURE__ */ jsx("path", { d: "m15 9-6 6" }),
+      /* @__PURE__ */ jsx("path", { d: "m9 9 6 6" })
+    ] })
+  ] }));
+}
+var EXTERNAL = beats([0, 0.16, 0.4, 0.5, 0.62, 1], 0.6);
+var leavingArrow = returning(
+  {
+    x: [0, -2, 9, 9, -5, 0],
+    y: [0, 2, -9, -9, 5, 0],
+    opacity: [1, 1, 1, 0, 0, 1]
+  },
+  EXTERNAL
+);
+var recoilingBox = returning({ scaleY: [1, 1, 0.9, 1.03, 1, 1] }, EXTERNAL);
+function MotionExternalLink(props) {
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(
+      motion.path,
+      {
+        variants: recoilingBox,
+        style: pivot(10.5, 21),
+        d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"
+      }
+    ),
+    /* @__PURE__ */ jsxs(motion.g, { variants: leavingArrow, children: [
+      /* @__PURE__ */ jsx("path", { d: "M15 3h6v6" }),
+      /* @__PURE__ */ jsx("path", { d: "M10 14 21 3" })
+    ] })
+  ] }));
+}
+var SEND_TIMES = [0, 0.14, 0.36, 0.5, 0.72, 1];
+var SEND = beats(SEND_TIMES, 0.62);
+var sendArrow = {
+  rest: { y: 0, opacity: 1, transition: returnTransition },
+  active: { y: -18, opacity: 0, transition: returnTransition },
+  play: {
+    y: [0, 2.5, -18, -18, -18, -18],
+    opacity: [1, 1, 1, 0, 0, 0],
+    transition: SEND
+  }
+};
+var sendShaft = {
+  rest: { scaleY: 1, transition: returnTransition },
+  active: { scaleY: 1, transition: returnTransition },
+  play: { scaleY: [1, 0.85, 1.25, 1, 1, 1], transition: SEND }
+};
+var stopBlock = {
+  rest: { y: 6, opacity: 0, fillOpacity: 0, scaleY: 1, transition: returnTransition },
+  active: { y: 0, opacity: 1, fillOpacity: 1, scaleY: 1, transition: returnTransition },
+  play: {
+    y: [-12, -12, -12, -12, 1, 0],
+    opacity: [0, 0, 0, 1, 1, 1],
+    fillOpacity: [0, 0, 0, 0, 1, 1],
+    scaleY: [1, 1, 1, 1, 0.82, 1],
+    transition: SEND
+  }
+};
+function MotionSend(props) {
+  const floor = pivot(12, 19);
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsxs(motion.g, { variants: sendArrow, children: [
+      /* @__PURE__ */ jsx("path", { d: "m5 12 7-7 7 7" }),
+      /* @__PURE__ */ jsx(motion.path, { variants: sendShaft, style: floor, d: "M12 19V5" })
+    ] }),
+    /* @__PURE__ */ jsx(
+      motion.rect,
+      {
+        variants: stopBlock,
+        style: floor,
+        fill: "currentColor",
+        fillOpacity: 0,
+        opacity: 0,
+        x: "5",
+        y: "5",
+        width: "14",
+        height: "14",
+        rx: "2"
+      }
+    )
+  ] }));
+}
+var needle = returning(
+  { rotate: [0, 12, -38, 14, -5, 0] },
+  beats([0, 0.16, 0.44, 0.64, 0.84, 1], 0.62)
+);
+function MotionNavigation(props) {
+  return /* @__PURE__ */ jsx(MotionIcon, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx(motion.polygon, { variants: needle, style: pivot(12, 12), points: "3 11 22 2 13 21 11 13 3 11" }) }));
+}
+var LOCATE = beats([0, 0.16, 0.44, 0.6, 0.8, 1], 0.62);
+var reticle = returning(
+  { x: [0, 2, -7, 0.8, -0.3, 0], y: [0, -1.5, 5, -0.6, 0.2, 0] },
+  LOCATE
+);
+var ring = returning({ scale: [1, 1, 1, 0.9, 1.02, 1] }, LOCATE);
+var tick = (axis, inward) => axis === "x" ? returning({ x: [0, 0, 0, inward, 0, 0] }, LOCATE) : returning({ y: [0, 0, 0, inward, 0, 0] }, LOCATE);
+var tickLeft = tick("x", 2.5);
+var tickRight = tick("x", -2.5);
+var tickTop = tick("y", 2.5);
+var tickBottom = tick("y", -2.5);
+var lockDot = returning(
+  { scale: [1, 1, 1, 1.35, 1, 1], fillOpacity: [0, 0, 0, 1, 1, 0] },
+  LOCATE
+);
+function MotionLocate(props) {
+  const centre = pivot(12, 12);
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsxs(motion.g, { variants: reticle, children: [
+      /* @__PURE__ */ jsx(motion.line, { variants: tickLeft, x1: "2", x2: "5", y1: "12", y2: "12" }),
+      /* @__PURE__ */ jsx(motion.line, { variants: tickRight, x1: "19", x2: "22", y1: "12", y2: "12" }),
+      /* @__PURE__ */ jsx(motion.line, { variants: tickTop, x1: "12", x2: "12", y1: "2", y2: "5" }),
+      /* @__PURE__ */ jsx(motion.line, { variants: tickBottom, x1: "12", x2: "12", y1: "19", y2: "22" }),
+      /* @__PURE__ */ jsx(motion.circle, { variants: ring, style: centre, cx: "12", cy: "12", r: "7" })
+    ] }),
+    /* @__PURE__ */ jsx(
+      motion.circle,
+      {
+        variants: lockDot,
+        style: centre,
+        fill: "currentColor",
+        fillOpacity: 0,
+        cx: "12",
+        cy: "12",
+        r: "3"
+      }
+    )
+  ] }));
+}
+var MAXIMIZE = beats([0, 0.16, 0.44, 0.6, 0.82, 1], 0.6);
+var CORNER_OFFSET = [0, -2, 7, 6, -0.8, 0];
+var DIAGONAL_STRETCH = CORNER_OFFSET.map((d) => (9.9 + d * Math.SQRT2) / 9.9);
+var cornerTopRight = returning(
+  { x: CORNER_OFFSET, y: CORNER_OFFSET.map((d) => -d) },
+  MAXIMIZE
+);
+var cornerBottomLeft = returning(
+  { x: CORNER_OFFSET.map((d) => -d), y: CORNER_OFFSET },
+  MAXIMIZE
+);
+var diagonal = returning({ scale: DIAGONAL_STRETCH }, MAXIMIZE);
+function MotionMaximize(props) {
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(motion.path, { variants: cornerTopRight, d: "M15 3h6v6" }),
+    /* @__PURE__ */ jsx(motion.path, { variants: diagonal, style: pivot(14, 10), d: "m21 3-7 7" }),
+    /* @__PURE__ */ jsx(motion.path, { variants: diagonal, style: pivot(10, 14), d: "m3 21 7-7" }),
+    /* @__PURE__ */ jsx(motion.path, { variants: cornerBottomLeft, d: "M9 21H3v-6" })
+  ] }));
+}
+var PHONE = beats([0, 0.14, 0.42, 0.56, 0.8, 1], 0.64);
+var handset = returning({ rotate: [0, -6, 46, 40, -5, 0] }, PHONE);
+var cradle = returning({ scaleY: [1, 0.97, 1, 1, 0.92, 1] }, PHONE);
+function MotionPhone(props) {
+  return /* @__PURE__ */ jsx(MotionIcon, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx(motion.g, { variants: cradle, style: pivot(18.5, 22), children: /* @__PURE__ */ jsx(
+    motion.path,
+    {
+      variants: handset,
+      style: pivot(18.5, 18.5),
+      d: "M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384"
+    }
+  ) }) }));
+}
+var MAIL_TIMES = [0, 0.14, 0.42, 0.56, 0.84, 1];
+var flap = returning({ scaleY: [1, 1.12, -1.15, -1, 1.08, 1] }, beats(MAIL_TIMES, 0.64));
+var envelope = returning({ scaleY: [1, 1, 0.92, 1] }, beats([0, 0.84, 0.92, 1], 0.64));
+function MotionMail(props) {
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(motion.rect, { variants: envelope, style: pivot(12, 20), x: "2", y: "4", width: "20", height: "16", rx: "2" }),
+    /* @__PURE__ */ jsx(
+      motion.path,
+      {
+        variants: flap,
+        style: pivot(12, 5.5),
+        d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7"
+      }
+    )
+  ] }));
+}
+var FLAG = beats([0, 0.18, 0.4, 0.56, 0.76, 1], 0.62);
+var wholeFlag = returning({ y: [0, -8, 1.2, 0, 0, 0] }, FLAG);
+var pole = returning({ scaleY: [1, 1, 0.88, 1.02, 1, 1] }, FLAG);
+var cloth = returning({ rotate: [0, 5, -22, 12, -4, 0] }, FLAG);
+function MotionFlag(props) {
+  return /* @__PURE__ */ jsx(MotionIcon, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsxs(motion.g, { variants: wholeFlag, children: [
+    /* @__PURE__ */ jsx(motion.path, { variants: pole, style: pivot(4, 22), d: "M4 22V4" }),
+    /* @__PURE__ */ jsx(
+      motion.path,
+      {
+        variants: cloth,
+        style: pivot(4, 4),
+        d: "M4 4a1 1 0 0 1 .4-.8A6 6 0 0 1 8 2c3 0 5 2 7.333 2q2 0 3.067-.8A1 1 0 0 1 20 4v10a1 1 0 0 1-.4.8A6 6 0 0 1 16 16c-3 0-5-2-8-2a6 6 0 0 0-4 1.528"
+      }
+    )
+  ] }) }));
+}
+var DOOR_REEL = beats([0, 0.16, 0.6, 0.78, 1], 0.6);
+var reel = returning({ x: [0, -2, 17.2, 15.6, 16] }, DOOR_REEL);
+function DoorArrow({ shaftD, headD, dx }) {
+  return /* @__PURE__ */ jsxs("g", { transform: dx ? `translate(${dx} 0)` : void 0, children: [
+    /* @__PURE__ */ jsx("path", { d: shaftD }),
+    /* @__PURE__ */ jsx("path", { d: headD })
+  ] });
+}
+var doorKickIn = returning({ x: [0, 0, 1.5, -0.4, 0] }, beats([0, 0.5, 0.64, 0.82, 1], 0.6));
+function MotionLogIn(props) {
+  const clipId = useSvgId("door-in");
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("rect", { x: "0", y: "3", width: "17", height: "18" }) }) }),
+    /* @__PURE__ */ jsx("g", { clipPath: `url(#${clipId})`, children: /* @__PURE__ */ jsxs(motion.g, { variants: reel, children: [
+      /* @__PURE__ */ jsx(DoorArrow, { shaftD: "M15 12H3", headD: "m10 17 5-5-5-5", dx: 0 }),
+      /* @__PURE__ */ jsx(DoorArrow, { shaftD: "M15 12H3", headD: "m10 17 5-5-5-5", dx: -16 })
+    ] }) }),
+    /* @__PURE__ */ jsx(motion.path, { variants: doorKickIn, d: "M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4" })
+  ] }));
+}
+var doorKickOut = returning({ x: [0, 0, -1.5, 0.4, 0] }, beats([0, 0.3, 0.44, 0.62, 1], 0.6));
+function MotionLogOut(props) {
+  const clipId = useSvgId("door-out");
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("rect", { x: "8", y: "3", width: "16", height: "18" }) }) }),
+    /* @__PURE__ */ jsx("g", { clipPath: `url(#${clipId})`, children: /* @__PURE__ */ jsxs(motion.g, { variants: reel, children: [
+      /* @__PURE__ */ jsx(DoorArrow, { shaftD: "M21 12H9", headD: "m16 17 5-5-5-5", dx: 0 }),
+      /* @__PURE__ */ jsx(DoorArrow, { shaftD: "M21 12H9", headD: "m16 17 5-5-5-5", dx: -16 })
+    ] }) }),
+    /* @__PURE__ */ jsx(motion.path, { variants: doorKickOut, d: "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" })
+  ] }));
+}
+var gear = returning({ rotate: [0, -10, 98, 87, 90] }, beats([0, 0.16, 0.62, 0.8, 1], 0.6));
+var hub = returning({ scale: [1, 0.8, 0.8, 1.2, 1] }, beats([0, 0.16, 0.62, 0.78, 1], 0.6));
+function MotionSettings(props) {
+  const centre = pivot(12, 12);
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(
+      motion.path,
+      {
+        variants: gear,
+        style: centre,
+        d: "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915"
+      }
+    ),
+    /* @__PURE__ */ jsx(motion.circle, { variants: hub, style: centre, cx: "12", cy: "12", r: "3" })
+  ] }));
+}
+
+export { MotionArrow, MotionCaret, MotionCircleX, MotionExternalLink, MotionFlag, MotionLocate, MotionLogIn, MotionLogOut, MotionMail, MotionMaximize, MotionNavigation, MotionPhone, MotionSend, MotionSettings, MotionX };

package/dist/components/motion-icon-controls.js

@@ -1,4 +1,4 @@
-export { MotionBookmark, MotionCheck, MotionChevron, MotionCopy, MotionEye, MotionHeart, MotionPlayPause, MotionRefresh, MotionSearch, MotionShare, MotionSliders, MotionSort, MotionStar, MotionTheme } from '../chunk-YOKHBAIH.js';
-import '../chunk-G7IFL4Z4.js';
+export { MotionBookmark, MotionCheck, MotionChevron, MotionCopy, MotionEye, MotionHeart, MotionPlayPause, MotionRefresh, MotionSearch, MotionShare, MotionSliders, MotionSort, MotionStar, MotionTheme } from '../chunk-4OF4T4AI.js';
+import '../chunk-L3VEMP5A.js';
 import '../chunk-FEK5XGZW.js';
-import '../chunk-3GWWZKX7.js';
+import '../chunk-MMUBH76A.js';

package/dist/components/motion-icon-set.d.ts

@@ -23,5 +23,17 @@ declare function MotionMapPin(props: MotionIconProps): react_jsx_runtime.JSX.Ele
  * still, which is what sells the contents moving.
  */
 declare function MotionCalendar(props: MotionIconProps): react_jsx_runtime.JSX.Element;
+declare function MotionLayoutGrid(props: MotionIconProps): react_jsx_runtime.JSX.Element;
+/**
+ * The one gesture that HOLDS on the drinks side: rest is the exact lucide
+ * glyph (empty, line visible), active is the bowl filled to the line. Outline
+ * → solid mass is the largest silhouette change in the set, and at the
+ * segmented control's 16px that is still ~4.7px of rising liquid.
+ */
+declare function MotionWine(props: MotionIconProps): react_jsx_runtime.JSX.Element;
+declare function MotionMap(props: MotionIconProps): react_jsx_runtime.JSX.Element;
+declare function MotionFlame(props: MotionIconProps): react_jsx_runtime.JSX.Element;
+declare function MotionCalendarClock(props: MotionIconProps): react_jsx_runtime.JSX.Element;
+declare function MotionList(props: MotionIconProps): react_jsx_runtime.JSX.Element;
 
-export { MotionCalendar, MotionHouse, MotionMapPin, MotionUtensils };
+export { MotionCalendar, MotionCalendarClock, MotionFlame, MotionHouse, MotionLayoutGrid, MotionList, MotionMap, MotionMapPin, MotionUtensils, MotionWine };

package/dist/components/motion-icon-set.js

@@ -1,9 +1,8 @@
-import { beats, pivot, MotionIcon, returnTransition } from '../chunk-G7IFL4Z4.js';
+import { beats, pivot, returnTransition, MotionIcon, useSvgId } from '../chunk-L3VEMP5A.js';
 import '../chunk-FEK5XGZW.js';
-import { __spreadProps, __spreadValues } from '../chunk-3GWWZKX7.js';
-import * as React from 'react';
+import { __spreadProps, __spreadValues } from '../chunk-MMUBH76A.js';
 import { motion } from 'framer-motion';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
 var HOUSE_TIMES = [0, 0.16, 0.44, 0.72, 1];
 var houseRoof = {
@@ -137,7 +136,7 @@ var reel = {
   }
 };
 function MotionCalendar(props) {
-  const clipId = `cal-body-${React.useId().replace(/:/g, "")}`;
+  const clipId = useSvgId("cal-body");
   return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
     /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("rect", { x: "3.5", y: "10.5", width: "17", height: "11", rx: "1.5" }) }) }),
     /* @__PURE__ */ jsx("path", { d: "M8 2v4" }),
@@ -147,5 +146,197 @@ function MotionCalendar(props) {
     /* @__PURE__ */ jsx("g", { clipPath: `url(#${clipId})`, children: /* @__PURE__ */ jsx(motion.g, { variants: reel, children: ROWS.map((y) => COLS.map((x) => /* @__PURE__ */ jsx("path", { d: `M${x} ${y}h.01` }, `${x}-${y}`))) }) })
   ] }));
 }
+var GRID_TIMES = [0, 0.14, 0.6, 0.8, 1];
+var GRID_PITCH = 11;
+var GRID_CHASE = 0.03;
+var slide = (direction) => [0, -1.5, GRID_PITCH + 1.5, GRID_PITCH - 0.4, GRID_PITCH].map((v) => v * direction);
+var chase = (order) => __spreadProps(__spreadValues({}, beats(GRID_TIMES, 0.58)), { delay: order * GRID_CHASE });
+function tileAlongX(direction, order) {
+  return {
+    rest: { x: 0, transition: returnTransition },
+    active: { x: 0, transition: returnTransition },
+    play: { x: slide(direction), transition: chase(order) }
+  };
+}
+function tileAlongY(direction, order) {
+  return {
+    rest: { y: 0, transition: returnTransition },
+    active: { y: 0, transition: returnTransition },
+    play: { y: slide(direction), transition: chase(order) }
+  };
+}
+var tileTopLeft = tileAlongX(1, 0);
+var tileTopRight = tileAlongY(1, 1);
+var tileBottomRight = tileAlongX(-1, 2);
+var tileBottomLeft = tileAlongY(-1, 3);
+function MotionLayoutGrid(props) {
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(motion.rect, { variants: tileTopLeft, width: "7", height: "7", x: "3", y: "3", rx: "1" }),
+    /* @__PURE__ */ jsx(motion.rect, { variants: tileTopRight, width: "7", height: "7", x: "14", y: "3", rx: "1" }),
+    /* @__PURE__ */ jsx(motion.rect, { variants: tileBottomRight, width: "7", height: "7", x: "14", y: "14", rx: "1" }),
+    /* @__PURE__ */ jsx(motion.rect, { variants: tileBottomLeft, width: "7", height: "7", x: "3", y: "14", rx: "1" })
+  ] }));
+}
+var WINE_TIMES = [0, 0.16, 0.6, 0.78, 1];
+var WINE_EMPTY = 15;
+var WINE_LINE = 10;
+var WINE_SLOSH = 8;
+var liquid = {
+  rest: { attrY: WINE_EMPTY, transition: returnTransition },
+  active: { attrY: WINE_LINE, transition: returnTransition },
+  play: {
+    // Sits empty through the squat, rises past the line at the apex, drops
+    // back, settles on the line.
+    attrY: [WINE_EMPTY, WINE_EMPTY, WINE_SLOSH, WINE_LINE + 0.5, WINE_LINE],
+    transition: beats(WINE_TIMES)
+  }
+};
+var glass = {
+  rest: { scaleY: 1, transition: returnTransition },
+  active: { scaleY: 1, transition: returnTransition },
+  play: { scaleY: [1, 0.9, 1.03, 0.98, 1], transition: beats(WINE_TIMES) }
+};
+var BOWL = "M12 15a5 5 0 0 0 5-5c0-2-.5-4-2-8H9c-1.5 4-2 6-2 8a5 5 0 0 0 5 5Z";
+function MotionWine(props) {
+  const clipId = useSvgId("wine-bowl");
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: clipId, children: /* @__PURE__ */ jsx("path", { d: BOWL }) }) }),
+    /* @__PURE__ */ jsxs(motion.g, { variants: glass, style: pivot(12, 22), children: [
+      /* @__PURE__ */ jsx("g", { clipPath: `url(#${clipId})`, children: /* @__PURE__ */ jsx(
+        motion.rect,
+        {
+          variants: liquid,
+          fill: "currentColor",
+          stroke: "none",
+          x: "6",
+          y: WINE_EMPTY,
+          width: "12",
+          height: "12"
+        }
+      ) }),
+      /* @__PURE__ */ jsx("path", { d: "M8 22h8" }),
+      /* @__PURE__ */ jsx("path", { d: "M7 10h10" }),
+      /* @__PURE__ */ jsx("path", { d: "M12 15v7" }),
+      /* @__PURE__ */ jsx("path", { d: BOWL })
+    ] })
+  ] }));
+}
+var MAP_TIMES = [0, 0.2, 0.5, 0.66, 0.84, 1];
+var FOLD = [1, 0.2, 1.18, 0.94, 1.03, 1];
+var panelRight = {
+  rest: { scaleX: 1, transition: returnTransition },
+  active: { scaleX: 1, transition: returnTransition },
+  play: { scaleX: FOLD, transition: beats(MAP_TIMES, 0.62) }
+};
+var panelLeft = {
+  rest: { scaleX: 1, transition: returnTransition },
+  active: { scaleX: 1, transition: returnTransition },
+  play: { scaleX: FOLD, transition: __spreadProps(__spreadValues({}, beats(MAP_TIMES, 0.62)), { delay: 0.06 }) }
+};
+function MotionMap(props) {
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx("path", { d: "M14.106 5.553a2 2 0 0 0 1.788 0" }),
+    /* @__PURE__ */ jsx("path", { d: "M15.894 20.554a2 2 0 0 1-1.788 0l-4.212-2.106" }),
+    /* @__PURE__ */ jsx("path", { d: "M9.894 3.447 14.106 5.553" }),
+    /* @__PURE__ */ jsxs(motion.g, { variants: panelRight, style: pivot(15, 12), children: [
+      /* @__PURE__ */ jsx("path", { d: "M15.894 5.553l3.659-1.83A1 1 0 0 1 21 4.619v12.764a1 1 0 0 1-.553.894l-4.553 2.277" }),
+      /* @__PURE__ */ jsx("path", { d: "M15 5.764v15" })
+    ] }),
+    /* @__PURE__ */ jsxs(motion.g, { variants: panelLeft, style: pivot(9, 12), children: [
+      /* @__PURE__ */ jsx("path", { d: "M9.894 18.448a2 2 0 0 0-1.788 0l-3.659 1.83A1 1 0 0 1 3 19.381V6.618a1 1 0 0 1 .553-.894l4.553-2.277a2 2 0 0 1 1.788 0" }),
+      /* @__PURE__ */ jsx("path", { d: "M9 3.236v15" })
+    ] })
+  ] }));
+}
+var FLAME_TIMES = [0, 0.16, 0.42, 0.58, 0.78, 1];
+var flame = {
+  rest: { scaleY: 1, scaleX: 1, skewX: 0, fillOpacity: 0, transition: returnTransition },
+  active: { scaleY: 1, scaleX: 1, skewX: 0, fillOpacity: 0, transition: returnTransition },
+  play: {
+    scaleY: [1, 0.8, 1.38, 1.18, 0.96, 1],
+    scaleX: [1, 1.15, 0.82, 0.95, 1.03, 1],
+    skewX: [0, 0, -8, 7, -2, 0],
+    fillOpacity: [0, 0, 1, 1, 0.35, 0],
+    transition: beats(FLAME_TIMES)
+  }
+};
+function MotionFlame(props) {
+  return /* @__PURE__ */ jsx(MotionIcon, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx(
+    motion.path,
+    {
+      variants: flame,
+      style: pivot(12, 22),
+      fill: "currentColor",
+      fillOpacity: 0,
+      d: "M12 3q1 4 4 6.5t3 5.5a1 1 0 0 1-14 0 5 5 0 0 1 1-3 1 1 0 0 0 5 0c0-2-1.5-3-1.5-5q0-2 2.5-4"
+    }
+  ) }));
+}
+var CLOCK_TIMES = [0, 0.14, 0.62, 0.8, 1];
+var minuteHand = {
+  rest: { rotate: 0, transition: returnTransition },
+  active: { rotate: 0, transition: returnTransition },
+  play: { rotate: [0, -14, 372, 360, 360], transition: beats(CLOCK_TIMES, 0.62) }
+};
+var elapsed = {
+  rest: { pathLength: 0, transition: returnTransition },
+  active: { pathLength: 0.34, transition: returnTransition },
+  play: { pathLength: [0, 0, 0.42, 0.31, 0.34], transition: beats(CLOCK_TIMES, 0.62) }
+};
+function MotionCalendarClock(props) {
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx("path", { d: "M21 7.5V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h3.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M16 2v4" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 2v4" }),
+    /* @__PURE__ */ jsx("path", { d: "M3 10h5" }),
+    /* @__PURE__ */ jsx("circle", { cx: "16", cy: "16", r: "6" }),
+    /* @__PURE__ */ jsx("g", { transform: "rotate(-90 16 16.2)", children: /* @__PURE__ */ jsx(
+      motion.circle,
+      {
+        variants: elapsed,
+        cx: "16",
+        cy: "16.2",
+        r: "2",
+        strokeWidth: 4,
+        strokeLinecap: "butt",
+        pathLength: 1,
+        strokeDasharray: "0 1"
+      }
+    ) }),
+    /* @__PURE__ */ jsx(motion.path, { variants: minuteHand, style: pivot(16, 16.2), d: "M16 14v2.2" }),
+    /* @__PURE__ */ jsx("path", { d: "M16 16.2l1.6 1" })
+  ] }));
+}
+var LIST_TIMES = [0, 0.14, 0.62, 0.8, 1];
+var mover = {
+  rest: { y: 0, x: 0, scale: 1, transition: returnTransition },
+  active: { y: 0, x: 0, scale: 1, transition: returnTransition },
+  play: {
+    y: [0, 1.5, -15.2, -13.6, -14],
+    x: [0, 0, 2.5, 0.6, 0],
+    scale: [1, 1, 1.06, 1.02, 1],
+    transition: beats(LIST_TIMES, 0.6)
+  }
+};
+var dropSlot = (delay) => ({
+  rest: { y: 0, transition: returnTransition },
+  active: { y: 0, transition: returnTransition },
+  play: { y: [0, 0, 7.6, 6.7, 7], transition: __spreadProps(__spreadValues({}, beats([0, 0.22, 0.62, 0.8, 1], 0.6)), { delay }) }
+});
+var rowFirst = dropSlot(0.07);
+var rowSecond = dropSlot(0);
+function ListRow({ y }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("path", { d: `M3 ${y}h.01` }),
+    /* @__PURE__ */ jsx("path", { d: `M8 ${y}h13` })
+  ] });
+}
+function MotionList(props) {
+  return /* @__PURE__ */ jsxs(MotionIcon, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ jsx(motion.g, { variants: rowFirst, children: /* @__PURE__ */ jsx(ListRow, { y: 5 }) }),
+    /* @__PURE__ */ jsx(motion.g, { variants: rowSecond, children: /* @__PURE__ */ jsx(ListRow, { y: 12 }) }),
+    /* @__PURE__ */ jsx(motion.g, { variants: mover, style: pivot(3, 19), children: /* @__PURE__ */ jsx(ListRow, { y: 19 }) })
+  ] }));
+}
 
-export { MotionCalendar, MotionHouse, MotionMapPin, MotionUtensils };
+export { MotionCalendar, MotionCalendarClock, MotionFlame, MotionHouse, MotionLayoutGrid, MotionList, MotionMap, MotionMapPin, MotionUtensils, MotionWine };

package/dist/components/motion-icon.d.ts

@@ -56,10 +56,24 @@ declare function poses(rest: PoseValues, active: PoseValues, play: Record<string
  *
  * Both effects compare against a ref rather than trusting the dependency array,
  * so they fire once per actual change and not once per render.
+ *
+ * A gesture's last keyframe draws the same PICTURE as the held pose, but not
+ * always with the same VALUES: the grid's tiles end one slot around the
+ * board, the calendar's reel ends four rows up. Left there, the next `rest`
+ * tween would perform a second, backwards gesture on leave. So once `play`
+ * resolves the values snap — invisibly — to the pose they depict: `active`
+ * straight away if the state has arrived, else `rest` after a grace period
+ * that a late-arriving `active` cancels. Leaving while a play is in flight
+ * defers to that same snap rather than springing the parts back mid-gesture.
  */
 declare function useIconGesture(active: boolean, replayToken: number): framer_motion.LegacyAnimationControls;
+/**
+ * An id safe inside `url(#…)`: React 18's `useId` contains colons, React 19's
+ * may contain guillemets, and neither survives a fragment reference.
+ */
+declare function useSvgId(prefix: string): string;
 declare function MotionIcon({ active, replayToken, className, children, }: MotionIconProps & {
     children: React.ReactNode;
 }): react_jsx_runtime.JSX.Element;
 
-export { MotionIcon, type MotionIconProps, type MotionIconVariant, beats, pivot, poses, returnTransition, useIconGesture };
+export { MotionIcon, type MotionIconProps, type MotionIconVariant, beats, pivot, poses, returnTransition, useIconGesture, useSvgId };

package/dist/components/motion-icon.js

@@ -1,3 +1,3 @@
-export { MotionIcon, beats, pivot, poses, returnTransition, useIconGesture } from '../chunk-G7IFL4Z4.js';
+export { MotionIcon, beats, pivot, poses, returnTransition, useIconGesture, useSvgId } from '../chunk-L3VEMP5A.js';
 import '../chunk-FEK5XGZW.js';
-import '../chunk-3GWWZKX7.js';
+import '../chunk-MMUBH76A.js';

package/dist/components/multi-select-combobox.js

@@ -1,12 +1,12 @@
-import { Popover, PopoverTrigger, PopoverContent } from '../chunk-66MAPLXS.js';
-import { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from '../chunk-XNA2INVQ.js';
-import '../chunk-FRPPIXMY.js';
-import { Checkbox } from '../chunk-D5QHEHXJ.js';
-import { Button } from '../chunk-VAXOQS7W.js';
+import { Popover, PopoverTrigger, PopoverContent } from '../chunk-2ADCZXZJ.js';
+import { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from '../chunk-MCOHLWRS.js';
+import '../chunk-PDTPO6NG.js';
+import { Checkbox } from '../chunk-NMEVJT5Q.js';
+import { Button } from '../chunk-F76NCVVR.js';
 import '../chunk-R47NEOSI.js';
-import { Badge } from '../chunk-2CXU5WZO.js';
+import { Badge } from '../chunk-P43B3ONY.js';
 import { cn } from '../chunk-FEK5XGZW.js';
-import '../chunk-3GWWZKX7.js';
+import '../chunk-MMUBH76A.js';
 import * as React from 'react';
 import { ChevronsUpDown, X } from 'lucide-react';
 import { jsxs, jsx } from 'react/jsx-runtime';

package/dist/components/multi-select-menu.js

@@ -1,6 +1,6 @@
-import { Checkbox } from '../chunk-D5QHEHXJ.js';
+import { Checkbox } from '../chunk-NMEVJT5Q.js';
 import { cn } from '../chunk-FEK5XGZW.js';
-import '../chunk-3GWWZKX7.js';
+import '../chunk-MMUBH76A.js';
 import * as React from 'react';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { jsxs, jsx } from 'react/jsx-runtime';

package/dist/components/native-select.js

@@ -1,5 +1,5 @@
 import { cn } from '../chunk-FEK5XGZW.js';
-import { __objRest, __spreadProps, __spreadValues } from '../chunk-3GWWZKX7.js';
+import { __objRest, __spreadProps, __spreadValues } from '../chunk-MMUBH76A.js';
 import * as React from 'react';
 import { ChevronDown } from 'lucide-react';
 import { cva } from 'class-variance-authority';

package/dist/components/open-now-list.d.ts

@@ -1,7 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MenuVenuePreview, MenuLinkComponent, MenuLinkProps } from './menu-types.js';
 import 'react';
-import './place-types.js';
+import '../place-types-BHdeMMiG.js';
+import '../lib/grade.js';
 
 /**
  * OpenNowList — who is still serving, and until when.