vgapp 1.4.4 → 1.4.6

package/app/modules/vgdynamictable/scss/_actions.scss

@@ -1,5 +1,5 @@
-@mixin actions() {
-[data-table-state] {
+@mixin actions() {
+[data-table-state] {
 	text-align: center;
 	padding: 18px 14px;
 	vertical-align: middle;
@@ -67,12 +67,12 @@ tbody tr[data-row-dragging="1"] {
 	opacity: 0.55;
 }
 
-tbody tr[data-row-drag-over="before"] {
-	box-shadow: inset 0 2px 0 var(--vg-dynamic-table-actions-drag-indicator);
-}
-
-tbody tr[data-row-drag-over="after"] {
-	box-shadow: inset 0 -2px 0 var(--vg-dynamic-table-actions-drag-indicator);
+tbody tr[data-row-drag-over="before"] {
+	box-shadow: inset 0 2px 0 var(--vg-dynamic-table-actions-drag-indicator);
+}
+
+tbody tr[data-row-drag-over="after"] {
+	box-shadow: inset 0 -2px 0 var(--vg-dynamic-table-actions-drag-indicator);
 }
 
 .vgdt-row-reorder-cell {
@@ -104,19 +104,19 @@ tbody tr[data-row-drag-over="after"] {
 	gap: 6px;
 }
 
-.vgdt-row-action {
-	border: 1px solid var(--vg-dynamic-table-actions-danger-color);
-	background: transparent;
-	color: var(--vg-dynamic-table-actions-danger-color);
+.vgdt-row-action {
+	border: 1px solid var(--vg-dynamic-table-actions-danger-color);
+	background: transparent;
+	color: var(--vg-dynamic-table-actions-danger-color);
 	border-radius: 8px;
 	padding: 5px 10px;
 	font-size: 12px;
 	cursor: pointer;
 }
 
-.vgdt-row-action:hover {
-	background: var(--vg-dynamic-table-actions-danger-color);
-	color: var(--vg-dynamic-table-actions-danger-contrast);
+.vgdt-row-action:hover {
+	background: var(--vg-dynamic-table-actions-danger-color);
+	color: var(--vg-dynamic-table-actions-danger-contrast);
 }
 
 .vgdt-pan-hint {
@@ -185,12 +185,12 @@ tbody tr[data-row-drag-over="after"] {
 	}
 }
 
-@media (hover: none), (pointer: coarse), (any-pointer: coarse), (any-hover: none) {
+@media (hover: none), (pointer: coarse), (any-pointer: coarse), (any-hover: none) {
 	.vgdt-pan-hint {
 		display: none !important;
 	}
-}
-
-}
+}
+
+}
 
 

package/app/modules/vgdynamictable/scss/_pagination.scss

@@ -1,5 +1,5 @@
-@mixin pagination() {
-&.table-pagination {
+@mixin pagination() {
+&.table-pagination {
 	.vgdt-pagination {
 		padding: var(--vg-dynamic-table-pagination-padding-y) var(--vg-dynamic-table-pagination-padding-x);
 		border-top: 1px solid var(--vg-dynamic-table-pagination-border-color);
@@ -180,7 +180,7 @@
 	.vgdt-page--ellipsis:hover .vgdt-ellipsis-chevron {
 		display: inline;
 	}
-}
-
-}
+}
+
+}
 

package/app/modules/vgdynamictable/scss/_skeleton.scss

@@ -1,10 +1,10 @@
-@mixin skeleton() {
-.skeleton-row td {
-	padding: var(--vg-dynamic-table-skeleton-padding);
-	background: var(--vg-dynamic-table-skeleton-row-bg);
-	border-bottom-color: var(--vg-dynamic-table-skeleton-border-color);
-	height: var(--vgdt-skeleton-row-height, auto);
-}
+@mixin skeleton() {
+.skeleton-row td {
+	padding: var(--vg-dynamic-table-skeleton-padding);
+	background: var(--vg-dynamic-table-skeleton-row-bg);
+	border-bottom-color: var(--vg-dynamic-table-skeleton-border-color);
+	height: var(--vgdt-skeleton-row-height, auto);
+}
 
 .skeleton-cell {
 	display: flex;
@@ -54,10 +54,10 @@
 	}
 }
 
-@keyframes skeleton-glow {
+@keyframes skeleton-glow {
 	100% {
 		transform: translateX(120%);
 	}
-}
-
-}
+}
+
+}

package/app/modules/vgdynamictable/scss/_sortable.scss

@@ -1,34 +1,34 @@
-@mixin sortable() {
-&.table-sortable {
-	&[data-sort-hide-unsorted-arrows="1"] {
-		th[data-sortable="1"]:not([data-sort-direction]) {
-			.vgdt-sort-controls {
-				display: none;
-			}
-		}
-	}
-
-	th[data-sortable="1"] {
-		position: relative;
-		cursor: pointer;
+@mixin sortable() {
+&.table-sortable {
+	&[data-sort-hide-unsorted-arrows="1"] {
+		th[data-sortable="1"]:not([data-sort-direction]) {
+			.vgdt-sort-controls {
+				display: none;
+			}
+		}
+	}
+
+	th[data-sortable="1"] {
+		position: relative;
+		cursor: pointer;
 
 		.vgdt-sort-label {
 			display: inline-flex;
 			align-items: center;
 		}
 
-		.vgdt-sort-controls {
-			display: flex;
-			flex-direction: column;
-			margin-left: var(--vg-dynamic-table-sortable-controls-right);
-			gap: var(--vg-dynamic-table-sortable-controls-gap);
-
-			&[hidden] {
-				display: none !important;
-			}
-		}
-
-		.vgdt-sort-arrow {
+		.vgdt-sort-controls {
+			display: flex;
+			flex-direction: column;
+			margin-left: var(--vg-dynamic-table-sortable-controls-right);
+			gap: var(--vg-dynamic-table-sortable-controls-gap);
+
+			&[hidden] {
+				display: none !important;
+			}
+		}
+
+		.vgdt-sort-arrow {
 			border: 0;
 			padding: 0;
 			width: var(--vg-dynamic-table-sortable-arrow-width);
@@ -60,7 +60,7 @@
 			box-shadow: 0 1px 0 var(--vg-dynamic-table-cell-border-color);
 		}
 	}
-}
-
-}
+}
+
+}
 

package/app/modules/vgdynamictable/scss/_table.scss

@@ -1,5 +1,5 @@
-@mixin table() {
-& table {
+@mixin table() {
+& table {
 	width: 100%;
 	border-collapse: separate;
 	border-spacing: 0;
@@ -76,9 +76,9 @@
 		background: var(--vg-dynamic-table-fixed-cell-background);
 	}
 
-	tbody tr[data-expand-depth] td:first-child::before {
-		content: '';
-		display: inline-block;
+	tbody tr[data-expand-depth] td:first-child::before {
+		content: '';
+		display: inline-block;
 		width: calc(var(--vgdt-expand-depth, 0) * 16px);
 		height: 1px;
 		vertical-align: middle;
@@ -131,30 +131,7 @@
 		background: linear-gradient(to left, var(--vg-dynamic-table-fixed-shadow-color), transparent);
 	}
 
-	thead tr:first-child th:first-child {
-		border-top-left-radius: var(--vg-dynamic-table-wrap-border-radius);
-	}
-
-	thead tr:first-child th:last-child {
-		border-top-right-radius: var(--vg-dynamic-table-wrap-border-radius);
-	}
-
-	tbody tr:last-child td:first-child {
-		border-bottom-left-radius: var(--vg-dynamic-table-wrap-border-radius);
-	}
-
-	tbody tr:last-child td:last-child {
-		border-bottom-right-radius: var(--vg-dynamic-table-wrap-border-radius);
-	}
-
-	tfoot tr:last-child td:first-child {
-		border-bottom-left-radius: var(--vg-dynamic-table-wrap-border-radius);
-	}
-
-	tfoot tr:last-child td:last-child {
-		border-bottom-right-radius: var(--vg-dynamic-table-wrap-border-radius);
-	}
-}
-
 }
 
+}
+

package/app/modules/vgdynamictable/scss/_variables.scss

@@ -1,7 +1,7 @@
-@use "sass:map";
-@use "../../../utils/scss" as vg;
-
-$spacer: 1rem !default;
+@use "sass:map";
+@use "../../../utils/scss" as vg;
+
+$spacer: 1rem !default;
 $spacers: (
 		0: 0,
 		1: $spacer * .25,
@@ -11,12 +11,12 @@ $spacers: (
 		5: $spacer * 3,
 ) !default;
 
-$sizes-0: map.get($spacers, 0);
-$sizes-1: map.get($spacers, 1);
-$sizes-2: map.get($spacers, 2);
-$sizes-3: map.get($spacers, 3);
-$sizes-4: map.get($spacers, 4);
-$sizes-5: map.get($spacers, 5);
+$sizes-0: map.get($spacers, 0);
+$sizes-1: map.get($spacers, 1);
+$sizes-2: map.get($spacers, 2);
+$sizes-3: map.get($spacers, 3);
+$sizes-4: map.get($spacers, 4);
+$sizes-5: map.get($spacers, 5);
 
 $dynamic-table-map: (
 	wrap: (
@@ -31,22 +31,22 @@ $dynamic-table-map: (
 		font-size: $sizes-3,
 		row-content-height: 20px,
 		border-color: transparent,
-		text-color: var(--vg-text-color, #1f1f1f),
+		text-color: var(--vg-text-color, #1f1f1f),
 	),
 	header: (
 		font-weight: 600,
-		background: var(--vg-surface-muted-bg, #f7f4ef),
-		text-color: var(--vg-text-color, #1f1f1f),
+		background: var(--vg-surface-muted-bg, #f7f4ef),
+		text-color: var(--vg-text-color, #1f1f1f),
 	),
 	bordered: (
 		border-width: 1px,
-		border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .1)),
+		border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .1)),
 	),
 	striped: (
-		background: var(--vg-surface-subtle-bg, rgba(0, 0, 0, .03)),
+		background: var(--vg-surface-subtle-bg, rgba(0, 0, 0, .03)),
 	),
 	hover: (
-		background: var(--vg-surface-subtle-hover-bg, rgba(0, 0, 0, .05)),
+		background: var(--vg-surface-subtle-hover-bg, rgba(0, 0, 0, .05)),
 	),
 	table: (
 		min-width: 640px,
@@ -85,21 +85,21 @@ $dynamic-table-map: (
 		jump-width: 64px,
 		jump-gap: 6px,
 		jump-button-min-width: 54px,
-		border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .08)),
-		toolbar-bg: var(--vg-surface-muted-bg, #faf8f4),
-		label-color: var(--vg-text-muted-color, #5f5a52),
-		button-border: vg.$border-width vg.$border-style var(--vg-border-disabled-color, rgba(0, 0, 0, .12)),
-		button-border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .12)),
-		button-bg: var(--vg-control-bg, #ffffff),
-		button-text: var(--vg-text-color, #2e2a24),
-		button-hover-bg: var(--vg-surface-hover-bg, #f1ece4),
-		button-hover-border: var(--vg-border-color, rgba(0, 0, 0, .2)),
-		button-active-bg: var(--vg-primary-color, #24201b),
-		button-active-text: var(--vg-primary-contrast-color, #ffffff),
-		button-active-border: var(--vg-primary-color, #24201b),
-		per-page-bg: var(--vg-control-bg, #ffffff),
-		per-page-border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .12)),
-		per-page-text: var(--vg-text-color, #2e2a24),
+		border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .08)),
+		toolbar-bg: var(--vg-surface-muted-bg, #faf8f4),
+		label-color: var(--vg-text-muted-color, #5f5a52),
+		button-border: vg.$border-width vg.$border-style var(--vg-border-disabled-color, rgba(0, 0, 0, .12)),
+		button-border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .12)),
+		button-bg: var(--vg-control-bg, #ffffff),
+		button-text: var(--vg-text-color, #2e2a24),
+		button-hover-bg: var(--vg-surface-hover-bg, #f1ece4),
+		button-hover-border: var(--vg-border-color, rgba(0, 0, 0, .2)),
+		button-active-bg: var(--vg-primary-color, #24201b),
+		button-active-text: var(--vg-primary-contrast-color, #ffffff),
+		button-active-border: var(--vg-primary-color, #24201b),
+		per-page-bg: var(--vg-control-bg, #ffffff),
+		per-page-border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .12)),
+		per-page-text: var(--vg-text-color, #2e2a24),
 	),
 	sortable: (
 		header-padding-right: 1.8rem,
@@ -112,27 +112,27 @@ $dynamic-table-map: (
 		arrow-opacity: 0.35,
 		arrow-active-opacity: 1,
 		arrow-color: currentColor,
-		column-highlight-background: var(--vg-primary-subtle-bg, rgba(191, 153, 92, .14)),
+		column-highlight-background: var(--vg-primary-subtle-bg, rgba(191, 153, 92, .14)),
 	),
 	fixed: (
 		shadow-width: 14px,
-		shadow-color: var(--vg-shadow-soft-color, rgba(0, 0, 0, .16)),
-		cell-background: var(--vg-surface-bg, rgba(247, 244, 239, .92)),
+		shadow-color: var(--vg-shadow-soft-color, rgba(0, 0, 0, .16)),
+		cell-background: var(--vg-surface-bg, rgba(247, 244, 239, .92)),
 	),
 	skeleton: (
 		padding: 12px 14px,
 		line-height: 10px,
 		radius: 999px,
 		duration: 1.2s,
-		row-bg: rgb(var(--vg-surface-bg-rgb, 255 255 255) / .5),
-		border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .04)),
-		glow: rgb(var(--vg-surface-bg-rgb, 255 255 255) / .55),
-		gradient-1: var(--vg-control-border-color, #ebe6df),
-		gradient-2: var(--vg-surface-muted-bg, #f5f1ea),
-	),
-	actions: (
-		drag-indicator: var(--vg-primary-color, #3f8cff),
-		danger-color: var(--vg-danger-color, #a22929),
-		danger-contrast: var(--vg-danger-contrast-color, #ffffff),
-	),
-) !default;
+		row-bg: rgb(var(--vg-surface-bg-rgb, 255 255 255) / .5),
+		border-color: var(--vg-border-disabled-color, rgba(0, 0, 0, .04)),
+		glow: rgb(var(--vg-surface-bg-rgb, 255 255 255) / .55),
+		gradient-1: var(--vg-control-border-color, #ebe6df),
+		gradient-2: var(--vg-surface-muted-bg, #f5f1ea),
+	),
+	actions: (
+		drag-indicator: var(--vg-primary-color, #3f8cff),
+		danger-color: var(--vg-danger-color, #a22929),
+		danger-contrast: var(--vg-danger-contrast-color, #ffffff),
+	),
+) !default;

package/app/modules/vgdynamictable/scss/vgdynamictable.scss

@@ -6,17 +6,17 @@
 *--------------------------------------------------------------------------
 **/
 
-@forward "variables";
-@use "../../../utils/scss" as vg;
-@use "actions";
-@use "pagination";
-@use "skeleton";
-@use "sortable";
-@use "table" as table-styles;
-@use "variables" as vars;
+@forward "variables";
+@use "../../../utils/scss" as vg;
+@use "actions";
+@use "pagination";
+@use "skeleton";
+@use "sortable";
+@use "table" as table-styles;
+@use "variables" as vars;
 
 .vg-dynamic-table {
-	@include vg.mix-vars('dynamic-table', vars.$dynamic-table-map);
+	@include vg.mix-vars('dynamic-table', vars.$dynamic-table-map);
 	background: var(--vg-dynamic-table-wrap-background);
 	border-radius: var(--vg-dynamic-table-wrap-border-radius);
 	box-shadow: var(--vg-dynamic-table-wrap-box-shadow);
@@ -60,11 +60,11 @@
 		}
 	}
 
-	@include pagination.pagination();
-	@include sortable.sortable();
-	@include table-styles.table();
-	@include skeleton.skeleton();
-	@include actions.actions();
+	@include pagination.pagination();
+	@include sortable.sortable();
+	@include table-styles.table();
+	@include skeleton.skeleton();
+	@include actions.actions();
 
 	&.table-striped {
 		tbody {
@@ -159,14 +159,14 @@
 	&.table-sticky-head {
 		overflow: visible;
 
-		.vgdt-table-viewport > table {
-			overflow: visible;
-
-			thead th {
-				position: sticky;
-				top: var(--vgdt-sticky-top, 0px);
-				z-index: 3;
-				background: var(--vg-dynamic-table-header-background);
+		.vgdt-table-viewport > table {
+			overflow: visible;
+
+			thead th {
+				position: sticky;
+				top: var(--vgdt-sticky-top, 0px);
+				z-index: 3;
+				background: var(--vg-dynamic-table-header-background);
 				box-shadow: 0 1px 0 var(--vg-dynamic-table-cell-border-color);
 			}
 
@@ -251,24 +251,16 @@
 			background: linear-gradient(to left, var(--vg-dynamic-table-fixed-shadow-color), transparent);
 		}
 
-		.vgdt-sticky-clone thead tr:first-child th:first-child {
-			border-top-left-radius: var(--vg-dynamic-table-wrap-border-radius);
-		}
-
-		.vgdt-sticky-clone thead tr:first-child th:last-child {
-			border-top-right-radius: var(--vg-dynamic-table-wrap-border-radius);
-		}
-
-		.vgdt-table-viewport.table-sticky-scroll {
+		.vgdt-table-viewport.table-sticky-scroll {
 			max-height: var(--vgdt-sticky-max-height, 0px);
 			overflow: auto;
 		}
 
-		.vgdt-table-viewport > table {
-			overflow: visible;
-			margin-top: calc(-1 * var(--vgdt-sticky-clone-height, 0px));
-		}
-	}
+		.vgdt-table-viewport > table {
+			overflow: visible;
+			margin-top: calc(-1 * var(--vgdt-sticky-clone-height, 0px));
+		}
+	}
 
 }
 

package/app/modules/vgfilepreview/js/i18n.js

@@ -1,56 +1,56 @@
-import { lang_buttons, lang_messages } from "../../../utils/js/components/lang";
-
-const SUPPORTED_LANGS = new Set(["ru", "en"]);
-
-const normalizeLang = (value, fallback = "ru") => {
-	const candidate = String(value || "").trim().toLowerCase();
-	if (!candidate) {
-		return fallback;
-	}
-
-	const short = candidate.split("-")[0];
-	return SUPPORTED_LANGS.has(short) ? short : fallback;
-};
-
-const resolveFilePreviewLang = (paramsLang, element) => {
-	const fromParams = normalizeLang(paramsLang, "");
-	if (fromParams) {
-		return fromParams;
-	}
-
-	const fromElement = normalizeLang(element?.getAttribute("lang"), "");
-	if (fromElement) {
-		return fromElement;
-	}
-
-	const fromClosest = normalizeLang(element?.closest("[lang]")?.getAttribute("lang"), "");
-	if (fromClosest) {
-		return fromClosest;
-	}
-
-	const fromHtml = normalizeLang(document?.documentElement?.getAttribute("lang"), "");
-	if (fromHtml) {
-		return fromHtml;
-	}
-
-	const fromNavigator = normalizeLang(window?.navigator?.language, "");
-	if (fromNavigator) {
-		return fromNavigator;
-	}
-
-	return "ru";
-};
-
-const createFilePreviewI18n = (lang = "ru") => {
-	const normalizedLang = normalizeLang(lang, "ru");
-	const messages = lang_messages(normalizedLang, "filepreview") || {};
-	const buttons = lang_buttons(normalizedLang, "filepreview") || {};
-
-	return {
-		lang: normalizedLang,
-		message: (key, fallback = "") => messages[key] || fallback,
-		button: (key, fallback = "") => buttons[key] || fallback
-	};
-};
-
-export { createFilePreviewI18n, resolveFilePreviewLang };
+import { lang_buttons, lang_messages } from "../../../utils/js/components/lang";
+
+const SUPPORTED_LANGS = new Set(["ru", "en"]);
+
+const normalizeLang = (value, fallback = "ru") => {
+	const candidate = String(value || "").trim().toLowerCase();
+	if (!candidate) {
+		return fallback;
+	}
+
+	const short = candidate.split("-")[0];
+	return SUPPORTED_LANGS.has(short) ? short : fallback;
+};
+
+const resolveFilePreviewLang = (paramsLang, element) => {
+	const fromParams = normalizeLang(paramsLang, "");
+	if (fromParams) {
+		return fromParams;
+	}
+
+	const fromElement = normalizeLang(element?.getAttribute("lang"), "");
+	if (fromElement) {
+		return fromElement;
+	}
+
+	const fromClosest = normalizeLang(element?.closest("[lang]")?.getAttribute("lang"), "");
+	if (fromClosest) {
+		return fromClosest;
+	}
+
+	const fromHtml = normalizeLang(document?.documentElement?.getAttribute("lang"), "");
+	if (fromHtml) {
+		return fromHtml;
+	}
+
+	const fromNavigator = normalizeLang(window?.navigator?.language, "");
+	if (fromNavigator) {
+		return fromNavigator;
+	}
+
+	return "ru";
+};
+
+const createFilePreviewI18n = (lang = "ru") => {
+	const normalizedLang = normalizeLang(lang, "ru");
+	const messages = lang_messages(normalizedLang, "filepreview") || {};
+	const buttons = lang_buttons(normalizedLang, "filepreview") || {};
+
+	return {
+		lang: normalizedLang,
+		message: (key, fallback = "") => messages[key] || fallback,
+		button: (key, fallback = "") => buttons[key] || fallback
+	};
+};
+
+export { createFilePreviewI18n, resolveFilePreviewLang };