Notifications widget

Bell icon with an unread badge. Click navigates to /hub — Cobuntu's personal-account surface where notifications live today. Badge polls /api/users/me/notifications/unread-count every 60s while the page is visible.

Mirrors the messages widget — same architecture (signal + affordance, not embedded panel), same contract shape.

Install

<script src="/widgets/v1/notifications.js" async></script>
<div data-cobuntu-notifications></div>

Three levels of customization

Level 1 — CSS variables

Same set as messages: --cobuntu-bg, --cobuntu-color, --cobuntu-border, --cobuntu-radius, --cobuntu-padding, --cobuntu-font, --cobuntu-hover-color, --cobuntu-hover-bg, --cobuntu-badge-bg, --cobuntu-badge-text.

Level 2 — data attributes

Attribute	Values	Default
`data-variant`	`icon` \| `button`	`icon`
`data-size`	`sm` \| `md` \| `lg`	`md`
`data-show-badge`	`true` \| `false`	`true`
`data-label`	string (aria-label)	`Notifications`
`data-button-label`	string (button variant)	`Notifications`
`data-require-auth`	`prompt` \| `hide`	`prompt`

Level 3 — render-yourself slot

Bindings: data-cobuntu-bind="unread-count", data-cobuntu-show="has-unread|no-unread", data-cobuntu-action="open-notifications".

Public JS API

window.CobuntuNotifications = {
  unread(): number,
  refresh(): Promise<void>,
  open(): void,
};

Versioning

v1 frozen. A future v2 may add an in-place dropdown of recent notifications instead of navigating; will ship under /widgets/v2/notifications.js. Both versions coexist.

Messages Search