@selfdecode/sd-component-library 4.0.145 → 4.0.146
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/sd-component-library100.js +2 -2
- package/lib/sd-component-library101.js +3 -3
- package/lib/sd-component-library102.js +2 -2
- package/lib/sd-component-library104.js +4 -4
- package/lib/sd-component-library106.js +4 -4
- package/lib/sd-component-library111.js +1 -1
- package/lib/sd-component-library117.js +1 -1
- package/lib/sd-component-library118.js +1 -1
- package/lib/sd-component-library120.js +1 -1
- package/lib/sd-component-library121.js +1 -1
- package/lib/sd-component-library126.js +1 -1
- package/lib/sd-component-library127.js +1 -1
- package/lib/sd-component-library133.js +3 -3
- package/lib/sd-component-library134.js +1 -1
- package/lib/sd-component-library136.js +2 -2
- package/lib/sd-component-library16.js +1 -1
- package/lib/sd-component-library168.js +1 -1
- package/lib/sd-component-library171.js +1 -1
- package/lib/sd-component-library172.js +4 -4
- package/lib/sd-component-library197.js +3 -3
- package/lib/sd-component-library200.js +60 -2
- package/lib/sd-component-library200.js.map +1 -1
- package/lib/sd-component-library201.js +2 -30
- package/lib/sd-component-library201.js.map +1 -1
- package/lib/sd-component-library202.js +21 -590
- package/lib/sd-component-library202.js.map +1 -1
- package/lib/sd-component-library203.js +595 -56
- package/lib/sd-component-library203.js.map +1 -1
- package/lib/sd-component-library205.js +24 -55
- package/lib/sd-component-library205.js.map +1 -1
- package/lib/sd-component-library206.js +55 -24
- package/lib/sd-component-library206.js.map +1 -1
- package/lib/sd-component-library208.js +19 -62
- package/lib/sd-component-library208.js.map +1 -1
- package/lib/sd-component-library209.js +3 -23
- package/lib/sd-component-library209.js.map +1 -1
- package/lib/sd-component-library210.js +3 -40
- package/lib/sd-component-library210.js.map +1 -1
- package/lib/sd-component-library211.js +62 -19
- package/lib/sd-component-library211.js.map +1 -1
- package/lib/sd-component-library212.js +23 -3
- package/lib/sd-component-library212.js.map +1 -1
- package/lib/sd-component-library213.js +40 -3
- package/lib/sd-component-library213.js.map +1 -1
- package/lib/sd-component-library221.js +64 -45
- package/lib/sd-component-library221.js.map +1 -1
- package/lib/sd-component-library222.js +3 -65
- package/lib/sd-component-library222.js.map +1 -1
- package/lib/sd-component-library223.js +46 -3
- package/lib/sd-component-library223.js.map +1 -1
- package/lib/sd-component-library233.js +129 -64
- package/lib/sd-component-library233.js.map +1 -1
- package/lib/sd-component-library235.js +40 -36
- package/lib/sd-component-library235.js.map +1 -1
- package/lib/sd-component-library236.js +7 -12
- package/lib/sd-component-library236.js.map +1 -1
- package/lib/sd-component-library237.js +64 -21
- package/lib/sd-component-library237.js.map +1 -1
- package/lib/sd-component-library238.js +41 -107
- package/lib/sd-component-library238.js.map +1 -1
- package/lib/sd-component-library239.js +12 -46
- package/lib/sd-component-library239.js.map +1 -1
- package/lib/sd-component-library24.js +1 -1
- package/lib/sd-component-library240.js +21 -24
- package/lib/sd-component-library240.js.map +1 -1
- package/lib/sd-component-library241.js +103 -47
- package/lib/sd-component-library241.js.map +1 -1
- package/lib/sd-component-library242.js +43 -17
- package/lib/sd-component-library242.js.map +1 -1
- package/lib/sd-component-library243.js +24 -20
- package/lib/sd-component-library243.js.map +1 -1
- package/lib/sd-component-library244.js +52 -47
- package/lib/sd-component-library244.js.map +1 -1
- package/lib/sd-component-library245.js +46 -39
- package/lib/sd-component-library245.js.map +1 -1
- package/lib/sd-component-library246.js +74 -26
- package/lib/sd-component-library246.js.map +1 -1
- package/lib/sd-component-library247.js +21 -2
- package/lib/sd-component-library247.js.map +1 -1
- package/lib/sd-component-library248.js +20 -75
- package/lib/sd-component-library248.js.map +1 -1
- package/lib/sd-component-library249.js +2 -29
- package/lib/sd-component-library249.js.map +1 -1
- package/lib/sd-component-library250.js +41 -3
- package/lib/sd-component-library250.js.map +1 -1
- package/lib/sd-component-library251.js +26 -23
- package/lib/sd-component-library251.js.map +1 -1
- package/lib/sd-component-library252.js +325 -3
- package/lib/sd-component-library252.js.map +1 -1
- package/lib/sd-component-library253.js +5 -325
- package/lib/sd-component-library253.js.map +1 -1
- package/lib/sd-component-library254.js +29 -5
- package/lib/sd-component-library254.js.map +1 -1
- package/lib/sd-component-library255.js +3 -2
- package/lib/sd-component-library255.js.map +1 -1
- package/lib/sd-component-library256.js +24 -2
- package/lib/sd-component-library256.js.map +1 -1
- package/lib/sd-component-library257.js +3 -129
- package/lib/sd-component-library257.js.map +1 -1
- package/lib/sd-component-library258.js +21 -43
- package/lib/sd-component-library258.js.map +1 -1
- package/lib/sd-component-library259.js +22 -8
- package/lib/sd-component-library259.js.map +1 -1
- package/lib/sd-component-library260.js +30 -25
- package/lib/sd-component-library260.js.map +1 -1
- package/lib/sd-component-library261.js +50 -21
- package/lib/sd-component-library261.js.map +1 -1
- package/lib/sd-component-library262.js +134 -30
- package/lib/sd-component-library262.js.map +1 -1
- package/lib/sd-component-library263.js +59 -119
- package/lib/sd-component-library263.js.map +1 -1
- package/lib/sd-component-library264.js +63 -38
- package/lib/sd-component-library264.js.map +1 -1
- package/lib/sd-component-library265.js +30 -74
- package/lib/sd-component-library265.js.map +1 -1
- package/lib/sd-component-library266.js +15 -70
- package/lib/sd-component-library266.js.map +1 -1
- package/lib/sd-component-library267.js +120 -25
- package/lib/sd-component-library267.js.map +1 -1
- package/lib/sd-component-library268.js +117 -16
- package/lib/sd-component-library268.js.map +1 -1
- package/lib/sd-component-library269.js +10 -125
- package/lib/sd-component-library269.js.map +1 -1
- package/lib/sd-component-library270.js +39 -111
- package/lib/sd-component-library270.js.map +1 -1
- package/lib/sd-component-library271.js +9 -10
- package/lib/sd-component-library271.js.map +1 -1
- package/lib/sd-component-library272.js +49 -48
- package/lib/sd-component-library272.js.map +1 -1
- package/lib/sd-component-library273.js +89 -8
- package/lib/sd-component-library273.js.map +1 -1
- package/lib/sd-component-library274.js +89 -48
- package/lib/sd-component-library274.js.map +1 -1
- package/lib/sd-component-library275.js +2 -90
- package/lib/sd-component-library275.js.map +1 -1
- package/lib/sd-component-library276.js +2 -92
- package/lib/sd-component-library276.js.map +1 -1
- package/lib/sd-component-library297.js +1 -1
- package/lib/sd-component-library298.js +24 -4
- package/lib/sd-component-library298.js.map +1 -1
- package/lib/sd-component-library299.js +33 -23
- package/lib/sd-component-library299.js.map +1 -1
- package/lib/sd-component-library300.js +9 -4
- package/lib/sd-component-library300.js.map +1 -1
- package/lib/sd-component-library301.js +5 -35
- package/lib/sd-component-library301.js.map +1 -1
- package/lib/sd-component-library302.js +3 -8
- package/lib/sd-component-library302.js.map +1 -1
- package/lib/sd-component-library303.js +19 -5
- package/lib/sd-component-library303.js.map +1 -1
- package/lib/sd-component-library304.js +3 -4
- package/lib/sd-component-library304.js.map +1 -1
- package/lib/sd-component-library305.js +5 -19
- package/lib/sd-component-library305.js.map +1 -1
- package/lib/sd-component-library306.js +4 -3
- package/lib/sd-component-library306.js.map +1 -1
- package/lib/sd-component-library51.js +3 -3
- package/lib/sd-component-library52.js +2 -2
- package/lib/sd-component-library53.js +2 -2
- package/lib/sd-component-library60.js +1 -1
- package/lib/sd-component-library75.js +2 -2
- package/lib/sd-component-library76.js +1 -1
- package/lib/sd-component-library77.js +1 -1
- package/lib/sd-component-library81.js +1 -1
- package/lib/sd-component-library81.js.map +1 -1
- package/lib/sd-component-library89.js +3 -3
- package/lib/sd-component-library92.js +3 -3
- package/lib/sd-component-library94.js +5 -5
- package/lib/sd-component-library98.js +2 -2
- package/lib/sd-component-library99.js +3 -3
- package/package.json +1 -1
|
@@ -1,24 +1,50 @@
|
|
|
1
|
-
import { j as
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
n,
|
|
1
|
+
import { j as N } from "./sd-component-library197.js";
|
|
2
|
+
import { getInnerX as k, getInnerY as B, degToRad as c, getCoordinateForArc as i } from "./sd-component-library91.js";
|
|
3
|
+
import { getFractionColor as b } from "./sd-component-library240.js";
|
|
4
|
+
import { BaseNeedle as q } from "./sd-component-library299.js";
|
|
5
|
+
const O = (R) => {
|
|
6
|
+
const {
|
|
7
|
+
ranges: r,
|
|
8
|
+
distanceFromRange: d,
|
|
9
|
+
innerCircleRadius: X,
|
|
10
|
+
innerCircleStrokeWidth: Y,
|
|
11
|
+
needleWidth: n,
|
|
12
|
+
arc: a,
|
|
13
|
+
value: l,
|
|
14
|
+
gaugeWidth: g,
|
|
15
|
+
diameter: v,
|
|
16
|
+
needleColor: S
|
|
17
|
+
} = R, s = v / 2, e = r.length, t = Math.floor(l * e), y = r[t][0], A = r[t][1], u = (360 - a) / 2, m = u + a * t / e, E = u + a * (t + 1) / e, p = t / e, M = (t + 1) / e, { x: h, y: x } = i(
|
|
18
|
+
s,
|
|
19
|
+
m
|
|
20
|
+
), { x: j, y: F } = i(
|
|
21
|
+
s,
|
|
22
|
+
E
|
|
23
|
+
), o = m + (l - p) / (M - p) * a / r.length, { x: C, y: f } = i(s, o), G = k(
|
|
24
|
+
C,
|
|
25
|
+
c(o),
|
|
26
|
+
d + g + n / 2
|
|
27
|
+
), I = B(
|
|
28
|
+
f,
|
|
29
|
+
c(o),
|
|
30
|
+
d + g + n / 2
|
|
31
|
+
), T = n / 2 * Math.cos(c(o)), W = n / 2 * Math.sin(c(o)), z = t + 1 === e / 2 + 0.5 ? (C - h) / (j - h) : (f - x) / (F - x), H = b(z, y, A);
|
|
32
|
+
return /* @__PURE__ */ N.jsx(
|
|
33
|
+
q,
|
|
12
34
|
{
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
35
|
+
radius: s,
|
|
36
|
+
innerCircleRadius: X,
|
|
37
|
+
innerCircleStrokeWidth: Y,
|
|
38
|
+
needleWidth: n,
|
|
39
|
+
color: S || H,
|
|
40
|
+
dx: T,
|
|
41
|
+
dy: W,
|
|
42
|
+
tipX: G,
|
|
43
|
+
tipY: I
|
|
18
44
|
}
|
|
19
45
|
);
|
|
20
46
|
};
|
|
21
47
|
export {
|
|
22
|
-
|
|
48
|
+
O as GradientMeterNeedle
|
|
23
49
|
};
|
|
24
50
|
//# sourceMappingURL=sd-component-library242.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-component-library242.js","sources":["../src/components/meters/
|
|
1
|
+
{"version":3,"file":"sd-component-library242.js","sources":["../src/components/meters/gradient-outline-meter/partials/gradient-meter-needle/gradient-meter-needle.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { BaseNeedle } from \"../../../outline-meter/partials/base-needle\";\nimport {\n degToRad,\n getCoordinateForArc,\n getInnerX,\n getInnerY,\n} from \"../../../outline-meter/utils\";\nimport { getFractionColor } from \"../../utils\";\nimport { GradientMeterNeedleProps as Props } from \"./interfaces\";\n\nexport const GradientMeterNeedle: React.FC<Props> = (props) => {\n const {\n ranges,\n distanceFromRange,\n innerCircleRadius,\n innerCircleStrokeWidth,\n needleWidth,\n arc,\n value,\n gaugeWidth,\n diameter,\n needleColor,\n } = props;\n const radius = diameter / 2;\n const totalRanges = ranges.length;\n const valueRangeIndex = Math.floor(value * totalRanges);\n const startColor = ranges[valueRangeIndex][0];\n const endColor = ranges[valueRangeIndex][1];\n\n const arcStart = (360 - arc) / 2; // deg\n\n const rangeArcStart = arcStart + (arc * valueRangeIndex) / totalRanges;\n const rangeArcEnd = arcStart + (arc * (valueRangeIndex + 1)) / totalRanges;\n const start = valueRangeIndex / totalRanges;\n const end = (valueRangeIndex + 1) / totalRanges;\n\n const { x: rangeStartX, y: rangeStartY } = getCoordinateForArc(\n radius,\n rangeArcStart\n );\n const { x: rangeEndX, y: rangeEndY } = getCoordinateForArc(\n radius,\n rangeArcEnd\n );\n\n const valueAlpha =\n rangeArcStart + (((value - start) / (end - start)) * arc) / ranges.length;\n const { x: valueX, y: valueY } = getCoordinateForArc(radius, valueAlpha);\n const needleTipX = getInnerX(\n valueX,\n degToRad(valueAlpha),\n distanceFromRange + gaugeWidth + needleWidth / 2\n );\n const needleTipY = getInnerY(\n valueY,\n degToRad(valueAlpha),\n distanceFromRange + gaugeWidth + needleWidth / 2\n );\n\n const dx = (needleWidth / 2) * Math.cos(degToRad(valueAlpha));\n const dy = (needleWidth / 2) * Math.sin(degToRad(valueAlpha));\n\n const useHorizontalGradient = valueRangeIndex + 1 === totalRanges / 2 + 0.5;\n\n const fraction = useHorizontalGradient\n ? (valueX - rangeStartX) / (rangeEndX - rangeStartX)\n : (valueY - rangeStartY) / (rangeEndY - rangeStartY);\n const color = getFractionColor(fraction, startColor, endColor);\n\n return (\n <BaseNeedle\n radius={radius}\n innerCircleRadius={innerCircleRadius}\n innerCircleStrokeWidth={innerCircleStrokeWidth}\n needleWidth={needleWidth}\n color={needleColor || color}\n dx={dx}\n dy={dy}\n tipX={needleTipX}\n tipY={needleTipY}\n />\n );\n};\n"],"names":["GradientMeterNeedle","props","ranges","distanceFromRange","innerCircleRadius","innerCircleStrokeWidth","needleWidth","arc","value","gaugeWidth","diameter","needleColor","radius","totalRanges","valueRangeIndex","startColor","endColor","arcStart","rangeArcStart","rangeArcEnd","start","end","rangeStartX","rangeStartY","getCoordinateForArc","rangeEndX","rangeEndY","valueAlpha","valueX","valueY","needleTipX","getInnerX","degToRad","needleTipY","getInnerY","dx","dy","fraction","color","getFractionColor","jsx","BaseNeedle"],"mappings":";;;;AAYa,MAAAA,IAAuC,CAACC,MAAU;AACvD,QAAA;AAAA,IACJ,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,KAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,EACE,IAAAV,GACEW,IAASF,IAAW,GACpBG,IAAcX,EAAO,QACrBY,IAAkB,KAAK,MAAMN,IAAQK,CAAW,GAChDE,IAAab,EAAOY,CAAe,EAAE,CAAC,GACtCE,IAAWd,EAAOY,CAAe,EAAE,CAAC,GAEpCG,KAAY,MAAMV,KAAO,GAEzBW,IAAgBD,IAAYV,IAAMO,IAAmBD,GACrDM,IAAcF,IAAYV,KAAOO,IAAkB,KAAMD,GACzDO,IAAQN,IAAkBD,GAC1BQ,KAAOP,IAAkB,KAAKD,GAE9B,EAAE,GAAGS,GAAa,GAAGC,EAAgB,IAAAC;AAAA,IACzCZ;AAAA,IACAM;AAAA,EAAA,GAEI,EAAE,GAAGO,GAAW,GAAGC,EAAc,IAAAF;AAAA,IACrCZ;AAAA,IACAO;AAAA,EAAA,GAGIQ,IACJT,KAAmBV,IAAQY,MAAUC,IAAMD,KAAUb,IAAOL,EAAO,QAC/D,EAAE,GAAG0B,GAAQ,GAAGC,MAAWL,EAAoBZ,GAAQe,CAAU,GACjEG,IAAaC;AAAA,IACjBH;AAAA,IACAI,EAASL,CAAU;AAAA,IACnBxB,IAAoBM,IAAaH,IAAc;AAAA,EAAA,GAE3C2B,IAAaC;AAAA,IACjBL;AAAA,IACAG,EAASL,CAAU;AAAA,IACnBxB,IAAoBM,IAAaH,IAAc;AAAA,EAAA,GAG3C6B,IAAM7B,IAAc,IAAK,KAAK,IAAI0B,EAASL,CAAU,CAAC,GACtDS,IAAM9B,IAAc,IAAK,KAAK,IAAI0B,EAASL,CAAU,CAAC,GAItDU,IAFwBvB,IAAkB,MAAMD,IAAc,IAAI,OAGnEe,IAASN,MAAgBG,IAAYH,MACrCO,IAASN,MAAgBG,IAAYH,IACpCe,IAAQC,EAAiBF,GAAUtB,GAAYC,CAAQ;AAG3D,SAAAwB,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAA7B;AAAA,MACA,mBAAAR;AAAA,MACA,wBAAAC;AAAA,MACA,aAAAC;AAAA,MACA,OAAOK,KAAe2B;AAAA,MACtB,IAAAH;AAAA,MACA,IAAAC;AAAA,MACA,MAAMN;AAAA,MACN,MAAMG;AAAA,IAAA;AAAA,EAAA;AAGZ;"}
|
|
@@ -1,23 +1,27 @@
|
|
|
1
|
-
import { j as
|
|
2
|
-
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
1
|
+
import { j as p } from "./sd-component-library197.js";
|
|
2
|
+
const m = (a) => {
|
|
3
|
+
const { position: s, diameter: t, rangeY: e, rangeX: n, distanceFromRanges: r, isInRange: o } = a;
|
|
4
|
+
if (o)
|
|
5
|
+
return null;
|
|
6
|
+
const { startX: d, startY: i, endX: X, endY: Y } = s === "left" ? {
|
|
7
|
+
startX: n || 0,
|
|
8
|
+
startY: e || t / 2 - 0.5,
|
|
9
|
+
endX: -r,
|
|
10
|
+
endY: t / 2 - 0.5
|
|
11
|
+
} : s === "top" ? {
|
|
12
|
+
startX: n || t / 2,
|
|
13
|
+
startY: e || 0,
|
|
14
|
+
endX: t / 2,
|
|
15
|
+
endY: -r
|
|
16
|
+
} : {
|
|
17
|
+
startX: n || t,
|
|
18
|
+
startY: e || t / 2 - 0.5,
|
|
19
|
+
endX: t + r,
|
|
20
|
+
endY: t / 2 - 0.5
|
|
21
|
+
};
|
|
22
|
+
return /* @__PURE__ */ p.jsx("path", { d: `M${d},${i} L${X},${Y}`, stroke: "#CCD0DB" });
|
|
23
|
+
};
|
|
20
24
|
export {
|
|
21
|
-
m as
|
|
25
|
+
m as OutlineMeterLabelPointer
|
|
22
26
|
};
|
|
23
27
|
//# sourceMappingURL=sd-component-library243.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-component-library243.js","sources":["../src/components/meters/
|
|
1
|
+
{"version":3,"file":"sd-component-library243.js","sources":["../src/components/meters/outline-meter/partials/outline-meter-label-pointer/outline-meter-label-pointer.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { OutlineMeterLabelPointerProps as Props } from \"./interfaces\";\n\nexport const OutlineMeterLabelPointer: React.FC<Props> = (props) => {\n const { position, diameter, rangeY, rangeX, distanceFromRanges, isInRange } =\n props;\n\n if (isInRange) return null;\n\n const { startX, startY, endX, endY } =\n position === \"left\"\n ? {\n startX: rangeX || 0,\n startY: rangeY || diameter / 2 - 0.5,\n endX: -distanceFromRanges,\n endY: diameter / 2 - 0.5,\n }\n : position === \"top\"\n ? {\n startX: rangeX || diameter / 2,\n startY: rangeY || 0,\n endX: diameter / 2,\n endY: -distanceFromRanges,\n }\n : {\n startX: rangeX || diameter,\n startY: rangeY || diameter / 2 - 0.5,\n endX: diameter + distanceFromRanges,\n endY: diameter / 2 - 0.5,\n };\n\n return (\n <path d={`M${startX},${startY} L${endX},${endY}`} stroke={\"#CCD0DB\"} />\n );\n};\n"],"names":["OutlineMeterLabelPointer","props","position","diameter","rangeY","rangeX","distanceFromRanges","isInRange","startX","startY","endX","endY","jsx"],"mappings":";AAIa,MAAAA,IAA4C,CAACC,MAAU;AAClE,QAAM,EAAE,UAAAC,GAAU,UAAAC,GAAU,QAAAC,GAAQ,QAAAC,GAAQ,oBAAAC,GAAoB,WAAAC,EAC9D,IAAAN;AAEE,MAAAM;AAAkB,WAAA;AAEtB,QAAM,EAAE,QAAAC,GAAQ,QAAAC,GAAQ,MAAAC,GAAM,MAAAC,EAAK,IACjCT,MAAa,SACT;AAAA,IACE,QAAQG,KAAU;AAAA,IAClB,QAAQD,KAAUD,IAAW,IAAI;AAAA,IACjC,MAAM,CAACG;AAAA,IACP,MAAMH,IAAW,IAAI;AAAA,EAAA,IAEvBD,MAAa,QACb;AAAA,IACE,QAAQG,KAAUF,IAAW;AAAA,IAC7B,QAAQC,KAAU;AAAA,IAClB,MAAMD,IAAW;AAAA,IACjB,MAAM,CAACG;AAAA,EAAA,IAET;AAAA,IACE,QAAQD,KAAUF;AAAA,IAClB,QAAQC,KAAUD,IAAW,IAAI;AAAA,IACjC,MAAMA,IAAWG;AAAA,IACjB,MAAMH,IAAW,IAAI;AAAA,EAAA;AAG7B,SACGS,gBAAAA,EAAAA,IAAA,QAAA,EAAK,GAAG,IAAIJ,CAAM,IAAIC,CAAM,KAAKC,CAAI,IAAIC,CAAI,IAAI,QAAQ,UAAW,CAAA;AAEzE;"}
|
|
@@ -1,51 +1,56 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
1
|
+
import { j as s } from "./sd-component-library197.js";
|
|
2
|
+
import { useRef as g, useState as $, useEffect as b } from "react";
|
|
3
|
+
import { Box as l } from "rebass";
|
|
4
|
+
import { labelPaddingX as o, labelWidth as u } from "./sd-component-library227.js";
|
|
5
|
+
import { ResponsiveTextV2 as v } from "./sd-component-library150.js";
|
|
6
|
+
const C = (x) => {
|
|
7
|
+
const {
|
|
8
|
+
position: t,
|
|
9
|
+
diameter: r,
|
|
10
|
+
label: d,
|
|
11
|
+
distanceFromLabelToRanges: p,
|
|
12
|
+
isInRange: e,
|
|
13
|
+
color: n
|
|
14
|
+
} = x, i = g(), [c, a] = $(0);
|
|
15
|
+
b(() => {
|
|
16
|
+
i.current && a(i.current.getBoundingClientRect().height);
|
|
17
|
+
}, [i]);
|
|
18
|
+
const h = t === "right" ? `${r + p}px` : t === "top" ? `${r / 2}px` : void 0, m = t === "left" ? `${r + p}px` : void 0, f = t === "left" || t === "right" ? `${r / 2}px` : `${-p}px`;
|
|
19
|
+
return /* @__PURE__ */ s.jsx(l, { sx: { position: "absolute", left: h, top: f, right: m }, children: /* @__PURE__ */ s.jsx(
|
|
20
|
+
l,
|
|
21
|
+
{
|
|
22
|
+
sx: {
|
|
23
|
+
position: "relative",
|
|
24
|
+
top: `-${c}px`,
|
|
25
|
+
left: t === "top" ? "-50%" : void 0,
|
|
26
|
+
py: "7px",
|
|
27
|
+
px: e ? `${o}px` : "0",
|
|
28
|
+
borderColor: e ? n : "cl_lightGrey",
|
|
29
|
+
borderWidth: e ? "2px" : "1pt",
|
|
30
|
+
borderStyle: e ? "solid" : "none",
|
|
31
|
+
borderBottomStyle: !e && t === "top" ? "none" : "solid",
|
|
32
|
+
borderRadius: e ? `${o}px ${o}px ${t !== "left" ? `${o}px` : "0"} ${t !== "right" ? `${o}px` : "0"}` : "0",
|
|
33
|
+
bg: "cl_white",
|
|
34
|
+
"& > div": {
|
|
35
|
+
maxWidth: t === "top" ? void 0 : `${u}px`
|
|
36
|
+
}
|
|
37
|
+
},
|
|
38
|
+
ref: i,
|
|
39
|
+
children: /* @__PURE__ */ s.jsx(
|
|
40
|
+
v,
|
|
41
|
+
{
|
|
42
|
+
width: "max-content",
|
|
43
|
+
fontSizeWeight: [[12, "semi-bold"]],
|
|
44
|
+
color: e && n !== "#CCD0DB" ? n : "cl_darkGrey",
|
|
45
|
+
textTransform: "uppercase",
|
|
46
|
+
letterSpacing: "1.8px",
|
|
47
|
+
children: d
|
|
48
|
+
}
|
|
49
|
+
)
|
|
50
|
+
}
|
|
51
|
+
) });
|
|
46
52
|
};
|
|
47
53
|
export {
|
|
48
|
-
|
|
49
|
-
x as getSegmentCoordinates
|
|
54
|
+
C as BaseMeterLabelBox
|
|
50
55
|
};
|
|
51
56
|
//# sourceMappingURL=sd-component-library244.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-component-library244.js","sources":["../src/components/meters/
|
|
1
|
+
{"version":3,"file":"sd-component-library244.js","sources":["../src/components/meters/outline-meter/partials/base-meter-label-box/base-meter-label-box.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { ResponsiveTextV2 } from \"../../../../texts/responsive-text-v2\";\nimport { labelPaddingX, labelWidth } from \"../../contants\";\nimport { BaseMeterLabelBoxProps as Props } from \"./interfaces\";\n\nexport const BaseMeterLabelBox: React.FC<Props> = (props) => {\n const {\n position,\n diameter,\n label,\n distanceFromLabelToRanges,\n isInRange,\n color,\n } = props;\n const ref = useRef<HTMLElement>();\n const [textHeight, setTextHeight] = useState(0);\n\n useEffect(() => {\n if (ref.current) setTextHeight(ref.current.getBoundingClientRect().height);\n }, [ref]);\n\n const left =\n position === \"right\"\n ? `${diameter + distanceFromLabelToRanges}px`\n : position === \"top\"\n ? `${diameter / 2}px`\n : undefined;\n const right =\n position === \"left\"\n ? `${diameter + distanceFromLabelToRanges}px`\n : undefined;\n const top =\n position === \"left\" || position === \"right\"\n ? `${diameter / 2}px`\n : `${-distanceFromLabelToRanges}px`;\n\n return (\n <Box sx={{ position: \"absolute\", left, top, right }}>\n <Box\n sx={{\n position: \"relative\",\n top: `-${textHeight}px`,\n left: position === \"top\" ? \"-50%\" : undefined,\n py: \"7px\",\n px: isInRange ? `${labelPaddingX}px` : \"0\",\n borderColor: isInRange ? color : \"cl_lightGrey\",\n borderWidth: isInRange ? \"2px\" : \"1pt\",\n borderStyle: isInRange ? \"solid\" : \"none\",\n borderBottomStyle:\n !isInRange && position === \"top\" ? \"none\" : \"solid\",\n borderRadius: isInRange\n ? `${labelPaddingX}px ${labelPaddingX}px ${\n position !== \"left\" ? `${labelPaddingX}px` : \"0\"\n } ${position !== \"right\" ? `${labelPaddingX}px` : \"0\"}`\n : \"0\",\n bg: \"cl_white\",\n \"& > div\": {\n maxWidth: position === \"top\" ? undefined : `${labelWidth}px`,\n },\n }}\n ref={ref}\n >\n <ResponsiveTextV2\n width=\"max-content\"\n fontSizeWeight={[[12, \"semi-bold\"]]}\n color={isInRange && color !== \"#CCD0DB\" ? color : \"cl_darkGrey\"}\n textTransform=\"uppercase\"\n letterSpacing=\"1.8px\"\n >\n {label}\n </ResponsiveTextV2>\n </Box>\n </Box>\n );\n};\n"],"names":["BaseMeterLabelBox","props","position","diameter","label","distanceFromLabelToRanges","isInRange","color","ref","useRef","textHeight","setTextHeight","useState","useEffect","left","right","top","jsx","Box","labelPaddingX","labelWidth","ResponsiveTextV2"],"mappings":";;;;;AAQa,MAAAA,IAAqC,CAACC,MAAU;AACrD,QAAA;AAAA,IACJ,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,2BAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC;AAAA,EACE,IAAAN,GACEO,IAAMC,KACN,CAACC,GAAYC,CAAa,IAAIC,EAAS,CAAC;AAE9C,EAAAC,EAAU,MAAM;AACd,IAAIL,EAAI,WAASG,EAAcH,EAAI,QAAQ,sBAAsB,EAAE,MAAM;AAAA,EAAA,GACxE,CAACA,CAAG,CAAC;AAER,QAAMM,IACJZ,MAAa,UACT,GAAGC,IAAWE,CAAyB,OACvCH,MAAa,QACb,GAAGC,IAAW,CAAC,OACf,QACAY,IACJb,MAAa,SACT,GAAGC,IAAWE,CAAyB,OACvC,QACAW,IACJd,MAAa,UAAUA,MAAa,UAChC,GAAGC,IAAW,CAAC,OACf,GAAG,CAACE,CAAyB;AAGjC,SAAAY,gBAAAA,MAACC,KAAI,IAAI,EAAE,UAAU,YAAY,MAAAJ,GAAM,KAAAE,GAAK,OAAAD,EAC1C,GAAA,UAAAE,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACF,UAAU;AAAA,QACV,KAAK,IAAIR,CAAU;AAAA,QACnB,MAAMR,MAAa,QAAQ,SAAS;AAAA,QACpC,IAAI;AAAA,QACJ,IAAII,IAAY,GAAGa,CAAa,OAAO;AAAA,QACvC,aAAab,IAAYC,IAAQ;AAAA,QACjC,aAAaD,IAAY,QAAQ;AAAA,QACjC,aAAaA,IAAY,UAAU;AAAA,QACnC,mBACE,CAACA,KAAaJ,MAAa,QAAQ,SAAS;AAAA,QAC9C,cAAcI,IACV,GAAGa,CAAa,MAAMA,CAAa,MACjCjB,MAAa,SAAS,GAAGiB,CAAa,OAAO,GAC/C,IAAIjB,MAAa,UAAU,GAAGiB,CAAa,OAAO,GAAG,KACrD;AAAA,QACJ,IAAI;AAAA,QACJ,WAAW;AAAA,UACT,UAAUjB,MAAa,QAAQ,SAAY,GAAGkB,CAAU;AAAA,QAC1D;AAAA,MACF;AAAA,MACA,KAAAZ;AAAA,MAEA,UAAAS,gBAAAA,EAAA;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,gBAAgB,CAAC,CAAC,IAAI,WAAW,CAAC;AAAA,UAClC,OAAOf,KAAaC,MAAU,YAAYA,IAAQ;AAAA,UAClD,eAAc;AAAA,UACd,eAAc;AAAA,UAEb,UAAAH;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
|
|
@@ -1,44 +1,51 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
import { getCoordinateForArc as s } from "./sd-component-library91.js";
|
|
2
|
+
const v = (r) => {
|
|
3
|
+
const a = `Received ${r.map(
|
|
4
|
+
({ start: e, end: t }) => `(${e},${t})`
|
|
5
|
+
)}`, n = (e) => console.error(e, a);
|
|
6
|
+
if (r.some(
|
|
7
|
+
({ start: e, end: t }) => [e, t].some((o) => o < 0 || o > 1)
|
|
8
|
+
))
|
|
9
|
+
return n("Segment values should be between 0 and 1"), !1;
|
|
10
|
+
if (r.reduce(
|
|
11
|
+
(e, { start: t }) => e + (t === 0 ? 1 : 0),
|
|
12
|
+
0
|
|
13
|
+
) !== 1)
|
|
14
|
+
return n("One segment should start from 0"), !1;
|
|
15
|
+
if (r.reduce((e, { end: t }) => e + (t === 1 ? 1 : 0), 0) !== 1)
|
|
16
|
+
return n("One segment should end by 1"), !1;
|
|
17
|
+
if (r.some(({ start: e, end: t }) => e >= t))
|
|
18
|
+
return n("Segment start should be smaller than end"), !1;
|
|
19
|
+
for (let e = 1; e < r.length; e++) {
|
|
20
|
+
const t = r[e];
|
|
21
|
+
if (r[e - 1].end !== t.start)
|
|
22
|
+
return n("Previous segment end should be equal to next segment start"), !1;
|
|
23
|
+
}
|
|
24
|
+
return !0;
|
|
25
|
+
}, x = ({ start: r, end: a }, n, e) => {
|
|
26
|
+
const t = n - e, o = Math.round(r * 360), c = Math.round(a * 360), d = c - o, { x: l, y: u } = s(n, o), { x: f, y: m } = s(
|
|
27
|
+
t,
|
|
28
|
+
o,
|
|
29
|
+
n
|
|
30
|
+
), { x: h, y: i } = s(n, c), { x: g, y: S } = s(
|
|
31
|
+
t,
|
|
32
|
+
c,
|
|
33
|
+
n
|
|
34
|
+
);
|
|
35
|
+
return {
|
|
12
36
|
startX: l,
|
|
13
|
-
startY:
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
startInnerX:
|
|
17
|
-
|
|
18
|
-
endInnerX:
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
}
|
|
22
|
-
return /* @__PURE__ */ n.jsxs("g", { children: [
|
|
23
|
-
/* @__PURE__ */ n.jsx(
|
|
24
|
-
"path",
|
|
25
|
-
{
|
|
26
|
-
d: `M${r},${r} L${l},${m} A${t},${t} 0 ${i > 180 ? "1" : "0"},1 ${f},${j}Z`,
|
|
27
|
-
fill: a ? d : g.colors.cl_lightGrey,
|
|
28
|
-
strokeWidth: c,
|
|
29
|
-
stroke: "white"
|
|
30
|
-
}
|
|
31
|
-
),
|
|
32
|
-
/* @__PURE__ */ n.jsx(
|
|
33
|
-
"path",
|
|
34
|
-
{
|
|
35
|
-
d: `M${r},${r} L${h},${p} A${$},${$} 0 ${i > 180 ? "1" : "0"},1 ${x},${u}Z`,
|
|
36
|
-
fill: "white"
|
|
37
|
-
}
|
|
38
|
-
)
|
|
39
|
-
] });
|
|
37
|
+
startY: u,
|
|
38
|
+
endX: h,
|
|
39
|
+
endY: i,
|
|
40
|
+
startInnerX: f,
|
|
41
|
+
startInnerY: m,
|
|
42
|
+
endInnerX: g,
|
|
43
|
+
endInnerY: S,
|
|
44
|
+
arc: d
|
|
45
|
+
};
|
|
40
46
|
};
|
|
41
47
|
export {
|
|
42
|
-
|
|
48
|
+
v as areSegmentsValid,
|
|
49
|
+
x as getSegmentCoordinates
|
|
43
50
|
};
|
|
44
51
|
//# sourceMappingURL=sd-component-library245.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-component-library245.js","sources":["../src/components/meters/
|
|
1
|
+
{"version":3,"file":"sd-component-library245.js","sources":["../src/components/meters/donut-diagram/utils.ts"],"sourcesContent":["import { getCoordinateForArc } from \"../outline-meter/utils\";\nimport { DonutSegment } from \"./interfaces\";\n\nexport const areSegmentsValid = (\n segments: Pick<DonutSegment, \"start\" | \"end\">[]\n): boolean => {\n const receivedSegments = `Received ${segments.map(\n ({ start, end }) => `(${start},${end})`\n )}`;\n const showError = (text: string) => console.error(text, receivedSegments);\n\n if (\n segments.some(({ start, end }) =>\n [start, end].some((point) => point < 0 || point > 1)\n )\n ) {\n showError(\"Segment values should be between 0 and 1\");\n return false;\n }\n\n if (\n segments.reduce<number>(\n (acc, { start }) => acc + (start === 0 ? 1 : 0),\n 0\n ) !== 1\n ) {\n showError(\"One segment should start from 0\");\n return false;\n }\n\n if (\n segments.reduce<number>((acc, { end }) => acc + (end === 1 ? 1 : 0), 0) !==\n 1\n ) {\n showError(\"One segment should end by 1\");\n return false;\n }\n\n if (segments.some(({ start, end }) => start >= end)) {\n showError(\"Segment start should be smaller than end\");\n return false;\n }\n\n for (let i = 1; i < segments.length; i++) {\n const currentSegment = segments[i];\n const prevSegment = segments[i - 1];\n if (prevSegment.end !== currentSegment.start) {\n showError(\"Previous segment end should be equal to next segment start\");\n return false;\n }\n }\n\n return true;\n};\n\nexport const getSegmentCoordinates = (\n { start, end }: Pick<DonutSegment, \"start\" | \"end\">,\n radius: number,\n segmentWidth: number\n) => {\n const innerRadius = radius - segmentWidth;\n\n const startAlpha = Math.round(start * 360);\n const endAlpha = Math.round(end * 360);\n const arc = endAlpha - startAlpha;\n\n const { x: startX, y: startY } = getCoordinateForArc(radius, startAlpha);\n const { x: startInnerX, y: startInnerY } = getCoordinateForArc(\n innerRadius,\n startAlpha,\n radius\n );\n\n const { x: endX, y: endY } = getCoordinateForArc(radius, endAlpha);\n const { x: endInnerX, y: endInnerY } = getCoordinateForArc(\n innerRadius,\n endAlpha,\n radius\n );\n return {\n startX,\n startY,\n endX,\n endY,\n startInnerX,\n startInnerY,\n endInnerX,\n endInnerY,\n arc,\n };\n};\n"],"names":["areSegmentsValid","segments","receivedSegments","start","end","showError","text","point","acc","i","currentSegment","getSegmentCoordinates","radius","segmentWidth","innerRadius","startAlpha","endAlpha","arc","startX","startY","getCoordinateForArc","startInnerX","startInnerY","endX","endY","endInnerX","endInnerY"],"mappings":";AAGa,MAAAA,IAAmB,CAC9BC,MACY;AACN,QAAAC,IAAmB,YAAYD,EAAS;AAAA,IAC5C,CAAC,EAAE,OAAAE,GAAO,KAAAC,QAAU,IAAID,CAAK,IAAIC,CAAG;AAAA,EACrC,CAAA,IACKC,IAAY,CAACC,MAAiB,QAAQ,MAAMA,GAAMJ,CAAgB;AAExE,MACED,EAAS;AAAA,IAAK,CAAC,EAAE,OAAAE,GAAO,KAAAC,QACtB,CAACD,GAAOC,CAAG,EAAE,KAAK,CAACG,MAAUA,IAAQ,KAAKA,IAAQ,CAAC;AAAA,EAAA;AAGrD,WAAAF,EAAU,0CAA0C,GAC7C;AAGT,MACEJ,EAAS;AAAA,IACP,CAACO,GAAK,EAAE,OAAAL,QAAYK,KAAOL,MAAU,IAAI,IAAI;AAAA,IAC7C;AAAA,QACI;AAEN,WAAAE,EAAU,iCAAiC,GACpC;AAGT,MACEJ,EAAS,OAAe,CAACO,GAAK,EAAE,KAAAJ,EAAI,MAAMI,KAAOJ,MAAQ,IAAI,IAAI,IAAI,CAAC,MACtE;AAEA,WAAAC,EAAU,6BAA6B,GAChC;AAGL,MAAAJ,EAAS,KAAK,CAAC,EAAE,OAAAE,GAAO,KAAAC,QAAUD,KAASC,CAAG;AAChD,WAAAC,EAAU,0CAA0C,GAC7C;AAGT,WAASI,IAAI,GAAGA,IAAIR,EAAS,QAAQQ,KAAK;AAClC,UAAAC,IAAiBT,EAASQ,CAAC;AAE7B,QADgBR,EAASQ,IAAI,CAAC,EAClB,QAAQC,EAAe;AACrC,aAAAL,EAAU,4DAA4D,GAC/D;AAAA,EAEX;AAEO,SAAA;AACT,GAEaM,IAAwB,CACnC,EAAE,OAAAR,GAAO,KAAAC,EAAI,GACbQ,GACAC,MACG;AACH,QAAMC,IAAcF,IAASC,GAEvBE,IAAa,KAAK,MAAMZ,IAAQ,GAAG,GACnCa,IAAW,KAAK,MAAMZ,IAAM,GAAG,GAC/Ba,IAAMD,IAAWD,GAEjB,EAAE,GAAGG,GAAQ,GAAGC,MAAWC,EAAoBR,GAAQG,CAAU,GACjE,EAAE,GAAGM,GAAa,GAAGC,EAAgB,IAAAF;AAAA,IACzCN;AAAA,IACAC;AAAA,IACAH;AAAA,EAAA,GAGI,EAAE,GAAGW,GAAM,GAAGC,MAASJ,EAAoBR,GAAQI,CAAQ,GAC3D,EAAE,GAAGS,GAAW,GAAGC,EAAc,IAAAN;AAAA,IACrCN;AAAA,IACAE;AAAA,IACAJ;AAAA,EAAA;AAEK,SAAA;AAAA,IACL,QAAAM;AAAA,IACA,QAAAC;AAAA,IACA,MAAAI;AAAA,IACA,MAAAC;AAAA,IACA,aAAAH;AAAA,IACA,aAAAC;AAAA,IACA,WAAAG;AAAA,IACA,WAAAC;AAAA,IACA,KAAAT;AAAA,EAAA;AAEJ;"}
|
|
@@ -1,30 +1,78 @@
|
|
|
1
|
-
import { j as
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
1
|
+
import { j as n } from "./sd-component-library197.js";
|
|
2
|
+
import { useHover as Z } from "./sd-component-library3.js";
|
|
3
|
+
import { getCoordinateForArc as l } from "./sd-component-library91.js";
|
|
4
|
+
import { getSegmentCoordinates as O } from "./sd-component-library245.js";
|
|
5
|
+
import { SegmentLabel as q } from "./sd-component-library318.js";
|
|
6
|
+
const h = 300, G = ({
|
|
7
|
+
segment: o,
|
|
8
|
+
segmentWidth: $,
|
|
9
|
+
outlineWidth: f,
|
|
10
|
+
size: i,
|
|
11
|
+
mobile: a,
|
|
12
|
+
...c
|
|
13
|
+
}) => {
|
|
14
|
+
const { start: p, end: x, color: u } = o, { labelOffset: j } = c, t = i / 2, d = t - $, {
|
|
15
|
+
startInnerX: k,
|
|
16
|
+
startInnerY: A,
|
|
17
|
+
endInnerX: M,
|
|
18
|
+
endInnerY: X,
|
|
19
|
+
endX: Y,
|
|
20
|
+
endY: v,
|
|
21
|
+
startY: S,
|
|
22
|
+
startX: g,
|
|
23
|
+
arc: e
|
|
24
|
+
} = O(o, t, $), r = i / 2, H = Math.round(p * 360), I = Math.round(x * 360), { isHover: L, hoverCallbacks: w } = Z(), m = L && !a, s = Math.sqrt(2) * (t + j), { x: y, y: C } = l(
|
|
25
|
+
s,
|
|
26
|
+
H,
|
|
27
|
+
t
|
|
28
|
+
), { x: E, y: R } = l(
|
|
29
|
+
s,
|
|
30
|
+
I,
|
|
31
|
+
t
|
|
32
|
+
);
|
|
33
|
+
return /* @__PURE__ */ n.jsxs("g", { ...a ? {} : w, children: [
|
|
34
|
+
/* @__PURE__ */ n.jsx(
|
|
35
|
+
"path",
|
|
36
|
+
{
|
|
37
|
+
d: `M${r},${r} L${y},${C} A${s},${s} 0 ${e > 180 ? "1" : "0"},1 ${E},${R}Z`,
|
|
38
|
+
fill: "transparent"
|
|
39
|
+
}
|
|
40
|
+
),
|
|
41
|
+
/* @__PURE__ */ n.jsx(
|
|
42
|
+
"path",
|
|
43
|
+
{
|
|
44
|
+
d: `M${r},${r} L${g},${S} A${t},${t} 0 ${e > 180 ? "1" : "0"},1 ${Y},${v}Z`,
|
|
45
|
+
fill: u,
|
|
46
|
+
strokeWidth: f,
|
|
47
|
+
stroke: "white"
|
|
48
|
+
}
|
|
49
|
+
),
|
|
50
|
+
/* @__PURE__ */ n.jsx(
|
|
51
|
+
"path",
|
|
52
|
+
{
|
|
53
|
+
d: `M${r},${r} L${k},${A} A${d},${d} 0 ${e > 180 ? "1" : "0"},1 ${M},${X}Z`,
|
|
54
|
+
fill: "white",
|
|
55
|
+
style: {
|
|
56
|
+
transform: `scale(${m ? 0.8 : 1}`,
|
|
57
|
+
transformOrigin: "center",
|
|
58
|
+
transition: `all ${h}ms`
|
|
22
59
|
}
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
60
|
+
}
|
|
61
|
+
),
|
|
62
|
+
/* @__PURE__ */ n.jsx(
|
|
63
|
+
q,
|
|
64
|
+
{
|
|
65
|
+
segment: o,
|
|
66
|
+
radius: t,
|
|
67
|
+
animationDuration: h,
|
|
68
|
+
isHover: m,
|
|
69
|
+
mobile: a,
|
|
70
|
+
...c
|
|
71
|
+
}
|
|
72
|
+
)
|
|
73
|
+
] });
|
|
74
|
+
};
|
|
27
75
|
export {
|
|
28
|
-
|
|
76
|
+
G as Segment
|
|
29
77
|
};
|
|
30
78
|
//# sourceMappingURL=sd-component-library246.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-component-library246.js","sources":["../src/components/meters/
|
|
1
|
+
{"version":3,"file":"sd-component-library246.js","sources":["../src/components/meters/donut-diagram/partials/segment/segment.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { useHover } from \"../../../../../core/custom-hooks\";\nimport { getCoordinateForArc } from \"../../../outline-meter/utils\";\nimport { getSegmentCoordinates } from \"../../utils\";\nimport { SegmentLabel } from \"../segment-label\";\nimport { SegmentProps as Props } from \"./interfaces\";\n\nconst animationDuration = 300;\n\nexport const Segment: React.FC<Props> = ({\n segment,\n segmentWidth,\n outlineWidth,\n size: diameter,\n mobile,\n ...labelProps\n}) => {\n const { start, end, color } = segment;\n const { labelOffset } = labelProps;\n\n const radius = diameter / 2;\n const innerRadius = radius - segmentWidth;\n\n const {\n startInnerX,\n startInnerY,\n endInnerX,\n endInnerY,\n endX,\n endY,\n startY,\n startX,\n arc,\n } = getSegmentCoordinates(segment, radius, segmentWidth);\n\n const center = diameter / 2;\n\n const startAlpha = Math.round(start * 360);\n const endAlpha = Math.round(end * 360);\n\n const { isHover, hoverCallbacks } = useHover();\n const showHover = isHover && !mobile;\n\n const maxRadius = Math.sqrt(2) * (radius + labelOffset);\n\n const { x: maskStartX, y: maskStartY } = getCoordinateForArc(\n maxRadius,\n startAlpha,\n radius\n );\n\n const { x: maskEndX, y: maskEndY } = getCoordinateForArc(\n maxRadius,\n endAlpha,\n radius\n );\n\n return (\n <g {...(mobile ? {} : hoverCallbacks)}>\n {/* mask */}\n <path\n d={`M${center},${center} L${maskStartX},${maskStartY} A${maxRadius},${maxRadius} 0 ${\n arc > 180 ? \"1\" : \"0\"\n },1 ${maskEndX},${maskEndY}Z`}\n fill=\"transparent\"\n />\n\n {/* colored sector */}\n <path\n d={`M${center},${center} L${startX},${startY} A${radius},${radius} 0 ${\n arc > 180 ? \"1\" : \"0\"\n },1 ${endX},${endY}Z`}\n fill={color}\n strokeWidth={outlineWidth}\n stroke=\"white\"\n />\n\n {/* white inner sector */}\n <path\n d={`M${center},${center} L${startInnerX},${startInnerY} A${innerRadius},${innerRadius} 0 ${\n arc > 180 ? \"1\" : \"0\"\n },1 ${endInnerX},${endInnerY}Z`}\n fill=\"white\"\n style={{\n transform: `scale(${showHover ? 0.8 : 1}`,\n transformOrigin: \"center\",\n transition: `all ${animationDuration}ms`,\n }}\n />\n\n <SegmentLabel\n segment={segment}\n radius={radius}\n animationDuration={animationDuration}\n isHover={showHover}\n mobile={mobile}\n {...labelProps}\n />\n </g>\n );\n};\n"],"names":["animationDuration","Segment","segment","segmentWidth","outlineWidth","diameter","mobile","labelProps","start","end","color","labelOffset","radius","innerRadius","startInnerX","startInnerY","endInnerX","endInnerY","endX","endY","startY","startX","arc","getSegmentCoordinates","center","startAlpha","endAlpha","isHover","hoverCallbacks","useHover","showHover","maxRadius","maskStartX","maskStartY","getCoordinateForArc","maskEndX","maskEndY","jsx","SegmentLabel"],"mappings":";;;;;AAQA,MAAMA,IAAoB,KAEbC,IAA2B,CAAC;AAAA,EACvC,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAMC;AAAA,EACN,QAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,EAAE,OAAAC,GAAO,KAAAC,GAAK,OAAAC,EAAA,IAAUR,GACxB,EAAE,aAAAS,EAAgB,IAAAJ,GAElBK,IAASP,IAAW,GACpBQ,IAAcD,IAAST,GAEvB;AAAA,IACJ,aAAAW;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,WAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,KAAAC;AAAA,EACE,IAAAC,EAAsBrB,GAASU,GAAQT,CAAY,GAEjDqB,IAASnB,IAAW,GAEpBoB,IAAa,KAAK,MAAMjB,IAAQ,GAAG,GACnCkB,IAAW,KAAK,MAAMjB,IAAM,GAAG,GAE/B,EAAE,SAAAkB,GAAS,gBAAAC,EAAe,IAAIC,EAAS,GACvCC,IAAYH,KAAW,CAACrB,GAExByB,IAAY,KAAK,KAAK,CAAC,KAAKnB,IAASD,IAErC,EAAE,GAAGqB,GAAY,GAAGC,EAAe,IAAAC;AAAA,IACvCH;AAAA,IACAN;AAAA,IACAb;AAAA,EAAA,GAGI,EAAE,GAAGuB,GAAU,GAAGC,EAAa,IAAAF;AAAA,IACnCH;AAAA,IACAL;AAAA,IACAd;AAAA,EAAA;AAGF,gCACG,KAAG,EAAA,GAAIN,IAAS,KAAKsB,GAEpB,UAAA;AAAA,IAAAS,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,GAAG,IAAIb,CAAM,IAAIA,CAAM,KAAKQ,CAAU,IAAIC,CAAU,KAAKF,CAAS,IAAIA,CAAS,MAC7ET,IAAM,MAAM,MAAM,GACpB,MAAMa,CAAQ,IAAIC,CAAQ;AAAA,QAC1B,MAAK;AAAA,MAAA;AAAA,IACP;AAAA,IAGAC,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,GAAG,IAAIb,CAAM,IAAIA,CAAM,KAAKH,CAAM,IAAID,CAAM,KAAKR,CAAM,IAAIA,CAAM,MAC/DU,IAAM,MAAM,MAAM,GACpB,MAAMJ,CAAI,IAAIC,CAAI;AAAA,QAClB,MAAMT;AAAA,QACN,aAAaN;AAAA,QACb,QAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAGAiC,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,GAAG,IAAIb,CAAM,IAAIA,CAAM,KAAKV,CAAW,IAAIC,CAAW,KAAKF,CAAW,IAAIA,CAAW,MACnFS,IAAM,MAAM,MAAM,GACpB,MAAMN,CAAS,IAAIC,CAAS;AAAA,QAC5B,MAAK;AAAA,QACL,OAAO;AAAA,UACL,WAAW,SAASa,IAAY,MAAM,CAAC;AAAA,UACvC,iBAAiB;AAAA,UACjB,YAAY,OAAO9B,CAAiB;AAAA,QACtC;AAAA,MAAA;AAAA,IACF;AAAA,IAEAqC,gBAAAA,EAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAAApC;AAAA,QACA,QAAAU;AAAA,QACA,mBAAAZ;AAAA,QACA,SAAS8B;AAAA,QACT,QAAAxB;AAAA,QACC,GAAGC;AAAA,MAAA;AAAA,IACN;AAAA,EACF,EAAA,CAAA;AAEJ;"}
|
|
@@ -1,5 +1,24 @@
|
|
|
1
|
-
|
|
1
|
+
import { j as x } from "./sd-component-library197.js";
|
|
2
|
+
import { Box as n } from "rebass";
|
|
3
|
+
const $ = ({
|
|
4
|
+
idx: o,
|
|
5
|
+
color: t,
|
|
6
|
+
total: i,
|
|
7
|
+
segmentHeight: r
|
|
8
|
+
}) => {
|
|
9
|
+
const s = `${o === 0 ? r / 2 : 0}px`, a = `${o === i - 1 ? r / 2 : 0}px`;
|
|
10
|
+
return /* @__PURE__ */ x.jsx(
|
|
11
|
+
n,
|
|
12
|
+
{
|
|
13
|
+
bg: t,
|
|
14
|
+
height: r,
|
|
15
|
+
sx: {
|
|
16
|
+
borderRadius: `${s} ${[...Array(2)].fill(a).join(" ")} ${s}`
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
);
|
|
20
|
+
};
|
|
2
21
|
export {
|
|
3
|
-
|
|
22
|
+
$ as LinearGaugeSegment
|
|
4
23
|
};
|
|
5
24
|
//# sourceMappingURL=sd-component-library247.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-component-library247.js","sources":["../src/components/meters/linear-
|
|
1
|
+
{"version":3,"file":"sd-component-library247.js","sources":["../src/components/meters/linear-gauge-meter-partials/linear-gauge-segment/linear-gauge-segment.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { LinearGaugeSegmentProps as Props } from \"./interfaces\";\n\nexport const LinearGaugeSegment: React.FC<Props> = ({\n idx,\n color,\n total,\n segmentHeight,\n}) => {\n const leftRadius = `${idx === 0 ? segmentHeight / 2 : 0}px`;\n const rightRadius = `${idx === total - 1 ? segmentHeight / 2 : 0}px`;\n\n return (\n <Box\n bg={color}\n height={segmentHeight}\n sx={{\n borderRadius: `${leftRadius} ${[...Array(2)]\n .fill(rightRadius)\n .join(\" \")} ${leftRadius}`,\n }}\n />\n );\n};\n"],"names":["LinearGaugeSegment","idx","color","total","segmentHeight","leftRadius","rightRadius","jsx","Box"],"mappings":";;AAMO,MAAMA,IAAsC,CAAC;AAAA,EAClD,KAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC;AACF,MAAM;AACJ,QAAMC,IAAa,GAAGJ,MAAQ,IAAIG,IAAgB,IAAI,CAAC,MACjDE,IAAc,GAAGL,MAAQE,IAAQ,IAAIC,IAAgB,IAAI,CAAC;AAG9D,SAAAG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAIN;AAAA,MACJ,QAAQE;AAAA,MACR,IAAI;AAAA,QACF,cAAc,GAAGC,CAAU,IAAI,CAAC,GAAG,MAAM,CAAC,CAAC,EACxC,KAAKC,CAAW,EAChB,KAAK,GAAG,CAAC,IAAID,CAAU;AAAA,MAC5B;AAAA,IAAA;AAAA,EAAA;AAGN;"}
|