@fundar/data-chart-telling 0.0.25 → 0.0.27

package/dist/markers/HoverMarker.svelte

@@ -1,11 +1,10 @@
 <script lang="ts">
-  import { RuleX, RuleY } from 'svelteplot';
   import DotMarker from './DotMarker.svelte';
   import TextMarker from './TextMarker.svelte';
+  import RuleMarker from './RuleMarker.svelte';
   import { getConfiguration } from '../configuration/config.svelte';
   import type { MarkerProps } from '../types/markers/props';
-  import type { AxisValue } from '../types/plots/axis';
-  import type { DotStyle, FontStyle, StrokeStyle } from '../types/plots/styling';
+  import type { HoverMarkerConfig } from '../types/markers/common';
   import type { HoverDisplayPoint } from '../types/layout/tooltip';
 
   /**
@@ -14,31 +13,45 @@
    * correctly in every facet — that is what makes cross-facet sync work without
    * any pixel math. Draws optional x/y crosshair rules plus a dot + value label
    * for each matched point.
+   *
+   * Takes the raw `marker` config plus the couple of things it can't know on
+   * its own — `activePoint` (the specific matched point actually under the
+   * cursor, for the crosshair position; see `controller.svelte.ts`'s own doc
+   * comment) and whether the active hover strategy implies a crosshair on
+   * each axis by default — the same "component owns its own rendering"
+   * pattern `BarMarker`/`RuleMarker` follow. `activePoint`/
+   * `impliesCrosshairX`/`impliesCrosshairY` are all optional and default to
+   * "no crosshair".
    */
   interface Props extends MarkerProps<HoverDisplayPoint> {
-    ruleX?: AxisValue | null;
-    ruleY?: AxisValue | null;
-    showLabels?: boolean;
-    format?: (point: HoverDisplayPoint) => string;
-    ruleStyle?: StrokeStyle;
-    dotStyle?: DotStyle;
-    fontStyle?: FontStyle;
+    /** Narrowed to just the fields this component reads — `HoverMarkerConfig` also carries routing/scoping fields (`series`/`scope`/`strategy`/`sync`) it has no use for. */
+    marker: Pick<HoverMarkerConfig, 'ruleX' | 'ruleY' | 'showLabels' | 'format' | 'ruleStyle' | 'dotStyle' | 'fontStyle'>;
+    activePoint?: HoverDisplayPoint | null;
+    impliesCrosshairX?: boolean;
+    impliesCrosshairY?: boolean;
   }
 
   let {
     data = [],
-    ruleX = null,
-    ruleY = null,
-    showLabels = true,
-    format,
-    ruleStyle,
-    dotStyle,
-    fontStyle,
+    marker,
+    activePoint = null,
+    impliesCrosshairX = false,
+    impliesCrosshairY = false,
     seriesColor,
   }: Props = $props();
 
   const cfg = $derived(getConfiguration());
 
+  const showCrosshairX = $derived(marker.ruleX !== false && (impliesCrosshairX || marker.ruleX === true));
+  const showCrosshairY = $derived(marker.ruleY !== false && (impliesCrosshairY || marker.ruleY === true));
+  const ruleX = $derived(showCrosshairX ? (activePoint?.x ?? null) : null);
+  const ruleY = $derived(showCrosshairY ? (activePoint?.y ?? null) : null);
+  const showLabels = $derived(marker.showLabels ?? true);
+  const format = $derived(marker.format);
+  const ruleStyle = $derived(marker.ruleStyle);
+  const dotStyle = $derived(marker.dotStyle);
+  const fontStyle = $derived(marker.fontStyle);
+
   /** Explicit style wins; otherwise fall back to the series color, then the point's own resolved color. */
   const resolveColor = (explicit: string | undefined, point: HoverDisplayPoint) =>
     explicit ?? seriesColor ?? point.color;
@@ -81,29 +94,15 @@
 </script>
 
 {#if ruleX != null}
-  <RuleX
-    data={[{ v: ruleX }]}
-    x={(d) => d.v}
-    stroke={ruleStyle?.stroke ?? cfg.hover.rule.stroke}
-    strokeOpacity={ruleStyle?.strokeOpacity ?? cfg.hover.rule.strokeOpacity}
-    strokeWidth={ruleStyle?.strokeWidth ?? cfg.hover.rule.strokeWidth}
-    strokeDasharray={ruleStyle?.strokeDasharray ?? cfg.hover.rule.strokeDasharray}
-  />
+  <RuleMarker axis="x" value={ruleX} style={{ ...cfg.hover.rule, ...ruleStyle }} />
 {/if}
 
 {#if ruleY != null}
-  <RuleY
-    data={[{ v: ruleY }]}
-    y={(d) => d.v}
-    stroke={ruleStyle?.stroke ?? cfg.hover.rule.stroke}
-    strokeOpacity={ruleStyle?.strokeOpacity ?? cfg.hover.rule.strokeOpacity}
-    strokeWidth={ruleStyle?.strokeWidth ?? cfg.hover.rule.strokeWidth}
-    strokeDasharray={ruleStyle?.strokeDasharray ?? cfg.hover.rule.strokeDasharray}
-  />
+  <RuleMarker axis="y" value={ruleY} style={{ ...cfg.hover.rule, ...ruleStyle }} />
 {/if}
 
 {#if data.length > 0}
-  {#each data as point (point.series ?? `${point.x}_${point.y}`)}
+  {#each data as point (`${point.series ?? ''}_${point.x}_${point.y}`)}
     <!-- Pixel nudge for plot kinds whose series position isn't fully captured
          by x/y alone (e.g. BarPlot's 'grouped' layout) — see HoverDisplayPoint.dx/dy. -->
     <g transform="translate({point.dx ?? 0}, {point.dy ?? 0})">
@@ -121,7 +120,7 @@
     </g>
   {/each}
   {#if showLabels}
-    {#each data as point (point.series ?? `${point.x}_${point.y}`)}
+    {#each data as point (`${point.series ?? ''}_${point.x}_${point.y}`)}
       <g transform="translate({point.dx ?? 0}, {point.dy ?? 0})">
         <TextMarker
           data={[point]}

package/dist/markers/HoverMarker.svelte.d.ts

@@ -1,6 +1,5 @@
 import type { MarkerProps } from '../types/markers/props';
-import type { AxisValue } from '../types/plots/axis';
-import type { DotStyle, FontStyle, StrokeStyle } from '../types/plots/styling';
+import type { HoverMarkerConfig } from '../types/markers/common';
 import type { HoverDisplayPoint } from '../types/layout/tooltip';
 /**
  * In-SVG hover highlight, rendered *inside* a `<Plot>`. Because it positions
@@ -8,15 +7,22 @@ import type { HoverDisplayPoint } from '../types/layout/tooltip';
  * correctly in every facet — that is what makes cross-facet sync work without
  * any pixel math. Draws optional x/y crosshair rules plus a dot + value label
  * for each matched point.
+ *
+ * Takes the raw `marker` config plus the couple of things it can't know on
+ * its own — `activePoint` (the specific matched point actually under the
+ * cursor, for the crosshair position; see `controller.svelte.ts`'s own doc
+ * comment) and whether the active hover strategy implies a crosshair on
+ * each axis by default — the same "component owns its own rendering"
+ * pattern `BarMarker`/`RuleMarker` follow. `activePoint`/
+ * `impliesCrosshairX`/`impliesCrosshairY` are all optional and default to
+ * "no crosshair".
  */
 interface Props extends MarkerProps<HoverDisplayPoint> {
-    ruleX?: AxisValue | null;
-    ruleY?: AxisValue | null;
-    showLabels?: boolean;
-    format?: (point: HoverDisplayPoint) => string;
-    ruleStyle?: StrokeStyle;
-    dotStyle?: DotStyle;
-    fontStyle?: FontStyle;
+    /** Narrowed to just the fields this component reads — `HoverMarkerConfig` also carries routing/scoping fields (`series`/`scope`/`strategy`/`sync`) it has no use for. */
+    marker: Pick<HoverMarkerConfig, 'ruleX' | 'ruleY' | 'showLabels' | 'format' | 'ruleStyle' | 'dotStyle' | 'fontStyle'>;
+    activePoint?: HoverDisplayPoint | null;
+    impliesCrosshairX?: boolean;
+    impliesCrosshairY?: boolean;
 }
 declare const HoverMarker: import("svelte").Component<Props, {}, "">;
 type HoverMarker = ReturnType<typeof HoverMarker>;

package/dist/markers/LineMarker.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+  import { Line } from 'svelteplot';
+  import type { LineMarkerConfig } from '../types/markers/common';
+
+  /** Renders one `'line'` marker as a `<Line>` call — just the stroke. Endpoint dots are a separate `'dot'` marker. */
+  let { marker }: { marker: LineMarkerConfig } = $props();
+</script>
+
+<Line
+  data={marker.data}
+  x={marker.x}
+  y={marker.y}
+  stroke={marker.style?.stroke}
+  strokeWidth={marker.style?.strokeWidth}
+  strokeOpacity={marker.style?.strokeOpacity}
+  strokeDasharray={marker.style?.strokeDasharray}
+  strokeLinejoin={marker.style?.strokeLinejoin}
+  strokeLinecap={marker.style?.strokeLinecap}
+/>

package/dist/markers/LineMarker.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { LineMarkerConfig } from '../types/markers/common';
+type $$ComponentProps = {
+    marker: LineMarkerConfig;
+};
+declare const LineMarker: import("svelte").Component<$$ComponentProps, {}, "">;
+type LineMarker = ReturnType<typeof LineMarker>;
+export default LineMarker;

package/dist/markers/LinkMarker.svelte

@@ -0,0 +1,42 @@
+<script lang="ts">
+  import { Geo } from 'svelteplot';
+  import { resolveAccessor } from '../plots/utils/accessors';
+  import { greatCircleInterpolate } from '../plots/utils/geoAccessors';
+  import type { GeoLinkMarkerConfig } from '../types/markers/geo';
+
+  /** Renders one `'link'` marker — geodesic-aware lines between point pairs, as a synthetic `LineString` fed through `<Geo>`. */
+  let { marker }: { marker: GeoLinkMarkerConfig } = $props();
+
+  const getX1 = $derived(resolveAccessor(marker.x1));
+  const getY1 = $derived(resolveAccessor(marker.y1));
+  const getX2 = $derived(resolveAccessor(marker.x2));
+  const getY2 = $derived(resolveAccessor(marker.y2));
+
+  const linkFeatures = $derived(
+    marker.data.map((d) => ({
+      type: 'Feature' as const,
+      properties: {},
+      geometry: {
+        type: 'LineString' as const,
+        coordinates:
+          marker.curve === 'linear'
+            ? [
+                [Number(getX1(d)), Number(getY1(d))],
+                [Number(getX2(d)), Number(getY2(d))],
+              ]
+            : greatCircleInterpolate(Number(getX1(d)), Number(getY1(d)), Number(getX2(d)), Number(getY2(d))),
+      },
+    })),
+  );
+</script>
+
+<!-- No `fill` prop: svelteplot treats any string as scale-worthy unless it's a real CSS color, so a literal `'none'` would run through the color scale instead of staying unfilled. Omitting it leaves svelteplot's own unfilled default in place. -->
+<Geo
+  class="link"
+  data={linkFeatures}
+  stroke={marker.style?.stroke ?? 'currentColor'}
+  strokeWidth={marker.style?.strokeWidth ?? 1}
+  strokeOpacity={marker.style?.strokeOpacity}
+  strokeDasharray={marker.style?.strokeDasharray}
+  style="vector-effect: non-scaling-stroke"
+/>

package/dist/markers/LinkMarker.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { GeoLinkMarkerConfig } from '../types/markers/geo';
+type $$ComponentProps = {
+    marker: GeoLinkMarkerConfig;
+};
+declare const LinkMarker: import("svelte").Component<$$ComponentProps, {}, "">;
+type LinkMarker = ReturnType<typeof LinkMarker>;
+export default LinkMarker;

package/dist/markers/RuleMarker.svelte

@@ -0,0 +1,24 @@
+<script lang="ts">
+  import { RuleX, RuleY } from 'svelteplot';
+  import type { AxisValue } from '../types/layout/scales';
+  import type { StrokeStyle } from '../types/plots/styling';
+
+  /**
+   * A single vertical (`axis: 'x'`) or horizontal (`axis: 'y'`) reference
+   * line at `value` — shared by author-configured `'rule'` markers and
+   * `HoverMarker`'s crosshair. Falls back to `'currentColor'`/`1` when the
+   * caller supplies no style.
+   */
+  let { axis, value, style }: { axis: 'x' | 'y'; value: AxisValue; style?: StrokeStyle } = $props();
+
+  const RuleMark = $derived(axis === 'x' ? RuleX : RuleY);
+</script>
+
+<RuleMark
+  data={[{ v: value }]}
+  {...axis === 'x' ? { x: (d: { v: AxisValue }) => d.v } : { y: (d: { v: AxisValue }) => d.v }}
+  stroke={style?.stroke ?? 'currentColor'}
+  strokeWidth={style?.strokeWidth ?? 1}
+  strokeOpacity={style?.strokeOpacity ?? 1}
+  strokeDasharray={style?.strokeDasharray}
+/>

package/dist/markers/RuleMarker.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { AxisValue } from '../types/layout/scales';
+import type { StrokeStyle } from '../types/plots/styling';
+type $$ComponentProps = {
+    axis: 'x' | 'y';
+    value: AxisValue;
+    style?: StrokeStyle;
+};
+declare const RuleMarker: import("svelte").Component<$$ComponentProps, {}, "">;
+type RuleMarker = ReturnType<typeof RuleMarker>;
+export default RuleMarker;

package/dist/markers/SphereMarker.svelte

@@ -0,0 +1,15 @@
+<script lang="ts">
+  import { Sphere } from 'svelteplot';
+  import type { GeoSphereMarkerConfig } from '../types/markers/geo';
+
+  /** Renders one `'sphere'` marker — the outer globe outline. */
+  let { marker }: { marker: GeoSphereMarkerConfig } = $props();
+</script>
+
+<Sphere
+  fill={marker.style?.fill}
+  fillOpacity={marker.style?.fillOpacity}
+  stroke={marker.style?.stroke ?? 'currentColor'}
+  strokeWidth={marker.style?.strokeWidth ?? 1}
+  style="vector-effect: non-scaling-stroke"
+/>

package/dist/markers/SphereMarker.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { GeoSphereMarkerConfig } from '../types/markers/geo';
+type $$ComponentProps = {
+    marker: GeoSphereMarkerConfig;
+};
+declare const SphereMarker: import("svelte").Component<$$ComponentProps, {}, "">;
+type SphereMarker = ReturnType<typeof SphereMarker>;
+export default SphereMarker;

package/dist/markers/TextMarker.svelte

@@ -1,7 +1,7 @@
 <script lang="ts" generics="TData = Record<string, unknown>">
   import { Text } from 'svelteplot';
   import type { MarkerProps } from '../types/markers/props';
-  import type { AxisValue } from '../types/plots/axis';
+  import type { AxisValue } from '../types/layout/scales';
   import type { FontStyle } from '../types/plots/styling';
 
   interface Props extends MarkerProps<TData> {

package/dist/markers/TextMarker.svelte.d.ts

@@ -1,5 +1,5 @@
 import type { MarkerProps } from '../types/markers/props';
-import type { AxisValue } from '../types/plots/axis';
+import type { AxisValue } from '../types/layout/scales';
 import type { FontStyle } from '../types/plots/styling';
 declare function $$render<TData = Record<string, unknown>>(): {
     props: MarkerProps<TData> & {

package/dist/markers/VectorMarker.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+  import { Vector } from 'svelteplot';
+  import type { GeoVectorMarkerConfig } from '../types/markers/geo';
+
+  /** Renders one `'vector'` marker — arrows/spikes at points. */
+  let { marker }: { marker: GeoVectorMarkerConfig } = $props();
+</script>
+
+<Vector
+  data={marker.data}
+  x={marker.x}
+  y={marker.y}
+  length={marker.length}
+  rotate={marker.rotate}
+  shape={marker.shape ?? 'arrow'}
+  anchor={marker.anchor}
+  fill={marker.style?.fill ?? 'currentColor'}
+  stroke={marker.style?.stroke}
+  strokeWidth={marker.style?.strokeWidth}
+/>

package/dist/markers/VectorMarker.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { GeoVectorMarkerConfig } from '../types/markers/geo';
+type $$ComponentProps = {
+    marker: GeoVectorMarkerConfig;
+};
+declare const VectorMarker: import("svelte").Component<$$ComponentProps, {}, "">;
+type VectorMarker = ReturnType<typeof VectorMarker>;
+export default VectorMarker;

package/dist/markers/inset/InsetMarker.svelte

@@ -4,12 +4,13 @@
   import { insetBox } from './insetLayout';
   import { filterGeometryParts } from '../../plots/utils/geoAccessors';
   import TooltipLayout from '../../layout/tooltip/TooltipLayout.svelte';
-  import type { GeoInsetMarker } from '../../types/markers/geo';
+  import type { GeoInsetMarkerConfig } from '../../types/markers/geo';
   import type { GeoFeature } from '../../types/plots/data/geo';
+  import type { TooltipAnchorX, TooltipAnchorY } from '../../types/layout/tooltip';
 
   /**
    * A small, independently-projected map panel anchored to a corner/edge of
-   * the plot — see `GeoInsetMarker`'s doc comment. Renders raw `<path>`s via
+   * the plot — see `GeoInsetMarkerConfig`'s doc comment. Renders raw `<path>`s via
    * its own `d3-geo` `geoPath`, deliberately not svelteplot's `<Geo>` mark:
    * that mark is bound to the plot's *shared* projection scale, but an inset
    * needs its own, independently fit to just what it's showing.
@@ -22,8 +23,10 @@
     left = 0,
     top = 0,
     defaultFill,
+    tooltipAnchorX,
+    tooltipAnchorY,
   }: {
-    marker: GeoInsetMarker<TProps>;
+    marker: GeoInsetMarkerConfig<TProps>;
     /**
      * The plot's own already-tagged features (`__id` set), with full,
      * unreduced geometry regardless of the plot's own `excludeParts` — used
@@ -45,6 +48,9 @@
     left?: number;
     top?: number;
     defaultFill: string;
+    /** The plot's own top-level `tooltip.anchorX`/`anchorY` — the fallback this inset's own tooltip inherits when its own is unset, before the system default. */
+    tooltipAnchorX?: TooltipAnchorX;
+    tooltipAnchorY?: TooltipAnchorY;
   } = $props();
 
   const insetFeatures = $derived.by((): GeoFeature<Record<string, unknown>>[] => {
@@ -84,44 +90,33 @@
     return geoPath(projection);
   });
 
-  /**
-   * Nearest-feature hover, local to this inset only — mirrors the main
-   * map's own "always nearest feature centroid" behaviour (see `Plot.svelte`),
-   * but computed against this inset's own fitted `path`/projection instead
-   * of the plot's shared one, since svelteplot's `<Pointer>` (which drives
-   * the main map's hover) only ever matches the main projection's own
-   * feature positions — it has no way to reach content an inset draws at a
-   * wholly different scale/location.
-   */
-  const centroids = $derived.by(() => {
-    if (!path) return [];
-    return insetFeatures.map((f) => ({ feature: f, centroid: path.centroid(f as GeoJSON.Feature) }));
-  });
-
   let hovered = $state<{ feature: GeoFeature<Record<string, unknown>>; x: number; y: number } | null>(null);
 
-  // Any point within the inset box always matches its nearest feature —
-  // there's no reason for a hover inside a small, self-contained panel to
-  // ever come up empty, so the threshold is just the box's own diagonal.
-  const maxDistance = $derived(Math.hypot(box.width, box.height));
+  /**
+   * Purely a coordinate reference (`pointer-events: none` — never itself a
+   * hover target) sized exactly to the inset's own box, so `onInsetPointer*`
+   * below can convert a screen-space pointer event into the same box-local
+   * `x`/`y` space `TooltipLayout`'s `bounds` expects, the same way
+   * `BasePlotLayout`'s own cursor tracking does for the main map.
+   */
+  let boxRectEl = $state<SVGRectElement>();
 
-  function onInsetPointerMove(e: PointerEvent) {
-    const rect = (e.currentTarget as SVGRectElement).getBoundingClientRect();
-    const x = e.clientX - rect.left;
-    const y = e.clientY - rect.top;
-    let nearest: (typeof centroids)[number] | null = null;
-    let nearestDist = Infinity;
-    for (const c of centroids) {
-      const d = Math.hypot(c.centroid[0] - x, c.centroid[1] - y);
-      if (d < nearestDist) {
-        nearestDist = d;
-        nearest = c;
-      }
-    }
-    hovered = nearest && nearestDist <= maxDistance ? { feature: nearest.feature, x, y } : null;
+  /**
+   * Which exact feature `<path>` the browser's own SVG hit-testing resolved
+   * the event to — mirrors the main map's own `<Geo onpointerenter>` (see
+   * `Plot.svelte`) rather than approximating it by nearest centroid
+   * distance, which used to make hover pick the wrong (if geometrically
+   * nearer-by-centroid) neighboring feature, exactly the bug that fix
+   * addressed for the main map.
+   */
+  function onInsetFeaturePointer(e: PointerEvent, f: GeoFeature<Record<string, unknown>>) {
+    const rect = boxRectEl?.getBoundingClientRect();
+    const x = e.clientX - (rect?.left ?? 0);
+    const y = e.clientY - (rect?.top ?? 0);
+    hovered = { feature: f, x, y };
   }
 
-  function onInsetPointerLeave() {
+  function onInsetFeatureLeave() {
     hovered = null;
   }
 </script>
@@ -129,6 +124,7 @@
 {#if path}
   <g class="dct-geo-inset" transform="translate({box.left + left}, {box.top + top})">
     {#each insetFeatures as f, i (i)}
+      <!-- svelte-ignore a11y_no_static_element_interactions -->
       <path
         d={path(f as GeoJSON.Feature) ?? undefined}
         fill={marker.style?.fill ?? defaultFill}
@@ -136,19 +132,14 @@
         stroke={marker.style?.stroke ?? 'currentColor'}
         stroke-width={marker.style?.strokeWidth ?? 0.5}
         style="vector-effect: non-scaling-stroke"
+        onpointerenter={marker.tooltip ? (e: PointerEvent) => onInsetFeaturePointer(e, f) : undefined}
+        onpointermove={marker.tooltip ? (e: PointerEvent) => onInsetFeaturePointer(e, f) : undefined}
+        onpointerleave={marker.tooltip ? onInsetFeatureLeave : undefined}
       />
     {/each}
     {#if marker.tooltip}
       <!-- svelte-ignore a11y_no_static_element_interactions -->
-      <rect
-        x={0}
-        y={0}
-        width={box.width}
-        height={box.height}
-        fill="transparent"
-        onpointermove={onInsetPointerMove}
-        onpointerleave={onInsetPointerLeave}
-      />
+      <rect x={0} y={0} width={box.width} height={box.height} fill="transparent" pointer-events="none" bind:this={boxRectEl} />
     {/if}
     {#if marker.tooltip}
       {@const tooltip = marker.tooltip}
@@ -162,6 +153,8 @@
             rows={hovered ? [hovered.feature] : []}
             format={tooltip.format}
             content={tooltip.content}
+            anchorX={tooltip.anchorX ?? tooltipAnchorX}
+            anchorY={tooltip.anchorY ?? tooltipAnchorY}
           />
         </div>
       </foreignObject>

package/dist/markers/inset/InsetMarker.svelte.d.ts

@@ -1,8 +1,9 @@
-import type { GeoInsetMarker } from '../../types/markers/geo';
+import type { GeoInsetMarkerConfig } from '../../types/markers/geo';
 import type { GeoFeature } from '../../types/plots/data/geo';
+import type { TooltipAnchorX, TooltipAnchorY } from '../../types/layout/tooltip';
 declare function $$render<TProps extends Record<string, unknown>>(): {
     props: {
-        marker: GeoInsetMarker<TProps>;
+        marker: GeoInsetMarkerConfig<TProps>;
         /**
          * The plot's own already-tagged features (`__id` set), with full,
          * unreduced geometry regardless of the plot's own `excludeParts` — used
@@ -26,6 +27,9 @@ declare function $$render<TProps extends Record<string, unknown>>(): {
         left?: number;
         top?: number;
         defaultFill: string;
+        /** The plot's own top-level `tooltip.anchorX`/`anchorY` — the fallback this inset's own tooltip inherits when its own is unset, before the system default. */
+        tooltipAnchorX?: TooltipAnchorX;
+        tooltipAnchorY?: TooltipAnchorY;
     };
     exports: {};
     bindings: "";