vgapp 1.4.4 → 1.4.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/README.md +270 -270
  2. package/app/langs/en/buttons.json +17 -17
  3. package/app/langs/en/messages.json +36 -36
  4. package/app/langs/ru/buttons.json +17 -17
  5. package/app/langs/ru/messages.json +36 -36
  6. package/app/modules/vgalert/js/vgalert.js +266 -266
  7. package/app/modules/vgalert/scss/_variables.scss +16 -16
  8. package/app/modules/vgalert/scss/vgalert.scss +107 -107
  9. package/app/modules/vgcollapse/scss/_variables.scss +7 -7
  10. package/app/modules/vgcollapse/scss/vgcollapse.scss +5 -5
  11. package/app/modules/vgdropdown/scss/_variables.scss +14 -14
  12. package/app/modules/vgdropdown/scss/vgdropdown.scss +5 -5
  13. package/app/modules/vgdynamictable/index.js +4 -4
  14. package/app/modules/vgdynamictable/js/filters.js +21 -21
  15. package/app/modules/vgdynamictable/js/fixed.js +179 -179
  16. package/app/modules/vgdynamictable/js/options.js +3 -3
  17. package/app/modules/vgdynamictable/js/pagination.js +1 -1
  18. package/app/modules/vgdynamictable/js/search.js +12 -12
  19. package/app/modules/vgdynamictable/js/skeleton.js +27 -19
  20. package/app/modules/vgdynamictable/js/sortable.js +71 -71
  21. package/app/modules/vgdynamictable/js/summary-footer.js +28 -28
  22. package/app/modules/vgdynamictable/js/table-url-state.js +31 -31
  23. package/app/modules/vgdynamictable/js/utils/common.js +48 -48
  24. package/app/modules/vgdynamictable/js/vgdynamictable.js +79 -79
  25. package/app/modules/vgdynamictable/scss/_actions.scss +19 -19
  26. package/app/modules/vgdynamictable/scss/_pagination.scss +5 -5
  27. package/app/modules/vgdynamictable/scss/_skeleton.scss +11 -11
  28. package/app/modules/vgdynamictable/scss/_sortable.scss +28 -28
  29. package/app/modules/vgdynamictable/scss/_table.scss +7 -30
  30. package/app/modules/vgdynamictable/scss/_variables.scss +46 -46
  31. package/app/modules/vgdynamictable/scss/vgdynamictable.scss +28 -36
  32. package/app/modules/vgfilepreview/js/i18n.js +56 -56
  33. package/app/modules/vgfilepreview/js/renderers/image-modal.js +145 -145
  34. package/app/modules/vgfilepreview/js/renderers/image.js +92 -92
  35. package/app/modules/vgfilepreview/js/renderers/index.js +19 -19
  36. package/app/modules/vgfilepreview/js/renderers/office-modal.js +168 -168
  37. package/app/modules/vgfilepreview/js/renderers/office.js +79 -79
  38. package/app/modules/vgfilepreview/js/renderers/pdf-modal.js +260 -260
  39. package/app/modules/vgfilepreview/js/renderers/pdf.js +76 -76
  40. package/app/modules/vgfilepreview/js/renderers/playlist.js +71 -71
  41. package/app/modules/vgfilepreview/js/renderers/text-modal.js +343 -343
  42. package/app/modules/vgfilepreview/js/renderers/text.js +83 -83
  43. package/app/modules/vgfilepreview/js/renderers/video-modal.js +272 -272
  44. package/app/modules/vgfilepreview/js/renderers/video.js +80 -80
  45. package/app/modules/vgfilepreview/js/renderers/zip-modal.js +522 -522
  46. package/app/modules/vgfilepreview/js/renderers/zip.js +89 -89
  47. package/app/modules/vgfilepreview/js/vgfilepreview.js +7 -7
  48. package/app/modules/vgfilepreview/readme.md +68 -68
  49. package/app/modules/vgfilepreview/scss/_variables.scss +115 -115
  50. package/app/modules/vgfilepreview/scss/vgfilepreview.scss +463 -463
  51. package/app/modules/vgfiles/js/droppable.js +20 -9
  52. package/app/modules/vgfiles/js/render.js +153 -153
  53. package/app/modules/vgfiles/js/vgfiles.js +104 -104
  54. package/app/modules/vgfiles/readme.md +123 -123
  55. package/app/modules/vgfiles/scss/_mixins.scss +9 -9
  56. package/app/modules/vgfiles/scss/_variables.scss +41 -41
  57. package/app/modules/vgfiles/scss/vgfiles.scss +161 -161
  58. package/app/modules/vgformsender/js/hideshowpass.js +21 -16
  59. package/app/modules/vgformsender/js/vgformsender.js +4 -6
  60. package/app/modules/vgformsender/readme.md +1 -1
  61. package/app/modules/vgformsender/scss/_variables.scss +5 -5
  62. package/app/modules/vgformsender/scss/vgformsender.scss +42 -42
  63. package/app/modules/vglawcookie/js/vglawcookie.js +11 -8
  64. package/app/modules/vglawcookie/scss/_variables.scss +13 -13
  65. package/app/modules/vglawcookie/scss/vglawcookie.scss +5 -5
  66. package/app/modules/vgmodal/js/vgmodal.interaction.js +216 -216
  67. package/app/modules/vgmodal/js/vgmodal.js +355 -355
  68. package/app/modules/vgmodal/js/vgmodal.minimized.js +227 -227
  69. package/app/modules/vgmodal/scss/_variables.scss +17 -17
  70. package/app/modules/vgmodal/scss/vgmodal.scss +77 -77
  71. package/app/modules/vgnav/js/vgnav.js +180 -180
  72. package/app/modules/vgnav/scss/_breakpoints.scss +36 -36
  73. package/app/modules/vgnav/scss/_hamburger.scss +5 -5
  74. package/app/modules/vgnav/scss/_placement.scss +5 -5
  75. package/app/modules/vgnav/scss/_toggle.scss +5 -5
  76. package/app/modules/vgnav/scss/_variables.scss +26 -26
  77. package/app/modules/vgnav/scss/vgnav.scss +41 -41
  78. package/app/modules/vgnestable/README.md +39 -39
  79. package/app/modules/vgnestable/js/vgnestable.js +358 -358
  80. package/app/modules/vgnestable/scss/_variables.scss +35 -35
  81. package/app/modules/vgnestable/scss/vgnestable.scss +55 -55
  82. package/app/modules/vgrangeslider/js/skins.js +222 -222
  83. package/app/modules/vgrangeslider/js/vgrangeslider.js +704 -704
  84. package/app/modules/vgrangeslider/scss/_variables.scss +55 -55
  85. package/app/modules/vgrangeslider/scss/vgrangeslider.scss +239 -239
  86. package/app/modules/vgrollup/scss/_variables.scss +15 -15
  87. package/app/modules/vgrollup/scss/vgrollup.scss +6 -6
  88. package/app/modules/vgselect/js/vgselect.js +129 -129
  89. package/app/modules/vgselect/readme.md +11 -11
  90. package/app/modules/vgselect/scss/_variables.scss +50 -50
  91. package/app/modules/vgselect/scss/vgselect.scss +48 -48
  92. package/app/modules/vgsidebar/js/vgsidebar.js +79 -79
  93. package/app/modules/vgsidebar/scss/_variables.scss +10 -10
  94. package/app/modules/vgsidebar/scss/vgsidebar.scss +5 -5
  95. package/app/modules/vgtabs/scss/_variables.scss +23 -23
  96. package/app/modules/vgtabs/scss/vgtabs.scss +5 -5
  97. package/app/modules/vgtoast/scss/_variables.scss +13 -13
  98. package/app/modules/vgtoast/scss/vgtoast.scss +5 -5
  99. package/app/modules/vgtooltip/js/vgtooltip.js +107 -51
  100. package/app/modules/vgtooltip/scss/_variables.scss +10 -10
  101. package/app/modules/vgtooltip/scss/vgtooltip.scss +5 -5
  102. package/app/utils/js/components/audio-metadata.js +240 -240
  103. package/app/utils/js/components/backdrop.js +116 -116
  104. package/app/utils/js/components/file-icon.js +109 -109
  105. package/app/utils/js/components/file-preview.js +304 -304
  106. package/app/utils/js/components/sanitize.js +150 -150
  107. package/app/utils/js/components/video-metadata.js +140 -140
  108. package/app/utils/scss/_backdrop.scss +5 -5
  109. package/app/utils/scss/_theme-default.scss +12 -12
  110. package/app/utils/scss/_theme.scss +7 -7
  111. package/app/utils/scss/_tokens.scss +170 -170
  112. package/app/utils/scss/default.scss +9 -9
  113. package/app/utils/scss/functions.scss +21 -21
  114. package/app/utils/scss/index.scss +4 -4
  115. package/app/utils/scss/mixin.scss +16 -16
  116. package/app/utils/scss/variables.scss +105 -105
  117. package/app/vgapp.js +295 -295
  118. package/build/vgapp.css +1 -1
  119. package/build/vgapp.css.map +1 -1
  120. package/build/vgapp.js +1 -1
  121. package/build/vgapp.js.map +1 -1
  122. package/index.scss +20 -20
  123. package/package.json +4 -2
package/app/utils/scss/variables.scss CHANGED
@@ -1,45 +1,45 @@
1
- @use "sass:map";
2
- @use "functions" as fn;
3
- @use "tokens";
4
-
5
- // Semantic base values for Sass consumers. Runtime theme-aware components
6
- // should use the matching --vg-* custom properties.
7
- $body-bg: tokens.theme-token(tokens.$theme-light, body-bg) !default;
8
- $surface-bg: tokens.theme-token(tokens.$theme-light, surface-bg) !default;
9
- $surface-raised-bg: tokens.theme-token(tokens.$theme-light, surface-raised-bg) !default;
10
- $surface-muted-bg: tokens.theme-token(tokens.$theme-light, surface-muted-bg) !default;
11
- $surface-hover-bg: tokens.theme-token(tokens.$theme-light, surface-hover-bg) !default;
12
- $surface-active-bg: tokens.theme-token(tokens.$theme-light, surface-active-bg) !default;
13
-
14
- // Legacy aliases. Keep these until every component has moved to semantic tokens.
15
- $bg-color: $surface-bg !default;
16
- $bg-color-active: $surface-active-bg !default;
17
-
18
- // -- Colors
19
- $color: tokens.theme-token(tokens.$theme-light, text-color) !default;
20
- $color-emphasis: tokens.theme-token(tokens.$theme-light, text-emphasis-color) !default;
21
- $color-muted: tokens.theme-token(tokens.$theme-light, text-muted-color) !default;
22
- $color-active: tokens.theme-token(tokens.$theme-light, primary-color) !default;
23
- $color-disabled: tokens.theme-token(tokens.$theme-light, text-disabled-color) !default;
24
- $color-inverse: tokens.theme-token(tokens.$theme-light, text-inverse-color) !default;
25
-
26
- // -- Shadows
27
- $box-shadow: tokens.theme-token(tokens.$theme-light, box-shadow) !default;
28
-
29
- // -- Borders
30
- $border-color: tokens.theme-token(tokens.$theme-light, border-color) !default;
31
- $border-color-strong: tokens.theme-token(tokens.$theme-light, border-strong-color) !default;
32
- $border-color-active: tokens.theme-token(tokens.$theme-light, primary-color) !default;
33
- $border-color-disabled: tokens.theme-token(tokens.$theme-light, border-disabled-color) !default;
34
- $border-radius: .375rem !default;
35
- $border-width: 1px !default;
36
- $border-style: solid !default;
1
+ @use "sass:map";
2
+ @use "functions" as fn;
3
+ @use "tokens";
4
+
5
+ // Semantic base values for Sass consumers. Runtime theme-aware components
6
+ // should use the matching --vg-* custom properties.
7
+ $body-bg: tokens.theme-token(tokens.$theme-light, body-bg) !default;
8
+ $surface-bg: tokens.theme-token(tokens.$theme-light, surface-bg) !default;
9
+ $surface-raised-bg: tokens.theme-token(tokens.$theme-light, surface-raised-bg) !default;
10
+ $surface-muted-bg: tokens.theme-token(tokens.$theme-light, surface-muted-bg) !default;
11
+ $surface-hover-bg: tokens.theme-token(tokens.$theme-light, surface-hover-bg) !default;
12
+ $surface-active-bg: tokens.theme-token(tokens.$theme-light, surface-active-bg) !default;
13
+
14
+ // Legacy aliases. Keep these until every component has moved to semantic tokens.
15
+ $bg-color: $surface-bg !default;
16
+ $bg-color-active: $surface-active-bg !default;
17
+
18
+ // -- Colors
19
+ $color: tokens.theme-token(tokens.$theme-light, text-color) !default;
20
+ $color-emphasis: tokens.theme-token(tokens.$theme-light, text-emphasis-color) !default;
21
+ $color-muted: tokens.theme-token(tokens.$theme-light, text-muted-color) !default;
22
+ $color-active: tokens.theme-token(tokens.$theme-light, primary-color) !default;
23
+ $color-disabled: tokens.theme-token(tokens.$theme-light, text-disabled-color) !default;
24
+ $color-inverse: tokens.theme-token(tokens.$theme-light, text-inverse-color) !default;
25
+
26
+ // -- Shadows
27
+ $box-shadow: tokens.theme-token(tokens.$theme-light, box-shadow) !default;
28
+
29
+ // -- Borders
30
+ $border-color: tokens.theme-token(tokens.$theme-light, border-color) !default;
31
+ $border-color-strong: tokens.theme-token(tokens.$theme-light, border-strong-color) !default;
32
+ $border-color-active: tokens.theme-token(tokens.$theme-light, primary-color) !default;
33
+ $border-color-disabled: tokens.theme-token(tokens.$theme-light, border-disabled-color) !default;
34
+ $border-radius: .375rem !default;
35
+ $border-width: 1px !default;
36
+ $border-style: solid !default;
37
37
 
38
38
  // -- Transitions
39
39
  $transition-base: all .5s ease-in-out !default;
40
40
 
41
41
  // -- Backdrop
42
- $backdrop-bg: tokens.theme-token(tokens.$theme-light, backdrop-color) !default;
42
+ $backdrop-bg: tokens.theme-token(tokens.$theme-light, backdrop-color) !default;
43
43
  $backdrop-opacity: .4 !default;
44
44
 
45
45
  // Z-indexes
@@ -70,78 +70,78 @@ $loader-map: (
70
70
  );
71
71
 
72
72
  // Colors Status
73
- $danger: tokens.theme-token(tokens.$theme-light, danger-color) !default;
74
- $danger-border: tokens.theme-token(tokens.$theme-light, danger-border-color) !default;
75
- $danger-text: tokens.theme-token(tokens.$theme-light, danger-text-color) !default;
76
- $danger-bg: tokens.theme-token(tokens.$theme-light, danger-bg) !default;
77
-
78
- $success: tokens.theme-token(tokens.$theme-light, success-color) !default;
79
- $success-border: tokens.theme-token(tokens.$theme-light, success-border-color) !default;
80
- $success-text: tokens.theme-token(tokens.$theme-light, success-text-color) !default;
81
- $success-bg: tokens.theme-token(tokens.$theme-light, success-bg) !default;
82
-
83
- $warning: tokens.theme-token(tokens.$theme-light, warning-color) !default;
84
- $warning-border: tokens.theme-token(tokens.$theme-light, warning-border-color) !default;
85
- $warning-text: tokens.theme-token(tokens.$theme-light, warning-text-color) !default;
86
- $warning-bg: tokens.theme-token(tokens.$theme-light, warning-bg) !default;
87
-
88
- $info: tokens.theme-token(tokens.$theme-light, info-color) !default;
89
- $info-border: tokens.theme-token(tokens.$theme-light, info-border-color) !default;
90
- $info-text: tokens.theme-token(tokens.$theme-light, info-text-color) !default;
91
- $info-bg: tokens.theme-token(tokens.$theme-light, info-bg) !default;
73
+ $danger: tokens.theme-token(tokens.$theme-light, danger-color) !default;
74
+ $danger-border: tokens.theme-token(tokens.$theme-light, danger-border-color) !default;
75
+ $danger-text: tokens.theme-token(tokens.$theme-light, danger-text-color) !default;
76
+ $danger-bg: tokens.theme-token(tokens.$theme-light, danger-bg) !default;
77
+
78
+ $success: tokens.theme-token(tokens.$theme-light, success-color) !default;
79
+ $success-border: tokens.theme-token(tokens.$theme-light, success-border-color) !default;
80
+ $success-text: tokens.theme-token(tokens.$theme-light, success-text-color) !default;
81
+ $success-bg: tokens.theme-token(tokens.$theme-light, success-bg) !default;
82
+
83
+ $warning: tokens.theme-token(tokens.$theme-light, warning-color) !default;
84
+ $warning-border: tokens.theme-token(tokens.$theme-light, warning-border-color) !default;
85
+ $warning-text: tokens.theme-token(tokens.$theme-light, warning-text-color) !default;
86
+ $warning-bg: tokens.theme-token(tokens.$theme-light, warning-bg) !default;
87
+
88
+ $info: tokens.theme-token(tokens.$theme-light, info-color) !default;
89
+ $info-border: tokens.theme-token(tokens.$theme-light, info-border-color) !default;
90
+ $info-text: tokens.theme-token(tokens.$theme-light, info-text-color) !default;
91
+ $info-bg: tokens.theme-token(tokens.$theme-light, info-bg) !default;
92
92
 
93
93
  $dark: #232323;
94
- $dark-border: fn.shade-color($dark, 60%) !default;
95
- $dark-text: fn.tint-color($dark, 60%) !default;
96
- $dark-bg: fn.shade-color($dark, 80%) !default;
97
-
98
- $success-map: (
99
- icon: var(--vg-success-color, #{$success}),
100
- color: var(--vg-success-text-color, #{$success-text}),
101
- border-color: var(--vg-success-border-color, #{$success-border}),
102
- background-color: var(--vg-success-bg, #{$success-bg}),
103
- close: var(--vg-success-close-color, #{fn.shade-color($success-text, 80%)})
104
- );
105
-
106
- $danger-map: (
107
- icon: var(--vg-danger-color, #{$danger}),
108
- color: var(--vg-danger-text-color, #{$danger-text}),
109
- border-color: var(--vg-danger-border-color, #{$danger-border}),
110
- background-color: var(--vg-danger-bg, #{$danger-bg}),
111
- close: var(--vg-danger-close-color, #{fn.shade-color($danger-text, 80%)})
112
- );
113
-
114
- $warning-map: (
115
- icon: var(--vg-warning-color, #{$warning}),
116
- color: var(--vg-warning-text-color, #{$warning-text}),
117
- border-color: var(--vg-warning-border-color, #{$warning-border}),
118
- background-color: var(--vg-warning-bg, #{$warning-bg}),
119
- close: var(--vg-warning-close-color, #{fn.shade-color($warning-text, 80%)})
120
- );
121
-
122
- $info-map: (
123
- icon: var(--vg-info-color, #{$info}),
124
- color: var(--vg-info-text-color, #{$info-text}),
125
- border-color: var(--vg-info-border-color, #{$info-border}),
126
- background-color: var(--vg-info-bg, #{$info-bg}),
127
- close: var(--vg-info-close-color, #{fn.shade-color($info-text, 80%)})
128
- );
94
+ $dark-border: fn.shade-color($dark, 60%) !default;
95
+ $dark-text: fn.tint-color($dark, 60%) !default;
96
+ $dark-bg: fn.shade-color($dark, 80%) !default;
97
+
98
+ $success-map: (
99
+ icon: var(--vg-success-color, #{$success}),
100
+ color: var(--vg-success-text-color, #{$success-text}),
101
+ border-color: var(--vg-success-border-color, #{$success-border}),
102
+ background-color: var(--vg-success-bg, #{$success-bg}),
103
+ close: var(--vg-success-close-color, #{fn.shade-color($success-text, 80%)})
104
+ );
105
+
106
+ $danger-map: (
107
+ icon: var(--vg-danger-color, #{$danger}),
108
+ color: var(--vg-danger-text-color, #{$danger-text}),
109
+ border-color: var(--vg-danger-border-color, #{$danger-border}),
110
+ background-color: var(--vg-danger-bg, #{$danger-bg}),
111
+ close: var(--vg-danger-close-color, #{fn.shade-color($danger-text, 80%)})
112
+ );
113
+
114
+ $warning-map: (
115
+ icon: var(--vg-warning-color, #{$warning}),
116
+ color: var(--vg-warning-text-color, #{$warning-text}),
117
+ border-color: var(--vg-warning-border-color, #{$warning-border}),
118
+ background-color: var(--vg-warning-bg, #{$warning-bg}),
119
+ close: var(--vg-warning-close-color, #{fn.shade-color($warning-text, 80%)})
120
+ );
121
+
122
+ $info-map: (
123
+ icon: var(--vg-info-color, #{$info}),
124
+ color: var(--vg-info-text-color, #{$info-text}),
125
+ border-color: var(--vg-info-border-color, #{$info-border}),
126
+ background-color: var(--vg-info-bg, #{$info-bg}),
127
+ close: var(--vg-info-close-color, #{fn.shade-color($info-text, 80%)})
128
+ );
129
129
 
130
130
  $dark-map: (
131
131
  color: $dark-text,
132
132
  border-color: $dark-border,
133
133
  background-color: $dark-bg,
134
- close: fn.shade-color($dark-text, 80%)
135
- );
136
-
137
- $alert-colors: (
138
- success: $success-map,
139
- info: $info-map,
140
- warning: $warning-map,
141
- danger: $danger-map,
142
- dark: $dark-map,
143
- ) !default;
144
-
145
- @function get-alert-color($type) {
146
- @return map.get($alert-colors, $type);
147
- }
134
+ close: fn.shade-color($dark-text, 80%)
135
+ );
136
+
137
+ $alert-colors: (
138
+ success: $success-map,
139
+ info: $info-map,
140
+ warning: $warning-map,
141
+ danger: $danger-map,
142
+ dark: $dark-map,
143
+ ) !default;
144
+
145
+ @function get-alert-color($type) {
146
+ @return map.get($alert-colors, $type);
147
+ }