@selfdecode/sd-component-library 4.0.83 → 4.0.85

package/lib/sd-component-library99.js

@@ -1,86 +1,51 @@
-import { j as r } from "./sd-component-library190.js";
-import { useDependantState as j } from "./sd-component-library3.js";
-import { SquareButton as g } from "./sd-component-library251.js";
-import { ReactComponent as P } from "./sd-component-library252.js";
-import { CurrentPage as h } from "./sd-component-library253.js";
-import { ReactComponent as S } from "./sd-component-library254.js";
-import { GridCenter as R } from "./sd-component-library42.js";
-function x(m, t, o, n) {
-  t == null || t(o, n), m(o);
-}
-const D = (m) => {
-  const {
-    currentPage: t,
-    lastPage: o,
-    borderStyle: n,
-    borderWidth: s,
-    borderColor: i,
-    fill: a,
-    onChange: p,
-    m: u,
-    mt: C,
-    mr: f,
-    mb: l,
-    ml: c
-  } = m, [e, d] = j(t);
-  return /* @__PURE__ */ r.jsxs(
-    R,
-    {
-      sx: {
-        gridGap: 3,
-        gridTemplateColumns: "repeat(3, max-content)",
-        m: u,
-        mt: C,
-        mr: f,
-        mb: l,
-        ml: c
+import { j as n } from "./sd-component-library195.js";
+import { areSegmentsValid as h } from "./sd-component-library246.js";
+import { CompactDonutGaugeSegment as x } from "./sd-component-library247.js";
+import { CompactDonutGaugeValueIndicator as f } from "./sd-component-library248.js";
+const C = ({
+  segments: e,
+  size: r = 70,
+  value: t,
+  segmentWidth: m = 10,
+  outlineWidth: c = 2,
+  cursor: p = "default",
+  children: a
+}) => {
+  if (!h(e))
+    return null;
+  if (t > 1 || t < 0)
+    return console.error(
+      "Value should be not less than 0 and not higher than 1",
+      `Received: ${t}`
+    ), null;
+  const i = e.find(
+    ({ start: o, end: u }) => t >= o && t <= u
+  ), s = {
+    width: `${r}px`,
+    height: `${r}px`
+  };
+  return /* @__PURE__ */ n.jsxs("svg", { ...s, style: { cursor: p }, children: [
+    e.map((o) => /* @__PURE__ */ n.jsx(
+      x,
+      {
+        segment: o,
+        isMatching: o.start === i.start,
+        size: r,
+        segmentWidth: m,
+        outlineWidth: c
       },
-      "data-testid": "page-selector",
-      children: [
-        /* @__PURE__ */ r.jsx(
-          g,
-          {
-            disabled: e <= 1,
-            onClick: () => {
-              x(
-                d,
-                p,
-                e - 1,
-                e
-              );
-            },
-            borderStyle: n,
-            borderWidth: s,
-            borderColor: i,
-            fill: a,
-            children: /* @__PURE__ */ r.jsx(P, { style: { marginRight: "3px" } })
-          }
-        ),
-        /* @__PURE__ */ r.jsx(h, { currentPage: e }),
-        /* @__PURE__ */ r.jsx(
-          g,
-          {
-            disabled: e >= o,
-            onClick: () => {
-              x(
-                d,
-                p,
-                e + 1,
-                e
-              );
-            },
-            borderStyle: n,
-            borderWidth: s,
-            borderColor: i,
-            fill: a,
-            children: /* @__PURE__ */ r.jsx(S, { style: { marginLeft: "3px" } })
-          }
-        )
-      ]
-    }
-  );
+      o.color
+    )),
+    a ? /* @__PURE__ */ n.jsx("foreignObject", { x: 0, y: 0, ...s, children: a }) : /* @__PURE__ */ n.jsx(
+      f,
+      {
+        size: r,
+        segment: i
+      }
+    )
+  ] });
 };
 export {
-  D as PageSelector
+  C as CompactDonutGauge
 };
 //# sourceMappingURL=sd-component-library99.js.map

package/lib/sd-component-library99.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library99.js","sources":["../src/components/page-selectors/page-selector/page-selector.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { useDependantState } from \"../../../core/custom-hooks\";\nimport { SquareButton } from \"../../buttons/partials/square-button\";\nimport { GridCenter } from \"../../containers\";\nimport { Next, Previous } from \"./assets\";\nimport { PageSelectorProps } from \"./interfaces\";\nimport { CurrentPage } from \"./partials/current-page\";\n\n/**\n * Create an onChange function using the given setValue and callback.\n *\n * @param setValue The function used to set the component's value\n * @param callback The callback to run when the value changes.\n * @param newValue The new value after clicking next/previous.\n * @param setValue The old value before clicking next/previous.\n *\n */\n\nfunction changeWrapper(\n  setValue: React.Dispatch<React.SetStateAction<number>>,\n  callback: PageSelectorProps[\"onChange\"],\n  newValue: number,\n  oldValue: number\n) {\n  callback?.(newValue, oldValue);\n  setValue(newValue);\n}\n\n/**\n * Base page selector component. Other page selector components should be built from this.\n */\nexport const PageSelector: React.FunctionComponent<PageSelectorProps> = (\n  props: PageSelectorProps\n): React.ReactElement<PageSelectorProps> => {\n  const {\n    currentPage,\n    lastPage,\n    borderStyle,\n    borderWidth,\n    borderColor,\n    fill,\n    onChange,\n    m,\n    mt,\n    mr,\n    mb,\n    ml,\n  } = props;\n\n  const [mCurrentPage, setMCurrentPage] =\n    useDependantState<number>(currentPage);\n\n  return (\n    <GridCenter\n      sx={{\n        gridGap: 3,\n        gridTemplateColumns: \"repeat(3, max-content)\",\n        m,\n        mt,\n        mr,\n        mb,\n        ml,\n      }}\n      data-testid=\"page-selector\"\n    >\n      <SquareButton\n        disabled={mCurrentPage <= 1}\n        onClick={() => {\n          changeWrapper(\n            setMCurrentPage,\n            onChange,\n            mCurrentPage - 1,\n            mCurrentPage\n          );\n        }}\n        borderStyle={borderStyle}\n        borderWidth={borderWidth}\n        borderColor={borderColor}\n        fill={fill}\n      >\n        <Previous style={{ marginRight: \"3px\" }} />\n      </SquareButton>\n\n      <CurrentPage currentPage={mCurrentPage} />\n\n      <SquareButton\n        disabled={mCurrentPage >= lastPage}\n        onClick={() => {\n          changeWrapper(\n            setMCurrentPage,\n            onChange,\n            mCurrentPage + 1,\n            mCurrentPage\n          );\n        }}\n        borderStyle={borderStyle}\n        borderWidth={borderWidth}\n        borderColor={borderColor}\n        fill={fill}\n      >\n        <Next style={{ marginLeft: \"3px\" }} />\n      </SquareButton>\n    </GridCenter>\n  );\n};\n"],"names":["changeWrapper","setValue","callback","newValue","oldValue","PageSelector","props","currentPage","lastPage","borderStyle","borderWidth","borderColor","fill","onChange","m","mt","mr","mb","ml","mCurrentPage","setMCurrentPage","useDependantState","jsxs","GridCenter","jsx","SquareButton","Previous","CurrentPage","Next"],"mappings":";;;;;;;AAmBA,SAASA,EACPC,GACAC,GACAC,GACAC,GACA;AACA,EAAAF,KAAA,QAAAA,EAAWC,GAAUC,IACrBH,EAASE,CAAQ;AACnB;AAKa,MAAAE,IAA2D,CACtEC,MAC0C;AACpC,QAAA;AAAA,IACJ,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAAC;AAAA,IACA,IAAAC;AAAA,IACA,IAAAC;AAAA,IACA,IAAAC;AAAA,IACA,IAAAC;AAAA,EACE,IAAAZ,GAEE,CAACa,GAAcC,CAAe,IAClCC,EAA0Bd,CAAW;AAGrC,SAAAe,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACF,SAAS;AAAA,QACT,qBAAqB;AAAA,QACrB,GAAAT;AAAA,QACA,IAAAC;AAAA,QACA,IAAAC;AAAA,QACA,IAAAC;AAAA,QACA,IAAAC;AAAA,MACF;AAAA,MACA,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAAM,gBAAAA,EAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,UAAUN,KAAgB;AAAA,YAC1B,SAAS,MAAM;AACb,cAAAnB;AAAA,gBACEoB;AAAA,gBACAP;AAAA,gBACAM,IAAe;AAAA,gBACfA;AAAA,cAAA;AAAA,YAEJ;AAAA,YACA,aAAAV;AAAA,YACA,aAAAC;AAAA,YACA,aAAAC;AAAA,YACA,MAAAC;AAAA,YAEA,gCAACc,GAAS,EAAA,OAAO,EAAE,aAAa,SAAS;AAAA,UAAA;AAAA,QAC3C;AAAA,QAEAF,gBAAAA,EAAAA,IAACG,GAAY,EAAA,aAAaR,EAAc,CAAA;AAAA,QAExCK,gBAAAA,EAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,UAAUN,KAAgBX;AAAA,YAC1B,SAAS,MAAM;AACb,cAAAR;AAAA,gBACEoB;AAAA,gBACAP;AAAA,gBACAM,IAAe;AAAA,gBACfA;AAAA,cAAA;AAAA,YAEJ;AAAA,YACA,aAAAV;AAAA,YACA,aAAAC;AAAA,YACA,aAAAC;AAAA,YACA,MAAAC;AAAA,YAEA,gCAACgB,GAAK,EAAA,OAAO,EAAE,YAAY,SAAS;AAAA,UAAA;AAAA,QACtC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"sd-component-library99.js","sources":["../src/components/meters/compact-donut-gauge/compact-donut-gauge.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\";\n\nimport { areSegmentsValid } from \"../donut-diagram/utils\";\nimport { CompactDonutGaugeProps as Props } from \"./interfaces\";\nimport {\n  CompactDonutGaugeSegment,\n  CompactDonutGaugeValueIndicator,\n} from \"./partials\";\n\nexport const CompactDonutGauge: React.FC<PropsWithChildren<Props>> = ({\n  segments,\n  size = 70,\n  value,\n  segmentWidth = 10,\n  outlineWidth = 2,\n  cursor = \"default\",\n  children,\n}) => {\n  if (!areSegmentsValid(segments)) return null;\n\n  if (value > 1 || value < 0) {\n    console.error(\n      \"Value should be not less than 0 and not higher than 1\",\n      `Received: ${value}`\n    );\n    return null;\n  }\n\n  const matchingSegment = segments.find(\n    ({ start, end }) => value >= start && value <= end\n  )!;\n\n  const sizes = {\n    width: `${size}px`,\n    height: `${size}px`,\n  };\n\n  return (\n    <svg {...sizes} style={{ cursor }}>\n      {segments.map((segment) => (\n        <CompactDonutGaugeSegment\n          segment={segment}\n          isMatching={segment.start === matchingSegment.start}\n          size={size}\n          segmentWidth={segmentWidth}\n          outlineWidth={outlineWidth}\n          key={segment.color}\n        />\n      ))}\n\n      {children ? (\n        <foreignObject x={0} y={0} {...sizes}>\n          {children}\n        </foreignObject>\n      ) : (\n        <CompactDonutGaugeValueIndicator\n          size={size}\n          segment={matchingSegment}\n        />\n      )}\n    </svg>\n  );\n};\n"],"names":["CompactDonutGauge","segments","size","value","segmentWidth","outlineWidth","cursor","children","areSegmentsValid","matchingSegment","start","end","sizes","segment","jsx","CompactDonutGaugeSegment","CompactDonutGaugeValueIndicator"],"mappings":";;;;AASO,MAAMA,IAAwD,CAAC;AAAA,EACpE,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,cAAAC,IAAe;AAAA,EACf,QAAAC,IAAS;AAAA,EACT,UAAAC;AACF,MAAM;AACA,MAAA,CAACC,EAAiBP,CAAQ;AAAU,WAAA;AAEpC,MAAAE,IAAQ,KAAKA,IAAQ;AACf,mBAAA;AAAA,MACN;AAAA,MACA,aAAaA,CAAK;AAAA,IAAA,GAEb;AAGT,QAAMM,IAAkBR,EAAS;AAAA,IAC/B,CAAC,EAAE,OAAAS,GAAO,KAAAC,QAAUR,KAASO,KAASP,KAASQ;AAAA,EAAA,GAG3CC,IAAQ;AAAA,IACZ,OAAO,GAAGV,CAAI;AAAA,IACd,QAAQ,GAAGA,CAAI;AAAA,EAAA;AAGjB,gCACG,OAAK,EAAA,GAAGU,GAAO,OAAO,EAAE,QAAAN,EACtB,GAAA,UAAA;AAAA,IAASL,EAAA,IAAI,CAACY,MACbC,gBAAAA,EAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAAAF;AAAA,QACA,YAAYA,EAAQ,UAAUJ,EAAgB;AAAA,QAC9C,MAAAP;AAAA,QACA,cAAAE;AAAA,QACA,cAAAC;AAAA,MAAA;AAAA,MACKQ,EAAQ;AAAA,IAAA,CAEhB;AAAA,IAEAN,IACEO,gBAAAA,EAAA,IAAA,iBAAA,EAAc,GAAG,GAAG,GAAG,GAAI,GAAGF,GAC5B,UAAAL,EAAA,CACH,IAEAO,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,MAAAd;AAAA,QACA,SAASO;AAAA,MAAA;AAAA,IACX;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@selfdecode/sd-component-library",
-  "version": "4.0.83",
+  "version": "4.0.85",
   "private": false,
   "license": "MIT",
   "files": [
@@ -21,7 +21,7 @@
     "react-refresh": "^0.11.0",
     "react-transition-group": "^4.4.1",
     "resolve": "^1.20.0",
-    "resolve-url-loader": "^4.0.0",
+    "resolve-url-loader": "5.0.0",
     "semver": "^7.3.5"
   },
   "husky": {
@@ -97,7 +97,7 @@
     "file-loader": "^6.2.0",
     "husky": "^4.2.5",
     "lint-staged": "^10.2.11",
-    "postcss": "^8.4.4",
+    "postcss": "8.4.31",
     "postcss-flexbugs-fixes": "^5.0.2",
     "postcss-normalize": "^10.0.1",
     "postcss-preset-env": "^7.0.1",