gf-components 0.1.140 → 0.1.141

package/dist/index.es.js

@@ -22573,7 +22573,7 @@ var ZN = function(e, t) {
     t.indexOf(r[i]) < 0 && Object.prototype.propertyIsEnumerable.call(e, r[i]) && (n[r[i]] = e[r[i]]);
   return n;
 };
-const $n = /* @__PURE__ */ Fe.forwardRef((e, t) => {
+const Sn = /* @__PURE__ */ Fe.forwardRef((e, t) => {
   const {
     prefixCls: n,
     rootClassName: r,
@@ -22599,7 +22599,7 @@ const $n = /* @__PURE__ */ Fe.forwardRef((e, t) => {
     style: w
   }, zr(d, ["justify", "wrap", "align"])), l));
 });
-process.env.NODE_ENV !== "production" && ($n.displayName = "Flex");
+process.env.NODE_ENV !== "production" && (Sn.displayName = "Flex");
 var UN = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M832 64H296c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h496v688c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8V96c0-17.7-14.3-32-32-32zM704 192H192c-17.7 0-32 14.3-32 32v530.7c0 8.5 3.4 16.6 9.4 22.6l173.3 173.3c2.2 2.2 4.7 4 7.4 5.5v1.9h4.2c3.5 1.3 7.2 2 11 2H704c17.7 0 32-14.3 32-32V224c0-17.7-14.3-32-32-32zM350 856.2L263.9 770H350v86.2zM664 888H414V746c0-22.1-17.9-40-40-40H232V264h432v624z" } }] }, name: "copy", theme: "outlined" }, qN = function(t, n) {
   return /* @__PURE__ */ C.createElement(nr, vt({}, t, {
     ref: n,
@@ -23937,12 +23937,12 @@ const FD = Gt(g1)`
         cardtype: "default",
         ...a,
         children: [
-          /* @__PURE__ */ m.jsxs($n, { vertical: !0, gap: 24, style: { alignItems: "start" }, children: [
+          /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, gap: 24, style: { alignItems: "start" }, children: [
             /* @__PURE__ */ m.jsx(XD, { title: e, subtitle: t, type: "header" }),
             n
           ] }),
           /* @__PURE__ */ m.jsx("div", { style: { borderBottom: "1px solid #f0f0f0", margin: "32px -32px 32px -32px" } }),
-          /* @__PURE__ */ m.jsxs($n, { vertical: !0, gap: 8, style: { alignItems: "start" }, children: [
+          /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, gap: 8, style: { alignItems: "start" }, children: [
             /* @__PURE__ */ m.jsx(eF, { children: r || "Table of contents" }),
             i.map(
               (l, c) => /* @__PURE__ */ m.jsx(
@@ -23988,7 +23988,7 @@ const FD = Gt(g1)`
         onTabChange: d,
         tabBarExtraContent: /* @__PURE__ */ m.jsx(zD, { onClick: o == null ? void 0 : o[s] }),
         actions: n != null && n[s] ? [
-          /* @__PURE__ */ m.jsxs($n, { vertical: !0, children: [
+          /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, children: [
             /* @__PURE__ */ m.jsx(BD, { open: c, onClick: f, children: r }),
             c && (n == null ? void 0 : n[s])
           ] })
@@ -24022,8 +24022,8 @@ const FD = Gt(g1)`
   const [o, a] = pt(n), s = r ? { onChange: a } : !1;
   return /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
     /* @__PURE__ */ m.jsx(En, {}),
-    /* @__PURE__ */ m.jsx(nF, { cardtype: "grey", padding: 24, ...i, children: /* @__PURE__ */ m.jsxs($n, { vertical: !0, gap: 8, children: [
-      /* @__PURE__ */ m.jsxs($n, { gap: 16, align: "center", wrap: !0, children: [
+    /* @__PURE__ */ m.jsx(nF, { cardtype: "grey", padding: 24, ...i, children: /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, gap: 8, children: [
+      /* @__PURE__ */ m.jsxs(Sn, { gap: 16, align: "center", wrap: !0, children: [
         /* @__PURE__ */ m.jsx(rF, { children: e }),
         /* @__PURE__ */ m.jsx(iF, { children: t })
       ] }),
@@ -24137,7 +24137,7 @@ const FD = Gt(g1)`
   style: o = {},
   full: a = !1
 }) => /* @__PURE__ */ m.jsx(
-  $n,
+  Sn,
   {
     className: t,
     gap: n || 10,
@@ -34009,8 +34009,8 @@ const _le = Gt.span`
       },
       children: n ? "Data niet openbaar beschikbaar" : ""
     }
-  )), h = ({ data: p }) => /* @__PURE__ */ m.jsx($n, { gap: 16, className: "gf-full", justify: "center", wrap: !0, style: { width: c }, children: p == null ? void 0 : p.map(
-    (g, v) => /* @__PURE__ */ m.jsxs($n, { gap: 8, align: "center", children: [
+  )), h = ({ data: p }) => /* @__PURE__ */ m.jsx(Sn, { gap: 16, className: "gf-full", justify: "center", wrap: !0, style: { width: c }, children: p == null ? void 0 : p.map(
+    (g, v) => /* @__PURE__ */ m.jsxs(Sn, { gap: 8, align: "center", children: [
       /* @__PURE__ */ m.jsx("div", { style: {
         minWidth: 16,
         minHeight: 16,
@@ -34021,7 +34021,7 @@ const _le = Gt.span`
   ) });
   return /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
     /* @__PURE__ */ m.jsx(En, {}),
-    /* @__PURE__ */ m.jsxs($n, { vertical: !0, gap: 8, align: "center", style: { width: "100%" }, children: [
+    /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, gap: 8, align: "center", style: { width: "100%" }, children: [
       /* @__PURE__ */ m.jsx(_le, { children: t }),
       /* @__PURE__ */ m.jsx("div", { style: { width: "100%", height: l }, children: /* @__PURE__ */ m.jsx(
         Mle,
@@ -35795,7 +35795,7 @@ var cde = function(e) {
 }, colors: { scheme: "nivo" }, isInteractive: !0, debugMesh: !1, tooltip: function(e) {
   var t = e.node;
   return m.jsx(Gs, { id: t.serieId, value: "x: " + t.formattedX + ", y: " + t.formattedY, enableChip: !0, color: t.color });
-}, markers: [], legends: [], annotations: [] }, Sn = Dr({}, aM, { blendMode: "normal", layers: ["grid", "axes", "nodes", "markers", "mesh", "legends", "annotations"], role: "img", useMesh: !0, animate: !0, motionConfig: "default" }), dr = Dr({}, aM, { layers: ["grid", "axes", "nodes", "mesh", "legends", "annotations"], pixelRatio: typeof window < "u" && window.devicePixelRatio || 1, renderNode: function(e, t) {
+}, markers: [], legends: [], annotations: [] }, $n = Dr({}, aM, { blendMode: "normal", layers: ["grid", "axes", "nodes", "markers", "mesh", "legends", "annotations"], role: "img", useMesh: !0, animate: !0, motionConfig: "default" }), dr = Dr({}, aM, { layers: ["grid", "axes", "nodes", "mesh", "legends", "annotations"], pixelRatio: typeof window < "u" && window.devicePixelRatio || 1, renderNode: function(e, t) {
   e.beginPath(), e.arc(t.x, t.y, t.size / 2, 0, 2 * Math.PI), e.fillStyle = t.color, e.fill();
 } }), dde = function(e) {
   var t = e.nodes, n = e.annotations, r = oM(t, n);
@@ -35833,7 +35833,7 @@ var cde = function(e) {
   }, [s]);
   return m.jsx(eM, { nodes: t, width: n, height: r, onMouseEnter: h, onMouseMove: p, onMouseLeave: g, onClick: v, debug: c });
 }, pde = ["isInteractive", "animate", "motionConfig", "theme", "renderWrapper"], mde = function(e) {
-  var t = e.data, n = e.xScale, r = n === void 0 ? Sn.xScale : n, i = e.xFormat, o = e.yScale, a = o === void 0 ? Sn.yScale : o, s = e.yFormat, l = e.width, c = e.height, u = e.margin, d = e.layers, f = d === void 0 ? Sn.layers : d, h = e.colors, p = h === void 0 ? Sn.colors : h, g = e.blendMode, v = g === void 0 ? Sn.blendMode : g, b = e.nodeId, y = b === void 0 ? Sn.nodeId : b, x = e.nodeSize, S = x === void 0 ? Sn.nodeSize : x, w = e.nodeComponent, $ = w === void 0 ? Sn.nodeComponent : w, H = e.enableGridX, _ = H === void 0 ? Sn.enableGridX : H, M = e.enableGridY, E = M === void 0 ? Sn.enableGridY : M, R = e.gridXValues, I = e.gridYValues, O = e.axisTop, T = e.axisRight, k = e.axisBottom, L = k === void 0 ? Sn.axisBottom : k, V = e.axisLeft, P = V === void 0 ? Sn.axisLeft : V, j = e.annotations, A = j === void 0 ? Sn.annotations : j, F = e.isInteractive, Z = F === void 0 ? Sn.isInteractive : F, U = e.useMesh, G = U === void 0 ? Sn.useMesh : U, J = e.debugMesh, X = J === void 0 ? Sn.debugMesh : J, Y = e.onMouseEnter, Q = e.onMouseMove, B = e.onMouseLeave, W = e.onClick, q = e.tooltip, N = q === void 0 ? Sn.tooltip : q, ne = e.markers, z = ne === void 0 ? Sn.markers : ne, re = e.legends, ie = re === void 0 ? Sn.legends : re, ge = e.role, ye = ge === void 0 ? Sn.role : ge, pe = e.ariaLabel, be = e.ariaLabelledBy, we = e.ariaDescribedBy, ve = ns(l, c, u), he = ve.margin, le = ve.innerWidth, Se = ve.innerHeight, fe = ve.outerWidth, Ne = ve.outerHeight, Ae = iM({ data: t, xScaleSpec: r, xFormat: i, yScaleSpec: a, yFormat: s, width: le, height: Se, nodeId: y, nodeSize: S, colors: p }), Re = Ae.xScale, ke = Ae.yScale, Qe = Ae.nodes, et = Ae.legendData, Be = Me(function() {
+  var t = e.data, n = e.xScale, r = n === void 0 ? $n.xScale : n, i = e.xFormat, o = e.yScale, a = o === void 0 ? $n.yScale : o, s = e.yFormat, l = e.width, c = e.height, u = e.margin, d = e.layers, f = d === void 0 ? $n.layers : d, h = e.colors, p = h === void 0 ? $n.colors : h, g = e.blendMode, v = g === void 0 ? $n.blendMode : g, b = e.nodeId, y = b === void 0 ? $n.nodeId : b, x = e.nodeSize, S = x === void 0 ? $n.nodeSize : x, w = e.nodeComponent, $ = w === void 0 ? $n.nodeComponent : w, H = e.enableGridX, _ = H === void 0 ? $n.enableGridX : H, M = e.enableGridY, E = M === void 0 ? $n.enableGridY : M, R = e.gridXValues, I = e.gridYValues, O = e.axisTop, T = e.axisRight, k = e.axisBottom, L = k === void 0 ? $n.axisBottom : k, V = e.axisLeft, P = V === void 0 ? $n.axisLeft : V, j = e.annotations, A = j === void 0 ? $n.annotations : j, F = e.isInteractive, Z = F === void 0 ? $n.isInteractive : F, U = e.useMesh, G = U === void 0 ? $n.useMesh : U, J = e.debugMesh, X = J === void 0 ? $n.debugMesh : J, Y = e.onMouseEnter, Q = e.onMouseMove, B = e.onMouseLeave, W = e.onClick, q = e.tooltip, N = q === void 0 ? $n.tooltip : q, ne = e.markers, z = ne === void 0 ? $n.markers : ne, re = e.legends, ie = re === void 0 ? $n.legends : re, ge = e.role, ye = ge === void 0 ? $n.role : ge, pe = e.ariaLabel, be = e.ariaLabelledBy, we = e.ariaDescribedBy, ve = ns(l, c, u), he = ve.margin, le = ve.innerWidth, Se = ve.innerHeight, fe = ve.outerWidth, Ne = ve.outerHeight, Ae = iM({ data: t, xScaleSpec: r, xFormat: i, yScaleSpec: a, yFormat: s, width: le, height: Se, nodeId: y, nodeSize: S, colors: p }), Re = Ae.xScale, ke = Ae.yScale, Qe = Ae.nodes, et = Ae.legendData, Be = Me(function() {
     return { xScale: Re, yScale: ke, nodes: Qe, margin: he, innerWidth: le, innerHeight: Se, outerWidth: fe, outerHeight: Ne };
   }, [Re, ke, Qe, he, le, Se, fe, Ne]), je = { grid: null, axes: null, nodes: null, markers: null, mesh: null, annotations: null, legends: null };
   return f.includes("grid") && (je.grid = m.jsx(Y$, { width: le, height: Se, xScale: _ ? Re : null, yScale: E ? ke : null, xValues: R, yValues: I }, "grid")), f.includes("axes") && (je.axes = m.jsx(G$, { xScale: Re, yScale: ke, width: le, height: Se, top: O, right: T, bottom: L, left: P }, "axes")), f.includes("nodes") && (je.nodes = m.jsx(gde, { nodes: Qe, nodeComponent: $, isInteractive: Z, tooltip: N, blendMode: v, onMouseEnter: Y, onMouseMove: Q, onMouseLeave: B, onClick: W }, "nodes")), f.includes("markers") && (je.markers = m.jsx(h$, { markers: z, width: le, height: Se, xScale: Re, yScale: ke }, "markers")), f.includes("mesh") && Z && G && (je.mesh = m.jsx(vde, { nodes: Qe, width: le, height: Se, onMouseEnter: Y, onMouseMove: Q, onMouseLeave: B, onClick: W, tooltip: N, debug: X }, "mesh")), f.includes("annotations") && (je.annotations = m.jsx(dde, { nodes: Qe, annotations: A }, "annotations")), f.includes("legends") && (je.legends = ie.map(function(tt, Ge) {
@@ -35844,7 +35844,7 @@ var cde = function(e) {
     throw new Error("Unknown layer (" + tt + ")");
   }) });
 }, bde = function(e) {
-  var t = e.isInteractive, n = t === void 0 ? Sn.isInteractive : t, r = e.animate, i = r === void 0 ? Sn.animate : r, o = e.motionConfig, a = o === void 0 ? Sn.motionConfig : o, s = e.theme, l = e.renderWrapper, c = rM(e, pde);
+  var t = e.isInteractive, n = t === void 0 ? $n.isInteractive : t, r = e.animate, i = r === void 0 ? $n.animate : r, o = e.motionConfig, a = o === void 0 ? $n.motionConfig : o, s = e.theme, l = e.renderWrapper, c = rM(e, pde);
   return m.jsx(rs, { animate: i, isInteractive: n, motionConfig: a, renderWrapper: l, theme: s, children: m.jsx(mde, Dr({ isInteractive: n }, c)) });
 }, sM = function(e) {
   return m.jsx(ia, { children: function(t) {
@@ -35852,7 +35852,7 @@ var cde = function(e) {
     return m.jsx(bde, Dr({ width: n, height: r }, e));
   } });
 }, yde = ["isInteractive", "renderWrapper", "theme"], Cde = function(e) {
-  var t = e.data, n = e.xScale, r = n === void 0 ? dr.xScale : n, i = e.xFormat, o = e.yScale, a = o === void 0 ? dr.yScale : o, s = e.yFormat, l = e.width, c = e.height, u = e.margin, d = e.pixelRatio, f = d === void 0 ? dr.pixelRatio : d, h = e.layers, p = h === void 0 ? dr.layers : h, g = e.colors, v = g === void 0 ? dr.colors : g, b = e.nodeId, y = b === void 0 ? Sn.nodeId : b, x = e.nodeSize, S = x === void 0 ? dr.nodeSize : x, w = e.renderNode, $ = w === void 0 ? dr.renderNode : w, H = e.enableGridX, _ = H === void 0 ? dr.enableGridX : H, M = e.gridXValues, E = e.enableGridY, R = E === void 0 ? dr.enableGridY : E, I = e.gridYValues, O = e.axisTop, T = e.axisRight, k = e.axisBottom, L = k === void 0 ? dr.axisBottom : k, V = e.axisLeft, P = V === void 0 ? dr.axisLeft : V, j = e.annotations, A = j === void 0 ? dr.annotations : j, F = e.isInteractive, Z = F === void 0 ? dr.isInteractive : F, U = e.debugMesh, G = U === void 0 ? dr.debugMesh : U, J = e.onMouseEnter, X = e.onMouseMove, Y = e.onMouseLeave, Q = e.onClick, B = e.tooltip, W = B === void 0 ? dr.tooltip : B, q = e.legends, N = q === void 0 ? dr.legends : q, ne = e.canvasRef, z = Te(null), re = Qt(), ie = pt(null), ge = ie[0], ye = ie[1], pe = ns(l, c, u), be = pe.margin, we = pe.innerWidth, ve = pe.innerHeight, he = pe.outerWidth, le = pe.outerHeight, Se = iM({ data: t, xScaleSpec: r, xFormat: i, yScaleSpec: a, yFormat: s, width: we, height: ve, nodeId: y, nodeSize: S, colors: v }), fe = Se.xScale, Ne = Se.yScale, Ae = Se.nodes, Re = Se.legendData, ke = oM(Ae, A), Qe = zh({ points: Ae, width: we, height: ve, debug: G }), et = Qe.delaunay, Be = Qe.voronoi, je = Me(function() {
+  var t = e.data, n = e.xScale, r = n === void 0 ? dr.xScale : n, i = e.xFormat, o = e.yScale, a = o === void 0 ? dr.yScale : o, s = e.yFormat, l = e.width, c = e.height, u = e.margin, d = e.pixelRatio, f = d === void 0 ? dr.pixelRatio : d, h = e.layers, p = h === void 0 ? dr.layers : h, g = e.colors, v = g === void 0 ? dr.colors : g, b = e.nodeId, y = b === void 0 ? $n.nodeId : b, x = e.nodeSize, S = x === void 0 ? dr.nodeSize : x, w = e.renderNode, $ = w === void 0 ? dr.renderNode : w, H = e.enableGridX, _ = H === void 0 ? dr.enableGridX : H, M = e.gridXValues, E = e.enableGridY, R = E === void 0 ? dr.enableGridY : E, I = e.gridYValues, O = e.axisTop, T = e.axisRight, k = e.axisBottom, L = k === void 0 ? dr.axisBottom : k, V = e.axisLeft, P = V === void 0 ? dr.axisLeft : V, j = e.annotations, A = j === void 0 ? dr.annotations : j, F = e.isInteractive, Z = F === void 0 ? dr.isInteractive : F, U = e.debugMesh, G = U === void 0 ? dr.debugMesh : U, J = e.onMouseEnter, X = e.onMouseMove, Y = e.onMouseLeave, Q = e.onClick, B = e.tooltip, W = B === void 0 ? dr.tooltip : B, q = e.legends, N = q === void 0 ? dr.legends : q, ne = e.canvasRef, z = Te(null), re = Qt(), ie = pt(null), ge = ie[0], ye = ie[1], pe = ns(l, c, u), be = pe.margin, we = pe.innerWidth, ve = pe.innerHeight, he = pe.outerWidth, le = pe.outerHeight, Se = iM({ data: t, xScaleSpec: r, xFormat: i, yScaleSpec: a, yFormat: s, width: we, height: ve, nodeId: y, nodeSize: S, colors: v }), fe = Se.xScale, Ne = Se.yScale, Ae = Se.nodes, Re = Se.legendData, ke = oM(Ae, A), Qe = zh({ points: Ae, width: we, height: ve, debug: G }), et = Qe.delaunay, Be = Qe.voronoi, je = Me(function() {
     return { xScale: fe, yScale: Ne, nodes: Ae, margin: be, innerWidth: we, innerHeight: ve, outerWidth: he, outerHeight: le };
   }, [fe, Ne, Ae, be, we, ve, he, le]);
   St(function() {
@@ -36771,22 +36771,31 @@ const h2e = (e, t = 12) => {
   }, w = ({ nodes: $ }) => $.map((H) => /* @__PURE__ */ m.jsx(S, { node: H }, H.id));
   return /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
     /* @__PURE__ */ m.jsx(En, {}),
-    /* @__PURE__ */ m.jsx("div", { ref: b, style: { width: "100%", height: 600, ...t }, children: /* @__PURE__ */ m.jsx(
-      u2e,
-      {
-        data: e,
-        colors: n,
-        identity: r,
-        value: i,
-        margin: { top: 10, right: 10, bottom: 10, left: 10, ...o },
-        enableParentLabel: !1,
-        enableLabel: !1,
-        nodeOpacity: 0,
-        borderWidth: 0,
-        tooltip: ({ node: $ }) => /* @__PURE__ */ m.jsx(pr, { body: (v == null ? void 0 : v({ node: $ })) || /* @__PURE__ */ m.jsx("span", { children: "Treemap tooltip" }) }),
-        layers: [w, "nodes"]
-      }
-    ) })
+    /* @__PURE__ */ m.jsxs(Sn, { gap: 16, vertical: !0, children: [
+      /* @__PURE__ */ m.jsx("div", { ref: b, style: { width: "100%", height: 600, ...t }, children: /* @__PURE__ */ m.jsx(
+        u2e,
+        {
+          data: e,
+          colors: n,
+          identity: r,
+          value: i,
+          margin: { top: 10, right: 10, bottom: 10, left: 10, ...o },
+          enableParentLabel: !1,
+          enableLabel: !1,
+          nodeOpacity: 0,
+          borderWidth: 0,
+          tooltip: ({ node: $ }) => /* @__PURE__ */ m.jsx(pr, { body: (v == null ? void 0 : v({ node: $ })) || /* @__PURE__ */ m.jsx("span", { children: "Treemap tooltip" }) }),
+          layers: [w, "nodes"]
+        }
+      ) }),
+      /* @__PURE__ */ m.jsx("p", { style: {
+        padding: "0 10px",
+        fontFamily: "Roboto, sans-serif",
+        fontSize: 14,
+        lineHeight: "22px",
+        color: "#475467"
+      }, children: "In de grafiek hierboven zijn alle afvalstromen uitgesplitst per EURAL-code, een zescijferige code uit de Europese Afvallijst (EWL) die in heel Europa wordt gebruikt om afval te classificeren. De code geeft de bron van het afval aan, het proces of de activiteit waaruit het afkomstig is en het specifieke type afval, zoals bouw- of huishoudelijk afval. Een asterisk (*) achter de code betekent dat het afval gevaarlijk is." })
+    ] })
   ] });
 };
 var v2e = H1, p2e = 0;
@@ -37205,7 +37214,7 @@ const U7e = ({
         ]
       }
     ) }) });
-  }, g = ({ nodes: b }) => b.map((y) => /* @__PURE__ */ m.jsx(p, { node: y }, y.id)), v = () => /* @__PURE__ */ m.jsx("div", { style: { marginTop: 10, marginLeft: 10, whiteSpace: "nowrap" }, children: Object.keys(ac).map((b, y) => /* @__PURE__ */ m.jsxs($n, { gap: 8, align: "center", children: [
+  }, g = ({ nodes: b }) => b.map((y) => /* @__PURE__ */ m.jsx(p, { node: y }, y.id)), v = () => /* @__PURE__ */ m.jsx("div", { style: { marginTop: 10, marginLeft: 10, whiteSpace: "nowrap" }, children: Object.keys(ac).map((b, y) => /* @__PURE__ */ m.jsxs(Sn, { gap: 8, align: "center", children: [
     /* @__PURE__ */ m.jsx(
       "div",
       {
@@ -39079,7 +39088,7 @@ const c5 = 12, b_ = 14, p5e = Gt.tspan`
       /* @__PURE__ */ m.jsx(Yr, { span: 12, children: /* @__PURE__ */ m.jsx(X2e, { ref: n, ...e }) }),
       /* @__PURE__ */ m.jsx(Yr, { span: 12, children: /* @__PURE__ */ m.jsx(b5e, { ...t, height: r }) })
     ] }),
-    /* @__PURE__ */ m.jsx($n, { justify: "center", style: { marginTop: 16 }, children: /* @__PURE__ */ m.jsx(Q2e, {}) })
+    /* @__PURE__ */ m.jsx(Sn, { justify: "center", style: { marginTop: 16 }, children: /* @__PURE__ */ m.jsx(Q2e, {}) })
   ] });
 }, Dm = ({ data: e, graph: t, stroke: n, strokeWidth: r, dashed: i }) => (
   // horizontal line representing the target value for comparison
@@ -39177,8 +39186,8 @@ const c5 = 12, b_ = 14, p5e = Gt.tspan`
       { name: "Betrouwbaarheidsmarge", color: I(hn == null ? void 0 : hn[T]), shape: "circle" },
       { name: "Betrouwbaarheidsmarge", color: I(hn == null ? void 0 : hn.abiotic), shape: "circle" }
     ];
-    return /* @__PURE__ */ m.jsx($n, { gap: 16, className: "gf-full", justify: "center", wrap: !0, children: k.map(
-      (L, V) => /* @__PURE__ */ m.jsxs($n, { gap: 4, align: "center", children: [
+    return /* @__PURE__ */ m.jsx(Sn, { gap: 16, className: "gf-full", justify: "center", wrap: !0, children: k.map(
+      (L, V) => /* @__PURE__ */ m.jsxs(Sn, { gap: 4, align: "center", children: [
         L.shape === "line" ? /* @__PURE__ */ m.jsx(E, { color: L.color }) : /* @__PURE__ */ m.jsx(R, { color: L.color }),
         /* @__PURE__ */ m.jsx(C5e, { children: L.name })
       ] }, `legend-${V}`)
@@ -39186,7 +39195,7 @@ const c5 = 12, b_ = 14, p5e = Gt.tspan`
   };
   return /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
     /* @__PURE__ */ m.jsx(En, {}),
-    /* @__PURE__ */ m.jsxs($n, { vertical: !0, gap: 8, style: { width: "100%" }, children: [
+    /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, gap: 8, style: { width: "100%" }, children: [
       /* @__PURE__ */ m.jsx("div", { style: { width: "100%", height: n, ...t }, children: /* @__PURE__ */ m.jsx(
         sM,
         {
@@ -39339,8 +39348,8 @@ const c5 = 12, b_ = 14, p5e = Gt.tspan`
         defs: p
       };
     });
-    return /* @__PURE__ */ m.jsx($n, { gap: 16, className: "gf-full", justify: "center", wrap: !0, children: E.map(
-      (R, I) => /* @__PURE__ */ m.jsxs($n, { gap: 8, align: "center", children: [
+    return /* @__PURE__ */ m.jsx(Sn, { gap: 16, className: "gf-full", justify: "center", wrap: !0, children: E.map(
+      (R, I) => /* @__PURE__ */ m.jsxs(Sn, { gap: 8, align: "center", children: [
         /* @__PURE__ */ m.jsx("div", { style: {
           minWidth: 16,
           minHeight: 16,
@@ -39369,7 +39378,7 @@ const c5 = 12, b_ = 14, p5e = Gt.tspan`
   }, H = e.slice().reverse();
   return f.push("bars"), s && f.push(S), h && f.push($), /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
     /* @__PURE__ */ m.jsx(En, {}),
-    /* @__PURE__ */ m.jsxs($n, { vertical: !0, gap: 8, style: { width: "100%" }, children: [
+    /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, gap: 8, style: { width: "100%" }, children: [
       /* @__PURE__ */ m.jsx("div", { style: { height: t }, children: /* @__PURE__ */ m.jsx(
         F1,
         {
@@ -40908,8 +40917,8 @@ const ha = 12, y5 = 14, Ms = Gt.tspan`
         defs: g
       };
     });
-    return /* @__PURE__ */ m.jsx($n, { gap: 16, className: "gf-full", justify: "center", wrap: !0, children: L.map(
-      (V, P) => /* @__PURE__ */ m.jsxs($n, { gap: 8, align: "center", children: [
+    return /* @__PURE__ */ m.jsx(Sn, { gap: 16, className: "gf-full", justify: "center", wrap: !0, children: L.map(
+      (V, P) => /* @__PURE__ */ m.jsxs(Sn, { gap: 8, align: "center", children: [
         /* @__PURE__ */ m.jsx("div", { style: {
           minWidth: 8,
           minHeight: 8,
@@ -40974,7 +40983,7 @@ const ha = 12, y5 = 14, Ms = Gt.tspan`
   const O = e.slice().reverse();
   return /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
     /* @__PURE__ */ m.jsx(En, {}),
-    /* @__PURE__ */ m.jsxs($n, { vertical: !0, gap: 8, style: { width: "100%" }, ref: E, children: [
+    /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, gap: 8, style: { width: "100%" }, ref: E, children: [
       /* @__PURE__ */ m.jsx(_, { data: e, keys: o }),
       /* @__PURE__ */ m.jsxs(Va, { gutter: [0, 0], children: [
         /* @__PURE__ */ m.jsx(Yr, { span: b, children: /* @__PURE__ */ m.jsx(M, { value: o[0], labels: !0 }) }),
@@ -41036,8 +41045,8 @@ const ha = 12, y5 = 14, Ms = Gt.tspan`
       name: b,
       color: K2[b]
     }));
-    return /* @__PURE__ */ m.jsx($n, { gap: 16, className: "gf-full", justify: "center", wrap: !0, children: v.map(
-      (b, y) => /* @__PURE__ */ m.jsxs($n, { gap: 8, align: "center", children: [
+    return /* @__PURE__ */ m.jsx(Sn, { gap: 16, className: "gf-full", justify: "center", wrap: !0, children: v.map(
+      (b, y) => /* @__PURE__ */ m.jsxs(Sn, { gap: 8, align: "center", children: [
         /* @__PURE__ */ m.jsx("div", { style: {
           minWidth: 16,
           minHeight: 16,
@@ -41049,7 +41058,7 @@ const ha = 12, y5 = 14, Ms = Gt.tspan`
   };
   return /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
     /* @__PURE__ */ m.jsx(En, {}),
-    /* @__PURE__ */ m.jsxs($n, { vertical: !0, gap: 8, style: { width: "100%" }, children: [
+    /* @__PURE__ */ m.jsxs(Sn, { vertical: !0, gap: 8, style: { width: "100%" }, children: [
       /* @__PURE__ */ m.jsx("div", { style: { height: t }, children: /* @__PURE__ */ m.jsx(
         F1,
         {