@algoux/standard-ranklist-renderer-component-vue 0.5.0

package/dist/index.js

@@ -0,0 +1,1012 @@
+import "@algoux/standard-ranklist-renderer-component-styles";
+import { defineComponent, ref, computed, watch, watchEffect, onMounted, onBeforeUnmount, openBlock, createElementBlock, normalizeClass, createElementVNode, normalizeStyle, toDisplayString, createCommentVNode, renderSlot, nextTick, createBlock, withCtx, Fragment, renderList, unref, withDirectives, vModelText, h, withModifiers, createVNode, mergeProps } from "vue";
+import { SRK_ANIMATED_MODAL_ROOT_CLASS, MODAL_ANIMATION_DURATION_MS, lockModalBodyScroll, unlockModalBodyScroll, ensureModalInteractionTracker, resolveModalTransformOrigin, registerModalFocusScope, unregisterModalFocusScope, getSolutionModalTitle, getSolutionResultMeta, formatSolutionTimestamp, getMarkerPresentation, resolveSrkAssetUrl, getProgressMaxAvailableMinutes, getProgressDurationMinutes, isProgressEnded, getProgressMetrics, getProblemHeaderBackgroundImage, getAcceptedStatusDetails, captureModalTriggerPointFromMouseEvent, caniuse, shouldShowTimeColumn, srkSupportedVersions } from "@algoux/standard-ranklist-renderer-component-core";
+import { EnumTheme, resolveUserMarkers, resolveText, secToTimeStr, numberToAlphabet, formatTimeDuration, resolveStyle } from "@algoux/standard-ranklist-utils";
+const _hoisted_1$7 = ["data-srk-modal-state"];
+const _hoisted_2$6 = ["aria-labelledby"];
+const _hoisted_3$5 = { class: "srk-modal-content" };
+const _hoisted_4$5 = {
+  key: 0,
+  class: "srk-modal-header"
+};
+const _hoisted_5$5 = { class: "srk-modal-body" };
+const _sfc_main$7 = defineComponent({
+  __name: "Modal",
+  props: {
+    open: { type: Boolean },
+    title: {},
+    width: {},
+    rootClassName: {},
+    wrapClassName: {},
+    style: {},
+    destroyOnClose: { type: Boolean, default: true },
+    closeOnEsc: { type: Boolean, default: true },
+    closeOnMaskClick: { type: Boolean, default: true }
+  },
+  emits: ["close", "update:open"],
+  setup(__props, { emit: __emit }) {
+    let nextModalId = 0;
+    const props = __props;
+    const emit = __emit;
+    const titleId = `srk-vue-modal-title-${++nextModalId}`;
+    const dialogRef = ref(null);
+    const isMounted = ref(props.open || !props.destroyOnClose);
+    const animationState = ref(props.open ? "pre-open" : "closing");
+    const transformOrigin = ref({ x: 0, y: 0 });
+    let closeTimer = null;
+    let openTimer = null;
+    let focusScopeId = null;
+    const shouldRender = computed(() => isMounted.value || !props.destroyOnClose);
+    const rootClasses = computed(() => ["srk-modal-root", SRK_ANIMATED_MODAL_ROOT_CLASS, props.rootClassName].filter(Boolean));
+    const shouldLockBody = computed(() => props.open || props.destroyOnClose && isMounted.value);
+    const dialogStyle = computed(() => {
+      var _a, _b;
+      return {
+        ...props.style,
+        width: props.width ? `${props.width}px` : (_a = props.style) == null ? void 0 : _a.width,
+        ["--srk-modal-origin-x"]: `${transformOrigin.value.x}px`,
+        ["--srk-modal-origin-y"]: `${transformOrigin.value.y}px`,
+        ["--srk-modal-max-width"]: props.width ? `${props.width}px` : typeof ((_b = props.style) == null ? void 0 : _b.width) === "string" ? props.style.width : void 0
+      };
+    });
+    function clearTimers() {
+      if (typeof window === "undefined") {
+        closeTimer = null;
+        openTimer = null;
+        return;
+      }
+      if (closeTimer !== null) {
+        window.clearTimeout(closeTimer);
+        closeTimer = null;
+      }
+      if (openTimer !== null) {
+        window.clearTimeout(openTimer);
+        openTimer = null;
+      }
+    }
+    async function queueOpenAnimation() {
+      await nextTick();
+      if (typeof window === "undefined" || !props.open || !isMounted.value || animationState.value !== "pre-open") {
+        return;
+      }
+      registerFocusScope();
+      const resolution = resolveModalTransformOrigin(dialogRef.value);
+      transformOrigin.value = resolution.origin;
+      openTimer = window.setTimeout(() => {
+        animationState.value = "opening";
+        openTimer = null;
+      }, 0);
+    }
+    function registerFocusScope() {
+      const nextFocusScopeId = registerModalFocusScope(dialogRef.value, {
+        onEscape: handleEscape
+      });
+      if (focusScopeId === null) {
+        focusScopeId = nextFocusScopeId;
+      }
+    }
+    function releaseFocusScope() {
+      if (focusScopeId !== null) {
+        unregisterModalFocusScope(focusScopeId);
+        focusScopeId = null;
+      }
+    }
+    function requestClose(reason) {
+      emit("update:open", false);
+      emit("close", reason);
+    }
+    function handleMaskMouseDown(event) {
+      if (props.closeOnMaskClick && event.target === event.currentTarget) {
+        requestClose("mask");
+      }
+    }
+    function handleEscape(event) {
+      if (props.open && props.closeOnEsc) {
+        requestClose("escape");
+      }
+    }
+    watch(() => props.open, async (open) => {
+      clearTimers();
+      if (open) {
+        isMounted.value = true;
+        transformOrigin.value = { x: 0, y: 0 };
+        animationState.value = "pre-open";
+        await queueOpenAnimation();
+        return;
+      }
+      releaseFocusScope();
+      animationState.value = "closing";
+      if (!props.destroyOnClose) {
+        isMounted.value = true;
+        return;
+      }
+      if (isMounted.value && typeof window !== "undefined") {
+        closeTimer = window.setTimeout(() => {
+          isMounted.value = false;
+          closeTimer = null;
+        }, MODAL_ANIMATION_DURATION_MS);
+      }
+    }, { immediate: true });
+    watchEffect((onCleanup) => {
+      if (!shouldLockBody.value) {
+        return;
+      }
+      lockModalBodyScroll();
+      onCleanup(() => {
+        unlockModalBodyScroll();
+      });
+    });
+    onMounted(() => {
+      ensureModalInteractionTracker();
+      if (props.open) {
+        registerFocusScope();
+      }
+    });
+    onBeforeUnmount(() => {
+      clearTimers();
+      releaseFocusScope();
+    });
+    return (_ctx, _cache) => {
+      return shouldRender.value ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        class: normalizeClass(rootClasses.value),
+        "data-srk-modal-state": animationState.value
+      }, [
+        _cache[2] || (_cache[2] = createElementVNode("div", { class: "srk-modal-mask" }, null, -1)),
+        createElementVNode("div", {
+          class: normalizeClass(["srk-modal-wrap", __props.wrapClassName]),
+          tabindex: "-1",
+          onMousedown: handleMaskMouseDown
+        }, [
+          createElementVNode("div", {
+            class: "srk-modal",
+            role: "dialog",
+            "aria-modal": "true",
+            "aria-labelledby": __props.title ? titleId : void 0,
+            "data-srk-modal-panel": "true",
+            tabindex: "-1",
+            ref_key: "dialogRef",
+            ref: dialogRef,
+            style: normalizeStyle(dialogStyle.value)
+          }, [
+            createElementVNode("div", _hoisted_3$5, [
+              createElementVNode("button", {
+                "aria-label": "Close",
+                class: "srk-modal-close",
+                type: "button",
+                onClick: _cache[0] || (_cache[0] = ($event) => requestClose("close-button"))
+              }, [..._cache[1] || (_cache[1] = [
+                createElementVNode("span", { class: "srk-modal-close-x" }, null, -1)
+              ])]),
+              __props.title !== void 0 ? (openBlock(), createElementBlock("div", _hoisted_4$5, [
+                createElementVNode("div", {
+                  id: titleId,
+                  class: "srk-modal-title"
+                }, toDisplayString(__props.title), 1)
+              ])) : createCommentVNode("", true),
+              createElementVNode("div", _hoisted_5$5, [
+                renderSlot(_ctx.$slots, "default")
+              ])
+            ])
+          ], 12, _hoisted_2$6)
+        ], 34)
+      ], 10, _hoisted_1$7)) : createCommentVNode("", true);
+    };
+  }
+});
+const _hoisted_1$6 = { class: "srk-common-table srk-solutions-table" };
+const _hoisted_2$5 = { class: "srk--text-right" };
+const _sfc_main$6 = defineComponent({
+  __name: "DefaultSolutionModal",
+  props: {
+    open: { type: Boolean },
+    user: {},
+    problem: {},
+    problemIndex: {},
+    solutions: { default: () => [] },
+    title: {},
+    width: { default: 320 },
+    rootClassName: { default: "srk-general-modal-root" },
+    wrapClassName: { default: "srk-solutions-modal" },
+    style: {}
+  },
+  emits: ["close", "update:open"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const cachedPayload = ref(props.user ? {
+      user: props.user,
+      problem: props.problem,
+      problemIndex: props.problemIndex,
+      solutions: props.solutions
+    } : null);
+    watch([() => props.user, () => props.problem, () => props.problemIndex, () => props.solutions], ([user, problem, problemIndex, solutions]) => {
+      if (user) {
+        cachedPayload.value = {
+          user,
+          problem,
+          problemIndex,
+          solutions
+        };
+      }
+    }, { immediate: true });
+    const resolvedTitle = computed(() => props.title || (cachedPayload.value ? getSolutionModalTitle(cachedPayload.value.problemIndex, cachedPayload.value.user) : ""));
+    return (_ctx, _cache) => {
+      return cachedPayload.value ? (openBlock(), createBlock(_sfc_main$7, {
+        key: 0,
+        open: __props.open,
+        title: resolvedTitle.value,
+        width: __props.width,
+        "root-class-name": __props.rootClassName,
+        "wrap-class-name": __props.wrapClassName,
+        style: normalizeStyle(__props.style),
+        onClose: _cache[0] || (_cache[0] = (reason) => emit("close", reason)),
+        "onUpdate:open": _cache[1] || (_cache[1] = (value) => emit("update:open", value))
+      }, {
+        default: withCtx(() => [
+          createElementVNode("table", _hoisted_1$6, [
+            _cache[2] || (_cache[2] = createElementVNode("thead", null, [
+              createElementVNode("tr", null, [
+                createElementVNode("th", { class: "srk--text-left" }, "Result"),
+                createElementVNode("th", { class: "srk--text-right" }, "Time")
+              ])
+            ], -1)),
+            createElementVNode("tbody", null, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(cachedPayload.value.solutions, (solution, index) => {
+                var _a;
+                return openBlock(), createElementBlock("tr", {
+                  key: `${solution.result}_${(_a = solution.time) == null ? void 0 : _a[0]}_${index}`
+                }, [
+                  createElementVNode("td", null, [
+                    createElementVNode("span", {
+                      class: normalizeClass(["srk-solution-result-text", unref(getSolutionResultMeta)(solution.result).className])
+                    }, toDisplayString(unref(getSolutionResultMeta)(solution.result).label), 3)
+                  ]),
+                  createElementVNode("td", _hoisted_2$5, toDisplayString(unref(formatSolutionTimestamp)(solution)), 1)
+                ]);
+              }), 128))
+            ])
+          ])
+        ]),
+        _: 1
+      }, 8, ["open", "title", "width", "root-class-name", "wrap-class-name", "style"])) : createCommentVNode("", true);
+    };
+  }
+});
+const _hoisted_1$5 = { class: "srk-user-modal-info" };
+const _hoisted_2$4 = { class: "srk-user-modal-info-user-name" };
+const _hoisted_3$4 = {
+  key: 0,
+  class: "srk-user-modal-info-user-second-name"
+};
+const _hoisted_4$4 = { class: "srk-user-modal-info-labels" };
+const _hoisted_5$4 = { class: "srk-user-modal-info-labels-label srk-user-modal-info-labels-label-preset-general" };
+const _hoisted_6$3 = {
+  key: 1,
+  class: "srk-user-modal-info-team-members"
+};
+const _hoisted_7$2 = {
+  key: 0,
+  class: "srk-user-modal-info-team-members-slash"
+};
+const _hoisted_8$2 = {
+  key: 2,
+  class: "srk-user-modal-info-photo"
+};
+const _hoisted_9$2 = ["src"];
+const _sfc_main$5 = defineComponent({
+  __name: "DefaultUserModal",
+  props: {
+    open: { type: Boolean },
+    user: {},
+    markers: { default: () => [] },
+    theme: { default: EnumTheme.light },
+    title: { default: "User Info" },
+    width: { default: 420 },
+    rootClassName: { default: "srk-general-modal-root" },
+    wrapClassName: { default: "srk-user-modal" },
+    style: {},
+    formatSrkAssetUrl: {}
+  },
+  emits: ["close", "update:open"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const cachedUser = ref(props.user || null);
+    watch(() => props.user, (user) => {
+      if (user) {
+        cachedUser.value = user;
+      }
+    }, { immediate: true });
+    const resolvedMarkers = computed(() => cachedUser.value ? resolveUserMarkers(cachedUser.value, props.markers).map((marker) => ({
+      marker,
+      presentation: getMarkerPresentation(marker, props.theme)
+    })) : []);
+    function formatAssetUrl(url, field) {
+      return resolveSrkAssetUrl(url, field, props.formatSrkAssetUrl);
+    }
+    return (_ctx, _cache) => {
+      return cachedUser.value ? (openBlock(), createBlock(_sfc_main$7, {
+        key: 0,
+        open: __props.open,
+        title: __props.title,
+        width: __props.width,
+        "root-class-name": __props.rootClassName,
+        "wrap-class-name": __props.wrapClassName,
+        style: normalizeStyle(__props.style),
+        onClose: _cache[0] || (_cache[0] = (reason) => emit("close", reason)),
+        "onUpdate:open": _cache[1] || (_cache[1] = (value) => emit("update:open", value))
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1$5, [
+            createElementVNode("h3", _hoisted_2$4, toDisplayString(unref(resolveText)(cachedUser.value.name)), 1),
+            cachedUser.value.organization ? (openBlock(), createElementBlock("p", _hoisted_3$4, toDisplayString(unref(resolveText)(cachedUser.value.organization)), 1)) : createCommentVNode("", true),
+            createElementVNode("div", _hoisted_4$4, [
+              createElementVNode("span", _hoisted_5$4, toDisplayString(cachedUser.value.official === false ? "\uFF0A \u975E\u6B63\u5F0F\u53C2\u52A0\u8005" : "\u6B63\u5F0F\u53C2\u52A0\u8005"), 1),
+              (openBlock(true), createElementBlock(Fragment, null, renderList(resolvedMarkers.value, (marker) => {
+                return openBlock(), createElementBlock("span", {
+                  key: marker.marker.id,
+                  class: normalizeClass(["srk-user-modal-info-labels-label", marker.presentation.className]),
+                  style: normalizeStyle(marker.presentation.style)
+                }, toDisplayString(unref(resolveText)(marker.marker.label)), 7);
+              }), 128))
+            ]),
+            cachedUser.value.teamMembers && cachedUser.value.teamMembers.length ? (openBlock(), createElementBlock("div", _hoisted_6$3, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(cachedUser.value.teamMembers, (member, index) => {
+                return openBlock(), createElementBlock(Fragment, {
+                  key: unref(resolveText)(member.name)
+                }, [
+                  index > 0 ? (openBlock(), createElementBlock("span", _hoisted_7$2, " / ")) : createCommentVNode("", true),
+                  createElementVNode("span", null, toDisplayString(unref(resolveText)(member.name)), 1)
+                ], 64);
+              }), 128))
+            ])) : createCommentVNode("", true),
+            cachedUser.value.photo ? (openBlock(), createElementBlock("div", _hoisted_8$2, [
+              createElementVNode("img", {
+                src: formatAssetUrl(cachedUser.value.photo, "user.photo"),
+                alt: "User portrait",
+                class: "srk-user-modal-info-photo-img"
+              }, null, 8, _hoisted_9$2)
+            ])) : createCommentVNode("", true)
+          ])
+        ]),
+        _: 1
+      }, 8, ["open", "title", "width", "root-class-name", "wrap-class-name", "style"])) : createCommentVNode("", true);
+    };
+  }
+});
+const _hoisted_1$4 = { class: "srk-progress-bar-container" };
+const _hoisted_2$3 = { class: "srk-progress-bar" };
+const _hoisted_3$3 = { class: "srk-progress-bar-body" };
+const _hoisted_4$3 = {
+  key: 0,
+  class: "srk-progress-slider-layer"
+};
+const _hoisted_5$3 = ["max", "title"];
+const _hoisted_6$2 = { class: "srk-progress-secondary-area" };
+const _hoisted_7$1 = { class: "srk-progress-secondary-area-center" };
+const _hoisted_8$1 = {
+  key: 0,
+  class: "srk-progress-time-machine-status"
+};
+const _hoisted_9$1 = {
+  key: 1,
+  class: "srk-progress-live-text"
+};
+const _hoisted_10 = {
+  key: 2,
+  style: { "visibility": "hidden" }
+};
+const _sfc_main$4 = defineComponent({
+  __name: "ProgressBar",
+  props: {
+    data: {},
+    enableTimeTravel: { type: Boolean, default: false },
+    live: { type: Boolean, default: false },
+    td: { default: 0 }
+  },
+  emits: ["timeTravel"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const localTime = ref(Date.now());
+    const inTimeMachine = ref(false);
+    const timeTravelIsChanging = ref(false);
+    const timeTravelCurrentValue = ref(getProgressMaxAvailableMinutes(props.data.contest, localTime.value, props.td));
+    const timeTravelValue = ref(null);
+    let liveInterval;
+    const durationMinutes = computed(() => getProgressDurationMinutes(props.data.contest));
+    const maxAvailableMinutes = computed(() => getProgressMaxAvailableMinutes(props.data.contest, localTime.value, props.td));
+    const isEnded = computed(() => isProgressEnded(props.data.contest, localTime.value, props.td));
+    const progressMetrics = computed(() => getProgressMetrics(props.data, localTime.value, props.td, timeTravelCurrentValue.value, inTimeMachine.value));
+    function handleProgressTimer() {
+      localTime.value = Date.now();
+      if (isEnded.value && liveInterval !== void 0) {
+        window.clearInterval(liveInterval);
+        liveInterval = void 0;
+      }
+    }
+    function syncLiveInterval(live) {
+      if (typeof window === "undefined") {
+        return;
+      }
+      if (live && liveInterval === void 0) {
+        liveInterval = window.setInterval(handleProgressTimer, 1e3);
+      }
+      if (!live && liveInterval !== void 0) {
+        window.clearInterval(liveInterval);
+        liveInterval = void 0;
+      }
+    }
+    function handleTimeTravelChange(value) {
+      const exited = value >= durationMinutes.value || value >= maxAvailableMinutes.value;
+      emit("timeTravel", exited ? null : value * 60 * 1e3);
+      inTimeMachine.value = !exited;
+      timeTravelValue.value = exited ? null : value * 60 * 1e3;
+      timeTravelIsChanging.value = false;
+    }
+    function beginTimeTravel() {
+      timeTravelIsChanging.value = true;
+      inTimeMachine.value = true;
+    }
+    function commitTimeTravel() {
+      if (timeTravelIsChanging.value) {
+        handleTimeTravelChange(timeTravelCurrentValue.value);
+      }
+    }
+    watch(maxAvailableMinutes, (value) => {
+      if (!timeTravelIsChanging.value && timeTravelValue.value === null) {
+        timeTravelCurrentValue.value = value;
+      }
+    });
+    watch(() => props.live, (live) => syncLiveInterval(live), { immediate: true });
+    watch(() => props.data.contest.title, () => {
+      timeTravelIsChanging.value = false;
+      timeTravelCurrentValue.value = maxAvailableMinutes.value;
+      timeTravelValue.value = null;
+      inTimeMachine.value = false;
+      emit("timeTravel", null);
+    });
+    onBeforeUnmount(() => {
+      if (liveInterval !== void 0) {
+        window.clearInterval(liveInterval);
+        liveInterval = void 0;
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$4, [
+        createElementVNode("div", _hoisted_2$3, [
+          createElementVNode("div", _hoisted_3$3, [
+            createElementVNode("div", {
+              class: "srk-progress-bar-segment srk-progress-bar-normal",
+              style: normalizeStyle({ width: `${progressMetrics.value.frozenBreakpoint * 100}%` })
+            }, [
+              createElementVNode("div", {
+                class: "srk-progress-bar-fill",
+                style: normalizeStyle({ width: `${progressMetrics.value.normalInnerPercent}%` })
+              }, null, 4)
+            ], 4),
+            createElementVNode("div", {
+              class: "srk-progress-bar-segment srk-progress-bar-frozen",
+              style: normalizeStyle({ width: `${(1 - progressMetrics.value.frozenBreakpoint) * 100}%` })
+            }, [
+              createElementVNode("div", {
+                class: "srk-progress-bar-fill",
+                style: normalizeStyle({ width: `${progressMetrics.value.frozenInnerPercent}%` })
+              }, null, 4)
+            ], 4)
+          ]),
+          __props.enableTimeTravel && progressMetrics.value.supportRegen ? (openBlock(), createElementBlock("div", _hoisted_4$3, [
+            timeTravelIsChanging.value ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: "srk-progress-slider-tooltip",
+              style: normalizeStyle({ left: `${durationMinutes.value ? timeTravelCurrentValue.value / durationMinutes.value * 100 : 0}%` })
+            }, toDisplayString(unref(secToTimeStr)(timeTravelCurrentValue.value * 60)), 5)) : createCommentVNode("", true),
+            withDirectives(createElementVNode("input", {
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => timeTravelCurrentValue.value = $event),
+              "aria-label": "Time Travel",
+              class: "srk-progress-slider",
+              max: durationMinutes.value,
+              min: "0",
+              step: "1",
+              title: unref(secToTimeStr)(timeTravelCurrentValue.value * 60),
+              type: "range",
+              onBlur: commitTimeTravel,
+              onKeydown: beginTimeTravel,
+              onKeyup: commitTimeTravel,
+              onMousedown: beginTimeTravel,
+              onMouseup: commitTimeTravel,
+              onTouchend: commitTimeTravel,
+              onTouchstart: beginTimeTravel
+            }, null, 40, _hoisted_5$3), [
+              [
+                vModelText,
+                timeTravelCurrentValue.value,
+                void 0,
+                { number: true }
+              ]
+            ])
+          ])) : createCommentVNode("", true)
+        ]),
+        createElementVNode("div", _hoisted_6$2, [
+          createElementVNode("div", {
+            class: "srk-progress-secondary-area-left",
+            style: normalizeStyle(__props.live || inTimeMachine.value ? {} : { display: "none" })
+          }, " Elapsed: " + toDisplayString(unref(secToTimeStr)(Math.round(progressMetrics.value.elapsed / 1e3))), 5),
+          createElementVNode("div", _hoisted_7$1, [
+            inTimeMachine.value ? (openBlock(), createElementBlock("div", _hoisted_8$1, [..._cache[1] || (_cache[1] = [
+              createElementVNode("div", { class: "srk-progress-time-machine-text" }, "Time Travel Mode", -1)
+            ])])) : __props.live && !isEnded.value ? (openBlock(), createElementBlock("div", _hoisted_9$1, "Live")) : (openBlock(), createElementBlock("div", _hoisted_10, "SRK"))
+          ]),
+          createElementVNode("div", {
+            class: "srk-progress-secondary-area-right",
+            style: normalizeStyle(__props.live || inTimeMachine.value ? {} : { display: "none" })
+          }, " Remaining: " + toDisplayString(unref(secToTimeStr)(Math.round(progressMetrics.value.remaining / 1e3))), 5)
+        ])
+      ]);
+    };
+  }
+});
+const _hoisted_1$3 = ["href"];
+const _hoisted_2$2 = { class: "srk--display-block" };
+const _hoisted_3$2 = ["title"];
+const _hoisted_4$2 = { class: "srk--display-block" };
+const _hoisted_5$2 = ["title"];
+const _sfc_main$3 = defineComponent({
+  __name: "ProblemHeaderCell",
+  props: {
+    problem: {},
+    index: {},
+    theme: { default: EnumTheme.light }
+  },
+  setup(__props) {
+    const props = __props;
+    const alias = computed(() => props.problem.alias || numberToAlphabet(props.index));
+    const stat = computed(() => props.problem.statistics);
+    const statDesc = computed(() => {
+      if (!stat.value) {
+        return "";
+      }
+      const ratio = stat.value.submitted ? (stat.value.accepted / stat.value.submitted * 100).toFixed(1) : 0;
+      return `${stat.value.accepted} / ${stat.value.submitted} (${ratio}%)`;
+    });
+    const backgroundImage = computed(() => getProblemHeaderBackgroundImage(props.problem.style, props.theme));
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("th", {
+        class: "srk--nowrap srk-problem-header",
+        style: normalizeStyle({ backgroundImage: backgroundImage.value })
+      }, [
+        __props.problem.link ? (openBlock(), createElementBlock("a", {
+          key: 0,
+          href: __props.problem.link,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          style: { "color": "unset" }
+        }, [
+          createElementVNode("span", _hoisted_2$2, toDisplayString(alias.value), 1),
+          stat.value ? (openBlock(), createElementBlock("span", {
+            key: 0,
+            class: "srk--display-block srk-problem-stats",
+            title: statDesc.value
+          }, toDisplayString(stat.value.accepted), 9, _hoisted_3$2)) : createCommentVNode("", true)
+        ], 8, _hoisted_1$3)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          createElementVNode("span", _hoisted_4$2, toDisplayString(alias.value), 1),
+          stat.value ? (openBlock(), createElementBlock("span", {
+            key: 0,
+            class: "srk--display-block srk-problem-stats",
+            title: statDesc.value
+          }, toDisplayString(stat.value.accepted), 9, _hoisted_5$2)) : createCommentVNode("", true)
+        ], 64))
+      ], 4);
+    };
+  }
+});
+const _hoisted_1$2 = { key: 4 };
+const _sfc_main$2 = defineComponent({
+  __name: "StatusCell",
+  props: {
+    status: {},
+    problem: {},
+    problemIndex: {},
+    user: {},
+    row: {},
+    rowIndex: {},
+    ranklist: {},
+    onSolutionClick: { type: Function }
+  },
+  setup(__props) {
+    const props = __props;
+    const solutions = computed(() => [...props.status.solutions || []].reverse());
+    const isClickable = computed(() => solutions.value.length > 0 && !!props.onSolutionClick);
+    const commonClassName = computed(() => [
+      "srk-prest-status-block",
+      "srk--text-center",
+      "srk--nowrap",
+      { "srk--cursor-pointer": isClickable.value }
+    ]);
+    function emitSolutionClick(event) {
+      var _a, _b;
+      if (!isClickable.value) {
+        return;
+      }
+      captureModalTriggerPointFromMouseEvent(event, {
+        source: "status-cell",
+        context: {
+          rowIndex: props.rowIndex,
+          problemIndex: props.problemIndex,
+          problemAlias: ((_a = props.problem) == null ? void 0 : _a.alias) || null,
+          problemTitle: props.problem ? props.problem.title : null,
+          userId: props.user.id || null
+        }
+      });
+      (_b = props.onSolutionClick) == null ? void 0 : _b.call(props, {
+        user: props.user,
+        row: props.row,
+        rowIndex: props.rowIndex,
+        problemIndex: props.problemIndex,
+        problem: props.problem,
+        status: props.status,
+        solutions: solutions.value,
+        ranklist: props.ranklist
+      });
+    }
+    const AcceptedStatusBody = defineComponent({
+      props: {
+        status: {
+          type: Object,
+          required: true
+        }
+      },
+      setup(childProps) {
+        return () => {
+          const status = childProps.status;
+          const details = getAcceptedStatusDetails(status);
+          if (typeof status.score === "number") {
+            return [
+              h("span", { class: "srk-prest-status-block-score" }, status.score),
+              h("span", { class: "srk-prest-status-block-score-details" }, details)
+            ];
+          }
+          return details;
+        };
+      }
+    });
+    return (_ctx, _cache) => {
+      return __props.status.result === "FB" ? (openBlock(), createElementBlock("td", {
+        key: 0,
+        class: normalizeClass([commonClassName.value, "srk-prest-status-block-fb"]),
+        onClick: withModifiers(emitSolutionClick, ["prevent"])
+      }, [
+        createVNode(unref(AcceptedStatusBody), { status: __props.status }, null, 8, ["status"])
+      ], 2)) : __props.status.result === "AC" ? (openBlock(), createElementBlock("td", {
+        key: 1,
+        class: normalizeClass([commonClassName.value, "srk-prest-status-block-accepted"]),
+        onClick: withModifiers(emitSolutionClick, ["prevent"])
+      }, [
+        createVNode(unref(AcceptedStatusBody), { status: __props.status }, null, 8, ["status"])
+      ], 2)) : __props.status.result === "?" ? (openBlock(), createElementBlock("td", {
+        key: 2,
+        class: normalizeClass([commonClassName.value, "srk-prest-status-block-frozen"]),
+        onClick: withModifiers(emitSolutionClick, ["prevent"])
+      }, toDisplayString(__props.status.tries), 3)) : __props.status.result === "RJ" ? (openBlock(), createElementBlock("td", {
+        key: 3,
+        class: normalizeClass([commonClassName.value, "srk-prest-status-block-failed"]),
+        onClick: withModifiers(emitSolutionClick, ["prevent"])
+      }, toDisplayString(__props.status.tries), 3)) : (openBlock(), createElementBlock("td", _hoisted_1$2));
+    };
+  }
+});
+const _hoisted_1$1 = { class: "srk-user-cell-content" };
+const _hoisted_2$1 = {
+  key: 0,
+  class: "srk-user-avatar"
+};
+const _hoisted_3$1 = ["src"];
+const _hoisted_4$1 = { class: "srk-user-body" };
+const _hoisted_5$1 = { class: "srk-user-name-row" };
+const _hoisted_6$1 = ["title"];
+const _hoisted_7 = { class: "srk-marker-dot-group" };
+const _hoisted_8 = ["data-tooltip"];
+const _hoisted_9 = {
+  key: 0,
+  class: "srk-user-secondary-text srk--text-ellipsis",
+  title: ""
+};
+const _sfc_main$1 = defineComponent({
+  __name: "UserCell",
+  props: {
+    user: {},
+    row: {},
+    rowIndex: {},
+    ranklist: {},
+    markers: { default: () => [] },
+    theme: { default: EnumTheme.light },
+    formatSrkAssetUrl: {},
+    onUserClick: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const name = computed(() => resolveText(props.user.name));
+    const userMarkers = computed(() => resolveUserMarkers(props.user, props.markers));
+    const resolvedMarkers = computed(() => userMarkers.value.map((marker) => ({
+      marker,
+      presentation: getMarkerPresentation(marker, props.theme)
+    })));
+    function emitUserClick(event) {
+      var _a;
+      captureModalTriggerPointFromMouseEvent(event, {
+        source: "user-cell",
+        context: {
+          rowIndex: props.rowIndex,
+          userId: props.user.id || null,
+          userName: name.value
+        }
+      });
+      (_a = props.onUserClick) == null ? void 0 : _a.call(props, {
+        user: props.user,
+        row: props.row,
+        rowIndex: props.rowIndex,
+        ranklist: props.ranklist
+      });
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("td", {
+        class: normalizeClass(["srk--text-left srk--nowrap srk-user-cell", { "srk--cursor-pointer": !!__props.onUserClick }]),
+        title: "",
+        onClick: withModifiers(emitUserClick, ["prevent"])
+      }, [
+        createElementVNode("div", _hoisted_1$1, [
+          __props.user.avatar ? (openBlock(), createElementBlock("div", _hoisted_2$1, [
+            createElementVNode("img", {
+              src: __props.formatSrkAssetUrl(__props.user.avatar, "user.avatar"),
+              alt: "User Avatar"
+            }, null, 8, _hoisted_3$1)
+          ])) : createCommentVNode("", true),
+          createElementVNode("div", _hoisted_4$1, [
+            createElementVNode("div", _hoisted_5$1, [
+              createElementVNode("span", {
+                class: "srk-user-name-text",
+                title: name.value
+              }, toDisplayString(name.value), 9, _hoisted_6$1),
+              createElementVNode("span", _hoisted_7, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(resolvedMarkers.value, (marker) => {
+                  return openBlock(), createElementBlock("span", {
+                    key: marker.marker.id,
+                    class: normalizeClass(["srk-marker srk-marker-dot srk--c-tooltip", marker.presentation.className]),
+                    style: normalizeStyle(marker.presentation.style),
+                    "data-tooltip": unref(resolveText)(marker.marker.label)
+                  }, null, 14, _hoisted_8);
+                }), 128))
+              ])
+            ]),
+            __props.user.organization ? (openBlock(), createElementBlock("p", _hoisted_9, toDisplayString(unref(resolveText)(__props.user.organization)), 1)) : createCommentVNode("", true)
+          ])
+        ])
+      ], 2);
+    };
+  }
+});
+const _hoisted_1 = { key: 0 };
+const _hoisted_2 = { key: 1 };
+const _hoisted_3 = {
+  key: 2,
+  class: "srk-common-table srk-main"
+};
+const _hoisted_4 = {
+  key: 0,
+  class: "srk--nowrap"
+};
+const _hoisted_5 = { class: "srk--text-right srk--nowrap" };
+const _hoisted_6 = {
+  key: 0,
+  class: "srk--text-right srk--nowrap"
+};
+const _sfc_main = defineComponent({
+  __name: "Ranklist",
+  props: {
+    data: {},
+    theme: { default: EnumTheme.light },
+    borderedRows: { type: Boolean, default: false },
+    stripedRows: { type: Boolean, default: false },
+    formatSrkAssetUrl: {}
+  },
+  emits: ["userClick", "solutionClick"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const resolvedTheme = computed(() => props.theme);
+    const supportedVersions = srkSupportedVersions;
+    const isSupportedVersion = computed(() => caniuse(props.data.version));
+    const showTimeColumn = computed(() => shouldShowTimeColumn(props.data.rows));
+    function formatAssetUrl(url, field) {
+      return resolveSrkAssetUrl(url, field, props.formatSrkAssetUrl);
+    }
+    function getRankValues(row) {
+      return row.rankValues || props.data.series.map(() => ({ rank: null, segmentIndex: null }));
+    }
+    function getRankText(rankValue, row) {
+      return rankValue.rank ? rankValue.rank : row.user.official === false ? "\uFF0A" : "";
+    }
+    function resolveSeriesSegment(rankValue, series) {
+      const index = rankValue.segmentIndex || rankValue.segmentIndex === 0 ? rankValue.segmentIndex : -1;
+      return ((series == null ? void 0 : series.segments) || [])[index] || {};
+    }
+    function getSeriesSegmentClass(rankValue, series) {
+      const segmentStyle = resolveSeriesSegment(rankValue, series).style;
+      return typeof segmentStyle === "string" ? `srk-preset-series-segment-${segmentStyle}` : "";
+    }
+    function getSeriesSegmentStyle(rankValue, series) {
+      const emptyColor = {
+        [EnumTheme.light]: void 0,
+        [EnumTheme.dark]: void 0
+      };
+      const segmentStyle = resolveSeriesSegment(rankValue, series).style;
+      if (!segmentStyle || typeof segmentStyle === "string") {
+        return {};
+      }
+      const style = resolveStyle(segmentStyle);
+      const textColor = style.textColor || emptyColor;
+      const backgroundColor = style.backgroundColor || emptyColor;
+      return {
+        color: textColor[props.theme],
+        backgroundColor: backgroundColor[props.theme]
+      };
+    }
+    function getStatusSolutions(status) {
+      return [...status.solutions || []].reverse();
+    }
+    function emitUserClick(payloadOrRow, rowIndex, event) {
+      if ("ranklist" in payloadOrRow) {
+        emit("userClick", payloadOrRow);
+        return;
+      }
+      if (event) {
+        captureModalTriggerPointFromMouseEvent(event, {
+          source: "user-cell",
+          context: {
+            rowIndex: rowIndex || 0,
+            userId: payloadOrRow.user.id || null,
+            userName: resolveText(payloadOrRow.user.name)
+          }
+        });
+      }
+      emit("userClick", {
+        user: payloadOrRow.user,
+        row: payloadOrRow,
+        rowIndex: rowIndex || 0,
+        ranklist: props.data
+      });
+    }
+    function emitSolutionClick(payloadOrRow, rowIndex, status, problemIndex, event) {
+      if ("solutions" in payloadOrRow) {
+        emit("solutionClick", payloadOrRow);
+        return;
+      }
+      const resolvedProblemIndex = problemIndex || 0;
+      const resolvedStatus = status || payloadOrRow.statuses[resolvedProblemIndex];
+      if (event) {
+        const problem = props.data.problems[resolvedProblemIndex];
+        captureModalTriggerPointFromMouseEvent(event, {
+          source: "status-cell",
+          context: {
+            rowIndex: rowIndex || 0,
+            problemIndex: resolvedProblemIndex,
+            problemAlias: (problem == null ? void 0 : problem.alias) || null,
+            problemTitle: problem ? resolveText(problem.title) : null,
+            userId: payloadOrRow.user.id || null
+          }
+        });
+      }
+      emit("solutionClick", {
+        user: payloadOrRow.user,
+        row: payloadOrRow,
+        rowIndex: rowIndex || 0,
+        problemIndex: resolvedProblemIndex,
+        problem: props.data.problems[resolvedProblemIndex],
+        status: resolvedStatus,
+        solutions: getStatusSolutions(resolvedStatus),
+        ranklist: props.data
+      });
+    }
+    return (_ctx, _cache) => {
+      return __props.data.type !== "general" ? (openBlock(), createElementBlock("div", _hoisted_1, 'srk type "' + toDisplayString(__props.data.type) + '" is not supported', 1)) : !isSupportedVersion.value ? (openBlock(), createElementBlock("div", _hoisted_2, ' srk version "' + toDisplayString(__props.data.version) + '" is not supported (current supported: ' + toDisplayString(unref(supportedVersions)) + ") ", 1)) : (openBlock(), createElementBlock("div", _hoisted_3, [
+        createElementVNode("table", {
+          class: normalizeClass({ "srk-table-row-bordered": __props.borderedRows, "srk-table-row-striped": __props.stripedRows })
+        }, [
+          createElementVNode("thead", null, [
+            createElementVNode("tr", null, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.data.series, (seriesItem) => {
+                return openBlock(), createElementBlock("th", {
+                  key: seriesItem.title,
+                  class: "srk-series-header srk--text-right srk--nowrap"
+                }, toDisplayString(seriesItem.title), 1);
+              }), 128)),
+              _cache[0] || (_cache[0] = createElementVNode("th", { class: "srk--text-left srk--nowrap" }, "Name", -1)),
+              _cache[1] || (_cache[1] = createElementVNode("th", { class: "srk--nowrap" }, "Score", -1)),
+              showTimeColumn.value ? (openBlock(), createElementBlock("th", _hoisted_4, "Time")) : createCommentVNode("", true),
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.data.problems, (problem, problemIndex) => {
+                return renderSlot(_ctx.$slots, "problem-header-cell", mergeProps({
+                  key: problem.alias || unref(resolveText)(problem.title) || problemIndex,
+                  ref_for: true
+                }, { problem, problemIndex, index: problemIndex, theme: resolvedTheme.value }), () => [
+                  createVNode(_sfc_main$3, {
+                    problem,
+                    index: problemIndex,
+                    theme: resolvedTheme.value
+                  }, null, 8, ["problem", "index", "theme"])
+                ]);
+              }), 128))
+            ])
+          ]),
+          createElementVNode("tbody", null, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.data.rows, (row, rowIndex) => {
+              return openBlock(), createElementBlock("tr", {
+                key: row.user.id || unref(resolveText)(row.user.name)
+              }, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(getRankValues(row), (rankValue, seriesIndex) => {
+                  var _a;
+                  return openBlock(), createElementBlock("td", {
+                    key: ((_a = __props.data.series[seriesIndex]) == null ? void 0 : _a.title) || seriesIndex,
+                    class: normalizeClass(["srk--text-right srk--nowrap", getSeriesSegmentClass(rankValue, __props.data.series[seriesIndex])]),
+                    style: normalizeStyle(getSeriesSegmentStyle(rankValue, __props.data.series[seriesIndex]))
+                  }, toDisplayString(getRankText(rankValue, row)), 7);
+                }), 128)),
+                renderSlot(_ctx.$slots, "user-cell", mergeProps({ ref_for: true }, {
+                  user: row.user,
+                  row,
+                  rowIndex,
+                  ranklist: __props.data,
+                  markers: __props.data.markers,
+                  theme: resolvedTheme.value,
+                  onClick: (event) => emitUserClick(row, rowIndex, event)
+                }), () => [
+                  createVNode(_sfc_main$1, {
+                    user: row.user,
+                    row,
+                    "row-index": rowIndex,
+                    ranklist: __props.data,
+                    markers: __props.data.markers,
+                    theme: resolvedTheme.value,
+                    "format-srk-asset-url": formatAssetUrl,
+                    "on-user-click": emitUserClick
+                  }, null, 8, ["user", "row", "row-index", "ranklist", "markers", "theme"])
+                ]),
+                createElementVNode("td", _hoisted_5, toDisplayString(row.score.value), 1),
+                showTimeColumn.value ? (openBlock(), createElementBlock("td", _hoisted_6, toDisplayString(row.score.time ? unref(formatTimeDuration)(row.score.time, "min", Math.floor) : "-"), 1)) : createCommentVNode("", true),
+                (openBlock(true), createElementBlock(Fragment, null, renderList(row.statuses, (status, problemIndex) => {
+                  var _a;
+                  return renderSlot(_ctx.$slots, "status-cell", mergeProps({
+                    key: ((_a = __props.data.problems[problemIndex]) == null ? void 0 : _a.alias) || problemIndex,
+                    ref_for: true
+                  }, {
+                    status,
+                    problem: __props.data.problems[problemIndex],
+                    problemIndex,
+                    user: row.user,
+                    row,
+                    rowIndex,
+                    ranklist: __props.data,
+                    solutions: getStatusSolutions(status),
+                    onClick: (event) => emitSolutionClick(row, rowIndex, status, problemIndex, event)
+                  }), () => [
+                    createVNode(_sfc_main$2, {
+                      status,
+                      problem: __props.data.problems[problemIndex],
+                      "problem-index": problemIndex,
+                      user: row.user,
+                      row,
+                      "row-index": rowIndex,
+                      ranklist: __props.data,
+                      "on-solution-click": emitSolutionClick
+                    }, null, 8, ["status", "problem", "problem-index", "user", "row", "row-index", "ranklist"])
+                  ]);
+                }), 128))
+              ]);
+            }), 128))
+          ])
+        ], 2)
+      ]));
+    };
+  }
+});
+export { _sfc_main$6 as DefaultSolutionModal, _sfc_main$5 as DefaultUserModal, _sfc_main$7 as Modal, _sfc_main$4 as ProgressBar, _sfc_main as Ranklist };