@takazudo/zdtp 0.5.2 → 0.6.1

package/dist/dashboard/styles.css

@@ -0,0 +1,294 @@
+/* Static dashboard chrome deliberately uses no inventory custom properties.
+   The namespace and div/span markup protect documentation hosts from tag resets. */
+.zdtp-dashboard,
+.zdtp-dashboard * {
+  box-sizing: border-box;
+}
+
+.zdtp-dashboard {
+  min-inline-size: 0;
+  max-inline-size: 100%;
+  border: 1px solid #dce1e8;
+  border-radius: 10px;
+  background: #f8fafc;
+  color: #182131;
+  color-scheme: light;
+  font: 400 14px/1.5 system-ui, sans-serif;
+  letter-spacing: normal;
+  text-align: start;
+  text-transform: none;
+  white-space: normal;
+  overflow-wrap: anywhere;
+}
+
+.zdtp-dashboard :where(div, span) {
+  min-inline-size: 0;
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font: inherit;
+  color: inherit;
+  letter-spacing: inherit;
+  text-transform: none;
+  box-shadow: none;
+}
+
+.zdtp-dashboard__header {
+  display: grid;
+  gap: 8px;
+  padding: 20px;
+  border-block-end: 1px solid #dce1e8;
+}
+
+.zdtp-dashboard__title {
+  font-size: 22px;
+  font-weight: 700;
+  line-height: 1.25;
+}
+
+.zdtp-dashboard__summary {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: 4px 16px;
+  color: #536174;
+  font-size: 12px;
+}
+
+.zdtp-dashboard__count {
+  color: #182131;
+  font-weight: 600;
+}
+
+.zdtp-dashboard__inventory {
+  display: grid;
+  gap: 32px;
+  padding: 20px;
+}
+
+.zdtp-dashboard__tab {
+  display: grid;
+  gap: 20px;
+}
+
+.zdtp-dashboard__tab-header {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: 4px 12px;
+  padding-block-end: 8px;
+  border-block-end: 1px solid #dce1e8;
+}
+
+.zdtp-dashboard__tab-title {
+  font-size: 18px;
+  font-weight: 700;
+}
+
+.zdtp-dashboard__tab-count {
+  color: #536174;
+  font-size: 12px;
+}
+
+.zdtp-dashboard__tier {
+  display: grid;
+  gap: 10px;
+}
+
+.zdtp-dashboard__tier-title {
+  font-weight: 600;
+}
+
+.zdtp-dashboard__grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr));
+  gap: 12px;
+}
+
+.zdtp-dashboard__token {
+  display: flex;
+  flex-direction: column;
+  border: 1px solid #dce1e8;
+  border-radius: 6px;
+  background: #fff;
+  color: #182131;
+}
+
+.zdtp-dashboard__token-content {
+  display: grid;
+  align-content: start;
+  gap: 5px;
+  padding: 12px;
+}
+
+.zdtp-dashboard__name {
+  font-weight: 600;
+}
+
+.zdtp-dashboard__variable,
+.zdtp-dashboard__value,
+.zdtp-dashboard__reference {
+  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
+  font-size: 12px;
+  white-space: pre-wrap;
+}
+
+.zdtp-dashboard__variable,
+.zdtp-dashboard__reference {
+  color: #536174;
+}
+
+.zdtp-dashboard__value {
+  padding-block-start: 5px;
+  color: #182131;
+}
+
+.zdtp-dashboard__diagnostic {
+  margin-block-start: 3px;
+  padding: 8px;
+  border-inline-start: 2px solid #9d641a;
+  background: #fff5e6;
+  color: #704612;
+  font-size: 12px;
+}
+
+.zdtp-dashboard__preview {
+  display: flex;
+  align-items: center;
+  padding: 16px;
+  block-size: 88px;
+  border-block-end: 1px solid #dce1e8;
+  border-start-start-radius: 5px;
+  border-start-end-radius: 5px;
+  background: #eef1f5;
+  color: #182131;
+  overflow: hidden;
+}
+
+.zdtp-dashboard[data-mode='dark'] .zdtp-dashboard__preview {
+  background: #222936;
+  color: #f1f5f9;
+}
+
+.zdtp-dashboard__sample {
+  display: block;
+  flex: none;
+  max-inline-size: 100%;
+}
+
+.zdtp-dashboard__preview--color {
+  padding: 0;
+  background: repeating-conic-gradient(#e2e6eb 0% 25%, #fff 0% 50%) 0 / 16px 16px;
+}
+
+.zdtp-dashboard[data-mode='dark'] .zdtp-dashboard__preview--color {
+  background: repeating-conic-gradient(#3e4652 0% 25%, #252c37 0% 50%) 0 / 16px 16px;
+}
+
+.zdtp-dashboard__sample--color {
+  inline-size: 100%;
+  block-size: 100%;
+}
+
+.zdtp-dashboard__sample--bar {
+  block-size: 16px;
+  background: currentColor;
+}
+
+.zdtp-dashboard__sample--radius,
+.zdtp-dashboard__sample--shadow {
+  inline-size: 64px;
+  block-size: 48px;
+  background: #fff;
+  border: 1px solid #8290a3;
+}
+
+.zdtp-dashboard__sample--family,
+.zdtp-dashboard__sample--weight,
+.zdtp-dashboard__sample--line-height {
+  font-size: 18px;
+}
+
+.zdtp-dashboard__sample--line-height {
+  white-space: pre-line;
+}
+
+.zdtp-dashboard__empty {
+  color: #536174;
+}
+
+/* Wide rows use their embedding width, including narrow documentation columns. */
+.zdtp-dashboard { container: zdtp-dashboard / inline-size; }
+.zdtp-dashboard__token--wide {
+  grid-column: 1 / -1;
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  border-radius: 0;
+}
+.zdtp-dashboard__token--wide > .zdtp-dashboard__token-content { order: -1; }
+.zdtp-dashboard__scroll {
+  max-inline-size: 100%;
+  overflow: auto;
+  overscroll-behavior-inline: contain;
+}
+.zdtp-dashboard__scroll:focus-visible {
+  outline: 2px solid #245caa;
+  outline-offset: -2px;
+}
+.zdtp-dashboard__ruler-wrap { padding: 12px; }
+.zdtp-dashboard__ruler-caption,
+.zdtp-dashboard__preview-unavailable {
+  color: #536174;
+  font-size: 12px;
+  padding: 12px;
+}
+.zdtp-dashboard__ruler-caption { padding: 0 0 8px; }
+.zdtp-dashboard__ruler {
+  position: relative;
+  block-size: 64px;
+  padding-block-start: 36px;
+  background:
+    repeating-linear-gradient(to right, #8290a3 0 1px, transparent 1px 64px) left 24px / 100% 12px no-repeat,
+    repeating-linear-gradient(to right, #c4ccd7 0 1px, transparent 1px 8px) left 30px / 100% 6px no-repeat;
+}
+.zdtp-dashboard__ruler-origin { position: absolute; inset-block-start: 0; inset-inline-start: 0; font-size: 12px; }
+.zdtp-dashboard__sample--bar {
+  max-inline-size: none;
+  min-inline-size: 0;
+  border: 0;
+  padding: 0;
+  background: #526c92;
+}
+.zdtp-dashboard__palette {
+  display: flex;
+  gap: 0;
+  inline-size: max-content;
+  min-inline-size: 100%;
+}
+.zdtp-dashboard__palette > .zdtp-dashboard__token {
+  display: grid;
+  grid-template-rows: minmax(88px, auto) 1fr;
+  align-content: start;
+  flex: 1 0 156px;
+  inline-size: 156px;
+  border-radius: 0;
+}
+.zdtp-dashboard__palette > .zdtp-dashboard__token > .zdtp-dashboard__token-content { grid-row: 2; }
+.zdtp-dashboard__palette .zdtp-dashboard__preview { border-radius: 0; }
+.zdtp-dashboard__preview--typography {
+  display: block;
+  block-size: auto;
+  padding: 20px;
+  border: 0;
+  border-radius: 0;
+}
+.zdtp-dashboard__preview--typography > .zdtp-dashboard__sample {
+  font: 400 18px/1.6 system-ui, sans-serif;
+  letter-spacing: normal;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  max-inline-size: 100%;
+}
+@container zdtp-dashboard (min-width: 640px) {
+  .zdtp-dashboard__token--wide { grid-template-columns: 220px minmax(0, 1fr); }
+}

package/dist/dashboard/token-dashboard.d.ts

@@ -0,0 +1,23 @@
+import type { JSX } from 'preact';
+import type { TabConfig, TierConfig } from "../tokens/tier-model.js";
+import type { DashboardMode } from "./types.js";
+/** Visual samples are independent from the panel's editor kind. */
+export type DashboardPreviewKind = NonNullable<TierConfig['preview']> | 'color' | 'shadow' | 'text';
+export interface TokenDashboardProps {
+    tabs: readonly TabConfig[];
+    /** Selects declared per-mode defaults. Does not read the host or panel mode. */
+    mode?: DashboardMode;
+    title?: string;
+    /** Static multiline typography specimen. Empty strings are preserved. */
+    previewText?: string;
+    /** Optional root ID. Supply distinct IDs when rendering multiple instances. */
+    id?: string;
+    /** Per-variable sample choices, including text-editor colors and shadows. */
+    previewOverrides?: Readonly<Record<string, DashboardPreviewKind>>;
+}
+/**
+ * A complete, read-only inventory of declared defaults. Works with Preact's
+ * server renderer without hydration, browser globals, or panel configuration.
+ * Include @takazudo/zdtp/dashboard/styles.css through the host's CSS pipeline.
+ */
+export declare function TokenDashboard({ tabs, mode, title, id, previewOverrides, previewText, }: TokenDashboardProps): JSX.Element;

package/dist/dashboard/types.d.ts

@@ -0,0 +1,62 @@
+import type { TierConfig, TierValueKind } from "../tokens/tier-model.js";
+/** Internal, render-independent description of declared token defaults. */
+export type DashboardMode = 'light' | 'dark';
+export interface DashboardDiagnostic {
+    code: string;
+    severity: 'warning' | 'error';
+    message: string;
+    rowKey?: string;
+}
+export interface DashboardReference {
+    key: string;
+    cssVar: string;
+    label: string;
+}
+export interface DashboardRow {
+    /** Positional identity stays unique even when a manifest repeats identifiers. */
+    key: string;
+    tabId: string;
+    tierId: string;
+    itemId: string;
+    label: string;
+    cssVar: string;
+    kind: TierValueKind['kind'];
+    source: 'item' | 'base-role';
+    defaultValue: string;
+    /** Human-readable selected-mode declaration, including explicit semantic overrides. */
+    declaredValue: string;
+    /** Safe local CSS declaration; null for an invalid or ambiguous declaration. */
+    cssValue: string | null;
+    /**
+     * Follows direct declared references only, never computes CSS. Expressions
+     * remain expressions. Null means invalid or dependent on unknown context;
+     * the renderer must not show a value preview in that case.
+     */
+    resolvedValue: string | null;
+    references: DashboardReference[];
+    diagnostics: DashboardDiagnostic[];
+}
+export interface DashboardTier {
+    key: string;
+    id: string;
+    label: string;
+    /** Nonsemantic, non-reference, color-only source tier. */
+    palette?: boolean;
+    preview?: TierConfig['preview'];
+    previewBase?: string;
+    rows: DashboardRow[];
+}
+export interface DashboardTab {
+    key: string;
+    id: string;
+    label: string;
+    tiers: DashboardTier[];
+}
+export interface DashboardModel {
+    mode: DashboardMode;
+    tabs: DashboardTab[];
+    rows: DashboardRow[];
+    /** Declare these on each preview scope, never on :root or the document. */
+    declarations: Readonly<Record<string, string>>;
+    diagnostics: DashboardDiagnostic[];
+}

package/dist/dom-tweaker/dom-tweaker-diff-action-link.d.ts

@@ -1,5 +1,5 @@
 import type { JSX } from 'preact';
-import type { PanelConfig } from '../config/panel-config';
+import type { PanelConfig } from "../config/panel-config.js";
 export interface DomTweakerDiffActionLinkProps {
     instanceConfig: PanelConfig;
     onSelected?: () => void;

package/dist/dom-tweaker/dom-tweaker-orchestrator.d.ts

@@ -10,7 +10,7 @@
  *      explicit scalar config values into that boundary.
  */
 import type { ComponentChildren, JSX } from 'preact';
-import type { PanelConfig } from '../config/panel-config';
+import type { PanelConfig } from "../config/panel-config.js";
 export declare function DomTweakerOrchestrator({ children, instanceConfig, }: {
     children: ComponentChildren;
     instanceConfig: PanelConfig;

package/dist/dom-tweaker/dom-tweaker-state.d.ts

@@ -6,7 +6,7 @@
  * time (never at module init), so a late `configurePanel({ storagePrefix })`
  * is respected by no-arg callers.
  */
-import { type PanelConfig } from '../config/panel-config';
+import { type PanelConfig } from "../config/panel-config.js";
 export declare function storageKey_domTweakerEnabled(cfg?: PanelConfig): string;
 /**
  * Load the persisted enabled flag from localStorage. Defaults to `false` on

package/dist/dom-tweaker/lazy/class-editor-popup.d.ts

@@ -1,5 +1,5 @@
 import type { JSX } from 'preact';
-import { type TrackedElementRect } from './pinned-selection-overlay';
+import { type TrackedElementRect } from "./pinned-selection-overlay.js";
 export interface ClassEditorPopupProps {
     target: Element | null;
     selectorSummary: string;

package/dist/dom-tweaker/lazy/diff-export-modal.d.ts

@@ -1,5 +1,5 @@
 import type { JSX } from 'preact';
-import { type PanelConfig } from '../../config/panel-config';
+import { type PanelConfig } from "../../config/panel-config.js";
 export interface DiffExportModalProps {
     diffText: string;
     onClose: () => void;

package/dist/dom-tweaker/lazy/index.d.ts

@@ -8,8 +8,8 @@
  * lazy boundary does not read global panel config.
  */
 import type { JSX } from 'preact';
-import type { DomTweakerRuntimeStatus } from '../dom-tweaker-context';
-export { buildStaticSuggestions, buildSuggestions, buildThemeSuggestions, filterSuggestions, STATIC_SUGGESTIONS, } from './suggestions';
+import type { DomTweakerRuntimeStatus } from "../dom-tweaker-context.js";
+export { buildStaticSuggestions, buildSuggestions, buildThemeSuggestions, filterSuggestions, STATIC_SUGGESTIONS, } from "./suggestions.js";
 export interface DomTweakerLazyBoundaryProps {
     enabled: boolean;
     storagePrefix: string;

package/dist/element-inspect/element-inspect-context.d.ts

@@ -1,4 +1,4 @@
-import type { FindTokensForElementResult } from './find-tokens-for-element';
+import type { FindTokensForElementResult } from "./find-tokens-for-element.js";
 /** The synthetic tab id used by the transient element-inspect view. */
 export declare const ELEMENT_INSPECT_TAB_ID = "inspect";
 export interface ElementInspectContextValue {

package/dist/element-inspect/element-inspect-orchestrator.d.ts

@@ -1,7 +1,7 @@
 import type { ComponentChildren } from 'preact';
-import type { PanelConfig } from '../config/panel-config';
-import type { TweakState } from '../state/tweak-state';
-import type { CommitTweakStateOptions, TweakStateUpdater } from '../state/transaction';
+import type { PanelConfig } from "../config/panel-config.js";
+import type { TweakState } from "../state/tweak-state.js";
+import type { CommitTweakStateOptions, TweakStateUpdater } from "../state/transaction.js";
 type CommitTweakState = (reason: string, next: TweakStateUpdater, options?: CommitTweakStateOptions) => void;
 export interface ElementInspectOrchestratorProps {
     children: ComponentChildren;

package/dist/element-inspect/element-inspect-overlay.d.ts

@@ -1,6 +1,6 @@
 import type { JSX } from 'preact';
 /** Body-level mount used by the picker and the pinned inspect marker. */
-export { ELEMENT_INSPECT_PORTAL_MOUNT_ID } from '../highlight/find-elements';
+export { ELEMENT_INSPECT_PORTAL_MOUNT_ID } from "../highlight/find-elements.js";
 /** Class hooks shared by the hover picker and the pinned overlay. */
 export declare const ELEMENT_INSPECT_PICKER_CLASS_NAMES: {
     readonly box: "tokenpanel-element-inspect-box";

package/dist/element-inspect/find-tokens-for-element.d.ts

@@ -1,4 +1,4 @@
-import type { TokenAddress, TokenIndex, TokenIndexEntry } from '../utils/token-index';
+import type { TokenAddress, TokenIndex, TokenIndexEntry } from "../utils/token-index.js";
 export interface ElementTokenMatch {
     property: string;
     cssVar: string;

package/dist/element-inspect/index.d.ts

@@ -1,8 +1,8 @@
-export { findTokensForElement } from './find-tokens-for-element';
-export type { ElementTokenMatch, ElementTokenPropertyGroup, FindTokensForElementResult, } from './find-tokens-for-element';
-export { ElementInspectOrchestrator, type ElementInspectOrchestratorProps, } from './element-inspect-orchestrator';
-export { ElementInspectOverlay, ELEMENT_INSPECT_PORTAL_MOUNT_ID } from './element-inspect-overlay';
-export { ElementInspectToggleButton } from './element-inspect-toggle-button';
-export { ElementInspectView, type ElementInspectViewProps } from './element-inspect-view';
-export { ElementInspectContext, ELEMENT_INSPECT_TAB_ID, } from './element-inspect-context';
-export type { ElementInspectContextValue } from './element-inspect-context';
+export { findTokensForElement } from "./find-tokens-for-element.js";
+export type { ElementTokenMatch, ElementTokenPropertyGroup, FindTokensForElementResult, } from "./find-tokens-for-element.js";
+export { ElementInspectOrchestrator, type ElementInspectOrchestratorProps, } from "./element-inspect-orchestrator.js";
+export { ElementInspectOverlay, ELEMENT_INSPECT_PORTAL_MOUNT_ID } from "./element-inspect-overlay.js";
+export { ElementInspectToggleButton } from "./element-inspect-toggle-button.js";
+export { ElementInspectView, type ElementInspectViewProps } from "./element-inspect-view.js";
+export { ElementInspectContext, ELEMENT_INSPECT_TAB_ID, } from "./element-inspect-context.js";
+export type { ElementInspectContextValue } from "./element-inspect-context.js";

package/dist/element-path/element-path-state.d.ts

@@ -10,7 +10,7 @@
  * `panelConfig.storagePrefix` at call-time (never at module init) so a host's
  * `configurePanel({ storagePrefix })` is respected.
  */
-import type { PanelConfig } from '../config/panel-config';
+import type { PanelConfig } from "../config/panel-config.js";
 /**
  * Load the persisted enabled flag from localStorage. Defaults to `false`
  * (inspect mode off) on any parse/access failure or when absent.

package/dist/element-path/index.d.ts

@@ -5,10 +5,10 @@
  * DevTools-style highlight, click to copy an annotated path block to the
  * clipboard) for precise human↔AI communication about the page.
  */
-export { ElementPathOrchestrator } from './element-path-orchestrator';
-export { ElementPathToggleButton } from './element-path-toggle-button';
-export { ElementPathContext } from './element-path-context';
-export type { ElementPathContextValue } from './element-path-context';
-export { buildElementPath, buildElementPathString, formatElementPath, buildUniqueSelector, buildBreadcrumb, } from './build-element-path';
-export type { ElementPathResult } from './build-element-path';
-export { loadElementPathEnabled, saveElementPathEnabled } from './element-path-state';
+export { ElementPathOrchestrator } from "./element-path-orchestrator.js";
+export { ElementPathToggleButton } from "./element-path-toggle-button.js";
+export { ElementPathContext } from "./element-path-context.js";
+export type { ElementPathContextValue } from "./element-path-context.js";
+export { buildElementPath, buildElementPathString, formatElementPath, buildUniqueSelector, buildBreadcrumb, } from "./build-element-path.js";
+export type { ElementPathResult } from "./build-element-path.js";
+export { loadElementPathEnabled, saveElementPathEnabled } from "./element-path-state.js";

package/dist/export-modal.d.ts

@@ -22,8 +22,8 @@
  * programmatic "Close" button) routes through `dialog.close()` so the native
  * `close` event — and thus `onClose` — fires exactly once per dismissal.
  */
-import { type ColorTweakState, type TweakState } from './state/tweak-state';
-import { type PanelConfig } from './config/panel-config';
+import { type ColorTweakState, type TweakState } from "./state/tweak-state.js";
+import { type PanelConfig } from "./config/panel-config.js";
 export interface ExportModalProps {
     onClose: () => void;
     /** Full unified tweak state — the modal serializes all four categories. */

package/dist/highlight/highlight-orchestrator.d.ts

@@ -14,8 +14,8 @@
  * overlay persists even when the panel is closed.
  */
 import type { ComponentChildren } from 'preact';
-import { type PanelConfig } from '../config/panel-config';
-import type { TierValueKind } from '../tokens/tier-model';
+import { type PanelConfig } from "../config/panel-config.js";
+import type { TierValueKind } from "../tokens/tier-model.js";
 type ProbeKind = 'color' | 'length' | 'number' | 'text' | 'easing' | 'cursor' | 'content' | 'mask-image';
 export declare function tierKindToProbeKind(t: TierValueKind | undefined): ProbeKind | undefined;
 export interface HighlightOrchestratorProps {

package/dist/highlight/highlight-state.d.ts

@@ -14,7 +14,7 @@
  *   outlineWidth → localStorage  (survives full page reload — user width setting kept)
  *   active       → sessionStorage (cleared on reload — inspection set is ephemeral)
  */
-import { type PanelConfig } from '../config/panel-config';
+import { type PanelConfig } from "../config/panel-config.js";
 export interface HighlightSlotSpec {
     color: string;
 }

package/dist/highlight/highlight-toggle-button.d.ts

@@ -11,8 +11,8 @@
  * module.
  */
 import type { JSX } from 'preact';
-import type { HighlightState, HighlightSlotSpec } from './highlight-state';
-import type { TokenAddress } from '../utils/token-index';
+import type { HighlightState, HighlightSlotSpec } from "./highlight-state.js";
+import type { TokenAddress } from "../utils/token-index.js";
 export interface HighlightContextValue {
     state: HighlightState;
     toggle: (cssVar: string) => void;

package/dist/history/buttons.d.ts

@@ -1,4 +1,4 @@
-import type { TweakHistorySnapshot } from '../state/history';
+import type { TweakHistorySnapshot } from "../state/history.js";
 export interface HistoryButtonProps {
     canUndo: boolean;
     onUndo: () => void;

package/dist/history/index.d.ts

@@ -1,3 +1,3 @@
-export { HistoryButtons, HistoryRedoButton, HistoryShortcuts, HistoryUndoButton, type HistoryButtonProps, type HistoryButtonsProps, type HistoryShortcutsProps, } from './buttons';
-export { HistoryRail, type HistoryRailProps } from './rail';
-export { clearSnapshots, getSnapshotKey, isSnapshotState, loadSnapshot, loadSnapshots, removeSnapshot, restoreSnapshotState, saveSnapshot, storageKey_snapshotA, storageKey_snapshotB, useSnapshots, type SnapshotRestoreResult, type SnapshotSlot, type SnapshotSlots, type TweakSnapshot, } from './snapshots';
+export { HistoryButtons, HistoryRedoButton, HistoryShortcuts, HistoryUndoButton, type HistoryButtonProps, type HistoryButtonsProps, type HistoryShortcutsProps, } from "./buttons.js";
+export { HistoryRail, type HistoryRailProps } from "./rail.js";
+export { clearSnapshots, getSnapshotKey, isSnapshotState, loadSnapshot, loadSnapshots, removeSnapshot, restoreSnapshotState, saveSnapshot, storageKey_snapshotA, storageKey_snapshotB, useSnapshots, type SnapshotRestoreResult, type SnapshotSlot, type SnapshotSlots, type TweakSnapshot, } from "./snapshots.js";

package/dist/history/rail.d.ts

@@ -1,5 +1,5 @@
-import type { TweakHistorySnapshot } from '../state/history';
-import type { SnapshotSlot, SnapshotSlots } from './snapshots';
+import type { TweakHistorySnapshot } from "../state/history.js";
+import type { SnapshotSlot, SnapshotSlots } from "./snapshots.js";
 export interface HistoryRailProps {
     history: TweakHistorySnapshot;
     snapshots: SnapshotSlots;

package/dist/history/snapshots.d.ts

@@ -1,5 +1,5 @@
-import { storageKey_snapshotA, storageKey_snapshotB, type PanelConfig } from '../config/panel-config';
-import type { TweakState } from '../state/tweak-state';
+import { storageKey_snapshotA, storageKey_snapshotB, type PanelConfig } from "../config/panel-config.js";
+import type { TweakState } from "../state/tweak-state.js";
 export type SnapshotSlot = 'A' | 'B';
 export interface TweakSnapshot {
     state: TweakState;

package/dist/import-modal.d.ts

@@ -20,8 +20,8 @@
  * programmatic "Close" button) routes through `dialog.close()` so the native
  * `close` event — and thus `onClose` — fires exactly once per dismissal.
  */
-import type { ColorTweakState, TweakState } from './state/tweak-state';
-import { type PanelConfig } from './config/panel-config';
+import type { ColorTweakState, TweakState } from "./state/tweak-state.js";
+import { type PanelConfig } from "./config/panel-config.js";
 export interface ImportModalProps {
     onClose: () => void;
     /** Called with the parsed state when the user hits "Load". The caller is