{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "event-card",
  "title": "Event Card",
  "description": "Event card with CTA that opens a responsive drawer (right on desktop, bottom on mobile).",
  "dependencies": [
    "@radix-ui/react-dialog",
    "@phosphor-icons/react",
    "lucide-react",
    "react-markdown",
    "remark-gfm",
    "rehype-raw",
    "rehype-sanitize"
  ],
  "files": [
    {
      "path": "registry/components/event-card/index.ts",
      "content": "export { EventCard } from \"./index.tsx\"\nexport type { EventCardProps, EventTimelineItem, DrawerDirection } from \"./types\"\n",
      "type": "registry:block"
    },
    {
      "path": "registry/components/event-card/index.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\n\nimport { EventCardDrawer } from \"./event-card-drawer\"\nimport { EventCardPreview } from \"./event-card-preview\"\nimport type { DrawerDirection, EventCardProps } from \"./types\"\n\nfunction useResolvedDirection(direction: DrawerDirection) {\n  const [isDesktop, setIsDesktop] = React.useState(false)\n\n  React.useEffect(() => {\n    const mediaQuery = window.matchMedia(\"(min-width: 768px)\")\n    const sync = () => setIsDesktop(mediaQuery.matches)\n    sync()\n    mediaQuery.addEventListener(\"change\", sync)\n    return () => mediaQuery.removeEventListener(\"change\", sync)\n  }, [])\n\n  return direction === \"auto\" ? (isDesktop ? \"right\" : \"bottom\") : direction\n}\n\nexport function EventCard({\n  title,\n  miniDescription,\n  ctaText,\n  cardCtaText,\n  drawerCtaText,\n  hideCardCta = false,\n  hideDrawerCta = false,\n  isActive,\n  category,\n  image,\n  date,\n  time,\n  isOnline,\n  eventLocationLink,\n  showLocationTextInMapsTag = true,\n  eventLocationText,\n  eventMode,\n  eventDetailDescription,\n  eventTimeline,\n  onCtaClick,\n  onDrawerOpen,\n  onDrawerCtaClick,\n  drawerDirection = \"auto\",\n  drawerBottomInsetClassName,\n  drawerBodyClassName,\n  drawerPinFooter = true,\n  drawerFooterClassName,\n  className,\n}: EventCardProps) {\n  const [open, setOpen] = React.useState(false)\n  const wasOpenRef = React.useRef(false)\n  const resolvedDirection = useResolvedDirection(drawerDirection)\n  const resolvedCardCtaText = cardCtaText ?? ctaText\n  const resolvedDrawerCtaText = drawerCtaText ?? ctaText\n\n  const handleCtaClick = () => {\n    setOpen(true)\n  }\n  const handleDrawerCtaClick = () => {\n    onDrawerCtaClick?.()\n    onCtaClick?.()\n  }\n\n  React.useEffect(() => {\n    if (open && !wasOpenRef.current) {\n      onDrawerOpen?.()\n    }\n    wasOpenRef.current = open\n  }, [open, onDrawerOpen])\n\n  return (\n    <>\n      <EventCardPreview\n        title={title}\n        miniDescription={miniDescription}\n        ctaText={resolvedCardCtaText}\n        hideCardCta={hideCardCta}\n        isActive={isActive}\n        category={category}\n        image={image}\n        date={date}\n        onCtaClick={handleCtaClick}\n        className={className}\n      />\n      <EventCardDrawer\n        title={title}\n        ctaText={resolvedDrawerCtaText}\n        hideDrawerCta={hideDrawerCta}\n        isActive={isActive}\n        category={category}\n        image={image}\n        date={date}\n        time={time}\n        isOnline={isOnline}\n        eventLocationLink={eventLocationLink}\n        showLocationTextInMapsTag={showLocationTextInMapsTag}\n        eventLocationText={eventLocationText}\n        eventMode={eventMode}\n        eventDetailDescription={eventDetailDescription}\n        eventTimeline={eventTimeline}\n        onCtaClick={handleDrawerCtaClick}\n        open={open}\n        onOpenChange={setOpen}\n        resolvedDirection={resolvedDirection}\n        drawerBottomInsetClassName={drawerBottomInsetClassName}\n        drawerBodyClassName={drawerBodyClassName}\n        drawerPinFooter={drawerPinFooter}\n        drawerFooterClassName={drawerFooterClassName}\n      />\n    </>\n  )\n}\n\nexport type { EventCardProps, EventTimelineItem, DrawerDirection } from \"./types\"\n",
      "type": "registry:block"
    },
    {
      "path": "registry/components/event-card/event-card-preview.tsx",
      "content": "import { cn } from \"@/lib/utils\";\n\nimport type { EventCardProps } from \"./types\";\nimport { CardCtaButton } from \"../shared/card-cta-button\";\nimport { toRichPreviewText } from \"./rich-content\";\n\nfunction toCapitalizedWords(value: string) {\n  return value.replace(/\\b\\w/g, (char) => char.toUpperCase());\n}\n\nfunction getDateParts(value: string) {\n  const parsed = new Date(value);\n  if (!Number.isNaN(parsed.getTime())) {\n    return {\n      day: String(parsed.getDate()).padStart(2, \"0\"),\n      month: parsed.toLocaleString(\"en-US\", { month: \"short\" }).toUpperCase(),\n    };\n  }\n\n  const tokens = value.trim().split(/\\s+/);\n  const monthToken = tokens.find((token) => /[A-Za-z]/.test(token)) ?? \"\";\n  const dayToken =\n    tokens.find((token) => /^\\d{1,2}$/.test(token)) ??\n    (tokens[0]?.replace(/\\D/g, \"\") || \"\");\n\n  return {\n    day: dayToken.padStart(2, \"0\").slice(-2) || \"--\",\n    month: monthToken.slice(0, 3).toUpperCase() || \"---\",\n  };\n}\n\ntype EventCardPreviewProps = Pick<\n  EventCardProps,\n  | \"title\"\n  | \"miniDescription\"\n  | \"ctaText\"\n  | \"hideCardCta\"\n  | \"isActive\"\n  | \"category\"\n  | \"image\"\n  | \"date\"\n  | \"className\"\n> & {\n  onCtaClick: () => void;\n};\n\nexport function EventCardPreview({\n  title,\n  miniDescription,\n  ctaText,\n  hideCardCta,\n  isActive,\n  category,\n  image,\n  date,\n  onCtaClick,\n  className,\n}: EventCardPreviewProps) {\n  const resolvedTitle = toCapitalizedWords(title);\n  const resolvedMiniDescription = toRichPreviewText(miniDescription);\n  const resolvedCategory = toCapitalizedWords(category);\n  const resolvedCtaText = toCapitalizedWords(ctaText);\n  const { day, month } = getDateParts(date);\n\n  return (\n    <div\n      className={cn(\n        \"font-poppins flex h-full w-full min-w-0 max-w-[300px] flex-col overflow-hidden rounded-[12px] border border-[#E5E7EB] bg-white\",\n        className,\n      )}\n    >\n      <div className=\"relative\">\n        <img\n          src={image}\n          alt={resolvedTitle}\n          className=\"h-[84px] w-full rounded-t-[12px] object-cover\"\n        />\n        <div className=\"absolute right-2 top-2 flex min-w-[38px] flex-col items-center rounded-[6px] border border-[#E5E7EB] bg-white px-2 py-1 text-[#111928] shadow-[0_1px_2px_rgba(17,24,39,0.08)]\">\n          <span className=\"text-[18px] font-[600] leading-[24px]\">{day}</span>\n          <span className=\"text-[12px] font-[500] leading-[16px]\">{month}</span>\n        </div>\n      </div>\n\n      <div className=\"flex min-w-0 flex-1 flex-col p-4\">\n        <div className=\"mb-3 flex min-w-0 flex-wrap items-center gap-2\">\n          <span className=\"max-w-full break-words rounded-[32px] border border-[#E5E7EB] bg-[#E5E7EB] px-2 py-[2px] text-[12px] font-[500] leading-[16px] text-[#374151]\">\n            {resolvedCategory}\n          </span>\n          <span\n            className={`max-w-full break-words rounded-[32px] px-2 py-[2px] text-[12px] font-[500] leading-[16px] ${\n              isActive\n                ? \"bg-[#00B178] text-[#fff]\"\n                : \"bg-[#F3F4F6] text-[#6B7280]\"\n            }`}\n          >\n            {isActive ? \"Active\" : \"Inactive\"}\n          </span>\n        </div>\n        <h3 className=\"min-w-0 break-words text-[14px] font-[600] leading-[20px] text-[#111928]\">\n          {resolvedTitle}\n        </h3>\n        <p className=\"mt-[8px] min-w-0 break-words whitespace-pre-line text-[12px] font-[400] leading-[16px] text-[#4B5563]\">\n          {resolvedMiniDescription}\n        </p>\n\n        {!hideCardCta ? (\n          <div className=\"mt-auto flex justify-end pt-4\">\n            <CardCtaButton text={resolvedCtaText} onClick={onCtaClick} />\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n}\n",
      "type": "registry:block"
    },
    {
      "path": "registry/components/event-card/event-card-drawer.tsx",
      "content": "\"use client\";\n\nimport * as Dialog from \"@radix-ui/react-dialog\";\nimport {\n  CalendarDots,\n  ClockAfternoon,\n  GlobeHemisphereWest,\n  MapPin,\n  X,\n} from \"@phosphor-icons/react\";\n\nimport { CardCtaButton } from \"../shared/card-cta-button\";\nimport type { DrawerDirection, EventCardProps } from \"./types\";\nimport type { ReactNode } from \"react\";\nimport { RichContent } from \"./rich-content\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype EventMetaTagProps = {\n  icon: ReactNode;\n  value: string;\n  href?: string;\n  className?: string;\n};\n\nfunction toCapitalizedWords(value: string) {\n  return value.replace(/\\b\\w/g, (char) => char.toUpperCase());\n}\n\nfunction EventMetaTag({\n  icon,\n  value,\n  href,\n  className = \"\",\n}: EventMetaTagProps) {\n  const resolvedValue = toCapitalizedWords(value);\n  const sharedClassName = `flex min-w-0 flex-1 items-center gap-2 rounded-[8px] border border-[#E5E7EB] bg-[#FFF4ED] px-2 py-2 text-[12px] text-[#374151] ${className}`;\n\n  if (href) {\n    return (\n      <a\n        href={href}\n        target=\"_blank\"\n        rel=\"noreferrer noopener\"\n        className={`${sharedClassName} hover:opacity-90`}\n      >\n        {icon}\n        <span className=\"min-w-0 flex-1 break-words text-[#374151] underline underline-offset-2\">\n          {resolvedValue}\n        </span>\n      </a>\n    );\n  }\n\n  return (\n    <div className={sharedClassName}>\n      {icon}\n      <span className=\"min-w-0 flex-1 break-words\">{resolvedValue}</span>\n    </div>\n  );\n}\n\ntype EventCardDrawerProps = Pick<\n  EventCardProps,\n  | \"title\"\n  | \"ctaText\"\n  | \"hideDrawerCta\"\n  | \"isActive\"\n  | \"category\"\n  | \"image\"\n  | \"date\"\n  | \"time\"\n  | \"isOnline\"\n  | \"eventLocationLink\"\n  | \"showLocationTextInMapsTag\"\n  | \"eventLocationText\"\n  | \"eventMode\"\n  | \"eventDetailDescription\"\n  | \"eventTimeline\"\n  | \"onCtaClick\"\n  | \"drawerBottomInsetClassName\"\n  | \"drawerBodyClassName\"\n  | \"drawerPinFooter\"\n  | \"drawerFooterClassName\"\n> & {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  resolvedDirection: Exclude<DrawerDirection, \"auto\">;\n};\n\nexport function EventCardDrawer({\n  title,\n  ctaText,\n  hideDrawerCta,\n  isActive,\n  category,\n  image,\n  date,\n  time,\n  isOnline,\n  eventLocationLink,\n  showLocationTextInMapsTag,\n  eventLocationText,\n  eventMode,\n  eventDetailDescription,\n  eventTimeline,\n  onCtaClick,\n  drawerBottomInsetClassName,\n  drawerBodyClassName,\n  drawerPinFooter = true,\n  drawerFooterClassName,\n  open,\n  onOpenChange,\n  resolvedDirection,\n}: EventCardDrawerProps) {\n  const resolvedTitle = toCapitalizedWords(title);\n  const resolvedCategory = toCapitalizedWords(category);\n  const resolvedCtaText = toCapitalizedWords(ctaText);\n  const mapTagValue =\n    showLocationTextInMapsTag && eventLocationText?.trim()\n      ? `${eventLocationText.trim()} - View On Maps`\n      : \"View On Maps\";\n\n  const footerCta =\n    !hideDrawerCta ? (\n      <div\n        className={cn(\n          \"border-t bg-white p-4\",\n          drawerPinFooter && \"shrink-0\",\n          drawerPinFooter &&\n            resolvedDirection === \"bottom\" &&\n            \"shadow-[0_-4px_16px_rgba(0,0,0,0.06)]\",\n          !drawerPinFooter && \"mt-6\",\n          drawerFooterClassName,\n        )}\n      >\n        <CardCtaButton\n          text={resolvedCtaText}\n          onClick={onCtaClick}\n          fullWidth\n        />\n      </div>\n    ) : null;\n\n  return (\n    <Dialog.Root open={open} onOpenChange={onOpenChange}>\n      <Dialog.Portal>\n        <Dialog.Overlay className=\"fixed inset-0 z-50 bg-black/50 transition-opacity duration-300 ease-out data-[state=closed]:opacity-0 data-[state=open]:opacity-100\" />\n        <Dialog.Content\n          className={cn(\n            \"fixed z-50 border bg-white font-poppins shadow-xl outline-none\",\n            resolvedDirection === \"right\"\n              ? \"right-0 top-0 flex h-svh w-full max-w-[420px] flex-col border-l transition-transform duration-300 ease-out will-change-transform data-[state=closed]:translate-x-full data-[state=open]:translate-x-0\"\n              : \"bottom-0 left-0 flex w-full max-h-[88svh] flex-col rounded-t-2xl border-t transition-transform duration-300 ease-out will-change-transform data-[state=closed]:translate-y-full data-[state=open]:translate-y-0\",\n            drawerBottomInsetClassName,\n          )}\n        >\n          <div className=\"flex items-start justify-between border-b p-4\">\n            <Dialog.Title className=\"text-lg font-semibold text-slate-900\">\n              Event Details\n            </Dialog.Title>\n            <Dialog.Close className=\"inline-flex size-8 items-center justify-center rounded-md border text-slate-500 hover:bg-slate-50 hover:text-slate-800\">\n              <X size={16} />\n              <span className=\"sr-only\">Close</span>\n            </Dialog.Close>\n          </div>\n\n          <div\n            className={cn(\n              \"min-h-0 min-w-0 flex-1 overflow-y-auto overflow-x-hidden p-4\",\n              drawerBodyClassName,\n            )}\n          >\n            <img\n              src={image}\n              alt={resolvedTitle}\n              className=\"block max-h-[350px] w-full max-w-full rounded-[10px] border border-[#E5E7EB] object-fill\"\n            />\n\n            <div className=\"mt-3 flex min-w-0 flex-wrap items-center gap-2\">\n              <span className=\"max-w-full break-words rounded-[32px] border border-[#E5E7EB] px-2 py-1 text-[12px] font-[500] leading-[16px] text-[#374151]\">\n                {resolvedCategory}\n              </span>\n              <span\n                className={`max-w-full break-words rounded-[32px] px-2 py-1 text-[12px] font-[500] leading-[16px] ${\n                  isActive\n                    ? \"bg-[#ECFDF3] text-[#027A48]\"\n                    : \"bg-[#F3F4F6] text-[#6B7280]\"\n                }`}\n              >\n                {isActive ? \"Active\" : \"Inactive\"}\n              </span>\n            </div>\n\n            <h3 className=\"mt-4 min-w-0 break-words text-[20px] font-[600] leading-[30px] text-[#111928]\">\n              {resolvedTitle}\n            </h3>\n\n            {isOnline ? (\n              <div className=\"mt-4 flex min-w-0 items-stretch justify-between gap-2\">\n                <EventMetaTag\n                  icon={<CalendarDots size={14} color=\"#EF8833\" />}\n                  value={date}\n                />\n                <EventMetaTag\n                  icon={<ClockAfternoon size={14} color=\"#EF8833\" />}\n                  value={time}\n                />\n                <EventMetaTag\n                  icon={<GlobeHemisphereWest size={14} color=\"#EF8833\" />}\n                  value={eventMode}\n                />\n              </div>\n            ) : (\n              <div className=\"mt-4 min-w-0 space-y-2\">\n                <div className=\"flex min-w-0 items-stretch justify-between gap-2\">\n                  <EventMetaTag\n                    icon={<CalendarDots size={14} color=\"#EF8833\" />}\n                    value={date}\n                  />\n                  <EventMetaTag\n                    icon={<ClockAfternoon size={14} color=\"#EF8833\" />}\n                    value={time}\n                  />\n                </div>\n                <EventMetaTag\n                  icon={<MapPin size={14} color=\"#EF8833\" />}\n                  value={mapTagValue}\n                  href={eventLocationLink}\n                  className=\"w-full flex-none\"\n                />\n              </div>\n            )}\n\n            <RichContent\n              value={eventDetailDescription}\n              className=\"mt-4 text-[14px] leading-[22px] text-[#374151] [&_a]:underline [&_ol]:list-decimal [&_ol]:pl-5 [&_p]:mb-3 [&_p:last-child]:mb-0 [&_ul]:list-disc [&_ul]:pl-5\"\n            />\n\n            {eventTimeline.length > 0 ? (\n              <div className=\"mt-6\">\n                <h4 className=\"text-[14px] font-[600] leading-[20px] text-[#111928]\">\n                  Event timeline\n                </h4>\n                <div className=\"mt-3 space-y-4\">\n                  {eventTimeline.map((item, index) => (\n                    <div key={`${item.time}-${index}`} className=\"relative pl-6\">\n                      {index < eventTimeline.length - 1 ? (\n                        <span className=\"absolute left-[7px] top-4 h-[calc(100%+12px)] w-px bg-[#D1D5DB]\" />\n                      ) : null}\n                      <span className=\"absolute left-1 top-1.5 size-[8px] rounded-full bg-[#EF8833]\" />\n                      <p className=\"min-w-0 break-words text-[12px] font-[600] leading-[16px] text-[#111928]\">\n                        {toCapitalizedWords(item.time)}\n                      </p>\n                      <p className=\"mt-1 min-w-0 break-words text-[14px] leading-[20px] text-[#374151]\">\n                        {toCapitalizedWords(item.text)}\n                      </p>\n                    </div>\n                  ))}\n                </div>\n              </div>\n            ) : null}\n\n            {!drawerPinFooter ? footerCta : null}\n          </div>\n\n          {drawerPinFooter ? footerCta : null}\n        </Dialog.Content>\n      </Dialog.Portal>\n    </Dialog.Root>\n  );\n}\n",
      "type": "registry:block"
    },
    {
      "path": "registry/components/event-card/rich-content.tsx",
      "content": "\"use client\"\n\nimport { cn } from \"@/lib/utils\"\nimport ReactMarkdown from \"react-markdown\"\nimport rehypeRaw from \"rehype-raw\"\nimport rehypeSanitize, { defaultSchema } from \"rehype-sanitize\"\nimport remarkGfm from \"remark-gfm\"\nimport type { Options as SanitizeOptions } from \"rehype-sanitize\"\nimport type { Components } from \"react-markdown\"\n\ntype RichContentProps = {\n  value: string\n  className?: string\n}\n\nconst markdownComponents: Components = {\n  h1: ({ node, ...props }) => (\n    <h1 className=\"mt-6 mb-3 text-[28px] leading-[34px] font-semibold text-[#111928]\" {...props} />\n  ),\n  h2: ({ node, ...props }) => (\n    <h2 className=\"mt-6 mb-3 text-[24px] leading-[30px] font-semibold text-[#111928]\" {...props} />\n  ),\n  h3: ({ node, ...props }) => (\n    <h3 className=\"mt-5 mb-2 text-[38px] leading-[46px] font-semibold text-[#111928]\" {...props} />\n  ),\n  h4: ({ node, ...props }) => (\n    <h4 className=\"mt-4 mb-2 text-[18px] leading-[24px] font-semibold text-[#111928]\" {...props} />\n  ),\n  h5: ({ node, ...props }) => (\n    <h5 className=\"mt-4 mb-2 text-[16px] leading-[22px] font-semibold text-[#111928]\" {...props} />\n  ),\n  h6: ({ node, ...props }) => (\n    <h6 className=\"mt-3 mb-2 text-[14px] leading-[20px] font-semibold text-[#111928]\" {...props} />\n  ),\n  hr: ({ node, ...props }) => <hr className=\"my-4 border-0 border-t border-[#D1D5DB]\" {...props} />,\n}\n\nconst sanitizeSchema: SanitizeOptions = {\n  ...defaultSchema,\n  tagNames: [...(defaultSchema.tagNames ?? []), \"video\"],\n  attributes: {\n    ...(defaultSchema.attributes ?? {}),\n    video: [\n      \"src\",\n      \"controls\",\n      \"poster\",\n      \"preload\",\n      \"playsInline\",\n      \"muted\",\n      \"loop\",\n      \"width\",\n      \"height\",\n    ],\n    source: [...(defaultSchema.attributes?.source ?? []), \"src\", \"type\"],\n  },\n}\n\nconst HTML_ENTITY_MAP: Record<string, string> = {\n  \"&nbsp;\": \" \",\n  \"&amp;\": \"&\",\n  \"&lt;\": \"<\",\n  \"&gt;\": \">\",\n  \"&quot;\": '\"',\n  \"&#39;\": \"'\",\n}\n\nfunction decodeHtmlEntities(value: string) {\n  return Object.entries(HTML_ENTITY_MAP).reduce(\n    (result, [entity, replacement]) => result.split(entity).join(replacement),\n    value,\n  )\n}\n\nfunction decodeMarkdownPayload(content: string): string {\n  if (!content) return \"\"\n\n  const normalizedContent = content\n    .replace(/\\\\r\\\\n/g, \"\\n\")\n    .replace(/\\\\n/g, \"\\n\")\n    .replace(/\\\\t/g, \"\\t\")\n\n  if (normalizedContent.includes(\"&lt;\") || normalizedContent.includes(\"&gt;\")) {\n    const parser = new DOMParser()\n    const decoded = parser\n      .parseFromString(normalizedContent, \"text/html\")\n      .documentElement.textContent\n    return decoded ?? normalizedContent\n  }\n\n  return normalizedContent\n}\n\nexport function toRichPreviewText(value: string) {\n  const decoded = decodeHtmlEntities(decodeMarkdownPayload(value || \"\"))\n\n  return decoded\n    .replace(/<br\\s*\\/?>/gi, \"\\n\")\n    .replace(/<\\/(p|div|li|h[1-6]|blockquote)>/gi, \"\\n\")\n    .replace(/<[^>]+>/g, \" \")\n    .replace(/!\\[.*?\\]\\((.*?)\\)/g, \"$1\")\n    .replace(/\\[(.*?)\\]\\((.*?)\\)/g, \"$1\")\n    .replace(/[#>*_`~-]/g, \"\")\n    .replace(/[^\\S\\n]+/g, \" \")\n    .replace(/\\n{3,}/g, \"\\n\\n\")\n    .trim()\n}\n\nexport function RichContent({ value, className }: RichContentProps) {\n  if (!value.trim()) return null\n\n  return (\n    <div\n      className={cn(\n        \"min-w-0 max-w-full break-words [&_a]:break-all [&_code]:break-all [&_li]:min-w-0 [&_li]:whitespace-pre-wrap [&_ol]:min-w-0 [&_p]:min-w-0 [&_p]:whitespace-pre-wrap [&_ul]:min-w-0\",\n        className,\n      )}\n    >\n      <ReactMarkdown\n        remarkPlugins={[remarkGfm]}\n        rehypePlugins={[rehypeRaw, [rehypeSanitize, sanitizeSchema]]}\n        components={markdownComponents}\n      >\n        {decodeMarkdownPayload(value)}\n      </ReactMarkdown>\n    </div>\n  )\n}\n",
      "type": "registry:block"
    },
    {
      "path": "registry/components/event-card/types.ts",
      "content": "export type DrawerDirection = \"right\" | \"bottom\" | \"auto\"\n\nexport type EventTimelineItem = {\n  time: string\n  text: string\n}\n\nexport type EventCardProps = {\n  title: string\n  miniDescription: string\n  ctaText: string\n  cardCtaText?: string\n  drawerCtaText?: string\n  hideCardCta?: boolean\n  hideDrawerCta?: boolean\n  isActive: boolean\n  category: string\n  image: string\n  date: string\n  time: string\n  isOnline: boolean\n  eventLocationLink?: string\n  showLocationTextInMapsTag?: boolean\n  eventLocationText?: string\n  eventMode: string\n  eventDetailDescription: string\n  eventTimeline: EventTimelineItem[]\n  onCtaClick?: () => void\n  onDrawerOpen?: () => void\n  onDrawerCtaClick?: () => void\n  drawerDirection?: DrawerDirection\n  /**\n   * Merged onto `Dialog.Content` — use on bottom sheets to clear a fixed bottom tab bar, e.g.\n   * `pb-[calc(4.5rem+env(safe-area-inset-bottom))]`.\n   */\n  drawerBottomInsetClassName?: string\n  /** Extra classes on the scrollable body (e.g. `pb-4` so the last line clears the pinned footer). */\n  drawerBodyClassName?: string\n  /**\n   * When `true` (default), the drawer CTA sits in a fixed footer below the scroll area.\n   * When `false`, the CTA scrolls with the rest of the content.\n   */\n  drawerPinFooter?: boolean\n  /** Merged onto the footer row when `drawerPinFooter` is true (e.g. shadow, safe-area padding). */\n  drawerFooterClassName?: string\n  /** Merged onto the visible card root; override e.g. max-w, h-full, min-h. */\n  className?: string\n}\n",
      "type": "registry:block"
    },
    {
      "path": "registry/components/shared/card-cta-button.tsx",
      "content": "type CardCtaButtonProps = {\n  text: string;\n  onClick?: () => void;\n  theme?: \"yellow\" | \"red\" | \"purple\";\n  fullWidth?: boolean;\n  className?: string;\n};\n\nconst THEME_CLASSES = {\n  yellow: \"bg-[#EF8833] text-[#fff] hover:bg-[#DC7A2D]\",\n  red: \"bg-[#EF4444] text-white hover:bg-[#DC2626]\",\n  purple: \"bg-[#6962AC] text-white hover:bg-[#5B5596]\",\n} as const;\n\nexport function CardCtaButton({\n  text,\n  onClick,\n  theme = \"yellow\",\n  fullWidth = false,\n  className = \"\",\n}: CardCtaButtonProps) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      className={`inline-flex min-w-0 max-w-full cursor-pointer items-center justify-center rounded-[8px] px-[16px] py-[8px] text-[14px] font-[500] leading-[20px] font-poppins transition-colors ${fullWidth ? \"w-full\" : \"\"} ${THEME_CLASSES[theme]} ${className}`.trim()}\n    >\n      <span className=\"min-w-0 max-w-full whitespace-normal break-words text-center\">{text}</span>\n    </button>\n  );\n}\n",
      "type": "registry:block"
    }
  ],
  "type": "registry:block"
}