vanilla-jui 1.4.5 → 1.4.7

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 (103) hide show
  1. package/README.md +6 -0
  2. package/dist/index.d.ts +1273 -1896
  3. package/dist/index.js +1 -1
  4. package/dist/index.umd.js +1 -1
  5. package/dist/style.css +1 -1
  6. package/package.json +21 -2
  7. package/src/components/accordion.ts +297 -216
  8. package/src/components/flow.ts +222 -258
  9. package/src/components/form.ts +44 -102
  10. package/src/components/menu.ts +268 -356
  11. package/src/components/modal.ts +181 -641
  12. package/src/components/offcanvas.ts +225 -106
  13. package/src/components/pagination.ts +296 -326
  14. package/src/components/sticky.ts +55 -54
  15. package/src/components/swiper.ts +237 -247
  16. package/src/components/tabs.ts +278 -271
  17. package/src/components/toc.ts +42 -46
  18. package/src/core/Component.ts +69 -47
  19. package/src/css/accordion.css +2 -2
  20. package/src/css/animation.css +1 -5
  21. package/src/css/avatar.css +1 -1
  22. package/src/css/badge.css +1 -1
  23. package/src/css/breadcrumb.css +9 -10
  24. package/src/css/button.css +1 -1
  25. package/src/css/card.css +2 -2
  26. package/src/css/color.css +974 -1002
  27. package/src/css/color_p3.css +974 -1004
  28. package/src/css/components.css +1 -1
  29. package/src/css/content.css +72 -63
  30. package/src/css/drop.css +1 -1
  31. package/src/css/editor.css +14 -14
  32. package/src/css/flow.css +4 -14
  33. package/src/css/font.css +5 -4
  34. package/src/css/form.css +76 -52
  35. package/src/css/gradient.css +299 -222
  36. package/src/css/icon.css +57 -57
  37. package/src/css/index.css +1 -1
  38. package/src/css/layout.css +13 -10
  39. package/src/css/loading.css +60 -12
  40. package/src/css/menu.css +262 -188
  41. package/src/css/modal.css +1 -1
  42. package/src/css/offcanvas.css +9 -13
  43. package/src/css/pagination.css +5 -1
  44. package/src/css/popup.css +1 -1
  45. package/src/css/skeleton.css +3 -2
  46. package/src/css/status.css +2 -3
  47. package/src/css/swiper.css +1 -1
  48. package/src/css/table.css +1 -1
  49. package/src/css/tabs.css +12 -11
  50. package/src/css/tag.css +1 -1
  51. package/src/css/theme-palette.css +19 -5
  52. package/src/css/themes/default/accordion.css +61 -61
  53. package/src/css/themes/default/avatar.css +54 -54
  54. package/src/css/themes/default/badge.css +62 -62
  55. package/src/css/themes/default/breadcrumb.css +23 -23
  56. package/src/css/themes/default/button.css +203 -203
  57. package/src/css/themes/default/content.css +53 -53
  58. package/src/css/themes/default/drop.css +10 -10
  59. package/src/css/themes/default/editor.css +9 -9
  60. package/src/css/themes/default/index.css +1 -1
  61. package/src/css/themes/default/loading.css +26 -20
  62. package/src/css/themes/default/menu.css +75 -11
  63. package/src/css/themes/default/modal.css +32 -36
  64. package/src/css/themes/default/pagination.css +7 -7
  65. package/src/css/themes/default/popup.css +6 -6
  66. package/src/css/themes/default/swiper.css +32 -32
  67. package/src/css/themes/default/table.css +16 -16
  68. package/src/css/themes/default/tabs.css +30 -30
  69. package/src/css/themes/default/tag.css +71 -71
  70. package/src/css/themes/default/theme-palette.css +11 -11
  71. package/src/css/themes/default/tip.css +42 -42
  72. package/src/css/themes/default/toast.css +60 -60
  73. package/src/css/themes/default/toolbar.css +23 -29
  74. package/src/css/themes/default/tooltip.css +43 -13
  75. package/src/css/themes/index.css +1 -1
  76. package/src/css/tip.css +2 -2
  77. package/src/css/toast.css +3 -3
  78. package/src/css/tokens.css +12 -17
  79. package/src/css/toolbar.css +9 -10
  80. package/src/css/tooltip.css +3 -2
  81. package/src/index.ts +22 -19
  82. package/src/{components → primitives}/drop.ts +58 -49
  83. package/src/{components → primitives}/icons.ts +1 -1
  84. package/src/primitives/loading.ts +23 -0
  85. package/src/primitives/parabola.ts +388 -0
  86. package/src/primitives/popup.ts +61 -0
  87. package/src/{components → primitives}/theme.ts +89 -57
  88. package/src/{components → primitives}/toast.ts +18 -25
  89. package/src/{components → primitives}/tooltip.ts +100 -25
  90. package/src/utilities/browser.ts +23 -49
  91. package/src/utilities/class-name.ts +5 -0
  92. package/src/utilities/dom.ts +14 -32
  93. package/src/utilities/function.ts +4 -0
  94. package/src/utilities/http.ts +7 -7
  95. package/src/utilities/id.ts +57 -0
  96. package/src/utilities/object.ts +5 -0
  97. package/src/utilities/timer.ts +38 -0
  98. package/src/utilities/types.ts +420 -0
  99. package/src/{components → validation}/validator.ts +64 -53
  100. package/src/components/parabola.ts +0 -335
  101. package/src/utilities/cache.ts +0 -57
  102. package/src/utilities/core.ts +0 -614
  103. package/src/utilities/storage.ts +0 -46
package/src/css/layout.css CHANGED
@@ -28,13 +28,8 @@
28
28
  -webkit-font-smoothing: antialiased;
29
29
  scroll-behavior: smooth;
30
30
  font-family:
31
- "Source Han Sans CN",
32
- "Inter",
33
- "PingFang SC",
34
- "Helvetica Neue",
35
- Emoji,
36
- Arial,
37
- sans-serif;
31
+ 'Source Han Sans CN', 'Inter', 'PingFang SC', 'Helvetica Neue', Emoji,
32
+ Arial, sans-serif;
38
33
  font-feature-settings: normal;
39
34
  font-variation-settings: normal;
40
35
  color: var(--ui-fg);
@@ -117,7 +112,11 @@
117
112
  linear-gradient(to right, var(--ui-surface-subtle) 1px, transparent 1px),
118
113
  linear-gradient(to bottom, var(--ui-surface-subtle) 1px, transparent 1px);
119
114
  background-size: 40px 56px;
120
- mask-image: radial-gradient(ellipse 25% 10% at 50% 0%, #000 60%, transparent 300%);
115
+ mask-image: radial-gradient(
116
+ ellipse 25% 10% at 50% 0%,
117
+ #000 60%,
118
+ transparent 300%
119
+ );
121
120
  pointer-events: none;
122
121
  user-select: none;
123
122
  }
@@ -132,7 +131,11 @@
132
131
  .placeholder-image {
133
132
  width: 100%;
134
133
  height: 100%;
135
- background: linear-gradient(135deg, var(--ui-bg-muted) 0%, var(--ui-surface-subtle) 100%);
134
+ background: linear-gradient(
135
+ 135deg,
136
+ var(--ui-bg-muted) 0%,
137
+ var(--ui-surface-subtle) 100%
138
+ );
136
139
  display: flex;
137
140
  align-items: center;
138
141
  justify-content: center;
@@ -779,4 +782,4 @@
779
782
  .w-screen {
780
783
  width: 100vw;
781
784
  }
782
- }
785
+ }
package/src/css/loading.css CHANGED
@@ -32,49 +32,97 @@
32
32
 
33
33
  @keyframes polygon-loader-1 {
34
34
  0% {
35
- clip-path: polygon(50% 50%, 0 0, 50% 0%, 50% 0%, 50% 0%, 50% 0%, 50% 0%)
35
+ clip-path: polygon(50% 50%, 0 0, 50% 0%, 50% 0%, 50% 0%, 50% 0%, 50% 0%);
36
36
  }
37
37
 
38
38
  12.5% {
39
- clip-path: polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%)
39
+ clip-path: polygon(
40
+ 50% 50%,
41
+ 0 0,
42
+ 50% 0%,
43
+ 100% 0%,
44
+ 100% 0%,
45
+ 100% 0%,
46
+ 100% 0%
47
+ );
40
48
  }
41
49
 
42
50
  25% {
43
- clip-path: polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 100%, 100% 100%, 100% 100%)
51
+ clip-path: polygon(
52
+ 50% 50%,
53
+ 0 0,
54
+ 50% 0%,
55
+ 100% 0%,
56
+ 100% 100%,
57
+ 100% 100%,
58
+ 100% 100%
59
+ );
44
60
  }
45
61
 
46
62
  50% {
47
- clip-path: polygon(50% 50%, 0 0, 50% 0%, 100% 0%, 100% 100%, 50% 100%, 0% 100%)
63
+ clip-path: polygon(
64
+ 50% 50%,
65
+ 0 0,
66
+ 50% 0%,
67
+ 100% 0%,
68
+ 100% 100%,
69
+ 50% 100%,
70
+ 0% 100%
71
+ );
48
72
  }
49
73
 
50
74
  62.5% {
51
- clip-path: polygon(50% 50%, 100% 0, 100% 0%, 100% 0%, 100% 100%, 50% 100%, 0% 100%)
75
+ clip-path: polygon(
76
+ 50% 50%,
77
+ 100% 0,
78
+ 100% 0%,
79
+ 100% 0%,
80
+ 100% 100%,
81
+ 50% 100%,
82
+ 0% 100%
83
+ );
52
84
  }
53
85
 
54
86
  75% {
55
- clip-path: polygon(50% 50%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 50% 100%, 0% 100%)
87
+ clip-path: polygon(
88
+ 50% 50%,
89
+ 100% 100%,
90
+ 100% 100%,
91
+ 100% 100%,
92
+ 100% 100%,
93
+ 50% 100%,
94
+ 0% 100%
95
+ );
56
96
  }
57
97
 
58
98
  100% {
59
- clip-path: polygon(50% 50%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 50% 100%, 0% 100%)
99
+ clip-path: polygon(
100
+ 50% 50%,
101
+ 50% 100%,
102
+ 50% 100%,
103
+ 50% 100%,
104
+ 50% 100%,
105
+ 50% 100%,
106
+ 0% 100%
107
+ );
60
108
  }
61
109
  }
62
110
 
63
111
  @keyframes polygon-loader-2 {
64
112
  0% {
65
- transform: scaleY(1) rotate(0deg)
113
+ transform: scaleY(1) rotate(0deg);
66
114
  }
67
115
 
68
116
  49.99% {
69
- transform: scaleY(1) rotate(135deg)
117
+ transform: scaleY(1) rotate(135deg);
70
118
  }
71
119
 
72
120
  50% {
73
- transform: scaleY(-1) rotate(0deg)
121
+ transform: scaleY(-1) rotate(0deg);
74
122
  }
75
123
 
76
124
  100% {
77
- transform: scaleY(-1) rotate(-135deg)
125
+ transform: scaleY(-1) rotate(-135deg);
78
126
  }
79
127
  }
80
128
 
@@ -99,4 +147,4 @@
99
147
  mask: var(--loader-mask);
100
148
  animation: 1s linear infinite animate-spin;
101
149
  }
102
- }
150
+ }