@rubin-epo/epo-widget-lib 0.9.0 → 0.9.2

package/dist/widgets/LightCurvePlot/ScatterPlot/index.js

@@ -1,163 +1,158 @@
 "use client";
-import { jsxs as u, jsx as i } from "react/jsx-runtime";
-import { useState as N } from "react";
-import { useTranslation as U, Trans as V } from "react-i18next";
-import { min as X, max as Y } from "d3-array";
-import D from "../../../charts/hooks/useAxis.js";
-import Z from "../../../charts/XAxis/index.js";
-import q from "../../../charts/YAxis/index.js";
-import E from "../../../charts/Tooltip/index.js";
-import G from "../../../charts/Viewport/index.js";
-import { timestampFromMJD as Q } from "../../../lib/helpers.js";
-import l from "../defaults.js";
-import $ from "../Point/index.js";
-import { PlotContainer as tt, PlotTitle as ot, Chart as et } from "./styles.js";
-const T = ({
-  data: r,
-  activeAlertId: F,
-  yMin: P = l.yMin,
-  yMax: k = l.yMax,
-  width: c = l.width,
-  height: p = l.height,
-  name: g,
-  children: C
+import { jsx as o, jsxs as V } from "react/jsx-runtime";
+import { useState as X } from "react";
+import { useTranslation as Y } from "react-i18next";
+import { min as q, max as E } from "d3-array";
+import _ from "../../../charts/hooks/useAxis.js";
+import G from "../../../charts/XAxis/index.js";
+import J from "../../../charts/YAxis/index.js";
+import K from "../../../charts/Tooltip/index.js";
+import Q from "../../../charts/ClippingContainer/index.js";
+import U from "../../../charts/Viewport/index.js";
+import r from "../defaults.js";
+import Z from "../Point/index.js";
+import { PlotContainer as $, Chart as tt } from "./styles.js";
+const M = ({
+  data: s,
+  activeAlertId: S,
+  xMin: I,
+  xMax: k,
+  yMin: C = r.yMin,
+  yMax: F = r.yMax,
+  width: p = r.width,
+  height: d = r.height,
+  name: P,
+  children: D,
+  className: R
 }) => {
   const {
     t: a,
-    i18n: { language: y }
-  } = U(), [f, b] = N(), I = a("light_curve.plot.x_label"), v = "xAxisLabel", R = a("light_curve.plot.y_label"), L = "yAxisLabel", o = typeof f < "u" ? r[f] : r.find(({ id: t }) => t === F), m = {
+    i18n: { language: T }
+  } = Y(), [h, f] = X(), H = a("light_curve.plot.x_label"), y = "xAxisLabel", W = a("light_curve.plot.y_label"), b = "yAxisLabel", i = typeof h < "u" ? s[h] : s.find(({ id: e }) => e === S), x = {
     top: 10,
-    left: 35,
+    left: 40,
     right: 10,
-    bottom: 20
-  }, H = X(r, ({ x: t }) => t) || Math.min(...r.map(({ x: t }) => t)), O = Y(r, ({ x: t }) => t) || Math.max(...r.map(({ x: t }) => t)), x = [0 + m.left, c - m.right], [M, W, n] = D({
-    min: H,
-    max: O,
-    step: l.xStep,
-    range: x
-  }), S = n(M[0]), d = [0 + m.top, p - m.bottom], [s, j, e] = D({
-    min: P,
-    max: k,
-    step: l.yStep,
-    range: d
-  }), A = e(s[1]), w = {
-    timeZone: "UTC",
-    dateStyle: "short",
-    timeStyle: "short"
-  };
-  return /* @__PURE__ */ u(tt, { children: [
-    g && /* @__PURE__ */ i(ot, { children: g }),
-    /* @__PURE__ */ u(
-      et,
-      {
-        width: c,
-        height: p,
-        horizontalLabel: I,
-        horizontalLabelId: v,
-        verticalLabel: R,
-        verticalLabelId: L,
-        children: [
-          /* @__PURE__ */ i(
-            "rect",
-            {
-              x: n(0),
-              y: e(s[0]),
-              width: n(15) - n(0),
-              height: A - e(s[0]),
-              fill: "#F5F5F5"
-            }
-          ),
-          /* @__PURE__ */ i(
-            Z,
-            {
-              ticks: W,
-              y: A,
-              labelledById: v,
-              xDomain: M,
-              xScale: n
-            }
-          ),
-          /* @__PURE__ */ i(
-            q,
-            {
-              ticks: j,
-              x: S,
-              labelledById: L,
-              yDomain: s,
-              yScale: e
-            }
-          ),
-          /* @__PURE__ */ i(
-            "g",
-            {
-              role: "list",
-              "aria-label": a("light_curve.plot.plot_label") || void 0,
-              children: r.map(({ x: t, y: _, error: z, id: B }, J) => {
-                const h = Math.round(t), K = h > 0 ? "after" : h === 0 ? "peak" : "before";
-                return /* @__PURE__ */ i(
-                  $,
-                  {
-                    x: n(t),
-                    y: e(_),
-                    error: e(z) - e(0),
-                    onMouseOver: () => b(J),
-                    onMouseOut: () => b(void 0),
-                    description: a("light_curve.plot.point_label", {
-                      magnitude: _,
-                      count: Math.abs(h),
-                      context: K
-                    }) || void 0
-                  },
-                  B
-                );
+    bottom: 25
+  }, m = [0 + x.left, p - x.right], [v, j, n] = _({
+    min: I || q(s, ({ x: e }) => e) || r.xMin,
+    max: k || E(s, ({ x: e }) => e) || r.xMax,
+    step: r.xStep,
+    range: m
+  }), u = n(v[0]), c = [0 + x.top, d - x.bottom], [l, w, t] = _({
+    min: C,
+    max: F,
+    step: r.yStep,
+    range: c
+  }), L = t(l[1]);
+  return /* @__PURE__ */ o($, { className: R, children: /* @__PURE__ */ V(
+    tt,
+    {
+      width: p,
+      height: d,
+      horizontalLabel: H,
+      horizontalLabelId: y,
+      verticalLabel: W,
+      verticalLabelId: b,
+      title: P,
+      children: [
+        /* @__PURE__ */ o(
+          "rect",
+          {
+            x: n(0),
+            y: t(l[0]),
+            width: n(15) - n(0),
+            height: L - t(l[0]),
+            fill: "#F5F5F5"
+          }
+        ),
+        /* @__PURE__ */ o(
+          G,
+          {
+            ticks: j,
+            y: L,
+            labelledById: y,
+            xDomain: v,
+            xScale: n
+          }
+        ),
+        /* @__PURE__ */ o(
+          J,
+          {
+            ticks: w,
+            x: u,
+            labelledById: b,
+            yDomain: l,
+            yScale: t
+          }
+        ),
+        /* @__PURE__ */ o(
+          Q,
+          {
+            x: u,
+            y: t(l[0]),
+            width: m[1] - m[0],
+            height: c[1] - c[0],
+            children: /* @__PURE__ */ o(
+              "g",
+              {
+                role: "list",
+                "aria-label": a("light_curve.plot.plot_label") || void 0,
+                children: s.map(({ x: e, y: A, error: z, id: B }, O) => {
+                  const g = Math.round(e), N = g > 0 ? "after" : g === 0 ? "peak" : "before";
+                  return /* @__PURE__ */ o(
+                    Z,
+                    {
+                      x: n(e),
+                      y: t(A),
+                      error: t(z) - t(0),
+                      onMouseOver: () => f(O),
+                      onMouseOut: () => f(void 0),
+                      description: a("light_curve.plot.point_label", {
+                        magnitude: A,
+                        count: Math.abs(g),
+                        context: N
+                      }) || void 0
+                    },
+                    B
+                  );
+                })
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ o(
+          U,
+          {
+            x: u,
+            y: t(l[0]),
+            outerWidth: m[1] - m[0],
+            outerHeight: c[1] - c[0],
+            innerWidth: p,
+            innerHeight: d,
+            children: D
+          }
+        ),
+        /* @__PURE__ */ o(
+          K,
+          {
+            x: i ? n(i.x) : void 0,
+            y: i ? t(i.y) : void 0,
+            visible: !!i,
+            offset: 6,
+            children: a("light_curve.plot.tooltip", {
+              magnitude: i == null ? void 0 : i.y.toLocaleString(T, {
+                minimumFractionDigits: 2,
+                maximumFractionDigits: 2
               })
-            }
-          ),
-          /* @__PURE__ */ i(
-            G,
-            {
-              x: S,
-              y: e(s[0]),
-              outerWidth: x[1] - x[0],
-              outerHeight: d[1] - d[0],
-              innerWidth: c,
-              innerHeight: p,
-              children: C
-            }
-          ),
-          /* @__PURE__ */ i(
-            E,
-            {
-              x: o ? n(o.x) : void 0,
-              y: o ? e(o.y) : void 0,
-              visible: !!o,
-              offset: 6,
-              children: /* @__PURE__ */ u(V, { i18nKey: "light_curve.plot.tooltip", children: [
-                "Apparent Magnitude:",
-                " ",
-                {
-                  magnitude: o == null ? void 0 : o.y.toLocaleString(y, {
-                    minimumFractionDigits: 2,
-                    maximumFractionDigits: 2
-                  })
-                },
-                /* @__PURE__ */ i("br", {}),
-                "Date:",
-                {
-                  date: new Date(
-                    Q((o == null ? void 0 : o.date) || 0)
-                  ).toLocaleString(y, w)
-                }
-              ] })
-            }
-          )
-        ]
-      }
-    )
-  ] });
+            })
+          }
+        )
+      ]
+    }
+  ) });
 };
-T.displayName = "Widgets.LightCurve.ScatterPlot";
-const gt = T;
+M.displayName = "Widgets.LightCurve.ScatterPlot";
+const ut = M;
 export {
-  gt as default
+  ut as default
 };

package/dist/widgets/LightCurvePlot/ScatterPlot/styles.cjs

@@ -1,13 +1,15 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("styled-components"),t=require("@rubin-epo/epo-react-lib/styles"),o=require("../../../charts/Base/index.cjs"),r=e=>e&&e.__esModule?e:{default:e},i=r(n),a=i.default.div`
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("styled-components"),t=require("@rubin-epo/epo-react-lib/styles"),i=require("../../../charts/Base/index.cjs"),r=e=>e&&e.__esModule?e:{default:e},n=r(o),a=n.default.div`
   display: flex;
-  flex-direction: column;
+  aspect-ratio: 1;
+  color: var(--neutral95, #1f2121);
   container-type: inline-size;
   background-color: var(--white, #fff);
   border: 1px solid var(--turquoise55, #009fa1);
   gap: var(--light-curve-padding);
-  padding: var(--light-curve-padding, var(--PADDING_SMALL, 20px)) 0;
-`,l=i.default(o.default)`
+`,l=n.default(i.default)`
   font-size: 2.25em;
+  overflow: visible;
+
   @container (
   min-width: ${t.token("BREAK_MOBILE")}
 ) {
@@ -25,7 +27,4 @@
 ) {
     font-size: 1em;
   }
-`,d=i.default.h3`
-  padding-inline: var(--light-curve-padding, var(--PADDING_SMALL, 20px));
-  margin: 0;
-`;exports.Chart=l;exports.PlotContainer=a;exports.PlotTitle=d;
+`;exports.Chart=l;exports.PlotContainer=a;

package/dist/widgets/LightCurvePlot/ScatterPlot/styles.d.ts

@@ -272,286 +272,17 @@ export declare const PlotContainer: import("styled-components").IStyledComponent
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
 }>;
 export declare const Chart: import("styled-components").IStyledComponent<"web", {
-    width?: number | undefined;
-    height?: number | undefined;
-    minX?: number | undefined;
-    minY?: number | undefined;
     className?: string | undefined;
+    title?: string | undefined;
     verticalLabel?: string | undefined;
     verticalLabelId?: string | undefined;
     horizontalLabel?: string | undefined;
     horizontalLabelId?: string | undefined;
+    xMin?: number | undefined;
+    xMax?: number | undefined;
+    width?: number | undefined;
+    yMin?: number | undefined;
+    yMax?: number | undefined;
+    height?: number | undefined;
     children?: import("react").ReactNode;
 }> & import("react").FunctionComponent<import("react").PropsWithChildren<import("../../../charts/Base/index").BaseChartProps>>;
-export declare const PlotTitle: import("styled-components").IStyledComponent<"web", {
-    ref?: import("react").LegacyRef<HTMLHeadingElement> | undefined;
-    key?: import("react").Key | null | undefined;
-    defaultChecked?: boolean | undefined;
-    defaultValue?: string | number | readonly string[] | undefined;
-    suppressContentEditableWarning?: boolean | undefined;
-    suppressHydrationWarning?: boolean | undefined;
-    accessKey?: string | undefined;
-    autoFocus?: boolean | undefined;
-    className?: string | undefined;
-    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
-    contextMenu?: string | undefined;
-    dir?: string | undefined;
-    draggable?: (boolean | "true" | "false") | undefined;
-    hidden?: boolean | undefined;
-    id?: string | undefined;
-    lang?: string | undefined;
-    nonce?: string | undefined;
-    placeholder?: string | undefined;
-    slot?: string | undefined;
-    spellCheck?: (boolean | "true" | "false") | undefined;
-    style?: import("react").CSSProperties | undefined;
-    tabIndex?: number | undefined;
-    title?: string | undefined;
-    translate?: "yes" | "no" | undefined;
-    radioGroup?: string | undefined;
-    role?: import("react").AriaRole | undefined;
-    about?: string | undefined;
-    content?: string | undefined;
-    datatype?: string | undefined;
-    inlist?: any;
-    prefix?: string | undefined;
-    property?: string | undefined;
-    rel?: string | undefined;
-    resource?: string | undefined;
-    rev?: string | undefined;
-    typeof?: string | undefined;
-    vocab?: string | undefined;
-    autoCapitalize?: string | undefined;
-    autoCorrect?: string | undefined;
-    autoSave?: string | undefined;
-    color?: string | undefined;
-    itemProp?: string | undefined;
-    itemScope?: boolean | undefined;
-    itemType?: string | undefined;
-    itemID?: string | undefined;
-    itemRef?: string | undefined;
-    results?: number | undefined;
-    security?: string | undefined;
-    unselectable?: "on" | "off" | undefined;
-    inputMode?: "text" | "search" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
-    is?: string | undefined;
-    children?: import("react").ReactNode;
-    "aria-activedescendant"?: string | undefined;
-    "aria-atomic"?: (boolean | "true" | "false") | undefined;
-    "aria-autocomplete"?: "list" | "none" | "inline" | "both" | undefined;
-    "aria-braillelabel"?: string | undefined;
-    "aria-brailleroledescription"?: string | undefined;
-    "aria-busy"?: (boolean | "true" | "false") | undefined;
-    "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
-    "aria-colcount"?: number | undefined;
-    "aria-colindex"?: number | undefined;
-    "aria-colindextext"?: string | undefined;
-    "aria-colspan"?: number | undefined;
-    "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "step" | "time" | "true" | "false" | "page" | "location" | "date" | undefined;
-    "aria-describedby"?: string | undefined;
-    "aria-description"?: string | undefined;
-    "aria-details"?: string | undefined;
-    "aria-disabled"?: (boolean | "true" | "false") | undefined;
-    "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
-    "aria-errormessage"?: string | undefined;
-    "aria-expanded"?: (boolean | "true" | "false") | undefined;
-    "aria-flowto"?: string | undefined;
-    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
-    "aria-hidden"?: (boolean | "true" | "false") | undefined;
-    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
-    "aria-keyshortcuts"?: string | undefined;
-    "aria-label"?: string | undefined;
-    "aria-labelledby"?: string | undefined;
-    "aria-level"?: number | undefined;
-    "aria-live"?: "off" | "assertive" | "polite" | undefined;
-    "aria-modal"?: (boolean | "true" | "false") | undefined;
-    "aria-multiline"?: (boolean | "true" | "false") | undefined;
-    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
-    "aria-orientation"?: "horizontal" | "vertical" | undefined;
-    "aria-owns"?: string | undefined;
-    "aria-placeholder"?: string | undefined;
-    "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
-    "aria-readonly"?: (boolean | "true" | "false") | undefined;
-    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
-    "aria-required"?: (boolean | "true" | "false") | undefined;
-    "aria-roledescription"?: string | undefined;
-    "aria-rowcount"?: number | undefined;
-    "aria-rowindex"?: number | undefined;
-    "aria-rowindextext"?: string | undefined;
-    "aria-rowspan"?: number | undefined;
-    "aria-selected"?: (boolean | "true" | "false") | undefined;
-    "aria-setsize"?: number | undefined;
-    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
-    "aria-valuemax"?: number | undefined;
-    "aria-valuemin"?: number | undefined;
-    "aria-valuenow"?: number | undefined;
-    "aria-valuetext"?: string | undefined;
-    dangerouslySetInnerHTML?: {
-        __html: string | TrustedHTML;
-    } | undefined;
-    onCopy?: import("react").ClipboardEventHandler<HTMLHeadingElement> | undefined;
-    onCopyCapture?: import("react").ClipboardEventHandler<HTMLHeadingElement> | undefined;
-    onCut?: import("react").ClipboardEventHandler<HTMLHeadingElement> | undefined;
-    onCutCapture?: import("react").ClipboardEventHandler<HTMLHeadingElement> | undefined;
-    onPaste?: import("react").ClipboardEventHandler<HTMLHeadingElement> | undefined;
-    onPasteCapture?: import("react").ClipboardEventHandler<HTMLHeadingElement> | undefined;
-    onCompositionEnd?: import("react").CompositionEventHandler<HTMLHeadingElement> | undefined;
-    onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLHeadingElement> | undefined;
-    onCompositionStart?: import("react").CompositionEventHandler<HTMLHeadingElement> | undefined;
-    onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLHeadingElement> | undefined;
-    onCompositionUpdate?: import("react").CompositionEventHandler<HTMLHeadingElement> | undefined;
-    onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLHeadingElement> | undefined;
-    onFocus?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
-    onFocusCapture?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
-    onBlur?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
-    onBlurCapture?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
-    onChange?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onChangeCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onBeforeInput?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onBeforeInputCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onInput?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onInputCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onReset?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onResetCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onSubmit?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onSubmitCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onInvalid?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onInvalidCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
-    onLoad?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onLoadCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onError?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onErrorCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onKeyDown?: import("react").KeyboardEventHandler<HTMLHeadingElement> | undefined;
-    onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLHeadingElement> | undefined;
-    onKeyPress?: import("react").KeyboardEventHandler<HTMLHeadingElement> | undefined;
-    onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLHeadingElement> | undefined;
-    onKeyUp?: import("react").KeyboardEventHandler<HTMLHeadingElement> | undefined;
-    onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLHeadingElement> | undefined;
-    onAbort?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onAbortCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onCanPlay?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onCanPlayCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onCanPlayThrough?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onDurationChange?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onDurationChangeCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onEmptied?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onEmptiedCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onEncrypted?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onEncryptedCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onEnded?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onEndedCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onLoadedData?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onLoadedDataCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onLoadedMetadata?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onLoadStart?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onLoadStartCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onPause?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onPauseCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onPlay?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onPlayCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onPlaying?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onPlayingCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onProgress?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onProgressCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onRateChange?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onRateChangeCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onResize?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onResizeCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onSeeked?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onSeekedCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onSeeking?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onSeekingCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onStalled?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onStalledCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onSuspend?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onSuspendCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onTimeUpdate?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onVolumeChange?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onWaiting?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onWaitingCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onAuxClick?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onAuxClickCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onClick?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onClickCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onContextMenu?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onContextMenuCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onDoubleClick?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onDoubleClickCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onDrag?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragCapture?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragEnd?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragEndCapture?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragEnter?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragEnterCapture?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragExit?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragExitCapture?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragLeave?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragLeaveCapture?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragOver?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragOverCapture?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragStart?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDragStartCapture?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDrop?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onDropCapture?: import("react").DragEventHandler<HTMLHeadingElement> | undefined;
-    onMouseDown?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseDownCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseEnter?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseLeave?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseMove?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseMoveCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseOut?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseOutCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseOver?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseOverCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseUp?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onMouseUpCapture?: import("react").MouseEventHandler<HTMLHeadingElement> | undefined;
-    onSelect?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onSelectCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
-    onTouchCancel?: import("react").TouchEventHandler<HTMLHeadingElement> | undefined;
-    onTouchCancelCapture?: import("react").TouchEventHandler<HTMLHeadingElement> | undefined;
-    onTouchEnd?: import("react").TouchEventHandler<HTMLHeadingElement> | undefined;
-    onTouchEndCapture?: import("react").TouchEventHandler<HTMLHeadingElement> | undefined;
-    onTouchMove?: import("react").TouchEventHandler<HTMLHeadingElement> | undefined;
-    onTouchMoveCapture?: import("react").TouchEventHandler<HTMLHeadingElement> | undefined;
-    onTouchStart?: import("react").TouchEventHandler<HTMLHeadingElement> | undefined;
-    onTouchStartCapture?: import("react").TouchEventHandler<HTMLHeadingElement> | undefined;
-    onPointerDown?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerDownCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerMove?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerMoveCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerUp?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerUpCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerCancel?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerCancelCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerEnter?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerEnterCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerLeave?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerOver?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerOverCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerOut?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onPointerOutCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onGotPointerCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onLostPointerCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
-    onScroll?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
-    onScrollCapture?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
-    onWheel?: import("react").WheelEventHandler<HTMLHeadingElement> | undefined;
-    onWheelCapture?: import("react").WheelEventHandler<HTMLHeadingElement> | undefined;
-    onAnimationStart?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
-    onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
-    onAnimationEnd?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
-    onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
-    onAnimationIteration?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
-    onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
-    onTransitionEnd?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
-    onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
-}>;