@spinjs/components 0.0.0-stage → 0.1.0-preview.1

package/dist/floating-panel/floating-panel.state.js

@@ -0,0 +1,76 @@
+import { defaultTwin, isRecord } from "@spinjs/runtime";
+// src/floating-panel/floating-panel.state.ts
+function sizeOf(raw) {
+	const shape = (value) => {
+		if (!isRecord(value)) return null;
+		const w = value["w"];
+		const h = value["h"];
+		return typeof w === "number" && typeof h === "number" ? {
+			w,
+			h
+		} : null;
+	};
+	if (typeof raw === "string") {
+		if (raw.length === 0) return null;
+		try {
+			return shape(JSON.parse(raw));
+		} catch {
+			return null;
+		}
+	}
+	return shape(raw);
+}
+const DEFAULT_SIZE = {
+	w: 360,
+	h: 240
+};
+const DEFAULT_MIN = {
+	w: 120,
+	h: 80
+};
+const DEFAULT_MAX = {
+	w: 1024,
+	h: 768
+};
+function initial(args = {}, authored) {
+	const written = (field) => authored(field) || authored(defaultTwin(field)) || args[defaultTwin(field)] !== void 0;
+	const stage = args.stage;
+	return {
+		position: {
+			x: 0,
+			y: 0
+		},
+		size: written("size") ? sizeOf(args.size) ?? DEFAULT_SIZE : DEFAULT_SIZE,
+		restoreSize: null,
+		restorePosition: null,
+		stage: stage === "minimized" || stage === "maximized" ? stage : "restored",
+		dragFrom: null,
+		minSize: sizeOf(args.minSize) ?? DEFAULT_MIN,
+		maxSize: sizeOf(args.maxSize) ?? DEFAULT_MAX,
+		resizeFrom: null,
+		axis: null,
+		draggable: written("draggable") ? args.draggable !== false : true,
+		resizable: written("resizable") ? args.resizable !== false : true,
+		closeOnEscape: written("closeOnEscape") ? args.closeOnEscape !== false : true,
+		boundary: {
+			w: 1024,
+			h: 768
+		},
+		label: written("label") ? args.label ?? "" : "",
+		disabled: written("disabled") ? args.disabled === true : false
+	};
+}
+function startOpen(raw, authored) {
+	return authored("open") ? raw["open"] === true : raw["defaultOpen"] === true;
+}
+function clampPosition(ctx, x, y) {
+	const maxX = Math.max(0, ctx.boundary.w - ctx.size.w);
+	const maxY = Math.max(0, ctx.boundary.h - ctx.size.h);
+	return {
+		x: Math.min(Math.max(x, 0), maxX),
+		y: Math.min(Math.max(y, 0), maxY)
+	};
+}
+export { clampPosition, initial, sizeOf, startOpen };
+
+//# sourceMappingURL=floating-panel.state.js.map

package/dist/floating-panel/floating-panel.transitions.d.ts

@@ -0,0 +1,22 @@
+import { FloatingPanelContext } from "./floating-panel.state.js";
+import { FloatingPanelEvents } from "./floating-panel.events.js";
+import { AssignFor, GuardFor } from "@spinjs/runtime/fsm";
+type FPAssign<K extends keyof FloatingPanelEvents = keyof FloatingPanelEvents> = AssignFor<FloatingPanelContext, FloatingPanelEvents, K>;
+export declare const clearDragFrom: FPAssign;
+export declare const clearResizeFrom: FPAssign;
+export declare const setSize: FPAssign<"SIZE.SET">;
+export declare const minimize: FPAssign<"MINIMIZE">;
+export declare const maximize: FPAssign<"MAXIMIZE">;
+export declare const restore: FPAssign<"RESTORE">;
+export declare const escapeCancel: FPAssign<"ESCAPE">;
+export declare const dragStart: FPAssign<"DRAG.START">;
+export declare const resizeStart: FPAssign<"RESIZE.START">;
+export declare const dragMove: FPAssign<"DRAG.MOVE">;
+export declare const resizeMove: FPAssign<"RESIZE.MOVE">;
+export declare const cancelDragToOpen: FPAssign;
+export declare const restoreResizeGeometry: FPAssign;
+export declare const closeOnEscape: GuardFor<FloatingPanelContext, FloatingPanelEvents>;
+export declare const canDrag: GuardFor<FloatingPanelContext, FloatingPanelEvents>;
+export declare const canResize: GuardFor<FloatingPanelContext, FloatingPanelEvents>;
+export {};
+//# sourceMappingURL=floating-panel.transitions.d.ts.map

package/dist/floating-panel/floating-panel.transitions.js

@@ -0,0 +1,114 @@
+import { clampPosition, sizeOf } from "./floating-panel.state.js";
+// src/floating-panel/floating-panel.transitions.ts
+const clearDragFrom = () => ({ dragFrom: null });
+const clearResizeFrom = () => ({
+	resizeFrom: null,
+	axis: null
+});
+const setSize = (_ctx, event) => {
+	const size = sizeOf(event.size);
+	if (size === null) return {};
+	return { size: {
+		w: size.w,
+		h: size.h
+	} };
+};
+const minimize = (ctx) => {
+	if (ctx.stage === "minimized") return {};
+	return ctx.stage === "restored" ? {
+		stage: "minimized",
+		restoreSize: { ...ctx.size },
+		restorePosition: { ...ctx.position }
+	} : { stage: "minimized" };
+};
+const maximize = (ctx) => {
+	if (ctx.stage === "maximized") return {};
+	return {
+		restoreSize: ctx.stage === "restored" ? { ...ctx.size } : ctx.restoreSize,
+		restorePosition: ctx.stage === "restored" ? { ...ctx.position } : ctx.restorePosition,
+		stage: "maximized",
+		size: {
+			w: ctx.boundary.w,
+			h: ctx.boundary.h
+		},
+		position: {
+			x: 0,
+			y: 0
+		}
+	};
+};
+const restore = (ctx) => {
+	if (ctx.stage === "restored") return {};
+	return {
+		stage: "restored",
+		size: ctx.restoreSize ?? ctx.size,
+		position: ctx.restorePosition ?? ctx.position,
+		restoreSize: null,
+		restorePosition: null
+	};
+};
+const escapeCancel = (ctx) => {
+	const back = {};
+	if (ctx.dragFrom !== null) back.position = { ...ctx.dragFrom };
+	if (ctx.resizeFrom !== null) back.size = { ...ctx.resizeFrom.size };
+	return {
+		...back,
+		dragFrom: null,
+		resizeFrom: null,
+		axis: null
+	};
+};
+const dragStart = (ctx) => ({ dragFrom: { ...ctx.position } });
+const resizeStart = (ctx, event) => ({
+	resizeFrom: {
+		size: { ...ctx.size },
+		position: { ...ctx.position }
+	},
+	axis: {
+		x: event.x,
+		y: event.y
+	}
+});
+const dragMove = (ctx, event) => {
+	const from = ctx.dragFrom ?? ctx.position;
+	return { position: clampPosition(ctx, from.x + event.dx, from.y + event.dy) };
+};
+const resizeMove = (ctx, event) => {
+	const origin = ctx.resizeFrom;
+	if (origin === null) return {};
+	const axis = ctx.axis ?? {
+		x: 0,
+		y: 0
+	};
+	const lo = ctx.minSize;
+	const hi = ctx.maxSize;
+	const w = Math.min(hi.w, Math.max(lo.w, origin.size.w + (axis.x === 1 ? event.dx : axis.x === -1 ? -event.dx : 0)));
+	const h = Math.min(hi.h, Math.max(lo.h, origin.size.h + (axis.y === 1 ? event.dy : axis.y === -1 ? -event.dy : 0)));
+	const back = {};
+	if (axis.x === -1) back.position = clampPosition(ctx, origin.position.x - (w - origin.size.w), origin.position.y);
+	if (axis.y === -1) back.position = {
+		x: back.position?.x ?? origin.position.x,
+		y: origin.position.y - (h - origin.size.h)
+	};
+	return {
+		size: {
+			w,
+			h
+		},
+		...back
+	};
+};
+const cancelDragToOpen = (ctx) => ({ position: ctx.dragFrom ?? ctx.position });
+const restoreResizeGeometry = (ctx) => {
+	if (ctx.resizeFrom === null) return {};
+	return {
+		size: { ...ctx.resizeFrom.size },
+		position: { ...ctx.resizeFrom.position }
+	};
+};
+const closeOnEscape = (ctx) => ctx.closeOnEscape;
+const canDrag = (ctx) => ctx.draggable && ctx.stage !== "maximized" && ctx.stage !== "minimized";
+const canResize = (ctx) => ctx.resizable && ctx.stage !== "maximized" && ctx.stage !== "minimized";
+export { canDrag, canResize, cancelDragToOpen, clearDragFrom, clearResizeFrom, closeOnEscape, dragMove, dragStart, escapeCancel, maximize, minimize, resizeMove, resizeStart, restore, restoreResizeGeometry, setSize };
+
+//# sourceMappingURL=floating-panel.transitions.js.map

package/dist/hover-card/examples/basic.html

@@ -0,0 +1,19 @@
+<script lang="ts">
+import { hoverCard } from "../hover-card.controller-def.js";
+
+const ctl = hoverCard();
+</script>
+
+<div {...ctl.getRootProps()} class="inline-block">
+  <span {...ctl.getTriggerProps()}
+    class="inline-block cursor-pointer rounded-md border border-solid border-border bg-surface-raised px-3 py-1 text-sm text-text transition-colors hover:bg-surface">Hover me</span>
+
+  <div {...ctl.getContentProps()}
+    class="fixed m-0 rounded-lg border border-solid border-border bg-surface-raised p-4 shadow-lg max-w-[20rem]">
+    <div class="stack-sm">
+      <strong class="text-sm text-text">Hover Card</strong>
+      <p
+        class="text-sm text-text-muted">This is a basic hover card that appears when you hover over the trigger element.</p>
+    </div>
+  </div>
+</div>

package/dist/hover-card/examples/controlled.html

@@ -0,0 +1,32 @@
+<script lang="ts">
+import { hoverCard } from "../hover-card.controller-def.js";
+
+const ctl = hoverCard();
+</script>
+
+<div class="w-full stack-lg p-6">
+  <div class="stack-sm">
+    <strong class="text-sm text-text">External Controls</strong>
+    <div class="flex gap-2">
+      <button id="hc-show" class="s-sm">Show Hover Card</button>
+      <button id="hc-hide" class="s-sm">Hide Hover Card</button>
+    </div>
+    <p
+      class="text-sm text-text-muted">Current state: <span class="font-medium" id="hc-state">Closed</span></p>
+  </div>
+  <div class="flex items-center justify-center py-12"
+    {...ctl.getRootProps()}>
+    <span {...ctl.getTriggerProps()}
+      class="cursor-pointer rounded-lg border border-solid border-border bg-surface-raised px-4 py-2 text-sm text-text transition-colors hover:bg-surface">Controlled Hover Card</span>
+
+    <div {...ctl.getContentProps()}
+      class="fixed m-0 rounded-lg border border-solid border-border bg-surface-raised p-4 shadow-lg max-w-[20rem]">
+      <div class="stack-sm">
+        <strong
+          class="text-sm text-text">Controlled Hover Card</strong>
+        <p
+          class="text-sm text-text-muted">This hover card's open state is controlled externally via the buttons above.</p>
+      </div>
+    </div>
+  </div>
+</div>

package/dist/hover-card/examples/custom-positioning.html

@@ -0,0 +1,29 @@
+<script lang="ts">
+import { hoverCard } from "../hover-card.controller-def.js";
+
+const ctl = hoverCard();
+</script>
+
+<div class="w-full stack-lg p-6">
+  <div class="stack-sm">
+    <strong class="text-sm text-text">Select Position</strong>
+    <div class="flex flex-wrap gap-2" data-positions>
+      <button class="secondary s-sm" data-placement-choice="top">Top</button>
+      <button class="secondary s-sm" data-placement-choice="bottom">Bottom</button>
+    </div>
+  </div>
+  <div class="flex items-center justify-center py-12"
+    {...ctl.getRootProps()}>
+    <span {...ctl.getTriggerProps()}
+      class="cursor-pointer rounded-lg bg-primary px-4 py-2 text-sm font-medium text-on-primary">Hover for bottom positioning</span>
+
+    <div {...ctl.getContentProps()}
+      class="fixed m-0 rounded-lg border border-solid border-border bg-surface-raised p-4 shadow-lg max-w-[20rem]">
+      <div class="stack-sm">
+        <strong class="text-sm text-text">Custom Positioning</strong>
+        <p
+          class="text-sm text-text-muted">The card prefers the bottom side and flips when the viewport vetoes it.</p>
+      </div>
+    </div>
+  </div>
+</div>

package/dist/hover-card/examples/link.html

@@ -0,0 +1,10 @@
+<script lang="ts">
+import { hoverCard } from "../hover-card.controller-def.js";
+
+const ctl = hoverCard();
+</script>
+
+<div class="mx-auto max-w-md stack p-6">
+  <p
+    class="text-sm text-text-muted">Check out this amazing article about <span {...ctl.getRootProps()} class="inline"><span {...ctl.getTriggerProps()} class="cursor-pointer text-primary underline">building modern web applications</span><span {...ctl.getContentProps()} class="fixed m-0 max-w-[24rem] w-full overflow-hidden rounded-lg border border-solid border-border bg-surface-raised shadow-lg max-w-[24rem]"><span class="block h-[8rem] w-full bg-surface-sunken" aria-hidden="true"></span><span class="block stack-sm p-4"><span class="block stack-sm"><span class="block text-lg font-semibold text-text">Building Modern Web Applications with React and TypeScript</span><span class="block text-sm text-text-muted">Learn how to create scalable and maintainable web applications using the latest tools and best practices.</span></span><span class="flex items-center justify-between text-xs text-text-muted"><span>Dec 15, 2023</span><span>12.4k views</span></span></span></span></span>.</p>
+</div>

package/dist/hover-card/examples/product.html

@@ -0,0 +1,33 @@
+<script lang="ts">
+import { hoverCard } from "../hover-card.controller-def.js";
+
+const ctl = hoverCard();
+</script>
+
+<div class="flex items-center gap-4 p-6" {...ctl.getRootProps()}>
+  <span {...ctl.getTriggerProps()}
+    class="block h-[8rem] w-[8rem] cursor-pointer overflow-hidden rounded-lg border border-solid border-border bg-surface-sunken">
+    <span
+      class="grid h-full w-full place-items-center transition-transform hover:scale-105"
+      aria-hidden="true"><span class="i-lucide-headphones icon-lg text-text"></span></span>
+  </span>
+
+  <div {...ctl.getContentProps()}
+    class="fixed m-0 max-w-[20rem] w-full overflow-hidden rounded-lg border border-solid border-border bg-surface-raised shadow-lg max-w-[20rem]">
+    <div class="grid aspect-square w-full place-items-center bg-surface-sunken">
+      <span class="i-lucide-headphones text-3xl text-text"
+        aria-hidden="true"></span>
+    </div>
+    <div class="stack p-4">
+      <div class="stack-sm">
+        <h3>Premium Wireless Headphones</h3>
+        <p class="text-sm text-text-muted">High-quality wireless headphones with active noise cancellation and 30-hour battery life.</p>
+      </div>
+      <div class="flex items-center justify-between">
+        <p class="text-lg font-semibold text-text">$299</p>
+        <p class="text-sm text-text-muted">★★★★☆ (4.8)</p>
+      </div>
+      <button class="w-full s-sm">Add to Cart</button>
+    </div>
+  </div>
+</div>

package/dist/hover-card/examples/user.html

@@ -0,0 +1,38 @@
+<script lang="ts">
+import { hoverCard } from "../hover-card.controller-def.js";
+
+const ctl = hoverCard();
+</script>
+
+<div {...ctl.getRootProps()} class="inline-block">
+  <span {...ctl.getTriggerProps()}
+    class="inline-flex cursor-pointer items-center gap-2 rounded-lg border border-solid border-border bg-surface-raised px-3 py-2 text-sm text-text transition-colors hover:bg-surface">
+    <span
+      class="grid h-6 w-6 place-items-center rounded-full bg-primary text-xs font-semibold text-on-primary"
+      aria-hidden="true">JD</span>
+    <span class="text-sm font-medium">@johndoe</span>
+  </span>
+
+  <div {...ctl.getContentProps()}
+    class="fixed m-0 max-w-[20rem] w-full rounded-lg border border-solid border-border bg-surface-raised p-6 shadow-lg max-w-[20rem]">
+    <div class="stack">
+      <div class="flex items-start gap-3">
+        <span
+          class="grid h-12 w-12 shrink-0 place-items-center rounded-full bg-primary text-lg font-semibold text-on-primary"
+          aria-hidden="true">JD</span>
+        <div class="min-w-0 flex-1">
+          <h3>John Doe</h3>
+          <p class="text-sm text-text-muted">@johndoe</p>
+        </div>
+        <button class="s-sm">Follow</button>
+      </div>
+      <p class="text-sm text-text-muted">Frontend developer passionate about creating beautiful and accessible user interfaces.</p>
+      <div class="flex items-center gap-4 text-sm">
+        <p
+          class="text-text-muted"><span class="font-medium text-text">2.1k</span> followers</p>
+        <p
+          class="text-text-muted"><span class="font-medium text-text">180</span> following</p>
+      </div>
+    </div>
+  </div>
+</div>

package/dist/hover-card/examples/with-arrow.html

@@ -0,0 +1,29 @@
+<script lang="ts">
+import { hoverCard } from "../hover-card.controller-def.js";
+
+const ctl = hoverCard();
+</script>
+
+<div class="flex items-center justify-center gap-8 p-12"
+  {...ctl.getRootProps()}>
+  <span {...ctl.getTriggerProps()}
+    class="inline-flex cursor-pointer items-center gap-2 rounded-lg border border-solid border-border bg-surface-raised px-3 py-2 text-sm text-text transition-colors hover:bg-surface">
+    <span class="i-lucide-info text-sm text-primary" aria-hidden="true"></span>
+    <span class="text-sm font-medium">Information</span>
+  </span>
+
+  <div {...ctl.getContentProps()}
+    class="fixed m-0 rounded-lg border border-solid border-border bg-surface-raised p-4 shadow-lg max-w-[20rem]">
+    <span aria-hidden="true"
+      class="absolute -top-1 left-6 h-2 w-2 rotate-45 border-b-0 border-r-0 border-l border-t border-solid border-border bg-surface-raised"></span>
+    <div class="stack-sm">
+      <div class="flex items-center gap-2">
+        <span class="i-lucide-info text-sm text-primary"
+          aria-hidden="true"></span>
+        <strong class="text-sm text-text">Information</strong>
+      </div>
+      <p
+        class="text-sm text-text-muted">This is an informational message with an arrow pointing to the trigger element.</p>
+    </div>
+  </div>
+</div>

package/dist/hover-card/hover-card.controller-def.d.ts

@@ -0,0 +1,50 @@
+import { ControllerDef } from "@spinjs/runtime";
+/**
+ * Hover-card on the platform: the browser owns open/closed, the top layer,
+ * light-dismiss, and Escape. There is no machine here — `attach` wires the
+ * native popover behavior to the declared commands and events, and the
+ * panel is a card surface from utilities.
+ *
+ * The delays the upstream holds as opening/closing states are one
+ * `hover-delay` action on the root bag: the trigger and the panel are both
+ * inside the root, so moving between them never leaves it, and a single clock
+ * pair owns the open/absence handoff with no cross-instance race. Focus opens
+ * at once and blur closes — keyboard users never wait out a hover clock.
+ * Touch never opens: a card that opens on tap steals the tap the trigger
+ * wanted.
+ *
+ * Delays and disabled are attach-time attribute reads (`open-delay`,
+ * `close-delay`, `disabled`): the declarative case works, and post-build
+ * writes do not reconfigure — the same staleness class as the popover's
+ * frozen data-state.
+ *
+ * The panel positions against the trigger through the `anchor` action,
+ * which reports geometry the bag carries as style properties. Placement
+ * is a suggestion the viewport can veto; the flip reports alongside the
+ * geometry so the origin utility can follow.
+ */
+export interface HoverCardOpenChange {
+  readonly open: boolean;
+}
+/** Authorship surface for recipe-check's reader rule (controllers do
+ * not run defineComponent, so there is no synthesized manifest). */
+export declare const hoverCardManifest: {
+  readonly parts: readonly [];
+  readonly slots: readonly [];
+  readonly readers: readonly ["open"];
+  readonly methods: readonly ["show", "hide", "getRootProps", "getTriggerProps", "getContentProps"];
+};
+export interface HoverCardApi {
+  readonly open: boolean;
+  show(): void;
+  hide(): void;
+  getRootProps(): Record<string, unknown>;
+  getTriggerProps(): Record<string, unknown>;
+  getContentProps(): Record<string, unknown>;
+  setPlacement(next: "top" | "bottom" | "left" | "right"): void;
+}
+export declare function attachHoverCard(el: Element): HoverCardApi;
+export declare const hoverCard: ControllerDef & {
+  attach(el: Element): HoverCardApi;
+} & (() => HoverCardApi);
+//# sourceMappingURL=hover-card.controller-def.d.ts.map

package/dist/hover-card/hover-card.controller-def.js

@@ -0,0 +1,134 @@
+import { defineController, signal } from "@spinjs/runtime";
+// src/hover-card/hover-card.controller-def.ts
+/** Authorship surface for recipe-check's reader rule (controllers do
+* not run defineComponent, so there is no synthesized manifest). */
+const hoverCardManifest = {
+	parts: [],
+	slots: [],
+	readers: ["open"],
+	methods: [
+		"show",
+		"hide",
+		"getRootProps",
+		"getTriggerProps",
+		"getContentProps"
+	]
+};
+function panelOf(el) {
+	return el.querySelector("[popover]");
+}
+function intAttr(el, name, fallback) {
+	const raw = el.getAttribute(name);
+	if (raw === null) return fallback;
+	const parsed = Number.parseInt(raw, 10);
+	return Number.isNaN(parsed) ? fallback : parsed;
+}
+let instanceCounter = 0;
+function attachHoverCard(el) {
+	const readOpen = () => panelOf(el)?.matches(":popover-open") ?? false;
+	const disabled = el.hasAttribute("disabled");
+	const openDelay = intAttr(el, "open-delay", 600);
+	const closeDelay = intAttr(el, "close-delay", 300);
+	let placement = (() => {
+		const raw = el.getAttribute("placement");
+		return raw === "top" || raw === "bottom" || raw === "left" || raw === "right" ? raw : "bottom";
+	})();
+	const emit = (open) => {
+		el.dispatchEvent(new CustomEvent("open-change", {
+			detail: { open },
+			bubbles: true
+		}));
+	};
+	el.addEventListener("toggle", (event) => {
+		emit(event.newState === "open");
+	}, true);
+	const show = () => {
+		if (disabled) return;
+		const panel = panelOf(el);
+		if (panel === null || panel.matches(":popover-open")) return;
+		panel.showPopover();
+	};
+	const hide = () => {
+		const panel = panelOf(el);
+		if (panel === null || !panel.matches(":popover-open")) return;
+		panel.hidePopover();
+	};
+	const geometry = signal({
+		x: 0,
+		y: 0,
+		w: 0,
+		h: 0,
+		placement: "bottom"
+	});
+	const instance = el.id !== "" ? el.id : `hover-card-${++instanceCounter}`;
+	const triggerId = `${instance}:trigger`;
+	const panelId = `${instance}:panel`;
+	return {
+		get open() {
+			return readOpen();
+		},
+		setPlacement(next) {
+			placement = next;
+		},
+		show,
+		hide,
+		getRootProps: () => ({
+			"data-scope": "hover-card",
+			"data-part": "root",
+			"data-state": readOpen() ? "open" : "closed",
+			...disabled ? {} : { "use:hover-delay": {
+				openDelay,
+				closeDelay,
+				onOpen: show,
+				onClose: hide
+			} }
+		}),
+		getTriggerProps: () => ({
+			id: triggerId,
+			"data-scope": "hover-card",
+			"data-part": "trigger",
+			"aria-expanded": readOpen(),
+			"aria-details": panelId,
+			"aria-haspopup": "dialog",
+			"data-state": readOpen() ? "open" : "closed",
+			...disabled ? { disabled: true } : {},
+			onFocus: show,
+			onBlur: hide
+		}),
+		getContentProps: () => ({
+			id: panelId,
+			"data-scope": "hover-card",
+			"data-part": "content",
+			popover: "",
+			role: "dialog",
+			"data-state": readOpen() ? "open" : "closed",
+			get ["data-placement"]() {
+				return geometry().placement;
+			},
+			style: {
+				left: `${geometry().x}px`,
+				top: `${geometry().y}px`,
+				minWidth: `${geometry().w}px`
+			},
+			"use:anchor": {
+				placement,
+				onGeometry: (next) => geometry(next)
+			}
+		})
+	};
+}
+const hoverCard = defineController({
+	attach: attachHoverCard,
+	commands: [
+		"show",
+		"hide",
+		"setPlacement"
+	],
+	events: { "open-change": {
+		on: "onOpenChange",
+		detail: (change) => ({ open: change.open })
+	} }
+});
+export { attachHoverCard, hoverCard, hoverCardManifest };
+
+//# sourceMappingURL=hover-card.controller-def.js.map