feat: add data-velxio-slot markers for overlay portal targets

Three small markers (each one HTML attribute) so private overlays can
portal-inject UI into well-defined places without forking the upstream
component:

- AppHeader user dropdown: data-velxio-slot="user-menu"
  Lets overlays add menu items between "My projects" and "Sign out"
  (e.g. a Privacy / opt-out item).
- AdminPage tab bar: data-velxio-slot="admin-tabs"
  Lets overlays add extra tabs alongside Dashboard / Users / Projects /
  Boards (e.g. a Pro Analytics tab).
- AdminPage tab content area: data-velxio-slot="admin-tab-content"
  Sibling div where overlay tab content can portal-render.

Generic markers, no overlay-specific code in upstream. Anyone with
private extensions can use them. The OSS build is otherwise unchanged.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
David Montero Crespo 2026-05-04 23:28:02 -03:00
parent 20c9aa3beb
commit a5b5e57aae
3 changed files with 166 additions and 164 deletions

File diff suppressed because it is too large Load Diff

View File

@ -264,6 +264,7 @@ export const AppHeader: React.FC<AppHeaderProps> = ({ autoSave }) => {
{dropdownOpen && (
<div
data-velxio-slot="user-menu"
style={{
position: 'absolute',
right: 0,

View File

@ -625,7 +625,7 @@ function AdminDashboard() {
</div>
</div>
<div style={s.tabs}>
<div data-velxio-slot="admin-tabs" style={s.tabs}>
<button
style={tab === 'dashboard' ? s.tabActive : s.tabBtn}
onClick={() => setTab('dashboard')}
@ -648,6 +648,7 @@ function AdminDashboard() {
Boards
</button>
</div>
<div data-velxio-slot="admin-tab-content" />
{tab === 'dashboard' && (
<div style={s.tabContent}>