@bearmenu/ui 0.8.4 → 0.8.7

package/dist/components/event-day-separator.d.ts

@@ -0,0 +1,46 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ElementType } from 'react';
+
+/**
+ * EventDaySeparator — the day divider in the list view (as opposed to
+ * `<EventDayHeader>`, the timeline's oversized day-number header — the two
+ * live on different surfaces with different densities, not a size variant of
+ * one component).
+ *
+ * Both `label` and `count` are caller-composed strings, same reasoning as
+ * `<EventDayHeader>`'s `meta`: "Today · Thursday 3 September" / "15 events"
+ * don't decompose into parts without baking in English clause order.
+ *
+ * Renders the label as a real heading (`as`, default `h2`) so a list of these
+ * gives the page a document outline instead of being purely decorative rules.
+ *
+ * NOTE ON WEIGHT: this heading is deliberately SMALLER and lighter than the
+ * row titles beneath it. The boundary is already the strongest structural
+ * event on the page — a rule to the right edge, 24px of air above it, a muted
+ * count beside it — so it needs no ink on top of that. And the day is chrome
+ * on a scan surface where the events are the content: when the chrome is the
+ * heaviest thing on screen, the eye lands on the same repeated word every
+ * eight rows and nothing in the actual inventory ever wins. If the boundary
+ * ever needs to read louder, the levers are the rule and the air (move the
+ * `<Separator>` above the label), not the weight.
+ */
+type EventDaySeparatorProps = {
+    label: string;
+    count?: string;
+    size?: "sm" | "default";
+    /** Heading level for `label`. Defaults to `h2`. */
+    as?: ElementType;
+    className?: string;
+};
+declare function EventDaySeparator({ label, count, size, as: Tag, className, }: EventDaySeparatorProps): react_jsx_runtime.JSX.Element;
+type EventDaySeparatorSkeletonProps = {
+    /** Matches `EventDaySeparatorProps["size"]`. */
+    size?: "sm" | "default";
+    /** Shows the count placeholder — omit for label-only separators. */
+    showCount?: boolean;
+    className?: string;
+};
+/** Mirrors `<EventDaySeparator>`'s geometry exactly so nothing shifts when data lands. */
+declare function EventDaySeparatorSkeleton({ size, showCount, className, }: EventDaySeparatorSkeletonProps): react_jsx_runtime.JSX.Element;
+
+export { EventDaySeparator, type EventDaySeparatorProps, EventDaySeparatorSkeleton, type EventDaySeparatorSkeletonProps };

package/dist/components/event-day-separator.js

@@ -0,0 +1,50 @@
+import { Separator } from '../chunk-WSRWFA6K.js';
+import { Skeleton } from '../chunk-QXHMPJ35.js';
+import { cn } from '../chunk-FEK5XGZW.js';
+import '../chunk-3GWWZKX7.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function EventDaySeparator({
+  label,
+  count,
+  size = "default",
+  as: Tag = "h2",
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-[11px]",
+        size === "sm" ? "pt-[18px] pb-1" : "pt-6 pb-2",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(Tag, { className: cn("font-semibold", size === "sm" ? "text-[13px]" : "text-sm"), children: label }),
+        count && /* @__PURE__ */ jsx("span", { className: cn("text-muted-foreground", size === "sm" ? "text-[11.5px]" : "text-xs"), children: count }),
+        /* @__PURE__ */ jsx(Separator, { className: "flex-1" })
+      ]
+    }
+  );
+}
+function EventDaySeparatorSkeleton({
+  size = "default",
+  showCount = true,
+  className
+}) {
+  const isSm = size === "sm";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-hidden": "true",
+      className: cn("flex items-center gap-[11px]", isSm ? "pt-[18px] pb-1" : "pt-6 pb-2", className),
+      children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: cn(isSm ? "h-3" : "h-3.5", "w-40") }),
+        showCount && /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-16" }),
+        /* @__PURE__ */ jsx(Separator, { className: "flex-1" })
+      ]
+    }
+  );
+}
+
+export { EventDaySeparator, EventDaySeparatorSkeleton };

package/dist/components/event-detail-panel.d.ts

@@ -0,0 +1,80 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { EventPreview, EventFormatters } from './event-types.js';
+
+/**
+ * EventDetailPanel — the BODY of the event detail sheet.
+ *
+ * Deliberately not a sheet. The design opens this as a side sheet over a dimmed
+ * page on desktop and a bottom sheet on mobile, and the DS already ships `Sheet`
+ * and `Drawer`; owning sheet mechanics a third time here would fork them. The
+ * consuming app mounts this inside whichever container the breakpoint calls for.
+ *
+ * This is the terminal surface for acting on an event, which is why the cards
+ * that open it carry no actions of their own — the footer is where booking and
+ * directions live.
+ *
+ * Everything is injected: strings via `labels`, times via `formatters`, and the
+ * close/share affordances as `headerActions` so the sheet container owns
+ * dismissal (bearmenu sheets close by drag handle, not by back navigation).
+ */
+type EventDetailPanelLinkProps = {
+    href: string;
+    className?: string;
+    children: React.ReactNode;
+};
+type EventDetailVenue = {
+    name: string;
+    /** Address plus opening line, composed by the caller. */
+    meta?: string;
+    ratingLabel?: string;
+    thumbnailUrl?: string;
+    href?: string;
+};
+type EventDetailPanelLabels = {
+    free: string;
+    liveNow: string;
+    /** Section heading above the venue card. */
+    venueHeading: string;
+    /** Section heading above the description. */
+    aboutHeading: string;
+};
+type EventDetailPanelProps = {
+    event: EventPreview;
+    labels: EventDetailPanelLabels;
+    formatters: EventFormatters;
+    /**
+     * The date line, composed by the caller — the design reads
+     * "Saturday, September 5 · Starts at 20:00", whose clause order and
+     * preposition are locale-dependent.
+     */
+    dateLine: string;
+    venue?: EventDetailVenue;
+    /** Category chips beside the live/price chips. */
+    tags?: string[];
+    isLive?: boolean;
+    /** Close and share controls, positioned over the poster by this component. */
+    headerActions?: React.ReactNode;
+    /** Footer actions — the booking CTA and directions. Rendered in a sticky footer. */
+    footer?: React.ReactNode;
+    /** An external link row, e.g. "View on Instagram". */
+    externalLink?: React.ReactNode;
+    /** `compact` is the mobile bottom sheet: tighter type and padding, same 4:5 poster. */
+    size?: "compact" | "default";
+    linkComponent?: React.ComponentType<EventDetailPanelLinkProps>;
+    className?: string;
+    /** Rendered instead of the poster when it's absent. Defaults to `<EventPosterFallback />`. */
+    fallback?: React.ReactNode;
+};
+declare function EventDetailPanel({ event, labels, formatters, dateLine, venue, tags, isLive, headerActions, footer, externalLink, size, linkComponent: LinkComponent, className, fallback, }: EventDetailPanelProps): react_jsx_runtime.JSX.Element;
+type EventDetailPanelSkeletonProps = {
+    /** `compact` is the mobile bottom sheet: tighter type and padding, same 4:5 poster. */
+    size?: "compact" | "default";
+    /** Close and share controls, positioned over the poster — same slot as the real component. */
+    headerActions?: React.ReactNode;
+    className?: string;
+};
+/** Mirrors `<EventDetailPanel>`'s geometry exactly: the hero scrolls away with the body, the footer is sticky. */
+declare function EventDetailPanelSkeleton({ size, headerActions, className, }: EventDetailPanelSkeletonProps): react_jsx_runtime.JSX.Element;
+
+export { EventDetailPanel, type EventDetailPanelLabels, type EventDetailPanelLinkProps, type EventDetailPanelProps, EventDetailPanelSkeleton, type EventDetailPanelSkeletonProps, type EventDetailVenue };

package/dist/components/event-detail-panel.js

@@ -0,0 +1,251 @@
+import { Separator } from '../chunk-WSRWFA6K.js';
+import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
+import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
+import { Skeleton } from '../chunk-QXHMPJ35.js';
+import { cn } from '../chunk-FEK5XGZW.js';
+import { __objRest, __spreadValues } from '../chunk-3GWWZKX7.js';
+import { Star, ChevronRight, Calendar, Radio } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function DefaultLink(_a) {
+  var _b = _a, { href } = _b, props = __objRest(_b, ["href"]);
+  return /* @__PURE__ */ jsx("a", __spreadValues({ href }, props));
+}
+var CHIP = "inline-flex items-center gap-1 rounded-full border border-border px-2.5 text-xs";
+function EventDetailPanel({
+  event,
+  labels,
+  formatters,
+  dateLine,
+  venue,
+  tags,
+  isLive,
+  headerActions,
+  footer,
+  externalLink,
+  size = "default",
+  linkComponent: LinkComponent = DefaultLink,
+  className,
+  fallback = /* @__PURE__ */ jsx(EventPosterFallback, {})
+}) {
+  const compact = size === "compact";
+  const fee = resolveEventEntryFee(event);
+  const venueCard = venue && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 rounded-[13px] border border-border p-2.5", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "shrink-0 overflow-hidden rounded-[10px] bg-muted",
+          compact ? "h-12 w-12" : "h-[52px] w-[52px]"
+        ),
+        children: venue.thumbnailUrl && // eslint-disable-next-line @next/next/no-img-element
+        /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: venue.thumbnailUrl,
+            alt: "",
+            className: "h-full w-full object-cover",
+            loading: "lazy",
+            decoding: "async"
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ jsx("div", { className: cn("font-bold", compact ? "text-[13.5px]" : "text-sm"), children: venue.name }),
+      venue.meta && /* @__PURE__ */ jsx("div", { className: cn("text-muted-foreground", compact ? "text-[11.5px]" : "text-xs"), children: venue.meta }),
+      venue.ratingLabel && /* @__PURE__ */ jsxs("div", { className: "mt-0.5 flex items-center gap-1 text-xs font-bold", children: [
+        /* @__PURE__ */ jsx(Star, { className: "h-3 w-3", "aria-hidden": true }),
+        venue.ratingLabel
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 shrink-0 text-muted-foreground", "aria-hidden": true })
+  ] });
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-full flex-col overflow-hidden bg-card", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto", children: [
+      /* @__PURE__ */ jsxs("div", { className: "relative aspect-[4/5] shrink-0 overflow-hidden bg-muted", children: [
+        event.poster_url ? (
+          // eslint-disable-next-line @next/next/no-img-element
+          /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: event.poster_url,
+              alt: event.title,
+              className: "h-full w-full object-cover",
+              loading: "eager",
+              decoding: "async"
+            }
+          )
+        ) : fallback,
+        headerActions
+      ] }),
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "flex flex-col gap-3.5",
+            compact ? "px-4 pt-4" : "px-[22px] pt-5"
+          ),
+          children: [
+            /* @__PURE__ */ jsx(
+              "h2",
+              {
+                className: cn(
+                  "font-extrabold leading-[1.25] tracking-[-0.02em]",
+                  compact ? "text-xl" : "text-[21px]"
+                ),
+                children: event.title
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: cn(
+                  "flex items-center gap-1.5 text-muted-foreground",
+                  compact ? "text-[12.5px]" : "text-[13px]"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(Calendar, { className: compact ? "h-3.5 w-3.5" : "h-4 w-4", "aria-hidden": true }),
+                  dateLine
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-1.5", children: [
+              isLive && /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  className: cn(
+                    CHIP,
+                    "h-7 border-success/30 bg-success/10 font-semibold text-success"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx(Radio, { className: "h-3 w-3", "aria-hidden": true }),
+                    labels.liveNow
+                  ]
+                }
+              ),
+              tags == null ? void 0 : tags.map((tag) => /* @__PURE__ */ jsx("span", { className: cn(CHIP, "h-7"), children: tag }, tag)),
+              fee.kind === "free" && /* @__PURE__ */ jsx("span", { className: cn(CHIP, "h-7 border-success/40 font-semibold text-success"), children: labels.free }),
+              fee.kind === "paid" && /* @__PURE__ */ jsx("span", { className: cn(CHIP, "h-7"), children: formatters.price(fee.amountRon) })
+            ] }),
+            venue && /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("div", { className: "pb-2 text-[13px] font-extrabold", children: labels.venueHeading }),
+              venue.href ? /* @__PURE__ */ jsx(LinkComponent, { href: venue.href, className: "block", children: venueCard }) : venueCard
+            ] }),
+            event.description && /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("div", { className: "pb-1.5 text-[13px] font-extrabold", children: labels.aboutHeading }),
+              /* @__PURE__ */ jsx(
+                "p",
+                {
+                  className: cn(
+                    "leading-[1.6] text-muted-foreground",
+                    compact ? "text-[13px]" : "text-[13.5px]"
+                  ),
+                  children: event.description
+                }
+              )
+            ] }),
+            externalLink,
+            /* @__PURE__ */ jsx("div", { className: "h-2", "aria-hidden": true })
+          ]
+        }
+      )
+    ] }),
+    footer && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "sticky bottom-0 flex shrink-0 gap-2.5 bg-card",
+          compact ? "px-4 pt-3 pb-[max(1.375rem,env(safe-area-inset-bottom))]" : "px-[22px] pt-4 pb-[max(1.25rem,env(safe-area-inset-bottom))]"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(Separator, { className: "absolute inset-x-0 top-0" }),
+          footer
+        ]
+      }
+    )
+  ] });
+}
+function EventDetailPanelSkeleton({
+  size = "default",
+  headerActions,
+  className
+}) {
+  const compact = size === "compact";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-hidden": "true",
+      className: cn("flex h-full flex-col overflow-hidden bg-card", className),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto", children: [
+          /* @__PURE__ */ jsx("div", { className: "relative aspect-[4/5] shrink-0 overflow-hidden bg-muted", children: headerActions }),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "flex flex-col gap-3.5",
+                compact ? "px-4 pt-4" : "px-[22px] pt-5"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(Skeleton, { className: cn("w-3/4", compact ? "h-5" : "h-[21px]") }),
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+                  /* @__PURE__ */ jsx(Skeleton, { className: cn("shrink-0 rounded-full", compact ? "h-3.5 w-3.5" : "h-4 w-4") }),
+                  /* @__PURE__ */ jsx(Skeleton, { className: cn("w-48", compact ? "h-[12.5px]" : "h-[13px]") })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-1.5", children: [
+                  /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-20 rounded-full" }),
+                  /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-16 rounded-full" })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { children: [
+                  /* @__PURE__ */ jsx(Skeleton, { className: "mb-2 h-[13px] w-28" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 rounded-[13px] border border-border p-2.5", children: [
+                    /* @__PURE__ */ jsx(
+                      Skeleton,
+                      {
+                        className: cn(
+                          "shrink-0 rounded-[10px]",
+                          compact ? "h-12 w-12" : "h-[52px] w-[52px]"
+                        )
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+                      /* @__PURE__ */ jsx(Skeleton, { className: cn("w-1/2", compact ? "h-[13.5px]" : "h-3.5") }),
+                      /* @__PURE__ */ jsx(Skeleton, { className: cn("mt-1 w-3/4", compact ? "h-[11.5px]" : "h-3") })
+                    ] }),
+                    /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-4 shrink-0 rounded-full" })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { children: [
+                  /* @__PURE__ */ jsx(Skeleton, { className: "mb-1.5 h-[13px] w-32" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+                    /* @__PURE__ */ jsx(Skeleton, { className: cn("w-full", compact ? "h-[13px]" : "h-[13.5px]") }),
+                    /* @__PURE__ */ jsx(Skeleton, { className: cn("w-full", compact ? "h-[13px]" : "h-[13.5px]") }),
+                    /* @__PURE__ */ jsx(Skeleton, { className: cn("w-2/3", compact ? "h-[13px]" : "h-[13.5px]") })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx("div", { className: "h-2", "aria-hidden": true })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "sticky bottom-0 flex shrink-0 gap-2.5 bg-card",
+              compact ? "px-4 pt-3 pb-[max(1.375rem,env(safe-area-inset-bottom))]" : "px-[22px] pt-4 pb-[max(1.25rem,env(safe-area-inset-bottom))]"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(Separator, { className: "absolute inset-x-0 top-0" }),
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-[46px] flex-1 rounded-xl" }),
+              /* @__PURE__ */ jsx(Skeleton, { className: "h-[46px] w-24 rounded-xl" })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { EventDetailPanel, EventDetailPanelSkeleton };

package/dist/components/event-hub-hero.d.ts

@@ -0,0 +1,34 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+/**
+ * EventHubHero — the hub's opening block: an eyebrow, a big headline, an
+ * intro line and a stats row on the left; an arbitrary slot (the poster
+ * stack, in the source design) on the right. Stacks on mobile.
+ *
+ * All copy and stat values arrive pre-formatted — the DS holds no `Intl`
+ * locale and does not format numbers.
+ */
+type EventHubHeroStat = {
+    value: string;
+    label: string;
+};
+type EventHubHeroProps = {
+    /** Small caps-style label above the title, e.g. "Updated today". */
+    eyebrow: string;
+    title: string;
+    intro: string;
+    stats: EventHubHeroStat[];
+    /** The right-column slot — the poster stack in the source design. */
+    aside?: React.ReactNode;
+    className?: string;
+};
+declare function EventHubHero({ eyebrow, title, intro, stats, aside, className }: EventHubHeroProps): react_jsx_runtime.JSX.Element;
+type EventHubHeroSkeletonProps = {
+    /** The right-column slot, e.g. a `PosterStack`-shaped placeholder. Mirrors `aside` on the real component. */
+    aside?: React.ReactNode;
+    className?: string;
+};
+declare function EventHubHeroSkeleton({ aside, className }: EventHubHeroSkeletonProps): react_jsx_runtime.JSX.Element;
+
+export { EventHubHero, type EventHubHeroProps, EventHubHeroSkeleton, type EventHubHeroSkeletonProps, type EventHubHeroStat };

package/dist/components/event-hub-hero.js

@@ -0,0 +1,57 @@
+import { Skeleton } from '../chunk-QXHMPJ35.js';
+import { cn } from '../chunk-FEK5XGZW.js';
+import '../chunk-3GWWZKX7.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function EventHubHero({ eyebrow, title, intro, stats, aside, className }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "grid grid-cols-1 gap-8 lg:grid-cols-[1fr_620px] lg:items-center lg:gap-10",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-[11.5px] font-extrabold tracking-[0.12em] text-muted-foreground", children: eyebrow }),
+          /* @__PURE__ */ jsx("h1", { className: "text-[31px] font-black leading-[1.05] tracking-[-0.035em] text-foreground md:text-[42px] md:tracking-[-0.04em]", children: title }),
+          /* @__PURE__ */ jsx("p", { className: "max-w-[520px] text-[14px] leading-[1.6] text-muted-foreground md:text-[15px] md:leading-[1.65]", children: intro }),
+          /* @__PURE__ */ jsx("div", { className: "flex gap-[22px] pt-1.5 md:gap-[30px]", children: stats.map((stat) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-[24px] font-black leading-none tracking-[-0.03em] tabular-nums text-foreground md:text-[30px]", children: stat.value }),
+            /* @__PURE__ */ jsx("span", { className: "mt-1 text-[11px] text-muted-foreground md:mt-[5px] md:text-[12.5px]", children: stat.label })
+          ] }, stat.label)) })
+        ] }),
+        aside && /* @__PURE__ */ jsx("div", { className: "min-w-0", children: aside })
+      ]
+    }
+  );
+}
+function EventHubHeroSkeleton({ aside, className }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-hidden": "true",
+      className: cn(
+        "grid grid-cols-1 gap-8 lg:grid-cols-[1fr_620px] lg:items-center lg:gap-10",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+          /* @__PURE__ */ jsx(Skeleton, { className: "h-[11.5px] w-28" }),
+          /* @__PURE__ */ jsx(Skeleton, { className: "h-[31px] w-full max-w-[420px] md:h-[42px]" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex max-w-[520px] flex-col gap-1.5", children: [
+            /* @__PURE__ */ jsx(Skeleton, { className: "h-[14px] w-full md:h-[15px]" }),
+            /* @__PURE__ */ jsx(Skeleton, { className: "h-[14px] w-4/5 md:h-[15px]" })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "flex gap-[22px] pt-1.5 md:gap-[30px]", children: Array.from({ length: 3 }, (_, index) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ jsx(Skeleton, { className: "h-[24px] w-10 md:h-[30px]" }),
+            /* @__PURE__ */ jsx(Skeleton, { className: "mt-1 h-[11px] w-16 md:mt-[5px] md:h-[12.5px]" })
+          ] }, index)) })
+        ] }),
+        aside && /* @__PURE__ */ jsx("div", { className: "min-w-0", children: aside })
+      ]
+    }
+  );
+}
+
+export { EventHubHero, EventHubHeroSkeleton };

package/dist/components/event-index-row.d.ts

@@ -0,0 +1,68 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode, ComponentType } from 'react';
+
+/**
+ * EventIndexRow — the row of an exhaustive, crawlable event index.
+ *
+ * NOT `<EventListRowWide>`: that row belongs to the list VIEW, and it carries
+ * a price column and a Reserve chip because the list view is where you act.
+ * This row makes no claim to be operable — it is a catalogue entry. Its only
+ * affordances are two real links: the title (stretched over the whole row via
+ * `after:absolute after:inset-0`) and the venue (escaping that overlay with
+ * `relative z-10`, the same nested-link pattern `<EventListRowWide>` uses for
+ * `menuHref`). That venue link is why this could not be a variant of
+ * `<EventCompactRow>` or `<EventListRow>`: both wrap their entire body in one
+ * anchor, so a second link inside would be a nested `<a>` — invalid HTML that
+ * browsers unnest, breaking both links.
+ *
+ * NO `"use client"`, AND THAT IS LOAD-BEARING. This row's surface is a
+ * server-only prerendered page carrying ~50 of them, and every sibling row in
+ * this family is a client component for one reason: `useState` to catch
+ * `<img onError>`. Here the fallback is layered BEHIND the poster instead, so
+ * a failed image reveals the designed gradient with no JS at all. The
+ * consequence to accept: an image that returns 200 but decodes to garbage
+ * shows an empty box rather than the fallback.
+ *
+ * THE DESCRIPTION IS NEVER TRUNCATED IN THE MARKUP — it is clamped with CSS
+ * (`line-clamp`), so the full text stays in the DOM. Callers must pass the
+ * whole string. On this surface that is the entire point: the text is the
+ * page's body copy, and a row that cut it at N characters would be deleting
+ * the thing the section exists to carry.
+ *
+ * ROW RULES: this row draws its own top rule, same as `<EventListRow>` and
+ * `<EventListRowWide>`. Pass `hideRule` on the first row under a heading that
+ * already ends in one (`<EventDaySeparator>` does), or you get two rules a few
+ * pixels apart.
+ */
+type EventIndexRowLinkProps = {
+    href: string;
+    className?: string;
+    children: ReactNode;
+};
+type EventIndexRowProps = {
+    /** Rendered inside `as` and allowed to WRAP — a document-outline heading is never truncated. */
+    title: string;
+    /** Heading level for `title`. Defaults to `h3`, one below the group headings. */
+    as?: "h2" | "h3" | "h4";
+    href: string;
+    /** Leading emphasised fact on the meta line — caller-composed date + time, e.g. "26 iulie, 20:00–23:00". */
+    when: string;
+    venue?: string;
+    /** Makes the venue a real second link. Omit for a venue with no place page. */
+    venueHref?: string;
+    /** Plain text, never a chip: "intrare liberă" / "bilet 40 lei". */
+    fee?: string;
+    /** Display labels. `EventPreview.tags` is taxonomy coordinates the DS cannot translate, so the caller resolves and caps them. */
+    tags?: string[];
+    /** FULL text. Clamped to 3 lines (mobile) / 2 (md+) in CSS only. */
+    description?: string;
+    posterUrl?: string;
+    fallback?: ReactNode;
+    /** Suppresses the top rule. Use on the first row under a heading that draws its own. */
+    hideRule?: boolean;
+    linkComponent?: ComponentType<EventIndexRowLinkProps>;
+    className?: string;
+};
+declare function EventIndexRow({ title, as: Heading, href, when, venue, venueHref, fee, tags, description, posterUrl, fallback, hideRule, linkComponent: LinkComponent, className, }: EventIndexRowProps): react_jsx_runtime.JSX.Element;
+
+export { EventIndexRow, type EventIndexRowLinkProps, type EventIndexRowProps };