deepsea-components 2.7.0 → 2.8.0-beta.20240516095230

package/dist/cjs/components/AutoScroll.d.ts

@@ -0,0 +1,22 @@
+import { HTMLAttributes, ReactNode } from "react";
+import { ScrollOptions } from "./Scroll";
+export interface SwiperScrollProps<T> extends HTMLAttributes<HTMLDivElement> {
+    count: number;
+    /** 轮播元素的长度 */
+    itemHeight: number;
+    /** 轮播的数据 */
+    data: T[];
+    /** key 生成器 */
+    keyExtractor?: (item: T, index: number, data: T[]) => string | number;
+    /** 轮播元素的渲染函数 */
+    render: (item: T, index: number, data: T[]) => ReactNode;
+    /** 轮播动画的时间 */
+    animationTime: number;
+    /** 每个元素的停留时间 */
+    period: number;
+    /** 元素之间的间距 */
+    gap?: number;
+    /** 滚动条选项 */
+    options?: ScrollOptions;
+}
+export declare function AutoScroll<T>(props: SwiperScrollProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/AutoScroll.js

@@ -0,0 +1,88 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/AutoScroll.tsx
+var AutoScroll_exports = {};
+__export(AutoScroll_exports, {
+  AutoScroll: () => AutoScroll
+});
+module.exports = __toCommonJS(AutoScroll_exports);
+var import_react = require("react");
+var import_Scroll = require("./Scroll");
+function AutoScroll(props) {
+  const { style, itemHeight, count, data, render, animationTime, period, keyExtractor, options, onMouseEnter, onMouseLeave, gap = 0, ...rest } = props;
+  const [offset, setOffset] = (0, import_react.useState)(0);
+  const [paused, setPaused] = (0, import_react.useState)(false);
+  const pausedRef = (0, import_react.useRef)(paused);
+  pausedRef.current = paused;
+  const periodRef = (0, import_react.useRef)(period);
+  periodRef.current = period;
+  const height = (itemHeight + gap) * count - gap;
+  const bar = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    let timer;
+    const listener = (status) => {
+      const y = status.offset.y;
+      const a = y / (itemHeight + gap);
+      let newOffset;
+      if (a % 1 <= 0.05) {
+        newOffset = Math.floor(a);
+      } else {
+        newOffset = Math.ceil(a);
+      }
+      clearTimeout(timer);
+      timer = setTimeout(() => {
+        setOffset(newOffset);
+      }, periodRef.current);
+    };
+    bar.current?.addListener(listener);
+    return () => {
+      bar.current?.removeListener(listener);
+    };
+  }, []);
+  (0, import_react.useEffect)(() => {
+    if (data.length <= count || paused === true)
+      return;
+    const timer = setTimeout(() => {
+      setOffset((offset + 1) % (data.length + 1 - count));
+    }, periodRef.current);
+    return () => clearTimeout(timer);
+  }, [count, data.length, offset, paused]);
+  (0, import_react.useEffect)(() => {
+    setOffset(0);
+  }, [itemHeight, count, data.length, animationTime, period, gap]);
+  (0, import_react.useEffect)(() => {
+    if (pausedRef.current)
+      return;
+    bar.current?.scrollTo(0, offset * (itemHeight + gap), animationTime);
+  }, [offset]);
+  function onContainerMouseEnter(e) {
+    setPaused(true);
+    onMouseEnter?.(e);
+  }
+  function onContainerMouseLeave(e) {
+    setPaused(false);
+    onMouseLeave?.(e);
+  }
+  return /* @__PURE__ */ React.createElement(import_Scroll.Scroll, { scrollbar: bar, options, style: { height, ...style }, onMouseEnter: onContainerMouseEnter, onMouseLeave: onContainerMouseLeave, ...rest }, data.map((item, index, arr) => /* @__PURE__ */ React.createElement("div", { key: keyExtractor?.(item, index, arr) ?? index, style: { height: itemHeight, marginTop: index === 0 ? 0 : `${gap}px` } }, render(item, index, arr))));
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AutoScroll
+});
+//# sourceMappingURL=AutoScroll.js.map

package/dist/cjs/components/AutoScroll.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/AutoScroll.tsx"],
+  "sourcesContent": ["import { HTMLAttributes, ReactNode, useEffect, useRef, useState, MouseEvent as ReactMouseEvent } from \"react\"\r\nimport Scrollbar from \"smooth-scrollbar\"\r\nimport { ScrollStatus } from \"smooth-scrollbar/interfaces/scrollbar\"\r\nimport { Scroll, ScrollOptions } from \"./Scroll\"\r\n\r\nexport interface SwiperScrollProps<T> extends HTMLAttributes<HTMLDivElement> {\r\n    count: number\r\n\r\n    /** 轮播元素的长度 */\r\n    itemHeight: number\r\n\r\n    /** 轮播的数据 */\r\n    data: T[]\r\n\r\n    /** key 生成器 */\r\n    keyExtractor?: (item: T, index: number, data: T[]) => string | number\r\n\r\n    /** 轮播元素的渲染函数 */\r\n    render: (item: T, index: number, data: T[]) => ReactNode\r\n\r\n    /** 轮播动画的时间 */\r\n    animationTime: number\r\n\r\n    /** 每个元素的停留时间 */\r\n    period: number\r\n\r\n    /** 元素之间的间距 */\r\n    gap?: number\r\n\r\n    /** 滚动条选项 */\r\n    options?: ScrollOptions\r\n}\r\n\r\nexport function AutoScroll<T>(props: SwiperScrollProps<T>) {\r\n    const { style, itemHeight, count, data, render, animationTime, period, keyExtractor, options, onMouseEnter, onMouseLeave, gap = 0, ...rest } = props\r\n\r\n    const [offset, setOffset] = useState(0)\r\n\r\n    const [paused, setPaused] = useState(false)\r\n\r\n    const pausedRef = useRef(paused)\r\n\r\n    pausedRef.current = paused\r\n\r\n    const periodRef = useRef(period)\r\n\r\n    periodRef.current = period\r\n\r\n    const height = (itemHeight + gap) * count - gap\r\n\r\n    const bar = useRef<Scrollbar | null>(null)\r\n\r\n    useEffect(() => {\r\n        let timer: NodeJS.Timeout\r\n        const listener = (status: ScrollStatus) => {\r\n            const y = status.offset.y\r\n            const a = y / (itemHeight + gap)\r\n            let newOffset: number\r\n            if (a % 1 <= 0.05) {\r\n                newOffset = Math.floor(a)\r\n            } else {\r\n                newOffset = Math.ceil(a)\r\n            }\r\n            clearTimeout(timer)\r\n            timer = setTimeout(() => {\r\n                setOffset(newOffset)\r\n            }, periodRef.current)\r\n        }\r\n        bar.current?.addListener(listener)\r\n        return () => {\r\n            bar.current?.removeListener(listener)\r\n        }\r\n    }, [])\r\n\r\n    useEffect(() => {\r\n        if (data.length <= count || paused === true) return\r\n        const timer = setTimeout(() => {\r\n            setOffset((offset + 1) % (data.length + 1 - count))\r\n        }, periodRef.current)\r\n        return () => clearTimeout(timer)\r\n    }, [count, data.length, offset, paused])\r\n\r\n    useEffect(() => {\r\n        setOffset(0)\r\n    }, [itemHeight, count, data.length, animationTime, period, gap])\r\n\r\n    useEffect(() => {\r\n        if (pausedRef.current) return\r\n        bar.current?.scrollTo(0, offset * (itemHeight + gap), animationTime)\r\n    }, [offset])\r\n\r\n    function onContainerMouseEnter(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\r\n        setPaused(true)\r\n        onMouseEnter?.(e)\r\n    }\r\n\r\n    function onContainerMouseLeave(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\r\n        setPaused(false)\r\n        onMouseLeave?.(e)\r\n    }\r\n\r\n    return (\r\n        <Scroll scrollbar={bar} options={options} style={{ height, ...style }} onMouseEnter={onContainerMouseEnter} onMouseLeave={onContainerMouseLeave} {...rest}>\r\n            {data.map((item, index, arr) => (\r\n                <div key={keyExtractor?.(item, index, arr) ?? index} style={{ height: itemHeight, marginTop: index === 0 ? 0 : `${gap}px` }}>\r\n                    {render(item, index, arr)}\r\n                </div>\r\n            ))}\r\n        </Scroll>\r\n    )\r\n}\r\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAsG;AAGtG,oBAAsC;AA8B/B,SAAS,WAAc,OAA6B;AACvD,QAAM,EAAE,OAAO,YAAY,OAAO,MAAM,QAAQ,eAAe,QAAQ,cAAc,SAAS,cAAc,cAAc,MAAM,GAAG,GAAG,KAAK,IAAI;AAE/I,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,CAAC;AAEtC,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,KAAK;AAE1C,QAAM,gBAAY,qBAAO,MAAM;AAE/B,YAAU,UAAU;AAEpB,QAAM,gBAAY,qBAAO,MAAM;AAE/B,YAAU,UAAU;AAEpB,QAAM,UAAU,aAAa,OAAO,QAAQ;AAE5C,QAAM,UAAM,qBAAyB,IAAI;AAEzC,8BAAU,MAAM;AACZ,QAAI;AACJ,UAAM,WAAW,CAAC,WAAyB;AACvC,YAAM,IAAI,OAAO,OAAO;AACxB,YAAM,IAAI,KAAK,aAAa;AAC5B,UAAI;AACJ,UAAI,IAAI,KAAK,MAAM;AACf,oBAAY,KAAK,MAAM,CAAC;AAAA,MAC5B,OAAO;AACH,oBAAY,KAAK,KAAK,CAAC;AAAA,MAC3B;AACA,mBAAa,KAAK;AAClB,cAAQ,WAAW,MAAM;AACrB,kBAAU,SAAS;AAAA,MACvB,GAAG,UAAU,OAAO;AAAA,IACxB;AACA,QAAI,SAAS,YAAY,QAAQ;AACjC,WAAO,MAAM;AACT,UAAI,SAAS,eAAe,QAAQ;AAAA,IACxC;AAAA,EACJ,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACZ,QAAI,KAAK,UAAU,SAAS,WAAW;AAAM;AAC7C,UAAM,QAAQ,WAAW,MAAM;AAC3B,iBAAW,SAAS,MAAM,KAAK,SAAS,IAAI,MAAM;AAAA,IACtD,GAAG,UAAU,OAAO;AACpB,WAAO,MAAM,aAAa,KAAK;AAAA,EACnC,GAAG,CAAC,OAAO,KAAK,QAAQ,QAAQ,MAAM,CAAC;AAEvC,8BAAU,MAAM;AACZ,cAAU,CAAC;AAAA,EACf,GAAG,CAAC,YAAY,OAAO,KAAK,QAAQ,eAAe,QAAQ,GAAG,CAAC;AAE/D,8BAAU,MAAM;AACZ,QAAI,UAAU;AAAS;AACvB,QAAI,SAAS,SAAS,GAAG,UAAU,aAAa,MAAM,aAAa;AAAA,EACvE,GAAG,CAAC,MAAM,CAAC;AAEX,WAAS,sBAAsB,GAAgD;AAC3E,cAAU,IAAI;AACd,mBAAe,CAAC;AAAA,EACpB;AAEA,WAAS,sBAAsB,GAAgD;AAC3E,cAAU,KAAK;AACf,mBAAe,CAAC;AAAA,EACpB;AAEA,SACI,oCAAC,wBAAO,WAAW,KAAK,SAAkB,OAAO,EAAE,QAAQ,GAAG,MAAM,GAAG,cAAc,uBAAuB,cAAc,uBAAwB,GAAG,QAChJ,KAAK,IAAI,CAAC,MAAM,OAAO,QACpB,oCAAC,SAAI,KAAK,eAAe,MAAM,OAAO,GAAG,KAAK,OAAO,OAAO,EAAE,QAAQ,YAAY,WAAW,UAAU,IAAI,IAAI,GAAG,QAAQ,KACrH,OAAO,MAAM,OAAO,GAAG,CAC5B,CACH,CACL;AAER;",
+  "names": []
+}

package/dist/cjs/components/Scroll.d.ts

@@ -0,0 +1,22 @@
+import { CSSProperties, ForwardedRef, HTMLAttributes } from "react";
+import SmoothScrollbar from "smooth-scrollbar";
+import type { ScrollbarOptions } from "smooth-scrollbar/interfaces";
+export interface ScrollOptions extends Partial<ScrollbarOptions> {
+    /** 滑块宽度 */
+    thumbWidth?: number;
+}
+export interface ScrollProps extends HTMLAttributes<HTMLDivElement> {
+    /** 滚动的配置 */
+    options?: ScrollOptions;
+    /** 容器宽度 */
+    containerClassName?: string;
+    /** 容器样式 */
+    containerStyle?: CSSProperties;
+    /** 滚动条实例 */
+    scrollbar?: ForwardedRef<SmoothScrollbar>;
+}
+/**
+ * 滚动条组件
+ * @description 注意 children 不是直接渲染在组件上的，而是渲染在内部的容器上
+ */
+export declare const Scroll: import("react").ForwardRefExoticComponent<ScrollProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Scroll.js

@@ -0,0 +1,84 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Scroll.tsx
+var Scroll_exports = {};
+__export(Scroll_exports, {
+  Scroll: () => Scroll
+});
+module.exports = __toCommonJS(Scroll_exports);
+var import_css = require("@emotion/css");
+var import_deepsea_tools = require("deepsea-tools");
+var import_react = require("react");
+var import_smooth_scrollbar = __toESM(require("smooth-scrollbar"));
+var Scroll = (0, import_react.forwardRef)((props, ref) => {
+  const { children, containerClassName, containerStyle, options, className, scrollbar, ...rest } = props;
+  const { thumbWidth, ...scrollbarOptions } = options || {};
+  const ele = (0, import_react.useRef)(null);
+  const [ins, setIns] = (0, import_react.useState)(null);
+  (0, import_react.useImperativeHandle)(ref, () => ele.current);
+  (0, import_react.useImperativeHandle)(scrollbar, () => ins, [ins]);
+  (0, import_react.useEffect)(() => {
+    const ins2 = import_smooth_scrollbar.default.init(ele.current, scrollbarOptions);
+    setIns(ins2);
+    return () => ins2.destroy();
+  }, []);
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      ref: ele,
+      className: (0, import_deepsea_tools.clsx)(
+        typeof thumbWidth === "number" && import_css.css`
+                        .scrollbar-track.scrollbar-track-x {
+                            height: ${thumbWidth}px;
+                        }
+
+                        .scrollbar-thumb.scrollbar-thumb-x {
+                            height: ${thumbWidth}px;
+                        }
+
+                        .scrollbar-track.scrollbar-track-y {
+                            width: ${thumbWidth}px;
+                        }
+
+                        .scrollbar-thumb.scrollbar-thumb-y {
+                            width: ${thumbWidth}px;
+                        }
+                    `,
+        className
+      ),
+      ...rest
+    },
+    /* @__PURE__ */ React.createElement("div", { className: containerClassName, style: containerStyle }, children)
+  );
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Scroll
+});
+//# sourceMappingURL=Scroll.js.map

package/dist/cjs/components/Scroll.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/Scroll.tsx"],
+  "sourcesContent": ["import { css } from \"@emotion/css\"\r\nimport { clsx } from \"deepsea-tools\"\r\nimport { CSSProperties, ForwardedRef, forwardRef, HTMLAttributes, useEffect, useImperativeHandle, useRef, useState } from \"react\"\r\nimport SmoothScrollbar from \"smooth-scrollbar\"\r\nimport type { ScrollbarOptions } from \"smooth-scrollbar/interfaces\"\r\n\r\nexport interface ScrollOptions extends Partial<ScrollbarOptions> {\r\n    /** 滑块宽度 */\r\n    thumbWidth?: number\r\n}\r\n\r\nexport interface ScrollProps extends HTMLAttributes<HTMLDivElement> {\r\n    /** 滚动的配置 */\r\n    options?: ScrollOptions\r\n    /** 容器宽度 */\r\n    containerClassName?: string\r\n    /** 容器样式 */\r\n    containerStyle?: CSSProperties\r\n    /** 滚动条实例 */\r\n    scrollbar?: ForwardedRef<SmoothScrollbar>\r\n}\r\n\r\n/**\r\n * 滚动条组件\r\n * @description 注意 children 不是直接渲染在组件上的，而是渲染在内部的容器上\r\n */\r\nexport const Scroll = forwardRef<HTMLDivElement, ScrollProps>((props, ref) => {\r\n    const { children, containerClassName, containerStyle, options, className, scrollbar, ...rest } = props\r\n    const { thumbWidth, ...scrollbarOptions } = options || {}\r\n    const ele = useRef<HTMLDivElement>(null)\r\n    const [ins, setIns] = useState<SmoothScrollbar | null>(null)\r\n\r\n    useImperativeHandle(ref, () => ele.current!)\r\n    useImperativeHandle(scrollbar, () => ins!, [ins])\r\n\r\n    useEffect(() => {\r\n        const ins = SmoothScrollbar.init(ele.current!, scrollbarOptions)\r\n        setIns(ins)\r\n        return () => ins.destroy()\r\n    }, [])\r\n\r\n    return (\r\n        <div\r\n            ref={ele}\r\n            className={clsx(\r\n                typeof thumbWidth === \"number\" &&\r\n                    css`\r\n                        .scrollbar-track.scrollbar-track-x {\r\n                            height: ${thumbWidth}px;\r\n                        }\r\n\r\n                        .scrollbar-thumb.scrollbar-thumb-x {\r\n                            height: ${thumbWidth}px;\r\n                        }\r\n\r\n                        .scrollbar-track.scrollbar-track-y {\r\n                            width: ${thumbWidth}px;\r\n                        }\r\n\r\n                        .scrollbar-thumb.scrollbar-thumb-y {\r\n                            width: ${thumbWidth}px;\r\n                        }\r\n                    `,\r\n                className\r\n            )}\r\n            {...rest}>\r\n            <div className={containerClassName} style={containerStyle}>\r\n                {children}\r\n            </div>\r\n        </div>\r\n    )\r\n})\r\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAAoB;AACpB,2BAAqB;AACrB,mBAA0H;AAC1H,8BAA4B;AAuBrB,IAAM,aAAS,yBAAwC,CAAC,OAAO,QAAQ;AAC1E,QAAM,EAAE,UAAU,oBAAoB,gBAAgB,SAAS,WAAW,WAAW,GAAG,KAAK,IAAI;AACjG,QAAM,EAAE,YAAY,GAAG,iBAAiB,IAAI,WAAW,CAAC;AACxD,QAAM,UAAM,qBAAuB,IAAI;AACvC,QAAM,CAAC,KAAK,MAAM,QAAI,uBAAiC,IAAI;AAE3D,wCAAoB,KAAK,MAAM,IAAI,OAAQ;AAC3C,wCAAoB,WAAW,MAAM,KAAM,CAAC,GAAG,CAAC;AAEhD,8BAAU,MAAM;AACZ,UAAMA,OAAM,wBAAAC,QAAgB,KAAK,IAAI,SAAU,gBAAgB;AAC/D,WAAOD,IAAG;AACV,WAAO,MAAMA,KAAI,QAAQ;AAAA,EAC7B,GAAG,CAAC,CAAC;AAEL,SACI;AAAA,IAAC;AAAA;AAAA,MACG,KAAK;AAAA,MACL,eAAW;AAAA,QACP,OAAO,eAAe,YAClB;AAAA;AAAA,sCAEkB;AAAA;AAAA;AAAA;AAAA,sCAIA;AAAA;AAAA;AAAA;AAAA,qCAID;AAAA;AAAA;AAAA;AAAA,qCAIA;AAAA;AAAA;AAAA,QAGrB;AAAA,MACJ;AAAA,MACC,GAAG;AAAA;AAAA,IACJ,oCAAC,SAAI,WAAW,oBAAoB,OAAO,kBACtC,QACL;AAAA,EACJ;AAER,CAAC;",
+  "names": ["ins", "SmoothScrollbar"]
+}

package/dist/cjs/index.d.ts

@@ -1,5 +1,6 @@
 import { ButtonHTMLAttributes, CSSProperties, FC, HTMLAttributes, InputHTMLAttributes, ReactNode, TextareaHTMLAttributes } from "react";
-import type { ScrollbarOptions } from "smooth-scrollbar/interfaces";
+export * from "./components/Scroll";
+export * from "./components/AutoScroll";
 export interface InputFileDataTypes {
     base64: string;
     text: string;
@@ -238,23 +239,6 @@ export interface CircleTextProps extends Omit<HTMLAttributes<HTMLSpanElement>, "
 }
 /** 环形文字 */
 export declare const CircleText: FC<CircleTextProps>;
-export interface ScrollOptions extends Partial<ScrollbarOptions> {
-    /** 滑块宽度 */
-    thumbWidth?: number;
-}
-export interface ScrollProps extends HTMLAttributes<HTMLDivElement> {
-    /** 滚动的配置 */
-    options?: ScrollOptions;
-    /** 容器宽度 */
-    containerClassName?: string;
-    /** 容器样式 */
-    containerStyle?: CSSProperties;
-}
-/**
- * 滚动条组件
- * @description 注意 children 不是直接渲染在组件上的，而是渲染在内部的容器上
- */
-export declare const Scroll: import("react").ForwardRefExoticComponent<ScrollProps & import("react").RefAttributes<HTMLDivElement>>;
 export declare const AutoSizeTextArea: import("react").ForwardRefExoticComponent<TextareaHTMLAttributes<HTMLTextAreaElement> & import("react").RefAttributes<HTMLTextAreaElement>>;
 export interface AutoFitProps extends HTMLAttributes<HTMLDivElement> {
     /** 设计稿宽度，默认 1920 */

package/dist/cjs/index.js

@@ -1,9 +1,7 @@
 "use client";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,14 +15,7 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.tsx
@@ -40,7 +31,6 @@ __export(src_exports, {
   InputFileButton: () => InputFileButton,
   LoopSwiper: () => LoopSwiper,
   Ring: () => Ring,
-  Scroll: () => Scroll,
   SeaRadar: () => SeaRadar,
   SectionRing: () => SectionRing,
   TransitionBox: () => TransitionBox,
@@ -55,8 +45,9 @@ module.exports = __toCommonJS(src_exports);
 var import_css = require("@emotion/css");
 var import_deepsea_tools = require("deepsea-tools");
 var import_react = require("react");
-var import_smooth_scrollbar = __toESM(require("smooth-scrollbar"));
 var import_xlsx = require("xlsx");
+__reExport(src_exports, require("./components/Scroll"), module.exports);
+__reExport(src_exports, require("./components/AutoScroll"), module.exports);
 async function getFileData(file, type) {
   const fileReader = new FileReader();
   switch (type) {
@@ -425,43 +416,6 @@ var CircleText = (props) => {
     words.reverse();
   return /* @__PURE__ */ React.createElement(import_react.Fragment, null, words.map((w, idx) => /* @__PURE__ */ React.createElement("span", { key: idx, style: { position: "absolute", ...style, transform: getTransform(idx), textAlign: "center", width, lineHeight: `${height}px`, height }, ...others }, w)));
 };
-var Scroll = (0, import_react.forwardRef)((props, ref) => {
-  const { children, containerClassName, containerStyle, options, className, ...others } = props;
-  const { thumbWidth, ...scrollbarOptions } = options || {};
-  const ele = (0, import_react.useRef)(null);
-  (0, import_react.useImperativeHandle)(ref, () => ele.current);
-  (0, import_react.useEffect)(() => {
-    import_smooth_scrollbar.default.init(ele.current, scrollbarOptions);
-  }, []);
-  return /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      ref: ele,
-      className: (0, import_deepsea_tools.clsx)(
-        !!thumbWidth && import_css.css`
-                        .scrollbar-track.scrollbar-track-x {
-                            height: ${thumbWidth}px;
-                        }
-
-                        .scrollbar-thumb.scrollbar-thumb-x {
-                            height: ${thumbWidth}px;
-                        }
-
-                        .scrollbar-track.scrollbar-track-y {
-                            width: ${thumbWidth}px;
-                        }
-
-                        .scrollbar-thumb.scrollbar-thumb-y {
-                            width: ${thumbWidth}px;
-                        }
-                    `,
-        className
-      ),
-      ...others
-    },
-    /* @__PURE__ */ React.createElement("div", { className: containerClassName, style: containerStyle }, children)
-  );
-});
 var AutoSizeTextArea = (0, import_react.forwardRef)((props, ref) => {
   const { style = {}, ...others } = props;
   const { height, resize, overflowY, ...otherStyle } = style;
@@ -560,7 +514,6 @@ var AutoFit = (0, import_react.forwardRef)((props, ref) => {
   InputFileButton,
   LoopSwiper,
   Ring,
-  Scroll,
   SeaRadar,
   SectionRing,
   TransitionBox,
@@ -569,6 +522,8 @@ var AutoFit = (0, import_react.forwardRef)((props, ref) => {
   exportExcel,
   getFileData,
   getGapCountAndSize,
-  getGapRange
+  getGapRange,
+  ...require("./components/Scroll"),
+  ...require("./components/AutoScroll")
 });
 //# sourceMappingURL=index.js.map