@signal9/era-ui 6.0.0 → 8.0.0

package/dist/index.d.ts

@@ -1,6 +1,35 @@
-export * from './ui/index.js';
-export * as OS from './os/index.js';
-export * as AI from './ai/index.js';
-export type { Point, Size, Rect, Insets, Frame, Workspace, PaneState, JsonValue, PaneSnapshot, WorkspaceSnapshot, SnapZone, AppPane, AppDefinition, AppComponent, AppProps } from './os/index.js';
-export { PaneManager, SNAPSHOT_VERSION, readSnapshot, persistWorkspace, loadWorkspace, saveWorkspace, clearWorkspace, WORKSPACE_STORAGE_KEY } from './os/index.js';
+/**
+ * The SYSTEM layer — and deliberately nothing else.
+ *
+ * This used to be `export * from './ui/index.js'` plus the OS and AI
+ * namespaces: one import that could reach every component in the library. A
+ * barrel like that is a guarantee that the whole graph is reachable, and
+ * reachable is what matters — `import { Button } from '@signal9/era-ui'` put
+ * vidstack (4MB, needed by exactly one component nobody was rendering) into the
+ * module graph, where a production bundler MIGHT prove it away and a dev server
+ * pre-bundles it regardless. Selectivity that depends on a bundler proving
+ * purity is not selectivity; it is luck with good tooling.
+ *
+ * So the root now carries only what is genuinely cross-cutting and weightless:
+ * the class utilities every consumer composes with, the keybinding helpers, and
+ * the AXIS REGISTRY plus `Mode` — the design system's own contract, the thing
+ * you reach for to set up density/surface/corners/font/motion for a subtree.
+ * None of it imports a component; none of it imports a third-party runtime
+ * beyond clsx / tailwind-merge / tailwind-variants.
+ *
+ * Everything else is one import away, at its own entry point:
+ *
+ *   import { Button }   from '@signal9/era-ui/button';
+ *   import * as Select  from '@signal9/era-ui/select';
+ *   import { Swarm }    from '@signal9/era-ui/ai/swarm';
+ *   import { Desktop }  from '@signal9/era-ui/os';
+ *   import { Notes }    from '@signal9/era-ui/apps/notes';
+ *   import { runAudit } from '@signal9/era-ui/audit';
+ *
+ * The `./*` wildcard in package.json means a new component is importable the
+ * moment it exists, with no export map to maintain — and it means no component
+ * can ever be pulled in by accident, because nothing re-exports them together.
+ */
 export { cn, tv, hotkeys, keys, parseKeybinding, matchKeyBindingPress, createKeybindingsHandler, formatKeybinding, isApplePlatform, modKey, type KeyBindingMap, type KeyBindingPress, type KeyBindingOptions, type PartProps, type VariantProps } from './utils/index.js';
+export { modes, defaultMode, surfaces, defaultSurface, surfaceRegistry, corners, defaultCorners, fonts, defaultFont, motions, defaultMotion, axisRegistry, axisKeys, type Mode, type Surface, type SurfaceMeta, type Corners, type Font, type Motion, type AxisKey, type AxisMeta, type AxisLevel } from './ui/provider/index.js';
+export { Mode as ModeProvider } from './ui/mode/index.js';

package/dist/index.js

@@ -1,9 +1,43 @@
-export * from './ui/index.js';
-export * as OS from './os/index.js';
-export * as AI from './ai/index.js';
-// The snapshot + persistence API, flat for the same reason: saving and restoring
-// a desktop is a first-class thing consumers do, not an OS-namespace detail.
-// PaneManager comes with them because it is what every one of these functions
-// takes — without it the flat surface cannot type its own arguments.
-export { PaneManager, SNAPSHOT_VERSION, readSnapshot, persistWorkspace, loadWorkspace, saveWorkspace, clearWorkspace, WORKSPACE_STORAGE_KEY } from './os/index.js';
+/**
+ * The SYSTEM layer — and deliberately nothing else.
+ *
+ * This used to be `export * from './ui/index.js'` plus the OS and AI
+ * namespaces: one import that could reach every component in the library. A
+ * barrel like that is a guarantee that the whole graph is reachable, and
+ * reachable is what matters — `import { Button } from '@signal9/era-ui'` put
+ * vidstack (4MB, needed by exactly one component nobody was rendering) into the
+ * module graph, where a production bundler MIGHT prove it away and a dev server
+ * pre-bundles it regardless. Selectivity that depends on a bundler proving
+ * purity is not selectivity; it is luck with good tooling.
+ *
+ * So the root now carries only what is genuinely cross-cutting and weightless:
+ * the class utilities every consumer composes with, the keybinding helpers, and
+ * the AXIS REGISTRY plus `Mode` — the design system's own contract, the thing
+ * you reach for to set up density/surface/corners/font/motion for a subtree.
+ * None of it imports a component; none of it imports a third-party runtime
+ * beyond clsx / tailwind-merge / tailwind-variants.
+ *
+ * Everything else is one import away, at its own entry point:
+ *
+ *   import { Button }   from '@signal9/era-ui/button';
+ *   import * as Select  from '@signal9/era-ui/select';
+ *   import { Swarm }    from '@signal9/era-ui/ai/swarm';
+ *   import { Desktop }  from '@signal9/era-ui/os';
+ *   import { Notes }    from '@signal9/era-ui/apps/notes';
+ *   import { runAudit } from '@signal9/era-ui/audit';
+ *
+ * The `./*` wildcard in package.json means a new component is importable the
+ * moment it exists, with no export map to maintain — and it means no component
+ * can ever be pulled in by accident, because nothing re-exports them together.
+ */
+/* The composition utilities: `cn` for class merging (era-aware — it knows the
+ * tier/radius/shadow scales), `tv` for variants, and the keybinding layer. */
 export { cn, tv, hotkeys, keys, parseKeybinding, matchKeyBindingPress, createKeybindingsHandler, formatKeybinding, isApplePlatform, modKey } from './utils/index.js';
+/* The axis contract — the five orthogonal display axes, their levels, their
+ * defaults, and the registry that drives every picker built on top of them.
+ * Pure data: no component, no DOM, no dependency. */
+export { modes, defaultMode, surfaces, defaultSurface, surfaceRegistry, corners, defaultCorners, fonts, defaultFont, motions, defaultMotion, axisRegistry, axisKeys } from './ui/provider/index.js';
+/* `Mode` applies those axes (plus optional accent overrides) to a subtree. It
+ * is the one component that belongs here: it configures the system rather than
+ * being a piece of UI, and it imports nothing but types. */
+export { Mode as ModeProvider } from './ui/mode/index.js';

package/dist/os/workspace-storage.svelte.js

@@ -81,7 +81,7 @@ function stores() {
  */
 export function loadWorkspace(pm, key = WORKSPACE_STORAGE_KEY) {
     for (const store of stores()) {
-        let raw = null;
+        let raw;
         try {
             raw = store.getItem(key);
         }

package/dist/styles/index.css

@@ -11,21 +11,31 @@
 @import './surfaces/bevel.css';
 @import './typography.css';
 
-/* vidstack base layout + slider/button primitives for the VideoPlayer component.
- * Scoped internally to `:where(media-player)` so these rules don't affect
- * anything outside of a media-player subtree. Design-token theming is applied
- * on the component itself via CSS variables. */
-@import 'vidstack/styles/base.css';
-@import 'vidstack/styles/ui/buttons.css';
-@import 'vidstack/styles/ui/sliders.css';
-@import 'vidstack/styles/ui/buffering.css';
-@import 'vidstack/styles/ui/captions.css';
-@import 'vidstack/styles/ui/live.css';
-@import 'vidstack/styles/ui/menus.css';
-@import 'vidstack/styles/ui/tooltips.css';
+/* WHAT IS NOT HERE: vidstack's stylesheets, which the VideoPlayer needs and
+ * nothing else does. They were imported right here, so every consumer of this
+ * file paid 46KB — 37% of the built stylesheet — for a component almost none of
+ * them render. They now live in ./video-player.css, published as
+ * `@signal9/era-ui/styles/video-player`, and only a consumer using the player
+ * imports them.
+ *
+ * The split is by DEPENDENCY WEIGHT, not by layer, and that is deliberate.
+ * Tailwind utilities DEDUPE — 60-odd components share one small vocabulary of
+ * flex/h-md/items-center, so scanning every layer below costs almost nothing
+ * and cannot be forgotten. Third-party CSS is the opposite: it is unshared,
+ * heavy, and belongs to exactly one component. Split what is unshared; keep
+ * what is shared whole. */
 
-/* Tell Tailwind to scan this package's components for utility classes */
+/* Scan every SHIPPED layer for utility classes, not just ui.
+ *
+ * This read `@source '../ui'` alone, so a consumer on the source-CSS path got
+ * no utilities generated for any ai/, os/ or apps/ component — those rendered
+ * structurally correct and completely unstyled, silently. The scan follows the
+ * package's layers so that adding a layer means adding a line here, and
+ * nothing else. */
 @source '../ui';
+@source '../ai';
+@source '../os';
+@source '../apps';
 
 /* Lucide icons use an SVG presentation attribute for stroke width by default.
  * Set it from an Era token globally so every imported Lucide component tracks

package/dist/styles/prose.css

@@ -0,0 +1,384 @@
+/*
+ * NOTE PROSE — the document styling for a TipTap editor on era's tokens.
+ *
+ * Every rule hangs off `.era-notes-prose`, so it applies to any editor you put
+ * that class on: `NoteEditor` sets it itself, and a hand-rolled TipTap instance
+ * gets the same typography by adding the class and importing this file.
+ *
+ * It used to live in note-editor.svelte's <style> block, which made it
+ * unreachable: Svelte scopes a component's styles, so the built rule was
+ * `.era-notes-prose.svelte-r0lddw` and the class did nothing on anyone else's
+ * element. 364 lines of document typography — headings, code blocks with
+ * highlight.js tokens, task lists, tables, details, the first-line optical
+ * inset — were effectively private to one component. Now they are
+ * `@signal9/era-ui/styles/prose`.
+ *
+ * NoteEditor imports this itself, so mounting it still needs no CSS ceremony.
+ * Import it directly only when you are building your own editor.
+ *
+ * Everything is expressed in era tokens, so a document tracks the density,
+ * theme, surface, corners and font axes exactly like the chrome around it.
+ */
+
+/*
+ * TipTap renders headless: the editable element it creates carries `.tiptap`,
+ * so every rule here is scoped to that inside this component's wrapper.
+ *
+ * Vertical rhythm is ONE value — --era-gap, the library's inter-element gap —
+ * on every block's bottom margin. A document then breathes at exactly the
+ * pace the surrounding chrome does, and loosens with density along with it.
+ *
+ * Font family is deliberately absent: the [data-font] axis sets it globally
+ * (with !important, by design), so anything declared here would either lose
+ * or break the axis promise.
+ */
+.era-notes-prose .tiptap {
+	outline: none;
+	min-height: 100%;
+	font-size: var(--era-text);
+	line-height: 1.6;
+	color: var(--color-fg);
+
+	/*
+	 * The first line's half-leading is not padding, but it reads as padding.
+	 *
+	 * line-height 1.6 puts ~8px of empty box above the first glyph's cap, on
+	 * top of the container's 8px inset — so the document opened 16px from the
+	 * top and 8px from the left, an asymmetry that grows with the first
+	 * block's font size (a note starting with a heading was the worst case).
+	 *
+	 * Trimming the block-start to the cap edge makes the ink itself sit on the
+	 * container's inset, so the first thing you read has the same space above
+	 * it as beside it, whatever block it happens to be. This is the block half
+	 * of what era-text-trim does for single-line controls; only the START is
+	 * trimmed, because the editor scrolls and trimming the end would put the
+	 * last line's descenders past the scrollable area.
+	 *
+	 * Firefox has no text-box yet and keeps the untrimmed leading — the same
+	 * graceful degradation era-text-trim already ships with.
+	 */
+	text-box-trim: trim-start;
+	text-box-edge: cap alphabetic;
+}
+
+/* The optical half of the trim. cap trimming is EXACT — the cap sits on the
+ * container inset to the pixel — but the LEFT side isn't: glyphs start with
+ * their side bearing (~0.07em of ink-free space inside the line box), so a
+ * geometrically-equal corner read top-tight. The first block gets that same
+ * allowance back as margin, in em so a heading's compensation scales with
+ * the heading — the corner then MEASURES slightly uneven and finally LOOKS
+ * even, which is the order optics always wins in.
+ *
+ * 0.22em, not the ~0.07em side-bearing alone: a first line is usually a
+ * heavy cap or a heading, and dense ink right at a boundary needs more
+ * room than a light vertical stem to feel equally far from it — the same
+ * reason display type sets its top margin above geometric equality. Tuned
+ * by eye against the left inset. */
+.era-notes-prose .tiptap > :first-child {
+	margin-top: 0.22em;
+}
+
+/* FALLBACK for engines without text-box (Firefox): the trim above silently
+ * disappears there, and the first line opened ~0.47em too low (measured:
+ * cap 16.4px from the top against 8px from the left, dense/mono) — the
+ * exact asymmetry the trim exists to remove. Approximate the same cut with
+ * a negative first-block margin: -0.45em is the first line's half-leading
+ * (0.3em at line-height 1.6) plus the ascent-above-cap of the ui stacks
+ * (~0.15-0.17em). In em on purpose — it scales with the FIRST BLOCK's own
+ * size, so a note opening on an h1 and one opening on a paragraph both
+ * land their cap on the container inset, which one padding value could
+ * never do for both (the reference terminal app's pt-1 is this same idea,
+ * tuned only for paragraphs). The margin collapses up through .tiptap and
+ * stops at the scroll container's padding, which is where it should act.
+ * Within ~1px of the trimmed geometry; engines with text-box never match
+ * this block and keep the exact version. */
+@supports not ((text-box-trim: trim-start) and (text-box-edge: cap alphabetic)) {
+	.era-notes-prose .tiptap > :first-child {
+		/* -0.45em of untrimmed leading, plus the same +0.22em optical
+		 * allowance the trimmed path adds above. */
+		margin-top: -0.23em;
+	}
+}
+
+/* Placeholder, via @tiptap/extension-placeholder */
+.era-notes-prose .tiptap p.is-editor-empty:first-child::before {
+	content: attr(data-placeholder);
+	float: left;
+	height: 0;
+	color: var(--color-muted);
+	pointer-events: none;
+}
+
+/* Typography */
+.era-notes-prose .tiptap p {
+	margin: 0 0 var(--era-gap);
+}
+.era-notes-prose .tiptap p:last-child {
+	margin-bottom: 0;
+}
+.era-notes-prose .tiptap h1 {
+	font-size: 1.5em;
+}
+.era-notes-prose .tiptap h2 {
+	font-size: 1.25em;
+}
+.era-notes-prose .tiptap h3 {
+	font-size: 1.1em;
+}
+.era-notes-prose .tiptap h1,
+.era-notes-prose .tiptap h2,
+.era-notes-prose .tiptap h3 {
+	margin: 0 0 var(--era-gap);
+	font-weight: 600;
+	line-height: 1.6;
+	color: var(--color-bright);
+}
+.era-notes-prose .tiptap strong {
+	font-weight: 600;
+	color: var(--color-bright);
+}
+.era-notes-prose .tiptap em {
+	font-style: italic;
+}
+.era-notes-prose .tiptap s {
+	text-decoration: line-through;
+	text-decoration-thickness: 0.5px;
+}
+
+/* Code — inline chips take the xxs radius, blocks the lg one a Card uses. */
+.era-notes-prose .tiptap code {
+	padding: 1px var(--era-inset-xxs);
+	border-radius: var(--era-rd-xxs);
+	background: var(--era-surface-bg-elevated);
+}
+.era-notes-prose .tiptap pre {
+	overflow-x: auto;
+	margin: 0 0 var(--era-gap);
+	padding: var(--era-inset-md);
+	border-radius: var(--era-rd-lg);
+	background: var(--color-surface);
+	box-shadow: var(--era-shadow);
+}
+.era-notes-prose .tiptap pre code {
+	padding: 0;
+	border-radius: 0;
+	background: transparent;
+}
+
+/* Syntax highlighting — the neutral scale, so it themes with everything else. */
+.era-notes-prose .tiptap pre .hljs-keyword,
+.era-notes-prose .tiptap pre .hljs-built_in {
+	color: var(--color-9);
+}
+.era-notes-prose .tiptap pre .hljs-string,
+.era-notes-prose .tiptap pre .hljs-regexp {
+	color: var(--color-10);
+}
+.era-notes-prose .tiptap pre .hljs-number,
+.era-notes-prose .tiptap pre .hljs-literal,
+.era-notes-prose .tiptap pre .hljs-type,
+.era-notes-prose .tiptap pre .hljs-class {
+	color: var(--color-11);
+}
+.era-notes-prose .tiptap pre .hljs-comment {
+	color: var(--color-8);
+}
+.era-notes-prose .tiptap pre .hljs-function,
+.era-notes-prose .tiptap pre .hljs-title {
+	font-weight: 600;
+	color: var(--color-9);
+}
+.era-notes-prose .tiptap pre .hljs-variable,
+.era-notes-prose .tiptap pre .hljs-attr {
+	color: var(--color-12);
+}
+.era-notes-prose .tiptap pre .hljs-params {
+	color: var(--color-11);
+}
+.era-notes-prose .tiptap pre .hljs-meta,
+.era-notes-prose .tiptap pre .hljs-tag {
+	color: var(--color-10);
+}
+
+/* Blockquote */
+.era-notes-prose .tiptap blockquote {
+	margin: 0 0 var(--era-gap);
+	padding-left: var(--era-inset-md);
+	border-left: 2px solid var(--era-divider-color);
+	color: var(--color-muted);
+}
+
+/* Lists */
+.era-notes-prose .tiptap li,
+.era-notes-prose .tiptap li p,
+.era-notes-prose .tiptap ul,
+.era-notes-prose .tiptap ol {
+	margin: 0;
+}
+.era-notes-prose .tiptap ul {
+	padding-left: 1.4em;
+	list-style-type: disc;
+}
+.era-notes-prose .tiptap ol {
+	padding-left: 1.9em;
+	list-style-type: decimal;
+}
+
+/* Task list — a checkbox styled like era's Checkbox, at the icon tier. */
+.era-notes-prose .tiptap .task-list {
+	padding-left: 0;
+	list-style: none;
+}
+.era-notes-prose .tiptap .task-item {
+	display: flex;
+	gap: var(--era-gap);
+}
+.era-notes-prose .tiptap .task-item label {
+	/* Match the line box so the box centres against the first line of text. */
+	display: flex;
+	align-items: center;
+	height: calc(var(--era-text) * 1.6);
+}
+.era-notes-prose .tiptap .task-item input[type='checkbox'] {
+	flex-shrink: 0;
+	width: calc(var(--era-h-xs) - 4px);
+	height: calc(var(--era-h-xs) - 4px);
+	border-radius: var(--era-rd-xs);
+	background: var(--era-surface-bg-elevated);
+	box-shadow: var(--era-shadow-well);
+	appearance: none;
+	cursor: pointer;
+	transition:
+		background var(--era-duration) var(--era-ease),
+		box-shadow var(--era-duration) var(--era-ease);
+}
+.era-notes-prose .tiptap .task-item input[type='checkbox']:hover {
+	background: var(--era-highlight);
+}
+.era-notes-prose .tiptap .task-item input[type='checkbox']:checked {
+	background: var(--color-primary);
+	box-shadow: var(--era-shadow-pressed);
+}
+.era-notes-prose .tiptap .task-item[data-checked='true'] > div > p {
+	color: var(--color-muted);
+	text-decoration: line-through;
+}
+
+/* Horizontal rule */
+.era-notes-prose .tiptap hr {
+	margin: var(--era-gap) 0;
+	border: none;
+	border-top: 1px solid var(--era-divider-color);
+}
+
+/* Links — the era-link recipe, inlined because ProseMirror owns this DOM. */
+.era-notes-prose .tiptap a {
+	color: var(--color-link);
+	text-decoration-line: underline;
+	text-decoration-color: color-mix(in oklch, currentColor 30%, transparent);
+	text-underline-offset: 0.2em;
+	cursor: pointer;
+	transition: text-decoration-color var(--era-duration) var(--era-ease);
+}
+.era-notes-prose .tiptap a:hover {
+	text-decoration-color: currentColor;
+}
+
+/* Highlight — the warning token PAIR, not a wash of it.
+ *
+ * This was a 25% warning tint with `color: inherit`, which is two problems at
+ * once: at 25% the mark barely separates from the page, and pushing the alpha
+ * up to fix that puts light body text on yellow, which is worse. The pair
+ * exists for exactly this — warning-fg is dark in EVERY mode by design
+ * (see themes.css: yellow cannot carry light text), so a solid fill reads as
+ * a real highlighter and the text on it stays legible in both modes. */
+.era-notes-prose .tiptap mark {
+	padding: 1px 0;
+	background: var(--color-warning);
+	color: var(--color-warning-fg);
+}
+
+/* Table */
+.era-notes-prose .tiptap .note-table {
+	width: 100%;
+	margin: 0 0 var(--era-gap);
+	border-collapse: collapse;
+	table-layout: fixed;
+}
+.era-notes-prose .tiptap .note-table td,
+.era-notes-prose .tiptap .note-table th {
+	padding: var(--era-inset-sm) var(--era-inset-md);
+	border: 1px solid var(--era-divider-color);
+	text-align: left;
+	vertical-align: top;
+}
+.era-notes-prose .tiptap .note-table th {
+	background: var(--color-surface);
+	font-weight: 600;
+	color: var(--color-bright);
+}
+.era-notes-prose .tiptap .note-table td > p,
+.era-notes-prose .tiptap .note-table th > p {
+	margin: 0;
+}
+
+/* Details (collapsible) */
+.era-notes-prose .tiptap details {
+	margin: 0 0 var(--era-gap);
+	padding: var(--era-inset-sm) var(--era-inset-md);
+	border-radius: var(--era-rd-md);
+	background: var(--era-surface-bg-elevated);
+	box-shadow: var(--era-shadow);
+}
+.era-notes-prose .tiptap details summary {
+	font-weight: 600;
+	color: var(--color-bright);
+	cursor: pointer;
+}
+.era-notes-prose .tiptap details > div {
+	margin-top: var(--era-gap);
+}
+
+/* Image */
+.era-notes-prose .tiptap img {
+	max-width: 100%;
+	height: auto;
+	border-radius: var(--era-rd-md);
+}
+
+/*
+ * ProseMirror ships hardcoded selection colours (#8cf outlines, a black gap
+ * cursor, rgba(200,200,255,.4) cell selection, #adf resize handles). Each is
+ * overridden here or the editor shows chrome from a different design system.
+ */
+.era-notes-prose .tiptap .ProseMirror-selectednode {
+	outline: 2px solid var(--color-primary);
+}
+.era-notes-prose .tiptap li.ProseMirror-selectednode {
+	outline: none;
+}
+.era-notes-prose .tiptap li.ProseMirror-selectednode::after {
+	border-color: var(--color-primary);
+}
+.era-notes-prose .ProseMirror-gapcursor::after {
+	border-top-color: var(--color-primary);
+}
+.era-notes-prose .tiptap .selectedCell::after {
+	background: var(--era-highlight);
+}
+.era-notes-prose .tiptap .column-resize-handle {
+	background-color: var(--color-primary);
+}
+/* NO ::selection rule here, deliberately.
+ *
+ * era owns text selection as a surface token contract — --era-selection-bg /
+ * -fg / -shadow (surfaces/base.css), which is how flat gets inverse video,
+ * glass a glowing wash, and bevel an opaque accent bar. This file used to
+ * override it with `background: var(--color-4)` and no `color`, which threw
+ * all of that away AND left body text on a mid-scale grey: the band barely
+ * separated from the page and the glyphs sat on top of it at whatever
+ * contrast happened to fall out. Dropping the override restores both the
+ * contrast (bright fill, --color-1 glyphs) and the per-surface treatment.
+ *
+ * The ProseMirror overrides above are still needed — those replace hardcoded
+ * library chrome that no era token would otherwise reach. */

package/dist/styles/video-player.css

@@ -0,0 +1,27 @@
+/*
+ * VideoPlayer's third-party stylesheets — vidstack's base layout plus the
+ * slider/button/menu primitives the component composes.
+ *
+ * Split out of index.css because it is 46KB that only one component needs:
+ * imported there, every consumer paid 37% of the built stylesheet for a player
+ * they never mounted. Everything here is scoped internally by vidstack to
+ * `:where(media-player)`, so it affects nothing outside a player subtree —
+ * which is exactly why it can be omitted safely.
+ *
+ * Import alongside the core stylesheet when (and only when) you render
+ * `VideoPlayer`:
+ *
+ *   import '@signal9/era-ui/styles';                 // always
+ *   import '@signal9/era-ui/styles/video-player';    // only with the player
+ *
+ * Era's own token theming is applied on the component via CSS variables, not
+ * here, so this file is pure vendor CSS and needs no era imports.
+ */
+@import 'vidstack/styles/base.css';
+@import 'vidstack/styles/ui/buttons.css';
+@import 'vidstack/styles/ui/sliders.css';
+@import 'vidstack/styles/ui/buffering.css';
+@import 'vidstack/styles/ui/captions.css';
+@import 'vidstack/styles/ui/live.css';
+@import 'vidstack/styles/ui/menus.css';
+@import 'vidstack/styles/ui/tooltips.css';

package/dist/ui/calendar/calendar-root.svelte.d.ts

@@ -1,4 +1,4 @@
 import { Calendar } from 'bits-ui';
-declare const CalendarRoot: import("svelte").Component<Calendar.RootProps, {}, "value" | "placeholder" | "ref">;
+declare const CalendarRoot: import("svelte").Component<Calendar.RootProps, {}, "placeholder" | "value" | "ref">;
 type CalendarRoot = ReturnType<typeof CalendarRoot>;
 export default CalendarRoot;

package/dist/ui/date-field/date-field-root.svelte.d.ts

@@ -1,3 +1,3 @@
-declare const DateFieldRoot: import("svelte").Component<import("bits-ui").DateFieldRootPropsWithoutHTML, {}, "value" | "placeholder">;
+declare const DateFieldRoot: import("svelte").Component<import("bits-ui").DateFieldRootPropsWithoutHTML, {}, "placeholder" | "value">;
 type DateFieldRoot = ReturnType<typeof DateFieldRoot>;
 export default DateFieldRoot;

package/dist/ui/date-picker/date-picker-root.svelte.d.ts

@@ -1,3 +1,3 @@
-declare const DatePickerRoot: import("svelte").Component<import("bits-ui").DatePickerRootPropsWithoutHTML, {}, "value" | "placeholder" | "open">;
+declare const DatePickerRoot: import("svelte").Component<import("bits-ui").DatePickerRootPropsWithoutHTML, {}, "placeholder" | "value" | "open">;
 type DatePickerRoot = ReturnType<typeof DatePickerRoot>;
 export default DatePickerRoot;

package/dist/ui/date-range-field/date-range-field-root.svelte.d.ts

@@ -1,4 +1,4 @@
 import { DateRangeField } from 'bits-ui';
-declare const DateRangeFieldRoot: import("svelte").Component<DateRangeField.RootProps, {}, "value" | "placeholder" | "ref">;
+declare const DateRangeFieldRoot: import("svelte").Component<DateRangeField.RootProps, {}, "placeholder" | "value" | "ref">;
 type DateRangeFieldRoot = ReturnType<typeof DateRangeFieldRoot>;
 export default DateRangeFieldRoot;

package/dist/ui/date-range-picker/date-range-picker-root.svelte.d.ts

@@ -1,4 +1,4 @@
 import { DateRangePicker } from 'bits-ui';
-declare const DateRangePickerRoot: import("svelte").Component<DateRangePicker.RootProps, {}, "value" | "placeholder" | "open">;
+declare const DateRangePickerRoot: import("svelte").Component<DateRangePicker.RootProps, {}, "placeholder" | "value" | "open">;
 type DateRangePickerRoot = ReturnType<typeof DateRangePickerRoot>;
 export default DateRangePickerRoot;

package/dist/ui/input/textarea.svelte

@@ -24,5 +24,4 @@
 		'resize-y py-(--era-inset-md)',
 		className
 	)}
-	{...restProps}
-></textarea>
+	{...restProps}></textarea>

package/dist/ui/time-field/time-field-root.svelte.d.ts

@@ -1,4 +1,4 @@
 import { TimeField } from 'bits-ui';
-declare const TimeFieldRoot: import("svelte").Component<TimeField.RootProps, {}, "value" | "placeholder">;
+declare const TimeFieldRoot: import("svelte").Component<TimeField.RootProps, {}, "placeholder" | "value">;
 type TimeFieldRoot = ReturnType<typeof TimeFieldRoot>;
 export default TimeFieldRoot;

package/dist/ui/time-range-field/time-range-field-root.svelte.d.ts

@@ -1,4 +1,4 @@
 import { TimeRangeField } from 'bits-ui';
-declare const TimeRangeFieldRoot: import("svelte").Component<TimeRangeField.RootProps, {}, "value" | "placeholder" | "ref">;
+declare const TimeRangeFieldRoot: import("svelte").Component<TimeRangeField.RootProps, {}, "placeholder" | "value" | "ref">;
 type TimeRangeFieldRoot = ReturnType<typeof TimeRangeFieldRoot>;
 export default TimeRangeFieldRoot;

package/dist/ui/video-player/video-player.svelte

@@ -548,7 +548,9 @@
 	function handleSeekKeydown(e: KeyboardEvent) {
 		if (seekDisabled) return;
 		const base = readMediaTime() ?? currentTime;
-		let next: number | null = null;
+		// No initialiser: every arm below either assigns or returns, so one here
+		// would be dead — and eslint's no-useless-assignment says so.
+		let next: number;
 		switch (e.key) {
 			case 'ArrowLeft':
 			case 'ArrowDown':