@altertable/data-app 0.67.0 → 0.68.0

package/dist/chunks/{index-8qfxv0h5.js → index-gvers8jw.js}

@@ -982,6 +982,24 @@ function injectDataAppStyles2(options = {}) {
       animation: none;
     }
   }
+
+  .altertable-chart-tooltip-row {
+    display: flex;
+    align-items:  flex-start;
+    gap: 6px;
+  }
+
+  .altertable-chart-tooltip-marker {
+    flex-shrink: 0;
+    width: 8px;
+    height: 8px;
+    margin-top: .3em;
+  }
+
+  .altertable-chart-tooltip-reading {
+    overflow-wrap: anywhere;
+    min-width: 0;
+  }
 }
 
 /* src/react/ui/RequestHint.css */
@@ -5407,8 +5425,14 @@ function injectDataAppStyles2(options = {}) {
   }
 
   .altertable-chart-legend-marker {
-    display: block;
+    display: inline-block;
+    vertical-align: middle;
     flex: none;
+    width: 8px;
+    height: 8px;
+  }
+
+  .altertable-chart-legend-marker:not([data-kind="square"]) {
     width: 20px;
     height: 12px;
   }
@@ -5701,6 +5725,143 @@ function injectDataAppStyles2(options = {}) {
   .altertable-composed-chart-legend-above {
     padding-bottom: var(--atbl-space-md);
   }
+
+  .altertable-composed-chart[data-atbl-internal-pointer-focus] {
+    --atbl-focus-outline: none;
+  }
+
+  .altertable-composed-chart [data-atbl-focus="inset"]:focus:not(:focus-visible) {
+    outline: none;
+  }
+}
+
+/* src/react/ui/AnalyticsCharts.css */
+@layer atbl.components {
+  .altertable-funnel-chart, .altertable-retention-chart, .altertable-journey-chart {
+    font-size: var(--atbl-type-meta-size);
+    font-variant-numeric: tabular-nums;
+    min-width: 0;
+  }
+
+  .altertable-funnel-summary {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 12px 24px;
+  }
+
+  .altertable-funnel-summary > div {
+    display: grid;
+    overflow-wrap: anywhere;
+    gap: 4px;
+    min-width: 0;
+  }
+
+  .altertable-funnel-summary span {
+    color: var(--atbl-muted);
+  }
+
+  .altertable-funnel-summary .altertable-chart-legend-marker {
+    margin-right: 6px;
+  }
+
+  .altertable-funnel-summary strong {
+    font-size: var(--atbl-type-section-size);
+    font-weight: var(--atbl-type-emphasis-weight);
+  }
+
+  .altertable-funnel-scroll, .altertable-journey-scroll {
+    overflow: auto;
+    width: 100%;
+  }
+
+  .altertable-journey-scroll {
+    max-height: 900px;
+  }
+
+  .altertable-analytics-note {
+    color: var(--atbl-muted);
+    overflow-wrap: anywhere;
+    margin: 8px 0;
+  }
+
+  .altertable-journey-plot {
+    position: relative;
+  }
+
+  .altertable-journey-plot > svg {
+    position: absolute;
+    inset: 0;
+  }
+
+  .altertable-journey-stage {
+    position: absolute;
+    color: var(--atbl-muted);
+    top: 0;
+  }
+
+  .altertable-journey-node {
+    position: absolute;
+  }
+
+  .altertable-journey-bar {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    background: var(--atbl-muted);
+    left: 0;
+  }
+
+  .altertable-journey-bar[data-event] {
+    background: var(--atbl-chart-5);
+  }
+
+  .altertable-journey-label {
+    position: absolute;
+    display: flex;
+    box-sizing: border-box;
+    border: 1px solid var(--atbl-border);
+    border-radius: var(--atbl-radius-surface);
+    background: var(--atbl-surface);
+    color: var(--atbl-muted);
+    overflow-wrap: anywhere;
+    flex-direction: column;
+    justify-content: center;
+    gap: 2px;
+    width: 100%;
+    min-height: 64px;
+    margin-bottom: 8px;
+    padding: 8px 36px 8px 8px;
+    bottom: 100%;
+  }
+
+  .altertable-journey-name {
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    overflow: hidden;
+    color: var(--atbl-text);
+    font-weight: var(--atbl-type-label-weight);
+    -webkit-box-orient: vertical;
+  }
+
+  .altertable-journey-expand {
+    position: absolute;
+    margin-bottom: 12px;
+    bottom: 100%;
+    right: 4px;
+  }
+
+  .altertable-journey-more {
+    position: absolute;
+    margin-top: 8px;
+    top: 100%;
+    left: 0;
+  }
+
+  .altertable-funnel-tooltip-detail {
+    display: block;
+    color: var(--atbl-muted);
+    overflow-wrap: anywhere;
+  }
 }
 
 /* src/react/annotations/colors.css */
@@ -12269,6 +12430,15 @@ function DataValue2({
   });
 }
 
+// src/react/ui/chartColor.ts
+function chartColor2(id) {
+  let hash = 2166136261;
+  for (const codePoint of id)
+    hash = Math.imul(hash ^ codePoint.codePointAt(0), 16777619);
+  return `var(--atbl-chart-${(hash >>> 0) % 8 + 1})`;
+}
+var chartBarFill = "var(--atbl-chart-fill, color-mix(in srgb, var(--atbl-accent) 75%, var(--atbl-surface)))";
+
 // src/react/ui/data-context.ts
 function evidenceFor(context, names) {
   function validateEvidence(evidence) {
@@ -14155,6 +14325,6 @@ function DataAppFrame(props) {
   });
 }
 
-export { injectStyles, injectDataAppStyles2, useDataApp, AppIcon2, classNames, Button2, PressButton, EmptyState2, shortcuts, Kbd, TooltipSurface, TooltipProvider2, Tooltip2, GradientScroll2, Sheet2, TabList2, TabPanels2, Tab2, TabPanel2, Tabs2, useViewTab2, InspectionContext, useInspectionDefaults, AboutData2, mountDataApp2, DataAppProvider2, useDeclaredResult, PrimaryViewContext, ownedSource, registeredEvidence, datasetTable, exportDatasets, searchVariable2, validateChoiceOptions, choiceVariable2, multiChoiceVariable2, dateRangeVariable2, useAppVariables2, sectionContent, Select2, IconButton2, FilterActions2, NumberField2, NumberRangeField2, NumberFilterPicker2, SearchField2, Skeleton2, SearchMatch2, searchItems2, ChoicePicker2, CheckboxGroupContext, Checkbox2, DateRangePicker2, FilterBar2, DimensionPicker2, createDataHooks2, useDataAppAnnotations2, isPlainKeyEvent2, AnnotationTooltip, MenuTrigger2, MenuSection2, MenuPopover2, Menu2, MenuItem2, MenuSeparator2, LiveControl2, PresentStory2, VariableBar2, DataAppFrame, Grid2, TextContent2, getAnnotationProps, ContentSkeleton, DataWidget2, VisualizationWidget2, comparisonChange, metricComparison, MetricWidget2, HelpPopover2, DateTimeTooltip2, DataTable2, DataTableShare2, DataTableEmptyRow2, DataTableTimestamp2, TableWidget2, TextWidget2, DataValue2, createDataContext2 };
+export { injectStyles, injectDataAppStyles2, useDataApp, AppIcon2, classNames, Button2, PressButton, EmptyState2, shortcuts, Kbd, TooltipSurface, TooltipProvider2, Tooltip2, GradientScroll2, Sheet2, TabList2, TabPanels2, Tab2, TabPanel2, Tabs2, useViewTab2, InspectionContext, useInspectionDefaults, AboutData2, mountDataApp2, DataAppProvider2, useDeclaredResult, PrimaryViewContext, ownedSource, registeredEvidence, datasetTable, exportDatasets, searchVariable2, validateChoiceOptions, choiceVariable2, multiChoiceVariable2, dateRangeVariable2, useAppVariables2, sectionContent, Select2, IconButton2, FilterActions2, NumberField2, NumberRangeField2, NumberFilterPicker2, SearchField2, Skeleton2, SearchMatch2, searchItems2, ChoicePicker2, CheckboxGroupContext, Checkbox2, DateRangePicker2, FilterBar2, DimensionPicker2, createDataHooks2, useDataAppAnnotations2, isPlainKeyEvent2, AnnotationTooltip, MenuTrigger2, MenuSection2, MenuPopover2, Menu2, MenuItem2, MenuSeparator2, LiveControl2, PresentStory2, VariableBar2, DataAppFrame, Grid2, TextContent2, getAnnotationProps, ContentSkeleton, DataWidget2, VisualizationWidget2, comparisonChange, metricComparison, MetricWidget2, HelpPopover2, DateTimeTooltip2, DataTable2, DataTableShare2, DataTableEmptyRow2, DataTableTimestamp2, TableWidget2, TextWidget2, DataValue2, chartColor2, chartBarFill, createDataContext2 };
 
-//# debugId=8024F23D205D55BC64756E2164756E21
+//# debugId=1CD074317A9B492E64756E2164756E21