@takazudo/zdtp 0.4.5 → 0.4.7

package/CHANGELOG.md

@@ -1,5 +1,39 @@
 # Changelog
 
+## 0.4.7
+
+### Fixed
+
+- fix(server): coalesce same-file token groups in createApplyHandler ([#527](https://github.com/Takazudo/zudo-design-token-panel/pull/527)) (1d84c94)
+
+### Other Changes
+
+- chore(deps): resolve 19 pnpm audit security advisories ([#525](https://github.com/Takazudo/zudo-design-token-panel/pull/525)) (80c9a0e)
+
+## 0.4.6
+
+### Features
+
+- Notes tab — host-configurable token notes as the panel's top page ([#515](https://github.com/Takazudo/zudo-design-token-panel/issues/515)) (4169a05)
+- Palette tab: groups collapsed by default with boxed toggle headers ([#517](https://github.com/Takazudo/zudo-design-token-panel/issues/517)) (2ff5a1e)
+- Container-query responsive header & tabs at narrow panel widths, plus "zdtp" panel title + square corners ([#518](https://github.com/Takazudo/zudo-design-token-panel/issues/518)) (25dff1a)
+- Click-to-cycle unit suffix on value inputs ([#519](https://github.com/Takazudo/zudo-design-token-panel/issues/519)) (b05581d)
+- "?" help tooltips for Literal and Per-mode rows in the Color tab ([#520](https://github.com/Takazudo/zudo-design-token-panel/issues/520)) (c85fd69)
+- `zdtp.show()` — fixed-name global open API ([#523](https://github.com/Takazudo/zudo-design-token-panel/issues/523)) (9b3c636)
+
+### Fixed
+
+- Tooltip repositions correctly after panel resize (ResizeObserver initial-delivery fix) ([#516](https://github.com/Takazudo/zudo-design-token-panel/issues/516)) (d10fe16)
+- Closed a C0-control URL-scheme bypass in the notes-tab HTML sanitizer ([#515](https://github.com/Takazudo/zudo-design-token-panel/issues/515)) (19f7147)
+- Corrected kebab-close dead zone + title truncation in the responsive header ([#518](https://github.com/Takazudo/zudo-design-token-panel/issues/518)) (bfc4b81)
+- `window.zdtp` guards against a null instance and clarifies multi-instance behavior ([#523](https://github.com/Takazudo/zudo-design-token-panel/issues/523)) (bcc71aa)
+
+### Other Changes
+
+- docs: notes-tab demo in doc-site manifest; help-icon resize-pin trade-off + sanitizer intent documented (82cf7d8, fe1b477)
+- test: VRT baselines re-recorded for zdtp title + square corners; broad coverage added for notes tab, help icons, unit cycling
+- chore: removed consumed `_temp-resource/` prototype scaffold (ccbd18a)
+
 ## 0.4.5
 
 ### Features

package/README.md

@@ -53,6 +53,8 @@ The package builds against Preact (declared as a `peerDependency`) and ships its
 
 > Visual: a screenshot or short capture would go here. Skipped in the v1 README — a placeholder is worse than nothing. See the external example repos linked in §15 for live demos.
 
+**Browser floor:** the panel's own header/tabbar chrome adapts to the panel's *width* (not the viewport) via CSS container queries, which are Baseline 2023 (Safari 16+). The panel is a developer tool used on evergreen browsers, so older browsers simply keep the wide-layout chrome with no JS fallback.
+
 ---
 
 ## 2. Install
@@ -326,6 +328,22 @@ That is the entire integration. `<DesignTokenPanelHost>` emits a JSON `<script>`
 window.myapp.toggleDesignPanel();
 ```
 
+Or use the fixed-name `zdtp` global — no need to remember your own
+`consoleNamespace`:
+
+```js
+// In the browser devtools console — works regardless of consoleNamespace
+zdtp.show();
+zdtp.hide();
+zdtp.toggle();
+```
+
+`zdtp.show()` / `hide()` / `toggle()` are console sugar for the exact same
+open/close verbs `window.myapp.*` exposes (see §10 for the full contract) —
+`window.myapp.*` keeps working unchanged. On an Astro page, `zdtp.*` is
+available as soon as the host-adapter script has run, even before the panel
+bundle itself has loaded.
+
 Or wire a hidden keyboard shortcut / dev-only button to call the same helper.
 
 ### 4.1.4 Stylesheet (self-injected — no consumer import required)
@@ -472,6 +490,13 @@ export interface PanelInstanceHandle {
 }
 ```
 
+`open()` / `close()` / `toggle()` are the same primitives both
+`window.myapp.*` (§10) and the fixed-name `window.zdtp.*` global (§10) wrap
+for the **default** (most-recently-configured) instance. On a page with more
+than one instance, call `handle.open()` / `.close()` / `.toggle()` directly
+on the specific instance's handle — `window.zdtp.*` always targets the
+default instance only.
+
 ### 5.3 Field summary
 
 | Field                | Type                           | Purpose                                                                                                                                                                |
@@ -1000,6 +1025,27 @@ window.myapp.disableAutoload(); // disarm owner-mode; unmounts the panel
 
 All helpers are **async** — the first call lazy-imports the panel module. Subsequent calls share the memoised module promise and resolve synchronously after the first import completes.
 
+### Fixed-name global: `window.zdtp`
+
+`consoleNamespace` is a **required** field on `PanelConfig` — every consumer picks its own value, so `window[consoleNamespace].*` needs the host's chosen namespace before you can open the panel from the console. `window.zdtp` is an additive, fixed-name alias that needs none:
+
+```ts
+zdtp.show();   // open the panel (lazy-loads the bundle on first call, same as showDesignPanel())
+zdtp.hide();   // close the panel
+zdtp.toggle(); // toggle open/closed
+```
+
+- **`show` / `hide` / `toggle` only.** There is no `zdtp.enableAutoload()` — owner-autoload (§10.1) stays on `window[consoleNamespace].*` and the package-root `enableAutoload()` / `disableAutoload()` exports.
+- **`window[consoleNamespace].*` is unchanged** — `window.zdtp` is sugar layered on top of it, not a replacement. Both stay available side by side.
+- **Targets the default instance**, exactly like the package-root `showDesignTokenPanel()` / `hideDesignTokenPanel()` / `toggleDesignPanel()` exports and `window[consoleNamespace].*` itself. On an Astro host specifically, the alias binds to whichever instance's adapter script installs it first, rather than re-resolving "the current default" on every call — see `PORTABLE-CONTRACT.md` §6.5 for the exact per-install-site rule. For a page with more than one panel instance, use `configurePanel(cfg)`'s returned handle (§5.2) instead — it is unambiguous regardless of install order.
+- **Available on both integration paths:**
+  - Non-Astro hosts get it as soon as `@takazudo/zdtp`'s package-root module has loaded (it installs the alias at module init).
+  - Astro hosts get it as soon as the host-adapter `<script>` has run — **before** the panel bundle itself has loaded. The first `zdtp.*` call lazy-imports the bundle, exactly like `window[consoleNamespace].*`.
+- **Never clobbers a host-defined `window.zdtp`.** If your page already has its own `window.zdtp` for something unrelated, the package leaves it alone and logs a `console.warn` instead of overwriting it — including the edge case of choosing `consoleNamespace: 'zdtp'` yourself.
+- **Auto-remember applies too** — `zdtp.show()` arms the `:autoload` flag exactly like `showDesignPanel()` (§10.1's Auto-remember footgun note applies here as well).
+
+See `PORTABLE-CONTRACT.md` §6.5 for the full install-site and no-clobber/no-double-install contract.
+
 ### Backward-compatible: the on-demand flow is unchanged
 
 The pre-existing on-demand usage — calling `window.<consoleNamespace>.showDesignPanel()` / `hideDesignPanel()` / `toggleDesignPanel()` to lazy-import and initialize the panel — is **unchanged and fully supported**. Owner-autoload (§10.1) is an opt-in layered on top, not a replacement. If you never call `enableAutoload()`, the panel behaves exactly as it always did: nothing loads for any visitor until the first console call.

package/dist/astro/host-adapter.js

@@ -1,102 +1,115 @@
-import { c as w, g as u, a as g, b as y, d as P, e as b, f as _ } from "../panel-config-CipeKMTz.js";
-import { g as d, Z as A } from "../tweak-state-xt-tSQ_t.js";
-import { s as k, l as I, a as c, c as E, b as C } from "../autoload-state-DF7TsTgY.js";
-const i = "tokenpanel-config";
-function S() {
+import { c as h, g as u, a as g, b as y, d as P, e as b, f as _, i as A } from "../panel-config-Bw7D-25C.js";
+import { g as c, Z as k } from "../tweak-state-CD1y56zR.js";
+import { s as I, l as E, a as d, c as C, b as S } from "../autoload-state-D26ML6sW.js";
+const r = "tokenpanel-config";
+function T() {
   if (typeof document > "u")
     throw new Error(
       "[design-token-panel] host-adapter loaded without a document; expected to run in a browser context."
     );
-  const n = document.getElementById(i);
-  if (!n)
+  const e = document.getElementById(r);
+  if (!e)
     throw new Error(
-      `[design-token-panel] Inline config script #${i} not found. Ensure <DesignTokenPanelHost config={...} /> is rendered on this page before the host script runs.`
+      `[design-token-panel] Inline config script #${r} not found. Ensure <DesignTokenPanelHost config={...} /> is rendered on this page before the host script runs.`
     );
-  const a = n.textContent ?? "";
-  let e;
+  const t = e.textContent ?? "";
+  let n;
   try {
-    e = JSON.parse(a);
+    n = JSON.parse(t);
   } catch (o) {
     throw new Error(
-      `[design-token-panel] Failed to parse inline config from #${i}: ${o.message}`
+      `[design-token-panel] Failed to parse inline config from #${r}: ${o.message}`
     );
   }
-  return _(e), e;
+  return _(n), n;
 }
-function T(n) {
-  return n.__zudoDesignTokenPanelAdapter || (n.__zudoDesignTokenPanelAdapter = {}), n.__zudoDesignTokenPanelAdapter;
+function V(e) {
+  return e.__zudoDesignTokenPanelAdapter || (e.__zudoDesignTokenPanelAdapter = {}), e.__zudoDesignTokenPanelAdapter;
 }
-function V(n, a) {
-  const e = T(n);
-  let o = e[a];
-  return o || (o = { bound: !1, modulePromise: null }, e[a] = o), o;
+function v(e, t) {
+  const n = V(e);
+  let o = n[t];
+  return o || (o = { bound: !1, modulePromise: null }, n[t] = o), o;
 }
-function v(n) {
+function D(e) {
   try {
-    return window.localStorage.getItem(n) === "1";
+    return window.localStorage.getItem(e) === "1";
   } catch {
     return !1;
   }
 }
-function D(n, a, e) {
+function K(e, t, n) {
   try {
     const o = window.localStorage;
-    return o.getItem(e) !== null || o.getItem(a) !== null || o.getItem(n) !== null;
+    return o.getItem(n) !== null || o.getItem(t) !== null || o.getItem(e) !== null;
   } catch {
     return !1;
   }
 }
-async function l(n) {
-  return n.modulePromise === null && (n.modulePromise = import("@takazudo/zdtp").then((a) => {
+async function i(e) {
+  return e.modulePromise === null && (e.modulePromise = import("@takazudo/zdtp").then((t) => {
     try {
-      const e = u(), o = a.__panelConfigForTest();
-      e !== o && console.warn(
+      const n = u(), o = t.__panelConfigForTest();
+      n !== o && console.warn(
         "[design-token-panel] Singleton-sharing check failed: the host adapter and the panel module observed different PanelConfig singletons. This indicates the package's `config/panel-config` module is no longer code-split into a single shared chunk. The panel may behave correctly today, but storage keys / namespaces / branding could diverge between the two surfaces in future bundles."
       );
-    } catch (e) {
+    } catch (n) {
       console.warn(
-        "[design-token-panel] Singleton-sharing check could not run (likely an older dist without the __panelConfigForTest accessor): " + e.message
+        "[design-token-panel] Singleton-sharing check could not run (likely an older dist without the __panelConfigForTest accessor): " + n.message
       );
     }
-    return a;
-  })), n.modulePromise;
+    return t;
+  })), e.modulePromise;
 }
-function K(n, a, e, o, t) {
-  const s = n[a] ?? {};
-  s.showDesignPanel = async () => {
-    c(t, !0), await l(e), o.open();
-  }, s.hideDesignPanel = async () => {
-    await l(e), o.close();
-  }, s.toggleDesignPanel = async () => {
-    await l(e), o.toggle();
-    let r = !1;
+function M(e, t, n, o, a) {
+  const l = e[t] ?? {};
+  l.showDesignPanel = async () => {
+    d(a, !0), await i(n), o.open();
+  }, l.hideDesignPanel = async () => {
+    await i(n), o.close();
+  }, l.toggleDesignPanel = async () => {
+    await i(n), o.toggle();
+    let s = !1;
     try {
-      r = window.localStorage.getItem(d(t)) === "1";
+      s = window.localStorage.getItem(c(a)) === "1";
     } catch {
     }
-    r && c(t, !0);
-  }, s.enableAutoload = async () => {
-    (await l(e)).enableAutoload(t);
-  }, s.disableAutoload = async () => {
-    if (e.modulePromise !== null) {
-      (await l(e)).disableAutoload(t);
+    s && d(a, !0);
+  }, l.enableAutoload = async () => {
+    (await i(n)).enableAutoload(a);
+  }, l.disableAutoload = async () => {
+    if (n.modulePromise !== null) {
+      (await i(n)).disableAutoload(a);
       return;
     }
-    E(t), C(!1, t);
+    C(a), S(!1, a);
     try {
-      window.localStorage.setItem(g(t), "0");
+      window.localStorage.setItem(g(a), "0");
     } catch {
     }
     try {
-      window.localStorage.removeItem(d(t));
+      window.localStorage.removeItem(c(a));
     } catch {
     }
-  }, n[a] = s;
+  }, e[t] = l;
+}
+function O(e, t) {
+  A({
+    show: async () => {
+      await i(e), t.open();
+    },
+    hide: async () => {
+      await i(e), t.close();
+    },
+    toggle: async () => {
+      await i(e), t.toggle();
+    }
+  });
 }
 (function() {
-  const a = S(), e = a.legacyIdRenameMap ? a : { ...a, legacyIdRenameMap: { ...A } }, o = w(e), t = u(), s = window, r = V(s, t.storagePrefix);
-  if (K(s, t.consoleNamespace, r, o, t), r.bound) return;
-  r.bound = !0;
-  const f = g(t), m = y(t), p = P(t), h = b(t);
-  (v(f) || D(m, p, h) || k(t) || I(t)) && l(r);
+  const t = T(), n = t.legacyIdRenameMap ? t : { ...t, legacyIdRenameMap: { ...k } }, o = h(n), a = u(), l = window, s = v(l, a.storagePrefix);
+  if (M(l, a.consoleNamespace, s, o, a), O(s, o), s.bound) return;
+  s.bound = !0;
+  const p = g(a), f = y(a), m = P(a), w = b(a);
+  (D(p) || K(f, m, w) || I(a) || E(a)) && i(s);
 })();

package/dist/astro/index.js

@@ -1,4 +1,4 @@
-import { s as t } from "../panel-config-CipeKMTz.js";
+import { s as t } from "../panel-config-Bw7D-25C.js";
 import { c as d } from "../color-schemes-CgzOBqGO.js";
 import { F as r, G as m, a as g, S as z } from "../manifest-DCReQE0k.js";
 const e = {

package/dist/{autoload-state-DF7TsTgY.js → autoload-state-D26ML6sW.js}

@@ -1,4 +1,4 @@
-import { g as a, k as o } from "./panel-config-CipeKMTz.js";
+import { g as a, l as o } from "./panel-config-Bw7D-25C.js";
 function n(e = a()) {
   return `${e.storagePrefix}-elpath-enabled`;
 }

package/dist/bin/server.js

@@ -2,7 +2,7 @@
 import { realpathSync as E } from "node:fs";
 import { createServer as H } from "node:http";
 import { resolve as p } from "node:path";
-import { l as $, c as x } from "../load-routing-LJ72261l.js";
+import { l as $, c as x } from "../load-routing-D4H2VOl5.js";
 function g(o, t) {
   return typeof o != "string" || o.length === 0 || t.length === 0 ? !1 : t.includes(o);
 }

package/dist/config/panel-config.d.ts

@@ -490,6 +490,38 @@ export declare function openStateChangedEventName(cfg: PanelConfig): string;
 export declare function modalClass(cfg: PanelConfig, suffix: string): string;
 /** Default download filename for export. */
 export declare function exportFilename(cfg: PanelConfig): string;
+/** Shape of the fixed-name global alias installed at `window.zdtp`. */
+export interface ZdtpGlobalApi {
+    show: () => void | Promise<void>;
+    hide: () => void | Promise<void>;
+    toggle: () => void | Promise<void>;
+}
+/**
+ * Install `window.zdtp = { show, hide, toggle }`, the fixed-name console
+ * sugar for the common single-panel case (issue #523).
+ *
+ * Guard rules:
+ *  - A pre-existing `window.zdtp` WITHOUT this package's marker is assumed to
+ *    be host-defined — never overwritten. Logs a `console.warn` so the host
+ *    can see why `zdtp.show()` did not appear.
+ *  - A pre-existing `window.zdtp` WITH the marker means this package already
+ *    installed the alias (from the other call site, or an earlier run of this
+ *    same one). First install wins — the call is a silent no-op. In the Astro
+ *    flow this manifests as "the adapter wins": its bootstrap script always
+ *    runs (and installs the alias) before the panel module's lazy dynamic
+ *    import can resolve and reach the package-root install site.
+ *
+ * `show` / `hide` / `toggle` are caller-supplied closures, so which instance
+ * they target is up to the caller — the package-root install site (below,
+ * `index.tsx`) wraps `showDesignTokenPanel()` etc., which re-resolve
+ * `getPanelConfig()` (the CURRENT default instance) on every call; the Astro
+ * host-adapter install site instead binds to the specific `PanelInstanceHandle`
+ * captured at its own install time, which does NOT track a later change of
+ * default (see PORTABLE-CONTRACT.md §6.5 for the full nuance). Either way,
+ * for a multi-instance page use `configurePanel(cfg).open()` etc. on the
+ * specific instance's own handle instead of relying on this alias.
+ */
+export declare function installZdtpGlobalAlias(api: ZdtpGlobalApi): void;
 /**
  * Runtime validation at the host-adapter trust boundary. The Astro inline
  * `<script type="application/json">` payload is untrusted-by-the-types:

package/dist/controls/actions-menu-popover.d.ts

@@ -0,0 +1,26 @@
+/**
+ * ActionsMenuPopover — narrow-panel replacement for the header action links
+ * (Export / Load from JSON… / Apply / Reset), collapsed behind the kebab
+ * trigger below the panel's <480px container-query breakpoint (#518).
+ *
+ * A PLAIN popover of ordinary action RoleButtons, NOT an ARIA menu:
+ * role="menu"/menuitem demands arrow-key navigation and focus management,
+ * and RoleButton hardcodes role="button" — so this follows the existing
+ * gear-settings popover's dialog + outside-click/Escape wiring instead
+ * (usePopoverClose, shared with highlight/highlight-settings-popover.tsx).
+ */
+import type { JSX } from 'preact';
+export interface ActionsMenuAction {
+    label: string;
+    onSelect: () => void;
+}
+interface ActionsMenuPopoverProps {
+    /** The kebab trigger element — excluded from the outside-click close so its
+     *  own click-to-toggle isn't raced by the popover's pointerdown listener
+     *  (mirrors the gear button / HighlightSettingsPopover pairing). */
+    anchorRef: React.RefObject<HTMLElement | null>;
+    actions: readonly ActionsMenuAction[];
+    onClose: () => void;
+}
+export declare function ActionsMenuPopover({ anchorRef, actions, onClose, }: ActionsMenuPopoverProps): JSX.Element;
+export {};

package/dist/controls/help-icon.d.ts

@@ -0,0 +1,43 @@
+/**
+ * HelpIcon — small round "?" badge that explains a nearby control via the
+ * shared `.tokenpanel-tooltip--help` variant (issue #520).
+ *
+ * Chrome-button policy (CLAUDE.md): implemented as
+ * `<div role="button" tabIndex={0}>` with explicit Enter/Space handling —
+ * never a native `<button>`.
+ *
+ * Behavior:
+ *  - Hover / focus shows the help tooltip transiently, same as any other
+ *    `useTooltip` trigger.
+ *  - Click (or Enter/Space) PINS the tooltip open — touch devices have no
+ *    hover, so a tap must be able to reveal and hold the tip. A second
+ *    activation, or pressing Escape anywhere on the page, unpins it.
+ *
+ * Callers place this as a SIBLING of the control it explains (e.g. after a
+ * `<select>`, or after a `<label>` wrapping a checkbox) — never nested
+ * inside a `<label>`, where a click would also toggle the label's own
+ * control.
+ *
+ * Known trade-off: `tooltip.tsx` renders a single shared tooltip DOM node,
+ * so pinning icon A then hovering/pinning icon B silently replaces A's
+ * visible content with B's — A's `pinned`/`is-pinned` state persists until
+ * A is next clicked or Escape is pressed, even though its tooltip is no
+ * longer the one on screen. Acceptable for this panel's single-tooltip
+ * architecture; not worth a cross-instance pin registry for a "?" hint.
+ * The same applies to a panel/window resize: `tooltip.tsx` hides the shared
+ * tooltip on resize (its ResizeObserver + window-resize handlers), but this
+ * component's local `pinned` state only clears on click/Escape — so after a
+ * resize the icon may briefly keep `is-pinned`/`aria-pressed` with no tooltip
+ * visible until the next activation. Same accepted single-tooltip trade-off.
+ */
+import type { JSX } from 'preact';
+export declare const LITERAL_HELP_TEXT = "Literal sets a fixed color just for this token \u2014 it won't update if you edit a palette/ramp swatch later. Pick a ramp option to keep it linked live.";
+export declare const PER_MODE_HELP_TEXT = "Per-mode gives this token two colors \u2014 one for light mode, one for dark. The browser picks the right one automatically via CSS light-dark().";
+export interface HelpIconProps {
+    /** The help text shown in the tooltip (wrapped, multi-line). */
+    text: string;
+    /** Accessible name for the icon itself (e.g. "Literal help", "Surface per-mode help"). */
+    ariaLabel: string;
+}
+export declare function HelpIcon({ text, ariaLabel }: HelpIconProps): JSX.Element;
+export default HelpIcon;

package/dist/controls/tooltip.d.ts

@@ -16,6 +16,13 @@
  *   <div {...tooltipProps}>...</div>
  */
 import type { ComponentChildren, JSX } from 'preact';
+/**
+ * Opt-in tooltip presentation variant. `'help'` applies the wrapped,
+ * bounded-width `.tokenpanel-tooltip--help` class (see panel.css) instead of
+ * the default single-line `nowrap` tooltip — used by `controls/help-icon.tsx`
+ * for the multi-sentence Literal / Per-mode explainer tips.
+ */
+export type TooltipVariant = 'help';
 interface TooltipProviderProps {
     children: ComponentChildren;
 }
@@ -27,17 +34,28 @@ interface TooltipProviderProps {
  * tooltip globally.
  */
 export declare function TooltipProvider({ children }: TooltipProviderProps): JSX.Element;
+export interface UseTooltipOptions {
+    /** Opt into a presentation variant — see `TooltipVariant` above. Omit for
+     *  the default single-line `nowrap` tooltip. */
+    variant?: TooltipVariant;
+}
 /**
  * Returns event handler props to spread onto the tooltip trigger element.
  *
  * @param text - The full text to show in the tooltip.
+ * @param opts - Optional presentation variant (see `UseTooltipOptions`).
  * @returns An object of `onMouseEnter`, `onMouseLeave`, `onFocusIn`, `onFocusOut`
- *          handlers to spread onto the trigger element.
+ *          handlers to spread onto the trigger element, plus imperative
+ *          `show`/`hide` escape hatches for callers that need to
+ *          show/keep-open the tooltip outside of a raw hover/focus event
+ *          (e.g. `controls/help-icon.tsx`'s click-to-pin behavior).
  */
-export declare function useTooltip(text: string): {
+export declare function useTooltip(text: string, opts?: UseTooltipOptions): {
     onMouseEnter: JSX.MouseEventHandler<HTMLElement>;
     onMouseLeave: JSX.MouseEventHandler<HTMLElement>;
     onFocusIn: JSX.FocusEventHandler<HTMLElement>;
     onFocusOut: JSX.FocusEventHandler<HTMLElement>;
+    show: (el: HTMLElement) => void;
+    hide: (el: HTMLElement) => void;
 };
 export {};

package/dist/index.d.ts

@@ -56,7 +56,7 @@ export type { ColorClusterConfig } from './state/tweak-state';
 export { ZDTP_LEGACY_TYPOGRAPHY_RENAME_MAP } from './state/tweak-state';
 export type { ColorScheme, ColorRef } from './config/color-schemes';
 export type { TokenManifest, TokenDef } from './tokens/manifest';
-export type { TierValueKind, PillSpec, TierItem, TierConfig, TabConfig, ColorClusterExtras, } from './tokens/tier-model';
+export type { TierValueKind, PillSpec, TierItem, TierConfig, TabConfig, ColorClusterExtras, NotesExtras, } from './tokens/tier-model';
 export { isLengthKind, isNumberKind, isSelectKind, isTextKind, isColorKind, isCursorKind, isContentKind, isMaskImageKind, } from './tokens/tier-model';
 export type { TweakState } from './state/tweak-state';
 export { emptyOverrides } from './state/tweak-state';