@anker-in/headless-ui 0.0.25 → 0.0.26

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 (42) hide show
  1. package/CONTRIBUTING.md +2 -2
  2. package/dist/cjs/components/button.js +1 -1
  3. package/dist/cjs/components/button.js.map +2 -2
  4. package/dist/cjs/components/heading.d.ts +1 -1
  5. package/dist/cjs/components/heading.js +1 -1
  6. package/dist/cjs/components/heading.js.map +3 -3
  7. package/dist/cjs/components/text.d.ts +2 -1
  8. package/dist/cjs/components/text.js +1 -1
  9. package/dist/cjs/components/text.js.map +3 -3
  10. package/dist/cjs/icons/spinner.js +1 -1
  11. package/dist/cjs/icons/spinner.js.map +2 -2
  12. package/dist/cjs/stories/heading.stories.d.ts +2 -2
  13. package/dist/cjs/stories/heading.stories.js +1 -1
  14. package/dist/cjs/stories/heading.stories.js.map +2 -2
  15. package/dist/cjs/stories/text.stories.d.ts +12 -3
  16. package/dist/cjs/stories/text.stories.js +1 -1
  17. package/dist/cjs/stories/text.stories.js.map +3 -3
  18. package/dist/esm/components/button.js +1 -1
  19. package/dist/esm/components/button.js.map +2 -2
  20. package/dist/esm/components/heading.d.ts +1 -1
  21. package/dist/esm/components/heading.js +1 -1
  22. package/dist/esm/components/heading.js.map +3 -3
  23. package/dist/esm/components/text.d.ts +2 -1
  24. package/dist/esm/components/text.js +1 -1
  25. package/dist/esm/components/text.js.map +3 -3
  26. package/dist/esm/icons/spinner.js +1 -1
  27. package/dist/esm/icons/spinner.js.map +2 -2
  28. package/dist/esm/stories/heading.stories.d.ts +2 -2
  29. package/dist/esm/stories/heading.stories.js +1 -1
  30. package/dist/esm/stories/heading.stories.js.map +2 -2
  31. package/dist/esm/stories/text.stories.d.ts +12 -3
  32. package/dist/esm/stories/text.stories.js +2 -2
  33. package/dist/esm/stories/text.stories.js.map +3 -3
  34. package/package.json +1 -1
  35. package/src/components/button.tsx +6 -7
  36. package/src/components/heading.tsx +5 -5
  37. package/src/components/text.tsx +13 -5
  38. package/src/icons/spinner.tsx +0 -1
  39. package/src/stories/heading.stories.tsx +2 -2
  40. package/src/stories/text.stories.tsx +28 -8
  41. package/src/styles/global.css +13 -15
  42. package/style.css +34 -47
package/style.css CHANGED
@@ -515,9 +515,6 @@ video {
515
515
  .\!ai-pointer-events-none {
516
516
  pointer-events: none !important;
517
517
  }
518
- .\!ai-pointer-events-auto {
519
- pointer-events: auto !important;
520
- }
521
518
  .ai-fixed {
522
519
  position: fixed;
523
520
  }
@@ -645,9 +642,6 @@ video {
645
642
  .\!ai-cursor-default {
646
643
  cursor: default !important;
647
644
  }
648
- .\!ai-cursor-not-allowed {
649
- cursor: not-allowed !important;
650
- }
651
645
  .\!ai-select-none {
652
646
  -webkit-user-select: none !important;
653
647
  -moz-user-select: none !important;
@@ -706,9 +700,6 @@ video {
706
700
  .\!ai-border-none {
707
701
  border-style: none !important;
708
702
  }
709
- .ai-border-btn-secondary-foreground {
710
- border-color: var(--btn-text-secondary-color);
711
- }
712
703
  .ai-border-primary {
713
704
  border-color: var(--brand-color-1);
714
705
  }
@@ -730,9 +721,6 @@ video {
730
721
  .ai-bg-btn-secondary {
731
722
  background-color: var(--btn-bg-secondary-color);
732
723
  }
733
- .ai-bg-btn-secondary-active {
734
- background-color: var(--btn-bg-secondary-active-color);
735
- }
736
724
  .ai-bg-skeleton {
737
725
  background-color: var(--tertiary-color);
738
726
  }
@@ -749,8 +737,8 @@ video {
749
737
  .ai-stroke-btn-primary-foreground {
750
738
  stroke: var(--btn-text-color);
751
739
  }
752
- .ai-stroke-btn-secondary {
753
- stroke: var(--btn-bg-secondary-color);
740
+ .ai-stroke-btn-secondary-foreground {
741
+ stroke: var(--btn-text-secondary-color);
754
742
  }
755
743
  .ai-stroke-primary {
756
744
  stroke: var(--brand-color-1);
@@ -765,6 +753,10 @@ video {
765
753
  padding-left: 0.75rem;
766
754
  padding-right: 0.75rem;
767
755
  }
756
+ .ai-px-4 {
757
+ padding-left: 1rem;
758
+ padding-right: 1rem;
759
+ }
768
760
  .ai-px-8 {
769
761
  padding-left: 2rem;
770
762
  padding-right: 2rem;
@@ -773,17 +765,13 @@ video {
773
765
  padding-left: 10px;
774
766
  padding-right: 10px;
775
767
  }
776
- .ai-px-\[2\.625rem\] {
777
- padding-left: 2.625rem;
778
- padding-right: 2.625rem;
779
- }
780
768
  .ai-py-1 {
781
769
  padding-top: 0.25rem;
782
770
  padding-bottom: 0.25rem;
783
771
  }
784
- .ai-py-\[0\.625rem\] {
785
- padding-top: 0.625rem;
786
- padding-bottom: 0.625rem;
772
+ .ai-py-2 {
773
+ padding-top: 0.5rem;
774
+ padding-bottom: 0.5rem;
787
775
  }
788
776
  .ai-text-left {
789
777
  text-align: left;
@@ -854,9 +842,21 @@ video {
854
842
  .ai-font-semibold {
855
843
  font-weight: 600;
856
844
  }
845
+ .ai-leading-loose {
846
+ line-height: var(--line-height-loose);
847
+ }
857
848
  .ai-leading-none {
858
849
  line-height: 1;
859
850
  }
851
+ .ai-leading-normal {
852
+ line-height: var(--line-height-normal);
853
+ }
854
+ .ai-leading-tight {
855
+ line-height: var(--line-height-tight);
856
+ }
857
+ .ai-tracking {
858
+ letter-spacing: var(--letter-spacing-normal);
859
+ }
860
860
  .ai-tracking-tight {
861
861
  letter-spacing: -0.025em;
862
862
  }
@@ -869,9 +869,6 @@ video {
869
869
  .ai-text-btn-primary-foreground {
870
870
  color: var(--btn-text-color);
871
871
  }
872
- .ai-text-btn-secondary-disabled-foreground {
873
- color: var(--btn-border-secondary-border-color);
874
- }
875
872
  .ai-text-btn-secondary-foreground {
876
873
  color: var(--btn-text-secondary-color);
877
874
  }
@@ -989,25 +986,26 @@ video {
989
986
  --masks-color-2: hsla(0, 0%, 0%, 0.85);
990
987
  }
991
988
 
992
-
993
989
  :root[data-brand-theme='anker'] {
994
- --btn-bg-color: #00BEFA;
990
+ --btn-bg-color: #00befa;
995
991
  --btn-text-color: #ffffff;
996
- --btn-bg-active-color: #00AAFF;
997
- /* --btn-bg-disabled-color: #1D3E4F; */
998
- --btn-bg-disabled-color: rgba(29,62,79,0.7);
992
+ --btn-bg-active-color: #00aaff;
993
+ --btn-bg-disabled-color: rgba(29, 62, 79, 0.7);
999
994
 
1000
995
  --btn-bg-secondary-color: #ffffff;
1001
- --btn-text-secondary-color: #1D1D1F;
1002
- --btn-bg-secondary-active-color: #6E6E73;
1003
- --btn-bg-secondary-disabled-color: rgba(221,221,221,0.7);
1004
- --btn-border-secondary-border-color:#acacac;
1005
-
1006
- --btn-radius: 9999px;
996
+ --btn-text-secondary-color: #1d1d1f;
997
+ --btn-bg-secondary-active-color: #6e6e73;
998
+ --btn-bg-secondary-disabled-color: rgba(221, 221, 221, 0.7);
999
+ --btn-border-secondary-border-color: #acacac;
1007
1000
 
1008
1001
  --btn-radius: 0;
1009
-
1002
+
1010
1003
  --radius: 0em;
1004
+
1005
+ --letter-spacing-normal: -0.02em;
1006
+ --line-height-tight: 1.2;
1007
+ --line-height-normal: 1.4;
1008
+ --line-height-loose: 1.6;
1011
1009
  }
1012
1010
 
1013
1011
  :root[data-brand-theme='eufy'] {
@@ -1214,10 +1212,6 @@ video {
1214
1212
  display: block;
1215
1213
  }
1216
1214
 
1217
- .hover\:ai-border-btn-secondary-active:hover {
1218
- border-color: var(--btn-bg-secondary-active-color);
1219
- }
1220
-
1221
1215
  .hover\:\!ai-bg-btn-primary:hover {
1222
1216
  background-color: var(--btn-bg-color) !important;
1223
1217
  }
@@ -1298,10 +1292,6 @@ video {
1298
1292
  cursor: not-allowed;
1299
1293
  }
1300
1294
 
1301
- .disabled\:ai-border-btn-secondary-disabled-borderColor:disabled {
1302
- border-color: var(--btn-border-secondary-border-color);
1303
- }
1304
-
1305
1295
  .disabled\:ai-bg-btn-primary-disabled:disabled {
1306
1296
  background-color: var(--btn-bg-disabled-color);
1307
1297
  }
@@ -1362,6 +1352,3 @@ video {
1362
1352
  .\[\&\>\*\]\:\!ai-invisible>* {
1363
1353
  visibility: hidden !important;
1364
1354
  }
1365
-
1366
-
1367
-