Misar.AI
Repositories Projects Packages
56
 Starred repositories

@misar/announcement-bar (1.0.0)

Published 2026-10-22 13:01:43 +00:00 by misaradmin

Installation

@misar:registry=
npm install @misar/announcement-bar@1.0.0
"@misar/announcement-bar": "1.0.0"

About this package

@misar/announcement-bar

The strip above the header on every Misar and Assisters marketing site. Each site's icon, title and CTA are edited at cms.misar.io/announcements and served by GET https://api.misar.io/io/announcement?site=<key>. With no CMS entry (or no answer) a site shows its 7-day free trial default, linking to its pricing page.

Site keys: misar-io, dev, ai, blog, mail, reach, post, seo, assisters.

Next.js (server layout)

import { fetchAnnouncement } from "@misar/announcement-bar";
import { AnnouncementBar } from "@misar/announcement-bar/react";
import "@misar/announcement-bar/styles.css";

export default async function MarketingLayout({ children }: { children: React.ReactNode }) {
  const announcement = await fetchAnnouncement("mail"); // never throws; null = hidden
  return (
    <>
      {announcement && <AnnouncementBar announcement={announcement} />}
      <SiteHeader />
      {children}
    </>
  );
}

TanStack Start

// route loader (server)
loader: async () => ({ announcement: await fetchAnnouncement("seo") }),
// component
const { announcement } = Route.useLoaderData();
return announcement ? <AnnouncementBar announcement={announcement} /> : null;

Import @misar/announcement-bar/styles.css once (root layout or root route).

Rules

  • Render it on marketing pages only: never on docs, dashboards, chat or editors.
  • Put it above the site header, in normal flow. A sticky top-0 header still pins correctly once the strip scrolls away.
  • Always render it on shared-cached pages; the component hides a dismissed strip on the client. Use isDismissed(cookie, id) on the server only for responses private to the visitor.
  • The fetch runs server-side, so no CSP change is needed.

Dependencies

Development dependencies

ID Version
@types/react ^19.3.0
react 19.3.1
react-dom 19.3.1
tsup ^8.5.1
typescript ^5.9.3

Peer dependencies

ID Version
react ^18.2.0 || ^19.0.0
Details
npm
2026-10-22 13:01:43 +00:00
156
7.9 KiB
Assets (1)
announcement-bar-1.0.0.tgz 7.9 KiB
Versions (3) View all
1.2.1 2026-10-30
1.1.0 2026-10-27
1.0.0 2026-10-22