@blueprint-chart/lib 1.4.0 → 1.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{embed-DxKuPk6P.js → embed-D0WZKRQq.js} +21 -11
- package/dist/embed.js +1 -1
- package/dist/index.js +3 -3
- package/dist/lib/lib.iife.js +11 -1
- package/dist/node-backend/index.js +398 -397
- package/dist/{render-bpc-CnZB0sa5.js → render-bpc-CwYPC-oi.js} +272 -271
- package/dist/runtime/chart-css.d.ts +1 -1
- package/dist/runtime.js +2 -2
- package/package.json +1 -1
- package/src/charts/chart.scss +8 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const CHART_CSS = "\n/* Blueprint Chart \u2014 Runtime Embed Styles\n CSS custom properties with baked-in defaults for standalone iframe usage. */\n\n.bc-frame {\n --bc-frame-font-family: system-ui, -apple-system, sans-serif;\n --bc-frame-padding: 0;\n --bc-frame-bg: #fff;\n --bc-text-color: #333;\n font-family: var(--bc-frame-font-family);\n background: var(--bc-frame-bg);\n}\n\n/* Keeps the SVG's baked-in background rect (applyCanvasBackground) in sync\n with the frame background; transparentBackground sets the var to\n transparent at runtime. */\n.bc-frame .bc-canvas-bg {\n fill: var(--bc-frame-bg, #fff);\n}\n\n.bc-frame-header {\n padding: var(--bc-frame-padding) var(--bc-frame-padding) 0;\n background: var(--bc-frame-header-bg, transparent);\n border-bottom: var(--bc-frame-header-border-bottom, none);\n margin-bottom: var(--bc-frame-header-margin-bottom, 0);\n}\n\n.bc-frame-body {\n padding: 0 var(--bc-frame-padding);\n}\n\n.bc-frame-title {\n --bc-frame-title-color: var(--bc-text-color, #333);\n --bc-frame-title-font-size: 1.25rem;\n color: var(--bc-frame-title-color);\n font-size: var(--bc-frame-title-font-size);\n font-weight: bold;\n margin: 0;\n}\n\n.bc-frame-description {\n --bc-frame-description-color: var(--bc-text-color, #555);\n --bc-frame-description-font-size: 0.875rem;\n color: var(--bc-frame-description-color);\n font-size: var(--bc-frame-description-font-size);\n margin: 0.25rem 0 0;\n}\n\n.bc-frame-footer {\n margin-top: 0.5rem;\n gap: 0.25rem 1rem;\n padding: var(--bc-frame-footer-padding-top, 0) var(--bc-frame-padding) var(--bc-frame-padding);\n background: var(--bc-frame-footer-bg, transparent);\n border-top: var(--bc-frame-footer-border-top, none);\n}\n\n.bc-frame-footer-left {\n display: flex;\n align-items: baseline;\n flex-wrap: wrap;\n gap: 0.25rem 0.75rem;\n}\n\n.bc-frame-footer-left > :not(:first-child)::before {\n content: \"\\00B7\";\n margin-right: 0.5rem;\n color: var(--bc-text-color, #888);\n}\n\n.bc-frame-footer-right {\n display: flex;\n align-items: center;\n}\n\n.bc-frame-note {\n --bc-frame-note-color: var(--bc-text-color, #888);\n --bc-frame-note-font-size: 0.75rem;\n font-style: italic;\n color: var(--bc-frame-note-color);\n font-size: var(--bc-frame-note-font-size);\n margin: 0;\n padding: 0 var(--bc-frame-padding);\n}\n\n.bc-frame-byline,\n.bc-frame-source {\n --bc-frame-meta-color: var(--bc-text-color, #888);\n --bc-frame-meta-font-size: 0.75rem;\n color: var(--bc-frame-meta-color);\n font-size: var(--bc-frame-meta-font-size);\n}\n\n.bc-frame-credit {\n --bc-frame-credit-color: var(--bc-text-color, #666);\n --bc-frame-credit-font-size: 0.75rem;\n color: var(--bc-frame-credit-color);\n font-size: var(--bc-frame-credit-font-size);\n font-weight: 600;\n display: inline-flex;\n align-items: center;\n text-decoration: none;\n}\n\n.bc-frame-source-link {\n color: inherit;\n text-decoration: underline;\n}\n\n.bc-axis .domain {\n stroke: var(--bc-axis-color, #333);\n}\n\n.bc-axis .tick text {\n fill: var(--bc-axis-color, #333);\n font-size: 10px;\n}\n\n.bc-axis .tick line {\n stroke: var(--bc-axis-color, #333);\n}\n\n.bc-grid-line {\n stroke: var(--bc-grid-color, #e0e0e0);\n stroke-width: 1;\n}\n\n.bc-zero-baseline {\n stroke: #666;\n stroke-width: 1;\n}\n\n.bc-bar {\n /* fill is set via D3 .attr() from data-bound colors \u2014 do not override */\n}\n\n.bc-line {\n fill: none;\n stroke-width: 2;\n}\n\n.bc-value-label {\n font-size: 11px;\n /* fill is set via D3 .attr() \u2014 do not override */\n}\n\n.bc-direct-label {\n font-size: 12px;\n font-weight: 600;\n}\n\n.bc-tooltip {\n position: absolute;\n pointer-events: none;\n background: var(--bc-tooltip-bg, #fff);\n color: var(--bc-tooltip-color, #212529);\n border: 1px solid var(--bc-tooltip-border-color, #dee2e6);\n border-radius: 4px;\n padding: 6px 10px;\n font-size: 13px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.12);\n z-index: 9999;\n display: none;\n}\n\n.bc-crosshair {\n stroke: #999;\n stroke-width: 1;\n pointer-events: none;\n}\n\n.bc-arc-label-line {\n fill: none;\n stroke: #999;\n stroke-width: 1;\n}\n\n.bc-theme-blueprint-framed {\n --bc-frame-header-border-bottom: 1px solid #e0e0e0;\n --bc-frame-header-margin-bottom: 0.5rem;\n --bc-frame-footer-bg: #f8f8f8;\n --bc-frame-footer-border-top: 1px solid #e0e0e0;\n --bc-frame-footer-padding-top: 0.625rem;\n}\n\n.blueprint-chart-error {\n color: red;\n padding: 1em;\n border: 1px solid red;\n}\n\nbody {\n margin: 0;\n overflow: hidden;\n}\n\n/* Dark theme: activated by data-bs-theme=\"dark\" on the document (matching the\n editor's convention). The chart owns these colors; the dark frame background\n also drives the renderer's resolveBackgroundColor, so data-mark colors and\n contrast labels adapt at render time. Scoped to .bc-frame so these override\n the frame's own light --bc-frame-bg / --bc-text-color declarations (which are\n set on .bc-frame and would otherwise shadow a document-level override). */\n[data-bs-theme=\"dark\"] body {\n /* color themes above-bar value labels (fill: currentColor). */\n background: #1c1c1c;\n color: rgba(255, 255, 255, 0.9);\n}\n\n[data-bs-theme=\"dark\"] .bc-frame {\n --bc-frame-bg: #1c1c1c;\n --bc-text-color: rgba(255, 255, 255, 0.9);\n --bc-axis-color: rgba(255, 255, 255, 0.6);\n --bc-grid-color: #333;\n\n color: rgba(255, 255, 255, 0.9);\n}\n";
|
|
1
|
+
export declare const CHART_CSS = "\n/* Blueprint Chart \u2014 Runtime Embed Styles\n CSS custom properties with baked-in defaults for standalone iframe usage. */\n\n.bc-frame {\n --bc-frame-font-family: system-ui, -apple-system, sans-serif;\n --bc-frame-padding: 0;\n --bc-frame-bg: #fff;\n --bc-text-color: #333;\n font-family: var(--bc-frame-font-family);\n background: var(--bc-frame-bg);\n /* currentColor marks (e.g. above-bar value labels) follow the theme text\n colour, not the ambient document colour. */\n color: var(--bc-text-color, #333);\n}\n\n/* Keeps the SVG's baked-in background rect (applyCanvasBackground) in sync\n with the frame background; transparentBackground sets the var to\n transparent at runtime. */\n.bc-frame .bc-canvas-bg {\n fill: var(--bc-frame-bg, #fff);\n}\n\n.bc-frame-header {\n padding: var(--bc-frame-padding) var(--bc-frame-padding) 0;\n background: var(--bc-frame-header-bg, transparent);\n border-bottom: var(--bc-frame-header-border-bottom, none);\n margin-bottom: var(--bc-frame-header-margin-bottom, 0);\n}\n\n.bc-frame-body {\n padding: 0 var(--bc-frame-padding);\n}\n\n.bc-frame-title {\n --bc-frame-title-color: var(--bc-text-color, #333);\n --bc-frame-title-font-size: 1.25rem;\n color: var(--bc-frame-title-color);\n font-size: var(--bc-frame-title-font-size);\n font-weight: bold;\n margin: 0;\n}\n\n.bc-frame-description {\n --bc-frame-description-color: var(--bc-text-color, #555);\n --bc-frame-description-font-size: 0.875rem;\n color: var(--bc-frame-description-color);\n font-size: var(--bc-frame-description-font-size);\n margin: 0.25rem 0 0;\n}\n\n.bc-frame-footer {\n margin-top: 0.5rem;\n gap: 0.25rem 1rem;\n padding: var(--bc-frame-footer-padding-top, 0) var(--bc-frame-padding) var(--bc-frame-padding);\n background: var(--bc-frame-footer-bg, transparent);\n border-top: var(--bc-frame-footer-border-top, none);\n}\n\n.bc-frame-footer-left {\n display: flex;\n align-items: baseline;\n flex-wrap: wrap;\n gap: 0.25rem 0.75rem;\n}\n\n.bc-frame-footer-left > :not(:first-child)::before {\n content: \"\\00B7\";\n margin-right: 0.5rem;\n color: var(--bc-text-color, #888);\n}\n\n.bc-frame-footer-right {\n display: flex;\n align-items: center;\n}\n\n.bc-frame-note {\n --bc-frame-note-color: var(--bc-text-color, #888);\n --bc-frame-note-font-size: 0.75rem;\n font-style: italic;\n color: var(--bc-frame-note-color);\n font-size: var(--bc-frame-note-font-size);\n margin: 0;\n padding: 0 var(--bc-frame-padding);\n}\n\n.bc-frame-byline,\n.bc-frame-source {\n --bc-frame-meta-color: var(--bc-text-color, #888);\n --bc-frame-meta-font-size: 0.75rem;\n color: var(--bc-frame-meta-color);\n font-size: var(--bc-frame-meta-font-size);\n}\n\n.bc-frame-credit {\n --bc-frame-credit-color: var(--bc-text-color, #666);\n --bc-frame-credit-font-size: 0.75rem;\n color: var(--bc-frame-credit-color);\n font-size: var(--bc-frame-credit-font-size);\n font-weight: 600;\n display: inline-flex;\n align-items: center;\n text-decoration: none;\n}\n\n.bc-frame-source-link {\n color: inherit;\n text-decoration: underline;\n}\n\n.bc-axis .domain {\n stroke: var(--bc-axis-color, #333);\n}\n\n.bc-axis .tick text {\n fill: var(--bc-axis-color, #333);\n font-size: 10px;\n}\n\n.bc-axis .tick line {\n stroke: var(--bc-axis-color, #333);\n}\n\n.bc-grid-line {\n stroke: var(--bc-grid-color, #e0e0e0);\n stroke-width: 1;\n}\n\n.bc-zero-baseline {\n stroke: #666;\n stroke-width: 1;\n}\n\n.bc-bar {\n /* fill is set via D3 .attr() from data-bound colors \u2014 do not override */\n}\n\n.bc-line {\n fill: none;\n stroke-width: 2;\n}\n\n.bc-value-label {\n font-size: 11px;\n /* fill is set via D3 .attr() \u2014 do not override */\n}\n\n.bc-direct-label {\n font-size: 12px;\n font-weight: 600;\n}\n\n.bc-tooltip {\n position: absolute;\n pointer-events: none;\n background: var(--bc-tooltip-bg, #fff);\n color: var(--bc-tooltip-color, #212529);\n border: 1px solid var(--bc-tooltip-border-color, #dee2e6);\n border-radius: 4px;\n padding: 6px 10px;\n font-size: 13px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.12);\n z-index: 9999;\n display: none;\n}\n\n.bc-crosshair {\n stroke: #999;\n stroke-width: 1;\n pointer-events: none;\n}\n\n.bc-arc-label-line {\n fill: none;\n stroke: #999;\n stroke-width: 1;\n}\n\n.bc-theme-blueprint-framed {\n --bc-frame-header-border-bottom: 1px solid #e0e0e0;\n --bc-frame-header-margin-bottom: 0.5rem;\n --bc-frame-footer-bg: #f8f8f8;\n --bc-frame-footer-border-top: 1px solid #e0e0e0;\n --bc-frame-footer-padding-top: 0.625rem;\n}\n\n[data-bs-theme=\"dark\"] .bc-frame.bc-theme-blueprint-bold {\n --bc-frame-bg: #000000;\n --bc-text-color: rgba(255, 255, 255, 0.95);\n --bc-axis-color: rgba(255, 255, 255, 0.7);\n --bc-grid-color: rgba(255, 255, 255, 0.12);\n}\n\n.blueprint-chart-error {\n color: red;\n padding: 1em;\n border: 1px solid red;\n}\n\nbody {\n margin: 0;\n overflow: hidden;\n}\n\n/* Dark theme: activated by data-bs-theme=\"dark\" on the document (matching the\n editor's convention). The chart owns these colors; the dark frame background\n also drives the renderer's resolveBackgroundColor, so data-mark colors and\n contrast labels adapt at render time. Scoped to .bc-frame so these override\n the frame's own light --bc-frame-bg / --bc-text-color declarations (which are\n set on .bc-frame and would otherwise shadow a document-level override). */\n[data-bs-theme=\"dark\"] body {\n /* color themes above-bar value labels (fill: currentColor). */\n background: #1c1c1c;\n color: rgba(255, 255, 255, 0.9);\n}\n\n[data-bs-theme=\"dark\"] .bc-frame {\n --bc-frame-bg: #1c1c1c;\n --bc-text-color: rgba(255, 255, 255, 0.9);\n --bc-axis-color: rgba(255, 255, 255, 0.6);\n --bc-grid-color: #333;\n\n color: rgba(255, 255, 255, 0.9);\n}\n";
|
package/dist/runtime.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { i as p } from "./embed-
|
|
2
|
-
import { r as b } from "./render-bpc-
|
|
1
|
+
import { i as p } from "./embed-D0WZKRQq.js";
|
|
2
|
+
import { r as b } from "./render-bpc-CwYPC-oi.js";
|
|
3
3
|
function h(m, e, s) {
|
|
4
4
|
let t = 0, c = !1;
|
|
5
5
|
const n = document.createElement("nav");
|
package/package.json
CHANGED
package/src/charts/chart.scss
CHANGED
|
@@ -21,6 +21,7 @@
|
|
|
21
21
|
|
|
22
22
|
@use "themes/blueprint";
|
|
23
23
|
@use "themes/blueprint-framed";
|
|
24
|
+
@use "themes/blueprint-bold";
|
|
24
25
|
|
|
25
26
|
// ---------------------------------------------------------------------------
|
|
26
27
|
// Frame
|
|
@@ -33,6 +34,9 @@
|
|
|
33
34
|
|
|
34
35
|
font-family: var(--bc-frame-font-family);
|
|
35
36
|
background: var(--bc-frame-bg);
|
|
37
|
+
// currentColor marks (e.g. above-bar value labels) follow the theme text
|
|
38
|
+
// colour, not the ambient document colour.
|
|
39
|
+
color: var(--bc-text-color, #333);
|
|
36
40
|
}
|
|
37
41
|
|
|
38
42
|
// The chart SVG carries its own background rect (applyCanvasBackground in
|
|
@@ -87,8 +91,10 @@
|
|
|
87
91
|
position: relative;
|
|
88
92
|
z-index: 1;
|
|
89
93
|
// Opaque background so the header covers SVG content behind it.
|
|
90
|
-
//
|
|
91
|
-
|
|
94
|
+
// Falls back to the frame background (which themes such as blueprint-bold
|
|
95
|
+
// set) before the card/container background, so the cover matches the
|
|
96
|
+
// frame rather than flashing a light band over a dark themed canvas.
|
|
97
|
+
background: var(--bc-frame-header-bg, var(--bc-frame-bg, var(--bs-card-bg, #fff)));
|
|
92
98
|
}
|
|
93
99
|
|
|
94
100
|
.bc-frame-body {
|