V0.7.0 shell contract (#54)
All checks were successful
All checks were successful
This commit was merged in pull request #54.
This commit is contained in:
52
CHANGELOG.md
52
CHANGELOG.md
@@ -2,6 +2,58 @@
|
||||
|
||||
All notable changes to Armature are documented here.
|
||||
|
||||
## v0.7.0 — Shell Contract + Surface Audit + Rebrand
|
||||
|
||||
**Shell Infrastructure**
|
||||
- Kernel-injected two-slot topbar for all surfaces (home, left slot, center slot, bell, user menu)
|
||||
- `sw.shell.topbar` SDK API: `setLeft()`, `setSlot()`, `setTitle()`, `hide()`, `show()`
|
||||
- `.sw-topbar__tabs` / `.sw-topbar__tab` CSS classes for consistent tab styling
|
||||
- Shell topbar auto-mounts on extension surfaces via `#shell-topbar` div
|
||||
|
||||
**Backend WS Events**
|
||||
- `package.changed` event broadcast on install/uninstall/enable/disable/update
|
||||
- `auth.changed` event targeted to affected user on team/group membership changes
|
||||
- `notification.all_read` event split from `notification.read` for cleaner badge sync
|
||||
- `Hub.Broadcast()` method for untargeted all-client events
|
||||
|
||||
**User Menu + Bell Reactivity**
|
||||
- User menu re-fetches surface list on `package.changed` and `auth.changed` events
|
||||
- Notification bell syncs on `notification.read` and `notification.all_read` across tabs
|
||||
|
||||
**Surface Migrations**
|
||||
- Settings: Pattern B (flat tabs in topbar, no sidebar, full-width content)
|
||||
- Admin: Pattern C (category tabs in topbar, surface-owned sidebar below)
|
||||
- Team Admin: Pattern B (flat tabs, no sidebar, Groups tab removed)
|
||||
- Docs: Pattern A (shell topbar auto-renders, removed explicit Topbar import)
|
||||
- All 4 surfaces now have notification bell and user menu via shell topbar
|
||||
|
||||
**Error Handling + Empty States**
|
||||
- `.sw-inline-error` CSS primitive for inline error + retry pattern
|
||||
- `.sw-empty-state` CSS primitive for guided empty states
|
||||
- Admin Workflows, Packages, Groups: inline error on list fetch failure
|
||||
- Admin Workflows, Groups: descriptive empty state guidance
|
||||
|
||||
**Announcement Global Dismiss**
|
||||
- Announcement dismiss state persisted to localStorage keyed by content hash
|
||||
- Dismissed once on any surface, dismissed everywhere
|
||||
|
||||
**Rebrand Assets**
|
||||
- `favicon-light.svg` renamed to `wordmark.svg` (was a 520x80 wordmark, not an icon)
|
||||
- New `favicon-light.svg`: actual square light-mode icon
|
||||
- New `wordmark-dark.svg`, `wordmark-light.svg` for dark/light backgrounds
|
||||
- New `favicon-light-32.png`, `favicon-light-256.png` raster icons
|
||||
- Full icon library deployed to `src/icons/` (both b/e variants, animated SVGs)
|
||||
- `manifest.json` description updated to "Self-hosted extension platform"
|
||||
- Light-mode icon entries added to PWA manifest
|
||||
|
||||
**Bug Fixes**
|
||||
- Docs: "On this page" outline links now scroll to headings (IDs were missing from rendered HTML)
|
||||
- ICD security tier: tightened path traversal assertion (400/422, not 409), added `finally` cleanup
|
||||
- Workflow demo: replaced silent catch with inline error + retry
|
||||
- Team Admin: signoff panel shows display names instead of raw UUIDs
|
||||
- Deleted `packages/hello-dashboard/` (dead package)
|
||||
- Deleted `team-admin/groups.js` (37-line dead-end, no CRUD)
|
||||
|
||||
## v0.6.18 — CI Bundle Wiring
|
||||
|
||||
Wire `BUNDLED_PACKAGES` env var into the Gitea CI pipeline so each
|
||||
|
||||
151
ROADMAP-UI.md
151
ROADMAP-UI.md
@@ -1,151 +0,0 @@
|
||||
# Armature — v0.6.x UI Hardening Roadmap
|
||||
|
||||
> **Goal**: Fix all viewport scaling, banner integration, and styling inconsistencies
|
||||
> so Claude Code can run a meaningful automated usability survey against a
|
||||
> stable, uniform UI.
|
||||
|
||||
---
|
||||
|
||||
## Problem Inventory
|
||||
|
||||
### P1 — Viewport & Scaling (blocks everything)
|
||||
|
||||
| # | Issue | Where | Impact |
|
||||
|---|-------|-------|--------|
|
||||
| 1 | **Dual layout systems** — `base.html` template has its own banner→surface→footer column; `app-shell.js` Preact shell has a separate `sw-shell` → `sw-shell__body` → `sw-shell__surface` column. They never coordinate. | `server/pages/templates/base.html` ↔ `src/js/sw/shell/app-shell.js` | Every surface inherits an ambiguous viewport ancestor. |
|
||||
| 2 | **Transform-based scaling is broken** — `transform: scale()` on `#surfaceInner` doesn't reflow layout. Breaks `getBoundingClientRect` (menu.js already carries a scale-correction hack at line 20), scroll containment, pointer events, and the inverse-width/height hack (`100/s%`) doesn't account for banners consuming viewport space. | `base.html:56-67`, `appearance.js:41-53`, `menu.js:20-33` | Menus, tooltips, dropdowns all mis-positioned at any non-100% scale. Click targets wrong. |
|
||||
| 3 | **Banner height desync** — `base.html` hardcodes `--banner-h: 28px` and renders banners in-flow. `app-shell.js` ShellBanner measures `offsetHeight` into `--banner-top-height` / `--banner-bottom-height` and uses `position: fixed` + body padding. Two independent banner systems. | `base.html:31,72-75,103-107` ↔ `app-shell.js:25-42`, `sw-shell.css:22-37,63-69` | With banners enabled, content overflows by the banner height or gets double-inset depending on which code path is active. |
|
||||
| 4 | **`100vh` on mobile** — `.sw-shell`, `.chat-app`, `.chat-loading`, `.login-shell` use `100vh` which doesn't subtract mobile browser chrome (address bar, toolbar). | `sw-shell.css:9`, `chat/css/main.css:15,25`, `sw-login.css:7` | Content overflows on iOS Safari, Android Chrome. |
|
||||
| 5 | **Chat uses `100vh` not `100%`** — `.chat-app { height: 100vh }` ignores parent container (which already excludes banners/footer). Notes correctly uses `height: 100%`. Every extension surface that copies chat's pattern will inherit the bug. | `packages/chat/css/main.css:15` | Chat surface overflows behind banners. |
|
||||
|
||||
### P2 — CSS Architecture
|
||||
|
||||
| # | Issue | Where | Impact |
|
||||
|---|-------|-------|--------|
|
||||
| 6 | **Class name collisions** — `.settings-section` defined in both `modals.css:41-43` and `surfaces.css:75-83` with different padding, margin, and border-bottom rules. `.sw-dropdown` in `primitives.css:443` (styled `<select>`) vs `sw-primitives.css:262` (custom dropdown component). `.sw-tabs` in `primitives.css:459` vs `sw-primitives.css:234`. | Kernel CSS | Styles randomly win depending on load order. Bug reports differ by surface. |
|
||||
| 7 | **Old/new primitive duplication** — Two button systems (`.btn-primary`/`.btn-small` in `primitives.css` vs `.sw-btn--primary`/`.sw-btn--sm` in `sw-primitives.css`). Two toast systems (`.toast` vs `.sw-toast`). Two dropdown, two tabs implementations. | `primitives.css` ↔ `sw-primitives.css` | No single source of truth for any component. Extension authors can't know which to use. |
|
||||
| 8 | **Extension CSS bleeds globally** — Extension `main.css` loaded via `<link>` at document level, no scoping. Any class name can override kernel or sibling extension styles. | `base.html:26-28`, `extension-surface.css` | Package CSS fights with kernel. Two packages with `.sidebar` both lose. |
|
||||
| 9 | **No intermediate breakpoint** — Only `768px` mobile breakpoint. No tablet (768–1024px). Secondary workspace pane hardcoded `480px`. Admin nav hardcoded `200px`. | `layout.css:263`, `surfaces.css:305` | Cramped layout on iPad/small laptops. |
|
||||
|
||||
### P3 — Visual Consistency
|
||||
|
||||
| # | Issue | Where | Impact |
|
||||
|---|-------|-------|--------|
|
||||
| 10 | **Mixed unit systems** — `px`, `rem`, `em` used interchangeably with no rationale. Some font-sizes in `px` (primitives), others in `rem` (sw-primitives), others in `em` (user-picker). | All CSS files | Zoom/scale behaves differently per element. |
|
||||
| 11 | **Google Fonts CDN dependency** — `@import url(...)` in `variables.css:5` blocks rendering if CDN is slow; breaks entirely on air-gapped deployments. | `variables.css:5` | FOUT or blank page on slow networks. No offline support. |
|
||||
| 12 | **No spacing scale** — Padding/margins are ad-hoc values (10px, 12px, 14px, 16px, 20px, 24px, 28px…). No design-token spacing scale. | All CSS | Inconsistent visual rhythm across surfaces. |
|
||||
| 13 | **Hardcoded fallback colors in component CSS** — `sw-shell.css`, `sw-primitives.css` have inline fallbacks like `var(--accent, #b38a4e)` — a gold color from a previous theme that doesn't match the current blue `#6c9fff`. | `sw-shell.css`, `sw-primitives.css` | Wrong colors flash briefly if variables load late. |
|
||||
|
||||
---
|
||||
|
||||
## Roadmap
|
||||
|
||||
### v0.6.9 — Session Lifetime Config ✅
|
||||
|
||||
Shipped. Admin-configurable TTLs, "keep me logged in" checkbox, idle timeout,
|
||||
config-driven `generateTokens()`, 7 new tests. See CHANGELOG.md for details.
|
||||
|
||||
### v0.6.10 — Viewport Foundation ✅
|
||||
|
||||
Shipped. Single layout model: `body → shell → surface`. CSS `zoom` replaces
|
||||
`transform: scale()`. `100dvh` fallbacks everywhere. Extension surfaces use
|
||||
`100%` instead of `100vh`. Dead shell layout code deprecated. See CHANGELOG.md.
|
||||
|
||||
### v0.6.11 — CSS Deduplication ✅
|
||||
|
||||
Shipped. Old primitive system retired. One class per concept. See CHANGELOG.md.
|
||||
|
||||
| Step | Description |
|
||||
|------|-------------|
|
||||
| Audit collision inventory | Script that finds all duplicate class selectors across kernel CSS files. Produce a machine-readable collision report (JSON). |
|
||||
| Migrate `.settings-section` | Remove `modals.css:41-43` definition. The `surfaces.css` definition is authoritative. Modals that used the old styles get explicit overrides scoped to `.modal .settings-section`. |
|
||||
| Retire `primitives.css` old components | `.btn-primary`, `.btn-small`, `.btn-danger`, `.btn-full` → migrate all usages to `.sw-btn--*`. `.toast-container` / `.toast` → migrate to `.sw-toast-container` / `.sw-toast`. Old `.popup-menu` → migrate to `.sw-menu`. Old `.sw-dropdown` (styled select in primitives.css) → rename to `.sw-native-select` or delete if unused. Old `.sw-tabs` / `.sw-tab-btn` in primitives.css → delete (sw-primitives.css version is authoritative). |
|
||||
| Mark deprecated classes | Any remaining old classes get a `/* DEPRECATED v0.6.11 — use .sw-btn--* */` comment and a 1-version grace period for package authors. |
|
||||
| Package CSS audit | Scan all `packages/*/css/main.css` for references to deprecated kernel classes. Fix in-tree packages. |
|
||||
|
||||
### v0.6.12 — Extension CSS Isolation ✅
|
||||
|
||||
Shipped. Prefix enforcement via linter. All 12 in-tree packages migrated.
|
||||
See CHANGELOG.md.
|
||||
|
||||
| Step | Description |
|
||||
|------|-------------|
|
||||
| Scoping strategy | Prefix enforcement (option B). `@scope` support still patchy; prefix works everywhere, trivially lintable. |
|
||||
| Linter | `scripts/lint-package-css.sh` — validates first class selector in every rule starts with `.ext-{slug}`. Exempts `:root`, `@keyframes`, `@font-face`, `@media`, `.sw-*` kernel classes, `.cm-*` CodeMirror classes. |
|
||||
| Kernel CSS contract | `docs/EXTENSION-CSS.md` — stable public classes (`.sw-btn--*`, `.sw-input`, `.sw-field`, `.sw-dialog`, `.sw-toast`, `.sw-menu`, `.sw-tabs`, etc.) and all CSS variables. Everything else internal. |
|
||||
| Migrate in-tree packages | `data-ext="{{.Surface}}"` on extension mount. All 12 packages prefixed to `.ext-{slug}-*`. CSS + JS updated in lockstep. |
|
||||
|
||||
### v0.6.13 — Responsive & Spacing ✅
|
||||
|
||||
Shipped. Spacing token scale (`--sp-1` through `--sp-12`, 4px grid) in
|
||||
`variables.css`. Tablet breakpoint (`max-width: 1024px`) in layout, surfaces,
|
||||
login. All kernel CSS and 12 in-tree packages migrated to spacing tokens.
|
||||
`EXTENSION-CSS.md` updated with spacing table and breakpoint guide.
|
||||
Font-size scale deferred to v0.6.14. See CHANGELOG.md.
|
||||
|
||||
### v0.6.14 — Visual Polish ✅
|
||||
|
||||
Shipped. Stale fallback colors purged (~65 instances), fonts self-hosted
|
||||
(DM Sans + JetBrains Mono woff2), border-radius standardized to three tokens
|
||||
(`--radius-sm`, `--radius`, `--radius-lg`). Also fixed v0.6.13 spacing
|
||||
regressions (half-step tokens), theme settings default, surface overflow,
|
||||
and user menu zoom drift. See CHANGELOG.md.
|
||||
|
||||
### v0.6.15 — User Display Audit ✅
|
||||
|
||||
Shipped. `GET /api/v1/users/resolve?ids=...` batch endpoint, `sw.users`
|
||||
SDK module with `resolve()`, `resolveMany()`, `displayName()` + 60s cache.
|
||||
Chat participants resolved from users table instead of snapshot. All admin
|
||||
surfaces show `display_name || username || 'Unknown'`. Chat-core snapshot
|
||||
column deprecated. 5 new handler tests. See CHANGELOG.md.
|
||||
|
||||
### v0.6.16 — Usability Survey Gate ✅
|
||||
|
||||
Shipped. Four audit scripts, structured survey prompt, contrast/touch-target
|
||||
fixes, Docker docs corrected. All 48 contrast pairings pass, all close buttons
|
||||
have 44px mobile targets, focus-visible on all key primitives. See CHANGELOG.md.
|
||||
|
||||
---
|
||||
|
||||
## Sequencing Rationale
|
||||
|
||||
```
|
||||
v0.6.9 Session Lifetime Config ✅ SHIPPED
|
||||
↓
|
||||
v0.6.10 Viewport Foundation ✅ SHIPPED
|
||||
↓
|
||||
v0.6.11 CSS Deduplication ✅ SHIPPED
|
||||
↓
|
||||
v0.6.12 Extension CSS Isolation ✅ SHIPPED
|
||||
↓
|
||||
v0.6.13 Responsive & Spacing ✅ SHIPPED
|
||||
↓
|
||||
v0.6.14 Visual Polish ✅ SHIPPED
|
||||
↓
|
||||
v0.6.15 User Display Audit ✅ SHIPPED
|
||||
↓
|
||||
v0.6.16 Usability Survey Gate ✅ SHIPPED
|
||||
```
|
||||
|
||||
Each version is independently shippable and testable. No version depends on
|
||||
anything after it.
|
||||
|
||||
---
|
||||
|
||||
## What "Usability Survey by Code" Means
|
||||
|
||||
The v0.6.16 deliverables give Claude Code (or any automated tool) three things:
|
||||
|
||||
1. **A structured inventory** (`ui-inventory.json`) of every component, on every
|
||||
surface, with its CSS file and line number.
|
||||
|
||||
2. **Automated checks** (contrast, touch targets, token usage) that produce
|
||||
machine-readable pass/fail reports.
|
||||
|
||||
3. **A survey prompt** (`USABILITY-SURVEY.md`) with explicit criteria and file
|
||||
paths, so Claude Code can `cat` the relevant files, run the scripts, and
|
||||
produce a scored report without human guidance.
|
||||
|
||||
The survey is not a substitute for real user testing — it's a structural
|
||||
quality gate that catches the class of bugs (overflow, contrast, misalignment,
|
||||
inconsistent styling) that have historically slipped through.
|
||||
286
ROADMAP.md
286
ROADMAP.md
@@ -1,6 +1,6 @@
|
||||
# Armature — Roadmap
|
||||
|
||||
## Current: v0.6.14 — Visual Polish
|
||||
## Current: v0.6.18 — CI Bundle Wiring
|
||||
|
||||
Self-hosted extensible platform. Auth, identity, packages, Starlark sandbox,
|
||||
storage, realtime, and ops are kernel primitives. Everything else is an extension.
|
||||
@@ -19,152 +19,168 @@ upgrade test harness, cluster registry + HA.
|
||||
|
||||
---
|
||||
|
||||
## v0.6.0 — MVP
|
||||
## v0.6.x — Completed (MVP + Hardening)
|
||||
|
||||
Extension, communication, and operations tracks converge. First
|
||||
externally usable release.
|
||||
All v0.6.x work is shipped and documented in `CHANGELOG.md`. Summary:
|
||||
|
||||
Design docs: `docs/DESIGN-cluster-registry.md` — PG-backed cluster registry and self-assembling mesh.
|
||||
|
||||
### v0.6.0 — Cluster Registry + HA
|
||||
|
||||
PG is the consensus layer. Zero new infrastructure. `UNLOGGED` table + `LISTEN/NOTIFY` replaces etcd/Consul/Redis for homelab-to-small-team scale.
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| `node_registry` table | ✅ | `UNLOGGED TABLE` — node_id, endpoint, seq, registered_at, heartbeat, stats JSONB. Postgres migration 013. |
|
||||
| Node registration | ✅ | Self-registration on startup: `INSERT ... ON CONFLICT DO UPDATE`. `node_id` = `hostname-PID` or `CLUSTER_NODE_ID` env override. |
|
||||
| Heartbeat tick | ✅ | Every 10s: update own heartbeat + collect runtime stats (goroutines, heap, GC, uptime, ws_clients). |
|
||||
| Stale sweep | ✅ | Every heartbeat tick: `DELETE WHERE heartbeat < now() - 30s`. All nodes run it — idempotent, no ring topology. |
|
||||
| Self-eviction | ✅ | If heartbeat UPDATE returns 0 rows: node was swept by peer → log error + `os.Exit(1)`. K8s restarts → re-register. |
|
||||
| LISTEN/NOTIFY routing | ✅ | Durable events (messages, state changes) fan-out via `pg_notify`. All replicas receive, push to local WS subscribers, drop if irrelevant. Phase 1: ephemeral events (typing, presence) also via NOTIFY (8KB limit, ~60 bytes each). |
|
||||
| Cluster API | ✅ | `GET /api/v1/admin/cluster` — returns `{data: [...]}` envelope with all registered nodes. |
|
||||
| Admin cluster dashboard | ✅ | `cluster-dashboard` surface package renders one card per node: node_id, endpoint, uptime, ws_clients, heap, GC pause. JSONB stats — future keys render automatically, no schema migration. Auto-refresh every 10s. |
|
||||
| Health endpoint | ✅ | `GET /health` includes `node_id` and `cluster: {size, peers, heartbeat_age_ms}`. |
|
||||
| Config | ✅ | `CLUSTER_NODE_ID`, `CLUSTER_HEARTBEAT_INTERVAL` (default 10s), `CLUSTER_STALE_THRESHOLD` (default 30s), `CLUSTER_ENDPOINT` (Phase 2 mesh, auto-detect). |
|
||||
| Single-node regression | ✅ | One-node behavior identical to pre-cluster: one registry row, NOTIFY delivers back to same instance. No special-casing. SQLite returns nil store — all cluster code guarded. |
|
||||
| Multi-node integration test | ✅ | Docker Compose: 3 instances, shared PG. `ci/e2e-cluster-test.sh`: registration, stale sweep on stop, re-registration on restart. 3 unit tests + 2 handler tests. |
|
||||
|
||||
### v0.6.1 — Backup/Restore + Documentation
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Backup handler | ✅ | `POST /api/v1/admin/backup` streams `.swb` ZIP (JSONL core + ext_data tables + package assets). `POST /api/v1/admin/restore` wipes DB and restores from archive. Dialect-neutral (SQLite + Postgres). |
|
||||
| Server-side backups | ✅ | `GET /api/v1/admin/backups` list, `GET /download`, `DELETE`. Store backups in `{STORAGE_PATH}/backups/`. |
|
||||
| Admin backup section | ✅ | New "Backup" section under `/admin/backup`. Create (download or server-side), list, download, delete, restore with destructive confirmation. |
|
||||
| Documentation API | ✅ | `GET /api/v1/docs` lists, `GET /api/v1/docs/:name` returns raw markdown. Authenticated (not admin-only). |
|
||||
| Docs surface | ✅ | Builtin surface at `/docs/:section`. Sidebar navigation, client-side markdown renderer. 5 new docs: Getting Started, Extension Guide, API Reference, Deployment, Package Format. |
|
||||
| Tests | ✅ | 6 handler tests (basic backup, ext_data backup, round-trip restore, schema mismatch, dump/restore table, list empty). E2E script `ci/e2e-backup-test.sh`. |
|
||||
|
||||
### v0.6.2 — Docs Polish + Dynamic OpenAPI
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Dark mode fix | ✅ | Added `--bg-code` to CSS variables (dark + light). Replaced all hardcoded light-mode fallbacks in docs CSS with theme-aware variables. Table styling, code blocks, nav items all readable in dark mode. |
|
||||
| Loading & error handling | ✅ | Replaced borrowed `settings-placeholder` with docs-specific pulse animation. Added error state with retry button for failed doc list fetch. |
|
||||
| Topbar navigation | ✅ | Imported `Topbar` + `UserMenu` into docs surface. Users can now navigate to other surfaces via the avatar menu. |
|
||||
| Docs icon + menu entry | ✅ | Added `📖 Docs` entry to UserMenu standard items. Docs accessible from any surface's user menu. |
|
||||
| `api_schema` manifest field | ✅ | Optional `api_schema` array in `manifest.json`. Parsed lazily by spec builder. Malformed entries logged and skipped — never blocks extension loading. |
|
||||
| OpenAPI spec builder | ✅ | `BuildOpenAPISpec()` merges static kernel spec with extension routes. Tier 1: auto-generated stubs for all `api_routes`. Tier 2: `api_schema` replaces stubs with rich path items (params, body, response). |
|
||||
| Dynamic spec endpoint | ✅ | `GET /api/docs/openapi.json` serves merged spec. Swagger UI updated to use JSON endpoint. Static YAML preserved for backward compat. |
|
||||
| Tests | ✅ | 7 new handler tests: zero extensions, stubs, rich schema, multi-extension, malformed schema, disabled exclusion, required fields. |
|
||||
| Version | Title | Key Deliverables |
|
||||
|---------|-------|-----------------|
|
||||
| v0.6.0 | Cluster Registry + HA | PG-backed node registry, heartbeat sweep, LISTEN/NOTIFY routing, self-eviction |
|
||||
| v0.6.1 | Backup/Restore + Docs | `.swb` archive format, server-side backups, docs surface + 5 guides |
|
||||
| v0.6.2 | Docs Polish + OpenAPI | Dark mode fix, topbar nav, `api_schema` manifest field, dynamic spec builder |
|
||||
| v0.6.3 | Dead Code Sweep | Registry install fix, dead Go/JS/HTML deletion, narrowed default bundle |
|
||||
| v0.6.4 | Admin Health/Metrics | Cluster dashboard merged into Admin tab, block renderer `requires` removed |
|
||||
| v0.6.5 | Renderer Pipeline | `sw.renderers.register()` kernel primitive, unified markdown, docs rewrite |
|
||||
| v0.6.6 | Final Hardening | Dependency auto-activation, `ValidateManifest()`, OIDC nonce, ICD/SDK update |
|
||||
| v0.6.7 | Native mTLS | `TLS_MODE` config, `MTLSNativeProvider`, node-to-node mTLS, `armature-ca.sh` |
|
||||
| v0.6.8 | Cookie Fix + UI Roadmap | Cookie SameSite fix, UI hardening roadmap published |
|
||||
| v0.6.9 | Session Lifetime Config | Admin-configurable TTLs, idle timeout, "keep me logged in" |
|
||||
| v0.6.10 | Viewport Foundation | Single layout model, CSS zoom, 100dvh, dead shell deprecated |
|
||||
| v0.6.11 | CSS Deduplication | Old primitive system retired, one class per concept |
|
||||
| v0.6.12 | Extension CSS Isolation | Prefix enforcement via linter, all 12 in-tree packages migrated |
|
||||
| v0.6.13 | Responsive & Spacing | Spacing token scale (4px grid), tablet breakpoint |
|
||||
| v0.6.14 | Visual Polish | Stale fallback colors purged, fonts self-hosted, radius tokens |
|
||||
| v0.6.15 | User Display Audit | Batch user resolve API, `sw.users` SDK module |
|
||||
| v0.6.16 | Usability Survey Gate | Four audit scripts, contrast/touch-target fixes |
|
||||
| v0.6.17 | Bug Fixes & Welcome | Notes folder fix, team member add fix, welcome auto-disable, zero default bundle |
|
||||
| v0.6.18 | CI Bundle Wiring | `BUNDLED_PACKAGES` env var wired into Gitea CI pipeline |
|
||||
|
||||
---
|
||||
|
||||
## v0.6.x — Hardening
|
||||
## v0.7.x — Test Infrastructure + Quality Gate
|
||||
|
||||
Closes every audit finding before the public release. No new features — only correctness, dead code elimination, and architectural cleanup. Sequence is fixed: each version is a gate for the next.
|
||||
The v0.6.x series built the kernel. v0.7.x makes it provably correct.
|
||||
|
||||
### v0.6.3 — Dead Code Sweep + Registry Fix
|
||||
A full surface audit (docs/AUDIT-surfaces.md) found 7 cross-surface issues
|
||||
and 18 surface-specific issues across Settings, Admin, Team Admin, and Docs.
|
||||
Only Docs is properly built. The fix is three phases: (1) establish a shell
|
||||
contract and bring all four primary surfaces to parity, (2) build a runner
|
||||
framework for end-to-end browser tests, (3) automate those runners headlessly
|
||||
in CI.
|
||||
|
||||
Pure cleanup. No behavior changes except fixing the broken registry install flow.
|
||||
Design docs:
|
||||
- `docs/DESIGN-shell-contract.md` — two-slot topbar, three navigation patterns, surface migrations
|
||||
- `docs/DESIGN-surface-runners.md` — runner framework, requires declarations, headless E2E
|
||||
- `docs/AUDIT-surfaces.md` — full audit findings
|
||||
|
||||
### v0.7.0 — Shell Contract + Surface Audit + Rebrand Cleanup
|
||||
|
||||
Design doc: `docs/DESIGN-shell-contract.md`
|
||||
|
||||
**Shell Infrastructure**
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Fix registry install | ✅ | SDK sends `{ url }`, handler expects `{ download_url }`. Fix `api-domains.js` to send `{ download_url: url }`. Every Install click currently returns 400. |
|
||||
| Registry settings UI | ✅ | Add "Package Registry" section to admin settings with URL input field. Only way to configure registry today is a raw `PUT /api/v1/admin/settings/package_registry` — no user will find it. |
|
||||
| Registry tooling + docs | ✅ | `scripts/generate-registry.sh` scans a directory of `.pkg` files and emits registry JSON. `docs/PACKAGE-REGISTRY.md` documents the format. |
|
||||
| Delete dead kernel Go | ✅ | `store/interfaces.go:178–183` — orphaned ChannelListFilter comments. `pages/pages.go:922–930` — `roleFilterType()` + template registration (chat vestige, maps nonexistent roles). `main.go:67` — orphaned provider-type comment. |
|
||||
| Delete dead vendor JS | ✅ | `vendor/marked.min.js` and `vendor/purify.min.js` — 62KB, zero production imports. Only referenced in test helpers. |
|
||||
| Delete `dev.html` | ✅ | 676 lines, not imported by anything. Dead. |
|
||||
| Remove `dashboard` from default bundle | ✅ | Requires `legacy-sdk` (doesn't exist), auto-installs as dormant on fresh installs. Confusing. Remove from `defaultBundledPackages`. |
|
||||
| Remove `hello-dashboard` | ✅ | Proof-of-concept from early development. Move to `examples/` or delete. |
|
||||
| Strip stale version comments | ✅ | 60+ files had legacy version annotations (`// v0.29.x:`, `// v0.33.x:`). Single sed pass. |
|
||||
| Narrow default bundle | ✅ | Default: `notes`, `chat`, `chat-core`, `mermaid-renderer`, `schedules`. Everything else available via registry or `BUNDLED_PACKAGES=*`. |
|
||||
| Shell topbar (two-slot model) | done | Kernel injects topbar into `surface-extension` template. Two named slots: **left** (defaults to manifest title) and **center** (`flex: 1`, for tabs/pickers/search). Home link, notification bell, and user menu always present. |
|
||||
| Topbar customization API | done | `sw.shell.topbar.setLeft(vnode)` overrides left slot. `sw.shell.topbar.setSlot(vnode)` sets center slot. `sw.shell.topbar.setTitle(str)` shorthand for text-only left. `sw.shell.topbar.hide()` / `.show()` for full-bleed surfaces. |
|
||||
| Kernel tab CSS | done | `.sw-topbar__tabs` and `.sw-topbar__tab` classes for consistent tab styling in the center slot. Surfaces use these for free or style their own slot content. |
|
||||
| Notification read broadcast | done | Backend emits `notification.read` and `notification.all_read` WS events. Bell listens for `.created`, `.read`, `.all_read`. Cross-surface sync without refetch. |
|
||||
| User menu reactivity | done | Emit `package.changed` (install/uninstall/enable/disable) and `auth.changed` (role/membership) WS events. UserMenu listens and re-fetches surface list. Most impactful single fix. |
|
||||
| Shell announcement global dismiss | done | Dismissed state persisted to localStorage keyed by content hash. Dismiss once, dismissed everywhere. |
|
||||
|
||||
### v0.6.4 — Admin Health/Metrics Tab + Cluster Merge
|
||||
|
||||
Structural move: cluster dashboard becomes an Admin tab. Better home for health/metrics — shared context with other admin panels, no separate nav entry.
|
||||
**Surface Migrations**
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| "Health / Metrics" admin tab | ✅ | New tab in Admin surface. DB-agnostic metrics for all deployments. Cluster cards conditional on PG + multi-node detection. |
|
||||
| Runtime metrics | ✅ | Per-node: goroutines, heap alloc/sys, stack in use, GC cycles, last GC pause, GC CPU %, uptime, WebSocket clients, extensions loaded, open FDs. |
|
||||
| DB pool metrics | ✅ | All deployments: DB latency (`SELECT 1` round-trip), pool active/idle/max, wait count, wait duration. PG-only: table bloat (`n_dead_tup`), active backends (`pg_stat_activity`). |
|
||||
| Cluster metrics | ✅ | PG multi-node only: cluster size, peer list with endpoint + uptime, heartbeat age per node, event bus publish/deliver rates. |
|
||||
| Extension runtime metrics | ✅ | Starlark exec/min, errors/min, avg duration, HTTP outbound requests/min, trigger fires/min, schedule overruns. |
|
||||
| Fatten heartbeat payload | ✅ | Heartbeat JSONB carries full metric set. `GET /api/v1/admin/metrics` for single-node SQLite fallback (same shape). |
|
||||
| Retire `cluster-dashboard` | ✅ | Remove package once Admin Health tab ships. Update `defaultBundledPackages`. |
|
||||
| Fix block renderer `requires` | ✅ | `mermaid-renderer`, `katex-renderer`, `csv-table`, `diff-viewer` all have `"requires": ["chat"]`. These are content renderers, not chat features. Remove constraint — they should activate without chat. |
|
||||
| Health endpoint consolidation | ✅ | `/health` and `/api/v1/health` return near-identical JSON. Merge or clearly differentiate with docs. |
|
||||
| Settings → Pattern B (flat tabs) | done | Delete custom topbar + sidebar nav. 6 sections become flat tabs in topbar center slot. Content full-width. Fix Teams section: add team admin link, role display, leave action. Remove sessionStorage return URL logic. |
|
||||
| Admin → Pattern C (category tabs + sidebar) | done | Delete custom `admin-topbar`. `setLeft()` for favicon + "Administration". `setSlot()` for category tabs (People / Workflows / System / Monitoring). Admin sidebar (sub-navigation) unchanged — surface-owned, below the topbar. Bell + user menu come free from shell. Delete bespoke CatIcon renderer if using standard SVGs. |
|
||||
| Team Admin → Pattern B (flat tabs) | done | Delete custom topbar + sidebar nav. 5 sections (Members / Connections / Workflows / Settings / Activity — Groups removed) become flat tabs. Content full-width. `setTitle()` for team-specific name. Remove sessionStorage return URL. Fix signoff user display (`user_id` → `sw.users.displayName()`). |
|
||||
| Team Admin: remove Groups tab | done | 37-line dead-end. Read-only "No groups" with no create/docs/link. Remove until team-scoped group management is properly designed. |
|
||||
| Docs → Pattern A (default) | done | Delete explicit Topbar import. Shell topbar auto-renders with manifest title. Docs sidebar (document list) is in content area, unaffected. |
|
||||
|
||||
### v0.6.5 — Renderer Pipeline + Docs Rewrite
|
||||
|
||||
Most complex sub-version. Lifts block rendering to a kernel SDK primitive so all surfaces share it, then rewrites the docs for an external audience.
|
||||
**Error Handling + UX Pass**
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| SDK renderer primitive | ✅ | `sw.renderers.register(pattern, handler)` — kernel-level registration. Extensions call once; all surfaces consume. Decouples renderer discovery from chat surface. |
|
||||
| Notes hooks SDK renderer pipeline | ✅ | Notes delegates to `sw.markdown.renderSync()` + `sw.renderers.runPostRenderers()`. Hand-rolled renderer deleted. |
|
||||
| Docs hooks SDK renderer pipeline | ✅ | Docs delegates to `sw.markdown.renderSync()` + `sw.renderers.runPostRenderers()`. Hand-rolled renderer deleted (~160 lines). |
|
||||
| Unify markdown renderer | ✅ | `sw.markdown` module lazy-loads `marked` v16 (vendored). Notes, Docs, Chat all consume it. Two hand-rolled parsers deleted. |
|
||||
| Sanitize HTML output | ✅ | DOMPurify wired as default post-render step in `sw.markdown`. SVG-safe config allows mermaid output. Notes sanitizes; Docs opts out (system-authored). |
|
||||
| Mermaid/KaTeX/CSV/Diff work everywhere | ✅ | Browser extension loader injects renderer scripts into all pages. Extensions register via `sw:ready` event. All four render in Notes, Docs, and Chat. |
|
||||
| Docs rewrite for external audience | ✅ | All fork references removed from docs, CHANGELOG, ROADMAP. DESIGN-WORKFLOW-REDESIGN-0.2.6.md replaced with DESIGN-WORKFLOWS.md. |
|
||||
| Add Mermaid architecture diagrams | ✅ | Six diagrams in ARCHITECTURE.md: system overview, request flow, extension lifecycle, realtime events, settings cascade, cluster topology. |
|
||||
| Surface alias decision | ✅ | Migrated SDK + ICD runner to `/admin/packages/`; aliases removed from main.go. |
|
||||
| `CONTRIBUTING.md` + tutorial | ✅ | CONTRIBUTING.md at repo root + docs/TUTORIAL-FIRST-EXTENSION.md walkthrough. |
|
||||
| Inline error states | done | Replace `catch { toast }` with inline error + retry on all list endpoints. New `.sw-inline-error` CSS primitive. Systematic pass across Settings, Admin, Team Admin. |
|
||||
| Empty state guidance | done | Every "No X" message gets one-line explanation + primary action (create button or doc link). Admin Groups, Workflows, Teams; Team Admin Workflows; Settings Notifications. |
|
||||
|
||||
### v0.6.7 — Native mTLS
|
||||
|
||||
End-to-end mutual TLS without a reverse proxy. Targets systemd+podman deployments where every connection (client→server, node→node) is mTLS. Design: `docs/DESIGN-native-mtls.md`.
|
||||
**Bug Fixes**
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| `TLS_MODE` config | ✅ | Three values: `none` (default, plain HTTP) · `server` (TLS, no client cert) · `mtls` (mutual TLS, client cert required). Independent of `AUTH_MODE`. |
|
||||
| TLS server mode | ✅ | Go binary calls `ListenAndServeTLS` directly. `TLS_CERT`, `TLS_KEY`, `TLS_CA` path config. TLS 1.3 minimum, no fallback. `server/config/tls.go` loader + validation. |
|
||||
| `MTLSNativeProvider` | ✅ | Reads `r.TLS.PeerCertificates[0]` — no header trust. `Subject.CommonName` → username. `sha256(Raw)` → `external_id`. Auto-provisions `auth_source=mtls`. Renamed existing `mtls.go` → `mtls_proxy.go`. Shared helpers in `mtls_helpers.go`. |
|
||||
| Node-to-node mTLS | ✅ | `BuildPeerTLSConfig()` constructs outbound TLS config with node cert + CA pool. Forward-looking — cluster registry is DB-backed (PG LISTEN/NOTIFY), no HTTP peer calls yet. |
|
||||
| `armature-ca.sh` | ✅ | Shell wrapper around openssl. Three commands: `init` (CA keypair) · `issue-node --name <n> --san <addrs>` (365d) · `issue-user --cn <name>` (90d). All output PEM. |
|
||||
| Unit tests | ✅ | Ephemeral CA via `crypto/x509`. Fabricated `PeerCertificates`. Valid cert → user provisioned · no TLS → `ErrNoCert` · empty certs → `ErrNoCert` · no CN → `ErrInvalidCreds`. |
|
||||
| Integration tests | ✅ | Real TLS listener on localhost. No cert / wrong CA / expired → TLS handshake rejected. Valid cert → 200. Peer certificate CN + email visibility verified. |
|
||||
| evil-chat cleanup | done | ICD security tier: `finally` cleanup block + tighten `409` assertion. |
|
||||
| Workflow demo error surfacing | done | Replace silent `catch` with inline error + retry. |
|
||||
| Hello dashboard removal | done | Delete `packages/hello-dashboard/`. |
|
||||
|
||||
### v0.6.6 — Final Hardening
|
||||
|
||||
Final pass before public release. Security, correctness, and developer experience.
|
||||
**Rebrand**
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Extension dependency auto-activation | ✅ | Installing a package with unmet `depends`/`requires` auto-installs dependencies from the bundled set. If not bundled: clear error listing what's missing. |
|
||||
| `ValidateManifest()` gate | ✅ | Single `ValidateManifest()` function in `package_validate.go`. Called at install time (both upload and bundled). 12 unit tests. |
|
||||
| Package signing hook | ✅ | Optional `signature` field in manifest (reserved). `PACKAGE_VERIFY_SIGNATURES` env var (default false, log-only). No cryptographic code yet — schema slot reserved. |
|
||||
| OIDC state nonce validation | ✅ | `oidcClaims.Nonce` field added. `ValidateIDTokenNonce()` compares ID token nonce against stored state. Callback rejects mismatched nonces. |
|
||||
| Schema migration stub decision | ✅ | Stub replaced with log-only function documenting additive-only policy. Downgrade rejection preserved. |
|
||||
| ICD/SDK runner update pass | ✅ | ICD smoke tier: added metrics, cluster, backups, docs, OpenAPI JSON endpoints. SDK admin domain: added metrics, cluster, backups tests. |
|
||||
| Stale TODO resolution | ✅ | `main.go` session middleware: replaced with `OptionalAuth()` (auth if token present, anonymous pass-through). `auth.go:221` OIDC nonce: resolved. `starlark_helpers.go:96` migration stub: resolved. |
|
||||
| Light-mode icon SVG | done | New `favicon-light.svg` — square icon, transparent bg, dark node fills. Rename current `favicon-light.svg` (wordmark) to `wordmark.svg`. |
|
||||
| Dark-mode wordmark SVG | done | New `wordmark-dark.svg` — light text for dark backgrounds. |
|
||||
| Light-mode raster assets | done | `favicon-light-32.png`, `favicon-light-256.png`. |
|
||||
| PWA manifest description | done | "Self-hosted extension platform — build, compose, and run extensions." |
|
||||
| REBRAND-SPEC.md | | Land into `docs/`. Find/replace patterns, validation checklist, asset inventory. |
|
||||
| base.html favicon swap | done | Verify theme swap works with new square light icon. |
|
||||
|
||||
Then ship.
|
||||
**Tests**
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Shell topbar renders for extensions | done | Home, left slot, center slot, bell, user menu present. |
|
||||
| Topbar API (setLeft, setSlot, hide) | done | Custom content renders. Hide removes topbar. |
|
||||
| All 4 surfaces use shell topbar | done | No double topbars. Each pattern (A/B/C) renders correctly. |
|
||||
| User menu reactive to package install | | Install → menu updates without reload. |
|
||||
| Notification bell cross-surface sync | | Dismiss on Notes → clears on Chat. |
|
||||
| Inline error on API failure | | Error + retry shown, not empty list. |
|
||||
|
||||
### v0.7.1 — Surface Runner Framework
|
||||
|
||||
Design doc: `docs/DESIGN-surface-runners.md`
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Runner framework (`sw.testing`) | | SDK module: suite/test/assert, lifecycle hooks, structured JSON results. |
|
||||
| `requires` declarations | | Runner manifests declare dependencies. Missing packages → clean skip. |
|
||||
| Cleanup enforcement | | `s.track(type, id)` auto-deletes in `afterAll`. No leaked state. |
|
||||
| Warning tier | | pass / fail / warning. No silent catch swallowing. |
|
||||
| ICD runner migration | | Refactor to `sw.testing`. Test logic preserved. |
|
||||
| SDK runner migration | | Refactor to `sw.testing`. Domain suites preserved. |
|
||||
| Runner registry surface | | `/s/test-runners` — list runners, run-all, results dashboard. |
|
||||
|
||||
### v0.7.2 — Package Runners + CI Gate
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Notes runner | | CRUD, folders, tags, backlinks, search, rendering. |
|
||||
| Chat runner | | `requires: ["chat", "chat-core"]`. Channels, messaging, renderers. |
|
||||
| Schedules runner | | CRUD, cron, toggle, Starlark exec. |
|
||||
| Workflow runner | | `requires: ["content-approval"]`. Install detection, stages, signoff. |
|
||||
| Renderer runner | | `requires: ["mermaid-renderer"]`. Register contract, post-render hooks. |
|
||||
| Runner result API | | `POST /api/v1/test-runners/run`, `GET /results`. CI can curl and assert. |
|
||||
| CI integration | | `test-runners` stage in Gitea CI. PG + SQLite. Zero failures = pass. |
|
||||
|
||||
### v0.7.3 — Headless E2E Automation
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Playwright test harness | | `ci/e2e-surface-test.sh` — docker-compose, chromium, run-all, assert. |
|
||||
| Screenshot-on-failure | | Full-page screenshot + console log. CI artifacts. |
|
||||
| Navigation smoke test | | Playwright visits every surface. Asserts topbar, no JS errors, home link works. |
|
||||
| Visual regression baseline | | Optional screenshot diff. Not a gate — report for review. |
|
||||
| CI pipeline integration | | After unit tests + API runners. Failure blocks merge. |
|
||||
|
||||
### v0.7.4 — Documentation + Deferred Surface Work
|
||||
|
||||
| Step | Status | Description |
|
||||
|------|--------|-------------|
|
||||
| Permissions & Groups guide | | RBAC model, permission slugs with descriptions, group scoping, settings cascade. |
|
||||
| Workflows user guide | | Entry modes, stages, team roles, signoff gates, SLA, public forms. |
|
||||
| Docs content refresh | | Review all 5 existing docs for accuracy at v0.7.x. |
|
||||
| Extension config section docs | | Document `config_section` manifest field for Settings/Admin extensibility. |
|
||||
| Team Admin Workflows evaluation | | 723-line inline designer — extract to surface or split into files. Decision doc if needed. |
|
||||
|
||||
---
|
||||
|
||||
## Post-MVP
|
||||
## Post-v0.7.x
|
||||
|
||||
- LLM participation (`llm-bridge` extension: subscribes to `chat.message.created`, calls `provider.complete()`, streams response via `realtime.publish`, posts via `chat.send()`. Bot participants with persona config. Multi-model conversations.)
|
||||
- Rich media extensions: image generation, code sandbox, STT/TTS
|
||||
- Desktop app (Tauri or Electron)
|
||||
- Sidecar tier: container-based extensions
|
||||
- Federation: cross-instance package sharing
|
||||
- Plugin marketplace with signing and review
|
||||
- **LLM participation** (`llm-bridge` extension)
|
||||
- **Rich media extensions:** image generation, code sandbox, STT/TTS
|
||||
- **Desktop app** (Tauri or Electron)
|
||||
- **Sidecar tier:** container-based extensions
|
||||
- **Federation:** cross-instance package sharing
|
||||
- **Plugin marketplace** with signing and review
|
||||
|
||||
---
|
||||
|
||||
@@ -172,22 +188,24 @@ Then ship.
|
||||
|
||||
| Decision | Rationale |
|
||||
|----------|-----------|
|
||||
| Tasks → extension | Scheduler was the most entangled kernel component (~3,400 lines). Rebuilding as extension validates the trigger system and removes the worst compilation debt. Three trigger primitives (time, webhook, event) replace the monolithic scheduler. |
|
||||
| Sessions removed | Kernel-managed sessions replaced by workflow instances with dedicated storage (ext_data tables or kernel table). |
|
||||
| `custom` stage mode | Stage mode `custom` delegates to a surface package, proving extension composability. Chat-in-workflow is handled by the chat extension, not the kernel. |
|
||||
| Providers removed from kernel | Provider configs, model catalog, routing policies — all moved to extension track. Kernel provides credential storage (connections) and the Starlark `provider.complete` module as the interface. |
|
||||
| Kernel permissions simplified | 6 platform permissions. Extensions define their own capability requirements in manifests. |
|
||||
| Preact+htm retained | 3KB runtime, no build step, works for extension authors without bundler config. KISS. |
|
||||
| Single Docker image | Drop the frontend/backend split. Go binary + assets + migrations in one image. Simpler deployment, fewer moving parts. |
|
||||
| Admin → RBAC group | The `role` column is pre-RBAC. v0.2.0 replaces it with a seeded "Admins" group + `surface.admin.access` grant. All users auto-join "Everyone" group. Admin middleware becomes a grant check, not a role check. |
|
||||
| Settings cascade | RBAC controls scope auth (who can set at what level). `user_overridable` flag controls whether lower scopes can override higher. Two orthogonal axes, composes cleanly with extension manifests. |
|
||||
| No new migrations pre-MVP | Edit existing migration SQL files in place. No migration chains until schema is in production. |
|
||||
| Notes over Editor | First surface is Obsidian-style notes (rich text, folders, backlinks) instead of a code editor. Notes is a stronger E2E proof — it exercises ext_data, storage, and the SDK more fully than a pure-browser CM6 editor. |
|
||||
| No built-in auto-install | Extensions ship in the repo but are not auto-installed. Distribution model TBD — explicit install only. Keeps the kernel clean and avoids opinionated defaults. |
|
||||
| Chat as extension, not kernel | Human-to-human chat built entirely as library + surface packages. Zero kernel awareness of conversations, messages, or participants. Kernel gains one generic `realtime` module. Proves near-infinite extensibility. LLM participation layers on top via a separate bridge extension — the chat system doesn't know or care whether a participant is human or AI. |
|
||||
| PG as consensus layer | Horizontal scaling uses PG as the sole coordinator (UNLOGGED node_registry + LISTEN/NOTIFY). No etcd, Consul, Redis, or Raft. Rationale: system is already tightly coupled to PG; adding a second consensus layer doubles operational complexity for zero benefit at homelab-to-small-team scale. UNLOGGED table is visible to all connections, survives session disconnect, and cleans up automatically on PG crash — correct behavior since all nodes are dead anyway. Sweep-all for health (every node deletes stale rows) is simpler than ring topology and has no edge cases. |
|
||||
| Two trigger tiers | Event + webhook triggers are extension-declared (manifest contract, full sandbox). Scheduled tasks are user-created ad-hoc (restricted sandbox — no raw HTTP, no DB table creation, connections-only outbound). Separation keeps extension contracts static and user automation safe. |
|
||||
| Scheduled task identity | Tasks run as their creator (RBAC-scoped). Admin-created tasks can opt into system context. Creator deactivation pauses the schedule. Ensures audit trail and permission boundaries. |
|
||||
| Builtin package rationale | A builtin must enhance kernel surfaces or be required to demonstrate the platform's own capabilities. **notes** — primary content surface, exercises ext_data/storage/SDK/settings/realtime fully. **chat + chat-core** — primary communication surface, proves the extensibility thesis (100% extension, zero kernel awareness). **mermaid-renderer** — docs surface uses Mermaid diagrams to explain the architecture; without it the platform's own documentation doesn't render (self-bootstrapping). **schedules** — UI for the kernel's scheduled task system; without it users can't manage cron jobs (kernel primitive UI). All others are domain features, examples, dormant, or LLM-only tools — available via registry or `BUNDLED_PACKAGES=*`. |
|
||||
| Cluster dashboard retired | `cluster-dashboard` shipped as a standalone surface package (v0.6.0) as an expedient. Health/metrics belong inside the Admin surface as a tab — shared context, no separate nav entry, no install required. Merged in v0.6.4. |
|
||||
| Block renderers decoupled from chat | `mermaid-renderer`, `katex-renderer`, `csv-table`, `diff-viewer` shipped with `"requires": ["chat"]` because renderer discovery lived inside the chat surface. These are content renderers, not chat features. v0.6.4 removes the constraint; v0.6.5 lifts renderer registration to the kernel SDK so all surfaces share it without reimplementing discovery. |
|
||||
| Tasks → extension | Three trigger primitives replace the monolithic scheduler. |
|
||||
| Sessions removed | Workflow instances with dedicated storage replace kernel sessions. |
|
||||
| `custom` stage mode | Delegates to a surface package, proving extension composability. |
|
||||
| Providers removed from kernel | Connections + Starlark `provider.complete` as the interface. |
|
||||
| Kernel permissions simplified | 6 platform permissions. Extensions define their own. |
|
||||
| Preact+htm retained | 3KB runtime, no build step, KISS. |
|
||||
| Single Docker image | Go binary + assets + migrations. |
|
||||
| Admin → RBAC group | Grant check replaces role check. |
|
||||
| Settings cascade | Scope auth + `user_overridable`. Two orthogonal axes. |
|
||||
| No new migrations pre-MVP | Proper versioned migrations post-MVP. |
|
||||
| Chat as extension, not kernel | Zero kernel awareness. Proves extensibility thesis. |
|
||||
| PG as consensus layer | UNLOGGED node_registry + LISTEN/NOTIFY. No etcd/Consul/Redis. |
|
||||
| Two trigger tiers | Extension-declared (full sandbox) vs user ad-hoc (restricted). |
|
||||
| Builtin package rationale | Must enhance kernel surfaces or demonstrate platform capabilities. |
|
||||
| Two-slot topbar model | Left slot (title/branding) + center slot (`flex: 1`, tabs/pickers). Two named slots cover every navigation pattern: simple title (Pattern A), flat tabs full-width (Pattern B), category tabs + surface-owned sidebar (Pattern C). Surfaces without sub-items get full content width; surfaces with hierarchical navigation add their own sidebar below the topbar. Shell provides the stage; surface decides the theater. |
|
||||
| All four primary surfaces migrate to shell topbar | Admin was "keep custom topbar" initially. The two-slot model makes it unnecessary — category tabs fit in the center slot, sidebar is surface-owned below. One topbar implementation replaces four. Bell + user menu + reactivity come free on every surface. |
|
||||
| Settings / Team Admin → flat tabs (Pattern B) | Both had thin sidebars (~140px) that consumed width without justification. 5–6 sections fit cleanly in topbar tabs. Full-width content is a better use of space for these surfaces. |
|
||||
| Team Admin Groups removed | 37-line read-only dead-end. Admin Groups has full CRUD. Restore when properly designed. |
|
||||
| Docs is the reference surface | Only surface with shell Topbar, bell, user menu, inline errors. Others converge. |
|
||||
| Surface runners over expanding ICD | Different test tier, different failure class. |
|
||||
| Headless E2E via Playwright | Runners produce structured JSON; Playwright navigates and reads output. |
|
||||
|
||||
209
docs/AUDIT-surfaces.md
Normal file
209
docs/AUDIT-surfaces.md
Normal file
@@ -0,0 +1,209 @@
|
||||
# Surface Audit — Settings, Admin, Team Admin, Docs
|
||||
|
||||
## Audit Methodology
|
||||
|
||||
For each surface: read the index.js (tab/section structure), read every
|
||||
section module, check the HTML template, trace the topbar/navigation
|
||||
pattern, identify bugs, missing features, dead ends, and legacy baggage.
|
||||
|
||||
---
|
||||
|
||||
## 1. Settings Surface
|
||||
|
||||
**Files:** `src/js/sw/surfaces/settings/` (7 files, ~868 lines)
|
||||
**Template:** `surfaces/settings.html` — mounts into `#settings-mount`
|
||||
**Topbar:** Custom — back arrow + user icon + "Settings" title. No bell. No user menu.
|
||||
|
||||
### Sections
|
||||
|
||||
| Section | Lines | Status | Notes |
|
||||
|---------|-------|--------|-------|
|
||||
| General | 62 | ✅ OK | Default surface picker. Clean. |
|
||||
| Appearance | 78 | ✅ OK | Theme toggle (light/dark/system) + UI scale slider. |
|
||||
| Profile | 180 | ✅ OK | Display name, email, avatar upload, password change. |
|
||||
| Teams | 47 | ⚠️ Thin | Read-only list of your teams. No actions. No link to team admin. |
|
||||
| Connections | 222 | ✅ OK | Personal BYOK connection CRUD. Functional. |
|
||||
| Notifications | 96 | ✅ OK | Toggle notification types on/off. |
|
||||
|
||||
### Issues Found
|
||||
|
||||
| # | Severity | Issue |
|
||||
|---|----------|-------|
|
||||
| S1 | **P1** | **No notification bell.** Custom topbar renders back arrow + icon + "Settings" — no bell, no user menu dropdown. User can't see notifications or navigate to other surfaces without using the back button. |
|
||||
| S2 | **P2** | **Teams section is a dead-end.** Lists your teams with no actions — can't leave team, can't navigate to team admin, can't see team details. Just names. Should either link to team admin or show useful info. |
|
||||
| S3 | **P2** | **Back button uses sessionStorage return URL.** `sb_settings_return` stash means: open settings in a new tab → back goes to `/` (correct). But open settings from a deep link → back goes to referrer, which might be unexpected. Shell topbar with consistent home link would fix this. |
|
||||
| S4 | **P3** | **Extension config sections.** `__CONFIG_SECTIONS__` injection works but has no documentation. Extension authors don't know they can add settings sections. Needs a docs entry. |
|
||||
|
||||
### Shell Topbar Migration
|
||||
|
||||
Settings renders its own `settings-topbar`. With shell topbar injection:
|
||||
- **Option A (simple):** `sw.shell.topbar.hide()` and keep custom topbar. Works immediately.
|
||||
- **Option B (ideal):** Remove custom topbar. Shell topbar provides back + title + bell + user menu. Settings nav stays in the sidebar.
|
||||
- **Recommendation:** Option B. Settings topbar adds nothing the shell topbar doesn't. The back arrow just navigates to `/`.
|
||||
|
||||
---
|
||||
|
||||
## 2. Admin Surface
|
||||
|
||||
**Files:** `src/js/sw/surfaces/admin/` (13 files, ~2,522 lines)
|
||||
**Template:** `surfaces/admin.html` — mounts into `#admin-mount`
|
||||
**Topbar:** Custom — favicon + "Administration" + category tabs (People/Workflows/System/Monitoring) + UserMenu component. No notification bell.
|
||||
|
||||
### Sections
|
||||
|
||||
| Section | Category | Lines | Status | Notes |
|
||||
|---------|----------|-------|--------|-------|
|
||||
| Users | People | 152 | ✅ OK | User list, create, edit status/role. Functional. |
|
||||
| Teams | People | 178 | ✅ OK | Team list, create, member management. |
|
||||
| Groups | People | 207 | ✅ OK | Full CRUD — create, delete, permission toggles, member add/remove. Functional but **undocumented** (see issues). |
|
||||
| Workflows | Workflows | 163 | ⚠️ | CRUD + stage editor. `sw.api.workflows.list()` — needs same error-surfacing treatment as workflow-demo. |
|
||||
| Settings | System | 242 | ✅ OK | Comprehensive: default surface, registration, banner, message bar, footer, session TTLs, vault, package registry, email test. Actually solid. |
|
||||
| Storage | System | 76 | ✅ OK | Status cards, orphan cleanup. Clean. |
|
||||
| Packages | System | 391 | ⚠️ | Core feature. Large. Package list, install, uninstall, registry browse. **User menu doesn't update after install/uninstall** (main bug Jeff reported). |
|
||||
| Connections | System | 210 | ✅ OK | Global connection CRUD. |
|
||||
| Broadcast | System | 44 | ✅ OK | Send broadcast. Minimal. |
|
||||
| Backup | System | 162 | ✅ OK | Create/restore/download/delete. Works. |
|
||||
| Health | Monitoring | 209 | ✅ OK | Runtime, DB pool, cluster, extension metrics. |
|
||||
| Audit | Monitoring | 88 | ✅ OK | Audit log viewer with pagination. |
|
||||
|
||||
### Issues Found
|
||||
|
||||
| # | Severity | Issue |
|
||||
|---|----------|-------|
|
||||
| A1 | **P1** | **User menu not reactive to package changes.** `UserMenu` fetches surface list once on mount (`useEffect([authenticated])`). Installing/uninstalling a package doesn't trigger re-fetch. User must refresh the page to see new surfaces in the menu. Same for role changes (adding as team-admin). |
|
||||
| A2 | **P1** | **No notification bell.** Admin topbar has category tabs + UserMenu but no NotificationBell component. |
|
||||
| A3 | **P2** | **Groups: no documentation or inline help.** Admin Groups has full CRUD but zero explanation of what groups are, what permissions mean, or how the RBAC model works. "No groups" → user creates one → sees a list of permission slugs like `surface.admin.access` with no description. Every permission should have a human-readable description. |
|
||||
| A4 | **P2** | **Workflows: silent error potential.** `sw.api.workflows.list()` — if this fails, `catch (e) { sw.toast(e.message, 'error'); }` fires a toast but leaves the list empty. Better than workflow-demo's silent swallow, but the toast disappears and the user is left with an empty list + no context. Should show inline error state. |
|
||||
| A5 | **P2** | **Packages: no post-install feedback.** After installing a package, the package list refreshes (good) but the user menu doesn't update (bad — A1). User installs Notes, doesn't see it in the menu, thinks it's broken. |
|
||||
| A6 | **P3** | **Admin topbar favicon is hardcoded.** Line 142: `<img src="${BASE}/favicon.svg">`. Should respect light/dark theme favicon swap. |
|
||||
| A7 | **P3** | **Category icon rendering is fragile.** Custom compact SVG format (`C12 12 3\|M19.4 15...`) in `CatIcon`. Works but is unmaintainable — any icon change requires understanding the custom format. Should use standard SVG paths or lucide/feather icons. |
|
||||
|
||||
### Shell Topbar Migration
|
||||
|
||||
Admin has the most complex custom topbar — category tabs are genuinely useful navigation. Options:
|
||||
- **Option A (recommended):** `sw.shell.topbar.hide()`. Admin keeps its custom topbar but adds NotificationBell component to its existing right-side area next to UserMenu.
|
||||
- **Option B:** Shell topbar with `sw.shell.topbar.setSlot()` for category tabs. Works but requires rethinking the layout since shell topbar has fixed structure (home | title | slot | bell | user).
|
||||
- **Recommendation:** Option A for v0.7.0. Admin's custom topbar is bespoke enough to warrant keeping. Just wire in the bell.
|
||||
|
||||
---
|
||||
|
||||
## 3. Team Admin Surface
|
||||
|
||||
**Files:** `src/js/sw/surfaces/team-admin/` (7 files, ~1,119 lines)
|
||||
**Template:** `surfaces/team-admin.html` — mounts into `#team-admin-mount`
|
||||
**Topbar:** Custom — back arrow + "Team Admin: {team name}" title. No bell. No user menu.
|
||||
|
||||
### Sections
|
||||
|
||||
| Section | Lines | Status | Notes |
|
||||
|---------|-------|--------|-------|
|
||||
| Members | ~90 | ✅ OK | Member list, add, remove. Functional. |
|
||||
| Groups | 37 | ❌ Dead-end | Read-only "No groups" display. No create, no docs, no link to admin. |
|
||||
| Connections | ~120 | ✅ OK | Team-scoped connections. Same pattern as user/admin connections. |
|
||||
| Workflows | 723 | ⚠️ Massive | Three tabs: Workflows (CRUD + inline stage editor), Assignments (claim/release/complete), Monitor (active instances + signoff). This is 65% of the surface's code. |
|
||||
| Settings | 72 | ✅ OK | Team name + description. Clean. |
|
||||
| Activity | ~80 | ✅ OK | Audit log. Works. |
|
||||
|
||||
### Issues Found
|
||||
|
||||
| # | Severity | Issue |
|
||||
|---|----------|-------|
|
||||
| T1 | **P1** | **Groups is a dead-end.** 37 lines. Read-only list of team groups. No "Create Group" button. No explanation of what groups are. No link to Admin > Groups where creation actually happens. A team admin user who isn't a platform admin literally cannot create team groups. The Admin groups page supports `scope: team` but that creates a global group with team scope — it's unclear if team-admin should even see groups at all. |
|
||||
| T2 | **P1** | **Workflows "Adopt Global" — same silent-error class.** `sw.api.teams.availableWorkflows(teamId)` — if this fails, the catch fires a toast but the adopt panel shows "No global workflows available" — indistinguishable from "there genuinely aren't any" vs "the API errored." |
|
||||
| T3 | **P1** | **Workflows is disproportionately complex.** 723 lines — inline stage editor with mode/type selectors, SLA fields, stage reordering, team role assignment per stage. This is a full workflow designer embedded in a tab. It works but it's a maintenance burden and the UX is dense. Question: should this complexity live here or be a separate workflow-designer surface? |
|
||||
| T4 | **P1** | **No notification bell.** Same as Settings — custom topbar with no bell. |
|
||||
| T5 | **P2** | **No user menu.** Unlike Admin (which renders UserMenu), Team Admin has no user menu in its topbar. User can't navigate to other surfaces except via the back button. |
|
||||
| T6 | **P2** | **Signoff panel shows raw user_id.** Line 714: `<span>${s.user_id}</span>` — shows UUID instead of display name. Should use `sw.users.displayName(s.user_id)`. |
|
||||
| T7 | **P3** | **Back button uses sessionStorage.** Same pattern as Settings (`sb_team_admin_return`). Shell topbar would fix. |
|
||||
|
||||
### Shell Topbar Migration
|
||||
|
||||
Team Admin has a simple topbar (back + title). Direct replacement:
|
||||
- Shell topbar provides: home link + "Team Admin: {name}" title + bell + user menu.
|
||||
- Team name from `sw.api.teams.get(teamId)` → `sw.shell.topbar.setTitle('Team Admin: ' + team.name)`.
|
||||
- Delete the custom topbar entirely.
|
||||
|
||||
---
|
||||
|
||||
## 4. Docs Surface
|
||||
|
||||
**Files:** `src/js/sw/surfaces/docs/` (1 file, 313 lines)
|
||||
**Template:** `surfaces/docs.html` — mounts into `#docs-mount`
|
||||
**Topbar:** Imports and renders `shell/topbar.js` (the SDK Topbar component). **Only surface that uses the shell Topbar.**
|
||||
|
||||
### Features
|
||||
|
||||
| Feature | Status | Notes |
|
||||
|---------|--------|-------|
|
||||
| Document list sidebar | ✅ OK | Fetches from `/api/v1/docs`, renders nav links. |
|
||||
| Markdown rendering | ✅ OK | Uses `sw.markdown.renderSync()` + post-renderers (mermaid, katex). |
|
||||
| Document outline | ✅ OK | Parses H1-H4 from markdown, renders table of contents. |
|
||||
| Search | ✅ OK | Filters documents in sidebar. |
|
||||
| URL updates | ✅ OK | `history.replaceState` on doc change. |
|
||||
| Topbar | ✅ OK | Uses shell `Topbar` component — has title, bell, user menu. |
|
||||
|
||||
### Issues Found
|
||||
|
||||
| # | Severity | Issue |
|
||||
|---|----------|-------|
|
||||
| D1 | **P2** | **Stale content.** The docs themselves may be outdated — GETTING-STARTED, EXTENSION-GUIDE, API-REFERENCE, DEPLOYMENT, PACKAGE-FORMAT were written in v0.6.1. 18 versions later, some content is likely stale. Needs a content review pass. |
|
||||
| D2 | **P3** | **No docs for RBAC/Groups.** Admin Groups exists with full CRUD but there's no documentation explaining the permission model, what each permission slug means, how groups interact with teams, or how the settings cascade works. This directly causes the "groups WTF" reaction. |
|
||||
| D3 | **P3** | **No docs for Workflows.** The workflow engine is complex (multi-stage, team roles, signoff gates, SLA, public entry) but has no user-facing documentation. `DESIGN-WORKFLOWS.md` exists but is a design doc, not a user guide. |
|
||||
| D4 | **P3** | **Shell topbar migration.** Docs already imports `shell/topbar.js` — when shell topbar injection lands, Docs will get a double topbar. Needs migration: delete the import, let shell topbar handle it. Docs currently passes no custom slot content, so it's a pure delete. |
|
||||
|
||||
---
|
||||
|
||||
## Cross-Surface Issues
|
||||
|
||||
These affect multiple or all surfaces:
|
||||
|
||||
| # | Severity | Issue | Surfaces |
|
||||
|---|----------|-------|----------|
|
||||
| X1 | **P0** | **User menu not reactive.** Package install/uninstall, role changes, team membership changes — none trigger a menu refresh. User must reload the page. | All (via UserMenu component) |
|
||||
| X2 | **P1** | **No notification bell on 3/4 surfaces.** Only Docs has a bell (via Topbar import). Settings, Admin, and Team Admin all lack it. | Settings, Admin, Team Admin |
|
||||
| X3 | **P1** | **No user menu on 2/4 surfaces.** Settings and Team Admin have no user menu at all. Admin and Docs have one. | Settings, Team Admin |
|
||||
| X4 | **P2** | **Every surface has its own topbar.** Four different topbar implementations. None use the (not-yet-existing) shell topbar injection. Shell topbar (v0.7.0) eliminates this duplication. | All |
|
||||
| X5 | **P2** | **Silent error swallowing.** Multiple sections use `catch (e) { toast }` which fires a toast and leaves an empty/stale UI. Toast disappears after seconds; user is left confused. Every list endpoint needs an inline error state with retry. | Admin Workflows, Team Admin Workflows, Packages |
|
||||
| X6 | **P2** | **Empty states provide no guidance.** "No groups", "No workflows", "No notifications" — no explanation of what the feature is, why it's empty, or what action to take. Every empty state should have a one-line explanation and a primary action (create, link to docs, etc.). | Admin Groups, Team Admin Groups, Workflows |
|
||||
| X7 | **P3** | **Raw IDs in UI.** Team Admin signoff panel shows `user_id` UUIDs. Any surface showing IDs should resolve via `sw.users.displayName()`. | Team Admin Workflows |
|
||||
|
||||
---
|
||||
|
||||
## Recommendations
|
||||
|
||||
### Immediate (fold into v0.7.0)
|
||||
|
||||
1. **User menu reactivity** — emit `package.changed` and `auth.changed` events over WS + local custom events. UserMenu listens and re-fetches surface list. This is the single most impactful fix.
|
||||
|
||||
2. **Shell topbar migration for Settings + Team Admin** — both have simple topbars that the shell topbar directly replaces. Docs deletes its Topbar import. Admin keeps its custom topbar but adds NotificationBell.
|
||||
|
||||
3. **Remove Team Admin Groups tab** — it's 37 lines of dead-end. Team-scoped group management should either (a) be added properly with create/edit/delete or (b) removed until it's properly designed. Showing "No groups" with no path forward is worse than not showing the tab.
|
||||
|
||||
4. **Error states** — replace `catch { toast }` with inline error + retry UI on every list endpoint. Systematic pass across all four surfaces.
|
||||
|
||||
5. **Empty state copy** — every "No X" message gets a one-line explanation + primary action button or doc link.
|
||||
|
||||
### Deferred (v0.7.1+ / runner coverage)
|
||||
|
||||
6. **Admin Groups documentation** — write a "Permissions & Groups" doc for the docs surface. Explain the RBAC model, list all permission slugs with descriptions, explain group scoping.
|
||||
|
||||
7. **Workflow user guide** — write a "Workflows" doc. Entry modes, stage types, team roles, signoff gates, SLA.
|
||||
|
||||
8. **Team Admin Workflows simplification** — the 723-line inline stage editor is the most complex piece of UI in the entire application. Consider extracting to a dedicated workflow-designer surface or at minimum breaking into separate files.
|
||||
|
||||
9. **Docs content refresh** — review all 5 docs for accuracy at v0.6.18+.
|
||||
|
||||
10. **Settings Teams section** — either add useful actions (link to team admin, show team role, leave team) or remove the tab.
|
||||
|
||||
---
|
||||
|
||||
## Asset Inventory
|
||||
|
||||
| Surface | Lines (total) | Sections | Custom Topbar | Bell | UserMenu | Error Handling |
|
||||
|---------|--------------|----------|---------------|------|----------|---------------|
|
||||
| Settings | 868 | 6 | Yes (back+icon) | ❌ | ❌ | Toast only |
|
||||
| Admin | 2,522 | 12 | Yes (tabs+menu) | ❌ | ✅ | Toast only |
|
||||
| Team Admin | 1,119 | 6 | Yes (back+title) | ❌ | ❌ | Toast only |
|
||||
| Docs | 313 | 1 | Shell Topbar ✅ | ✅ | ✅ | Inline error ✅ |
|
||||
|
||||
Docs is the gold standard. The other three need to converge toward its pattern.
|
||||
448
docs/DESIGN-shell-contract.md
Normal file
448
docs/DESIGN-shell-contract.md
Normal file
@@ -0,0 +1,448 @@
|
||||
# DESIGN: Shell Contract — v0.7.0
|
||||
|
||||
## Status: Proposed
|
||||
|
||||
## Problem
|
||||
|
||||
Extension surfaces render into `#extension-mount` with no shell chrome.
|
||||
A full audit (docs/AUDIT-surfaces.md) found: 3/4 primary surfaces lack a
|
||||
notification bell, 2/4 lack a user menu, 4 different topbar implementations,
|
||||
user menu never updates on package/role changes, toast-and-forget error
|
||||
handling, and empty states that explain nothing.
|
||||
|
||||
## Solution
|
||||
|
||||
### 1. Shell Topbar — Two-Slot Model
|
||||
|
||||
The kernel injects a topbar for all extension surfaces. Two named slots
|
||||
(left + center) let surfaces customize without replacing the entire bar.
|
||||
|
||||
**Layout:**
|
||||
|
||||
```
|
||||
┌──────────────────────────────────────────────────────────────┐
|
||||
│ ← │ [left] │ [center: flex-1] │ 🔔 │ 👤 │
|
||||
└──────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
- **← (home):** Always visible. Navigates to `__BASE__/`. Simple `<a>`.
|
||||
- **Left slot:** Defaults to manifest title. Surfaces override with `setLeft()`.
|
||||
- **Center slot:** Empty by default. Surfaces inject tabs, search, pickers.
|
||||
`flex: 1` — expands to fill available space.
|
||||
- **Bell + User Menu:** Always visible. Kernel-managed.
|
||||
|
||||
**Template change** (`surfaces/extension.html`):
|
||||
|
||||
```html
|
||||
{{define "surface-extension"}}
|
||||
<div id="extension-surface" class="extension-surface"
|
||||
data-surface-id="{{.Surface}}">
|
||||
<div id="shell-topbar" class="sw-topbar sw-topbar--shell"></div>
|
||||
<div id="extension-mount" class="extension-mount" data-ext="{{.Surface}}"></div>
|
||||
</div>
|
||||
{{end}}
|
||||
```
|
||||
|
||||
**SDK API:**
|
||||
|
||||
```js
|
||||
sw.shell.topbar.setLeft(vnode) // Override left slot (default: title)
|
||||
sw.shell.topbar.setSlot(vnode) // Set center slot content
|
||||
sw.shell.topbar.setTitle(str) // Shorthand: setLeft with plain text
|
||||
sw.shell.topbar.hide() // Remove topbar entirely
|
||||
sw.shell.topbar.show() // Restore after hiding
|
||||
```
|
||||
|
||||
### 2. Three Navigation Patterns
|
||||
|
||||
The shell topbar provides the top bar. What happens below it is the
|
||||
surface's business. Three patterns emerge naturally:
|
||||
|
||||
#### Pattern A — Default (simple extensions, Docs)
|
||||
|
||||
```
|
||||
┌──────────────────────────────────────────┐
|
||||
│ ← │ Surface Title │ 🔔 │ 👤 │
|
||||
├──────────────────────────────────────────┤
|
||||
│ │
|
||||
│ Content (full width) │
|
||||
│ │
|
||||
└──────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
Title only, no tabs, no sidebar. Content gets everything.
|
||||
Zero code required — kernel defaults handle it.
|
||||
|
||||
**Used by:** Docs, Notes, Chat, simple extensions.
|
||||
|
||||
#### Pattern B — Flat Tabs (no sidebar, full width)
|
||||
|
||||
```
|
||||
┌──────────────────────────────────────────────────────────┐
|
||||
│ ← │ Title │ Tab1 │ Tab2 │ Tab3 │ Tab4 │ │ 🔔 │ 👤 │
|
||||
├──────────────────────────────────────────────────────────┤
|
||||
│ │
|
||||
│ Content (full width, no sidebar) │
|
||||
│ │
|
||||
└──────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
Tabs in the topbar center slot. No sidebar — content fills the full
|
||||
viewport width. For surfaces with 3–7 sections that don't have sub-items.
|
||||
More real estate for content than a sidebar layout.
|
||||
|
||||
**Surface code:**
|
||||
|
||||
```js
|
||||
sw.shell.topbar.setSlot(html`
|
||||
<div class="sw-topbar__tabs">
|
||||
${sections.map(s => html`
|
||||
<a class="sw-topbar__tab ${active === s.key ? 'active' : ''}"
|
||||
href=${s.href} onClick=${navigate}>${s.label}</a>
|
||||
`)}
|
||||
</div>
|
||||
`);
|
||||
```
|
||||
|
||||
**Used by:** Team Admin (Members / Connections / Workflows / Settings / Activity),
|
||||
Settings, Schedules.
|
||||
|
||||
#### Pattern C — Category Tabs + Sidebar (two-level)
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────┐
|
||||
│ ← │ Title │ People │ Workflows │ System │ Mon │ 🔔 │ 👤 │
|
||||
├──────────┬──────────────────────────────────────────────────┤
|
||||
│ Users │ │
|
||||
│ Teams │ Content │
|
||||
│ Groups │ │
|
||||
│ │ │
|
||||
└──────────┴──────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
Major categories in the topbar (via center slot). Surface renders its own
|
||||
sidebar inside the content area for sub-navigation within the active
|
||||
category. The shell topbar doesn't know about the sidebar — it's a
|
||||
surface-level div below `#extension-mount`.
|
||||
|
||||
**Surface code:**
|
||||
|
||||
```js
|
||||
// Topbar: major categories
|
||||
sw.shell.topbar.setLeft(html`
|
||||
<img src="${BASE}/favicon.svg" width="18" height="18" style="vertical-align:-3px" />
|
||||
<span style="margin-left:6px">Administration</span>
|
||||
`);
|
||||
sw.shell.topbar.setSlot(html`
|
||||
<div class="sw-topbar__tabs">
|
||||
${categories.map(c => html`
|
||||
<a class="sw-topbar__tab ${activeCat === c.key ? 'active' : ''}"
|
||||
href=${c.href} onClick=${navigate}>
|
||||
<${CatIcon} paths=${c.icon} /> ${c.label}
|
||||
</a>
|
||||
`)}
|
||||
</div>
|
||||
`);
|
||||
|
||||
// Content area: sidebar is surface-owned
|
||||
return html`
|
||||
<div class="admin-body">
|
||||
<div class="admin-nav">
|
||||
${sidebarSections.map(s => html`...`)}
|
||||
</div>
|
||||
<div class="admin-content">
|
||||
<${SectionComponent} />
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
```
|
||||
|
||||
**Used by:** Admin.
|
||||
|
||||
### 3. Kernel-Provided Tab CSS
|
||||
|
||||
The kernel provides `.sw-topbar__tabs` and `.sw-topbar__tab` CSS so
|
||||
surfaces get consistent tab styling. Not required — surfaces can style
|
||||
their own slot content however they want.
|
||||
|
||||
```css
|
||||
.sw-topbar__tabs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-1);
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.sw-topbar__tab {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-2);
|
||||
padding: var(--sp-2) var(--sp-3);
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: var(--text-2);
|
||||
text-decoration: none;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: color var(--transition), background var(--transition);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.sw-topbar__tab:hover {
|
||||
color: var(--text);
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
|
||||
.sw-topbar__tab.active {
|
||||
color: var(--text);
|
||||
background: var(--bg-2);
|
||||
}
|
||||
```
|
||||
|
||||
### 4. Primary Surface Migrations
|
||||
|
||||
#### Settings → Pattern B (flat tabs)
|
||||
|
||||
Currently: custom topbar (back + icon + "Settings"), sidebar nav.
|
||||
After: shell topbar with flat tabs, no sidebar. Content full width.
|
||||
|
||||
Settings has 6 sections (General / Appearance / Profile / Teams /
|
||||
Connections / Notifications) — perfect for flat tabs. The sidebar was
|
||||
thin (~140px) and ate width from the content area for no good reason.
|
||||
|
||||
**Migration:**
|
||||
- Delete `settings-topbar` div and CSS.
|
||||
- Delete sidebar nav. Move section links into `sw.shell.topbar.setSlot()`.
|
||||
- Remove `sb_settings_return` sessionStorage — shell home link handles it.
|
||||
- Content area becomes full-width.
|
||||
- Fix Teams section: add "Open Team Admin →" link, show role, add leave action.
|
||||
|
||||
Extension config sections (`__CONFIG_SECTIONS__`) render as additional
|
||||
tabs after the divider. Same as today, just in the topbar instead of sidebar.
|
||||
|
||||
#### Admin → Pattern C (category tabs + sidebar)
|
||||
|
||||
Currently: custom topbar (favicon + "Administration" + category tabs + UserMenu).
|
||||
After: shell topbar with category tabs in center slot, surface-owned sidebar.
|
||||
|
||||
**Migration:**
|
||||
- Delete custom `admin-topbar` div and CSS.
|
||||
- `sw.shell.topbar.setLeft()` with favicon + "Administration".
|
||||
- `sw.shell.topbar.setSlot()` with category tabs (People / Workflows / System / Monitoring).
|
||||
- Bell and user menu come from the shell — delete the explicit `<${UserMenu}>`.
|
||||
- Admin sidebar and content area unchanged — they're below the topbar.
|
||||
- Delete custom `CatIcon` renderer if category tab icons use standard SVG.
|
||||
- Fix hardcoded `favicon.svg` — left slot can use theme-aware image.
|
||||
|
||||
**Result:** Admin looks identical to today but its topbar is kernel-managed.
|
||||
Bell added for free. User menu reactive for free.
|
||||
|
||||
#### Team Admin → Pattern B (flat tabs)
|
||||
|
||||
Currently: custom topbar (back + "Team Admin: {name}"), sidebar nav.
|
||||
After: shell topbar with flat tabs, no sidebar.
|
||||
|
||||
With Groups removed, Team Admin has 5 sections: Members / Connections /
|
||||
Workflows / Settings / Activity. Perfect for flat tabs.
|
||||
|
||||
**Migration:**
|
||||
- Delete `team-admin-topbar` div and CSS.
|
||||
- `sw.shell.topbar.setTitle('Team Admin: ' + team.name)` after team fetch.
|
||||
- Section tabs into `sw.shell.topbar.setSlot()`.
|
||||
- Delete sidebar nav. Content full-width.
|
||||
- Remove `sb_team_admin_return` sessionStorage.
|
||||
- Remove Groups tab entirely (37-line dead-end).
|
||||
- Fix signoff display: `user_id` → `sw.users.displayName()`.
|
||||
|
||||
#### Docs → Pattern A (default)
|
||||
|
||||
Currently: imports `shell/topbar.js` and renders it explicitly.
|
||||
After: shell topbar auto-renders. No surface code needed.
|
||||
|
||||
**Migration:**
|
||||
- Delete `import { Topbar }` and `<${Topbar}>` render.
|
||||
- Shell topbar provides title + bell + user menu automatically.
|
||||
- Docs sidebar (document list) is in the content area, unaffected.
|
||||
|
||||
### 5. User Menu Reactivity
|
||||
|
||||
**The single most impactful fix.**
|
||||
|
||||
**Backend — new WS events:**
|
||||
|
||||
```go
|
||||
// After package install/uninstall/enable/disable:
|
||||
h.hub.BroadcastToUser(userID, "package.changed", map[string]string{
|
||||
"action": "installed", "id": packageID,
|
||||
})
|
||||
|
||||
// After team role/membership change:
|
||||
h.hub.BroadcastToUser(userID, "auth.changed", map[string]string{
|
||||
"reason": "team_role",
|
||||
})
|
||||
```
|
||||
|
||||
**Frontend** (`user-menu.js`):
|
||||
|
||||
```js
|
||||
useEffect(() => {
|
||||
if (!sw?.api?.surfaces?.list) return;
|
||||
|
||||
function fetchSurfaces() {
|
||||
sw.api.surfaces.list().then(data => {
|
||||
const raw = Array.isArray(data) ? data : data?.data || [];
|
||||
setAllSurfaces(raw);
|
||||
}).catch(() => {});
|
||||
}
|
||||
|
||||
fetchSurfaces();
|
||||
|
||||
const off1 = sw.on?.('package.changed', fetchSurfaces);
|
||||
const off2 = sw.on?.('auth.changed', fetchSurfaces);
|
||||
|
||||
return () => {
|
||||
if (typeof off1 === 'function') off1();
|
||||
if (typeof off2 === 'function') off2();
|
||||
};
|
||||
}, [authenticated]);
|
||||
```
|
||||
|
||||
**Event inventory:**
|
||||
|
||||
| Event | Trigger | Payload |
|
||||
|-------|---------|---------|
|
||||
| `package.changed` | Install, uninstall, enable, disable | `{ action, id }` |
|
||||
| `auth.changed` | Team role change, group membership change | `{ reason }` |
|
||||
| `notification.read` | Mark notification read | `{ id }` |
|
||||
| `notification.all_read` | Mark all read | `{}` |
|
||||
|
||||
### 6. Notification Read Broadcast
|
||||
|
||||
**Backend** — after `MarkRead()` / `MarkAllRead()`:
|
||||
|
||||
```go
|
||||
h.hub.BroadcastToUser(userID, "notification.read", map[string]string{"id": id})
|
||||
h.hub.BroadcastToUser(userID, "notification.all_read", nil)
|
||||
```
|
||||
|
||||
**Frontend** — `NotificationBell` listens for `.created`, `.read`, `.all_read`:
|
||||
|
||||
```js
|
||||
const onRead = (e) => {
|
||||
setNotifications(prev => prev.map(n =>
|
||||
n.id === e.id ? { ...n, read_at: new Date().toISOString() } : n
|
||||
));
|
||||
};
|
||||
const onAllRead = () => {
|
||||
setNotifications(prev => prev.map(n => ({
|
||||
...n, read_at: n.read_at || new Date().toISOString()
|
||||
})));
|
||||
};
|
||||
```
|
||||
|
||||
### 7. Shell Announcement Global Dismiss
|
||||
|
||||
On dismiss, write: `localStorage.setItem('armature_dismissed_' + hash(text), '1')`.
|
||||
On mount, check. New announcements (changed text) show again.
|
||||
|
||||
Implementation: inline `<script>` in `base.html` — checks localStorage on
|
||||
DOMContentLoaded. Dismiss button writes the key. Works on every surface
|
||||
including login.
|
||||
|
||||
### 8. Error Handling Pass
|
||||
|
||||
**Pattern** — inline error + retry replaces toast-and-forget:
|
||||
|
||||
```js
|
||||
const [error, setError] = useState(null);
|
||||
|
||||
async function load() {
|
||||
setError(null);
|
||||
try {
|
||||
const data = await sw.api.whatever.list();
|
||||
setItems(data || []);
|
||||
} catch (e) { setError(e.message); }
|
||||
}
|
||||
|
||||
// In render:
|
||||
${error && html`
|
||||
<div class="sw-inline-error">
|
||||
<span>${error}</span>
|
||||
<button class="sw-btn sw-btn--secondary sw-btn--sm"
|
||||
onClick=${load}>Retry</button>
|
||||
</div>
|
||||
`}
|
||||
```
|
||||
|
||||
**New CSS class** (`sw-primitives.css`):
|
||||
|
||||
```css
|
||||
.sw-inline-error {
|
||||
display: flex; align-items: center; gap: var(--sp-3);
|
||||
padding: var(--sp-3) var(--sp-4);
|
||||
background: var(--bg-2); border: 1px solid var(--danger);
|
||||
border-radius: var(--radius); font-size: 13px; color: var(--danger);
|
||||
}
|
||||
```
|
||||
|
||||
**Sections requiring this pass:**
|
||||
|
||||
| Surface | Section | Current | After |
|
||||
|---------|---------|---------|-------|
|
||||
| Admin | Workflows | Toast + empty | Inline error + retry |
|
||||
| Admin | Packages | Toast + empty | Inline error + retry |
|
||||
| Admin | Groups | Toast + empty | Inline error + retry |
|
||||
| Team Admin | Workflows (adopt) | Toast + "No global workflows" | Inline error + retry |
|
||||
| Team Admin | Members | Toast + empty | Inline error + retry |
|
||||
| Settings | General | Console warn | Inline error + retry |
|
||||
| Settings | Teams | Toast + empty | Inline error + retry |
|
||||
| Workflow Demo (pkg) | Main | Silent swallow | Inline error + retry |
|
||||
|
||||
### 9. Empty State Guidance
|
||||
|
||||
Every "No X" empty state gets: one-line explanation, primary action or doc link.
|
||||
|
||||
| Surface | Section | Current | After |
|
||||
|---------|---------|---------|-------|
|
||||
| Admin | Groups | "No groups" | "Groups control access to surfaces and features via permissions." + Create button |
|
||||
| Admin | Workflows | "No workflows" | "Workflows define multi-stage approval processes with team roles and SLA tracking." + Create button |
|
||||
| Admin | Teams | "No teams" | "Teams group users for shared connections, workflows, and access control." + Create button |
|
||||
| Team Admin | Workflows | "No workflows — create one or adopt" | Add: "Adopt copies a global workflow for this team to customize." |
|
||||
| Settings | Notifications | "No notification preferences" | "Preferences appear when notification types are configured by an administrator." |
|
||||
|
||||
## Rebrand Asset Inventory
|
||||
|
||||
### Current → Target
|
||||
|
||||
| File | Current | Target |
|
||||
|------|---------|--------|
|
||||
| `favicon.svg` | Dark icon ✅ | Unchanged |
|
||||
| `favicon-light.svg` | **MISNAMED** (520×80 wordmark) | Square icon, light mode **(NEW)** |
|
||||
| `favicon-32.png` | Dark raster ✅ | Unchanged |
|
||||
| `favicon-256.png` | Dark raster ✅ | Unchanged |
|
||||
| `favicon-light-32.png` | Missing | Light raster **(NEW)** |
|
||||
| `favicon-light-256.png` | Missing | Light raster **(NEW)** |
|
||||
| `favicon.ico` | Dark ✅ | Unchanged |
|
||||
| `wordmark.svg` | Missing | **RENAMED** from current `favicon-light.svg` |
|
||||
| `wordmark-dark.svg` | Missing | Light text #E5E5E5 on transparent **(NEW)** |
|
||||
| `manifest.json` | "Self-hosted AI chat..." | "Self-hosted extension platform..." |
|
||||
|
||||
## Bug Fixes (bundled)
|
||||
|
||||
- **evil-chat:** `finally` cleanup + tighten `409` assertion.
|
||||
- **Workflow demo:** Silent `catch` → inline error + retry.
|
||||
- **Hello dashboard:** Delete `packages/hello-dashboard/`.
|
||||
|
||||
## Changeset Plan
|
||||
|
||||
| CS | Scope | Description |
|
||||
|----|-------|-------------|
|
||||
| CS-1 | Backend (Go) | WS events: `notification.read`, `notification.all_read`, `package.changed`, `auth.changed`. Tests. |
|
||||
| CS-2 | Frontend (JS + HTML) | Shell topbar component, SDK API (`setLeft`/`setSlot`/`setTitle`/`hide`), extension.html template, SDK boot auto-mount. |
|
||||
| CS-3 | Frontend (JS) | User menu reactivity: listen for `package.changed` + `auth.changed`. Notification bell: listen for `.read` + `.all_read`. |
|
||||
| CS-4 | Frontend (JS + HTML) | Surface migrations: Settings → Pattern B, Admin → Pattern C, Team Admin → Pattern B, Docs → Pattern A. Delete custom topbars. |
|
||||
| CS-5 | Frontend (JS + CSS) | Error handling pass + empty state guidance. `sw-inline-error` CSS. All sections from inventory. |
|
||||
| CS-6 | Frontend (JS) | Announcement global dismiss (localStorage). |
|
||||
| CS-7 | Static + docs | Rebrand assets, manifest.json, REBRAND-SPEC.md. |
|
||||
| CS-8 | Frontend (JS) | Bug fixes: evil-chat cleanup, workflow demo error, hello-dashboard deletion. |
|
||||
|
||||
Each changeset independently CI-green.
|
||||
407
docs/DESIGN-surface-runners.md
Normal file
407
docs/DESIGN-surface-runners.md
Normal file
@@ -0,0 +1,407 @@
|
||||
# DESIGN: Surface Runners — v0.7.1–v0.7.3
|
||||
|
||||
## Status: Proposed
|
||||
|
||||
## Problem
|
||||
|
||||
Armature has two test tiers today:
|
||||
|
||||
1. **Go unit tests** — test store methods, handlers, middleware, sandbox.
|
||||
Run in CI on every push. Coverage is good for kernel internals.
|
||||
|
||||
2. **ICD/SDK test runners** — browser-based test suites that validate API
|
||||
endpoint contracts and SDK domain methods. Run manually by navigating
|
||||
to `/s/icd-test-runner` or `/s/sdk-test-runner`.
|
||||
|
||||
Neither tier catches the class of bugs discovered during manual testing:
|
||||
|
||||
- **Cross-surface state:** Notification bell state not syncing, announcement
|
||||
dismiss not persisting across surface navigations.
|
||||
- **Package integration:** Workflow demo shows "not installed" because its
|
||||
API call fails silently. The API works (unit tests pass); the surface's
|
||||
integration with the API is broken.
|
||||
- **Test side-effects:** ICD security tests install `evil.surface` with no
|
||||
cleanup — it leaks into the menu.
|
||||
- **Surface lifecycle:** Surfaces fail to load, mount into wrong containers,
|
||||
miss SDK boot, or render without shell chrome.
|
||||
|
||||
These are integration bugs — they live at the boundary between kernel and
|
||||
package, between surface and surface, between API and UI. They require a
|
||||
new test tier.
|
||||
|
||||
## Solution Overview
|
||||
|
||||
Three deliverables across three versions:
|
||||
|
||||
| Version | Deliverable | What it catches |
|
||||
|---------|-------------|-----------------|
|
||||
| v0.7.1 | Runner framework (`sw.testing`) | Framework bugs, standardizes existing runners |
|
||||
| v0.7.2 | Package runners + CI gate | Package integration bugs, regressions |
|
||||
| v0.7.3 | Headless E2E (Playwright) | DOM rendering bugs, navigation flows, visual regressions |
|
||||
|
||||
## v0.7.1 — Runner Framework
|
||||
|
||||
### `sw.testing` SDK Module
|
||||
|
||||
New kernel SDK module at `src/js/sw/sdk/testing.js`. Provides structured
|
||||
test authoring, lifecycle hooks, cleanup tracking, and machine-readable
|
||||
results.
|
||||
|
||||
```js
|
||||
// Extension runner registers suites during load
|
||||
sw.testing.suite('notes-crud', async (s) => {
|
||||
let folderId, noteId;
|
||||
|
||||
s.beforeAll(async () => {
|
||||
// Setup: create a test folder
|
||||
const r = await sw.api.post('/api/v1/ext/notes/folders', {
|
||||
name: 'test-' + Date.now()
|
||||
});
|
||||
folderId = r.id;
|
||||
s.track('folder', folderId); // auto-cleanup
|
||||
});
|
||||
|
||||
s.test('create note', async (t) => {
|
||||
const r = await sw.api.post('/api/v1/ext/notes/notes', {
|
||||
title: 'Test Note', folder_id: folderId, content: '# Hello'
|
||||
});
|
||||
t.assert.ok(r.id, 'note has ID');
|
||||
t.assert.eq(r.title, 'Test Note');
|
||||
noteId = r.id;
|
||||
t.track('note', noteId); // auto-cleanup
|
||||
});
|
||||
|
||||
s.test('renderers fire', async (t) => {
|
||||
// Test that mermaid block in note content triggers renderer
|
||||
await sw.api.patch('/api/v1/ext/notes/notes/' + noteId, {
|
||||
content: '```mermaid\ngraph LR; A-->B\n```'
|
||||
});
|
||||
// Renderer integration tested via DOM assertion
|
||||
// (only meaningful in headless E2E — marked as browser-only)
|
||||
t.browserOnly(() => {
|
||||
const el = document.querySelector('.mermaid svg');
|
||||
t.assert.ok(el, 'mermaid rendered to SVG');
|
||||
});
|
||||
});
|
||||
|
||||
s.afterAll(async () => {
|
||||
// s.track() resources auto-cleaned here
|
||||
// Manual cleanup for anything not tracked
|
||||
});
|
||||
});
|
||||
```
|
||||
|
||||
### Core API
|
||||
|
||||
```js
|
||||
sw.testing.suite(name, fn) // Register a test suite
|
||||
sw.testing.run(name?) // Run one suite or all
|
||||
sw.testing.results() // Get structured results (JSON)
|
||||
sw.testing.on('complete', fn) // Event when run finishes
|
||||
|
||||
// Inside suite:
|
||||
s.test(name, fn) // Register a test
|
||||
s.beforeAll(fn) // Runs once before all tests
|
||||
s.afterAll(fn) // Runs once after all tests (always, even on failure)
|
||||
s.beforeEach(fn) // Runs before each test
|
||||
s.afterEach(fn) // Runs after each test
|
||||
s.track(type, id) // Register resource for auto-cleanup
|
||||
s.skip(reason) // Skip entire suite
|
||||
|
||||
// Inside test:
|
||||
t.assert.ok(val, msg) // Truthy
|
||||
t.assert.eq(a, b, msg) // Deep equality
|
||||
t.assert.neq(a, b, msg) // Not equal
|
||||
t.assert.gt(a, b, msg) // Greater than
|
||||
t.assert.match(str, re, msg) // Regex match
|
||||
t.assert.throws(fn, msg) // Expects throw
|
||||
t.assert.status(resp, code, msg) // HTTP status check
|
||||
t.track(type, id) // Register resource for auto-cleanup
|
||||
t.warn(msg) // Emit warning (non-fatal)
|
||||
t.browserOnly(fn) // Only runs in headless E2E, skipped in API-only mode
|
||||
t.skip(reason) // Skip this test
|
||||
```
|
||||
|
||||
### `requires` Declarations
|
||||
|
||||
Runner packages declare dependencies in their manifest:
|
||||
|
||||
```json
|
||||
{
|
||||
"id": "chat-runner",
|
||||
"type": "test-runner",
|
||||
"title": "Chat Runner",
|
||||
"requires": ["chat", "chat-core"],
|
||||
"version": "0.1.0"
|
||||
}
|
||||
```
|
||||
|
||||
On load, the framework calls `GET /api/v1/surfaces` (or equivalent) to
|
||||
check which packages are installed. If any `requires` entry is missing:
|
||||
|
||||
- Suite is marked `skipped` with reason: `"Missing required package: chat-core"`
|
||||
- No tests execute — clean skip, not a failure
|
||||
- The runner registry surface shows the skip reason prominently
|
||||
|
||||
This directly solves the "workflow demo shows not-installed" pattern:
|
||||
the runner *knows* what should be installed and reports clearly when it isn't.
|
||||
|
||||
### Auto-Cleanup
|
||||
|
||||
The `track(type, id)` method registers resources for deletion in `afterAll`.
|
||||
Supported resource types and their cleanup endpoints:
|
||||
|
||||
| Type | Cleanup Action |
|
||||
|------|---------------|
|
||||
| `channel` | `DELETE /api/v1/channels/:id` |
|
||||
| `note` | `DELETE /api/v1/ext/notes/notes/:id` |
|
||||
| `folder` | `DELETE /api/v1/ext/notes/folders/:id` |
|
||||
| `workflow` | `DELETE /api/v1/workflows/:id` |
|
||||
| `schedule` | `DELETE /api/v1/schedules/:id` |
|
||||
| `package` | `DELETE /api/v1/admin/packages/:id` |
|
||||
| `user` | `DELETE /api/v1/admin/users/:id` |
|
||||
| `team` | `DELETE /api/v1/admin/teams/:id` |
|
||||
|
||||
Cleanup runs in reverse order (LIFO) in `afterAll`, regardless of
|
||||
test pass/fail. Cleanup failures are reported as warnings, not failures.
|
||||
The framework never swallows cleanup errors silently.
|
||||
|
||||
### Result Structure
|
||||
|
||||
```json
|
||||
{
|
||||
"runner": "notes-runner",
|
||||
"timestamp": "2026-04-01T12:00:00Z",
|
||||
"duration_ms": 1234,
|
||||
"summary": { "total": 5, "passed": 4, "failed": 0, "warned": 1, "skipped": 0 },
|
||||
"suites": [
|
||||
{
|
||||
"name": "notes-crud",
|
||||
"status": "passed",
|
||||
"duration_ms": 890,
|
||||
"tests": [
|
||||
{
|
||||
"name": "create note",
|
||||
"status": "passed",
|
||||
"duration_ms": 120,
|
||||
"warnings": [],
|
||||
"cleanup": { "tracked": 1, "cleaned": 1, "failed": 0 }
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"requires": { "met": ["notes"], "missing": [] }
|
||||
}
|
||||
```
|
||||
|
||||
### Warning Tier
|
||||
|
||||
Three result statuses:
|
||||
|
||||
- **`passed`** — assertions all passed, cleanup succeeded
|
||||
- **`failed`** — at least one assertion failed
|
||||
- **`warned`** — assertions passed but something non-fatal happened:
|
||||
- API returned unexpected shape (extra/missing fields) but test doesn't depend on the exact field
|
||||
- Cleanup failed for a tracked resource
|
||||
- Timing exceeded a soft threshold
|
||||
- `t.warn(msg)` called explicitly
|
||||
|
||||
Warnings are **never silent.** They appear in the UI and structured results.
|
||||
The difference from the current `catch (e) { /* ignore */ }` pattern is
|
||||
that warnings are *visible* — a human or CI system can decide whether
|
||||
to investigate.
|
||||
|
||||
### ICD/SDK Runner Migration
|
||||
|
||||
The existing runners use a hand-rolled framework (`T.test()`, `T.assert()`,
|
||||
`T.authFetch()`). Migration preserves all test logic:
|
||||
|
||||
| Current | New |
|
||||
|---------|-----|
|
||||
| `T.test(tier, group, name, fn)` | `s.test(name, fn)` inside `sw.testing.suite(tier + '/' + group, fn)` |
|
||||
| `T.assert(cond, msg)` | `t.assert.ok(cond, msg)` |
|
||||
| `T.authFetch(token, method, path, body)` | Kept as utility — not an assertion primitive |
|
||||
| `T.apiPost(...)` | Kept as utility |
|
||||
| Result rendering (`ui.js`) | Delegated to runner registry surface |
|
||||
| No cleanup hooks | `s.track()` + `s.afterAll()` |
|
||||
|
||||
The ICD and SDK runners become packages with `"type": "test-runner"` in
|
||||
their manifests. Their existing surfaces (`/s/icd-test-runner`,
|
||||
`/s/sdk-test-runner`) are replaced by the unified runner registry at
|
||||
`/s/test-runners`.
|
||||
|
||||
## v0.7.2 — Package Runners
|
||||
|
||||
### Runner Inventory
|
||||
|
||||
| Runner | `requires` | Key Assertions |
|
||||
|--------|-----------|---------------|
|
||||
| `notes-runner` | `["notes"]` | CRUD, folders, tags, backlinks, search, markdown rendering, SDK integration |
|
||||
| `chat-runner` | `["chat", "chat-core"]` | Channel CRUD, messaging, participant display, renderer blocks in messages |
|
||||
| `schedules-runner` | `["schedules"]` | Schedule CRUD, cron expression, toggle, Starlark exec |
|
||||
| `workflow-runner` | `["content-approval"]` | Install detection, stage progression, form submission, signoff |
|
||||
| `renderer-runner` | `["mermaid-renderer"]` | `sw.renderers.register` contract, post-render hooks, block rendering |
|
||||
|
||||
### Runner Result API
|
||||
|
||||
New kernel endpoints (no package required — kernel-provided):
|
||||
|
||||
```
|
||||
POST /api/v1/test-runners/run → Run all installed runners
|
||||
POST /api/v1/test-runners/run/:id → Run specific runner
|
||||
GET /api/v1/test-runners/results → Last run results (JSON)
|
||||
GET /api/v1/test-runners/results/:id → Last run results for specific runner
|
||||
```
|
||||
|
||||
These endpoints enable CI to trigger and consume runner results via
|
||||
`curl` without browser automation. The v0.7.3 Playwright harness is
|
||||
additive — not required for CI gating.
|
||||
|
||||
**Auth:** Admin-only. Runners create/delete resources — they must run
|
||||
with elevated permissions.
|
||||
|
||||
### CI Integration
|
||||
|
||||
New stage in `.gitea/workflows/ci.yaml`:
|
||||
|
||||
```yaml
|
||||
test-runners:
|
||||
needs: [unit-tests]
|
||||
steps:
|
||||
- name: Boot server
|
||||
run: |
|
||||
docker compose up -d
|
||||
./ci/wait-for-healthy.sh
|
||||
- name: Run surface runners
|
||||
run: |
|
||||
RESULT=$(curl -s -X POST http://localhost:8080/api/v1/test-runners/run \
|
||||
-H "Authorization: Bearer $ADMIN_TOKEN")
|
||||
FAILED=$(echo "$RESULT" | jq '.summary.failed')
|
||||
if [ "$FAILED" != "0" ]; then
|
||||
echo "$RESULT" | jq '.suites[] | select(.status == "failed")'
|
||||
exit 1
|
||||
fi
|
||||
```
|
||||
|
||||
Runs in both PG and SQLite pipelines. Server boots with `BUNDLED_PACKAGES=*`
|
||||
so all packages and their runners are installed.
|
||||
|
||||
## v0.7.3 — Headless E2E
|
||||
|
||||
### Playwright Harness
|
||||
|
||||
`ci/e2e-surface-test.sh`:
|
||||
|
||||
1. `docker compose up -d` (server + DB)
|
||||
2. `npx playwright install chromium` (CI caches this)
|
||||
3. Run `ci/e2e-surfaces.spec.ts`
|
||||
4. Collect screenshots on failure
|
||||
5. `docker compose down`
|
||||
|
||||
### Surface Navigation Smoke Test
|
||||
|
||||
```ts
|
||||
test('all surfaces reachable', async ({ page }) => {
|
||||
// Login
|
||||
await page.goto('/');
|
||||
await page.fill('#username', 'admin');
|
||||
await page.fill('#password', 'admin');
|
||||
await page.click('button[type="submit"]');
|
||||
|
||||
// Navigate through every installed surface
|
||||
const surfaces = ['notes', 'chat', 'admin', 'settings', 'docs'];
|
||||
for (const s of surfaces) {
|
||||
await page.goto(`/s/${s}`);
|
||||
// Assert: page loaded, no uncaught JS errors
|
||||
await expect(page.locator('.sw-topbar')).toBeVisible();
|
||||
// Assert: home link works
|
||||
await page.click('.sw-topbar__home');
|
||||
await expect(page).toHaveURL('/');
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
This is the automated version of "hello dashboard has no way out" — if
|
||||
any surface fails to render a topbar or its home link doesn't work, CI
|
||||
catches it.
|
||||
|
||||
### Screenshot on Failure
|
||||
|
||||
```ts
|
||||
test.afterEach(async ({ page }, testInfo) => {
|
||||
if (testInfo.status !== 'passed') {
|
||||
await page.screenshot({
|
||||
path: `ci/artifacts/failure-${testInfo.title}.png`,
|
||||
fullPage: true
|
||||
});
|
||||
const logs = await page.evaluate(() =>
|
||||
(window.__consoleErrors || []).join('\n')
|
||||
);
|
||||
fs.writeFileSync(
|
||||
`ci/artifacts/console-${testInfo.title}.log`, logs
|
||||
);
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
Artifacts saved to CI workspace. On failure, the developer gets a
|
||||
screenshot + console log dump without needing to reproduce locally.
|
||||
|
||||
### Visual Regression (Optional)
|
||||
|
||||
Not a CI gate in v0.7.3 — produces a diff report for human review:
|
||||
|
||||
```ts
|
||||
test('visual baseline - notes', async ({ page }) => {
|
||||
await page.goto('/s/notes');
|
||||
await expect(page.locator('.sw-topbar')).toBeVisible();
|
||||
await expect(page).toHaveScreenshot('notes.png', {
|
||||
maxDiffPixelRatio: 0.01
|
||||
});
|
||||
});
|
||||
```
|
||||
|
||||
Playwright stores baseline screenshots in `ci/visual-baselines/`.
|
||||
`toHaveScreenshot` compares against baseline and produces a diff image
|
||||
on mismatch. Foundation for future visual regression gating.
|
||||
|
||||
## Sequencing
|
||||
|
||||
```
|
||||
v0.7.0 Shell Contract ← prerequisite: surfaces need topbar before
|
||||
│ runners can assert on it
|
||||
↓
|
||||
v0.7.1 Runner Framework ← standardize test authoring
|
||||
│
|
||||
↓
|
||||
v0.7.2 Package Runners + CI ← write the actual tests, wire into CI
|
||||
│
|
||||
↓
|
||||
v0.7.3 Headless E2E ← automate browser-based runner execution
|
||||
```
|
||||
|
||||
Each version is independently shippable. v0.7.2's API-based CI gate
|
||||
works without v0.7.3's Playwright. v0.7.3 adds coverage for DOM-level
|
||||
bugs that API-only runners can't catch.
|
||||
|
||||
## Open Questions
|
||||
|
||||
1. **Runner package type.** Should `"type": "test-runner"` be a new
|
||||
manifest type, or should runners be `"type": "surface"` with a
|
||||
`"tags": ["test-runner"]` convention? New type is cleaner but requires
|
||||
a `ValidateManifest()` update.
|
||||
|
||||
2. **Runner discovery.** The registry surface needs to find all installed
|
||||
runners. Options: (a) scan installed packages for `type: "test-runner"`,
|
||||
(b) runners register themselves via `sw.testing.register()` during SDK
|
||||
boot. Option (a) is declarative and doesn't require runner JS to load
|
||||
before discovery.
|
||||
|
||||
3. **Parallel vs sequential.** Should runners execute in parallel?
|
||||
Probably not initially — shared DB state means test isolation is hard.
|
||||
Sequential is safer. Parallel can be a future optimization.
|
||||
|
||||
4. **SQLite limitations.** Some runners (cluster, multi-node) are
|
||||
PG-only. The `requires` mechanism should support
|
||||
`"requires_db": "postgres"` for these cases, or runners should
|
||||
self-skip when `sw.config.db_driver === 'sqlite'`.
|
||||
BIN
icons/apple-touch-icon-b-dark.png
Normal file
BIN
icons/apple-touch-icon-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
BIN
icons/apple-touch-icon-b-light.png
Normal file
BIN
icons/apple-touch-icon-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
BIN
icons/apple-touch-icon-e-dark.png
Normal file
BIN
icons/apple-touch-icon-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
BIN
icons/apple-touch-icon-e-light.png
Normal file
BIN
icons/apple-touch-icon-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
BIN
icons/favicon-16-b-dark.png
Normal file
BIN
icons/favicon-16-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 218 B |
BIN
icons/favicon-16-b-light.png
Normal file
BIN
icons/favicon-16-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 214 B |
BIN
icons/favicon-16-e-dark.png
Normal file
BIN
icons/favicon-16-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 304 B |
BIN
icons/favicon-16-e-light.png
Normal file
BIN
icons/favicon-16-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 312 B |
BIN
icons/favicon-32-b-dark.png
Normal file
BIN
icons/favicon-32-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 363 B |
BIN
icons/favicon-32-b-light.png
Normal file
BIN
icons/favicon-32-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 332 B |
BIN
icons/favicon-32-e-dark.png
Normal file
BIN
icons/favicon-32-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 457 B |
BIN
icons/favicon-32-e-light.png
Normal file
BIN
icons/favicon-32-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 459 B |
20
icons/favicon-animated.svg
Normal file
20
icons/favicon-animated.svg
Normal file
@@ -0,0 +1,20 @@
|
||||
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes p { 0%,100%{r:2.5;opacity:1} 50%{r:3;opacity:0.8} }
|
||||
.c { animation: p 2.4s ease-in-out infinite; }
|
||||
</style>
|
||||
<rect width="32" height="32" rx="6" fill="#14142a"/>
|
||||
<line x1="16" y1="8" x2="26" y2="16" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="26" y1="16" x2="16" y2="24" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="16" y1="24" x2="6" y2="16" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="6" y1="16" x2="16" y2="8" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="6" y1="16" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="26" y1="16" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="16" y1="8" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="16" y1="16" x2="16" y2="24" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<circle cx="16" cy="8" r="2" fill="#3B82F6"/>
|
||||
<circle cx="6" cy="16" r="2" fill="#3B82F6"/>
|
||||
<circle cx="26" cy="16" r="2" fill="#EF4444"/>
|
||||
<circle cx="16" cy="24" r="2" fill="#3B82F6"/>
|
||||
<circle cx="16" cy="16" r="2.5" fill="#3B82F6" class="c"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
16
icons/favicon.svg
Normal file
16
icons/favicon.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="32" height="32" rx="6" fill="#14142a"/>
|
||||
<line x1="16" y1="7" x2="26" y2="16" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="26" y1="16" x2="16" y2="25" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="16" y1="25" x2="6" y2="16" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="6" y1="16" x2="16" y2="7" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="6" y1="16" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="26" y1="16" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="16" y1="7" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="16" y1="16" x2="16" y2="25" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<circle cx="16" cy="7" r="2" fill="#3B82F6"/>
|
||||
<circle cx="6" cy="16" r="2" fill="#3B82F6"/>
|
||||
<circle cx="26" cy="16" r="2" fill="#EF4444"/>
|
||||
<circle cx="16" cy="25" r="2" fill="#3B82F6"/>
|
||||
<circle cx="16" cy="16" r="2.5" fill="#3B82F6"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
BIN
icons/icon-128-b-dark.png
Normal file
BIN
icons/icon-128-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
icons/icon-128-b-light.png
Normal file
BIN
icons/icon-128-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
icons/icon-128-e-dark.png
Normal file
BIN
icons/icon-128-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
icons/icon-128-e-light.png
Normal file
BIN
icons/icon-128-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
icons/icon-192-b-dark.png
Normal file
BIN
icons/icon-192-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
BIN
icons/icon-192-b-light.png
Normal file
BIN
icons/icon-192-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
BIN
icons/icon-192-e-dark.png
Normal file
BIN
icons/icon-192-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
icons/icon-192-e-light.png
Normal file
BIN
icons/icon-192-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
icons/icon-256-b-dark.png
Normal file
BIN
icons/icon-256-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
BIN
icons/icon-256-b-light.png
Normal file
BIN
icons/icon-256-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
BIN
icons/icon-256-e-dark.png
Normal file
BIN
icons/icon-256-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
BIN
icons/icon-256-e-light.png
Normal file
BIN
icons/icon-256-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
BIN
icons/icon-48-b-dark.png
Normal file
BIN
icons/icon-48-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 496 B |
BIN
icons/icon-48-b-light.png
Normal file
BIN
icons/icon-48-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 492 B |
BIN
icons/icon-48-e-dark.png
Normal file
BIN
icons/icon-48-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 564 B |
BIN
icons/icon-48-e-light.png
Normal file
BIN
icons/icon-48-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 559 B |
BIN
icons/icon-512-b-dark.png
Normal file
BIN
icons/icon-512-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
icons/icon-512-b-light.png
Normal file
BIN
icons/icon-512-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
icons/icon-512-e-dark.png
Normal file
BIN
icons/icon-512-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
BIN
icons/icon-512-e-light.png
Normal file
BIN
icons/icon-512-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
BIN
icons/icon-64-b-dark.png
Normal file
BIN
icons/icon-64-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 626 B |
BIN
icons/icon-64-b-light.png
Normal file
BIN
icons/icon-64-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 620 B |
BIN
icons/icon-64-e-dark.png
Normal file
BIN
icons/icon-64-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 711 B |
BIN
icons/icon-64-e-light.png
Normal file
BIN
icons/icon-64-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 707 B |
48
icons/icon-b-dark-animated.svg
Normal file
48
icons/icon-b-dark-animated.svg
Normal file
@@ -0,0 +1,48 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes center-pulse {
|
||||
0%, 100% { r: 10; opacity: 1; }
|
||||
50% { r: 12; opacity: 0.85; }
|
||||
}
|
||||
@keyframes glow-pulse {
|
||||
0%, 100% { r: 16; opacity: 0.12; }
|
||||
50% { r: 22; opacity: 0.06; }
|
||||
}
|
||||
@keyframes node-breathe {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.8; }
|
||||
}
|
||||
.center-node { animation: center-pulse 2.4s ease-in-out infinite; }
|
||||
.center-glow { animation: glow-pulse 2.4s ease-in-out infinite; }
|
||||
.node-tl { animation: node-breathe 2.4s ease-in-out infinite 0.3s; }
|
||||
.node-tr { animation: node-breathe 2.4s ease-in-out infinite 0.6s; }
|
||||
.node-bl { animation: node-breathe 2.4s ease-in-out infinite 0.9s; }
|
||||
.node-br { animation: node-breathe 2.4s ease-in-out infinite 1.2s; }
|
||||
</style>
|
||||
|
||||
<rect width="200" height="200" rx="32" fill="#14142a"/>
|
||||
|
||||
<!-- Diamond outline -->
|
||||
<line x1="100" y1="51" x2="145" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"/>
|
||||
<line x1="145" y1="100" x2="100" y2="149" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"/>
|
||||
<line x1="100" y1="149" x2="55" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"/>
|
||||
<line x1="55" y1="100" x2="100" y2="51" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"/>
|
||||
|
||||
<!-- Cross lines -->
|
||||
<line x1="55" y1="100" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<line x1="145" y1="100" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<line x1="100" y1="51" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<line x1="100" y1="100" x2="100" y2="149" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
|
||||
<!-- Center glow -->
|
||||
<circle cx="100" cy="100" r="16" fill="#3B82F6" opacity="0.12" class="center-glow"/>
|
||||
|
||||
<!-- Nodes -->
|
||||
<circle cx="100" cy="51" r="8" fill="#3B82F6" class="node-tl"/>
|
||||
<circle cx="55" cy="100" r="8" fill="#3B82F6" class="node-tr"/>
|
||||
<circle cx="145" cy="100" r="8" fill="#EF4444" class="node-bl"/>
|
||||
<circle cx="100" cy="149" r="8" fill="#3B82F6" class="node-br"/>
|
||||
|
||||
<!-- Center -->
|
||||
<circle cx="100" cy="100" r="10" fill="#3B82F6" class="center-node"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
21
icons/icon-b-dark.svg
Normal file
21
icons/icon-b-dark.svg
Normal file
@@ -0,0 +1,21 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="200" height="200" rx="32" fill="#14142a"/>
|
||||
<!-- Diamond outline -->
|
||||
<line x1="100" y1="55" x2="142" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"/>
|
||||
<line x1="142" y1="100" x2="100" y2="145" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"/>
|
||||
<line x1="100" y1="145" x2="58" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"/>
|
||||
<line x1="58" y1="100" x2="100" y2="55" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"/>
|
||||
<!-- Cross lines -->
|
||||
<line x1="58" y1="100" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<line x1="142" y1="100" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<line x1="100" y1="55" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<line x1="100" y1="100" x2="100" y2="145" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<!-- Center glow -->
|
||||
<circle cx="100" cy="100" r="16" fill="#3B82F6" opacity="0.12"/>
|
||||
<!-- Nodes -->
|
||||
<circle cx="100" cy="55" r="8" fill="#3B82F6"/>
|
||||
<circle cx="58" cy="100" r="8" fill="#3B82F6"/>
|
||||
<circle cx="142" cy="100" r="8" fill="#EF4444"/>
|
||||
<circle cx="100" cy="145" r="8" fill="#3B82F6"/>
|
||||
<circle cx="100" cy="100" r="10" fill="#3B82F6"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
43
icons/icon-b-light-animated.svg
Normal file
43
icons/icon-b-light-animated.svg
Normal file
@@ -0,0 +1,43 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes center-pulse {
|
||||
0%, 100% { r: 10; opacity: 1; }
|
||||
50% { r: 12; opacity: 0.85; }
|
||||
}
|
||||
@keyframes glow-pulse {
|
||||
0%, 100% { r: 16; opacity: 0.1; }
|
||||
50% { r: 22; opacity: 0.05; }
|
||||
}
|
||||
@keyframes node-breathe {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.8; }
|
||||
}
|
||||
.center-node { animation: center-pulse 2.4s ease-in-out infinite; }
|
||||
.center-glow { animation: glow-pulse 2.4s ease-in-out infinite; }
|
||||
.node-tl { animation: node-breathe 2.4s ease-in-out infinite 0.3s; }
|
||||
.node-tr { animation: node-breathe 2.4s ease-in-out infinite 0.6s; }
|
||||
.node-bl { animation: node-breathe 2.4s ease-in-out infinite 0.9s; }
|
||||
.node-br { animation: node-breathe 2.4s ease-in-out infinite 1.2s; }
|
||||
</style>
|
||||
|
||||
<rect width="200" height="200" rx="32" fill="#e8e8ee"/>
|
||||
|
||||
<line x1="100" y1="51" x2="145" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="145" y1="100" x2="100" y2="149" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="100" y1="149" x2="55" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="55" y1="100" x2="100" y2="51" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
|
||||
<line x1="55" y1="100" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="145" y1="100" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="100" y1="51" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="100" y1="100" x2="100" y2="149" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
|
||||
<circle cx="100" cy="100" r="16" fill="#3B82F6" opacity="0.1" class="center-glow"/>
|
||||
|
||||
<circle cx="100" cy="51" r="8" fill="#3B82F6" class="node-tl"/>
|
||||
<circle cx="55" cy="100" r="8" fill="#3B82F6" class="node-tr"/>
|
||||
<circle cx="145" cy="100" r="8" fill="#EF4444" class="node-bl"/>
|
||||
<circle cx="100" cy="149" r="8" fill="#3B82F6" class="node-br"/>
|
||||
|
||||
<circle cx="100" cy="100" r="10" fill="#3B82F6" class="center-node"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
17
icons/icon-b-light.svg
Normal file
17
icons/icon-b-light.svg
Normal file
@@ -0,0 +1,17 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="200" height="200" rx="32" fill="#e8e8ee"/>
|
||||
<line x1="100" y1="55" x2="142" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="142" y1="100" x2="100" y2="145" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="100" y1="145" x2="58" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="58" y1="100" x2="100" y2="55" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="58" y1="100" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="142" y1="100" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="100" y1="55" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="100" y1="100" x2="100" y2="145" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<circle cx="100" cy="100" r="16" fill="#3B82F6" opacity="0.1"/>
|
||||
<circle cx="100" cy="55" r="8" fill="#3B82F6"/>
|
||||
<circle cx="58" cy="100" r="8" fill="#3B82F6"/>
|
||||
<circle cx="142" cy="100" r="8" fill="#EF4444"/>
|
||||
<circle cx="100" cy="145" r="8" fill="#3B82F6"/>
|
||||
<circle cx="100" cy="100" r="10" fill="#3B82F6"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
67
icons/icon-e-dark-animated.svg
Normal file
67
icons/icon-e-dark-animated.svg
Normal file
@@ -0,0 +1,67 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes draw-edge {
|
||||
from { stroke-dashoffset: 120; }
|
||||
to { stroke-dashoffset: 0; }
|
||||
}
|
||||
@keyframes pop-node {
|
||||
0% { r: 0; opacity: 0; }
|
||||
70% { r: 8; }
|
||||
100% { r: 6; opacity: 1; }
|
||||
}
|
||||
@keyframes pop-center {
|
||||
0% { r: 0; opacity: 0; }
|
||||
70% { r: 10; }
|
||||
100% { r: 8; opacity: 0.7; }
|
||||
}
|
||||
@keyframes center-idle {
|
||||
0%, 100% { r: 8; opacity: 0.7; }
|
||||
50% { r: 9.5; opacity: 0.6; }
|
||||
}
|
||||
|
||||
.edge { stroke-dasharray: 120; stroke-dashoffset: 120; }
|
||||
.e-back-1 { animation: draw-edge 0.5s ease-out 0.0s forwards; }
|
||||
.e-back-2 { animation: draw-edge 0.5s ease-out 0.1s forwards; }
|
||||
.e-back-3 { animation: draw-edge 0.5s ease-out 0.2s forwards; }
|
||||
.e-mid-1 { animation: draw-edge 0.5s ease-out 0.35s forwards; }
|
||||
.e-mid-2 { animation: draw-edge 0.5s ease-out 0.45s forwards; }
|
||||
.e-mid-3 { animation: draw-edge 0.5s ease-out 0.55s forwards; }
|
||||
.e-frt-1 { animation: draw-edge 0.5s ease-out 0.7s forwards; }
|
||||
.e-frt-2 { animation: draw-edge 0.5s ease-out 0.8s forwards; }
|
||||
.e-frt-3 { animation: draw-edge 0.5s ease-out 0.9s forwards; }
|
||||
|
||||
.v-topback { animation: pop-node 0.3s ease-out 0.05s forwards; r: 0; opacity: 0; }
|
||||
.v-backleft { animation: pop-node 0.3s ease-out 0.15s forwards; r: 0; opacity: 0; }
|
||||
.v-backright { animation: pop-node 0.3s ease-out 0.25s forwards; r: 0; opacity: 0; }
|
||||
.v-center { animation: pop-center 0.3s ease-out 0.5s forwards, center-idle 2.4s ease-in-out 1s infinite; r: 0; opacity: 0; }
|
||||
.v-frontleft { animation: pop-node 0.3s ease-out 0.75s forwards; r: 0; opacity: 0; }
|
||||
.v-frontright { animation: pop-node 0.3s ease-out 0.85s forwards; r: 0; opacity: 0; }
|
||||
.v-bottom { animation: pop-node 0.3s ease-out 0.95s forwards; r: 0; opacity: 0; }
|
||||
</style>
|
||||
|
||||
<rect width="200" height="200" rx="32" fill="#14142a"/>
|
||||
|
||||
<!-- Back edges -->
|
||||
<line x1="100" y1="42" x2="46" y2="72" stroke="#c8c8d0" stroke-width="1.5" stroke-linecap="round" opacity="0.2" class="edge e-back-1"/>
|
||||
<line x1="100" y1="42" x2="154" y2="72" stroke="#c8c8d0" stroke-width="1.5" stroke-linecap="round" opacity="0.2" class="edge e-back-2"/>
|
||||
<line x1="154" y1="72" x2="154" y2="128" stroke="#c8c8d0" stroke-width="1.5" stroke-linecap="round" opacity="0.2" class="edge e-back-3"/>
|
||||
|
||||
<!-- Mid edges -->
|
||||
<line x1="46" y1="72" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4" class="edge e-mid-1"/>
|
||||
<line x1="154" y1="72" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4" class="edge e-mid-2"/>
|
||||
<line x1="100" y1="100" x2="100" y2="158" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4" class="edge e-mid-3"/>
|
||||
|
||||
<!-- Front edges -->
|
||||
<line x1="46" y1="72" x2="46" y2="128" stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round" opacity="0.9" class="edge e-frt-1"/>
|
||||
<line x1="46" y1="128" x2="100" y2="158" stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round" opacity="0.9" class="edge e-frt-2"/>
|
||||
<line x1="154" y1="128" x2="100" y2="158" stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round" opacity="0.9" class="edge e-frt-3"/>
|
||||
|
||||
<!-- Vertices -->
|
||||
<circle cx="100" cy="42" fill="#3B82F6" opacity="0.55" class="v-topback"/>
|
||||
<circle cx="46" cy="72" fill="#3B82F6" opacity="0.55" class="v-backleft"/>
|
||||
<circle cx="154" cy="72" fill="#EF4444" opacity="0.55" class="v-backright"/>
|
||||
<circle cx="100" cy="100" fill="#3B82F6" class="v-center"/>
|
||||
<circle cx="46" cy="128" fill="#EF4444" class="v-frontleft"/>
|
||||
<circle cx="154" cy="128" fill="#3B82F6" class="v-frontright"/>
|
||||
<circle cx="100" cy="158" fill="#3B82F6" class="v-bottom"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.7 KiB |
23
icons/icon-e-dark.svg
Normal file
23
icons/icon-e-dark.svg
Normal file
@@ -0,0 +1,23 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="200" height="200" rx="32" fill="#14142a"/>
|
||||
<!-- Back edges -->
|
||||
<line x1="100" y1="48" x2="150" y2="74" stroke="#c8c8d0" stroke-width="1.5" stroke-linecap="round" opacity="0.2"/>
|
||||
<line x1="100" y1="48" x2="50" y2="74" stroke="#c8c8d0" stroke-width="1.5" stroke-linecap="round" opacity="0.2"/>
|
||||
<line x1="150" y1="74" x2="150" y2="126" stroke="#c8c8d0" stroke-width="1.5" stroke-linecap="round" opacity="0.2"/>
|
||||
<!-- Mid edges -->
|
||||
<line x1="50" y1="74" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<line x1="150" y1="74" x2="100" y2="100" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<line x1="100" y1="100" x2="100" y2="152" stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"/>
|
||||
<!-- Front edges -->
|
||||
<line x1="50" y1="74" x2="50" y2="126" stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round" opacity="0.9"/>
|
||||
<line x1="50" y1="126" x2="100" y2="152" stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round" opacity="0.9"/>
|
||||
<line x1="150" y1="126" x2="100" y2="152" stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round" opacity="0.9"/>
|
||||
<!-- Vertices -->
|
||||
<circle cx="100" cy="48" r="6" fill="#3B82F6" opacity="0.55"/>
|
||||
<circle cx="50" cy="74" r="6" fill="#3B82F6" opacity="0.55"/>
|
||||
<circle cx="150" cy="74" r="6" fill="#EF4444" opacity="0.55"/>
|
||||
<circle cx="100" cy="100" r="8" fill="#3B82F6" opacity="0.7"/>
|
||||
<circle cx="50" cy="126" r="6" fill="#EF4444"/>
|
||||
<circle cx="150" cy="126" r="6" fill="#3B82F6"/>
|
||||
<circle cx="100" cy="152" r="6" fill="#3B82F6"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
63
icons/icon-e-light-animated.svg
Normal file
63
icons/icon-e-light-animated.svg
Normal file
@@ -0,0 +1,63 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes draw-edge {
|
||||
from { stroke-dashoffset: 120; }
|
||||
to { stroke-dashoffset: 0; }
|
||||
}
|
||||
@keyframes pop-node {
|
||||
0% { r: 0; opacity: 0; }
|
||||
70% { r: 8; }
|
||||
100% { r: 6; opacity: 1; }
|
||||
}
|
||||
@keyframes pop-center {
|
||||
0% { r: 0; opacity: 0; }
|
||||
70% { r: 10; }
|
||||
100% { r: 8; opacity: 0.7; }
|
||||
}
|
||||
@keyframes center-idle {
|
||||
0%, 100% { r: 8; opacity: 0.7; }
|
||||
50% { r: 9.5; opacity: 0.6; }
|
||||
}
|
||||
|
||||
.edge { stroke-dasharray: 120; stroke-dashoffset: 120; }
|
||||
.e-back-1 { animation: draw-edge 0.5s ease-out 0.0s forwards; }
|
||||
.e-back-2 { animation: draw-edge 0.5s ease-out 0.1s forwards; }
|
||||
.e-back-3 { animation: draw-edge 0.5s ease-out 0.2s forwards; }
|
||||
.e-mid-1 { animation: draw-edge 0.5s ease-out 0.35s forwards; }
|
||||
.e-mid-2 { animation: draw-edge 0.5s ease-out 0.45s forwards; }
|
||||
.e-mid-3 { animation: draw-edge 0.5s ease-out 0.55s forwards; }
|
||||
.e-frt-1 { animation: draw-edge 0.5s ease-out 0.7s forwards; }
|
||||
.e-frt-2 { animation: draw-edge 0.5s ease-out 0.8s forwards; }
|
||||
.e-frt-3 { animation: draw-edge 0.5s ease-out 0.9s forwards; }
|
||||
|
||||
.v-topback { animation: pop-node 0.3s ease-out 0.05s forwards; r: 0; opacity: 0; }
|
||||
.v-backleft { animation: pop-node 0.3s ease-out 0.15s forwards; r: 0; opacity: 0; }
|
||||
.v-backright { animation: pop-node 0.3s ease-out 0.25s forwards; r: 0; opacity: 0; }
|
||||
.v-center { animation: pop-center 0.3s ease-out 0.5s forwards, center-idle 2.4s ease-in-out 1s infinite; r: 0; opacity: 0; }
|
||||
.v-frontleft { animation: pop-node 0.3s ease-out 0.75s forwards; r: 0; opacity: 0; }
|
||||
.v-frontright { animation: pop-node 0.3s ease-out 0.85s forwards; r: 0; opacity: 0; }
|
||||
.v-bottom { animation: pop-node 0.3s ease-out 0.95s forwards; r: 0; opacity: 0; }
|
||||
</style>
|
||||
|
||||
<rect width="200" height="200" rx="32" fill="#e8e8ee"/>
|
||||
|
||||
<line x1="100" y1="42" x2="46" y2="72" stroke="#333" stroke-width="1.5" stroke-linecap="round" opacity="0.15" class="edge e-back-1"/>
|
||||
<line x1="100" y1="42" x2="154" y2="72" stroke="#333" stroke-width="1.5" stroke-linecap="round" opacity="0.15" class="edge e-back-2"/>
|
||||
<line x1="154" y1="72" x2="154" y2="128" stroke="#333" stroke-width="1.5" stroke-linecap="round" opacity="0.15" class="edge e-back-3"/>
|
||||
|
||||
<line x1="46" y1="72" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3" class="edge e-mid-1"/>
|
||||
<line x1="154" y1="72" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3" class="edge e-mid-2"/>
|
||||
<line x1="100" y1="100" x2="100" y2="158" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3" class="edge e-mid-3"/>
|
||||
|
||||
<line x1="46" y1="72" x2="46" y2="128" stroke="#333" stroke-width="2.5" stroke-linecap="round" opacity="0.7" class="edge e-frt-1"/>
|
||||
<line x1="46" y1="128" x2="100" y2="158" stroke="#333" stroke-width="2.5" stroke-linecap="round" opacity="0.7" class="edge e-frt-2"/>
|
||||
<line x1="154" y1="128" x2="100" y2="158" stroke="#333" stroke-width="2.5" stroke-linecap="round" opacity="0.7" class="edge e-frt-3"/>
|
||||
|
||||
<circle cx="100" cy="42" fill="#3B82F6" opacity="0.55" class="v-topback"/>
|
||||
<circle cx="46" cy="72" fill="#3B82F6" opacity="0.55" class="v-backleft"/>
|
||||
<circle cx="154" cy="72" fill="#EF4444" opacity="0.55" class="v-backright"/>
|
||||
<circle cx="100" cy="100" fill="#3B82F6" class="v-center"/>
|
||||
<circle cx="46" cy="128" fill="#EF4444" class="v-frontleft"/>
|
||||
<circle cx="154" cy="128" fill="#3B82F6" class="v-frontright"/>
|
||||
<circle cx="100" cy="158" fill="#3B82F6" class="v-bottom"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.6 KiB |
19
icons/icon-e-light.svg
Normal file
19
icons/icon-e-light.svg
Normal file
@@ -0,0 +1,19 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="200" height="200" rx="32" fill="#e8e8ee"/>
|
||||
<line x1="100" y1="48" x2="150" y2="74" stroke="#333" stroke-width="1.5" stroke-linecap="round" opacity="0.15"/>
|
||||
<line x1="100" y1="48" x2="50" y2="74" stroke="#333" stroke-width="1.5" stroke-linecap="round" opacity="0.15"/>
|
||||
<line x1="150" y1="74" x2="150" y2="126" stroke="#333" stroke-width="1.5" stroke-linecap="round" opacity="0.15"/>
|
||||
<line x1="50" y1="74" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="150" y1="74" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="100" y1="100" x2="100" y2="152" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="50" y1="74" x2="50" y2="126" stroke="#333" stroke-width="2.5" stroke-linecap="round" opacity="0.7"/>
|
||||
<line x1="50" y1="126" x2="100" y2="152" stroke="#333" stroke-width="2.5" stroke-linecap="round" opacity="0.7"/>
|
||||
<line x1="150" y1="126" x2="100" y2="152" stroke="#333" stroke-width="2.5" stroke-linecap="round" opacity="0.7"/>
|
||||
<circle cx="100" cy="48" r="6" fill="#3B82F6" opacity="0.55"/>
|
||||
<circle cx="50" cy="74" r="6" fill="#3B82F6" opacity="0.55"/>
|
||||
<circle cx="150" cy="74" r="6" fill="#EF4444" opacity="0.55"/>
|
||||
<circle cx="100" cy="100" r="8" fill="#3B82F6" opacity="0.7"/>
|
||||
<circle cx="50" cy="126" r="6" fill="#EF4444"/>
|
||||
<circle cx="150" cy="126" r="6" fill="#3B82F6"/>
|
||||
<circle cx="100" cy="152" r="6" fill="#3B82F6"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
174
icons/icon-morph-dark-animated.svg
Normal file
174
icons/icon-morph-dark-animated.svg
Normal file
@@ -0,0 +1,174 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes center-pulse {
|
||||
0%, 100% { r: 8; }
|
||||
50% { r: 9.5; }
|
||||
}
|
||||
.center-node { animation: center-pulse 2.4s ease-in-out infinite; }
|
||||
</style>
|
||||
|
||||
<rect width="200" height="200" rx="32" fill="#14142a"/>
|
||||
|
||||
<!--
|
||||
B-state (flat diamond) positions:
|
||||
top: 100,51 left: 55,100 right: 145,100 bottom: 100,149 center: 100,100
|
||||
|
||||
E-state (wireframe cube) positions:
|
||||
topBack: 100,42 backLeft: 46,72 backRight: 154,72
|
||||
center: 100,100 frontLeft: 46,128 frontRight: 154,128 bottom: 100,158
|
||||
|
||||
Mapping B→E:
|
||||
top → topBack (100,51 → 100,42)
|
||||
left → backLeft (55,100 → 46,72) AND spawns frontLeft (55,100 → 46,128)
|
||||
right → backRight (145,100 → 154,72) AND spawns frontRight (145,100 → 154,128)
|
||||
bottom → bottom (100,149 → 100,158)
|
||||
center → center (100,100 → 100,100) stays
|
||||
|
||||
Timing: 1.5s hold B, 1s morph to E, 2s hold E, 1s morph back, repeat
|
||||
-->
|
||||
|
||||
<!-- ═══ EDGES ═══ -->
|
||||
<!-- Diamond outline (B) that morphs to cube edges (E) -->
|
||||
|
||||
<!-- top→right becomes topBack→backRight -->
|
||||
<line stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"
|
||||
x1="100" y1="51" x2="145" y2="100">
|
||||
<animate attributeName="x1" values="100;100;100;100;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="51;51;42;42;51" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- right→bottom becomes backRight→frontRight -->
|
||||
<line stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"
|
||||
x1="145" y1="100" x2="100" y2="149">
|
||||
<animate attributeName="x1" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="100;100;154;154;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="149;149;128;128;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- bottom→left becomes frontRight→bottom (front bottom-right) -->
|
||||
<line stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round" opacity="0.25"
|
||||
x1="100" y1="149" x2="55" y2="100">
|
||||
<animate attributeName="x1" values="100;100;154;154;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="149;149;128;128;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="55;55;100;100;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="100;100;158;158;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0.25;0.25;0.9;0.9;0.25" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- left→top becomes backLeft→topBack -->
|
||||
<line stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.25"
|
||||
x1="55" y1="100" x2="100" y2="51">
|
||||
<animate attributeName="x1" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="100;100;100;100;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="51;51;42;42;51" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- Cross: left→center becomes backLeft→center -->
|
||||
<line stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"
|
||||
x1="55" y1="100" x2="100" y2="100">
|
||||
<animate attributeName="x1" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- Cross: right→center becomes backRight→center -->
|
||||
<line stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"
|
||||
x1="145" y1="100" x2="100" y2="100">
|
||||
<animate attributeName="x1" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- Cross: center→bottom stays vertical but bottom moves -->
|
||||
<line stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"
|
||||
x1="100" y1="100" x2="100" y2="149">
|
||||
<animate attributeName="y2" values="149;149;158;158;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- Cross: top→center vertical -->
|
||||
<line stroke="#c8c8d0" stroke-width="2" stroke-linecap="round" opacity="0.4"
|
||||
x1="100" y1="51" x2="100" y2="100">
|
||||
<animate attributeName="y1" values="51;51;42;42;51" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- NEW edges that appear in E-state (start invisible) -->
|
||||
<!-- frontLeft→bottom -->
|
||||
<line stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round"
|
||||
x1="55" y1="100" x2="100" y2="149" opacity="0">
|
||||
<animate attributeName="x1" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;128;128;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="149;149;158;158;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0;0;0.9;0.9;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- backLeft→frontLeft (left vertical) -->
|
||||
<line stroke="#c8c8d0" stroke-width="2.5" stroke-linecap="round"
|
||||
x1="55" y1="100" x2="55" y2="100" opacity="0">
|
||||
<animate attributeName="x1" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="100;100;128;128;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0;0;0.9;0.9;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- ═══ NODES ═══ -->
|
||||
|
||||
<!-- Top → TopBack -->
|
||||
<circle cx="100" cy="51" r="8" fill="#3B82F6">
|
||||
<animate attributeName="cy" values="51;51;42;42;51" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="1;1;0.55;0.55;1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="8;8;6;6;8" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- Left → BackLeft -->
|
||||
<circle cx="55" cy="100" r="8" fill="#3B82F6">
|
||||
<animate attributeName="cx" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="cy" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="1;1;0.55;0.55;1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="8;8;6;6;8" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- Right → BackRight -->
|
||||
<circle cx="145" cy="100" r="8" fill="#EF4444">
|
||||
<animate attributeName="cx" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="cy" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="1;1;0.55;0.55;1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="8;8;6;6;8" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- Bottom → Bottom (slight shift) -->
|
||||
<circle cx="100" cy="149" r="8" fill="#3B82F6">
|
||||
<animate attributeName="cy" values="149;149;158;158;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="8;8;6;6;8" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- FrontLeft: spawns from Left position, invisible in B -->
|
||||
<circle cx="55" cy="100" r="0" fill="#EF4444" opacity="0">
|
||||
<animate attributeName="cx" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="cy" values="100;100;128;128;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="0;0;6;6;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0;0;1;1;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- FrontRight: spawns from Right position, invisible in B -->
|
||||
<circle cx="145" cy="100" r="0" fill="#3B82F6" opacity="0">
|
||||
<animate attributeName="cx" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="cy" values="100;100;128;128;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="0;0;6;6;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0;0;1;1;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- Center (always visible, pulse) -->
|
||||
<circle cx="100" cy="100" r="10" fill="#3B82F6" class="center-node">
|
||||
<animate attributeName="r" values="10;10;8;8;10" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="1;1;0.7;0.7;1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- Center glow -->
|
||||
<circle cx="100" cy="100" r="16" fill="#3B82F6" opacity="0.12">
|
||||
<animate attributeName="r" values="16;16;12;12;16" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0.12;0.12;0.06;0.06;0.12" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 11 KiB |
127
icons/icon-morph-light-animated.svg
Normal file
127
icons/icon-morph-light-animated.svg
Normal file
@@ -0,0 +1,127 @@
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes center-pulse {
|
||||
0%, 100% { r: 8; }
|
||||
50% { r: 9.5; }
|
||||
}
|
||||
.center-node { animation: center-pulse 2.4s ease-in-out infinite; }
|
||||
</style>
|
||||
|
||||
<rect width="200" height="200" rx="32" fill="#e8e8ee"/>
|
||||
|
||||
<!-- Diamond/cube edges -->
|
||||
<line stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"
|
||||
x1="100" y1="51" x2="145" y2="100">
|
||||
<animate attributeName="y1" values="51;51;42;42;51" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<line stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"
|
||||
x1="145" y1="100" x2="100" y2="149">
|
||||
<animate attributeName="x1" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="100;100;154;154;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="149;149;128;128;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<line stroke="#333" stroke-width="2.5" stroke-linecap="round" opacity="0.18"
|
||||
x1="100" y1="149" x2="55" y2="100">
|
||||
<animate attributeName="x1" values="100;100;154;154;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="149;149;128;128;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="55;55;100;100;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="100;100;158;158;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0.18;0.18;0.7;0.7;0.18" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<line stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"
|
||||
x1="55" y1="100" x2="100" y2="51">
|
||||
<animate attributeName="x1" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="51;51;42;42;51" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- Cross lines -->
|
||||
<line stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"
|
||||
x1="55" y1="100" x2="100" y2="100">
|
||||
<animate attributeName="x1" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
<line stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"
|
||||
x1="145" y1="100" x2="100" y2="100">
|
||||
<animate attributeName="x1" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
<line stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"
|
||||
x1="100" y1="100" x2="100" y2="149">
|
||||
<animate attributeName="y2" values="149;149;158;158;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
<line stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"
|
||||
x1="100" y1="51" x2="100" y2="100">
|
||||
<animate attributeName="y1" values="51;51;42;42;51" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- E-only edges (spawn) -->
|
||||
<line stroke="#333" stroke-width="2.5" stroke-linecap="round"
|
||||
x1="55" y1="100" x2="100" y2="149" opacity="0">
|
||||
<animate attributeName="x1" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;128;128;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="149;149;158;158;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0;0;0.7;0.7;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
<line stroke="#333" stroke-width="2.5" stroke-linecap="round"
|
||||
x1="55" y1="100" x2="55" y2="100" opacity="0">
|
||||
<animate attributeName="x1" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y1" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="x2" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="y2" values="100;100;128;128;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0;0;0.7;0.7;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</line>
|
||||
|
||||
<!-- Nodes -->
|
||||
<circle cx="100" cy="51" r="8" fill="#3B82F6">
|
||||
<animate attributeName="cy" values="51;51;42;42;51" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="1;1;0.55;0.55;1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="8;8;6;6;8" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="55" cy="100" r="8" fill="#3B82F6">
|
||||
<animate attributeName="cx" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="cy" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="1;1;0.55;0.55;1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="8;8;6;6;8" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="145" cy="100" r="8" fill="#EF4444">
|
||||
<animate attributeName="cx" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="cy" values="100;100;72;72;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="1;1;0.55;0.55;1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="8;8;6;6;8" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="100" cy="149" r="8" fill="#3B82F6">
|
||||
<animate attributeName="cy" values="149;149;158;158;149" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="8;8;6;6;8" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- Spawn nodes -->
|
||||
<circle cx="55" cy="100" r="0" fill="#EF4444" opacity="0">
|
||||
<animate attributeName="cx" values="55;55;46;46;55" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="cy" values="100;100;128;128;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="0;0;6;6;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0;0;1;1;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="145" cy="100" r="0" fill="#3B82F6" opacity="0">
|
||||
<animate attributeName="cx" values="145;145;154;154;145" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="cy" values="100;100;128;128;100" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="r" values="0;0;6;6;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0;0;1;1;0" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- Center -->
|
||||
<circle cx="100" cy="100" r="10" fill="#3B82F6" class="center-node">
|
||||
<animate attributeName="r" values="10;10;8;8;10" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="1;1;0.7;0.7;1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<circle cx="100" cy="100" r="16" fill="#3B82F6" opacity="0.1">
|
||||
<animate attributeName="r" values="16;16;12;12;16" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0.1;0.1;0.05;0.05;0.1" keyTimes="0;0.27;0.45;0.73;1" dur="5.5s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 9.3 KiB |
BIN
icons/preview-sheet.png
Normal file
BIN
icons/preview-sheet.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
12
icons/wordmark-dark.svg
Normal file
12
icons/wordmark-dark.svg
Normal file
@@ -0,0 +1,12 @@
|
||||
<svg viewBox="0 0 520 80" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- A-frame lettermark -->
|
||||
<line x1="28" y1="8" x2="6" y2="68" stroke="#3B82F6" stroke-width="3.5" stroke-linecap="round"/>
|
||||
<line x1="28" y1="8" x2="50" y2="68" stroke="#3B82F6" stroke-width="3.5" stroke-linecap="round"/>
|
||||
<line x1="14" y1="46" x2="42" y2="46" stroke="#3B82F6" stroke-width="2.5" stroke-linecap="round"/>
|
||||
<circle cx="28" cy="8" r="4" fill="#3B82F6"/>
|
||||
<circle cx="14" cy="46" r="2.5" fill="#EF4444"/>
|
||||
<circle cx="28" cy="46" r="2.5" fill="#3B82F6"/>
|
||||
<circle cx="42" cy="46" r="2.5" fill="#EF4444"/>
|
||||
<!-- "rmature" text -->
|
||||
<text x="58" y="62" fill="#dddddd" font-family="-apple-system, system-ui, 'Segoe UI', sans-serif" font-size="52" font-weight="300" letter-spacing="1">rmature</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 793 B |
10
icons/wordmark-light.svg
Normal file
10
icons/wordmark-light.svg
Normal file
@@ -0,0 +1,10 @@
|
||||
<svg viewBox="0 0 520 80" xmlns="http://www.w3.org/2000/svg">
|
||||
<line x1="28" y1="8" x2="6" y2="68" stroke="#3B82F6" stroke-width="3.5" stroke-linecap="round"/>
|
||||
<line x1="28" y1="8" x2="50" y2="68" stroke="#3B82F6" stroke-width="3.5" stroke-linecap="round"/>
|
||||
<line x1="14" y1="46" x2="42" y2="46" stroke="#3B82F6" stroke-width="2.5" stroke-linecap="round"/>
|
||||
<circle cx="28" cy="8" r="4" fill="#3B82F6"/>
|
||||
<circle cx="14" cy="46" r="2.5" fill="#EF4444"/>
|
||||
<circle cx="28" cy="46" r="2.5" fill="#3B82F6"/>
|
||||
<circle cx="42" cy="46" r="2.5" fill="#EF4444"/>
|
||||
<text x="58" y="62" fill="#222222" font-family="-apple-system, system-ui, 'Segoe UI', sans-serif" font-size="52" font-weight="300" letter-spacing="1">rmature</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 737 B |
@@ -1,17 +0,0 @@
|
||||
/* Hello Dashboard — sample extension surface styles.
|
||||
Uses CSS custom properties from the platform theme system (variables.css).
|
||||
See EXTENSION-SURFACES.md for the full property reference. */
|
||||
|
||||
.ext-hello-dashboard { max-width: 720px; margin: 0 auto; padding: var(--sp-10) var(--sp-6); }
|
||||
.ext-hello-dashboard-header { margin-bottom: var(--sp-8); }
|
||||
.ext-hello-dashboard-header h1 { font-size: 28px; font-weight: 700; color: var(--text); margin: 0 0 var(--sp-2) 0; }
|
||||
.ext-hello-dashboard-subtitle { font-size: 14px; color: var(--text-2); margin: 0; }
|
||||
.ext-hello-dashboard-subtitle code,
|
||||
.ext-hello-dashboard-card-value code { background: var(--bg-raised); padding: 2px 6px; border-radius: var(--radius-sm); font-size: 13px; }
|
||||
.ext-hello-dashboard-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--sp-4); margin-bottom: var(--sp-6); }
|
||||
.ext-hello-dashboard-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: var(--sp-4); }
|
||||
.ext-hello-dashboard-card-title { font-size: 12px; font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: var(--sp-2); }
|
||||
.ext-hello-dashboard-card-value { font-size: 20px; font-weight: 600; color: var(--text); margin-bottom: var(--sp-1); }
|
||||
.ext-hello-dashboard-card-detail { font-size: 12px; color: var(--text-3); }
|
||||
.ext-hello-dashboard-actions { display: flex; gap: var(--sp-3); margin-bottom: var(--sp-6); }
|
||||
.ext-hello-dashboard-manifest { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius); padding: var(--sp-4); font-size: 12px; color: var(--text-2); overflow-x: auto; white-space: pre-wrap; font-family: var(--mono); line-height: 1.5; }
|
||||
@@ -1,84 +0,0 @@
|
||||
/**
|
||||
* Hello Dashboard — sample extension surface.
|
||||
*
|
||||
* Platform contract:
|
||||
* - Mounts into #extension-mount
|
||||
* - window.__MANIFEST__ — surface manifest (json, lowercase keys)
|
||||
* - sw.auth.user — authenticated user (from SDK boot)
|
||||
* - UI.toast(msg, type) — platform toast (success/error/info/warning)
|
||||
* - API._get(path) — authenticated fetch (returns parsed JSON)
|
||||
*/
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
var mount = document.getElementById('extension-mount');
|
||||
if (!mount) return;
|
||||
|
||||
var manifest = window.__MANIFEST__ || {};
|
||||
var user = window.sw?.auth?.user || {};
|
||||
var isDark = document.documentElement.getAttribute('data-theme') === 'dark';
|
||||
var name = user.display_name || user.username || 'World';
|
||||
|
||||
mount.innerHTML =
|
||||
'<div class="ext-hello-dashboard">' +
|
||||
'<div class="ext-hello-dashboard-header">' +
|
||||
'<h1>Hello, ' + esc(name) + '!</h1>' +
|
||||
'<p class="ext-hello-dashboard-subtitle">Extension surface <code>' + esc(manifest.id || 'unknown') + '</code> loaded successfully.</p>' +
|
||||
'</div>' +
|
||||
'<div class="ext-hello-dashboard-cards">' +
|
||||
card('Platform Access', (typeof UI !== 'undefined' ? '\u2713 Connected' : '\u2717 Unavailable'),
|
||||
'API, Theme, UI primitives available', 'var(--accent)') +
|
||||
card('Theme', isDark ? '\uD83C\uDF19 Dark' : '\u2600\uFE0F Light',
|
||||
'Reads from platform theme system', '') +
|
||||
card('Route', '<code>' + esc(manifest.route || '/s/hello-dashboard') + '</code>',
|
||||
'Registered via surface manifest', '') +
|
||||
'</div>' +
|
||||
'<div class="ext-hello-dashboard-actions">' +
|
||||
'<button class="sw-btn sw-btn--primary sw-btn--md" id="helloToast">Show Toast</button>' +
|
||||
'<button class="sw-btn sw-btn--secondary sw-btn--md" id="helloApi">Test API</button>' +
|
||||
'</div>' +
|
||||
'<pre class="ext-hello-dashboard-manifest">' + esc(JSON.stringify(manifest, null, 2)) + '</pre>' +
|
||||
'</div>';
|
||||
|
||||
// Wire toast button
|
||||
document.getElementById('helloToast').addEventListener('click', function() {
|
||||
if (typeof UI !== 'undefined' && UI.toast) {
|
||||
UI.toast('Extension surface is working!', 'success');
|
||||
} else {
|
||||
alert('Extension surface is working! (UI.toast not available)');
|
||||
}
|
||||
});
|
||||
|
||||
// Wire API test button
|
||||
document.getElementById('helloApi').addEventListener('click', function() {
|
||||
if (typeof API === 'undefined' || !API._get) {
|
||||
toast('API module not available', 'error');
|
||||
return;
|
||||
}
|
||||
API._get('/api/v1/surfaces').then(function(resp) {
|
||||
toast('API returned ' + (resp.surfaces || []).length + ' registered surfaces', 'info');
|
||||
}).catch(function(e) {
|
||||
toast('API error: ' + e.message, 'error');
|
||||
});
|
||||
});
|
||||
|
||||
function toast(msg, type) {
|
||||
if (typeof UI !== 'undefined' && UI.toast) UI.toast(msg, type);
|
||||
else alert(msg);
|
||||
}
|
||||
|
||||
function card(title, value, detail, color) {
|
||||
var style = color ? ' style="color:' + color + ';"' : '';
|
||||
return '<div class="ext-hello-dashboard-card">' +
|
||||
'<div class="ext-hello-dashboard-card-title">' + esc(title) + '</div>' +
|
||||
'<div class="ext-hello-dashboard-card-value"' + style + '>' + value + '</div>' +
|
||||
'<div class="ext-hello-dashboard-card-detail">' + esc(detail) + '</div>' +
|
||||
'</div>';
|
||||
}
|
||||
|
||||
function esc(s) {
|
||||
var el = document.createElement('span');
|
||||
el.textContent = s;
|
||||
return el.innerHTML;
|
||||
}
|
||||
})();
|
||||
@@ -1,13 +0,0 @@
|
||||
{
|
||||
"id": "hello-dashboard",
|
||||
"icon": "👋",
|
||||
"type": "surface",
|
||||
"title": "Hello Dashboard",
|
||||
"route": "/s/hello-dashboard",
|
||||
"auth": "authenticated",
|
||||
"layout": "single",
|
||||
"components": [],
|
||||
"hooks": ["surface"],
|
||||
"version": "0.1.0",
|
||||
"description": "Sample extension surface — verifies the /s/:slug pipeline works end-to-end."
|
||||
}
|
||||
@@ -542,16 +542,22 @@
|
||||
|
||||
await T.test('security', 'input-validation', '[P0] path traversal in surface archive', async function () {
|
||||
var blob = new Blob([JSON.stringify({ id: '../../../etc/evil', title: 'Path Traversal Test' })], { type: 'application/json' });
|
||||
var d;
|
||||
try {
|
||||
var d = await T.apiUpload('/admin/packages/install', blob, 'evil.surface');
|
||||
T.assert(d._status === 400 || d._status === 409,
|
||||
d = await T.apiUpload('/admin/packages/install', blob, 'evil.surface');
|
||||
T.assert(d._status === 400 || d._status === 422,
|
||||
'path traversal surface accepted! got ' + d._status);
|
||||
} catch (e) {
|
||||
if (e.message.indexOf('502') !== -1) {
|
||||
throw new Error('INCONCLUSIVE (502): proxy returned 502 on surface upload');
|
||||
}
|
||||
T.assert(e.message.indexOf('400') !== -1 || e.message.indexOf('409') !== -1 || e.message.indexOf('415') !== -1,
|
||||
T.assert(e.message.indexOf('400') !== -1 || e.message.indexOf('422') !== -1 || e.message.indexOf('415') !== -1,
|
||||
'unexpected error: ' + e.message);
|
||||
} finally {
|
||||
// Cleanup: if the evil package was somehow installed, delete it
|
||||
if (d && (d._status === 200 || d._status === 201) && d.id) {
|
||||
T.registerCleanup(function () { return T.safeDelete('/admin/packages/' + d.id); });
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -134,7 +134,17 @@
|
||||
for (const wf of list) {
|
||||
if (wf.slug) installed[wf.slug] = wf;
|
||||
}
|
||||
} catch (e) { /* ignore — show all as not-installed */ }
|
||||
} catch (e) {
|
||||
const errDiv = document.createElement('div');
|
||||
errDiv.className = 'sw-inline-error';
|
||||
errDiv.innerHTML = '<span>' + _esc(e.message || 'Failed to load workflows') + '</span>';
|
||||
const retryBtn = document.createElement('button');
|
||||
retryBtn.className = 'sw-btn sw-btn--secondary sw-btn--sm';
|
||||
retryBtn.textContent = 'Retry';
|
||||
retryBtn.onclick = () => { errDiv.remove(); _mount(surface); };
|
||||
errDiv.appendChild(retryBtn);
|
||||
grid.appendChild(errDiv);
|
||||
}
|
||||
|
||||
for (const wf of WORKFLOWS) {
|
||||
grid.appendChild(_buildCard(wf, installed[wf.slug]));
|
||||
|
||||
@@ -236,3 +236,29 @@ func TestToolResultRouteBoth(t *testing.T) {
|
||||
t.Error("tool.result.* should route DirBoth (filtered by WS subscriber, not routing table)")
|
||||
}
|
||||
}
|
||||
|
||||
func TestShellContractEventRoutes(t *testing.T) {
|
||||
// package.changed — broadcast to all clients
|
||||
if !ShouldSendToClient("package.changed") {
|
||||
t.Error("package.changed should be sent to client")
|
||||
}
|
||||
if ShouldAcceptFromClient("package.changed") {
|
||||
t.Error("package.changed should NOT be accepted from client")
|
||||
}
|
||||
|
||||
// auth.changed — targeted to specific user
|
||||
if !ShouldSendToClient("auth.changed") {
|
||||
t.Error("auth.changed should be sent to client")
|
||||
}
|
||||
if ShouldAcceptFromClient("auth.changed") {
|
||||
t.Error("auth.changed should NOT be accepted from client")
|
||||
}
|
||||
|
||||
// notification.all_read — targeted to specific user
|
||||
if !ShouldSendToClient("notification.all_read") {
|
||||
t.Error("notification.all_read should be sent to client")
|
||||
}
|
||||
if ShouldAcceptFromClient("notification.all_read") {
|
||||
t.Error("notification.all_read should NOT be accepted from client")
|
||||
}
|
||||
}
|
||||
|
||||
@@ -51,8 +51,15 @@ var routeTable = map[string]Direction{
|
||||
"role.fallback": DirToClient,
|
||||
|
||||
// Notifications
|
||||
"notification.new": DirToClient, // targeted via Hub.PublishToUser, not room-based
|
||||
"notification.read": DirToClient, // badge sync across tabs
|
||||
"notification.new": DirToClient, // targeted via Hub.PublishToUser, not room-based
|
||||
"notification.read": DirToClient, // badge sync across tabs
|
||||
"notification.all_read": DirToClient, // mark-all-read badge sync
|
||||
|
||||
// Package lifecycle (broadcast to all clients)
|
||||
"package.changed": DirToClient, // install/uninstall/enable/disable
|
||||
|
||||
// Auth changes (targeted to affected user)
|
||||
"auth.changed": DirToClient, // role/membership change → menu refresh
|
||||
|
||||
// Workspace
|
||||
|
||||
|
||||
@@ -173,6 +173,12 @@ func (h *Hub) IsConnected(userID string) bool {
|
||||
return false
|
||||
}
|
||||
|
||||
// Broadcast sends an event to all connected clients via the bus.
|
||||
// No TargetUserID — every WS subscriber receives it.
|
||||
func (h *Hub) Broadcast(event Event) {
|
||||
h.bus.Publish(event)
|
||||
}
|
||||
|
||||
// PublishToUser sends an event to a specific user via the bus.
|
||||
// All replicas receive the event; only the one with the user's connection delivers it.
|
||||
func (h *Hub) PublishToUser(userID string, event Event) {
|
||||
|
||||
@@ -4,11 +4,13 @@ import (
|
||||
"database/sql"
|
||||
"errors"
|
||||
"net/http"
|
||||
"time"
|
||||
|
||||
"github.com/gin-gonic/gin"
|
||||
|
||||
"armature/auth"
|
||||
"armature/database"
|
||||
"armature/events"
|
||||
"armature/models"
|
||||
"armature/notifications"
|
||||
"armature/store"
|
||||
@@ -43,12 +45,30 @@ type setResourceGrantRequest struct {
|
||||
|
||||
type GroupHandler struct {
|
||||
stores store.Stores
|
||||
hub *events.Hub
|
||||
}
|
||||
|
||||
func NewGroupHandler(s store.Stores) *GroupHandler {
|
||||
return &GroupHandler{stores: s}
|
||||
}
|
||||
|
||||
// SetHub attaches the event hub for auth change notifications.
|
||||
func (h *GroupHandler) SetHub(hub *events.Hub) {
|
||||
h.hub = hub
|
||||
}
|
||||
|
||||
// notifyAuthChanged sends an auth.changed event to a specific user.
|
||||
func (h *GroupHandler) notifyAuthChanged(userID, reason string) {
|
||||
if h.hub == nil {
|
||||
return
|
||||
}
|
||||
h.hub.PublishToUser(userID, events.Event{
|
||||
Label: "auth.changed",
|
||||
Payload: events.MustJSON(map[string]string{"reason": reason}),
|
||||
Ts: time.Now().UnixMilli(),
|
||||
})
|
||||
}
|
||||
|
||||
// ── Admin: List All Groups ──────────────────
|
||||
|
||||
func (h *GroupHandler) ListGroups(c *gin.Context) {
|
||||
@@ -249,6 +269,7 @@ func (h *GroupHandler) AddMember(c *gin.Context) {
|
||||
}
|
||||
|
||||
c.JSON(http.StatusOK, gin.H{"ok": true})
|
||||
h.notifyAuthChanged(req.UserID, "group_member_added")
|
||||
AuditLog(h.stores.Audit, c, "group.member.add", "group", groupID, map[string]interface{}{
|
||||
"user_id": req.UserID,
|
||||
})
|
||||
@@ -279,6 +300,7 @@ func (h *GroupHandler) RemoveMember(c *gin.Context) {
|
||||
}
|
||||
|
||||
c.JSON(http.StatusOK, gin.H{"ok": true})
|
||||
h.notifyAuthChanged(userID, "group_member_removed")
|
||||
AuditLog(h.stores.Audit, c, "group.member.remove", "group", groupID, map[string]interface{}{
|
||||
"user_id": userID,
|
||||
})
|
||||
|
||||
@@ -137,10 +137,9 @@ func (h *NotificationHandler) MarkAllRead(c *gin.Context) {
|
||||
|
||||
// Sync badge across tabs
|
||||
if h.hub != nil {
|
||||
payload, _ := json.Marshal(map[string]string{"action": "mark_all_read"})
|
||||
h.hub.PublishToUser(userID, events.Event{
|
||||
Label: "notification.read",
|
||||
Payload: payload,
|
||||
Label: "notification.all_read",
|
||||
Payload: events.MustJSON(map[string]string{}),
|
||||
Ts: time.Now().UnixMilli(),
|
||||
})
|
||||
}
|
||||
|
||||
@@ -11,11 +11,13 @@ import (
|
||||
"path/filepath"
|
||||
"regexp"
|
||||
"strings"
|
||||
"time"
|
||||
|
||||
"github.com/gin-gonic/gin"
|
||||
"go.starlark.net/starlark"
|
||||
|
||||
"armature/database"
|
||||
"armature/events"
|
||||
"armature/models"
|
||||
"armature/sandbox"
|
||||
"armature/store"
|
||||
@@ -34,6 +36,7 @@ type PackageHandler struct {
|
||||
bundledDir string // e.g. /app/bundled-packages — .pkg archive source
|
||||
sandbox *sandbox.Sandbox
|
||||
runner *sandbox.Runner
|
||||
hub *events.Hub
|
||||
}
|
||||
|
||||
func NewPackageHandler(s store.Stores, packagesDir ...string) *PackageHandler {
|
||||
@@ -60,6 +63,23 @@ func (h *PackageHandler) SetRunner(r *sandbox.Runner) {
|
||||
h.runner = r
|
||||
}
|
||||
|
||||
// SetHub attaches the event hub for broadcasting package lifecycle events.
|
||||
func (h *PackageHandler) SetHub(hub *events.Hub) {
|
||||
h.hub = hub
|
||||
}
|
||||
|
||||
// broadcastPackageChanged emits a package.changed event to all clients.
|
||||
func (h *PackageHandler) broadcastPackageChanged(action, id string) {
|
||||
if h.hub == nil {
|
||||
return
|
||||
}
|
||||
h.hub.Broadcast(events.Event{
|
||||
Label: "package.changed",
|
||||
Payload: events.MustJSON(map[string]string{"action": action, "id": id}),
|
||||
Ts: time.Now().UnixMilli(),
|
||||
})
|
||||
}
|
||||
|
||||
// ListPackages returns all registered packages.
|
||||
// GET /api/v1/admin/packages
|
||||
func (h *PackageHandler) ListPackages(c *gin.Context) {
|
||||
@@ -116,6 +136,7 @@ func (h *PackageHandler) EnablePackage(c *gin.Context) {
|
||||
return
|
||||
}
|
||||
c.JSON(http.StatusOK, gin.H{"id": id, "enabled": true})
|
||||
h.broadcastPackageChanged("enabled", id)
|
||||
}
|
||||
|
||||
// DisablePackage disables a package. Admin cannot be disabled.
|
||||
@@ -133,6 +154,7 @@ func (h *PackageHandler) DisablePackage(c *gin.Context) {
|
||||
return
|
||||
}
|
||||
c.JSON(http.StatusOK, gin.H{"id": id, "enabled": false})
|
||||
h.broadcastPackageChanged("disabled", id)
|
||||
}
|
||||
|
||||
// DeletePackage uninstalls a package. Core packages cannot be deleted.
|
||||
@@ -180,6 +202,7 @@ func (h *PackageHandler) DeletePackage(c *gin.Context) {
|
||||
}
|
||||
|
||||
c.JSON(http.StatusOK, gin.H{"id": id, "deleted": true})
|
||||
h.broadcastPackageChanged("deleted", id)
|
||||
}
|
||||
|
||||
// InstallPackage uploads and installs a .pkg/.surface archive.
|
||||
@@ -586,6 +609,7 @@ func (h *PackageHandler) InstallPackage(c *gin.Context) {
|
||||
resp["status"] = "dormant"
|
||||
}
|
||||
c.JSON(http.StatusOK, resp)
|
||||
h.broadcastPackageChanged("installed", pkgID)
|
||||
}
|
||||
|
||||
// extractableRelPath returns the relative path for a zip entry if it
|
||||
@@ -1073,6 +1097,7 @@ func (h *PackageHandler) UpdatePackage(c *gin.Context) {
|
||||
"previous_version": previousVersion,
|
||||
"changes": schemaChanges,
|
||||
})
|
||||
h.broadcastPackageChanged("updated", pkgID)
|
||||
}
|
||||
|
||||
// mergePackageSettings merges existing settings with a new manifest's settings schema.
|
||||
|
||||
@@ -7,11 +7,13 @@ import (
|
||||
"fmt"
|
||||
"net/http"
|
||||
"strconv"
|
||||
"time"
|
||||
|
||||
"github.com/gin-gonic/gin"
|
||||
|
||||
"armature/crypto"
|
||||
"armature/database"
|
||||
"armature/events"
|
||||
"armature/models"
|
||||
"armature/store"
|
||||
)
|
||||
@@ -44,12 +46,30 @@ type updateMemberRequest struct {
|
||||
type TeamHandler struct{
|
||||
stores store.Stores
|
||||
vault *crypto.KeyResolver
|
||||
hub *events.Hub
|
||||
}
|
||||
|
||||
func NewTeamHandler(s store.Stores, vault *crypto.KeyResolver) *TeamHandler {
|
||||
return &TeamHandler{stores: s, vault: vault}
|
||||
}
|
||||
|
||||
// SetHub attaches the event hub for auth change notifications.
|
||||
func (h *TeamHandler) SetHub(hub *events.Hub) {
|
||||
h.hub = hub
|
||||
}
|
||||
|
||||
// notifyAuthChanged sends an auth.changed event to a specific user.
|
||||
func (h *TeamHandler) notifyAuthChanged(userID, reason string) {
|
||||
if h.hub == nil {
|
||||
return
|
||||
}
|
||||
h.hub.PublishToUser(userID, events.Event{
|
||||
Label: "auth.changed",
|
||||
Payload: events.MustJSON(map[string]string{"reason": reason}),
|
||||
Ts: time.Now().UnixMilli(),
|
||||
})
|
||||
}
|
||||
|
||||
// ── Admin: List All Teams ───────────────────
|
||||
|
||||
func (h *TeamHandler) ListTeams(c *gin.Context) {
|
||||
@@ -278,6 +298,7 @@ func (h *TeamHandler) AddMember(c *gin.Context) {
|
||||
}
|
||||
|
||||
c.JSON(http.StatusCreated, gin.H{"id": id})
|
||||
h.notifyAuthChanged(req.UserID, "team_member_added")
|
||||
AuditLog(h.stores.Audit, c, "team.add_member", "team", getTeamID(c), map[string]interface{}{
|
||||
"user_id": req.UserID, "role": req.Role,
|
||||
})
|
||||
@@ -312,6 +333,9 @@ func (h *TeamHandler) UpdateMember(c *gin.Context) {
|
||||
}
|
||||
|
||||
c.JSON(http.StatusOK, gin.H{"ok": true})
|
||||
if uid := h.memberUserID(c.Request.Context(), teamID, memberID); uid != "" {
|
||||
h.notifyAuthChanged(uid, "team_role")
|
||||
}
|
||||
AuditLog(h.stores.Audit, c, "team.update_member", "team", getTeamID(c), map[string]interface{}{
|
||||
"member_id": memberID, "role": req.Role,
|
||||
})
|
||||
@@ -323,6 +347,9 @@ func (h *TeamHandler) RemoveMember(c *gin.Context) {
|
||||
teamID := getTeamID(c)
|
||||
memberID := c.Param("memberId")
|
||||
|
||||
// Look up user_id before delete for auth notification
|
||||
affectedUID := h.memberUserID(c.Request.Context(), teamID, memberID)
|
||||
|
||||
n, err := h.stores.Teams.DeleteMemberByID(c.Request.Context(), memberID, teamID)
|
||||
if err != nil {
|
||||
c.JSON(http.StatusInternalServerError, gin.H{"error": "remove failed"})
|
||||
@@ -334,6 +361,9 @@ func (h *TeamHandler) RemoveMember(c *gin.Context) {
|
||||
}
|
||||
|
||||
c.JSON(http.StatusOK, gin.H{"ok": true})
|
||||
if affectedUID != "" {
|
||||
h.notifyAuthChanged(affectedUID, "team_member_removed")
|
||||
}
|
||||
AuditLog(h.stores.Audit, c, "team.remove_member", "team", getTeamID(c), map[string]interface{}{
|
||||
"member_id": memberID,
|
||||
})
|
||||
@@ -467,9 +497,39 @@ func (h *TeamHandler) UpdateRoles(c *gin.Context) {
|
||||
}
|
||||
|
||||
c.JSON(http.StatusOK, gin.H{"data": roles})
|
||||
// Notify all team members — role definitions changed
|
||||
h.notifyTeamMembers(c.Request.Context(), teamID, "team_roles_updated")
|
||||
AuditLog(h.stores.Audit, c, "team.update_roles", "team", teamID, map[string]interface{}{"roles": roles})
|
||||
}
|
||||
|
||||
// memberUserID looks up the user_id for a team member by row ID.
|
||||
func (h *TeamHandler) memberUserID(ctx context.Context, teamID, memberID string) string {
|
||||
members, err := h.stores.Teams.ListMembers(ctx, teamID)
|
||||
if err != nil {
|
||||
return ""
|
||||
}
|
||||
for _, m := range members {
|
||||
if m.ID == memberID {
|
||||
return m.UserID
|
||||
}
|
||||
}
|
||||
return ""
|
||||
}
|
||||
|
||||
// notifyTeamMembers sends an auth.changed event to all members of a team.
|
||||
func (h *TeamHandler) notifyTeamMembers(ctx context.Context, teamID, reason string) {
|
||||
if h.hub == nil {
|
||||
return
|
||||
}
|
||||
members, err := h.stores.Teams.ListMembers(ctx, teamID)
|
||||
if err != nil {
|
||||
return
|
||||
}
|
||||
for _, m := range members {
|
||||
h.notifyAuthChanged(m.UserID, reason)
|
||||
}
|
||||
}
|
||||
|
||||
// getTeamRoles reads the roles array from team settings, falling back to builtins.
|
||||
func getTeamRoles(ctx context.Context, stores store.Stores, teamID string) []string {
|
||||
team, err := stores.Teams.GetByID(ctx, teamID)
|
||||
|
||||
@@ -588,10 +588,12 @@ func main() {
|
||||
|
||||
// Teams (user: my teams)
|
||||
teams := handlers.NewTeamHandler(stores, keyResolver)
|
||||
teams.SetHub(hub)
|
||||
protected.GET("/teams/mine", teams.MyTeams)
|
||||
|
||||
// Groups (user: my groups
|
||||
groupH := handlers.NewGroupHandler(stores)
|
||||
groupH.SetHub(hub)
|
||||
protected.GET("/groups/mine", groupH.MyGroups)
|
||||
|
||||
// Team admin self-service
|
||||
@@ -710,6 +712,7 @@ func main() {
|
||||
|
||||
// Teams (admin)
|
||||
teamAdm := handlers.NewTeamHandler(stores, keyResolver)
|
||||
teamAdm.SetHub(hub)
|
||||
admin.GET("/teams", teamAdm.ListTeams)
|
||||
admin.POST("/teams", teamAdm.CreateTeam)
|
||||
admin.GET("/teams/:id", teamAdm.GetTeam)
|
||||
@@ -730,6 +733,7 @@ func main() {
|
||||
|
||||
// Groups (admin
|
||||
groupAdm := handlers.NewGroupHandler(stores)
|
||||
groupAdm.SetHub(hub)
|
||||
admin.GET("/groups", groupAdm.ListGroups)
|
||||
admin.POST("/groups", groupAdm.CreateGroup)
|
||||
admin.GET("/groups/:id", groupAdm.GetGroup)
|
||||
@@ -789,6 +793,7 @@ func main() {
|
||||
pkgAdm := handlers.NewPackageHandler(stores, packagesDir)
|
||||
pkgAdm.SetSandbox(sandbox.New(sandbox.DefaultConfig()))
|
||||
pkgAdm.SetBundledDir(cfg.BundledPackagesDir)
|
||||
pkgAdm.SetHub(hub)
|
||||
|
||||
// Package registry — must be registered before /packages/:id
|
||||
registryH := handlers.NewRegistryHandler(stores, packagesDir, pkgAdm)
|
||||
|
||||
@@ -75,12 +75,16 @@
|
||||
{{end}}
|
||||
|
||||
{{if .Message.Visible}}
|
||||
<div class="sw-shell__announcement" id="shellMessage">
|
||||
<div class="sw-shell__announcement" id="shellMessage" data-msg-text="{{.Message.Text}}">
|
||||
<div class="sw-shell__announcement-inner sw-shell__announcement--{{.Message.Variant}}">
|
||||
<span class="sw-shell__announcement-text">{{.Message.Text}}</span>
|
||||
<button class="sw-shell__banner-close" onclick="this.closest('.sw-shell__announcement').remove()" aria-label="Dismiss">×</button>
|
||||
<button class="sw-shell__banner-close" aria-label="Dismiss"
|
||||
onclick="var el=this.closest('.sw-shell__announcement');var t=el.dataset.msgText||'';var k='armature_dismissed_'+Array.from(t).reduce(function(h,c){return((h<<5)-h)+c.charCodeAt(0)|0;},0);localStorage.setItem(k,'1');el.remove();">×</button>
|
||||
</div>
|
||||
</div>
|
||||
<script nonce="{{.CSPNonce}}">
|
||||
(function(){var el=document.getElementById('shellMessage');if(!el)return;var t=el.dataset.msgText||'';var k='armature_dismissed_'+Array.from(t).reduce(function(h,c){return((h<<5)-h)+c.charCodeAt(0)|0;},0);if(localStorage.getItem(k))el.remove();})();
|
||||
</script>
|
||||
{{end}}
|
||||
|
||||
<div class="surface" id="surface">
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
*/}}
|
||||
|
||||
{{define "surface-admin"}}
|
||||
<div id="shell-topbar"></div>
|
||||
<div id="admin-mount" class="surface-admin" style="flex-direction:column;">
|
||||
{{/* Preact renders into this div. Show a loading state until it mounts. */}}
|
||||
<div class="settings-placeholder" style="padding:40px;text-align:center;">Loading admin…</div>
|
||||
|
||||
@@ -4,6 +4,7 @@
|
||||
*/}}
|
||||
|
||||
{{define "surface-docs"}}
|
||||
<div id="shell-topbar"></div>
|
||||
<div id="docs-mount" class="surface-docs">
|
||||
<div style="padding:40px;text-align:center;color:var(--text-3);">Loading docs…</div>
|
||||
</div>
|
||||
|
||||
@@ -13,6 +13,7 @@
|
||||
{{define "surface-extension"}}
|
||||
<div id="extension-surface" class="extension-surface"
|
||||
data-surface-id="{{.Surface}}">
|
||||
<div id="shell-topbar"></div>
|
||||
<div id="extension-mount" class="extension-mount" data-ext="{{.Surface}}"></div>
|
||||
</div>
|
||||
{{end}}
|
||||
|
||||
@@ -4,6 +4,7 @@
|
||||
*/}}
|
||||
|
||||
{{define "surface-settings"}}
|
||||
<div id="shell-topbar"></div>
|
||||
<div id="settings-mount" class="surface-settings" style="flex-direction:column;">
|
||||
{{/* Preact renders into this div. Show a loading state until it mounts. */}}
|
||||
<div class="settings-placeholder" style="padding:40px;text-align:center;">Loading settings…</div>
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
*/}}
|
||||
|
||||
{{define "surface-team-admin"}}
|
||||
<div id="shell-topbar"></div>
|
||||
<div id="team-admin-mount" class="surface-team-admin" style="height:100%;overflow:hidden;">
|
||||
<div class="settings-placeholder" style="padding:40px;text-align:center;">Loading team admin…</div>
|
||||
</div>
|
||||
|
||||
BIN
src/apple-touch-icon.png
Normal file
BIN
src/apple-touch-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
@@ -292,6 +292,25 @@
|
||||
.sw-dropdown__option--disabled:hover { background: transparent; }
|
||||
.sw-dropdown__empty { padding: var(--sp-3); text-align: center; color: var(--text-3); font-size: 0.85rem; }
|
||||
|
||||
/* ── Inline Error ─────────────────────────── */
|
||||
|
||||
.sw-inline-error {
|
||||
display: flex; align-items: center; gap: var(--sp-3);
|
||||
padding: var(--sp-3) var(--sp-4);
|
||||
background: var(--bg-2); border: 1px solid var(--danger);
|
||||
border-radius: var(--radius); font-size: 13px; color: var(--danger);
|
||||
}
|
||||
|
||||
/* ── Empty State ──────────────────────────── */
|
||||
|
||||
.sw-empty-state {
|
||||
padding: var(--sp-6) var(--sp-4);
|
||||
text-align: center; color: var(--text-3); font-size: 13px;
|
||||
}
|
||||
.sw-empty-state__text {
|
||||
margin-bottom: var(--sp-3);
|
||||
}
|
||||
|
||||
/* ── Focus Indicators ─────────────────────── */
|
||||
|
||||
.sw-btn:focus-visible {
|
||||
|
||||
@@ -156,6 +156,89 @@
|
||||
gap: var(--sp-2);
|
||||
}
|
||||
|
||||
/* ── Shell Topbar — kernel-injected two-slot model ── */
|
||||
|
||||
.sw-topbar--shell {
|
||||
gap: var(--sp-2);
|
||||
}
|
||||
|
||||
.sw-topbar__home {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
color: var(--text-3);
|
||||
text-decoration: none;
|
||||
border-radius: var(--radius);
|
||||
transition: color var(--transition), background var(--transition);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.sw-topbar__home:hover {
|
||||
color: var(--text);
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
|
||||
.sw-topbar__left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-2);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.sw-topbar__center {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
/* ── Topbar Tabs — consistent tab styling in center slot ── */
|
||||
|
||||
.sw-topbar__tabs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-1);
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.sw-topbar__tab {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--sp-2);
|
||||
padding: var(--sp-2) var(--sp-3);
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: var(--text-2);
|
||||
text-decoration: none;
|
||||
border-radius: var(--radius-sm);
|
||||
transition: color var(--transition), background var(--transition);
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sw-topbar__tab:hover {
|
||||
color: var(--text);
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
|
||||
.sw-topbar__tab.active {
|
||||
color: var(--text);
|
||||
background: var(--bg-2);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.sw-topbar__tabs {
|
||||
gap: 0;
|
||||
}
|
||||
.sw-topbar__tab {
|
||||
padding: var(--sp-2);
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── User menu trigger ───────────────────── */
|
||||
|
||||
.sw-user-menu__trigger {
|
||||
|
||||
BIN
src/favicon-light-256.png
Normal file
BIN
src/favicon-light-256.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
BIN
src/favicon-light-32.png
Normal file
BIN
src/favicon-light-32.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 332 B |
@@ -1,10 +1,17 @@
|
||||
<svg viewBox="0 0 520 80" xmlns="http://www.w3.org/2000/svg">
|
||||
<line x1="28" y1="8" x2="6" y2="68" stroke="#3B82F6" stroke-width="3.5" stroke-linecap="round"/>
|
||||
<line x1="28" y1="8" x2="50" y2="68" stroke="#3B82F6" stroke-width="3.5" stroke-linecap="round"/>
|
||||
<line x1="14" y1="46" x2="42" y2="46" stroke="#3B82F6" stroke-width="2.5" stroke-linecap="round"/>
|
||||
<circle cx="28" cy="8" r="4" fill="#3B82F6"/>
|
||||
<circle cx="14" cy="46" r="2.5" fill="#EF4444"/>
|
||||
<circle cx="28" cy="46" r="2.5" fill="#3B82F6"/>
|
||||
<circle cx="42" cy="46" r="2.5" fill="#EF4444"/>
|
||||
<text x="58" y="62" fill="#222222" font-family="-apple-system, system-ui, 'Segoe UI', sans-serif" font-size="52" font-weight="300" letter-spacing="1">rmature</text>
|
||||
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="200" height="200" rx="32" fill="#e8e8ee"/>
|
||||
<line x1="100" y1="55" x2="142" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="142" y1="100" x2="100" y2="145" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="100" y1="145" x2="58" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="58" y1="100" x2="100" y2="55" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.18"/>
|
||||
<line x1="58" y1="100" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="142" y1="100" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="100" y1="55" x2="100" y2="100" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<line x1="100" y1="100" x2="100" y2="145" stroke="#333" stroke-width="2" stroke-linecap="round" opacity="0.3"/>
|
||||
<circle cx="100" cy="100" r="16" fill="#3B82F6" opacity="0.1"/>
|
||||
<circle cx="100" cy="55" r="8" fill="#3B82F6"/>
|
||||
<circle cx="58" cy="100" r="8" fill="#3B82F6"/>
|
||||
<circle cx="142" cy="100" r="8" fill="#EF4444"/>
|
||||
<circle cx="100" cy="145" r="8" fill="#3B82F6"/>
|
||||
<circle cx="100" cy="100" r="10" fill="#3B82F6"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 737 B After Width: | Height: | Size: 1.3 KiB |
BIN
src/icons/apple-touch-icon-b-dark.png
Normal file
BIN
src/icons/apple-touch-icon-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
BIN
src/icons/apple-touch-icon-b-light.png
Normal file
BIN
src/icons/apple-touch-icon-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
BIN
src/icons/apple-touch-icon-e-dark.png
Normal file
BIN
src/icons/apple-touch-icon-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
BIN
src/icons/apple-touch-icon-e-light.png
Normal file
BIN
src/icons/apple-touch-icon-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
BIN
src/icons/favicon-16-b-dark.png
Normal file
BIN
src/icons/favicon-16-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 218 B |
BIN
src/icons/favicon-16-b-light.png
Normal file
BIN
src/icons/favicon-16-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 214 B |
BIN
src/icons/favicon-16-e-dark.png
Normal file
BIN
src/icons/favicon-16-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 304 B |
BIN
src/icons/favicon-16-e-light.png
Normal file
BIN
src/icons/favicon-16-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 312 B |
BIN
src/icons/favicon-32-b-dark.png
Normal file
BIN
src/icons/favicon-32-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 363 B |
BIN
src/icons/favicon-32-b-light.png
Normal file
BIN
src/icons/favicon-32-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 332 B |
BIN
src/icons/favicon-32-e-dark.png
Normal file
BIN
src/icons/favicon-32-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 457 B |
BIN
src/icons/favicon-32-e-light.png
Normal file
BIN
src/icons/favicon-32-e-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 459 B |
20
src/icons/favicon-animated.svg
Normal file
20
src/icons/favicon-animated.svg
Normal file
@@ -0,0 +1,20 @@
|
||||
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes p { 0%,100%{r:2.5;opacity:1} 50%{r:3;opacity:0.8} }
|
||||
.c { animation: p 2.4s ease-in-out infinite; }
|
||||
</style>
|
||||
<rect width="32" height="32" rx="6" fill="#14142a"/>
|
||||
<line x1="16" y1="8" x2="26" y2="16" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="26" y1="16" x2="16" y2="24" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="16" y1="24" x2="6" y2="16" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="6" y1="16" x2="16" y2="8" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="6" y1="16" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="26" y1="16" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="16" y1="8" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="16" y1="16" x2="16" y2="24" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<circle cx="16" cy="8" r="2" fill="#3B82F6"/>
|
||||
<circle cx="6" cy="16" r="2" fill="#3B82F6"/>
|
||||
<circle cx="26" cy="16" r="2" fill="#EF4444"/>
|
||||
<circle cx="16" cy="24" r="2" fill="#3B82F6"/>
|
||||
<circle cx="16" cy="16" r="2.5" fill="#3B82F6" class="c"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
16
src/icons/favicon.svg
Normal file
16
src/icons/favicon.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="32" height="32" rx="6" fill="#14142a"/>
|
||||
<line x1="16" y1="7" x2="26" y2="16" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="26" y1="16" x2="16" y2="25" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="16" y1="25" x2="6" y2="16" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="6" y1="16" x2="16" y2="7" stroke="#c8c8d0" stroke-width="1" opacity="0.3"/>
|
||||
<line x1="6" y1="16" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="26" y1="16" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="16" y1="7" x2="16" y2="16" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<line x1="16" y1="16" x2="16" y2="25" stroke="#c8c8d0" stroke-width="0.8" opacity="0.4"/>
|
||||
<circle cx="16" cy="7" r="2" fill="#3B82F6"/>
|
||||
<circle cx="6" cy="16" r="2" fill="#3B82F6"/>
|
||||
<circle cx="26" cy="16" r="2" fill="#EF4444"/>
|
||||
<circle cx="16" cy="25" r="2" fill="#3B82F6"/>
|
||||
<circle cx="16" cy="16" r="2.5" fill="#3B82F6"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/icons/icon-128-b-dark.png
Normal file
BIN
src/icons/icon-128-b-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
src/icons/icon-128-b-light.png
Normal file
BIN
src/icons/icon-128-b-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
src/icons/icon-128-e-dark.png
Normal file
BIN
src/icons/icon-128-e-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user