@carbon/charts 1.11.21 → 1.13.0

package/CHANGELOG.md

@@ -3,6 +3,32 @@
 All notable changes to this project will be documented in this file. See
 [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 1.13.0 (2023-09-15)
+
+### Features
+
+- **exports:** custom fileDownload.fileName function
+  ([#1661](https://github.com/carbon-design-system/carbon-charts/issues/1661))
+  ([1dc22cc](https://github.com/carbon-design-system/carbon-charts/commit/1dc22cc73cba69d8fd1a06ff761e2f28797157a7))
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+# 1.12.0 (2023-09-05)
+
+### Features
+
+- **scss:** Optimized SCSS to remove need to separately load @carbon/styles
+  ([#1652](https://github.com/carbon-design-system/carbon-charts/issues/1652))
+  ([d970944](https://github.com/carbon-design-system/carbon-charts/commit/d970944e49da6f0ca5cc4f290be9b2895e521e7d))
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
 ## 1.11.21 (2023-08-14)
 
 ### Bug Fixes

package/README.md

@@ -2,20 +2,20 @@
 
 Carbon Charts is a component library for vanilla JavaScript. Chart visualizations are based on D3.js, a peer dependency.
 
-The required styles should be imported from `@carbon/charts/styles.css` and `@carbon/styles/css/styles.css`. Additional documentation is provided in the Storybook demos.
+The required styles should be imported from `@carbon/charts/styles.css`. Additional documentation is provided in the Storybook demos.
 
 ## Getting started
 
 Run the following command using [npm](https://www.npmjs.com/):
 
 ```bash
-npm install -S @carbon/charts @carbon/styles d3 d3-cloud d3-sankey
+npm install -S @carbon/charts d3 d3-cloud d3-sankey
 ```
 
 If you prefer [Yarn](https://yarnpkg.com/en/), use the following command instead:
 
 ```bash
-yarn add @carbon/charts @carbon/styles d3 d3-cloud d3-sankey
+yarn add @carbon/charts d3 d3-cloud d3-sankey
 ```
 
 ## Step-by-step instructions

package/dist/{angle-utils-6b17e95b.mjs → angle-utils-7844066d.mjs}

@@ -1,5 +1,5 @@
 import { select as m } from "d3";
-import { a as fe, c as O, r as de, g as $, d as _ } from "./color-scale-utils-faf67b75.mjs";
+import { a as fe, c as O, r as de, g as T, d as _ } from "./color-scale-utils-faf67b75.mjs";
 import { _ as P, T as E, o as b } from "./enums-a96ef472.mjs";
 var me = /\s/;
 function ge(t) {
@@ -42,9 +42,9 @@ function Ie(t, e, n) {
     return r = i = void 0, u = l, a = t.apply(C, S), a;
   }
   function R(l) {
-    return u = l, c = setTimeout(I, e), f ? w(l) : a;
+    return u = l, c = setTimeout(L, e), f ? w(l) : a;
   }
-  function T(l) {
+  function I(l) {
     var S = l - o, C = l - u, U = e - S;
     return d ? Te(U, s - C) : U;
   }
@@ -52,11 +52,11 @@ function Ie(t, e, n) {
     var S = l - o, C = l - u;
     return o === void 0 || S >= e || S < 0 || d && C >= s;
   }
-  function I() {
+  function L() {
     var l = M();
     if (z(l))
       return G(l);
-    c = setTimeout(I, T(l));
+    c = setTimeout(L, I(l));
   }
   function G(l) {
     return c = void 0, h && r ? w(l) : (r = i = void 0, a);
@@ -67,17 +67,17 @@ function Ie(t, e, n) {
   function he() {
     return c === void 0 ? a : G(M());
   }
-  function F() {
+  function $() {
     var l = M(), S = z(l);
     if (r = arguments, i = this, o = l, S) {
       if (c === void 0)
         return R(o);
       if (d)
-        return clearTimeout(c), c = setTimeout(I, e), w(o);
+        return clearTimeout(c), c = setTimeout(L, e), w(o);
     }
-    return c === void 0 && (c = setTimeout(I, e)), a;
+    return c === void 0 && (c = setTimeout(L, e)), a;
   }
-  return F.cancel = ue, F.flush = he, F;
+  return $.cancel = ue, $.flush = he, $;
 }
 function Le(t, e) {
   if (t.match(/^[a-z]+:\/\//i))
@@ -89,7 +89,7 @@ function Le(t, e) {
   const n = document.implementation.createHTMLDocument(), r = n.createElement("base"), i = n.createElement("a");
   return n.head.appendChild(r), n.body.appendChild(i), e && (r.href = e), i.href = t, i.href;
 }
-const ve = (() => {
+const De = (() => {
   let t = 0;
   const e = () => (
     // eslint-disable-next-line no-bitwise
@@ -107,7 +107,7 @@ function v(t, e) {
   const r = (t.ownerDocument.defaultView || window).getComputedStyle(t).getPropertyValue(e);
   return r ? parseFloat(r.replace("px", "")) : 0;
 }
-function De(t) {
+function ve(t) {
   const e = v(t, "border-left-width"), n = v(t, "border-right-width");
   return t.clientWidth + e + n;
 }
@@ -116,7 +116,7 @@ function Ae(t) {
   return t.clientHeight + e + n;
 }
 function ee(t, e = {}) {
-  const n = e.width || De(t), r = e.height || Ae(t);
+  const n = e.width || ve(t), r = e.height || Ae(t);
   return { width: n, height: r };
 }
 function Fe() {
@@ -132,7 +132,7 @@ const p = 16384;
 function $e(t) {
   (t.width > p || t.height > p) && (t.width > p && t.height > p ? t.width > t.height ? (t.height *= p / t.width, t.width = p) : (t.width *= p / t.height, t.height = p) : t.width > p ? (t.height *= p / t.width, t.width = p) : (t.width *= p / t.height, t.height = p));
 }
-function D(t) {
+function A(t) {
   return new Promise((e, n) => {
     const r = new Image();
     r.decode = () => e(r), r.onload = () => e(r), r.onerror = n, r.crossOrigin = "anonymous", r.decoding = "async", r.src = t;
@@ -165,11 +165,11 @@ function Be(t, e, n) {
   const r = `.${t}:${e}`, i = n.cssText ? He(n) : Oe(n);
   return document.createTextNode(`${r}{${i}}`);
 }
-function X(t, e, n) {
+function N(t, e, n) {
   const r = window.getComputedStyle(t, n), i = r.getPropertyValue("content");
   if (i === "" || i === "none")
     return;
-  const s = ve();
+  const s = De();
   try {
     e.className = `${e.className} ${s}`;
   } catch {
@@ -179,16 +179,16 @@ function X(t, e, n) {
   a.appendChild(Be(s, n, r)), e.appendChild(a);
 }
 function ke(t, e) {
-  X(t, e, ":before"), X(t, e, ":after");
+  N(t, e, ":before"), N(t, e, ":after");
 }
-const J = "application/font-woff", N = "image/jpeg", Ve = {
-  woff: J,
-  woff2: J,
+const X = "application/font-woff", J = "image/jpeg", Ve = {
+  woff: X,
+  woff2: X,
   ttf: "application/font-truetype",
   eot: "application/vnd.ms-fontobject",
   png: "image/png",
-  jpg: N,
-  jpeg: N,
+  jpg: J,
+  jpeg: J,
   gif: "image/gif",
   tiff: "image/tiff",
   svg: "image/svg+xml",
@@ -250,23 +250,23 @@ async function W(t, e, n) {
 }
 async function Ue(t) {
   const e = t.toDataURL();
-  return e === "data:," ? t.cloneNode(!1) : D(e);
+  return e === "data:," ? t.cloneNode(!1) : A(e);
 }
 async function _e(t, e) {
   if (t.currentSrc) {
     const s = document.createElement("canvas"), a = s.getContext("2d");
     s.width = t.clientWidth, s.height = t.clientHeight, a == null || a.drawImage(t, 0, 0, s.width, s.height);
     const c = s.toDataURL();
-    return D(c);
+    return A(c);
   }
   const n = t.poster, r = V(n), i = await W(n, r, e);
-  return D(i);
+  return A(i);
 }
 async function qe(t) {
   var e;
   try {
     if (!((e = t == null ? void 0 : t.contentDocument) === null || e === void 0) && e.body)
-      return await A(t.contentDocument.body, {}, !0);
+      return await F(t.contentDocument.body, {}, !0);
   } catch {
   }
   return t.cloneNode(!1);
@@ -274,15 +274,15 @@ async function qe(t) {
 async function je(t, e) {
   return g(t, HTMLCanvasElement) ? Ue(t) : g(t, HTMLVideoElement) ? _e(t, e) : g(t, HTMLIFrameElement) ? qe(t) : t.cloneNode(!1);
 }
-const Xe = (t) => t.tagName != null && t.tagName.toUpperCase() === "SLOT";
-async function Je(t, e, n) {
+const Ne = (t) => t.tagName != null && t.tagName.toUpperCase() === "SLOT";
+async function Xe(t, e, n) {
   var r, i;
   let s = [];
-  return Xe(t) && t.assignedNodes ? s = y(t.assignedNodes()) : g(t, HTMLIFrameElement) && (!((r = t.contentDocument) === null || r === void 0) && r.body) ? s = y(t.contentDocument.body.childNodes) : s = y(((i = t.shadowRoot) !== null && i !== void 0 ? i : t).childNodes), s.length === 0 || g(t, HTMLVideoElement) || await s.reduce((a, c) => a.then(() => A(c, n)).then((o) => {
+  return Ne(t) && t.assignedNodes ? s = y(t.assignedNodes()) : g(t, HTMLIFrameElement) && (!((r = t.contentDocument) === null || r === void 0) && r.body) ? s = y(t.contentDocument.body.childNodes) : s = y(((i = t.shadowRoot) !== null && i !== void 0 ? i : t).childNodes), s.length === 0 || g(t, HTMLVideoElement) || await s.reduce((a, c) => a.then(() => F(c, n)).then((o) => {
     o && e.appendChild(o);
   }), Promise.resolve()), e;
 }
-function Ne(t, e) {
+function Je(t, e) {
   const n = e.style;
   if (!n)
     return;
@@ -302,7 +302,7 @@ function Ye(t, e) {
   }
 }
 function Ze(t, e) {
-  return g(e, Element) && (Ne(t, e), ke(t, e), Qe(t, e), Ye(t, e)), e;
+  return g(e, Element) && (Je(t, e), ke(t, e), Qe(t, e), Ye(t, e)), e;
 }
 async function Ke(t, e) {
   const n = t.querySelectorAll ? t.querySelectorAll("use") : [];
@@ -313,7 +313,7 @@ async function Ke(t, e) {
     const c = n[s].getAttribute("xlink:href");
     if (c) {
       const o = t.querySelector(c), u = document.querySelector(c);
-      !o && u && !r[c] && (r[c] = await A(u, e, !0));
+      !o && u && !r[c] && (r[c] = await F(u, e, !0));
     }
   }
   const i = Object.values(r);
@@ -328,8 +328,8 @@ async function Ke(t, e) {
   }
   return t;
 }
-async function A(t, e, n) {
-  return !n && e.filter && !e.filter(t) ? null : Promise.resolve(t).then((r) => je(r, e)).then((r) => Je(t, r, e)).then((r) => Ze(t, r)).then((r) => Ke(r, e));
+async function F(t, e, n) {
+  return !n && e.filter && !e.filter(t) ? null : Promise.resolve(t).then((r) => je(r, e)).then((r) => Xe(t, r, e)).then((r) => Ze(t, r)).then((r) => Ke(r, e));
 }
 const re = /url\((['"]?)([^'"]+?)\1\)/g, et = /url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g, tt = /src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;
 function nt(t) {
@@ -374,7 +374,7 @@ async function se(t, e, n) {
   const r = st(t, n);
   return rt(r).reduce((s, a) => s.then((c) => it(c, a, e, n)), Promise.resolve(r));
 }
-async function L(t, e, n) {
+async function D(t, e, n) {
   var r;
   const i = (r = e.style) === null || r === void 0 ? void 0 : r.getPropertyValue(t);
   if (i) {
@@ -384,7 +384,7 @@ async function L(t, e, n) {
   return !1;
 }
 async function at(t, e) {
-  await L("background", t, e) || await L("background-image", t, e), await L("mask", t, e) || await L("mask-image", t, e);
+  await D("background", t, e) || await D("background-image", t, e), await D("mask", t, e) || await D("mask-image", t, e);
 }
 async function ct(t, e) {
   const n = g(t, HTMLImageElement);
@@ -521,11 +521,11 @@ async function mt(t, e) {
   }
 }
 async function gt(t, e = {}) {
-  const { width: n, height: r } = ee(t, e), i = await A(t, e, !0);
+  const { width: n, height: r } = ee(t, e), i = await F(t, e, !0);
   return await mt(i, e), await ae(i, e), lt(i, e), await Me(i, n, r);
 }
 async function ce(t, e = {}) {
-  const { width: n, height: r } = ee(t, e), i = await gt(t, e), s = await D(i), a = document.createElement("canvas"), c = a.getContext("2d"), o = e.pixelRatio || Fe(), u = e.canvasWidth || n, f = e.canvasHeight || r;
+  const { width: n, height: r } = ee(t, e), i = await gt(t, e), s = await A(i), a = document.createElement("canvas"), c = a.getContext("2d"), o = e.pixelRatio || Fe(), u = e.canvasWidth || n, f = e.canvasHeight || r;
   return a.width = u * o, a.height = f * o, e.skipAutoScale || $e(a), a.style.width = `${u}`, a.style.height = `${f}`, e.backgroundColor && (c.fillStyle = e.backgroundColor, c.fillRect(0, 0, a.width, a.height)), c.drawImage(s, 0, 0, a.width, a.height), a;
 }
 async function pt(t, e = {}) {
@@ -576,8 +576,8 @@ class k extends oe {
     }, i = (h) => {
       h && Object.keys(r).forEach((w) => {
         if (h[w]) {
-          const R = h[w], T = parseFloat(R);
-          R && T > r[w] && ("" + R).indexOf("%") === -1 && (r[w] = T);
+          const R = h[w], I = parseFloat(R);
+          R && I > r[w] && ("" + R).indexOf("%") === -1 && (r[w] = I);
         }
       });
     }, s = {
@@ -617,8 +617,8 @@ class k extends oe {
     }
     try {
       const h = {
-        width: $(e.node(), "width", "baseVal", "value"),
-        height: $(e.node(), "height", "baseVal", "value")
+        width: T(e.node(), "width", "baseVal", "value"),
+        height: T(e.node(), "height", "baseVal", "value")
       };
       i(h);
     } catch {
@@ -647,7 +647,7 @@ class k extends oe {
     this.chartID = Math.floor((1 + Math.random()) * 281474976710656).toString(16);
   }
   addMainContainer() {
-    const e = this.model.getOptions(), n = $(e, "style", "prefix"), r = m(this.getHolder()).append("div").classed(`${_}--${n}--chart-wrapper`, !0).attr("id", `chart-${this.getChartID()}`).style("height", "100%").style("width", "100%");
+    const e = this.model.getOptions(), n = T(e, "style", "prefix"), r = m(this.getHolder()).append("div").classed(`${_}--${n}--chart-wrapper`, !0).attr("id", `chart-${this.getChartID()}`).style("height", "100%").style("width", "100%");
     r.append("g").attr("class", wt), this.mainContainer = r.node();
   }
   update() {
@@ -661,27 +661,39 @@ class k extends oe {
     return this.model.get("holder");
   }
   exportToJPG() {
-    const e = this, n = this.getHolder(), r = m(n);
-    r.classed("filled", !0), yt(this.getMainContainer(), {
+    const e = this, n = this.model.getOptions(), r = this.getHolder(), i = m(r);
+    i.classed("filled", !0), yt(this.getMainContainer(), {
       quality: 1,
       // Remove toolbar
-      filter: (i) => !(i.classList && i.classList.contains("cds--cc--toolbar"))
-    }).then(function(i) {
-      var s;
-      (s = e.services.files) == null || s.downloadImage(i, "myChart.jpg"), r.classed("filled", !1);
+      filter: (s) => !(s.classList && s.classList.contains("cds--cc--toolbar"))
+    }).then(function(s) {
+      var o;
+      let a = "myChart";
+      const c = T(
+        n,
+        "fileDownload",
+        "fileName"
+      );
+      typeof c == "function" ? a = c("jpg") : typeof c == "string" && (a = c), (o = e.services.files) == null || o.downloadImage(s, `${a}.jpg`), i.classed("filled", !1);
     });
   }
   exportToPNG() {
-    const e = this, n = this.getHolder(), r = m(n);
-    r.classed("filled", !0), pt(this.getMainContainer(), {
+    const e = this, n = this.model.getOptions(), r = this.getHolder(), i = m(r);
+    i.classed("filled", !0), pt(this.getMainContainer(), {
       quality: 1,
       // Remove toolbar
-      filter: (i) => !(i.classList && i.classList.contains("cds--cc--toolbar"))
-    }).then(function(i) {
-      var s;
-      (s = e.services.files) == null || s.downloadImage(i, "myChart.png"), r.classed("filled", !1);
-    }).catch(function(i) {
-      console.error("oops, something went wrong!", i);
+      filter: (s) => !(s.classList && s.classList.contains("cds--cc--toolbar"))
+    }).then(function(s) {
+      var o;
+      let a = "myChart";
+      const c = T(
+        n,
+        "fileDownload",
+        "fileName"
+      );
+      typeof c == "function" ? a = c("png") : typeof c == "string" && (a = c), (o = e.services.files) == null || o.downloadImage(s, `${a}.png`), i.classed("filled", !1);
+    }).catch(function(s) {
+      console.error("oops, something went wrong!", s);
     });
   }
   toggleFullscreen() {
@@ -837,4 +849,4 @@ export {
   Ct as r,
   j as t
 };
-//# sourceMappingURL=angle-utils-6b17e95b.mjs.map
+//# sourceMappingURL=angle-utils-7844066d.mjs.map