deepsea-components 5.6.0 → 5.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (92) hide show
  1. package/README.md +23 -23
  2. package/dist/cjs/components/AutoFit.js +3 -1
  3. package/dist/cjs/components/AutoFit.js.map +2 -2
  4. package/dist/cjs/components/AutoScroll.js +16 -1
  5. package/dist/cjs/components/AutoScroll.js.map +2 -2
  6. package/dist/cjs/components/AutoSizeTextarea.js.map +1 -1
  7. package/dist/cjs/components/CircleText.js +31 -2
  8. package/dist/cjs/components/CircleText.js.map +2 -2
  9. package/dist/cjs/components/CopyButton.d.ts +9 -0
  10. package/dist/cjs/components/CopyButton.js +59 -0
  11. package/dist/cjs/components/CopyButton.js.map +7 -0
  12. package/dist/cjs/components/Echart.js.map +2 -2
  13. package/dist/cjs/components/Flow.js +56 -3
  14. package/dist/cjs/components/Flow.js.map +2 -2
  15. package/dist/cjs/components/FormLabel.js.map +1 -1
  16. package/dist/cjs/components/HlsPlayer.js.map +1 -1
  17. package/dist/cjs/components/InfiniteScroll.js +15 -1
  18. package/dist/cjs/components/InfiniteScroll.js.map +2 -2
  19. package/dist/cjs/components/InputFile.js.map +1 -1
  20. package/dist/cjs/components/LoopSwiper.js +23 -2
  21. package/dist/cjs/components/LoopSwiper.js.map +2 -2
  22. package/dist/cjs/components/Ring.js +13 -1
  23. package/dist/cjs/components/Ring.js.map +2 -2
  24. package/dist/cjs/components/Scroll.js.map +2 -2
  25. package/dist/cjs/components/SectionRing.js +3 -1
  26. package/dist/cjs/components/SectionRing.js.map +2 -2
  27. package/dist/cjs/components/Skeleton.js.map +2 -2
  28. package/dist/cjs/components/Title.js.map +2 -2
  29. package/dist/cjs/components/TransitionBox.js +9 -1
  30. package/dist/cjs/components/TransitionBox.js.map +2 -2
  31. package/dist/cjs/components/TransitionNum.js.map +1 -1
  32. package/dist/cjs/components/Trapezium.js.map +1 -1
  33. package/dist/cjs/index.d.ts +1 -0
  34. package/dist/cjs/index.js +2 -0
  35. package/dist/cjs/index.js.map +2 -2
  36. package/dist/cjs/utils/getReactVersion.js.map +1 -1
  37. package/dist/cjs/utils/index.js.map +1 -1
  38. package/dist/esm/components/AutoFit.js +9 -9
  39. package/dist/esm/components/AutoFit.js.map +1 -1
  40. package/dist/esm/components/AutoScroll.js.map +1 -1
  41. package/dist/esm/components/AutoSizeTextarea.js +2 -2
  42. package/dist/esm/components/AutoSizeTextarea.js.map +1 -1
  43. package/dist/esm/components/CircleText.js.map +1 -1
  44. package/dist/esm/components/CopyButton.d.ts +9 -0
  45. package/dist/esm/components/CopyButton.js +29 -0
  46. package/dist/esm/components/CopyButton.js.map +1 -0
  47. package/dist/esm/components/Echart.js.map +1 -1
  48. package/dist/esm/components/Flow.js.map +1 -1
  49. package/dist/esm/components/FormLabel.js +2 -2
  50. package/dist/esm/components/FormLabel.js.map +1 -1
  51. package/dist/esm/components/HlsPlayer.js.map +1 -1
  52. package/dist/esm/components/InfiniteScroll.js +4 -4
  53. package/dist/esm/components/InfiniteScroll.js.map +1 -1
  54. package/dist/esm/components/InputFile.js.map +1 -1
  55. package/dist/esm/components/LoopSwiper.js.map +1 -1
  56. package/dist/esm/components/Ring.js.map +1 -1
  57. package/dist/esm/components/Scroll.js.map +1 -1
  58. package/dist/esm/components/SectionRing.js.map +1 -1
  59. package/dist/esm/components/Skeleton.js.map +1 -1
  60. package/dist/esm/components/Title.js.map +1 -1
  61. package/dist/esm/components/TransitionBox.js.map +1 -1
  62. package/dist/esm/components/TransitionNum.js.map +1 -1
  63. package/dist/esm/components/Trapezium.js.map +1 -1
  64. package/dist/esm/index.d.ts +1 -0
  65. package/dist/esm/index.js +1 -0
  66. package/dist/esm/index.js.map +1 -1
  67. package/dist/esm/utils/getReactVersion.js.map +1 -1
  68. package/dist/esm/utils/index.js.map +1 -1
  69. package/package.json +4 -2
  70. package/src/components/AutoFit.tsx +103 -101
  71. package/src/components/AutoScroll.tsx +148 -132
  72. package/src/components/AutoSizeTextarea.tsx +49 -49
  73. package/src/components/CircleText.tsx +81 -56
  74. package/src/components/CopyButton.tsx +29 -0
  75. package/src/components/Echart.tsx +67 -44
  76. package/src/components/Flow.tsx +270 -214
  77. package/src/components/FormLabel.tsx +38 -38
  78. package/src/components/HlsPlayer.tsx +34 -34
  79. package/src/components/InfiniteScroll.tsx +161 -135
  80. package/src/components/InputFile.tsx +234 -234
  81. package/src/components/LoopSwiper.tsx +125 -101
  82. package/src/components/Ring.tsx +30 -19
  83. package/src/components/Scroll.tsx +96 -95
  84. package/src/components/SectionRing.tsx +39 -36
  85. package/src/components/Skeleton.tsx +47 -46
  86. package/src/components/Title.tsx +23 -24
  87. package/src/components/TransitionBox.tsx +44 -36
  88. package/src/components/TransitionNum.tsx +54 -54
  89. package/src/components/Trapezium.tsx +59 -59
  90. package/src/index.ts +1 -0
  91. package/src/utils/getReactVersion.ts +7 -7
  92. package/src/utils/index.ts +33 -33
@@ -1 +1 @@
1
- {"version":3,"names":["css","useSize","clsx","getArray","forwardRef","useEffect","useImperativeHandle","useRef","px","transformCSSVariable","Scroll","jsx","_jsx","AutoScroll","props","ref","count","itemHeight","animation","duration","onMouseEnter","onMouseLeave","gap","containerClassName","containerStyle","children","playOnMouseEnter","scrollbar","paused","rest","bar","timeout","undefined","ele","size","pausedRef","pausedProps","current","height","range","index","scrollHeight","length","scroll","target","clearTimeout","setTimeout","scrollTo","listener","status","y","offset","scrollToBottom","Math","abs","find","item","addListener","removeListener","onContainerMouseEnter","e","onContainerMouseLeave","className","style"],"sources":["../../../src/components/AutoScroll.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { css } from \"@emotion/css\"\r\nimport { useSize } from \"ahooks\"\r\nimport { clsx, getArray } from \"deepsea-tools\"\r\nimport { CSSProperties, forwardRef, MouseEvent as ReactMouseEvent, useEffect, useImperativeHandle, useRef } from \"react\"\r\nimport Scrollbar from \"smooth-scrollbar\"\r\nimport { ScrollStatus } from \"smooth-scrollbar/interfaces/scrollbar\"\r\nimport { px, transformCSSVariable } from \"../utils\"\r\nimport { Scroll, ScrollProps } from \"./Scroll\"\r\n\r\nexport interface AutoScrollProps extends ScrollProps {\r\n /** 轮播元素的个数 */\r\n count: number\r\n\r\n /** 轮播元素的高度 */\r\n itemHeight: number\r\n\r\n /**\r\n * 轮播动画的时间,单位毫秒\r\n * @default 1000\r\n */\r\n animation?: number\r\n\r\n /**\r\n * 每个元素的停留时间,单位毫秒\r\n * @default 3000\r\n */\r\n duration?: number\r\n\r\n /**\r\n * 元素之间的间距\r\n * @default 0\r\n */\r\n gap?: number\r\n\r\n /** 容器类名 */\r\n containerClassName?: string\r\n\r\n /** 容器样式 */\r\n containerStyle?: CSSProperties\r\n\r\n /**\r\n * 在鼠标移入时是否继续播放\r\n * @default false\r\n */\r\n playOnMouseEnter?: boolean\r\n\r\n /**\r\n * 是否暂停\r\n * @default false\r\n */\r\n paused?: boolean\r\n}\r\n\r\nexport const AutoScroll = forwardRef<HTMLDivElement, AutoScrollProps>((props, ref) => {\r\n const { count, itemHeight, animation = 1000, duration = 3000, onMouseEnter, onMouseLeave, gap = 0, containerClassName, containerStyle, children, playOnMouseEnter, scrollbar, paused, ...rest } = props\r\n const bar = useRef<Scrollbar | null>(null)\r\n const timeout = useRef<NodeJS.Timeout | undefined>(undefined)\r\n const ele = useRef<HTMLDivElement>(null)\r\n const size = useSize(ele)\r\n const pausedRef = useRef(false)\r\n const pausedProps = useRef(paused)\r\n pausedProps.current = paused\r\n\r\n useImperativeHandle(ref, () => ele.current!, [])\r\n useImperativeHandle(scrollbar, () => bar.current!, [])\r\n\r\n useEffect(() => {\r\n if (playOnMouseEnter) pausedRef.current = false\r\n }, [playOnMouseEnter])\r\n\r\n useEffect(() => {\r\n if (!size || count === 0) return\r\n const { height } = size\r\n const range = getArray(count, index => (itemHeight + gap) * (index + 1) - (index === count - 1 ? gap : 0))\r\n const scrollHeight = range[range.length - 1]\r\n if (height >= scrollHeight) return\r\n function scroll(target: number) {\r\n clearTimeout(timeout.current)\r\n timeout.current = setTimeout(() => {\r\n if (pausedRef.current || pausedProps.current) return scroll(target)\r\n bar.current?.scrollTo(0, target, animation)\r\n }, duration)\r\n }\r\n scroll(range[0])\r\n function listener(status: ScrollStatus) {\r\n const { y } = status.offset\r\n const scrollToBottom = Math.abs(y + height - scrollHeight) / itemHeight <= 0.05\r\n const target = scrollToBottom ? 0 : range.find(item => item > y)!\r\n scroll(target)\r\n }\r\n bar.current?.addListener(listener)\r\n return () => {\r\n clearTimeout(timeout.current)\r\n bar.current?.removeListener(listener)\r\n bar.current?.scrollTo(0, 0)\r\n }\r\n }, [size, count, itemHeight, gap, duration, animation])\r\n\r\n function onContainerMouseEnter(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\r\n if (playOnMouseEnter) return\r\n pausedRef.current = true\r\n onMouseEnter?.(e)\r\n }\r\n\r\n function onContainerMouseLeave(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\r\n if (playOnMouseEnter) return\r\n pausedRef.current = false\r\n onMouseLeave?.(e)\r\n }\r\n\r\n return (\r\n <Scroll ref={ele} scrollbar={bar} onMouseEnter={onContainerMouseEnter} onMouseLeave={onContainerMouseLeave} {...rest}>\r\n <div\r\n className={clsx(\r\n css`\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--gap, 0);\r\n & > * {\r\n flex: none;\r\n }\r\n `,\r\n containerClassName\r\n )}\r\n style={transformCSSVariable({ gap: px(gap) }, containerStyle)}>\r\n {children}\r\n </div>\r\n </Scroll>\r\n )\r\n})\r\n"],"mappings":"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"}
1
+ {"version":3,"names":["css","useSize","clsx","getArray","forwardRef","useEffect","useImperativeHandle","useRef","px","transformCSSVariable","Scroll","jsx","_jsx","AutoScroll","props","ref","count","itemHeight","animation","duration","onMouseEnter","onMouseLeave","gap","containerClassName","containerStyle","children","playOnMouseEnter","scrollbar","paused","rest","bar","timeout","undefined","ele","size","pausedRef","pausedProps","current","height","range","index","scrollHeight","length","scroll","target","clearTimeout","setTimeout","scrollTo","listener","status","y","offset","scrollToBottom","Math","abs","find","item","addListener","removeListener","onContainerMouseEnter","e","onContainerMouseLeave","className","style"],"sources":["../../../src/components/AutoScroll.tsx"],"sourcesContent":["\"use client\"\n\nimport { css } from \"@emotion/css\"\nimport { useSize } from \"ahooks\"\nimport { clsx, getArray } from \"deepsea-tools\"\nimport { CSSProperties, forwardRef, MouseEvent as ReactMouseEvent, useEffect, useImperativeHandle, useRef } from \"react\"\nimport Scrollbar from \"smooth-scrollbar\"\nimport { ScrollStatus } from \"smooth-scrollbar/interfaces/scrollbar\"\nimport { px, transformCSSVariable } from \"../utils\"\nimport { Scroll, ScrollProps } from \"./Scroll\"\n\nexport interface AutoScrollProps extends ScrollProps {\n /** 轮播元素的个数 */\n count: number\n\n /** 轮播元素的高度 */\n itemHeight: number\n\n /**\n * 轮播动画的时间,单位毫秒\n * @default 1000\n */\n animation?: number\n\n /**\n * 每个元素的停留时间,单位毫秒\n * @default 3000\n */\n duration?: number\n\n /**\n * 元素之间的间距\n * @default 0\n */\n gap?: number\n\n /** 容器类名 */\n containerClassName?: string\n\n /** 容器样式 */\n containerStyle?: CSSProperties\n\n /**\n * 在鼠标移入时是否继续播放\n * @default false\n */\n playOnMouseEnter?: boolean\n\n /**\n * 是否暂停\n * @default false\n */\n paused?: boolean\n}\n\nexport const AutoScroll = forwardRef<HTMLDivElement, AutoScrollProps>((props, ref) => {\n const {\n count,\n itemHeight,\n animation = 1000,\n duration = 3000,\n onMouseEnter,\n onMouseLeave,\n gap = 0,\n containerClassName,\n containerStyle,\n children,\n playOnMouseEnter,\n scrollbar,\n paused,\n ...rest\n } = props\n const bar = useRef<Scrollbar | null>(null)\n const timeout = useRef<NodeJS.Timeout | undefined>(undefined)\n const ele = useRef<HTMLDivElement>(null)\n const size = useSize(ele)\n const pausedRef = useRef(false)\n const pausedProps = useRef(paused)\n pausedProps.current = paused\n\n useImperativeHandle(ref, () => ele.current!, [])\n useImperativeHandle(scrollbar, () => bar.current!, [])\n\n useEffect(() => {\n if (playOnMouseEnter) pausedRef.current = false\n }, [playOnMouseEnter])\n\n useEffect(() => {\n if (!size || count === 0) return\n const { height } = size\n const range = getArray(count, index => (itemHeight + gap) * (index + 1) - (index === count - 1 ? gap : 0))\n const scrollHeight = range[range.length - 1]\n if (height >= scrollHeight) return\n function scroll(target: number) {\n clearTimeout(timeout.current)\n timeout.current = setTimeout(() => {\n if (pausedRef.current || pausedProps.current) return scroll(target)\n bar.current?.scrollTo(0, target, animation)\n }, duration)\n }\n scroll(range[0])\n function listener(status: ScrollStatus) {\n const { y } = status.offset\n const scrollToBottom = Math.abs(y + height - scrollHeight) / itemHeight <= 0.05\n const target = scrollToBottom ? 0 : range.find(item => item > y)!\n scroll(target)\n }\n bar.current?.addListener(listener)\n return () => {\n clearTimeout(timeout.current)\n bar.current?.removeListener(listener)\n bar.current?.scrollTo(0, 0)\n }\n }, [size, count, itemHeight, gap, duration, animation])\n\n function onContainerMouseEnter(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\n if (playOnMouseEnter) return\n pausedRef.current = true\n onMouseEnter?.(e)\n }\n\n function onContainerMouseLeave(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\n if (playOnMouseEnter) return\n pausedRef.current = false\n onMouseLeave?.(e)\n }\n\n return (\n <Scroll ref={ele} scrollbar={bar} onMouseEnter={onContainerMouseEnter} onMouseLeave={onContainerMouseLeave} {...rest}>\n <div\n className={clsx(\n css`\n display: flex;\n flex-direction: column;\n gap: var(--gap, 0);\n & > * {\n flex: none;\n }\n `,\n containerClassName,\n )}\n style={transformCSSVariable({ gap: px(gap) }, containerStyle)}\n >\n {children}\n </div>\n </Scroll>\n )\n})\n"],"mappings":"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"}
@@ -5,8 +5,8 @@ import { clsx } from "deepsea-tools";
5
5
  import { forwardRef, useImperativeHandle, useLayoutEffect, useRef, useState } from "react";
6
6
  import { px, transformCSSVariable } from "../utils";
7
7
 
8
- /**
9
- * 自适应高度的文本域
8
+ /**
9
+ * 自适应高度的文本域
10
10
  */
11
11
  import { jsx as _jsx } from "react/jsx-runtime";
12
12
  export const AutoSizeTextArea = /*#__PURE__*/forwardRef((props, ref) => {
@@ -1 +1 @@
1
- {"version":3,"names":["css","clsx","forwardRef","useImperativeHandle","useLayoutEffect","useRef","useState","px","transformCSSVariable","jsx","_jsx","AutoSizeTextArea","props","ref","className","style","rest","height","setHeight","undefined","ele","current","textarea","resizeTextarea","scrollHeight","offsetHeight","clientHeight","addEventListener","removeEventListener"],"sources":["../../../src/components/AutoSizeTextarea.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { css } from \"@emotion/css\"\r\nimport { clsx } from \"deepsea-tools\"\r\nimport { forwardRef, TextareaHTMLAttributes, useImperativeHandle, useLayoutEffect, useRef, useState } from \"react\"\r\nimport { px, transformCSSVariable } from \"../utils\"\r\n\r\n/**\r\n * 自适应高度的文本域\r\n */\r\nexport const AutoSizeTextArea = forwardRef<HTMLTextAreaElement, TextareaHTMLAttributes<HTMLTextAreaElement>>((props, ref) => {\r\n const { className, style, ...rest } = props\r\n const [height, setHeight] = useState<string | undefined>(undefined)\r\n const ele = useRef<HTMLTextAreaElement>(null)\r\n\r\n useImperativeHandle(ref, () => ele.current!, [])\r\n\r\n useLayoutEffect(() => {\r\n const textarea = ele.current!\r\n function resizeTextarea() {\r\n setHeight(\"auto\")\r\n setHeight(px(textarea.scrollHeight + textarea.offsetHeight - textarea.clientHeight))\r\n }\r\n resizeTextarea()\r\n textarea.addEventListener(\"input\", resizeTextarea)\r\n textarea.addEventListener(\"change\", resizeTextarea)\r\n\r\n return () => {\r\n textarea.removeEventListener(\"input\", resizeTextarea)\r\n textarea.removeEventListener(\"change\", resizeTextarea)\r\n }\r\n }, [])\r\n\r\n return (\r\n <textarea\r\n ref={ele}\r\n className={clsx(\r\n css`\r\n height: var(--height);\r\n resize: none;\r\n overflow-y: hidden;\r\n `,\r\n className\r\n )}\r\n style={transformCSSVariable({ height }, style)}\r\n {...rest}\r\n />\r\n )\r\n})\r\n"],"mappings":"AAAA,YAAY;;AAEZ,SAASA,GAAG,QAAQ,cAAc;AAClC,SAASC,IAAI,QAAQ,eAAe;AACpC,SAASC,UAAU,EAA0BC,mBAAmB,EAAEC,eAAe,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAClH,SAASC,EAAE,EAAEC,oBAAoB;;AAEjC;AACA;AACA;AAFA,SAAAC,GAAA,IAAAC,IAAA;AAGA,OAAO,MAAMC,gBAAgB,gBAAGT,UAAU,CAAmE,CAACU,KAAK,EAAEC,GAAG,KAAK;EACzH,MAAM;IAAEC,SAAS;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGJ,KAAK;EAC3C,MAAM,CAACK,MAAM,EAAEC,SAAS,CAAC,GAAGZ,QAAQ,CAAqBa,SAAS,CAAC;EACnE,MAAMC,GAAG,GAAGf,MAAM,CAAsB,IAAI,CAAC;EAE7CF,mBAAmB,CAACU,GAAG,EAAE,MAAMO,GAAG,CAACC,OAAQ,EAAE,EAAE,CAAC;EAEhDjB,eAAe,CAAC,MAAM;IAClB,MAAMkB,QAAQ,GAAGF,GAAG,CAACC,OAAQ;IAC7B,SAASE,cAAcA,CAAA,EAAG;MACtBL,SAAS,CAAC,MAAM,CAAC;MACjBA,SAAS,CAACX,EAAE,CAACe,QAAQ,CAACE,YAAY,GAAGF,QAAQ,CAACG,YAAY,GAAGH,QAAQ,CAACI,YAAY,CAAC,CAAC;IACxF;IACAH,cAAc,CAAC,CAAC;IAChBD,QAAQ,CAACK,gBAAgB,CAAC,OAAO,EAAEJ,cAAc,CAAC;IAClDD,QAAQ,CAACK,gBAAgB,CAAC,QAAQ,EAAEJ,cAAc,CAAC;IAEnD,OAAO,MAAM;MACTD,QAAQ,CAACM,mBAAmB,CAAC,OAAO,EAAEL,cAAc,CAAC;MACrDD,QAAQ,CAACM,mBAAmB,CAAC,QAAQ,EAAEL,cAAc,CAAC;IAC1D,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIb,IAAA;IACIG,GAAG,EAAEO,GAAI;IACTN,SAAS,EAAEb,IAAI,CACXD,GAAI;AACpB;AACA;AACA;AACA,iBAAiB,EACDc,SACJ,CAAE;IACFC,KAAK,EAAEP,oBAAoB,CAAC;MAAES;IAAO,CAAC,EAAEF,KAAK,CAAE;IAAA,GAC3CC;EAAI,CACX,CAAC;AAEV,CAAC,CAAC"}
1
+ {"version":3,"names":["css","clsx","forwardRef","useImperativeHandle","useLayoutEffect","useRef","useState","px","transformCSSVariable","jsx","_jsx","AutoSizeTextArea","props","ref","className","style","rest","height","setHeight","undefined","ele","current","textarea","resizeTextarea","scrollHeight","offsetHeight","clientHeight","addEventListener","removeEventListener"],"sources":["../../../src/components/AutoSizeTextarea.tsx"],"sourcesContent":["\"use client\"\n\nimport { css } from \"@emotion/css\"\nimport { clsx } from \"deepsea-tools\"\nimport { forwardRef, TextareaHTMLAttributes, useImperativeHandle, useLayoutEffect, useRef, useState } from \"react\"\nimport { px, transformCSSVariable } from \"../utils\"\n\n/**\n * 自适应高度的文本域\n */\nexport const AutoSizeTextArea = forwardRef<HTMLTextAreaElement, TextareaHTMLAttributes<HTMLTextAreaElement>>((props, ref) => {\n const { className, style, ...rest } = props\n const [height, setHeight] = useState<string | undefined>(undefined)\n const ele = useRef<HTMLTextAreaElement>(null)\n\n useImperativeHandle(ref, () => ele.current!, [])\n\n useLayoutEffect(() => {\n const textarea = ele.current!\n function resizeTextarea() {\n setHeight(\"auto\")\n setHeight(px(textarea.scrollHeight + textarea.offsetHeight - textarea.clientHeight))\n }\n resizeTextarea()\n textarea.addEventListener(\"input\", resizeTextarea)\n textarea.addEventListener(\"change\", resizeTextarea)\n\n return () => {\n textarea.removeEventListener(\"input\", resizeTextarea)\n textarea.removeEventListener(\"change\", resizeTextarea)\n }\n }, [])\n\n return (\n <textarea\n ref={ele}\n className={clsx(\n css`\n height: var(--height);\n resize: none;\n overflow-y: hidden;\n `,\n className,\n )}\n style={transformCSSVariable({ height }, style)}\n {...rest}\n />\n )\n})\n"],"mappings":"AAAA,YAAY;;AAEZ,SAASA,GAAG,QAAQ,cAAc;AAClC,SAASC,IAAI,QAAQ,eAAe;AACpC,SAASC,UAAU,EAA0BC,mBAAmB,EAAEC,eAAe,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAClH,SAASC,EAAE,EAAEC,oBAAoB;;AAEjC;AACA;AACA;AAFA,SAAAC,GAAA,IAAAC,IAAA;AAGA,OAAO,MAAMC,gBAAgB,gBAAGT,UAAU,CAAmE,CAACU,KAAK,EAAEC,GAAG,KAAK;EACzH,MAAM;IAAEC,SAAS;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGJ,KAAK;EAC3C,MAAM,CAACK,MAAM,EAAEC,SAAS,CAAC,GAAGZ,QAAQ,CAAqBa,SAAS,CAAC;EACnE,MAAMC,GAAG,GAAGf,MAAM,CAAsB,IAAI,CAAC;EAE7CF,mBAAmB,CAACU,GAAG,EAAE,MAAMO,GAAG,CAACC,OAAQ,EAAE,EAAE,CAAC;EAEhDjB,eAAe,CAAC,MAAM;IAClB,MAAMkB,QAAQ,GAAGF,GAAG,CAACC,OAAQ;IAC7B,SAASE,cAAcA,CAAA,EAAG;MACtBL,SAAS,CAAC,MAAM,CAAC;MACjBA,SAAS,CAACX,EAAE,CAACe,QAAQ,CAACE,YAAY,GAAGF,QAAQ,CAACG,YAAY,GAAGH,QAAQ,CAACI,YAAY,CAAC,CAAC;IACxF;IACAH,cAAc,CAAC,CAAC;IAChBD,QAAQ,CAACK,gBAAgB,CAAC,OAAO,EAAEJ,cAAc,CAAC;IAClDD,QAAQ,CAACK,gBAAgB,CAAC,QAAQ,EAAEJ,cAAc,CAAC;IAEnD,OAAO,MAAM;MACTD,QAAQ,CAACM,mBAAmB,CAAC,OAAO,EAAEL,cAAc,CAAC;MACrDD,QAAQ,CAACM,mBAAmB,CAAC,QAAQ,EAAEL,cAAc,CAAC;IAC1D,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIb,IAAA;IACIG,GAAG,EAAEO,GAAI;IACTN,SAAS,EAAEb,IAAI,CACXD,GAAI;AACpB;AACA;AACA;AACA,iBAAiB,EACDc,SACJ,CAAE;IACFC,KAAK,EAAEP,oBAAoB,CAAC;MAAES;IAAO,CAAC,EAAEF,KAAK,CAAE;IAAA,GAC3CC;EAAI,CACX,CAAC;AAEV,CAAC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"names":["Fragment","jsx","_jsx","CircleText","props","width","height","radius","startAngel","gapAngel","align","style","direction","reverse","separator","children","rest","unitAngle","Math","atan","totalAngle","length","offsetAngle","getTransform","idx","angle","x","cos","y","sin","z","PI","words","split","map","w","position","transform","textAlign","lineHeight"],"sources":["../../../src/components/CircleText.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { FC, Fragment, HTMLAttributes } from \"react\"\r\n\r\nexport interface CircleTextProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\r\n /** 每一个方块的宽度 */\r\n width: number\r\n /** 每一个方块的高度 */\r\n height: number\r\n /** 圆弧的半径,不包含方块的高度 */\r\n radius: number\r\n /** 开始旋转的弧度,逆时针增加,0 为 x 轴方向 */\r\n startAngel?: number\r\n /** 每一个方块之间间隔的弧度 */\r\n gapAngel?: number\r\n /** 文字对齐的方式,默认居中 */\r\n align?: \"left\" | \"center\" | \"right\"\r\n /** 文字朝向圆心还是外侧,默认外侧 */\r\n direction?: \"inner\" | \"outer\"\r\n /** 是否反转文字顺序 */\r\n reverse?: boolean\r\n /** 分割文字的方法 */\r\n separator?: string | RegExp | ((text: string) => string[])\r\n /** 显示的文字 */\r\n children: string\r\n}\r\n\r\n/** 环形文字 */\r\nexport const CircleText: FC<CircleTextProps> = props => {\r\n const { width, height, radius, startAngel = 0, gapAngel = 0, align = \"center\", style, direction = \"outer\", reverse = false, separator, children, ...rest } = props\r\n const unitAngle = Math.atan(width / 2 / radius) * 2\r\n const totalAngle = (unitAngle + gapAngel) * children.length - gapAngel\r\n const offsetAngle = align === \"left\" ? 0 : align === \"right\" ? totalAngle : totalAngle / 2\r\n\r\n function getTransform(idx: number) {\r\n const angle = startAngel - idx * (unitAngle + gapAngel) + offsetAngle - unitAngle / 2\r\n const x = (radius + height / 2) * Math.cos(angle) - width / 2\r\n const y = (radius + height / 2) * Math.sin(angle) * -1 - height / 2\r\n const z = Math.PI / 2 - angle + (direction === \"inner\" ? Math.PI : 0)\r\n return `translateX(${x}px) translateY(${y}px) rotateZ(${(z / Math.PI) * 180}deg)`\r\n }\r\n\r\n const words = typeof separator === \"function\" ? separator(children) : children.split(separator ?? \"\")\r\n\r\n if (reverse) words.reverse()\r\n\r\n return (\r\n <Fragment>\r\n {words.map((w, idx) => (\r\n <span key={idx} style={{ position: \"absolute\", ...style, transform: getTransform(idx), textAlign: \"center\", width, lineHeight: `${height}px`, height: height }} {...rest}>\r\n {w}\r\n </span>\r\n ))}\r\n </Fragment>\r\n )\r\n}\r\n"],"mappings":"AAAA,YAAY;;AAEZ,SAAaA,QAAQ,QAAwB,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAyBpD;AACA,OAAO,MAAMC,UAA+B,GAAGC,KAAK,IAAI;EACpD,MAAM;IAAEC,KAAK;IAAEC,MAAM;IAAEC,MAAM;IAAEC,UAAU,GAAG,CAAC;IAAEC,QAAQ,GAAG,CAAC;IAAEC,KAAK,GAAG,QAAQ;IAAEC,KAAK;IAAEC,SAAS,GAAG,OAAO;IAAEC,OAAO,GAAG,KAAK;IAAEC,SAAS;IAAEC,QAAQ;IAAE,GAAGC;EAAK,CAAC,GAAGZ,KAAK;EAClK,MAAMa,SAAS,GAAGC,IAAI,CAACC,IAAI,CAACd,KAAK,GAAG,CAAC,GAAGE,MAAM,CAAC,GAAG,CAAC;EACnD,MAAMa,UAAU,GAAG,CAACH,SAAS,GAAGR,QAAQ,IAAIM,QAAQ,CAACM,MAAM,GAAGZ,QAAQ;EACtE,MAAMa,WAAW,GAAGZ,KAAK,KAAK,MAAM,GAAG,CAAC,GAAGA,KAAK,KAAK,OAAO,GAAGU,UAAU,GAAGA,UAAU,GAAG,CAAC;EAE1F,SAASG,YAAYA,CAACC,GAAW,EAAE;IAC/B,MAAMC,KAAK,GAAGjB,UAAU,GAAGgB,GAAG,IAAIP,SAAS,GAAGR,QAAQ,CAAC,GAAGa,WAAW,GAAGL,SAAS,GAAG,CAAC;IACrF,MAAMS,CAAC,GAAG,CAACnB,MAAM,GAAGD,MAAM,GAAG,CAAC,IAAIY,IAAI,CAACS,GAAG,CAACF,KAAK,CAAC,GAAGpB,KAAK,GAAG,CAAC;IAC7D,MAAMuB,CAAC,GAAG,CAACrB,MAAM,GAAGD,MAAM,GAAG,CAAC,IAAIY,IAAI,CAACW,GAAG,CAACJ,KAAK,CAAC,GAAG,CAAC,CAAC,GAAGnB,MAAM,GAAG,CAAC;IACnE,MAAMwB,CAAC,GAAGZ,IAAI,CAACa,EAAE,GAAG,CAAC,GAAGN,KAAK,IAAIb,SAAS,KAAK,OAAO,GAAGM,IAAI,CAACa,EAAE,GAAG,CAAC,CAAC;IACrE,OAAQ,cAAaL,CAAE,kBAAiBE,CAAE,eAAeE,CAAC,GAAGZ,IAAI,CAACa,EAAE,GAAI,GAAI,MAAK;EACrF;EAEA,MAAMC,KAAK,GAAG,OAAOlB,SAAS,KAAK,UAAU,GAAGA,SAAS,CAACC,QAAQ,CAAC,GAAGA,QAAQ,CAACkB,KAAK,CAACnB,SAAS,IAAI,EAAE,CAAC;EAErG,IAAID,OAAO,EAAEmB,KAAK,CAACnB,OAAO,CAAC,CAAC;EAE5B,oBACIX,IAAA,CAACF,QAAQ;IAAAe,QAAA,EACJiB,KAAK,CAACE,GAAG,CAAC,CAACC,CAAC,EAAEX,GAAG,kBACdtB,IAAA;MAAgBS,KAAK,EAAE;QAAEyB,QAAQ,EAAE,UAAU;QAAE,GAAGzB,KAAK;QAAE0B,SAAS,EAAEd,YAAY,CAACC,GAAG,CAAC;QAAEc,SAAS,EAAE,QAAQ;QAAEjC,KAAK;QAAEkC,UAAU,EAAG,GAAEjC,MAAO,IAAG;QAAEA,MAAM,EAAEA;MAAO,CAAE;MAAA,GAAKU,IAAI;MAAAD,QAAA,EACnKoB;IAAC,GADKX,GAEL,CACT;EAAC,CACI,CAAC;AAEnB,CAAC"}
1
+ {"version":3,"names":["Fragment","jsx","_jsx","CircleText","props","width","height","radius","startAngel","gapAngel","align","style","direction","reverse","separator","children","rest","unitAngle","Math","atan","totalAngle","length","offsetAngle","getTransform","idx","angle","x","cos","y","sin","z","PI","words","split","map","w","position","transform","textAlign","lineHeight"],"sources":["../../../src/components/CircleText.tsx"],"sourcesContent":["\"use client\"\n\nimport { FC, Fragment, HTMLAttributes } from \"react\"\n\nexport interface CircleTextProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n /** 每一个方块的宽度 */\n width: number\n /** 每一个方块的高度 */\n height: number\n /** 圆弧的半径,不包含方块的高度 */\n radius: number\n /** 开始旋转的弧度,逆时针增加,0 为 x 轴方向 */\n startAngel?: number\n /** 每一个方块之间间隔的弧度 */\n gapAngel?: number\n /** 文字对齐的方式,默认居中 */\n align?: \"left\" | \"center\" | \"right\"\n /** 文字朝向圆心还是外侧,默认外侧 */\n direction?: \"inner\" | \"outer\"\n /** 是否反转文字顺序 */\n reverse?: boolean\n /** 分割文字的方法 */\n separator?: string | RegExp | ((text: string) => string[])\n /** 显示的文字 */\n children: string\n}\n\n/** 环形文字 */\nexport const CircleText: FC<CircleTextProps> = props => {\n const {\n width,\n height,\n radius,\n startAngel = 0,\n gapAngel = 0,\n align = \"center\",\n style,\n direction = \"outer\",\n reverse = false,\n separator,\n children,\n ...rest\n } = props\n const unitAngle = Math.atan(width / 2 / radius) * 2\n const totalAngle = (unitAngle + gapAngel) * children.length - gapAngel\n const offsetAngle = align === \"left\" ? 0 : align === \"right\" ? totalAngle : totalAngle / 2\n\n function getTransform(idx: number) {\n const angle = startAngel - idx * (unitAngle + gapAngel) + offsetAngle - unitAngle / 2\n const x = (radius + height / 2) * Math.cos(angle) - width / 2\n const y = (radius + height / 2) * Math.sin(angle) * -1 - height / 2\n const z = Math.PI / 2 - angle + (direction === \"inner\" ? Math.PI : 0)\n return `translateX(${x}px) translateY(${y}px) rotateZ(${(z / Math.PI) * 180}deg)`\n }\n\n const words = typeof separator === \"function\" ? separator(children) : children.split(separator ?? \"\")\n\n if (reverse) words.reverse()\n\n return (\n <Fragment>\n {words.map((w, idx) => (\n <span\n key={idx}\n style={{\n position: \"absolute\",\n ...style,\n transform: getTransform(idx),\n textAlign: \"center\",\n width,\n lineHeight: `${height}px`,\n height: height,\n }}\n {...rest}\n >\n {w}\n </span>\n ))}\n </Fragment>\n )\n}\n"],"mappings":"AAAA,YAAY;;AAEZ,SAAaA,QAAQ,QAAwB,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAyBpD;AACA,OAAO,MAAMC,UAA+B,GAAGC,KAAK,IAAI;EACpD,MAAM;IACFC,KAAK;IACLC,MAAM;IACNC,MAAM;IACNC,UAAU,GAAG,CAAC;IACdC,QAAQ,GAAG,CAAC;IACZC,KAAK,GAAG,QAAQ;IAChBC,KAAK;IACLC,SAAS,GAAG,OAAO;IACnBC,OAAO,GAAG,KAAK;IACfC,SAAS;IACTC,QAAQ;IACR,GAAGC;EACP,CAAC,GAAGZ,KAAK;EACT,MAAMa,SAAS,GAAGC,IAAI,CAACC,IAAI,CAACd,KAAK,GAAG,CAAC,GAAGE,MAAM,CAAC,GAAG,CAAC;EACnD,MAAMa,UAAU,GAAG,CAACH,SAAS,GAAGR,QAAQ,IAAIM,QAAQ,CAACM,MAAM,GAAGZ,QAAQ;EACtE,MAAMa,WAAW,GAAGZ,KAAK,KAAK,MAAM,GAAG,CAAC,GAAGA,KAAK,KAAK,OAAO,GAAGU,UAAU,GAAGA,UAAU,GAAG,CAAC;EAE1F,SAASG,YAAYA,CAACC,GAAW,EAAE;IAC/B,MAAMC,KAAK,GAAGjB,UAAU,GAAGgB,GAAG,IAAIP,SAAS,GAAGR,QAAQ,CAAC,GAAGa,WAAW,GAAGL,SAAS,GAAG,CAAC;IACrF,MAAMS,CAAC,GAAG,CAACnB,MAAM,GAAGD,MAAM,GAAG,CAAC,IAAIY,IAAI,CAACS,GAAG,CAACF,KAAK,CAAC,GAAGpB,KAAK,GAAG,CAAC;IAC7D,MAAMuB,CAAC,GAAG,CAACrB,MAAM,GAAGD,MAAM,GAAG,CAAC,IAAIY,IAAI,CAACW,GAAG,CAACJ,KAAK,CAAC,GAAG,CAAC,CAAC,GAAGnB,MAAM,GAAG,CAAC;IACnE,MAAMwB,CAAC,GAAGZ,IAAI,CAACa,EAAE,GAAG,CAAC,GAAGN,KAAK,IAAIb,SAAS,KAAK,OAAO,GAAGM,IAAI,CAACa,EAAE,GAAG,CAAC,CAAC;IACrE,OAAQ,cAAaL,CAAE,kBAAiBE,CAAE,eAAeE,CAAC,GAAGZ,IAAI,CAACa,EAAE,GAAI,GAAI,MAAK;EACrF;EAEA,MAAMC,KAAK,GAAG,OAAOlB,SAAS,KAAK,UAAU,GAAGA,SAAS,CAACC,QAAQ,CAAC,GAAGA,QAAQ,CAACkB,KAAK,CAACnB,SAAS,IAAI,EAAE,CAAC;EAErG,IAAID,OAAO,EAAEmB,KAAK,CAACnB,OAAO,CAAC,CAAC;EAE5B,oBACIX,IAAA,CAACF,QAAQ;IAAAe,QAAA,EACJiB,KAAK,CAACE,GAAG,CAAC,CAACC,CAAC,EAAEX,GAAG,kBACdtB,IAAA;MAEIS,KAAK,EAAE;QACHyB,QAAQ,EAAE,UAAU;QACpB,GAAGzB,KAAK;QACR0B,SAAS,EAAEd,YAAY,CAACC,GAAG,CAAC;QAC5Bc,SAAS,EAAE,QAAQ;QACnBjC,KAAK;QACLkC,UAAU,EAAG,GAAEjC,MAAO,IAAG;QACzBA,MAAM,EAAEA;MACZ,CAAE;MAAA,GACEU,IAAI;MAAAD,QAAA,EAEPoB;IAAC,GAZGX,GAaH,CACT;EAAC,CACI,CAAC;AAEnB,CAAC"}
@@ -0,0 +1,9 @@
1
+ import { Event } from "clipboard";
2
+ import { ComponentProps } from "react";
3
+ export { Event } from "clipboard";
4
+ export type CopyButtonProps = ComponentProps<"button"> & {
5
+ text?: string;
6
+ onCopySuccess?: (e: Event) => void;
7
+ onCopyError?: (e: Event) => void;
8
+ };
9
+ export declare const CopyButton: import("react").ForwardRefExoticComponent<Omit<CopyButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
@@ -0,0 +1,29 @@
1
+ import { useLatest } from "ahooks";
2
+ import ClipboardJS from "clipboard";
3
+ import { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
4
+ import { jsx as _jsx } from "react/jsx-runtime";
5
+ export { Event } from "clipboard";
6
+ export const CopyButton = /*#__PURE__*/forwardRef((props, ref) => {
7
+ const {
8
+ text,
9
+ onCopySuccess: _onCoptSuccess,
10
+ onCopyError: _onCopyError,
11
+ ...rest
12
+ } = props;
13
+ const ele = useRef(null);
14
+ const onCopySuccess = useLatest(_onCoptSuccess);
15
+ const onCopyError = useLatest(_onCopyError);
16
+ useImperativeHandle(ref, () => ele.current, [ele.current]);
17
+ useEffect(() => {
18
+ const clipboard = new ClipboardJS(ele.current);
19
+ clipboard.on("success", event => onCopySuccess.current?.(event));
20
+ clipboard.on("error", event => onCopyError.current?.(event));
21
+ return () => clipboard.destroy();
22
+ }, []);
23
+ return /*#__PURE__*/_jsx("button", {
24
+ ref: ele,
25
+ ...rest,
26
+ "data-clipboard-text": text
27
+ });
28
+ });
29
+ //# sourceMappingURL=CopyButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useLatest","ClipboardJS","forwardRef","useEffect","useImperativeHandle","useRef","jsx","_jsx","Event","CopyButton","props","ref","text","onCopySuccess","_onCoptSuccess","onCopyError","_onCopyError","rest","ele","current","clipboard","on","event","destroy"],"sources":["../../../src/components/CopyButton.tsx"],"sourcesContent":["import { useLatest } from \"ahooks\"\nimport ClipboardJS, { Event } from \"clipboard\"\nimport { ComponentProps, forwardRef, useEffect, useImperativeHandle, useRef } from \"react\"\n\nexport { Event } from \"clipboard\"\n\nexport type CopyButtonProps = ComponentProps<\"button\"> & {\n text?: string\n onCopySuccess?: (e: Event) => void\n onCopyError?: (e: Event) => void\n}\n\nexport const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>((props, ref) => {\n const { text, onCopySuccess: _onCoptSuccess, onCopyError: _onCopyError, ...rest } = props\n const ele = useRef<HTMLButtonElement>(null)\n const onCopySuccess = useLatest(_onCoptSuccess)\n const onCopyError = useLatest(_onCopyError)\n\n useImperativeHandle(ref, () => ele.current!, [ele.current])\n\n useEffect(() => {\n const clipboard = new ClipboardJS(ele.current!)\n clipboard.on(\"success\", event => onCopySuccess.current?.(event))\n clipboard.on(\"error\", event => onCopyError.current?.(event))\n return () => clipboard.destroy()\n }, [])\n\n return <button ref={ele} {...rest} data-clipboard-text={text} />\n})\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,QAAQ;AAClC,OAAOC,WAAW,MAAiB,WAAW;AAC9C,SAAyBC,UAAU,EAAEC,SAAS,EAAEC,mBAAmB,EAAEC,MAAM,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAE1F,SAASC,KAAK,QAAQ,WAAW;AAQjC,OAAO,MAAMC,UAAU,gBAAGP,UAAU,CAAqC,CAACQ,KAAK,EAAEC,GAAG,KAAK;EACrF,MAAM;IAAEC,IAAI;IAAEC,aAAa,EAAEC,cAAc;IAAEC,WAAW,EAAEC,YAAY;IAAE,GAAGC;EAAK,CAAC,GAAGP,KAAK;EACzF,MAAMQ,GAAG,GAAGb,MAAM,CAAoB,IAAI,CAAC;EAC3C,MAAMQ,aAAa,GAAGb,SAAS,CAACc,cAAc,CAAC;EAC/C,MAAMC,WAAW,GAAGf,SAAS,CAACgB,YAAY,CAAC;EAE3CZ,mBAAmB,CAACO,GAAG,EAAE,MAAMO,GAAG,CAACC,OAAQ,EAAE,CAACD,GAAG,CAACC,OAAO,CAAC,CAAC;EAE3DhB,SAAS,CAAC,MAAM;IACZ,MAAMiB,SAAS,GAAG,IAAInB,WAAW,CAACiB,GAAG,CAACC,OAAQ,CAAC;IAC/CC,SAAS,CAACC,EAAE,CAAC,SAAS,EAAEC,KAAK,IAAIT,aAAa,CAACM,OAAO,GAAGG,KAAK,CAAC,CAAC;IAChEF,SAAS,CAACC,EAAE,CAAC,OAAO,EAAEC,KAAK,IAAIP,WAAW,CAACI,OAAO,GAAGG,KAAK,CAAC,CAAC;IAC5D,OAAO,MAAMF,SAAS,CAACG,OAAO,CAAC,CAAC;EACpC,CAAC,EAAE,EAAE,CAAC;EAEN,oBAAOhB,IAAA;IAAQI,GAAG,EAAEO,GAAI;IAAA,GAAKD,IAAI;IAAE,uBAAqBL;EAAK,CAAE,CAAC;AACpE,CAAC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"names":["init","forwardRef","useEffect","useImperativeHandle","useLayoutEffect","useRef","jsx","_jsx","Echart","props","ref","width","height","option","chart","rest","container","chartRef","ele","current","dispose","setOption","resize","Pie","Bar","Line"],"sources":["../../../src/components/Echart.tsx"],"sourcesContent":["import { BarSeriesOption, ComposeOption, DatasetComponentOption, ECharts, GridComponentOption, init, LineSeriesOption, PieSeriesOption, TitleComponentOption, TooltipComponentOption } from \"echarts\"\r\nimport { ComponentProps, ForwardedRef, forwardRef, ForwardRefExoticComponent, RefAttributes, useEffect, useImperativeHandle, useLayoutEffect, useRef } from \"react\"\r\n\r\nexport type PieOption = ComposeOption<PieSeriesOption | TitleComponentOption | DatasetComponentOption | GridComponentOption | TooltipComponentOption>\r\n\r\nexport type BarOption = ComposeOption<BarSeriesOption | TitleComponentOption | DatasetComponentOption | GridComponentOption | TooltipComponentOption>\r\n\r\nexport type LineOption = ComposeOption<LineSeriesOption | TitleComponentOption | DatasetComponentOption | GridComponentOption | TooltipComponentOption>\r\n\r\nexport interface EchartProps<T extends any = any> extends Omit<ComponentProps<\"div\">, \"children\"> {\r\n width: number\r\n height: number\r\n option: T\r\n chart?: ForwardedRef<ECharts>\r\n}\r\n\r\nexport type EchartComponent<T extends PieOption | BarOption | LineOption> = ForwardRefExoticComponent<Omit<EchartProps<T>, \"ref\"> & RefAttributes<HTMLDivElement>>\r\n\r\nconst Echart = forwardRef<HTMLDivElement, EchartProps>((props, ref) => {\r\n const { width, height, option, chart, ...rest } = props\r\n const container = useRef<HTMLDivElement>(null)\r\n const chartRef = useRef<ECharts | null>(null)\r\n\r\n useLayoutEffect(() => {\r\n const ele = container.current!\r\n chartRef.current = init(ele, option, { width, height })\r\n return () => chartRef.current?.dispose()\r\n }, [])\r\n\r\n useImperativeHandle(ref, () => container.current!, [])\r\n\r\n useImperativeHandle(chart, () => chartRef.current!, [])\r\n\r\n useEffect(() => {\r\n chartRef.current?.setOption(option)\r\n chartRef.current?.resize({ width, height })\r\n })\r\n\r\n return <div ref={container} {...rest} />\r\n})\r\n\r\nexport const Pie = Echart as EchartComponent<PieOption>\r\nexport const Bar = Echart as EchartComponent<BarOption>\r\nexport const Line = Echart as EchartComponent<LineOption>\r\n"],"mappings":"AAAA,SAA+FA,IAAI,QAAyF,SAAS;AACrM,SAAuCC,UAAU,EAA4CC,SAAS,EAAEC,mBAAmB,EAAEC,eAAe,EAAEC,MAAM,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAiBnK,MAAMC,MAAM,gBAAGP,UAAU,CAA8B,CAACQ,KAAK,EAAEC,GAAG,KAAK;EACnE,MAAM;IAAEC,KAAK;IAAEC,MAAM;IAAEC,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGN,KAAK;EACvD,MAAMO,SAAS,GAAGX,MAAM,CAAiB,IAAI,CAAC;EAC9C,MAAMY,QAAQ,GAAGZ,MAAM,CAAiB,IAAI,CAAC;EAE7CD,eAAe,CAAC,MAAM;IAClB,MAAMc,GAAG,GAAGF,SAAS,CAACG,OAAQ;IAC9BF,QAAQ,CAACE,OAAO,GAAGnB,IAAI,CAACkB,GAAG,EAAEL,MAAM,EAAE;MAAEF,KAAK;MAAEC;IAAO,CAAC,CAAC;IACvD,OAAO,MAAMK,QAAQ,CAACE,OAAO,EAAEC,OAAO,CAAC,CAAC;EAC5C,CAAC,EAAE,EAAE,CAAC;EAENjB,mBAAmB,CAACO,GAAG,EAAE,MAAMM,SAAS,CAACG,OAAQ,EAAE,EAAE,CAAC;EAEtDhB,mBAAmB,CAACW,KAAK,EAAE,MAAMG,QAAQ,CAACE,OAAQ,EAAE,EAAE,CAAC;EAEvDjB,SAAS,CAAC,MAAM;IACZe,QAAQ,CAACE,OAAO,EAAEE,SAAS,CAACR,MAAM,CAAC;IACnCI,QAAQ,CAACE,OAAO,EAAEG,MAAM,CAAC;MAAEX,KAAK;MAAEC;IAAO,CAAC,CAAC;EAC/C,CAAC,CAAC;EAEF,oBAAOL,IAAA;IAAKG,GAAG,EAAEM,SAAU;IAAA,GAAKD;EAAI,CAAG,CAAC;AAC5C,CAAC,CAAC;AAEF,OAAO,MAAMQ,GAAG,GAAGf,MAAoC;AACvD,OAAO,MAAMgB,GAAG,GAAGhB,MAAoC;AACvD,OAAO,MAAMiB,IAAI,GAAGjB,MAAqC"}
1
+ {"version":3,"names":["init","forwardRef","useEffect","useImperativeHandle","useLayoutEffect","useRef","jsx","_jsx","Echart","props","ref","width","height","option","chart","rest","container","chartRef","ele","current","dispose","setOption","resize","Pie","Bar","Line"],"sources":["../../../src/components/Echart.tsx"],"sourcesContent":["import {\n BarSeriesOption,\n ComposeOption,\n DatasetComponentOption,\n ECharts,\n GridComponentOption,\n init,\n LineSeriesOption,\n PieSeriesOption,\n TitleComponentOption,\n TooltipComponentOption,\n} from \"echarts\"\nimport {\n ComponentProps,\n ForwardedRef,\n forwardRef,\n ForwardRefExoticComponent,\n RefAttributes,\n useEffect,\n useImperativeHandle,\n useLayoutEffect,\n useRef,\n} from \"react\"\n\nexport type PieOption = ComposeOption<PieSeriesOption | TitleComponentOption | DatasetComponentOption | GridComponentOption | TooltipComponentOption>\n\nexport type BarOption = ComposeOption<BarSeriesOption | TitleComponentOption | DatasetComponentOption | GridComponentOption | TooltipComponentOption>\n\nexport type LineOption = ComposeOption<LineSeriesOption | TitleComponentOption | DatasetComponentOption | GridComponentOption | TooltipComponentOption>\n\nexport interface EchartProps<T extends any = any> extends Omit<ComponentProps<\"div\">, \"children\"> {\n width: number\n height: number\n option: T\n chart?: ForwardedRef<ECharts>\n}\n\nexport type EchartComponent<T extends PieOption | BarOption | LineOption> = ForwardRefExoticComponent<\n Omit<EchartProps<T>, \"ref\"> & RefAttributes<HTMLDivElement>\n>\n\nconst Echart = forwardRef<HTMLDivElement, EchartProps>((props, ref) => {\n const { width, height, option, chart, ...rest } = props\n const container = useRef<HTMLDivElement>(null)\n const chartRef = useRef<ECharts | null>(null)\n\n useLayoutEffect(() => {\n const ele = container.current!\n chartRef.current = init(ele, option, { width, height })\n return () => chartRef.current?.dispose()\n }, [])\n\n useImperativeHandle(ref, () => container.current!, [])\n\n useImperativeHandle(chart, () => chartRef.current!, [])\n\n useEffect(() => {\n chartRef.current?.setOption(option)\n chartRef.current?.resize({ width, height })\n })\n\n return <div ref={container} {...rest} />\n})\n\nexport const Pie = Echart as EchartComponent<PieOption>\nexport const Bar = Echart as EchartComponent<BarOption>\nexport const Line = Echart as EchartComponent<LineOption>\n"],"mappings":"AAAA,SAMIA,IAAI,QAKD,SAAS;AAChB,SAGIC,UAAU,EAGVC,SAAS,EACTC,mBAAmB,EACnBC,eAAe,EACfC,MAAM,QACH,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAmBd,MAAMC,MAAM,gBAAGP,UAAU,CAA8B,CAACQ,KAAK,EAAEC,GAAG,KAAK;EACnE,MAAM;IAAEC,KAAK;IAAEC,MAAM;IAAEC,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGN,KAAK;EACvD,MAAMO,SAAS,GAAGX,MAAM,CAAiB,IAAI,CAAC;EAC9C,MAAMY,QAAQ,GAAGZ,MAAM,CAAiB,IAAI,CAAC;EAE7CD,eAAe,CAAC,MAAM;IAClB,MAAMc,GAAG,GAAGF,SAAS,CAACG,OAAQ;IAC9BF,QAAQ,CAACE,OAAO,GAAGnB,IAAI,CAACkB,GAAG,EAAEL,MAAM,EAAE;MAAEF,KAAK;MAAEC;IAAO,CAAC,CAAC;IACvD,OAAO,MAAMK,QAAQ,CAACE,OAAO,EAAEC,OAAO,CAAC,CAAC;EAC5C,CAAC,EAAE,EAAE,CAAC;EAENjB,mBAAmB,CAACO,GAAG,EAAE,MAAMM,SAAS,CAACG,OAAQ,EAAE,EAAE,CAAC;EAEtDhB,mBAAmB,CAACW,KAAK,EAAE,MAAMG,QAAQ,CAACE,OAAQ,EAAE,EAAE,CAAC;EAEvDjB,SAAS,CAAC,MAAM;IACZe,QAAQ,CAACE,OAAO,EAAEE,SAAS,CAACR,MAAM,CAAC;IACnCI,QAAQ,CAACE,OAAO,EAAEG,MAAM,CAAC;MAAEX,KAAK;MAAEC;IAAO,CAAC,CAAC;EAC/C,CAAC,CAAC;EAEF,oBAAOL,IAAA;IAAKG,GAAG,EAAEM,SAAU;IAAA,GAAKD;EAAI,CAAG,CAAC;AAC5C,CAAC,CAAC;AAEF,OAAO,MAAMQ,GAAG,GAAGf,MAAoC;AACvD,OAAO,MAAMgB,GAAG,GAAGhB,MAAoC;AACvD,OAAO,MAAMiB,IAAI,GAAGjB,MAAqC"}
@@ -1 +1 @@
1
- {"version":3,"names":["css","useSize","clsx","useEffect","useImperativeHandle","useRef","useState","px","transformCSSVariable","jsx","_jsx","getGapRange","gap","Array","isArray","getGapCountAndSize","width","itemWidth","minGap","maxGap","count","Math","floor","averageGap","ManualFlow","props","itemHeight","columnGap","rowGap","maxRows","data","render","keyExactor","className","style","wrapperClassName","wrapperStyle","throttle","transitionDuration","onSizeChange","containerClassName","containerStyle","element","rest","minColumnGap","maxColumnGap","columnCount","columnGapSize","setGapAndCount","ele","contentRows","ceil","length","contentShownRows","min","height","getPosition","index","y","x","left","top","getHidden","current","task","timeout","setTimeout","clearTimeout","rowCount","overflow","itemCount","ref","children","map","item","arr","transition","display","Flow","size"],"sources":["../../../src/components/Flow.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { css } from \"@emotion/css\"\r\nimport { useSize } from \"ahooks\"\r\nimport { clsx } from \"deepsea-tools\"\r\nimport { CSSProperties, HTMLAttributes, Key, ReactNode, RefObject, useEffect, useImperativeHandle, useRef, useState } from \"react\"\r\nimport { px, transformCSSVariable } from \"../utils\"\r\n\r\nexport interface FlowSizeData {\r\n /** 容器宽度 */\r\n width: number\r\n /** 容器高度 */\r\n height: number\r\n /** 元素宽度 */\r\n itemWidth: number\r\n /** 元素高度 */\r\n itemHeight: number\r\n /** 列间距 */\r\n columnGap: number\r\n /** 列数 */\r\n columnCount: number\r\n /** 行间距 */\r\n rowGap: number\r\n /** 行数 */\r\n rowCount: number\r\n /** 元素格数 */\r\n itemCount: number\r\n /** 最大行数 */\r\n maxRows: number | null\r\n /** 是否有元素被隐藏 */\r\n overflow: boolean\r\n}\r\n\r\nexport interface FlowProps<T> extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\r\n /** 元素宽度 */\r\n itemWidth: number\r\n /** 元素高度 */\r\n itemHeight: number\r\n /**\r\n * 列间距\r\n * 1. 如果是数字,表示列间距是固定的\r\n * 2. 如果是 auto,表示会在尽可能放进更多列的情况下,列间距是平均的\r\n * 2. 如果是数组,表示列间距是区间的,第一个元素是最小值,第二个元素是最大值\r\n */\r\n columnGap?: number | \"auto\" | [number | \"auto\", number | \"auto\"]\r\n /** 行间距 */\r\n rowGap?: number\r\n gap?: number\r\n /** 最大行数 */\r\n maxRows?: number | null\r\n /** 源数据 */\r\n data?: T[]\r\n /** 渲染 */\r\n render: (item: T, index: number, arr: T[]) => ReactNode\r\n /** key释放器,默认为 index */\r\n keyExactor?: (item: T, index: number, arr: T[]) => Key\r\n /**\r\n * 渲染的元素由两层容器包裹,外层容器类名\r\n */\r\n wrapperClassName?: string\r\n /**\r\n * 渲染的元素由两层容器包裹,外层容器样式\r\n */\r\n wrapperStyle?: CSSProperties\r\n /**\r\n * 渲染的元素由两层容器包裹,内层容器类名\r\n */\r\n containerClassName?: string\r\n /**\r\n * 渲染的元素由两层容器包裹,内层容器样式\r\n */\r\n containerStyle?: CSSProperties\r\n /** 节流时间,单位毫秒,默认200ms,传入 0 不节流 */\r\n throttle?: number\r\n /** 动画时间,单位毫秒,默认400ms,传入 0 不展示动画 */\r\n transitionDuration?: number\r\n /** 变化的回调函数 */\r\n onSizeChange?: (sizeData: FlowSizeData) => void\r\n element?: RefObject<HTMLDivElement>\r\n}\r\n\r\nexport function getGapRange(gap?: undefined | number | \"auto\" | (number | \"auto\")[]): [number, number | \"auto\"] {\r\n if (typeof gap === \"number\") return [gap, gap]\r\n if (Array.isArray(gap)) return [typeof gap[0] === \"number\" ? gap[0] : 0, gap[1]]\r\n return [0, \"auto\"]\r\n}\r\n\r\nexport interface GapAndCount {\r\n count: number\r\n gap: number\r\n}\r\n\r\nexport function getGapCountAndSize(width: number, itemWidth: number, minGap: number, maxGap: number | \"auto\"): GapAndCount {\r\n const count = Math.floor((width + minGap) / (itemWidth + minGap)) || 1\r\n if (count === 1) return { count, gap: 0 }\r\n const averageGap = (width - itemWidth * count) / (count - 1)\r\n if (averageGap < minGap) return { count, gap: minGap }\r\n if (maxGap !== \"auto\" && averageGap > maxGap) return { count, gap: maxGap }\r\n return { count, gap: averageGap }\r\n}\r\n\r\nexport interface ManualFlowProps<T> extends FlowProps<T> {\r\n /** 组件宽度,必须指定 */\r\n width: number\r\n}\r\n\r\n/** 手动组件,由外界指定宽度,性能更好 */\r\nexport function ManualFlow<T>(props: ManualFlowProps<T>) {\r\n let { itemWidth, itemHeight, columnGap, rowGap, maxRows, data = [], render, keyExactor, className, style, wrapperClassName, wrapperStyle, throttle, transitionDuration, onSizeChange, containerClassName, containerStyle, gap = 0, width, element, ...rest } = props\r\n rowGap ??= gap\r\n columnGap ??= gap\r\n const [minColumnGap, maxColumnGap] = getGapRange(columnGap)\r\n const [{ count: columnCount, gap: columnGapSize }, setGapAndCount] = useState(() => getGapCountAndSize(width, itemWidth, minColumnGap, maxColumnGap))\r\n const ele = useRef<HTMLDivElement>(null)\r\n const contentRows = Math.ceil(data.length / columnCount)\r\n const contentShownRows = typeof maxRows === \"number\" ? Math.min(contentRows, maxRows) : contentRows\r\n const height = contentShownRows > 0 ? contentShownRows * (itemHeight + rowGap) - rowGap : 0\r\n\r\n function getPosition(index: number) {\r\n const y = Math.floor(index / columnCount)\r\n const x = index - y * columnCount\r\n return {\r\n left: x * (itemWidth + columnGapSize),\r\n top: y * (itemHeight + rowGap!)\r\n }\r\n }\r\n\r\n function getHidden(index: number) {\r\n if (typeof maxRows !== \"number\") return false\r\n return index >= maxRows * columnCount\r\n }\r\n\r\n useImperativeHandle(element, () => ele.current!, [ele.current])\r\n\r\n useEffect(() => {\r\n function task() {\r\n setGapAndCount(getGapCountAndSize(width, itemWidth, minColumnGap, maxColumnGap))\r\n }\r\n if (throttle === 0) return task()\r\n const timeout = setTimeout(task, throttle || 200)\r\n return () => clearTimeout(timeout)\r\n }, [width, itemWidth, throttle, minColumnGap, maxColumnGap])\r\n\r\n useEffect(() => {\r\n onSizeChange?.({ width, height, itemWidth, itemHeight, columnGap: columnGapSize, columnCount, rowGap: rowGap!, rowCount: contentShownRows, overflow: data.length > contentShownRows * columnCount, itemCount: data.length, maxRows: maxRows ?? null })\r\n }, [width, height, columnGapSize, columnCount, rowGap, contentShownRows, data.length, itemWidth, itemHeight, maxRows])\r\n\r\n return (\r\n <div\r\n ref={ele}\r\n className={clsx(\r\n css`\r\n position: relative;\r\n height: var(--height);\r\n overflow: hidden;\r\n `,\r\n className\r\n )}\r\n style={transformCSSVariable({ height: px(height) }, style)}\r\n {...rest}>\r\n {data.map((item, index, arr) => (\r\n <div\r\n key={keyExactor ? keyExactor(item, index, arr) : index}\r\n className={clsx(\r\n css`\r\n position: absolute;\r\n width: var(--width);\r\n height: var(--height);\r\n transition: var(--transition);\r\n left: 0;\r\n top: 0;\r\n transform: translate(var(--left), var(--top));\r\n `,\r\n wrapperClassName\r\n )}\r\n style={transformCSSVariable(\r\n {\r\n width: px(itemWidth),\r\n height: px(itemHeight),\r\n transition: transitionDuration === 0 ? \"none\" : `all ${transitionDuration || 400}ms`,\r\n left: px(getPosition(index).left),\r\n top: px(getPosition(index).top)\r\n },\r\n wrapperStyle\r\n )}>\r\n <div\r\n className={clsx(\r\n css`\r\n width: 100%;\r\n height: 100%;\r\n display: var(--display);\r\n `,\r\n containerClassName\r\n )}\r\n style={transformCSSVariable({ display: getHidden(index) ? \"none\" : \"block\" }, containerStyle)}>\r\n {render(item, index, arr)}\r\n </div>\r\n </div>\r\n ))}\r\n </div>\r\n )\r\n}\r\n\r\n/** 自适应浮动组件 */\r\nexport function Flow<T>(props: FlowProps<T>) {\r\n const { itemWidth, itemHeight, columnGap, rowGap, gap, maxRows, data, render, keyExactor, wrapperClassName, wrapperStyle, containerClassName, containerStyle, throttle, transitionDuration, onSizeChange, element, ...rest } = props\r\n const ele = useRef<HTMLDivElement>(null)\r\n const size = useSize(ele)\r\n const width = useRef(size?.width || 0)\r\n if (size && size.width !== 0) width.current = size.width\r\n useImperativeHandle(element, () => ele.current!, [ele.current])\r\n if (width.current === 0) return <div ref={ele} {...rest} />\r\n return <ManualFlow element={ele} {...props} width={width.current} />\r\n}\r\n"],"mappings":"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"}
1
+ {"version":3,"names":["css","useSize","clsx","useEffect","useImperativeHandle","useRef","useState","px","transformCSSVariable","jsx","_jsx","getGapRange","gap","Array","isArray","getGapCountAndSize","width","itemWidth","minGap","maxGap","count","Math","floor","averageGap","ManualFlow","props","itemHeight","columnGap","rowGap","maxRows","data","render","keyExactor","className","style","wrapperClassName","wrapperStyle","throttle","transitionDuration","onSizeChange","containerClassName","containerStyle","element","rest","minColumnGap","maxColumnGap","columnCount","columnGapSize","setGapAndCount","ele","contentRows","ceil","length","contentShownRows","min","height","getPosition","index","y","x","left","top","getHidden","current","task","timeout","setTimeout","clearTimeout","rowCount","overflow","itemCount","ref","children","map","item","arr","transition","display","Flow","size"],"sources":["../../../src/components/Flow.tsx"],"sourcesContent":["\"use client\"\n\nimport { css } from \"@emotion/css\"\nimport { useSize } from \"ahooks\"\nimport { clsx } from \"deepsea-tools\"\nimport { CSSProperties, HTMLAttributes, Key, ReactNode, RefObject, useEffect, useImperativeHandle, useRef, useState } from \"react\"\nimport { px, transformCSSVariable } from \"../utils\"\n\nexport interface FlowSizeData {\n /** 容器宽度 */\n width: number\n /** 容器高度 */\n height: number\n /** 元素宽度 */\n itemWidth: number\n /** 元素高度 */\n itemHeight: number\n /** 列间距 */\n columnGap: number\n /** 列数 */\n columnCount: number\n /** 行间距 */\n rowGap: number\n /** 行数 */\n rowCount: number\n /** 元素格数 */\n itemCount: number\n /** 最大行数 */\n maxRows: number | null\n /** 是否有元素被隐藏 */\n overflow: boolean\n}\n\nexport interface FlowProps<T> extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n /** 元素宽度 */\n itemWidth: number\n /** 元素高度 */\n itemHeight: number\n /**\n * 列间距\n * 1. 如果是数字,表示列间距是固定的\n * 2. 如果是 auto,表示会在尽可能放进更多列的情况下,列间距是平均的\n * 2. 如果是数组,表示列间距是区间的,第一个元素是最小值,第二个元素是最大值\n */\n columnGap?: number | \"auto\" | [number | \"auto\", number | \"auto\"]\n /** 行间距 */\n rowGap?: number\n gap?: number\n /** 最大行数 */\n maxRows?: number | null\n /** 源数据 */\n data?: T[]\n /** 渲染 */\n render: (item: T, index: number, arr: T[]) => ReactNode\n /** key释放器,默认为 index */\n keyExactor?: (item: T, index: number, arr: T[]) => Key\n /**\n * 渲染的元素由两层容器包裹,外层容器类名\n */\n wrapperClassName?: string\n /**\n * 渲染的元素由两层容器包裹,外层容器样式\n */\n wrapperStyle?: CSSProperties\n /**\n * 渲染的元素由两层容器包裹,内层容器类名\n */\n containerClassName?: string\n /**\n * 渲染的元素由两层容器包裹,内层容器样式\n */\n containerStyle?: CSSProperties\n /** 节流时间,单位毫秒,默认200ms,传入 0 不节流 */\n throttle?: number\n /** 动画时间,单位毫秒,默认400ms,传入 0 不展示动画 */\n transitionDuration?: number\n /** 变化的回调函数 */\n onSizeChange?: (sizeData: FlowSizeData) => void\n element?: RefObject<HTMLDivElement>\n}\n\nexport function getGapRange(gap?: undefined | number | \"auto\" | (number | \"auto\")[]): [number, number | \"auto\"] {\n if (typeof gap === \"number\") return [gap, gap]\n if (Array.isArray(gap)) return [typeof gap[0] === \"number\" ? gap[0] : 0, gap[1]]\n return [0, \"auto\"]\n}\n\nexport interface GapAndCount {\n count: number\n gap: number\n}\n\nexport function getGapCountAndSize(width: number, itemWidth: number, minGap: number, maxGap: number | \"auto\"): GapAndCount {\n const count = Math.floor((width + minGap) / (itemWidth + minGap)) || 1\n if (count === 1) return { count, gap: 0 }\n const averageGap = (width - itemWidth * count) / (count - 1)\n if (averageGap < minGap) return { count, gap: minGap }\n if (maxGap !== \"auto\" && averageGap > maxGap) return { count, gap: maxGap }\n return { count, gap: averageGap }\n}\n\nexport interface ManualFlowProps<T> extends FlowProps<T> {\n /** 组件宽度,必须指定 */\n width: number\n}\n\n/** 手动组件,由外界指定宽度,性能更好 */\nexport function ManualFlow<T>(props: ManualFlowProps<T>) {\n let {\n itemWidth,\n itemHeight,\n columnGap,\n rowGap,\n maxRows,\n data = [],\n render,\n keyExactor,\n className,\n style,\n wrapperClassName,\n wrapperStyle,\n throttle,\n transitionDuration,\n onSizeChange,\n containerClassName,\n containerStyle,\n gap = 0,\n width,\n element,\n ...rest\n } = props\n rowGap ??= gap\n columnGap ??= gap\n const [minColumnGap, maxColumnGap] = getGapRange(columnGap)\n const [{ count: columnCount, gap: columnGapSize }, setGapAndCount] = useState(() => getGapCountAndSize(width, itemWidth, minColumnGap, maxColumnGap))\n const ele = useRef<HTMLDivElement>(null)\n const contentRows = Math.ceil(data.length / columnCount)\n const contentShownRows = typeof maxRows === \"number\" ? Math.min(contentRows, maxRows) : contentRows\n const height = contentShownRows > 0 ? contentShownRows * (itemHeight + rowGap) - rowGap : 0\n\n function getPosition(index: number) {\n const y = Math.floor(index / columnCount)\n const x = index - y * columnCount\n return {\n left: x * (itemWidth + columnGapSize),\n top: y * (itemHeight + rowGap!),\n }\n }\n\n function getHidden(index: number) {\n if (typeof maxRows !== \"number\") return false\n return index >= maxRows * columnCount\n }\n\n useImperativeHandle(element, () => ele.current!, [ele.current])\n\n useEffect(() => {\n function task() {\n setGapAndCount(getGapCountAndSize(width, itemWidth, minColumnGap, maxColumnGap))\n }\n if (throttle === 0) return task()\n const timeout = setTimeout(task, throttle || 200)\n return () => clearTimeout(timeout)\n }, [width, itemWidth, throttle, minColumnGap, maxColumnGap])\n\n useEffect(() => {\n onSizeChange?.({\n width,\n height,\n itemWidth,\n itemHeight,\n columnGap: columnGapSize,\n columnCount,\n rowGap: rowGap!,\n rowCount: contentShownRows,\n overflow: data.length > contentShownRows * columnCount,\n itemCount: data.length,\n maxRows: maxRows ?? null,\n })\n }, [width, height, columnGapSize, columnCount, rowGap, contentShownRows, data.length, itemWidth, itemHeight, maxRows])\n\n return (\n <div\n ref={ele}\n className={clsx(\n css`\n position: relative;\n height: var(--height);\n overflow: hidden;\n `,\n className,\n )}\n style={transformCSSVariable({ height: px(height) }, style)}\n {...rest}\n >\n {data.map((item, index, arr) => (\n <div\n key={keyExactor ? keyExactor(item, index, arr) : index}\n className={clsx(\n css`\n position: absolute;\n width: var(--width);\n height: var(--height);\n transition: var(--transition);\n left: 0;\n top: 0;\n transform: translate(var(--left), var(--top));\n `,\n wrapperClassName,\n )}\n style={transformCSSVariable(\n {\n width: px(itemWidth),\n height: px(itemHeight),\n transition: transitionDuration === 0 ? \"none\" : `all ${transitionDuration || 400}ms`,\n left: px(getPosition(index).left),\n top: px(getPosition(index).top),\n },\n wrapperStyle,\n )}\n >\n <div\n className={clsx(\n css`\n width: 100%;\n height: 100%;\n display: var(--display);\n `,\n containerClassName,\n )}\n style={transformCSSVariable({ display: getHidden(index) ? \"none\" : \"block\" }, containerStyle)}\n >\n {render(item, index, arr)}\n </div>\n </div>\n ))}\n </div>\n )\n}\n\n/** 自适应浮动组件 */\nexport function Flow<T>(props: FlowProps<T>) {\n const {\n itemWidth,\n itemHeight,\n columnGap,\n rowGap,\n gap,\n maxRows,\n data,\n render,\n keyExactor,\n wrapperClassName,\n wrapperStyle,\n containerClassName,\n containerStyle,\n throttle,\n transitionDuration,\n onSizeChange,\n element,\n ...rest\n } = props\n const ele = useRef<HTMLDivElement>(null)\n const size = useSize(ele)\n const width = useRef(size?.width || 0)\n if (size && size.width !== 0) width.current = size.width\n useImperativeHandle(element, () => ele.current!, [ele.current])\n if (width.current === 0) return <div ref={ele} {...rest} />\n return <ManualFlow element={ele} {...props} width={width.current} />\n}\n"],"mappings":"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"}
@@ -3,8 +3,8 @@ import { clsx } from "deepsea-tools";
3
3
  import { Fragment } from "react";
4
4
  import { jsx as _jsx } from "react/jsx-runtime";
5
5
  import { jsxs as _jsxs } from "react/jsx-runtime";
6
- /**
7
- * 为 Ant Design 的 FormItem 设计的 Label 组件
6
+ /**
7
+ * 为 Ant Design 的 FormItem 设计的 Label 组件
8
8
  */
9
9
  export const FormLabel = props => {
10
10
  const {
@@ -1 +1 @@
1
- {"version":3,"names":["css","clsx","Fragment","jsx","_jsx","jsxs","_jsxs","FormLabel","props","className","style","before","width","rest","children"],"sources":["../../../src/components/FormLabel.tsx"],"sourcesContent":["import { css } from \"@emotion/css\"\r\nimport { clsx } from \"deepsea-tools\"\r\nimport { ComponentProps, FC, Fragment } from \"react\"\r\n\r\nexport type FormLabelProps = ComponentProps<\"div\"> & {\r\n /**\r\n * Label 的宽度.\r\n */\r\n width: number\r\n /**\r\n * 是否在 Label 前面添加一个空白区域,只有当前 Label 为非必选,而存在其他 Label 为必选的时候开启\r\n */\r\n before?: boolean\r\n}\r\n\r\n/**\r\n * 为 Ant Design 的 FormItem 设计的 Label 组件\r\n */\r\nexport const FormLabel: FC<FormLabelProps> = props => {\r\n const { className, style, before, width, ...rest } = props\r\n\r\n return (\r\n <Fragment>\r\n {!!before && <div style={{ width: 11 }}>&ensp;</div>}\r\n <div\r\n className={clsx(\r\n css`\r\n text-align: justify;\r\n text-align-last: justify;\r\n `,\r\n className\r\n )}\r\n style={{ width, ...style }}\r\n {...rest}\r\n />\r\n </Fragment>\r\n )\r\n}\r\n"],"mappings":"AAAA,SAASA,GAAG,QAAQ,cAAc;AAClC,SAASC,IAAI,QAAQ,eAAe;AACpC,SAA6BC,QAAQ,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAapD;AACA;AACA;AACA,OAAO,MAAMC,SAA6B,GAAGC,KAAK,IAAI;EAClD,MAAM;IAAEC,SAAS;IAAEC,KAAK;IAAEC,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGL,KAAK;EAE1D,oBACIF,KAAA,CAACJ,QAAQ;IAAAY,QAAA,GACJ,CAAC,CAACH,MAAM,iBAAIP,IAAA;MAAKM,KAAK,EAAE;QAAEE,KAAK,EAAE;MAAG,CAAE;MAAAE,QAAA,EAAC;IAAM,CAAK,CAAC,eACpDV,IAAA;MACIK,SAAS,EAAER,IAAI,CACXD,GAAI;AACxB;AACA;AACA,qBAAqB,EACDS,SACJ,CAAE;MACFC,KAAK,EAAE;QAAEE,KAAK;QAAE,GAAGF;MAAM,CAAE;MAAA,GACvBG;IAAI,CACX,CAAC;EAAA,CACI,CAAC;AAEnB,CAAC"}
1
+ {"version":3,"names":["css","clsx","Fragment","jsx","_jsx","jsxs","_jsxs","FormLabel","props","className","style","before","width","rest","children"],"sources":["../../../src/components/FormLabel.tsx"],"sourcesContent":["import { css } from \"@emotion/css\"\nimport { clsx } from \"deepsea-tools\"\nimport { ComponentProps, FC, Fragment } from \"react\"\n\nexport type FormLabelProps = ComponentProps<\"div\"> & {\n /**\n * Label 的宽度.\n */\n width: number\n /**\n * 是否在 Label 前面添加一个空白区域,只有当前 Label 为非必选,而存在其他 Label 为必选的时候开启\n */\n before?: boolean\n}\n\n/**\n * 为 Ant Design 的 FormItem 设计的 Label 组件\n */\nexport const FormLabel: FC<FormLabelProps> = props => {\n const { className, style, before, width, ...rest } = props\n\n return (\n <Fragment>\n {!!before && <div style={{ width: 11 }}>&ensp;</div>}\n <div\n className={clsx(\n css`\n text-align: justify;\n text-align-last: justify;\n `,\n className,\n )}\n style={{ width, ...style }}\n {...rest}\n />\n </Fragment>\n )\n}\n"],"mappings":"AAAA,SAASA,GAAG,QAAQ,cAAc;AAClC,SAASC,IAAI,QAAQ,eAAe;AACpC,SAA6BC,QAAQ,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAapD;AACA;AACA;AACA,OAAO,MAAMC,SAA6B,GAAGC,KAAK,IAAI;EAClD,MAAM;IAAEC,SAAS;IAAEC,KAAK;IAAEC,MAAM;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGL,KAAK;EAE1D,oBACIF,KAAA,CAACJ,QAAQ;IAAAY,QAAA,GACJ,CAAC,CAACH,MAAM,iBAAIP,IAAA;MAAKM,KAAK,EAAE;QAAEE,KAAK,EAAE;MAAG,CAAE;MAAAE,QAAA,EAAC;IAAM,CAAK,CAAC,eACpDV,IAAA;MACIK,SAAS,EAAER,IAAI,CACXD,GAAI;AACxB;AACA;AACA,qBAAqB,EACDS,SACJ,CAAE;MACFC,KAAK,EAAE;QAAEE,KAAK;QAAE,GAAGF;MAAM,CAAE;MAAA,GACvBG;IAAI,CACX,CAAC;EAAA,CACI,CAAC;AAEnB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"names":["Hls","forwardRef","useEffect","useImperativeHandle","useRef","jsx","_jsx","HlsPlayer","props","ref","src","rest","video","current","player","canPlayType","isSupported","hls","loadSource","attachMedia","destroy"],"sources":["../../../src/components/HlsPlayer.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport Hls from \"hls.js\"\r\nimport { MediaHTMLAttributes, forwardRef, useEffect, useImperativeHandle, useRef } from \"react\"\r\n\r\nexport interface HlsPlayerProps extends Omit<MediaHTMLAttributes<HTMLVideoElement>, \"src\"> {\r\n src: string\r\n}\r\n\r\nexport const HlsPlayer = forwardRef<HTMLVideoElement, HlsPlayerProps>((props, ref) => {\r\n const { src, ...rest } = props\r\n const video = useRef<HTMLVideoElement>(null)\r\n\r\n useImperativeHandle(ref, () => video.current!, [])\r\n\r\n useEffect(() => {\r\n const { current: player } = video\r\n if (!player || !src) return\r\n if (player.canPlayType(\"application/vnd.apple.mpegurl\")) {\r\n player.src = src\r\n return\r\n }\r\n if (Hls.isSupported()) {\r\n const hls = new Hls()\r\n hls.loadSource(src)\r\n hls.attachMedia(player)\r\n return () => {\r\n hls.destroy()\r\n }\r\n }\r\n }, [src])\r\n\r\n return <video ref={video} {...rest} />\r\n})\r\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,GAAG,MAAM,QAAQ;AACxB,SAA8BC,UAAU,EAAEC,SAAS,EAAEC,mBAAmB,EAAEC,MAAM,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAM/F,OAAO,MAAMC,SAAS,gBAAGN,UAAU,CAAmC,CAACO,KAAK,EAAEC,GAAG,KAAK;EAClF,MAAM;IAAEC,GAAG;IAAE,GAAGC;EAAK,CAAC,GAAGH,KAAK;EAC9B,MAAMI,KAAK,GAAGR,MAAM,CAAmB,IAAI,CAAC;EAE5CD,mBAAmB,CAACM,GAAG,EAAE,MAAMG,KAAK,CAACC,OAAQ,EAAE,EAAE,CAAC;EAElDX,SAAS,CAAC,MAAM;IACZ,MAAM;MAAEW,OAAO,EAAEC;IAAO,CAAC,GAAGF,KAAK;IACjC,IAAI,CAACE,MAAM,IAAI,CAACJ,GAAG,EAAE;IACrB,IAAII,MAAM,CAACC,WAAW,CAAC,+BAA+B,CAAC,EAAE;MACrDD,MAAM,CAACJ,GAAG,GAAGA,GAAG;MAChB;IACJ;IACA,IAAIV,GAAG,CAACgB,WAAW,CAAC,CAAC,EAAE;MACnB,MAAMC,GAAG,GAAG,IAAIjB,GAAG,CAAC,CAAC;MACrBiB,GAAG,CAACC,UAAU,CAACR,GAAG,CAAC;MACnBO,GAAG,CAACE,WAAW,CAACL,MAAM,CAAC;MACvB,OAAO,MAAM;QACTG,GAAG,CAACG,OAAO,CAAC,CAAC;MACjB,CAAC;IACL;EACJ,CAAC,EAAE,CAACV,GAAG,CAAC,CAAC;EAET,oBAAOJ,IAAA;IAAOG,GAAG,EAAEG,KAAM;IAAA,GAAKD;EAAI,CAAG,CAAC;AAC1C,CAAC,CAAC"}
1
+ {"version":3,"names":["Hls","forwardRef","useEffect","useImperativeHandle","useRef","jsx","_jsx","HlsPlayer","props","ref","src","rest","video","current","player","canPlayType","isSupported","hls","loadSource","attachMedia","destroy"],"sources":["../../../src/components/HlsPlayer.tsx"],"sourcesContent":["\"use client\"\n\nimport Hls from \"hls.js\"\nimport { MediaHTMLAttributes, forwardRef, useEffect, useImperativeHandle, useRef } from \"react\"\n\nexport interface HlsPlayerProps extends Omit<MediaHTMLAttributes<HTMLVideoElement>, \"src\"> {\n src: string\n}\n\nexport const HlsPlayer = forwardRef<HTMLVideoElement, HlsPlayerProps>((props, ref) => {\n const { src, ...rest } = props\n const video = useRef<HTMLVideoElement>(null)\n\n useImperativeHandle(ref, () => video.current!, [])\n\n useEffect(() => {\n const { current: player } = video\n if (!player || !src) return\n if (player.canPlayType(\"application/vnd.apple.mpegurl\")) {\n player.src = src\n return\n }\n if (Hls.isSupported()) {\n const hls = new Hls()\n hls.loadSource(src)\n hls.attachMedia(player)\n return () => {\n hls.destroy()\n }\n }\n }, [src])\n\n return <video ref={video} {...rest} />\n})\n"],"mappings":"AAAA,YAAY;;AAEZ,OAAOA,GAAG,MAAM,QAAQ;AACxB,SAA8BC,UAAU,EAAEC,SAAS,EAAEC,mBAAmB,EAAEC,MAAM,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAM/F,OAAO,MAAMC,SAAS,gBAAGN,UAAU,CAAmC,CAACO,KAAK,EAAEC,GAAG,KAAK;EAClF,MAAM;IAAEC,GAAG;IAAE,GAAGC;EAAK,CAAC,GAAGH,KAAK;EAC9B,MAAMI,KAAK,GAAGR,MAAM,CAAmB,IAAI,CAAC;EAE5CD,mBAAmB,CAACM,GAAG,EAAE,MAAMG,KAAK,CAACC,OAAQ,EAAE,EAAE,CAAC;EAElDX,SAAS,CAAC,MAAM;IACZ,MAAM;MAAEW,OAAO,EAAEC;IAAO,CAAC,GAAGF,KAAK;IACjC,IAAI,CAACE,MAAM,IAAI,CAACJ,GAAG,EAAE;IACrB,IAAII,MAAM,CAACC,WAAW,CAAC,+BAA+B,CAAC,EAAE;MACrDD,MAAM,CAACJ,GAAG,GAAGA,GAAG;MAChB;IACJ;IACA,IAAIV,GAAG,CAACgB,WAAW,CAAC,CAAC,EAAE;MACnB,MAAMC,GAAG,GAAG,IAAIjB,GAAG,CAAC,CAAC;MACrBiB,GAAG,CAACC,UAAU,CAACR,GAAG,CAAC;MACnBO,GAAG,CAACE,WAAW,CAACL,MAAM,CAAC;MACvB,OAAO,MAAM;QACTG,GAAG,CAACG,OAAO,CAAC,CAAC;MACjB,CAAC;IACL;EACJ,CAAC,EAAE,CAACV,GAAG,CAAC,CAAC;EAET,oBAAOJ,IAAA;IAAOG,GAAG,EAAEG,KAAM;IAAA,GAAKD;EAAI,CAAG,CAAC;AAC1C,CAAC,CAAC"}
@@ -4,10 +4,10 @@ import { clsx } from "deepsea-tools";
4
4
  import { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
5
5
  import { jsx as _jsx } from "react/jsx-runtime";
6
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
7
- /**
8
- * 无限滚动的组件
9
- * 子元素会内置的容器中被渲染两次,首尾相连,形成无限滚动的效果
10
- * 但是,如果内部检测到并没有溢出,那么不会渲染两次,并且没有动画
7
+ /**
8
+ * 无限滚动的组件
9
+ * 子元素会内置的容器中被渲染两次,首尾相连,形成无限滚动的效果
10
+ * 但是,如果内部检测到并没有溢出,那么不会渲染两次,并且没有动画
11
11
  */
12
12
  export const InfiniteScroll = /*#__PURE__*/forwardRef((props, ref) => {
13
13
  const {
@@ -1 +1 @@
1
- {"version":3,"names":["css","useSize","clsx","forwardRef","useEffect","useImperativeHandle","useRef","jsx","_jsx","jsxs","_jsxs","InfiniteScroll","props","ref","className","direction","children","containerClassName","containerStyle","gap","duration","withGap","withEqual","pauseOnHover","onMouseEnter","onMouseLeave","rest","wrapper","wrapperSize","ele","current","container","containerSize","bigger","overflow","height","width","animation","undefined","animate","transform","iterations","Infinity","cancel","enter","e","pause","leave","play","playState","style","position"],"sources":["../../../src/components/InfiniteScroll.tsx"],"sourcesContent":["import { css } from \"@emotion/css\"\r\nimport { useSize } from \"ahooks\"\r\nimport { clsx } from \"deepsea-tools\"\r\nimport { ComponentProps, CSSProperties, forwardRef, MouseEvent as ReactMouseEvent, useEffect, useImperativeHandle, useRef } from \"react\"\r\n\r\nexport type InfiniteScrollProps = ComponentProps<\"div\"> & {\r\n /**\r\n * 滚动的方向\r\n * @default \"vertical\"\r\n */\r\n direction?: \"vertical\" | \"horizontal\"\r\n /** 渲染 children 的容器的类名 */\r\n containerClassName?: string\r\n /** 渲染 children 的容器的样式 */\r\n containerStyle?: CSSProperties\r\n /**\r\n * 两个 children 容器之间的间距\r\n * @default 0\r\n */\r\n gap?: number\r\n /** 一个周期的时间,单位:毫秒 */\r\n duration: number\r\n /** 是否将 gap 的距离也加入 overflow 的计算 */\r\n withGap?: boolean\r\n /** 尺寸刚好相同时,是否视为溢出 */\r\n withEqual?: boolean\r\n /** 鼠标移入时,是否停止动画 */\r\n pauseOnHover?: boolean\r\n}\r\n\r\n/**\r\n * 无限滚动的组件\r\n * 子元素会内置的容器中被渲染两次,首尾相连,形成无限滚动的效果\r\n * 但是,如果内部检测到并没有溢出,那么不会渲染两次,并且没有动画\r\n */\r\nexport const InfiniteScroll = forwardRef<HTMLDivElement, InfiniteScrollProps>((props, ref) => {\r\n const { className, direction = \"vertical\", children, containerClassName, containerStyle, gap = 0, duration, withGap, withEqual, pauseOnHover, onMouseEnter, onMouseLeave, ...rest } = props\r\n\r\n const wrapper = useRef<HTMLDivElement>(null)\r\n const wrapperSize = useSize(wrapper)\r\n\r\n const ele = useRef<HTMLDivElement>(null)\r\n\r\n useImperativeHandle(ref, () => wrapper.current as HTMLDivElement, [wrapper.current])\r\n\r\n const container = useRef<HTMLDivElement>(null)\r\n const containerSize = useSize(container)\r\n\r\n function bigger(containerSize: number, wrapperSize: number) {\r\n return withEqual ? containerSize + (withGap ? gap : 0) >= wrapperSize : containerSize + (withGap ? gap : 0) > wrapperSize\r\n }\r\n\r\n const overflow = wrapperSize && containerSize ? (direction === \"vertical\" ? bigger(containerSize.height, wrapperSize.height) : bigger(containerSize.width, wrapperSize.width)) : false\r\n\r\n const animation = useRef<Animation | undefined>(undefined)\r\n\r\n useEffect(() => {\r\n if (!wrapperSize || !containerSize || !overflow) return\r\n animation.current = ele.current?.animate(\r\n {\r\n transform: direction === \"vertical\" ? [`translateY(0)`, `translateY(-${containerSize.height + gap}px)`] : [`translateX(0)`, `translateX(-${containerSize.width + gap}px)`]\r\n },\r\n { duration, iterations: Infinity }\r\n )\r\n return () => animation.current?.cancel()\r\n }, [wrapperSize, containerSize, overflow, direction, duration])\r\n\r\n function enter(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\r\n if (pauseOnHover) animation.current?.pause()\r\n onMouseEnter?.(e)\r\n }\r\n\r\n function leave(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\r\n if (pauseOnHover) animation.current?.play()\r\n onMouseLeave?.(e)\r\n }\r\n\r\n useEffect(() => {\r\n if (!pauseOnHover && animation.current?.playState === \"paused\") animation.current?.play()\r\n }, [animation.current, pauseOnHover])\r\n\r\n return (\r\n <div\r\n ref={wrapper}\r\n className={clsx(\r\n css`\r\n position: relative;\r\n ${direction === \"vertical\" ? \"overflow-y: hidden;\" : \"overflow-x: hidden;\"}\r\n `,\r\n className\r\n )}\r\n onMouseEnter={enter}\r\n onMouseLeave={leave}\r\n {...rest}>\r\n <div\r\n ref={ele}\r\n style={{\r\n position: \"absolute\",\r\n width: direction === \"vertical\" ? \"100%\" : containerSize && (overflow ? containerSize.width * 2 + gap : containerSize.width),\r\n height: direction === \"horizontal\" ? \"100%\" : containerSize && (overflow ? containerSize.height * 2 + gap : containerSize.width)\r\n }}>\r\n <div\r\n ref={container}\r\n className={clsx(\r\n css`\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n ${direction === \"vertical\" ? \"width: 100%;\" : \"height: 100%;\"}\r\n `,\r\n containerClassName\r\n )}\r\n style={containerStyle}>\r\n {children}\r\n </div>\r\n {overflow && (\r\n <div\r\n ref={container}\r\n className={clsx(\r\n css`\r\n position: absolute;\r\n right: 0;\r\n bottom: 0;\r\n ${direction === \"vertical\" ? \"width: 100%;\" : \"height: 100%;\"}\r\n `,\r\n containerClassName\r\n )}\r\n style={containerStyle}>\r\n {children}\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n )\r\n})\r\n"],"mappings":"AAAA,SAASA,GAAG,QAAQ,cAAc;AAClC,SAASC,OAAO,QAAQ,QAAQ;AAChC,SAASC,IAAI,QAAQ,eAAe;AACpC,SAAwCC,UAAU,EAAiCC,SAAS,EAAEC,mBAAmB,EAAEC,MAAM,QAAQ,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AA2BxI;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,cAAc,gBAAGR,UAAU,CAAsC,CAACS,KAAK,EAAEC,GAAG,KAAK;EAC1F,MAAM;IAAEC,SAAS;IAAEC,SAAS,GAAG,UAAU;IAAEC,QAAQ;IAAEC,kBAAkB;IAAEC,cAAc;IAAEC,GAAG,GAAG,CAAC;IAAEC,QAAQ;IAAEC,OAAO;IAAEC,SAAS;IAAEC,YAAY;IAAEC,YAAY;IAAEC,YAAY;IAAE,GAAGC;EAAK,CAAC,GAAGd,KAAK;EAE3L,MAAMe,OAAO,GAAGrB,MAAM,CAAiB,IAAI,CAAC;EAC5C,MAAMsB,WAAW,GAAG3B,OAAO,CAAC0B,OAAO,CAAC;EAEpC,MAAME,GAAG,GAAGvB,MAAM,CAAiB,IAAI,CAAC;EAExCD,mBAAmB,CAACQ,GAAG,EAAE,MAAMc,OAAO,CAACG,OAAyB,EAAE,CAACH,OAAO,CAACG,OAAO,CAAC,CAAC;EAEpF,MAAMC,SAAS,GAAGzB,MAAM,CAAiB,IAAI,CAAC;EAC9C,MAAM0B,aAAa,GAAG/B,OAAO,CAAC8B,SAAS,CAAC;EAExC,SAASE,MAAMA,CAACD,aAAqB,EAAEJ,WAAmB,EAAE;IACxD,OAAON,SAAS,GAAGU,aAAa,IAAIX,OAAO,GAAGF,GAAG,GAAG,CAAC,CAAC,IAAIS,WAAW,GAAGI,aAAa,IAAIX,OAAO,GAAGF,GAAG,GAAG,CAAC,CAAC,GAAGS,WAAW;EAC7H;EAEA,MAAMM,QAAQ,GAAGN,WAAW,IAAII,aAAa,GAAIjB,SAAS,KAAK,UAAU,GAAGkB,MAAM,CAACD,aAAa,CAACG,MAAM,EAAEP,WAAW,CAACO,MAAM,CAAC,GAAGF,MAAM,CAACD,aAAa,CAACI,KAAK,EAAER,WAAW,CAACQ,KAAK,CAAC,GAAI,KAAK;EAEtL,MAAMC,SAAS,GAAG/B,MAAM,CAAwBgC,SAAS,CAAC;EAE1DlC,SAAS,CAAC,MAAM;IACZ,IAAI,CAACwB,WAAW,IAAI,CAACI,aAAa,IAAI,CAACE,QAAQ,EAAE;IACjDG,SAAS,CAACP,OAAO,GAAGD,GAAG,CAACC,OAAO,EAAES,OAAO,CACpC;MACIC,SAAS,EAAEzB,SAAS,KAAK,UAAU,GAAG,CAAE,eAAc,EAAG,eAAciB,aAAa,CAACG,MAAM,GAAGhB,GAAI,KAAI,CAAC,GAAG,CAAE,eAAc,EAAG,eAAca,aAAa,CAACI,KAAK,GAAGjB,GAAI,KAAI;IAC7K,CAAC,EACD;MAAEC,QAAQ;MAAEqB,UAAU,EAAEC;IAAS,CACrC,CAAC;IACD,OAAO,MAAML,SAAS,CAACP,OAAO,EAAEa,MAAM,CAAC,CAAC;EAC5C,CAAC,EAAE,CAACf,WAAW,EAAEI,aAAa,EAAEE,QAAQ,EAAEnB,SAAS,EAAEK,QAAQ,CAAC,CAAC;EAE/D,SAASwB,KAAKA,CAACC,CAA8C,EAAE;IAC3D,IAAItB,YAAY,EAAEc,SAAS,CAACP,OAAO,EAAEgB,KAAK,CAAC,CAAC;IAC5CtB,YAAY,GAAGqB,CAAC,CAAC;EACrB;EAEA,SAASE,KAAKA,CAACF,CAA8C,EAAE;IAC3D,IAAItB,YAAY,EAAEc,SAAS,CAACP,OAAO,EAAEkB,IAAI,CAAC,CAAC;IAC3CvB,YAAY,GAAGoB,CAAC,CAAC;EACrB;EAEAzC,SAAS,CAAC,MAAM;IACZ,IAAI,CAACmB,YAAY,IAAIc,SAAS,CAACP,OAAO,EAAEmB,SAAS,KAAK,QAAQ,EAAEZ,SAAS,CAACP,OAAO,EAAEkB,IAAI,CAAC,CAAC;EAC7F,CAAC,EAAE,CAACX,SAAS,CAACP,OAAO,EAAEP,YAAY,CAAC,CAAC;EAErC,oBACIf,IAAA;IACIK,GAAG,EAAEc,OAAQ;IACbb,SAAS,EAAEZ,IAAI,CACXF,GAAI;AACpB;AACA,sBAAsBe,SAAS,KAAK,UAAU,GAAG,qBAAqB,GAAG,qBAAsB;AAC/F,iBAAiB,EACDD,SACJ,CAAE;IACFU,YAAY,EAAEoB,KAAM;IACpBnB,YAAY,EAAEsB,KAAM;IAAA,GAChBrB,IAAI;IAAAV,QAAA,eACRN,KAAA;MACIG,GAAG,EAAEgB,GAAI;MACTqB,KAAK,EAAE;QACHC,QAAQ,EAAE,UAAU;QACpBf,KAAK,EAAErB,SAAS,KAAK,UAAU,GAAG,MAAM,GAAGiB,aAAa,KAAKE,QAAQ,GAAGF,aAAa,CAACI,KAAK,GAAG,CAAC,GAAGjB,GAAG,GAAGa,aAAa,CAACI,KAAK,CAAC;QAC5HD,MAAM,EAAEpB,SAAS,KAAK,YAAY,GAAG,MAAM,GAAGiB,aAAa,KAAKE,QAAQ,GAAGF,aAAa,CAACG,MAAM,GAAG,CAAC,GAAGhB,GAAG,GAAGa,aAAa,CAACI,KAAK;MACnI,CAAE;MAAApB,QAAA,gBACFR,IAAA;QACIK,GAAG,EAAEkB,SAAU;QACfjB,SAAS,EAAEZ,IAAI,CACXF,GAAI;AAC5B;AACA;AACA;AACA,8BAA8Be,SAAS,KAAK,UAAU,GAAG,cAAc,GAAG,eAAgB;AAC1F,yBAAyB,EACDE,kBACJ,CAAE;QACFiC,KAAK,EAAEhC,cAAe;QAAAF,QAAA,EACrBA;MAAQ,CACR,CAAC,EACLkB,QAAQ,iBACL1B,IAAA;QACIK,GAAG,EAAEkB,SAAU;QACfjB,SAAS,EAAEZ,IAAI,CACXF,GAAI;AAChC;AACA;AACA;AACA,kCAAkCe,SAAS,KAAK,UAAU,GAAG,cAAc,GAAG,eAAgB;AAC9F,6BAA6B,EACDE,kBACJ,CAAE;QACFiC,KAAK,EAAEhC,cAAe;QAAAF,QAAA,EACrBA;MAAQ,CACR,CACR;IAAA,CACA;EAAC,CACL,CAAC;AAEd,CAAC,CAAC"}
1
+ {"version":3,"names":["css","useSize","clsx","forwardRef","useEffect","useImperativeHandle","useRef","jsx","_jsx","jsxs","_jsxs","InfiniteScroll","props","ref","className","direction","children","containerClassName","containerStyle","gap","duration","withGap","withEqual","pauseOnHover","onMouseEnter","onMouseLeave","rest","wrapper","wrapperSize","ele","current","container","containerSize","bigger","overflow","height","width","animation","undefined","animate","transform","iterations","Infinity","cancel","enter","e","pause","leave","play","playState","style","position"],"sources":["../../../src/components/InfiniteScroll.tsx"],"sourcesContent":["import { css } from \"@emotion/css\"\nimport { useSize } from \"ahooks\"\nimport { clsx } from \"deepsea-tools\"\nimport { ComponentProps, CSSProperties, forwardRef, MouseEvent as ReactMouseEvent, useEffect, useImperativeHandle, useRef } from \"react\"\n\nexport type InfiniteScrollProps = ComponentProps<\"div\"> & {\n /**\n * 滚动的方向\n * @default \"vertical\"\n */\n direction?: \"vertical\" | \"horizontal\"\n /** 渲染 children 的容器的类名 */\n containerClassName?: string\n /** 渲染 children 的容器的样式 */\n containerStyle?: CSSProperties\n /**\n * 两个 children 容器之间的间距\n * @default 0\n */\n gap?: number\n /** 一个周期的时间,单位:毫秒 */\n duration: number\n /** 是否将 gap 的距离也加入 overflow 的计算 */\n withGap?: boolean\n /** 尺寸刚好相同时,是否视为溢出 */\n withEqual?: boolean\n /** 鼠标移入时,是否停止动画 */\n pauseOnHover?: boolean\n}\n\n/**\n * 无限滚动的组件\n * 子元素会内置的容器中被渲染两次,首尾相连,形成无限滚动的效果\n * 但是,如果内部检测到并没有溢出,那么不会渲染两次,并且没有动画\n */\nexport const InfiniteScroll = forwardRef<HTMLDivElement, InfiniteScrollProps>((props, ref) => {\n const {\n className,\n direction = \"vertical\",\n children,\n containerClassName,\n containerStyle,\n gap = 0,\n duration,\n withGap,\n withEqual,\n pauseOnHover,\n onMouseEnter,\n onMouseLeave,\n ...rest\n } = props\n\n const wrapper = useRef<HTMLDivElement>(null)\n const wrapperSize = useSize(wrapper)\n\n const ele = useRef<HTMLDivElement>(null)\n\n useImperativeHandle(ref, () => wrapper.current as HTMLDivElement, [wrapper.current])\n\n const container = useRef<HTMLDivElement>(null)\n const containerSize = useSize(container)\n\n function bigger(containerSize: number, wrapperSize: number) {\n return withEqual ? containerSize + (withGap ? gap : 0) >= wrapperSize : containerSize + (withGap ? gap : 0) > wrapperSize\n }\n\n const overflow =\n wrapperSize && containerSize\n ? direction === \"vertical\"\n ? bigger(containerSize.height, wrapperSize.height)\n : bigger(containerSize.width, wrapperSize.width)\n : false\n\n const animation = useRef<Animation | undefined>(undefined)\n\n useEffect(() => {\n if (!wrapperSize || !containerSize || !overflow) return\n animation.current = ele.current?.animate(\n {\n transform:\n direction === \"vertical\"\n ? [`translateY(0)`, `translateY(-${containerSize.height + gap}px)`]\n : [`translateX(0)`, `translateX(-${containerSize.width + gap}px)`],\n },\n { duration, iterations: Infinity },\n )\n return () => animation.current?.cancel()\n }, [wrapperSize, containerSize, overflow, direction, duration])\n\n function enter(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\n if (pauseOnHover) animation.current?.pause()\n onMouseEnter?.(e)\n }\n\n function leave(e: ReactMouseEvent<HTMLDivElement, MouseEvent>) {\n if (pauseOnHover) animation.current?.play()\n onMouseLeave?.(e)\n }\n\n useEffect(() => {\n if (!pauseOnHover && animation.current?.playState === \"paused\") animation.current?.play()\n }, [animation.current, pauseOnHover])\n\n return (\n <div\n ref={wrapper}\n className={clsx(\n css`\n position: relative;\n ${direction === \"vertical\" ? \"overflow-y: hidden;\" : \"overflow-x: hidden;\"}\n `,\n className,\n )}\n onMouseEnter={enter}\n onMouseLeave={leave}\n {...rest}\n >\n <div\n ref={ele}\n style={{\n position: \"absolute\",\n width: direction === \"vertical\" ? \"100%\" : containerSize && (overflow ? containerSize.width * 2 + gap : containerSize.width),\n height: direction === \"horizontal\" ? \"100%\" : containerSize && (overflow ? containerSize.height * 2 + gap : containerSize.width),\n }}\n >\n <div\n ref={container}\n className={clsx(\n css`\n position: absolute;\n left: 0;\n top: 0;\n ${direction === \"vertical\" ? \"width: 100%;\" : \"height: 100%;\"}\n `,\n containerClassName,\n )}\n style={containerStyle}\n >\n {children}\n </div>\n {overflow && (\n <div\n ref={container}\n className={clsx(\n css`\n position: absolute;\n right: 0;\n bottom: 0;\n ${direction === \"vertical\" ? \"width: 100%;\" : \"height: 100%;\"}\n `,\n containerClassName,\n )}\n style={containerStyle}\n >\n {children}\n </div>\n )}\n </div>\n </div>\n )\n})\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"names":["Fragment","forwardRef","useRef","useState","read","utils","writeFile","jsx","_jsx","jsxs","_jsxs","getFileData","file","type","fileReader","FileReader","readAsArrayBuffer","readAsBinaryString","readAsDataURL","readAsText","Promise","resolve","addEventListener","result","InputFile","props","ref","multiple","onChange","disabled","inputDisabled","clearAfterChange","rest","setDisabled","onInputChange","e","input","target","files","length","Array","from","push","value","InputFileButton","onClick","_onClick","inputProps","onDrop","_onDrop","onDragOver","_onDragOver","dragFile","_disabled","style","__disabled","restInputProps","current","click","preventDefault","dataTransfer","children","display","ImportExcel","data","wb","sheet_to_json","Sheets","SheetNames","$","map","it","_","Object","keys","filter","key","forEach","String","accept","exportExcel","name","workSheet","json_to_sheet","workBook","book_new","book_append_sheet","endsWith","ExportExcel","fileName","onButtonClick"],"sources":["../../../src/components/InputFile.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { ButtonHTMLAttributes, ChangeEvent, Fragment, InputHTMLAttributes, MouseEvent as ReactMouseEvent, forwardRef, useRef, useState, DragEvent } from \"react\"\r\nimport { read, utils, writeFile } from \"xlsx\"\r\n\r\nexport interface InputFileDataTypes {\r\n base64: string\r\n text: string\r\n arrayBuffer: ArrayBuffer\r\n binary: string\r\n file: File\r\n}\r\n\r\nexport type InputFileDataType = keyof InputFileDataTypes\r\n\r\nexport interface InputFileData<T> {\r\n result: T\r\n file: File\r\n}\r\n\r\nexport type InputFileProps = (\r\n | {\r\n multiple?: false\r\n type: \"base64\" | \"text\" | \"binary\"\r\n onChange?: (data: InputFileData<string>) => void\r\n }\r\n | {\r\n multiple?: false\r\n type: \"arrayBuffer\"\r\n onChange?: (data: InputFileData<ArrayBuffer>) => void\r\n }\r\n | {\r\n multiple?: false\r\n type?: \"file\"\r\n onChange?: (data: InputFileData<File>) => void\r\n }\r\n | {\r\n multiple: true\r\n type: \"base64\" | \"text\" | \"binary\"\r\n onChange?: (data: InputFileData<string>[]) => void\r\n }\r\n | {\r\n multiple: true\r\n type: \"arrayBuffer\"\r\n onChange?: (data: InputFileData<ArrayBuffer>[]) => void\r\n }\r\n | {\r\n multiple: true\r\n type?: \"file\"\r\n onChange?: (data: InputFileData<File>[]) => void\r\n }\r\n) &\r\n Omit<InputHTMLAttributes<HTMLInputElement>, \"onChange\" | \"multiple\" | \"type\"> & {\r\n /** 是否在捕获文件后清除 input 上的文件,默认为 false,主要区别在于如果不清除,连续两次选择同样的文件不会触发 onChange 事件,如果用于 form 表单,请设置为 flase */\r\n clearAfterChange?: boolean\r\n }\r\n\r\nexport async function getFileData<T extends InputFileDataType>(file: File, type: T): Promise<InputFileDataTypes[T]> {\r\n const fileReader = new FileReader()\r\n switch (type) {\r\n case \"arrayBuffer\":\r\n fileReader.readAsArrayBuffer(file)\r\n break\r\n case \"binary\":\r\n fileReader.readAsBinaryString(file)\r\n break\r\n case \"base64\":\r\n fileReader.readAsDataURL(file)\r\n break\r\n case \"text\":\r\n fileReader.readAsText(file)\r\n break\r\n default:\r\n return file as any\r\n }\r\n return new Promise(resolve => {\r\n fileReader.addEventListener(\"load\", () => {\r\n resolve(fileReader.result as any)\r\n })\r\n })\r\n}\r\n\r\n/** 专用于读取文件的组件 */\r\nexport const InputFile = forwardRef<HTMLInputElement, InputFileProps>((props, ref) => {\r\n const { multiple = false, type = \"file\", onChange, disabled: inputDisabled, clearAfterChange, ...rest } = props\r\n const [disabled, setDisabled] = useState(false)\r\n\r\n async function onInputChange(e: ChangeEvent<HTMLInputElement>) {\r\n const input = e.target\r\n const { files } = input\r\n if (!files || files.length === 0) return\r\n setDisabled(true)\r\n try {\r\n if (multiple) {\r\n const result: any[] = []\r\n for (const file of Array.from(files)) {\r\n result.push({\r\n result: await getFileData(file, type),\r\n file\r\n })\r\n }\r\n onChange?.(result as any)\r\n } else {\r\n onChange?.({\r\n result: await getFileData(files[0], type),\r\n file: files[0]\r\n } as any)\r\n }\r\n } finally {\r\n if (clearAfterChange) input.value = \"\"\r\n setDisabled(false)\r\n }\r\n }\r\n\r\n return <input ref={ref} disabled={disabled || inputDisabled} type=\"file\" multiple={multiple} onChange={onInputChange} {...rest} />\r\n})\r\n\r\nexport type InputFileButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\r\n input: InputFileProps\r\n dragFile?: boolean\r\n}\r\n\r\n/** 专用于读取文件的 button 组件 */\r\nexport const InputFileButton = forwardRef<HTMLButtonElement, InputFileButtonProps>((props, ref) => {\r\n const { onClick: _onClick, input: inputProps, onDrop: _onDrop, onDragOver: _onDragOver, dragFile, disabled: _disabled, ...rest } = props\r\n const { style, disabled: __disabled, multiple, onChange, type = \"file\", ...restInputProps } = inputProps\r\n const [disabled, setDisabled] = useState(false)\r\n const input = useRef<HTMLInputElement>(null)\r\n\r\n function onClick(e: ReactMouseEvent<HTMLButtonElement, MouseEvent>) {\r\n input.current?.click()\r\n _onClick?.(e)\r\n }\r\n\r\n async function onDrop(e: DragEvent<HTMLButtonElement>) {\r\n _onDrop?.(e)\r\n if (disabled || !dragFile) return\r\n e.preventDefault()\r\n const { files } = e.dataTransfer\r\n if (!files || files.length === 0) return\r\n setDisabled(true)\r\n try {\r\n if (multiple) {\r\n const result: any[] = []\r\n for (const file of Array.from(files)) {\r\n result.push({\r\n result: await getFileData(file, type),\r\n file\r\n })\r\n }\r\n onChange?.(result as any)\r\n } else {\r\n onChange?.({\r\n result: await getFileData(files[0], type),\r\n file: files[0]\r\n } as any)\r\n }\r\n } finally {\r\n setDisabled(false)\r\n }\r\n }\r\n\r\n function onDragOver(e: DragEvent<HTMLButtonElement>) {\r\n _onDragOver?.(e)\r\n if (disabled || !dragFile) return\r\n e.preventDefault()\r\n }\r\n\r\n return (\r\n <Fragment>\r\n <InputFile\r\n ref={input}\r\n disabled={disabled || _disabled || __disabled}\r\n style={{ display: \"none\", ...style }}\r\n multiple={multiple as any}\r\n onChange={onChange as any}\r\n type={type as any}\r\n {...restInputProps}\r\n />\r\n <button ref={ref} type=\"button\" disabled={disabled || _disabled} onClick={onClick} onDrop={onDrop} onDragOver={onDragOver} {...rest} />\r\n </Fragment>\r\n )\r\n})\r\n\r\nexport interface ImportExcelProps extends Omit<InputFileProps, \"multiple\" | \"onChange\" | \"accept\" | \"type\"> {\r\n onChange?: (data: Record<string, string>[]) => void\r\n}\r\n\r\n/** 专门用于读取 excel 的组件 */\r\nexport const ImportExcel = forwardRef<HTMLInputElement, ImportExcelProps>((props, ref) => {\r\n const { onChange, ...rest } = props\r\n\r\n function onInputChange(data: InputFileData<ArrayBuffer>) {\r\n const wb = read(data.result)\r\n const result = utils.sheet_to_json<any>(wb.Sheets[wb.SheetNames[0]])\r\n if (typeof result === \"object\") {\r\n const $ = result.map(it => {\r\n const _: Record<string, string> = {}\r\n Object.keys(it)\r\n .filter(key => key !== \"__rowNum__\")\r\n .forEach(key => (_[key] = String(it[key])))\r\n return _\r\n })\r\n onChange?.($)\r\n }\r\n }\r\n\r\n return <InputFile ref={ref} accept=\".xlsx\" type=\"arrayBuffer\" onChange={onInputChange} {...rest} />\r\n})\r\n\r\n/** 手动导出 excel */\r\nexport function exportExcel(data: Record<string, string>[], name: string) {\r\n const workSheet = utils.json_to_sheet(data)\r\n const workBook = utils.book_new()\r\n utils.book_append_sheet(workBook, workSheet)\r\n writeFile(workBook, `${name}${name.endsWith(\".xlsx\") ? \"\" : \".xlsx\"}`)\r\n}\r\n\r\nexport interface ExportExcelProps extends ButtonHTMLAttributes<HTMLButtonElement> {\r\n data: Record<string, string>[]\r\n fileName: string\r\n}\r\n\r\n/** 导出 excel 的 button 组件 */\r\nexport const ExportExcel = forwardRef<HTMLButtonElement, ExportExcelProps>((props, ref) => {\r\n const { data, fileName, onClick, ...rest } = props\r\n\r\n function onButtonClick(e: ReactMouseEvent<HTMLButtonElement, MouseEvent>) {\r\n exportExcel(data, fileName)\r\n onClick?.(e)\r\n }\r\n\r\n return <button ref={ref} onClick={onButtonClick} {...rest} />\r\n})\r\n"],"mappings":"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"}
1
+ {"version":3,"names":["Fragment","forwardRef","useRef","useState","read","utils","writeFile","jsx","_jsx","jsxs","_jsxs","getFileData","file","type","fileReader","FileReader","readAsArrayBuffer","readAsBinaryString","readAsDataURL","readAsText","Promise","resolve","addEventListener","result","InputFile","props","ref","multiple","onChange","disabled","inputDisabled","clearAfterChange","rest","setDisabled","onInputChange","e","input","target","files","length","Array","from","push","value","InputFileButton","onClick","_onClick","inputProps","onDrop","_onDrop","onDragOver","_onDragOver","dragFile","_disabled","style","__disabled","restInputProps","current","click","preventDefault","dataTransfer","children","display","ImportExcel","data","wb","sheet_to_json","Sheets","SheetNames","$","map","it","_","Object","keys","filter","key","forEach","String","accept","exportExcel","name","workSheet","json_to_sheet","workBook","book_new","book_append_sheet","endsWith","ExportExcel","fileName","onButtonClick"],"sources":["../../../src/components/InputFile.tsx"],"sourcesContent":["\"use client\"\n\nimport { ButtonHTMLAttributes, ChangeEvent, DragEvent, Fragment, InputHTMLAttributes, MouseEvent as ReactMouseEvent, forwardRef, useRef, useState } from \"react\"\nimport { read, utils, writeFile } from \"xlsx\"\n\nexport interface InputFileDataTypes {\n base64: string\n text: string\n arrayBuffer: ArrayBuffer\n binary: string\n file: File\n}\n\nexport type InputFileDataType = keyof InputFileDataTypes\n\nexport interface InputFileData<T> {\n result: T\n file: File\n}\n\nexport type InputFileProps = (\n | {\n multiple?: false\n type: \"base64\" | \"text\" | \"binary\"\n onChange?: (data: InputFileData<string>) => void\n }\n | {\n multiple?: false\n type: \"arrayBuffer\"\n onChange?: (data: InputFileData<ArrayBuffer>) => void\n }\n | {\n multiple?: false\n type?: \"file\"\n onChange?: (data: InputFileData<File>) => void\n }\n | {\n multiple: true\n type: \"base64\" | \"text\" | \"binary\"\n onChange?: (data: InputFileData<string>[]) => void\n }\n | {\n multiple: true\n type: \"arrayBuffer\"\n onChange?: (data: InputFileData<ArrayBuffer>[]) => void\n }\n | {\n multiple: true\n type?: \"file\"\n onChange?: (data: InputFileData<File>[]) => void\n }\n) &\n Omit<InputHTMLAttributes<HTMLInputElement>, \"onChange\" | \"multiple\" | \"type\"> & {\n /** 是否在捕获文件后清除 input 上的文件,默认为 false,主要区别在于如果不清除,连续两次选择同样的文件不会触发 onChange 事件,如果用于 form 表单,请设置为 flase */\n clearAfterChange?: boolean\n }\n\nexport async function getFileData<T extends InputFileDataType>(file: File, type: T): Promise<InputFileDataTypes[T]> {\n const fileReader = new FileReader()\n switch (type) {\n case \"arrayBuffer\":\n fileReader.readAsArrayBuffer(file)\n break\n case \"binary\":\n fileReader.readAsBinaryString(file)\n break\n case \"base64\":\n fileReader.readAsDataURL(file)\n break\n case \"text\":\n fileReader.readAsText(file)\n break\n default:\n return file as any\n }\n return new Promise(resolve => {\n fileReader.addEventListener(\"load\", () => {\n resolve(fileReader.result as any)\n })\n })\n}\n\n/** 专用于读取文件的组件 */\nexport const InputFile = forwardRef<HTMLInputElement, InputFileProps>((props, ref) => {\n const { multiple = false, type = \"file\", onChange, disabled: inputDisabled, clearAfterChange, ...rest } = props\n const [disabled, setDisabled] = useState(false)\n\n async function onInputChange(e: ChangeEvent<HTMLInputElement>) {\n const input = e.target\n const { files } = input\n if (!files || files.length === 0) return\n setDisabled(true)\n try {\n if (multiple) {\n const result: any[] = []\n for (const file of Array.from(files)) {\n result.push({\n result: await getFileData(file, type),\n file,\n })\n }\n onChange?.(result as any)\n } else {\n onChange?.({\n result: await getFileData(files[0], type),\n file: files[0],\n } as any)\n }\n } finally {\n if (clearAfterChange) input.value = \"\"\n setDisabled(false)\n }\n }\n\n return <input ref={ref} disabled={disabled || inputDisabled} type=\"file\" multiple={multiple} onChange={onInputChange} {...rest} />\n})\n\nexport type InputFileButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n input: InputFileProps\n dragFile?: boolean\n}\n\n/** 专用于读取文件的 button 组件 */\nexport const InputFileButton = forwardRef<HTMLButtonElement, InputFileButtonProps>((props, ref) => {\n const { onClick: _onClick, input: inputProps, onDrop: _onDrop, onDragOver: _onDragOver, dragFile, disabled: _disabled, ...rest } = props\n const { style, disabled: __disabled, multiple, onChange, type = \"file\", ...restInputProps } = inputProps\n const [disabled, setDisabled] = useState(false)\n const input = useRef<HTMLInputElement>(null)\n\n function onClick(e: ReactMouseEvent<HTMLButtonElement, MouseEvent>) {\n input.current?.click()\n _onClick?.(e)\n }\n\n async function onDrop(e: DragEvent<HTMLButtonElement>) {\n _onDrop?.(e)\n if (disabled || !dragFile) return\n e.preventDefault()\n const { files } = e.dataTransfer\n if (!files || files.length === 0) return\n setDisabled(true)\n try {\n if (multiple) {\n const result: any[] = []\n for (const file of Array.from(files)) {\n result.push({\n result: await getFileData(file, type),\n file,\n })\n }\n onChange?.(result as any)\n } else {\n onChange?.({\n result: await getFileData(files[0], type),\n file: files[0],\n } as any)\n }\n } finally {\n setDisabled(false)\n }\n }\n\n function onDragOver(e: DragEvent<HTMLButtonElement>) {\n _onDragOver?.(e)\n if (disabled || !dragFile) return\n e.preventDefault()\n }\n\n return (\n <Fragment>\n <InputFile\n ref={input}\n disabled={disabled || _disabled || __disabled}\n style={{ display: \"none\", ...style }}\n multiple={multiple as any}\n onChange={onChange as any}\n type={type as any}\n {...restInputProps}\n />\n <button ref={ref} type=\"button\" disabled={disabled || _disabled} onClick={onClick} onDrop={onDrop} onDragOver={onDragOver} {...rest} />\n </Fragment>\n )\n})\n\nexport interface ImportExcelProps extends Omit<InputFileProps, \"multiple\" | \"onChange\" | \"accept\" | \"type\"> {\n onChange?: (data: Record<string, string>[]) => void\n}\n\n/** 专门用于读取 excel 的组件 */\nexport const ImportExcel = forwardRef<HTMLInputElement, ImportExcelProps>((props, ref) => {\n const { onChange, ...rest } = props\n\n function onInputChange(data: InputFileData<ArrayBuffer>) {\n const wb = read(data.result)\n const result = utils.sheet_to_json<any>(wb.Sheets[wb.SheetNames[0]])\n if (typeof result === \"object\") {\n const $ = result.map(it => {\n const _: Record<string, string> = {}\n Object.keys(it)\n .filter(key => key !== \"__rowNum__\")\n .forEach(key => (_[key] = String(it[key])))\n return _\n })\n onChange?.($)\n }\n }\n\n return <InputFile ref={ref} accept=\".xlsx\" type=\"arrayBuffer\" onChange={onInputChange} {...rest} />\n})\n\n/** 手动导出 excel */\nexport function exportExcel(data: Record<string, string>[], name: string) {\n const workSheet = utils.json_to_sheet(data)\n const workBook = utils.book_new()\n utils.book_append_sheet(workBook, workSheet)\n writeFile(workBook, `${name}${name.endsWith(\".xlsx\") ? \"\" : \".xlsx\"}`)\n}\n\nexport interface ExportExcelProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n data: Record<string, string>[]\n fileName: string\n}\n\n/** 导出 excel 的 button 组件 */\nexport const ExportExcel = forwardRef<HTMLButtonElement, ExportExcelProps>((props, ref) => {\n const { data, fileName, onClick, ...rest } = props\n\n function onButtonClick(e: ReactMouseEvent<HTMLButtonElement, MouseEvent>) {\n exportExcel(data, fileName)\n onClick?.(e)\n }\n\n return <button ref={ref} onClick={onButtonClick} {...rest} />\n})\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"names":["css","clsx","forwardRef","useEffect","useImperativeHandle","useRef","useState","jsx","_jsx","jsxs","_jsxs","LoopSwiper","props","ref","className","style","children","direction","period","reverse","gap","rest","wrapper","container","swiper","setSwiper","directionRef","current","flexDirection","animationName","animationDuration","animationTimingFunction","animationIterationCount","wrapperEle","containerEle","wrapperWidth","wrapperHeight","containerWidth","containerHeight","observer","ResizeObserver","entries","forEach","entry","target","contentRect","width","height","observe","display"],"sources":["../../../src/components/LoopSwiper.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { css } from \"@emotion/css\"\r\nimport { clsx } from \"deepsea-tools\"\r\nimport { CSSProperties, forwardRef, HTMLAttributes, useEffect, useImperativeHandle, useRef, useState } from \"react\"\r\n\r\nexport interface LoopSwiperProps extends HTMLAttributes<HTMLDivElement> {\r\n direction?: \"horizontal\" | \"vertical\"\r\n reverse?: boolean\r\n period: number\r\n gap?: CSSProperties[\"gap\"]\r\n}\r\n\r\n/** 循环播放组件 */\r\nexport const LoopSwiper = forwardRef<HTMLDivElement, LoopSwiperProps>((props, ref) => {\r\n const { className, style, children, direction, period, reverse, gap, ...rest } = props\r\n const wrapper = useRef<HTMLDivElement>(null)\r\n const container = useRef<HTMLDivElement>(null)\r\n const [swiper, setSwiper] = useState(false)\r\n const directionRef = useRef(direction)\r\n directionRef.current = direction\r\n const flexDirection: CSSProperties[\"flexDirection\"] = direction === \"vertical\" ? (reverse ? \"column-reverse\" : \"column\") : reverse ? \"row-reverse\" : \"row\"\r\n const animationName = swiper ? (direction === \"vertical\" ? (reverse ? \"deepsea-reverse-vertical-loop-swipe\" : \"deepsea-vertical-loop-swipe\") : reverse ? \"deepsea-reverse-horizontal-loop-swipe\" : \"deepsea-horizontal-loop-swipe\") : \"none\"\r\n const animationDuration = `${period}ms`\r\n const animationTimingFunction = \"linear\"\r\n const animationIterationCount = \"infinite\"\r\n\r\n useImperativeHandle(ref, () => wrapper.current!, [])\r\n\r\n useEffect(() => {\r\n const wrapperEle = wrapper.current!\r\n const containerEle = container.current!\r\n let wrapperWidth = 0\r\n let wrapperHeight = 0\r\n let containerWidth = 0\r\n let containerHeight = 0\r\n const observer = new ResizeObserver(entries => {\r\n entries.forEach(entry => {\r\n if (entry.target === wrapperEle) {\r\n wrapperWidth = entry.contentRect.width\r\n wrapperHeight = entry.contentRect.height\r\n } else if (entry.target === containerEle) {\r\n containerWidth = entry.contentRect.width\r\n containerHeight = entry.contentRect.height\r\n }\r\n })\r\n setSwiper(directionRef.current === \"vertical\" ? containerHeight > wrapperHeight : containerWidth > wrapperWidth)\r\n })\r\n observer.observe(wrapperEle)\r\n observer.observe(containerEle)\r\n }, [])\r\n\r\n return (\r\n <div\r\n ref={wrapper}\r\n className={clsx(\r\n css`\r\n @keyframes deepsea-horizontal-loop-swipe {\r\n from {\r\n transform: translateX(0);\r\n }\r\n to {\r\n transform: translateX(-100%);\r\n }\r\n }\r\n @keyframes deepsea-reverse-horizontal-loop-swipe {\r\n from {\r\n transform: translateX(0);\r\n }\r\n to {\r\n transform: translateX(100%);\r\n }\r\n }\r\n @keyframes deepsea-vertical-loop-swipe {\r\n from {\r\n transform: translateY(0);\r\n }\r\n to {\r\n transform: translateY(-100%);\r\n }\r\n }\r\n @keyframes deepsea-reverse-vertical-loop-swipe {\r\n from {\r\n transform: translateY(0);\r\n }\r\n to {\r\n transform: translateY(100%);\r\n }\r\n }\r\n `,\r\n className\r\n )}\r\n style={{ display: \"flex\", flexDirection, gap, ...style }}\r\n {...rest}>\r\n <div ref={container} style={{ display: \"flex\", flexDirection, gap, animationName, animationTimingFunction, animationDuration, animationIterationCount }}>\r\n {children}\r\n </div>\r\n <div style={{ display: swiper ? \"flex\" : \"none\", flexDirection, gap, animationName, animationTimingFunction, animationDuration, animationIterationCount }}>{children}</div>\r\n </div>\r\n )\r\n})\r\n"],"mappings":"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"}
1
+ {"version":3,"names":["css","clsx","forwardRef","useEffect","useImperativeHandle","useRef","useState","jsx","_jsx","jsxs","_jsxs","LoopSwiper","props","ref","className","style","children","direction","period","reverse","gap","rest","wrapper","container","swiper","setSwiper","directionRef","current","flexDirection","animationName","animationDuration","animationTimingFunction","animationIterationCount","wrapperEle","containerEle","wrapperWidth","wrapperHeight","containerWidth","containerHeight","observer","ResizeObserver","entries","forEach","entry","target","contentRect","width","height","observe","display"],"sources":["../../../src/components/LoopSwiper.tsx"],"sourcesContent":["\"use client\"\n\nimport { css } from \"@emotion/css\"\nimport { clsx } from \"deepsea-tools\"\nimport { CSSProperties, forwardRef, HTMLAttributes, useEffect, useImperativeHandle, useRef, useState } from \"react\"\n\nexport interface LoopSwiperProps extends HTMLAttributes<HTMLDivElement> {\n direction?: \"horizontal\" | \"vertical\"\n reverse?: boolean\n period: number\n gap?: CSSProperties[\"gap\"]\n}\n\n/** 循环播放组件 */\nexport const LoopSwiper = forwardRef<HTMLDivElement, LoopSwiperProps>((props, ref) => {\n const { className, style, children, direction, period, reverse, gap, ...rest } = props\n const wrapper = useRef<HTMLDivElement>(null)\n const container = useRef<HTMLDivElement>(null)\n const [swiper, setSwiper] = useState(false)\n const directionRef = useRef(direction)\n directionRef.current = direction\n const flexDirection: CSSProperties[\"flexDirection\"] = direction === \"vertical\" ? (reverse ? \"column-reverse\" : \"column\") : reverse ? \"row-reverse\" : \"row\"\n const animationName = swiper\n ? direction === \"vertical\"\n ? reverse\n ? \"deepsea-reverse-vertical-loop-swipe\"\n : \"deepsea-vertical-loop-swipe\"\n : reverse\n ? \"deepsea-reverse-horizontal-loop-swipe\"\n : \"deepsea-horizontal-loop-swipe\"\n : \"none\"\n const animationDuration = `${period}ms`\n const animationTimingFunction = \"linear\"\n const animationIterationCount = \"infinite\"\n\n useImperativeHandle(ref, () => wrapper.current!, [])\n\n useEffect(() => {\n const wrapperEle = wrapper.current!\n const containerEle = container.current!\n let wrapperWidth = 0\n let wrapperHeight = 0\n let containerWidth = 0\n let containerHeight = 0\n const observer = new ResizeObserver(entries => {\n entries.forEach(entry => {\n if (entry.target === wrapperEle) {\n wrapperWidth = entry.contentRect.width\n wrapperHeight = entry.contentRect.height\n } else if (entry.target === containerEle) {\n containerWidth = entry.contentRect.width\n containerHeight = entry.contentRect.height\n }\n })\n setSwiper(directionRef.current === \"vertical\" ? containerHeight > wrapperHeight : containerWidth > wrapperWidth)\n })\n observer.observe(wrapperEle)\n observer.observe(containerEle)\n }, [])\n\n return (\n <div\n ref={wrapper}\n className={clsx(\n css`\n @keyframes deepsea-horizontal-loop-swipe {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-100%);\n }\n }\n @keyframes deepsea-reverse-horizontal-loop-swipe {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n }\n @keyframes deepsea-vertical-loop-swipe {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(-100%);\n }\n }\n @keyframes deepsea-reverse-vertical-loop-swipe {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(100%);\n }\n }\n `,\n className,\n )}\n style={{ display: \"flex\", flexDirection, gap, ...style }}\n {...rest}\n >\n <div\n ref={container}\n style={{ display: \"flex\", flexDirection, gap, animationName, animationTimingFunction, animationDuration, animationIterationCount }}\n >\n {children}\n </div>\n <div\n style={{\n display: swiper ? \"flex\" : \"none\",\n flexDirection,\n gap,\n animationName,\n animationTimingFunction,\n animationDuration,\n animationIterationCount,\n }}\n >\n {children}\n </div>\n </div>\n )\n})\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"names":["forwardRef","jsx","_jsx","Ring","props","ref","outerWidth","innerWidth","style","rest","outerRadius","innerRadius","width","height","clipPath"],"sources":["../../../src/components/Ring.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { forwardRef, HTMLAttributes } from \"react\"\r\n\r\nexport interface RingProps extends HTMLAttributes<HTMLDivElement> {\r\n outerWidth: number\r\n innerWidth: number\r\n}\r\n\r\n/** 环形组件 */\r\nexport const Ring = forwardRef<HTMLDivElement, RingProps>((props, ref) => {\r\n const { outerWidth, innerWidth, style, ...rest } = props\r\n\r\n const outerRadius = outerWidth / 2\r\n\r\n const innerRadius = innerWidth / 2\r\n\r\n return <div ref={ref} style={{ ...style, width: `${outerWidth}px`, height: `${outerWidth}px`, clipPath: `path(\"M0,${outerRadius} a${outerRadius},${outerRadius},0,1,0,${outerWidth},0 a${outerRadius},${outerRadius},0,1,0,-${outerWidth},0 l${outerRadius - innerRadius},0 a${innerRadius},${innerRadius},0,0,1,${innerRadius * 2},0 a${innerRadius},${innerRadius},0,0,1,-${innerRadius * 2},0 Z\")` }} {...rest} />\r\n})\r\n"],"mappings":"AAAA,YAAY;;AAEZ,SAASA,UAAU,QAAwB,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAOlD;AACA,OAAO,MAAMC,IAAI,gBAAGH,UAAU,CAA4B,CAACI,KAAK,EAAEC,GAAG,KAAK;EACtE,MAAM;IAAEC,UAAU;IAAEC,UAAU;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGL,KAAK;EAExD,MAAMM,WAAW,GAAGJ,UAAU,GAAG,CAAC;EAElC,MAAMK,WAAW,GAAGJ,UAAU,GAAG,CAAC;EAElC,oBAAOL,IAAA;IAAKG,GAAG,EAAEA,GAAI;IAACG,KAAK,EAAE;MAAE,GAAGA,KAAK;MAAEI,KAAK,EAAG,GAAEN,UAAW,IAAG;MAAEO,MAAM,EAAG,GAAEP,UAAW,IAAG;MAAEQ,QAAQ,EAAG,YAAWJ,WAAY,KAAIA,WAAY,IAAGA,WAAY,UAASJ,UAAW,OAAMI,WAAY,IAAGA,WAAY,WAAUJ,UAAW,OAAMI,WAAW,GAAGC,WAAY,OAAMA,WAAY,IAAGA,WAAY,UAASA,WAAW,GAAG,CAAE,OAAMA,WAAY,IAAGA,WAAY,WAAUA,WAAW,GAAG,CAAE;IAAQ,CAAE;IAAA,GAAKF;EAAI,CAAG,CAAC;AACzZ,CAAC,CAAC"}
1
+ {"version":3,"names":["forwardRef","jsx","_jsx","Ring","props","ref","outerWidth","innerWidth","style","rest","outerRadius","innerRadius","width","height","clipPath"],"sources":["../../../src/components/Ring.tsx"],"sourcesContent":["\"use client\"\n\nimport { forwardRef, HTMLAttributes } from \"react\"\n\nexport interface RingProps extends HTMLAttributes<HTMLDivElement> {\n outerWidth: number\n innerWidth: number\n}\n\n/** 环形组件 */\nexport const Ring = forwardRef<HTMLDivElement, RingProps>((props, ref) => {\n const { outerWidth, innerWidth, style, ...rest } = props\n\n const outerRadius = outerWidth / 2\n\n const innerRadius = innerWidth / 2\n\n return (\n <div\n ref={ref}\n style={{\n ...style,\n width: `${outerWidth}px`,\n height: `${outerWidth}px`,\n clipPath: `path(\"M0,${outerRadius} a${outerRadius},${outerRadius},0,1,0,${outerWidth},0 a${outerRadius},${outerRadius},0,1,0,-${outerWidth},0 l${outerRadius - innerRadius},0 a${innerRadius},${innerRadius},0,0,1,${innerRadius * 2},0 a${innerRadius},${innerRadius},0,0,1,-${innerRadius * 2},0 Z\")`,\n }}\n {...rest}\n />\n )\n})\n"],"mappings":"AAAA,YAAY;;AAEZ,SAASA,UAAU,QAAwB,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAOlD;AACA,OAAO,MAAMC,IAAI,gBAAGH,UAAU,CAA4B,CAACI,KAAK,EAAEC,GAAG,KAAK;EACtE,MAAM;IAAEC,UAAU;IAAEC,UAAU;IAAEC,KAAK;IAAE,GAAGC;EAAK,CAAC,GAAGL,KAAK;EAExD,MAAMM,WAAW,GAAGJ,UAAU,GAAG,CAAC;EAElC,MAAMK,WAAW,GAAGJ,UAAU,GAAG,CAAC;EAElC,oBACIL,IAAA;IACIG,GAAG,EAAEA,GAAI;IACTG,KAAK,EAAE;MACH,GAAGA,KAAK;MACRI,KAAK,EAAG,GAAEN,UAAW,IAAG;MACxBO,MAAM,EAAG,GAAEP,UAAW,IAAG;MACzBQ,QAAQ,EAAG,YAAWJ,WAAY,KAAIA,WAAY,IAAGA,WAAY,UAASJ,UAAW,OAAMI,WAAY,IAAGA,WAAY,WAAUJ,UAAW,OAAMI,WAAW,GAAGC,WAAY,OAAMA,WAAY,IAAGA,WAAY,UAASA,WAAW,GAAG,CAAE,OAAMA,WAAY,IAAGA,WAAY,WAAUA,WAAW,GAAG,CAAE;IACpS,CAAE;IAAA,GACEF;EAAI,CACX,CAAC;AAEV,CAAC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"names":["css","clsx","forwardRef","useEffect","useImperativeHandle","useLayoutEffect","useRef","Scrollbar","px","transformCSSVariable","jsx","_jsx","default","Scroll","props","ref","children","options","className","style","scrollbar","onScrollbar","rest","thumbWidth","thumbRadius","thumbColor","trackColor","scrollbarOptions","ele","bar","current","init","destroy","addListener","removeListener","undefined"],"sources":["../../../src/components/Scroll.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport { css } from \"@emotion/css\"\r\nimport { clsx } from \"deepsea-tools\"\r\nimport { CSSProperties, ForwardedRef, forwardRef, HTMLAttributes, useEffect, useImperativeHandle, useLayoutEffect, useRef } from \"react\"\r\nimport Scrollbar from \"smooth-scrollbar\"\r\nimport type { ScrollbarOptions, ScrollListener } from \"smooth-scrollbar/interfaces\"\r\nimport { px, transformCSSVariable } from \"../utils\"\r\nexport { default as Scrollbar } from \"smooth-scrollbar\"\r\nexport * from \"smooth-scrollbar/interfaces\"\r\n\r\nexport interface ScrollOptions extends Partial<ScrollbarOptions> {\r\n /** 滑块宽度 */\r\n thumbWidth?: number | string\r\n /** 滑块圆角大小 */\r\n thumbRadius?: number | string\r\n /** 滑块背景颜色 */\r\n thumbColor?: CSSProperties[\"backgroundColor\"]\r\n /** 滚动条背景颜色 */\r\n trackColor?: CSSProperties[\"backgroundColor\"]\r\n}\r\n\r\nexport interface ScrollProps extends HTMLAttributes<HTMLDivElement> {\r\n /** 滚动的配置 */\r\n options?: ScrollOptions\r\n /** 滚动条实例 */\r\n scrollbar?: ForwardedRef<Scrollbar>\r\n /** 滚动条滚动事件 */\r\n onScrollbar?: ScrollListener\r\n}\r\n\r\nexport const Scroll = forwardRef<HTMLDivElement, ScrollProps>((props, ref) => {\r\n const { children, options, className, style, scrollbar, onScrollbar, ...rest } = props\r\n const { thumbWidth, thumbRadius, thumbColor, trackColor, ...scrollbarOptions } = options || {}\r\n const ele = useRef<HTMLDivElement>(null)\r\n const bar = useRef<Scrollbar | null>(null)\r\n\r\n useLayoutEffect(() => {\r\n bar.current = Scrollbar.init(ele.current!, scrollbarOptions)\r\n return () => bar.current?.destroy()\r\n }, [])\r\n\r\n useImperativeHandle(ref, () => ele.current!, [])\r\n\r\n useImperativeHandle(scrollbar, () => bar.current!, [])\r\n\r\n useEffect(() => {\r\n if (!onScrollbar) return\r\n bar.current?.addListener(onScrollbar)\r\n return () => bar.current?.removeListener(onScrollbar)\r\n }, [onScrollbar])\r\n\r\n return (\r\n <div\r\n ref={ele}\r\n className={clsx(\r\n css`\r\n .scrollbar-track.scrollbar-track-x {\r\n ${thumbWidth !== undefined ? \"height: var(--thumb-width);\" : \"\"}\r\n ${trackColor !== undefined ? \"background-color: var(--track-color);\" : \"\"}\r\n }\r\n\r\n .scrollbar-thumb.scrollbar-thumb-x {\r\n ${thumbWidth !== undefined ? \"height: var(--thumb-width);\" : \"\"}\r\n ${thumbRadius !== undefined ? \"border-radius: var(--thumb-radius);\" : \"\"}\r\n ${thumbColor !== undefined ? \"background-color: var(--thumb-color);\" : \"\"}\r\n }\r\n\r\n .scrollbar-track.scrollbar-track-y {\r\n ${thumbWidth !== undefined ? \"width: var(--thumb-width);\" : \"\"}\r\n ${trackColor !== undefined ? \"background-color: var(--track-color);\" : \"\"}\r\n }\r\n\r\n .scrollbar-thumb.scrollbar-thumb-y {\r\n ${thumbWidth !== undefined ? \"width: var(--thumb-width);\" : \"\"}\r\n ${thumbRadius !== undefined ? \"border-radius: var(--thumb-radius);\" : \"\"}\r\n ${thumbColor !== undefined ? \"background-color: var(--thumb-color);\" : \"\"}\r\n }\r\n `,\r\n className\r\n )}\r\n style={transformCSSVariable(\r\n {\r\n thumbWidth: px(thumbWidth),\r\n thumbRadius: px(thumbRadius),\r\n thumbColor,\r\n trackColor\r\n },\r\n style\r\n )}\r\n {...rest}>\r\n {children}\r\n </div>\r\n )\r\n})\r\n"],"mappings":"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"}
1
+ {"version":3,"names":["css","clsx","forwardRef","useEffect","useImperativeHandle","useLayoutEffect","useRef","Scrollbar","px","transformCSSVariable","jsx","_jsx","default","Scroll","props","ref","children","options","className","style","scrollbar","onScrollbar","rest","thumbWidth","thumbRadius","thumbColor","trackColor","scrollbarOptions","ele","bar","current","init","destroy","addListener","removeListener","undefined"],"sources":["../../../src/components/Scroll.tsx"],"sourcesContent":["\"use client\"\n\nimport { css } from \"@emotion/css\"\nimport { clsx } from \"deepsea-tools\"\nimport { CSSProperties, ForwardedRef, forwardRef, HTMLAttributes, useEffect, useImperativeHandle, useLayoutEffect, useRef } from \"react\"\nimport Scrollbar from \"smooth-scrollbar\"\nimport type { ScrollbarOptions, ScrollListener } from \"smooth-scrollbar/interfaces\"\nimport { px, transformCSSVariable } from \"../utils\"\nexport { default as Scrollbar } from \"smooth-scrollbar\"\nexport * from \"smooth-scrollbar/interfaces\"\n\nexport interface ScrollOptions extends Partial<ScrollbarOptions> {\n /** 滑块宽度 */\n thumbWidth?: number | string\n /** 滑块圆角大小 */\n thumbRadius?: number | string\n /** 滑块背景颜色 */\n thumbColor?: CSSProperties[\"backgroundColor\"]\n /** 滚动条背景颜色 */\n trackColor?: CSSProperties[\"backgroundColor\"]\n}\n\nexport interface ScrollProps extends HTMLAttributes<HTMLDivElement> {\n /** 滚动的配置 */\n options?: ScrollOptions\n /** 滚动条实例 */\n scrollbar?: ForwardedRef<Scrollbar>\n /** 滚动条滚动事件 */\n onScrollbar?: ScrollListener\n}\n\nexport const Scroll = forwardRef<HTMLDivElement, ScrollProps>((props, ref) => {\n const { children, options, className, style, scrollbar, onScrollbar, ...rest } = props\n const { thumbWidth, thumbRadius, thumbColor, trackColor, ...scrollbarOptions } = options || {}\n const ele = useRef<HTMLDivElement>(null)\n const bar = useRef<Scrollbar | null>(null)\n\n useLayoutEffect(() => {\n bar.current = Scrollbar.init(ele.current!, scrollbarOptions)\n return () => bar.current?.destroy()\n }, [])\n\n useImperativeHandle(ref, () => ele.current!, [])\n\n useImperativeHandle(scrollbar, () => bar.current!, [])\n\n useEffect(() => {\n if (!onScrollbar) return\n bar.current?.addListener(onScrollbar)\n return () => bar.current?.removeListener(onScrollbar)\n }, [onScrollbar])\n\n return (\n <div\n ref={ele}\n className={clsx(\n css`\n .scrollbar-track.scrollbar-track-x {\n ${thumbWidth !== undefined ? \"height: var(--thumb-width);\" : \"\"}\n ${trackColor !== undefined ? \"background-color: var(--track-color);\" : \"\"}\n }\n\n .scrollbar-thumb.scrollbar-thumb-x {\n ${thumbWidth !== undefined ? \"height: var(--thumb-width);\" : \"\"}\n ${thumbRadius !== undefined ? \"border-radius: var(--thumb-radius);\" : \"\"}\n ${thumbColor !== undefined ? \"background-color: var(--thumb-color);\" : \"\"}\n }\n\n .scrollbar-track.scrollbar-track-y {\n ${thumbWidth !== undefined ? \"width: var(--thumb-width);\" : \"\"}\n ${trackColor !== undefined ? \"background-color: var(--track-color);\" : \"\"}\n }\n\n .scrollbar-thumb.scrollbar-thumb-y {\n ${thumbWidth !== undefined ? \"width: var(--thumb-width);\" : \"\"}\n ${thumbRadius !== undefined ? \"border-radius: var(--thumb-radius);\" : \"\"}\n ${thumbColor !== undefined ? \"background-color: var(--thumb-color);\" : \"\"}\n }\n `,\n className,\n )}\n style={transformCSSVariable(\n {\n thumbWidth: px(thumbWidth),\n thumbRadius: px(thumbRadius),\n thumbColor,\n trackColor,\n },\n style,\n )}\n {...rest}\n >\n {children}\n </div>\n )\n})\n"],"mappings":"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"}