"use client";
import { cn } from "./index3.js";
import { parseEventDate } from "./index57.js";
import { FOCUS_RING, TOUCH_TARGET_44_VERTICAL } from "./index58.js";
import { EVENT_COLOR_CLASSES } from "./index59.js";
import { cva } from "class-variance-authority";
import { jsx } from "react/jsx-runtime";
import { format } from "date-fns";
//#region src/components/molecules/data/Calendar/_shared/EventPill.tsx
var eventPillVariants = cva([
	"relative rounded-sm px-1.5 py-0.5 text-xs font-medium truncate cursor-pointer transition-opacity duration-200 hover:opacity-80 motion-reduce:transition-none",
	TOUCH_TARGET_44_VERTICAL,
	FOCUS_RING
].join(" "), {
	variants: { color: EVENT_COLOR_CLASSES },
	defaultVariants: { color: "brand" }
});
function EventPill({ event, onClick, className, style }) {
	const timeLabel = format(parseEventDate(event.start), "h:mm a");
	return /* @__PURE__ */ jsx("button", {
		type: "button",
		"data-slot": "event-pill",
		"aria-label": `${event.title}, ${timeLabel}`,
		onClick: (e) => {
			e.stopPropagation();
			onClick?.(event);
		},
		className: cn(eventPillVariants({ color: event.color }), "text-start", className),
		style,
		children: event.title
	});
}
EventPill.displayName = "EventPill";
//#endregion
export { EventPill };

//# sourceMappingURL=index65.js.map