@servicetitan/marketing-ui 5.8.1 → 5.10.0

package/dist/components/charts/line-chart/utils/formatters.js.map

@@ -1 +1 @@
-{"version":3,"file":"formatters.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/formatters.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAOzC,MAAM,CAAC,MAAM,UAAU,GAGnB;IACA,MAAM,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,cAAc,EAAE;IAC7D,KAAK,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,WAAW,CAAC,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;IAC1D,UAAU,EAAE,CAAC,KAAa,EAAE,EAAE;QAC1B,MAAM,SAAS,GAAG,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;QACtC,IAAI,GAAG,GAAG,KAAK,CAAC;QAEhB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YACxC,IAAI,GAAG,GAAG,IAAI,IAAI,CAAC,KAAK,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gBAC3C,OAAO,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;YACrE,CAAC;YAED,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;QACrB,CAAC;QAED,OAAO,EAAE,CAAC;IACd,CAAC;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CACxB,MAAoC,EACN,EAAE,CAChC,MAAM;IACF,CAAC,CAAC,OAAO,MAAM,KAAK,QAAQ;QACxB,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,UAAU,CAAC,MAAM;QACzC,CAAC,CAAC,MAAM;IACZ,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC"}
+{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/formatters.ts"],"sourcesContent":["import { formatMoney } from 'accounting';\nimport {\n    LineChartDisplayValueFormat,\n    LineChartDisplayValueFormatter,\n    LineChartDisplayValueFormatterName,\n} from './interfaces';\n\nexport const formatters: Record<\n    LineChartDisplayValueFormatterName,\n    LineChartDisplayValueFormatter\n> = {\n    number: (value: number) => Math.round(value).toLocaleString(),\n    money: (value: number) => formatMoney(value, undefined, 0),\n    moneyShort: (value: number) => {\n        const postfixes = ['', 'K', 'M', 'B'];\n        let val = value;\n\n        for (let i = 0; i < postfixes.length; i++) {\n            if (val < 1000 || i === postfixes.length - 1) {\n                return formatMoney(Math.round(val), undefined, 0) + postfixes[i];\n            }\n\n            val = val / 1000;\n        }\n\n        return '';\n    },\n};\n\nexport const getFormatter = (\n    format?: LineChartDisplayValueFormat\n): LineChartDisplayValueFormatter =>\n    format\n        ? typeof format === 'string'\n            ? formatters[format] || formatters.number\n            : format\n        : formatters.number;\n"],"names":["formatMoney","formatters","number","value","Math","round","toLocaleString","money","undefined","moneyShort","postfixes","val","i","length","getFormatter","format"],"mappings":"AAAA,SAASA,WAAW,QAAQ,aAAa;AAOzC,OAAO,MAAMC,aAGT;IACAC,QAAQ,CAACC,QAAkBC,KAAKC,KAAK,CAACF,OAAOG,cAAc;IAC3DC,OAAO,CAACJ,QAAkBH,YAAYG,OAAOK,WAAW;IACxDC,YAAY,CAACN;QACT,MAAMO,YAAY;YAAC;YAAI;YAAK;YAAK;SAAI;QACrC,IAAIC,MAAMR;QAEV,IAAK,IAAIS,IAAI,GAAGA,IAAIF,UAAUG,MAAM,EAAED,IAAK;YACvC,IAAID,MAAM,QAAQC,MAAMF,UAAUG,MAAM,GAAG,GAAG;gBAC1C,OAAOb,YAAYI,KAAKC,KAAK,CAACM,MAAMH,WAAW,KAAKE,SAAS,CAACE,EAAE;YACpE;YAEAD,MAAMA,MAAM;QAChB;QAEA,OAAO;IACX;AACJ,EAAE;AAEF,OAAO,MAAMG,eAAe,CACxBC,SAEAA,SACM,OAAOA,WAAW,WACdd,UAAU,CAACc,OAAO,IAAId,WAAWC,MAAM,GACvCa,SACJd,WAAWC,MAAM,CAAC"}

package/dist/components/charts/line-chart/utils/interfaces.js

@@ -1,2 +1,3 @@
-export {};
+export { };
+
 //# sourceMappingURL=interfaces.js.map

package/dist/components/charts/line-chart/utils/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/interfaces.ts"],"names":[],"mappings":""}
+{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/interfaces.ts"],"sourcesContent":["import { ReactElement } from 'react';\n\nexport type LineChartResolution = 'hour' | 'day' | 'week' | 'month';\nexport type LineChartMetricType = 'line' | 'bar' | 'stacked-bar' | 'grouped-bar';\nexport type LineChartMetricsTitlePosition = 'top' | 'top-right' | 'bottom';\n\nexport interface LineChartMetricOpts {\n    dashed?: boolean;\n}\n\nexport interface LineChartMetric {\n    id: number;\n    color: string;\n    title: string;\n    opacity?: number;\n    isRight?: boolean;\n    type?: LineChartMetricType;\n    opts?: LineChartMetricOpts;\n}\n\nexport interface LineChartPeriod {\n    from: Date;\n    to?: Date;\n    partial?: boolean;\n}\n\nexport type LineChartMetricValueOpts =\n    | undefined\n    | {\n          color?: string;\n      };\n\nexport interface LineChartMetricValues {\n    metricId: number;\n    values: number[];\n    opts?: LineChartMetricValueOpts[];\n}\n\nexport interface LineChartData {\n    periods: LineChartPeriod[];\n    metricValues: LineChartMetricValues[];\n    resolution: LineChartResolution;\n}\n\nexport type LineChartDisplayValueFormatterName = 'number' | 'money' | 'moneyShort';\nexport type LineChartDisplayValueFormatter = (val: number) => string;\nexport type LineChartDisplayValueFormat =\n    | LineChartDisplayValueFormatter\n    | LineChartDisplayValueFormatterName;\n\nexport interface LineChartDisplay {\n    xLabels: boolean;\n    yGrid: boolean;\n    yLeft: boolean;\n    yRight: boolean;\n    yLeftFormat?: LineChartDisplayValueFormat;\n    yRightFormat?: LineChartDisplayValueFormat;\n    metricsTitlePosition?: LineChartMetricsTitlePosition;\n    metricsLeftFormat?: LineChartDisplayValueFormat;\n    metricsRightFormat?: LineChartDisplayValueFormat;\n}\n\nexport interface LineChartProps extends LineChartData {\n    maxRange?: number;\n    titleY?: string;\n    maxRangeRight?: number;\n    titleYRight?: string;\n\n    metrics: LineChartMetric[];\n    from?: Date;\n    display?: Partial<LineChartDisplay>;\n    className?: string;\n    classNameTitle?: string;\n}\n\nexport interface LineChartCardProps extends LineChartProps {\n    title: string;\n    headerRight?: ReactElement;\n    loading?: boolean;\n    grayControls?: boolean;\n}\n"],"names":[],"mappings":"AA2EA,WAKC"}

package/dist/components/charts/line-chart/utils/internal-interfaces.js

@@ -1,2 +1,3 @@
-export {};
+export { };
+
 //# sourceMappingURL=internal-interfaces.js.map

package/dist/components/charts/line-chart/utils/internal-interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal-interfaces.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/internal-interfaces.ts"],"names":[],"mappings":""}
+{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/internal-interfaces.ts"],"sourcesContent":["import { LineChartMetricOpts, LineChartMetricType, LineChartMetricValueOpts } from './interfaces';\n\nexport interface SideMetricsSettings {\n    maxRange: number;\n    maxValue: number;\n    title: string;\n    values: string[];\n    width: number;\n}\n\nexport interface ChartMetric {\n    id: number;\n    color: string;\n    title: string;\n    isRight: boolean;\n    type: LineChartMetricType;\n    opts: LineChartMetricOpts;\n    values: number[];\n    opacity?: number;\n    valuesOpts?: LineChartMetricValueOpts[];\n}\n\nexport type ChartXLabels = [string, number][];\n"],"names":[],"mappings":"AAsBA,WAA8C"}

package/dist/components/charts/line-chart/utils/key.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"key.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/key.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM,QAAS,MAAM,GAAG,MAAM,KAAK,MAAM,WAAkB,CAAC"}
+{"version":3,"file":"key.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/key.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM,GAAI,KAAK,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,WAAkB,CAAC"}

package/dist/components/charts/line-chart/utils/key.js

@@ -1,2 +1,3 @@
-export const keyVal = (val, i) => `${val}-${i}`;
+export const keyVal = (val, i)=>`${val}-${i}`;
+
 //# sourceMappingURL=key.js.map

package/dist/components/charts/line-chart/utils/key.js.map

@@ -1 +1 @@
-{"version":3,"file":"key.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/key.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,GAAoB,EAAE,CAAS,EAAE,EAAE,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,CAAC"}
+{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/key.ts"],"sourcesContent":["export const keyVal = (val: string | number, i: number) => `${val}-${i}`;\n"],"names":["keyVal","val","i"],"mappings":"AAAA,OAAO,MAAMA,SAAS,CAACC,KAAsBC,IAAc,GAAGD,IAAI,CAAC,EAAEC,GAAG,CAAC"}

package/dist/components/charts/line-chart/utils/labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/labels.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAQrD,eAAO,MAAM,UAAU,YACV,eAAe,EAAE,cACd,mBAAmB,SACxB,MAAM,iBAiFhB,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,MAAM,CACzC,mBAAmB,EACnB,CAAC,MAAM,EAAE,eAAe,KAAK,MAAM,CAYtC,CAAC"}
+{"version":3,"file":"labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/labels.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAQrD,eAAO,MAAM,UAAU,GACnB,SAAS,eAAe,EAAE,EAC1B,YAAY,mBAAmB,EAC/B,OAAO,MAAM,KACd,YAgFF,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,MAAM,CACzC,mBAAmB,EACnB,CAAC,MAAM,EAAE,eAAe,KAAK,MAAM,CAYtC,CAAC"}

package/dist/components/charts/line-chart/utils/labels.js

@@ -2,96 +2,100 @@ import moment from 'moment';
 const xLabelFormats = {
     hour: 'HH:mm',
     day: 'MM/DD',
-    month: 'MMM',
+    month: 'MMM'
 };
-export const getXLabels = (periods, resolution, width) => {
+export const getXLabels = (periods, resolution, width)=>{
     let labels = [];
     if (resolution === 'hour') {
         if (width / periods.length < 76) {
             let day = -1;
-            for (const p of periods) {
+            for (const p of periods){
                 const d = p.from.getDay();
                 if (d === day) {
                     labels[labels.length - 1][1]++;
                     continue;
                 }
                 day = d;
-                labels.push([moment(p.from).format(xLabelFormats.day), 1]);
+                labels.push([
+                    moment(p.from).format(xLabelFormats.day),
+                    1
+                ]);
             }
-        }
-        else {
-            labels = periods.map(p => {
-                var _a;
+        } else {
+            labels = periods.map((p)=>{
+                var _p_to;
                 return [
-                    moment(p.from).format(xLabelFormats.hour) +
-                        ' - ' +
-                        moment((_a = p.to) !== null && _a !== void 0 ? _a : p.from).format(xLabelFormats.hour),
-                    1,
+                    moment(p.from).format(xLabelFormats.hour) + ' - ' + moment((_p_to = p.to) !== null && _p_to !== void 0 ? _p_to : p.from).format(xLabelFormats.hour),
+                    1
                 ];
             });
         }
-    }
-    else if (resolution === 'day') {
+    } else if (resolution === 'day') {
         if (width / periods.length < 40) {
             let month = -1;
-            for (const p of periods) {
+            for (const p of periods){
                 const m = p.from.getMonth();
                 if (m === month) {
                     labels[labels.length - 1][1]++;
                     continue;
                 }
                 month = m;
-                labels.push([moment(p.from).format(xLabelFormats.month), 1]);
+                labels.push([
+                    moment(p.from).format(xLabelFormats.month),
+                    1
+                ]);
             }
+        } else {
+            labels = periods.map((p)=>[
+                    moment(p.from).format(xLabelFormats.day),
+                    1
+                ]);
         }
-        else {
-            labels = periods.map(p => [moment(p.from).format(xLabelFormats.day), 1]);
-        }
-    }
-    else if (resolution === 'week') {
+    } else if (resolution === 'week') {
         if (width / periods.length < 76) {
             let month = -1;
-            for (const p of periods) {
+            for (const p of periods){
                 const m = p.from.getMonth();
-                if (m === month || (month > 0 && p.from.getDate() < 4)) {
+                if (m === month || month > 0 && p.from.getDate() < 4) {
                     labels[labels.length - 1][1]++;
                     continue;
                 }
                 if (p.to && p.to.getDate() > 3) {
                     month = p.to.getMonth();
-                    labels.push([moment(p.to).format(xLabelFormats.month), 1]);
-                }
-                else {
+                    labels.push([
+                        moment(p.to).format(xLabelFormats.month),
+                        1
+                    ]);
+                } else {
                     month = m;
-                    labels.push([moment(p.from).format(xLabelFormats.month), 1]);
+                    labels.push([
+                        moment(p.from).format(xLabelFormats.month),
+                        1
+                    ]);
                 }
             }
-        }
-        else {
-            labels = periods.map(p => {
-                var _a;
+        } else {
+            labels = periods.map((p)=>{
+                var _p_to;
                 return [
-                    moment(p.from).format(xLabelFormats.day) +
-                        ' - ' +
-                        moment((_a = p.to) !== null && _a !== void 0 ? _a : p.from).format(xLabelFormats.day),
-                    1,
+                    moment(p.from).format(xLabelFormats.day) + ' - ' + moment((_p_to = p.to) !== null && _p_to !== void 0 ? _p_to : p.from).format(xLabelFormats.day),
+                    1
                 ];
             });
         }
-    }
-    else if (resolution === 'month') {
-        labels = periods.map(p => [moment(p.from).format(xLabelFormats.month), 1]);
+    } else if (resolution === 'month') {
+        labels = periods.map((p)=>[
+                moment(p.from).format(xLabelFormats.month),
+                1
+            ]);
     }
     return labels;
 };
 export const periodDateTitleFormatter = {
-    hour: period => moment(period.from).format('MM/DD') +
-        ' ' +
-        moment(period.from).format('HH:mm') +
-        ' - ' +
-        moment(period.to).format('HH:mm'),
-    day: period => moment(period.from).format('MMMM DD, YYYY'),
-    month: period => moment(period.from).format('MMMM YYYY'),
-    week: period => moment(period.from).format('MM/DD/YYYY') + '-' + moment(period.to).format('MM/DD/YYYY'),
+    hour: (period)=>moment(period.from).format('MM/DD') + ' ' + moment(period.from).format('HH:mm') + ' - ' + moment(period.to).format('HH:mm'),
+    day: (period)=>moment(period.from).format('MMMM DD, YYYY'),
+    month: (period)=>moment(period.from).format('MMMM YYYY'),
+    week: (period)=>moment(period.from).format('MM/DD/YYYY') + '-' + moment(period.to).format('MM/DD/YYYY')
 };
+
 //# sourceMappingURL=labels.js.map

package/dist/components/charts/line-chart/utils/labels.js.map

@@ -1 +1 @@
-{"version":3,"file":"labels.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/labels.ts"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/labels.ts"],"sourcesContent":["import moment from 'moment';\nimport { LineChartPeriod, LineChartResolution } from './interfaces';\nimport { ChartXLabels } from './internal-interfaces';\n\nconst xLabelFormats = {\n    hour: 'HH:mm',\n    day: 'MM/DD',\n    month: 'MMM',\n};\n\nexport const getXLabels = (\n    periods: LineChartPeriod[],\n    resolution: LineChartResolution,\n    width: number\n): ChartXLabels => {\n    let labels: [string, number][] = [];\n\n    if (resolution === 'hour') {\n        if (width / periods.length < 76) {\n            let day = -1;\n\n            for (const p of periods) {\n                const d = p.from.getDay();\n\n                if (d === day) {\n                    labels[labels.length - 1][1]++;\n\n                    continue;\n                }\n\n                day = d;\n                labels.push([moment(p.from).format(xLabelFormats.day), 1]);\n            }\n        } else {\n            labels = periods.map(p => [\n                moment(p.from).format(xLabelFormats.hour) +\n                    ' - ' +\n                    moment(p.to ?? p.from).format(xLabelFormats.hour),\n                1,\n            ]);\n        }\n    } else if (resolution === 'day') {\n        if (width / periods.length < 40) {\n            let month = -1;\n\n            for (const p of periods) {\n                const m = p.from.getMonth();\n\n                if (m === month) {\n                    labels[labels.length - 1][1]++;\n\n                    continue;\n                }\n\n                month = m;\n                labels.push([moment(p.from).format(xLabelFormats.month), 1]);\n            }\n        } else {\n            labels = periods.map(p => [moment(p.from).format(xLabelFormats.day), 1]);\n        }\n    } else if (resolution === 'week') {\n        if (width / periods.length < 76) {\n            let month = -1;\n\n            for (const p of periods) {\n                const m = p.from.getMonth();\n\n                if (m === month || (month > 0 && p.from.getDate() < 4)) {\n                    labels[labels.length - 1][1]++;\n\n                    continue;\n                }\n\n                if (p.to && p.to.getDate() > 3) {\n                    month = p.to.getMonth();\n                    labels.push([moment(p.to).format(xLabelFormats.month), 1]);\n                } else {\n                    month = m;\n                    labels.push([moment(p.from).format(xLabelFormats.month), 1]);\n                }\n            }\n        } else {\n            labels = periods.map(p => [\n                moment(p.from).format(xLabelFormats.day) +\n                    ' - ' +\n                    moment(p.to ?? p.from).format(xLabelFormats.day),\n                1,\n            ]);\n        }\n    } else if (resolution === 'month') {\n        labels = periods.map(p => [moment(p.from).format(xLabelFormats.month), 1]);\n    }\n\n    return labels;\n};\n\nexport const periodDateTitleFormatter: Record<\n    LineChartResolution,\n    (period: LineChartPeriod) => string\n> = {\n    hour: period =>\n        moment(period.from).format('MM/DD') +\n        ' ' +\n        moment(period.from).format('HH:mm') +\n        ' - ' +\n        moment(period.to).format('HH:mm'),\n    day: period => moment(period.from).format('MMMM DD, YYYY'),\n    month: period => moment(period.from).format('MMMM YYYY'),\n    week: period =>\n        moment(period.from).format('MM/DD/YYYY') + '-' + moment(period.to).format('MM/DD/YYYY'),\n};\n"],"names":["moment","xLabelFormats","hour","day","month","getXLabels","periods","resolution","width","labels","length","p","d","from","getDay","push","format","map","to","m","getMonth","getDate","periodDateTitleFormatter","period","week"],"mappings":"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"}

package/dist/components/charts/pie-chart/components/pie-chart.js

@@ -5,12 +5,66 @@ import { BodyText, Stack, StatusLight } from '@servicetitan/design-system';
 import { convertSessionsToPieces, radiusRelativeDefault } from '../utils/const';
 import { Pie } from './pie';
 import * as Styles from './pie-chart.module.less';
-const PieTitles = ({ title, pieces }) => {
-    return (_jsx("div", { className: classNames(Styles.titleWrapper, 'of-y-auto p-t-2'), children: _jsxs("div", { children: [!!pieces.length && (_jsx(Stack.Item, { className: "p-l-1 p-b-1", children: _jsx(BodyText, { bold: true, children: title }) })), pieces.map(piece => (_jsxs(Stack, { alignItems: "center", children: [_jsx(StatusLight, { color: piece.color }), _jsx(BodyText, { className: "c-neutral-90", size: "medium", children: piece.title })] }, piece.title)))] }) }));
+const PieTitles = ({ title, pieces })=>{
+    return /*#__PURE__*/ _jsx("div", {
+        className: classNames(Styles.titleWrapper, 'of-y-auto p-t-2'),
+        children: /*#__PURE__*/ _jsxs("div", {
+            children: [
+                !!pieces.length && /*#__PURE__*/ _jsx(Stack.Item, {
+                    className: "p-l-1 p-b-1",
+                    children: /*#__PURE__*/ _jsx(BodyText, {
+                        bold: true,
+                        children: title
+                    })
+                }),
+                pieces.map((piece)=>/*#__PURE__*/ _jsxs(Stack, {
+                        alignItems: "center",
+                        children: [
+                            /*#__PURE__*/ _jsx(StatusLight, {
+                                color: piece.color
+                            }),
+                            /*#__PURE__*/ _jsx(BodyText, {
+                                className: "c-neutral-90",
+                                size: "medium",
+                                children: piece.title
+                            })
+                        ]
+                    }, piece.title))
+            ]
+        })
+    });
 };
-export const PieChart = ({ height, width, title, sections, popoverContent, content, radiusRelative = radiusRelativeDefault, popoverDirection = 'rb', hideTitles = false, }) => {
-    const pieces = useMemo(() => convertSessionsToPieces(sections, radiusRelative), [sections, radiusRelative]);
-    const style = useMemo(() => ({ height, width }), [height, width]);
-    return (_jsxs("div", { className: "d-f flex-row", style: style, children: [_jsx(Pie, { title: title, pieces: pieces, content: content, popoverContent: popoverContent, popoverDirection: popoverDirection, radiusRelative: radiusRelative, hideTitles: hideTitles }), !hideTitles && _jsx(PieTitles, { title: title, pieces: pieces })] }));
+export const PieChart = ({ height, width, title, sections, popoverContent, content, radiusRelative = radiusRelativeDefault, popoverDirection = 'rb', hideTitles = false })=>{
+    const pieces = useMemo(()=>convertSessionsToPieces(sections, radiusRelative), [
+        sections,
+        radiusRelative
+    ]);
+    const style = useMemo(()=>({
+            height,
+            width
+        }), [
+        height,
+        width
+    ]);
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "d-f flex-row",
+        style: style,
+        children: [
+            /*#__PURE__*/ _jsx(Pie, {
+                title: title,
+                pieces: pieces,
+                content: content,
+                popoverContent: popoverContent,
+                popoverDirection: popoverDirection,
+                radiusRelative: radiusRelative,
+                hideTitles: hideTitles
+            }),
+            !hideTitles && /*#__PURE__*/ _jsx(PieTitles, {
+                title: title,
+                pieces: pieces
+            })
+        ]
+    });
 };
+
 //# sourceMappingURL=pie-chart.js.map

package/dist/components/charts/pie-chart/components/pie-chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"pie-chart.js","sourceRoot":"","sources":["../../../../../src/components/charts/pie-chart/components/pie-chart.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAM,MAAM,OAAO,CAAC;AACpC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE3E,OAAO,EAAE,uBAAuB,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAChF,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,OAAO,KAAK,MAAM,MAAM,yBAAyB,CAAC;AAElD,MAAM,SAAS,GAA8C,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE;IAC/E,OAAO,CACH,cAAK,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,YAAY,EAAE,iBAAiB,CAAC,YAC9D,0BACK,CAAC,CAAC,MAAM,CAAC,MAAM,IAAI,CAChB,KAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAC,aAAa,YAC/B,KAAC,QAAQ,IAAC,IAAI,kBAAE,KAAK,GAAY,GACxB,CAChB,EACA,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CACjB,MAAC,KAAK,IAAmB,UAAU,EAAC,QAAQ,aACxC,KAAC,WAAW,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,GAAI,EACnC,KAAC,QAAQ,IAAC,SAAS,EAAC,cAAc,EAAC,IAAI,EAAC,QAAQ,YAC3C,KAAK,CAAC,KAAK,GACL,KAJH,KAAK,CAAC,KAAK,CAKf,CACX,CAAC,IACA,GACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAsB,CAAC,EACxC,MAAM,EACN,KAAK,EACL,KAAK,EACL,QAAQ,EACR,cAAc,EACd,OAAO,EACP,cAAc,GAAG,qBAAqB,EACtC,gBAAgB,GAAG,IAAI,EACvB,UAAU,GAAG,KAAK,GACrB,EAAE,EAAE;IACD,MAAM,MAAM,GAAG,OAAO,CAClB,GAAG,EAAE,CAAC,uBAAuB,CAAC,QAAQ,EAAE,cAAc,CAAC,EACvD,CAAC,QAAQ,EAAE,cAAc,CAAC,CAC7B,CAAC;IACF,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC;IAElE,OAAO,CACH,eAAK,SAAS,EAAC,cAAc,EAAC,KAAK,EAAE,KAAK,aACtC,KAAC,GAAG,IACA,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,GACxB,EACD,CAAC,UAAU,IAAI,KAAC,SAAS,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,GAAI,IACzD,CACT,CAAC;AACN,CAAC,CAAC"}
+{"version":3,"sources":["../../../../../src/components/charts/pie-chart/components/pie-chart.tsx"],"sourcesContent":["import { useMemo, FC } from 'react';\nimport classNames from 'classnames';\nimport { BodyText, Stack, StatusLight } from '@servicetitan/design-system';\nimport { PieChartProps, PiePiece } from '../utils/interface';\nimport { convertSessionsToPieces, radiusRelativeDefault } from '../utils/const';\nimport { Pie } from './pie';\nimport * as Styles from './pie-chart.module.less';\n\nconst PieTitles: FC<{ title: string; pieces: PiePiece[] }> = ({ title, pieces }) => {\n    return (\n        <div className={classNames(Styles.titleWrapper, 'of-y-auto p-t-2')}>\n            <div>\n                {!!pieces.length && (\n                    <Stack.Item className=\"p-l-1 p-b-1\">\n                        <BodyText bold>{title}</BodyText>\n                    </Stack.Item>\n                )}\n                {pieces.map(piece => (\n                    <Stack key={piece.title} alignItems=\"center\">\n                        <StatusLight color={piece.color} />\n                        <BodyText className=\"c-neutral-90\" size=\"medium\">\n                            {piece.title}\n                        </BodyText>\n                    </Stack>\n                ))}\n            </div>\n        </div>\n    );\n};\n\nexport const PieChart: FC<PieChartProps> = ({\n    height,\n    width,\n    title,\n    sections,\n    popoverContent,\n    content,\n    radiusRelative = radiusRelativeDefault,\n    popoverDirection = 'rb',\n    hideTitles = false,\n}) => {\n    const pieces = useMemo(\n        () => convertSessionsToPieces(sections, radiusRelative),\n        [sections, radiusRelative]\n    );\n    const style = useMemo(() => ({ height, width }), [height, width]);\n\n    return (\n        <div className=\"d-f flex-row\" style={style}>\n            <Pie\n                title={title}\n                pieces={pieces}\n                content={content}\n                popoverContent={popoverContent}\n                popoverDirection={popoverDirection}\n                radiusRelative={radiusRelative}\n                hideTitles={hideTitles}\n            />\n            {!hideTitles && <PieTitles title={title} pieces={pieces} />}\n        </div>\n    );\n};\n"],"names":["useMemo","classNames","BodyText","Stack","StatusLight","convertSessionsToPieces","radiusRelativeDefault","Pie","Styles","PieTitles","title","pieces","div","className","titleWrapper","length","Item","bold","map","piece","alignItems","color","size","PieChart","height","width","sections","popoverContent","content","radiusRelative","popoverDirection","hideTitles","style"],"mappings":";AAAA,SAASA,OAAO,QAAY,QAAQ;AACpC,OAAOC,gBAAgB,aAAa;AACpC,SAASC,QAAQ,EAAEC,KAAK,EAAEC,WAAW,QAAQ,8BAA8B;AAE3E,SAASC,uBAAuB,EAAEC,qBAAqB,QAAQ,iBAAiB;AAChF,SAASC,GAAG,QAAQ,QAAQ;AAC5B,YAAYC,YAAY,0BAA0B;AAElD,MAAMC,YAAuD,CAAC,EAAEC,KAAK,EAAEC,MAAM,EAAE;IAC3E,qBACI,KAACC;QAAIC,WAAWZ,WAAWO,OAAOM,YAAY,EAAE;kBAC5C,cAAA,MAACF;;gBACI,CAAC,CAACD,OAAOI,MAAM,kBACZ,KAACZ,MAAMa,IAAI;oBAACH,WAAU;8BAClB,cAAA,KAACX;wBAASe,IAAI;kCAAEP;;;gBAGvBC,OAAOO,GAAG,CAACC,CAAAA,sBACR,MAAChB;wBAAwBiB,YAAW;;0CAChC,KAAChB;gCAAYiB,OAAOF,MAAME,KAAK;;0CAC/B,KAACnB;gCAASW,WAAU;gCAAeS,MAAK;0CACnCH,MAAMT,KAAK;;;uBAHRS,MAAMT,KAAK;;;;AAU3C;AAEA,OAAO,MAAMa,WAA8B,CAAC,EACxCC,MAAM,EACNC,KAAK,EACLf,KAAK,EACLgB,QAAQ,EACRC,cAAc,EACdC,OAAO,EACPC,iBAAiBvB,qBAAqB,EACtCwB,mBAAmB,IAAI,EACvBC,aAAa,KAAK,EACrB;IACG,MAAMpB,SAASX,QACX,IAAMK,wBAAwBqB,UAAUG,iBACxC;QAACH;QAAUG;KAAe;IAE9B,MAAMG,QAAQhC,QAAQ,IAAO,CAAA;YAAEwB;YAAQC;QAAM,CAAA,GAAI;QAACD;QAAQC;KAAM;IAEhE,qBACI,MAACb;QAAIC,WAAU;QAAemB,OAAOA;;0BACjC,KAACzB;gBACGG,OAAOA;gBACPC,QAAQA;gBACRiB,SAASA;gBACTD,gBAAgBA;gBAChBG,kBAAkBA;gBAClBD,gBAAgBA;gBAChBE,YAAYA;;YAEf,CAACA,4BAAc,KAACtB;gBAAUC,OAAOA;gBAAOC,QAAQA;;;;AAG7D,EAAE"}

package/dist/components/charts/pie-chart/components/pie-chart.module.less.d.ts

@@ -0,0 +1,3 @@
+export const __esModule: true;
+export const titleWrapper: string;
+

package/dist/components/charts/pie-chart/components/pie.js

@@ -4,52 +4,189 @@ import { tokens } from '@servicetitan/tokens/core';
 import { BodyText, Popover, Stack, StatusLight } from '@servicetitan/design-system';
 import { useClientRect } from '../../../../utils/use-client-rect';
 const chartPadding = 8;
-const px = (value) => `${value !== null && value !== void 0 ? value : 0}px`;
-const PiePieceSvg = ({ piece: { id, color, opacity, points, text, path }, selected }) => points && path ? (_jsxs("g", { id: id, children: [!!selected && (_jsx("path", { d: path, fill: tokens.colorWhite, stroke: tokens.colorBlue200, strokeOpacity: "50%", strokeWidth: "3", paintOrder: "stroke" })), _jsx("path", { d: path, fill: color }), _jsx("svg", { x: points[4][0] - 10, y: points[4][1] - (points[4][1] > 0 ? 3 : 1), width: 20, height: 6, children: _jsx("text", { x: "50%", y: "50%", fontSize: 4, fontWeight: 600, fill: opacity > 0.3 ? tokens.colorWhite : tokens.colorBlack, dominantBaseline: "middle", textAnchor: "middle", children: text }) })] })) : null;
-const PiePieceHover = ({ piece, onMouse }) => {
-    const onMouseEnter = useCallback(() => onMouse(piece.id, true), [onMouse, piece.id]);
-    const onMouseLeave = useCallback(() => onMouse(piece.id, false), [onMouse, piece.id]);
-    return (_jsx("path", { d: piece.path, fill: "white", opacity: "0", onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }));
+const px = (value)=>`${value !== null && value !== void 0 ? value : 0}px`;
+const PiePieceSvg = ({ piece: { id, color, opacity, points, text, path }, selected })=>points && path ? /*#__PURE__*/ _jsxs("g", {
+        id: id,
+        children: [
+            !!selected && /*#__PURE__*/ _jsx("path", {
+                d: path,
+                fill: tokens.colorWhite,
+                stroke: tokens.colorBlue200,
+                strokeOpacity: "50%",
+                strokeWidth: "3",
+                paintOrder: "stroke"
+            }),
+            /*#__PURE__*/ _jsx("path", {
+                d: path,
+                fill: color
+            }),
+            /*#__PURE__*/ _jsx("svg", {
+                x: points[4][0] - 10,
+                y: points[4][1] - (points[4][1] > 0 ? 3 : 1),
+                width: 20,
+                height: 6,
+                children: /*#__PURE__*/ _jsx("text", {
+                    x: "50%",
+                    y: "50%",
+                    fontSize: 4,
+                    fontWeight: 600,
+                    fill: opacity > 0.3 ? tokens.colorWhite : tokens.colorBlack,
+                    dominantBaseline: "middle",
+                    textAnchor: "middle",
+                    children: text
+                })
+            })
+        ]
+    }) : null;
+const PiePieceHover = ({ piece, onMouse })=>{
+    const onMouseEnter = useCallback(()=>onMouse(piece.id, true), [
+        onMouse,
+        piece.id
+    ]);
+    const onMouseLeave = useCallback(()=>onMouse(piece.id, false), [
+        onMouse,
+        piece.id
+    ]);
+    return /*#__PURE__*/ _jsx("path", {
+        d: piece.path,
+        fill: "white",
+        opacity: "0",
+        onMouseEnter: onMouseEnter,
+        onMouseLeave: onMouseLeave
+    });
 };
-const PieSvg = ({ pieces, selectedIndex, radiusRelative }) => (_jsxs("svg", { className: "position-absolute", style: { inset: px(chartPadding) }, viewBox: `-${radiusRelative} -${radiusRelative} ` + `${radiusRelative * 2} ${radiusRelative * 2}`, children: [pieces.map((p, index) => p.path ? _jsx(PiePieceSvg, { piece: p, selected: index === selectedIndex }, p.id) : null), selectedIndex >= 0 && selectedIndex < pieces.length && (_jsx("use", { xlinkHref: pieces[selectedIndex].id }))] }));
-const PieSvgHover = ({ pieces, onMouse, radiusRelative }) => (_jsx("svg", { className: "position-absolute z-global-nav", style: { inset: px(chartPadding) }, viewBox: `-${radiusRelative} -${radiusRelative} ` + `${radiusRelative * 2} ${radiusRelative * 2}`, children: pieces.map(p => p.path ? _jsx(PiePieceHover, { piece: p, onMouse: onMouse }, p.id) : null) }));
-export const Pie = ({ pieces, popoverContent: PopoverContent, content: PieContent, radiusRelative, hideTitles, popoverDirection, }) => {
+const PieSvg = ({ pieces, selectedIndex, radiusRelative })=>/*#__PURE__*/ _jsxs("svg", {
+        className: "position-absolute",
+        style: {
+            inset: px(chartPadding)
+        },
+        viewBox: `-${radiusRelative} -${radiusRelative} ` + `${radiusRelative * 2} ${radiusRelative * 2}`,
+        children: [
+            pieces.map((p, index)=>p.path ? /*#__PURE__*/ _jsx(PiePieceSvg, {
+                    piece: p,
+                    selected: index === selectedIndex
+                }, p.id) : null),
+            selectedIndex >= 0 && selectedIndex < pieces.length && /*#__PURE__*/ _jsx("use", {
+                xlinkHref: pieces[selectedIndex].id
+            })
+        ]
+    });
+const PieSvgHover = ({ pieces, onMouse, radiusRelative })=>/*#__PURE__*/ _jsx("svg", {
+        className: "position-absolute z-global-nav",
+        style: {
+            inset: px(chartPadding)
+        },
+        viewBox: `-${radiusRelative} -${radiusRelative} ` + `${radiusRelative * 2} ${radiusRelative * 2}`,
+        children: pieces.map((p)=>p.path ? /*#__PURE__*/ _jsx(PiePieceHover, {
+                piece: p,
+                onMouse: onMouse
+            }, p.id) : null)
+    });
+export const Pie = ({ pieces, popoverContent: PopoverContent, content: PieContent, radiusRelative, hideTitles, popoverDirection })=>{
     const [selectedIndex, setSelectedIndex] = useState(-1);
     const [rect, ref] = useClientRect();
-    const onMouse = useCallback((id, isEnter) => {
-        setSelectedIndex(isEnter ? pieces.findIndex(p => p.id === id) : -1);
-    }, [pieces, setSelectedIndex]);
-    const container = useMemo(() => {
-        var _a;
-        const height = (_a = rect === null || rect === void 0 ? void 0 : rect.height) !== null && _a !== void 0 ? _a : 0;
+    const onMouse = useCallback((id, isEnter)=>{
+        setSelectedIndex(isEnter ? pieces.findIndex((p)=>p.id === id) : -1);
+    }, [
+        pieces,
+        setSelectedIndex
+    ]);
+    const container = useMemo(()=>{
+        var _rect_height;
+        const height = (_rect_height = rect === null || rect === void 0 ? void 0 : rect.height) !== null && _rect_height !== void 0 ? _rect_height : 0;
         return {
             height,
             internal: height ? height - chartPadding * 2 : 0,
-            styles: height
-                ? {
-                    width: px(Math.max(250, height)),
-                    overflow: 'hidden',
-                }
-                : {},
+            styles: height ? {
+                width: px(Math.max(250, height)),
+                overflow: 'hidden'
+            } : {}
         };
-    }, [rect]);
-    const triggersStyles = useMemo(() => container.height
-        ? pieces.map(p => p.points
-            ? {
+    }, [
+        rect
+    ]);
+    const triggersStyles = useMemo(()=>container.height ? pieces.map((p)=>p.points ? {
                 key: p.key,
-                top: px((container.height * (radiusRelative + p.points[4][1])) /
-                    (radiusRelative * 2)),
-                left: px((container.height * (radiusRelative + p.points[4][0])) /
-                    (radiusRelative * 2) +
-                    20),
-            }
-            : { top: '', left: '' })
-        : [], [pieces, container, radiusRelative]);
-    return (_jsx("div", { ref: ref, style: container.styles, className: "position-relative", children: pieces.every(p => !p.path) ? (_jsx(Stack, { className: "h-100", justifyContent: "center", alignItems: "center", children: "No Data" })) : (_jsxs(Fragment, { children: [triggersStyles
-                    .filter(ts => !!ts.left && !!ts.top)
-                    .map((ts, ind) => {
-                    var _a, _b, _c;
-                    return (_jsx("div", { style: ts, className: "position-absolute", children: (!!PopoverContent || !hideTitles) && (_jsx(Popover, { portal: true, trigger: _jsx("span", { children: " " }), open: selectedIndex === ind, direction: popoverDirection, padding: "s", width: "auto", children: selectedIndex === ind && (_jsxs(Stack, { direction: "column", "data-cy": `customer-lead-rate-section-${ts.key}-popover`, children: [!hideTitles && (_jsxs(Stack, { alignItems: "center", children: [_jsx(StatusLight, { color: pieces[ind].color }), _jsx(BodyText, { size: "small", bold: true, children: pieces[ind].title })] })), !!PopoverContent && (_jsx(Stack.Item, { className: "m-l-1", children: _jsx(PopoverContent, { index: ind, data: (_a = pieces[ind]) === null || _a === void 0 ? void 0 : _a.data, text: (_b = pieces[ind]) === null || _b === void 0 ? void 0 : _b.text, value: (_c = pieces[ind]) === null || _c === void 0 ? void 0 : _c.value }) }))] })) })) }, ts.left + ts.top));
-                }), !!PieContent && _jsx(PieContent, {}), _jsx(PieSvg, { pieces: pieces, selectedIndex: selectedIndex, radiusRelative: radiusRelative }), _jsx(PieSvgHover, { pieces: pieces, onMouse: onMouse, radiusRelative: radiusRelative })] })) }));
+                top: px(container.height * (radiusRelative + p.points[4][1]) / (radiusRelative * 2)),
+                left: px(container.height * (radiusRelative + p.points[4][0]) / (radiusRelative * 2) + 20)
+            } : {
+                top: '',
+                left: ''
+            }) : [], [
+        pieces,
+        container,
+        radiusRelative
+    ]);
+    return /*#__PURE__*/ _jsx("div", {
+        ref: ref,
+        style: container.styles,
+        className: "position-relative",
+        children: pieces.every((p)=>!p.path) ? /*#__PURE__*/ _jsx(Stack, {
+            className: "h-100",
+            justifyContent: "center",
+            alignItems: "center",
+            children: "No Data"
+        }) : /*#__PURE__*/ _jsxs(Fragment, {
+            children: [
+                triggersStyles.filter((ts)=>!!ts.left && !!ts.top).map((ts, ind)=>{
+                    var _pieces_ind, _pieces_ind1, _pieces_ind2;
+                    return /*#__PURE__*/ _jsx("div", {
+                        style: ts,
+                        className: "position-absolute",
+                        children: (!!PopoverContent || !hideTitles) && /*#__PURE__*/ _jsx(Popover, {
+                            portal: true,
+                            trigger: /*#__PURE__*/ _jsx("span", {
+                                children: " "
+                            }),
+                            open: selectedIndex === ind,
+                            direction: popoverDirection,
+                            padding: "s",
+                            width: "auto",
+                            children: selectedIndex === ind && /*#__PURE__*/ _jsxs(Stack, {
+                                direction: "column",
+                                "data-cy": `customer-lead-rate-section-${ts.key}-popover`,
+                                children: [
+                                    !hideTitles && /*#__PURE__*/ _jsxs(Stack, {
+                                        alignItems: "center",
+                                        children: [
+                                            /*#__PURE__*/ _jsx(StatusLight, {
+                                                color: pieces[ind].color
+                                            }),
+                                            /*#__PURE__*/ _jsx(BodyText, {
+                                                size: "small",
+                                                bold: true,
+                                                children: pieces[ind].title
+                                            })
+                                        ]
+                                    }),
+                                    !!PopoverContent && /*#__PURE__*/ _jsx(Stack.Item, {
+                                        className: "m-l-1",
+                                        children: /*#__PURE__*/ _jsx(PopoverContent, {
+                                            index: ind,
+                                            data: (_pieces_ind = pieces[ind]) === null || _pieces_ind === void 0 ? void 0 : _pieces_ind.data,
+                                            text: (_pieces_ind1 = pieces[ind]) === null || _pieces_ind1 === void 0 ? void 0 : _pieces_ind1.text,
+                                            value: (_pieces_ind2 = pieces[ind]) === null || _pieces_ind2 === void 0 ? void 0 : _pieces_ind2.value
+                                        })
+                                    })
+                                ]
+                            })
+                        })
+                    }, ts.left + ts.top);
+                }),
+                !!PieContent && /*#__PURE__*/ _jsx(PieContent, {}),
+                /*#__PURE__*/ _jsx(PieSvg, {
+                    pieces: pieces,
+                    selectedIndex: selectedIndex,
+                    radiusRelative: radiusRelative
+                }),
+                /*#__PURE__*/ _jsx(PieSvgHover, {
+                    pieces: pieces,
+                    onMouse: onMouse,
+                    radiusRelative: radiusRelative
+                })
+            ]
+        })
+    });
 };
+
 //# sourceMappingURL=pie.js.map