0.5.0 is the first element quality release, covering every A, B and C element. Components rebuild cleanly when moved or re-populated, keyboard and screen-reader access is fixed across the C components, and several XSS paths are closed. Themes gain a --btn-border-width hook,…
VB's JSON fetch layer: components call endpoints by role, and one configure() call points every role at your backend. Available as window.VB.service and as a named export.
VBService is how VB components talk to servers. A component asks for a role (notify, email, newsletter); VBService turns the role into a URL. By default every role lives under /go/, and one configure() call moves any of them to your own backend.
// Any page that loads Vanilla BreezeVB.service.configure({ baseUrl: '/api' }); // Or as a moduleimport { VBService, VBServiceError } from 'vanilla-breeze/js'; // also exported by core-jsConfiguration is shared by every bundled copy, including the ones inside autoloaded components, so configure once, early, before components fetch.
<script type="module"> VB.service.configure({ baseUrl: '/api', // notify → /api/notify headers: { 'X-App': 'shop' }, // sent with every request services: { email: 'https://mail.example.com/v1' } // one role elsewhere });</script>services[role], if set (trailing slash removed).{baseUrl}/{role}. The default baseUrl is /go.configure() merges: unspecified options keep their values, and headers and services are merged key by key. VB.service.resolve('notify') shows the URL a role resolves to.
const notify = new VB.service('notify'); const page2 = await notify.get('/messages', { page: 2 }); // GET {base}/messages?page=2await notify.post('/read', { ids: ['msg-1'] }); // POST JSONawait notify.patch('/prefs', { digest: 'weekly' }); // PATCH JSONawait notify.delete('/messages/msg-1'); // DELETEnull or undefined values are dropped.content-type: application/json.application/json, otherwise the response text.Any non-2xx response rejects with a VBServiceError carrying status, body (parsed like a success), role and path. Network failures reject with the browser's own error.
try { await new VB.service('newsletter').post('/subscribe', { email });} catch (err) { if (err instanceof VB.ServiceError && err.status === 409) { showMessage('Already subscribed'); } else { throw err; }}| Role | Used by | Contract |
|---|---|---|
notify | <notification-wc> (when src is a role name), data-watch-page | Service contracts |
email | data-vb-email-form | |
newsletter | data-vb-newsletter-form |
A component given a full URL (for example <notification-wc src="/api/notify">) fetches it directly and skips role resolution.
/go/{role}.