vue-stack-tabs 0.1.11 → 0.1.13

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 (72) hide show
  1. package/{types → dist}/src/lib/hooks/useStackTab.d.ts +2 -2
  2. package/{types → dist}/src/lib/hooks/useTabpanel.d.ts +6 -2
  3. package/{types → dist}/src/lib/index.d.ts +7 -1
  4. package/{types → dist}/src/lib/model/TabModel.d.ts +2 -1
  5. package/dist/style.css +1 -1
  6. package/dist/vue-stack-tabs.es.js +2340 -2321
  7. package/dist/vue-stack-tabs.umd.js +10 -10
  8. package/package.json +3 -4
  9. package/src/lib/StackTabs.vue +136 -126
  10. package/src/lib/assets/style/common/mixins.scss +45 -45
  11. package/src/lib/assets/style/common/var.scss +65 -65
  12. package/src/lib/assets/style/icon.scss +93 -93
  13. package/src/lib/assets/style/index.scss +4 -4
  14. package/src/lib/assets/style/overlayer.scss +40 -40
  15. package/src/lib/assets/style/stackTab.scss +395 -395
  16. package/src/lib/assets/style/transition.scss +40 -40
  17. package/src/lib/banner.ts +51 -51
  18. package/src/lib/components/ContextMenu/ContextMenuItem.vue +15 -15
  19. package/src/lib/components/ContextMenu/index.vue +129 -129
  20. package/src/lib/components/OverlayLoading/Component.vue +182 -191
  21. package/src/lib/components/OverlayLoading/api.ts +31 -31
  22. package/src/lib/components/OverlayLoading/helpers.ts +31 -31
  23. package/src/lib/components/OverlayLoading/index.ts +12 -12
  24. package/src/lib/components/OverlayLoading/loaders/bars.vue +79 -79
  25. package/src/lib/components/OverlayLoading/loaders/dots.vue +92 -92
  26. package/src/lib/components/OverlayLoading/loaders/index.ts +9 -9
  27. package/src/lib/components/OverlayLoading/loaders/spinner.vue +41 -41
  28. package/src/lib/components/TabHeader/TabHeaderButton.vue +35 -35
  29. package/src/lib/components/TabHeader/TabHeaderItem.vue +63 -63
  30. package/src/lib/components/TabHeader/TabHeaderScroll.vue +240 -240
  31. package/src/lib/components/TabHeader/index.vue +135 -135
  32. package/src/lib/hooks/useContextMenu.ts +50 -50
  33. package/src/lib/hooks/useStackTab.ts +74 -65
  34. package/src/lib/hooks/useTabLoading.ts +34 -34
  35. package/src/lib/hooks/useTabRouter.ts +94 -94
  36. package/src/lib/hooks/useTabpanel.tsx +516 -491
  37. package/src/lib/i18n/index.ts +72 -72
  38. package/src/lib/i18n/lang/en.ts +15 -15
  39. package/src/lib/i18n/lang/zh-CN.ts +15 -15
  40. package/src/lib/iframe.vue +7 -7
  41. package/src/lib/index.ts +32 -23
  42. package/src/lib/model/TabModel.ts +178 -169
  43. package/src/lib/utils/TabIdHelper.ts +70 -70
  44. package/src/lib/utils/TabScrollHelper.ts +104 -104
  45. package/src/lib/utils/UriHelper.ts +22 -22
  46. /package/{types → dist}/index.d.ts +0 -0
  47. /package/{types → dist}/src/lib/StackTabs.vue.d.ts +0 -0
  48. /package/{types → dist}/src/lib/banner.d.ts +0 -0
  49. /package/{types → dist}/src/lib/components/ContextMenu/ContextMenuItem.vue.d.ts +0 -0
  50. /package/{types → dist}/src/lib/components/ContextMenu/index.vue.d.ts +0 -0
  51. /package/{types → dist}/src/lib/components/OverlayLoading/Component.vue.d.ts +0 -0
  52. /package/{types → dist}/src/lib/components/OverlayLoading/api.d.ts +0 -0
  53. /package/{types → dist}/src/lib/components/OverlayLoading/helpers.d.ts +0 -0
  54. /package/{types → dist}/src/lib/components/OverlayLoading/index.d.ts +0 -0
  55. /package/{types → dist}/src/lib/components/OverlayLoading/loaders/bars.vue.d.ts +0 -0
  56. /package/{types → dist}/src/lib/components/OverlayLoading/loaders/dots.vue.d.ts +0 -0
  57. /package/{types → dist}/src/lib/components/OverlayLoading/loaders/index.d.ts +0 -0
  58. /package/{types → dist}/src/lib/components/OverlayLoading/loaders/spinner.vue.d.ts +0 -0
  59. /package/{types → dist}/src/lib/components/TabHeader/TabHeaderButton.vue.d.ts +0 -0
  60. /package/{types → dist}/src/lib/components/TabHeader/TabHeaderItem.vue.d.ts +0 -0
  61. /package/{types → dist}/src/lib/components/TabHeader/TabHeaderScroll.vue.d.ts +0 -0
  62. /package/{types → dist}/src/lib/components/TabHeader/index.vue.d.ts +0 -0
  63. /package/{types → dist}/src/lib/hooks/useContextMenu.d.ts +0 -0
  64. /package/{types → dist}/src/lib/hooks/useTabLoading.d.ts +0 -0
  65. /package/{types → dist}/src/lib/hooks/useTabRouter.d.ts +0 -0
  66. /package/{types → dist}/src/lib/i18n/index.d.ts +0 -0
  67. /package/{types → dist}/src/lib/i18n/lang/en.d.ts +0 -0
  68. /package/{types → dist}/src/lib/i18n/lang/zh-CN.d.ts +0 -0
  69. /package/{types → dist}/src/lib/iframe.vue.d.ts +0 -0
  70. /package/{types → dist}/src/lib/utils/TabIdHelper.d.ts +0 -0
  71. /package/{types → dist}/src/lib/utils/TabScrollHelper.d.ts +0 -0
  72. /package/{types → dist}/src/lib/utils/UriHelper.d.ts +0 -0
@@ -1,93 +1,93 @@
1
- @import './common/var';
2
-
3
- // 全屏
4
- .stack-tab__icon-fullscreen {
5
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
6
- mask: url('../image/fullscreen.svg') no-repeat center center;
7
- mask-size: contain;
8
- }
9
- // 恢复
10
- .stack-tab__icon-restore {
11
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
12
- mask: url('../image/restore.svg') no-repeat center center;
13
- mask-size: contain;
14
- }
15
- // 关闭
16
- .stack-tab__icon-close {
17
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
18
- mask: url('../image/close.svg') no-repeat center center;
19
- mask-size: contain;
20
- }
21
-
22
- .stack-tab__icon-close-fill {
23
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
24
- mask: url('../image/close_fill.svg') no-repeat center center;
25
- mask-size: contain;
26
- }
27
-
28
- .stack-tab__icon-close-lefts {
29
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
30
- mask: url('../image/close_lefts.svg') no-repeat center center;
31
- mask-size: contain;
32
- }
33
-
34
- .stack-tab__icon-close-rights {
35
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
36
- mask: url('../image/close_rights.svg') no-repeat center center;
37
- mask-size: contain;
38
- }
39
-
40
- .stack-tab__icon-close-others {
41
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
42
- mask: url('../image/close_other.svg') no-repeat center center;
43
- mask-size: contain;
44
- }
45
-
46
- .stack-tab__icon-close-all {
47
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
48
- mask: url('../image/close_all.svg') no-repeat center center;
49
- mask-size: contain;
50
- }
51
-
52
- /*
53
- 刷新
54
- */
55
- .stack-tab__icon-reload {
56
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
57
- mask: url('../image/loading.svg') no-repeat center center;
58
- mask-size: contain;
59
- }
60
-
61
- .stack-tab__icon-reload-lefts {
62
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
63
- mask: url('../image/reload_lefts.svg') no-repeat center center;
64
- mask-size: contain;
65
- }
66
-
67
- .stack-tab__icon-reload-rights {
68
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
69
- mask: url('../image/reload_rights.svg') no-repeat center center;
70
- mask-size: contain;
71
- }
72
-
73
- .stack-tab__icon-reload-all {
74
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
75
- mask: url('../image/reload.svg') no-repeat center center;
76
- mask-size: contain;
77
- }
78
- /*
79
- 左箭头
80
- */
81
- .stack-tab__icon-left-arrow {
82
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
83
- mask: url('../image/left_arrow.svg') no-repeat center center;
84
- mask-size: contain;
85
- }
86
- /*
87
- 右箭头
88
- */
89
- .stack-tab__icon-right-arrow {
90
- /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
91
- mask: url('../image/right_arrow.svg') no-repeat center center;
92
- mask-size: contain;
93
- }
1
+ @import './common/var';
2
+
3
+ // 全屏
4
+ .stack-tab__icon-fullscreen {
5
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
6
+ mask: url('../image/fullscreen.svg') no-repeat center center;
7
+ mask-size: contain;
8
+ }
9
+ // 恢复
10
+ .stack-tab__icon-restore {
11
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
12
+ mask: url('../image/restore.svg') no-repeat center center;
13
+ mask-size: contain;
14
+ }
15
+ // 关闭
16
+ .stack-tab__icon-close {
17
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
18
+ mask: url('../image/close.svg') no-repeat center center;
19
+ mask-size: contain;
20
+ }
21
+
22
+ .stack-tab__icon-close-fill {
23
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
24
+ mask: url('../image/close_fill.svg') no-repeat center center;
25
+ mask-size: contain;
26
+ }
27
+
28
+ .stack-tab__icon-close-lefts {
29
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
30
+ mask: url('../image/close_lefts.svg') no-repeat center center;
31
+ mask-size: contain;
32
+ }
33
+
34
+ .stack-tab__icon-close-rights {
35
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
36
+ mask: url('../image/close_rights.svg') no-repeat center center;
37
+ mask-size: contain;
38
+ }
39
+
40
+ .stack-tab__icon-close-others {
41
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
42
+ mask: url('../image/close_other.svg') no-repeat center center;
43
+ mask-size: contain;
44
+ }
45
+
46
+ .stack-tab__icon-close-all {
47
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
48
+ mask: url('../image/close_all.svg') no-repeat center center;
49
+ mask-size: contain;
50
+ }
51
+
52
+ /*
53
+ 刷新
54
+ */
55
+ .stack-tab__icon-reload {
56
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
57
+ mask: url('../image/loading.svg') no-repeat center center;
58
+ mask-size: contain;
59
+ }
60
+
61
+ .stack-tab__icon-reload-lefts {
62
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
63
+ mask: url('../image/reload_lefts.svg') no-repeat center center;
64
+ mask-size: contain;
65
+ }
66
+
67
+ .stack-tab__icon-reload-rights {
68
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
69
+ mask: url('../image/reload_rights.svg') no-repeat center center;
70
+ mask-size: contain;
71
+ }
72
+
73
+ .stack-tab__icon-reload-all {
74
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
75
+ mask: url('../image/reload.svg') no-repeat center center;
76
+ mask-size: contain;
77
+ }
78
+ /*
79
+ 左箭头
80
+ */
81
+ .stack-tab__icon-left-arrow {
82
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
83
+ mask: url('../image/left_arrow.svg') no-repeat center center;
84
+ mask-size: contain;
85
+ }
86
+ /*
87
+ 右箭头
88
+ */
89
+ .stack-tab__icon-right-arrow {
90
+ /* 类似一个到路径上做一个遮罩, 用法和background属性一样 */
91
+ mask: url('../image/right_arrow.svg') no-repeat center center;
92
+ mask-size: contain;
93
+ }
@@ -1,4 +1,4 @@
1
- @import 'stackTab';
2
- @import 'icon';
3
- @import 'transition';
4
- @import 'overlayer';
1
+ @import 'stackTab';
2
+ @import 'icon';
3
+ @import 'transition';
4
+ @import 'overlayer';
@@ -1,40 +1,40 @@
1
- .vl-shown {
2
- overflow: hidden;
3
- }
4
-
5
- .vl-overlay {
6
- bottom: 0;
7
- left: 0;
8
- position: absolute;
9
- right: 0;
10
- top: 0;
11
- align-items: center;
12
- display: none;
13
- justify-content: center;
14
- overflow: hidden;
15
- z-index: 9999;
16
- }
17
-
18
- .vl-overlay.vl-active {
19
- display: flex;
20
- }
21
-
22
- .vl-overlay.vl-full-page {
23
- z-index: 9999;
24
- position: fixed;
25
- }
26
-
27
- .vl-overlay .vl-background {
28
- bottom: 0;
29
- left: 0;
30
- position: absolute;
31
- right: 0;
32
- top: 0;
33
- background: #fff;
34
- opacity: 0.5;
35
- }
36
-
37
- .vl-overlay .vl-icon,
38
- .vl-parent {
39
- position: relative;
40
- }
1
+ .vl-shown {
2
+ overflow: hidden;
3
+ }
4
+
5
+ .vl-overlay {
6
+ bottom: 0;
7
+ left: 0;
8
+ position: absolute;
9
+ right: 0;
10
+ top: 0;
11
+ align-items: center;
12
+ display: none;
13
+ justify-content: center;
14
+ overflow: hidden;
15
+ z-index: 9999;
16
+ }
17
+
18
+ .vl-overlay.vl-active {
19
+ display: flex;
20
+ }
21
+
22
+ .vl-overlay.vl-full-page {
23
+ z-index: 9999;
24
+ position: fixed;
25
+ }
26
+
27
+ .vl-overlay .vl-background {
28
+ bottom: 0;
29
+ left: 0;
30
+ position: absolute;
31
+ right: 0;
32
+ top: 0;
33
+ background: #fff;
34
+ opacity: 0.5;
35
+ }
36
+
37
+ .vl-overlay .vl-icon,
38
+ .vl-parent {
39
+ position: relative;
40
+ }