@algoux/standard-ranklist-renderer-component-angular 0.6.2 → 0.6.3

package/dist/fesm2022/algoux-standard-ranklist-renderer-component-angular.mjs

@@ -2,116 +2,8 @@ import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
 import { EventEmitter, ViewChild, Output, Input, Component, inject, TemplateRef, Directive, ContentChild, ChangeDetectionStrategy } from '@angular/core';
-import { EnumTheme, formatTimeDuration, numberToAlphabet, resolveText, secToTimeStr, resolveStyle, resolveUserMarkers, canRegenerateRanklist } from '@algoux/standard-ranklist-utils';
-import { ensureModalInteractionTracker, unlockModalBodyScroll, SRK_ANIMATED_MODAL_ROOT_CLASS, resolveModalTransformOrigin, MODAL_ANIMATION_DURATION_MS, lockModalBodyScroll, registerModalFocusScope, unregisterModalFocusScope, srkSupportedVersions, calculateProblemStatisticsFooter, caniuse, shouldShowTimeColumn as shouldShowTimeColumn$1, getProblemHeaderBackgroundImage as getProblemHeaderBackgroundImage$1, getMarkerPresentation as getMarkerPresentation$1, resolveSrkAssetUrl as resolveSrkAssetUrl$1, calculateDirtPercentage, calculateSEValue, getRankProblemStatusCellPresentation, captureModalTriggerPointFromMouseEvent, formatProblemStatisticsAcceptedMinute, formatProblemStatisticsAverageHardness, formatProblemStatisticsPercent } from '@algoux/standard-ranklist-renderer-component-core';
-
-const defaultBackgroundColor = {
-    [EnumTheme.light]: '#ffffff',
-    [EnumTheme.dark]: '#191919',
-};
-function resolveSrkAssetUrl(url, field, formatter) {
-    if (typeof formatter === 'function') {
-        return formatter(url, field);
-    }
-    if (url.startsWith('//')) {
-        return url;
-    }
-    const protocolMatch = url.match(/^([a-zA-Z][a-zA-Z0-9+.-]*):/);
-    if (protocolMatch) {
-        const protocol = protocolMatch[1].toLowerCase();
-        if (protocol === 'http' || protocol === 'https' || protocol === 'data') {
-            return url;
-        }
-        console.warn(`unsupported protocol "${protocol}" in srk asset url:`, url);
-        return '';
-    }
-    console.warn('unsupported srk asset url:', url);
-    return '';
-}
-function getAcceptedStatusDetails(status) {
-    return `${status.tries}/${status.time ? formatTimeDuration(status.time, 'min', Math.floor) : '-'}`;
-}
-function getSolutionResultMeta(result) {
-    switch (result) {
-        case 'FB':
-            return { label: 'First Blood', className: 'srk-preset-result-fb' };
-        case 'AC':
-            return { label: 'Accepted', className: 'srk-preset-result-ac' };
-        case 'RJ':
-            return { label: 'Rejected', className: 'srk-preset-result-rj' };
-        case '?':
-            return { label: 'Frozen', className: 'srk-preset-result-fz' };
-        case 'WA':
-            return { label: 'Wrong Answer', className: 'srk-preset-result-rj' };
-        case 'PE':
-            return { label: 'Presentation Error', className: 'srk-preset-result-rj' };
-        case 'TLE':
-            return { label: 'Time Limit Exceeded', className: 'srk-preset-result-rj' };
-        case 'MLE':
-            return { label: 'Memory Limit Exceeded', className: 'srk-preset-result-rj' };
-        case 'OLE':
-            return { label: 'Output Limit Exceeded', className: 'srk-preset-result-rj' };
-        case 'RTE':
-            return { label: 'Runtime Error', className: 'srk-preset-result-rj' };
-        case 'NOUT':
-            return { label: 'No Output' };
-        case 'CE':
-            return { label: 'Compile Error' };
-        case 'UKE':
-            return { label: 'Unknown Error' };
-        case null:
-            return { label: '--' };
-        default:
-            return { label: result };
-    }
-}
-function getSolutionModalTitle(problemIndex, user) {
-    return `Solutions of ${numberToAlphabet(problemIndex)} (${resolveText(user.name)})`;
-}
-function formatSolutionTimestamp(solution) {
-    return secToTimeStr(formatTimeDuration(solution.time, 's'));
-}
-function getProblemHeaderBackgroundImage(style, theme) {
-    const { backgroundColor } = resolveStyle(style || {});
-    const resolvedColor = backgroundColor[theme] || defaultBackgroundColor[theme];
-    const bgColorAlphaStr = withAlpha(resolvedColor, 0.27);
-    return `linear-gradient(180deg, ${resolvedColor} 0%, ${resolvedColor} 10%, ${bgColorAlphaStr} 10%, transparent 100%)`;
-}
-function getMarkerPresentation(marker, theme) {
-    if (typeof marker.style === 'string') {
-        return { className: `srk-preset-marker-${marker.style}` };
-    }
-    if (marker.style) {
-        return {
-            style: {
-                backgroundColor: resolveStyle(marker.style).backgroundColor[theme],
-            },
-        };
-    }
-    return {};
-}
-function shouldShowTimeColumn(rows) {
-    return rows.some((row) => Boolean(row.score?.time));
-}
-function withAlpha(color, alpha) {
-    const hexMatch = color.match(/^#([0-9a-f]{6})$/i);
-    if (hexMatch) {
-        const value = hexMatch[1];
-        const red = parseInt(value.slice(0, 2), 16);
-        const green = parseInt(value.slice(2, 4), 16);
-        const blue = parseInt(value.slice(4, 6), 16);
-        return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
-    }
-    const rgbMatch = color.match(/^rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i);
-    if (rgbMatch) {
-        return `rgba(${rgbMatch[1]}, ${rgbMatch[2]}, ${rgbMatch[3]}, ${alpha})`;
-    }
-    const rgbaMatch = color.match(/^rgba\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*,\s*[\d.]+\s*\)$/i);
-    if (rgbaMatch) {
-        return `rgba(${rgbaMatch[1]}, ${rgbaMatch[2]}, ${rgbaMatch[3]}, ${alpha})`;
-    }
-    return color;
-}
+import { ensureModalInteractionTracker, unlockModalBodyScroll, SRK_ANIMATED_MODAL_ROOT_CLASS, resolveModalTransformOrigin, MODAL_ANIMATION_DURATION_MS, lockModalBodyScroll, registerModalFocusScope, unregisterModalFocusScope, formatSolutionTimestamp, getSolutionModalTitle, getSolutionResultMeta, getMarkerPresentation, resolveSrkAssetUrl, formatTeamMemberName, getProgressDurationMinutes, getProgressMaxAvailableMinutes, isProgressEnded, getProgressMetrics, srkSupportedVersions, calculateProblemStatisticsFooter, caniuse, shouldShowTimeColumn, getProblemHeaderBackgroundImage, calculateDirtPercentage, calculateSEValue, getRankProblemStatusCellPresentation, captureModalTriggerPointFromMouseEvent, formatProblemStatisticsAcceptedMinute, formatProblemStatisticsAverageHardness, formatProblemStatisticsPercent } from '@algoux/standard-ranklist-renderer-component-core';
+import { EnumTheme, resolveUserMarkers, resolveText, secToTimeStr, numberToAlphabet, formatTimeDuration, resolveStyle } from '@algoux/standard-ranklist-utils';
 
 class ModalComponent {
     open = false;
@@ -382,6 +274,7 @@ class DefaultSolutionModalComponent {
     rootClassName = 'srk-general-modal-root';
     wrapClassName = 'srk-solutions-modal';
     panelStyle = {};
+    languages;
     openChange = new EventEmitter();
     close = new EventEmitter();
     formatSolutionTimestamp = formatSolutionTimestamp;
@@ -398,7 +291,7 @@ class DefaultSolutionModalComponent {
         }
     }
     resolvedTitle() {
-        return this.title || (this.cachedUser ? getSolutionModalTitle(this.cachedProblemIndex, this.cachedUser) : '');
+        return this.title || (this.cachedUser ? getSolutionModalTitle(this.cachedProblemIndex, this.cachedUser, this.languages) : '');
     }
     solutionMeta(solution) {
         return getSolutionResultMeta(solution.result);
@@ -407,7 +300,7 @@ class DefaultSolutionModalComponent {
         return `${solution.result}_${solution.time?.[0]}_${index}`;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DefaultSolutionModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DefaultSolutionModalComponent, isStandalone: true, selector: "srk-default-solution-modal", inputs: { open: "open", user: "user", problem: "problem", problemIndex: "problemIndex", solutions: "solutions", title: "title", width: "width", rootClassName: "rootClassName", wrapClassName: "wrapClassName", panelStyle: "panelStyle" }, outputs: { openChange: "openChange", close: "close" }, usesOnChanges: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DefaultSolutionModalComponent, isStandalone: true, selector: "srk-default-solution-modal", inputs: { open: "open", user: "user", problem: "problem", problemIndex: "problemIndex", solutions: "solutions", title: "title", width: "width", rootClassName: "rootClassName", wrapClassName: "wrapClassName", panelStyle: "panelStyle", languages: "languages" }, outputs: { openChange: "openChange", close: "close" }, usesOnChanges: true, ngImport: i0, template: `
     <srk-modal
       *ngIf="cachedUser"
       [open]="open"
@@ -505,6 +398,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Input
             }], panelStyle: [{
                 type: Input
+            }], languages: [{
+                type: Input
             }], openChange: [{
                 type: Output
             }], close: [{
@@ -522,9 +417,9 @@ class DefaultUserModalComponent {
     wrapClassName = 'srk-user-modal';
     panelStyle = {};
     formatSrkAssetUrl;
+    languages;
     openChange = new EventEmitter();
     close = new EventEmitter();
-    resolveText = resolveText;
     cachedUser = null;
     ngOnChanges(_changes) {
         if (this.user) {
@@ -543,14 +438,20 @@ class DefaultUserModalComponent {
     formatAssetUrl(url, field) {
         return resolveSrkAssetUrl(url, field, this.formatSrkAssetUrl);
     }
+    resolveDisplayText(text) {
+        return resolveText(text, this.languages);
+    }
+    formatMemberName(member) {
+        return formatTeamMemberName(member, this.languages);
+    }
     trackByMarkerId(_index, entry) {
         return entry.marker.id;
     }
-    trackByMemberName(_index, member) {
-        return resolveText(member.name);
-    }
+    trackByMemberName = (_index, member) => {
+        return this.resolveDisplayText(member.name);
+    };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DefaultUserModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DefaultUserModalComponent, isStandalone: true, selector: "srk-default-user-modal", inputs: { open: "open", user: "user", markers: "markers", theme: "theme", title: "title", width: "width", rootClassName: "rootClassName", wrapClassName: "wrapClassName", panelStyle: "panelStyle", formatSrkAssetUrl: "formatSrkAssetUrl" }, outputs: { openChange: "openChange", close: "close" }, usesOnChanges: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DefaultUserModalComponent, isStandalone: true, selector: "srk-default-user-modal", inputs: { open: "open", user: "user", markers: "markers", theme: "theme", title: "title", width: "width", rootClassName: "rootClassName", wrapClassName: "wrapClassName", panelStyle: "panelStyle", formatSrkAssetUrl: "formatSrkAssetUrl", languages: "languages" }, outputs: { openChange: "openChange", close: "close" }, usesOnChanges: true, ngImport: i0, template: `
     <srk-modal
       *ngIf="cachedUser as modalUser"
       [open]="open"
@@ -563,9 +464,9 @@ class DefaultUserModalComponent {
       (openChange)="openChange.emit($event)"
     >
       <div class="srk-user-modal-info">
-        <h3 class="srk-user-modal-info-user-name">{{ resolveText(modalUser.name) }}</h3>
+        <h3 class="srk-user-modal-info-user-name">{{ resolveDisplayText(modalUser.name) }}</h3>
         <p *ngIf="modalUser.organization" class="srk-user-modal-info-user-second-name">
-          {{ resolveText(modalUser.organization) }}
+          {{ resolveDisplayText(modalUser.organization) }}
         </p>
         <div class="srk-user-modal-info-labels">
           <span class="srk-user-modal-info-labels-label srk-user-modal-info-labels-label-preset-general">
@@ -577,13 +478,13 @@ class DefaultUserModalComponent {
             [ngClass]="entry.presentation.className"
             [ngStyle]="entry.presentation.style"
           >
-            {{ resolveText(entry.marker.label) }}
+            {{ resolveDisplayText(entry.marker.label) }}
           </span>
         </div>
         <div *ngIf="modalUser.teamMembers?.length" class="srk-user-modal-info-team-members">
           <ng-container *ngFor="let member of modalUser.teamMembers; let index = index; trackBy: trackByMemberName">
             <span *ngIf="index > 0" class="srk-user-modal-info-team-members-slash"> / </span>
-            <span>{{ resolveText(member.name) }}</span>
+            <span>{{ formatMemberName(member) }}</span>
           </ng-container>
         </div>
         <div *ngIf="modalUser.photo" class="srk-user-modal-info-photo">
@@ -616,9 +517,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
       (openChange)="openChange.emit($event)"
     >
       <div class="srk-user-modal-info">
-        <h3 class="srk-user-modal-info-user-name">{{ resolveText(modalUser.name) }}</h3>
+        <h3 class="srk-user-modal-info-user-name">{{ resolveDisplayText(modalUser.name) }}</h3>
         <p *ngIf="modalUser.organization" class="srk-user-modal-info-user-second-name">
-          {{ resolveText(modalUser.organization) }}
+          {{ resolveDisplayText(modalUser.organization) }}
         </p>
         <div class="srk-user-modal-info-labels">
           <span class="srk-user-modal-info-labels-label srk-user-modal-info-labels-label-preset-general">
@@ -630,13 +531,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
             [ngClass]="entry.presentation.className"
             [ngStyle]="entry.presentation.style"
           >
-            {{ resolveText(entry.marker.label) }}
+            {{ resolveDisplayText(entry.marker.label) }}
           </span>
         </div>
         <div *ngIf="modalUser.teamMembers?.length" class="srk-user-modal-info-team-members">
           <ng-container *ngFor="let member of modalUser.teamMembers; let index = index; trackBy: trackByMemberName">
             <span *ngIf="index > 0" class="srk-user-modal-info-team-members-slash"> / </span>
-            <span>{{ resolveText(member.name) }}</span>
+            <span>{{ formatMemberName(member) }}</span>
           </ng-container>
         </div>
         <div *ngIf="modalUser.photo" class="srk-user-modal-info-photo">
@@ -670,56 +571,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Input
             }], formatSrkAssetUrl: [{
                 type: Input
+            }], languages: [{
+                type: Input
             }], openChange: [{
                 type: Output
             }], close: [{
                 type: Output
             }] } });
 
-function getProgressDurationMinutes(contest) {
-    return formatTimeDuration(contest.duration, 'min');
-}
-function getProgressMaxAvailableMinutes(contest, localTime, td = 0) {
-    const startAt = new Date(contest.startAt).getTime();
-    const currentTime = localTime - td;
-    return Math.min(Math.max(Math.floor((currentTime - startAt) / 60000), 0), getProgressDurationMinutes(contest));
-}
-function isProgressEnded(contest, localTime, td = 0) {
-    const startAt = new Date(contest.startAt).getTime();
-    const endAt = startAt + formatTimeDuration(contest.duration, 'ms');
-    const currentTime = localTime - td;
-    return currentTime >= endAt;
-}
-function getProgressMetrics(data, localTime, td, timeTravelCurrentValue, inTimeMachine) {
-    const { contest } = data;
-    const startAt = new Date(contest.startAt).getTime();
-    const endAt = startAt + formatTimeDuration(contest.duration, 'ms');
-    const frozenLength = contest.frozenDuration ? formatTimeDuration(contest.frozenDuration, 'ms') : 0;
-    const currentTime = localTime - td;
-    const length = endAt - startAt;
-    const frozenBreakpoint = length ? 1 - frozenLength / length : 1;
-    const elapsed = Math.min(Math.max(currentTime - startAt, 0), length);
-    const remaining = length - elapsed;
-    const frozenAt = endAt - frozenLength;
-    const percent = length ? (elapsed / length) * 100 : 0;
-    const normalPercent = length ? (Math.max(Math.min(currentTime, frozenAt) - startAt, 0) / length) * 100 : 0;
-    const normalInnerPercent = Math.min(100, frozenBreakpoint ? normalPercent / frozenBreakpoint : 0);
-    const frozenPercent = percent - normalPercent;
-    const frozenInnerPercent = Math.min(100, 1 - frozenBreakpoint ? frozenPercent / (1 - frozenBreakpoint) : 0);
-    const timeTravelElapsed = timeTravelCurrentValue * 60 * 1000;
-    const timeTravelRemaining = length - timeTravelElapsed;
-    return {
-        elapsed: inTimeMachine ? timeTravelElapsed : elapsed,
-        remaining: inTimeMachine ? timeTravelRemaining : remaining,
-        frozenBreakpoint,
-        normalInnerPercent,
-        frozenInnerPercent,
-        timeTravelElapsed,
-        timeTravelRemaining,
-        supportRegen: canRegenerateRanklist(data),
-    };
-}
-
 class ProgressBarComponent {
     data;
     enableTimeTravel = false;
@@ -1009,6 +868,7 @@ class RanklistComponent {
     showSEColumn = false;
     emptyStatusPlaceholder = null;
     userAvatarPlacement = 'user';
+    languages;
     userClick = new EventEmitter();
     solutionClick = new EventEmitter();
     statusCellTemplate;
@@ -1023,8 +883,8 @@ class RanklistComponent {
             tooltip: 'Number of participants who solved this problem',
         },
         {
-            key: 'tried',
-            label: 'Tried',
+            key: 'attempted',
+            label: 'Attempted',
             tooltip: 'Number of participants who attempted this problem',
         },
         {
@@ -1069,7 +929,7 @@ class RanklistComponent {
         return caniuse(this.data.version);
     }
     showTimeColumn() {
-        return shouldShowTimeColumn$1(this.data.rows);
+        return shouldShowTimeColumn(this.data.rows);
     }
     showAvatarInOrganization() {
         return this.splitOrganization && this.userAvatarPlacement === 'organization';
@@ -1084,7 +944,7 @@ class RanklistComponent {
         return rankValue.rank ? rankValue.rank : row.user.official === false ? '＊' : '';
     }
     resolveDisplayText(text) {
-        return resolveText(text);
+        return resolveText(text, this.languages);
     }
     resolveSeriesColumnTitle(series, index) {
         const seriesTitles = this.columnTitles?.series;
@@ -1107,16 +967,16 @@ class RanklistComponent {
         return `${statistics.accepted} / ${statistics.submitted} (${ratio}%)`;
     }
     problemHeaderBackgroundImage(problem, gradientDirection = 180) {
-        return getProblemHeaderBackgroundImage$1(problem.style, this.theme, gradientDirection);
+        return getProblemHeaderBackgroundImage(problem.style, this.theme, gradientDirection);
     }
     resolvedUserMarkers(user) {
         return resolveUserMarkers(user, this.data.markers).map((marker) => ({
             marker,
-            presentation: getMarkerPresentation$1(marker, this.theme),
+            presentation: getMarkerPresentation(marker, this.theme),
         }));
     }
     formatAssetUrl(url, field) {
-        return resolveSrkAssetUrl$1(url, field, this.formatSrkAssetUrl);
+        return resolveSrkAssetUrl(url, field, this.formatSrkAssetUrl);
     }
     formatTime(time) {
         return formatTimeDuration(time, 'min', Math.floor);
@@ -1177,6 +1037,7 @@ class RanklistComponent {
             markers: this.data.markers,
             hideOrganization: this.splitOrganization,
             hideAvatar: this.showAvatarInOrganization(),
+            languages: this.languages,
             onClick: (event) => this.emitUserClick(event, row, rowIndex),
         };
     }
@@ -1194,6 +1055,7 @@ class RanklistComponent {
             statusCellPreset: this.statusCellPreset,
             statusColorAsText: this.statusColorAsText,
             emptyStatusPlaceholder: this.emptyStatusPlaceholder,
+            languages: this.languages,
             onClick: (event) => this.emitSolutionClick(event, row, rowIndex, status, problemIndex),
         };
     }
@@ -1283,8 +1145,8 @@ class RanklistComponent {
         switch (key) {
             case 'accepted':
                 return stat.accepted;
-            case 'tried':
-                return stat.tried;
+            case 'attempted':
+                return stat.attempted;
             case 'submitted':
                 return stat.submitted;
             case 'dirt':
@@ -1303,8 +1165,8 @@ class RanklistComponent {
         switch (key) {
             case 'accepted':
                 return formatProblemStatisticsPercent(stat.accepted, stat.participantCount);
-            case 'tried':
-                return formatProblemStatisticsPercent(stat.tried, stat.participantCount);
+            case 'attempted':
+                return formatProblemStatisticsPercent(stat.attempted, stat.participantCount);
             case 'dirt':
                 return formatProblemStatisticsPercent(stat.dirt, stat.dirtSubmitted);
             default:
@@ -1312,7 +1174,7 @@ class RanklistComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RanklistComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: RanklistComponent, isStandalone: true, selector: "srk-ranklist", inputs: { data: "data", theme: "theme", rowBordered: "rowBordered", columnBordered: "columnBordered", rowStriped: "rowStriped", formatSrkAssetUrl: "formatSrkAssetUrl", splitOrganization: "splitOrganization", columnTitles: "columnTitles", statusCellPreset: "statusCellPreset", statusColorAsText: "statusColorAsText", showProblemStatisticsFooter: "showProblemStatisticsFooter", showDirtColumn: "showDirtColumn", showSEColumn: "showSEColumn", emptyStatusPlaceholder: "emptyStatusPlaceholder", userAvatarPlacement: "userAvatarPlacement" }, outputs: { userClick: "userClick", solutionClick: "solutionClick" }, queries: [{ propertyName: "statusCellTemplate", first: true, predicate: SrkStatusCellTemplateDirective, descendants: true }, { propertyName: "userCellTemplate", first: true, predicate: SrkUserCellTemplateDirective, descendants: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: RanklistComponent, isStandalone: true, selector: "srk-ranklist", inputs: { data: "data", theme: "theme", rowBordered: "rowBordered", columnBordered: "columnBordered", rowStriped: "rowStriped", formatSrkAssetUrl: "formatSrkAssetUrl", splitOrganization: "splitOrganization", columnTitles: "columnTitles", statusCellPreset: "statusCellPreset", statusColorAsText: "statusColorAsText", showProblemStatisticsFooter: "showProblemStatisticsFooter", showDirtColumn: "showDirtColumn", showSEColumn: "showSEColumn", emptyStatusPlaceholder: "emptyStatusPlaceholder", userAvatarPlacement: "userAvatarPlacement", languages: "languages" }, outputs: { userClick: "userClick", solutionClick: "solutionClick" }, queries: [{ propertyName: "statusCellTemplate", first: true, predicate: SrkStatusCellTemplateDirective, descendants: true }, { propertyName: "userCellTemplate", first: true, predicate: SrkUserCellTemplateDirective, descendants: true }], ngImport: i0, template: `
     <div *ngIf="data.type !== 'general'; else versionState">
       srk type "{{ data.type }}" is not supported
     </div>
@@ -1982,6 +1844,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Input
             }], userAvatarPlacement: [{
                 type: Input
+            }], languages: [{
+                type: Input
             }], userClick: [{
                 type: Output
             }], solutionClick: [{