canvasxpress 70.8.1 → 70.9.0

package/package.json

@@ -20,7 +20,7 @@
     "./package.json": "./package.json"
   },
   "title": "CanvasXpress",
-  "version": "70.8.1",
+  "version": "70.9.0",
   "license": "SEE LICENSE IN LICENSE",
   "files": [
     "src",

package/src/canvasXpress.css

@@ -101,6 +101,7 @@
   --cx-z-raised: 10;
   --cx-z-toolbar: 1000;
   --cx-z-toolbar-edge: 1001;
+  --cx-z-footer-link: 1002;
   --cx-z-resizer: 2000;
   --cx-z-fullscreen: 9999;
   --cx-z-panel: 10000;
@@ -5633,6 +5634,62 @@ input.cX-DataFilter-Container-Input-Right {
   background-color: var(--cx-datafilter-background-color, var(--cx-ui-surface));
 }
 
+/* @category: widget */
+/*********************/
+/* Drill breadcrumb  */
+/*********************/
+
+/* HTML strip overlaid at the top-left of the chart viewport while a drillHierarchy
+   has been drilled into. Not drawn on the canvas, so exports/pixel baselines are
+   untouched. Consumes the shared --cx-ui-* tokens so light/dark mode come for free. */
+.cX-Drill-Breadcrumb {
+  box-sizing: border-box;
+  position: absolute;
+  top: 4px;
+  left: 4px;
+  z-index: var(--cx-z-panel);
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 2px;
+  max-width: calc(100% - 8px);
+  padding: 2px 6px;
+  font-family: var(--cx-font-family);
+  font-size: var(--cx-large-font-size, var(--cx-x-large-font-size));
+  line-height: 1.4;
+  color: var(--cx-font-color, var(--cx-ui-text));
+  background-color: var(--cx-datafilter-toolbar-background-color, var(--cx-ui-chrome));
+  border: 1px var(--cx-border-style) var(--cx-datafilter-border-color, var(--cx-ui-border-accent));
+  border-radius: var(--cx-border-radius);
+}
+
+.cX-Drill-Crumb {
+  cursor: pointer;
+  padding: 0px 2px;
+  border-radius: var(--cx-border-radius);
+  text-decoration: none;
+  color: var(--cx-ui-accent, var(--cx-font-color, var(--cx-ui-text)));
+}
+
+.cX-Drill-Crumb:hover,
+.cX-Drill-Crumb:focus {
+  text-decoration: underline;
+  outline: none;
+}
+
+.cX-Drill-Sep {
+  opacity: 0.6;
+  padding: 0px 1px;
+  cursor: default;
+}
+
+/* The deepest crumb is the current level: plain text, not a link. */
+.cX-Drill-Current {
+  cursor: default;
+  font-weight: 600;
+  color: var(--cx-font-color, var(--cx-ui-text));
+  text-decoration: none;
+}
 /* @category: widget */
 /***************/
 /*   Toggle    */

package/src/canvasXpress.d.mts

@@ -123,7 +123,7 @@ export type CXGraphType =
 
 /**
  * Full chart configuration — one property per parameter in the CanvasXpress
- * config schema (1734 keys). String enums become open literal
+ * config schema (1736 keys). String enums become open literal
  * unions (except `graphType`, which is closed); `@graphTypes` in a key's JSDoc
  * lists the graph types it applies to (absent = all). The index signature keeps
  * obfuscation aliases and any newer key valid. See `CXConfigFor<G>` for the
@@ -2444,6 +2444,22 @@ export interface CXConfig {
    * @default "normal"
    */
   dotplotType?: "arrow" | "bullet" | "cleveland" | "connected" | "line" | "lineConnected" | "normal" | "stacked" | "transition" | false | (string & {});
+  /**
+   * Flag to show the drill-down breadcrumb strip in the viewport when a drillHierarchy is
+   * active and the chart has been drilled. Set false for API-only drill control
+   * @graphTypes Alluvial, Area, AreaLine, Bar, BarLine, Boxplot … (65 types; see CXGraphTypeKeys)
+   * @default true
+   */
+  drillBreadcrumb?: boolean;
+  /**
+   * An array of sample annotation names, coarse to fine (e.g. ["Region","State","City"]),
+   * defining a drill-down hierarchy. When set, clicking a mark filters to the clicked level
+   * value and regroups by the next finer annotation; a breadcrumb walks back. Each entry must
+   * be a category in the data.x object
+   * @graphTypes Alluvial, Area, AreaLine, Bar, BarLine, Boxplot … (65 types; see CXGraphTypeKeys)
+   * @default []
+   */
+  drillHierarchy?: unknown[] | boolean | string | number;
   /**
    * Direction of the arrows in arrow dumbbells (dumbbellType arrow): value points each arrow
    * at the smaller value; order points from the first variable to the next (before to after)
@@ -11012,6 +11028,8 @@ export type CXKeysData =
   | "dataTextMargin"
   | "dataTextRotate"
   | "dataTextScaleFontFactor"
+  | "drillBreadcrumb"
+  | "drillHierarchy"
   | "groupingFactorLevelsOrder"
   | "groupingFactors"
   | "groupingFactorsLabelsHide"

package/src/canvasXpress.d.ts

@@ -132,7 +132,7 @@ declare namespace CanvasXpress {
 
   /**
    * Full chart configuration — one property per parameter in the CanvasXpress
-   * config schema (1734 keys). String enums become open literal
+   * config schema (1736 keys). String enums become open literal
    * unions (except `graphType`, which is closed); `@graphTypes` in a key's JSDoc
    * lists the graph types it applies to (absent = all). The index signature keeps
    * obfuscation aliases and any newer key valid. See `CXConfigFor<G>` for the
@@ -2453,6 +2453,22 @@ declare namespace CanvasXpress {
      * @default "normal"
      */
     dotplotType?: "arrow" | "bullet" | "cleveland" | "connected" | "line" | "lineConnected" | "normal" | "stacked" | "transition" | false | (string & {});
+    /**
+     * Flag to show the drill-down breadcrumb strip in the viewport when a drillHierarchy is
+     * active and the chart has been drilled. Set false for API-only drill control
+     * @graphTypes Alluvial, Area, AreaLine, Bar, BarLine, Boxplot … (65 types; see CXGraphTypeKeys)
+     * @default true
+     */
+    drillBreadcrumb?: boolean;
+    /**
+     * An array of sample annotation names, coarse to fine (e.g. ["Region","State","City"]),
+     * defining a drill-down hierarchy. When set, clicking a mark filters to the clicked level
+     * value and regroups by the next finer annotation; a breadcrumb walks back. Each entry must
+     * be a category in the data.x object
+     * @graphTypes Alluvial, Area, AreaLine, Bar, BarLine, Boxplot … (65 types; see CXGraphTypeKeys)
+     * @default []
+     */
+    drillHierarchy?: unknown[] | boolean | string | number;
     /**
      * Direction of the arrows in arrow dumbbells (dumbbellType arrow): value points each arrow
      * at the smaller value; order points from the first variable to the next (before to after)
@@ -11021,6 +11037,8 @@ declare namespace CanvasXpress {
     | "dataTextMargin"
     | "dataTextRotate"
     | "dataTextScaleFontFactor"
+    | "drillBreadcrumb"
+    | "drillHierarchy"
     | "groupingFactorLevelsOrder"
     | "groupingFactors"
     | "groupingFactorsLabelsHide"