@veritone-ce/design-system 2.9.0-next.2 → 2.9.0-next.3

package/dist/esm/bundled_modules/vega-time/build/vega-time.js

@@ -0,0 +1,314 @@
+import { extend, array, error, hasOwnProperty as has, span, peek, toSet, constant, zero, one } from '../../vega-util/build/vega-util.js';
+import { timeMonth, utcMonth } from '../../d3-time/src/month.js';
+import { utcDay, timeDay } from '../../d3-time/src/day.js';
+import { utcSunday, timeSunday } from '../../d3-time/src/week.js';
+import bisector from '../../d3-array/src/bisector.js';
+import { tickStep } from '../../d3-array/src/ticks.js';
+import { millisecond } from '../../d3-time/src/millisecond.js';
+import { second } from '../../d3-time/src/second.js';
+import { timeMinute, utcMinute } from '../../d3-time/src/minute.js';
+import { timeHour, utcHour } from '../../d3-time/src/hour.js';
+import { timeYear, utcYear } from '../../d3-time/src/year.js';
+
+const YEAR = 'year';
+const QUARTER = 'quarter';
+const MONTH = 'month';
+const WEEK = 'week';
+const DATE = 'date';
+const DAY = 'day';
+const DAYOFYEAR = 'dayofyear';
+const HOURS = 'hours';
+const MINUTES = 'minutes';
+const SECONDS = 'seconds';
+const MILLISECONDS = 'milliseconds';
+const TIME_UNITS = [YEAR, QUARTER, MONTH, WEEK, DATE, DAY, DAYOFYEAR, HOURS, MINUTES, SECONDS, MILLISECONDS];
+const UNITS = TIME_UNITS.reduce((o, u, i) => (o[u] = 1 + i, o), {});
+function timeUnits(units) {
+  const u = array(units).slice(),
+    m = {};
+
+  // check validity
+  if (!u.length) error('Missing time unit.');
+  u.forEach(unit => {
+    if (has(UNITS, unit)) {
+      m[unit] = 1;
+    } else {
+      error(`Invalid time unit: ${unit}.`);
+    }
+  });
+  const numTypes = (m[WEEK] || m[DAY] ? 1 : 0) + (m[QUARTER] || m[MONTH] || m[DATE] ? 1 : 0) + (m[DAYOFYEAR] ? 1 : 0);
+  if (numTypes > 1) {
+    error(`Incompatible time units: ${units}`);
+  }
+
+  // ensure proper sort order
+  u.sort((a, b) => UNITS[a] - UNITS[b]);
+  return u;
+}
+const defaultSpecifiers = {
+  [YEAR]: '%Y ',
+  [QUARTER]: 'Q%q ',
+  [MONTH]: '%b ',
+  [DATE]: '%d ',
+  [WEEK]: 'W%U ',
+  [DAY]: '%a ',
+  [DAYOFYEAR]: '%j ',
+  [HOURS]: '%H:00',
+  [MINUTES]: '00:%M',
+  [SECONDS]: ':%S',
+  [MILLISECONDS]: '.%L',
+  [`${YEAR}-${MONTH}`]: '%Y-%m ',
+  [`${YEAR}-${MONTH}-${DATE}`]: '%Y-%m-%d ',
+  [`${HOURS}-${MINUTES}`]: '%H:%M'
+};
+function timeUnitSpecifier(units, specifiers) {
+  const s = extend({}, defaultSpecifiers, specifiers),
+    u = timeUnits(units),
+    n = u.length;
+  let fmt = '',
+    start = 0,
+    end,
+    key;
+  for (start = 0; start < n;) {
+    for (end = u.length; end > start; --end) {
+      key = u.slice(start, end).join('-');
+      if (s[key] != null) {
+        fmt += s[key];
+        start = end;
+        break;
+      }
+    }
+  }
+  return fmt.trim();
+}
+
+const t0 = new Date();
+function localYear(y) {
+  t0.setFullYear(y);
+  t0.setMonth(0);
+  t0.setDate(1);
+  t0.setHours(0, 0, 0, 0);
+  return t0;
+}
+function dayofyear(d) {
+  return localDayOfYear(new Date(d));
+}
+function week(d) {
+  return localWeekNum(new Date(d));
+}
+function localDayOfYear(d) {
+  return timeDay.count(localYear(d.getFullYear()) - 1, d);
+}
+function localWeekNum(d) {
+  return timeSunday.count(localYear(d.getFullYear()) - 1, d);
+}
+function localFirst(y) {
+  return localYear(y).getDay();
+}
+function localDate(y, m, d, H, M, S, L) {
+  if (0 <= y && y < 100) {
+    const date = new Date(-1, m, d, H, M, S, L);
+    date.setFullYear(y);
+    return date;
+  }
+  return new Date(y, m, d, H, M, S, L);
+}
+function utcdayofyear(d) {
+  return utcDayOfYear(new Date(d));
+}
+function utcweek(d) {
+  return utcWeekNum(new Date(d));
+}
+function utcDayOfYear(d) {
+  const y = Date.UTC(d.getUTCFullYear(), 0, 1);
+  return utcDay.count(y - 1, d);
+}
+function utcWeekNum(d) {
+  const y = Date.UTC(d.getUTCFullYear(), 0, 1);
+  return utcSunday.count(y - 1, d);
+}
+function utcFirst(y) {
+  t0.setTime(Date.UTC(y, 0, 1));
+  return t0.getUTCDay();
+}
+function utcDate(y, m, d, H, M, S, L) {
+  if (0 <= y && y < 100) {
+    const date = new Date(Date.UTC(-1, m, d, H, M, S, L));
+    date.setUTCFullYear(d.y);
+    return date;
+  }
+  return new Date(Date.UTC(y, m, d, H, M, S, L));
+}
+
+function floor(units, step, get, inv, newDate) {
+  const s = step || 1,
+    b = peek(units),
+    _ = (unit, p, key) => {
+      key = key || unit;
+      return getUnit(get[key], inv[key], unit === b && s, p);
+    };
+  const t = new Date(),
+    u = toSet(units),
+    y = u[YEAR] ? _(YEAR) : constant(2012),
+    m = u[MONTH] ? _(MONTH) : u[QUARTER] ? _(QUARTER) : zero,
+    d = u[WEEK] && u[DAY] ? _(DAY, 1, WEEK + DAY) : u[WEEK] ? _(WEEK, 1) : u[DAY] ? _(DAY, 1) : u[DATE] ? _(DATE, 1) : u[DAYOFYEAR] ? _(DAYOFYEAR, 1) : one,
+    H = u[HOURS] ? _(HOURS) : zero,
+    M = u[MINUTES] ? _(MINUTES) : zero,
+    S = u[SECONDS] ? _(SECONDS) : zero,
+    L = u[MILLISECONDS] ? _(MILLISECONDS) : zero;
+  return function (v) {
+    t.setTime(+v);
+    const year = y(t);
+    return newDate(year, m(t), d(t, year), H(t), M(t), S(t), L(t));
+  };
+}
+function getUnit(f, inv, step, phase) {
+  const u = step <= 1 ? f : phase ? (d, y) => phase + step * Math.floor((f(d, y) - phase) / step) : (d, y) => step * Math.floor(f(d, y) / step);
+  return inv ? (d, y) => inv(u(d, y), y) : u;
+}
+
+// returns the day of the year based on week number, day of week,
+// and the day of the week for the first day of the year
+function weekday(week, day, firstDay) {
+  return day + week * 7 - (firstDay + 6) % 7;
+}
+
+// -- LOCAL TIME --
+
+const localGet = {
+  [YEAR]: d => d.getFullYear(),
+  [QUARTER]: d => Math.floor(d.getMonth() / 3),
+  [MONTH]: d => d.getMonth(),
+  [DATE]: d => d.getDate(),
+  [HOURS]: d => d.getHours(),
+  [MINUTES]: d => d.getMinutes(),
+  [SECONDS]: d => d.getSeconds(),
+  [MILLISECONDS]: d => d.getMilliseconds(),
+  [DAYOFYEAR]: d => localDayOfYear(d),
+  [WEEK]: d => localWeekNum(d),
+  [WEEK + DAY]: (d, y) => weekday(localWeekNum(d), d.getDay(), localFirst(y)),
+  [DAY]: (d, y) => weekday(1, d.getDay(), localFirst(y))
+};
+const localInv = {
+  [QUARTER]: q => 3 * q,
+  [WEEK]: (w, y) => weekday(w, 0, localFirst(y))
+};
+function timeFloor(units, step) {
+  return floor(units, step || 1, localGet, localInv, localDate);
+}
+
+// -- UTC TIME --
+
+const utcGet = {
+  [YEAR]: d => d.getUTCFullYear(),
+  [QUARTER]: d => Math.floor(d.getUTCMonth() / 3),
+  [MONTH]: d => d.getUTCMonth(),
+  [DATE]: d => d.getUTCDate(),
+  [HOURS]: d => d.getUTCHours(),
+  [MINUTES]: d => d.getUTCMinutes(),
+  [SECONDS]: d => d.getUTCSeconds(),
+  [MILLISECONDS]: d => d.getUTCMilliseconds(),
+  [DAYOFYEAR]: d => utcDayOfYear(d),
+  [WEEK]: d => utcWeekNum(d),
+  [DAY]: (d, y) => weekday(1, d.getUTCDay(), utcFirst(y)),
+  [WEEK + DAY]: (d, y) => weekday(utcWeekNum(d), d.getUTCDay(), utcFirst(y))
+};
+const utcInv = {
+  [QUARTER]: q => 3 * q,
+  [WEEK]: (w, y) => weekday(w, 0, utcFirst(y))
+};
+function utcFloor(units, step) {
+  return floor(units, step || 1, utcGet, utcInv, utcDate);
+}
+
+const timeIntervals = {
+  [YEAR]: timeYear,
+  [QUARTER]: timeMonth.every(3),
+  [MONTH]: timeMonth,
+  [WEEK]: timeSunday,
+  [DATE]: timeDay,
+  [DAY]: timeDay,
+  [DAYOFYEAR]: timeDay,
+  [HOURS]: timeHour,
+  [MINUTES]: timeMinute,
+  [SECONDS]: second,
+  [MILLISECONDS]: millisecond
+};
+const utcIntervals = {
+  [YEAR]: utcYear,
+  [QUARTER]: utcMonth.every(3),
+  [MONTH]: utcMonth,
+  [WEEK]: utcSunday,
+  [DATE]: utcDay,
+  [DAY]: utcDay,
+  [DAYOFYEAR]: utcDay,
+  [HOURS]: utcHour,
+  [MINUTES]: utcMinute,
+  [SECONDS]: second,
+  [MILLISECONDS]: millisecond
+};
+function timeInterval(unit) {
+  return timeIntervals[unit];
+}
+function utcInterval(unit) {
+  return utcIntervals[unit];
+}
+function offset(ival, date, step) {
+  return ival ? ival.offset(date, step) : undefined;
+}
+function timeOffset(unit, date, step) {
+  return offset(timeInterval(unit), date, step);
+}
+function utcOffset(unit, date, step) {
+  return offset(utcInterval(unit), date, step);
+}
+function sequence(ival, start, stop, step) {
+  return ival ? ival.range(start, stop, step) : undefined;
+}
+function timeSequence(unit, start, stop, step) {
+  return sequence(timeInterval(unit), start, stop, step);
+}
+function utcSequence(unit, start, stop, step) {
+  return sequence(utcInterval(unit), start, stop, step);
+}
+
+const durationSecond = 1000,
+  durationMinute = durationSecond * 60,
+  durationHour = durationMinute * 60,
+  durationDay = durationHour * 24,
+  durationWeek = durationDay * 7,
+  durationMonth = durationDay * 30,
+  durationYear = durationDay * 365;
+const Milli = [YEAR, MONTH, DATE, HOURS, MINUTES, SECONDS, MILLISECONDS],
+  Seconds = Milli.slice(0, -1),
+  Minutes = Seconds.slice(0, -1),
+  Hours = Minutes.slice(0, -1),
+  Day = Hours.slice(0, -1),
+  Week = [YEAR, WEEK],
+  Month = [YEAR, MONTH],
+  Year = [YEAR];
+const intervals = [[Seconds, 1, durationSecond], [Seconds, 5, 5 * durationSecond], [Seconds, 15, 15 * durationSecond], [Seconds, 30, 30 * durationSecond], [Minutes, 1, durationMinute], [Minutes, 5, 5 * durationMinute], [Minutes, 15, 15 * durationMinute], [Minutes, 30, 30 * durationMinute], [Hours, 1, durationHour], [Hours, 3, 3 * durationHour], [Hours, 6, 6 * durationHour], [Hours, 12, 12 * durationHour], [Day, 1, durationDay], [Week, 1, durationWeek], [Month, 1, durationMonth], [Month, 3, 3 * durationMonth], [Year, 1, durationYear]];
+function bin (opt) {
+  const ext = opt.extent,
+    max = opt.maxbins || 40,
+    target = Math.abs(span(ext)) / max;
+  let i = bisector(i => i[2]).right(intervals, target),
+    units,
+    step;
+  if (i === intervals.length) {
+    units = Year, step = tickStep(ext[0] / durationYear, ext[1] / durationYear, max);
+  } else if (i) {
+    i = intervals[target / intervals[i - 1][2] < intervals[i][2] / target ? i - 1 : i];
+    units = i[0];
+    step = i[1];
+  } else {
+    units = Milli;
+    step = Math.max(tickStep(ext[0], ext[1], max), 1);
+  }
+  return {
+    units,
+    step
+  };
+}
+
+export { DATE, DAY, DAYOFYEAR, HOURS, MILLISECONDS, MINUTES, MONTH, QUARTER, SECONDS, TIME_UNITS, WEEK, YEAR, dayofyear, bin as timeBin, timeFloor, timeInterval, timeOffset, timeSequence, timeUnitSpecifier, timeUnits, utcFloor, utcInterval, utcOffset, utcSequence, utcdayofyear, utcweek, week };

package/dist/esm/bundled_modules/vega-tooltip/build/index.js

@@ -0,0 +1,339 @@
+import { isArray, isString, isObject } from '../../vega-util/build/vega-util.js';
+
+/**
+ * Format the value to be shown in the tooltip.
+ *
+ * @param value The value to show in the tooltip.
+ * @param valueToHtml Function to convert a single cell value to an HTML string
+ */
+function formatValue(value, valueToHtml, maxDepth, baseURL) {
+    if (isArray(value)) {
+        return `[${value.map((v) => valueToHtml(isString(v) ? v : stringify(v, maxDepth))).join(', ')}]`;
+    }
+    if (isObject(value)) {
+        let content = '';
+        const { title, image, ...rest } = value;
+        if (title) {
+            content += `<h2>${valueToHtml(title)}</h2>`;
+        }
+        if (image) {
+            content += `<img src="${new URL(valueToHtml(image), baseURL || location.href).href}">`;
+        }
+        const keys = Object.keys(rest);
+        if (keys.length > 0) {
+            content += '<table>';
+            for (const key of keys) {
+                let val = rest[key];
+                // ignore undefined properties
+                if (val === undefined) {
+                    continue;
+                }
+                if (isObject(val)) {
+                    val = stringify(val, maxDepth);
+                }
+                content += `<tr><td class="key">${valueToHtml(key)}</td><td class="value">${valueToHtml(val)}</td></tr>`;
+            }
+            content += `</table>`;
+        }
+        return content || '{}'; // show empty object if there are no properties
+    }
+    return valueToHtml(value);
+}
+function replacer(maxDepth) {
+    const stack = [];
+    return function (key, value) {
+        if (typeof value !== 'object' || value === null) {
+            return value;
+        }
+        const pos = stack.indexOf(this) + 1;
+        stack.length = pos;
+        if (stack.length > maxDepth) {
+            return '[Object]';
+        }
+        if (stack.indexOf(value) >= 0) {
+            return '[Circular]';
+        }
+        stack.push(value);
+        return value;
+    };
+}
+/**
+ * Stringify any JS object to valid JSON
+ */
+function stringify(obj, maxDepth) {
+    return JSON.stringify(obj, replacer(maxDepth));
+}
+
+// generated with build-style.sh
+var defaultStyle = `#vg-tooltip-element {
+  visibility: hidden;
+  padding: 8px;
+  position: fixed;
+  z-index: 1000;
+  font-family: sans-serif;
+  font-size: 11px;
+  border-radius: 3px;
+  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
+  /* The default theme is the light theme. */
+  background-color: rgba(255, 255, 255, 0.95);
+  border: 1px solid #d9d9d9;
+  color: black;
+}
+#vg-tooltip-element.visible {
+  visibility: visible;
+}
+#vg-tooltip-element h2 {
+  margin-top: 0;
+  margin-bottom: 10px;
+  font-size: 13px;
+}
+#vg-tooltip-element table {
+  border-spacing: 0;
+}
+#vg-tooltip-element table tr {
+  border: none;
+}
+#vg-tooltip-element table tr td {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  padding-top: 2px;
+  padding-bottom: 2px;
+}
+#vg-tooltip-element table tr td.key {
+  color: #808080;
+  max-width: 150px;
+  text-align: right;
+  padding-right: 4px;
+}
+#vg-tooltip-element table tr td.value {
+  display: block;
+  max-width: 300px;
+  max-height: 7em;
+  text-align: left;
+}
+#vg-tooltip-element.dark-theme {
+  background-color: rgba(32, 32, 32, 0.9);
+  border: 1px solid #f5f5f5;
+  color: white;
+}
+#vg-tooltip-element.dark-theme td.key {
+  color: #bfbfbf;
+}
+`;
+
+const EL_ID = 'vg-tooltip-element';
+const DEFAULT_OPTIONS = {
+    offsetX: 10,
+    offsetY: 10,
+    id: EL_ID,
+    styleId: 'vega-tooltip-style',
+    theme: 'light',
+    disableDefaultStyle: false,
+    sanitize: escapeHTML,
+    maxDepth: 2,
+    formatTooltip: formatValue,
+    baseURL: '',
+    anchor: 'cursor',
+    position: ['top', 'bottom', 'left', 'right', 'top-left', 'top-right', 'bottom-left', 'bottom-right'],
+};
+/**
+ * Escape special HTML characters.
+ *
+ * @param value A value to convert to string and HTML-escape.
+ */
+function escapeHTML(value) {
+    return String(value).replace(/&/g, '&amp;').replace(/</g, '&lt;');
+}
+function createDefaultStyle(id) {
+    // Just in case this id comes from a user, ensure these is no security issues
+    if (!/^[A-Za-z]+[-:.\w]*$/.test(id)) {
+        throw new Error('Invalid HTML ID');
+    }
+    return defaultStyle.toString().replaceAll(EL_ID, id);
+}
+
+/**
+ * Position the tooltip
+ *
+ * @param event The mouse event.
+ * @param tooltipBox
+ * @param options Tooltip handler options.
+ */
+function calculatePositionRelativeToCursor(event, tooltipBox, { offsetX, offsetY }) {
+    // the possible positions for the tooltip
+    const positions = getPositions({ x1: event.clientX, x2: event.clientX, y1: event.clientY, y2: event.clientY }, tooltipBox, offsetX, offsetY);
+    // order of positions to try
+    const postionArr = ['bottom-right', 'bottom-left', 'top-right', 'top-left'];
+    // test positions till a valid one is found
+    for (const p of postionArr) {
+        if (tooltipIsInViewport(positions[p], tooltipBox)) {
+            return positions[p];
+        }
+    }
+    // default to top-left if a valid position is not found
+    // this is legacy behavior
+    return positions['top-left'];
+}
+/**
+ * Calculates the position of the tooltip relative to the mark.
+ * @param handler The handler instance.
+ * @param event The mouse event.
+ * @param item The item that the tooltip is being shown for.
+ * @param tooltipBox Client rect of the tooltip element.
+ * @param options Tooltip handler options.
+ * @returns
+ */
+function calculatePositionRelativeToMark(handler, event, item, tooltipBox, options) {
+    const { position, offsetX, offsetY } = options;
+    const containerBox = handler._el.getBoundingClientRect();
+    const origin = handler._origin;
+    // bounds of the mark relative to the viewport
+    const markBounds = getMarkBounds(containerBox, origin, item);
+    // the possible positions for the tooltip
+    const positions = getPositions(markBounds, tooltipBox, offsetX, offsetY);
+    // positions to test
+    const positionArr = Array.isArray(position) ? position : [position];
+    // test positions till a valid one is found
+    for (const p of positionArr) {
+        // verify that the tooltip is in the view and the mouse is not where the tooltip would be
+        if (tooltipIsInViewport(positions[p], tooltipBox) && !mouseIsOnTooltip(event, positions[p], tooltipBox)) {
+            return positions[p];
+        }
+    }
+    // default to cursor position if a valid position is not found
+    return calculatePositionRelativeToCursor(event, tooltipBox, options);
+}
+// Calculates the bounds of the mark relative to the viewport.
+function getMarkBounds(containerBox, origin, item) {
+    // if this is a voronoi mark, we want to use the bounds of the point that voronoi cell represents
+    const markBounds = item.isVoronoi ? item.datum.bounds : item.bounds;
+    let left = containerBox.left + origin[0] + markBounds.x1;
+    let top = containerBox.top + origin[1] + markBounds.y1;
+    // traverse mark groups, summing their offsets to get the total offset
+    // item bounds are relative to their group so if there are multiple nested groups we need to add them all
+    let parentItem = item;
+    while (parentItem.mark.group) {
+        parentItem = parentItem.mark.group;
+        left += parentItem.x ?? 0;
+        top += parentItem.y ?? 0;
+    }
+    const markWidth = markBounds.x2 - markBounds.x1;
+    const markHeight = markBounds.y2 - markBounds.y1;
+    return {
+        x1: left,
+        x2: left + markWidth,
+        y1: top,
+        y2: top + markHeight,
+    };
+}
+// Calculates the tooltip xy for each possible position.
+function getPositions(markBounds, tooltipBox, offsetX, offsetY) {
+    const xc = (markBounds.x1 + markBounds.x2) / 2;
+    const yc = (markBounds.y1 + markBounds.y2) / 2;
+    // x positions
+    const left = markBounds.x1 - tooltipBox.width - offsetX;
+    const center = xc - tooltipBox.width / 2;
+    const right = markBounds.x2 + offsetX;
+    // y positions
+    const top = markBounds.y1 - tooltipBox.height - offsetY;
+    const middle = yc - tooltipBox.height / 2;
+    const bottom = markBounds.y2 + offsetY;
+    const positions = {
+        top: { x: center, y: top },
+        bottom: { x: center, y: bottom },
+        left: { x: left, y: middle },
+        right: { x: right, y: middle },
+        'top-left': { x: left, y: top },
+        'top-right': { x: right, y: top },
+        'bottom-left': { x: left, y: bottom },
+        'bottom-right': { x: right, y: bottom },
+    };
+    return positions;
+}
+// Checks if the tooltip would be in the viewport at the given position
+function tooltipIsInViewport(position, tooltipBox) {
+    return (position.x >= 0 &&
+        position.y >= 0 &&
+        position.x + tooltipBox.width <= window.innerWidth &&
+        position.y + tooltipBox.height <= window.innerHeight);
+}
+// Checks if the mouse is within the tooltip area
+function mouseIsOnTooltip(event, position, tooltipBox) {
+    return (event.clientX >= position.x &&
+        event.clientX <= position.x + tooltipBox.width &&
+        event.clientY >= position.y &&
+        event.clientY <= position.y + tooltipBox.height);
+}
+
+/**
+ * The tooltip handler class.
+ */
+class Handler {
+    /**
+     * The handler function. We bind this to this function in the constructor.
+     */
+    call;
+    /**
+     * Complete tooltip options.
+     */
+    options;
+    /**
+     * The tooltip html element.
+     */
+    el;
+    /**
+     * Create the tooltip handler and initialize the element and style.
+     *
+     * @param options Tooltip Options
+     */
+    constructor(options) {
+        this.options = { ...DEFAULT_OPTIONS, ...options };
+        const elementId = this.options.id;
+        this.el = null;
+        // bind this to call
+        this.call = this.tooltipHandler.bind(this);
+        // prepend a default stylesheet for tooltips to the head
+        if (!this.options.disableDefaultStyle && !document.getElementById(this.options.styleId)) {
+            const style = document.createElement('style');
+            style.setAttribute('id', this.options.styleId);
+            style.innerHTML = createDefaultStyle(elementId);
+            const head = document.head;
+            if (head.childNodes.length > 0) {
+                head.insertBefore(style, head.childNodes[0]);
+            }
+            else {
+                head.appendChild(style);
+            }
+        }
+    }
+    /**
+     * The tooltip handler function.
+     */
+    tooltipHandler(handler, event, item, value) {
+        // append a div element that we use as a tooltip unless it already exists
+        this.el = document.getElementById(this.options.id);
+        if (!this.el) {
+            this.el = document.createElement('div');
+            this.el.setAttribute('id', this.options.id);
+            this.el.classList.add('vg-tooltip');
+            const tooltipContainer = document.fullscreenElement ?? document.body;
+            tooltipContainer.appendChild(this.el);
+        }
+        // hide tooltip for null, undefined, or empty string values
+        if (value == null || value === '') {
+            this.el.classList.remove('visible', `${this.options.theme}-theme`);
+            return;
+        }
+        // set the tooltip content
+        this.el.innerHTML = this.options.formatTooltip(value, this.options.sanitize, this.options.maxDepth, this.options.baseURL);
+        // make the tooltip visible
+        this.el.classList.add('visible', `${this.options.theme}-theme`);
+        const { x, y } = this.options.anchor === 'mark'
+            ? calculatePositionRelativeToMark(handler, event, item, this.el.getBoundingClientRect(), this.options)
+            : calculatePositionRelativeToCursor(event, this.el.getBoundingClientRect(), this.options);
+        this.el.style.top = `${y}px`;
+        this.el.style.left = `${x}px`;
+    }
+}
+
+export { DEFAULT_OPTIONS, Handler, calculatePositionRelativeToCursor, calculatePositionRelativeToMark, createDefaultStyle, escapeHTML, formatValue, getMarkBounds, getPositions, mouseIsOnTooltip, replacer, stringify, tooltipIsInViewport };