@golstats/gsc-table-scrollable 1.0.18 → 1.0.20

package/dist/gsc-table-scrollable.js

@@ -1,19 +1,19 @@
-import { useCssVars as J, ref as m, computed as V, watch as F, createElementBlock as n, openBlock as l, normalizeClass as _, createElementVNode as t, createCommentVNode as S, normalizeStyle as L, Fragment as I, toDisplayString as c, pushScopeId as z, popScopeId as E, onMounted as K, renderList as O, createVNode as H, createBlock as N, Transition as it, withCtx as lt, withDirectives as nt, createTextVNode as T, vShow as at, unref as G, createStaticVNode as dt } from "vue";
-const rt = (e, d) => {
-  const o = e.__vccOpts || e;
-  for (const [u, p] of d)
-    o[u] = p;
-  return o;
-}, ct = { key: 1 }, ut = {
+import { useCssVars as vt, ref as m, computed as O, watch as F, createElementBlock as r, openBlock as a, normalizeClass as x, createElementVNode as t, createCommentVNode as S, normalizeStyle as B, Fragment as P, toDisplayString as g, pushScopeId as q, popScopeId as U, onMounted as ht, renderList as W, onBeforeUnmount as Lt, createVNode as rt, createBlock as dt, Transition as Mt, withCtx as $t, withDirectives as Bt, createTextVNode as V, vShow as Et, unref as ct, nextTick as Rt } from "vue";
+const Tt = (s, f) => {
+  const l = s.__vccOpts || s;
+  for (const [v, C] of f)
+    l[v] = C;
+  return l;
+}, Pt = { key: 1 }, It = {
   width: "10",
   height: "8",
   viewBox: "0 0 10 8",
   fill: "none",
   xmlns: "http://www.w3.org/2000/svg"
-}, ht = ["fill"], ft = {
+}, Ot = ["fill"], Dt = {
   key: 0,
   class: "checkbox__teams"
-}, vt = { class: "checkbox__teams__logo" }, pt = ["src"], _t = { class: "checkbox__teams__logo" }, gt = ["src"], bt = {
+}, Vt = { class: "checkbox__teams__logo" }, Ft = ["src"], zt = { class: "checkbox__teams__logo" }, At = ["src"], jt = {
   __name: "GSC-Checkbox",
   props: {
     width: {
@@ -72,8 +72,8 @@ const rt = (e, d) => {
       type: String,
       default: "left",
       // values can be 'left', 'right', 'top', 'bottom'
-      validator(e) {
-        return ["left", "right", "top", "bottom"].includes(e);
+      validator(s) {
+        return ["left", "right", "top", "bottom"].includes(s);
       }
     },
     boxMarginTop: {
@@ -122,100 +122,100 @@ const rt = (e, d) => {
     }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: d }) {
-    const o = e;
-    J((f) => ({
-      "7bd9d47b": e.width,
-      "34dc7ddc": e.height
+  setup(s, { emit: f }) {
+    const l = s;
+    vt((_) => ({
+      "7bd9d47b": s.width,
+      "34dc7ddc": s.height
     }));
-    const u = m(!1), p = V(() => {
-      const f = {
-        color: o.boxValueColor,
-        "font-family": o.fontFamily,
-        height: o.boxWidthAndHeight,
-        width: o.boxWidthAndHeight,
-        minWidth: o.boxWidthAndHeight,
-        "border-radius": o.boxBorderRadius,
-        "margin-top": o.boxMarginTop
+    const v = m(!1), C = O(() => {
+      const _ = {
+        color: l.boxValueColor,
+        "font-family": l.fontFamily,
+        height: l.boxWidthAndHeight,
+        width: l.boxWidthAndHeight,
+        minWidth: l.boxWidthAndHeight,
+        "border-radius": l.boxBorderRadius,
+        "margin-top": l.boxMarginTop
       };
-      return u.value ? (f["background-color"] = o.boxBackgroundColor, f.border = `solid ${o.boxBorderWidth} ${o.boxBackgroundColor}`) : f.border = `solid ${o.boxBorderWidth} ${o.boxBorderColor}`, f;
-    }), h = V(() => ({
-      "font-family": o.boxValueFontFamily,
-      "font-size": o.boxValueFontSize,
-      color: o.boxValueColor,
+      return v.value ? (_["background-color"] = l.boxBackgroundColor, _.border = `solid ${l.boxBorderWidth} ${l.boxBackgroundColor}`) : _.border = `solid ${l.boxBorderWidth} ${l.boxBorderColor}`, _;
+    }), h = O(() => ({
+      "font-family": l.boxValueFontFamily,
+      "font-size": l.boxValueFontSize,
+      color: l.boxValueColor,
       "line-height": 1
-    })), y = V(() => {
-      const f = {
-        color: o.labelColor,
-        "font-family": o.fontFamily,
-        "font-size": o.labelFontSize,
-        "white-space": o.labelWhiteSpace,
-        "text-align": o.boxPosition === "top" || o.boxPosition === "bottom" ? "center" : o.boxPosition
+    })), L = O(() => {
+      const _ = {
+        color: l.labelColor,
+        "font-family": l.fontFamily,
+        "font-size": l.labelFontSize,
+        "white-space": l.labelWhiteSpace,
+        "text-align": l.boxPosition === "top" || l.boxPosition === "bottom" ? "center" : l.boxPosition
       };
-      return (o.boxPosition === "left" || o.boxPosition === "right") && (f[`margin-${o.boxPosition}`] = o.isBoxOnly ? "0" : o.teamsIds ? "8px" : "10px"), f;
+      return (l.boxPosition === "left" || l.boxPosition === "right") && (_[`margin-${l.boxPosition}`] = l.isBoxOnly ? "0" : l.teamsIds ? "8px" : "10px"), _;
     });
     F(
-      () => o.modelValue,
-      (f) => {
-        f !== u.value && (u.value = f);
+      () => l.modelValue,
+      (_) => {
+        _ !== v.value && (v.value = _);
       },
       { immediate: !0 }
     );
-    function $() {
-      o.avoidInteraction || !u.value && o.avoidToCheck || (u.value = !u.value, d("update:modelValue", u.value));
+    function E() {
+      l.avoidInteraction || !v.value && l.avoidToCheck || (v.value = !v.value, f("update:modelValue", v.value));
     }
-    function B(f) {
-      return `${{}.TEAM_LOGOS_URL || "https://golstatsimages.blob.core.windows.net/teams-80/"}${f}.png`;
+    function u(_) {
+      return `${{}.TEAM_LOGOS_URL || "https://golstatsimages.blob.core.windows.net/teams-80/"}${_}.png`;
     }
-    return (f, M) => (l(), n("div", {
-      class: _(["checkbox", `box-${e.boxPosition}`]),
-      onClick: $
+    return (_, z) => (a(), r("div", {
+      class: x(["checkbox", `box-${s.boxPosition}`]),
+      onClick: E
     }, [
       t("div", {
         class: "checkbox__box",
-        style: L(p.value)
+        style: B(C.value)
       }, [
-        u.value ? (l(), n(I, { key: 0 }, [
-          o.boxValue ? (l(), n("div", {
+        v.value ? (a(), r(P, { key: 0 }, [
+          l.boxValue ? (a(), r("div", {
             key: 0,
             class: "checkbox__box__value",
-            style: L(h.value)
-          }, c(e.boxValue), 5)) : (l(), n("div", ct, [
-            (l(), n("svg", ut, [
+            style: B(h.value)
+          }, g(s.boxValue), 5)) : (a(), r("div", Pt, [
+            (a(), r("svg", It, [
               t("path", {
                 d: "M9.77994 1.70133L4.10994 7.37133C3.96994 7.51133 3.77994 7.59133 3.57994 7.59133C3.37994 7.59133 3.18994 7.51133 3.04994 7.37133L0.219941 4.54133C-0.0700586 4.25133 -0.0700586 3.77133 0.219941 3.48133C0.509941 3.19133 0.989941 3.19133 1.27994 3.48133L3.57994 5.78133L8.71994 0.641328C9.00994 0.351328 9.48994 0.351328 9.77994 0.641328C10.0699 0.931328 10.0699 1.40133 9.77994 1.70133Z",
-                fill: e.boxValueColor
-              }, null, 8, ht)
+                fill: s.boxValueColor
+              }, null, 8, Ot)
             ]))
           ]))
         ], 64)) : S("", !0)
       ], 4),
-      e.teamsIds && e.teamsIds.length ? (l(), n("div", ft, [
-        t("div", vt, [
+      s.teamsIds && s.teamsIds.length ? (a(), r("div", Dt, [
+        t("div", Vt, [
           t("img", {
-            src: B(e.teamsIds[0]),
+            src: u(s.teamsIds[0]),
             alt: ""
-          }, null, 8, pt)
+          }, null, 8, Ft)
         ]),
-        t("div", _t, [
+        t("div", zt, [
           t("img", {
-            src: B(e.teamsIds[1]),
+            src: u(s.teamsIds[1]),
             alt: ""
-          }, null, 8, gt)
+          }, null, 8, At)
         ])
       ])) : S("", !0),
       t("div", {
         class: "checkbox__label",
-        style: L(y.value)
-      }, c(e.label), 5)
+        style: B(L.value)
+      }, g(s.label), 5)
     ], 2));
   }
-}, mt = /* @__PURE__ */ rt(bt, [["__scopeId", "data-v-b6f124d8"]]), Ct = (e, d) => {
-  const o = e.__vccOpts || e;
-  for (const [u, p] of d)
-    o[u] = p;
-  return o;
-}, A = {
+}, Wt = /* @__PURE__ */ Tt(jt, [["__scopeId", "data-v-b6f124d8"]]), Zt = (s, f) => {
+  const l = s.__vccOpts || s;
+  for (const [v, C] of f)
+    l[v] = C;
+  return l;
+}, J = {
   props: {
     type: { type: Number, default: 0 },
     value: { type: Boolean, default: !1 },
@@ -252,8 +252,8 @@ const rt = (e, d) => {
     value: {
       deep: !0,
       immediate: !0,
-      handler(e) {
-        this.status = e;
+      handler(s) {
+        this.status = s;
       }
     }
   },
@@ -285,79 +285,102 @@ const rt = (e, d) => {
     }
   },
   methods: {
-    btnClick(e) {
-      this.$emit("click", e), this.typeOnOff && (this.status = !this.status, this.$emit("status", this.status));
+    btnClick(s) {
+      this.$emit("click", s), this.typeOnOff && (this.status = !this.status, this.$emit("status", this.status));
     }
   }
-}, q = () => {
-  J((e) => ({
-    "9d01acb4": e.height,
-    "14e95081": e.borderWidthBtn,
-    "38fec285": e.borderType,
-    34353510: e.borderColor,
-    "20d20dc6": e.borderRadius,
-    17130967: e.width,
-    "4ccb7d36": e.backgroundColor,
-    "5d1e86a2": e.cursorType,
-    ce65d4a2: e.fontSize,
-    fe4ac47a: e.fontStyle,
-    f98e44dc: e.fontFamily,
-    "93b87770": e.marginLeftStat,
-    c7f7beba: e.fontSizeStat
+}, ut = () => {
+  vt((s) => ({
+    "9d01acb4": s.height,
+    "14e95081": s.borderWidthBtn,
+    "38fec285": s.borderType,
+    34353510: s.borderColor,
+    "20d20dc6": s.borderRadius,
+    17130967: s.width,
+    "4ccb7d36": s.backgroundColor,
+    "5d1e86a2": s.cursorType,
+    ce65d4a2: s.fontSize,
+    fe4ac47a: s.fontStyle,
+    f98e44dc: s.fontFamily,
+    "93b87770": s.marginLeftStat,
+    c7f7beba: s.fontSizeStat
   }));
-}, U = A.setup;
-A.setup = U ? (e, d) => (q(), U(e, d)) : q;
-const yt = (e) => (z("data-v-f3ee6b2b"), e = e(), E(), e), wt = ["src"], kt = {
+}, ft = J.setup;
+J.setup = ft ? (s, f) => (ut(), ft(s, f)) : ut;
+const Ht = (s) => (q("data-v-f3ee6b2b"), s = s(), U(), s), Gt = ["src"], Nt = {
   key: 1,
   class: "text"
-}, xt = ["src"], St = { class: "stats" }, Lt = /* @__PURE__ */ yt(() => /* @__PURE__ */ t("img", {
+}, qt = ["src"], Ut = { class: "stats" }, Jt = /* @__PURE__ */ Ht(() => /* @__PURE__ */ t("img", {
   class: "iconstats",
   src: "https://golstatsimages.blob.core.windows.net/todoelfut/playdes.png"
-}, null, -1)), $t = { class: "numstats" }, Bt = { class: "leyend" };
-function Mt(e, d, o, u, p, h) {
-  return l(), n("div", null, [
-    o.type == 0 ? (l(), n("div", {
+}, null, -1)), Xt = { class: "numstats" }, Kt = { class: "leyend" };
+function Qt(s, f, l, v, C, h) {
+  return a(), r("div", null, [
+    l.type == 0 ? (a(), r("div", {
       key: 0,
-      class: _(["button", p.status && o.typeOnOff && "button-active"]),
-      style: L([h.customStyle, p.status && o.typeOnOff && h.customActive]),
-      onClick: d[0] || (d[0] = (...y) => h.btnClick && h.btnClick(...y))
+      class: x(["button", C.status && l.typeOnOff && "button-active"]),
+      style: B([h.customStyle, C.status && l.typeOnOff && h.customActive]),
+      onClick: f[0] || (f[0] = (...L) => h.btnClick && h.btnClick(...L))
     }, [
-      o.icon && o.iconPosition.toLowerCase() === "left" ? (l(), n("img", {
+      l.icon && l.iconPosition.toLowerCase() === "left" ? (a(), r("img", {
         key: 0,
         class: "icon",
-        style: L({ width: o.iconSize }),
-        src: o.icon
-      }, null, 12, wt)) : S("", !0),
-      o.textValue ? (l(), n("div", kt, c(o.textValue), 1)) : S("", !0),
-      o.icon && o.iconPosition.toLowerCase() === "right" ? (l(), n("img", {
+        style: B({ width: l.iconSize }),
+        src: l.icon
+      }, null, 12, Gt)) : S("", !0),
+      l.textValue ? (a(), r("div", Nt, g(l.textValue), 1)) : S("", !0),
+      l.icon && l.iconPosition.toLowerCase() === "right" ? (a(), r("img", {
         key: 2,
         class: "icon",
-        style: L({ width: o.iconSize }),
-        src: o.icon
-      }, null, 12, xt)) : S("", !0)
+        style: B({ width: l.iconSize }),
+        src: l.icon
+      }, null, 12, qt)) : S("", !0)
     ], 6)) : S("", !0),
-    o.type == 1 ? (l(), n("div", {
+    l.type == 1 ? (a(), r("div", {
       key: 1,
       class: "button-target",
-      onClick: d[1] || (d[1] = (...y) => h.btnClick && h.btnClick(...y))
+      onClick: f[1] || (f[1] = (...L) => h.btnClick && h.btnClick(...L))
     }, [
-      t("div", St, [
-        Lt,
-        t("div", $t, c(o.textStat), 1)
+      t("div", Ut, [
+        Jt,
+        t("div", Xt, g(l.textStat), 1)
       ]),
-      t("div", Bt, c(o.textCategory), 1)
+      t("div", Kt, g(l.textCategory), 1)
     ])) : S("", !0)
   ]);
 }
-const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b"]]), Q = (e, d) => {
-  const o = e.__vccOpts || e;
-  for (const [u, p] of d)
-    o[u] = p;
-  return o;
-}, It = (e) => (z("data-v-d03b93c8"), e = e(), E(), e), Rt = {
+const Yt = /* @__PURE__ */ Zt(J, [["render", Qt], ["__scopeId", "data-v-f3ee6b2b"]]), pt = (s, f) => {
+  const l = s.__vccOpts || s;
+  for (const [v, C] of f)
+    l[v] = C;
+  return l;
+}, X = (s) => (q("data-v-df83603b"), s = s(), U(), s), te = {
   key: 0,
   class: "overlay"
-}, Tt = /* @__PURE__ */ It(() => /* @__PURE__ */ t("div", { class: "column-title-2" }, null, -1)), Ot = ["onClick"], Ft = {
+}, ee = ["onClick"], oe = /* @__PURE__ */ X(() => /* @__PURE__ */ t("svg", {
+  width: "11",
+  height: "12",
+  viewBox: "0 0 11 12",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, [
+  /* @__PURE__ */ t("path", {
+    d: "M7.50558 0C6.78112 0 6.10558 0.475441 5.89478 1.14401L1.21987 1.14286C0.904267 1.14286 0.648438 1.39886 0.648438 1.71429C0.648438 2.02972 0.904267 2.28572 1.21987 2.28572L5.89478 2.28516C6.15083 2.98516 6.78112 3.42858 7.50558 3.42858C8.23004 3.42858 8.86678 2.98402 9.1273 2.28059L10.3627 2.28572C10.6783 2.28572 10.9342 2.02972 10.9342 1.71429C10.9342 1.39886 10.6783 1.14286 10.3627 1.14286H9.12244C8.8473 0.446287 8.23004 0 7.50558 0ZM7.50558 1.14286C7.82118 1.14286 8.07701 1.39886 8.07701 1.71429C8.07701 2.02972 7.82118 2.28572 7.50558 2.28572C7.18998 2.28572 6.93415 2.02972 6.93415 1.71429C6.93415 1.39886 7.18998 1.14286 7.50558 1.14286ZM4.07701 4.28572C3.32387 4.28572 2.69347 4.7543 2.4633 5.42971C2.38295 5.43485 1.21987 5.42856 1.21987 5.42856C0.904267 5.42856 0.648438 5.68456 0.648438 5.99999C0.648438 6.31542 0.904267 6.57142 1.21987 6.57142C1.21987 6.57142 2.39267 6.55942 2.46575 6.56685C2.69593 7.24228 3.32387 7.71428 4.07701 7.71428C4.80146 7.71428 5.42226 7.27028 5.69381 6.57314L10.3627 6.57142C10.6783 6.57142 10.9342 6.31542 10.9342 5.99999C10.9342 5.68456 10.6783 5.42856 10.3627 5.42856L5.69083 5.42348C5.44038 4.74174 4.80146 4.28572 4.07701 4.28572ZM4.07701 5.42856C4.39261 5.42856 4.64844 5.68456 4.64844 5.99999C4.64844 6.31542 4.39261 6.57142 4.07701 6.57142C3.76141 6.57142 3.50558 6.31542 3.50558 5.99999C3.50558 5.68456 3.76141 5.42856 4.07701 5.42856ZM7.50558 8.57142C6.78112 8.57142 6.11844 9.04857 5.89438 9.70857L1.21987 9.71428C0.904267 9.71428 0.648438 9.97028 0.648438 10.2857C0.648438 10.6011 0.904267 10.8571 1.21987 10.8571L5.88592 10.8577C6.12301 11.5349 6.78112 12 7.50558 12C8.23004 12 8.85467 11.5469 9.12987 10.8577L10.3627 10.8571C10.6783 10.8571 10.9342 10.6011 10.9342 10.2857C10.9342 9.97028 10.6783 9.71428 10.3627 9.71428L9.12467 9.71091C8.87798 9.03491 8.23004 8.57142 7.50558 8.57142ZM7.50558 9.71428C7.82118 9.71428 8.07701 9.97028 8.07701 10.2857C8.07701 10.6011 7.82118 10.8571 7.50558 10.8571C7.18998 10.8571 6.93415 10.6011 6.93415 10.2857C6.93415 9.97028 7.18998 9.71428 7.50558 9.71428Z",
+    fill: "white"
+  })
+], -1)), se = [
+  oe
+], le = { class: "name" }, ie = ["onClick"], ne = /* @__PURE__ */ X(() => /* @__PURE__ */ t("g", {
+  opacity: ".5",
+  stroke: "#fff",
+  "stroke-width": "1.677",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, [
+  /* @__PURE__ */ t("path", { d: "M4.532 2.13v13.74M8.202 12.2l-3.67 3.669-3.669-3.67M12.919 15.87V2.132M16.589 5.802l-3.67-3.67-3.669 3.67" })
+], -1)), ae = [
+  ne
+], re = /* @__PURE__ */ X(() => /* @__PURE__ */ t("div", { class: "column-title-2" }, null, -1)), de = ["onClick"], ce = {
   __name: "ScrollColumns",
   props: {
     availablePlayers: {
@@ -369,71 +392,119 @@ const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b
       default: !1
     }
   },
-  emits: ["expand", "open-media"],
-  setup(e, { expose: d, emit: o }) {
-    const u = e, p = m(null), h = m(null), y = m(0);
+  emits: ["expand", "open-media", "click-parameters", "sort"],
+  setup(s, { expose: f, emit: l }) {
+    const v = s, C = m(null), h = m(null), L = m(0);
     m(!1);
-    const $ = V(() => {
-      const b = u.availablePlayers[0];
-      return b ? b.stats : [];
-    }), B = V(() => {
-      const b = `repeat(${$.value.length}, max-content) 36px`;
-      let v = "";
-      return y.value > 0 && document.querySelectorAll(".column-title-2").forEach((w) => {
-        v += `${w.offsetWidth}px `;
+    const E = O(() => {
+      const d = v.availablePlayers[0];
+      return d ? d.stats : [];
+    }), u = O(() => {
+      const d = `repeat(${E.value.length}, max-content) 36px`;
+      let b = "";
+      return L.value > 0 && document.querySelectorAll(".column-title-2").forEach((y) => {
+        b += `${y.offsetWidth}px `;
       }), {
-        "--grid-template-columns": b,
-        "--grid-template-columns-totals": v || b
+        "--grid-template-columns": d,
+        "--grid-template-columns-totals": b || d
       };
     });
-    function f() {
-      p.value = new ResizeObserver((b) => {
-        for (const v of b) {
-          const { width: C } = v.contentRect;
-          y.value = C;
+    function _() {
+      C.value = new ResizeObserver((d) => {
+        for (const b of d) {
+          const { width: p } = b.contentRect;
+          L.value = p;
         }
-      }), p.value.observe(h.value);
+      }), C.value.observe(h.value);
     }
-    function M(b, v) {
-      const w = document.querySelectorAll(".scrollable-row-totals")[b + 1];
-      w && (w.style.marginTop = `${v}px`);
+    function z(d, b) {
+      const y = document.querySelectorAll(".scrollable-row-totals")[d + 1];
+      y && (y.style.marginTop = `${b}px`);
     }
-    function R({ player: b, stat: v }) {
-      !v.total || v === "0%" || !v.seasons || !v.seasons.length || o("open-media", { ...b, stat: v });
+    function I({ player: d, stat: b }) {
+      !b.total || b === "0%" || !b.seasons || !b.seasons.length || l("open-media", { ...d, stat: b });
     }
-    return K(() => {
-      f();
-    }), d({
-      setMarginTopDetails: M
-    }), (b, v) => (l(), n("div", {
+    function Z(d) {
+      !d || d === "no" || l("click-parameters", d);
+    }
+    function D(d) {
+      l("sort", d);
+    }
+    return ht(() => {
+      _();
+    }), f({
+      setMarginTopDetails: z
+    }), (d, b) => (a(), r("div", {
       class: "scroll-columns",
-      style: L(B.value)
+      style: B(u.value)
     }, [
-      e.isEditMode ? (l(), n("div", Rt)) : S("", !0),
+      s.isEditMode ? (a(), r("div", te)) : S("", !0),
       t("div", {
         ref_key: "titlesRow",
         ref: h,
         class: "scrollable-row-2"
       }, [
-        (l(!0), n(I, null, O($.value, (C) => (l(), n("div", {
-          key: `t-${C.category_id}`,
+        (a(!0), r(P, null, W(E.value, (p, y) => (a(), r("div", {
+          key: `t-${y}`,
           class: "column-title-2"
-        }, c(C.name), 1))), 128)),
-        Tt
+        }, [
+          p.parameters && p.parameters !== "no" ? (a(), r("div", {
+            key: 0,
+            class: "parameters",
+            role: "button",
+            onClick: (M) => Z(p.parameters)
+          }, se, 8, ee)) : S("", !0),
+          t("div", le, g(p.name), 1),
+          (a(), r("svg", {
+            width: "18",
+            height: "18",
+            viewBox: "0 0 18 18",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg",
+            onClick: (M) => D(p)
+          }, ae, 8, ie))
+        ]))), 128)),
+        re
       ], 512),
-      (l(!0), n(I, null, O(e.availablePlayers, (C, w) => (l(), n("div", {
-        key: `i-${C.id}`,
+      (a(!0), r(P, null, W(s.availablePlayers, (p, y) => (a(), r("div", {
+        key: `i-${p.id}`,
         class: "row scrollable-row-totals"
       }, [
-        (l(!0), n(I, null, O(C.stats, (k) => (l(), n("div", {
-          key: k.category_id,
-          class: _(["row data-info", { odd: w % 2 !== 0, underline: !!k.total && k.total !== "0%" && k.seasons && k.seasons.length }]),
-          onClick: (W) => R({ player: C, stat: k })
-        }, c(k.total), 11, Ot))), 128))
+        (a(!0), r(P, null, W(p.stats, (M) => (a(), r("div", {
+          key: M.category_id,
+          class: x(["row data-info", { odd: y % 2 !== 0, underline: !!M.total && M.total !== "0%" && M.seasons && M.seasons.length }])
+        }, [
+          t("span", {
+            onClick: (A) => I({ player: p, stat: M })
+          }, g(M.total), 9, de)
+        ], 2))), 128))
       ]))), 128))
     ], 4));
   }
-}, Pt = /* @__PURE__ */ Q(Ft, [["__scopeId", "data-v-d03b93c8"]]), g = (e) => (z("data-v-378d650a"), e = e(), E(), e), zt = { class: "table__static-column" }, Et = /* @__PURE__ */ g(() => /* @__PURE__ */ t("div", { class: "static-title column-title" }, null, -1)), At = { class: "container" }, Wt = { class: "details-row__info" }, Dt = { class: "details-row__info__personal" }, Zt = { class: "bold" }, jt = { class: "bold" }, Ht = { class: "bold" }, Nt = { class: "bold" }, Gt = { class: "details-row__info__games" }, qt = { class: "bold" }, Ut = { class: "bold" }, Jt = ["onClick"], Kt = /* @__PURE__ */ g(() => /* @__PURE__ */ t("div", null, "Ver gráfica", -1)), Qt = /* @__PURE__ */ g(() => /* @__PURE__ */ t("svg", {
+}, ue = /* @__PURE__ */ pt(ce, [["__scopeId", "data-v-df83603b"]]), c = (s) => (q("data-v-4cd58a78"), s = s(), U(), s), fe = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", { class: "top-scroll-spacer" }, null, -1)), ve = { class: "table__static-column" }, he = { class: "static-title column-title restore" }, pe = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", { class: "titles-left" }, [
+  /* @__PURE__ */ t("div", { class: "title" }, "Ranking"),
+  /* @__PURE__ */ t("div", { class: "title" }, "Agregar a lista")
+], -1)), ge = /* @__PURE__ */ c(() => /* @__PURE__ */ t("svg", {
+  width: "16",
+  height: "16",
+  viewBox: "0 0 16 16",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, [
+  /* @__PURE__ */ t("g", {
+    opacity: ".6",
+    stroke: "#fff",
+    "stroke-width": "1.333",
+    "stroke-linecap": "round",
+    "stroke-linejoin": "round"
+  }, [
+    /* @__PURE__ */ t("path", { d: "M15.333 2.667v4h-4M.667 13.333v-4h4" }),
+    /* @__PURE__ */ t("path", { d: "M2.34 6a6 6 0 0 1 9.9-2.24l3.094 2.906M.667 9.333l3.093 2.906a6 6 0 0 0 9.9-2.24" })
+  ])
+], -1)), _e = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, "Restaurar orden", -1)), me = [
+  ge,
+  _e
+], Ce = ["id"], we = { class: "container" }, ke = { class: "details-row__info" }, be = { class: "details-row__info__personal" }, ye = { class: "bold" }, xe = { class: "bold" }, Se = { class: "bold" }, Le = { class: "bold" }, Me = { class: "details-row__info__games" }, $e = { class: "bold" }, Be = { class: "bold" }, Ee = ["onClick"], Re = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, "Ver gráfica", -1)), Te = /* @__PURE__ */ c(() => /* @__PURE__ */ t("svg", {
   width: "17",
   height: "16",
   viewBox: "0 0 17 16",
@@ -456,10 +527,10 @@ const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b
       })
     ])
   ])
-], -1)), Xt = [
-  Kt,
-  Qt
-], Yt = ["onClick"], te = /* @__PURE__ */ g(() => /* @__PURE__ */ t("div", null, "Eliminar de lista", -1)), ee = /* @__PURE__ */ g(() => /* @__PURE__ */ t("svg", {
+], -1)), Pe = [
+  Re,
+  Te
+], Ie = ["onClick"], Oe = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, "Eliminar de lista", -1)), De = /* @__PURE__ */ c(() => /* @__PURE__ */ t("svg", {
   width: "17",
   height: "15",
   viewBox: "0 0 20 18",
@@ -490,10 +561,10 @@ const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b
     "stroke-linecap": "round",
     "stroke-linejoin": "round"
   })
-], -1)), oe = [
-  te,
-  ee
-], se = ["onClick"], ie = /* @__PURE__ */ g(() => /* @__PURE__ */ t("div", null, "Agregar a lista", -1)), le = /* @__PURE__ */ g(() => /* @__PURE__ */ t("svg", {
+], -1)), Ve = [
+  Oe,
+  De
+], Fe = ["onClick"], ze = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, "Agregar a lista", -1)), Ae = /* @__PURE__ */ c(() => /* @__PURE__ */ t("svg", {
   width: "20",
   height: "20",
   viewBox: "0 0 20 20",
@@ -524,69 +595,132 @@ const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b
     "stroke-linecap": "round",
     "stroke-linejoin": "round"
   })
-], -1)), ne = [
-  ie,
-  le
-], ae = ["onClick"], de = /* @__PURE__ */ g(() => /* @__PURE__ */ t("div", null, "Ver perfil", -1)), re = [
-  de
-], ce = { class: "static-row__info-player" }, ue = { class: "position" }, he = ["onClick"], fe = /* @__PURE__ */ g(() => /* @__PURE__ */ t("path", {
+], -1)), je = [
+  ze,
+  Ae
+], We = ["onClick"], Ze = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, "Ver perfil", -1)), He = [
+  Ze
+], Ge = { class: "static-row__info-player" }, Ne = { class: "position" }, qe = ["onClick"], Ue = /* @__PURE__ */ c(() => /* @__PURE__ */ t("path", {
   d: "M13.3345 16.5001V14.8334C13.3345 13.9494 12.9833 13.1015 12.3582 12.4764C11.7331 11.8513 10.8852 11.5001 10.0012 11.5001H5.00126C4.11722 11.5001 3.26938 11.8513 2.64427 12.4764C2.01915 13.1015 1.66797 13.9494 1.66797 14.8334V16.5001",
   stroke: "white",
   "stroke-opacity": "0.5",
   "stroke-width": "1.5",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, null, -1)), ve = /* @__PURE__ */ g(() => /* @__PURE__ */ t("path", {
+}, null, -1)), Je = /* @__PURE__ */ c(() => /* @__PURE__ */ t("path", {
   d: "M7.50126 8.16658C9.34219 8.16658 10.8346 6.67422 10.8346 4.83329C10.8346 2.99237 9.34219 1.5 7.50126 1.5C5.66033 1.5 4.16797 2.99237 4.16797 4.83329C4.16797 6.67422 5.66033 8.16658 7.50126 8.16658Z",
   stroke: "white",
   "stroke-opacity": "0.5",
   "stroke-width": "1.5",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, null, -1)), pe = /* @__PURE__ */ g(() => /* @__PURE__ */ t("path", {
+}, null, -1)), Xe = /* @__PURE__ */ c(() => /* @__PURE__ */ t("path", {
   d: "M18.332 8.16663H13.332",
   stroke: "white",
   "stroke-opacity": "0.5",
   "stroke-width": "1.5",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, null, -1)), _e = [
-  fe,
-  ve,
-  pe
-], ge = ["onClick"], be = /* @__PURE__ */ g(() => /* @__PURE__ */ t("path", {
+}, null, -1)), Ke = [
+  Ue,
+  Je,
+  Xe
+], Qe = {
+  key: 1,
+  class: "add-to-list"
+}, Ye = ["onClick"], to = /* @__PURE__ */ c(() => /* @__PURE__ */ t("path", {
   d: "M13.2016 17.2012V15.601C13.2016 14.7522 12.8645 13.9381 12.2643 13.3379C11.664 12.7377 10.85 12.4005 10.0012 12.4005H5.20047C4.35165 12.4005 3.5376 12.7377 2.9374 13.3379C2.33719 13.9381 2 14.7522 2 15.601V17.2012",
   stroke: "white",
   "stroke-opacity": "1",
   "stroke-width": "1.44023",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, null, -1)), me = /* @__PURE__ */ g(() => /* @__PURE__ */ t("path", {
+}, null, -1)), eo = /* @__PURE__ */ c(() => /* @__PURE__ */ t("path", {
   d: "M7.60086 9.19977C9.36843 9.19977 10.8013 7.76687 10.8013 5.9993C10.8013 4.23173 9.36843 2.79883 7.60086 2.79883C5.83329 2.79883 4.40039 4.23173 4.40039 5.9993C4.40039 7.76687 5.83329 9.19977 7.60086 9.19977Z",
   stroke: "white",
   "stroke-opacity": "1",
   "stroke-width": "1.44023",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, null, -1)), Ce = /* @__PURE__ */ g(() => /* @__PURE__ */ t("path", {
+}, null, -1)), oo = /* @__PURE__ */ c(() => /* @__PURE__ */ t("path", {
   d: "M15.5996 6.79944V11.6001M17.9999 9.19979H13.1992",
   stroke: "white",
   "stroke-opacity": "1",
   "stroke-width": "1.44023",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, null, -1)), ye = [
-  be,
-  me,
-  Ce
-], we = { class: "player-photo" }, ke = ["src"], xe = { class: "player-name" }, Se = { class: "arrow" }, Le = ["onClick"], $e = /* @__PURE__ */ g(() => /* @__PURE__ */ t("path", {
+}, null, -1)), so = [
+  to,
+  eo,
+  oo
+], lo = { class: "player-photo" }, io = ["src"], no = { class: "player-name" }, ao = { class: "arrow" }, ro = ["onClick"], co = /* @__PURE__ */ c(() => /* @__PURE__ */ t("path", {
   "fill-rule": "evenodd",
   "clip-rule": "evenodd",
   d: "M6 4.93631L10.2929 1.23496C10.6834 0.898244 11.3166 0.898244 11.7071 1.23496C12.0976 1.57167 12.0976 2.11759 11.7071 2.4543L6.70711 6.76532C6.31658 7.10203 5.68342 7.10203 5.29289 6.76532L0.292893 2.4543C-0.0976311 2.11759 -0.0976311 1.57167 0.292893 1.23496C0.683418 0.898244 1.31658 0.898244 1.70711 1.23496L6 4.93631Z",
   fill: "#D9D9D9"
-}, null, -1)), Be = [
-  $e
-], Me = { class: "table__scrollable-columns" }, Ve = /* @__PURE__ */ dt('<div class="titles scrollable-row" data-v-378d650a><div class="column-title" data-v-378d650a>Equipo</div><div class="column-title" data-v-378d650a>Posición</div><div class="column-title" data-v-378d650a>Edad</div><div class="column-title" data-v-378d650a>País</div><div class="column-title" data-v-378d650a>Partidos Jugados</div><div class="column-title" data-v-378d650a>Minutos Jugados</div><div class="column-title" data-v-378d650a>Liga</div><div class="column-title" data-v-378d650a>Videos</div><div class="column-title" data-v-378d650a></div></div>', 1), Ie = { class: "team-logo" }, Re = ["src"], Te = { class: "team-name data-info" }, Oe = ["src"], Fe = {
+}, null, -1)), uo = [
+  co
+], fo = { class: "titles scrollable-row" }, vo = { class: "column-title" }, ho = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, " Equipo ", -1)), po = /* @__PURE__ */ c(() => /* @__PURE__ */ t("g", {
+  opacity: ".5",
+  stroke: "#fff",
+  "stroke-width": "1.677",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, [
+  /* @__PURE__ */ t("path", { d: "M4.532 2.13v13.74M8.202 12.2l-3.67 3.669-3.669-3.67M12.919 15.87V2.132M16.589 5.802l-3.67-3.67-3.669 3.67" })
+], -1)), go = [
+  po
+], _o = { class: "column-title" }, mo = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, " Posición ", -1)), Co = /* @__PURE__ */ c(() => /* @__PURE__ */ t("g", {
+  opacity: ".5",
+  stroke: "#fff",
+  "stroke-width": "1.677",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, [
+  /* @__PURE__ */ t("path", { d: "M4.532 2.13v13.74M8.202 12.2l-3.67 3.669-3.669-3.67M12.919 15.87V2.132M16.589 5.802l-3.67-3.67-3.669 3.67" })
+], -1)), wo = [
+  Co
+], ko = { class: "column-title" }, bo = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, " Edad ", -1)), yo = /* @__PURE__ */ c(() => /* @__PURE__ */ t("g", {
+  opacity: ".5",
+  stroke: "#fff",
+  "stroke-width": "1.677",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, [
+  /* @__PURE__ */ t("path", { d: "M4.532 2.13v13.74M8.202 12.2l-3.67 3.669-3.669-3.67M12.919 15.87V2.132M16.589 5.802l-3.67-3.67-3.669 3.67" })
+], -1)), xo = [
+  yo
+], So = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", { class: "column-title" }, "País", -1)), Lo = { class: "column-title" }, Mo = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, " Partidos Jugados ", -1)), $o = /* @__PURE__ */ c(() => /* @__PURE__ */ t("g", {
+  opacity: ".5",
+  stroke: "#fff",
+  "stroke-width": "1.677",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, [
+  /* @__PURE__ */ t("path", { d: "M4.532 2.13v13.74M8.202 12.2l-3.67 3.669-3.669-3.67M12.919 15.87V2.132M16.589 5.802l-3.67-3.67-3.669 3.67" })
+], -1)), Bo = [
+  $o
+], Eo = { class: "column-title" }, Ro = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, " Minutos Jugados ", -1)), To = /* @__PURE__ */ c(() => /* @__PURE__ */ t("g", {
+  opacity: ".5",
+  stroke: "#fff",
+  "stroke-width": "1.677",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, [
+  /* @__PURE__ */ t("path", { d: "M4.532 2.13v13.74M8.202 12.2l-3.67 3.669-3.669-3.67M12.919 15.87V2.132M16.589 5.802l-3.67-3.67-3.669 3.67" })
+], -1)), Po = [
+  To
+], Io = { class: "column-title" }, Oo = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", null, " Liga ", -1)), Do = /* @__PURE__ */ c(() => /* @__PURE__ */ t("g", {
+  opacity: ".5",
+  stroke: "#fff",
+  "stroke-width": "1.677",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, [
+  /* @__PURE__ */ t("path", { d: "M4.532 2.13v13.74M8.202 12.2l-3.67 3.669-3.669-3.67M12.919 15.87V2.132M16.589 5.802l-3.67-3.67-3.669 3.67" })
+], -1)), Vo = [
+  Do
+], Fo = /* @__PURE__ */ c(() => /* @__PURE__ */ t("div", { class: "column-title" }, "Videos", -1)), zo = { class: "team-logo" }, Ao = ["src"], jo = { class: "team-name data-info" }, Wo = ["src"], Zo = {
   __name: "GSC-TableScrollable",
   props: {
     players: {
@@ -604,6 +738,14 @@ const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b
     isTableFromList: {
       type: Boolean,
       default: !1
+    },
+    isGraphButtonVisible: {
+      type: Boolean,
+      default: !0
+    },
+    isAddToListButtonVisible: {
+      type: Boolean,
+      default: !0
     }
   },
   emits: [
@@ -611,61 +753,122 @@ const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b
     "view-profile",
     "add-to-list",
     "view-graph",
-    "open-media"
+    "open-media",
+    "click-parameters"
   ],
-  setup(e, { emit: d }) {
-    const o = e;
-    let u = null, p = null;
-    const h = m([]), y = m(null), $ = m(null), B = m(0), f = m(0), M = m(-1);
-    m(!1);
-    const R = m(null), b = V(() => ({
-      "--width-details": `${B.value}px`,
-      "--gap-static-row": `${v.value ? "8px" : "18px"}`,
-      "--width-static-column": `${v.value ? "50%" : "256px"}`
-    })), v = V(() => B.value < 600);
+  setup(s, { emit: f }) {
+    const l = s;
+    let v = null, C = null;
+    const h = m([]), L = m(null), E = m(null), u = m(null), _ = m(0), z = m(0), I = m(-1), Z = m(!1), D = m(null), d = m(null), b = m(null), p = m([]), y = m([
+      {
+        name: "team_abrev",
+        isDesc: !1,
+        isRoot: !0
+      },
+      {
+        name: "player_position",
+        isDesc: !1,
+        isRoot: !0
+      },
+      {
+        name: "player_age",
+        isDesc: !1,
+        isRoot: !0
+      },
+      {
+        name: "player_games",
+        isDesc: !1,
+        isRoot: !0
+      },
+      {
+        name: "player_min",
+        isDesc: !1,
+        isRoot: !0
+      },
+      {
+        name: "league_name",
+        isDesc: !1,
+        isRoot: !0
+      }
+    ]), M = m(0), A = m("922px"), K = O(() => ({
+      "--width-details": `${_.value}px`,
+      "--gap-static-row": `${N.value ? "8px" : "18px"}`,
+      "--width-static-column": `${N.value ? "50%" : "436px"}`
+    })), N = O(() => _.value < 600);
     F(
-      () => o.players,
-      (s) => {
-        s && s.length && (h.value = s.map((a, i) => {
-          const r = i + 1;
-          return {
-            ...a,
-            position: r < 10 ? `0${r}` : `${r}`,
+      () => l.players,
+      (e) => {
+        e && e.length && (h.value = e.map((i, o) => {
+          const n = o + 1, w = {
+            ...i,
+            position: n < 10 ? `0${n}` : `${n}`,
             isSelected: !1,
             isExpanded: !1,
-            isOdd: i % 2 !== 0,
-            index: i
+            isOdd: o % 2 !== 0,
+            index: o
           };
-        }));
+          return i.stats && i.stats.length && (w.stats = i.stats.map((k) => ({
+            ...k,
+            isDesc: !1,
+            isRoot: !1
+          }))), w.parameters && Object.entries(w.parameters).forEach(([k, $]) => {
+            const at = w.stats.find((St) => St.custom_category_id === Number(k));
+            at && (at.parameters = $);
+          }), w;
+        }), p.value = h.value.map((i) => ({
+          ...i
+        })));
       },
-      { immediate: !0 }
+      { immediate: !0, deep: !0 }
     ), F(
-      () => o.isEditMode,
-      (s) => {
-        s && h.value.forEach((a) => {
-          a.isSelected = !1;
+      () => l.isEditMode,
+      (e) => {
+        e && h.value.forEach((i) => {
+          i.isSelected = !1;
         });
       }
     ), F(
-      f,
-      (s) => {
-        const i = document.querySelectorAll(".static-row")[M.value + 1];
-        i && (i.style.marginTop = `${s}px`), o.isGeneral ? C(M.value, s) : $.value && $.value.setMarginTopDetails(M.value, s), s === 0 && R.value && j(R.value);
+      () => b.value,
+      (e) => {
+        if (e) {
+          let i = [...p.value];
+          e.isRoot ? i.sort((o, n) => typeof o[e.name] == "string" ? e.isDesc ? o[e.name].localeCompare(n[e.name]) : o[e.name].localeCompare(n[e.name]) * -1 : e.isDesc ? n[e.name] - o[e.name] : o[e.name] - n[e.name]) : i.sort((o, n) => {
+            const w = o.stats.find(($) => $.name === e.name), k = n.stats.find(($) => $.name === e.name);
+            return typeof w.value == "string" ? e.isDesc ? w.total.localeCompare(k.total) : w.total.localeCompare(k.total) * -1 : e.isDesc ? k.total - w.total : w.total - k.total;
+          }), i.forEach((o, n) => {
+            o.isOdd = n % 2 !== 0;
+          }), p.value = i;
+        } else
+          p.value.sort((i, o) => i.index - o.index).forEach((i, o) => {
+            i.isOdd = o % 2 !== 0;
+          });
+      },
+      { immediate: !0, deep: !0 }
+    ), F(
+      z,
+      (e) => {
+        const o = document.querySelectorAll(".static-row")[I.value + 1];
+        o && (o.style.marginTop = `${e}px`), l.isGeneral ? gt(I.value, e) : E.value && E.value.setMarginTopDetails(I.value, e), e === 0 && D.value && ot(D.value);
       }
     );
-    function C(s, a) {
-      const r = document.querySelectorAll(".scrollable-row")[s + 2];
-      r && (r.style.marginTop = `${a}px`);
+    function gt(e, i) {
+      const n = document.querySelectorAll(".scrollable-row")[e + 2];
+      n && (n.style.marginTop = `${i}px`);
+    }
+    function _t(e) {
+      f("click-parameters", e);
+    }
+    function R(e) {
+      e && (e.isDesc = !e.isDesc), b.value = e;
     }
-    function w(s) {
-      const a = s.player || s.objeto_player, i = a ? a.player_id || a.id || a.playerId : s.id || s.player_id, r = a ? a.team_id || a.teamId : s.team_id || s.teamId, x = {
+    function Q(e) {
+      const i = e.player || e.objeto_player, o = i ? i.player_id || i.id || i.playerId : e.id || e.player_id, n = {
         isFeaturedPlayers: !1,
         mainSectionType: 1,
         playListType: 2,
         gameIds: null,
-        playerIds: i ? [i] : [],
+        playerIds: o ? [o] : [],
         goalkeeperIds: [],
-        teamId: r || 0,
         matchResult: [1, 2, 3],
         categorySingleName: "",
         isRivalSubject: !1,
@@ -678,28 +881,28 @@ const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b
           playListTitle: "Jugadas Relevantes"
         }
       };
-      if (s.stat && s.stat.seasons && s.stat.seasons.length || s.seasons && s.seasons.length) {
-        const P = [
-          ...s.stat && s.stat.seasons && s.stat.seasons.length ? s.stat.seasons : s.seasons
+      if (e.stat && e.stat.parameters && (n.parameters = e.stat.parameters), e.stat && e.stat.seasons && e.stat.seasons.length || e.seasons && e.seasons.length) {
+        const w = [
+          ...e.stat && e.stat.seasons && e.stat.seasons.length ? e.stat.seasons : e.seasons
         ];
-        P.sort((ot, st) => ot - st), x.seasonId = P.shift(), x.seasonsIds = P;
-      } else (s.season_id || s.seasonId) && (x.seasonId = s.season_id || s.seasonId);
-      s.stat ? s.stat.category_id ? x.categoryIds = s.stat.category_id : s.stat.custom_category_id && (x.customCategoryIds = [s.stat.custom_category_id]) : x.categoryIds = X(s.player_position), d("open-media", x);
+        w.sort((k, $) => k - $), n.seasonId = w.shift(), n.seasonsIds = w;
+      } else (e.season_id || e.seasonId) && (n.seasonId = e.season_id || e.seasonId);
+      e.stat ? e.stat.category_id && e.stat.category_id.length ? n.categoryIds = e.stat.category_id : e.stat.custom_category_id && (n.customCategoryIds = [e.stat.custom_category_id]) : n.categoryIds = Ct(e.player_position), f("open-media", n);
     }
-    function k() {
-      u = new ResizeObserver((s) => {
-        for (const a of s)
-          B.value = a.contentRect.width;
-      }), u.observe(y.value);
+    function mt() {
+      v = new ResizeObserver((e) => {
+        for (const i of e)
+          _.value = i.contentRect.width;
+      }), v.observe(L.value);
     }
-    function W(s) {
-      p = new ResizeObserver((a) => {
-        for (const i of a)
-          f.value = i.contentRect.height;
-      }), p.observe(s);
+    function Y(e) {
+      C = new ResizeObserver((i) => {
+        for (const o of i)
+          z.value = o.contentRect.height;
+      }), C.observe(e);
     }
-    function X(s) {
-      return s === "POR" ? [39, 40, 52, 53, 54, 55, 323, 324, 608, 774, 802] : [
+    function Ct(e) {
+      return e === "POR" ? [39, 40, 52, 53, 54, 55, 323, 324, 608, 774, 802] : [
         10,
         12,
         14,
@@ -745,245 +948,405 @@ const Vt = /* @__PURE__ */ Ct(A, [["render", Mt], ["__scopeId", "data-v-f3ee6b2b
         488
       ];
     }
-    function Y(s, a) {
-      a.isSelected = s;
-      const i = h.value.filter((r) => r.isSelected);
-      d("change-selected-players", i);
+    function wt(e, i) {
+      i.isSelected = e;
+      const o = h.value.filter((n) => n.isSelected);
+      f("change-selected-players", o);
     }
-    function tt(s) {
-      d("view-profile", s);
+    function kt(e) {
+      f("view-profile", e);
     }
-    function D(s) {
-      d("delete-from-list", s);
+    function tt(e) {
+      f("delete-from-list", e);
     }
-    function Z(s) {
-      d("add-to-list", s);
+    function et(e) {
+      f("add-to-list", e);
     }
-    function et(s) {
-      d("show-graph", s);
+    function bt(e) {
+      f("show-graph", e);
     }
-    function j(s) {
-      if (s.isExpanded) {
-        s.isExpanded = !1, R.value = null;
+    function ot(e) {
+      if (e.isExpanded) {
+        e.isExpanded = !1, D.value = null;
         return;
       }
-      const a = h.value.find((x) => x.isExpanded);
-      if (a && (a.isExpanded = !1), a) {
-        R.value = s;
+      const i = h.value.find((k) => k.isExpanded);
+      if (i && (i.isExpanded = !1), i) {
+        D.value = e;
         return;
       }
-      const r = document.querySelectorAll(".details-row")[s.index];
-      M.value = s.index, W(r), s.isExpanded = !0;
+      const o = document.querySelectorAll(".details-row");
+      let n = -1;
+      o.forEach((k, $) => {
+        k.id === `dr-${e.id}` && (n = $);
+      });
+      const w = o[n];
+      I.value = n, Y(w), e.isExpanded = !0, h.value.forEach((k) => {
+        k.isExpanded = !1;
+      }), setTimeout(() => {
+        if (!Z.value) {
+          const $ = document.querySelectorAll(".details-row")[e.index];
+          I.value = e.index, Y($);
+        }
+        e.isExpanded = !Z.value;
+      }, 1);
     }
-    return K(() => {
-      k();
-    }), (s, a) => (l(), n("div", {
-      class: "table",
-      ref_key: "tableSC",
-      ref: y,
-      style: L(b.value)
-    }, [
-      t("div", zt, [
-        Et,
-        (l(!0), n(I, null, O(h.value, (i) => (l(), n("div", {
-          key: `s-${i.id}`,
-          class: _(["row static-row", { odd: i.isOdd }])
+    let j = !1, H, G, st = function(e) {
+      j = !0, H = e.pageX - d.value.offsetLeft, G = d.value.scrollLeft;
+    }, lt = function(e) {
+      j = !0, H = e.pageX - u.value.offsetLeft, G = u.value.scrollLeft;
+    }, T = function() {
+      j = !1;
+    };
+    function it(e) {
+      d.value && (d.value.scrollLeft = e.target.scrollLeft);
+    }
+    function nt(e) {
+      u.value && (u.value.scrollLeft = e.target.scrollLeft);
+    }
+    function yt() {
+      d.value && (d.value.addEventListener("mousemove", (e) => {
+        if (!j)
+          return;
+        const o = e.pageX - d.value.offsetLeft - H, n = G - o;
+        d.value.scrollLeft = n, u.value && (u.value.scrollLeft = n);
+      }), d.value.addEventListener("mousedown", st, !1), d.value.addEventListener("mouseup", T, !1), d.value.addEventListener("mouseleave", T, !1), d.value.addEventListener("scroll", nt)), u.value && (u.value.addEventListener("mousemove", (e) => {
+        if (!j)
+          return;
+        const o = e.pageX - u.value.offsetLeft - H, n = G - o;
+        u.value.scrollLeft = n, d.value && (d.value.scrollLeft = n);
+      }), u.value.addEventListener("mousedown", lt, !1), u.value.addEventListener("mouseup", T, !1), u.value.addEventListener("mouseleave", T, !1), u.value.addEventListener("scroll", it));
+    }
+    function xt() {
+      l.isGeneral ? A.value = "922px" : Rt(() => {
+        const e = document.querySelector(".scrollable-row-2");
+        if (e) {
+          const i = window.getComputedStyle(e), o = e.scrollWidth || parseInt(i.width);
+          A.value = `${o}px`;
+        } else if (h.value.length && h.value[0].stats) {
+          const i = h.value[0].stats.length, o = 120;
+          A.value = `${(i + 1) * o}px`;
+        }
+      });
+    }
+    return F(
+      () => [l.players, l.isGeneral],
+      () => {
+        xt();
+      },
+      { immediate: !0 }
+    ), ht(() => {
+      mt(), yt();
+    }), Lt(() => {
+      v && v.disconnect(), C && C.disconnect(), d.value && (d.value.removeEventListener("mousemove", st, !1), d.value.removeEventListener("mouseup", T, !1), d.value.removeEventListener("mouseleave", T, !1), d.value.removeEventListener("scroll", nt)), u.value && (u.value.removeEventListener("mousemove", lt, !1), u.value.removeEventListener("mouseup", T, !1), u.value.removeEventListener("mouseleave", T, !1), u.value.removeEventListener("scroll", it));
+    }), (e, i) => (a(), r(P, null, [
+      t("div", {
+        class: "top-scroll-container",
+        style: B(K.value)
+      }, [
+        fe,
+        t("div", {
+          ref_key: "topScrollableColumns",
+          ref: u,
+          class: "top-scroll"
         }, [
-          H(it, null, {
-            default: lt(() => [
-              nt(t("div", {
-                class: _(["details-row", { odd: i.isOdd }])
-              }, [
-                t("div", At, [
-                  t("div", Wt, [
-                    t("div", Dt, [
-                      t("div", null, [
-                        T("Equipo: "),
-                        t("span", Zt, c(i.team_name), 1)
-                      ]),
-                      t("div", null, [
-                        T("Edad: "),
-                        t("span", jt, c(i.player_age) + " Años", 1)
-                      ]),
-                      t("div", null, [
-                        T("Nacionalidad: "),
-                        t("span", Ht, c(i.player_country), 1)
+          t("div", {
+            class: "top-scroll-content",
+            style: B({ width: A.value })
+          }, null, 4)
+        ], 512)
+      ], 4),
+      (a(), r("div", {
+        class: "table",
+        ref_key: "tableSC",
+        ref: L,
+        style: B(K.value),
+        key: M.value
+      }, [
+        t("div", ve, [
+          t("div", he, [
+            pe,
+            t("div", {
+              role: "button",
+              class: "restore-button",
+              onClick: i[0] || (i[0] = (o) => R(null))
+            }, me)
+          ]),
+          (a(!0), r(P, null, W(p.value, (o) => (a(), r("div", {
+            key: `s-${o.id}`,
+            class: x(["row static-row", { odd: o.isOdd }])
+          }, [
+            rt(Mt, null, {
+              default: $t(() => [
+                Bt(t("div", {
+                  id: `dr-${o.id}`,
+                  class: x(["details-row", { odd: o.isOdd }])
+                }, [
+                  t("div", we, [
+                    t("div", ke, [
+                      t("div", be, [
+                        t("div", null, [
+                          V("Equipo: "),
+                          t("span", ye, g(o.team_name), 1)
+                        ]),
+                        t("div", null, [
+                          V("Edad: "),
+                          t("span", xe, g(o.player_age) + " Años", 1)
+                        ]),
+                        t("div", null, [
+                          V("Nacionalidad: "),
+                          t("span", Se, g(o.player_country), 1)
+                        ]),
+                        t("div", null, [
+                          V("Posición: "),
+                          t("span", Le, g(o.position_name), 1)
+                        ])
                       ]),
-                      t("div", null, [
-                        T("Posición: "),
-                        t("span", Nt, c(i.position_name), 1)
+                      t("div", Me, [
+                        t("div", null, [
+                          V("Partidos Jugados: "),
+                          t("span", $e, g(o.player_games), 1)
+                        ]),
+                        t("div", null, [
+                          V("Minutos Jugados: "),
+                          t("span", Be, g(o.player_min), 1)
+                        ])
                       ])
                     ]),
-                    t("div", Gt, [
-                      t("div", null, [
-                        T("Partidos Jugados: "),
-                        t("span", qt, c(i.player_games), 1)
-                      ]),
-                      t("div", null, [
-                        T("Minutos Jugados: "),
-                        t("span", Ut, c(i.player_min), 1)
-                      ])
-                    ])
-                  ]),
-                  t("div", {
-                    class: "details-row__buttons",
-                    style: L(v.value ? "margin-left: 0; gap: 8px;" : "")
-                  }, [
-                    t("div", {
-                      role: "button",
-                      class: "button",
-                      onClick: (r) => et(i)
-                    }, Xt, 8, Jt),
-                    e.isTableFromList ? (l(), n("div", {
-                      key: 0,
-                      role: "button",
-                      class: "button",
-                      onClick: (r) => D(i)
-                    }, oe, 8, Yt)) : (l(), n("div", {
-                      key: 1,
-                      role: "button",
-                      class: "button",
-                      onClick: (r) => Z(i)
-                    }, ne, 8, se)),
                     t("div", {
-                      role: "button",
-                      class: "button green",
-                      onClick: (r) => tt(i)
-                    }, re, 8, ae)
-                  ], 4)
+                      class: "details-row__buttons",
+                      style: B(N.value ? "margin-left: 0; gap: 8px;" : "")
+                    }, [
+                      s.isGraphButtonVisible ? (a(), r("div", {
+                        key: 0,
+                        role: "button",
+                        class: "button",
+                        onClick: (n) => bt(o)
+                      }, Pe, 8, Ee)) : S("", !0),
+                      s.isTableFromList ? (a(), r("div", {
+                        key: 1,
+                        role: "button",
+                        class: "button",
+                        onClick: (n) => tt(o)
+                      }, Ve, 8, Ie)) : s.isAddToListButtonVisible ? (a(), r("div", {
+                        key: 2,
+                        role: "button",
+                        class: "button",
+                        onClick: (n) => et(o)
+                      }, je, 8, Fe)) : S("", !0),
+                      t("div", {
+                        role: "button",
+                        class: "button green",
+                        onClick: (n) => kt(o)
+                      }, He, 8, We)
+                    ], 4)
+                  ])
+                ], 10, Ce), [
+                  [Et, o.isExpanded]
                 ])
-              ], 2), [
-                [at, i.isExpanded]
-              ])
-            ]),
-            _: 2
-          }, 1024),
-          e.isEditMode ? (l(), N(G(mt), {
-            key: 0,
-            fontFamily: "Poppins-Regular",
-            labelFontSize: "14px",
-            "model-value": i.isSelected,
-            "onUpdate:modelValue": (r) => Y(r, i)
-          }, null, 8, ["model-value", "onUpdate:modelValue"])) : S("", !0),
-          t("div", ce, [
-            t("div", ue, c(i.position), 1),
-            e.isTableFromList ? (l(), n("svg", {
+              ]),
+              _: 2
+            }, 1024),
+            s.isEditMode ? (a(), dt(ct(Wt), {
               key: 0,
-              width: "20",
-              height: "20",
-              viewBox: "0 0 20 20",
-              fill: "none",
-              xmlns: "http://www.w3.org/2000/svg",
-              onClick: (r) => D(i)
-            }, _e, 8, he)) : (l(), n("svg", {
-              key: 1,
-              width: "20",
-              height: "20",
-              viewBox: "0 0 20 20",
-              fill: "none",
-              xmlns: "http://www.w3.org/2000/svg",
-              onClick: (r) => Z(i)
-            }, ye, 8, ge)),
-            t("div", we, [
-              t("div", null, [
-                t("img", {
-                  src: i.player_photo,
-                  alt: "player photo"
-                }, null, 8, ke)
-              ])
+              fontFamily: "Poppins-Regular",
+              labelFontSize: "14px",
+              "model-value": o.isSelected,
+              "onUpdate:modelValue": (n) => wt(n, o)
+            }, null, 8, ["model-value", "onUpdate:modelValue"])) : S("", !0),
+            t("div", Ge, [
+              t("div", Ne, g(o.position), 1),
+              s.isTableFromList ? (a(), r("svg", {
+                key: 0,
+                width: "20",
+                height: "20",
+                viewBox: "0 0 20 20",
+                fill: "none",
+                xmlns: "http://www.w3.org/2000/svg",
+                onClick: (n) => tt(o)
+              }, Ke, 8, qe)) : (a(), r("div", Qe, [
+                (a(), r("svg", {
+                  width: "20",
+                  height: "20",
+                  viewBox: "0 0 20 20",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  onClick: (n) => et(o)
+                }, so, 8, Ye))
+              ])),
+              t("div", lo, [
+                t("div", null, [
+                  t("img", {
+                    src: o.player_photo,
+                    alt: "player photo"
+                  }, null, 8, io)
+                ])
+              ]),
+              t("div", no, g(o.player_name), 1)
             ]),
-            t("div", xe, c(i.player_name), 1)
-          ]),
-          t("div", Se, [
-            (l(), n("svg", {
-              class: _(["_arrowExpandIcon_6ak64_1115 _rotate_6ak64_5", { expanded: i.isExpanded }]),
-              width: "12",
-              height: "8",
-              viewBox: "0 0 12 8",
-              fill: "#D9D9D9",
-              xmlns: "http://www.w3.org/2000/svg",
-              onClick: (r) => j(i)
-            }, Be, 10, Le))
-          ])
-        ], 2))), 128))
-      ]),
-      t("div", Me, [
-        e.isGeneral ? (l(), n(I, { key: 0 }, [
-          Ve,
-          (l(!0), n(I, null, O(h.value, (i) => (l(), n("div", {
-            key: `i-${i.id}`,
-            class: "row scrollable-row"
-          }, [
-            t("div", {
-              class: _(["row team-info", { odd: i.isOdd }])
-            }, [
-              t("div", Ie, [
-                t("img", {
-                  src: i.team_logo,
-                  alt: "team logo"
-                }, null, 8, Re)
+            t("div", ao, [
+              (a(), r("svg", {
+                class: x(["_arrowExpandIcon_6ak64_1115 _rotate_6ak64_5", { expanded: o.isExpanded }]),
+                width: "12",
+                height: "8",
+                viewBox: "0 0 12 8",
+                fill: "#D9D9D9",
+                xmlns: "http://www.w3.org/2000/svg",
+                onClick: (n) => ot(o)
+              }, uo, 10, ro))
+            ])
+          ], 2))), 128))
+        ]),
+        t("div", {
+          ref_key: "scrollableColumns",
+          ref: d,
+          class: "table__scrollable-columns"
+        }, [
+          s.isGeneral ? (a(), r(P, { key: 0 }, [
+            t("div", fo, [
+              t("div", vo, [
+                ho,
+                (a(), r("svg", {
+                  width: "18",
+                  height: "18",
+                  viewBox: "0 0 18 18",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  onClick: i[1] || (i[1] = (o) => R(y.value[0]))
+                }, go))
               ]),
-              t("div", Te, c(i.team_abrev), 1)
-            ], 2),
-            t("div", {
-              class: _(["row data-info", { odd: i.isOdd }])
-            }, c(i.player_position), 3),
-            t("div", {
-              class: _(["row data-info", { odd: i.isOdd }])
-            }, c(i.player_age), 3),
-            t("div", {
-              class: _(["row data-info", { odd: i.isOdd }])
-            }, [
-              t("img", {
-                src: i.player_country_flag,
-                alt: "player country flag",
-                class: "country-flag"
-              }, null, 8, Oe)
-            ], 2),
-            t("div", {
-              class: _(["row data-info", { odd: i.isOdd }])
-            }, c(i.player_games), 3),
-            t("div", {
-              class: _(["row data-info", { odd: i.isOdd }])
-            }, c(i.player_min), 3),
-            t("div", {
-              class: _(["row data-info", { odd: i.isOdd }])
-            }, c(i.league_name), 3),
-            t("div", {
-              class: _(["row data-info", { odd: i.isOdd }])
+              t("div", _o, [
+                mo,
+                (a(), r("svg", {
+                  width: "18",
+                  height: "18",
+                  viewBox: "0 0 18 18",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  onClick: i[2] || (i[2] = (o) => R(y.value[1]))
+                }, wo))
+              ]),
+              t("div", ko, [
+                bo,
+                (a(), r("svg", {
+                  width: "18",
+                  height: "18",
+                  viewBox: "0 0 18 18",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  onClick: i[3] || (i[3] = (o) => R(y.value[2]))
+                }, xo))
+              ]),
+              So,
+              t("div", Lo, [
+                Mo,
+                (a(), r("svg", {
+                  width: "18",
+                  height: "18",
+                  viewBox: "0 0 18 18",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  onClick: i[4] || (i[4] = (o) => R(y.value[3]))
+                }, Bo))
+              ]),
+              t("div", Eo, [
+                Ro,
+                (a(), r("svg", {
+                  width: "18",
+                  height: "18",
+                  viewBox: "0 0 18 18",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  onClick: i[5] || (i[5] = (o) => R(y.value[4]))
+                }, Po))
+              ]),
+              t("div", Io, [
+                Oo,
+                (a(), r("svg", {
+                  width: "18",
+                  height: "18",
+                  viewBox: "0 0 18 18",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  onClick: i[6] || (i[6] = (o) => R(y.value[5]))
+                }, Vo))
+              ]),
+              Fo
+            ]),
+            (a(!0), r(P, null, W(p.value, (o) => (a(), r("div", {
+              key: `i-${o.id}`,
+              class: "row scrollable-row"
             }, [
-              H(G(Vt), {
-                icon: "https://golstatsimages.blob.core.windows.net/images-library/arrow-btn.png",
-                "icon-size": "19px",
-                "icon-position": "left",
-                width: "98px",
-                height: "30px",
-                "border-radius": "30px",
-                "border-width": "1",
-                "background-color": "#ffffff1a",
-                "font-family": "Poppins-Regular",
-                "border-color": "#55636e",
-                "text-value": "Ver videos",
-                "font-size": "10px",
-                onClick: (r) => w(i)
-              }, null, 8, ["onClick"])
-            ], 2),
-            t("div", {
-              class: _(["row data-info", { odd: i.isOdd }])
-            }, null, 2)
-          ]))), 128))
-        ], 64)) : (l(), N(Pt, {
-          key: 1,
-          ref_key: "scrollColumns",
-          ref: $,
-          "available-players": h.value,
-          "is-edit-mode": e.isEditMode,
-          onOpenMedia: w
-        }, null, 8, ["available-players", "is-edit-mode"]))
-      ])
-    ], 4));
+              t("div", {
+                class: x(["row team-info", { odd: o.isOdd }])
+              }, [
+                t("div", zo, [
+                  t("img", {
+                    src: o.team_logo,
+                    alt: "team logo"
+                  }, null, 8, Ao)
+                ]),
+                t("div", jo, g(o.team_abrev), 1)
+              ], 2),
+              t("div", {
+                class: x(["row data-info", { odd: o.isOdd }])
+              }, g(o.player_position), 3),
+              t("div", {
+                class: x(["row data-info", { odd: o.isOdd }])
+              }, g(o.player_age), 3),
+              t("div", {
+                class: x(["row data-info", { odd: o.isOdd }])
+              }, [
+                t("img", {
+                  src: o.player_country_flag,
+                  alt: "player country flag",
+                  class: "country-flag"
+                }, null, 8, Wo)
+              ], 2),
+              t("div", {
+                class: x(["row data-info", { odd: o.isOdd }])
+              }, g(o.player_games), 3),
+              t("div", {
+                class: x(["row data-info", { odd: o.isOdd }])
+              }, g(o.player_min), 3),
+              t("div", {
+                class: x(["row data-info", { odd: o.isOdd }])
+              }, g(o.league_name), 3),
+              t("div", {
+                class: x(["row data-info", { odd: o.isOdd }])
+              }, [
+                rt(ct(Yt), {
+                  icon: "https://golstatsimages.blob.core.windows.net/images-library/arrow-btn.png",
+                  "icon-size": "19px",
+                  "icon-position": "left",
+                  width: "98px",
+                  height: "30px",
+                  "border-radius": "30px",
+                  "border-width": "1",
+                  "background-color": "#ffffff1a",
+                  "font-family": "Poppins-Regular",
+                  "border-color": "#55636e",
+                  "text-value": "Ver videos",
+                  "font-size": "10px",
+                  onClick: (n) => Q(o)
+                }, null, 8, ["onClick"])
+              ], 2)
+            ]))), 128))
+          ], 64)) : (a(), dt(ue, {
+            key: 1,
+            ref_key: "scrollColumns",
+            ref: E,
+            "available-players": p.value,
+            "is-edit-mode": s.isEditMode,
+            onOpenMedia: Q,
+            onClickParameters: _t,
+            onSort: R
+          }, null, 8, ["available-players", "is-edit-mode"]))
+        ], 512)
+      ], 4))
+    ], 64));
   }
-}, ze = /* @__PURE__ */ Q(Fe, [["__scopeId", "data-v-378d650a"]]);
+}, Go = /* @__PURE__ */ pt(Zo, [["__scopeId", "data-v-4cd58a78"]]);
 export {
-  ze as GSCTableScrollable
+  Go as GSCTableScrollable
 };