Sentros.Shared — Social Widget (Fase 1)

Ponto único de manutenção. Sites destino (PHP, Next, React) consomem via <script> + <sentros-social>, sem recompilar.

Abrir demo Next.js → · Abrir demo PHP/HTML puro →

1. PHP / HTML estático

<script src="https://cdn.seudominio.com/cdn/v1/sentros-social.js" async></script>
<sentros-social site-key="pk_demo" api-base="https://api.seudominio.com"></sentros-social>

2. Next.js / React (client-only)

"use client";
import { useEffect } from "react";

export function SocialEmbed() {
  useEffect(() => {
    const s = document.createElement("script");
    s.src = "/cdn/v1/sentros-social.js";
    s.async = true;
    document.body.appendChild(s);
    return () => { document.body.removeChild(s); };
  }, []);
  return <sentros-social site-key="pk_demo" api-base="" />;
}

Custom Element não faz SSR: carregar apenas no cliente (ver /demo).

3. Herança visual do site cliente

sentros-social {
  --sentros-primary: #111827;
  --sentros-accent: #2563eb;
  --sentros-radius: 12px;
  /* sem tokens: herda font/cor do site via inherit */
}