vgapp 1.4.7 → 1.4.9

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

@@ -1,196 +0,0 @@
-@mixin actions() {
-[data-table-state] {
-	text-align: center;
-	padding: 18px 14px;
-	vertical-align: middle;
-}
-
-.vgdt-state {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	gap: 10px;
-	width: min(100%, 520px);
-	margin: 0 auto;
-}
-
-.vgdt-state-text {
-	font-size: 14px;
-	line-height: 1.4;
-	color: var(--vg-dynamic-table-cell-text-color);
-}
-
-.vgdt-state-illustration {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 100%;
-	max-width: 240px;
-	min-height: 84px;
-	margin: 0 auto;
-}
-
-.vgdt-state-illustration img {
-	display: block;
-	max-width: 100%;
-	max-height: 160px;
-	width: auto;
-	height: auto;
-}
-
-.vgdt-state-actions {
-	margin-top: 10px;
-}
-
-.vgdt-state-reset {
-	border: 1px solid currentColor;
-	background: transparent;
-	color: inherit;
-	border-radius: 999px;
-	padding: 6px 12px;
-	font-size: 13px;
-	cursor: pointer;
-}
-
-.vgdt-row-select {
-	width: 16px;
-	height: 16px;
-	cursor: pointer;
-}
-
-tbody tr[data-row-reorder="1"][data-row-reorder-mode="row"] td {
-	cursor: grab;
-}
-
-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);
-}
-
-.vgdt-row-reorder-cell {
-	width: 32px;
-	min-width: 32px;
-	text-align: center;
-}
-
-.vgdt-row-reorder-handle {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	width: 22px;
-	height: 22px;
-	border: 0;
-	background: transparent;
-	color: var(--vg-dynamic-table-cell-text-color);
-	cursor: grab;
-	opacity: 0.75;
-	padding: 0;
-}
-
-.vgdt-row-reorder-handle:hover {
-	opacity: 1;
-}
-
-.vgdt-row-actions {
-	display: inline-flex;
-	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);
-	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-pan-hint {
-	margin: 0 0 8px;
-	padding: 6px 10px;
-	font-size: 12px;
-	line-height: 1.35;
-	border: 1px dashed var(--vg-dynamic-table-cell-border-color);
-	border-radius: 10px;
-	color: var(--vg-dynamic-table-cell-text-color);
-	background: var(--vg-dynamic-table-header-background);
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: 8px;
-}
-
-.vgdt-pan-hint[hidden] {
-	display: none !important;
-}
-
-.vgdt-pan-hint__text {
-	flex: 1 1 auto;
-	text-align: left;
-}
-
-.vgdt-pan-hint__close {
-	border: 0;
-	background: transparent;
-	color: inherit;
-	cursor: pointer;
-	line-height: 1;
-	font-size: 16px;
-	padding: 0 2px;
-	opacity: 0.8;
-}
-
-.vgdt-pan-hint__close:hover {
-	opacity: 1;
-}
-
-@media (max-width: 768px) {
-	[data-table-state] {
-		padding: 12px 10px;
-	}
-
-	.vgdt-state {
-		width: 100%;
-	}
-
-	.vgdt-state-illustration {
-		max-width: 180px;
-		min-height: 70px;
-	}
-
-	&[data-state-mode] {
-		[data-table-state] {
-			text-align: left;
-		}
-
-		.vgdt-state {
-			margin-left: 0;
-			margin-right: 0;
-			max-width: min(100%, calc(100vw - 32px));
-		}
-	}
-}
-
-@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,186 +0,0 @@
-@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);
-	}
-
-	.vgdt-pagination--top {
-		border-top: 0;
-		border-bottom: 1px solid var(--vg-dynamic-table-pagination-border-color);
-	}
-
-	.vgdt-pagination__inner {
-		background: var(--vg-dynamic-table-pagination-toolbar-bg);
-		border-radius: var(--vg-dynamic-table-pagination-toolbar-radius);
-		padding: var(--vg-dynamic-table-pagination-toolbar-padding-y) var(--vg-dynamic-table-pagination-toolbar-padding-x);
-		gap: var(--vg-dynamic-table-pagination-gap);
-	}
-
-	.vgdt-pagination__per-page {
-		display: inline-flex;
-		align-items: center;
-		gap: var(--vg-dynamic-table-pagination-per-page-gap);
-		color: var(--vg-dynamic-table-pagination-label-color);
-		font-size: var(--vg-dynamic-table-pagination-label-size);
-	}
-
-	.vgdt-pagination__per-page [data-per-page] {
-		min-width: 80px;
-		height: var(--vg-dynamic-table-pagination-per-page-height);
-		padding: 0 calc(var(--vg-dynamic-table-pagination-per-page-padding-x) + 18px) 0 var(--vg-dynamic-table-pagination-per-page-padding-x);
-		border-radius: var(--vg-dynamic-table-pagination-per-page-radius);
-		border: 1px solid var(--vg-dynamic-table-pagination-per-page-border-color);
-		background: var(--vg-dynamic-table-pagination-per-page-bg);
-		color: var(--vg-dynamic-table-pagination-per-page-text);
-		font: inherit;
-	}
-
-	.vgdt-pagination__per-page [data-per-page]:focus,
-	.vgdt-pagination__per-page [data-per-page]:focus-visible,
-	.vgdt-pagination__per-page [data-per-page]:active {
-		outline: none;
-		box-shadow: none;
-	}
-
-	.vgdt-pagination__per-page-control {
-		position: relative;
-		display: inline-flex;
-		align-items: center;
-	}
-
-	.vgdt-pagination__per-page-chevron {
-		position: absolute;
-		right: 10px;
-		top: 50%;
-		transform: translateY(-50%);
-		pointer-events: none;
-		opacity: .85;
-		color: var(--vg-dynamic-table-pagination-button-text);
-		transition: transform .16s ease, opacity .16s ease, color .16s ease;
-	}
-
-	.vgdt-pagination__per-page-chevron svg {
-		display: block;
-		width: 14px;
-		height: 14px;
-	}
-
-	.vgdt-pagination__per-page-chevron path {
-		fill: none;
-		stroke: currentColor;
-		stroke-width: 1.9;
-		stroke-linecap: round;
-		stroke-linejoin: round;
-	}
-
-	.vgdt-pagination__per-page-control [data-per-page]:focus + .vgdt-pagination__per-page-chevron {
-		opacity: 1;
-	}
-
-	.vgdt-pagination__per-page-control [data-toggle="dropdown"].show + .vgdt-pagination__per-page-chevron {
-		transform: translateY(-50%) rotate(180deg);
-		opacity: 1;
-	}
-
-	.vgdt-pagination__per-page-dropdown {
-		min-width: 170px;
-	}
-
-	.vgdt-pagination__per-page-option {
-		display: block;
-		width: 100%;
-		padding: 8px 10px;
-		border: 0;
-		background: transparent;
-		color: var(--vg-dynamic-table-pagination-button-text);
-		text-align: left;
-		cursor: pointer;
-	}
-
-	.vgdt-pagination__per-page-option:hover {
-		background: var(--vg-dynamic-table-pagination-button-hover-bg);
-	}
-
-	.vgdt-pagination__pages {
-		display: inline-flex;
-		align-items: center;
-		gap: var(--vg-dynamic-table-pagination-pages-gap);
-	}
-
-	.vgdt-pagination__jump {
-		display: inline-flex;
-		align-items: center;
-		gap: var(--vg-dynamic-table-pagination-jump-gap);
-	}
-
-	.vgdt-pagination__jump [data-page-jump-input] {
-		width: var(--vg-dynamic-table-pagination-jump-width);
-		height: var(--vg-dynamic-table-pagination-button-size);
-		padding: 0 var(--vg-dynamic-table-pagination-per-page-padding-x);
-		border-radius: var(--vg-dynamic-table-pagination-per-page-radius);
-		border: 1px solid var(--vg-dynamic-table-pagination-per-page-border-color);
-		background: var(--vg-dynamic-table-pagination-per-page-bg);
-		color: var(--vg-dynamic-table-pagination-per-page-text);
-		font: inherit;
-	}
-
-	.vgdt-page {
-		min-width: var(--vg-dynamic-table-pagination-button-size);
-		height: var(--vg-dynamic-table-pagination-button-size);
-		padding: var(--vg-dynamic-table-pagination-button-padding);
-		border-radius: var(--vg-dynamic-table-pagination-button-radius);
-		border: var(--vg-dynamic-table-pagination-button-border);
-		background: var(--vg-dynamic-table-pagination-button-bg);
-		color: var(--vg-dynamic-table-pagination-button-text);
-		font-size: var(--vg-dynamic-table-pagination-button-font-size);
-		line-height: var(--vg-dynamic-table-pagination-button-line-height);
-		cursor: pointer;
-		transition: background-color .15s ease, border-color .15s ease, color .15s ease, opacity .15s ease;
-	}
-
-	.vgdt-page--jump {
-		min-width: var(--vg-dynamic-table-pagination-jump-button-min-width);
-	}
-
-	.vgdt-page:hover:not(:disabled):not(.is-active) {
-		background: var(--vg-dynamic-table-pagination-button-hover-bg);
-		border-color: var(--vg-dynamic-table-pagination-button-hover-border);
-	}
-
-	.vgdt-page.is-active {
-		background: var(--vg-dynamic-table-pagination-button-active-bg);
-		color: var(--vg-dynamic-table-pagination-button-active-text);
-		border-color: var(--vg-dynamic-table-pagination-button-active-border);
-	}
-
-	.vgdt-page:disabled {
-		opacity: var(--vg-dynamic-table-pagination-button-disabled-opacity);
-		cursor: not-allowed;
-	}
-
-	.vgdt-page--ellipsis {
-		display: inline-flex;
-		align-items: center;
-		justify-content: center;
-		gap: 0;
-		min-width: var(--vg-dynamic-table-pagination-button-size);
-	}
-
-	.vgdt-ellipsis-chevron {
-		display: none;
-		font-size: 14px;
-		line-height: 1;
-	}
-
-	.vgdt-page--ellipsis:hover .vgdt-ellipsis-dots {
-		display: none;
-	}
-
-	.vgdt-page--ellipsis:hover .vgdt-ellipsis-chevron {
-		display: inline;
-	}
-}
-
-}
-

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

@@ -1,63 +0,0 @@
-@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;
-	align-items: center;
-	min-height: var(--vg-dynamic-table-cell-row-content-height);
-	width: 100%;
-}
-
-.skeleton-line {
-	width: 100%;
-	height: var(--vg-dynamic-table-skeleton-line-height);
-	border-radius: var(--vg-dynamic-table-skeleton-radius);
-	position: relative;
-	overflow: hidden;
-	background: linear-gradient(
-					90deg,
-					var(--vg-dynamic-table-skeleton-gradient-1) 25%,
-					var(--vg-dynamic-table-skeleton-gradient-2) 50%,
-					var(--vg-dynamic-table-skeleton-gradient-1) 75%
-	);
-	background-size: 160% 100%;
-	animation: skeleton-shimmer var(--vg-dynamic-table-skeleton-duration) ease-in-out infinite;
-	animation-delay: var(--skeleton-delay, 0s);
-}
-
-.skeleton-line::after {
-	content: '';
-	position: absolute;
-	inset: 0;
-	background: linear-gradient(
-		110deg,
-		transparent 0%,
-		var(--vg-dynamic-table-skeleton-glow) 45%,
-		transparent 100%
-	);
-	transform: translateX(-120%);
-	animation: skeleton-glow calc(var(--vg-dynamic-table-skeleton-duration) * 1.15) linear infinite;
-	animation-delay: var(--skeleton-delay, 0s);
-}
-
-@keyframes skeleton-shimmer {
-	0% {
-		background-position: 160% 0;
-	}
-	100% {
-		background-position: -160% 0;
-	}
-}
-
-@keyframes skeleton-glow {
-	100% {
-		transform: translateX(120%);
-	}
-}
-
-}

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

@@ -1,66 +0,0 @@
-@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 {
-			border: 0;
-			padding: 0;
-			width: var(--vg-dynamic-table-sortable-arrow-width);
-			height: var(--vg-dynamic-table-sortable-arrow-height);
-			line-height: var(--vg-dynamic-table-sortable-arrow-line-height);
-			background: transparent;
-			cursor: pointer;
-			opacity: var(--vg-dynamic-table-sortable-arrow-opacity);
-			font-size: var(--vg-dynamic-table-sortable-arrow-font-size);
-			color: var(--vg-dynamic-table-sortable-arrow-color);
-		}
-
-		.vgdt-sort-arrow[aria-pressed="true"] {
-			opacity: var(--vg-dynamic-table-sortable-arrow-active-opacity);
-		}
-	}
-
-	th[data-sorted-column="1"],
-	td[data-sorted-column="1"] {
-		background: var(--vg-dynamic-table-sortable-column-highlight-background);
-	}
-
-	&.table-sticky-head {
-		th[data-sortable="1"] {
-			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);
-		}
-	}
-}
-
-}
-

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

@@ -1,137 +0,0 @@
-@mixin table() {
-& table {
-	width: 100%;
-	border-collapse: separate;
-	border-spacing: 0;
-	min-width: var(--vg-dynamic-table-table-min-width);
-	border-radius: var(--vg-dynamic-table-wrap-border-radius);
-	overflow: hidden;
-
-	th,
-	td {
-		text-align: left;
-		padding: var(--vg-dynamic-table-cell-padding);
-		border-bottom: 1px solid var(--vg-dynamic-table-cell-border-color);
-		font-size: var(--vg-dynamic-table-cell-font-size);
-		line-height: var(--vg-dynamic-table-cell-row-content-height);
-		color: var(--vg-dynamic-table-cell-text-color);
-	}
-
-	th {
-		background: var(--vg-dynamic-table-header-background);
-		font-weight: var(--vg-dynamic-table-header-font-weight);
-		color: var(--vg-dynamic-table-header-text-color);
-	}
-
-	th[data-col-reorder="1"] {
-		cursor: grab;
-		user-select: none;
-	}
-
-	th[data-col-reorder="1"][data-col-dragging="1"] {
-		cursor: grabbing;
-		opacity: 0.75;
-	}
-
-	th[data-col-reorder="1"][data-col-drag-over="1"] {
-		outline: 2px dashed var(--vg-dynamic-table-header-text-color);
-		outline-offset: -2px;
-	}
-
-	th[data-col-resize="1"] {
-		position: relative;
-	}
-
-	.vgdt-col-resize-handle {
-		position: absolute;
-		top: 0;
-		right: -2px;
-		width: 8px;
-		height: 100%;
-		cursor: col-resize;
-	}
-
-	&.is-col-resizing {
-		cursor: col-resize;
-		user-select: none;
-	}
-
-	th[data-fixed-side],
-	td[data-fixed-side] {
-		position: relative;
-		z-index: 2;
-		will-change: transform;
-	}
-
-	th[data-fixed-side] {
-		z-index: 6;
-		background: var(--vg-dynamic-table-header-background);
-	}
-
-	td[data-fixed-side] {
-		background: transparent;
-	}
-
-	td[data-fixed-side][data-fixed-overlap="1"] {
-		background: var(--vg-dynamic-table-fixed-cell-background);
-	}
-
-	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;
-	}
-
-	.vgdt-expand-toggle {
-		display: inline-flex;
-		align-items: center;
-		justify-content: center;
-		border: 1px solid var(--vg-dynamic-table-cell-border-color);
-		background: transparent;
-		color: inherit;
-		width: 18px;
-		height: 18px;
-		line-height: 16px;
-		font-size: 12px;
-		padding: 0;
-		cursor: pointer;
-		border-radius: 4px;
-		margin-right: 10px;
-		text-align: center;
-	}
-
-	th[data-fixed-edge],
-	td[data-fixed-edge] {
-		position: relative;
-	}
-
-	th[data-fixed-edge="right"][data-fixed-shadow="1"]::after,
-	td[data-fixed-edge="right"][data-fixed-shadow="1"]::after,
-	th[data-fixed-edge="left"][data-fixed-shadow="1"]::before,
-	td[data-fixed-edge="left"][data-fixed-shadow="1"]::before {
-		content: '';
-		position: absolute;
-		top: 0;
-		bottom: -1px;
-		width: var(--vg-dynamic-table-fixed-shadow-width);
-		pointer-events: none;
-	}
-
-	th[data-fixed-edge="right"][data-fixed-shadow="1"]::after,
-	td[data-fixed-edge="right"][data-fixed-shadow="1"]::after {
-		right: calc(-1 * var(--vg-dynamic-table-fixed-shadow-width));
-		background: linear-gradient(to right, var(--vg-dynamic-table-fixed-shadow-color), transparent);
-	}
-
-	th[data-fixed-edge="left"][data-fixed-shadow="1"]::before,
-	td[data-fixed-edge="left"][data-fixed-shadow="1"]::before {
-		left: calc(-1 * var(--vg-dynamic-table-fixed-shadow-width));
-		background: linear-gradient(to left, var(--vg-dynamic-table-fixed-shadow-color), transparent);
-	}
-
-}
-
-}
-