@xiping/react-components 1.0.69 → 1.0.77

package/dist/es/components/subtitle-player/SubtitlePlayer.js

@@ -1,234 +0,0 @@
-import { jsx as S, jsxs as F } from "react/jsx-runtime";
-import { useMemo as h, useRef as G, useState as D, useEffect as V, useCallback as u } from "react";
-import { parseSRT as w, parseVTT as v } from "../../packages/subtitle/lib/src/parser.js";
-import { srtToJson as q, vttToJson as K } from "../../packages/subtitle/lib/src/json-converter.js";
-import Q from "clsx";
-import { CurrentMode as U } from "./CurrentMode.js";
-import { LyricsMode as X } from "./LyricsMode.js";
-import { getCurrentSubtitleEntry as Y, timeStringToSeconds as J } from "./utils.js";
-import './SubtitlePlayer.css';/* empty css                   */
-const ct = ({
-  subtitles: p,
-  currentTime: f,
-  mode: m = "current",
-  textAlign: E = "left",
-  className: L = "",
-  style: A,
-  onWordHoverChange: a,
-  renderWordOverlay: d,
-  onWordClick: y,
-  onSubtitleClick: T
-}) => {
-  const i = h(
-    () => Array.isArray(p) ? p : [p],
-    [p]
-  ), l = G(null), [s, M] = D(null), [R, b] = D([]);
-  V(() => {
-    let r = !0;
-    async function c() {
-      try {
-        const e = await Promise.all(
-          i.map(async (t) => {
-            try {
-              const n = t.language || "zh", o = t.type === "srt" ? await q(t.content, n) : await K(t.content, n);
-              return {
-                entries: JSON.parse(o),
-                label: t.label
-              };
-            } catch (n) {
-              return console.error("字幕解析失败:", n), {
-                entries: t.type === "srt" ? w(t.content) : v(t.content),
-                label: t.label
-              };
-            }
-          })
-        );
-        r && b(e);
-      } catch (e) {
-        if (console.error("加载字幕失败:", e), r) {
-          const t = i.map((n) => {
-            try {
-              return {
-                entries: n.type === "srt" ? w(n.content) : v(n.content),
-                label: n.label
-              };
-            } catch (o) {
-              return console.error("字幕解析失败:", o), {
-                entries: [],
-                label: n.label
-              };
-            }
-          });
-          b(t);
-        }
-      }
-    }
-    return c(), () => {
-      r = !1;
-    };
-  }, [i]);
-  const g = h(() => R.length > 0 ? R : i.map((r) => {
-    try {
-      return {
-        entries: r.type === "srt" ? w(r.content) : v(r.content),
-        label: r.label
-      };
-    } catch (c) {
-      return console.error("字幕解析失败:", c), {
-        entries: [],
-        label: r.label
-      };
-    }
-  }), [R, i]), W = h(() => g.map(({ entries: r, label: c }) => ({
-    entry: Y(r, f),
-    label: c,
-    entries: r
-    // 保留所有条目用于歌词模式
-  })), [g, f]), _ = h(() => {
-    const r = [];
-    g.forEach(({ entries: t, label: n }) => {
-      t.forEach((o) => {
-        r.push({
-          entry: o,
-          label: n,
-          startTime: J(o.startTime),
-          endTime: J(o.endTime)
-        });
-      });
-    }), r.sort((t, n) => t.startTime - n.startTime);
-    const c = [];
-    let e = [];
-    for (const t of r)
-      if (e.length === 0)
-        e.push(t);
-      else {
-        const n = e[e.length - 1];
-        t.startTime <= n.endTime ? e.push(t) : (c.push(e), e = [t]);
-      }
-    return e.length > 0 && c.push(e), c;
-  }, [g]), x = u(
-    (r, c) => {
-      const e = r.currentTarget.getBoundingClientRect(), t = l.current?.getBoundingClientRect(), n = t !== void 0 ? new DOMRect(
-        e.left - t.left,
-        e.top - t.top,
-        e.width,
-        e.height
-      ) : e, o = {
-        ...c,
-        rect: n,
-        element: r.currentTarget
-      };
-      M(o), a?.(o);
-    },
-    [a]
-  ), B = u(() => {
-    M(null), a?.(null);
-  }, [a]), C = u(
-    (r, c) => {
-      if (!y) return;
-      r.stopPropagation();
-      const e = r.currentTarget.getBoundingClientRect(), t = l.current?.getBoundingClientRect(), n = t !== void 0 ? new DOMRect(
-        e.left - t.left,
-        e.top - t.top,
-        e.width,
-        e.height
-      ) : e, o = {
-        type: "word",
-        ...c,
-        rect: n,
-        element: r.currentTarget
-      };
-      y(o);
-    },
-    [y]
-  ), N = u(
-    (r, c, e) => {
-      if (!T || r.target.closest(".xiping-subtitle-word"))
-        return;
-      const n = r.currentTarget.getBoundingClientRect(), o = l.current?.getBoundingClientRect(), k = o !== void 0 ? new DOMRect(
-        n.left - o.left,
-        n.top - o.top,
-        n.width,
-        n.height
-      ) : n, z = {
-        type: "subtitle",
-        entry: c,
-        label: e,
-        rect: k,
-        element: r.currentTarget
-      };
-      T(z);
-    },
-    [T]
-  ), O = u(
-    (r, c) => (e, t, n) => ({
-      onMouseEnter: (o) => x(o, {
-        word: e,
-        wordIndex: t,
-        lineIndex: n,
-        entry: r,
-        label: c
-      }),
-      onMouseLeave: B,
-      onClick: (o) => C(o, {
-        word: e,
-        wordIndex: t,
-        lineIndex: n,
-        entry: r,
-        label: c
-      })
-    }),
-    [x, B, C]
-  ), P = d && s ? /* @__PURE__ */ S(
-    "div",
-    {
-      className: "xiping-subtitle-player__hover-overlay",
-      style: {
-        left: s.rect.x + s.rect.width / 2,
-        top: s.rect.y + s.rect.height
-      },
-      children: d(s)
-    }
-  ) : null, j = !!(d || a);
-  return /* @__PURE__ */ F(
-    "div",
-    {
-      ref: l,
-      className: Q(
-        "xiping-subtitle-player",
-        m === "lyrics" ? "xiping-subtitle-player--lyrics" : "xiping-subtitle-player--current",
-        L
-      ),
-      style: A,
-      children: [
-        m === "current" && /* @__PURE__ */ S(
-          U,
-          {
-            currentEntries: W,
-            wordHoverFactory: O,
-            enableWordHover: j,
-            overlayNode: P,
-            onSubtitleClick: N,
-            textAlign: E
-          }
-        ),
-        m === "lyrics" && /* @__PURE__ */ S(
-          X,
-          {
-            groupedEntriesByTime: _,
-            currentTime: f,
-            wordHoverFactory: O,
-            enableWordHover: j,
-            overlayNode: P,
-            containerRef: l,
-            onSubtitleClick: N,
-            textAlign: E
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  ct as SubtitlePlayer
-};

package/dist/es/components/text-animate/TextAnimate.js

@@ -1,310 +0,0 @@
-"use client";
-import { jsx as r } from "react/jsx-runtime";
-import { motion as y, AnimatePresence as w } from "motion/react";
-import u from "clsx";
-import './TextAnimate.css';/* empty css                */
-const s = {
-  text: 0.06,
-  word: 0.05,
-  character: 0.03,
-  line: 0.06
-}, i = {
-  hidden: { opacity: 1 },
-  show: {
-    opacity: 1,
-    transition: {
-      staggerChildren: 0.05
-    }
-  },
-  exit: {
-    opacity: 0,
-    transition: {
-      staggerChildren: 0.05,
-      staggerDirection: -1
-    }
-  }
-}, b = {
-  hidden: { opacity: 0 },
-  show: {
-    opacity: 1
-  },
-  exit: {
-    opacity: 0
-  }
-}, o = {
-  fadeIn: {
-    container: i,
-    item: {
-      hidden: { opacity: 0, y: 20 },
-      show: (t) => ({
-        opacity: 1,
-        y: 0,
-        transition: {
-          delay: t,
-          duration: 0.3
-        }
-      }),
-      exit: {
-        opacity: 0,
-        y: 20,
-        transition: { duration: 0.3 }
-      }
-    }
-  },
-  blurIn: {
-    container: i,
-    item: {
-      hidden: { opacity: 0, filter: "blur(10px)" },
-      show: (t) => ({
-        opacity: 1,
-        filter: "blur(0px)",
-        transition: {
-          delay: t * 0.1,
-          duration: 0.3
-        }
-      }),
-      exit: {
-        opacity: 0,
-        filter: "blur(10px)",
-        transition: { duration: 0.3 }
-      }
-    }
-  },
-  blurInUp: {
-    container: i,
-    item: {
-      hidden: { opacity: 0, filter: "blur(10px)", y: 20 },
-      show: (t) => ({
-        opacity: 1,
-        filter: "blur(0px)",
-        y: 0,
-        transition: {
-          y: { duration: 0.3 },
-          opacity: { duration: 0.4 },
-          filter: { duration: 0.3 }
-        }
-      }),
-      exit: {
-        opacity: 0,
-        filter: "blur(10px)",
-        y: 20,
-        transition: {
-          y: { duration: 0.3 },
-          opacity: { duration: 0.4 },
-          filter: { duration: 0.3 }
-        }
-      }
-    }
-  },
-  blurInDown: {
-    container: i,
-    item: {
-      hidden: { opacity: 0, filter: "blur(10px)", y: -20 },
-      show: (t) => ({
-        opacity: 1,
-        filter: "blur(0px)",
-        y: 0,
-        transition: {
-          y: { duration: 0.3 },
-          opacity: { duration: 0.4 },
-          filter: { duration: 0.3 }
-        }
-      })
-    }
-  },
-  slideUp: {
-    container: i,
-    item: {
-      hidden: { y: 20, opacity: 0 },
-      show: (t) => ({
-        y: 0,
-        opacity: 1,
-        transition: {
-          delay: t,
-          duration: 0.3
-        }
-      }),
-      exit: {
-        y: -20,
-        opacity: 0,
-        transition: {
-          duration: 0.3
-        }
-      }
-    }
-  },
-  slideDown: {
-    container: i,
-    item: {
-      hidden: { y: -20, opacity: 0 },
-      show: {
-        y: 0,
-        opacity: 1,
-        transition: { duration: 0.3 }
-      },
-      exit: {
-        y: 20,
-        opacity: 0,
-        transition: { duration: 0.3 }
-      }
-    }
-  },
-  slideLeft: {
-    container: i,
-    item: {
-      hidden: { x: 20, opacity: 0 },
-      show: {
-        x: 0,
-        opacity: 1,
-        transition: { duration: 0.3 }
-      },
-      exit: {
-        x: -20,
-        opacity: 0,
-        transition: { duration: 0.3 }
-      }
-    }
-  },
-  slideRight: {
-    container: i,
-    item: {
-      hidden: { x: -20, opacity: 0 },
-      show: {
-        x: 0,
-        opacity: 1,
-        transition: { duration: 0.3 }
-      },
-      exit: {
-        x: 20,
-        opacity: 0,
-        transition: { duration: 0.3 }
-      }
-    }
-  },
-  scaleUp: {
-    container: i,
-    item: {
-      hidden: { scale: 0.5, opacity: 0 },
-      show: {
-        scale: 1,
-        opacity: 1,
-        transition: {
-          duration: 0.3,
-          scale: {
-            type: "spring",
-            damping: 15,
-            stiffness: 300
-          }
-        }
-      },
-      exit: {
-        scale: 0.5,
-        opacity: 0,
-        transition: { duration: 0.3 }
-      }
-    }
-  },
-  scaleDown: {
-    container: i,
-    item: {
-      hidden: { scale: 1.5, opacity: 0 },
-      show: (t) => ({
-        scale: 1,
-        opacity: 1,
-        transition: {
-          delay: t,
-          duration: 0.3,
-          scale: {
-            type: "spring",
-            damping: 15,
-            stiffness: 300
-          }
-        }
-      }),
-      exit: {
-        scale: 1.5,
-        opacity: 0,
-        transition: { duration: 0.3 }
-      }
-    }
-  }
-};
-function $({
-  children: t,
-  delay: I = 0,
-  duration: C = 0.3,
-  variants: v,
-  className: x,
-  segmentClassName: h,
-  as: m = "p",
-  startOnView: c = !0,
-  once: D = !1,
-  by: n = "word",
-  animation: a = "fadeIn",
-  ...f
-}) {
-  const g = y.create(m), d = a ? {
-    container: {
-      ...o[a].container,
-      show: {
-        ...o[a].container.show,
-        transition: {
-          staggerChildren: s[n]
-        }
-      },
-      exit: {
-        ...o[a].container.exit,
-        transition: {
-          staggerChildren: s[n],
-          staggerDirection: -1
-        }
-      }
-    },
-    item: o[a].item
-  } : { container: i, item: b };
-  let e = [];
-  switch (n) {
-    case "word":
-      e = t.split(/(\s+)/);
-      break;
-    case "character":
-      e = t.split("");
-      break;
-    case "line":
-      e = t.split(`
-`);
-      break;
-    default:
-      e = [t];
-      break;
-  }
-  return /* @__PURE__ */ r(w, { mode: "popLayout", children: /* @__PURE__ */ r(
-    g,
-    {
-      variants: d.container,
-      initial: "hidden",
-      whileInView: c ? "show" : void 0,
-      animate: c ? void 0 : "show",
-      exit: "exit",
-      className: u("xiping-text-animate", x),
-      ...f,
-      children: e.map((p, l) => /* @__PURE__ */ r(
-        y.span,
-        {
-          variants: d.item,
-          custom: l * s[n],
-          className: u(
-            "xiping-text-animate-segment",
-            n === "line" && "xiping-text-animate-segment--line",
-            h
-          ),
-          children: p
-        },
-        `${n}-${p}-${l}`
-      ))
-    }
-  ) });
-}
-export {
-  $ as TextAnimate
-};

package/dist/es/components/text-type/TextType.js

@@ -1,121 +0,0 @@
-"use client";
-import { jsx as b } from "react/jsx-runtime";
-import { useState as o, useRef as k, useMemo as U, useCallback as V, useEffect as I, createElement as W } from "react";
-import { gsap as q } from "gsap";
-import X from "clsx";
-import './TextType.css';/* empty css             */
-const ee = ({
-  text: u,
-  as: v = "div",
-  typingSpeed: f = 50,
-  initialDelay: _ = 0,
-  pauseDuration: h = 2e3,
-  deletingSpeed: A = 30,
-  loop: R = !0,
-  className: w = "",
-  showCursor: T = !0,
-  hideCursorWhileTyping: z = !1,
-  cursorCharacter: F = "|",
-  cursorClassName: G = "",
-  cursorBlinkDuration: E = 0.5,
-  textColors: g = [],
-  variableSpeed: c,
-  onSentenceComplete: d,
-  startOnVisible: p = !1,
-  reverseMode: N = !1,
-  ...J
-}) => {
-  const [l, j] = o(""), [i, C] = o(0), [a, H] = o(!1), [t, K] = o(0), [M, L] = o(!p), m = k(null), y = k(null), r = U(() => Array.isArray(u) ? u : [u], [u]), O = V(() => {
-    if (!c) return f;
-    const { min: e, max: n } = c;
-    return Math.random() * (n - e) + e;
-  }, [c, f]), P = () => {
-    if (g.length !== 0)
-      return g[t % g.length];
-  };
-  I(() => {
-    if (!p || !y.current) return;
-    const e = new IntersectionObserver(
-      (n) => {
-        n.forEach((x) => {
-          x.isIntersecting && L(!0);
-        });
-      },
-      { threshold: 0.1 }
-    );
-    return e.observe(y.current), () => e.disconnect();
-  }, [p]), I(() => {
-    T && m.current && (q.set(m.current, { opacity: 1 }), q.to(m.current, {
-      opacity: 0,
-      duration: E,
-      repeat: -1,
-      yoyo: !0,
-      ease: "power2.inOut"
-    }));
-  }, [T, E]), I(() => {
-    if (!M) return;
-    let e;
-    const n = r[t], x = N ? n.split("").reverse().join("") : n, $ = () => {
-      if (a)
-        if (l === "") {
-          if (H(!1), t === r.length - 1 && !R)
-            return;
-          d && d(r[t], t), K((s) => (s + 1) % r.length), C(0), e = setTimeout(() => {
-          }, h);
-        } else
-          e = setTimeout(() => {
-            j((s) => s.slice(0, -1));
-          }, A);
-      else
-        i < x.length ? e = setTimeout(
-          () => {
-            j((s) => s + x[i]), C((s) => s + 1);
-          },
-          c ? O() : f
-        ) : r.length > 1 && (e = setTimeout(() => {
-          H(!0);
-        }, h));
-    };
-    return i === 0 && !a && l === "" ? e = setTimeout($, _) : $(), () => clearTimeout(e);
-  }, [
-    i,
-    l,
-    a,
-    f,
-    A,
-    h,
-    r,
-    t,
-    R,
-    _,
-    M,
-    N,
-    c,
-    d
-  ]);
-  const Q = z && (i < r[t].length || a);
-  return W(
-    v,
-    {
-      ref: y,
-      className: `xiping-text-type ${w}`,
-      ...J
-    },
-    /* @__PURE__ */ b("span", { className: "xiping-text-type__content", style: { color: P() || "inherit" }, children: l }),
-    T && /* @__PURE__ */ b(
-      "span",
-      {
-        ref: m,
-        className: X(
-          "xiping-text-type__cursor",
-          G,
-          Q && "xiping-text-type__cursor--hidden"
-        ),
-        children: F
-      }
-    )
-  );
-};
-export {
-  ee as default
-};

package/dist/es/components/txt-reader/index.module.css.js

@@ -1,10 +0,0 @@
-import './index.module.css';const t = {
-  "xiping-top-progress": "_xiping-top-progress_rkm9f_23",
-  "xiping-container": "_xiping-container_rkm9f_33",
-  "xiping-content": "_xiping-content_rkm9f_41",
-  "xiping-bottom-progress": "_xiping-bottom-progress_rkm9f_48",
-  "xiping-text-content": "_xiping-text-content_rkm9f_63"
-};
-export {
-  t as default
-};