@liiift-studio/sanity-visitor-insights 0.21.0 → 0.22.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/index.d.mts +16 -11
- package/dist/index.d.ts +16 -11
- package/dist/index.js +235 -131
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +238 -135
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/index.ts +9 -1
- package/src/studio/CrossSourceTimeline.tsx +81 -25
- package/src/studio/Figure.tsx +30 -14
- package/src/studio/VisitorInsightsTool.tsx +122 -34
- package/src/studio/panels.test.tsx +113 -4
- package/src/studio/panels.tsx +116 -61
- package/src/studio/useReport.ts +43 -6
package/dist/index.d.mts
CHANGED
|
@@ -52,6 +52,7 @@ type ReportState<T> = {
|
|
|
52
52
|
status: 'ready';
|
|
53
53
|
envelope: ReportEnvelope<T>;
|
|
54
54
|
stale?: boolean;
|
|
55
|
+
revalidationError?: string;
|
|
55
56
|
} | {
|
|
56
57
|
status: 'error';
|
|
57
58
|
message: string;
|
|
@@ -159,8 +160,15 @@ interface ComparisonBarProps {
|
|
|
159
160
|
metric: MetricValue;
|
|
160
161
|
/** Largest value across the sibling bars, used to scale width. */
|
|
161
162
|
max: number;
|
|
162
|
-
/**
|
|
163
|
-
|
|
163
|
+
/**
|
|
164
|
+
* What full width means, named.
|
|
165
|
+
*
|
|
166
|
+
* A ComparisonBar scales to the largest sibling, so a full bar means only "biggest of these" —
|
|
167
|
+
* and unlike the other two bar idioms, which print their share and their total, this one said
|
|
168
|
+
* nothing at all. There was a `tone` prop instead, which both call sites passed different
|
|
169
|
+
* values to and which the component destructured and never used.
|
|
170
|
+
*/
|
|
171
|
+
outOf?: string;
|
|
164
172
|
}
|
|
165
173
|
/**
|
|
166
174
|
* A horizontal bar with its value printed alongside.
|
|
@@ -169,7 +177,7 @@ interface ComparisonBarProps {
|
|
|
169
177
|
* values, which a labelled bar does as well as a chart while avoiding a large dependency in the
|
|
170
178
|
* Studio bundle and the theme-token bridging that a chart library would need for light and dark.
|
|
171
179
|
*/
|
|
172
|
-
declare function ComparisonBar({ label, metric, max,
|
|
180
|
+
declare function ComparisonBar({ label, metric, max, outOf }: ComparisonBarProps): React.ReactElement;
|
|
173
181
|
/** Props for ChartData. */
|
|
174
182
|
interface ChartDataProps<Row> {
|
|
175
183
|
/** What the disclosure is called. Names the chart it belongs to. */
|
|
@@ -327,6 +335,8 @@ interface SortableTableProps<Row> {
|
|
|
327
335
|
exportName?: string;
|
|
328
336
|
/** Shown under the table when the server truncated the row set. */
|
|
329
337
|
truncatedNote?: string;
|
|
338
|
+
/** Allow per-row exclusion even without a filter box. */
|
|
339
|
+
onExclude?: boolean;
|
|
330
340
|
}
|
|
331
341
|
/**
|
|
332
342
|
* A table whose columns sort.
|
|
@@ -340,7 +350,7 @@ interface SortableTableProps<Row> {
|
|
|
340
350
|
* unavailable metric is not a zero, and letting it lead an ascending sort would restate exactly the
|
|
341
351
|
* confusion the MetricValue type exists to prevent.
|
|
342
352
|
*/
|
|
343
|
-
declare function SortableTable<Row>({ caption, columns, rows, rowKey, initialSort, filterPlaceholder, filterOn, exportName, truncatedNote, }: SortableTableProps<Row>): React.ReactElement;
|
|
353
|
+
declare function SortableTable<Row>({ caption, columns, rows, rowKey, initialSort, filterPlaceholder, filterOn, exportName, truncatedNote, onExclude, }: SortableTableProps<Row>): React.ReactElement;
|
|
344
354
|
|
|
345
355
|
/**
|
|
346
356
|
* One time axis, every source stacked against it.
|
|
@@ -437,7 +447,7 @@ interface CrossSourceTimelineProps {
|
|
|
437
447
|
declare function CrossSourceTimeline({ series, markers, currency, onBrush }: CrossSourceTimelineProps): React.ReactElement | null;
|
|
438
448
|
|
|
439
449
|
/**
|
|
440
|
-
* The
|
|
450
|
+
* The report panels.
|
|
441
451
|
*
|
|
442
452
|
* Every panel renders a table or labelled bars rather than a chart, and every one surfaces its own
|
|
443
453
|
* caveats inline. Tables are the accessible representation as well as the visual one, so there is
|
|
@@ -451,11 +461,6 @@ declare function CrossSourceTimeline({ series, markers, currency, onBrush }: Cro
|
|
|
451
461
|
* undefined". A panel must degrade to showing less, never to a stack trace.
|
|
452
462
|
*/
|
|
453
463
|
|
|
454
|
-
/**
|
|
455
|
-
* Measurement Health — how much of reality each source sees.
|
|
456
|
-
* Compares pageviews to pageviews. Sessions and orders sit alongside as context and are never
|
|
457
|
-
* subtracted from a pageview count.
|
|
458
|
-
*/
|
|
459
464
|
/**
|
|
460
465
|
* Overview — the five-minute read.
|
|
461
466
|
*
|
|
@@ -547,4 +552,4 @@ interface VisitorInsightsPluginOptions {
|
|
|
547
552
|
*/
|
|
548
553
|
declare const visitorInsights: sanity.Plugin<VisitorInsightsPluginOptions>;
|
|
549
554
|
|
|
550
|
-
export { AcquisitionData, AcquisitionPanel, ChartData, type ChartDataProps, ComparisonBar, CrossSourceTimeline, type CrossSourceTimelineProps, DataHealthPanel, Delta, type DeltaProps, DiagnosticReport, DiagnosticsPanel, FunnelChart, JourneyData, JourneyPanel, MeasurementHealthData, MetricFigure, MetricValue, NoticeList, OverviewPanel, type ProportionBar, ProportionChart, type ProportionChartProps, RangeKey, ReportEnvelope, ReportName, type ReportState, type Series, type SeriesPoint, type SortColumn, SortableTable, type SortableTableProps, type TimelineMarker, TrendChart, TypefaceInterestData, TypefaceInterestPanel, type UseReportOptions, type VisitorInsightsPluginOptions, VisitorInsightsTool, type VisitorInsightsToolProps, visitorInsights as default, formatCount, formatMoney, formatPercent, useReport, visitorInsights };
|
|
555
|
+
export { AcquisitionData, AcquisitionPanel, ChartData, type ChartDataProps, ComparisonBar, CrossSourceTimeline, type CrossSourceTimelineProps, DataHealthPanel, Delta, type DeltaProps, DiagnosticReport, DiagnosticsPanel, FunnelChart, JourneyData, JourneyPanel, MeasurementHealthData, DataHealthPanel as MeasurementHealthPanel, MetricFigure, MetricValue, NoticeList, OverviewPanel, type ProportionBar, ProportionChart, type ProportionChartProps, RangeKey, ReportEnvelope, ReportName, type ReportState, type Series, type SeriesPoint, type SortColumn, SortableTable, type SortableTableProps, type TimelineMarker, TrendChart, TypefaceInterestData, TypefaceInterestPanel, type UseReportOptions, type VisitorInsightsPluginOptions, VisitorInsightsTool, type VisitorInsightsToolProps, visitorInsights as default, formatCount, formatMoney, formatPercent, useReport, visitorInsights };
|
package/dist/index.d.ts
CHANGED
|
@@ -52,6 +52,7 @@ type ReportState<T> = {
|
|
|
52
52
|
status: 'ready';
|
|
53
53
|
envelope: ReportEnvelope<T>;
|
|
54
54
|
stale?: boolean;
|
|
55
|
+
revalidationError?: string;
|
|
55
56
|
} | {
|
|
56
57
|
status: 'error';
|
|
57
58
|
message: string;
|
|
@@ -159,8 +160,15 @@ interface ComparisonBarProps {
|
|
|
159
160
|
metric: MetricValue;
|
|
160
161
|
/** Largest value across the sibling bars, used to scale width. */
|
|
161
162
|
max: number;
|
|
162
|
-
/**
|
|
163
|
-
|
|
163
|
+
/**
|
|
164
|
+
* What full width means, named.
|
|
165
|
+
*
|
|
166
|
+
* A ComparisonBar scales to the largest sibling, so a full bar means only "biggest of these" —
|
|
167
|
+
* and unlike the other two bar idioms, which print their share and their total, this one said
|
|
168
|
+
* nothing at all. There was a `tone` prop instead, which both call sites passed different
|
|
169
|
+
* values to and which the component destructured and never used.
|
|
170
|
+
*/
|
|
171
|
+
outOf?: string;
|
|
164
172
|
}
|
|
165
173
|
/**
|
|
166
174
|
* A horizontal bar with its value printed alongside.
|
|
@@ -169,7 +177,7 @@ interface ComparisonBarProps {
|
|
|
169
177
|
* values, which a labelled bar does as well as a chart while avoiding a large dependency in the
|
|
170
178
|
* Studio bundle and the theme-token bridging that a chart library would need for light and dark.
|
|
171
179
|
*/
|
|
172
|
-
declare function ComparisonBar({ label, metric, max,
|
|
180
|
+
declare function ComparisonBar({ label, metric, max, outOf }: ComparisonBarProps): React.ReactElement;
|
|
173
181
|
/** Props for ChartData. */
|
|
174
182
|
interface ChartDataProps<Row> {
|
|
175
183
|
/** What the disclosure is called. Names the chart it belongs to. */
|
|
@@ -327,6 +335,8 @@ interface SortableTableProps<Row> {
|
|
|
327
335
|
exportName?: string;
|
|
328
336
|
/** Shown under the table when the server truncated the row set. */
|
|
329
337
|
truncatedNote?: string;
|
|
338
|
+
/** Allow per-row exclusion even without a filter box. */
|
|
339
|
+
onExclude?: boolean;
|
|
330
340
|
}
|
|
331
341
|
/**
|
|
332
342
|
* A table whose columns sort.
|
|
@@ -340,7 +350,7 @@ interface SortableTableProps<Row> {
|
|
|
340
350
|
* unavailable metric is not a zero, and letting it lead an ascending sort would restate exactly the
|
|
341
351
|
* confusion the MetricValue type exists to prevent.
|
|
342
352
|
*/
|
|
343
|
-
declare function SortableTable<Row>({ caption, columns, rows, rowKey, initialSort, filterPlaceholder, filterOn, exportName, truncatedNote, }: SortableTableProps<Row>): React.ReactElement;
|
|
353
|
+
declare function SortableTable<Row>({ caption, columns, rows, rowKey, initialSort, filterPlaceholder, filterOn, exportName, truncatedNote, onExclude, }: SortableTableProps<Row>): React.ReactElement;
|
|
344
354
|
|
|
345
355
|
/**
|
|
346
356
|
* One time axis, every source stacked against it.
|
|
@@ -437,7 +447,7 @@ interface CrossSourceTimelineProps {
|
|
|
437
447
|
declare function CrossSourceTimeline({ series, markers, currency, onBrush }: CrossSourceTimelineProps): React.ReactElement | null;
|
|
438
448
|
|
|
439
449
|
/**
|
|
440
|
-
* The
|
|
450
|
+
* The report panels.
|
|
441
451
|
*
|
|
442
452
|
* Every panel renders a table or labelled bars rather than a chart, and every one surfaces its own
|
|
443
453
|
* caveats inline. Tables are the accessible representation as well as the visual one, so there is
|
|
@@ -451,11 +461,6 @@ declare function CrossSourceTimeline({ series, markers, currency, onBrush }: Cro
|
|
|
451
461
|
* undefined". A panel must degrade to showing less, never to a stack trace.
|
|
452
462
|
*/
|
|
453
463
|
|
|
454
|
-
/**
|
|
455
|
-
* Measurement Health — how much of reality each source sees.
|
|
456
|
-
* Compares pageviews to pageviews. Sessions and orders sit alongside as context and are never
|
|
457
|
-
* subtracted from a pageview count.
|
|
458
|
-
*/
|
|
459
464
|
/**
|
|
460
465
|
* Overview — the five-minute read.
|
|
461
466
|
*
|
|
@@ -547,4 +552,4 @@ interface VisitorInsightsPluginOptions {
|
|
|
547
552
|
*/
|
|
548
553
|
declare const visitorInsights: sanity.Plugin<VisitorInsightsPluginOptions>;
|
|
549
554
|
|
|
550
|
-
export { AcquisitionData, AcquisitionPanel, ChartData, type ChartDataProps, ComparisonBar, CrossSourceTimeline, type CrossSourceTimelineProps, DataHealthPanel, Delta, type DeltaProps, DiagnosticReport, DiagnosticsPanel, FunnelChart, JourneyData, JourneyPanel, MeasurementHealthData, MetricFigure, MetricValue, NoticeList, OverviewPanel, type ProportionBar, ProportionChart, type ProportionChartProps, RangeKey, ReportEnvelope, ReportName, type ReportState, type Series, type SeriesPoint, type SortColumn, SortableTable, type SortableTableProps, type TimelineMarker, TrendChart, TypefaceInterestData, TypefaceInterestPanel, type UseReportOptions, type VisitorInsightsPluginOptions, VisitorInsightsTool, type VisitorInsightsToolProps, visitorInsights as default, formatCount, formatMoney, formatPercent, useReport, visitorInsights };
|
|
555
|
+
export { AcquisitionData, AcquisitionPanel, ChartData, type ChartDataProps, ComparisonBar, CrossSourceTimeline, type CrossSourceTimelineProps, DataHealthPanel, Delta, type DeltaProps, DiagnosticReport, DiagnosticsPanel, FunnelChart, JourneyData, JourneyPanel, MeasurementHealthData, DataHealthPanel as MeasurementHealthPanel, MetricFigure, MetricValue, NoticeList, OverviewPanel, type ProportionBar, ProportionChart, type ProportionChartProps, RangeKey, ReportEnvelope, ReportName, type ReportState, type Series, type SeriesPoint, type SortColumn, SortableTable, type SortableTableProps, type TimelineMarker, TrendChart, TypefaceInterestData, TypefaceInterestPanel, type UseReportOptions, type VisitorInsightsPluginOptions, VisitorInsightsTool, type VisitorInsightsToolProps, visitorInsights as default, formatCount, formatMoney, formatPercent, useReport, visitorInsights };
|