@tempots/beatui 0.32.2 → 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 (54) hide show
  1. package/README.md +9 -0
  2. package/dist/{2019-BMZkvreo.cjs → 2019-DJeW9RI7.cjs} +1 -1
  3. package/dist/{2019-BAbSTPyW.js → 2019-Dmseo7Cq.js} +2 -2
  4. package/dist/{2020-COaJ7nGc.cjs → 2020-BySxLQc5.cjs} +1 -1
  5. package/dist/{2020-BQNEk3m-.js → 2020-I1mnGGtD.js} +2 -2
  6. package/dist/auth/index.cjs.js +1 -1
  7. package/dist/auth/index.es.js +27 -27
  8. package/dist/beatui.css +95 -11
  9. package/dist/beatui.tailwind.css +95 -11
  10. package/dist/hls-B7ZdiUxL.js +21734 -0
  11. package/dist/hls-C6lKM-CG.cjs +40 -0
  12. package/dist/{index-DqeaEUPG.cjs → index-BBIdmCak.cjs} +1 -1
  13. package/dist/{index-CDOHHPwQ.js → index-BXjEbt8G.js} +2 -2
  14. package/dist/{index-1_pssujS.cjs → index-CBc0q0zl.cjs} +2 -2
  15. package/dist/{index-CFh4D56e.cjs → index-Ct2_ulan.cjs} +1 -1
  16. package/dist/{index-DfmwsIle.js → index-D-CBfcZj.js} +37 -35
  17. package/dist/{index-E76KKV9V.js → index-DbQzJti7.js} +1 -1
  18. package/dist/{index-B4irUWVb.cjs → index-HIb25Ti2.cjs} +1 -1
  19. package/dist/{index-Caetcp0r.js → index-xdCnysNz.js} +1 -1
  20. package/dist/index.cjs.js +4 -4
  21. package/dist/index.es.js +2202 -1766
  22. package/dist/json-schema/index.cjs.js +1 -1
  23. package/dist/json-schema/index.es.js +1 -1
  24. package/dist/{modal-CepbiM3u.cjs → modal-AFhB4rIq.cjs} +1 -1
  25. package/dist/{modal-eY-3j_zS.js → modal-Dm61yY5i.js} +2 -2
  26. package/dist/monaco/index.cjs.js +1 -1
  27. package/dist/monaco/index.es.js +2 -2
  28. package/dist/{notice-Ct8ZHvwq.js → notice-Cd9ElXwb.js} +234 -234
  29. package/dist/notice-len8sDjL.cjs +2 -0
  30. package/dist/prosemirror/index.cjs.js +1 -1
  31. package/dist/prosemirror/index.es.js +1 -1
  32. package/dist/theme-B5pmbvQ_.js +37 -0
  33. package/dist/theme-Dt6lCAvY.cjs +1 -0
  34. package/dist/timer-DK_yKNwE.cjs +1 -0
  35. package/dist/timer-DzWb416P.js +51 -0
  36. package/dist/types/components/beatui.d.ts +2 -1
  37. package/dist/types/components/form/controller/color-controller.d.ts +1 -1
  38. package/dist/types/components/form/controller/controller.d.ts +4 -4
  39. package/dist/types/components/form/controller/union-controller.d.ts +1 -1
  40. package/dist/types/components/media/base-video-player.d.ts +77 -0
  41. package/dist/types/components/media/index.d.ts +1 -0
  42. package/dist/types/components/overlay/index.d.ts +1 -0
  43. package/dist/types/components/overlay/lightbox.d.ts +22 -0
  44. package/dist/types/components/theme/theme.d.ts +1 -0
  45. package/dist/types/index.d.ts +1 -0
  46. package/dist/utils-BetBqtiV.cjs +1 -0
  47. package/dist/{utils-CuD-_CDx.js → utils-g5YCiiS6.js} +8 -8
  48. package/package.json +3 -1
  49. package/dist/notice-cpODDUvJ.cjs +0 -2
  50. package/dist/theme-B7C5kIJj.cjs +0 -1
  51. package/dist/theme-DsQOxXW1.js +0 -34
  52. package/dist/timer-BdH4cK6a.cjs +0 -1
  53. package/dist/timer-CQlK5LhW.js +0 -47
  54. package/dist/utils-CCAYvnZh.cjs +0 -1
package/dist/beatui.css CHANGED
@@ -5057,6 +5057,45 @@ export type OverlayMode = 'capturing' | 'non-capturing' */
5057
5057
  backdrop-filter: blur(4px);
5058
5058
  }
5059
5059
 
5060
+ /* Lightbox component */
5061
+
5062
+ .bc-lightbox {
5063
+ position: absolute;
5064
+ inset: 0;
5065
+ display: block;
5066
+ }
5067
+
5068
+ .bc-lightbox__close {
5069
+ position: absolute;
5070
+ top: var(--spacing-2, 16px);
5071
+ right: var(--spacing-2, 16px);
5072
+ z-index: calc(var(--z-index-overlay, 1000) + 1);
5073
+ border-radius: 100%;
5074
+ padding: var(--spacing-base, 4px);
5075
+ background-color: color-mix(in srgb, var(--color-gray-100) 80%, transparent);
5076
+ color: var(--color-gray-900);
5077
+ }
5078
+
5079
+ .bc-lightbox__viewport {
5080
+ position: absolute;
5081
+ inset: 0;
5082
+ display: flex;
5083
+ align-items: center;
5084
+ justify-content: center;
5085
+ /* The padding here is set inline by the component to sync with measurement */
5086
+ box-sizing: border-box;
5087
+ }
5088
+
5089
+ .bc-lightbox__content {
5090
+ /* Capped to viewport; no transform scaling */
5091
+ max-width: 100%;
5092
+ max-height: 100%;
5093
+ overflow: hidden;
5094
+ display: block;
5095
+ box-shadow: var(--shadow-overlay, var(--shadow-xl));
5096
+ border-radius: var(--radius-lg);
5097
+ }
5098
+
5060
5099
  .bc-panel {
5061
5100
  --panel-bg: var(--bg-surface-light);
5062
5101
  --panel-bg-dark: var(--bg-surface-dark);
@@ -6767,9 +6806,14 @@ span.bc-sidebar-link {
6767
6806
  color: var(--tabs-filled-inactive-text);
6768
6807
  border-radius: 0;
6769
6808
  }
6770
- .bc-tabs--variant-filled .bc-tab:hover:not(.bc-tab--disabled):not(.bc-tab--active),
6771
- .bc-tabs--variant-filled .bc-tab:focus-visible:not(.bc-tab--disabled):not(.bc-tab--active) {
6772
- background-color: var(--tabs-filled-inactive-bg-hover, var(--tabs-filled-inactive-bg));
6809
+ .bc-tabs--variant-filled
6810
+ .bc-tab:hover:not(.bc-tab--disabled):not(.bc-tab--active),
6811
+ .bc-tabs--variant-filled
6812
+ .bc-tab:focus-visible:not(.bc-tab--disabled):not(.bc-tab--active) {
6813
+ background-color: var(
6814
+ --tabs-filled-inactive-bg-hover,
6815
+ var(--tabs-filled-inactive-bg)
6816
+ );
6773
6817
  color: var(--tabs-filled-inactive-text, var(--color-white));
6774
6818
  }
6775
6819
  .bc-tabs--variant-filled .bc-tab--active {
@@ -6802,7 +6846,8 @@ span.bc-sidebar-link {
6802
6846
  background-color: var(--color-base-50);
6803
6847
  border: 1px solid var(--color-base-300);
6804
6848
  border-bottom: 1px solid var(--color-base-300);
6805
- border-radius: var(--radius-control-sm, var(--radius-sm)) var(--radius-control-sm, var(--radius-sm)) 0 0;
6849
+ border-radius: var(--radius-control-sm, var(--radius-sm))
6850
+ var(--radius-control-sm, var(--radius-sm)) 0 0;
6806
6851
  }
6807
6852
  .bc-tabs--variant-outline .bc-tab--active {
6808
6853
  background-color: var(--color-white);
@@ -6833,13 +6878,18 @@ span.bc-sidebar-link {
6833
6878
  background-color: var(--tabs-filled-active-bg-dark, var(--color-white));
6834
6879
  color: var(--tabs-filled-active-text-dark);
6835
6880
  }
6836
- .b-dark .bc-tabs--variant-filled .bc-tab:hover:not(.bc-tab--disabled):not(.bc-tab--active),
6837
- .b-dark .bc-tabs--variant-filled .bc-tab:focus-visible:not(.bc-tab--disabled):not(.bc-tab--active) {
6838
- background-color: var(--tabs-filled-inactive-bg-dark-hover, var(--tabs-filled-inactive-bg-dark));
6881
+ .b-dark
6882
+ .bc-tabs--variant-filled
6883
+ .bc-tab:hover:not(.bc-tab--disabled):not(.bc-tab--active),
6884
+ .b-dark
6885
+ .bc-tabs--variant-filled
6886
+ .bc-tab:focus-visible:not(.bc-tab--disabled):not(.bc-tab--active) {
6887
+ background-color: var(
6888
+ --tabs-filled-inactive-bg-dark-hover,
6889
+ var(--tabs-filled-inactive-bg-dark)
6890
+ );
6839
6891
  }
6840
6892
 
6841
-
6842
-
6843
6893
  .b-dark .bc-tabs--variant-outline .bc-tab {
6844
6894
  background-color: var(--color-base-800);
6845
6895
  border-color: var(--color-base-600);
@@ -6850,7 +6900,6 @@ span.bc-sidebar-link {
6850
6900
  border-bottom-color: var(--color-base-900);
6851
6901
  }
6852
6902
 
6853
-
6854
6903
  .bc-tooltip {
6855
6904
  background-color: var(--color-neutral-900);
6856
6905
  color: var(--color-neutral-50);
@@ -7191,6 +7240,40 @@ span.bc-sidebar-link {
7191
7240
  flex-shrink: 0;
7192
7241
  }
7193
7242
 
7243
+ /* Minimal optional controls for VideoPlayer wrapper */
7244
+
7245
+ .bc-video-player {
7246
+ position: relative;
7247
+ display: block;
7248
+ }
7249
+
7250
+ .bc-video-player__controls {
7251
+ position: absolute;
7252
+ left: 0;
7253
+ right: 0;
7254
+ bottom: 0;
7255
+ display: flex;
7256
+ align-items: center;
7257
+ gap: var(--spacing-2, 8px);
7258
+ padding: var(--spacing-2, 8px);
7259
+ background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
7260
+ }
7261
+
7262
+ .bc-video-player__button {
7263
+ appearance: none;
7264
+ background: rgba(255, 255, 255, 0.85);
7265
+ color: #111;
7266
+ border: none;
7267
+ border-radius: var(--radius-sm, 4px);
7268
+ padding: 2px 6px;
7269
+ cursor: pointer;
7270
+ }
7271
+
7272
+ .bc-video-player__timeline,
7273
+ .bc-video-player__volume {
7274
+ flex: 1 1 auto;
7275
+ }
7276
+
7194
7277
 
7195
7278
  /* Ribbon component - diagonal label on the top-right corner */
7196
7279
 
@@ -7208,7 +7291,8 @@ span.bc-sidebar-link {
7208
7291
  top: 0;
7209
7292
  left: 100%;
7210
7293
  /* Keep the band centerline on the corner regardless of width */
7211
- transform: translate(-50%, -50%) rotate(var(--ribbon-angle, 45deg)) translate(var(--ribbon-inset, 0px), var(--ribbon-offset, 0px));
7294
+ transform: translate(-50%, -50%) rotate(var(--ribbon-angle, 45deg))
7295
+ translate(var(--ribbon-inset, 0px), var(--ribbon-offset, 0px));
7212
7296
  display: flex;
7213
7297
  justify-content: center;
7214
7298
  background: var(--ribbon-bg);
package/dist/beatui.tailwind.css CHANGED
@@ -4732,6 +4732,45 @@ export type OverlayMode = 'capturing' | 'non-capturing' */
4732
4732
  backdrop-filter: blur(4px);
4733
4733
  }
4734
4734
 
4735
+ /* Lightbox component */
4736
+
4737
+ .bc-lightbox {
4738
+ position: absolute;
4739
+ inset: 0;
4740
+ display: block;
4741
+ }
4742
+
4743
+ .bc-lightbox__close {
4744
+ position: absolute;
4745
+ top: var(--spacing-2, 16px);
4746
+ right: var(--spacing-2, 16px);
4747
+ z-index: calc(var(--z-index-overlay, 1000) + 1);
4748
+ border-radius: 100%;
4749
+ padding: var(--spacing-base, 4px);
4750
+ background-color: color-mix(in srgb, var(--color-gray-100) 80%, transparent);
4751
+ color: var(--color-gray-900);
4752
+ }
4753
+
4754
+ .bc-lightbox__viewport {
4755
+ position: absolute;
4756
+ inset: 0;
4757
+ display: flex;
4758
+ align-items: center;
4759
+ justify-content: center;
4760
+ /* The padding here is set inline by the component to sync with measurement */
4761
+ box-sizing: border-box;
4762
+ }
4763
+
4764
+ .bc-lightbox__content {
4765
+ /* Capped to viewport; no transform scaling */
4766
+ max-width: 100%;
4767
+ max-height: 100%;
4768
+ overflow: hidden;
4769
+ display: block;
4770
+ box-shadow: var(--shadow-overlay, var(--shadow-xl));
4771
+ border-radius: var(--radius-lg);
4772
+ }
4773
+
4735
4774
  .bc-panel {
4736
4775
  --panel-bg: var(--bg-surface-light);
4737
4776
  --panel-bg-dark: var(--bg-surface-dark);
@@ -6442,9 +6481,14 @@ span.bc-sidebar-link {
6442
6481
  color: var(--tabs-filled-inactive-text);
6443
6482
  border-radius: 0;
6444
6483
  }
6445
- .bc-tabs--variant-filled .bc-tab:hover:not(.bc-tab--disabled):not(.bc-tab--active),
6446
- .bc-tabs--variant-filled .bc-tab:focus-visible:not(.bc-tab--disabled):not(.bc-tab--active) {
6447
- background-color: var(--tabs-filled-inactive-bg-hover, var(--tabs-filled-inactive-bg));
6484
+ .bc-tabs--variant-filled
6485
+ .bc-tab:hover:not(.bc-tab--disabled):not(.bc-tab--active),
6486
+ .bc-tabs--variant-filled
6487
+ .bc-tab:focus-visible:not(.bc-tab--disabled):not(.bc-tab--active) {
6488
+ background-color: var(
6489
+ --tabs-filled-inactive-bg-hover,
6490
+ var(--tabs-filled-inactive-bg)
6491
+ );
6448
6492
  color: var(--tabs-filled-inactive-text, var(--color-white));
6449
6493
  }
6450
6494
  .bc-tabs--variant-filled .bc-tab--active {
@@ -6477,7 +6521,8 @@ span.bc-sidebar-link {
6477
6521
  background-color: var(--color-base-50);
6478
6522
  border: 1px solid var(--color-base-300);
6479
6523
  border-bottom: 1px solid var(--color-base-300);
6480
- border-radius: var(--radius-control-sm, var(--radius-sm)) var(--radius-control-sm, var(--radius-sm)) 0 0;
6524
+ border-radius: var(--radius-control-sm, var(--radius-sm))
6525
+ var(--radius-control-sm, var(--radius-sm)) 0 0;
6481
6526
  }
6482
6527
  .bc-tabs--variant-outline .bc-tab--active {
6483
6528
  background-color: var(--color-white);
@@ -6508,13 +6553,18 @@ span.bc-sidebar-link {
6508
6553
  background-color: var(--tabs-filled-active-bg-dark, var(--color-white));
6509
6554
  color: var(--tabs-filled-active-text-dark);
6510
6555
  }
6511
- .b-dark .bc-tabs--variant-filled .bc-tab:hover:not(.bc-tab--disabled):not(.bc-tab--active),
6512
- .b-dark .bc-tabs--variant-filled .bc-tab:focus-visible:not(.bc-tab--disabled):not(.bc-tab--active) {
6513
- background-color: var(--tabs-filled-inactive-bg-dark-hover, var(--tabs-filled-inactive-bg-dark));
6556
+ .b-dark
6557
+ .bc-tabs--variant-filled
6558
+ .bc-tab:hover:not(.bc-tab--disabled):not(.bc-tab--active),
6559
+ .b-dark
6560
+ .bc-tabs--variant-filled
6561
+ .bc-tab:focus-visible:not(.bc-tab--disabled):not(.bc-tab--active) {
6562
+ background-color: var(
6563
+ --tabs-filled-inactive-bg-dark-hover,
6564
+ var(--tabs-filled-inactive-bg-dark)
6565
+ );
6514
6566
  }
6515
6567
 
6516
-
6517
-
6518
6568
  .b-dark .bc-tabs--variant-outline .bc-tab {
6519
6569
  background-color: var(--color-base-800);
6520
6570
  border-color: var(--color-base-600);
@@ -6525,7 +6575,6 @@ span.bc-sidebar-link {
6525
6575
  border-bottom-color: var(--color-base-900);
6526
6576
  }
6527
6577
 
6528
-
6529
6578
  .bc-tooltip {
6530
6579
  background-color: var(--color-neutral-900);
6531
6580
  color: var(--color-neutral-50);
@@ -6866,6 +6915,40 @@ span.bc-sidebar-link {
6866
6915
  flex-shrink: 0;
6867
6916
  }
6868
6917
 
6918
+ /* Minimal optional controls for VideoPlayer wrapper */
6919
+
6920
+ .bc-video-player {
6921
+ position: relative;
6922
+ display: block;
6923
+ }
6924
+
6925
+ .bc-video-player__controls {
6926
+ position: absolute;
6927
+ left: 0;
6928
+ right: 0;
6929
+ bottom: 0;
6930
+ display: flex;
6931
+ align-items: center;
6932
+ gap: var(--spacing-2, 8px);
6933
+ padding: var(--spacing-2, 8px);
6934
+ background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
6935
+ }
6936
+
6937
+ .bc-video-player__button {
6938
+ appearance: none;
6939
+ background: rgba(255, 255, 255, 0.85);
6940
+ color: #111;
6941
+ border: none;
6942
+ border-radius: var(--radius-sm, 4px);
6943
+ padding: 2px 6px;
6944
+ cursor: pointer;
6945
+ }
6946
+
6947
+ .bc-video-player__timeline,
6948
+ .bc-video-player__volume {
6949
+ flex: 1 1 auto;
6950
+ }
6951
+
6869
6952
 
6870
6953
  /* Ribbon component - diagonal label on the top-right corner */
6871
6954
 
@@ -6883,7 +6966,8 @@ span.bc-sidebar-link {
6883
6966
  top: 0;
6884
6967
  left: 100%;
6885
6968
  /* Keep the band centerline on the corner regardless of width */
6886
- transform: translate(-50%, -50%) rotate(var(--ribbon-angle, 45deg)) translate(var(--ribbon-inset, 0px), var(--ribbon-offset, 0px));
6969
+ transform: translate(-50%, -50%) rotate(var(--ribbon-angle, 45deg))
6970
+ translate(var(--ribbon-inset, 0px), var(--ribbon-offset, 0px));
6887
6971
  display: flex;
6888
6972
  justify-content: center;
6889
6973
  background: var(--ribbon-bg);