@cupcodev/ui 7.0.0 → 8.0.1

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 (13) hide show
  1. package/README.md +239 -239
  2. package/dist/index.cjs +3592 -2823
  3. package/dist/index.d.cts +61 -4
  4. package/dist/index.d.ts +61 -4
  5. package/dist/index.js +3556 -2789
  6. package/dist/styles.css +3 -3
  7. package/package.json +189 -187
  8. package/postinstall.cjs +20 -20
  9. package/styles/base.css +140 -138
  10. package/styles/dock.css +868 -813
  11. package/styles/global.css +2073 -2071
  12. package/styles/tokens.css +415 -415
  13. package/tailwind-preset.cjs +196 -196
package/styles/base.css CHANGED
@@ -1,146 +1,148 @@
1
- @import url("https://fonts.googleapis.com/css2?family=Tomorrow:wght@100;200;300;400;500;600;700;800;900&display=swap");
2
- @import "./tokens.css";
3
-
4
- /* Base leve: tokens + tipografia + fundo/foreground sem dependencias de @tailwind/@apply. */
1
+ @import url("https://fonts.googleapis.com/css2?family=Tomorrow:wght@100;200;300;400;500;600;700;800;900&display=swap");
2
+ @import "./tokens.css";
3
+
4
+ /* Base leve: tokens + tipografia + fundo/foreground sem dependencias de @tailwind/@apply. */
5
5
  body {
6
6
  margin: 0;
7
7
  background: hsl(var(--background));
8
8
  color: hsl(var(--foreground));
9
9
  font-family: var(--font-ui);
10
+ overflow-x: clip;
10
11
  }
11
12
 
12
13
  html {
13
- scrollbar-gutter: stable both-edges;
14
- }
15
-
16
- * {
17
- scrollbar-width: thin;
18
- scrollbar-color: var(--cc-scrollbar-thumb) var(--cc-scrollbar-track);
19
- }
20
-
21
- *::-webkit-scrollbar {
22
- width: var(--cc-scrollbar-size);
23
- height: var(--cc-scrollbar-size);
24
- }
25
-
26
- *::-webkit-scrollbar-track {
27
- border-radius: var(--cc-scrollbar-radius);
28
- background: var(--cc-scrollbar-track);
29
- border: 1px solid var(--cc-scrollbar-thumb-border);
30
- backdrop-filter: blur(14px);
31
- -webkit-backdrop-filter: blur(14px);
32
- }
33
-
34
- *::-webkit-scrollbar-thumb {
35
- border-radius: var(--cc-scrollbar-radius);
36
- border: 1px solid var(--cc-scrollbar-thumb-border);
37
- background: linear-gradient(180deg, var(--cc-scrollbar-thumb-highlight), var(--cc-scrollbar-thumb));
38
- box-shadow: 0 10px 24px -14px var(--cc-scrollbar-glow);
39
- backdrop-filter: blur(20px);
40
- -webkit-backdrop-filter: blur(20px);
41
- }
42
-
43
- *::-webkit-scrollbar-thumb:hover {
44
- background: linear-gradient(180deg, var(--cc-scrollbar-thumb-highlight), var(--cc-scrollbar-thumb-hover));
45
- box-shadow: 0 12px 28px -14px var(--cc-scrollbar-glow);
46
- }
47
-
48
- *::-webkit-scrollbar-corner {
49
- background: transparent;
50
- }
51
-
52
- .cc-scrollbar {
53
- scrollbar-width: thin;
54
- scrollbar-color: var(--cc-scrollbar-thumb) var(--cc-scrollbar-track);
55
- }
56
-
57
- .cc-scrollbar-purple {
58
- --cc-scrollbar-track: rgba(124, 91, 187, 0.08);
59
- --cc-scrollbar-thumb: rgba(124, 91, 187, 0.26);
60
- --cc-scrollbar-thumb-highlight: rgba(255, 255, 255, 0.35);
61
- --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
62
- --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.34);
63
- --cc-scrollbar-glow: rgba(124, 91, 187, 0.35);
64
- }
65
-
66
- .dark .cc-scrollbar-purple {
67
- --cc-scrollbar-track: rgba(124, 91, 187, 0.16);
68
- --cc-scrollbar-thumb: rgba(124, 91, 187, 0.42);
69
- --cc-scrollbar-thumb-highlight: rgba(151, 90, 182, 0.24);
70
- --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
71
- --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.2);
72
- --cc-scrollbar-glow: rgba(124, 91, 187, 0.5);
73
- }
74
-
75
- .cc-scrollbar-pink {
76
- --cc-scrollbar-track: rgba(237, 30, 121, 0.08);
77
- --cc-scrollbar-thumb: rgba(237, 30, 121, 0.26);
78
- --cc-scrollbar-thumb-highlight: rgba(255, 255, 255, 0.35);
79
- --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
80
- --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.34);
81
- --cc-scrollbar-glow: rgba(237, 30, 121, 0.36);
82
- }
83
-
84
- .dark .cc-scrollbar-pink {
85
- --cc-scrollbar-track: rgba(237, 30, 121, 0.18);
86
- --cc-scrollbar-thumb: rgba(237, 30, 121, 0.45);
87
- --cc-scrollbar-thumb-highlight: rgba(124, 91, 187, 0.3);
88
- --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
89
- --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.22);
90
- --cc-scrollbar-glow: rgba(237, 30, 121, 0.58);
91
- }
92
-
93
- .cc-scrollbar-theme-light {
94
- --cc-scrollbar-track: rgba(124, 91, 187, 0.08);
95
- --cc-scrollbar-thumb: rgba(124, 91, 187, 0.26);
96
- --cc-scrollbar-thumb-highlight: rgba(255, 255, 255, 0.35);
97
- --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
98
- --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.34);
99
- --cc-scrollbar-glow: rgba(124, 91, 187, 0.35);
100
- }
101
-
102
- .cc-scrollbar-theme-dark {
103
- --cc-scrollbar-track: rgba(124, 91, 187, 0.16);
104
- --cc-scrollbar-thumb: rgba(124, 91, 187, 0.42);
105
- --cc-scrollbar-thumb-highlight: rgba(151, 90, 182, 0.24);
106
- --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
107
- --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.2);
108
- --cc-scrollbar-glow: rgba(124, 91, 187, 0.5);
109
- }
110
-
111
- .cc-scrollbar-pink.cc-scrollbar-theme-light {
112
- --cc-scrollbar-track: rgba(237, 30, 121, 0.08);
113
- --cc-scrollbar-thumb: rgba(237, 30, 121, 0.26);
114
- --cc-scrollbar-thumb-highlight: rgba(255, 255, 255, 0.35);
115
- --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
116
- --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.34);
117
- --cc-scrollbar-glow: rgba(237, 30, 121, 0.36);
118
- }
119
-
120
- .cc-scrollbar-pink.cc-scrollbar-theme-dark {
121
- --cc-scrollbar-track: rgba(237, 30, 121, 0.18);
122
- --cc-scrollbar-thumb: rgba(237, 30, 121, 0.45);
123
- --cc-scrollbar-thumb-highlight: rgba(124, 91, 187, 0.3);
124
- --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
125
- --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.22);
126
- --cc-scrollbar-glow: rgba(237, 30, 121, 0.58);
127
- }
128
-
129
- .cc-scrollbar-hide {
130
- scrollbar-width: none;
131
- -ms-overflow-style: none;
132
- }
133
-
134
- .cc-scrollbar-hide::-webkit-scrollbar {
135
- display: none;
136
- }
137
-
138
- h1,
139
- h2,
140
- h3,
141
- h4,
142
- h5,
143
- h6 {
144
- font-family: var(--font-display);
145
- font-weight: 700;
146
- }
14
+ scrollbar-gutter: stable;
15
+ overflow-x: clip;
16
+ }
17
+
18
+ * {
19
+ scrollbar-width: thin;
20
+ scrollbar-color: var(--cc-scrollbar-thumb) var(--cc-scrollbar-track);
21
+ }
22
+
23
+ *::-webkit-scrollbar {
24
+ width: var(--cc-scrollbar-size);
25
+ height: var(--cc-scrollbar-size);
26
+ }
27
+
28
+ *::-webkit-scrollbar-track {
29
+ border-radius: var(--cc-scrollbar-radius);
30
+ background: var(--cc-scrollbar-track);
31
+ border: 1px solid var(--cc-scrollbar-thumb-border);
32
+ backdrop-filter: blur(14px);
33
+ -webkit-backdrop-filter: blur(14px);
34
+ }
35
+
36
+ *::-webkit-scrollbar-thumb {
37
+ border-radius: var(--cc-scrollbar-radius);
38
+ border: 1px solid var(--cc-scrollbar-thumb-border);
39
+ background: linear-gradient(180deg, var(--cc-scrollbar-thumb-highlight), var(--cc-scrollbar-thumb));
40
+ box-shadow: 0 10px 24px -14px var(--cc-scrollbar-glow);
41
+ backdrop-filter: blur(20px);
42
+ -webkit-backdrop-filter: blur(20px);
43
+ }
44
+
45
+ *::-webkit-scrollbar-thumb:hover {
46
+ background: linear-gradient(180deg, var(--cc-scrollbar-thumb-highlight), var(--cc-scrollbar-thumb-hover));
47
+ box-shadow: 0 12px 28px -14px var(--cc-scrollbar-glow);
48
+ }
49
+
50
+ *::-webkit-scrollbar-corner {
51
+ background: transparent;
52
+ }
53
+
54
+ .cc-scrollbar {
55
+ scrollbar-width: thin;
56
+ scrollbar-color: var(--cc-scrollbar-thumb) var(--cc-scrollbar-track);
57
+ }
58
+
59
+ .cc-scrollbar-purple {
60
+ --cc-scrollbar-track: rgba(124, 91, 187, 0.08);
61
+ --cc-scrollbar-thumb: rgba(124, 91, 187, 0.26);
62
+ --cc-scrollbar-thumb-highlight: rgba(255, 255, 255, 0.35);
63
+ --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
64
+ --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.34);
65
+ --cc-scrollbar-glow: rgba(124, 91, 187, 0.35);
66
+ }
67
+
68
+ .dark .cc-scrollbar-purple {
69
+ --cc-scrollbar-track: rgba(124, 91, 187, 0.16);
70
+ --cc-scrollbar-thumb: rgba(124, 91, 187, 0.42);
71
+ --cc-scrollbar-thumb-highlight: rgba(151, 90, 182, 0.24);
72
+ --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
73
+ --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.2);
74
+ --cc-scrollbar-glow: rgba(124, 91, 187, 0.5);
75
+ }
76
+
77
+ .cc-scrollbar-pink {
78
+ --cc-scrollbar-track: rgba(237, 30, 121, 0.08);
79
+ --cc-scrollbar-thumb: rgba(237, 30, 121, 0.26);
80
+ --cc-scrollbar-thumb-highlight: rgba(255, 255, 255, 0.35);
81
+ --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
82
+ --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.34);
83
+ --cc-scrollbar-glow: rgba(237, 30, 121, 0.36);
84
+ }
85
+
86
+ .dark .cc-scrollbar-pink {
87
+ --cc-scrollbar-track: rgba(237, 30, 121, 0.18);
88
+ --cc-scrollbar-thumb: rgba(237, 30, 121, 0.45);
89
+ --cc-scrollbar-thumb-highlight: rgba(124, 91, 187, 0.3);
90
+ --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
91
+ --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.22);
92
+ --cc-scrollbar-glow: rgba(237, 30, 121, 0.58);
93
+ }
94
+
95
+ .cc-scrollbar-theme-light {
96
+ --cc-scrollbar-track: rgba(124, 91, 187, 0.08);
97
+ --cc-scrollbar-thumb: rgba(124, 91, 187, 0.26);
98
+ --cc-scrollbar-thumb-highlight: rgba(255, 255, 255, 0.35);
99
+ --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
100
+ --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.34);
101
+ --cc-scrollbar-glow: rgba(124, 91, 187, 0.35);
102
+ }
103
+
104
+ .cc-scrollbar-theme-dark {
105
+ --cc-scrollbar-track: rgba(124, 91, 187, 0.16);
106
+ --cc-scrollbar-thumb: rgba(124, 91, 187, 0.42);
107
+ --cc-scrollbar-thumb-highlight: rgba(151, 90, 182, 0.24);
108
+ --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
109
+ --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.2);
110
+ --cc-scrollbar-glow: rgba(124, 91, 187, 0.5);
111
+ }
112
+
113
+ .cc-scrollbar-pink.cc-scrollbar-theme-light {
114
+ --cc-scrollbar-track: rgba(237, 30, 121, 0.08);
115
+ --cc-scrollbar-thumb: rgba(237, 30, 121, 0.26);
116
+ --cc-scrollbar-thumb-highlight: rgba(255, 255, 255, 0.35);
117
+ --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
118
+ --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.34);
119
+ --cc-scrollbar-glow: rgba(237, 30, 121, 0.36);
120
+ }
121
+
122
+ .cc-scrollbar-pink.cc-scrollbar-theme-dark {
123
+ --cc-scrollbar-track: rgba(237, 30, 121, 0.18);
124
+ --cc-scrollbar-thumb: rgba(237, 30, 121, 0.45);
125
+ --cc-scrollbar-thumb-highlight: rgba(124, 91, 187, 0.3);
126
+ --cc-scrollbar-thumb-hover: var(--cc-hover-overlay);
127
+ --cc-scrollbar-thumb-border: rgba(255, 255, 255, 0.22);
128
+ --cc-scrollbar-glow: rgba(237, 30, 121, 0.58);
129
+ }
130
+
131
+ .cc-scrollbar-hide {
132
+ scrollbar-width: none;
133
+ -ms-overflow-style: none;
134
+ }
135
+
136
+ .cc-scrollbar-hide::-webkit-scrollbar {
137
+ display: none;
138
+ }
139
+
140
+ h1,
141
+ h2,
142
+ h3,
143
+ h4,
144
+ h5,
145
+ h6 {
146
+ font-family: var(--font-display);
147
+ font-weight: 700;
148
+ }