@tempots/beatui 1.3.0 → 1.4.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 (7) hide show
  1. package/dist/beatui.css +34 -30
  2. package/dist/beatui.tailwind.css +34 -30
  3. package/dist/index.cjs.js +4 -4
  4. package/dist/index.es.js +5194 -5145
  5. package/dist/types/components/data/auto-color-badge.d.ts +60 -0
  6. package/dist/types/components/data/index.d.ts +1 -0
  7. package/package.json +1 -1
package/dist/beatui.css CHANGED
@@ -2247,6 +2247,40 @@ a:focus-visible {
2247
2247
  justify-content: center;
2248
2248
  }
2249
2249
 
2250
+ /* AutoColorBadge Component — reuses badge sizing/layout tokens */
2251
+ .bc-auto-color-badge {
2252
+ display: inline-flex;
2253
+ align-items: center;
2254
+ justify-content: center;
2255
+ gap: var(--badge-gap, var(--control-gap-md));
2256
+ border: var(--border-width-default) solid transparent;
2257
+ font-family: var(
2258
+ --font-family-default-ui,
2259
+ var(--font-ui, var(--font-body, var(--font-family-sans)))
2260
+ );
2261
+ font-size: inherit;
2262
+ line-height: var(--line-height-none);
2263
+ border-radius: var(--radius-badge, var(--radius-control, var(--radius-md)));
2264
+ transition:
2265
+ background-color var(--motion-transition-fast) var(--motion-easing-standard),
2266
+ color var(--motion-transition-fast) var(--motion-easing-standard);
2267
+ white-space: nowrap;
2268
+ }
2269
+
2270
+ /* Accessibility adjustments */
2271
+ @media (prefers-contrast: high) {
2272
+ .bc-auto-color-badge {
2273
+ border-width: var(--border-width-medium);
2274
+ border-color: currentColor;
2275
+ }
2276
+ }
2277
+
2278
+ @media (prefers-reduced-motion: reduce) {
2279
+ .bc-auto-color-badge {
2280
+ transition: none;
2281
+ }
2282
+ }
2283
+
2250
2284
  /* Avatar Component */
2251
2285
  .bc-avatar {
2252
2286
  --avatar-bg: var(--color-base-500);
@@ -17994,36 +18028,6 @@ th.bc-data-table__header--drag-over {
17994
18028
  background-color: var(--interactive-hover);
17995
18029
  }
17996
18030
 
17997
- /* Tags Filter (inline checkbox list) */
17998
- .bc-column-filter-tags {
17999
- display: flex;
18000
- flex-direction: column;
18001
- gap: var(--spacing-xs);
18002
- }
18003
-
18004
- .bc-column-filter-tags__list {
18005
- display: flex;
18006
- flex-direction: column;
18007
- gap: var(--spacing-2xs);
18008
- max-height: 200px;
18009
- overflow-y: auto;
18010
- }
18011
-
18012
- .bc-column-filter-tags__item {
18013
- display: flex;
18014
- align-items: center;
18015
- gap: var(--spacing-xs);
18016
- padding: var(--spacing-2xs) var(--spacing-xs);
18017
- cursor: pointer;
18018
- border-radius: var(--radius-control-sm);
18019
- font-size: var(--font-size-sm);
18020
- user-select: none;
18021
- }
18022
-
18023
- .bc-column-filter-tags__item:hover {
18024
- background-color: var(--interactive-hover);
18025
- }
18026
-
18027
18031
  /* Reduced motion */
18028
18032
  @media (prefers-reduced-motion: reduce) {
18029
18033
  .bc-sortable-header,
package/dist/beatui.tailwind.css CHANGED
@@ -1913,6 +1913,40 @@ a:focus-visible {
1913
1913
  justify-content: center;
1914
1914
  }
1915
1915
 
1916
+ /* AutoColorBadge Component — reuses badge sizing/layout tokens */
1917
+ .bc-auto-color-badge {
1918
+ display: inline-flex;
1919
+ align-items: center;
1920
+ justify-content: center;
1921
+ gap: var(--badge-gap, var(--control-gap-md));
1922
+ border: var(--border-width-default) solid transparent;
1923
+ font-family: var(
1924
+ --font-family-default-ui,
1925
+ var(--font-ui, var(--font-body, var(--font-family-sans)))
1926
+ );
1927
+ font-size: inherit;
1928
+ line-height: var(--line-height-none);
1929
+ border-radius: var(--radius-badge, var(--radius-control, var(--radius-md)));
1930
+ transition:
1931
+ background-color var(--motion-transition-fast) var(--motion-easing-standard),
1932
+ color var(--motion-transition-fast) var(--motion-easing-standard);
1933
+ white-space: nowrap;
1934
+ }
1935
+
1936
+ /* Accessibility adjustments */
1937
+ @media (prefers-contrast: high) {
1938
+ .bc-auto-color-badge {
1939
+ border-width: var(--border-width-medium);
1940
+ border-color: currentColor;
1941
+ }
1942
+ }
1943
+
1944
+ @media (prefers-reduced-motion: reduce) {
1945
+ .bc-auto-color-badge {
1946
+ transition: none;
1947
+ }
1948
+ }
1949
+
1916
1950
  /* Avatar Component */
1917
1951
  .bc-avatar {
1918
1952
  --avatar-bg: var(--color-base-500);
@@ -17660,36 +17694,6 @@ th.bc-data-table__header--drag-over {
17660
17694
  background-color: var(--interactive-hover);
17661
17695
  }
17662
17696
 
17663
- /* Tags Filter (inline checkbox list) */
17664
- .bc-column-filter-tags {
17665
- display: flex;
17666
- flex-direction: column;
17667
- gap: var(--spacing-xs);
17668
- }
17669
-
17670
- .bc-column-filter-tags__list {
17671
- display: flex;
17672
- flex-direction: column;
17673
- gap: var(--spacing-2xs);
17674
- max-height: 200px;
17675
- overflow-y: auto;
17676
- }
17677
-
17678
- .bc-column-filter-tags__item {
17679
- display: flex;
17680
- align-items: center;
17681
- gap: var(--spacing-xs);
17682
- padding: var(--spacing-2xs) var(--spacing-xs);
17683
- cursor: pointer;
17684
- border-radius: var(--radius-control-sm);
17685
- font-size: var(--font-size-sm);
17686
- user-select: none;
17687
- }
17688
-
17689
- .bc-column-filter-tags__item:hover {
17690
- background-color: var(--interactive-hover);
17691
- }
17692
-
17693
17697
  /* Reduced motion */
17694
17698
  @media (prefers-reduced-motion: reduce) {
17695
17699
  .bc-sortable-header,