@juspay/svelte-ui-components 4.27.6 → 4.28.0

package/dist/Tooltip/tooltip-action.js

@@ -3,9 +3,10 @@
  *
  * Attaches hover and focus listeners to the host element without injecting any wrapper
  * div, which prevents flex-child sizing breakage inside toolbars and icon rows.
- * The tooltip bubble is mounted directly on `document.body` with `position:fixed`
- * coordinates derived from `getBoundingClientRect`, so it is never clipped by
- * `overflow:hidden` ancestors.
+ * The tooltip bubble is mounted directly on the host node's own root — `document.body`,
+ * or the shadow root when the host is inside one (see `portalTarget`) — with
+ * `position:fixed` coordinates derived from `getBoundingClientRect`, so it is never
+ * clipped by `overflow:hidden` ancestors.
  *
  * Usage:
  * ```svelte
@@ -17,6 +18,40 @@
  */
 /** Monotonically-incrementing counter used to generate unique tooltip bubble IDs. */
 let tooltipIdCounter = 0;
+/**
+ * Where the bubble is allowed to land, asked of the HOST node rather than the
+ * bubble: a freshly created, still-detached element is its own root, so it can
+ * answer nothing useful about where the component lives.
+ *
+ * This action has no in-place fallback to fall back to -- not injecting a wrapper
+ * div is its entire reason to exist -- so the bubble is portalled either way, and
+ * the only question is where. `document.body` is the wrong answer from inside a
+ * `<sui-*>` element three times over: the `--tooltip-*` custom properties the
+ * inline styles below read inherit from the shadow host, not from `<body>`, so a
+ * themed host reverts to the literal fallbacks; `options.classes` names a class
+ * whose stylesheet is in the shadow root the bubble just left; and
+ * `aria-describedby` is an IDREF, which does not cross a shadow boundary at all,
+ * so the association the ARIA tooltip pattern requires simply does not exist.
+ * The node's own root keeps all three.
+ *
+ * Both the `ShadowRoot` constructor and `getRootNode` are checked for rather
+ * than assumed, which the five component copies of this helper do not need to
+ * do. Unlike them, this module is exercised outside a DOM: tooltip-action.test.ts
+ * declares `@vitest-environment node` and drives the action with a hand-rolled
+ * element stub carrying only the handful of methods it uses, so `ShadowRoot` is
+ * not a global there and the stub has no `getRootNode`. Either way the answer is
+ * the same one the pre-existing code gave -- a node that cannot say where it
+ * lives is not in a shadow root as far as this can tell. Duck-typing over an
+ * `instanceof` check is the idiom `_interaction/focus.ts` already sets for
+ * exactly this reason.
+ */
+const portalTarget = (node) => {
+    if (typeof ShadowRoot === 'undefined' || typeof node.getRootNode !== 'function') {
+        return document.body;
+    }
+    const root = node.getRootNode();
+    return root instanceof ShadowRoot ? root : document.body;
+};
 export const tooltip = (node, options) => {
     let currentOptions = { ...options };
     let bubbleEl = null;
@@ -84,7 +119,7 @@ export const tooltip = (node, options) => {
         textNode.textContent = currentOptions.text;
         bubbleEl.appendChild(arrowEl);
         bubbleEl.appendChild(textNode);
-        document.body.appendChild(bubbleEl);
+        portalTarget(node).appendChild(bubbleEl);
     };
     /**
      * Compute and apply `top`/`left` fixed coordinates plus arrow styles based on the

package/dist/TypewriterText/TypewriterText.svelte

@@ -7,6 +7,8 @@
     text,
     speed = 15,
     isStreaming = false,
+    markdown = false,
+    markdownOptions,
     renderText,
     variableDelay,
     resolveDelay,
@@ -16,6 +18,23 @@
     classes
   }: TypewriterTextProperties = $props();
 
+  // Keep the promise stable across streamed prop updates so the await block does
+  // not flash escaped source between already-rendered Markdown frames.
+  let rendererPromise: Promise<typeof import('../MarkdownText/markdown')> | null = null;
+  function loadMarkdownRenderer(): Promise<typeof import('../MarkdownText/markdown')> {
+    rendererPromise ??= import('../MarkdownText/markdown');
+    return rendererPromise;
+  }
+  const markdownRenderer = $derived(markdown === true ? loadMarkdownRenderer() : null);
+  // Object-valued custom-element props may receive JSON null or other non-objects.
+  const safeMarkdownOptions = $derived(
+    typeof markdownOptions === 'object' &&
+      markdownOptions !== null &&
+      !Array.isArray(markdownOptions)
+      ? markdownOptions
+      : {}
+  );
+
   let displayedText = $state('');
   let currentIndex = $state(0);
   let timeoutId = $state<ReturnType<typeof setTimeout> | null>(null);
@@ -182,11 +201,24 @@
 
 <div
   class="typewriter-text {classes ?? ''}"
-  class:plain={typeof renderText !== 'function'}
+  class:plain={markdown !== true && typeof renderText !== 'function'}
   data-pw={typeof testId === 'string' ? testId : null}
   testID={typeof testId === 'string' ? testId : null}
 >
-  {#if typeof renderText === 'function'}
+  {#if markdown === true}
+    {#await markdownRenderer}
+      {displayedText}
+    {:then renderer}
+      {#if renderer !== null}
+        <!-- eslint-disable-next-line svelte/no-at-html-tags -->
+        {@html renderer.renderMarkdown(displayedText, safeMarkdownOptions)}
+      {:else}
+        {displayedText}
+      {/if}
+    {:catch}
+      {displayedText}
+    {/await}
+  {:else if typeof renderText === 'function'}
     <!-- eslint-disable-next-line svelte/no-at-html-tags -->
     {@html renderText(displayedText)}
   {:else if renderCharacter}

package/dist/TypewriterText/properties.d.ts

@@ -1,4 +1,5 @@
 import type { Snippet } from 'svelte';
+import type { RenderMarkdownOptions } from '../MarkdownText/properties';
 export type TypewriterTextProperties = OptionalTypewriterTextProperties & MandatoryTypewriterTextProperties;
 export type MandatoryTypewriterTextProperties = {
     text: string;
@@ -74,9 +75,21 @@ export type OptionalTypewriterTextProperties = {
      */
     isStreaming?: boolean;
     /**
-     * Renders the revealed text as HTML — pass a markdown renderer to type rich text.
-     * The component trusts the returned string, so sanitise inside the renderer if the
-     * text can contain untrusted input. When omitted, the text renders as plain text.
+     * Render every revealed prefix through the library's safe Markdown pipeline.
+     * Raw HTML is escaped and unsafe link/image protocols are stripped. Defaults to
+     * false; when true, takes precedence over both renderText and renderCharacter.
+     */
+    markdown?: boolean;
+    /**
+     * Options for safe Markdown rendering, including narrower sanitization policies.
+     * Only used when markdown is true; never applied to a trusted renderText callback.
+     */
+    markdownOptions?: RenderMarkdownOptions;
+    /**
+     * Trusted custom-HTML escape hatch. The caller owns the safety of every returned
+     * string, including incomplete streaming prefixes; sanitize untrusted input inside
+     * the callback. markdownOptions do not apply here. Ignored when markdown is true;
+     * otherwise takes precedence over renderCharacter and escaped plain text.
      */
     renderText?: (text: string) => string;
     /**
@@ -108,8 +121,8 @@ export type OptionalTypewriterTextProperties = {
     onprogress?: (progress: TypewriterProgress) => void;
     /**
      * Render each revealed character yourself — highlight a token, wrap a number — instead
-     * of the plain text node. Ignored when `renderText` is set, since that renderer already
-     * owns the full markup. Falls back to plain text per character when omitted.
+     * of the plain text node. Ignored when markdown is true or renderText is set, since
+     * those renderers own the full markup. Falls back to plain text when omitted.
      */
     renderCharacter?: Snippet<[TypewriterCharacterContext]>;
     testId?: string;

package/dist/_chart/ChartContainer.svelte

@@ -87,6 +87,18 @@
 <style>
   .chart-container {
     width: 100%;
+    /* Floor against the silent zero-collapse bug: a flex/grid ancestor that
+       sizes itself by shrink-to-fit/fit-content resolves this div's
+       `width: 100%` as an indefinite percentage and contributes 0 to that
+       calculation, so the ancestor -- and this div -- settle at 0px with no
+       signal, and the `{#if width > 0 && height > 0}` guard below then
+       renders nothing at all. A definite min-width isn't subject to that;
+       it gives the ancestor a real, non-zero size to lay out against, so
+       the collapse can't happen in the first place. Overridable per
+       instance via --chart-min-width; PieChart's legend-right layout
+       already sets this to 0 for its own case, where flex-basis is
+       definite (0, not auto) so shrink-to-fit never applies. */
+    min-width: var(--chart-min-width, 160px);
     background: var(--chart-background, transparent);
     font-family: var(--chart-font-family, inherit);
   }

package/dist/_chart/ChartTooltip.svelte

@@ -39,12 +39,26 @@
   });
 
   /**
-   * Svelte action: relocates the tooltip to document.body so a position:fixed
+   * Where a portalled node is allowed to land. Svelte scopes a custom element's
+   * CSS to its shadow root, so `document.body` is the one place the tooltip must
+   * never go from inside a `<sui-*>` element: it keeps its `svelte-*` scoping
+   * class and loses every rule behind it, plus the host's custom properties.
+   * Measured in Chromium -- position fell back to `static`, background to
+   * transparent, border and shadow to none. Its own root holds that stylesheet
+   * and still sits above every overflow/scroll ancestor between the two.
+   */
+  const portalTarget = (node: Node): Node => {
+    const root = node.getRootNode();
+    return root instanceof ShadowRoot ? root : document.body;
+  };
+
+  /**
+   * Svelte action: relocates the tooltip out to its root so a position:fixed
    * tooltip is never clipped by an overflow/scroll ancestor. `use:` actions
    * never run during SSR.
    */
-  const portalToBody = (node: HTMLElement) => {
-    document.body.appendChild(node);
+  const portalToRoot = (node: HTMLElement) => {
+    portalTarget(node).appendChild(node);
     return { destroy: () => node.remove() };
   };
 
@@ -105,7 +119,7 @@
       bind:clientHeight={tooltipHeight}
       class="chart-tooltip portal {unstyled ? 'unstyled' : ''} {classes ?? ''}"
       style="left: {pos.left}px; top: {pos.top}px;"
-      use:portalToBody
+      use:portalToRoot
       data-pw="chart-tooltip"
       testID="chart-tooltip"
     >

package/dist/_chart/Legend.svelte

@@ -1,3 +1,24 @@
+<script module lang="ts">
+  /**
+   * Resolves a caller-stable id (a category label, series name, or any other id
+   * the CALLER chose to remember) to its CURRENT position in a chart's live
+   * category list -- e.g. the array `ChartHighlightAPI.getCategories()` returns.
+   *
+   * Both `highlightedIndex` and `ChartHighlightAPI.highlight()` take a numeric
+   * index, but that index shifts whenever the chart reorders, filters, or
+   * folds tail categories into a `topN` "Other" bucket. A synchronized legend
+   * (or any external driver) should not cache the index it first saw; it
+   * should re-resolve the id against the current `getCategories()` output
+   * right before calling `highlight()`. Returns `null` when the id is not
+   * currently present (filtered out, or absorbed into an aggregate bucket),
+   * which callers should treat as "clear the highlight", not "highlight -1".
+   */
+  export function resolveLegendIndex(categories: readonly string[], id: string): number | null {
+    const index = categories.indexOf(id);
+    return index === -1 ? null : index;
+  }
+</script>
+
 <script lang="ts">
   import type { LegendProperties } from './types';
 

package/dist/_chart/Legend.svelte.d.ts

@@ -1,3 +1,18 @@
+/**
+ * Resolves a caller-stable id (a category label, series name, or any other id
+ * the CALLER chose to remember) to its CURRENT position in a chart's live
+ * category list -- e.g. the array `ChartHighlightAPI.getCategories()` returns.
+ *
+ * Both `highlightedIndex` and `ChartHighlightAPI.highlight()` take a numeric
+ * index, but that index shifts whenever the chart reorders, filters, or
+ * folds tail categories into a `topN` "Other" bucket. A synchronized legend
+ * (or any external driver) should not cache the index it first saw; it
+ * should re-resolve the id against the current `getCategories()` output
+ * right before calling `highlight()`. Returns `null` when the id is not
+ * currently present (filtered out, or absorbed into an aggregate bucket),
+ * which callers should treat as "clear the highlight", not "highlight -1".
+ */
+export declare function resolveLegendIndex(categories: readonly string[], id: string): number | null;
 import type { LegendProperties } from './types';
 declare const Legend: import("svelte").Component<LegendProperties, {}, "">;
 type Legend = ReturnType<typeof Legend>;

package/dist/_chart/geometry.d.ts

@@ -30,6 +30,7 @@ export type AutoLayout = ChartDimensions & {
  * then bottom derives from the rotation outcome.
  */
 export declare function computeAutoLayout(input: AutoLayoutInput): AutoLayout;
+export declare const pieSliceValue: (value: number) => number;
 export declare function computePieLayout(data: Array<{
     label: string;
     value: number;
@@ -39,7 +40,7 @@ export declare function computeSankeyLayout(nodes: Array<{
     id: string;
     label?: string;
     color?: string;
-}>, links: Array<{
+}>, rawLinks: Array<{
     source: string;
     target: string;
     value: number;
@@ -48,6 +49,58 @@ export declare function computeSankeyLayout(nodes: Array<{
     nodes: ComputedSankeyNode[];
     links: ComputedSankeyLink[];
 };
+/**
+ * Minimal shape `joinByX` needs from a data point. `label` stays optional so
+ * both `LineChartDataPoint` and `AreaChartDataPoint` satisfy it structurally
+ * without either chart importing the other's types.
+ */
+export type JoinableXPoint = {
+    x: number;
+    y: number;
+    label?: string;
+};
+export type JoinableXSeries<P extends JoinableXPoint = JoinableXPoint> = {
+    data: ReadonlyArray<P>;
+};
+export type JoinedXValue<P extends JoinableXPoint = JoinableXPoint> = {
+    /** Index of `point` within that series' own `data` array (last-wins, see below). */
+    index: number;
+    point: P;
+};
+export type JoinedXRow<P extends JoinableXPoint = JoinableXPoint> = {
+    x: number;
+    /**
+     * One slot per input series, in the same order as `seriesList`. `null`
+     * marks a series with no sample at this x -- an absence, never a fabricated
+     * zero. A gap point (finite x, non-finite y) still gets a slot here; callers
+     * that must skip gaps check `Number.isFinite(value.point.y)` themselves.
+     */
+    values: ReadonlyArray<JoinedXValue<P> | null>;
+};
+/**
+ * Aligns multiple series by their x VALUE instead of by array position, so a
+ * shorter, offset, reordered or duplicate-x series never has another
+ * series' sample attributed to its column (array-position joins silently
+ * draw series B's 3rd point at series A's 3rd x instead of B's own x).
+ *
+ * One row is produced per distinct finite x across all series, sorted
+ * ascending -- callers do not need to pre-sort their data. Non-finite x
+ * (an unusual, distinct case from a gap's non-finite Y) cannot be placed in
+ * a column at all and is excluded from the join.
+ *
+ * Duplicate x within a single series: the LAST matching point wins. This
+ * matches `computeStackedValues` below (which is built on this same join)
+ * and avoids privileging an arbitrary "first sample" when a caller's array
+ * isn't time-ordered.
+ *
+ * This is the ONE alignment contract shared by tooltip context, hit-testing
+ * and stacking/normalization -- there is no second, position-based path for
+ * the common case where every series already shares one x sequence: with
+ * aligned input this produces exactly the positional pairing callers relied
+ * on before, because "nearest by x" and "same index" agree when the x's
+ * already match one-for-one.
+ */
+export declare function joinByX<P extends JoinableXPoint>(seriesList: ReadonlyArray<JoinableXSeries<P>>): JoinedXRow<P>[];
 export declare function computeStackedValues(seriesData: Array<Array<{
     x: number;
     y: number;

package/dist/_chart/geometry.js

@@ -64,8 +64,19 @@ export function computeAutoLayout(input) {
     return { ...dims, xRotate: rotate, xEvery: every, xLabelOffset: xLabelDepth + TITLE_BAND };
 }
 // ── Pie layout ──────────────────────────────────────────────────
+// Pie/funnel/sankey are value-accumulating charts: per docs/CHART_INPUT_POLICY.md
+// a negative contribution has no visual meaning and is a 0 contribution, and
+// (per computeStackedValues' precedent for this file) the same treatment is
+// extended to non-finite values here rather than excluding them as a gap --
+// unlike LineChart/AreaChart, a pie slice has no x-position to drop and
+// omitting a data row would shift every later slice's array index instead of
+// just rendering that one slice as zero-size. Exported so PieChart.svelte's
+// independent total (feeds isEmpty and the percentage denominator) can't drift
+// from this one -- two copies of an unguarded reduce is exactly how the
+// original defect stayed invisible in half the places it needed the guard.
+export const pieSliceValue = (value) => Number.isFinite(value) && value > 0 ? value : 0;
 export function computePieLayout(data, startAngle = -Math.PI / 2, padAngle = 0) {
-    const total = data.reduce((sum, d) => sum + Math.max(0, d.value), 0);
+    const total = data.reduce((sum, d) => sum + pieSliceValue(d.value), 0);
     if (total === 0) {
         return [];
     }
@@ -73,7 +84,7 @@ export function computePieLayout(data, startAngle = -Math.PI / 2, padAngle = 0)
     let angle = startAngle;
     for (let i = 0; i < data.length; i++) {
         const d = data[i];
-        const val = Math.max(0, d.value);
+        const val = pieSliceValue(d.value);
         const sliceAngle = (val / total) * Math.PI * 2;
         const start = angle + padAngle / 2;
         const end = angle + sliceAngle - padAngle / 2;
@@ -92,10 +103,22 @@ export function computePieLayout(data, startAngle = -Math.PI / 2, padAngle = 0)
     return slices;
 }
 // ── Sankey layout ───────────────────────────────────────────────
-export function computeSankeyLayout(nodes, links, width, height, nodeWidth = 16, nodePadding = 8, iterations = 6, minLinkWidth = 1) {
+export function computeSankeyLayout(nodes, rawLinks, width, height, nodeWidth = 16, nodePadding = 8, iterations = 6, minLinkWidth = 1) {
     if (nodes.length === 0) {
         return { nodes: [], links: [] };
     }
+    // Single choke point: every downstream read of a link's value -- adjacency,
+    // node heights, the relaxation loop's weighted centring, link widths, and
+    // the returned links themselves -- goes through this sanitized array, not
+    // the raw prop. A non-finite value that reached any one of those sites was
+    // enough to broadcast NaN to the whole diagram (the per-column recentre
+    // step below spreads one node's NaN to every node sharing its column, and
+    // the relaxation loop then carries that into every downstream column too),
+    // so guarding only the site that happened to be probed was not sufficient.
+    // Zero-contribution, not gap-exclusion: matches computeStackedValues'
+    // precedent for this file (see pieSliceValue above) since a link has no
+    // x-position to drop the way a LineChart/AreaChart gap point does.
+    const links = rawLinks.map((l) => Number.isFinite(l.value) && l.value >= 0 ? l : { ...l, value: 0 });
     // Build adjacency
     const outgoing = new Map();
     const incoming = new Map();
@@ -161,7 +184,12 @@ export function computeSankeyLayout(nodes, links, width, height, nodeWidth = 16,
         }
     }
     if (!Number.isFinite(pxPerValue)) {
-        // All-zero data: nothing carries volume, every bar collapses to the minimum.
+        // Nothing carries volume in any column, so every bar collapses to the
+        // minimum. Two different inputs land here: genuinely all-zero data, and
+        // a graph where every link was non-finite/negative and sanitized to 0
+        // above -- both reduce to the same "no volume anywhere" state, and the
+        // same minimum-width fallback is the correct degenerate render for
+        // either one (never NaN), so they do not need to stay distinguishable.
         pxPerValue = 0;
     }
     const linkRenderWidth = (value) => Math.max(minLinkWidth, value * pxPerValue);
@@ -263,7 +291,15 @@ export function computeSankeyLayout(nodes, links, width, height, nodeWidth = 16,
         column: columns.get(n.id) ?? 0
     }));
     const nodeById = new Map(computedNodes.map((n) => [n.id, n]));
-    const linkKey = (l) => `${l.source}${l.target}`;
+    // The separator is written as the ESCAPE `\u0000`, not as a raw NUL byte. A
+    // literal NUL in the source makes the whole file binary to every text tool:
+    // `file` reports it as data, `grep` stops reporting matches in it, and a
+    // review diff renders it as unviewable. This file carried one from the commit
+    // that added the Sankey layout, and it silently hid `computeStackedValues`
+    // from a repo-wide grep. The runtime string is identical either way -- a NUL
+    // is still the delimiter, because it is the one character a node id cannot
+    // contain, which is the whole reason it was chosen.
+    const linkKey = (l) => `${l.source}\u0000${l.target}`;
     // Link widths use the same global scale as node heights, so each node's link
     // stack fills its bar exactly and never runs past its bottom edge.
     const linkWidths = new Map();
@@ -327,21 +363,93 @@ export function computeSankeyLayout(nodes, links, width, height, nodeWidth = 16,
     });
     return { nodes: computedNodes, links: computedLinks };
 }
+/**
+ * Aligns multiple series by their x VALUE instead of by array position, so a
+ * shorter, offset, reordered or duplicate-x series never has another
+ * series' sample attributed to its column (array-position joins silently
+ * draw series B's 3rd point at series A's 3rd x instead of B's own x).
+ *
+ * One row is produced per distinct finite x across all series, sorted
+ * ascending -- callers do not need to pre-sort their data. Non-finite x
+ * (an unusual, distinct case from a gap's non-finite Y) cannot be placed in
+ * a column at all and is excluded from the join.
+ *
+ * Duplicate x within a single series: the LAST matching point wins. This
+ * matches `computeStackedValues` below (which is built on this same join)
+ * and avoids privileging an arbitrary "first sample" when a caller's array
+ * isn't time-ordered.
+ *
+ * This is the ONE alignment contract shared by tooltip context, hit-testing
+ * and stacking/normalization -- there is no second, position-based path for
+ * the common case where every series already shares one x sequence: with
+ * aligned input this produces exactly the positional pairing callers relied
+ * on before, because "nearest by x" and "same index" agree when the x's
+ * already match one-for-one.
+ */
+export function joinByX(seriesList) {
+    const perSeriesByX = seriesList.map((series) => {
+        const byX = new Map();
+        series.data.forEach((point, index) => {
+            if (Number.isFinite(point.x)) {
+                byX.set(point.x, { index, point });
+            }
+        });
+        return byX;
+    });
+    const allX = new Set();
+    for (const byX of perSeriesByX) {
+        for (const x of byX.keys()) {
+            allX.add(x);
+        }
+    }
+    return [...allX]
+        .sort((a, b) => a - b)
+        .map((x) => ({
+        x,
+        values: perSeriesByX.map((byX) => byX.get(x) ?? null)
+    }));
+}
 // ── Stacked values ──────────────────────────────────────────────
 export function computeStackedValues(seriesData) {
     if (seriesData.length === 0) {
         return [];
     }
-    const stacked = [];
-    const baselines = new Map();
-    for (const series of seriesData) {
-        const stackedSeries = [];
-        for (const point of series) {
-            const base = baselines.get(point.x) ?? 0;
-            stackedSeries.push({ x: point.x, y0: base, y1: base + point.y });
-            baselines.set(point.x, base + point.y);
+    // Built on joinByX -- the same by-x alignment used for tooltip/hit-testing
+    // -- rather than a second, independent accumulation. A series absent at a
+    // given x (including a NaN-gap point there) contributes no segment and no
+    // baseline shift at that column, instead of a fabricated zero-height slice
+    // or a NaN that would poison every series stacked above it.
+    const rows = joinByX(seriesData.map((data) => ({ data })));
+    const stacked = seriesData.map(() => []);
+    for (const row of rows) {
+        let base = 0;
+        for (let si = 0; si < seriesData.length; si++) {
+            const entry = row.values[si];
+            if (entry === null || !Number.isFinite(entry.point.y)) {
+                continue;
+            }
+            // A negative contributes ZERO height, it does not subtract.
+            //
+            // docs/CHART_INPUT_POLICY.md has always said so -- "a negative
+            // contribution to a stack or a percent-of-total does not have a
+            // well-defined visual meaning (a slice cannot have negative height), so it
+            // is treated as a 0 contribution rather than inverting the stack" -- and
+            // the clamp existed only in AreaChart's normalized path, behind
+            // `stackNormalize`. Plain `stacked: true` renders through here, where
+            // `base + y` let a negative REDUCE the baseline for every series above it.
+            //
+            // It was invisible rather than merely wrong: AreaChart's stacked y-domain
+            // starts at 0, so the inverted segment had nowhere to be drawn and landed
+            // at pixel 510 of a 340px plot -- off the bottom of the chart entirely.
+            //
+            // The segment is still pushed, with zero height, rather than skipped:
+            // skipping means "this series has no point at this x", which is what a gap
+            // already means, and would silently drop the series from the column.
+            const contribution = Math.max(0, entry.point.y);
+            const y1 = base + contribution;
+            stacked[si].push({ x: row.x, y0: base, y1 });
+            base = y1;
         }
-        stacked.push(stackedSeries);
     }
     return stacked;
 }

package/dist/_chart/interactions.d.ts

@@ -8,8 +8,12 @@ export type RelativePointerPosition = {
 /**
  * Pointer position relative to the top-left corner of `el`, or null when the
  * element is not mounted yet.
+ *
+ * Takes `MouseEvent` (which `PointerEvent` extends) since it only reads
+ * clientX/clientY — that also lets the mouse-only chart components (PieChart,
+ * SankeyChart) share this instead of hand-rolling the same formula.
  */
-export declare function pointerPositionIn(el: HTMLElement | null, event: PointerEvent): RelativePointerPosition | null;
+export declare function pointerPositionIn(el: HTMLElement | null, event: MouseEvent): RelativePointerPosition | null;
 /**
  * Touch taps never fire pointerleave, so a tap-opened tooltip would otherwise
  * stay stuck: dismiss when a pointerdown lands outside `containerEl`.

package/dist/_chart/interactions.js

@@ -1,9 +1,11 @@
-/**
- * Shared pointer-interaction helpers used by the chart components.
- */
+import { eventHitsInside } from '../_interaction/dismissal';
 /**
  * Pointer position relative to the top-left corner of `el`, or null when the
  * element is not mounted yet.
+ *
+ * Takes `MouseEvent` (which `PointerEvent` extends) since it only reads
+ * clientX/clientY — that also lets the mouse-only chart components (PieChart,
+ * SankeyChart) share this instead of hand-rolling the same formula.
  */
 export function pointerPositionIn(el, event) {
     if (el === null) {
@@ -24,8 +26,10 @@ export function dismissOnOutsidePointerDown(containerEl, onDismiss) {
         return () => { };
     }
     const dismiss = (event) => {
-        const target = event.target;
-        if (containerEl !== null && !(target instanceof Node && containerEl.contains(target))) {
+        // Through the custom-element build this listener sits outside the shadow
+        // root the chart renders in, so `event.target` is the host rather than
+        // anything the pointer actually hit. See eventHitsInside.
+        if (containerEl !== null && !eventHitsInside(containerEl, event)) {
             onDismiss();
         }
     };

package/dist/_chart/scales.js

@@ -1,4 +1,20 @@
 export function niceLinearDomain(min, max) {
+    // Defense-in-depth: every current caller already filters to finite values
+    // before reaching here (LineChart/AreaChart/BarChart/DualAxisBarChart), so
+    // this never fires for them. It exists so a future caller that forgets to
+    // filter degrades to a neutral domain instead of propagating NaN through
+    // every downstream tick and pixel computation (min === max never catches
+    // NaN, since NaN === NaN is false).
+    //
+    // It also MASKS those callers' own filters, which matters when testing them:
+    // remove a chart's finite-filter and the axis no longer loses its ticks, it
+    // silently scales to [0, 1] instead. So a `ticks.length > 0` assertion is
+    // vacuous as a test of a caller-side guard — it passes either way. Assert on
+    // tick *content* against a reference render (see BarChart/non-finite.test.ts)
+    // instead.
+    if (!Number.isFinite(min) || !Number.isFinite(max)) {
+        return [0, 1];
+    }
     if (min === max) {
         return min === 0 ? [0, 1] : [min > 0 ? 0 : min * 2, max > 0 ? max * 2 : 0];
     }

package/dist/_chart/temporal.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Documented, tested calendar-tick helpers for the temporal limitation in
+ * Line/AreaChart's x axis -- see docs/CHART_INPUT_POLICY.md#calendar--temporal-axes
+ * for the full policy this satisfies.
+ *
+ * Line/AreaChart's x axis is a plain numeric linear scale (`createLinearScale`
+ * in `./scales`). Epoch-millisecond x values preserve relative distance --
+ * `t2 - t1` still means the same thing in pixels as it does in time -- but
+ * `computeLinearTicks`'s "nice round number" ticks are not calendar-aware:
+ * they land on values like 1_700_000_000_000 or a rounded step in
+ * milliseconds, not on UTC midnight/week/month boundaries. `xTickFormat`
+ * only changes how a tick's existing numeric position is labelled; it cannot
+ * move that position onto a calendar boundary, and neither chart accepts an
+ * explicit tick-position override today (`Axis.svelte`, shared by every chart
+ * type in this package, always derives its own tick positions from the
+ * scale) -- wiring one in is deliberately out of scope here, since it would
+ * change a contract every other chart consumes, not just these two.
+ *
+ * `computeUtcTicks`/`formatUtcTick` are the disclosed alternative: pure,
+ * fully-tested functions a caller can use to compute correct UTC calendar
+ * tick positions and labels for their own presentation (a custom axis
+ * overlay, a legend of period boundaries, or pre-bucketing data into
+ * calendar-aligned x values before it ever reaches the chart). They do not
+ * replace the chart's linear scale with array indices, and they impose
+ * nothing on a caller who does not import this module -- both charts behave
+ * exactly as before.
+ */
+export type UtcTickUnit = 'day' | 'week' | 'month';
+/**
+ * Computes UTC calendar-aligned tick positions (epoch ms) covering
+ * `[domain[0], domain[1]]`. `unit` picks the calendar grain; ticks are
+ * thinned so the count stays at or under `maxTicks` (mirrors Line/AreaChart's
+ * own tick-count capping).
+ *
+ * Returns `[]` for a non-finite or inverted domain -- callers pass this
+ * straight into `xTicks`, and an empty array there just falls back to no
+ * override (see LineChart/AreaChart docs).
+ */
+export declare function computeUtcTicks(domain: readonly [number, number], unit: UtcTickUnit, maxTicks?: number): number[];
+/**
+ * Formats an epoch-ms tick value produced by `computeUtcTicks` as a UTC
+ * calendar label ("Mar 4" for day/week, "Mar 2026" for month). Pass as
+ * `xTickFormat` alongside `xTicks={computeUtcTicks(...)}`.
+ */
+export declare function formatUtcTick(value: number, unit?: UtcTickUnit): string;