deepsea-components 5.18.5 → 5.18.6

package/src/components/Echart.tsx

@@ -1,71 +1,71 @@
 "use client"
 
-import { ComponentProps, FC, ReactNode, Ref, useEffect, useImperativeHandle, useLayoutEffect, useRef } from "react"
+import { type ComponentProps, type FC, type ReactNode, type Ref, useEffect, useImperativeHandle, useLayoutEffect, useRef } from "react"
 
 import {
-    AngleAxisComponentOption,
-    AriaComponentOption,
-    AxisPointerComponentOption,
-    BarSeriesOption,
-    BoxplotSeriesOption,
-    BrushComponentOption,
-    CalendarComponentOption,
-    CandlestickSeriesOption,
-    ChordSeriesOption,
-    ComposeOption,
-    ContinousVisualMapComponentOption,
-    CustomSeriesOption,
-    DatasetComponentOption,
-    DataZoomComponentOption,
-    ECharts,
-    EChartsInitOpts,
-    EffectScatterSeriesOption,
-    FunnelSeriesOption,
-    GaugeSeriesOption,
-    GeoComponentOption,
-    GraphicComponentOption,
-    GraphSeriesOption,
-    GridComponentOption,
-    HeatmapSeriesOption,
+    type AngleAxisComponentOption,
+    type AriaComponentOption,
+    type AxisPointerComponentOption,
+    type BarSeriesOption,
+    type BoxplotSeriesOption,
+    type BrushComponentOption,
+    type CalendarComponentOption,
+    type CandlestickSeriesOption,
+    type ChordSeriesOption,
+    type ComposeOption,
+    type ContinousVisualMapComponentOption,
+    type CustomSeriesOption,
+    type DatasetComponentOption,
+    type DataZoomComponentOption,
+    type ECharts,
+    type EChartsInitOpts,
+    type EffectScatterSeriesOption,
+    type FunnelSeriesOption,
+    type GaugeSeriesOption,
+    type GeoComponentOption,
+    type GraphicComponentOption,
+    type GraphSeriesOption,
+    type GridComponentOption,
+    type HeatmapSeriesOption,
+    type InsideDataZoomComponentOption,
+    type LegendComponentOption,
+    type LineSeriesOption,
+    type LinesSeriesOption,
+    type MapSeriesOption,
+    type MarkAreaComponentOption,
+    type MarkLineComponentOption,
+    type MarkPointComponentOption,
+    type MatrixComponentOption,
+    type ParallelSeriesOption,
+    type PictorialBarSeriesOption,
+    type PiecewiseVisualMapComponentOption,
+    type PieSeriesOption,
+    type PlainLegendComponentOption,
+    type PolarComponentOption,
+    type RadarComponentOption,
+    type RadarSeriesOption,
+    type RadiusAxisComponentOption,
+    type SankeySeriesOption,
+    type ScatterSeriesOption,
+    type ScrollableLegendComponentOption,
+    type SeriesOption,
+    type SingleAxisComponentOption,
+    type SliderDataZoomComponentOption,
+    type SunburstSeriesOption,
+    type ThemeRiverSeriesOption,
+    type ThumbnailComponentOption,
+    type TimelineComponentOption,
+    type TitleComponentOption,
+    type ToolboxComponentOption,
+    type TooltipComponentOption,
+    type TreemapSeriesOption,
+    type TreeSeriesOption,
+    type VisualMapComponentOption,
+    type XAXisComponentOption,
+    type YAXisComponentOption,
     init,
-    InsideDataZoomComponentOption,
-    LegendComponentOption,
-    LineSeriesOption,
-    LinesSeriesOption,
-    MapSeriesOption,
-    MarkAreaComponentOption,
-    MarkLineComponentOption,
-    MarkPointComponentOption,
-    MatrixComponentOption,
-    ParallelSeriesOption,
-    PictorialBarSeriesOption,
-    PiecewiseVisualMapComponentOption,
-    PieSeriesOption,
-    PlainLegendComponentOption,
-    PolarComponentOption,
-    RadarComponentOption,
-    RadarSeriesOption,
-    RadiusAxisComponentOption,
-    SankeySeriesOption,
-    ScatterSeriesOption,
-    ScrollableLegendComponentOption,
-    SeriesOption,
-    SingleAxisComponentOption,
-    SliderDataZoomComponentOption,
-    SunburstSeriesOption,
-    ThemeRiverSeriesOption,
-    ThumbnailComponentOption,
-    TimelineComponentOption,
-    TitleComponentOption,
-    ToolboxComponentOption,
-    TooltipComponentOption,
-    TreemapSeriesOption,
-    TreeSeriesOption,
-    VisualMapComponentOption,
-    XAXisComponentOption,
-    YAXisComponentOption,
 } from "echarts"
-import { ECBasicOption } from "echarts/types/src/util/types.js"
+import type { ECBasicOption } from "echarts/types/src/util/types.js"
 import hash from "stable-hash"
 
 export type ChartOption<T extends SeriesOption = never> = ComposeOption<
@@ -179,6 +179,7 @@ export function Echart<T extends ECBasicOption = ECBasicOption>({
     useLayoutEffect(() => {
         const ele = container.current!
         chartRef.current = init(ele, option, { ...initOption, width, height, locale })
+
         return () => chartRef.current?.dispose()
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [])

package/src/components/Flow.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { CSSProperties, HTMLAttributes, Key, ReactNode, Ref, useEffect, useImperativeHandle, useRef, useState } from "react"
+import { type CSSProperties, type HTMLAttributes, type Key, type ReactNode, type Ref, useEffect, useImperativeHandle, useRef, useState } from "react"
 
 import { css } from "@emotion/css"
 import { clsx } from "deepsea-tools"
@@ -268,12 +268,16 @@ export function Flow<T>(props: FlowProps<T>): ReactNode {
     const ele = useRef<HTMLDivElement>(null)
     const size = useSize(ele)
     const width = useRef(size?.width || 0)
+
     // eslint-disable-next-line react-hooks/refs
     if (size && size.width !== 0) width.current = size.width
+
     // eslint-disable-next-line react-hooks/exhaustive-deps, react-hooks/refs
     useImperativeHandle(element, () => ele.current!, [ele.current])
+
     // eslint-disable-next-line react-hooks/refs
     if (width.current === 0) return <div ref={ele} {...rest} />
+
     // eslint-disable-next-line react-hooks/refs
     return <ManualFlow element={ele} {...props} width={width.current} />
 }

package/src/components/FormLabel.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { ComponentPropsWithoutRef, createContext, FC, Fragment, ReactNode, useContext } from "react"
+import { type ComponentPropsWithoutRef, type FC, type ReactNode, createContext, Fragment, useContext } from "react"
 
 export interface FormLabelConfig {
     /**

package/src/components/HlsPlayer.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { ComponentProps, FC, useEffect, useImperativeHandle, useRef } from "react"
+import { type ComponentProps, type FC, useEffect, useImperativeHandle, useRef } from "react"
 
 import Hls from "hls.js"
 

package/src/components/IconFileType.tsx

@@ -1,4 +1,4 @@
-import { ComponentProps, FC } from "react"
+import type { ComponentProps, FC } from "react"
 
 const GOLD = (Math.sqrt(5) - 1) / 2
 const GOLD_T = Math.sqrt(1 - GOLD * GOLD)

package/src/components/InfiniteScroll.tsx

@@ -2,7 +2,15 @@
 
 /* eslint-disable no-restricted-syntax */
 
-import { ComponentPropsWithoutRef, CSSProperties, forwardRef, MouseEvent as ReactMouseEvent, useEffect, useImperativeHandle, useRef } from "react"
+import {
+    type ComponentPropsWithoutRef,
+    type CSSProperties,
+    type MouseEvent as ReactMouseEvent,
+    forwardRef,
+    useEffect,
+    useImperativeHandle,
+    useRef,
+} from "react"
 
 import { css } from "@emotion/css"
 import { clsx } from "deepsea-tools"
@@ -90,6 +98,7 @@ export const InfiniteScroll = forwardRef<HTMLDivElement, InfiniteScrollProps>((p
             },
             { duration, iterations: Infinity },
         )
+
         return () => animation.current?.cancel()
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [wrapperSize, containerSize, overflow, direction, duration])

package/src/components/InputFile.tsx

@@ -2,7 +2,7 @@
 
 /* eslint-disable no-restricted-syntax */
 
-import { ChangeEvent, ComponentProps, ReactNode, useState } from "react"
+import { type ChangeEvent, type ComponentProps, type ReactNode, useState } from "react"
 
 export interface InputFileDataTypeMap {
     base64: string
@@ -23,9 +23,11 @@ export function getFileData<T extends InputFileDataType>(file: File, type: T): P
         fileReader.addEventListener("load", () => {
             resolve(fileReader.result as any)
         })
+
         fileReader.addEventListener("error", () => {
             reject(fileReader.error ?? new Error("Failed to read file"))
         })
+
         fileReader.addEventListener("abort", () => {
             reject(fileReader.error ?? new Error("File reading was aborted"))
         })

package/src/components/InputFileButton.tsx

@@ -3,29 +3,29 @@
 /* eslint-disable no-restricted-syntax */
 
 import {
-    ComponentProps,
-    ComponentRef,
+    type ComponentProps,
+    type ComponentRef,
+    type DragEvent,
+    type JSX,
+    type JSXElementConstructor,
+    type MouseEvent as ReactMouseEvent,
     createElement,
-    DragEvent,
     Fragment,
-    JSX,
-    JSXElementConstructor,
-    MouseEvent as ReactMouseEvent,
     useImperativeHandle,
     useRef,
     useState,
 } from "react"
 
 import {
-    DataType,
-    FileType,
+    type DataType,
+    type FileType,
+    type InputFileBaseProps,
+    type InputFileDataType,
+    type InputFileDataTypeMap,
+    type InputFileExtraProps,
+    type ValueType,
     getFileData,
     InputFile,
-    InputFileBaseProps,
-    InputFileDataType,
-    InputFileDataTypeMap,
-    InputFileExtraProps,
-    ValueType,
 } from "./InputFile"
 
 export type InputFileButtonProps<

package/src/components/LoopSwiper.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { ComponentProps, CSSProperties, FC, useEffect, useImperativeHandle, useRef, useState } from "react"
+import { type ComponentProps, type CSSProperties, type FC, useEffect, useImperativeHandle, useRef, useState } from "react"
 
 import { css } from "@emotion/css"
 import { clsx } from "deepsea-tools"

package/src/components/ReadExcel.tsx

@@ -1,13 +1,13 @@
-"use client"
-
-import { ReadSheet, ReadSheetProps } from "./ReadSheet"
-
-/**
- * @deprecated 请使用 ReadSheetProps 代替
- */
-export type ReadExcelProps = ReadSheetProps
-
-/**
- * @deprecated 请使用 ReadSheet 代替
- */
-export const ReadExcel = ReadSheet
+"use client"
+
+import { type ReadSheetProps, ReadSheet } from "./ReadSheet"
+
+/**
+ * @deprecated 请使用 ReadSheetProps 代替
+ */
+export type ReadExcelProps = ReadSheetProps
+
+/**
+ * @deprecated 请使用 ReadSheet 代替
+ */
+export const ReadExcel = ReadSheet

package/src/components/ReadSheet.tsx

@@ -1,8 +1,8 @@
 "use client"
 
-import { readSheet, WorkBookData, WorkSheetData } from "deepsea-tools"
+import { type WorkBookData, type WorkSheetData, readSheet } from "deepsea-tools"
 
-import { InputFile, InputFileProps } from "./InputFile"
+import { type InputFileProps, InputFile } from "./InputFile"
 
 export interface ReadSheetProps<Sheet = WorkSheetData> extends Omit<InputFileProps<false, "arrayBuffer">, "multiple" | "accept" | "type" | "onValueChange"> {
     onValueChange?: (data: WorkBookData<Sheet>) => void

package/src/components/Ring.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { forwardRef, HTMLAttributes } from "react"
+import { type HTMLAttributes, forwardRef } from "react"
 
 export interface RingProps extends HTMLAttributes<HTMLDivElement> {
     outerWidth: number

package/src/components/RtspPlayer.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { ComponentProps, FC, useEffect, useImperativeHandle, useRef } from "react"
+import { type ComponentProps, type FC, useEffect, useImperativeHandle, useRef } from "react"
 
 import { MediaMTXWebRTCReader } from "@/components/rtspPlayer/reader"
 
@@ -15,9 +15,7 @@ export interface RtspPlayerProps extends Omit<ComponentProps<"video">, "src" | "
 function getWhepUrl(src: string) {
     const url = new URL(src, window.location.href)
 
-    if (url.protocol !== "http:" && url.protocol !== "https:") {
-        throw new Error("RtspPlayer expects a MediaMTX HTTP(S) playback URL, not an RTSP URL")
-    }
+    if (url.protocol !== "http:" && url.protocol !== "https:") throw new Error("RtspPlayer expects a MediaMTX HTTP(S) playback URL, not an RTSP URL")
 
     const pathname = url.pathname.replace(/\/+$/, "")
     url.pathname = pathname.endsWith("/whep") ? pathname : `${pathname}/whep`
@@ -60,6 +58,7 @@ export const RtspPlayer: FC<RtspPlayerProps> = ({ ref, src, user, pass, token, o
 
         let closed = false
         const fallbackStream = new MediaStream()
+
         const reader = new MediaMTXWebRTCReader({
             url: whepUrl,
             user,

package/src/components/Scroll.tsx

@@ -1,6 +1,16 @@
 "use client"
 
-import { ComponentProps, CSSProperties, FC, ForwardedRef, useEffect, useEffectEvent, useImperativeHandle, useLayoutEffect, useRef } from "react"
+import {
+    type ComponentProps,
+    type CSSProperties,
+    type FC,
+    type ForwardedRef,
+    useEffect,
+    useEffectEvent,
+    useImperativeHandle,
+    useLayoutEffect,
+    useRef,
+} from "react"
 
 import { css } from "@emotion/css"
 import { clsx } from "deepsea-tools"
@@ -48,6 +58,7 @@ export const Scroll: FC<ScrollProps> = ({
 
     useLayoutEffect(() => {
         bar.current = Scrollbar.init(ele.current!, scrollbarOptions)
+
         return () => bar.current?.destroy()
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [])

package/src/components/ScrollMask.module.css

@@ -1,87 +1,87 @@
-.scroll-mask {
-    position: sticky;
-    z-index: 10;
-    pointer-events: none;
-}
-
-.top-scroll-mask {
-    width: 100%;
-    height: 0;
-    top: 0;
-    right: 0;
-    bottom: 100%;
-    left: 0;
-}
-
-.scroll-mask-content {
-    position: absolute;
-    background-image: linear-gradient(
-        to var(--scroll-mask-direction),
-        var(--scroll-mask-color-from, rgba(0, 0, 0, 0.1)),
-        var(--scroll-mask-color-to, rgba(0, 0, 0, 0))
-    );
-    clip-path: var(--scroll-mask-clip-path, none);
-}
-
-.top-scroll-mask-content {
-    width: 100%;
-    height: var(--scroll-mask-size, 8px);
-    top: 0;
-    right: 50%;
-    transform: translateX(50%);
-    --scroll-mask-direction: bottom;
-}
-
-.bottom-scroll-mask {
-    width: 100%;
-    height: 0;
-    top: 100%;
-    right: 0;
-    bottom: 0;
-    left: 0;
-}
-
-.bottom-scroll-mask-content {
-    width: 100%;
-    height: var(--scroll-mask-size, 8px);
-    bottom: 0;
-    left: 50%;
-    transform: translateX(-50%);
-    --scroll-mask-direction: top;
-}
-
-.left-scroll-mask {
-    width: 0;
-    height: 100%;
-    top: 0;
-    right: 100%;
-    bottom: 0;
-    left: 0;
-}
-
-.left-scroll-mask-content {
-    width: var(--scroll-mask-size, 8px);
-    height: 100%;
-    left: 0;
-    top: 50%;
-    transform: translateY(-50%);
-    --scroll-mask-direction: right;
-}
-
-.right-scroll-mask {
-    width: 0;
-    height: 100%;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 100%;
-}
-
-.right-scroll-mask-content {
-    width: var(--scroll-mask-size, 8px);
-    height: 100%;
-    right: 0;
-    bottom: 50%;
-    transform: translateY(50%);
-    --scroll-mask-direction: left;
-}
+.scroll-mask {
+    position: sticky;
+    z-index: 10;
+    pointer-events: none;
+}
+
+.top-scroll-mask {
+    width: 100%;
+    height: 0;
+    top: 0;
+    right: 0;
+    bottom: 100%;
+    left: 0;
+}
+
+.scroll-mask-content {
+    position: absolute;
+    background-image: linear-gradient(
+        to var(--scroll-mask-direction),
+        var(--scroll-mask-color-from, rgba(0, 0, 0, 0.1)),
+        var(--scroll-mask-color-to, rgba(0, 0, 0, 0))
+    );
+    clip-path: var(--scroll-mask-clip-path, none);
+}
+
+.top-scroll-mask-content {
+    width: 100%;
+    height: var(--scroll-mask-size, 8px);
+    top: 0;
+    right: 50%;
+    transform: translateX(50%);
+    --scroll-mask-direction: bottom;
+}
+
+.bottom-scroll-mask {
+    width: 100%;
+    height: 0;
+    top: 100%;
+    right: 0;
+    bottom: 0;
+    left: 0;
+}
+
+.bottom-scroll-mask-content {
+    width: 100%;
+    height: var(--scroll-mask-size, 8px);
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    --scroll-mask-direction: top;
+}
+
+.left-scroll-mask {
+    width: 0;
+    height: 100%;
+    top: 0;
+    right: 100%;
+    bottom: 0;
+    left: 0;
+}
+
+.left-scroll-mask-content {
+    width: var(--scroll-mask-size, 8px);
+    height: 100%;
+    left: 0;
+    top: 50%;
+    transform: translateY(-50%);
+    --scroll-mask-direction: right;
+}
+
+.right-scroll-mask {
+    width: 0;
+    height: 100%;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 100%;
+}
+
+.right-scroll-mask-content {
+    width: var(--scroll-mask-size, 8px);
+    height: 100%;
+    right: 0;
+    bottom: 50%;
+    transform: translateY(50%);
+    --scroll-mask-direction: left;
+}

package/src/components/ScrollMask.tsx

@@ -1,4 +1,4 @@
-import { ComponentProps, CSSProperties, FC, useRef } from "react"
+import { type ComponentProps, type CSSProperties, type FC, useRef } from "react"
 
 import { clsx, isNonNullable } from "deepsea-tools"
 import { useSize } from "soda-hooks"

package/src/components/SectionRing.tsx

@@ -1,8 +1,8 @@
 "use client"
 
-import { forwardRef, HTMLAttributes } from "react"
+import { type HTMLAttributes, forwardRef } from "react"
 
-import { drawArc, DrawArcOptions } from "deepsea-tools"
+import { type DrawArcOptions, drawArc } from "deepsea-tools"
 
 export interface SectionRingProps extends HTMLAttributes<HTMLDivElement> {
     outerRadius: number

package/src/components/Skeleton.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { forwardRef, HTMLAttributes } from "react"
+import { type HTMLAttributes, forwardRef } from "react"
 
 import { css } from "@emotion/css"
 import { clsx } from "deepsea-tools"

package/src/components/Title.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { ComponentProps, FC, useImperativeHandle, useLayoutEffect, useRef } from "react"
+import { type ComponentProps, type FC, useImperativeHandle, useLayoutEffect, useRef } from "react"
 import { createPortal } from "react-dom"
 import { renderToString } from "react-dom/server"
 

package/src/components/TransitionBox.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { CSSProperties, FC, forwardRef, HTMLAttributes, useEffect, useRef, useState } from "react"
+import { type CSSProperties, type FC, type HTMLAttributes, forwardRef, useEffect, useRef, useState } from "react"
 
 import { useSize } from "soda-hooks"
 

package/src/components/TransitionNum.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { ForwardedRef, forwardRef, HTMLAttributes, useEffect, useImperativeHandle, useRef } from "react"
+import { type ForwardedRef, type HTMLAttributes, forwardRef, useEffect, useImperativeHandle, useRef } from "react"
 
 import { setFrameInterval } from "deepsea-tools"
 

package/src/components/Trapezium.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { forwardRef, HTMLAttributes } from "react"
+import { type HTMLAttributes, forwardRef } from "react"
 
 import { css } from "@emotion/css"
 import { clsx } from "deepsea-tools"

package/src/components/Unify.tsx

@@ -2,7 +2,17 @@
 
 /* eslint-disable no-restricted-syntax */
 
-import { ComponentProps, createContext, createElement, CSSProperties, FC, JSX, JSXElementConstructor, ReactNode, useContext } from "react"
+import {
+    type ComponentProps,
+    type CSSProperties,
+    type FC,
+    type JSX,
+    type JSXElementConstructor,
+    type ReactNode,
+    createContext,
+    createElement,
+    useContext,
+} from "react"
 
 import { clsx } from "deepsea-tools"