@apia/charts 1.0.2 → 2.0.0

package/dist/widgets/tLight/TLight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TLight.js","sources":["../../../src/widgets/tLight/TLight.tsx"],"sourcesContent":["import { Box } from '@apia/theme';\nimport { useGauge } from 'use-gauge';\nimport { TApiaWidgetProps } from '../types';\nimport { useCallback, useRef, useState, useEffect } from 'react';\nimport { addBoundary, noNaN, animate } from '@apia/util';\n\nconst START_ANGLE = 0;\nconst END_ANGLE = 360;\n\nexport const TLight = ({\n  addBorder = false,\n  colorRanges,\n  maxValue,\n  minValue,\n  currentValue,\n  height,\n  valueRanges,\n  width,\n  currentValueColor,\n  currentValueFontSize,\n}: TApiaWidgetProps) => {\n  const [value, setValue] = useState(currentValue);\n  const diameter = Math.min(height, width);\n  const domainMax = noNaN(maxValue) ?? valueRanges[valueRanges.length - 1];\n  const domainMin = noNaN(minValue) ?? valueRanges[0];\n  const gauge = useGauge({\n    domain: [domainMin, domainMax],\n    startAngle: START_ANGLE,\n    endAngle: END_ANGLE,\n    numTicks: 0,\n    diameter: diameter,\n  });\n  function getColor(value: number) {\n    const index = valueRanges.findIndex((range) => value < range);\n\n    if (index === -1) {\n      return colorRanges[0];\n    }\n\n    return colorRanges[index - 1] ?? colorRanges[index];\n  }\n\n  const hasRendered = useRef(false);\n\n  const onRenderSvg = useCallback(\n    (el: SVGSVGElement) => {\n      if (!el || hasRendered.current) return;\n\n      hasRendered.current = true;\n\n      const svgElement = el;\n      const pathElement = el.querySelector('#TLight_arcs');\n\n      if (!(svgElement && pathElement)) {\n        return;\n      }\n\n      const pathBox = pathElement.getBoundingClientRect();\n      const svgBox = svgElement.getBoundingClientRect();\n      const pathX = pathBox.x - svgBox.x;\n      const pathY = pathBox.y - svgBox.y;\n\n      const viewBox = `${pathX - diameter / 2} ${\n        pathY - diameter / 2\n      } ${diameter} ${diameter}`;\n\n      svgElement.setAttribute('viewBox', viewBox);\n\n      svgElement.style.visibility = 'visible';\n    },\n    [diameter],\n  );\n\n  const lastCurrentValue = useRef(0);\n  useEffect(() => {\n    const difference = currentValue - lastCurrentValue.current;\n    return animate(\n      500,\n      (progress) => {\n        const step = addBoundary(\n          difference * progress + lastCurrentValue.current,\n          domainMin,\n          domainMax,\n        );\n        setValue(Math.round(step));\n      },\n      () => {\n        lastCurrentValue.current = currentValue;\n      },\n    );\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [currentValue]);\n  return (\n    <Box>\n      <svg\n        {...gauge.getSVGProps()}\n        style={{ visibility: 'hidden' }}\n        height={Math.max(width, height)}\n        width={Math.max(width, height)}\n        id=\"TLight_svg\"\n        ref={onRenderSvg}\n        viewBox={`-${diameter / 2} -${diameter / 2} ${diameter} ${diameter}`}\n      >\n        <g id=\"TLight_arcs\">\n          <path\n            {...gauge.getArcProps({\n              startAngle: START_ANGLE,\n              endAngle: END_ANGLE,\n            })}\n            fill={getColor(value)}\n            id=\"TLight_path\"\n            style={{ transition: 'fill 0.3s' }}\n          />\n          {addBorder && (\n            <path\n              {...gauge.getArcProps({\n                offset: -2.5,\n                startAngle: START_ANGLE,\n                endAngle: END_ANGLE,\n              })}\n              stroke={'black'}\n              fill={'transparent'}\n              strokeLinecap=\"round\"\n              strokeWidth={5}\n              id=\"TLight_path\"\n            />\n          )}\n        </g>\n        <g>\n          <text\n            textAnchor=\"middle\"\n            style={{ fontSize: `${currentValueFontSize ?? 100}pt` }}\n            alignmentBaseline=\"central\"\n            fill={currentValueColor}\n          >\n            {value}\n          </text>\n        </g>\n      </svg>\n    </Box>\n  );\n};\n"],"names":["value"],"mappings":"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"}

package/dist/widgets/thermometer/Thermometer.js

@@ -0,0 +1,144 @@
+import { jsxs, jsx } from '@apia/theme/jsx-runtime';
+import { Box } from '@apia/theme';
+import { valueToTickPercent, colorGetter, getInnerColor, getColor } from './util.js';
+import { noNaN } from '@apia/util';
+import { useCustomWidget } from '../custom/useCustomWidget.js';
+
+const Thermometer = ({
+  colorRanges,
+  maxValue,
+  minValue,
+  currentValue,
+  height,
+  valueRanges,
+  width,
+  panelId,
+  currentValueFontSize
+}) => {
+  const value = currentValue;
+  const baseValue = noNaN(minValue) ?? valueRanges[0];
+  const domainMax = noNaN(maxValue) ?? valueRanges[valueRanges.length - 1];
+  const pathDValue = `m 179.6875,717.73633 c -0.45013,0 -0.8125,0.36237 -0.8125,0.8125 l 0,8.46289 a 2.3125,2.3125 0 0 0 -1.5,2.16211 2.3125,2.3125 0 0 0 2.3125,2.3125 2.3125,2.3125 0 0 0 2.3125,-2.3125 2.3125,2.3125 0 0 0 -1.5,-2.16211 l 0,-8.46289 c 0,-0.45013 -0.36237,-0.8125 -0.8125,-0.8125 z`;
+  const { rectProps, rectRef, svgViewBox, pathX, pathY } = useCustomWidget({
+    currentValue: value,
+    maxValue: domainMax,
+    minValue: baseValue,
+    panelId
+  });
+  const boxValues = {
+    height: noNaN(Math.max(width, height) - Math.max(width, height) * 0.31),
+    width: noNaN(Math.max(width, height)),
+    x: pathX,
+    y: pathY
+  };
+  const tickArray = valueRanges.map((val, i) => {
+    return {
+      height: boxValues.height * (valueToTickPercent(domainMax, baseValue, val) / 100),
+      color: !valueRanges[i + 1] ? "black" : colorGetter(valueRanges, colorRanges, val),
+      value: val
+    };
+  });
+  return /* @__PURE__ */ jsxs(Box, { sx: { position: "relative" }, children: [
+    /* @__PURE__ */ jsxs(
+      "svg",
+      {
+        height: Math.max(width, height),
+        width: Math.max(width, height),
+        id: `svg_${panelId}`,
+        viewBox: svgViewBox,
+        style: { position: "relative", top: "10px" },
+        children: [
+          /* @__PURE__ */ jsx("clipPath", { id: "clipPath", children: /* @__PURE__ */ jsx("path", { d: pathDValue }) }),
+          /* @__PURE__ */ jsx("mask", { id: "myMask", children: /* @__PURE__ */ jsx("path", { d: pathDValue, id: "maskPath", fill: "white" }) }),
+          /* @__PURE__ */ jsx("path", { d: pathDValue, id: `path_${panelId}`, fill: "white" }),
+          /* @__PURE__ */ jsx(
+            "rect",
+            {
+              fill: getInnerColor(valueRanges, colorRanges, value),
+              id: `rect_${panelId}`,
+              mask: "url(#myMask)",
+              ref: rectRef,
+              ...rectProps
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: pathDValue,
+              id: "path",
+              fill: "none",
+              stroke: "white",
+              strokeWidth: 10,
+              clipPath: "url(#clipPath)",
+              vectorEffect: "non-scaling-stroke"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "path",
+            {
+              clipPath: "url(#clipPath)",
+              d: pathDValue,
+              id: "path",
+              fill: "none",
+              stroke: "black",
+              strokeWidth: 5,
+              vectorEffect: "non-scaling-stroke"
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "svg",
+      {
+        height: Math.max(width, height) + 10,
+        width: Math.max(width, height),
+        style: { position: "absolute", left: 0, top: 0 },
+        children: [
+          boxValues.x && /* @__PURE__ */ jsx("g", { children: /* @__PURE__ */ jsx(
+            "text",
+            {
+              x: Math.max(width, height) / 2,
+              y: Math.max(width, height) - Math.max(width, height) / 6 + 10,
+              style: {
+                fontSize: `${noNaN(currentValueFontSize) ?? 50}px`
+              },
+              textAnchor: "middle",
+              alignmentBaseline: "central",
+              vectorEffect: "non-scaling-stroke",
+              children: value
+            }
+          ) }),
+          tickArray.map((tick, i) => {
+            return /* @__PURE__ */ jsxs("g", { children: [
+              /* @__PURE__ */ jsx(
+                "rect",
+                {
+                  x: i === 0 ? Math.max(width, height) / 2 + 30 : Math.max(width, height) / 2 + 20,
+                  y: tick.height + 10,
+                  width: "15px",
+                  height: "3px",
+                  vectorEffect: "non-scaling-stroke",
+                  fill: getColor(valueRanges, colorRanges, tick.value)
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "text",
+                {
+                  x: i === 0 ? Math.max(width, height) - Math.max(width, height) / 3 + 10 : Math.max(width, height) - Math.max(width, height) / 3,
+                  y: tickArray[i + 1] ? tick.height + 16 : tick.height + 1.5,
+                  textAnchor: "middle",
+                  alignmentBaseline: tickArray[i + 1] ? "auto" : "text-before-edge",
+                  children: tick.value
+                }
+              )
+            ] }, i);
+          })
+        ]
+      }
+    )
+  ] });
+};
+
+export { Thermometer };
+//# sourceMappingURL=Thermometer.js.map

package/dist/widgets/thermometer/Thermometer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Thermometer.js","sources":["../../../src/widgets/thermometer/Thermometer.tsx"],"sourcesContent":["import { Box } from '@apia/theme';\nimport { TApiaWidgetProps } from '../types';\nimport {\n  valueToTickPercent,\n  colorGetter,\n  getInnerColor,\n  getColor,\n} from './util';\nimport { noNaN } from '@apia/util';\nimport { useCustomWidget } from '../custom/useCustomWidget';\n// Usar un segundo svg para los textos\nexport const Thermometer = ({\n  colorRanges,\n  maxValue,\n  minValue,\n  currentValue,\n  height,\n  valueRanges,\n  width,\n  panelId,\n  currentValueFontSize,\n}: TApiaWidgetProps) => {\n  const value = currentValue;\n  const baseValue = noNaN(minValue) ?? valueRanges[0];\n  const domainMax = noNaN(maxValue) ?? valueRanges[valueRanges.length - 1];\n  const pathDValue = `m 179.6875,717.73633 c -0.45013,0 -0.8125,0.36237 -0.8125,0.8125 l 0,8.46289 a 2.3125,2.3125 0 0 0 -1.5,2.16211 2.3125,2.3125 0 0 0 2.3125,2.3125 2.3125,2.3125 0 0 0 2.3125,-2.3125 2.3125,2.3125 0 0 0 -1.5,-2.16211 l 0,-8.46289 c 0,-0.45013 -0.36237,-0.8125 -0.8125,-0.8125 z`;\n\n  const { rectProps, rectRef, svgViewBox, pathX, pathY } = useCustomWidget({\n    currentValue: value,\n    maxValue: domainMax,\n    minValue: baseValue,\n    panelId,\n  });\n\n  const boxValues = {\n    height: noNaN(Math.max(width, height) - Math.max(width, height) * 0.31),\n    width: noNaN(Math.max(width, height)),\n    x: pathX,\n    y: pathY,\n  };\n\n  const tickArray = valueRanges.map((val, i) => {\n    return {\n      height:\n        boxValues.height *\n        (valueToTickPercent(domainMax, baseValue, val) / 100),\n      color: !valueRanges[i + 1]\n        ? 'black'\n        : colorGetter(valueRanges, colorRanges, val),\n      value: val,\n    };\n  });\n\n  return (\n    <Box sx={{ position: 'relative' }}>\n      <svg\n        height={Math.max(width, height)}\n        width={Math.max(width, height)}\n        id={`svg_${panelId}`}\n        viewBox={svgViewBox}\n        style={{ position: 'relative', top: '10px' }}\n      >\n        <clipPath id=\"clipPath\">\n          <path d={pathDValue} />\n        </clipPath>\n        <mask id=\"myMask\">\n          <path d={pathDValue} id=\"maskPath\" fill=\"white\" />\n        </mask>\n\n        <path d={pathDValue} id={`path_${panelId}`} fill=\"white\" />\n\n        <rect\n          fill={getInnerColor(valueRanges, colorRanges, value)}\n          id={`rect_${panelId}`}\n          mask=\"url(#myMask)\"\n          ref={rectRef}\n          {...rectProps}\n        />\n\n        <path\n          d={pathDValue}\n          id=\"path\"\n          fill=\"none\"\n          stroke=\"white\"\n          strokeWidth={10}\n          clipPath=\"url(#clipPath)\"\n          vectorEffect={'non-scaling-stroke'}\n        />\n        <path\n          clipPath=\"url(#clipPath)\"\n          d={pathDValue}\n          id=\"path\"\n          fill=\"none\"\n          stroke=\"black\"\n          strokeWidth={5}\n          vectorEffect={'non-scaling-stroke'}\n        />\n      </svg>\n      <svg\n        height={Math.max(width, height) + 10}\n        width={Math.max(width, height)}\n        style={{ position: 'absolute', left: 0, top: 0 }}\n      >\n        {boxValues.x && (\n          <g>\n            <text\n              x={Math.max(width, height) / 2}\n              y={Math.max(width, height) - Math.max(width, height) / 6 + 10}\n              style={{\n                fontSize: `${noNaN(currentValueFontSize) ?? 50}px`,\n              }}\n              textAnchor=\"middle\"\n              alignmentBaseline={'central'}\n              vectorEffect={'non-scaling-stroke'}\n            >\n              {value}\n            </text>\n          </g>\n        )}\n        {tickArray.map((tick, i) => {\n          return (\n            <g key={i}>\n              <rect\n                x={\n                  i === 0\n                    ? Math.max(width, height) / 2 + 30\n                    : Math.max(width, height) / 2 + 20\n                }\n                y={tick.height + 10}\n                width={'15px'}\n                height={'3px'}\n                vectorEffect={'non-scaling-stroke'}\n                fill={getColor(valueRanges, colorRanges, tick.value)}\n              />\n              <text\n                x={\n                  i === 0\n                    ? Math.max(width, height) - Math.max(width, height) / 3 + 10\n                    : Math.max(width, height) - Math.max(width, height) / 3\n                }\n                y={tickArray[i + 1] ? tick.height + 16 : tick.height + 1.5}\n                textAnchor=\"middle\"\n                alignmentBaseline={\n                  tickArray[i + 1] ? 'auto' : 'text-before-edge'\n                }\n              >\n                {tick.value}\n              </text>\n            </g>\n          );\n        })}\n      </svg>\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/widgets/thermometer/util.js

@@ -0,0 +1,31 @@
+const colorGetter = (valueRanges, colorRanges, innerValue) => {
+  let color = "";
+  valueRanges.forEach((value, index) => {
+    if (value >= innerValue && valueRanges[index - 1] <= innerValue) {
+      color = colorRanges[index - 1];
+    }
+  });
+  return color;
+};
+function getColor(valueRanges, colorRanges, value) {
+  const index = valueRanges.findIndex((range) => value <= range);
+  if (index === -1) {
+    return colorRanges[0];
+  }
+  return colorRanges[index];
+}
+function getInnerColor(valueRanges, colorRanges, value) {
+  const index = valueRanges.findIndex((range) => value < range);
+  if (index === -1) {
+    return colorRanges[0];
+  }
+  return colorRanges[index - 1] ?? colorRanges[index];
+}
+const valueToTickPercent = (domainMax, baseValue, value) => {
+  const range = domainMax - (baseValue ?? 0);
+  const percentage = 100 - (value - (baseValue ?? 0)) / range * 100;
+  return Math.round(percentage);
+};
+
+export { colorGetter, getColor, getInnerColor, valueToTickPercent };
+//# sourceMappingURL=util.js.map

package/dist/widgets/thermometer/util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.js","sources":["../../../src/widgets/thermometer/util.ts"],"sourcesContent":["const colorGetter = (\n  valueRanges: number[],\n  colorRanges: string[],\n  innerValue: number,\n) => {\n  let color = '';\n  valueRanges.forEach((value, index) => {\n    if (value >= innerValue && valueRanges[index - 1] <= innerValue) {\n      color = colorRanges[index - 1];\n    }\n  });\n  return color;\n};\n\nfunction getColor(valueRanges: number[], colorRanges: string[], value: number) {\n  const index = valueRanges.findIndex((range) => value <= range);\n\n  if (index === -1) {\n    return colorRanges[0];\n  }\n\n  return colorRanges[index];\n}\n\nfunction getInnerColor(\n  valueRanges: number[],\n  colorRanges: string[],\n  value: number,\n) {\n  const index = valueRanges.findIndex((range) => value < range);\n\n  if (index === -1) {\n    return colorRanges[0];\n  }\n\n  return colorRanges[index - 1] ?? colorRanges[index];\n}\n\nconst valueToTickPercent = (\n  domainMax: number,\n  baseValue: number,\n  value: number,\n) => {\n  const range = domainMax - (baseValue ?? 0);\n  const percentage = 100 - ((value - (baseValue ?? 0)) / range) * 100;\n\n  return Math.round(percentage);\n};\n\nconst valueToPercent = (\n  domainMax: number,\n  baseValue: number,\n  value: number,\n) => {\n  const range = domainMax - (baseValue ?? 0);\n  const percentage = 100 - ((value - (baseValue ?? 0)) / range) * 100;\n  const test = (percentage * 69) / 100;\n\n  return Math.round(test);\n};\n\nexport {\n  colorGetter,\n  getColor,\n  getInnerColor,\n  valueToPercent,\n  valueToTickPercent,\n};\n"],"names":[],"mappings":"AAAA,MAAM,WAAc,GAAA,CAClB,WACA,EAAA,WAAA,EACA,UACG,KAAA;AACH,EAAA,IAAI,KAAQ,GAAA,EAAA,CAAA;AACZ,EAAY,WAAA,CAAA,OAAA,CAAQ,CAAC,KAAA,EAAO,KAAU,KAAA;AACpC,IAAA,IAAI,SAAS,UAAc,IAAA,WAAA,CAAY,KAAQ,GAAA,CAAC,KAAK,UAAY,EAAA;AAC/D,MAAQ,KAAA,GAAA,WAAA,CAAY,QAAQ,CAAC,CAAA,CAAA;AAAA,KAC/B;AAAA,GACD,CAAA,CAAA;AACD,EAAO,OAAA,KAAA,CAAA;AACT,EAAA;AAEA,SAAS,QAAA,CAAS,WAAuB,EAAA,WAAA,EAAuB,KAAe,EAAA;AAC7E,EAAA,MAAM,QAAQ,WAAY,CAAA,SAAA,CAAU,CAAC,KAAA,KAAU,SAAS,KAAK,CAAA,CAAA;AAE7D,EAAA,IAAI,UAAU,CAAI,CAAA,EAAA;AAChB,IAAA,OAAO,YAAY,CAAC,CAAA,CAAA;AAAA,GACtB;AAEA,EAAA,OAAO,YAAY,KAAK,CAAA,CAAA;AAC1B,CAAA;AAEA,SAAS,aAAA,CACP,WACA,EAAA,WAAA,EACA,KACA,EAAA;AACA,EAAA,MAAM,QAAQ,WAAY,CAAA,SAAA,CAAU,CAAC,KAAA,KAAU,QAAQ,KAAK,CAAA,CAAA;AAE5D,EAAA,IAAI,UAAU,CAAI,CAAA,EAAA;AAChB,IAAA,OAAO,YAAY,CAAC,CAAA,CAAA;AAAA,GACtB;AAEA,EAAA,OAAO,WAAY,CAAA,KAAA,GAAQ,CAAC,CAAA,IAAK,YAAY,KAAK,CAAA,CAAA;AACpD,CAAA;AAEA,MAAM,kBAAqB,GAAA,CACzB,SACA,EAAA,SAAA,EACA,KACG,KAAA;AACH,EAAM,MAAA,KAAA,GAAQ,aAAa,SAAa,IAAA,CAAA,CAAA,CAAA;AACxC,EAAA,MAAM,UAAa,GAAA,GAAA,GAAA,CAAQ,KAAS,IAAA,SAAA,IAAa,MAAM,KAAS,GAAA,GAAA,CAAA;AAEhE,EAAO,OAAA,IAAA,CAAK,MAAM,UAAU,CAAA,CAAA;AAC9B;;;;"}

package/dist/widgets/types.d.ts

@@ -0,0 +1,41 @@
+type TWidgetZone = {
+    minimum: number;
+    maximum: number;
+    transparency: number;
+    color: string;
+};
+type TWidgetData = {
+    border: boolean;
+    backgroundColor: string;
+    currentValue: number;
+    forceProp?: Record<string, unknown>;
+    height: number;
+    maxValue: number;
+    minValue: number;
+    noValueColor: string;
+    pointerColor: string;
+    ringAnchor: number;
+    scaleFontSize: string | number;
+    valueColor: string;
+    valueDecimals: number;
+    valueFontSize: string | number;
+    valueType: string | number;
+    viewBtnDshAssociated: boolean;
+    viewBtnHistory: boolean;
+    viewBtnInfo: boolean;
+    viewBtnComments: boolean;
+    viewBtnUpdate: boolean;
+    viewBtnOpenCbe: boolean;
+    viewBtnOpenQry: boolean;
+    viewBtnOpenOtherQry: boolean;
+    viewBtnOpenOtherQbe: boolean;
+    viewWidName: boolean;
+    widKpiType: string | number;
+    width: number;
+    zones: {
+        Zone: TWidgetZone | TWidgetZone[];
+    };
+};
+
+export type { TWidgetData, TWidgetZone };
+//# sourceMappingURL=types.d.ts.map

package/dist/widgets/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/package.json

@@ -1,51 +1,23 @@
 {
-  "author": "felipearzuaga <felipearax.2012@gmail.com>",
-  "homepage": "",
-  "license": "MIT",
   "name": "@apia/charts",
+  "version": "2.0.0",
   "sideEffects": false,
-  "main": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "version": "1.0.2",
+  "author": "Felipe Arzuaga <felipearax.2012@gmail.com>",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "type": "module",
+  "typings": "dist/index.d.ts",
   "scripts": {
-    "build": "rollup -c rollup.config.esb.mjs",
-    "buildDev": "rollup -c rollup.config.esb.mjs --dev",
-    "watch": "rollup -c rollup.config.esb.mjs --dev --watch"
-  },
-  "devDependencies": {
-    "@rollup/plugin-commonjs": "^24.0.1",
-    "@rollup/plugin-json": "^6.0.0",
-    "@rollup/plugin-node-resolve": "^15.0.1",
-    "@rollup/plugin-terser": "^0.4.0",
-    "@rollup/plugin-typescript": "^11.0.0",
-    "esbuild": "^0.17.14",
-    "rollup": "^3.20.2",
-    "rollup-plugin-bundle-analyzer": "^1.6.6",
-    "rollup-plugin-dts": "^5.3.0",
-    "rollup-plugin-esbuild": "^5.0.0",
-    "typescript": "^4.9.5"
-  },
-  "peerDependencies": {
-    "@emotion/react": "^11.10.6",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
-  },
-  "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org/"
-  },
-  "repository": {
-    "type": "git",
-    "url": "http://corp-gitlab-01.domst.st.net/products/apia/ApiaNPMPackages.git",
-    "directory": "packages/charts"
+    "libDev": "rollup --config ../../config/rollup.common.mjs --environment MODE:development,ENTRY:index.ts",
+    "libBuild": "rollup --config ../../config/rollup.common.mjs --environment MODE:production,ENTRY:index.ts",
+    "libWatch": "rollup --watch --config ../../config/rollup.common.mjs --environment MODE:development,ENTRY:index.ts,WATCH:true"
   },
   "dependencies": {
-    "@apia/components": "^1.0.2",
-    "@apia/icons": "^1.0.1",
-    "@apia/theme": "^1.0.1",
-    "@apia/util": "^1.0.1",
+    "@apia/components": "^2.0.0",
+    "@apia/icons": "^2.0.0",
+    "@apia/theme": "^2.0.0",
+    "@apia/util": "^2.0.0",
     "@types/d3-array": "^3.0.5",
-    "@types/lodash": "^4.14.194",
     "@visx/axis": "^3.1.0",
     "@visx/curve": "^3.0.0",
     "@visx/event": "^3.0.1",
@@ -58,10 +30,25 @@
     "@visx/tooltip": "^3.1.2",
     "@visx/visx": "^3.1.2",
     "d3-array": "^3.2.4",
-    "lodash": "^4.17.21",
     "react-spring": "^9.7.1",
     "tinycolor2": "^1.6.0",
     "use-gauge": "^0.6.0"
   },
-  "gitHead": "757f5402039ec39300ab9452c009c088ad416dec"
+  "devDependencies": {
+    "@types/react": "^18.2.43",
+    "@types/react-dom": "^18.2.17",
+    "@typescript-eslint/eslint-plugin": "^6.14.0",
+    "axios": "^1.3.5",
+    "typescript": "5.4.2"
+  },
+  "peerDependencies": {
+    "lodash-es": "^4.17.21",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "gitHead": "755c990cc9875e99922cc0f7194d9f0a479bdc71"
 }

package/LICENSE.md

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) [year] [fullname]
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/README.md

@@ -1 +0,0 @@
-# Charts

package/cleanDist.json

@@ -1,3 +0,0 @@
-{
-  "cleanDist": 0.7852852085820403
-}