@m13v/seo-components 0.14.0 → 0.15.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m13v/seo-components",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "scripts": {
     "build:css": "tailwind -i src/_build.css -o dist/styles.css --minify",
     "bump:consumers": "bash scripts/bump-consumers.sh",

package/src/components/SeoComponentsStyles.tsx

@@ -8,7 +8,8 @@ const cssPath = path.join(here, "..", "..", "dist", "styles.css");
 let cachedCss: string | null = null;
 function loadCss(): string {
   if (cachedCss !== null) return cachedCss;
-  cachedCss = fs.readFileSync(cssPath, "utf8");
+  const raw = fs.readFileSync(cssPath, "utf8");
+  cachedCss = `@layer seo-components { ${raw} }`;
   return cachedCss;
 }
 

package/src/index.ts

@@ -37,6 +37,10 @@ export { MetricsRow } from "./components/MetricsRow";
 export { InlineCta } from "./components/InlineCta";
 export { StickyBottomCta } from "./components/StickyBottomCta";
 
+// Canonical analytics helpers (schedule_click, etc.)
+export { trackScheduleClick } from "./lib/track";
+export type { ScheduleClickProps } from "./lib/track";
+
 // Proof / social proof
 export { ProofBanner } from "./components/ProofBanner";
 

package/src/lib/track.ts

@@ -0,0 +1,53 @@
+// Canonical analytics helpers. Use these instead of calling
+// `posthog.capture("cta_click", ...)` directly so every consumer site
+// fires the same event names with the same property shape.
+//
+// All helpers are no-ops on the server and when PostHog is not loaded.
+
+type PostHogLike = {
+  capture: (event: string, properties?: Record<string, unknown>) => void;
+};
+
+function ph(): PostHogLike | undefined {
+  if (typeof window === "undefined") return undefined;
+  const w = window as unknown as { posthog?: PostHogLike };
+  return w.posthog;
+}
+
+export interface ScheduleClickProps {
+  /** Absolute URL the click sends the user to (e.g. https://cal.com/team/mediar/demo). */
+  destination: string;
+  /** Short slug identifying the site (e.g. "mediar", "fazm", "cyrano"). Optional: PostHog $host already identifies the site. */
+  site?: string;
+  /** Section of the page the CTA lives in (e.g. "hero", "footer", "guide-navbar"). */
+  section?: string;
+  /** Visible button/link text. */
+  text?: string;
+  /** Name of the rendering component (e.g. "CTAButton", "LeadCaptureModal"). */
+  component?: string;
+  /** Free-form extra properties — merged last, cannot override reserved keys above. */
+  extra?: Record<string, unknown>;
+}
+
+/**
+ * Fire the canonical `schedule_click` PostHog event. Use for every CTA that
+ * sends the user to a booking/scheduling tool (Cal.com, Calendly, meetings.hubspot.com).
+ *
+ * The dashboard at social-autoposter/scripts/project_stats_json.py counts this
+ * event per `$host` to produce the "Schedule Clicks" column in the Project
+ * Funnel Stats table.
+ */
+export function trackScheduleClick(props: ScheduleClickProps): void {
+  const posthog = ph();
+  if (!posthog) return;
+  const { destination, site, section, text, component, extra } = props;
+  posthog.capture("schedule_click", {
+    ...(extra || {}),
+    destination,
+    site,
+    section,
+    text,
+    component,
+    page: typeof window !== "undefined" ? window.location.pathname : undefined,
+  });
+}