@a4ui/core 0.32.0 → 0.34.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 (63) hide show
  1. package/dist/charts/BarList.d.ts +33 -0
  2. package/dist/charts/CategoryBar.d.ts +23 -0
  3. package/dist/charts/StatusTracker.d.ts +27 -0
  4. package/dist/charts/index.d.ts +3 -0
  5. package/dist/charts.js +446 -316
  6. package/dist/elements.css +278 -0
  7. package/dist/full.css +278 -0
  8. package/dist/index.d.ts +25 -1
  9. package/dist/index.js +6423 -4195
  10. package/dist/ui/AudioWaveform.d.ts +22 -0
  11. package/dist/ui/Callout.d.ts +27 -0
  12. package/dist/ui/Confetti.d.ts +46 -0
  13. package/dist/ui/CouponField.d.ts +33 -0
  14. package/dist/ui/CursorTrail.d.ts +25 -0
  15. package/dist/ui/DiffViewer.d.ts +33 -0
  16. package/dist/ui/FollowingPointer.d.ts +24 -0
  17. package/dist/ui/GanttChart.d.ts +37 -0
  18. package/dist/ui/Globe.d.ts +44 -0
  19. package/dist/ui/Kanban.d.ts +49 -0
  20. package/dist/ui/Lamp.d.ts +22 -0
  21. package/dist/ui/Lightbox.d.ts +41 -0
  22. package/dist/ui/ModelPicker.d.ts +38 -0
  23. package/dist/ui/OnboardingChecklist.d.ts +51 -0
  24. package/dist/ui/PivotTable.d.ts +37 -0
  25. package/dist/ui/ReasoningTrace.d.ts +28 -0
  26. package/dist/ui/SheetSnap.d.ts +28 -0
  27. package/dist/ui/Snippet.d.ts +19 -0
  28. package/dist/ui/SuggestionChips.d.ts +25 -0
  29. package/dist/ui/ToolCallTimeline.d.ts +34 -0
  30. package/dist/ui/TreeTable.d.ts +52 -0
  31. package/dist/ui/UsageMeter.d.ts +26 -0
  32. package/dist/ui/VideoPlayerShell.d.ts +19 -0
  33. package/dist/ui/WorldMap.d.ts +36 -0
  34. package/package.json +1 -1
  35. package/src/charts/BarList.tsx +83 -0
  36. package/src/charts/CategoryBar.tsx +95 -0
  37. package/src/charts/StatusTracker.tsx +81 -0
  38. package/src/charts/index.ts +3 -0
  39. package/src/index.ts +48 -1
  40. package/src/ui/AudioWaveform.tsx +190 -0
  41. package/src/ui/Callout.tsx +66 -0
  42. package/src/ui/Confetti.tsx +131 -0
  43. package/src/ui/CouponField.tsx +120 -0
  44. package/src/ui/CursorTrail.tsx +88 -0
  45. package/src/ui/DiffViewer.tsx +166 -0
  46. package/src/ui/FollowingPointer.tsx +112 -0
  47. package/src/ui/GanttChart.tsx +283 -0
  48. package/src/ui/Globe.tsx +317 -0
  49. package/src/ui/Kanban.tsx +250 -0
  50. package/src/ui/Lamp.tsx +88 -0
  51. package/src/ui/Lightbox.tsx +261 -0
  52. package/src/ui/ModelPicker.tsx +119 -0
  53. package/src/ui/OnboardingChecklist.tsx +163 -0
  54. package/src/ui/PivotTable.tsx +0 -0
  55. package/src/ui/ReasoningTrace.tsx +83 -0
  56. package/src/ui/SheetSnap.tsx +264 -0
  57. package/src/ui/Snippet.tsx +64 -0
  58. package/src/ui/SuggestionChips.tsx +65 -0
  59. package/src/ui/ToolCallTimeline.tsx +137 -0
  60. package/src/ui/TreeTable.tsx +172 -0
  61. package/src/ui/UsageMeter.tsx +71 -0
  62. package/src/ui/VideoPlayerShell.tsx +282 -0
  63. package/src/ui/WorldMap.tsx +191 -0
package/dist/full.css CHANGED
@@ -1616,6 +1616,13 @@ html.calm .tile-glass {
1616
1616
  top: 0.25rem;
1617
1617
  bottom: 0.25rem;
1618
1618
  }
1619
+ .inset-y-2 {
1620
+ top: 0.5rem;
1621
+ bottom: 0.5rem;
1622
+ }
1623
+ .-bottom-4 {
1624
+ bottom: -1rem;
1625
+ }
1619
1626
  .-bottom-6 {
1620
1627
  bottom: -1.5rem;
1621
1628
  }
@@ -1688,6 +1695,9 @@ html.calm .tile-glass {
1688
1695
  .left-\[calc\(0\.5rem\+0\.375rem\)\] {
1689
1696
  left: calc(0.5rem + 0.375rem);
1690
1697
  }
1698
+ .left-\[calc\(0\.5rem\+2px\)\] {
1699
+ left: calc(0.5rem + 2px);
1700
+ }
1691
1701
  .right-0 {
1692
1702
  right: 0px;
1693
1703
  }
@@ -1703,6 +1713,9 @@ html.calm .tile-glass {
1703
1713
  .right-6 {
1704
1714
  right: 1.5rem;
1705
1715
  }
1716
+ .right-9 {
1717
+ right: 2.25rem;
1718
+ }
1706
1719
  .top-0 {
1707
1720
  top: 0px;
1708
1721
  }
@@ -1724,6 +1737,9 @@ html.calm .tile-glass {
1724
1737
  .top-4 {
1725
1738
  top: 1rem;
1726
1739
  }
1740
+ .top-6 {
1741
+ top: 1.5rem;
1742
+ }
1727
1743
  .top-\[14vh\] {
1728
1744
  top: 14vh;
1729
1745
  }
@@ -1824,6 +1840,9 @@ html.calm .tile-glass {
1824
1840
  .mt-1 {
1825
1841
  margin-top: 0.25rem;
1826
1842
  }
1843
+ .mt-1\.5 {
1844
+ margin-top: 0.375rem;
1845
+ }
1827
1846
  .mt-2 {
1828
1847
  margin-top: 0.5rem;
1829
1848
  }
@@ -1903,6 +1922,9 @@ html.calm .tile-glass {
1903
1922
  width: 0.75rem;
1904
1923
  height: 0.75rem;
1905
1924
  }
1925
+ .h-0 {
1926
+ height: 0px;
1927
+ }
1906
1928
  .h-0\.5 {
1907
1929
  height: 0.125rem;
1908
1930
  }
@@ -1942,6 +1964,12 @@ html.calm .tile-glass {
1942
1964
  .h-4 {
1943
1965
  height: 1rem;
1944
1966
  }
1967
+ .h-40 {
1968
+ height: 10rem;
1969
+ }
1970
+ .h-48 {
1971
+ height: 12rem;
1972
+ }
1945
1973
  .h-5 {
1946
1974
  height: 1.25rem;
1947
1975
  }
@@ -1957,6 +1985,9 @@ html.calm .tile-glass {
1957
1985
  .h-7 {
1958
1986
  height: 1.75rem;
1959
1987
  }
1988
+ .h-72 {
1989
+ height: 18rem;
1990
+ }
1960
1991
  .h-8 {
1961
1992
  height: 2rem;
1962
1993
  }
@@ -2041,6 +2072,9 @@ html.calm .tile-glass {
2041
2072
  .max-h-\[85vh\] {
2042
2073
  max-height: 85vh;
2043
2074
  }
2075
+ .max-h-\[calc\(100vh-10rem\)\] {
2076
+ max-height: calc(100vh - 10rem);
2077
+ }
2044
2078
  .min-h-0 {
2045
2079
  min-height: 0px;
2046
2080
  }
@@ -2053,12 +2087,24 @@ html.calm .tile-glass {
2053
2087
  .min-h-\[24px\] {
2054
2088
  min-height: 24px;
2055
2089
  }
2090
+ .min-h-\[24rem\] {
2091
+ min-height: 24rem;
2092
+ }
2093
+ .min-h-\[28rem\] {
2094
+ min-height: 28rem;
2095
+ }
2096
+ .min-h-\[60px\] {
2097
+ min-height: 60px;
2098
+ }
2056
2099
  .min-h-\[80px\] {
2057
2100
  min-height: 80px;
2058
2101
  }
2059
2102
  .min-h-screen {
2060
2103
  min-height: 100vh;
2061
2104
  }
2105
+ .w-0 {
2106
+ width: 0px;
2107
+ }
2062
2108
  .w-0\.5 {
2063
2109
  width: 0.125rem;
2064
2110
  }
@@ -2212,15 +2258,24 @@ html.calm .tile-glass {
2212
2258
  .min-w-\[2\.5rem\] {
2213
2259
  min-width: 2.5rem;
2214
2260
  }
2261
+ .min-w-\[2px\] {
2262
+ min-width: 2px;
2263
+ }
2215
2264
  .min-w-\[4rem\] {
2216
2265
  min-width: 4rem;
2217
2266
  }
2218
2267
  .min-w-\[6\.5rem\] {
2219
2268
  min-width: 6.5rem;
2220
2269
  }
2270
+ .min-w-\[640px\] {
2271
+ min-width: 640px;
2272
+ }
2221
2273
  .min-w-\[8rem\] {
2222
2274
  min-width: 8rem;
2223
2275
  }
2276
+ .min-w-max {
2277
+ min-width: max-content;
2278
+ }
2224
2279
  .max-w-2xl {
2225
2280
  max-width: 42rem;
2226
2281
  }
@@ -2242,6 +2297,9 @@ html.calm .tile-glass {
2242
2297
  .max-w-\[90vw\] {
2243
2298
  max-width: 90vw;
2244
2299
  }
2300
+ .max-w-\[92vw\] {
2301
+ max-width: 92vw;
2302
+ }
2245
2303
  .max-w-full {
2246
2304
  max-width: 100%;
2247
2305
  }
@@ -2269,6 +2327,9 @@ html.calm .tile-glass {
2269
2327
  .shrink-0 {
2270
2328
  flex-shrink: 0;
2271
2329
  }
2330
+ .flex-grow {
2331
+ flex-grow: 1;
2332
+ }
2272
2333
  .grow {
2273
2334
  flex-grow: 1;
2274
2335
  }
@@ -2284,6 +2345,10 @@ html.calm .tile-glass {
2284
2345
  .origin-top {
2285
2346
  transform-origin: top;
2286
2347
  }
2348
+ .-translate-x-0\.5 {
2349
+ --tw-translate-x: -0.125rem;
2350
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2351
+ }
2287
2352
  .-translate-x-1\/2 {
2288
2353
  --tw-translate-x: -50%;
2289
2354
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2292,6 +2357,10 @@ html.calm .tile-glass {
2292
2357
  --tw-translate-x: -100%;
2293
2358
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2294
2359
  }
2360
+ .-translate-y-0\.5 {
2361
+ --tw-translate-y: -0.125rem;
2362
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2363
+ }
2295
2364
  .-translate-y-1 {
2296
2365
  --tw-translate-y: -0.25rem;
2297
2366
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2300,6 +2369,10 @@ html.calm .tile-glass {
2300
2369
  --tw-translate-y: -50%;
2301
2370
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2302
2371
  }
2372
+ .translate-x-0\.5 {
2373
+ --tw-translate-x: 0.125rem;
2374
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2375
+ }
2303
2376
  .translate-x-full {
2304
2377
  --tw-translate-x: 100%;
2305
2378
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2333,6 +2406,11 @@ html.calm .tile-glass {
2333
2406
  --tw-scale-y: 1;
2334
2407
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2335
2408
  }
2409
+ .scale-150 {
2410
+ --tw-scale-x: 1.5;
2411
+ --tw-scale-y: 1.5;
2412
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2413
+ }
2336
2414
  .scale-95 {
2337
2415
  --tw-scale-x: .95;
2338
2416
  --tw-scale-y: .95;
@@ -2383,6 +2461,9 @@ html.calm .tile-glass {
2383
2461
  .cursor-grab {
2384
2462
  cursor: grab;
2385
2463
  }
2464
+ .cursor-none {
2465
+ cursor: none;
2466
+ }
2386
2467
  .cursor-not-allowed {
2387
2468
  cursor: not-allowed;
2388
2469
  }
@@ -2395,6 +2476,9 @@ html.calm .tile-glass {
2395
2476
  .cursor-zoom-in {
2396
2477
  cursor: zoom-in;
2397
2478
  }
2479
+ .cursor-zoom-out {
2480
+ cursor: zoom-out;
2481
+ }
2398
2482
  .touch-none {
2399
2483
  touch-action: none;
2400
2484
  }
@@ -2417,6 +2501,9 @@ html.calm .tile-glass {
2417
2501
  .list-none {
2418
2502
  list-style-type: none;
2419
2503
  }
2504
+ .appearance-none {
2505
+ appearance: none;
2506
+ }
2420
2507
  .auto-rows-\[minmax\(11rem\2c auto\)\] {
2421
2508
  grid-auto-rows: minmax(11rem,auto);
2422
2509
  }
@@ -2501,6 +2588,9 @@ html.calm .tile-glass {
2501
2588
  .gap-8 {
2502
2589
  gap: 2rem;
2503
2590
  }
2591
+ .gap-\[2px\] {
2592
+ gap: 2px;
2593
+ }
2504
2594
  .gap-x-3 {
2505
2595
  column-gap: 0.75rem;
2506
2596
  }
@@ -2578,6 +2668,9 @@ html.calm .tile-glass {
2578
2668
  .overflow-y-auto {
2579
2669
  overflow-y: auto;
2580
2670
  }
2671
+ .overscroll-contain {
2672
+ overscroll-behavior: contain;
2673
+ }
2581
2674
  .truncate {
2582
2675
  overflow: hidden;
2583
2676
  text-overflow: ellipsis;
@@ -2586,6 +2679,9 @@ html.calm .tile-glass {
2586
2679
  .whitespace-nowrap {
2587
2680
  white-space: nowrap;
2588
2681
  }
2682
+ .whitespace-pre {
2683
+ white-space: pre;
2684
+ }
2589
2685
  .whitespace-pre-wrap {
2590
2686
  white-space: pre-wrap;
2591
2687
  }
@@ -2635,6 +2731,10 @@ html.calm .tile-glass {
2635
2731
  border-top-left-radius: 0.25rem;
2636
2732
  border-top-right-radius: 0.25rem;
2637
2733
  }
2734
+ .rounded-t-2xl {
2735
+ border-top-left-radius: 1rem;
2736
+ border-top-right-radius: 1rem;
2737
+ }
2638
2738
  .border {
2639
2739
  border-width: 1px;
2640
2740
  }
@@ -2644,10 +2744,18 @@ html.calm .tile-glass {
2644
2744
  .border-2 {
2645
2745
  border-width: 2px;
2646
2746
  }
2747
+ .border-x-4 {
2748
+ border-left-width: 4px;
2749
+ border-right-width: 4px;
2750
+ }
2647
2751
  .border-y {
2648
2752
  border-top-width: 1px;
2649
2753
  border-bottom-width: 1px;
2650
2754
  }
2755
+ .border-y-4 {
2756
+ border-top-width: 4px;
2757
+ border-bottom-width: 4px;
2758
+ }
2651
2759
  .border-b {
2652
2760
  border-bottom-width: 1px;
2653
2761
  }
@@ -2660,15 +2768,31 @@ html.calm .tile-glass {
2660
2768
  .border-l-2 {
2661
2769
  border-left-width: 2px;
2662
2770
  }
2771
+ .border-l-4 {
2772
+ border-left-width: 4px;
2773
+ }
2774
+ .border-l-8 {
2775
+ border-left-width: 8px;
2776
+ }
2663
2777
  .border-r {
2664
2778
  border-right-width: 1px;
2665
2779
  }
2780
+ .border-r-8 {
2781
+ border-right-width: 8px;
2782
+ }
2666
2783
  .border-t {
2667
2784
  border-top-width: 1px;
2668
2785
  }
2786
+ .border-t-4 {
2787
+ border-top-width: 4px;
2788
+ }
2669
2789
  .border-dashed {
2670
2790
  border-style: dashed;
2671
2791
  }
2792
+ .border-amber-500 {
2793
+ --tw-border-opacity: 1;
2794
+ border-color: rgb(245 158 11 / var(--tw-border-opacity, 1));
2795
+ }
2672
2796
  .border-amber-500\/30 {
2673
2797
  border-color: rgb(245 158 11 / 0.3);
2674
2798
  }
@@ -2680,6 +2804,9 @@ html.calm .tile-glass {
2680
2804
  --tw-border-opacity: 1;
2681
2805
  border-color: hsl(var(--border) / var(--tw-border-opacity, 1));
2682
2806
  }
2807
+ .border-border\/40 {
2808
+ border-color: hsl(var(--border) / 0.4);
2809
+ }
2683
2810
  .border-border\/60 {
2684
2811
  border-color: hsl(var(--border) / 0.6);
2685
2812
  }
@@ -2689,6 +2816,10 @@ html.calm .tile-glass {
2689
2816
  .border-destructive\/30 {
2690
2817
  border-color: hsl(var(--destructive) / 0.3);
2691
2818
  }
2819
+ .border-emerald-500 {
2820
+ --tw-border-opacity: 1;
2821
+ border-color: rgb(16 185 129 / var(--tw-border-opacity, 1));
2822
+ }
2692
2823
  .border-emerald-500\/30 {
2693
2824
  border-color: rgb(16 185 129 / 0.3);
2694
2825
  }
@@ -2717,19 +2848,54 @@ html.calm .tile-glass {
2717
2848
  .border-ring\/60 {
2718
2849
  border-color: hsl(var(--ring) / 0.6);
2719
2850
  }
2851
+ .border-rose-500 {
2852
+ --tw-border-opacity: 1;
2853
+ border-color: rgb(244 63 94 / var(--tw-border-opacity, 1));
2854
+ }
2720
2855
  .border-rose-500\/30 {
2721
2856
  border-color: rgb(244 63 94 / 0.3);
2722
2857
  }
2858
+ .border-sky-500 {
2859
+ --tw-border-opacity: 1;
2860
+ border-color: rgb(14 165 233 / var(--tw-border-opacity, 1));
2861
+ }
2723
2862
  .border-sky-500\/30 {
2724
2863
  border-color: rgb(14 165 233 / 0.3);
2725
2864
  }
2726
2865
  .border-transparent {
2727
2866
  border-color: transparent;
2728
2867
  }
2868
+ .border-x-transparent {
2869
+ border-left-color: transparent;
2870
+ border-right-color: transparent;
2871
+ }
2872
+ .border-y-transparent {
2873
+ border-top-color: transparent;
2874
+ border-bottom-color: transparent;
2875
+ }
2876
+ .border-l-border {
2877
+ --tw-border-opacity: 1;
2878
+ border-left-color: hsl(var(--border) / var(--tw-border-opacity, 1));
2879
+ }
2880
+ .border-r-border {
2881
+ --tw-border-opacity: 1;
2882
+ border-right-color: hsl(var(--border) / var(--tw-border-opacity, 1));
2883
+ }
2884
+ .border-t-foreground {
2885
+ --tw-border-opacity: 1;
2886
+ border-top-color: hsl(var(--foreground) / var(--tw-border-opacity, 1));
2887
+ }
2729
2888
  .bg-accent {
2730
2889
  --tw-bg-opacity: 1;
2731
2890
  background-color: hsl(var(--accent) / var(--tw-bg-opacity, 1));
2732
2891
  }
2892
+ .bg-accent\/15 {
2893
+ background-color: hsl(var(--accent) / 0.15);
2894
+ }
2895
+ .bg-amber-500 {
2896
+ --tw-bg-opacity: 1;
2897
+ background-color: rgb(245 158 11 / var(--tw-bg-opacity, 1));
2898
+ }
2733
2899
  .bg-amber-500\/10 {
2734
2900
  background-color: rgb(245 158 11 / 0.1);
2735
2901
  }
@@ -2752,6 +2918,13 @@ html.calm .tile-glass {
2752
2918
  .bg-background\/90 {
2753
2919
  background-color: hsl(var(--background) / 0.9);
2754
2920
  }
2921
+ .bg-background\/95 {
2922
+ background-color: hsl(var(--background) / 0.95);
2923
+ }
2924
+ .bg-black {
2925
+ --tw-bg-opacity: 1;
2926
+ background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
2927
+ }
2755
2928
  .bg-black\/10 {
2756
2929
  background-color: rgb(0 0 0 / 0.1);
2757
2930
  }
@@ -2772,6 +2945,9 @@ html.calm .tile-glass {
2772
2945
  .bg-card\/70 {
2773
2946
  background-color: hsl(var(--card) / 0.7);
2774
2947
  }
2948
+ .bg-card\/80 {
2949
+ background-color: hsl(var(--card) / 0.8);
2950
+ }
2775
2951
  .bg-current {
2776
2952
  background-color: currentColor;
2777
2953
  }
@@ -2813,6 +2989,9 @@ html.calm .tile-glass {
2813
2989
  --tw-bg-opacity: 1;
2814
2990
  background-color: hsl(var(--muted) / var(--tw-bg-opacity, 1));
2815
2991
  }
2992
+ .bg-muted-foreground\/40 {
2993
+ background-color: hsl(var(--muted-foreground) / 0.4);
2994
+ }
2816
2995
  .bg-muted\/30 {
2817
2996
  background-color: hsl(var(--muted) / 0.3);
2818
2997
  }
@@ -2869,9 +3048,20 @@ html.calm .tile-glass {
2869
3048
  --tw-bg-opacity: 1;
2870
3049
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
2871
3050
  }
3051
+ .bg-white\/25 {
3052
+ background-color: rgb(255 255 255 / 0.25);
3053
+ }
2872
3054
  .bg-gradient-to-r {
2873
3055
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
2874
3056
  }
3057
+ .bg-gradient-to-t {
3058
+ background-image: linear-gradient(to top, var(--tw-gradient-stops));
3059
+ }
3060
+ .from-black\/80 {
3061
+ --tw-gradient-from: rgb(0 0 0 / 0.8) var(--tw-gradient-from-position);
3062
+ --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
3063
+ --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
3064
+ }
2875
3065
  .from-primary\/40 {
2876
3066
  --tw-gradient-from: hsl(var(--primary) / 0.4) var(--tw-gradient-from-position);
2877
3067
  --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
@@ -2882,6 +3072,10 @@ html.calm .tile-glass {
2882
3072
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
2883
3073
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
2884
3074
  }
3075
+ .via-black\/40 {
3076
+ --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
3077
+ --tw-gradient-stops: var(--tw-gradient-from), rgb(0 0 0 / 0.4) var(--tw-gradient-via-position), var(--tw-gradient-to);
3078
+ }
2885
3079
  .via-foreground\/25 {
2886
3080
  --tw-gradient-to: hsl(var(--foreground) / 0) var(--tw-gradient-to-position);
2887
3081
  --tw-gradient-stops: var(--tw-gradient-from), hsl(var(--foreground) / 0.25) var(--tw-gradient-via-position), var(--tw-gradient-to);
@@ -3007,6 +3201,10 @@ html.calm .tile-glass {
3007
3201
  padding-top: 3.5rem;
3008
3202
  padding-bottom: 3.5rem;
3009
3203
  }
3204
+ .py-16 {
3205
+ padding-top: 4rem;
3206
+ padding-bottom: 4rem;
3207
+ }
3010
3208
  .py-2 {
3011
3209
  padding-top: 0.5rem;
3012
3210
  padding-bottom: 0.5rem;
@@ -3039,6 +3237,9 @@ html.calm .tile-glass {
3039
3237
  padding-top: 2rem;
3040
3238
  padding-bottom: 2rem;
3041
3239
  }
3240
+ .pb-0\.5 {
3241
+ padding-bottom: 0.125rem;
3242
+ }
3042
3243
  .pb-1 {
3043
3244
  padding-bottom: 0.25rem;
3044
3245
  }
@@ -3057,9 +3258,15 @@ html.calm .tile-glass {
3057
3258
  .pl-2 {
3058
3259
  padding-left: 0.5rem;
3059
3260
  }
3261
+ .pl-3 {
3262
+ padding-left: 0.75rem;
3263
+ }
3060
3264
  .pl-4 {
3061
3265
  padding-left: 1rem;
3062
3266
  }
3267
+ .pl-8 {
3268
+ padding-left: 2rem;
3269
+ }
3063
3270
  .pr-1 {
3064
3271
  padding-right: 0.25rem;
3065
3272
  }
@@ -3072,9 +3279,18 @@ html.calm .tile-glass {
3072
3279
  .pr-2 {
3073
3280
  padding-right: 0.5rem;
3074
3281
  }
3282
+ .pr-4 {
3283
+ padding-right: 1rem;
3284
+ }
3285
+ .pr-8 {
3286
+ padding-right: 2rem;
3287
+ }
3075
3288
  .pt-0 {
3076
3289
  padding-top: 0px;
3077
3290
  }
3291
+ .pt-0\.5 {
3292
+ padding-top: 0.125rem;
3293
+ }
3078
3294
  .pt-1 {
3079
3295
  padding-top: 0.25rem;
3080
3296
  }
@@ -3084,6 +3300,9 @@ html.calm .tile-glass {
3084
3300
  .pt-4 {
3085
3301
  padding-top: 1rem;
3086
3302
  }
3303
+ .pt-6 {
3304
+ padding-top: 1.5rem;
3305
+ }
3087
3306
  .text-left {
3088
3307
  text-align: left;
3089
3308
  }
@@ -3202,6 +3421,10 @@ html.calm .tile-glass {
3202
3421
  .tracking-wide {
3203
3422
  letter-spacing: 0.025em;
3204
3423
  }
3424
+ .text-accent {
3425
+ --tw-text-opacity: 1;
3426
+ color: hsl(var(--accent) / var(--tw-text-opacity, 1));
3427
+ }
3205
3428
  .text-accent-foreground {
3206
3429
  --tw-text-opacity: 1;
3207
3430
  color: hsl(var(--accent-foreground) / var(--tw-text-opacity, 1));
@@ -3249,6 +3472,9 @@ html.calm .tile-glass {
3249
3472
  --tw-text-opacity: 1;
3250
3473
  color: hsl(var(--foreground) / var(--tw-text-opacity, 1));
3251
3474
  }
3475
+ .text-foreground\/80 {
3476
+ color: hsl(var(--foreground) / 0.8);
3477
+ }
3252
3478
  .text-green-600 {
3253
3479
  --tw-text-opacity: 1;
3254
3480
  color: rgb(22 163 74 / var(--tw-text-opacity, 1));
@@ -3302,6 +3528,16 @@ html.calm .tile-glass {
3302
3528
  --tw-text-opacity: 1;
3303
3529
  color: rgb(14 165 233 / var(--tw-text-opacity, 1));
3304
3530
  }
3531
+ .text-transparent {
3532
+ color: transparent;
3533
+ }
3534
+ .text-white {
3535
+ --tw-text-opacity: 1;
3536
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
3537
+ }
3538
+ .text-white\/85 {
3539
+ color: rgb(255 255 255 / 0.85);
3540
+ }
3305
3541
  .underline {
3306
3542
  text-decoration-line: underline;
3307
3543
  }
@@ -3445,6 +3681,10 @@ html.calm .tile-glass {
3445
3681
  --tw-blur: blur(64px);
3446
3682
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
3447
3683
  }
3684
+ .blur-\[1px\] {
3685
+ --tw-blur: blur(1px);
3686
+ filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
3687
+ }
3448
3688
  .blur-lg {
3449
3689
  --tw-blur: blur(16px);
3450
3690
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
@@ -3684,6 +3924,14 @@ html.calm .tile-glass {
3684
3924
  --tw-translate-y: -0.125rem;
3685
3925
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
3686
3926
  }
3927
+ .hover\:scale-105:hover {
3928
+ --tw-scale-x: 1.05;
3929
+ --tw-scale-y: 1.05;
3930
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
3931
+ }
3932
+ .hover\:border-emerald-500\/60:hover {
3933
+ border-color: rgb(16 185 129 / 0.6);
3934
+ }
3687
3935
  .hover\:border-primary:hover {
3688
3936
  --tw-border-opacity: 1;
3689
3937
  border-color: hsl(var(--primary) / var(--tw-border-opacity, 1));
@@ -3796,6 +4044,15 @@ html.calm .tile-glass {
3796
4044
  outline: 2px solid transparent;
3797
4045
  outline-offset: 2px;
3798
4046
  }
4047
+ .focus-visible\:outline:focus-visible {
4048
+ outline-style: solid;
4049
+ }
4050
+ .focus-visible\:outline-2:focus-visible {
4051
+ outline-width: 2px;
4052
+ }
4053
+ .focus-visible\:outline-ring:focus-visible {
4054
+ outline-color: hsl(var(--ring) / 1);
4055
+ }
3799
4056
  .focus-visible\:ring-2:focus-visible {
3800
4057
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
3801
4058
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -3809,6 +4066,9 @@ html.calm .tile-glass {
3809
4066
  --tw-ring-opacity: 1;
3810
4067
  --tw-ring-color: hsl(var(--ring) / var(--tw-ring-opacity, 1));
3811
4068
  }
4069
+ .focus-visible\:ring-ring\/30:focus-visible {
4070
+ --tw-ring-color: hsl(var(--ring) / 0.3);
4071
+ }
3812
4072
  .focus-visible\:ring-ring\/40:focus-visible {
3813
4073
  --tw-ring-color: hsl(var(--ring) / 0.4);
3814
4074
  }
@@ -3817,6 +4077,11 @@ html.calm .tile-glass {
3817
4077
  --tw-scale-y: .9;
3818
4078
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
3819
4079
  }
4080
+ .active\:scale-95:active {
4081
+ --tw-scale-x: .95;
4082
+ --tw-scale-y: .95;
4083
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4084
+ }
3820
4085
  .active\:scale-\[0\.97\]:active {
3821
4086
  --tw-scale-x: 0.97;
3822
4087
  --tw-scale-y: 0.97;
@@ -3854,6 +4119,11 @@ html.calm .tile-glass {
3854
4119
  --tw-translate-x: 100%;
3855
4120
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
3856
4121
  }
4122
+ .group:hover .group-hover\:scale-105 {
4123
+ --tw-scale-x: 1.05;
4124
+ --tw-scale-y: 1.05;
4125
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4126
+ }
3857
4127
  .group\/block:hover .group-hover\/block\:opacity-100 {
3858
4128
  opacity: 1;
3859
4129
  }
@@ -3970,6 +4240,14 @@ html.calm .tile-glass {
3970
4240
  white-space: normal;
3971
4241
  }
3972
4242
 
4243
+ .sm\:left-4 {
4244
+ left: 1rem;
4245
+ }
4246
+
4247
+ .sm\:right-4 {
4248
+ right: 1rem;
4249
+ }
4250
+
3973
4251
  .sm\:col-span-2 {
3974
4252
  grid-column: span 2 / span 2;
3975
4253
  }
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export declare const A4UI_VERSION = "0.32.0";
1
+ export declare const A4UI_VERSION = "0.34.0";
2
2
  export { cn } from './lib/cn';
3
3
  export { useTheme, toggleTheme, setTheme, storedTheme, applyTheme, toggled, type Theme } from './lib/theme';
4
4
  export { useEffects, isCalm, setEffects } from './lib/effects';
@@ -125,6 +125,30 @@ export { Dock, type DockItem, type DockProps } from './ui/Dock';
125
125
  export { AnimatedBeam, type AnimatedBeamProps } from './ui/AnimatedBeam';
126
126
  export { BorderBeam, type BorderBeamProps } from './ui/BorderBeam';
127
127
  export { Meteors, type MeteorsProps } from './ui/Meteors';
128
+ export { ReasoningTrace, type ReasoningTraceProps } from './ui/ReasoningTrace';
129
+ export { ToolCallTimeline, type ToolCall, type ToolCallStatus, type ToolCallTimelineProps, } from './ui/ToolCallTimeline';
130
+ export { DiffViewer, type DiffLine, type DiffViewerProps } from './ui/DiffViewer';
131
+ export { ModelPicker, type ModelOption, type ModelPickerProps } from './ui/ModelPicker';
132
+ export { UsageMeter, type UsageMeterProps } from './ui/UsageMeter';
133
+ export { SuggestionChips, type SuggestionChipsProps } from './ui/SuggestionChips';
134
+ export { Callout, type CalloutTone, type CalloutProps } from './ui/Callout';
135
+ export { Snippet, type SnippetProps } from './ui/Snippet';
136
+ export { Globe, type GlobeMarker, type GlobeArc, type GlobeProps } from './ui/Globe';
137
+ export { WorldMap, type WorldMapPoint, type WorldMapConnection, type WorldMapProps } from './ui/WorldMap';
138
+ export { Confetti, fireConfetti, type ConfettiProps } from './ui/Confetti';
139
+ export { CursorTrail, type CursorTrailProps } from './ui/CursorTrail';
140
+ export { Kanban, type KanbanCard, type KanbanColumn, type KanbanProps } from './ui/Kanban';
141
+ export { GanttChart, type GanttTask, type GanttChartProps } from './ui/GanttChart';
142
+ export { TreeTable, type TreeTableColumn, type TreeTableRow, type TreeTableProps } from './ui/TreeTable';
143
+ export { PivotTable, type PivotDatum, type PivotTableProps } from './ui/PivotTable';
144
+ export { OnboardingChecklist, type OnboardingStep, type OnboardingChecklistProps, } from './ui/OnboardingChecklist';
145
+ export { CouponField, type CouponFieldProps } from './ui/CouponField';
146
+ export { Lightbox, type LightboxImage, type LightboxProps } from './ui/Lightbox';
147
+ export { VideoPlayerShell, type VideoPlayerShellProps } from './ui/VideoPlayerShell';
148
+ export { AudioWaveform, type AudioWaveformProps } from './ui/AudioWaveform';
149
+ export { Lamp, type LampProps } from './ui/Lamp';
150
+ export { FollowingPointer, type FollowingPointerProps } from './ui/FollowingPointer';
151
+ export { SheetSnap, type SheetSnapProps } from './ui/SheetSnap';
128
152
  export { CopyButton, type CopyButtonProps, PlayPauseButton, type PlayPauseButtonProps, MuteButton, type MuteButtonProps, LockButton, type LockButtonProps, ThemeMorphButton, type ThemeMorphButtonProps, } from './ui/MorphPresets';
129
153
  export { CodeTabs, type CodeTabsProps, type CodeTab } from './ui/CodeTabs';
130
154
  export { PillSearch, type PillSearchProps, type PillField } from './ui/PillSearch';