@servicetitan/marketing-ui 4.1.0 → 5.0.0
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/dist/components/charts/funnel-chart/funnel-chart.stories.d.ts +3 -3
- package/dist/components/charts/funnel-chart/funnel-chart.stories.d.ts.map +1 -1
- package/dist/components/charts/line-chart/line-chart.stories.d.ts +4 -4
- package/dist/components/charts/line-chart/line-chart.stories.d.ts.map +1 -1
- package/dist/components/charts/pie-chart/pie-chart.stories.d.ts +4 -4
- package/dist/components/charts/pie-chart/pie-chart.stories.d.ts.map +1 -1
- package/dist/components/image-cropper/image-cropper.d.ts.map +1 -1
- package/dist/components/image-cropper/image-cropper.stories.d.ts +1 -2
- package/dist/components/image-cropper/image-cropper.stories.d.ts.map +1 -1
- package/dist/components/stat/stat-card.d.ts +2 -1
- package/dist/components/stat/stat-card.d.ts.map +1 -1
- package/dist/components/stat/stat-card.js +8 -4
- package/dist/components/stat/stat-card.js.map +1 -1
- package/dist/components/stat/stat-cards.stories.d.ts +6 -5
- package/dist/components/stat/stat-cards.stories.d.ts.map +1 -1
- package/dist/components/stat/stat-cards.stories.js +2 -0
- package/dist/components/stat/stat-cards.stories.js.map +1 -1
- package/dist/components/stat/stat-extended-card.stories.d.ts +3 -3
- package/dist/components/stat/stat-extended-card.stories.d.ts.map +1 -1
- package/dist/components/ui/action-button/action-button.stories.d.ts +2 -2
- package/dist/components/ui/action-button/action-button.stories.d.ts.map +1 -1
- package/dist/components/ui/centered-spinner/centered-spinner.stories.d.ts +3 -3
- package/dist/components/ui/centered-spinner/centered-spinner.stories.d.ts.map +1 -1
- package/dist/components/ui/date-range-picker/date-range-picker.d.ts.map +1 -1
- package/dist/components/ui/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/ui/date-range-picker/date-range-picker.stories.d.ts +2 -2
- package/dist/components/ui/date-range-picker/date-range-picker.stories.d.ts.map +1 -1
- package/dist/components/ui/label-with-hint/label-with-hint.stories.d.ts +3 -3
- package/dist/components/ui/label-with-hint/label-with-hint.stories.d.ts.map +1 -1
- package/dist/components/ui/line-text/line-text-body.stories.d.ts +2 -2
- package/dist/components/ui/line-text/line-text-body.stories.d.ts.map +1 -1
- package/dist/components/ui/line-text/line-text-head.stories.d.ts +2 -2
- package/dist/components/ui/line-text/line-text-head.stories.d.ts.map +1 -1
- package/dist/components/ui/title-popover/title-popover.d.ts +2 -2
- package/dist/components/ui/title-popover/title-popover.d.ts.map +1 -1
- package/dist/components/ui/title-popover/title-popover.js.map +1 -1
- package/dist/components/ui/title-popover/title-popover.stories.d.ts +2 -3
- package/dist/components/ui/title-popover/title-popover.stories.d.ts.map +1 -1
- package/package.json +9 -9
- package/src/components/charts/funnel-chart/components/funnel-chart.module.less.d.ts +4 -4
- package/src/components/charts/line-chart/components/hover-popover.module.less.d.ts +1 -1
- package/src/components/charts/line-chart/components/sidebar.module.less.d.ts +6 -6
- package/src/components/charts/line-chart/components/svg.module.less.d.ts +2 -2
- package/src/components/image-cropper/image-cropper.tsx +1 -1
- package/src/components/stat/stat-card.tsx +14 -2
- package/src/components/stat/stat-cards.stories.tsx +9 -0
- package/src/components/ui/action-button/action-button.module.less.d.ts +3 -3
- package/src/components/ui/date-range-picker/date-range-picker.tsx +1 -1
- package/src/components/ui/line-text/line-text.module.less.d.ts +3 -3
- package/src/components/ui/title-popover/title-popover.tsx +3 -3
|
@@ -5,7 +5,7 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const funnelChart3Sections: () => JSX.Element;
|
|
9
|
-
export declare const funnelChart4Sections: () => JSX.Element;
|
|
10
|
-
export declare const funnelChartCustomContent: () => JSX.Element;
|
|
8
|
+
export declare const funnelChart3Sections: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const funnelChart4Sections: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const funnelChartCustomContent: () => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
//# sourceMappingURL=funnel-chart.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"funnel-chart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/charts/funnel-chart/funnel-chart.stories.tsx"],"names":[],"mappings":";;;;;;AAIA,wBAIE;AA2CF,eAAO,MAAM,oBAAoB
|
|
1
|
+
{"version":3,"file":"funnel-chart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/charts/funnel-chart/funnel-chart.stories.tsx"],"names":[],"mappings":";;;;;;AAIA,wBAIE;AA2CF,eAAO,MAAM,oBAAoB,+CAE/B,CAAC;AAEH,eAAO,MAAM,oBAAoB,+CAsC/B,CAAC;AAEH,eAAO,MAAM,wBAAwB,+CAQnC,CAAC"}
|
|
@@ -5,10 +5,10 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const lineChartDailyBottomTitles: () => JSX.Element;
|
|
9
|
-
export declare const stackedBarChartDailyBottomTitles: () => JSX.Element;
|
|
10
|
-
export declare const groupedBarChartDailyBottomTitles: () => JSX.Element;
|
|
11
|
-
export declare const lineChartWeekly: () => JSX.Element;
|
|
8
|
+
export declare const lineChartDailyBottomTitles: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const stackedBarChartDailyBottomTitles: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const groupedBarChartDailyBottomTitles: () => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export declare const lineChartWeekly: () => import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
export declare const lineChartMergedDays: FC;
|
|
13
13
|
export declare const lineChartIndexes: FC;
|
|
14
14
|
//# sourceMappingURL=line-chart.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"line-chart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/charts/line-chart/line-chart.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;;;;;;AAIrC,wBAIE;AAkFF,eAAO,MAAM,0BAA0B,
|
|
1
|
+
{"version":3,"file":"line-chart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/charts/line-chart/line-chart.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;;;;;;AAIrC,wBAIE;AAkFF,eAAO,MAAM,0BAA0B,+CA4BtC,CAAC;AAEF,eAAO,MAAM,gCAAgC,+CAkC5C,CAAC;AAEF,eAAO,MAAM,gCAAgC,+CAkC5C,CAAC;AAEF,eAAO,MAAM,eAAe,+CA2B3B,CAAC;AA2BF,eAAO,MAAM,mBAAmB,EAAE,EA8BjC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,EA8B9B,CAAC"}
|
|
@@ -5,8 +5,8 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const pieChart5AutoColor: () => JSX.Element;
|
|
9
|
-
export declare const pieChartWithContent: () => JSX.Element;
|
|
10
|
-
export declare const pieChart1CustomColor: () => JSX.Element;
|
|
11
|
-
export declare const pieChartNoData: () => JSX.Element;
|
|
8
|
+
export declare const pieChart5AutoColor: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const pieChartWithContent: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const pieChart1CustomColor: () => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export declare const pieChartNoData: () => import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
//# sourceMappingURL=pie-chart.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pie-chart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/charts/pie-chart/pie-chart.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAEF,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"pie-chart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/charts/pie-chart/pie-chart.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAEF,eAAO,MAAM,kBAAkB,+CAa9B,CAAC;AAEF,eAAO,MAAM,mBAAmB,+CAiB/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,+CAMhC,CAAC;AAEF,eAAO,MAAM,cAAc,+CAAkE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image-cropper.d.ts","sourceRoot":"","sources":["../../../src/components/image-cropper/image-cropper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIlC,OAAO,qCAAqC,CAAC;AAE7C,UAAU,iBAAiB;IACvB,IAAI,EAAE,IAAI,CAAC;IACX,IAAI,EAAE;QACF,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAClB,CAAC;CACL;AAED,qBACa,YAAa,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC9C,OAAO,CAAC,GAAG,CAAC,CAAS;IACrB,OAAO,CAAC,IAAI,CAAC,CAAO;IACpB,OAAO,CAAC,KAAK,CAAC,CAAmB;gBAEjC,KAAK,EAAE,iBAAiB;IAKpC,aAAa,SAAU,MAAM,YAAY,MAAM,+BA2CxC;IAGP,iBAAiB,eAA2D;IAE5E,oBAAoB,aAIlB;IAEF,MAAM;
|
|
1
|
+
{"version":3,"file":"image-cropper.d.ts","sourceRoot":"","sources":["../../../src/components/image-cropper/image-cropper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIlC,OAAO,qCAAqC,CAAC;AAE7C,UAAU,iBAAiB;IACvB,IAAI,EAAE,IAAI,CAAC;IACX,IAAI,EAAE;QACF,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAClB,CAAC;CACL;AAED,qBACa,YAAa,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC9C,OAAO,CAAC,GAAG,CAAC,CAAS;IACrB,OAAO,CAAC,IAAI,CAAC,CAAO;IACpB,OAAO,CAAC,KAAK,CAAC,CAAmB;gBAEjC,KAAK,EAAE,iBAAiB;IAKpC,aAAa,SAAU,MAAM,YAAY,MAAM,+BA2CxC;IAGP,iBAAiB,eAA2D;IAE5E,oBAAoB,aAIlB;IAEF,MAAM,IAAI,GAAG,CAAC,OAAO,GAAG,IAAI;IAa5B,OAAO,CAAC,YAAY,CAAsC;IAG1D,OAAO,CAAC,iBAAiB,CAWvB;CACL"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { ImageCropper } from './image-cropper';
|
|
3
2
|
declare const _default: {
|
|
4
3
|
title: string;
|
|
@@ -6,5 +5,5 @@ declare const _default: {
|
|
|
6
5
|
parameters: {};
|
|
7
6
|
};
|
|
8
7
|
export default _default;
|
|
9
|
-
export declare const basic: () => JSX.Element;
|
|
8
|
+
export declare const basic: () => import("react/jsx-runtime").JSX.Element;
|
|
10
9
|
//# sourceMappingURL=image-cropper.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image-cropper.stories.d.ts","sourceRoot":"","sources":["../../../src/components/image-cropper/image-cropper.stories.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"image-cropper.stories.d.ts","sourceRoot":"","sources":["../../../src/components/image-cropper/image-cropper.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;;;;;;AAE/C,wBAIE;AA6DF,eAAO,MAAM,KAAK,+CAAyB,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
|
2
2
|
import { BodyTextPropsStrict } from '@servicetitan/design-system';
|
|
3
3
|
import { NumberFormatter } from '../../utils/formatters';
|
|
4
4
|
interface StatDiffProps {
|
|
@@ -15,6 +15,7 @@ export declare const StatDiff: FC<StatDiffProps>;
|
|
|
15
15
|
export interface StatCardProps {
|
|
16
16
|
title: string;
|
|
17
17
|
description?: string;
|
|
18
|
+
popoverContent?: ReactNode;
|
|
18
19
|
value?: number;
|
|
19
20
|
prev?: number;
|
|
20
21
|
percent?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAEhD,OAAO,EAEH,mBAAmB,EAKtB,MAAM,6BAA6B,CAAC;AAErC,OAAO,EAAe,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAgCtE,UAAU,aAAa;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;IACnC,MAAM,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAiDtC,CAAC;AAEF,MAAM,WAAW,aAAa;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAyEtC,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState } from 'react';
|
|
2
3
|
import classNames from 'classnames';
|
|
3
|
-
import { BodyText, Eyebrow, Stack, Tooltip, } from '@servicetitan/design-system';
|
|
4
|
+
import { BodyText, Eyebrow, Popover, Stack, Tooltip, } from '@servicetitan/design-system';
|
|
4
5
|
import * as Styles from './stat-card.module.less';
|
|
5
6
|
import { formatValue } from '../../utils/formatters';
|
|
6
7
|
const calculateDiff = (value, prev, percents) => {
|
|
@@ -50,13 +51,16 @@ export const StatDiff = ({ value, prev, size, format, inverted, neutral, classNa
|
|
|
50
51
|
'c-neutral-200': !!neutral,
|
|
51
52
|
}, className), size: size !== null && size !== void 0 ? size : 'small', "data-cy": "stat-diff-value" }, { children: [_jsx("span", { children: diff }), value === undefined ? '\u00A0' : text] })));
|
|
52
53
|
};
|
|
53
|
-
export const StatCard = ({ title, description, value, percent, money, rate, prev, clean, inverted, neutral, fill, valueOnly, className, diffPercentOnly = false, }) => {
|
|
54
|
+
export const StatCard = ({ title, description, popoverContent, value, percent, money, rate, prev, clean, inverted, neutral, fill, valueOnly, className, diffPercentOnly = false, }) => {
|
|
55
|
+
const [popoverShown, setPopoverShown] = useState(false);
|
|
54
56
|
const format = money ? 'money' : percent ? 'percent' : rate ? 'rate' : 'number';
|
|
55
57
|
const val = value === undefined ? '\u00A0' : formatValue(value, format);
|
|
56
|
-
const eyebrow = (_jsx(Eyebrow, Object.assign({ className: classNames(Styles.title, 'ta-center'), "data-cy": `marketing-stat-${title}-title
|
|
58
|
+
const eyebrow = (_jsx(Eyebrow, Object.assign({ className: classNames(Styles.title, 'ta-center'), "data-cy": `marketing-stat-${title}-title`, onMouseEnter: () => {
|
|
59
|
+
setPopoverShown(true);
|
|
60
|
+
} }, { children: title })));
|
|
57
61
|
return (_jsxs(Stack, Object.assign({ direction: "column", alignItems: "center", className: classNames('p-y-3', {
|
|
58
62
|
'bg-white border-radius-2 border': !clean,
|
|
59
63
|
'flex-grow-1 flex-basis-0': fill,
|
|
60
|
-
}, className) }, { children: [description ? (_jsx(Tooltip, Object.assign({ text: description, "data-cy": `marketing-stat-${title}-tooltip` }, { children: eyebrow }))) : (eyebrow), _jsx(BodyText, Object.assign({ className: "fs-6-i ff-display", "data-cy": `marketing-stat-${title}-value` }, { children: val })), !valueOnly && (_jsx(StatDiff, { value: value, prev: prev, format: format, inverted: inverted, neutral: neutral, diffPercentOnly: diffPercentOnly }))] })));
|
|
64
|
+
}, className), onMouseLeave: () => setPopoverShown(false) }, { children: [popoverContent ? (_jsx(Popover, Object.assign({ open: popoverShown, trigger: eyebrow }, { children: popoverContent }))) : description ? (_jsx(Tooltip, Object.assign({ text: description, "data-cy": `marketing-stat-${title}-tooltip` }, { children: eyebrow }))) : (eyebrow), _jsx(BodyText, Object.assign({ className: "fs-6-i ff-display", "data-cy": `marketing-stat-${title}-value` }, { children: val })), !valueOnly && (_jsx(StatDiff, { value: value, prev: prev, format: format, inverted: inverted, neutral: neutral, diffPercentOnly: diffPercentOnly }))] })));
|
|
61
65
|
};
|
|
62
66
|
//# sourceMappingURL=stat-card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-card.js","sourceRoot":"","sources":["../../../src/components/stat/stat-card.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"stat-card.js","sourceRoot":"","sources":["../../../src/components/stat/stat-card.tsx"],"names":[],"mappings":"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"}
|
|
@@ -5,9 +5,10 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const statCardNumber: () => JSX.Element;
|
|
9
|
-
export declare const
|
|
10
|
-
export declare const
|
|
11
|
-
export declare const
|
|
12
|
-
export declare const
|
|
8
|
+
export declare const statCardNumber: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const statCardPopoverDescription: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const statDiffNumberPercentOnly: () => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export declare const statCardMoney: () => import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare const statCardPercentInverted: () => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export declare const statCardRate: () => import("react/jsx-runtime").JSX.Element;
|
|
13
14
|
//# sourceMappingURL=stat-cards.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-cards.stories.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-cards.stories.tsx"],"names":[],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"stat-cards.stories.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-cards.stories.tsx"],"names":[],"mappings":";;;;;;AAIA,wBAIE;AAIF,eAAO,MAAM,cAAc,+CAA+D,CAAC;AAC3F,eAAO,MAAM,0BAA0B,+CAOrC,CAAC;AACH,eAAO,MAAM,yBAAyB,+CAEpC,CAAC;AACH,eAAO,MAAM,aAAa,+CAAuE,CAAC;AAClG,eAAO,MAAM,uBAAuB,+CAElC,CAAC;AACH,eAAO,MAAM,YAAY,+CAAiE,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { StatCard } from './stat-card';
|
|
3
|
+
import { BodyText } from '@servicetitan/design-system';
|
|
3
4
|
export default {
|
|
4
5
|
title: 'Marketing UI/stat/StatCard',
|
|
5
6
|
component: StatCard,
|
|
@@ -7,6 +8,7 @@ export default {
|
|
|
7
8
|
};
|
|
8
9
|
const w = (cb) => () => _jsx("div", Object.assign({ style: { width: '400px' } }, { children: cb() }));
|
|
9
10
|
export const statCardNumber = w(() => _jsx(StatCard, { title: "number", value: 133, prev: 1000 }));
|
|
11
|
+
export const statCardPopoverDescription = w(() => (_jsx(StatCard, { title: "number", value: 133, prev: 1000, popoverContent: _jsx(BodyText, { children: "Description" }) })));
|
|
10
12
|
export const statDiffNumberPercentOnly = w(() => (_jsx(StatCard, { title: "number", value: 133, prev: 1000, diffPercentOnly: true })));
|
|
11
13
|
export const statCardMoney = w(() => _jsx(StatCard, { title: "money", value: 10000, prev: 11000, money: true }));
|
|
12
14
|
export const statCardPercentInverted = w(() => (_jsx(StatCard, { title: "percent", value: 0.27, prev: 0.27333, percent: true, inverted: true })));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-cards.stories.js","sourceRoot":"","sources":["../../../src/components/stat/stat-cards.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"stat-cards.stories.js","sourceRoot":"","sources":["../../../src/components/stat/stat-cards.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,eAAe;IACX,KAAK,EAAE,4BAA4B;IACnC,SAAS,EAAE,QAAQ;IACnB,UAAU,EAAE,EAAE;CACjB,CAAC;AAEF,MAAM,CAAC,GAAG,CAAC,EAAsB,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC,4BAAK,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,gBAAG,EAAE,EAAE,IAAO,CAAC;AAEzF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAC,QAAQ,IAAC,KAAK,EAAC,QAAQ,EAAC,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,GAAI,CAAC,CAAC;AAC3F,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,CAC9C,KAAC,QAAQ,IACL,KAAK,EAAC,QAAQ,EACd,KAAK,EAAE,GAAG,EACV,IAAI,EAAE,IAAI,EACV,cAAc,EAAE,KAAC,QAAQ,8BAAuB,GAClD,CACL,CAAC,CAAC;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,CAC7C,KAAC,QAAQ,IAAC,KAAK,EAAC,QAAQ,EAAC,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,eAAe,SAAG,CACtE,CAAC,CAAC;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAC,QAAQ,IAAC,KAAK,EAAC,OAAO,EAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,SAAG,CAAC,CAAC;AAClG,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,CAC3C,KAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,EAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,QAAC,QAAQ,SAAG,CAC5E,CAAC,CAAC;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAC,QAAQ,IAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,SAAG,CAAC,CAAC"}
|
|
@@ -5,7 +5,7 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const statCardMoneyWithPrev: () => JSX.Element;
|
|
9
|
-
export declare const statCardMoneyWithGoal: () => JSX.Element;
|
|
10
|
-
export declare const statCardPercentWithPrev: () => JSX.Element;
|
|
8
|
+
export declare const statCardMoneyWithPrev: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const statCardMoneyWithGoal: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const statCardPercentWithPrev: () => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
//# sourceMappingURL=stat-extended-card.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-extended-card.stories.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-extended-card.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAIF,eAAO,MAAM,qBAAqB,
|
|
1
|
+
{"version":3,"file":"stat-extended-card.stories.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-extended-card.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAIF,eAAO,MAAM,qBAAqB,+CAUhC,CAAC;AACH,eAAO,MAAM,qBAAqB,+CAEhC,CAAC;AACH,eAAO,MAAM,uBAAuB,+CASlC,CAAC"}
|
|
@@ -5,6 +5,6 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const actionButtonHoverPrimary: () => JSX.Element;
|
|
9
|
-
export declare const actionButtonHoverNegative: () => JSX.Element;
|
|
8
|
+
export declare const actionButtonHoverPrimary: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const actionButtonHoverNegative: () => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
//# sourceMappingURL=action-button.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"action-button.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/action-button/action-button.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAKF,eAAO,MAAM,wBAAwB,
|
|
1
|
+
{"version":3,"file":"action-button.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/action-button/action-button.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAKF,eAAO,MAAM,wBAAwB,+CAEnC,CAAC;AAEH,eAAO,MAAM,yBAAyB,+CAEpC,CAAC"}
|
|
@@ -5,7 +5,7 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const centeredSpinnerTiny: () => JSX.Element;
|
|
9
|
-
export declare const centeredSpinner: () => JSX.Element;
|
|
10
|
-
export declare const centeredSpinnerTitled: () => JSX.Element;
|
|
8
|
+
export declare const centeredSpinnerTiny: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const centeredSpinner: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const centeredSpinnerTitled: () => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
//# sourceMappingURL=centered-spinner.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"centered-spinner.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/centered-spinner/centered-spinner.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAKF,eAAO,MAAM,mBAAmB
|
|
1
|
+
{"version":3,"file":"centered-spinner.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/centered-spinner/centered-spinner.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAKF,eAAO,MAAM,mBAAmB,+CAA+C,CAAC;AAChF,eAAO,MAAM,eAAe,+CAAoE,CAAC;AACjG,eAAO,MAAM,qBAAqB,+CAEhC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-range-picker.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/date-range-picker/date-range-picker.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAa,+BAA+B,EAAE,MAAM,qBAAqB,CAAC;AAGjF,MAAM,WAAW,oBAAoB,CAAC,UAAU,SAAS,MAAM;IAC3D,KAAK,EAAE,+BAA+B,CAAC,UAAU,CAAC,CAAC;IACnD,QAAQ,CAAC,EAAE,+BAA+B,CAAC,UAAU,CAAC,CAAC,UAAU,CAAC,CAAC;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAwBD,eAAO,MAAM,eAAe,
|
|
1
|
+
{"version":3,"file":"date-range-picker.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/date-range-picker/date-range-picker.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAa,+BAA+B,EAAE,MAAM,qBAAqB,CAAC;AAGjF,MAAM,WAAW,oBAAoB,CAAC,UAAU,SAAS,MAAM;IAC3D,KAAK,EAAE,+BAA+B,CAAC,UAAU,CAAC,CAAC;IACnD,QAAQ,CAAC,EAAE,+BAA+B,CAAC,UAAU,CAAC,CAAC,UAAU,CAAC,CAAC;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAwBD,eAAO,MAAM,eAAe,4GAMc,WA2EzC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-range-picker.js","sourceRoot":"","sources":["../../../../src/components/ui/date-range-picker/date-range-picker.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AAEpE,OAAO,KAAK,MAAM,MAAM,iCAAiC,CAAC;AAS1D,MAAM,gBAAgB,GAAG,CAAC,GAAe,EAAE,QAAkB,EAAyB,EAAE,CACpF,GAAG;IACC,CAAC,CAAC;QACI,KAAK,EAAE,GAAG,CAAC,KAAK;QAChB,GAAG,EAAE,IAAI,IAAI,CACT,GAAG,CAAC,GAAG,CAAC,WAAW,EAAE,EACrB,GAAG,CAAC,GAAG,CAAC,QAAQ,EAAE,EAClB,GAAG,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAC1C;KACJ;IACH,CAAC,CAAC,SAAS,CAAC;AAEpB,MAAM,UAAU,GAAG,CAAC,EAAQ,EAAE,EAAE,CAC5B,EAAE,CAAC,cAAc,CAAC,OAAO,EAAE;IACvB,GAAG,EAAE,SAAS;IACd,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,OAAO;CACjB,CAAC,CAAC;AAEP,MAAM,eAAe,GAAG,CAAC,KAAgB,EAAE,EAAE,CACzC,GAAG,UAAU,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC;AAE5D,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CACnC,CAA4B,EACxB,OAAO,EACP,QAAQ,EACR,KAAK,EACL,QAAQ,GACuB,
|
|
1
|
+
{"version":3,"file":"date-range-picker.js","sourceRoot":"","sources":["../../../../src/components/ui/date-range-picker/date-range-picker.tsx"],"names":[],"mappings":"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"}
|
|
@@ -5,6 +5,6 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const dateRangePicker: () => JSX.Element;
|
|
9
|
-
export declare const dateRangePickerCompare: () => JSX.Element;
|
|
8
|
+
export declare const dateRangePicker: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const dateRangePickerCompare: () => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
//# sourceMappingURL=date-range-picker.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-range-picker.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/date-range-picker/date-range-picker.stories.tsx"],"names":[],"mappings":";;;;;;AAIA,wBAIE;AAYF,eAAO,MAAM,eAAe,
|
|
1
|
+
{"version":3,"file":"date-range-picker.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/date-range-picker/date-range-picker.stories.tsx"],"names":[],"mappings":";;;;;;AAIA,wBAIE;AAYF,eAAO,MAAM,eAAe,+CAAiD,CAAC;AAC9E,eAAO,MAAM,sBAAsB,+CAAyD,CAAC"}
|
|
@@ -5,7 +5,7 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const Basic: () => JSX.Element;
|
|
9
|
-
export declare const Custom: () => JSX.Element;
|
|
10
|
-
export declare const Sizes: () => JSX.Element;
|
|
8
|
+
export declare const Basic: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const Custom: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const Sizes: () => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
//# sourceMappingURL=label-with-hint.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"label-with-hint.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/label-with-hint/label-with-hint.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAEF,eAAO,MAAM,KAAK,
|
|
1
|
+
{"version":3,"file":"label-with-hint.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/label-with-hint/label-with-hint.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAEF,eAAO,MAAM,KAAK,+CAAoD,CAAC;AAEvE,eAAO,MAAM,MAAM,+CAQlB,CAAC;AAEF,eAAO,MAAM,KAAK,+CAOjB,CAAC"}
|
|
@@ -5,6 +5,6 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const bodyTextLineUnlimited: () => JSX.Element;
|
|
9
|
-
export declare const bodyTextLineLimited: () => JSX.Element;
|
|
8
|
+
export declare const bodyTextLineUnlimited: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const bodyTextLineLimited: () => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
//# sourceMappingURL=line-text-body.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"line-text-body.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/line-text/line-text-body.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAKF,eAAO,MAAM,qBAAqB
|
|
1
|
+
{"version":3,"file":"line-text-body.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/line-text/line-text-body.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAKF,eAAO,MAAM,qBAAqB,+CAA+D,CAAC;AAClG,eAAO,MAAM,mBAAmB,+CAQ9B,CAAC"}
|
|
@@ -5,6 +5,6 @@ declare const _default: {
|
|
|
5
5
|
parameters: {};
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const headlineLineUnlimited: () => JSX.Element;
|
|
9
|
-
export declare const headlineLineLimited: () => JSX.Element;
|
|
8
|
+
export declare const headlineLineUnlimited: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const headlineLineLimited: () => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
//# sourceMappingURL=line-text-head.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"line-text-head.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/line-text/line-text-head.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAKF,eAAO,MAAM,qBAAqB
|
|
1
|
+
{"version":3,"file":"line-text-head.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/line-text/line-text-head.stories.tsx"],"names":[],"mappings":";;;;;;AAGA,wBAIE;AAKF,eAAO,MAAM,qBAAqB,+CAA+D,CAAC;AAClG,eAAO,MAAM,mBAAmB,+CAQ9B,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { Component } from 'react';
|
|
2
|
-
interface TitlePopoverProps {
|
|
1
|
+
import { Component, PropsWithChildren } from 'react';
|
|
2
|
+
interface TitlePopoverProps extends PropsWithChildren {
|
|
3
3
|
text?: string;
|
|
4
4
|
}
|
|
5
5
|
export declare class TitlePopover extends Component<TitlePopoverProps> {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"title-popover.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/title-popover/title-popover.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"title-popover.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/title-popover/title-popover.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,SAAS,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAKhE,UAAU,iBAAkB,SAAQ,iBAAiB;IACjD,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,qBACa,YAAa,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC9C,MAAM,UAAS;IAE3B,QAAQ,4CAA+B;gBAE3B,KAAK,EAAE,iBAAiB;IAMpC,MAAM,aAEJ;IAGF,KAAK,aAEH;IAGF,WAAW,UAAW,UAAU,UAU9B;IAEF,iBAAiB;IAIjB,oBAAoB;IAIpB,MAAM,IAAI,GAAG,CAAC,OAAO;CAgCxB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"title-popover.js","sourceRoot":"","sources":["../../../../src/components/ui/title-popover/title-popover.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"title-popover.js","sourceRoot":"","sources":["../../../../src/components/ui/title-popover/title-popover.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,MAAM,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,6BAA6B,CAAC;AAC7E,OAAO,KAAK,MAAM,MAAM,6BAA6B,CAAC;AAOtD,IAAa,YAAY,GAAzB,MAAa,YAAa,SAAQ,SAA4B;IAK1D,YAAY,KAAwB;QAChC,KAAK,CAAC,KAAK,CAAC,CAAC;QALL;;;;mBAAS,KAAK;WAAC;QAE3B;;;;mBAAW,SAAS,EAAkB;WAAC;QAQvC;;;;mBAAS,GAAG,EAAE;gBACV,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;YAC/B,CAAC;WAAC;QAGF;;;;mBAAQ,GAAG,EAAE;gBACT,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;YACxB,CAAC;WAAC;QAGF;;;;mBAAc,CAAC,KAAiB,EAAE,EAAE;gBAChC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;oBACxB,OAAO;iBACV;gBAED,MAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,CAAC;gBAE7E,IAAI,CAAC,eAAe,EAAE;oBAClB,IAAI,CAAC,KAAK,EAAE,CAAC;iBAChB;YACL,CAAC;WAAC;QAxBE,cAAc,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC;IAyBD,iBAAiB;QACb,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;IACvD,CAAC;IAED,oBAAoB;QAChB,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;IAC1D,CAAC;IAED,MAAM;QACF,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAEtC,OAAO,CACH,4BAAK,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,SAAS,EAAC,kBAAkB,gBACjD,KAAC,OAAO,kBACJ,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,OAAO,EAAE,kBAAkB,CAAC,EACzD,KAAK,EAAC,IAAI,EACV,IAAI,EAAE,IAAI,CAAC,MAAM,EACjB,SAAS,EAAC,IAAI,EACd,OAAO,EACH,MAAC,KAAK,kBACF,UAAU,EAAC,QAAQ,EACnB,SAAS,EAAC,wCAAwC,EAClD,OAAO,EAAE,IAAI,CAAC,MAAM,iBAEpB,KAAC,QAAQ,kBAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,uBAAuB,gBACnD,IAAI,IACE,EACX,KAAC,IAAI,IACD,IAAI,EAAC,aAAa,EAClB,IAAI,EAAE,EAAE,EACR,SAAS,EAAC,6BAA6B,GACzC,KACE,gBAGX,QAAQ,IACH,IACR,CACT,CAAC;IACN,CAAC;CACJ,CAAA;AAxEe;IAAX,UAAU;;4CAAgB;AAU3B;IADC,MAAM;;4CAGL;AAGF;IADC,MAAM;;2CAGL;AAGF;IADC,MAAM;;iDAWL;AA/BO,YAAY;IADxB,QAAQ;;GACI,YAAY,CAyExB;SAzEY,YAAY"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { TitlePopover } from './title-popover';
|
|
3
2
|
declare const _default: {
|
|
4
3
|
title: string;
|
|
@@ -6,6 +5,6 @@ declare const _default: {
|
|
|
6
5
|
parameters: {};
|
|
7
6
|
};
|
|
8
7
|
export default _default;
|
|
9
|
-
export declare const titlePopover: () => JSX.Element;
|
|
10
|
-
export declare const titlePopoverToggle: () => JSX.Element;
|
|
8
|
+
export declare const titlePopover: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const titlePopoverToggle: () => import("react/jsx-runtime").JSX.Element;
|
|
11
10
|
//# sourceMappingURL=title-popover.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"title-popover.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/title-popover/title-popover.stories.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"title-popover.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/title-popover/title-popover.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;;;;;;AAE/C,wBAIE;AAKF,eAAO,MAAM,YAAY,+CAAsE,CAAC;AAChG,eAAO,MAAM,kBAAkB,+CAa7B,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/marketing-ui",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "5.0.0",
|
|
4
4
|
"description": "Marketing UI component and utils",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -19,23 +19,23 @@
|
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
21
21
|
"@servicetitan/design-system": ">=13.2.1",
|
|
22
|
-
"@servicetitan/react-ioc": "
|
|
22
|
+
"@servicetitan/react-ioc": ">=14.1.1",
|
|
23
23
|
"@servicetitan/tokens": ">=12.2.1",
|
|
24
24
|
"accounting": "~0.4.1",
|
|
25
25
|
"axios": ">=0.20.0",
|
|
26
26
|
"mobx": "~6.3.2",
|
|
27
27
|
"mobx-react": "~7.2.0",
|
|
28
28
|
"moment": "~2.29.1",
|
|
29
|
-
"react": "
|
|
29
|
+
"react": ">=17.0.2"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
|
-
"@servicetitan/design-system": "
|
|
33
|
-
"@servicetitan/react-ioc": "
|
|
32
|
+
"@servicetitan/design-system": "~13.4.5",
|
|
33
|
+
"@servicetitan/react-ioc": "^23.2.1",
|
|
34
34
|
"@servicetitan/tokens": ">=12.1.11",
|
|
35
|
-
"@testing-library/react": "^
|
|
35
|
+
"@testing-library/react": "^14.0.0",
|
|
36
36
|
"@types/accounting": "~0.4.2",
|
|
37
37
|
"@types/history": "~4.7.7",
|
|
38
|
-
"@types/react": "~
|
|
38
|
+
"@types/react": "~18.2.55",
|
|
39
39
|
"@types/react-image-crop": "8.1.2",
|
|
40
40
|
"@types/react-router-dom": "^5.1.8",
|
|
41
41
|
"accounting": "~0.4.1",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"mobx": "~6.3.2",
|
|
44
44
|
"mobx-react": "~7.2.0",
|
|
45
45
|
"moment": "~2.29.1",
|
|
46
|
-
"react": "~
|
|
46
|
+
"react": "~18.2.0"
|
|
47
47
|
},
|
|
48
48
|
"publishConfig": {
|
|
49
49
|
"access": "public"
|
|
@@ -52,5 +52,5 @@
|
|
|
52
52
|
"less": true,
|
|
53
53
|
"webpack": false
|
|
54
54
|
},
|
|
55
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "2027b0cb3bb4a06b8e381e3e9af8469a30b20f11"
|
|
56
56
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export const __esModule: true;
|
|
2
2
|
export const flex1: string;
|
|
3
|
-
export const title: string;
|
|
4
|
-
export const statTitle: string;
|
|
5
|
-
export const pyramidWrapper: string;
|
|
6
|
-
export const pyramidLine: string;
|
|
7
3
|
export const pyramidBoxLeft: string;
|
|
8
4
|
export const pyramidBoxRight: string;
|
|
5
|
+
export const pyramidLine: string;
|
|
6
|
+
export const pyramidWrapper: string;
|
|
7
|
+
export const statTitle: string;
|
|
8
|
+
export const title: string;
|
|
9
9
|
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
export const __esModule: true;
|
|
2
|
-
export const sidebar: string;
|
|
3
|
-
export const sidebarWithTitle: string;
|
|
4
|
-
export const sidebarNoTitle: string;
|
|
5
2
|
export const label: string;
|
|
6
3
|
export const labelGap: string;
|
|
4
|
+
export const sidebar: string;
|
|
5
|
+
export const sidebarLeft: string;
|
|
6
|
+
export const sidebarNoTitle: string;
|
|
7
|
+
export const sidebarRight: string;
|
|
7
8
|
export const sidebarTitle: string;
|
|
8
9
|
export const sidebarTitleDefault: string;
|
|
9
|
-
export const sidebarValues: string;
|
|
10
|
-
export const sidebarLeft: string;
|
|
11
10
|
export const sidebarTitleText: string;
|
|
12
|
-
export const
|
|
11
|
+
export const sidebarValues: string;
|
|
12
|
+
export const sidebarWithTitle: string;
|
|
13
13
|
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
1
|
+
import { FC, ReactNode, useState } from 'react';
|
|
2
2
|
import classNames from 'classnames';
|
|
3
3
|
import {
|
|
4
4
|
BodyText,
|
|
5
5
|
BodyTextPropsStrict,
|
|
6
6
|
Eyebrow,
|
|
7
|
+
Popover,
|
|
7
8
|
Stack,
|
|
8
9
|
Tooltip,
|
|
9
10
|
} from '@servicetitan/design-system';
|
|
@@ -105,6 +106,7 @@ export const StatDiff: FC<StatDiffProps> = ({
|
|
|
105
106
|
export interface StatCardProps {
|
|
106
107
|
title: string;
|
|
107
108
|
description?: string;
|
|
109
|
+
popoverContent?: ReactNode;
|
|
108
110
|
value?: number;
|
|
109
111
|
prev?: number;
|
|
110
112
|
percent?: boolean;
|
|
@@ -122,6 +124,7 @@ export interface StatCardProps {
|
|
|
122
124
|
export const StatCard: FC<StatCardProps> = ({
|
|
123
125
|
title,
|
|
124
126
|
description,
|
|
127
|
+
popoverContent,
|
|
125
128
|
value,
|
|
126
129
|
percent,
|
|
127
130
|
money,
|
|
@@ -135,6 +138,7 @@ export const StatCard: FC<StatCardProps> = ({
|
|
|
135
138
|
className,
|
|
136
139
|
diffPercentOnly = false,
|
|
137
140
|
}) => {
|
|
141
|
+
const [popoverShown, setPopoverShown] = useState(false);
|
|
138
142
|
const format = money ? 'money' : percent ? 'percent' : rate ? 'rate' : 'number';
|
|
139
143
|
const val = value === undefined ? '\u00A0' : formatValue(value, format);
|
|
140
144
|
|
|
@@ -142,6 +146,9 @@ export const StatCard: FC<StatCardProps> = ({
|
|
|
142
146
|
<Eyebrow
|
|
143
147
|
className={classNames(Styles.title, 'ta-center')}
|
|
144
148
|
data-cy={`marketing-stat-${title}-title`}
|
|
149
|
+
onMouseEnter={() => {
|
|
150
|
+
setPopoverShown(true);
|
|
151
|
+
}}
|
|
145
152
|
>
|
|
146
153
|
{title}
|
|
147
154
|
</Eyebrow>
|
|
@@ -159,8 +166,13 @@ export const StatCard: FC<StatCardProps> = ({
|
|
|
159
166
|
},
|
|
160
167
|
className
|
|
161
168
|
)}
|
|
169
|
+
onMouseLeave={() => setPopoverShown(false)}
|
|
162
170
|
>
|
|
163
|
-
{
|
|
171
|
+
{popoverContent ? (
|
|
172
|
+
<Popover open={popoverShown} trigger={eyebrow}>
|
|
173
|
+
{popoverContent}
|
|
174
|
+
</Popover>
|
|
175
|
+
) : description ? (
|
|
164
176
|
<Tooltip text={description} data-cy={`marketing-stat-${title}-tooltip`}>
|
|
165
177
|
{eyebrow}
|
|
166
178
|
</Tooltip>
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ReactElement } from 'react';
|
|
2
2
|
import { StatCard } from './stat-card';
|
|
3
|
+
import { BodyText } from '@servicetitan/design-system';
|
|
3
4
|
|
|
4
5
|
export default {
|
|
5
6
|
title: 'Marketing UI/stat/StatCard',
|
|
@@ -10,6 +11,14 @@ export default {
|
|
|
10
11
|
const w = (cb: () => ReactElement) => () => <div style={{ width: '400px' }}>{cb()}</div>;
|
|
11
12
|
|
|
12
13
|
export const statCardNumber = w(() => <StatCard title="number" value={133} prev={1000} />);
|
|
14
|
+
export const statCardPopoverDescription = w(() => (
|
|
15
|
+
<StatCard
|
|
16
|
+
title="number"
|
|
17
|
+
value={133}
|
|
18
|
+
prev={1000}
|
|
19
|
+
popoverContent={<BodyText>Description</BodyText>}
|
|
20
|
+
/>
|
|
21
|
+
));
|
|
13
22
|
export const statDiffNumberPercentOnly = w(() => (
|
|
14
23
|
<StatCard title="number" value={133} prev={1000} diffPercentOnly />
|
|
15
24
|
));
|
|
@@ -2,8 +2,8 @@ export const __esModule: true;
|
|
|
2
2
|
export const actionButton: string;
|
|
3
3
|
export const active: string;
|
|
4
4
|
export const disabled: string;
|
|
5
|
-
export const text: string;
|
|
6
|
-
export const primary: string;
|
|
7
|
-
export const negative: string;
|
|
8
5
|
export const focusVisible: string;
|
|
6
|
+
export const negative: string;
|
|
7
|
+
export const primary: string;
|
|
8
|
+
export const text: string;
|
|
9
9
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export const __esModule: true;
|
|
2
|
-
export const moreDetailsWrapper: string;
|
|
3
|
-
export const moreDetailsText: string;
|
|
4
|
-
export const mainTextHidden: string;
|
|
5
2
|
export const mainText: string;
|
|
3
|
+
export const mainTextHidden: string;
|
|
4
|
+
export const moreDetailsText: string;
|
|
5
|
+
export const moreDetailsWrapper: string;
|
|
6
6
|
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import classNames from 'classnames';
|
|
2
2
|
import { observer } from 'mobx-react';
|
|
3
|
-
import { createRef, Component } from 'react';
|
|
3
|
+
import { createRef, Component, PropsWithChildren } from 'react';
|
|
4
4
|
import { observable, action, makeObservable } from 'mobx';
|
|
5
5
|
import { Popover, Stack, BodyText, Icon } from '@servicetitan/design-system';
|
|
6
6
|
import * as Styles from './title-popover.module.less';
|
|
7
7
|
|
|
8
|
-
interface TitlePopoverProps {
|
|
8
|
+
interface TitlePopoverProps extends PropsWithChildren {
|
|
9
9
|
text?: string;
|
|
10
10
|
}
|
|
11
11
|
|
|
@@ -51,7 +51,7 @@ export class TitlePopover extends Component<TitlePopoverProps> {
|
|
|
51
51
|
window.removeEventListener('click', this.handleClick);
|
|
52
52
|
}
|
|
53
53
|
|
|
54
|
-
render() {
|
|
54
|
+
render(): JSX.Element {
|
|
55
55
|
const { text, children } = this.props;
|
|
56
56
|
|
|
57
57
|
return (
|