@algoux/standard-ranklist-renderer-component-vue 0.5.1 → 0.6.1

package/dist/index.js

@@ -1,9 +1,9 @@
 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 { 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, createTextVNode } 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, getRankProblemStatusCellPresentation, captureModalTriggerPointFromMouseEvent, caniuse, shouldShowTimeColumn, calculateProblemStatisticsFooter, calculateDirtPercentage, calculateSEValue, srkSupportedVersions, formatProblemStatisticsAcceptedMinute, formatProblemStatisticsAverageHardness, formatProblemStatisticsPercent } 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_2$7 = ["aria-labelledby"];
 const _hoisted_3$5 = { class: "srk-modal-content" };
 const _hoisted_4$5 = {
   key: 0,
@@ -188,14 +188,14 @@ const _sfc_main$7 = defineComponent({
                 renderSlot(_ctx.$slots, "default")
               ])
             ])
-          ], 12, _hoisted_2$6)
+          ], 12, _hoisted_2$7)
         ], 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 _hoisted_2$6 = { class: "srk--text-right" };
 const _sfc_main$6 = defineComponent({
   __name: "DefaultSolutionModal",
   props: {
@@ -262,7 +262,7 @@ const _sfc_main$6 = defineComponent({
                       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)
+                  createElementVNode("td", _hoisted_2$6, toDisplayString(unref(formatSolutionTimestamp)(solution)), 1)
                 ]);
               }), 128))
             ])
@@ -274,7 +274,7 @@ const _sfc_main$6 = defineComponent({
   }
 });
 const _hoisted_1$5 = { class: "srk-user-modal-info" };
-const _hoisted_2$4 = { class: "srk-user-modal-info-user-name" };
+const _hoisted_2$5 = { class: "srk-user-modal-info-user-name" };
 const _hoisted_3$4 = {
   key: 0,
   class: "srk-user-modal-info-user-second-name"
@@ -285,15 +285,15 @@ const _hoisted_6$3 = {
   key: 1,
   class: "srk-user-modal-info-team-members"
 };
-const _hoisted_7$2 = {
+const _hoisted_7$3 = {
   key: 0,
   class: "srk-user-modal-info-team-members-slash"
 };
-const _hoisted_8$2 = {
+const _hoisted_8$3 = {
   key: 2,
   class: "srk-user-modal-info-photo"
 };
-const _hoisted_9$2 = ["src"];
+const _hoisted_9$3 = ["src"];
 const _sfc_main$5 = defineComponent({
   __name: "DefaultUserModal",
   props: {
@@ -339,7 +339,7 @@ const _sfc_main$5 = defineComponent({
       }, {
         default: withCtx(() => [
           createElementVNode("div", _hoisted_1$5, [
-            createElementVNode("h3", _hoisted_2$4, toDisplayString(unref(resolveText)(cachedUser.value.name)), 1),
+            createElementVNode("h3", _hoisted_2$5, 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),
@@ -356,17 +356,17 @@ const _sfc_main$5 = defineComponent({
                 return openBlock(), createElementBlock(Fragment, {
                   key: unref(resolveText)(member.name)
                 }, [
-                  index > 0 ? (openBlock(), createElementBlock("span", _hoisted_7$2, " / ")) : createCommentVNode("", true),
+                  index > 0 ? (openBlock(), createElementBlock("span", _hoisted_7$3, " / ")) : createCommentVNode("", true),
                   createElementVNode("span", null, toDisplayString(unref(resolveText)(member.name)), 1)
                 ], 64);
               }), 128))
             ])) : createCommentVNode("", true),
-            cachedUser.value.photo ? (openBlock(), createElementBlock("div", _hoisted_8$2, [
+            cachedUser.value.photo ? (openBlock(), createElementBlock("div", _hoisted_8$3, [
               createElementVNode("img", {
                 src: formatAssetUrl(cachedUser.value.photo, "user.photo"),
                 alt: "User portrait",
                 class: "srk-user-modal-info-photo-img"
-              }, null, 8, _hoisted_9$2)
+              }, null, 8, _hoisted_9$3)
             ])) : createCommentVNode("", true)
           ])
         ]),
@@ -376,7 +376,7 @@ const _sfc_main$5 = defineComponent({
   }
 });
 const _hoisted_1$4 = { class: "srk-progress-bar-container" };
-const _hoisted_2$3 = { class: "srk-progress-bar" };
+const _hoisted_2$4 = { class: "srk-progress-bar" };
 const _hoisted_3$3 = { class: "srk-progress-bar-body" };
 const _hoisted_4$3 = {
   key: 0,
@@ -384,16 +384,16 @@ const _hoisted_4$3 = {
 };
 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 = {
+const _hoisted_7$2 = { class: "srk-progress-secondary-area-center" };
+const _hoisted_8$2 = {
   key: 0,
   class: "srk-progress-time-machine-status"
 };
-const _hoisted_9$1 = {
+const _hoisted_9$2 = {
   key: 1,
   class: "srk-progress-live-text"
 };
-const _hoisted_10 = {
+const _hoisted_10$1 = {
   key: 2,
   style: { "visibility": "hidden" }
 };
@@ -475,7 +475,7 @@ const _sfc_main$4 = defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$4, [
-        createElementVNode("div", _hoisted_2$3, [
+        createElementVNode("div", _hoisted_2$4, [
           createElementVNode("div", _hoisted_3$3, [
             createElementVNode("div", {
               class: "srk-progress-bar-segment srk-progress-bar-normal",
@@ -533,10 +533,10 @@ const _sfc_main$4 = defineComponent({
             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", _hoisted_7$2, [
+            inTimeMachine.value ? (openBlock(), createElementBlock("div", _hoisted_8$2, [..._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"))
+            ])])) : __props.live && !isEnded.value ? (openBlock(), createElementBlock("div", _hoisted_9$2, "Live")) : (openBlock(), createElementBlock("div", _hoisted_10$1, "SRK"))
           ]),
           createElementVNode("div", {
             class: "srk-progress-secondary-area-right",
@@ -548,7 +548,7 @@ const _sfc_main$4 = defineComponent({
   }
 });
 const _hoisted_1$3 = ["href"];
-const _hoisted_2$2 = { class: "srk--display-block" };
+const _hoisted_2$3 = { class: "srk--display-block" };
 const _hoisted_3$2 = ["title"];
 const _hoisted_4$2 = { class: "srk--display-block" };
 const _hoisted_5$2 = ["title"];
@@ -583,7 +583,7 @@ const _sfc_main$3 = defineComponent({
           rel: "noopener noreferrer",
           style: { "color": "unset" }
         }, [
-          createElementVNode("span", _hoisted_2$2, toDisplayString(alias.value), 1),
+          createElementVNode("span", _hoisted_2$3, toDisplayString(alias.value), 1),
           stat.value ? (openBlock(), createElementBlock("span", {
             key: 0,
             class: "srk--display-block srk-problem-stats",
@@ -601,7 +601,15 @@ const _sfc_main$3 = defineComponent({
     };
   }
 });
-const _hoisted_1$2 = { key: 4 };
+const _hoisted_1$2 = {
+  key: 0,
+  class: "srk-prest-status-block-fb-star"
+};
+const _hoisted_2$2 = {
+  key: 4,
+  class: "srk-status-placeholder-cell srk--text-center srk--nowrap"
+};
+const fbStar = "\u2605";
 const _sfc_main$2 = defineComponent({
   __name: "StatusCell",
   props: {
@@ -612,7 +620,10 @@ const _sfc_main$2 = defineComponent({
     row: {},
     rowIndex: {},
     ranklist: {},
-    onSolutionClick: { type: Function }
+    onSolutionClick: {},
+    statusCellPreset: { default: "classic" },
+    statusColorAsText: { type: Boolean, default: false },
+    emptyStatusPlaceholder: { default: null }
   },
   setup(__props) {
     const props = __props;
@@ -622,7 +633,10 @@ const _sfc_main$2 = defineComponent({
       "srk-prest-status-block",
       "srk--text-center",
       "srk--nowrap",
-      { "srk--cursor-pointer": isClickable.value }
+      {
+        "srk--cursor-pointer": isClickable.value,
+        "srk-prest-status-block-color-text": props.statusColorAsText
+      }
     ]);
     function emitSolutionClick(event) {
       var _a, _b;
@@ -635,7 +649,7 @@ const _sfc_main$2 = defineComponent({
           rowIndex: props.rowIndex,
           problemIndex: props.problemIndex,
           problemAlias: ((_a = props.problem) == null ? void 0 : _a.alias) || null,
-          problemTitle: props.problem ? props.problem.title : null,
+          problemTitle: props.problem ? resolveText(props.problem.title) : null,
           userId: props.user.id || null
         }
       });
@@ -650,24 +664,41 @@ const _sfc_main$2 = defineComponent({
         ranklist: props.ranklist
       });
     }
-    const AcceptedStatusBody = defineComponent({
+    const StatusBody = defineComponent({
       props: {
         status: {
           type: Object,
           required: true
+        },
+        ranklist: {
+          type: Object,
+          required: true
+        },
+        preset: {
+          type: String,
+          required: true
         }
       },
       setup(childProps) {
         return () => {
           const status = childProps.status;
-          const details = getAcceptedStatusDetails(status);
-          if (typeof status.score === "number") {
+          const ranklist = childProps.ranklist;
+          const preset = childProps.preset;
+          const presentation = getRankProblemStatusCellPresentation(status, ranklist, preset);
+          if (typeof presentation.score === "number") {
             return [
-              h("span", { class: "srk-prest-status-block-score" }, status.score),
-              h("span", { class: "srk-prest-status-block-score-details" }, details)
+              h("span", { class: "srk-prest-status-block-score" }, presentation.score),
+              h("span", { class: "srk-prest-status-block-score-details" }, presentation.scoreDetails)
             ];
           }
-          return details;
+          if (presentation.secondary !== void 0) {
+            return [
+              h("span", { class: "srk-prest-status-block-primary" }, presentation.primary || ""),
+              " ",
+              h("span", { class: "srk-prest-status-block-secondary" }, presentation.secondary)
+            ];
+          }
+          return presentation.primary || "";
         };
       }
     });
@@ -677,22 +708,43 @@ const _sfc_main$2 = defineComponent({
         class: normalizeClass([commonClassName.value, "srk-prest-status-block-fb"]),
         onClick: withModifiers(emitSolutionClick, ["prevent"])
       }, [
-        createVNode(unref(AcceptedStatusBody), { status: __props.status }, null, 8, ["status"])
+        __props.statusColorAsText ? (openBlock(), createElementBlock("span", _hoisted_1$2, toDisplayString(fbStar))) : createCommentVNode("", true),
+        createVNode(unref(StatusBody), {
+          status: __props.status,
+          ranklist: __props.ranklist,
+          preset: __props.statusCellPreset
+        }, null, 8, ["status", "ranklist", "preset"])
       ], 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"])
+        createVNode(unref(StatusBody), {
+          status: __props.status,
+          ranklist: __props.ranklist,
+          preset: __props.statusCellPreset
+        }, null, 8, ["status", "ranklist", "preset"])
       ], 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", {
+      }, [
+        createVNode(unref(StatusBody), {
+          status: __props.status,
+          ranklist: __props.ranklist,
+          preset: __props.statusCellPreset
+        }, null, 8, ["status", "ranklist", "preset"])
+      ], 2)) : __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));
+      }, [
+        createVNode(unref(StatusBody), {
+          status: __props.status,
+          ranklist: __props.ranklist,
+          preset: __props.statusCellPreset
+        }, null, 8, ["status", "ranklist", "preset"])
+      ], 2)) : (openBlock(), createElementBlock("td", _hoisted_2$2, toDisplayString(__props.emptyStatusPlaceholder), 1));
     };
   }
 });
@@ -705,9 +757,9 @@ 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 = {
+const _hoisted_7$1 = { class: "srk-marker-dot-group" };
+const _hoisted_8$1 = ["data-tooltip"];
+const _hoisted_9$1 = {
   key: 0,
   class: "srk-user-secondary-text srk--text-ellipsis",
   title: ""
@@ -722,7 +774,9 @@ const _sfc_main$1 = defineComponent({
     markers: { default: () => [] },
     theme: { default: EnumTheme.light },
     formatSrkAssetUrl: {},
-    onUserClick: {}
+    onUserClick: {},
+    hideOrganization: { type: Boolean, default: false },
+    hideAvatar: { type: Boolean, default: false }
   },
   setup(__props) {
     const props = __props;
@@ -756,7 +810,7 @@ const _sfc_main$1 = defineComponent({
         onClick: withModifiers(emitUserClick, ["prevent"])
       }, [
         createElementVNode("div", _hoisted_1$1, [
-          __props.user.avatar ? (openBlock(), createElementBlock("div", _hoisted_2$1, [
+          __props.user.avatar && !__props.hideAvatar ? (openBlock(), createElementBlock("div", _hoisted_2$1, [
             createElementVNode("img", {
               src: __props.formatSrkAssetUrl(__props.user.avatar, "user.avatar"),
               alt: "User Avatar"
@@ -768,18 +822,18 @@ const _sfc_main$1 = defineComponent({
                 class: "srk-user-name-text",
                 title: name.value
               }, toDisplayString(name.value), 9, _hoisted_6$1),
-              createElementVNode("span", _hoisted_7, [
+              createElementVNode("span", _hoisted_7$1, [
                 (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);
+                  }, null, 14, _hoisted_8$1);
                 }), 128))
               ])
             ]),
-            __props.user.organization ? (openBlock(), createElementBlock("p", _hoisted_9, toDisplayString(unref(resolveText)(__props.user.organization)), 1)) : createCommentVNode("", true)
+            __props.user.organization && !__props.hideOrganization ? (openBlock(), createElementBlock("p", _hoisted_9$1, toDisplayString(unref(resolveText)(__props.user.organization)), 1)) : createCommentVNode("", true)
           ])
         ])
       ], 2);
@@ -794,21 +848,85 @@ const _hoisted_3 = {
 };
 const _hoisted_4 = {
   key: 0,
-  class: "srk--nowrap"
+  class: "srk-organization-header srk--text-left srk--nowrap"
+};
+const _hoisted_5 = { class: "srk--text-left srk--nowrap" };
+const _hoisted_6 = { class: "srk--text-right srk--nowrap" };
+const _hoisted_7 = {
+  key: 1,
+  class: "srk--text-right srk--nowrap"
 };
-const _hoisted_5 = { class: "srk--text-right srk--nowrap" };
-const _hoisted_6 = {
+const _hoisted_8 = {
+  key: 2,
+  class: "srk-dirt-header srk--text-right srk--nowrap"
+};
+const _hoisted_9 = {
+  key: 3,
+  class: "srk-se-header srk--text-right srk--nowrap"
+};
+const _hoisted_10 = { class: "srk-organization-cell-content" };
+const _hoisted_11 = {
   key: 0,
+  class: "srk-user-avatar"
+};
+const _hoisted_12 = ["src"];
+const _hoisted_13 = ["title"];
+const _hoisted_14 = { class: "srk--text-right srk--nowrap" };
+const _hoisted_15 = {
+  key: 1,
   class: "srk--text-right srk--nowrap"
 };
+const _hoisted_16 = {
+  key: 2,
+  class: "srk-dirt-cell srk--text-right srk--nowrap"
+};
+const _hoisted_17 = {
+  key: 3,
+  class: "srk-se-cell srk--text-right srk--nowrap"
+};
+const _hoisted_18 = { key: 0 };
+const _hoisted_19 = ["colspan"];
+const _hoisted_20 = ["data-tooltip"];
+const _hoisted_21 = { class: "srk-problem-statistics-footer-primary" };
+const _hoisted_22 = { class: "srk-problem-statistics-footer-secondary" };
+const _hoisted_23 = {
+  key: 0,
+  class: "srk-problem-statistics-footer-cell srk-extra-statistics-footer-cell srk-dirt-footer-cell srk--nowrap"
+};
+const _hoisted_24 = {
+  key: 1,
+  class: "srk-problem-statistics-footer-cell srk-extra-statistics-footer-cell srk-se-footer-cell srk--nowrap"
+};
+const _hoisted_25 = { class: "srk-problem-statistics-footer-row srk-problem-statistics-footer-problem-label-row" };
+const _hoisted_26 = ["colspan"];
+const _hoisted_27 = { class: "srk--display-block" };
+const _hoisted_28 = {
+  key: 0,
+  class: "srk-problem-statistics-footer-cell srk-extra-statistics-footer-cell srk-dirt-footer-cell srk--nowrap"
+};
+const _hoisted_29 = {
+  key: 1,
+  class: "srk-problem-statistics-footer-cell srk-extra-statistics-footer-cell srk-se-footer-cell srk--nowrap"
+};
 const _sfc_main = defineComponent({
   __name: "Ranklist",
   props: {
     data: {},
     theme: { default: EnumTheme.light },
     borderedRows: { type: Boolean, default: false },
+    rowBordered: { type: Boolean, default: false },
+    columnBordered: { type: Boolean, default: false },
     stripedRows: { type: Boolean, default: false },
-    formatSrkAssetUrl: {}
+    formatSrkAssetUrl: {},
+    splitOrganization: { type: Boolean, default: false },
+    columnTitles: {},
+    statusCellPreset: { default: "classic" },
+    statusColorAsText: { type: Boolean, default: false },
+    showProblemStatisticsFooter: { type: Boolean, default: false },
+    showDirtColumn: { type: Boolean, default: false },
+    showSEColumn: { type: Boolean, default: false },
+    emptyStatusPlaceholder: { default: null },
+    userAvatarPlacement: { default: "user" }
   },
   emits: ["userClick", "solutionClick"],
   setup(__props, { emit: __emit }) {
@@ -818,6 +936,46 @@ const _sfc_main = defineComponent({
     const supportedVersions = srkSupportedVersions;
     const isSupportedVersion = computed(() => caniuse(props.data.version));
     const showTimeColumn = computed(() => shouldShowTimeColumn(props.data.rows));
+    const showAvatarInOrganization = computed(() => props.splitOrganization && props.userAvatarPlacement === "organization");
+    const problemStatistics = computed(() => props.showProblemStatisticsFooter || props.showSEColumn ? calculateProblemStatisticsFooter(props.data) : []);
+    const leftFooterColumnCount = computed(() => props.data.series.length + 1 + 1 + (showTimeColumn.value ? 1 : 0) + (props.splitOrganization ? 1 : 0));
+    const problemStatisticsFooterRows = [
+      {
+        key: "accepted",
+        label: "Accepted",
+        tooltip: "Number of participants who solved this problem"
+      },
+      {
+        key: "tried",
+        label: "Tried",
+        tooltip: "Number of participants who attempted this problem"
+      },
+      {
+        key: "submitted",
+        label: "Submitted",
+        tooltip: "Total number of valid submissions for this problem"
+      },
+      {
+        key: "dirt",
+        label: "Dirt",
+        tooltip: "Wrong submissions among participants who solved this problem"
+      },
+      {
+        key: "se",
+        label: "SE",
+        tooltip: "Average hardness, calculated as (participants - accepted) / participants"
+      },
+      {
+        key: "firstAccepted",
+        label: "FB at",
+        tooltip: "First Blood at, also known as first solve time, in minutes"
+      },
+      {
+        key: "lastAccepted",
+        label: "LB at",
+        tooltip: "Last Blood at, also known as last solve time, in minutes"
+      }
+    ];
     function formatAssetUrl(url, field) {
       return resolveSrkAssetUrl(url, field, props.formatSrkAssetUrl);
     }
@@ -827,6 +985,24 @@ const _sfc_main = defineComponent({
     function getRankText(rankValue, row) {
       return rankValue.rank ? rankValue.rank : row.user.official === false ? "\uFF0A" : "";
     }
+    function isSeriesSegmentedColumn(series) {
+      return ((series == null ? void 0 : series.segments) || []).some((segment) => typeof segment.style === "string");
+    }
+    function resolveSeriesColumnTitle(series, index) {
+      var _a, _b, _c;
+      const seriesTitles = (_a = props.columnTitles) == null ? void 0 : _a.series;
+      if (typeof seriesTitles === "function") {
+        return (_b = seriesTitles(series, index)) != null ? _b : series.title;
+      }
+      if (Array.isArray(seriesTitles)) {
+        return (_c = seriesTitles[index]) != null ? _c : series.title;
+      }
+      return series.title;
+    }
+    function resolveColumnTitle(key, fallback) {
+      var _a, _b;
+      return (_b = (_a = props.columnTitles) == null ? void 0 : _a[key]) != null ? _b : fallback;
+    }
     function resolveSeriesSegment(rankValue, series) {
       const index = rankValue.segmentIndex || rankValue.segmentIndex === 0 ? rankValue.segmentIndex : -1;
       return ((series == null ? void 0 : series.segments) || [])[index] || {};
@@ -855,6 +1031,38 @@ const _sfc_main = defineComponent({
     function getStatusSolutions(status) {
       return [...status.solutions || []].reverse();
     }
+    function getProblemStatisticsFooterCellPrimary(key, stat) {
+      switch (key) {
+        case "accepted":
+          return stat.accepted;
+        case "tried":
+          return stat.tried;
+        case "submitted":
+          return stat.submitted;
+        case "dirt":
+          return stat.dirt;
+        case "se":
+          return formatProblemStatisticsAverageHardness(stat);
+        case "firstAccepted":
+          return formatProblemStatisticsAcceptedMinute(stat.firstAcceptedTime);
+        case "lastAccepted":
+          return formatProblemStatisticsAcceptedMinute(stat.lastAcceptedTime);
+        default:
+          return "";
+      }
+    }
+    function getProblemStatisticsFooterCellSecondary(key, stat) {
+      switch (key) {
+        case "accepted":
+          return formatProblemStatisticsPercent(stat.accepted, stat.participantCount);
+        case "tried":
+          return formatProblemStatisticsPercent(stat.tried, stat.participantCount);
+        case "dirt":
+          return formatProblemStatisticsPercent(stat.dirt, stat.dirtSubmitted);
+        default:
+          return void 0;
+      }
+    }
     function emitUserClick(payloadOrRow, rowIndex, event) {
       if ("ranklist" in payloadOrRow) {
         emit("userClick", payloadOrRow);
@@ -911,19 +1119,24 @@ const _sfc_main = defineComponent({
     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 })
+          class: normalizeClass({
+            "srk-table-row-bordered": __props.borderedRows || __props.rowBordered,
+            "srk-table-column-bordered": __props.columnBordered,
+            "srk-table-row-striped": __props.stripedRows
+          })
         }, [
           createElementVNode("thead", null, [
             createElementVNode("tr", null, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.data.series, (seriesItem) => {
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.data.series, (seriesItem, seriesIndex) => {
                 return openBlock(), createElementBlock("th", {
                   key: seriesItem.title,
-                  class: "srk-series-header srk--text-right srk--nowrap"
-                }, toDisplayString(seriesItem.title), 1);
+                  class: normalizeClass(["srk-series-header srk--text-right srk--nowrap", { "srk-series-segmented-column": isSeriesSegmentedColumn(seriesItem) }])
+                }, toDisplayString(resolveSeriesColumnTitle(seriesItem, seriesIndex)), 3);
               }), 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),
+              __props.splitOrganization ? (openBlock(), createElementBlock("th", _hoisted_4, toDisplayString(resolveColumnTitle("organization", "Organization")), 1)) : createCommentVNode("", true),
+              createElementVNode("th", _hoisted_5, toDisplayString(resolveColumnTitle("user", "Name")), 1),
+              createElementVNode("th", _hoisted_6, toDisplayString(resolveColumnTitle("score", "Score")), 1),
+              showTimeColumn.value ? (openBlock(), createElementBlock("th", _hoisted_7, toDisplayString(resolveColumnTitle("time", "Time")), 1)) : 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,
@@ -935,7 +1148,9 @@ const _sfc_main = defineComponent({
                     theme: resolvedTheme.value
                   }, null, 8, ["problem", "index", "theme"])
                 ]);
-              }), 128))
+              }), 128)),
+              __props.showDirtColumn ? (openBlock(), createElementBlock("th", _hoisted_8, toDisplayString(resolveColumnTitle("dirt", "Dirt")), 1)) : createCommentVNode("", true),
+              __props.showSEColumn ? (openBlock(), createElementBlock("th", _hoisted_9, toDisplayString(resolveColumnTitle("se", "SE")), 1)) : createCommentVNode("", true)
             ])
           ]),
           createElementVNode("tbody", null, [
@@ -947,10 +1162,30 @@ const _sfc_main = defineComponent({
                   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])]),
+                    class: normalizeClass(["srk--text-right srk--nowrap", [
+                      getSeriesSegmentClass(rankValue, __props.data.series[seriesIndex]),
+                      { "srk-series-segmented-column": isSeriesSegmentedColumn(__props.data.series[seriesIndex]) }
+                    ]]),
                     style: normalizeStyle(getSeriesSegmentStyle(rankValue, __props.data.series[seriesIndex]))
                   }, toDisplayString(getRankText(rankValue, row)), 7);
                 }), 128)),
+                __props.splitOrganization ? (openBlock(), createElementBlock("td", {
+                  key: 0,
+                  class: normalizeClass(["srk-organization-cell srk--text-left srk--nowrap", { "srk-organization-cell-avatar": showAvatarInOrganization.value && !!row.user.avatar }])
+                }, [
+                  createElementVNode("div", _hoisted_10, [
+                    showAvatarInOrganization.value && row.user.avatar ? (openBlock(), createElementBlock("div", _hoisted_11, [
+                      createElementVNode("img", {
+                        src: formatAssetUrl(row.user.avatar, "user.avatar"),
+                        alt: "User Avatar"
+                      }, null, 8, _hoisted_12)
+                    ])) : createCommentVNode("", true),
+                    createElementVNode("span", {
+                      class: "srk-organization-name-text",
+                      title: row.user.organization ? unref(resolveText)(row.user.organization) : ""
+                    }, toDisplayString(row.user.organization ? unref(resolveText)(row.user.organization) : ""), 9, _hoisted_13)
+                  ])
+                ], 2)) : createCommentVNode("", true),
                 renderSlot(_ctx.$slots, "user-cell", mergeProps({ ref_for: true }, {
                   user: row.user,
                   row,
@@ -958,6 +1193,8 @@ const _sfc_main = defineComponent({
                   ranklist: __props.data,
                   markers: __props.data.markers,
                   theme: resolvedTheme.value,
+                  hideOrganization: __props.splitOrganization,
+                  hideAvatar: showAvatarInOrganization.value,
                   onClick: (event) => emitUserClick(row, rowIndex, event)
                 }), () => [
                   createVNode(_sfc_main$1, {
@@ -968,11 +1205,13 @@ const _sfc_main = defineComponent({
                     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"])
+                    "on-user-click": emitUserClick,
+                    "hide-organization": __props.splitOrganization,
+                    "hide-avatar": showAvatarInOrganization.value
+                  }, null, 8, ["user", "row", "row-index", "ranklist", "markers", "theme", "hide-organization", "hide-avatar"])
                 ]),
-                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),
+                createElementVNode("td", _hoisted_14, toDisplayString(row.score.value), 1),
+                showTimeColumn.value ? (openBlock(), createElementBlock("td", _hoisted_15, 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({
@@ -987,6 +1226,9 @@ const _sfc_main = defineComponent({
                     rowIndex,
                     ranklist: __props.data,
                     solutions: getStatusSolutions(status),
+                    statusCellPreset: __props.statusCellPreset,
+                    statusColorAsText: __props.statusColorAsText,
+                    emptyStatusPlaceholder: __props.emptyStatusPlaceholder,
                     onClick: (event) => emitSolutionClick(row, rowIndex, status, problemIndex, event)
                   }), () => [
                     createVNode(_sfc_main$2, {
@@ -997,13 +1239,76 @@ const _sfc_main = defineComponent({
                       row,
                       "row-index": rowIndex,
                       ranklist: __props.data,
-                      "on-solution-click": emitSolutionClick
-                    }, null, 8, ["status", "problem", "problem-index", "user", "row", "row-index", "ranklist"])
+                      "on-solution-click": emitSolutionClick,
+                      "status-cell-preset": __props.statusCellPreset,
+                      "status-color-as-text": __props.statusColorAsText,
+                      "empty-status-placeholder": __props.emptyStatusPlaceholder
+                    }, null, 8, ["status", "problem", "problem-index", "user", "row", "row-index", "ranklist", "status-cell-preset", "status-color-as-text", "empty-status-placeholder"])
                   ]);
-                }), 128))
+                }), 128)),
+                __props.showDirtColumn ? (openBlock(), createElementBlock("td", _hoisted_16, toDisplayString(unref(calculateDirtPercentage)(row)), 1)) : createCommentVNode("", true),
+                __props.showSEColumn ? (openBlock(), createElementBlock("td", _hoisted_17, toDisplayString(unref(calculateSEValue)(row, problemStatistics.value)), 1)) : createCommentVNode("", true)
               ]);
             }), 128))
-          ])
+          ]),
+          __props.showProblemStatisticsFooter ? (openBlock(), createElementBlock("tfoot", _hoisted_18, [
+            (openBlock(), createElementBlock(Fragment, null, renderList(problemStatisticsFooterRows, (footerRow) => {
+              return createElementVNode("tr", {
+                key: footerRow.key,
+                class: "srk-problem-statistics-footer-row"
+              }, [
+                createElementVNode("td", {
+                  class: "srk-problem-statistics-footer-labels srk--text-right srk--nowrap",
+                  colspan: leftFooterColumnCount.value
+                }, [
+                  createElementVNode("span", {
+                    class: "srk-problem-statistics-footer-label srk--c-tooltip",
+                    "data-tooltip": footerRow.tooltip
+                  }, toDisplayString(footerRow.label), 9, _hoisted_20)
+                ], 8, _hoisted_19),
+                (openBlock(true), createElementBlock(Fragment, null, renderList(problemStatistics.value, (stat, problemIndex) => {
+                  var _a;
+                  return openBlock(), createElementBlock("td", {
+                    key: ((_a = __props.data.problems[problemIndex]) == null ? void 0 : _a.alias) || problemIndex,
+                    class: "srk-problem-statistics-footer-cell srk--text-center srk--nowrap"
+                  }, [
+                    createElementVNode("span", _hoisted_21, toDisplayString(getProblemStatisticsFooterCellPrimary(footerRow.key, stat)), 1),
+                    getProblemStatisticsFooterCellSecondary(footerRow.key, stat) !== void 0 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                      _cache[0] || (_cache[0] = createTextVNode(toDisplayString(" ") + " ", -1)),
+                      createElementVNode("span", _hoisted_22, toDisplayString(getProblemStatisticsFooterCellSecondary(footerRow.key, stat)), 1)
+                    ], 64)) : createCommentVNode("", true)
+                  ]);
+                }), 128)),
+                __props.showDirtColumn ? (openBlock(), createElementBlock("td", _hoisted_23, [..._cache[1] || (_cache[1] = [
+                  createElementVNode("span", { class: "srk-problem-statistics-footer-primary" }, null, -1)
+                ])])) : createCommentVNode("", true),
+                __props.showSEColumn ? (openBlock(), createElementBlock("td", _hoisted_24, [..._cache[2] || (_cache[2] = [
+                  createElementVNode("span", { class: "srk-problem-statistics-footer-primary" }, null, -1)
+                ])])) : createCommentVNode("", true)
+              ]);
+            }), 64)),
+            createElementVNode("tr", _hoisted_25, [
+              createElementVNode("td", {
+                class: "srk-problem-statistics-footer-labels srk--text-right srk--nowrap",
+                colspan: leftFooterColumnCount.value
+              }, null, 8, _hoisted_26),
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.data.problems, (problem, problemIndex) => {
+                return openBlock(), createElementBlock("td", {
+                  key: problem.alias || unref(resolveText)(problem.title) || problemIndex,
+                  class: "srk-problem-statistics-footer-cell srk-problem-statistics-footer-problem-header srk-problem-header srk--text-center srk--nowrap",
+                  style: normalizeStyle({ backgroundImage: unref(getProblemHeaderBackgroundImage)(problem.style, resolvedTheme.value, 0) })
+                }, [
+                  createElementVNode("span", _hoisted_27, toDisplayString(problem.alias || unref(numberToAlphabet)(problemIndex)), 1)
+                ], 4);
+              }), 128)),
+              __props.showDirtColumn ? (openBlock(), createElementBlock("td", _hoisted_28, [..._cache[3] || (_cache[3] = [
+                createElementVNode("span", { class: "srk-problem-statistics-footer-primary" }, null, -1)
+              ])])) : createCommentVNode("", true),
+              __props.showSEColumn ? (openBlock(), createElementBlock("td", _hoisted_29, [..._cache[4] || (_cache[4] = [
+                createElementVNode("span", { class: "srk-problem-statistics-footer-primary" }, null, -1)
+              ])])) : createCommentVNode("", true)
+            ])
+          ])) : createCommentVNode("", true)
         ], 2)
       ]));
     };