@brosco/ui 0.0.53 → 0.0.55

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.
package/dist/index.css CHANGED
@@ -1,324 +1,2 @@
1
1
  /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
2
- @layer properties {
3
- @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or
4
- ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
5
- *,
6
- :before,
7
- :after,
8
- ::backdrop {
9
- --tw-font-weight: initial;
10
- --tw-scale-x: 1;
11
- --tw-scale-y: 1;
12
- --tw-scale-z: 1;
13
- --tw-border-style: solid;
14
- --tw-shadow: 0 0 #0000;
15
- --tw-shadow-color: initial;
16
- --tw-shadow-alpha: 100%;
17
- --tw-inset-shadow: 0 0 #0000;
18
- --tw-inset-shadow-color: initial;
19
- --tw-inset-shadow-alpha: 100%;
20
- --tw-ring-color: initial;
21
- --tw-ring-shadow: 0 0 #0000;
22
- --tw-inset-ring-color: initial;
23
- --tw-inset-ring-shadow: 0 0 #0000;
24
- --tw-ring-inset: initial;
25
- --tw-ring-offset-width: 0px;
26
- --tw-ring-offset-color: #fff;
27
- --tw-ring-offset-shadow: 0 0 #0000;
28
- }
29
- }
30
- }
31
- @layer theme {
32
- :root {
33
- --eclipse: var(--color-zinc-900);
34
- --background: var(--color-white);
35
- --foreground: var(--eclipse);
36
- --muted: var(--color-zinc-500);
37
- --primary: var(--color-blue-500);
38
- --secondary: var(--eclipse);
39
- --success: var(--color-green-600);
40
- --danger: var(--color-red-500);
41
- }
42
- }
43
- @layer components {
44
- .button {
45
- --color: transparent;
46
- --bg: transparent;
47
- --bg-hover: var(--bg);
48
- --bg-active: var(--bg-hover);
49
- --fg: currentColor;
50
- }
51
- .button--primary {
52
- --color: var(--primary);
53
- }
54
- .button--secondary {
55
- --color: var(--secondary);
56
- }
57
- .button--success {
58
- --color: var(--success);
59
- }
60
- .button--danger {
61
- --color: var(--danger);
62
- }
63
- .button--solid {
64
- --bg: var(--color);
65
- --bg-hover: var(--bg);
66
- }
67
- @supports (color: color-mix(in lab, red, red)) {
68
- .button--solid {
69
- --bg-hover: color-mix(in oklab, var(--bg) 90%, var(--eclipse) 10%);
70
- }
71
- }
72
- .button--solid {
73
- --bg-active: var(--bg);
74
- }
75
- @supports (color: color-mix(in lab, red, red)) {
76
- .button--solid {
77
- --bg-active: color-mix(in oklab, var(--bg) 80%, var(--eclipse) 20%);
78
- }
79
- }
80
- .button--solid {
81
- --fg: var(--color-white);
82
- }
83
- .button--solid.button--secondary {
84
- --bg: var(--color);
85
- }
86
- @supports (color: color-mix(in lab, red, red)) {
87
- .button--solid.button--secondary {
88
- --bg: color-mix(in oklab, var(--color) 5%, transparent);
89
- }
90
- }
91
- .button--solid.button--secondary {
92
- --bg-hover: var(--bg);
93
- }
94
- @supports (color: color-mix(in lab, red, red)) {
95
- .button--solid.button--secondary {
96
- --bg-hover: color-mix(in oklab, var(--bg) 95%, var(--eclipse) 5%);
97
- }
98
- }
99
- .button--solid.button--secondary {
100
- --bg-active: var(--bg);
101
- }
102
- @supports (color: color-mix(in lab, red, red)) {
103
- .button--solid.button--secondary {
104
- --bg-active: color-mix(in oklab, var(--bg) 90%, var(--eclipse) 10%);
105
- }
106
- }
107
- .button--solid.button--secondary {
108
- --fg: var(--color);
109
- }
110
- .button--bordered,
111
- .button--light {
112
- --fg: var(--color);
113
- --bg-hover: var(--fg);
114
- }
115
- @supports (color: color-mix(in lab, red, red)) {
116
- .button--bordered,
117
- .button--light {
118
- --bg-hover: color-mix(in oklab, var(--fg) 5%, transparent);
119
- }
120
- }
121
- .button {
122
- justify-content: center;
123
- align-items: center;
124
- gap: calc(var(--spacing, 0.25rem) * 2);
125
- --tw-font-weight: var(--font-weight-medium, 500);
126
- font-weight: var(--font-weight-medium, 500);
127
- white-space: nowrap;
128
- color: var(--fg);
129
- transition-property:
130
- color,
131
- background-color,
132
- border-color,
133
- outline-color,
134
- text-decoration-color,
135
- fill,
136
- stroke,
137
- --tw-gradient-from,
138
- --tw-gradient-via,
139
- --tw-gradient-to,
140
- opacity,
141
- box-shadow,
142
- transform,
143
- translate,
144
- scale,
145
- rotate,
146
- filter,
147
- -webkit-backdrop-filter,
148
- backdrop-filter,
149
- display,
150
- content-visibility,
151
- overlay,
152
- pointer-events;
153
- transition-timing-function: var(
154
- --tw-ease,
155
- var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1))
156
- );
157
- transition-duration: var(
158
- --tw-duration,
159
- var(--default-transition-duration, 0.15s)
160
- );
161
- -webkit-user-select: none;
162
- user-select: none;
163
- display: inline-flex;
164
- }
165
- .button:focus-visible {
166
- --tw-outline-style: none;
167
- outline-style: none;
168
- }
169
- .button:enabled {
170
- cursor: pointer;
171
- }
172
- .button:disabled {
173
- pointer-events: none;
174
- opacity: 0.5;
175
- }
176
- .button:hover {
177
- background-color: var(--bg-hover);
178
- }
179
- .button:active {
180
- --tw-scale-x: 95%;
181
- --tw-scale-y: 95%;
182
- --tw-scale-z: 95%;
183
- scale: var(--tw-scale-x) var(--tw-scale-y);
184
- background-color: var(--bg-active);
185
- }
186
- .button[data-pending="true"] {
187
- pointer-events: none;
188
- }
189
- .button--solid {
190
- background-color: var(--bg);
191
- }
192
- .button--bordered {
193
- border-style: var(--tw-border-style);
194
- border-width: 2px;
195
- border-color: var(--fg);
196
- }
197
- .button--bordered:focus-visible:not([data-pending]) {
198
- --tw-ring-color: currentcolor;
199
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0
200
- calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
201
- box-shadow:
202
- var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
203
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
204
- --tw-ring-offset-width: 2px;
205
- --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0
206
- var(--tw-ring-offset-width) var(--tw-ring-offset-color);
207
- }
208
- .button--light {
209
- text-underline-offset: 6px;
210
- text-decoration-line: underline;
211
- position: relative;
212
- }
213
- @media (hover: hover) {
214
- .button--light:hover {
215
- text-decoration-line: none;
216
- }
217
- }
218
- .button--light:focus-visible:not([data-pending]):after {
219
- top: calc(var(--spacing, 0.25rem) * 2);
220
- right: calc(var(--spacing, 0.25rem) * 3);
221
- left: calc(var(--spacing, 0.25rem) * 3);
222
- height: calc(var(--spacing, 0.25rem) * 0.5);
223
- content: "";
224
- background-color: currentColor;
225
- position: absolute;
226
- }
227
- .spinner {
228
- animation: var(--animate-spin, spin 1s linear infinite);
229
- }
230
- }
231
- @property --tw-font-weight {
232
- syntax: "*";
233
- inherits: false;
234
- }
235
- @property --tw-scale-x {
236
- syntax: "*";
237
- inherits: false;
238
- initial-value: 1;
239
- }
240
- @property --tw-scale-y {
241
- syntax: "*";
242
- inherits: false;
243
- initial-value: 1;
244
- }
245
- @property --tw-scale-z {
246
- syntax: "*";
247
- inherits: false;
248
- initial-value: 1;
249
- }
250
- @property --tw-border-style {
251
- syntax: "*";
252
- inherits: false;
253
- initial-value: solid;
254
- }
255
- @property --tw-shadow {
256
- syntax: "*";
257
- inherits: false;
258
- initial-value: 0 0 #0000;
259
- }
260
- @property --tw-shadow-color {
261
- syntax: "*";
262
- inherits: false;
263
- }
264
- @property --tw-shadow-alpha {
265
- syntax: "<percentage>";
266
- inherits: false;
267
- initial-value: 100%;
268
- }
269
- @property --tw-inset-shadow {
270
- syntax: "*";
271
- inherits: false;
272
- initial-value: 0 0 #0000;
273
- }
274
- @property --tw-inset-shadow-color {
275
- syntax: "*";
276
- inherits: false;
277
- }
278
- @property --tw-inset-shadow-alpha {
279
- syntax: "<percentage>";
280
- inherits: false;
281
- initial-value: 100%;
282
- }
283
- @property --tw-ring-color {
284
- syntax: "*";
285
- inherits: false;
286
- }
287
- @property --tw-ring-shadow {
288
- syntax: "*";
289
- inherits: false;
290
- initial-value: 0 0 #0000;
291
- }
292
- @property --tw-inset-ring-color {
293
- syntax: "*";
294
- inherits: false;
295
- }
296
- @property --tw-inset-ring-shadow {
297
- syntax: "*";
298
- inherits: false;
299
- initial-value: 0 0 #0000;
300
- }
301
- @property --tw-ring-inset {
302
- syntax: "*";
303
- inherits: false;
304
- }
305
- @property --tw-ring-offset-width {
306
- syntax: "<length>";
307
- inherits: false;
308
- initial-value: 0;
309
- }
310
- @property --tw-ring-offset-color {
311
- syntax: "*";
312
- inherits: false;
313
- initial-value: #fff;
314
- }
315
- @property --tw-ring-offset-shadow {
316
- syntax: "*";
317
- inherits: false;
318
- initial-value: 0 0 #0000;
319
- }
320
- @keyframes spin {
321
- to {
322
- transform: rotate(360deg);
323
- }
324
- }
2
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight:initial}}}@layer theme{:root{--eclipse:var(--color-zinc-900);--background:var(--color-white);--foreground:var(--eclipse);--muted:var(--color-zinc-500);--primary:var(--color-blue-500);--secondary:var(--eclipse);--success:var(--color-green-600);--danger:var(--color-red-500)}}@layer components{.button{--tw-font-weight:var(--font-weight-medium,500);font-weight:var(--font-weight-medium,500)}}@property --tw-font-weight{syntax:"*";inherits:false}
package/dist/index.d.ts CHANGED
@@ -1,3 +1,2 @@
1
1
  import "./_css/styles.css";
2
2
  export * from "./button";
3
- export * from "./spinner";
package/dist/index.js CHANGED
@@ -86,4 +86,4 @@ var a = ({ className: e, size: r = 24 }) => /* @__PURE__ */ n("svg", {
86
86
  });
87
87
  };
88
88
  //#endregion
89
- export { s as Button, a as Spinner };
89
+ export { s as Button };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brosco/ui",
3
- "version": "0.0.53",
3
+ "version": "0.0.55",
4
4
  "type": "module",
5
5
  "files": [
6
6
  "dist"