@pie-lib/charting 7.0.4-next.30 → 7.0.4-next.34

package/src/utils.js

@@ -0,0 +1,201 @@
+import { scaleBand, scalePoint } from '@visx/scale';
+import { utils } from '@pie-lib/plot';
+
+export const tickCount = utils.tickCount;
+export const bounds = utils.bounds;
+export const point = utils.point;
+
+export const bandKey = (d, index) => `${index}-${d.label || '-'}`;
+
+export const dataToXBand = (scaleX, data, width, type) => {
+  const chartWidth = width || 400; // fallback
+  const domain = data && data.length ? data.map(bandKey) : ['default'];
+
+  switch (type) {
+    case 'bar':
+    case 'dotPlot':
+    case 'linePlot':
+      return scaleBand({
+        range: [0, chartWidth],
+        domain,
+        padding: 0.2,
+      });
+
+    case 'histogram':
+      return scaleBand({
+        range: [0, chartWidth],
+        domain,
+        padding: 0,
+      });
+
+    case 'lineCross':
+    case 'lineDot':
+      return scalePoint({
+        domain,
+        range: [0, chartWidth],
+      });
+
+    default:
+      return scaleBand({
+        range: [0, chartWidth],
+        domain,
+        padding: 0,
+      });
+  }
+};
+
+export const getTickValues = (prop = {}) => {
+  const tickValues = [];
+  let tickVal = prop.min;
+
+  while (tickVal <= prop.max) {
+    tickValues.push(tickVal);
+    tickVal = Math.round((tickVal + prop.step) * 10000) / 10000;
+  }
+
+  return tickValues;
+};
+
+export const getDomainAndRangeByChartType = (domain, range, chartType) => {
+  let { step, labelStep, min, max } = range || {};
+
+  if (!min) {
+    min = 0;
+  }
+
+  if (!max || max < 0) {
+    max = range.min + 1;
+  }
+
+  if (!step) {
+    step = labelStep || 1;
+  }
+  if (!labelStep || (isNaN(labelStep) && step)) {
+    labelStep = step || 1;
+  }
+
+  range.max = max;
+
+  switch (chartType) {
+    // if chart is dot plot or line plot, we should ignore step and make sure that min & max are integer values
+    case 'dotPlot':
+    case 'linePlot': {
+      const intMin = Math.round(min);
+      const intMax = Math.round(max);
+
+      return {
+        domain: {
+          ...domain,
+          step: 1,
+          labelStep: 1,
+          min: 0,
+          max: 1,
+        },
+        range: {
+          ...range,
+          min: intMin,
+          max: intMin === intMax ? intMin + 1 : intMax,
+          labelStep,
+          step: 1,
+        },
+      };
+    }
+
+    default:
+      return {
+        domain: {
+          ...domain,
+          step: 1,
+          labelStep: 1,
+          min: 0,
+          max: 1,
+        },
+        range: {
+          ...range,
+          labelStep,
+          step,
+        },
+      };
+  }
+};
+
+export const getGridLinesAndAxisByChartType = (range, chartType) => {
+  switch (chartType) {
+    case 'lineDot':
+    case 'lineCross':
+      return {
+        verticalLines: undefined,
+        horizontalLines: getTickValues(range),
+        leftAxis: true,
+      };
+
+    case 'dotPlot':
+    case 'linePlot':
+      return {
+        verticalLines: [],
+        horizontalLines: [],
+        leftAxis: false,
+      };
+
+    default:
+      return {
+        verticalLines: [],
+        horizontalLines: getTickValues(range),
+        leftAxis: true,
+      };
+  }
+};
+
+export const getRotateAngle = (fontSize, height) => {
+  if (height >= fontSize * 2) {
+    return 25;
+  }
+
+  return 0;
+};
+
+export const getTopPadding = (barWidth) => {
+  if (barWidth < 30) {
+    return 50;
+  }
+
+  if (barWidth < 40) {
+    return 30;
+  }
+
+  if (barWidth < 60) {
+    return 15;
+  }
+
+  return 0;
+};
+
+// This function calculates the transformation scale for SVG and the icon's vertical distance from its category
+export const getScale = (width) => {
+  let scale, deltay;
+
+  if (width > 91) {
+    scale = 1.3;
+    deltay = -55;
+  } else if (width > 45) {
+    scale = 1.1;
+    deltay = -45;
+  } else if (width > 40) {
+    scale = 0.5 + (width - 34) * 0.02;
+    deltay = -25;
+  } else if (width > 30) {
+    scale = 0.5 + (width - 34) * 0.02;
+    deltay = -20;
+  } else {
+    scale = 0.5 * Math.pow(0.98, 34 - width); // 0.98 is the reduction factor. Adjust to control scaling.
+    deltay = -15;
+  }
+
+  return { scale, deltay };
+};
+
+export const getAdjustedX = (width, scaleValue) => {
+  const innerWidthOriginal = 57;
+  const effectiveInnerWidth = innerWidthOriginal * scaleValue;
+  return (width - effectiveInnerWidth) / 2;
+};

package/dist/_virtual/_rolldown/runtime.js

@@ -1,23 +0,0 @@
-//#region \0rolldown/runtime.js
-var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescriptor, r = Object.getOwnPropertyNames, i = Object.getPrototypeOf, a = Object.prototype.hasOwnProperty, o = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t.exports), s = (e, n) => {
-	let r = {};
-	for (var i in e) t(r, i, {
-		get: e[i],
-		enumerable: !0
-	});
-	return n || t(r, Symbol.toStringTag, { value: "Module" }), r;
-}, c = (e, i, o, s) => {
-	if (i && typeof i == "object" || typeof i == "function") for (var c = r(i), l = 0, u = c.length, d; l < u; l++) d = c[l], !a.call(e, d) && d !== o && t(e, d, {
-		get: ((e) => i[e]).bind(null, d),
-		enumerable: !(s = n(i, d)) || s.enumerable
-	});
-	return e;
-}, l = (e, t, n) => (c(e, t, "default"), n && c(n, t, "default")), u = (n, r, a) => (a = n == null ? {} : e(i(n)), c(r || !n || !n.__esModule ? t(a, "default", {
-	value: n,
-	enumerable: !0
-}) : a, n)), d = /* @__PURE__ */ ((e) => typeof require < "u" ? require : typeof Proxy < "u" ? new Proxy(e, { get: (e, t) => (typeof require < "u" ? require : e)[t] }) : e)(function(e) {
-	if (typeof require < "u") return require.apply(this, arguments);
-	throw Error("Calling `require` for \"" + e + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
-});
-//#endregion
-export { o as __commonJSMin, s as __exportAll, l as __reExport, d as __require, u as __toESM };

package/dist/actions-button.d.ts

@@ -1,26 +0,0 @@
-/**
- * @synced-from pie-lib/packages/charting/src/actions-button.jsx
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-export declare class ActionsButton extends React.Component {
-    constructor(props: any);
-    componentWillUnmount(): void;
-    static propTypes: {
-        addCategory: PropTypes.Validator<(...args: any[]) => any>;
-        deleteCategory: PropTypes.Validator<(...args: any[]) => any>;
-        language: PropTypes.Requireable<string>;
-        categories: PropTypes.Requireable<any[]>;
-    };
-    handleActionsClick: any;
-    handleActionsClose: any;
-    handleAddCategory: any;
-    handleDeleteCategory: any;
-    render(): React.JSX.Element;
-}
-export default ActionsButton;

package/dist/actions-button.js

@@ -1,84 +0,0 @@
-import e from "react";
-import t from "prop-types";
-import { styled as n } from "@mui/material/styles";
-import { color as r } from "@pie-lib/render-ui";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import o from "@mui/material/Button";
-import s from "@mui/material/Popover";
-import c from "@mui/material/Paper";
-import l from "@pie-lib/translator";
-//#region src/actions-button.tsx
-var { translator: u } = l, d = n("div")(() => ({ alignSelf: "flex-end" })), f = n("div")(({ theme: e }) => ({
-	cursor: "pointer",
-	fontSize: e.typography.fontSize,
-	color: r.tertiary(),
-	padding: e.spacing(1)
-})), p = n(c)(({ theme: e }) => ({
-	padding: e.spacing(1),
-	display: "flex",
-	flexDirection: "column",
-	gap: e.spacing(1),
-	"& button": {
-		textTransform: "none",
-		fontSize: e.typography.fontSize,
-		color: r.text(),
-		justifyContent: "flex-start"
-	}
-})), m = class extends e.Component {
-	constructor(e) {
-		super(e), this.state = { actionsAnchorEl: null };
-	}
-	componentWillUnmount() {
-		this.setState({ actionsAnchorEl: null });
-	}
-	static propTypes = {
-		addCategory: t.func.isRequired,
-		deleteCategory: t.func.isRequired,
-		language: t.string,
-		categories: t.array
-	};
-	handleActionsClick = (e) => {
-		this.setState({ actionsAnchorEl: e.currentTarget });
-	};
-	handleActionsClose = () => {
-		this.setState({ actionsAnchorEl: null });
-	};
-	handleAddCategory = () => {
-		let { addCategory: e } = this.props;
-		e(), this.handleActionsClose();
-	};
-	handleDeleteCategory = (e) => {
-		let { deleteCategory: t } = this.props;
-		t(e), this.handleActionsClose();
-	};
-	render() {
-		let { categories: e, language: t } = this.props, { actionsAnchorEl: n } = this.state;
-		return /* @__PURE__ */ a(d, { children: [/* @__PURE__ */ i(f, {
-			role: "button",
-			tabIndex: 0,
-			onClick: this.handleActionsClick,
-			children: "Actions"
-		}), /* @__PURE__ */ i(s, {
-			open: !!n,
-			anchorEl: n,
-			onClose: this.handleActionsClose,
-			anchorOrigin: {
-				vertical: "bottom",
-				horizontal: "left"
-			},
-			transformOrigin: {
-				vertical: "top",
-				horizontal: "left"
-			},
-			children: /* @__PURE__ */ a(p, { children: [/* @__PURE__ */ a(o, {
-				onClick: () => this.handleAddCategory(),
-				children: ["+ ", u.t("charting.add", { lng: t })]
-			}), e.length > 0 && e.map((e, n) => e.deletable && !e.correctness && /* @__PURE__ */ i(o, {
-				onClick: () => this.handleDeleteCategory(n),
-				children: `${u.t("charting.delete", { lng: t })} <${e.label || u.t("charting.newLabel", { lng: t })}>`
-			}, n))] })
-		}, `actions-popover-${Math.random()}`)] });
-	}
-};
-//#endregion
-export { m as default };

package/dist/autosize-input.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-export interface AutosizeInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'className' | 'style'> {
-    className?: string;
-    inputClassName?: string;
-    inputRef?: (node: HTMLInputElement | null) => void;
-    inputStyle?: React.CSSProperties;
-    minWidth?: number | string;
-    style?: React.CSSProperties;
-}
-export declare const AutosizeInput: React.ForwardRefExoticComponent<AutosizeInputProps & React.RefAttributes<HTMLInputElement>>;

package/dist/autosize-input.js

@@ -1,66 +0,0 @@
-import e, { useCallback as t, useLayoutEffect as n, useRef as r, useState as i } from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-//#region src/autosize-input.tsx
-var s = (e) => {
-	let t = Number.parseFloat(e);
-	return Number.isFinite(t) ? t : 0;
-}, c = (e, t) => {
-	let n = e ?? t;
-	return typeof n == "number" ? n : typeof n == "string" && n.endsWith("px") ? s(n) : 1;
-}, l = e.forwardRef(({ className: e, inputClassName: l, inputRef: u, inputStyle: d, minWidth: f, placeholder: p, style: m, value: h, defaultValue: g, ..._ }, v) => {
-	let y = r(null), b = r(u), x = r(v), S = r(null), [C, w] = i(() => c(f, d?.minWidth));
-	b.current = u, x.current = v;
-	let T = t((e) => {
-		y.current = e, b.current?.(e);
-		let t = x.current;
-		typeof t == "function" ? t(e) : t && (t.current = e);
-	}, []);
-	return n(() => {
-		let e = y.current, t = S.current;
-		if (!e || !t) return;
-		let n = window.getComputedStyle(e);
-		t.style.font = n.font, t.style.letterSpacing = n.letterSpacing, t.style.textTransform = n.textTransform, t.textContent = String(h ?? g ?? p ?? "") || " ";
-		let r = s(n.paddingLeft) + s(n.paddingRight) + s(n.borderLeftWidth) + s(n.borderRightWidth), i = Math.ceil(t.getBoundingClientRect().width + 2), a = n.boxSizing === "border-box" ? i + r : i;
-		w(Math.max(c(f, d?.minWidth), a));
-	}, [
-		g,
-		l,
-		d,
-		f,
-		p,
-		h
-	]), /* @__PURE__ */ o("span", {
-		className: e,
-		style: {
-			display: "inline-block",
-			...m
-		},
-		children: [/* @__PURE__ */ a("input", {
-			..._,
-			ref: T,
-			className: l,
-			placeholder: p,
-			style: {
-				width: C,
-				...d
-			},
-			value: h,
-			defaultValue: g
-		}), /* @__PURE__ */ a("span", {
-			ref: S,
-			"aria-hidden": "true",
-			style: {
-				height: 0,
-				left: 0,
-				overflow: "hidden",
-				position: "absolute",
-				top: 0,
-				visibility: "hidden",
-				whiteSpace: "pre"
-			}
-		})]
-	});
-});
-l.displayName = "AutosizeInput";
-//#endregion
-export { l as AutosizeInput };

package/dist/axes.d.ts

@@ -1,84 +0,0 @@
-/**
- * @synced-from pie-lib/packages/charting/src/axes.jsx
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-export declare class TickComponent extends React.Component {
-    static propTypes: {
-        defineChart: PropTypes.Requireable<boolean>;
-        error: PropTypes.Requireable<any>;
-    };
-    constructor(props: any);
-    componentDidUpdate(prevProps: any): void;
-    handleAlertDialog: (open: any, callback: any) => void;
-    changeCategory: any;
-    changeInteractive: any;
-    changeEditable: any;
-    splitText: any;
-    render(): React.JSX.Element | null;
-}
-export declare class RawChartAxes extends React.Component {
-    static propTypes: {
-        bottomScale: PropTypes.Requireable<(...args: any[]) => any>;
-        categories: PropTypes.Requireable<any[]>;
-        defineChart: PropTypes.Requireable<boolean>;
-        error: PropTypes.Requireable<any>;
-        graphProps: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-            scale: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-                x: PropTypes.Validator<(...args: any[]) => any>;
-                y: PropTypes.Validator<(...args: any[]) => any>;
-            }>>>;
-            snap: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-                x: PropTypes.Validator<(...args: any[]) => any>;
-                y: PropTypes.Validator<(...args: any[]) => any>;
-            }>>>;
-            domain: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-                min: PropTypes.Validator<number>;
-                max: PropTypes.Validator<number>;
-                step: PropTypes.Requireable<number>;
-            }>>>;
-            range: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-                min: PropTypes.Validator<number>;
-                max: PropTypes.Validator<number>;
-                step: PropTypes.Requireable<number>;
-            }>>>;
-            size: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-                width: PropTypes.Validator<number>;
-                height: PropTypes.Validator<number>;
-            }>>>;
-        }>>>;
-        xBand: PropTypes.Requireable<(...args: any[]) => any>;
-        leftAxis: PropTypes.Requireable<boolean>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        onChangeCategory: PropTypes.Requireable<(...args: any[]) => any>;
-        top: PropTypes.Requireable<number>;
-        theme: PropTypes.Requireable<object>;
-        chartingOptions: PropTypes.Requireable<object>;
-        changeInteractiveEnabled: PropTypes.Requireable<boolean>;
-        changeEditableEnabled: PropTypes.Requireable<boolean>;
-        autoFocus: PropTypes.Requireable<boolean>;
-        onAutoFocusUsed: PropTypes.Requireable<(...args: any[]) => any>;
-        showCorrectness: PropTypes.Requireable<boolean>;
-        hiddenLabelRef: PropTypes.Requireable<NonNullable<((...args: any[]) => any) | PropTypes.InferProps<{
-            current: PropTypes.Requireable<Element>;
-        }> | null | undefined>>;
-    };
-    state: {
-        height: number;
-        width: number;
-    };
-    measureHiddenLabel: any;
-    _onDocMutation: any;
-    observeHiddenLabel: any;
-    setHiddenLabelRef: any;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    componentDidUpdate(prevProps: any): void;
-    render(): React.JSX.Element;
-}
-export default RawChartAxes;