@tinybigui/react 0.1.1 → 0.3.0

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 (11) hide show
  1. package/dist/index.cjs +3210 -17
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +53 -0
  4. package/dist/index.css.map +1 -0
  5. package/dist/index.d.cts +3096 -11
  6. package/dist/index.d.ts +3096 -11
  7. package/dist/index.js +3170 -21
  8. package/dist/index.js.map +1 -1
  9. package/dist/styles.css +87 -2
  10. package/dist/styles.css.map +1 -1
  11. package/package.json +3 -2
package/dist/styles.css CHANGED
@@ -31,6 +31,10 @@
31
31
  --md-sys-color-outline-variant: #cac4d0;
32
32
  --md-sys-color-background: #fffbfe;
33
33
  --md-sys-color-on-background: #1c1b1f;
34
+ --md-sys-color-scrim: #000000;
35
+ --md-sys-color-inverse-surface: #313033;
36
+ --md-sys-color-inverse-on-surface: #f4eff4;
37
+ --md-sys-color-inverse-primary: #d0bcff;
34
38
  --md-sys-typescale-font-family-plain:
35
39
  system-ui,
36
40
  -apple-system,
@@ -126,6 +130,8 @@
126
130
  --md-sys-motion-duration-long3: 550ms;
127
131
  --md-sys-motion-duration-long4: 600ms;
128
132
  --md-sys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
133
+ --md-sys-motion-easing-standard-decelerate: cubic-bezier(0, 0, 0, 1);
134
+ --md-sys-motion-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
129
135
  --md-sys-motion-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
130
136
  --md-sys-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
131
137
  --md-sys-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
@@ -160,6 +166,10 @@
160
166
  --md-sys-color-outline-variant: #49454f;
161
167
  --md-sys-color-background: #1c1b1f;
162
168
  --md-sys-color-on-background: #e6e1e5;
169
+ --md-sys-color-scrim: #000000;
170
+ --md-sys-color-inverse-surface: #e6e1e5;
171
+ --md-sys-color-inverse-on-surface: #313033;
172
+ --md-sys-color-inverse-primary: #6750a4;
163
173
  }
164
174
  @media (prefers-color-scheme: dark) {
165
175
  :root:not(.light) {
@@ -192,6 +202,10 @@
192
202
  --md-sys-color-outline-variant: #49454f;
193
203
  --md-sys-color-background: #1c1b1f;
194
204
  --md-sys-color-on-background: #e6e1e5;
205
+ --md-sys-color-scrim: #000000;
206
+ --md-sys-color-inverse-surface: #e6e1e5;
207
+ --md-sys-color-inverse-on-surface: #313033;
208
+ --md-sys-color-inverse-primary: #6750a4;
195
209
  }
196
210
  }
197
211
  body {
@@ -200,14 +214,85 @@ body {
200
214
  margin: 0;
201
215
  font-family: var(--md-sys-typescale-font-family-plain);
202
216
  }
203
- @theme { --color-primary: var(--md-sys-color-primary); --color-on-primary: var(--md-sys-color-on-primary); --color-primary-container: var(--md-sys-color-primary-container); --color-on-primary-container: var(--md-sys-color-on-primary-container); --color-secondary: var(--md-sys-color-secondary); --color-on-secondary: var(--md-sys-color-on-secondary); --color-secondary-container: var(--md-sys-color-secondary-container); --color-on-secondary-container: var(--md-sys-color-on-secondary-container); --color-tertiary: var(--md-sys-color-tertiary); --color-on-tertiary: var(--md-sys-color-on-tertiary); --color-tertiary-container: var(--md-sys-color-tertiary-container); --color-on-tertiary-container: var(--md-sys-color-on-tertiary-container); --color-error: var(--md-sys-color-error); --color-on-error: var(--md-sys-color-on-error); --color-error-container: var(--md-sys-color-error-container); --color-on-error-container: var(--md-sys-color-on-error-container); --color-surface: var(--md-sys-color-surface); --color-on-surface: var(--md-sys-color-on-surface); --color-surface-variant: var(--md-sys-color-surface-variant); --color-on-surface-variant: var(--md-sys-color-on-surface-variant); --color-surface-container-lowest: var(--md-sys-color-surface-container-lowest); --color-surface-container-low: var(--md-sys-color-surface-container-low); --color-surface-container: var(--md-sys-color-surface-container); --color-surface-container-high: var(--md-sys-color-surface-container-high); --color-surface-container-highest: var(--md-sys-color-surface-container-highest); --color-outline: var(--md-sys-color-outline); --color-outline-variant: var(--md-sys-color-outline-variant); --color-background: var(--md-sys-color-background); --color-on-background: var(--md-sys-color-on-background); --shadow-elevation-0: var(--md-sys-elevation-level-0); --shadow-elevation-1: var(--md-sys-elevation-level-1); --shadow-elevation-2: var(--md-sys-elevation-level-2); --shadow-elevation-3: var(--md-sys-elevation-level-3); --shadow-elevation-4: var(--md-sys-elevation-level-4); --shadow-elevation-5: var(--md-sys-elevation-level-5); }
217
+ @theme { --color-primary: var(--md-sys-color-primary); --color-on-primary: var(--md-sys-color-on-primary); --color-primary-container: var(--md-sys-color-primary-container); --color-on-primary-container: var(--md-sys-color-on-primary-container); --color-secondary: var(--md-sys-color-secondary); --color-on-secondary: var(--md-sys-color-on-secondary); --color-secondary-container: var(--md-sys-color-secondary-container); --color-on-secondary-container: var(--md-sys-color-on-secondary-container); --color-tertiary: var(--md-sys-color-tertiary); --color-on-tertiary: var(--md-sys-color-on-tertiary); --color-tertiary-container: var(--md-sys-color-tertiary-container); --color-on-tertiary-container: var(--md-sys-color-on-tertiary-container); --color-error: var(--md-sys-color-error); --color-on-error: var(--md-sys-color-on-error); --color-error-container: var(--md-sys-color-error-container); --color-on-error-container: var(--md-sys-color-on-error-container); --color-surface: var(--md-sys-color-surface); --color-on-surface: var(--md-sys-color-on-surface); --color-surface-variant: var(--md-sys-color-surface-variant); --color-on-surface-variant: var(--md-sys-color-on-surface-variant); --color-surface-container-lowest: var(--md-sys-color-surface-container-lowest); --color-surface-container-low: var(--md-sys-color-surface-container-low); --color-surface-container: var(--md-sys-color-surface-container); --color-surface-container-high: var(--md-sys-color-surface-container-high); --color-surface-container-highest: var(--md-sys-color-surface-container-highest); --color-outline: var(--md-sys-color-outline); --color-outline-variant: var(--md-sys-color-outline-variant); --color-background: var(--md-sys-color-background); --color-on-background: var(--md-sys-color-on-background); --color-scrim: var(--md-sys-color-scrim); --color-inverse-surface: var(--md-sys-color-inverse-surface); --color-inverse-on-surface: var(--md-sys-color-inverse-on-surface); --color-inverse-primary: var(--md-sys-color-inverse-primary); --shadow-elevation-0: var(--md-sys-elevation-level-0); --shadow-elevation-1: var(--md-sys-elevation-level-1); --shadow-elevation-2: var(--md-sys-elevation-level-2); --shadow-elevation-3: var(--md-sys-elevation-level-3); --shadow-elevation-4: var(--md-sys-elevation-level-4); --shadow-elevation-5: var(--md-sys-elevation-level-5); }
204
218
  @keyframes ripple {
205
219
  to {
206
220
  transform: translate(-50%, -50%) scale(1);
207
221
  opacity: 0;
208
222
  }
209
223
  }
210
- @theme { --animate-ripple: ripple 450ms cubic-bezier(0.2, 0, 0, 1); --opacity-8: 0.08; --opacity-12: 0.12; --opacity-38: 0.38; }
224
+ @theme { --animate-ripple: ripple 450ms cubic-bezier(0.2, 0, 0, 1); --opacity-8: 0.08; --opacity-12: 0.12; --opacity-32: 0.32; --opacity-38: 0.38; --font-size-display-large: var(--md-sys-typescale-display-large-size); --line-height-display-large: var(--md-sys-typescale-display-large-line-height); --font-size-display-medium: var(--md-sys-typescale-display-medium-size); --line-height-display-medium: var(--md-sys-typescale-display-medium-line-height); --font-size-display-small: var(--md-sys-typescale-display-small-size); --line-height-display-small: var(--md-sys-typescale-display-small-line-height); --font-size-headline-large: var(--md-sys-typescale-headline-large-size); --line-height-headline-large: var(--md-sys-typescale-headline-large-line-height); --font-size-headline-medium: var(--md-sys-typescale-headline-medium-size); --line-height-headline-medium: var(--md-sys-typescale-headline-medium-line-height); --font-size-headline-small: var(--md-sys-typescale-headline-small-size); --line-height-headline-small: var(--md-sys-typescale-headline-small-line-height); --font-size-title-large: var(--md-sys-typescale-title-large-size); --line-height-title-large: var(--md-sys-typescale-title-large-line-height); --font-size-title-medium: var(--md-sys-typescale-title-medium-size); --line-height-title-medium: var(--md-sys-typescale-title-medium-line-height); --font-size-title-small: var(--md-sys-typescale-title-small-size); --line-height-title-small: var(--md-sys-typescale-title-small-line-height); --font-size-body-large: var(--md-sys-typescale-body-large-size); --line-height-body-large: var(--md-sys-typescale-body-large-line-height); --font-size-body-medium: var(--md-sys-typescale-body-medium-size); --line-height-body-medium: var(--md-sys-typescale-body-medium-line-height); --font-size-body-small: var(--md-sys-typescale-body-small-size); --line-height-body-small: var(--md-sys-typescale-body-small-line-height); --font-size-label-large: var(--md-sys-typescale-label-large-size); --line-height-label-large: var(--md-sys-typescale-label-large-line-height); --font-size-label-medium: var(--md-sys-typescale-label-medium-size); --line-height-label-medium: var(--md-sys-typescale-label-medium-line-height); --font-size-label-small: var(--md-sys-typescale-label-small-size); --line-height-label-small: var(--md-sys-typescale-label-small-line-height); --transition-duration-short1: var(--md-sys-motion-duration-short1); --transition-duration-short2: var(--md-sys-motion-duration-short2); --transition-duration-short3: var(--md-sys-motion-duration-short3); --transition-duration-short4: var(--md-sys-motion-duration-short4); --transition-duration-medium1: var(--md-sys-motion-duration-medium1); --transition-duration-medium2: var(--md-sys-motion-duration-medium2); --transition-duration-medium3: var(--md-sys-motion-duration-medium3); --transition-duration-medium4: var(--md-sys-motion-duration-medium4); --transition-duration-long1: var(--md-sys-motion-duration-long1); --transition-duration-long2: var(--md-sys-motion-duration-long2); --transition-duration-long3: var(--md-sys-motion-duration-long3); --transition-duration-long4: var(--md-sys-motion-duration-long4); --ease-standard: var(--md-sys-motion-easing-standard); --ease-standard-decelerate: var(--md-sys-motion-easing-standard-decelerate); --ease-standard-accelerate: var(--md-sys-motion-easing-standard-accelerate); --ease-emphasized: var(--md-sys-motion-easing-emphasized); --ease-emphasized-decelerate: var(--md-sys-motion-easing-emphasized-decelerate); --ease-emphasized-accelerate: var(--md-sys-motion-easing-emphasized-accelerate); --spacing-appbar-small: 4rem; --spacing-appbar-medium: 7rem; --spacing-appbar-large: 9.5rem; --spacing-drawer: 22.5rem; --spacing-snackbar-max: 35.5rem; --spacing-dialog-max: 35rem; --radius-xs: var(--md-sys-shape-corner-extra-small); --radius-sm: var(--md-sys-shape-corner-small); --radius-md: var(--md-sys-shape-corner-medium); --radius-lg: var(--md-sys-shape-corner-large); --radius-xl: var(--md-sys-shape-corner-extra-large); --radius-full: var(--md-sys-shape-corner-full); }
225
+
226
+ /* src/components/Progress/Progress.css */
227
+ @keyframes progress-linear-indeterminate-1 {
228
+ 0% {
229
+ left: -35%;
230
+ right: 100%;
231
+ }
232
+ 60% {
233
+ left: 100%;
234
+ right: -90%;
235
+ }
236
+ 100% {
237
+ left: 100%;
238
+ right: -90%;
239
+ }
240
+ }
241
+ @keyframes progress-linear-indeterminate-2 {
242
+ 0% {
243
+ left: -200%;
244
+ right: 100%;
245
+ }
246
+ 60% {
247
+ left: 107%;
248
+ right: -8%;
249
+ }
250
+ 100% {
251
+ left: 107%;
252
+ right: -8%;
253
+ }
254
+ }
255
+ @keyframes progress-circular-rotate {
256
+ 0% {
257
+ transform: rotate(0deg);
258
+ }
259
+ 100% {
260
+ transform: rotate(360deg);
261
+ }
262
+ }
263
+ @keyframes progress-circular-dash {
264
+ 0% {
265
+ stroke-dasharray: 1, 200;
266
+ stroke-dashoffset: 0;
267
+ }
268
+ 50% {
269
+ stroke-dasharray: 89, 200;
270
+ stroke-dashoffset: -35px;
271
+ }
272
+ 100% {
273
+ stroke-dasharray: 89, 200;
274
+ stroke-dashoffset: -124px;
275
+ }
276
+ }
277
+ @theme { --animate-progress-linear-indeterminate-1: progress-linear-indeterminate-1 var(--md-sys-motion-duration-long2) var(--md-sys-motion-easing-standard) infinite; --animate-progress-linear-indeterminate-2: progress-linear-indeterminate-2 var(--md-sys-motion-duration-long2) var(--md-sys-motion-easing-standard) infinite; --animate-progress-circular-rotate: progress-circular-rotate var(--md-sys-motion-duration-long4) linear infinite; --animate-progress-circular-dash: progress-circular-dash var(--md-sys-motion-duration-long4) var(--md-sys-motion-easing-standard) infinite; }
211
278
 
212
279
  /* src/styles.css */
280
+ @keyframes menu-enter {
281
+ from {
282
+ opacity: 0;
283
+ transform: scale(0.8);
284
+ }
285
+ to {
286
+ opacity: 1;
287
+ transform: scale(1);
288
+ }
289
+ }
290
+ @keyframes menu-exit {
291
+ from {
292
+ opacity: 1;
293
+ }
294
+ to {
295
+ opacity: 0;
296
+ }
297
+ }
213
298
  /*# sourceMappingURL=styles.css.map */
package/dist/styles.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../tokens/src/tokens.css"],"sourcesContent":["/**\n * @tinybigui/tokens\n * Material Design 3 Design Tokens\n * \n * This file contains CSS variables for MD3 design tokens.\n * These tokens will be generated from Material Color Utilities\n * and other MD3 specifications.\n */\n\n/* Import Tailwind CSS v4 */\n@import \"tailwindcss\";\n\n:root {\n /* ==========================================================================\n COLOR TOKENS\n Material Design 3 color system with light/dark mode support\n Complete set of 18 semantic color roles for light and dark themes\n ========================================================================== */\n\n /* Primary */\n --md-sys-color-primary: #6750a4;\n --md-sys-color-on-primary: #ffffff;\n --md-sys-color-primary-container: #eaddff;\n --md-sys-color-on-primary-container: #21005d;\n\n /* Secondary */\n --md-sys-color-secondary: #625b71;\n --md-sys-color-on-secondary: #ffffff;\n --md-sys-color-secondary-container: #e8def8;\n --md-sys-color-on-secondary-container: #1d192b;\n\n /* Tertiary */\n --md-sys-color-tertiary: #7d5260;\n --md-sys-color-on-tertiary: #ffffff;\n --md-sys-color-tertiary-container: #ffd8e4;\n --md-sys-color-on-tertiary-container: #31111d;\n\n /* Error */\n --md-sys-color-error: #b3261e;\n --md-sys-color-on-error: #ffffff;\n --md-sys-color-error-container: #f9dedc;\n --md-sys-color-on-error-container: #410e0b;\n\n /* Surface */\n --md-sys-color-surface: #fffbfe;\n --md-sys-color-on-surface: #1c1b1f;\n --md-sys-color-surface-variant: #e7e0ec;\n --md-sys-color-on-surface-variant: #49454f;\n\n /* Surface containers (MD3 elevation system) */\n --md-sys-color-surface-container-lowest: #ffffff;\n --md-sys-color-surface-container-low: #f7f2fa;\n --md-sys-color-surface-container: #f3edf7;\n --md-sys-color-surface-container-high: #ece6f0;\n --md-sys-color-surface-container-highest: #e6e0e9;\n\n /* Outline */\n --md-sys-color-outline: #79747e;\n --md-sys-color-outline-variant: #cac4d0;\n\n /* Background */\n --md-sys-color-background: #fffbfe;\n --md-sys-color-on-background: #1c1b1f;\n\n /* ==========================================================================\n TYPOGRAPHY TOKENS\n Material Design 3 Type Scale - 5 categories, 3 sizes each (15 total)\n ========================================================================== */\n\n /* Font families */\n --md-sys-typescale-font-family-plain:\n system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n --md-sys-typescale-font-family-brand: var(--md-sys-typescale-font-family-plain);\n\n /* Display - Large expressive text */\n --md-sys-typescale-display-large-size: 3.5625rem; /* 57px */\n --md-sys-typescale-display-large-line-height: 4rem; /* 64px */\n --md-sys-typescale-display-large-weight: 400;\n --md-sys-typescale-display-large-tracking: -0.25px;\n\n --md-sys-typescale-display-medium-size: 2.8125rem; /* 45px */\n --md-sys-typescale-display-medium-line-height: 3.25rem; /* 52px */\n --md-sys-typescale-display-medium-weight: 400;\n --md-sys-typescale-display-medium-tracking: 0;\n\n --md-sys-typescale-display-small-size: 2.25rem; /* 36px */\n --md-sys-typescale-display-small-line-height: 2.75rem; /* 44px */\n --md-sys-typescale-display-small-weight: 400;\n --md-sys-typescale-display-small-tracking: 0;\n\n /* Headline - High-emphasis text */\n --md-sys-typescale-headline-large-size: 2rem; /* 32px */\n --md-sys-typescale-headline-large-line-height: 2.5rem; /* 40px */\n --md-sys-typescale-headline-large-weight: 400;\n --md-sys-typescale-headline-large-tracking: 0;\n\n --md-sys-typescale-headline-medium-size: 1.75rem; /* 28px */\n --md-sys-typescale-headline-medium-line-height: 2.25rem; /* 36px */\n --md-sys-typescale-headline-medium-weight: 400;\n --md-sys-typescale-headline-medium-tracking: 0;\n\n --md-sys-typescale-headline-small-size: 1.5rem; /* 24px */\n --md-sys-typescale-headline-small-line-height: 2rem; /* 32px */\n --md-sys-typescale-headline-small-weight: 400;\n --md-sys-typescale-headline-small-tracking: 0;\n\n /* Title - Medium-emphasis text */\n --md-sys-typescale-title-large-size: 1.375rem; /* 22px */\n --md-sys-typescale-title-large-line-height: 1.75rem; /* 28px */\n --md-sys-typescale-title-large-weight: 400;\n --md-sys-typescale-title-large-tracking: 0;\n\n --md-sys-typescale-title-medium-size: 1rem; /* 16px */\n --md-sys-typescale-title-medium-line-height: 1.5rem; /* 24px */\n --md-sys-typescale-title-medium-weight: 500;\n --md-sys-typescale-title-medium-tracking: 0.15px;\n\n --md-sys-typescale-title-small-size: 0.875rem; /* 14px */\n --md-sys-typescale-title-small-line-height: 1.25rem; /* 20px */\n --md-sys-typescale-title-small-weight: 500;\n --md-sys-typescale-title-small-tracking: 0.1px;\n\n /* Body - Plain text */\n --md-sys-typescale-body-large-size: 1rem; /* 16px */\n --md-sys-typescale-body-large-line-height: 1.5rem; /* 24px */\n --md-sys-typescale-body-large-weight: 400;\n --md-sys-typescale-body-large-tracking: 0.5px;\n\n --md-sys-typescale-body-medium-size: 0.875rem; /* 14px */\n --md-sys-typescale-body-medium-line-height: 1.25rem; /* 20px */\n --md-sys-typescale-body-medium-weight: 400;\n --md-sys-typescale-body-medium-tracking: 0.25px;\n\n --md-sys-typescale-body-small-size: 0.75rem; /* 12px */\n --md-sys-typescale-body-small-line-height: 1rem; /* 16px */\n --md-sys-typescale-body-small-weight: 400;\n --md-sys-typescale-body-small-tracking: 0.4px;\n\n /* Label - UI labels, buttons */\n --md-sys-typescale-label-large-size: 0.875rem; /* 14px */\n --md-sys-typescale-label-large-line-height: 1.25rem; /* 20px */\n --md-sys-typescale-label-large-weight: 500;\n --md-sys-typescale-label-large-tracking: 0.1px;\n\n --md-sys-typescale-label-medium-size: 0.75rem; /* 12px */\n --md-sys-typescale-label-medium-line-height: 1rem; /* 16px */\n --md-sys-typescale-label-medium-weight: 500;\n --md-sys-typescale-label-medium-tracking: 0.5px;\n\n --md-sys-typescale-label-small-size: 0.6875rem; /* 11px */\n --md-sys-typescale-label-small-line-height: 1rem; /* 16px */\n --md-sys-typescale-label-small-weight: 500;\n --md-sys-typescale-label-small-tracking: 0.5px;\n\n /* ==========================================================================\n SHAPE TOKENS\n Material Design 3 corner radius system\n ========================================================================== */\n\n --md-sys-shape-corner-none: 0;\n --md-sys-shape-corner-extra-small: 0.25rem;\n --md-sys-shape-corner-small: 0.5rem;\n --md-sys-shape-corner-medium: 0.75rem;\n --md-sys-shape-corner-large: 1rem;\n --md-sys-shape-corner-extra-large: 1.75rem;\n --md-sys-shape-corner-full: 624.9375rem;\n\n /* ==========================================================================\n ELEVATION TOKENS\n Material Design 3 elevation system (box shadows)\n ========================================================================== */\n\n --md-sys-elevation-level-0: none;\n --md-sys-elevation-level-1: 0 1px 2px 0 rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);\n --md-sys-elevation-level-2: 0 1px 2px 0 rgba(0, 0, 0, 0.3), 0 2px 6px 2px rgba(0, 0, 0, 0.15);\n --md-sys-elevation-level-3: 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);\n --md-sys-elevation-level-4: 0 2px 3px 0 rgba(0, 0, 0, 0.3), 0 6px 10px 4px rgba(0, 0, 0, 0.15);\n --md-sys-elevation-level-5: 0 4px 4px 0 rgba(0, 0, 0, 0.3), 0 8px 12px 6px rgba(0, 0, 0, 0.15);\n\n /* ==========================================================================\n MOTION TOKENS\n Material Design 3 motion system (duration and easing)\n ========================================================================== */\n\n --md-sys-motion-duration-short1: 50ms;\n --md-sys-motion-duration-short2: 100ms;\n --md-sys-motion-duration-short3: 150ms;\n --md-sys-motion-duration-short4: 200ms;\n --md-sys-motion-duration-medium1: 250ms;\n --md-sys-motion-duration-medium2: 300ms;\n --md-sys-motion-duration-medium3: 350ms;\n --md-sys-motion-duration-medium4: 400ms;\n --md-sys-motion-duration-long1: 450ms;\n --md-sys-motion-duration-long2: 500ms;\n --md-sys-motion-duration-long3: 550ms;\n --md-sys-motion-duration-long4: 600ms;\n\n --md-sys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);\n --md-sys-motion-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);\n --md-sys-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);\n --md-sys-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);\n}\n\n/* ==========================================================================\n DARK MODE (Placeholder)\n ========================================================================== */\n\n/* Dark mode with class selector (for manual toggling, e.g., Storybook) */\n.dark {\n /* Primary */\n --md-sys-color-primary: #d0bcff;\n --md-sys-color-on-primary: #381e72;\n --md-sys-color-primary-container: #4f378b;\n --md-sys-color-on-primary-container: #eaddff;\n\n /* Secondary */\n --md-sys-color-secondary: #ccc2dc;\n --md-sys-color-on-secondary: #332d41;\n --md-sys-color-secondary-container: #4a4458;\n --md-sys-color-on-secondary-container: #e8def8;\n\n /* Tertiary */\n --md-sys-color-tertiary: #efb8c8;\n --md-sys-color-on-tertiary: #492532;\n --md-sys-color-tertiary-container: #633b48;\n --md-sys-color-on-tertiary-container: #ffd8e4;\n\n /* Error */\n --md-sys-color-error: #f2b8b5;\n --md-sys-color-on-error: #601410;\n --md-sys-color-error-container: #8c1d18;\n --md-sys-color-on-error-container: #f9dedc;\n\n /* Surface */\n --md-sys-color-surface: #1c1b1f;\n --md-sys-color-on-surface: #e6e1e5;\n --md-sys-color-surface-variant: #49454f;\n --md-sys-color-on-surface-variant: #cac4d0;\n\n /* Surface containers (MD3 elevation system - dark mode) */\n --md-sys-color-surface-container-lowest: #0f0d13;\n --md-sys-color-surface-container-low: #1d1b20;\n --md-sys-color-surface-container: #211f26;\n --md-sys-color-surface-container-high: #2b2930;\n --md-sys-color-surface-container-highest: #36343b;\n\n /* Outline */\n --md-sys-color-outline: #938f99;\n --md-sys-color-outline-variant: #49454f;\n\n /* Background */\n --md-sys-color-background: #1c1b1f;\n --md-sys-color-on-background: #e6e1e5;\n}\n\n/* System/OS dark mode preference (activates when no .light class is present) */\n@media (prefers-color-scheme: dark) {\n :root:not(.light) {\n /* Primary */\n --md-sys-color-primary: #d0bcff;\n --md-sys-color-on-primary: #381e72;\n --md-sys-color-primary-container: #4f378b;\n --md-sys-color-on-primary-container: #eaddff;\n\n /* Secondary */\n --md-sys-color-secondary: #ccc2dc;\n --md-sys-color-on-secondary: #332d41;\n --md-sys-color-secondary-container: #4a4458;\n --md-sys-color-on-secondary-container: #e8def8;\n\n /* Tertiary */\n --md-sys-color-tertiary: #efb8c8;\n --md-sys-color-on-tertiary: #492532;\n --md-sys-color-tertiary-container: #633b48;\n --md-sys-color-on-tertiary-container: #ffd8e4;\n\n /* Error */\n --md-sys-color-error: #f2b8b5;\n --md-sys-color-on-error: #601410;\n --md-sys-color-error-container: #8c1d18;\n --md-sys-color-on-error-container: #f9dedc;\n\n /* Surface */\n --md-sys-color-surface: #1c1b1f;\n --md-sys-color-on-surface: #e6e1e5;\n --md-sys-color-surface-variant: #49454f;\n --md-sys-color-on-surface-variant: #cac4d0;\n\n /* Surface containers (MD3 elevation system - dark mode) */\n --md-sys-color-surface-container-lowest: #0f0d13;\n --md-sys-color-surface-container-low: #1d1b20;\n --md-sys-color-surface-container: #211f26;\n --md-sys-color-surface-container-high: #2b2930;\n --md-sys-color-surface-container-highest: #36343b;\n\n /* Outline */\n --md-sys-color-outline: #938f99;\n --md-sys-color-outline-variant: #49454f;\n\n /* Background */\n --md-sys-color-background: #1c1b1f;\n --md-sys-color-on-background: #e6e1e5;\n }\n}\n\n/* ==========================================================================\n GLOBAL STYLES\n Apply MD3 surface colors to body element\n ========================================================================== */\n\nbody {\n background-color: var(--md-sys-color-surface);\n color: var(--md-sys-color-on-surface);\n margin: 0;\n font-family: var(--md-sys-typescale-font-family-plain);\n}\n\n/* ==========================================================================\n TAILWIND V4 INTEGRATION\n Maps MD3 design tokens to Tailwind utility classes\n ========================================================================== */\n\n/* @theme is a Tailwind v4 directive - ignore unknown at-rule warning */\n@theme {\n /* Color Utilities\n Maps MD3 semantic color roles to Tailwind color utilities\n Usage: bg-primary, text-on-primary, border-outline, etc. */\n\n /* Primary colors */\n --color-primary: var(--md-sys-color-primary);\n --color-on-primary: var(--md-sys-color-on-primary);\n --color-primary-container: var(--md-sys-color-primary-container);\n --color-on-primary-container: var(--md-sys-color-on-primary-container);\n\n /* Secondary colors */\n --color-secondary: var(--md-sys-color-secondary);\n --color-on-secondary: var(--md-sys-color-on-secondary);\n --color-secondary-container: var(--md-sys-color-secondary-container);\n --color-on-secondary-container: var(--md-sys-color-on-secondary-container);\n\n /* Tertiary colors */\n --color-tertiary: var(--md-sys-color-tertiary);\n --color-on-tertiary: var(--md-sys-color-on-tertiary);\n --color-tertiary-container: var(--md-sys-color-tertiary-container);\n --color-on-tertiary-container: var(--md-sys-color-on-tertiary-container);\n\n /* Error colors */\n --color-error: var(--md-sys-color-error);\n --color-on-error: var(--md-sys-color-on-error);\n --color-error-container: var(--md-sys-color-error-container);\n --color-on-error-container: var(--md-sys-color-on-error-container);\n\n /* Surface colors */\n --color-surface: var(--md-sys-color-surface);\n --color-on-surface: var(--md-sys-color-on-surface);\n --color-surface-variant: var(--md-sys-color-surface-variant);\n --color-on-surface-variant: var(--md-sys-color-on-surface-variant);\n\n /* Surface containers */\n --color-surface-container-lowest: var(--md-sys-color-surface-container-lowest);\n --color-surface-container-low: var(--md-sys-color-surface-container-low);\n --color-surface-container: var(--md-sys-color-surface-container);\n --color-surface-container-high: var(--md-sys-color-surface-container-high);\n --color-surface-container-highest: var(--md-sys-color-surface-container-highest);\n\n /* Outline colors */\n --color-outline: var(--md-sys-color-outline);\n --color-outline-variant: var(--md-sys-color-outline-variant);\n\n /* Background colors */\n --color-background: var(--md-sys-color-background);\n --color-on-background: var(--md-sys-color-on-background);\n\n /* Elevation/Shadow utilities\n Maps MD3 elevation levels to Tailwind box-shadow utilities\n Usage: shadow-elevation-1, shadow-elevation-2, etc. */\n --shadow-elevation-0: var(--md-sys-elevation-level-0);\n --shadow-elevation-1: var(--md-sys-elevation-level-1);\n --shadow-elevation-2: var(--md-sys-elevation-level-2);\n --shadow-elevation-3: var(--md-sys-elevation-level-3);\n --shadow-elevation-4: var(--md-sys-elevation-level-4);\n --shadow-elevation-5: var(--md-sys-elevation-level-5);\n}\n\n/* ==========================================================================\n ANIMATIONS\n Material Design 3 motion specs for ripple and other animations\n ========================================================================== */\n\n@keyframes ripple {\n to {\n transform: translate(-50%, -50%) scale(1);\n opacity: 0;\n }\n}\n\n/* Extend Tailwind theme with MD3 animations and opacity values */\n/* @theme is a Tailwind v4 directive - ignore unknown at-rule warning */\n@theme {\n /* Animations */\n --animate-ripple: ripple 450ms cubic-bezier(0.2, 0, 0, 1);\n\n /* Opacity values for MD3 state layers */\n --opacity-8: 0.08;\n --opacity-12: 0.12;\n --opacity-38: 0.38;\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../tokens/src/tokens.css","../src/components/Progress/Progress.css","../src/styles.css"],"sourcesContent":["/**\n * @tinybigui/tokens\n * Material Design 3 Design Tokens\n * \n * This file contains CSS variables for MD3 design tokens.\n * These tokens will be generated from Material Color Utilities\n * and other MD3 specifications.\n */\n\n/* Import Tailwind CSS v4 */\n@import \"tailwindcss\";\n\n:root {\n /* ==========================================================================\n COLOR TOKENS\n Material Design 3 color system with light/dark mode support\n Complete set of 18 semantic color roles for light and dark themes\n ========================================================================== */\n\n /* Primary */\n --md-sys-color-primary: #6750a4;\n --md-sys-color-on-primary: #ffffff;\n --md-sys-color-primary-container: #eaddff;\n --md-sys-color-on-primary-container: #21005d;\n\n /* Secondary */\n --md-sys-color-secondary: #625b71;\n --md-sys-color-on-secondary: #ffffff;\n --md-sys-color-secondary-container: #e8def8;\n --md-sys-color-on-secondary-container: #1d192b;\n\n /* Tertiary */\n --md-sys-color-tertiary: #7d5260;\n --md-sys-color-on-tertiary: #ffffff;\n --md-sys-color-tertiary-container: #ffd8e4;\n --md-sys-color-on-tertiary-container: #31111d;\n\n /* Error */\n --md-sys-color-error: #b3261e;\n --md-sys-color-on-error: #ffffff;\n --md-sys-color-error-container: #f9dedc;\n --md-sys-color-on-error-container: #410e0b;\n\n /* Surface */\n --md-sys-color-surface: #fffbfe;\n --md-sys-color-on-surface: #1c1b1f;\n --md-sys-color-surface-variant: #e7e0ec;\n --md-sys-color-on-surface-variant: #49454f;\n\n /* Surface containers (MD3 elevation system) */\n --md-sys-color-surface-container-lowest: #ffffff;\n --md-sys-color-surface-container-low: #f7f2fa;\n --md-sys-color-surface-container: #f3edf7;\n --md-sys-color-surface-container-high: #ece6f0;\n --md-sys-color-surface-container-highest: #e6e0e9;\n\n /* Outline */\n --md-sys-color-outline: #79747e;\n --md-sys-color-outline-variant: #cac4d0;\n\n /* Background */\n --md-sys-color-background: #fffbfe;\n --md-sys-color-on-background: #1c1b1f;\n\n /* Scrim */\n --md-sys-color-scrim: #000000;\n\n /* Inverse */\n --md-sys-color-inverse-surface: #313033;\n --md-sys-color-inverse-on-surface: #f4eff4;\n --md-sys-color-inverse-primary: #d0bcff;\n\n /* ==========================================================================\n TYPOGRAPHY TOKENS\n Material Design 3 Type Scale - 5 categories, 3 sizes each (15 total)\n ========================================================================== */\n\n /* Font families */\n --md-sys-typescale-font-family-plain:\n system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n --md-sys-typescale-font-family-brand: var(--md-sys-typescale-font-family-plain);\n\n /* Display - Large expressive text */\n --md-sys-typescale-display-large-size: 3.5625rem; /* 57px */\n --md-sys-typescale-display-large-line-height: 4rem; /* 64px */\n --md-sys-typescale-display-large-weight: 400;\n --md-sys-typescale-display-large-tracking: -0.25px;\n\n --md-sys-typescale-display-medium-size: 2.8125rem; /* 45px */\n --md-sys-typescale-display-medium-line-height: 3.25rem; /* 52px */\n --md-sys-typescale-display-medium-weight: 400;\n --md-sys-typescale-display-medium-tracking: 0;\n\n --md-sys-typescale-display-small-size: 2.25rem; /* 36px */\n --md-sys-typescale-display-small-line-height: 2.75rem; /* 44px */\n --md-sys-typescale-display-small-weight: 400;\n --md-sys-typescale-display-small-tracking: 0;\n\n /* Headline - High-emphasis text */\n --md-sys-typescale-headline-large-size: 2rem; /* 32px */\n --md-sys-typescale-headline-large-line-height: 2.5rem; /* 40px */\n --md-sys-typescale-headline-large-weight: 400;\n --md-sys-typescale-headline-large-tracking: 0;\n\n --md-sys-typescale-headline-medium-size: 1.75rem; /* 28px */\n --md-sys-typescale-headline-medium-line-height: 2.25rem; /* 36px */\n --md-sys-typescale-headline-medium-weight: 400;\n --md-sys-typescale-headline-medium-tracking: 0;\n\n --md-sys-typescale-headline-small-size: 1.5rem; /* 24px */\n --md-sys-typescale-headline-small-line-height: 2rem; /* 32px */\n --md-sys-typescale-headline-small-weight: 400;\n --md-sys-typescale-headline-small-tracking: 0;\n\n /* Title - Medium-emphasis text */\n --md-sys-typescale-title-large-size: 1.375rem; /* 22px */\n --md-sys-typescale-title-large-line-height: 1.75rem; /* 28px */\n --md-sys-typescale-title-large-weight: 400;\n --md-sys-typescale-title-large-tracking: 0;\n\n --md-sys-typescale-title-medium-size: 1rem; /* 16px */\n --md-sys-typescale-title-medium-line-height: 1.5rem; /* 24px */\n --md-sys-typescale-title-medium-weight: 500;\n --md-sys-typescale-title-medium-tracking: 0.15px;\n\n --md-sys-typescale-title-small-size: 0.875rem; /* 14px */\n --md-sys-typescale-title-small-line-height: 1.25rem; /* 20px */\n --md-sys-typescale-title-small-weight: 500;\n --md-sys-typescale-title-small-tracking: 0.1px;\n\n /* Body - Plain text */\n --md-sys-typescale-body-large-size: 1rem; /* 16px */\n --md-sys-typescale-body-large-line-height: 1.5rem; /* 24px */\n --md-sys-typescale-body-large-weight: 400;\n --md-sys-typescale-body-large-tracking: 0.5px;\n\n --md-sys-typescale-body-medium-size: 0.875rem; /* 14px */\n --md-sys-typescale-body-medium-line-height: 1.25rem; /* 20px */\n --md-sys-typescale-body-medium-weight: 400;\n --md-sys-typescale-body-medium-tracking: 0.25px;\n\n --md-sys-typescale-body-small-size: 0.75rem; /* 12px */\n --md-sys-typescale-body-small-line-height: 1rem; /* 16px */\n --md-sys-typescale-body-small-weight: 400;\n --md-sys-typescale-body-small-tracking: 0.4px;\n\n /* Label - UI labels, buttons */\n --md-sys-typescale-label-large-size: 0.875rem; /* 14px */\n --md-sys-typescale-label-large-line-height: 1.25rem; /* 20px */\n --md-sys-typescale-label-large-weight: 500;\n --md-sys-typescale-label-large-tracking: 0.1px;\n\n --md-sys-typescale-label-medium-size: 0.75rem; /* 12px */\n --md-sys-typescale-label-medium-line-height: 1rem; /* 16px */\n --md-sys-typescale-label-medium-weight: 500;\n --md-sys-typescale-label-medium-tracking: 0.5px;\n\n --md-sys-typescale-label-small-size: 0.6875rem; /* 11px */\n --md-sys-typescale-label-small-line-height: 1rem; /* 16px */\n --md-sys-typescale-label-small-weight: 500;\n --md-sys-typescale-label-small-tracking: 0.5px;\n\n /* ==========================================================================\n SHAPE TOKENS\n Material Design 3 corner radius system\n ========================================================================== */\n\n --md-sys-shape-corner-none: 0;\n --md-sys-shape-corner-extra-small: 0.25rem;\n --md-sys-shape-corner-small: 0.5rem;\n --md-sys-shape-corner-medium: 0.75rem;\n --md-sys-shape-corner-large: 1rem;\n --md-sys-shape-corner-extra-large: 1.75rem;\n --md-sys-shape-corner-full: 624.9375rem;\n\n /* ==========================================================================\n ELEVATION TOKENS\n Material Design 3 elevation system (box shadows)\n ========================================================================== */\n\n --md-sys-elevation-level-0: none;\n --md-sys-elevation-level-1: 0 1px 2px 0 rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);\n --md-sys-elevation-level-2: 0 1px 2px 0 rgba(0, 0, 0, 0.3), 0 2px 6px 2px rgba(0, 0, 0, 0.15);\n --md-sys-elevation-level-3: 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 4px 8px 3px rgba(0, 0, 0, 0.15);\n --md-sys-elevation-level-4: 0 2px 3px 0 rgba(0, 0, 0, 0.3), 0 6px 10px 4px rgba(0, 0, 0, 0.15);\n --md-sys-elevation-level-5: 0 4px 4px 0 rgba(0, 0, 0, 0.3), 0 8px 12px 6px rgba(0, 0, 0, 0.15);\n\n /* ==========================================================================\n MOTION TOKENS\n Material Design 3 motion system (duration and easing)\n ========================================================================== */\n\n --md-sys-motion-duration-short1: 50ms;\n --md-sys-motion-duration-short2: 100ms;\n --md-sys-motion-duration-short3: 150ms;\n --md-sys-motion-duration-short4: 200ms;\n --md-sys-motion-duration-medium1: 250ms;\n --md-sys-motion-duration-medium2: 300ms;\n --md-sys-motion-duration-medium3: 350ms;\n --md-sys-motion-duration-medium4: 400ms;\n --md-sys-motion-duration-long1: 450ms;\n --md-sys-motion-duration-long2: 500ms;\n --md-sys-motion-duration-long3: 550ms;\n --md-sys-motion-duration-long4: 600ms;\n\n --md-sys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);\n --md-sys-motion-easing-standard-decelerate: cubic-bezier(0, 0, 0, 1);\n --md-sys-motion-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);\n --md-sys-motion-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);\n --md-sys-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);\n --md-sys-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);\n}\n\n/* ==========================================================================\n DARK MODE (Placeholder)\n ========================================================================== */\n\n/* Dark mode with class selector (for manual toggling, e.g., Storybook) */\n.dark {\n /* Primary */\n --md-sys-color-primary: #d0bcff;\n --md-sys-color-on-primary: #381e72;\n --md-sys-color-primary-container: #4f378b;\n --md-sys-color-on-primary-container: #eaddff;\n\n /* Secondary */\n --md-sys-color-secondary: #ccc2dc;\n --md-sys-color-on-secondary: #332d41;\n --md-sys-color-secondary-container: #4a4458;\n --md-sys-color-on-secondary-container: #e8def8;\n\n /* Tertiary */\n --md-sys-color-tertiary: #efb8c8;\n --md-sys-color-on-tertiary: #492532;\n --md-sys-color-tertiary-container: #633b48;\n --md-sys-color-on-tertiary-container: #ffd8e4;\n\n /* Error */\n --md-sys-color-error: #f2b8b5;\n --md-sys-color-on-error: #601410;\n --md-sys-color-error-container: #8c1d18;\n --md-sys-color-on-error-container: #f9dedc;\n\n /* Surface */\n --md-sys-color-surface: #1c1b1f;\n --md-sys-color-on-surface: #e6e1e5;\n --md-sys-color-surface-variant: #49454f;\n --md-sys-color-on-surface-variant: #cac4d0;\n\n /* Surface containers (MD3 elevation system - dark mode) */\n --md-sys-color-surface-container-lowest: #0f0d13;\n --md-sys-color-surface-container-low: #1d1b20;\n --md-sys-color-surface-container: #211f26;\n --md-sys-color-surface-container-high: #2b2930;\n --md-sys-color-surface-container-highest: #36343b;\n\n /* Outline */\n --md-sys-color-outline: #938f99;\n --md-sys-color-outline-variant: #49454f;\n\n /* Background */\n --md-sys-color-background: #1c1b1f;\n --md-sys-color-on-background: #e6e1e5;\n\n /* Scrim */\n --md-sys-color-scrim: #000000;\n\n /* Inverse */\n --md-sys-color-inverse-surface: #e6e1e5;\n --md-sys-color-inverse-on-surface: #313033;\n --md-sys-color-inverse-primary: #6750a4;\n}\n\n/* System/OS dark mode preference (activates when no .light class is present) */\n@media (prefers-color-scheme: dark) {\n :root:not(.light) {\n /* Primary */\n --md-sys-color-primary: #d0bcff;\n --md-sys-color-on-primary: #381e72;\n --md-sys-color-primary-container: #4f378b;\n --md-sys-color-on-primary-container: #eaddff;\n\n /* Secondary */\n --md-sys-color-secondary: #ccc2dc;\n --md-sys-color-on-secondary: #332d41;\n --md-sys-color-secondary-container: #4a4458;\n --md-sys-color-on-secondary-container: #e8def8;\n\n /* Tertiary */\n --md-sys-color-tertiary: #efb8c8;\n --md-sys-color-on-tertiary: #492532;\n --md-sys-color-tertiary-container: #633b48;\n --md-sys-color-on-tertiary-container: #ffd8e4;\n\n /* Error */\n --md-sys-color-error: #f2b8b5;\n --md-sys-color-on-error: #601410;\n --md-sys-color-error-container: #8c1d18;\n --md-sys-color-on-error-container: #f9dedc;\n\n /* Surface */\n --md-sys-color-surface: #1c1b1f;\n --md-sys-color-on-surface: #e6e1e5;\n --md-sys-color-surface-variant: #49454f;\n --md-sys-color-on-surface-variant: #cac4d0;\n\n /* Surface containers (MD3 elevation system - dark mode) */\n --md-sys-color-surface-container-lowest: #0f0d13;\n --md-sys-color-surface-container-low: #1d1b20;\n --md-sys-color-surface-container: #211f26;\n --md-sys-color-surface-container-high: #2b2930;\n --md-sys-color-surface-container-highest: #36343b;\n\n /* Outline */\n --md-sys-color-outline: #938f99;\n --md-sys-color-outline-variant: #49454f;\n\n /* Background */\n --md-sys-color-background: #1c1b1f;\n --md-sys-color-on-background: #e6e1e5;\n\n /* Scrim */\n --md-sys-color-scrim: #000000;\n\n /* Inverse */\n --md-sys-color-inverse-surface: #e6e1e5;\n --md-sys-color-inverse-on-surface: #313033;\n --md-sys-color-inverse-primary: #6750a4;\n }\n}\n\n/* ==========================================================================\n GLOBAL STYLES\n Apply MD3 surface colors to body element\n ========================================================================== */\n\nbody {\n background-color: var(--md-sys-color-surface);\n color: var(--md-sys-color-on-surface);\n margin: 0;\n font-family: var(--md-sys-typescale-font-family-plain);\n}\n\n/* ==========================================================================\n TAILWIND V4 INTEGRATION\n Maps MD3 design tokens to Tailwind utility classes\n ========================================================================== */\n\n/* @theme is a Tailwind v4 directive - ignore unknown at-rule warning */\n@theme {\n /* Color Utilities\n Maps MD3 semantic color roles to Tailwind color utilities\n Usage: bg-primary, text-on-primary, border-outline, etc. */\n\n /* Primary colors */\n --color-primary: var(--md-sys-color-primary);\n --color-on-primary: var(--md-sys-color-on-primary);\n --color-primary-container: var(--md-sys-color-primary-container);\n --color-on-primary-container: var(--md-sys-color-on-primary-container);\n\n /* Secondary colors */\n --color-secondary: var(--md-sys-color-secondary);\n --color-on-secondary: var(--md-sys-color-on-secondary);\n --color-secondary-container: var(--md-sys-color-secondary-container);\n --color-on-secondary-container: var(--md-sys-color-on-secondary-container);\n\n /* Tertiary colors */\n --color-tertiary: var(--md-sys-color-tertiary);\n --color-on-tertiary: var(--md-sys-color-on-tertiary);\n --color-tertiary-container: var(--md-sys-color-tertiary-container);\n --color-on-tertiary-container: var(--md-sys-color-on-tertiary-container);\n\n /* Error colors */\n --color-error: var(--md-sys-color-error);\n --color-on-error: var(--md-sys-color-on-error);\n --color-error-container: var(--md-sys-color-error-container);\n --color-on-error-container: var(--md-sys-color-on-error-container);\n\n /* Surface colors */\n --color-surface: var(--md-sys-color-surface);\n --color-on-surface: var(--md-sys-color-on-surface);\n --color-surface-variant: var(--md-sys-color-surface-variant);\n --color-on-surface-variant: var(--md-sys-color-on-surface-variant);\n\n /* Surface containers */\n --color-surface-container-lowest: var(--md-sys-color-surface-container-lowest);\n --color-surface-container-low: var(--md-sys-color-surface-container-low);\n --color-surface-container: var(--md-sys-color-surface-container);\n --color-surface-container-high: var(--md-sys-color-surface-container-high);\n --color-surface-container-highest: var(--md-sys-color-surface-container-highest);\n\n /* Outline colors */\n --color-outline: var(--md-sys-color-outline);\n --color-outline-variant: var(--md-sys-color-outline-variant);\n\n /* Background colors */\n --color-background: var(--md-sys-color-background);\n --color-on-background: var(--md-sys-color-on-background);\n\n /* Scrim color */\n --color-scrim: var(--md-sys-color-scrim);\n\n /* Inverse colors */\n --color-inverse-surface: var(--md-sys-color-inverse-surface);\n --color-inverse-on-surface: var(--md-sys-color-inverse-on-surface);\n --color-inverse-primary: var(--md-sys-color-inverse-primary);\n\n /* Elevation/Shadow utilities\n Maps MD3 elevation levels to Tailwind box-shadow utilities\n Usage: shadow-elevation-1, shadow-elevation-2, etc. */\n --shadow-elevation-0: var(--md-sys-elevation-level-0);\n --shadow-elevation-1: var(--md-sys-elevation-level-1);\n --shadow-elevation-2: var(--md-sys-elevation-level-2);\n --shadow-elevation-3: var(--md-sys-elevation-level-3);\n --shadow-elevation-4: var(--md-sys-elevation-level-4);\n --shadow-elevation-5: var(--md-sys-elevation-level-5);\n}\n\n/* ==========================================================================\n ANIMATIONS\n Material Design 3 motion specs for ripple and other animations\n ========================================================================== */\n\n@keyframes ripple {\n to {\n transform: translate(-50%, -50%) scale(1);\n opacity: 0;\n }\n}\n\n/* Extend Tailwind theme with MD3 animations and opacity values */\n/* @theme is a Tailwind v4 directive - ignore unknown at-rule warning */\n@theme {\n /* Animations */\n --animate-ripple: ripple 450ms cubic-bezier(0.2, 0, 0, 1);\n\n /* Opacity values for MD3 state layers */\n --opacity-8: 0.08;\n --opacity-12: 0.12;\n --opacity-32: 0.32;\n --opacity-38: 0.38;\n\n /* Typography utilities\n Maps MD3 type scale to Tailwind font-size/line-height utilities\n Usage: text-title-large, text-headline-small, text-display-small, etc.\n These produce font-size + line-height pairs via Tailwind v4 @theme */\n\n /* Display scale */\n --font-size-display-large: var(--md-sys-typescale-display-large-size);\n --line-height-display-large: var(--md-sys-typescale-display-large-line-height);\n --font-size-display-medium: var(--md-sys-typescale-display-medium-size);\n --line-height-display-medium: var(--md-sys-typescale-display-medium-line-height);\n --font-size-display-small: var(--md-sys-typescale-display-small-size);\n --line-height-display-small: var(--md-sys-typescale-display-small-line-height);\n\n /* Headline scale */\n --font-size-headline-large: var(--md-sys-typescale-headline-large-size);\n --line-height-headline-large: var(--md-sys-typescale-headline-large-line-height);\n --font-size-headline-medium: var(--md-sys-typescale-headline-medium-size);\n --line-height-headline-medium: var(--md-sys-typescale-headline-medium-line-height);\n --font-size-headline-small: var(--md-sys-typescale-headline-small-size);\n --line-height-headline-small: var(--md-sys-typescale-headline-small-line-height);\n\n /* Title scale */\n --font-size-title-large: var(--md-sys-typescale-title-large-size);\n --line-height-title-large: var(--md-sys-typescale-title-large-line-height);\n --font-size-title-medium: var(--md-sys-typescale-title-medium-size);\n --line-height-title-medium: var(--md-sys-typescale-title-medium-line-height);\n --font-size-title-small: var(--md-sys-typescale-title-small-size);\n --line-height-title-small: var(--md-sys-typescale-title-small-line-height);\n\n /* Body scale */\n --font-size-body-large: var(--md-sys-typescale-body-large-size);\n --line-height-body-large: var(--md-sys-typescale-body-large-line-height);\n --font-size-body-medium: var(--md-sys-typescale-body-medium-size);\n --line-height-body-medium: var(--md-sys-typescale-body-medium-line-height);\n --font-size-body-small: var(--md-sys-typescale-body-small-size);\n --line-height-body-small: var(--md-sys-typescale-body-small-line-height);\n\n /* Label scale */\n --font-size-label-large: var(--md-sys-typescale-label-large-size);\n --line-height-label-large: var(--md-sys-typescale-label-large-line-height);\n --font-size-label-medium: var(--md-sys-typescale-label-medium-size);\n --line-height-label-medium: var(--md-sys-typescale-label-medium-line-height);\n --font-size-label-small: var(--md-sys-typescale-label-small-size);\n --line-height-label-small: var(--md-sys-typescale-label-small-line-height);\n\n /* Motion utilities\n Maps MD3 motion duration tokens to Tailwind transition-duration utilities\n Usage: duration-short2, duration-medium2, duration-long1, etc. */\n --transition-duration-short1: var(--md-sys-motion-duration-short1);\n --transition-duration-short2: var(--md-sys-motion-duration-short2);\n --transition-duration-short3: var(--md-sys-motion-duration-short3);\n --transition-duration-short4: var(--md-sys-motion-duration-short4);\n --transition-duration-medium1: var(--md-sys-motion-duration-medium1);\n --transition-duration-medium2: var(--md-sys-motion-duration-medium2);\n --transition-duration-medium3: var(--md-sys-motion-duration-medium3);\n --transition-duration-medium4: var(--md-sys-motion-duration-medium4);\n --transition-duration-long1: var(--md-sys-motion-duration-long1);\n --transition-duration-long2: var(--md-sys-motion-duration-long2);\n --transition-duration-long3: var(--md-sys-motion-duration-long3);\n --transition-duration-long4: var(--md-sys-motion-duration-long4);\n\n /* Easing utilities\n Maps MD3 easing tokens to Tailwind transition-timing-function utilities\n Usage: ease-standard, ease-emphasized, etc. */\n --ease-standard: var(--md-sys-motion-easing-standard);\n --ease-standard-decelerate: var(--md-sys-motion-easing-standard-decelerate);\n --ease-standard-accelerate: var(--md-sys-motion-easing-standard-accelerate);\n --ease-emphasized: var(--md-sys-motion-easing-emphasized);\n --ease-emphasized-decelerate: var(--md-sys-motion-easing-emphasized-decelerate);\n --ease-emphasized-accelerate: var(--md-sys-motion-easing-emphasized-accelerate);\n\n /* Spacing utilities for MD3 component heights\n Usage: h-appbar-small (64px), h-appbar-medium (112px), h-appbar-large (152px) */\n --spacing-appbar-small: 4rem; /* 64px */\n --spacing-appbar-medium: 7rem; /* 112px */\n --spacing-appbar-large: 9.5rem; /* 152px */\n\n /* Drawer width: MD3 spec = 360dp */\n --spacing-drawer: 22.5rem; /* 360px */\n\n /* Snackbar max width: MD3 spec = 568dp */\n --spacing-snackbar-max: 35.5rem; /* 568px */\n\n /* Dialog max width: MD3 spec = 560dp */\n --spacing-dialog-max: 35rem; /* 560px */\n\n /* Shape radius utilities for MD3 components */\n --radius-xs: var(--md-sys-shape-corner-extra-small); /* 4px */\n --radius-sm: var(--md-sys-shape-corner-small); /* 8px */\n --radius-md: var(--md-sys-shape-corner-medium); /* 12px */\n --radius-lg: var(--md-sys-shape-corner-large); /* 16px */\n --radius-xl: var(--md-sys-shape-corner-extra-large); /* 28px */\n --radius-full: var(--md-sys-shape-corner-full);\n}\n","/*\n * Progress Indicator Animations\n * Material Design 3 motion tokens for indeterminate progress states.\n *\n * Keyframes are defined here (co-located with the component) per project\n * convention — they are NOT added to the global tokens.css.\n *\n * Motion tokens referenced (from packages/tokens/src/tokens.css):\n * --md-sys-motion-duration-medium4 : 400ms (determinate transitions — applied via Tailwind)\n * --md-sys-motion-duration-long2 : 500ms (linear indeterminate cycle)\n * --md-sys-motion-duration-long4 : 600ms (circular indeterminate rotation)\n * --md-sys-motion-easing-standard : cubic-bezier(0.2, 0, 0, 1)\n */\n\n/* ---------------------------------------------------------------------------\n LINEAR INDETERMINATE\n Two-segment bar animation per MD3 spec.\n First segment: starts narrow at left, expands, then slides off right.\n Second segment: follows the first with a short delay.\n Duration: long2 = 500ms per cycle (repeating).\n --------------------------------------------------------------------------- */\n\n@keyframes progress-linear-indeterminate-1 {\n 0% {\n left: -35%;\n right: 100%;\n }\n 60% {\n left: 100%;\n right: -90%;\n }\n 100% {\n left: 100%;\n right: -90%;\n }\n}\n\n@keyframes progress-linear-indeterminate-2 {\n 0% {\n left: -200%;\n right: 100%;\n }\n 60% {\n left: 107%;\n right: -8%;\n }\n 100% {\n left: 107%;\n right: -8%;\n }\n}\n\n/* ---------------------------------------------------------------------------\n CIRCULAR INDETERMINATE\n Two-part animation per MD3 spec:\n 1. Container rotation: continuous 360° spin.\n 2. Dash animation: stroke-dasharray pulses between a short and long arc.\n Rotation duration: long4 = 600ms per cycle (repeating).\n --------------------------------------------------------------------------- */\n\n@keyframes progress-circular-rotate {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n@keyframes progress-circular-dash {\n 0% {\n stroke-dasharray: 1, 200;\n stroke-dashoffset: 0;\n }\n 50% {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: -35px;\n }\n 100% {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: -124px;\n }\n}\n\n/* ---------------------------------------------------------------------------\n TAILWIND @theme INTEGRATION\n Register animations so they can be used as Tailwind utilities:\n animate-progress-linear-indeterminate-1\n animate-progress-linear-indeterminate-2\n animate-progress-circular-rotate\n animate-progress-circular-dash\n --------------------------------------------------------------------------- */\n\n@theme {\n --animate-progress-linear-indeterminate-1: progress-linear-indeterminate-1\n var(--md-sys-motion-duration-long2) var(--md-sys-motion-easing-standard) infinite;\n\n --animate-progress-linear-indeterminate-2: progress-linear-indeterminate-2\n var(--md-sys-motion-duration-long2) var(--md-sys-motion-easing-standard) infinite;\n\n --animate-progress-circular-rotate: progress-circular-rotate var(--md-sys-motion-duration-long4)\n linear infinite;\n\n --animate-progress-circular-dash: progress-circular-dash var(--md-sys-motion-duration-long4)\n var(--md-sys-motion-easing-standard) infinite;\n}\n","/**\n * @tinybigui/react\n * Main stylesheet - includes tokens and component styles\n * \n * Import this file in your app to use TinyBigUI components:\n * import \"@tinybigui/react/styles.css\";\n */\n\n/* ==========================================================================\n DESIGN TOKENS\n Imports Material Design 3 tokens and Tailwind v4 integration\n ========================================================================== */\n\n@import \"../../../packages/tokens/src/tokens.css\";\n\n/* ==========================================================================\n COMPONENT STYLES\n Base styles for all components (future)\n ========================================================================== */\n\n/* Progress Indicator — indeterminate keyframes */\n@import \"./components/Progress/Progress.css\";\n\n/* ==========================================================================\n MENU ANIMATIONS\n MD3 menu enter/exit keyframes — matched to Angular Material's implementation.\n Enter: scale(0.8) + opacity → full, 120ms cubic-bezier(0, 0, 0.2, 1)\n Exit: opacity → 0, 100ms linear (25ms delay)\n ========================================================================== */\n\n/**\n * Menu enter: pop from 80% scale + transparent to full size + opaque.\n * Transform-origin is set placement-aware via data-placement variants in CVA.\n */\n@keyframes menu-enter {\n from {\n opacity: 0;\n transform: scale(0.8);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n/**\n * Menu exit: fade out only (no scale) — matches Angular Material's exit which\n * only fades without reversing the scale.\n */\n@keyframes menu-exit {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n/* TODO: Component-specific styles will be added here as we build components:\n * - State layers (hover, press, focus states)\n * - Ripple effects\n * - Elevation transitions\n * - Component-specific overrides\n */\n"],"mappings":"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","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tinybigui/react",
3
- "version": "0.1.1",
3
+ "version": "0.3.0",
4
4
  "description": "Material Design 3 React components built with Tailwind CSS",
5
5
  "keywords": [
6
6
  "react",
@@ -50,6 +50,7 @@
50
50
  ],
51
51
  "dependencies": {
52
52
  "@material/material-color-utilities": "^0.3.0",
53
+ "@react-aria/collections": "^3.0.1",
53
54
  "@react-aria/live-announcer": "^3.4.4",
54
55
  "@react-aria/utils": "^3.32.0",
55
56
  "class-variance-authority": "^0.7.1",
@@ -88,7 +89,7 @@
88
89
  "typescript": "^5.7.2",
89
90
  "typescript-eslint": "^8.51.0",
90
91
  "vitest-axe": "^0.1.0",
91
- "@tinybigui/tokens": "0.1.1"
92
+ "@tinybigui/tokens": "0.3.0"
92
93
  },
93
94
  "peerDependencies": {
94
95
  "react": "^18.0.0 || ^19.0.0",