@blueprint-chart/lib 1.1.0 → 1.3.0

package/dist/embed-DxKuPk6P.js

@@ -0,0 +1,315 @@
+const f = `
+/* Blueprint Chart — Runtime Embed Styles
+   CSS custom properties with baked-in defaults for standalone iframe usage. */
+
+.bc-frame {
+  --bc-frame-font-family: system-ui, -apple-system, sans-serif;
+  --bc-frame-padding: 0;
+  --bc-frame-bg: #fff;
+  --bc-text-color: #333;
+  font-family: var(--bc-frame-font-family);
+  background: var(--bc-frame-bg);
+}
+
+/* Keeps the SVG's baked-in background rect (applyCanvasBackground) in sync
+   with the frame background; transparentBackground sets the var to
+   transparent at runtime. */
+.bc-frame .bc-canvas-bg {
+  fill: var(--bc-frame-bg, #fff);
+}
+
+.bc-frame-header {
+  padding: var(--bc-frame-padding) var(--bc-frame-padding) 0;
+  background: var(--bc-frame-header-bg, transparent);
+  border-bottom: var(--bc-frame-header-border-bottom, none);
+  margin-bottom: var(--bc-frame-header-margin-bottom, 0);
+}
+
+.bc-frame-body {
+  padding: 0 var(--bc-frame-padding);
+}
+
+.bc-frame-title {
+  --bc-frame-title-color: var(--bc-text-color, #333);
+  --bc-frame-title-font-size: 1.25rem;
+  color: var(--bc-frame-title-color);
+  font-size: var(--bc-frame-title-font-size);
+  font-weight: bold;
+  margin: 0;
+}
+
+.bc-frame-description {
+  --bc-frame-description-color: var(--bc-text-color, #555);
+  --bc-frame-description-font-size: 0.875rem;
+  color: var(--bc-frame-description-color);
+  font-size: var(--bc-frame-description-font-size);
+  margin: 0.25rem 0 0;
+}
+
+.bc-frame-footer {
+  margin-top: 0.5rem;
+  gap: 0.25rem 1rem;
+  padding: var(--bc-frame-footer-padding-top, 0) var(--bc-frame-padding) var(--bc-frame-padding);
+  background: var(--bc-frame-footer-bg, transparent);
+  border-top: var(--bc-frame-footer-border-top, none);
+}
+
+.bc-frame-footer-left {
+  display: flex;
+  align-items: baseline;
+  flex-wrap: wrap;
+  gap: 0.25rem 0.75rem;
+}
+
+.bc-frame-footer-left > :not(:first-child)::before {
+  content: "\\00B7";
+  margin-right: 0.5rem;
+  color: var(--bc-text-color, #888);
+}
+
+.bc-frame-footer-right {
+  display: flex;
+  align-items: center;
+}
+
+.bc-frame-note {
+  --bc-frame-note-color: var(--bc-text-color, #888);
+  --bc-frame-note-font-size: 0.75rem;
+  font-style: italic;
+  color: var(--bc-frame-note-color);
+  font-size: var(--bc-frame-note-font-size);
+  margin: 0;
+  padding: 0 var(--bc-frame-padding);
+}
+
+.bc-frame-byline,
+.bc-frame-source {
+  --bc-frame-meta-color: var(--bc-text-color, #888);
+  --bc-frame-meta-font-size: 0.75rem;
+  color: var(--bc-frame-meta-color);
+  font-size: var(--bc-frame-meta-font-size);
+}
+
+.bc-frame-credit {
+  --bc-frame-credit-color: var(--bc-text-color, #666);
+  --bc-frame-credit-font-size: 0.75rem;
+  color: var(--bc-frame-credit-color);
+  font-size: var(--bc-frame-credit-font-size);
+  font-weight: 600;
+  display: inline-flex;
+  align-items: center;
+  text-decoration: none;
+}
+
+.bc-frame-source-link {
+  color: inherit;
+  text-decoration: underline;
+}
+
+.bc-axis .domain {
+  stroke: var(--bc-axis-color, #333);
+}
+
+.bc-axis .tick text {
+  fill: var(--bc-axis-color, #333);
+  font-size: 10px;
+}
+
+.bc-axis .tick line {
+  stroke: var(--bc-axis-color, #333);
+}
+
+.bc-grid-line {
+  stroke: var(--bc-grid-color, #e0e0e0);
+  stroke-width: 1;
+}
+
+.bc-zero-baseline {
+  stroke: #666;
+  stroke-width: 1;
+}
+
+.bc-bar {
+  /* fill is set via D3 .attr() from data-bound colors — do not override */
+}
+
+.bc-line {
+  fill: none;
+  stroke-width: 2;
+}
+
+.bc-value-label {
+  font-size: 11px;
+  /* fill is set via D3 .attr() — do not override */
+}
+
+.bc-direct-label {
+  font-size: 12px;
+  font-weight: 600;
+}
+
+.bc-tooltip {
+  position: absolute;
+  pointer-events: none;
+  background: var(--bc-tooltip-bg, #fff);
+  color: var(--bc-tooltip-color, #212529);
+  border: 1px solid var(--bc-tooltip-border-color, #dee2e6);
+  border-radius: 4px;
+  padding: 6px 10px;
+  font-size: 13px;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
+  z-index: 9999;
+  display: none;
+}
+
+.bc-crosshair {
+  stroke: #999;
+  stroke-width: 1;
+  pointer-events: none;
+}
+
+.bc-arc-label-line {
+  fill: none;
+  stroke: #999;
+  stroke-width: 1;
+}
+
+.bc-theme-blueprint-framed {
+  --bc-frame-header-border-bottom: 1px solid #e0e0e0;
+  --bc-frame-header-margin-bottom: 0.5rem;
+  --bc-frame-footer-bg: #f8f8f8;
+  --bc-frame-footer-border-top: 1px solid #e0e0e0;
+  --bc-frame-footer-padding-top: 0.625rem;
+}
+
+.blueprint-chart-error {
+  color: red;
+  padding: 1em;
+  border: 1px solid red;
+}
+
+body {
+  margin: 0;
+  overflow: hidden;
+}
+
+/* Dark theme: activated by data-bs-theme="dark" on the document (matching the
+   editor's convention). The chart owns these colors; the dark frame background
+   also drives the renderer's resolveBackgroundColor, so data-mark colors and
+   contrast labels adapt at render time. Scoped to .bc-frame so these override
+   the frame's own light --bc-frame-bg / --bc-text-color declarations (which are
+   set on .bc-frame and would otherwise shadow a document-level override). */
+[data-bs-theme="dark"] body {
+  /* color themes above-bar value labels (fill: currentColor). */
+  background: #1c1c1c;
+  color: rgba(255, 255, 255, 0.9);
+}
+
+[data-bs-theme="dark"] .bc-frame {
+  --bc-frame-bg: #1c1c1c;
+  --bc-text-color: rgba(255, 255, 255, 0.9);
+  --bc-axis-color: rgba(255, 255, 255, 0.6);
+  --bc-grid-color: #333;
+
+  color: rgba(255, 255, 255, 0.9);
+}
+`, b = "blueprint-chart-resize", s = "blueprint-chart-error";
+function m(e) {
+  return typeof e == "object" && e !== null && e.type === b && typeof e.height == "number" ? e.height : null;
+}
+function p(e) {
+  return typeof e == "object" && e !== null && e.type === s;
+}
+const g = u();
+function u() {
+  var e;
+  try {
+    if (typeof globalThis < "u") {
+      const r = globalThis.BLUEPRINT_CHART_RUNTIME_URL;
+      if (typeof r == "string" && r)
+        return r;
+    }
+    return typeof document > "u" ? "" : ((e = document.currentScript) == null ? void 0 : e.src) ?? "";
+  } catch {
+    return "";
+  }
+}
+const d = /* @__PURE__ */ new Map();
+let i = null;
+function h() {
+  i || (i = (e) => {
+    for (const [r, t] of d)
+      if (e.source === r.contentWindow) {
+        t(e);
+        return;
+      }
+  }, window.addEventListener("message", i));
+}
+function w() {
+  h(), document.querySelectorAll(
+    'script[type="application/blueprint-chart"]'
+  ).forEach(v);
+}
+function v(e) {
+  var o, a;
+  const r = (o = e.textContent) == null ? void 0 : o.trim();
+  if (!r)
+    return;
+  const t = document.createElement("iframe");
+  t.className = "blueprint-chart-iframe", t.style.cssText = "border: none; width: 100%; display: block;", t.setAttribute("sandbox", "allow-scripts"), t.setAttribute("title", "Blueprint Chart"), (a = e.parentNode) == null || a.insertBefore(t, e), t.srcdoc = y(r, g);
+  const n = (c) => {
+    const l = m(c.data);
+    if (l !== null) {
+      t.style.height = `${l}px`;
+      return;
+    }
+    p(c.data) && console.warn("Blueprint Chart: could not render embed.", c.data.message);
+  };
+  d.set(t, n);
+}
+function y(e, r, t) {
+  const n = r ? `<script src="${k(r)}"><\/script>` : "", o = t === "dark" ? '<html data-bs-theme="dark">' : "<html>", a = r ? [
+    "try {",
+    '  window.BlueprintChart.renderBpc(document.getElementById("chart"), __BPC_SRC__);',
+    "}",
+    "catch (e) {",
+    `  parent.postMessage({ type: "${s}", message: String(e) }, "*");`,
+    "}"
+  ] : [
+    `parent.postMessage({ type: "${s}", message: "Blueprint Chart runtime URL unavailable" }, "*");`
+  ];
+  return [
+    "<!DOCTYPE html>",
+    `${o}<head>`,
+    `<style>${f}</style>`,
+    "</head><body>",
+    '<div id="chart" class="blueprint-chart-container"></div>',
+    n,
+    "<script>",
+    `var __BPC_SRC__ = ${x(e)};`,
+    "function notifySize() {",
+    "  var h = document.documentElement.scrollHeight;",
+    `  parent.postMessage({ type: "${b}", height: h }, "*");`,
+    "}",
+    ...a,
+    "notifySize();",
+    "new ResizeObserver(notifySize).observe(document.body);",
+    "<\/script>",
+    "</body></html>"
+  ].filter(Boolean).join(`
+`);
+}
+function x(e) {
+  return JSON.stringify(e).replace(/</g, "\\u003c").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
+}
+function k(e) {
+  return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+export {
+  s as E,
+  b as R,
+  p as a,
+  y as b,
+  w as i,
+  m as r
+};

package/dist/embed.d.ts

@@ -0,0 +1,3 @@
+export { buildSrcdoc } from './runtime/runtime';
+export type { EmbedTheme } from './runtime/runtime';
+export { readResizeHeight, isErrorMessage, RESIZE_MESSAGE, ERROR_MESSAGE } from './runtime/messages';

package/dist/embed.js

@@ -0,0 +1,8 @@
+import { E as a, R as r, b as e, a as R, r as S } from "./embed-DxKuPk6P.js";
+export {
+  a as ERROR_MESSAGE,
+  r as RESIZE_MESSAGE,
+  e as buildSrcdoc,
+  R as isErrorMessage,
+  S as readResizeHeight
+};

package/dist/index.d.ts

@@ -35,5 +35,6 @@ export type { ChartSample } from './samples';
 export { renderBpc, renderChart, astToDefinition, resolveScene, render } from './render';
 export type { ChartDefinition, RenderOptions, ResolvedChartState, ChartHandle, RenderApiOptions, OutputOptions } from './render';
 export { ChartParseError, PngBrowserUnsupportedError, MissingNodeRenderDepsError } from './render';
+export { buildSrcdoc } from './runtime/runtime';
 export { SceneTransition, getSceneTransition, featureJoin, snapshotLiveAttrs, BC_TRANSITION_NAME, } from './transitions';
 export type { CommitOptions, TransitionMode, SceneTransitionState, FeatureRole, FeatureJoinConfig, AttrMap, AttrValue, } from './transitions';