@rxdrag/website-lib-react 0.0.4 → 0.0.7

package/dist/media.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"media.mjs","sources":["../src/components/Medias/VideoPlayer.tsx","../src/components/Medias/MainMedia.tsx","../src/components/Medias/Thumbnail.tsx","../src/components/Medias/index.tsx"],"sourcesContent":["import { Media } from \"@rxdrag/rxcms-models\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport Hls from \"hls.js\";\nimport clsx from \"clsx\";\n\nexport function VideoPlayer(props: {\n  media: Media;\n  size?: \"normal\" | \"small\";\n  playButtonClass?: string;\n}) {\n  const { media, size = \"normal\", playButtonClass } = props;\n  const videoRef = useRef<HTMLVideoElement>(null);\n  const hlsRef = useRef<Hls | null>(null);\n  const [isPlaying, setIsPlaying] = useState(false);\n\n  const handlePlayClick = React.useCallback(\n    (e: React.MouseEvent) => {\n      e.stopPropagation();\n      if (videoRef.current) {\n        if (isPlaying) {\n          videoRef.current.pause();\n        } else {\n          videoRef.current.play();\n        }\n      }\n    },\n    [isPlaying]\n  );\n\n  useEffect(() => {\n    if (!videoRef.current || !media.file?.original) return;\n\n    const video = videoRef.current;\n    const videoUrl = media.file.original;\n\n    const handlePlay = () => {\n      setIsPlaying(true);\n    };\n\n    const handlePause = () => {\n      setIsPlaying(false);\n    };\n\n    video.addEventListener(\"play\", handlePlay);\n    video.addEventListener(\"pause\", handlePause);\n\n    if (media.storageType === \"cloudflare_stream\") {\n      if (!Hls.isSupported()) {\n        if (video.canPlayType(\"application/vnd.apple.mpegurl\")) {\n          video.src = videoUrl;\n        }\n      } else {\n        const hls = new Hls({\n          enableWorker: true,\n        });\n\n        hls.loadSource(videoUrl);\n        hls.attachMedia(video);\n        hlsRef.current = hls;\n      }\n    } else {\n      video.src = videoUrl;\n    }\n\n    return () => {\n      video.removeEventListener(\"play\", handlePlay);\n      video.removeEventListener(\"pause\", handlePause);\n      if (hlsRef.current) {\n        hlsRef.current.destroy();\n        hlsRef.current = null;\n      }\n    };\n  }, [media.file?.original, media.storageType]);\n\n  return (\n    <div className=\"relative w-full h-full group cursor-pointer\" onClick={handlePlayClick}>\n      <video\n        ref={videoRef}\n        preload=\"metadata\"\n        poster={media.file?.thumbnail}\n        className=\"absolute inset-0 w-full h-full object-cover\"\n        controls={false} \n        playsInline\n      />\n      {!isPlaying && (\n        <div className=\"absolute inset-0 flex items-center justify-center z-10 bg-black/10 group-hover:bg-black/20 transition-colors\">\n          <div\n            className={clsx(\n              \"rounded-full bg-white/90 hover:bg-white flex items-center justify-center shadow-lg transition-all hover:scale-110 backdrop-blur-sm\",\n              size === \"small\" ? \"w-8 h-8\" : \"w-14 h-14\",\n              playButtonClass\n            )}\n          >\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 24 24\"\n              fill=\"currentColor\"\n              className={clsx(\n                \"text-gray-900 ml-1\",\n                size === \"small\" ? \"w-4 h-4\" : \"w-8 h-8\"\n              )}\n            >\n              <path\n                fillRule=\"evenodd\"\n                d=\"M4.5 5.653c0-1.426 1.529-2.33 2.779-1.643l11.54 6.348c1.295.712 1.295 2.573 0 3.248L7.28 19.987C6.03 20.673 4.5 19.77 4.5 18.562V5.653z\"\n                clipRule=\"evenodd\"\n              />\n            </svg>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n","import clsx from \"clsx\";\nimport { useRef, useState, useEffect, useCallback } from \"react\";\nimport { TMedia } from \"../../types/view-model\";\nimport { MediaType } from \"@rxdrag/rxcms-models\";\nimport { VideoPlayer } from \"./VideoPlayer\";\n\nexport type MainMediaProps = {\n  value?: TMedia[];\n  selectedId?: string | null;\n  aspect?: string;\n  enableZoom?: boolean;\n  className?: string;\n  arrowButtonClass?: string;\n  arrowIconClass?: string;\n  playButtonClass?: string;\n  onPrevious: () => void;\n  onNext: () => void;\n  canPrevious: boolean;\n  canNext: boolean;\n};\n\nexport const MainMedia = ({\n  value,\n  selectedId,\n  aspect,\n  enableZoom,\n  className,\n  arrowButtonClass,\n  arrowIconClass,\n  playButtonClass,\n  onPrevious,\n  onNext,\n  canPrevious,\n  canNext,\n}: MainMediaProps) => {\n  const mainAreaRef = useRef<HTMLDivElement>(null);\n  const [isZoomed, setIsZoomed] = useState(false);\n  const [position, setPosition] = useState({ x: 0, y: 0 });\n  const hoverTimerRef = useRef<NodeJS.Timeout | null>(null);\n  const lastMousePosRef = useRef({ x: 0, y: 0 });\n\n  const selectedMedia = value?.find((media) => media.id === selectedId);\n  const isVideo = selectedMedia?.mediaType === MediaType.video;\n\n  // Reset zoom state when image changes\n  useEffect(() => {\n    setIsZoomed(false);\n    setPosition({ x: 0, y: 0 });\n    if (hoverTimerRef.current) {\n      clearTimeout(hoverTimerRef.current);\n    }\n  }, [selectedId]);\n\n  // Clean up timer on unmount\n  useEffect(() => {\n    return () => {\n      if (hoverTimerRef.current) {\n        clearTimeout(hoverTimerRef.current);\n      }\n    };\n  }, []);\n\n  const updateZoomPosition = useCallback((clientX: number, clientY: number) => {\n    if (mainAreaRef.current) {\n      const { left, top, width, height } =\n        mainAreaRef.current.getBoundingClientRect();\n      const x = clientX - left;\n      const y = clientY - top;\n\n      // Calculate percentage position (0 to 1)\n      const ratioX = Math.max(0, Math.min(1, x / width));\n      const ratioY = Math.max(0, Math.min(1, y / height));\n\n      // Formula: Translate = Dimension * (0.5 - Ratio)\n      // This shifts the image opposite to mouse movement relative to center\n      const newX = width * (0.5 - ratioX);\n      const newY = height * (0.5 - ratioY);\n\n      setPosition({ x: newX, y: newY });\n    }\n  }, []);\n\n  const handleMouseEnter = useCallback(\n    (e: React.MouseEvent) => {\n      if (!enableZoom || isVideo) return;\n      lastMousePosRef.current = { x: e.clientX, y: e.clientY };\n\n      hoverTimerRef.current = setTimeout(() => {\n        setIsZoomed(true);\n        updateZoomPosition(\n          lastMousePosRef.current.x,\n          lastMousePosRef.current.y\n        );\n      }, 1000);\n    },\n    [enableZoom, isVideo, updateZoomPosition]\n  );\n\n  const handleMouseMove = useCallback(\n    (e: React.MouseEvent) => {\n      if (!enableZoom || isVideo) return;\n      lastMousePosRef.current = { x: e.clientX, y: e.clientY };\n\n      if (isZoomed) {\n        updateZoomPosition(e.clientX, e.clientY);\n      }\n    },\n    [enableZoom, isVideo, isZoomed, updateZoomPosition]\n  );\n\n  const handleMouseLeave = useCallback(() => {\n    if (hoverTimerRef.current) {\n      clearTimeout(hoverTimerRef.current);\n    }\n    setIsZoomed(false);\n    setPosition({ x: 0, y: 0 });\n  }, []);\n\n  const handleClick = useCallback(\n    (e: React.MouseEvent) => {\n      if (!enableZoom || isVideo) return;\n\n      if (hoverTimerRef.current) {\n        clearTimeout(hoverTimerRef.current);\n      }\n\n      if (isZoomed) {\n        setIsZoomed(false);\n        setPosition({ x: 0, y: 0 });\n      } else {\n        setIsZoomed(true);\n        updateZoomPosition(e.clientX, e.clientY);\n      }\n    },\n    [enableZoom, isVideo, isZoomed, updateZoomPosition]\n  );\n\n  return (\n    <div\n      ref={mainAreaRef}\n      className={clsx(\n        \"relative group overflow-hidden rounded-xl bg-gray-100 dark:bg-gray-800 z-0\",\n        aspect,\n        className,\n        enableZoom && !isVideo && \"cursor-crosshair\"\n      )}\n      onMouseEnter={handleMouseEnter}\n      onMouseMove={handleMouseMove}\n      onMouseLeave={handleMouseLeave}\n      onClick={handleClick}\n    >\n      {/* Navigation Arrows - Hide when zoomed to avoid misclick */}\n      {!isZoomed && (\n        <div className=\"absolute inset-0 flex items-center justify-between p-4 pointer-events-none z-20\">\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              onPrevious();\n            }}\n            disabled={!canPrevious}\n            className={clsx(\n              \"pointer-events-auto transition-all duration-200 rounded-full p-2\",\n              \"bg-white/80 dark:bg-black/50 backdrop-blur-sm shadow-sm\",\n              \"hover:bg-white dark:hover:bg-black/70 hover:scale-105 active:scale-95\",\n              \"text-gray-800 dark:text-white\",\n              !canPrevious\n                ? \"opacity-0 translate-x-[-10px]\"\n                : \"opacity-0 group-hover:opacity-100 translate-x-0\",\n              arrowButtonClass\n            )}\n            aria-label=\"Previous slide\"\n          >\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className={clsx(\"h-5 w-5\", arrowIconClass)}\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M15 19l-7-7 7-7\"\n              />\n            </svg>\n          </button>\n\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              onNext();\n            }}\n            disabled={!canNext}\n            className={clsx(\n              \"pointer-events-auto transition-all duration-200 rounded-full p-2\",\n              \"bg-white/80 dark:bg-black/50 backdrop-blur-sm shadow-sm\",\n              \"hover:bg-white dark:hover:bg-black/70 hover:scale-105 active:scale-95\",\n              \"text-gray-800 dark:text-white\",\n              !canNext\n                ? \"opacity-0 translate-x-[10px]\"\n                : \"opacity-0 group-hover:opacity-100 translate-x-0\",\n              arrowButtonClass\n            )}\n            aria-label=\"Next slide\"\n          >\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className={clsx(\"h-5 w-5\", arrowIconClass)}\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M9 5l7 7-7 7\"\n              />\n            </svg>\n          </button>\n        </div>\n      )}\n\n      {value?.map((media) => (\n        <div\n          key={media.id}\n          className={clsx(\n            \"absolute inset-0 transition-opacity duration-500 ease-in-out\",\n            media.id === selectedId\n              ? \"opacity-100 z-10\"\n              : \"opacity-0 z-0 pointer-events-none\"\n          )}\n        >\n          {media.mediaType === MediaType.video ? (\n            <VideoPlayer media={media} playButtonClass={playButtonClass} />\n          ) : (\n            <img\n              src={media?.file?.resize || media?.file?.url}\n              alt={media?.alt}\n              className=\"w-full h-full object-cover object-center origin-center\"\n              style={{\n                transform:\n                  media.id === selectedId\n                    ? `translate(${position.x}px, ${position.y}px) scale(${\n                        isZoomed ? 2 : 1\n                      })`\n                    : undefined,\n                transition: isZoomed ? \"none\" : \"transform 0.3s ease-out\",\n              }}\n            />\n          )}\n        </div>\n      ))}\n    </div>\n  );\n};\n","import clsx from \"clsx\";\nimport { TMedia } from \"../../types/view-model\";\nimport { MediaType } from \"@rxdrag/rxcms-models\";\nimport { VideoPlayer } from \"./VideoPlayer\";\n\nexport type ThumbnailProps = {\n  media: TMedia;\n  isSelected: boolean;\n  onClick: () => void;\n  aspect?: string;\n  className?: string;\n  imageClass?: string;\n  playButtonClass?: string;\n};\n\nexport const Thumbnail = ({\n  media,\n  isSelected,\n  onClick,\n  aspect,\n  className,\n  imageClass,\n  playButtonClass,\n}: ThumbnailProps) => {\n  return (\n    <div\n      className={clsx(\n        \"relative cursor-pointer overflow-hidden rounded-lg transition-all duration-200\",\n        aspect,\n        isSelected\n          ? \"ring-2 ring-primary ring-offset-2 ring-offset-white dark:ring-offset-gray-950\"\n          : \"opacity-70 hover:opacity-100 hover:ring-2 hover:ring-gray-200 dark:hover:ring-gray-700\",\n        className\n      )}\n      onClick={onClick}\n    >\n      {media.mediaType === MediaType.video ? (\n        <div\n          className={clsx(\n            \"w-full h-full relative pointer-events-none [&>div]:!aspect-auto [&>div]:!w-full [&>div]:!h-full transition-transform duration-500\",\n            isSelected ? \"scale-110\" : \"scale-100\",\n            imageClass\n          )}\n        >\n          <VideoPlayer media={media} size=\"small\" playButtonClass={playButtonClass} />\n        </div>\n      ) : (\n        <img\n          src={\n            media?.file?.thumbnail || media?.file?.resize || media?.file?.url\n          }\n          alt={media?.alt}\n          className={clsx(\n            \"w-full h-full object-cover transition-transform duration-500\",\n            isSelected ? \"scale-110\" : \"scale-100\",\n            imageClass\n          )}\n        />\n      )}\n    </div>\n  );\n};\n","import clsx from \"clsx\";\nimport { forwardRef, useEffect, useState, useCallback } from \"react\";\nimport { TMedia } from \"../../types/view-model\";\nimport { MainMedia } from \"./MainMedia\";\nimport { Thumbnail } from \"./Thumbnail\";\n\nexport type MediasProps = {\n  value?: TMedia[];\n  className?: string;\n  children?: React.ReactNode;\n  // Aspect ratio, format is `aspect-[width/height]`\n  aspect?: string;\n  thumbnailAspect?: string;\n  enableZoom?: boolean;\n  thumbnailPosition?: \"bottom\" | \"left\";\n  visibleCount?: number;\n  classNames?: {\n    mainArea?: string;\n    navigation?: string;\n    thumbnail?: string;\n    thumbnailImage?: string;\n    arrowButton?: string;\n    arrowIcon?: string;\n    playButton?: string;\n    navigationInner?: string;\n  };\n};\n\nexport const Medias = forwardRef<HTMLDivElement, MediasProps>((props, ref) => {\n  const {\n    value,\n    className,\n    children,\n    aspect = \"aspect-[1/1]\",\n    thumbnailAspect = \"aspect-[1/1]\",\n    enableZoom = true,\n    thumbnailPosition = \"bottom\",\n    visibleCount = 6,\n    classNames,\n    ...rest\n  } = props;\n  const {\n    mainArea,\n    navigation,\n    thumbnail,\n    thumbnailImage,\n    arrowButton,\n    arrowIcon,\n    playButton,\n    navigationInner,\n  } = classNames || {};\n  const [selectedId, setSelectedId] = useState<string | undefined | null>(\n    value?.[0]?.id || \"\"\n  );\n\n  useEffect(() => {\n    setSelectedId(value?.[0]?.id || \"\");\n  }, [value]);\n\n  const selectedIndex =\n    value?.findIndex((media) => media.id === selectedId) || 0;\n\n  const totalItems = value?.length || 0;\n\n  const handlePrevious = useCallback(() => {\n    if (selectedIndex > 0) {\n      const prevIndex = selectedIndex - 1;\n      setSelectedId(value?.[prevIndex]?.id || \"\");\n    }\n  }, [selectedIndex, value]);\n\n  const handleNext = useCallback(() => {\n    if (selectedIndex < totalItems - 1) {\n      const currentMediaIndex =\n        value?.findIndex((media) => media.id === selectedId) || 0;\n      const nextIndex = currentMediaIndex + 1;\n      setSelectedId(value?.[nextIndex]?.id || \"\");\n    }\n  }, [selectedIndex, totalItems, value, selectedId]);\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\") {\n        handlePrevious();\n      } else if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\") {\n        handleNext();\n      }\n    },\n    [handleNext, handlePrevious]\n  );\n\n  useEffect(() => {\n    window.addEventListener(\"keydown\", handleKeyDown);\n    return () => window.removeEventListener(\"keydown\", handleKeyDown);\n  }, [handleKeyDown]);\n\n  const canPrevious = selectedIndex > 0;\n  const canNext = selectedIndex < totalItems - 1;\n\n  const isVerticalThumbs = thumbnailPosition === \"left\";\n\n  const actualVisibleCount = visibleCount;\n  const halfVisible = Math.floor(actualVisibleCount / 2);\n  const startIndex = Math.max(\n    0,\n    Math.min(selectedIndex - halfVisible, totalItems - actualVisibleCount)\n  );\n  const endIndex = Math.min(startIndex + actualVisibleCount, totalItems);\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(\n        \"flex gap-4\",\n        isVerticalThumbs ? \"flex-col md:flex-row-reverse\" : \"flex-col\",\n        className\n      )}\n      {...rest}\n    >\n      {children}\n      {/* Main display area */}\n      <MainMedia\n        value={value}\n        selectedId={selectedId}\n        aspect={aspect}\n        enableZoom={enableZoom}\n        className={clsx(\n          isVerticalThumbs ? \"w-full md:flex-1\" : \"w-full\",\n          mainArea\n        )}\n        arrowButtonClass={arrowButton}\n        arrowIconClass={arrowIcon}\n        playButtonClass={playButton}\n        onPrevious={handlePrevious}\n        onNext={handleNext}\n        canPrevious={canPrevious}\n        canNext={canNext}\n      />\n\n      {/* Thumbnail navigation */}\n      {totalItems > 1 && (\n        <div\n          className={clsx(\n            \"relative group/thumbs\",\n            isVerticalThumbs\n              ? \"w-full mt-4 md:w-24 md:h-full md:px-1\"\n              : \"w-full mt-4\",\n            navigation\n          )}\n        >\n          {/* Previous Arrow */}\n          {totalItems > actualVisibleCount && (\n            <button\n              onClick={handlePrevious}\n              disabled={!canPrevious}\n              className={clsx(\n                \"absolute z-10 w-8 h-8 flex items-center justify-center rounded-full\",\n                \"bg-white/60 dark:bg-black/50 shadow-sm backdrop-blur-sm\",\n                \"text-gray-700 dark:text-gray-200 transition-all duration-200\",\n                isVerticalThumbs\n                  ? \"left-2 top-1/2 -translate-y-1/2 md:top-2 md:left-1/2 md:-translate-x-1/2\"\n                  : \"left-2 top-1/2 -translate-y-1/2\",\n                !canPrevious\n                  ? \"opacity-0 pointer-events-none\"\n                  : \"opacity-0 group-hover/thumbs:opacity-100 hover:bg-white/90 dark:hover:bg-black/80\",\n                arrowButton\n              )}\n              aria-label=\"Previous\"\n            >\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                className={clsx(\n                  \"h-4 w-4\",\n                  isVerticalThumbs && \"md:rotate-90\",\n                  arrowIcon\n                )}\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  strokeWidth={2}\n                  d=\"M15 19l-7-7 7-7\"\n                />\n              </svg>\n            </button>\n          )}\n\n          <div\n            className={clsx(\n              \"flex-1\",\n              isVerticalThumbs\n                ? \"w-full px-0.5 md:h-full md:py-0.5\"\n                : \"w-full px-0.5\"\n            )}\n          >\n            <div\n              className={clsx(\n                \"gap-2 md:gap-3\",\n                navigationInner,\n                isVerticalThumbs ? \"grid md:flex md:flex-col\" : \"grid\"\n              )}\n              style={{\n                gridTemplateColumns: `repeat(${actualVisibleCount}, minmax(0, 1fr))`,\n              }}\n            >\n              {value?.map((media, index) => {\n                if (index < startIndex || index >= endIndex) return null;\n                const isSelected = selectedId === media.id;\n                return (\n                  <Thumbnail\n                    key={media.id}\n                    media={media}\n                    isSelected={isSelected}\n                    onClick={() => setSelectedId(media.id)}\n                    aspect={thumbnailAspect}\n                    className={thumbnail}\n                    imageClass={thumbnailImage}\n                    playButtonClass={playButton}\n                  />\n                );\n              })}\n            </div>\n          </div>\n\n          {/* Next Arrow */}\n          {totalItems > actualVisibleCount && (\n            <button\n              onClick={handleNext}\n              disabled={!canNext}\n              className={clsx(\n                \"absolute z-10 w-8 h-8 flex items-center justify-center rounded-full\",\n                \"bg-white/60 dark:bg-black/50 shadow-sm backdrop-blur-sm\",\n                \"text-gray-700 dark:text-gray-200 transition-all duration-200\",\n                isVerticalThumbs\n                  ? \"right-2 top-1/2 -translate-y-1/2 md:bottom-2 md:left-1/2 md:-translate-x-1/2\"\n                  : \"right-2 top-1/2 -translate-y-1/2\",\n                !canNext\n                  ? \"opacity-0 pointer-events-none\"\n                  : \"opacity-0 group-hover/thumbs:opacity-100 hover:bg-white/90 dark:hover:bg-black/80\",\n                arrowButton\n              )}\n              aria-label=\"Next\"\n            >\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                className={clsx(\n                  \"h-4 w-4\",\n                  isVerticalThumbs && \"md:rotate-90\",\n                  arrowIcon\n                )}\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  strokeWidth={2}\n                  d=\"M9 5l7 7-7 7\"\n                />\n              </svg>\n            </button>\n          )}\n        </div>\n      )}\n    </div>\n  );\n});\n"],"names":["React","_a","jsxs","jsx"],"mappings":"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"}

package/dist/richtext.d.ts

@@ -0,0 +1 @@
+export * from './components/RichTextOutline';

package/dist/richtext.mjs

@@ -0,0 +1,191 @@
+import { j as jsxRuntimeExports } from "./jsx-runtime-c02cc059.js";
+import { useState, useRef, useEffect, useCallback, useMemo, forwardRef } from "react";
+import clsx from "clsx";
+function throttle(fn, wait, options = {}) {
+  const { leading = true, trailing = true } = options;
+  let timeoutId = null;
+  let lastInvokeTime = 0;
+  let lastArgs = null;
+  const invoke = (time, args) => {
+    lastInvokeTime = time;
+    fn(...args);
+  };
+  const throttled = (...args) => {
+    const now = Date.now();
+    if (!lastInvokeTime && !leading) {
+      lastInvokeTime = now;
+    }
+    const remaining = wait - (now - lastInvokeTime);
+    lastArgs = args;
+    if (remaining <= 0 || remaining > wait) {
+      if (timeoutId) {
+        clearTimeout(timeoutId);
+        timeoutId = null;
+      }
+      invoke(now, args);
+      lastArgs = null;
+      return;
+    }
+    if (!timeoutId && trailing) {
+      timeoutId = setTimeout(() => {
+        timeoutId = null;
+        if (lastArgs) {
+          invoke(leading ? Date.now() : 0, lastArgs);
+          lastArgs = null;
+        }
+      }, remaining);
+    }
+  };
+  throttled.cancel = () => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
+      timeoutId = null;
+    }
+    lastArgs = null;
+    lastInvokeTime = 0;
+  };
+  return throttled;
+}
+function useAcitviedHeading(yOffset = 200) {
+  const [activeId, setActiveId] = useState(null);
+  const anchorElementsRef = useRef([]);
+  const lastScrollTopRef = useRef(0);
+  const activeIdRef = useRef(null);
+  useEffect(() => {
+    activeIdRef.current = activeId;
+  }, [activeId]);
+  useEffect(() => {
+    anchorElementsRef.current = Array.from(
+      document.querySelectorAll('a[href^="#"]')
+    );
+  }, []);
+  const handleScroll = useCallback(() => {
+    const scrollTop = window.scrollY;
+    lastScrollTopRef.current = scrollTop;
+    let closestId = null;
+    let closestDistance = Infinity;
+    anchorElementsRef.current.forEach((element) => {
+      var _a;
+      const id = ((_a = element.getAttribute("href")) == null ? void 0 : _a.slice(1)) || "";
+      const targetElement = document.getElementById(id);
+      if (targetElement) {
+        const { top } = targetElement.getBoundingClientRect();
+        const distance = Math.abs(top);
+        if (top <= yOffset && distance < closestDistance) {
+          closestId = id;
+          closestDistance = distance;
+        }
+      }
+    });
+    if (activeIdRef.current !== closestId) {
+      setActiveId(closestId);
+    }
+  }, [yOffset]);
+  const throttledHandleScroll = useMemo(
+    () => throttle(handleScroll, 100, { leading: true, trailing: true }),
+    [handleScroll]
+  );
+  useEffect(() => {
+    const handleHashChange = () => {
+      const hash = window.location.hash.substring(1);
+      setActiveId(hash);
+      const element = document.getElementById(hash);
+      if (element) {
+        const y = element.getBoundingClientRect().top + window.scrollY - yOffset;
+        window.scrollTo({ top: y, behavior: "smooth" });
+      }
+    };
+    window.addEventListener("hashchange", handleHashChange);
+    window.addEventListener("scroll", throttledHandleScroll);
+    handleHashChange();
+    return () => {
+      window.removeEventListener("hashchange", handleHashChange);
+      window.removeEventListener("scroll", throttledHandleScroll);
+      throttledHandleScroll.cancel();
+    };
+  }, [handleScroll, throttledHandleScroll, yOffset]);
+  return activeId;
+}
+function slugify(value) {
+  return value.toLowerCase().trim().replace(/<[^>]+>/g, "").replace(/&[a-z0-9#]+;/gi, "").replace(/[^\p{L}\p{N}\s-]/gu, "").replace(/\s+/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "");
+}
+function decodeInlineText(value) {
+  return value.replace(/!\[([^\]]*)\]\([^)]*\)/g, "$1").replace(/\[([^\]]+)\]\([^)]*\)/g, "$1").replace(/[`*_~>#]/g, "").replace(/<[^>]+>/g, "").replace(/&nbsp;/gi, " ").replace(/&amp;/gi, "&").replace(/&lt;/gi, "<").replace(/&gt;/gi, ">").replace(/\s+/g, " ").trim();
+}
+function parseOutline(value) {
+  if (!value) {
+    return [];
+  }
+  const lines = value.split(/\r?\n/);
+  const counts = /* @__PURE__ */ new Map();
+  const items = [];
+  for (const line of lines) {
+    const match = line.match(/^(#{1,6})\s+(.+)$/);
+    if (!match) {
+      continue;
+    }
+    const text = decodeInlineText(match[2]);
+    if (!text) {
+      continue;
+    }
+    const baseKey = slugify(text) || "section";
+    const count = counts.get(baseKey) ?? 0;
+    counts.set(baseKey, count + 1);
+    items.push({
+      key: count === 0 ? baseKey : `${baseKey}-${count + 1}`,
+      text
+    });
+  }
+  return items;
+}
+const RichTextOutline = forwardRef((props, ref) => {
+  const { className, itemClassName, value, yOffset = 200, ...rest } = props;
+  const activiedId = useAcitviedHeading(yOffset);
+  const outline = parseOutline(value);
+  useEffect(() => {
+    const handleHashChange = () => {
+      const element = document.getElementById(
+        window.location.hash.substring(1)
+      );
+      if (element) {
+        const y = element.getBoundingClientRect().top + window.scrollY - yOffset;
+        window.scrollTo({ top: y, behavior: "smooth" });
+      }
+    };
+    window.addEventListener("hashchange", handleHashChange);
+    return () => {
+      window.removeEventListener("hashchange", handleHashChange);
+    };
+  }, [yOffset]);
+  return (outline == null ? void 0 : outline.length) ? /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { ref, className, ...rest, children: outline == null ? void 0 : outline.map((item, index) => {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "li",
+      {
+        className: clsx(
+          activiedId === (item == null ? void 0 : item.key) ? "actived" : "",
+          itemClassName
+        ),
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "a",
+          {
+            href: `#${item == null ? void 0 : item.key}`,
+            onClick: (e) => {
+              e.preventDefault();
+              const element = document.getElementById(item == null ? void 0 : item.key);
+              if (element) {
+                const y = element.getBoundingClientRect().top + window.scrollY + yOffset;
+                window.scrollTo({ top: y, behavior: "smooth" });
+              }
+            },
+            children: item == null ? void 0 : item.text
+          }
+        )
+      },
+      (item == null ? void 0 : item.key) + index
+    );
+  }) }) : null;
+});
+export {
+  RichTextOutline
+};
+//# sourceMappingURL=richtext.mjs.map

package/dist/richtext.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"richtext.mjs","sources":["../src/components/RichTextOutline/useAcitviedHeading.ts","../src/components/RichTextOutline/parseOutline.ts","../src/components/RichTextOutline/index.tsx"],"sourcesContent":["import { useCallback, useEffect, useState, useRef, useMemo } from \"react\";\n\n type ThrottledFunction<T extends (...args: never[]) => void> = ((...args: Parameters<T>) => void) & {\n   cancel: () => void;\n };\n\n function throttle<T extends (...args: never[]) => void>(\n   fn: T,\n   wait: number,\n   options: { leading?: boolean; trailing?: boolean } = {}\n ): ThrottledFunction<T> {\n   const { leading = true, trailing = true } = options;\n   let timeoutId: ReturnType<typeof setTimeout> | null = null;\n   let lastInvokeTime = 0;\n   let lastArgs: Parameters<T> | null = null;\n\n   const invoke = (time: number, args: Parameters<T>) => {\n     lastInvokeTime = time;\n     fn(...args);\n   };\n\n   const throttled = ((...args: Parameters<T>) => {\n     const now = Date.now();\n\n     if (!lastInvokeTime && !leading) {\n       lastInvokeTime = now;\n     }\n\n     const remaining = wait - (now - lastInvokeTime);\n     lastArgs = args;\n\n     if (remaining <= 0 || remaining > wait) {\n       if (timeoutId) {\n         clearTimeout(timeoutId);\n         timeoutId = null;\n       }\n       invoke(now, args);\n       lastArgs = null;\n       return;\n     }\n\n     if (!timeoutId && trailing) {\n       timeoutId = setTimeout(() => {\n         timeoutId = null;\n         if (lastArgs) {\n           invoke(leading ? Date.now() : 0, lastArgs);\n           lastArgs = null;\n         }\n       }, remaining);\n     }\n   }) as ThrottledFunction<T>;\n\n   throttled.cancel = () => {\n     if (timeoutId) {\n       clearTimeout(timeoutId);\n       timeoutId = null;\n     }\n     lastArgs = null;\n     lastInvokeTime = 0;\n   };\n\n   return throttled;\n }\n\nexport function useAcitviedHeading(yOffset = 200) {\n  const [activeId, setActiveId] = useState<string | null>(null);\n  const anchorElementsRef = useRef<HTMLAnchorElement[]>([]);\n  const lastScrollTopRef = useRef(0);\n  const activeIdRef = useRef<string | null>(null);\n\n  // 同步 activeId 到 ref\n  useEffect(() => {\n    activeIdRef.current = activeId;\n  }, [activeId]);\n\n  // 初始化时获取所有锚点元素\n  useEffect(() => {\n    anchorElementsRef.current = Array.from(\n      document.querySelectorAll('a[href^=\"#\"]')\n    );\n  }, []);\n\n  const handleScroll = useCallback(() => {\n    const scrollTop = window.scrollY;\n    lastScrollTopRef.current = scrollTop;\n\n    let closestId = null;\n    let closestDistance = Infinity;\n\n    anchorElementsRef.current.forEach((element) => {\n      const id = element.getAttribute(\"href\")?.slice(1) || \"\";\n      const targetElement = document.getElementById(id);\n\n      if (targetElement) {\n        const { top } = targetElement.getBoundingClientRect();\n        const distance = Math.abs(top);\n        if (top <= yOffset && distance < closestDistance) {\n          closestId = id;\n          closestDistance = distance;\n        }\n      }\n    });\n\n    if (activeIdRef.current !== closestId) {\n      setActiveId(closestId);\n    }\n  }, [yOffset]); // 移除 activeId 依赖，因为我们只需要比较当前值\n\n  // 使用节流函数包装handleScroll\n  const throttledHandleScroll = useMemo(\n    () => throttle(handleScroll, 100, { leading: true, trailing: true }),\n    [handleScroll]\n  );\n\n  useEffect(() => {\n    const handleHashChange = () => {\n      const hash = window.location.hash.substring(1);\n      setActiveId(hash);\n\n      const element = document.getElementById(hash);\n      if (element) {\n        const y =\n          element.getBoundingClientRect().top + window.scrollY - yOffset;\n        window.scrollTo({ top: y, behavior: \"smooth\" });\n      }\n    };\n\n    window.addEventListener(\"hashchange\", handleHashChange);\n    window.addEventListener(\"scroll\", throttledHandleScroll);\n\n    // 初始化时检查当前哈希值\n    handleHashChange();\n\n    return () => {\n      window.removeEventListener(\"hashchange\", handleHashChange);\n      window.removeEventListener(\"scroll\", throttledHandleScroll);\n      throttledHandleScroll.cancel(); // 清理节流函数\n    };\n  }, [handleScroll, throttledHandleScroll, yOffset]);\n\n  return activeId;\n}\n","export type RichTextOutlineItem = {\n  key: string;\n  text: string;\n};\n\nfunction slugify(value: string) {\n  return value\n    .toLowerCase()\n    .trim()\n    .replace(/<[^>]+>/g, \"\")\n    .replace(/&[a-z0-9#]+;/gi, \"\")\n    .replace(/[^\\p{L}\\p{N}\\s-]/gu, \"\")\n    .replace(/\\s+/g, \"-\")\n    .replace(/-+/g, \"-\")\n    .replace(/^-|-$/g, \"\");\n}\n\nfunction decodeInlineText(value: string) {\n  return value\n    .replace(/!\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n    .replace(/\\[([^\\]]+)\\]\\([^)]*\\)/g, \"$1\")\n    .replace(/[`*_~>#]/g, \"\")\n    .replace(/<[^>]+>/g, \"\")\n    .replace(/&nbsp;/gi, \" \")\n    .replace(/&amp;/gi, \"&\")\n    .replace(/&lt;/gi, \"<\")\n    .replace(/&gt;/gi, \">\")\n    .replace(/\\s+/g, \" \")\n    .trim();\n}\n\nexport function parseOutline(value?: string): RichTextOutlineItem[] {\n  if (!value) {\n    return [];\n  }\n\n  const lines = value.split(/\\r?\\n/);\n  const counts = new Map<string, number>();\n  const items: RichTextOutlineItem[] = [];\n\n  for (const line of lines) {\n    const match = line.match(/^(#{1,6})\\s+(.+)$/);\n    if (!match) {\n      continue;\n    }\n\n    const text = decodeInlineText(match[2]);\n    if (!text) {\n      continue;\n    }\n\n    const baseKey = slugify(text) || \"section\";\n    const count = counts.get(baseKey) ?? 0;\n    counts.set(baseKey, count + 1);\n\n    items.push({\n      key: count === 0 ? baseKey : `${baseKey}-${count + 1}`,\n      text,\n    });\n  }\n\n  return items;\n}\n","import { forwardRef, useEffect } from \"react\";\nimport { useAcitviedHeading } from \"./useAcitviedHeading\";\nimport clsx from \"clsx\";\nimport { parseOutline } from \"./parseOutline\";\n\nexport type RichTextOutlineProps = {\n  className?: string;\n  itemClassName?: string;\n  value?: string;\n  //滚动偏移量\n  yOffset?: number;\n  style?: React.CSSProperties;\n};\n\nexport const RichTextOutline = forwardRef<\n  HTMLUListElement,\n  RichTextOutlineProps\n>((props, ref) => {\n  const { className, itemClassName, value, yOffset = 200, ...rest } = props;\n  const activiedId = useAcitviedHeading(yOffset);\n  const outline = parseOutline(value);\n\n  useEffect(() => {\n    const handleHashChange = () => {\n      const element = document.getElementById(\n        window.location.hash.substring(1)\n      );\n      if (element) {\n        const y =\n          element.getBoundingClientRect().top + window.scrollY - yOffset;\n        window.scrollTo({ top: y, behavior: \"smooth\" });\n      }\n    };\n\n    window.addEventListener(\"hashchange\", handleHashChange);\n\n    return () => {\n      window.removeEventListener(\"hashchange\", handleHashChange);\n    };\n  }, [yOffset]);\n\n  return outline?.length ? (\n    <ul ref={ref} className={className} {...rest}>\n      {outline?.map((item, index) => {\n        return (\n          <li\n            key={item?.key + index}\n            className={clsx(\n              activiedId === item?.key ? \"actived\" : \"\",\n              itemClassName\n            )}\n          >\n            <a\n              href={`#${item?.key}`}\n              onClick={(e) => {\n                e.preventDefault();\n                const element = document.getElementById(item?.key);\n                if (element) {\n                  const y =\n                    element.getBoundingClientRect().top +\n                    window.scrollY +\n                    yOffset;\n                  window.scrollTo({ top: y, behavior: \"smooth\" });\n                }\n              }}\n            >\n              {item?.text}\n            </a>\n          </li>\n        );\n      })}\n    </ul>\n  ) : null;\n});\n"],"names":["jsx"],"mappings":"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"}

package/dist/ui.d.ts

@@ -0,0 +1,10 @@
+export * from './components/Analytics';
+export * from './components/AttachmentIcon';
+export * from './components/Icon';
+export * from './components/Share';
+export * from './components/Scroller';
+export * from './components/SearchInput';
+export * from './components/ToTop';
+export * from './components/BackgroundVideoPlayer';
+export * from './components/Bulletin';
+export * from './components/ReactModalTrigger';