feat(0.2.0 #6): 14 new base components + Lightbox extraction + UMD build#19
Merged
Conversation
.scrollbar-corrupted: applies cyberpunk-themed scrollbar to any scrollable container (firefox + webkit). Purple thumb, magenta hover. seamless-background.css: multi-layer parallax tiled background, ported from celeste-tts-bot/obs/seamless-background.css with the image URL moved to a --seamless-background-image custom property for consumer flexibility.
Ports random-utils.js and time-utils.js from celeste-tts-bot/obs/shared/. TimerManager API merged into existing timer-registry.js (additive, backward compat preserved): adds destroyed flag, getCount(), destroy(). All pure functions, no DOM dependencies. 26 new tests, all passing. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
copyWithFeedback: replaces the 5-line copy pattern repeated across nikke-team-builder.html. url-state: round-trips form state through URLSearchParams for shareable view links. Both modules guard for Node import compat (no DOM crash). 12 new tests, all passing. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Auto-mounting singleton with show/success/error/info methods. Queue-safe stacking via flex column container. Border color varies by variant. Sourced from nikke's tierlist-maker + mock-recorder toast pattern. Safe to import in Node (no DOM crash). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Auto-reconnect (linear-exponential backoff), event-ID dedup, visibility-
change disconnect, ACK support, multi-handler registry via on()/off().
Legacy onMessage/offMessage aliases preserved for downstream compat.
Constructor accepts { url, autoConnect: false } for test instantiation
without a live server. Guards WebSocket/document/window for Node safety.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Wraps any target element with a blur filter + click-to-reveal overlay. Useful for NSFW gallery images without pulling in the full gallery.js. Pairs with Lightbox (T9). Safe to import in Node; null-target guard for tests. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Renders date + time + timezone label, rotates through a configurable IANA timezone list. Uses time-utils.js formatters + TimerRegistry for cleanup. aria-live polite for accessibility. Ported from celeste-tts-bot/obs/break-overlay.html ClockDisplay class. Key deviations from source: - IANA names + Intl.DateTimeFormat instead of manual UTC offset objects (correct across DST boundaries) - Arbitrary element injection instead of fixed querySelector selectors - TimerRegistry lifecycle instead of naked setInterval - Node-safe: no document/window access at construction time Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
EventBar: horizontal status row (label + content + optional icon) with .update() for live data. Source: celeste-tts-bot break-overlay.html .event-bar markup. LogoBanner: positioned logo with subtitle + reveal animation modes (fade / slide / none), six position presets, three size variants. Decoupled from WHYKUSANAGI branding — accepts arbitrary src + subtitle. Source: celeste-tts-bot/obs/components/logo-component.js. Key deviations from source: - CSS classes (BEM) instead of inline style injection - show()/hide() retained; update() added for live option changes - Node-safe construction (null element guard) - _destroyed lifecycle guard on all mutating methods CSS: event-bar, logo-banner, clock-widget widget styles appended to components.css using package CSS custom properties. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
gallery.js re-exports Lightbox for backward compat. Consumers wanting only the lightbox now import directly without pulling in the full gallery overhead. Addresses site/art.html's hand-rolled lightbox (was a sign the package was missing this seam). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Produces dist/timer-registry.global.js (gitignored, rebuilt via npm run build:umd) exposing window.TimerRegistry. Lets IIFE consumers such as site/assets/js/loading.js use the shared utility without ES module support. Also registers ./lightbox as a package.json export entry. Rollup 4 added as devDependency. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Appends 8 net-new rule blocks to the end of glassmorphism.css without touching existing rules: - .glass-container-dark (high-contrast / boss-battle use) - .glass-container-subtle (background/decorative panels) - .glass-container-gradient (shop / special UI) - .glass-container-animated (will-change hint for animated panels) - @supports not (backdrop-filter) fallback for non-Safari/Chrome - .glass-container-cyan / -purple / -magenta (colour modifiers) Resolves the 30+ duplicate glass-morphism instances flagged in the upstream celeste-tts-bot audit. Canonical .glass-container CSS-var definition is preserved unchanged. Source: celeste-tts-bot/obs/shared/glass-morphism.css (2026-01-23) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
First runtime dep ever in this package — added as optional peer via
peerDependenciesMeta. Dynamic import inside the function means base
install stays dep-free; consumers using png-export run `npm install
html2canvas` themselves. Clear error message if peer dep is missing.
API: exportElementAsPng(el, { filename, scale, backgroundColor })
- showcase.html: Toast, ClockWidget, EventBar, LogoBanner, NsfwReveal, Lightbox, clipboard - utilities.html: random-utils, time-utils, url-state, .scrollbar-corrupted - png-export.html: html2canvas peer-dep demo with CDN fallback - websocket-manager.html: live echo-server demo with connection status log Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Appends entries for Toast, ClockWidget, EventBar, LogoBanner, Lightbox (standalone), NsfwReveal, PngExport, WebSocketManager, TimerRegistry, random-utils, time-utils, clipboard-helpers, and url-state. Each entry includes module path, type, since version, usage example, and an options/methods table. PngExport prominently documents the optional html2canvas peer dependency. Lightbox notes the gallery.js re-export for backward compat. WebSocketManager notes autoConnect:false. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds: ./random-utils, ./time-utils, ./clipboard-helpers, ./url-state, ./websocket-manager, ./toast, ./toast-css, ./clock-widget, ./event-bar, ./logo-banner, ./png-export, ./nsfw-reveal, ./seamless-background ./lightbox was already present from T9 — not re-added. Verified with node -e check: all 14 expected paths present, 0 MISSING. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…ss-bg, missing doc - timer-registry.js: add CJS interop stub (consistency with other 0.2.0 modules) - websocket-manager.js: implement actual exponential backoff (was linear despite the option name useExponentialBackoff and docs saying exponential). Caps at maxDelay (new option, defaults to 30000ms). Sequence: 2s, 4s, 8s, 16s, 30s, 30s… - seamless-background.css: scope global html/body styles to .seamless-bg-host class so importing the file doesn't aggressively override consumer page styles. - COMPONENTS_REFERENCE.md: add missing seamless-background.css section; fix WebSocketManager backoff description (was "Linear growth: 2s, 4s, 6s…"). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Deploying with
|
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs |
corrupted-theme | 65a6e22 | Commit Preview URL Branch Preview URL |
May 18 2026, 07:33 AM |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Largest sub-project of 0.2.0 — adds 14 new reusable components, extracts Lightbox from gallery.js as a standalone export, and ships a UMD build of timer-registry.js for IIFE consumers.
Independent of plans #3 ✅ #4 ✅ (no code dependencies — only #1 ✅ which is merged).
What landed
Core utilities (5 modules)
Widgets (7 classes)
CSS (3 modules)
Structural
Test plan
Notes for plan #5 (Release Packaging)
Pre-existing debt flagged (not addressed in this PR)
🤖 Generated with Claude Code