insights-chrome

Shared chrome for the Insights by Omkar ecosystem — the header and footer that every subdomain (apex, astrology.*, studio.*) installs so the whole product reads as one. This package is chrome only: not the background / sky, not the page design. Each site keeps those. One source of truth for the frame; update once, everywhere.

It's app-agnostic — nav config, brand copy, and app-specific bits (cookie consent, auth, search) come in as props / slots. The package owns layout + styling; the app owns content.

Install

npm i insights-chrome

Peer deps: next (>=14), react / react-dom (>=18). Add the package to transpilePackages so Next runs its CSS-module + "use client" loaders over the shipped source:

// next.config.ts
const nextConfig = { transpilePackages: ["insights-chrome"] };

Footer

import { SiteFooter, type FooterColumn } from "insights-chrome/footer";

const columns: FooterColumn[] = [
  { label: "Product", links: [{ href: "/", label: "Readings" }, /* … */] },
  // Company · Resources · Legal …
];

<SiteFooter
  brand={{
    href: "/",
    logoSrc: "/logo.png",
    logoWidth: 710,
    logoHeight: 342,
    name: "Insights by Omkar",
    tagline: "A practitioner-led astrology & tarot studio.",
    links: [{ href: "/about/omkar", label: "About Omkar →" }],
  }}
  columns={columns}
  copyright="© 2026 Omkar’s Holistic Services LLC"
  bottomSlot={<ManageCookiesLink />}
/>;

bottomSlot is any app-specific baseline node (e.g. a "Manage cookies" button). Omit brand.links to drop the brand link list.

Build & publish

Plain tsc → dist/ (ESM) plus a copied CSS module, mirroring urja-client.

npm run build   # tsc + copy *.module.css → dist/

Publishing to npm is only needed so the other repos can install it — apex consumes it locally via a file: link. Publish via the publish-insights-chrome GitHub Action (npm Trusted Publishing / OIDC; push a insights-chrome-v* tag or run it manually). The first version must be bootstrapped with a one-time manual npm publish before Trusted Publisher can be configured.