@bpmnkit/astro-shared
Shared CSS design tokens, aurora background, site metadata, and SEO helpers for BPMN Kit Astro apps
Website · Documentation · GitHub · Changelog
Overview
@bpmnkit/astro-shared provides shared CSS imports, site metadata, and SEO building blocks used across BPMN Kit's Astro-based apps (landing page, docs, learn, blog). It re-exports the design tokens from @bpmnkit/ui, adds a global aurora background animation, and ships a <Seo> head component plus schema.org JSON-LD helpers so every site emits consistent titles, canonicals, Open Graph tags, and structured data.
This package is primarily intended for internal use by BPMN Kit's own Astro applications.
Installation
npm install @bpmnkit/astro-sharedUsage
Import design tokens in Astro layouts
---
import "@bpmnkit/astro-shared/tokens.css"
import "@bpmnkit/astro-shared/background.css"
---Access site metadata
import { SITE } from "@bpmnkit/astro-shared"
console.log(SITE.name) // "BPMN Kit"
console.log(SITE.docsUrl) // "https://docs.bpmnkit.com"Add SEO tags and structured data to a page
---
import Seo from "@bpmnkit/astro-shared/Seo.astro"
import { articleJsonLd } from "@bpmnkit/astro-shared/seo.js"
---
<html>
<head>
<Seo
title="Generate BPMN diagrams with code"
description="A TypeScript SDK for BPMN 2.0 diagrams."
jsonLd={articleJsonLd({
title: "...",
description: "...",
url: "https://bpmnkit.com/blog/example",
datePublished: "2026-01-01",
authorName: "BPMN Kit",
})}
/>
</head>
</html>Exports
| Export | Description |
|---|---|
/tokens.css |
All --bpmnkit-* CSS custom properties (re-exports @bpmnkit/ui/tokens.css) |
/background.css |
Global aurora background animation styles |
/Seo.astro |
Shared <Seo> component — title, meta description, canonical URL, Open Graph, Twitter card, and JSON-LD |
/seo.js |
JSON-LD builders: organizationJsonLd, softwareApplicationJsonLd, articleJsonLd, breadcrumbJsonLd, faqJsonLd |
. |
SITE metadata object (name, url, github, docsUrl, learnUrl, blogUrl, npm) |
Related Packages
| Package | Description |
|---|---|
@bpmnkit/core |
BPMN/DMN/Form parser, builder, layout engine |
@bpmnkit/canvas |
Zero-dependency SVG BPMN viewer |
@bpmnkit/editor |
Full-featured interactive BPMN editor |
@bpmnkit/engine |
Lightweight BPMN process execution engine |
@bpmnkit/feel |
FEEL expression language parser & evaluator |
@bpmnkit/plugins |
22 composable canvas plugins |
@bpmnkit/api |
Camunda 8 REST API TypeScript client |
@bpmnkit/ascii |
Render BPMN diagrams as Unicode ASCII art |
@bpmnkit/docspack |
BPMN Kit docs as an offline docspack package for AI agents |
@bpmnkit/ui |
Shared design tokens and UI components |
@bpmnkit/profiles |
Shared auth, profile storage, and client factories for CLI & proxy |
@bpmnkit/operate |
Monitoring & operations frontend for Camunda clusters |
@bpmnkit/connector-gen |
Generate connector templates from OpenAPI specs |
@bpmnkit/connectors |
Camunda 8 OOTB connector catalog and deterministic template application |
@bpmnkit/cli |
Camunda 8 command-line interface (casen) |
@bpmnkit/proxy |
Local AI bridge and Camunda API proxy server |
@bpmnkit/patterns |
Domain process patterns for BPMNKit AIKit |
@bpmnkit/reebe-wasm |
WebAssembly BPMN engine for browser simulation |
@bpmnkit/worker-client |
Thin Zeebe REST client for standalone workers |
@bpmnkit/cli-sdk |
Plugin authoring SDK for the casen CLI |
@bpmnkit/create-casen-plugin |
Scaffold a new casen CLI plugin in seconds |
@bpmnkit/casen-report |
HTML reports from Camunda 8 incident and SLA data |
@bpmnkit/casen-worker-http |
Example HTTP worker plugin — completes jobs with live JSONPlaceholder API data |
@bpmnkit/casen-worker-ai |
AI task worker — classify, summarize, extract, and decide using Claude |
License