@ironsource/shared-ui 2.1.12-test.50 → 2.1.12-test.52

package/components/chart/ChartPlane.vue2.js

@@ -1,18 +1,18 @@
- import "../../ChartPlane.vue_vue_type_style_index_0_scoped_4f67d41d_lang.css"; import { defineComponent as ae, useCssVars as oe, computed as o, ref as g, onMounted as le, watch as h, nextTick as re, openBlock as c, createElementBlock as k, createVNode as ie, unref as _, isRef as ne, createSlots as se, withCtx as ue, renderSlot as de, createCommentVNode as A, createElementVNode as S, normalizeStyle as ce, createBlock as x } from "vue";
-import { Chart as I, ArcElement as pe, LineElement as fe, BarElement as he, PointElement as ve, LineController as me, BarController as ye, PieController as Te, ScatterController as Ce, CategoryScale as be, LinearScale as ge, Filler as ke, Tooltip as Ae } from "chart.js";
-import { HoverVerticalLine as Se } from "./plugins/HoverVerticalLine.js";
-import { prepareTickLabel as xe, formatValue as Le } from "./utils/utils.js";
-import { DEFAULT_TICK_COUNT as Ee, TOTALS_HELPER_KEY as H, BASE_COLOR_KEY as P, CHART_PADDING as Re, POINT_BORDER_COLOR as Be, TICK_LABEL_COLOR as w, TICK_LABEL_FONT as V, TICKS_EXTRA_PADDING as De, GRID_LINE_COLOR as N, HEADER_HEIGHT as Oe, COMPACT_HEADER_HEIGHT as _e, HOVER_AREA_TRANSPARENCY as Ie, HOVER_TRANSPARENCY as v } from "./consts.js";
-import { ChartType as n, DateInterval as He, TooltipOrder as F, TrendDirection as Pe } from "./types.js";
-import { useTooltipPosition as we } from "./composables/useTooltipPosition.js";
-import Ve from "./ChartTooltip.vue.js";
-import { hexColorToRgba as p } from "../../utils/color.js";
-import Ne from "./ChartHeader.vue.js";
-import { useMemoize as Fe, useVModel as Ke } from "@vueuse/core";
-import Me from "../emptyState/v4/EmptyStateV4.vue.js";
-import Ue from "./ChartLoader.vue.js";
-import { DEFAULT_CHART_COLOR as Ye } from "./colorPalette.js";
-import { TotalType as K, calculateTotal as Ge } from "../../utils/totals.js";
+ import "../../ChartPlane.vue_vue_type_style_index_0_scoped_4f67d41d_lang.css"; import { defineComponent as ae, useCssVars as oe, unref as s, computed as l, ref as k, onMounted as le, watch as v, nextTick as re, openBlock as p, createElementBlock as A, createVNode as ie, isRef as ne, createSlots as se, withCtx as ue, renderSlot as de, createCommentVNode as S, createElementVNode as L, normalizeStyle as ce, createBlock as E } from "vue";
+import { Chart as P, ArcElement as fe, LineElement as pe, BarElement as he, PointElement as me, LineController as ve, BarController as ye, PieController as Te, ScatterController as Ce, CategoryScale as be, LinearScale as ge, Filler as xe, Tooltip as ke } from "chart.js";
+import { HoverVerticalLine as Ae } from "./plugins/HoverVerticalLine.js";
+import { prepareTickLabel as Se, formatValue as Le } from "./utils/utils.js";
+import { DEFAULT_TICK_COUNT as Ee, TOTALS_HELPER_KEY as w, BASE_COLOR_KEY as V, CHART_PADDING as Re, POINT_BORDER_COLOR as Be, TICK_LABEL_COLOR as N, TICK_LABEL_FONT as F, TICKS_EXTRA_PADDING as De, GRID_LINE_COLOR as K, HEADER_HEIGHT as Oe, COMPACT_HEADER_HEIGHT as Ie, HOVER_AREA_TRANSPARENCY as He, HOVER_TRANSPARENCY as y } from "./consts.js";
+import { ChartType as u, DateInterval as Pe, TooltipOrder as M, TrendDirection as we } from "./types.js";
+import { useTooltipPosition as Ve } from "./composables/useTooltipPosition.js";
+import Ne from "./ChartTooltip.vue.js";
+import { hexColorToRgba as h } from "../../utils/color.js";
+import Fe from "./ChartHeader.vue.js";
+import { useMemoize as Ke, useVModel as Me } from "@vueuse/core";
+import Ue from "../emptyState/v4/EmptyStateV4.vue.js";
+import Ye from "./ChartLoader.vue.js";
+import { DEFAULT_CHART_COLOR as Ge } from "./colorPalette.js";
+import { TotalType as U, calculateTotal as _e } from "../../utils/totals.js";
 import { isNullOrUndefined as $e } from "../../utils/utils.js";
 import { storeOriginalDatasetColors as ze, restoreOriginalDatasetColors as We } from "./utils/highlightUtils.js";
 const Ze = { class: "chart-plane-container" }, Xe = {
@@ -27,11 +27,11 @@ const Ze = { class: "chart-plane-container" }, Xe = {
     dataSets: { default: () => [] },
     visibleIds: { default: () => [] },
     highlightedId: { default: null },
-    chartType: { default: n.Line },
+    chartType: { default: u.Line },
     parsing: { default: void 0 },
     xAxisFormat: { default: "string" },
     yAxisFormat: { default: "number" },
-    xAxisDateInterval: { default: He.DAILY },
+    xAxisDateInterval: { default: Pe.DAILY },
     tickCount: { default: Ee },
     truncateTickLabels: { type: Boolean, default: !1 },
     header: { default: "" },
@@ -49,11 +49,11 @@ const Ze = { class: "chart-plane-container" }, Xe = {
     compactHeader: { type: Boolean, default: !1 },
     noteText: { default: "" },
     tooltipRespectsTopEdge: { type: Boolean, default: !0 },
-    tooltipTotalType: { default: K.Total },
-    tooltipTotalCalcFn: { type: Function, default: Ge },
-    tooltipOrder: { default: F.Legend },
+    tooltipTotalType: { default: U.Total },
+    tooltipTotalCalcFn: { type: Function, default: _e },
+    tooltipOrder: { default: M.Legend },
     trendValue: { default: null },
-    trendDirection: { default: Pe.UP },
+    trendDirection: { default: we.UP },
     trendTooltip: { default: null },
     totalsChart: { type: Boolean, default: !1 },
     colorsMap: { default: () => ({}) },
@@ -61,71 +61,72 @@ const Ze = { class: "chart-plane-container" }, Xe = {
     valuePrefix: { default: "" }
   },
   emits: ["update:chartType"],
-  setup(M, { emit: U }) {
-    oe((e) => ({
-      "11153e48": q.value,
-      30644433: e.height
+  setup(o, { emit: Y }) {
+    const e = o;
+    oe((t) => ({
+      "11153e48": s(q),
+      30644433: o.height
     }));
-    const Y = Fe(xe);
-    I.register(
-      pe,
+    const G = Ke(Se);
+    P.register(
       fe,
+      pe,
       he,
-      ve,
       me,
+      ve,
       ye,
       Te,
       Ce,
       be,
       ge,
+      xe,
       ke,
-      Ae,
-      Se
+      Ae
     );
-    const t = M, m = Ke(t, "chartType", U), G = o(
-      () => t.withAnimation ? "" : "none"
-    ), f = g(null);
-    let i = null;
-    const L = o(() => t.empty || t.dataSets.length === 0), u = o(() => !t.loading && !L.value), y = () => {
-      f.value && (i && i.destroy(), i = new I(f.value, B.value));
+    const T = Me(e, "chartType", Y), _ = l(
+      () => e.withAnimation ? "" : "none"
+    ), m = k(null);
+    let n = null;
+    const R = l(() => e.empty || e.dataSets.length === 0), c = l(() => !e.loading && !R.value), C = () => {
+      m.value && (n && n.destroy(), n = new P(m.value, O.value));
     }, $ = () => {
-      i && (i.data.datasets = R.value, i.options = B.value.options, i.update(G.value));
+      n && (n.data.datasets = D.value, n.options = O.value.options, n.update(_.value));
     };
-    le(y), h(() => t.chartType, y), h(u, async (e) => {
-      e && (await re(), y());
-    }), h(
+    le(C), v(() => e.chartType, C), v(c, async (t) => {
+      t && (await re(), C());
+    }), v(
       [
-        () => t.visibleIds,
-        () => t.dataSets,
-        () => t.valuePrefix,
-        () => t.valueSuffix
+        () => e.visibleIds,
+        () => e.dataSets,
+        () => e.valuePrefix,
+        () => e.valueSuffix
       ],
       $
     );
-    const d = o(() => t.totalsChart), T = o(
-      () => t.chartType === n.StackedLine || t.chartType === n.StackedBar || d.value
-    ), C = o(
-      () => t.chartType === n.Line || t.chartType === n.StackedLine
-    ), z = o(() => d.value && !t.parsing.xAxisKey ? { ...t.parsing, xAxisKey: H } : t.parsing), W = o(() => d.value ? t.dataSets.map((e) => ({
-      ...e,
-      data: e.data.map((r) => ({
-        ...r,
-        [H]: e.label
+    const f = l(() => e.totalsChart), b = l(
+      () => e.chartType === u.StackedLine || e.chartType === u.StackedBar || f.value
+    ), g = l(
+      () => e.chartType === u.Line || e.chartType === u.StackedLine
+    ), z = l(() => f.value && !e.parsing.xAxisKey ? { ...e.parsing, xAxisKey: w } : e.parsing), W = l(() => f.value ? e.dataSets.map((t) => ({
+      ...t,
+      data: t.data.map((i) => ({
+        ...i,
+        [w]: t.label
       }))
-    })) : t.dataSets), b = o(
-      () => W.value.filter((e) => t.visibleIds.includes(e.id))
-    ), Z = (e) => t.colorsMap[e] || Ye, E = o(
-      () => b.value.length && b.value.every(
-        (e) => e.data.length === 1
+    })) : e.dataSets), x = l(
+      () => W.value.filter((t) => e.visibleIds.includes(t.id))
+    ), Z = (t) => e.colorsMap[t] || Ge, B = l(
+      () => x.value.length && x.value.every(
+        (t) => t.data.length === 1
       )
-    ), R = o(() => b.value.map((e, r) => {
-      const a = Z(e.id), l = T.value ? r !== 0 ? "-1" : "start" : void 0;
+    ), D = l(() => x.value.map((t, i) => {
+      const a = Z(t.id), r = b.value ? i !== 0 ? "-1" : "start" : void 0;
       return {
-        ...e,
-        fill: l,
-        backgroundColor: p(
+        ...t,
+        fill: r,
+        backgroundColor: h(
           a,
-          t.chartType === n.StackedLine ? 10 : 70
+          e.chartType === u.StackedLine ? 10 : 70
         ),
         borderColor: a,
         pointBackgroundColor: a,
@@ -133,52 +134,52 @@ const Ze = { class: "chart-plane-container" }, Xe = {
         maxBarThickness: 50,
         clip: 5,
         // draw a bit outside the chart area
-        icon: e.icon || null,
-        iconType: e.iconType || "branded",
-        [P]: a
+        icon: t.icon || null,
+        iconType: t.iconType || "branded",
+        [V]: a
         // store base color for later use
       };
-    })), X = o(
-      () => t.tooltipTotalType === K.Total ? "Total" : "Mean"
-    ), B = o(() => ({
-      type: t.chartType == n.Bar || t.chartType === n.StackedBar ? "bar" : "line",
+    })), X = l(
+      () => e.tooltipTotalType === U.Total ? "Total" : "Mean"
+    ), O = l(() => ({
+      type: e.chartType == u.Bar || e.chartType === u.StackedBar ? "bar" : "line",
       // Chart Data
       data: {
-        datasets: R.value
+        datasets: D.value
       },
       // Chart Options
       options: {
         parsing: z.value,
         interaction: {
           intersect: !1,
-          mode: d.value ? "point" : "index",
+          mode: f.value ? "point" : "index",
           axis: "x"
         },
         // plugins
         plugins: {
           legend: { display: !1 },
           title: { display: !1 },
-          hoverVerticalLine: C.value,
+          hoverVerticalLine: g.value,
           // tooltip
           tooltip: {
             enabled: !1,
             position: "average",
-            external: ({ tooltip: e }) => {
-              s.value = { ...e };
+            external: ({ tooltip: t }) => {
+              d.value = { ...t };
             },
             callbacks: {
-              footer: (e) => {
-                const r = e.map((l) => l.parsed.y || 0), a = t.tooltipTotalCalcFn(
-                  r,
-                  t.tooltipTotalType
+              footer: (t) => {
+                const i = t.map((r) => r.parsed.y || 0), a = e.tooltipTotalCalcFn(
+                  i,
+                  e.tooltipTotalType
                 );
                 return [X.value, String(a)];
               }
             },
-            itemSort: (e, r) => {
-              if (t.tooltipOrder === F.YAxis) {
-                const a = e.parsed.y || 0, l = r.parsed.y || 0;
-                return a === l ? 0 : a > l ? -1 : 1;
+            itemSort: (t, i) => {
+              if (e.tooltipOrder === M.YAxis) {
+                const a = t.parsed.y || 0, r = i.parsed.y || 0;
+                return a === r ? 0 : a > r ? -1 : 1;
               }
               return 0;
             }
@@ -197,7 +198,7 @@ const Ze = { class: "chart-plane-container" }, Xe = {
             tension: 0.3
           },
           point: {
-            radius: E.value ? 3 : 1,
+            radius: B.value ? 3 : 1,
             hitRadius: 8,
             borderWidth: 0,
             hoverRadius: 4,
@@ -212,31 +213,31 @@ const Ze = { class: "chart-plane-container" }, Xe = {
           // Horizontal Axis (X)
           x: {
             beginAtZero: !0,
-            offset: !C.value || E.value,
+            offset: !g.value || B.value,
             border: { display: !1 },
-            stacked: T.value,
+            stacked: b.value,
             // stack on top of each other
             // ticks
             ticks: {
-              color: w,
-              font: V,
+              color: N,
+              font: F,
               padding: 4,
               maxRotation: 0,
-              autoSkip: !t.truncateTickLabels,
+              autoSkip: !e.truncateTickLabels,
               autoSkipPadding: 8,
-              callback: function(e, r, a) {
-                const l = this.getLabelForValue(e), ee = C.value && !d.value ? a.length - 1 : a.length, te = this.chart.scales?.x?.width / ee - De;
-                return Y({
-                  label: l,
-                  format: t.xAxisFormat,
+              callback: function(t, i, a) {
+                const r = this.getLabelForValue(t), ee = g.value && !f.value ? a.length - 1 : a.length, te = this.chart.scales?.x?.width / ee - De;
+                return G({
+                  label: r,
+                  format: e.xAxisFormat,
                   availableSpace: te,
-                  truncate: t.truncateTickLabels
+                  truncate: e.truncateTickLabels
                 });
               }
             },
             // grid lines
             grid: {
-              color: N,
+              color: K,
               drawOnChartArea: !1,
               drawTicks: !0,
               drawBorder: !1,
@@ -248,119 +249,119 @@ const Ze = { class: "chart-plane-container" }, Xe = {
             beginAtZero: !0,
             border: { display: !1 },
             // hide left borderline
-            stacked: T.value,
+            stacked: b.value,
             // stack on top of each other
             // ticks
             ticks: {
-              color: w,
-              font: V,
-              count: t.tickCount + 1,
+              color: N,
+              font: F,
+              count: e.tickCount + 1,
               padding: 8,
               min: 0,
-              callback: (e) => t.valuePrefix + Le(e, t.yAxisFormat) + t.valueSuffix
+              callback: (t) => e.valuePrefix + Le(t, e.yAxisFormat) + e.valueSuffix
             },
             // grid lines
             grid: {
-              color: N,
+              color: K,
               drawOnChartArea: !0,
               drawTicks: !1
             }
           }
         }
       }
-    })), D = g(null), s = g(null), { position: O } = we(
-      f,
-      D,
-      s,
-      t.tooltipRespectsTopEdge
-    ), j = o(() => ({
-      left: `${O.value.left}px`,
-      top: `${O.value.top}px`,
-      opacity: s.value?.opacity || 0
-    })), q = o(
-      () => (t.compactHeader ? _e : Oe) + "px"
+    })), I = k(null), d = k(null), { position: H } = Ve(
+      m,
+      I,
+      d,
+      e.tooltipRespectsTopEdge
+    ), j = l(() => ({
+      left: `${H.value.left}px`,
+      top: `${H.value.top}px`,
+      opacity: d.value?.opacity || 0
+    })), q = l(
+      () => (e.compactHeader ? Ie : Oe) + "px"
     );
-    h(
-      () => t.highlightedId,
-      (e) => {
-        i && ($e(e) ? Q() : J(e), i.update());
+    v(
+      () => e.highlightedId,
+      (t) => {
+        n && ($e(t) ? Q() : J(t), n.update());
       }
     );
-    const J = (e) => {
-      (i?.data.datasets || []).forEach((a) => {
+    const J = (t) => {
+      (n?.data.datasets || []).forEach((a) => {
         ze(a);
-        const l = a[P];
-        a.id === e ? t.chartType === n.StackedLine && (a.backgroundColor = p(
-          l,
-          Ie
-        )) : (a.backgroundColor = p(l, v), a.borderColor = p(l, v), a.pointBackgroundColor = p(l, v), a.pointHoverBorderColor = p(l, v));
+        const r = a[V];
+        a.id === t ? e.chartType === u.StackedLine && (a.backgroundColor = h(
+          r,
+          He
+        )) : (a.backgroundColor = h(r, y), a.borderColor = h(r, y), a.pointBackgroundColor = h(r, y), a.pointHoverBorderColor = h(r, y));
       });
     }, Q = () => {
-      (i?.data.datasets || []).forEach(We);
+      (n?.data.datasets || []).forEach(We);
     };
-    return (e, r) => (c(), k("div", Ze, [
-      u.value || e.keepSubheaderVisible ? (c(), k("div", Xe, [
-        ie(Ne, {
-          "chart-type": _(m),
-          "onUpdate:chartType": r[0] || (r[0] = (a) => ne(m) ? m.value = a : null),
-          "type-switcher": u.value ? e.typeSwitcher : !1,
-          header: u.value ? e.header : null,
-          subheader: e.subheader,
-          "subheader-tooltip": e.subheaderTooltip,
-          "trend-tooltip": e.trendTooltip,
-          compact: e.compactHeader,
-          "trend-value": u.value ? e.trendValue : null,
-          "trend-direction": e.trendDirection,
-          "note-text": e.noteText
+    return (t, i) => (p(), A("div", Ze, [
+      s(c) || o.keepSubheaderVisible ? (p(), A("div", Xe, [
+        ie(Fe, {
+          "chart-type": s(T),
+          "onUpdate:chart-type": i[0] || (i[0] = (a) => ne(T) ? T.value = a : null),
+          "type-switcher": s(c) ? o.typeSwitcher : !1,
+          header: s(c) ? o.header : null,
+          subheader: o.subheader,
+          "subheader-tooltip": o.subheaderTooltip,
+          "trend-tooltip": o.trendTooltip,
+          compact: o.compactHeader,
+          "trend-value": s(c) ? o.trendValue : null,
+          "trend-direction": o.trendDirection,
+          "note-text": o.noteText
         }, se({ _: 2 }, [
-          e.$slots["subheader-tooltip"] ? {
+          t.$slots["subheader-tooltip"] ? {
             name: "subheader-tooltip",
             fn: ue(() => [
-              de(e.$slots, "subheader-tooltip", {}, void 0, !0)
+              de(t.$slots, "subheader-tooltip", {}, void 0, !0)
             ]),
             key: "0"
           } : void 0
         ]), 1032, ["chart-type", "type-switcher", "header", "subheader", "subheader-tooltip", "trend-tooltip", "compact", "trend-value", "trend-direction", "note-text"])
-      ])) : A("", !0),
-      u.value ? (c(), k("section", je, [
-        S("div", qe, [
-          S("canvas", {
+      ])) : S("", !0),
+      s(c) ? (p(), A("section", je, [
+        L("div", qe, [
+          L("canvas", {
             ref_key: "chartRef",
-            ref: f,
+            ref: m,
             class: "chart__canvas"
           }, null, 512),
-          S("div", {
+          L("div", {
             ref_key: "tooltipRef",
-            ref: D,
+            ref: I,
             class: "chart__tooltip",
-            style: ce(j.value)
+            style: ce(s(j))
           }, [
-            s.value ? (c(), x(Ve, {
+            d.value ? (p(), E(Ne, {
               key: 0,
-              "totals-chart": d.value,
-              title: String(s.value.title),
-              "data-points": s.value.dataPoints,
-              "x-axis-format": e.xAxisFormat,
-              "y-axis-format": e.yAxisFormat,
-              "x-axis-date-interval": e.xAxisDateInterval,
-              "total-label": s.value.footer?.[0],
-              "total-value": Number(s.value.footer?.[1]),
-              "value-suffix": e.valueSuffix,
-              "value-prefix": e.valuePrefix
-            }, null, 8, ["totals-chart", "title", "data-points", "x-axis-format", "y-axis-format", "x-axis-date-interval", "total-label", "total-value", "value-suffix", "value-prefix"])) : A("", !0)
+              "totals-chart": s(f),
+              title: String(d.value.title),
+              "data-points": d.value.dataPoints,
+              "x-axis-format": o.xAxisFormat,
+              "y-axis-format": o.yAxisFormat,
+              "x-axis-date-interval": o.xAxisDateInterval,
+              "total-label": d.value.footer?.[0],
+              "total-value": Number(d.value.footer?.[1]),
+              "value-suffix": o.valueSuffix,
+              "value-prefix": o.valuePrefix
+            }, null, 8, ["totals-chart", "title", "data-points", "x-axis-format", "y-axis-format", "x-axis-date-interval", "total-label", "total-value", "value-suffix", "value-prefix"])) : S("", !0)
           ], 4)
         ])
-      ])) : e.loading ? (c(), x(Ue, {
+      ])) : o.loading ? (p(), E(Ye, {
         key: 2,
         class: "chart-loading"
-      })) : L.value ? (c(), x(_(Me), {
+      })) : s(R) ? (p(), E(s(Ue), {
         key: 3,
         class: "chart-empty",
         variant: null,
-        title: e.noDataTitle,
-        subtitle: e.noDataSubtitle,
-        "icon-name": e.noDataIcon
-      }, null, 8, ["title", "subtitle", "icon-name"])) : A("", !0)
+        title: o.noDataTitle,
+        subtitle: o.noDataSubtitle,
+        "icon-name": o.noDataIcon
+      }, null, 8, ["title", "subtitle", "icon-name"])) : S("", !0)
     ]));
   }
 });

package/components/chart/ChartTooltip.vue.d.ts

@@ -1,5 +1,5 @@
 import { DateInterval, MyTooltipItem, ValueFormat } from '@/components/chart/types';
-declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     title?: string;
     dataPoints: MyTooltipItem<'line'>[];
     xAxisFormat?: ValueFormat;
@@ -21,7 +21,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     totalsChart: boolean;
     valueSuffix: string;
     valuePrefix: string;
-}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     title?: string;
     dataPoints: MyTooltipItem<'line'>[];
     xAxisFormat?: ValueFormat;
@@ -43,7 +43,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     totalsChart: boolean;
     valueSuffix: string;
     valuePrefix: string;
-}>>> & Readonly<{}>, {
+}>>>, {
     title: string;
     xAxisFormat: ValueFormat;
     xAxisDateInterval: DateInterval;
@@ -54,7 +54,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     totalValue: number;
     valueSuffix: string;
     valuePrefix: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {