react-lrcplayer
Version:
React 带歌词的简易播放器
702 lines (699 loc) • 24.2 kB
JavaScript
import $e, { useState as oe, useEffect as vr } from "react";
var G = { exports: {} }, Y = {};
/**
* @license React
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var Ae;
function pr() {
if (Ae) return Y;
Ae = 1;
var O = $e, b = Symbol.for("react.element"), _ = Symbol.for("react.fragment"), f = Object.prototype.hasOwnProperty, T = O.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, y = { key: !0, ref: !0, __self: !0, __source: !0 };
function g(E, s, j) {
var v, R = {}, w = null, A = null;
j !== void 0 && (w = "" + j), s.key !== void 0 && (w = "" + s.key), s.ref !== void 0 && (A = s.ref);
for (v in s) f.call(s, v) && !y.hasOwnProperty(v) && (R[v] = s[v]);
if (E && E.defaultProps) for (v in s = E.defaultProps, s) R[v] === void 0 && (R[v] = s[v]);
return { $$typeof: b, type: E, key: w, ref: A, props: R, _owner: T.current };
}
return Y.Fragment = _, Y.jsx = g, Y.jsxs = g, Y;
}
var M = {};
/**
* @license React
* react-jsx-runtime.development.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var De;
function yr() {
return De || (De = 1, process.env.NODE_ENV !== "production" && (function() {
var O = $e, b = Symbol.for("react.element"), _ = Symbol.for("react.portal"), f = Symbol.for("react.fragment"), T = Symbol.for("react.strict_mode"), y = Symbol.for("react.profiler"), g = Symbol.for("react.provider"), E = Symbol.for("react.context"), s = Symbol.for("react.forward_ref"), j = Symbol.for("react.suspense"), v = Symbol.for("react.suspense_list"), R = Symbol.for("react.memo"), w = Symbol.for("react.lazy"), A = Symbol.for("react.offscreen"), U = Symbol.iterator, z = "@@iterator";
function X(e) {
if (e === null || typeof e != "object")
return null;
var r = U && e[U] || e[z];
return typeof r == "function" ? r : null;
}
var C = O.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
function p(e) {
{
for (var r = arguments.length, t = new Array(r > 1 ? r - 1 : 0), n = 1; n < r; n++)
t[n - 1] = arguments[n];
H("error", e, t);
}
}
function H(e, r, t) {
{
var n = C.ReactDebugCurrentFrame, o = n.getStackAddendum();
o !== "" && (r += "%s", t = t.concat([o]));
var l = t.map(function(i) {
return String(i);
});
l.unshift("Warning: " + r), Function.prototype.apply.call(console[e], console, l);
}
}
var L = !1, le = !1, D = !1, V = !1, Le = !1, se;
se = Symbol.for("react.module.reference");
function Ne(e) {
return !!(typeof e == "string" || typeof e == "function" || e === f || e === y || Le || e === T || e === j || e === v || V || e === A || L || le || D || typeof e == "object" && e !== null && (e.$$typeof === w || e.$$typeof === R || e.$$typeof === g || e.$$typeof === E || e.$$typeof === s || // This needs to include all possible module reference object
// types supported by any Flight configuration anywhere since
// we don't know which Flight build this will end up being used
// with.
e.$$typeof === se || e.getModuleId !== void 0));
}
function We(e, r, t) {
var n = e.displayName;
if (n)
return n;
var o = r.displayName || r.name || "";
return o !== "" ? t + "(" + o + ")" : t;
}
function ue(e) {
return e.displayName || "Context";
}
function S(e) {
if (e == null)
return null;
if (typeof e.tag == "number" && p("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
return e.displayName || e.name || null;
if (typeof e == "string")
return e;
switch (e) {
case f:
return "Fragment";
case _:
return "Portal";
case y:
return "Profiler";
case T:
return "StrictMode";
case j:
return "Suspense";
case v:
return "SuspenseList";
}
if (typeof e == "object")
switch (e.$$typeof) {
case E:
var r = e;
return ue(r) + ".Consumer";
case g:
var t = e;
return ue(t._context) + ".Provider";
case s:
return We(e, e.render, "ForwardRef");
case R:
var n = e.displayName || null;
return n !== null ? n : S(e.type) || "Memo";
case w: {
var o = e, l = o._payload, i = o._init;
try {
return S(i(l));
} catch {
return null;
}
}
}
return null;
}
var P = Object.assign, N = 0, ce, fe, de, ve, pe, ye, he;
function _e() {
}
_e.__reactDisabledLog = !0;
function Ye() {
{
if (N === 0) {
ce = console.log, fe = console.info, de = console.warn, ve = console.error, pe = console.group, ye = console.groupCollapsed, he = console.groupEnd;
var e = {
configurable: !0,
enumerable: !0,
value: _e,
writable: !0
};
Object.defineProperties(console, {
info: e,
log: e,
warn: e,
error: e,
group: e,
groupCollapsed: e,
groupEnd: e
});
}
N++;
}
}
function Me() {
{
if (N--, N === 0) {
var e = {
configurable: !0,
enumerable: !0,
writable: !0
};
Object.defineProperties(console, {
log: P({}, e, {
value: ce
}),
info: P({}, e, {
value: fe
}),
warn: P({}, e, {
value: de
}),
error: P({}, e, {
value: ve
}),
group: P({}, e, {
value: pe
}),
groupCollapsed: P({}, e, {
value: ye
}),
groupEnd: P({}, e, {
value: he
})
});
}
N < 0 && p("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
}
}
var Z = C.ReactCurrentDispatcher, Q;
function J(e, r, t) {
{
if (Q === void 0)
try {
throw Error();
} catch (o) {
var n = o.stack.trim().match(/\n( *(at )?)/);
Q = n && n[1] || "";
}
return `
` + Q + e;
}
}
var ee = !1, q;
{
var Ue = typeof WeakMap == "function" ? WeakMap : Map;
q = new Ue();
}
function ge(e, r) {
if (!e || ee)
return "";
{
var t = q.get(e);
if (t !== void 0)
return t;
}
var n;
ee = !0;
var o = Error.prepareStackTrace;
Error.prepareStackTrace = void 0;
var l;
l = Z.current, Z.current = null, Ye();
try {
if (r) {
var i = function() {
throw Error();
};
if (Object.defineProperty(i.prototype, "props", {
set: function() {
throw Error();
}
}), typeof Reflect == "object" && Reflect.construct) {
try {
Reflect.construct(i, []);
} catch (m) {
n = m;
}
Reflect.construct(e, [], i);
} else {
try {
i.call();
} catch (m) {
n = m;
}
e.call(i.prototype);
}
} else {
try {
throw Error();
} catch (m) {
n = m;
}
e();
}
} catch (m) {
if (m && n && typeof m.stack == "string") {
for (var a = m.stack.split(`
`), h = n.stack.split(`
`), u = a.length - 1, d = h.length - 1; u >= 1 && d >= 0 && a[u] !== h[d]; )
d--;
for (; u >= 1 && d >= 0; u--, d--)
if (a[u] !== h[d]) {
if (u !== 1 || d !== 1)
do
if (u--, d--, d < 0 || a[u] !== h[d]) {
var x = `
` + a[u].replace(" at new ", " at ");
return e.displayName && x.includes("<anonymous>") && (x = x.replace("<anonymous>", e.displayName)), typeof e == "function" && q.set(e, x), x;
}
while (u >= 1 && d >= 0);
break;
}
}
} finally {
ee = !1, Z.current = l, Me(), Error.prepareStackTrace = o;
}
var $ = e ? e.displayName || e.name : "", k = $ ? J($) : "";
return typeof e == "function" && q.set(e, k), k;
}
function Ve(e, r, t) {
return ge(e, !1);
}
function Je(e) {
var r = e.prototype;
return !!(r && r.isReactComponent);
}
function B(e, r, t) {
if (e == null)
return "";
if (typeof e == "function")
return ge(e, Je(e));
if (typeof e == "string")
return J(e);
switch (e) {
case j:
return J("Suspense");
case v:
return J("SuspenseList");
}
if (typeof e == "object")
switch (e.$$typeof) {
case s:
return Ve(e.render);
case R:
return B(e.type, r, t);
case w: {
var n = e, o = n._payload, l = n._init;
try {
return B(l(o), r, t);
} catch {
}
}
}
return "";
}
var W = Object.prototype.hasOwnProperty, me = {}, be = C.ReactDebugCurrentFrame;
function K(e) {
if (e) {
var r = e._owner, t = B(e.type, e._source, r ? r.type : null);
be.setExtraStackFrame(t);
} else
be.setExtraStackFrame(null);
}
function qe(e, r, t, n, o) {
{
var l = Function.call.bind(W);
for (var i in e)
if (l(e, i)) {
var a = void 0;
try {
if (typeof e[i] != "function") {
var h = Error((n || "React class") + ": " + t + " type `" + i + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[i] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
throw h.name = "Invariant Violation", h;
}
a = e[i](r, i, n, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
} catch (u) {
a = u;
}
a && !(a instanceof Error) && (K(o), p("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", n || "React class", t, i, typeof a), K(null)), a instanceof Error && !(a.message in me) && (me[a.message] = !0, K(o), p("Failed %s type: %s", t, a.message), K(null));
}
}
}
var Be = Array.isArray;
function re(e) {
return Be(e);
}
function Ke(e) {
{
var r = typeof Symbol == "function" && Symbol.toStringTag, t = r && e[Symbol.toStringTag] || e.constructor.name || "Object";
return t;
}
}
function Ge(e) {
try {
return Ee(e), !1;
} catch {
return !0;
}
}
function Ee(e) {
return "" + e;
}
function Re(e) {
if (Ge(e))
return p("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Ke(e)), Ee(e);
}
var xe = C.ReactCurrentOwner, ze = {
key: !0,
ref: !0,
__self: !0,
__source: !0
}, Te, je;
function Xe(e) {
if (W.call(e, "ref")) {
var r = Object.getOwnPropertyDescriptor(e, "ref").get;
if (r && r.isReactWarning)
return !1;
}
return e.ref !== void 0;
}
function He(e) {
if (W.call(e, "key")) {
var r = Object.getOwnPropertyDescriptor(e, "key").get;
if (r && r.isReactWarning)
return !1;
}
return e.key !== void 0;
}
function Ze(e, r) {
typeof e.ref == "string" && xe.current;
}
function Qe(e, r) {
{
var t = function() {
Te || (Te = !0, p("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
};
t.isReactWarning = !0, Object.defineProperty(e, "key", {
get: t,
configurable: !0
});
}
}
function er(e, r) {
{
var t = function() {
je || (je = !0, p("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
};
t.isReactWarning = !0, Object.defineProperty(e, "ref", {
get: t,
configurable: !0
});
}
}
var rr = function(e, r, t, n, o, l, i) {
var a = {
// This tag allows us to uniquely identify this as a React Element
$$typeof: b,
// Built-in properties that belong on the element
type: e,
key: r,
ref: t,
props: i,
// Record the component responsible for creating this element.
_owner: l
};
return a._store = {}, Object.defineProperty(a._store, "validated", {
configurable: !1,
enumerable: !1,
writable: !0,
value: !1
}), Object.defineProperty(a, "_self", {
configurable: !1,
enumerable: !1,
writable: !1,
value: n
}), Object.defineProperty(a, "_source", {
configurable: !1,
enumerable: !1,
writable: !1,
value: o
}), Object.freeze && (Object.freeze(a.props), Object.freeze(a)), a;
};
function tr(e, r, t, n, o) {
{
var l, i = {}, a = null, h = null;
t !== void 0 && (Re(t), a = "" + t), He(r) && (Re(r.key), a = "" + r.key), Xe(r) && (h = r.ref, Ze(r, o));
for (l in r)
W.call(r, l) && !ze.hasOwnProperty(l) && (i[l] = r[l]);
if (e && e.defaultProps) {
var u = e.defaultProps;
for (l in u)
i[l] === void 0 && (i[l] = u[l]);
}
if (a || h) {
var d = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
a && Qe(i, d), h && er(i, d);
}
return rr(e, a, h, o, n, xe.current, i);
}
}
var te = C.ReactCurrentOwner, we = C.ReactDebugCurrentFrame;
function I(e) {
if (e) {
var r = e._owner, t = B(e.type, e._source, r ? r.type : null);
we.setExtraStackFrame(t);
} else
we.setExtraStackFrame(null);
}
var ne;
ne = !1;
function ae(e) {
return typeof e == "object" && e !== null && e.$$typeof === b;
}
function Oe() {
{
if (te.current) {
var e = S(te.current.type);
if (e)
return `
Check the render method of \`` + e + "`.";
}
return "";
}
}
function nr(e) {
return "";
}
var Ce = {};
function ar(e) {
{
var r = Oe();
if (!r) {
var t = typeof e == "string" ? e : e.displayName || e.name;
t && (r = `
Check the top-level render call using <` + t + ">.");
}
return r;
}
}
function Se(e, r) {
{
if (!e._store || e._store.validated || e.key != null)
return;
e._store.validated = !0;
var t = ar(r);
if (Ce[t])
return;
Ce[t] = !0;
var n = "";
e && e._owner && e._owner !== te.current && (n = " It was passed a child from " + S(e._owner.type) + "."), I(e), p('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', t, n), I(null);
}
}
function Pe(e, r) {
{
if (typeof e != "object")
return;
if (re(e))
for (var t = 0; t < e.length; t++) {
var n = e[t];
ae(n) && Se(n, r);
}
else if (ae(e))
e._store && (e._store.validated = !0);
else if (e) {
var o = X(e);
if (typeof o == "function" && o !== e.entries)
for (var l = o.call(e), i; !(i = l.next()).done; )
ae(i.value) && Se(i.value, r);
}
}
}
function ir(e) {
{
var r = e.type;
if (r == null || typeof r == "string")
return;
var t;
if (typeof r == "function")
t = r.propTypes;
else if (typeof r == "object" && (r.$$typeof === s || // Note: Memo only checks outer props here.
// Inner props are checked in the reconciler.
r.$$typeof === R))
t = r.propTypes;
else
return;
if (t) {
var n = S(r);
qe(t, e.props, "prop", n, e);
} else if (r.PropTypes !== void 0 && !ne) {
ne = !0;
var o = S(r);
p("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", o || "Unknown");
}
typeof r.getDefaultProps == "function" && !r.getDefaultProps.isReactClassApproved && p("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
}
}
function or(e) {
{
for (var r = Object.keys(e.props), t = 0; t < r.length; t++) {
var n = r[t];
if (n !== "children" && n !== "key") {
I(e), p("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", n), I(null);
break;
}
}
e.ref !== null && (I(e), p("Invalid attribute `ref` supplied to `React.Fragment`."), I(null));
}
}
var ke = {};
function Fe(e, r, t, n, o, l) {
{
var i = Ne(e);
if (!i) {
var a = "";
(e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (a += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
var h = nr();
h ? a += h : a += Oe();
var u;
e === null ? u = "null" : re(e) ? u = "array" : e !== void 0 && e.$$typeof === b ? (u = "<" + (S(e.type) || "Unknown") + " />", a = " Did you accidentally export a JSX literal instead of a component?") : u = typeof e, p("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", u, a);
}
var d = tr(e, r, t, o, l);
if (d == null)
return d;
if (i) {
var x = r.children;
if (x !== void 0)
if (n)
if (re(x)) {
for (var $ = 0; $ < x.length; $++)
Pe(x[$], e);
Object.freeze && Object.freeze(x);
} else
p("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
else
Pe(x, e);
}
if (W.call(r, "key")) {
var k = S(e), m = Object.keys(r).filter(function(dr) {
return dr !== "key";
}), ie = m.length > 0 ? "{key: someKey, " + m.join(": ..., ") + ": ...}" : "{key: someKey}";
if (!ke[k + ie]) {
var fr = m.length > 0 ? "{" + m.join(": ..., ") + ": ...}" : "{}";
p(`A props object containing a "key" prop is being spread into JSX:
let props = %s;
<%s {...props} />
React keys must be passed directly to JSX without using spread:
let props = %s;
<%s key={someKey} {...props} />`, ie, k, fr, k), ke[k + ie] = !0;
}
}
return e === f ? or(d) : ir(d), d;
}
}
function lr(e, r, t) {
return Fe(e, r, t, !0);
}
function sr(e, r, t) {
return Fe(e, r, t, !1);
}
var ur = sr, cr = lr;
M.Fragment = f, M.jsx = ur, M.jsxs = cr;
})()), M;
}
var Ie;
function hr() {
return Ie || (Ie = 1, process.env.NODE_ENV === "production" ? G.exports = pr() : G.exports = yr()), G.exports;
}
var c = hr();
const F = {
"nextlrc-container": "_nextlrc-container_hw62x_26",
"nextlrc-placeholder": "_nextlrc-placeholder_hw62x_32",
"lrcplayer-container": "_lrcplayer-container_hw62x_36",
"lrcplayer-display": "_lrcplayer-display_hw62x_41",
"lrcplayer-header": "_lrcplayer-header_hw62x_50",
"lrcplayer-title": "_lrcplayer-title_hw62x_59",
"lrcplayer-slide": "_lrcplayer-slide_hw62x_1",
"lrcplayer-fade": "_lrcplayer-fade_hw62x_1",
"lrcplayer-none": "_lrcplayer-none_hw62x_1"
};
function gr(O) {
const { src: b, cover: _, title: f = "", subTitle: T = "", lrc: y, placeholder: g = "空", animate: E = {
type: "lrcplayer-fade",
duration: 0.5
}, nextLrc: s = {
display: !1,
number: 5
}, offset: j = 0 } = O, [v, R] = oe(c.jsx(c.Fragment, {})), [w, A] = oe(c.jsx(c.Fragment, {})), [U, z] = oe(c.jsx(c.Fragment, {}));
vr(() => {
z(c.jsx("div", { className: F["lrcplayer-display"], style: {
animationName: F[E.type],
"--animate-duration": E.duration + "s"
}, children: v === "" ? c.jsx("i", { style: { color: "grey" }, children: g }) : v }, `lrcplayer-lrc_${Math.random()}`));
}, [v]);
const X = (C) => {
const { currentTime: p } = C.target;
y.forEach((H, L) => {
p >= y[L].t + j && (R(H.c), A(c.jsx("div", { className: F["nextlrc-container"], children: Array.from(new Array(s.number).keys()).map((D) => {
const V = L + 1 + D < y.length ? y[L + 1 + D].c : "";
return V === "" ? c.jsx("span", { className: F["nextlrc-placeholder"], children: g }, D) : c.jsx("span", { children: V }, D);
}) })));
});
};
return c.jsxs("div", { className: F["lrcplayer-container"], children: [c.jsxs("div", { className: F["lrcplayer-header"], children: [c.jsx("img", { src: _, width: 80, alt: "cover" }), c.jsxs("div", { children: [c.jsx("span", { className: F["lrcplayer-title"], children: f }), c.jsx("br", {}), c.jsx("span", { style: { color: "grey" }, children: T })] })] }), c.jsxs("div", { style: { textAlign: "center", paddingBlock: 15 }, children: [U, s.display ? c.jsx("div", { style: { color: "grey" }, children: w }) : ""] }), c.jsx("audio", { src: b, controls: !0, style: { width: "100%" }, onTimeUpdate: X })] });
}
function mr(O) {
let b = [];
if (O.length === 0)
return [];
var _ = O.split(`
`);
for (var f in _) {
_[f] = _[f].replace(/(^\s*)|(\s*$)/g, "");
var T = _[f].substring(_[f].indexOf("[") + 1, _[f].indexOf("]")), y = T.split(":");
if (isNaN(parseInt(y[0])))
for (var f in b)
f !== "ms" && f === y[0].toLowerCase() && (b[f] = y[1]);
else {
var g = _[f].match(/\[(\d+:.+?)\]/g), E = 0;
for (var s in g)
E += g[s].length;
var j = _[f].substring(E);
for (var s in g) {
var T = g[s].substring(1, g[s].length - 1), y = T.split(":");
b.push({
//对象{t:时间,c:歌词}加入ms数组
t: parseFloat(y[0]) * 60 + parseFloat(y[1]),
c: j
});
}
}
}
return b.sort(function(v, R) {
return v.t - R.t;
}), b;
}
export {
gr as LRCPlayer,
mr as createLrcObj
};