deepsea-components 5.15.22 → 5.15.24

package/dist/components/TransitionNum.js

@@ -1,12 +1,12 @@
 "use client"
-import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
-import * as __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__ from "deepsea-tools";
-import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
-const TransitionNum = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.forwardRef)((props, ref)=>{
+import { jsx } from "react/jsx-runtime";
+import { setFrameInterval } from "deepsea-tools";
+import { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
+const TransitionNum = /*#__PURE__*/ forwardRef((props, ref)=>{
     const { children: num, period, numToStr, ins, ...rest } = props;
-    if (!Number.isInteger(num) || !Number.isInteger(period) || period <= 0) throw new RangeError("目标数字必须是整数，周期必须是正整数");
-    const ele = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)(null);
-    const cache = (0, __WEBPACK_EXTERNAL_MODULE_react__.useRef)({
+    if (!Number.isInteger(num) || !Number.isInteger(period) || period <= 0) throw new RangeError("\u76EE\u6807\u6570\u5B57\u5FC5\u987B\u662F\u6574\u6570\uFF0C\u5468\u671F\u5FC5\u987B\u662F\u6B63\u6574\u6570");
+    const ele = useRef(null);
+    const cache = useRef({
         num,
         period,
         numToStr,
@@ -18,17 +18,17 @@ const TransitionNum = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.forwar
         period,
         numToStr
     };
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useImperativeHandle)(ref, ()=>ele.current, []);
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useImperativeHandle)(ins, ()=>({
+    useImperativeHandle(ref, ()=>ele.current, []);
+    useImperativeHandle(ins, ()=>({
             get: ()=>cache.current.show
         }), []);
-    (0, __WEBPACK_EXTERNAL_MODULE_react__.useEffect)(()=>{
+    useEffect(()=>{
         const { num, period, show, numToStr } = cache.current;
         ele.current.innerText = (numToStr || String)(show);
         if (num === show) return;
         const div = ele.current;
         const speed = (num - show) / period;
-        const cancel = (0, __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__.setFrameInterval)(()=>{
+        const cancel = setFrameInterval(()=>{
             const { num, numToStr } = cache.current;
             cache.current.show += speed;
             if (speed > 0 && cache.current.show > num || speed < 0 && cache.current.show < num) {
@@ -41,7 +41,7 @@ const TransitionNum = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.forwar
     }, [
         num
     ]);
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+    return /*#__PURE__*/ jsx("div", {
         ref: ele,
         ...rest
     });

package/dist/components/Trapezium.cjs

@@ -45,10 +45,10 @@ const Trapezium = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)((
     const h = f * Math.sin(2 * a);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         ref: ref,
-        className: (0, external_deepsea_tools_namespaceObject.clsx)((0, css_namespaceObject.css)`
-                    width: var(--width);
-                    height: var(--height);
-                    clip-path: var(--clip-path);
+        className: (0, external_deepsea_tools_namespaceObject.clsx)((0, css_namespaceObject.css)`
+                    width: var(--width);
+                    height: var(--height);
+                    clip-path: var(--clip-path);
                 `, className),
         style: (0, index_cjs_namespaceObject.transformCSSVariable)({
             width: (0, index_cjs_namespaceObject.px)(bottom),

package/dist/components/Trapezium.js

@@ -1,10 +1,10 @@
 "use client"
-import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
-import * as __WEBPACK_EXTERNAL_MODULE__emotion_css_bfcd1b5d__ from "@emotion/css";
-import * as __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__ from "deepsea-tools";
-import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
-import * as __WEBPACK_EXTERNAL_MODULE__utils_index_js_6619c453__ from "../utils/index.js";
-const Trapezium = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.forwardRef)((props, ref)=>{
+import { jsx } from "react/jsx-runtime";
+import { css } from "@emotion/css";
+import { clsx } from "deepsea-tools";
+import { forwardRef } from "react";
+import { px, transformCSSVariable } from "../utils/index.js";
+const Trapezium = /*#__PURE__*/ forwardRef((props, ref)=>{
     const { top, bottom, height, borderRadius, className, style, ...rest } = props;
     const diff = (bottom - top) / 2;
     const a = Math.atan(height / diff) / 2;
@@ -15,16 +15,16 @@ const Trapezium = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.forwardRef
     const f = borderRadius / Math.tan(e);
     const g = f * Math.cos(2 * a);
     const h = f * Math.sin(2 * a);
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+    return /*#__PURE__*/ jsx("div", {
         ref: ref,
-        className: (0, __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__.clsx)((0, __WEBPACK_EXTERNAL_MODULE__emotion_css_bfcd1b5d__.css)`
-                    width: var(--width);
-                    height: var(--height);
-                    clip-path: var(--clip-path);
+        className: clsx(css`
+                    width: var(--width);
+                    height: var(--height);
+                    clip-path: var(--clip-path);
                 `, className),
-        style: (0, __WEBPACK_EXTERNAL_MODULE__utils_index_js_6619c453__.transformCSSVariable)({
-            width: (0, __WEBPACK_EXTERNAL_MODULE__utils_index_js_6619c453__.px)(bottom),
-            height: (0, __WEBPACK_EXTERNAL_MODULE__utils_index_js_6619c453__.px)(height),
+        style: transformCSSVariable({
+            width: px(bottom),
+            height: px(height),
             clipath: `path("M ${diff + f} 0  A ${borderRadius} ${borderRadius} 0 0 0 ${diff - g} ${h} L ${c} ${height - d} A ${borderRadius} ${borderRadius} 0 0 0 ${b} ${height} L ${bottom - b} ${height} A ${borderRadius} ${borderRadius} 0 0 0 ${bottom - c} ${height - d} L ${top + diff + g} ${h} A ${borderRadius} ${borderRadius} 0 0 0 ${top + diff - f} 0 Z")`
         }, style),
         ...rest

package/dist/components/Unify.js

@@ -1,13 +1,13 @@
 "use client"
-import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
-import * as __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__ from "deepsea-tools";
-import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
-const UnifyConfigContext = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.createContext)({});
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "deepsea-tools";
+import { createContext, createElement, useContext } from "react";
+const UnifyConfigContext = /*#__PURE__*/ createContext({});
 const UnifyConfigProvider = ({ className, style, children })=>{
-    const { className: _className, style: _style } = (0, __WEBPACK_EXTERNAL_MODULE_react__.useContext)(UnifyConfigContext);
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(UnifyConfigContext.Provider, {
+    const { className: _className, style: _style } = useContext(UnifyConfigContext);
+    return /*#__PURE__*/ jsx(UnifyConfigContext.Provider, {
         value: {
-            className: (0, __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__.clsx)(_className, className),
+            className: clsx(_className, className),
             style: {
                 ..._style,
                 ...style
@@ -18,9 +18,9 @@ const UnifyConfigProvider = ({ className, style, children })=>{
 };
 function Unify(props) {
     const { as = "div", className, style, ...rest } = props;
-    const { className: _className, style: _style } = (0, __WEBPACK_EXTERNAL_MODULE_react__.useContext)(UnifyConfigContext);
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.createElement)(as, {
-        className: (0, __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__.clsx)(_className, className),
+    const { className: _className, style: _style } = useContext(UnifyConfigContext);
+    return /*#__PURE__*/ createElement(as, {
+        className: clsx(_className, className),
         style: {
             ..._style,
             ...style

package/dist/components/WriteExcel.js

@@ -1,4 +1,4 @@
 "use client"
-import * as __WEBPACK_EXTERNAL_MODULE__WriteSheet_js_e86d0e28__ from "./WriteSheet.js";
-const WriteExcel = __WEBPACK_EXTERNAL_MODULE__WriteSheet_js_e86d0e28__.WriteSheet;
+import { WriteSheet } from "./WriteSheet.js";
+const WriteExcel = WriteSheet;
 export { WriteExcel };

package/dist/components/WriteSheet.js

@@ -1,14 +1,14 @@
 "use client"
-import * as __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__ from "deepsea-tools";
-import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import { writeSheet } from "deepsea-tools";
+import { createElement } from "react";
 function WriteSheet(props) {
     const { as, excel, onClick: _onClick, ...rest } = props;
     function onClick(e) {
         _onClick?.(e);
         if (!excel) return;
-        (0, __WEBPACK_EXTERNAL_MODULE_deepsea_tools_8ecdf5a5__.writeSheet)(excel);
+        writeSheet(excel);
     }
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react__.createElement)(as ?? "button", {
+    return /*#__PURE__*/ createElement(as ?? "button", {
         onClick,
         ...rest
     });

package/dist/utils/getReactVersion.js

@@ -1,6 +1,6 @@
-import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import { version } from "react";
 const reg = /(\d+)\.(\d+)\.(\d+)/;
 function getReactVersion() {
-    return __WEBPACK_EXTERNAL_MODULE_react__.version.match(reg).slice(1).map(Number);
+    return version.match(reg).slice(1).map(Number);
 }
 export { getReactVersion };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "deepsea-components",
-  "version": "5.15.22",
+  "version": "5.15.24",
   "description": "格数科技自用组件库",
   "type": "module",
   "exports": {
@@ -38,15 +38,16 @@
     "@emotion/css": "^11.13.5",
     "clipboard": "^2.0.11",
     "echarts": "^5.6.0",
-    "hls.js": "^1.6.7",
+    "hls.js": "^1.6.9",
     "smooth-scrollbar": "^8.8.4",
-    "deepsea-tools": "5.40.2",
-    "soda-hooks": "6.12.5"
+    "soda-hooks": "6.12.7",
+    "deepsea-tools": "5.40.4"
   },
   "devDependencies": {
-    "typescript": "^5.8.3"
+    "typescript": "^5.9.2"
   },
   "peerDependencies": {
+    "@types/node": ">=20",
     "@types/react": ">=18.3.18",
     "@types/react-dom": ">=18.3.5",
     "react": ">=18.3.1",

package/src/components/AutoFit.tsx

@@ -1,104 +1,104 @@
-"use client"
-
-import { css } from "@emotion/css"
-import { clsx } from "deepsea-tools"
-import { HTMLAttributes, forwardRef, useEffect, useImperativeHandle, useLayoutEffect, useRef, useState } from "react"
-
-import { px, transformCSSVariable } from "@/utils"
-
-export interface AutoFitProps extends HTMLAttributes<HTMLDivElement> {
-    /** 设计稿宽度，默认 1920 */
-    width?: number
-    /** 设计稿高度，默认 1080 */
-    height?: number
-    /**
-     * 在哪些方向进行缩放，默认缩放所有方向
-     * 1. 水平方向是指，宽度按照设计稿进行占满，高度反向缩放
-     * 2. 垂直方向是指，高度按照设计稿进行占满，宽度反向缩放
-     * 3. 默认是水平和垂直方向都进行缩放，类似于 background-size: contain 的效果
-     */
-    direction?: "horizontal" | "vertical" | "both"
-}
-
-/**
- * 自适应缩放组件
- *
- * 注意：
- * 1. 父元素必须设置非 static 定位方式
- * 2. 父元素只能有且仅有一个子元素，那就是 AutoFit
- * 3. 不要设置 AutoFit 的 position、left、top、transform、width、height 属性
- * 4. 在第一次完成缩放前，无论 props 是什么，返回的都是 <div style={{ display: "none" }} />
- * 5. 元素的属性、事件、资源并不是立即加载的，会有一帧的延迟，在第一次完成缩放后才会显示
- */
-export const AutoFit = forwardRef<HTMLDivElement, AutoFitProps>((props, ref) => {
-    const { width: designWidth = 1920, height: designHeight = 1080, direction, className, style, ...rest } = props
-    const ele = useRef<HTMLDivElement>(null)
-    const [show, setShow] = useState(false)
-    const [transform, setTransform] = useState<string | undefined>(undefined)
-    const [width, setWidth] = useState<string | undefined>(undefined)
-    const [height, setHeight] = useState<string | undefined>(undefined)
-
-    useImperativeHandle(ref, () => ele.current!, [ele.current])
-    useLayoutEffect(() => {
-        const element = ele.current
-        const parent = element?.parentElement
-        if (!element || !parent) return
-        function listener(entries: ResizeObserverEntry[]) {
-            const entry = entries[0]
-            const { contentRect } = entry
-            if (direction === "horizontal") {
-                const scale = contentRect.width / designWidth
-                setTransform(`scale(${scale})`)
-                setWidth(px(designWidth))
-                setHeight(px(contentRect.height / scale))
-            } else if (direction === "vertical") {
-                const scale = contentRect.height / designHeight
-                setTransform(`scale(${scale})`)
-                setWidth(px(contentRect.width / scale))
-                setHeight(px(designHeight))
-            } else {
-                const scale = Math.min(contentRect.width / designWidth, contentRect.height / designHeight)
-                setTransform(
-                    `translateX(${(contentRect.width - designWidth * scale) / 2}px) translateY(${(contentRect.height - designHeight * scale) / 2}px) scale(${scale})`,
-                )
-                setWidth(px(designWidth))
-                setHeight(px(designHeight))
-            }
-            setShow(true)
-        }
-        const observer = new ResizeObserver(listener)
-        observer.observe(parent)
-        return () => observer.disconnect()
-    }, [ele.current?.parentElement, designWidth, designHeight, direction])
-
-    if (process.env.NODE_ENV === "development") {
-        useEffect(() => {
-            const parent = ele.current?.parentElement
-            if (!parent) return
-            const style = getComputedStyle(parent)
-            if (style.position === "static") {
-                console.warn("AutoFit 组件的父元素的 position 属性不应该是 static")
-            }
-        }, [ele.current?.parentElement])
-    }
-
-    if (!show) return <div ref={ele} style={{ display: "none" }} />
-
-    return (
-        <div
-            ref={ele}
-            className={clsx(
-                css`
-                    position: absolute;
-                    transform: var(--transform);
-                    transform-origin: top left;
-                    width: var(--width);
-                    height: var(--height);
-                `,
-                className,
-            )}
-            style={transformCSSVariable({ transform, width, height }, style)}
-            {...rest}
-        />
-    )
-})
+"use client"
+
+import { css } from "@emotion/css"
+import { clsx } from "deepsea-tools"
+import { HTMLAttributes, forwardRef, useEffect, useImperativeHandle, useLayoutEffect, useRef, useState } from "react"
+
+import { px, transformCSSVariable } from "@/utils"
+
+export interface AutoFitProps extends HTMLAttributes<HTMLDivElement> {
+    /** 设计稿宽度，默认 1920 */
+    width?: number
+    /** 设计稿高度，默认 1080 */
+    height?: number
+    /**
+     * 在哪些方向进行缩放，默认缩放所有方向
+     * 1. 水平方向是指，宽度按照设计稿进行占满，高度反向缩放
+     * 2. 垂直方向是指，高度按照设计稿进行占满，宽度反向缩放
+     * 3. 默认是水平和垂直方向都进行缩放，类似于 background-size: contain 的效果
+     */
+    direction?: "horizontal" | "vertical" | "both"
+}
+
+/**
+ * 自适应缩放组件
+ *
+ * 注意：
+ * 1. 父元素必须设置非 static 定位方式
+ * 2. 父元素只能有且仅有一个子元素，那就是 AutoFit
+ * 3. 不要设置 AutoFit 的 position、left、top、transform、width、height 属性
+ * 4. 在第一次完成缩放前，无论 props 是什么，返回的都是 <div style={{ display: "none" }} />
+ * 5. 元素的属性、事件、资源并不是立即加载的，会有一帧的延迟，在第一次完成缩放后才会显示
+ */
+export const AutoFit = forwardRef<HTMLDivElement, AutoFitProps>((props, ref) => {
+    const { width: designWidth = 1920, height: designHeight = 1080, direction, className, style, ...rest } = props
+    const ele = useRef<HTMLDivElement>(null)
+    const [show, setShow] = useState(false)
+    const [transform, setTransform] = useState<string | undefined>(undefined)
+    const [width, setWidth] = useState<string | undefined>(undefined)
+    const [height, setHeight] = useState<string | undefined>(undefined)
+
+    useImperativeHandle(ref, () => ele.current!, [ele.current])
+    useLayoutEffect(() => {
+        const element = ele.current
+        const parent = element?.parentElement
+        if (!element || !parent) return
+        function listener(entries: ResizeObserverEntry[]) {
+            const entry = entries[0]
+            const { contentRect } = entry
+            if (direction === "horizontal") {
+                const scale = contentRect.width / designWidth
+                setTransform(`scale(${scale})`)
+                setWidth(px(designWidth))
+                setHeight(px(contentRect.height / scale))
+            } else if (direction === "vertical") {
+                const scale = contentRect.height / designHeight
+                setTransform(`scale(${scale})`)
+                setWidth(px(contentRect.width / scale))
+                setHeight(px(designHeight))
+            } else {
+                const scale = Math.min(contentRect.width / designWidth, contentRect.height / designHeight)
+                setTransform(
+                    `translateX(${(contentRect.width - designWidth * scale) / 2}px) translateY(${(contentRect.height - designHeight * scale) / 2}px) scale(${scale})`,
+                )
+                setWidth(px(designWidth))
+                setHeight(px(designHeight))
+            }
+            setShow(true)
+        }
+        const observer = new ResizeObserver(listener)
+        observer.observe(parent)
+        return () => observer.disconnect()
+    }, [ele.current?.parentElement, designWidth, designHeight, direction])
+
+    if (process.env.NODE_ENV === "development") {
+        useEffect(() => {
+            const parent = ele.current?.parentElement
+            if (!parent) return
+            const style = getComputedStyle(parent)
+            if (style.position === "static") {
+                console.warn("AutoFit 组件的父元素的 position 属性不应该是 static")
+            }
+        }, [ele.current?.parentElement])
+    }
+
+    if (!show) return <div ref={ele} style={{ display: "none" }} />
+
+    return (
+        <div
+            ref={ele}
+            className={clsx(
+                css`
+                    position: absolute;
+                    transform: var(--transform);
+                    transform-origin: top left;
+                    width: var(--width);
+                    height: var(--height);
+                `,
+                className,
+            )}
+            style={transformCSSVariable({ transform, width, height }, style)}
+            {...rest}
+        />
+    )
+})