@moontra/moonui 6.18.0 → 6.19.1
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.
- package/dist/index.js +122 -36
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +122 -36
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -5
- package/src/__tests__/cdn-iife-removed.test.ts +103 -0
- package/src/components/ui/__tests__/progress-warning-error-contrast.test.ts +331 -0
- package/src/components/ui/__tests__/progress.test.tsx +9 -2
- package/src/components/ui/__tests__/slider-secondary-contrast.test.ts +375 -0
- package/src/components/ui/__tests__/slider-warning-error-contrast.test.ts +478 -0
- package/src/components/ui/__tests__/slider.test.tsx +12 -4
- package/src/components/ui/__tests__/table.test.tsx +222 -8
- package/src/components/ui/progress.tsx +25 -2
- package/src/components/ui/slider.tsx +72 -6
- package/src/components/ui/table.tsx +88 -43
- package/dist/chunk-VXDFZPDA.global.js +0 -33
- package/dist/chunk-VXDFZPDA.global.js.map +0 -1
- package/dist/hooks/index.global.js +0 -33
- package/dist/hooks/index.global.js.map +0 -1
- package/dist/index.global.js +0 -980
- package/dist/index.global.js.map +0 -1
- package/dist/lib/theme.global.js +0 -54
- package/dist/lib/theme.global.js.map +0 -1
package/dist/index.mjs
CHANGED
|
@@ -2534,11 +2534,49 @@ var sliderRangeVariants = cva(
|
|
|
2534
2534
|
variant: {
|
|
2535
2535
|
default: "bg-foreground",
|
|
2536
2536
|
primary: "bg-primary",
|
|
2537
|
-
|
|
2537
|
+
// #389 (#372'nin birebir ardılı): range `bg-secondary` idi — track'in
|
|
2538
|
+
// (`bg-secondary/20`) AYNI yüzey token'ına basıyordu; %20 alfa track ile
|
|
2539
|
+
// tam dolgu iki temada da ~1.0 oranında kalıyor, dolu kısım görünmüyordu
|
|
2540
|
+
// (light rgb(235,239,245) → 1.12 · dark rgb(2,8,23) → 1.01).
|
|
2541
|
+
// `bg-secondary-foreground` BİLEREK seçilmedi: light'ta --primary ile aynı
|
|
2542
|
+
// hue/sat'ta yalnız ΔL=%2 (fill↔fill 1.07), dark'ta birebir --primary
|
|
2543
|
+
// değeri (210 40% 98%) — secondary varyantı primary klonuna dönerdi.
|
|
2544
|
+
// `--secondary-500` (tokens.css slate skalası, RGB üçlüsü) iki temada da
|
|
2545
|
+
// track'e ≥3:1 (WCAG 1.4.11) veren TEK kademe: light 4.63, dark 4.23
|
|
2546
|
+
// (gerçek kart #111827 üstünde 3.83; 400 light'ta 2.50 ✗, 600 dark'ta
|
|
2547
|
+
// 2.66 ✗). Skala :root'ta tanımlı olduğundan tema değişiminde sabittir;
|
|
2548
|
+
// tüketici --secondary-500'ü ezerek özelleştirebilir.
|
|
2549
|
+
// Regresyon: __tests__/slider-secondary-contrast.test.ts
|
|
2550
|
+
secondary: "bg-[rgb(var(--secondary-500))]",
|
|
2538
2551
|
accent: "bg-accent",
|
|
2539
2552
|
success: "bg-success",
|
|
2540
|
-
|
|
2541
|
-
|
|
2553
|
+
// #442 (#424/PR #440'ın slider ikizi): range `bg-warning`/`bg-error` idi —
|
|
2554
|
+
// track (`bg-warning/20` · `bg-error/20`) AYNI token'ın alfalı hâli olduğundan
|
|
2555
|
+
// LIGHT temada ayrım kayboluyordu: warning 1.835 · error 2.893 (eşik 3:1,
|
|
2556
|
+
// WCAG 1.4.11 non-text). DARK tema zaten temizdi (warning 6.97 · error 4.46).
|
|
2557
|
+
//
|
|
2558
|
+
// KÖK NEDEN: `--warning` ve `--error` tokens.css'in `.dark` bloğunda
|
|
2559
|
+
// EZİLMİYOR — iki temada aynı renk. Kardeşleri tema-uyarlanabilir olduğu
|
|
2560
|
+
// için geçiyor (`--success` light %29 → dark %36; ölçüm: success A ekseni
|
|
2561
|
+
// light 3.73 / dark 4.83). Bu iki aile o uyarlamadan yoksun.
|
|
2562
|
+
//
|
|
2563
|
+
// ÇÖZÜM: eksik tema-uyarlamasını component düzeyinde ver — light'ta skalanın
|
|
2564
|
+
// -700 kademesine in, dark'ta semantik token'a DOKUNMA (dark render bit-bit
|
|
2565
|
+
// aynı kalır, regresyon yüzeyi sıfır). Tema-KÖR bir -700 ataması dark'ı
|
|
2566
|
+
// kırardı: gerçek docs kartı (#111827) üstünde warning 2.499 ✗ · error 2.232 ✗.
|
|
2567
|
+
// Tam skala taraması (11 kademe × 2 aile × 3 zemin × 2 tema) track `/20` iken
|
|
2568
|
+
// iki temayı birden geçen kademe kümesini BOŞ buluyor → `dark:` ayrımı ZORUNLU;
|
|
2569
|
+
// #389'un tek-orta-ton (`--secondary-500`) çözümü burada uygulanamaz, çünkü
|
|
2570
|
+
// orada `--secondary` temaya göre değişiyordu. Aynı `dark:` deseni badge.tsx:51-63
|
|
2571
|
+
// ve progress.tsx:110-111'de zaten kullanılıyor.
|
|
2572
|
+
// Ölçülen sonuç — warning: light 1.835 → 4.235 ✓ · error: light 2.893 → 4.950 ✓
|
|
2573
|
+
// (dark değişmedi: 6.97 / 4.46; docs kartı 5.77 / 3.82).
|
|
2574
|
+
// Skala token'ları RGB üçlüsüdür (semantiklerin HSL'inden farklı) →
|
|
2575
|
+
// `rgb(var(--x-700))` kompozisyonu; `bg-warning-700` YAZILMADI, preset bu
|
|
2576
|
+
// ailelere sayısal skala açmıyor (#307 ölü-sınıf tuzağı).
|
|
2577
|
+
// Regresyon: __tests__/slider-warning-error-contrast.test.ts
|
|
2578
|
+
warning: "bg-[rgb(var(--warning-700))] dark:bg-warning",
|
|
2579
|
+
error: "bg-[rgb(var(--error-700))] dark:bg-error"
|
|
2542
2580
|
}
|
|
2543
2581
|
},
|
|
2544
2582
|
defaultVariants: {
|
|
@@ -2553,11 +2591,39 @@ var sliderThumbVariants = cva(
|
|
|
2553
2591
|
variant: {
|
|
2554
2592
|
default: "border-foreground bg-background",
|
|
2555
2593
|
primary: "border-primary bg-background",
|
|
2556
|
-
|
|
2594
|
+
// #407 (P2, #389'un range eksenine EK ayrı eksen): tutamacın kenarlığı
|
|
2595
|
+
// `border-secondary`, dolgusu `bg-background` idi. Bu bileşen↔sayfa-zemini
|
|
2596
|
+
// ekseni: `--secondary` light'ta neredeyse beyaz (rgb(235,239,245)), dark'ta
|
|
2597
|
+
// `--background` ile neredeyse aynı → kenarlık 1.15 (light) / 1.01 (dark)
|
|
2598
|
+
// oranında kalıyor, secondary slider'ın tutamacı zeminde kayboluyordu.
|
|
2599
|
+
// #389'da bilerek kapsam dışıydı (mevcut kusuru testle "doğru" ilan etmemek için).
|
|
2600
|
+
// Non-text UI bileşeni → WCAG 1.4.11 ≥3:1. Skala taraması bu eksende de TEK
|
|
2601
|
+
// kademe bırakıyor — `--secondary-500`: light 4.76, dark 4.23 (gerçek kart
|
|
2602
|
+
// #111827 üstünde 3.73); 400 light'ta 2.56 ✗, 600 dark'ta 2.66 ✗. Range ile
|
|
2603
|
+
// aynı kademe: tutamaç ve dolgu tek renkte okunur.
|
|
2604
|
+
// Regresyon: __tests__/slider-secondary-contrast.test.ts
|
|
2605
|
+
secondary: "border-[rgb(var(--secondary-500))] bg-background",
|
|
2557
2606
|
accent: "border-accent bg-background",
|
|
2558
2607
|
success: "border-success bg-background",
|
|
2559
|
-
|
|
2560
|
-
|
|
2608
|
+
// #442 EKSEN B (range'den FARKLI eksen: bileşen↔sayfa-zemini) — #407'de
|
|
2609
|
+
// `secondary` için açılan eksenin warning/error karşılığı. Tutamacın dolgusu
|
|
2610
|
+
// `bg-background`, yani zeminin kendisi; ayırt edilebilirliği YALNIZ kenarlık
|
|
2611
|
+
// taşır → non-text UI bileşeni, WCAG 1.4.11 ≥3:1.
|
|
2612
|
+
// ÖLÇÜLEN (eski değerler): warning light **2.133 ✗** · error light 3.781 ✓;
|
|
2613
|
+
// dark ikisi de rahat geçiyordu (9.45 / 5.33).
|
|
2614
|
+
//
|
|
2615
|
+
// `warning` KUSURLUYDU, düzeltildi. `error` bu eksende zaten geçiyordu ama
|
|
2616
|
+
// yine de aynı ifadeye çekildi: range light'ta -700'e indiği için kenarlık
|
|
2617
|
+
// `border-error`da bırakılsaydı LIGHT temada dolgu rgb(185,28,28), tutamaç
|
|
2618
|
+
// rgb(239,67,67) olurdu — düzeltmenin KENDİSİ iki-tonlu bir görünüm üretirdi.
|
|
2619
|
+
// #407'nin gerekçesi birebir geçerli: "tutamaç ve dolgu tek renkte okunur".
|
|
2620
|
+
// Değişim kontrastı düşürmüyor, artırıyor: error light 3.781 → 6.470.
|
|
2621
|
+
// Dark'ta `dark:border-*` semantik token'ı koruduğu için render bit-bit aynı.
|
|
2622
|
+
// Ölçülen sonuç — warning: light 2.133 → 4.923 ✓ · error: light 3.781 → 6.470 ✓
|
|
2623
|
+
// (dark değişmedi: 9.45 / 5.33; docs kartı 8.32 / 4.69).
|
|
2624
|
+
// Regresyon: __tests__/slider-warning-error-contrast.test.ts
|
|
2625
|
+
warning: "border-[rgb(var(--warning-700))] dark:border-warning bg-background",
|
|
2626
|
+
error: "border-[rgb(var(--error-700))] dark:border-error bg-background"
|
|
2561
2627
|
},
|
|
2562
2628
|
size: {
|
|
2563
2629
|
sm: "h-3 w-3",
|
|
@@ -3749,6 +3815,8 @@ var CommandShortcut = ({
|
|
|
3749
3815
|
};
|
|
3750
3816
|
CommandShortcut.displayName = "CommandShortcut";
|
|
3751
3817
|
var TableSortContext = React12.createContext(null);
|
|
3818
|
+
var TableStripedContext = React12.createContext(false);
|
|
3819
|
+
var STRIPED_ROW_CLASSES = "odd:bg-muted/50 hover:bg-accent";
|
|
3752
3820
|
function nextSortDirection(current) {
|
|
3753
3821
|
if (current === "asc")
|
|
3754
3822
|
return "desc";
|
|
@@ -3801,6 +3869,7 @@ var Table = React12.forwardRef(({
|
|
|
3801
3869
|
onRowSelectionChange: _onRowSelectionChange,
|
|
3802
3870
|
disableRowSelection: _disableRowSelection,
|
|
3803
3871
|
getRowId: _getRowId,
|
|
3872
|
+
children,
|
|
3804
3873
|
...props
|
|
3805
3874
|
}, ref) => {
|
|
3806
3875
|
const striped = variant === "striped";
|
|
@@ -3808,20 +3877,9 @@ var Table = React12.forwardRef(({
|
|
|
3808
3877
|
() => ({ sortColumn, sortDirection, onSortChange }),
|
|
3809
3878
|
[sortColumn, sortDirection, onSortChange]
|
|
3810
3879
|
);
|
|
3811
|
-
const childrenWithProps = React12.Children.map(props.children, (child) => {
|
|
3812
|
-
if (React12.isValidElement(child)) {
|
|
3813
|
-
if (child.type === "tbody") {
|
|
3814
|
-
const tbodyProps = child.props;
|
|
3815
|
-
return React12.cloneElement(child, {
|
|
3816
|
-
className: cn(tbodyProps.className, striped && "even:[&>tr]:bg-muted/50")
|
|
3817
|
-
});
|
|
3818
|
-
}
|
|
3819
|
-
}
|
|
3820
|
-
return child;
|
|
3821
|
-
});
|
|
3822
3880
|
return /* @__PURE__ */ jsxs("div", { className: "relative w-full overflow-auto", children: [
|
|
3823
3881
|
loading && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-background/60 flex items-center justify-center z-10", children: /* @__PURE__ */ jsx("div", { className: "h-8 w-8 animate-spin rounded-full border-2 border-primary border-t-transparent" }) }),
|
|
3824
|
-
/* @__PURE__ */ jsx(TableSortContext.Provider, { value: sortContextValue, children: /* @__PURE__ */ jsx(
|
|
3882
|
+
/* @__PURE__ */ jsx(TableSortContext.Provider, { value: sortContextValue, children: /* @__PURE__ */ jsx(TableStripedContext.Provider, { value: striped, children: /* @__PURE__ */ jsx(
|
|
3825
3883
|
"table",
|
|
3826
3884
|
{
|
|
3827
3885
|
ref,
|
|
@@ -3831,13 +3889,13 @@ var Table = React12.forwardRef(({
|
|
|
3831
3889
|
className
|
|
3832
3890
|
),
|
|
3833
3891
|
...props,
|
|
3834
|
-
children
|
|
3892
|
+
children
|
|
3835
3893
|
}
|
|
3836
|
-
) })
|
|
3894
|
+
) }) })
|
|
3837
3895
|
] });
|
|
3838
3896
|
});
|
|
3839
3897
|
Table.displayName = "Table";
|
|
3840
|
-
var TableHeader = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className: cn("moonui-theme", "[&_tr]:border-b", className), ...props }));
|
|
3898
|
+
var TableHeader = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className: cn("moonui-theme", "[&_tr]:border-b", className), ...props, children: /* @__PURE__ */ jsx(TableStripedContext.Provider, { value: false, children }) }));
|
|
3841
3899
|
TableHeader.displayName = "TableHeader";
|
|
3842
3900
|
var TableBody = React12.forwardRef(({ className, emptyContent, emptyMessage = "No data available", children, ...props }, ref) => {
|
|
3843
3901
|
const hasChildren = React12.Children.count(children) > 0;
|
|
@@ -3852,26 +3910,31 @@ var TableBody = React12.forwardRef(({ className, emptyContent, emptyMessage = "N
|
|
|
3852
3910
|
);
|
|
3853
3911
|
});
|
|
3854
3912
|
TableBody.displayName = "TableBody";
|
|
3855
|
-
var TableFooter = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
3913
|
+
var TableFooter = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
3856
3914
|
"tfoot",
|
|
3857
3915
|
{
|
|
3858
3916
|
ref,
|
|
3859
3917
|
className: cn("moonui-theme", "bg-primary text-primary-foreground font-medium", className),
|
|
3860
|
-
...props
|
|
3918
|
+
...props,
|
|
3919
|
+
children: /* @__PURE__ */ jsx(TableStripedContext.Provider, { value: false, children })
|
|
3861
3920
|
}
|
|
3862
3921
|
));
|
|
3863
3922
|
TableFooter.displayName = "TableFooter";
|
|
3864
|
-
var TableRow = React12.forwardRef(({ className, ...props }, ref) =>
|
|
3865
|
-
|
|
3866
|
-
|
|
3867
|
-
|
|
3868
|
-
|
|
3869
|
-
|
|
3870
|
-
className
|
|
3871
|
-
|
|
3872
|
-
|
|
3873
|
-
|
|
3874
|
-
)
|
|
3923
|
+
var TableRow = React12.forwardRef(({ className, ...props }, ref) => {
|
|
3924
|
+
const striped = React12.useContext(TableStripedContext);
|
|
3925
|
+
return /* @__PURE__ */ jsx(
|
|
3926
|
+
"tr",
|
|
3927
|
+
{
|
|
3928
|
+
ref,
|
|
3929
|
+
className: cn(
|
|
3930
|
+
"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
|
|
3931
|
+
striped && STRIPED_ROW_CLASSES,
|
|
3932
|
+
className
|
|
3933
|
+
),
|
|
3934
|
+
...props
|
|
3935
|
+
}
|
|
3936
|
+
);
|
|
3937
|
+
});
|
|
3875
3938
|
TableRow.displayName = "TableRow";
|
|
3876
3939
|
var TableHead = React12.forwardRef(
|
|
3877
3940
|
({ className, sortable, sorted, onSort, columnId, align = "left", children, ...props }, ref) => {
|
|
@@ -4886,8 +4949,31 @@ var progressIndicatorVariants = cva(
|
|
|
4886
4949
|
// Regresyon: __tests__/progress-secondary-contrast.test.ts
|
|
4887
4950
|
secondary: "bg-[rgb(var(--secondary-500))]",
|
|
4888
4951
|
success: "bg-success",
|
|
4889
|
-
|
|
4890
|
-
|
|
4952
|
+
// #424 (#372'nin kardeşi): dolgu `bg-warning`/`bg-error` idi — track
|
|
4953
|
+
// (`bg-warning/20` · `bg-error/20`) AYNI token'ın alfalı hâli olduğundan
|
|
4954
|
+
// LIGHT temada ayrım kayboluyordu: warning 1.83 · error 2.89 (eşik 3:1,
|
|
4955
|
+
// WCAG 1.4.11). DARK tema zaten temizdi (warning 6.97 · error 4.46).
|
|
4956
|
+
//
|
|
4957
|
+
// KÖK NEDEN: `--warning` ve `--error` tokens.css'te `.dark` bloğunda
|
|
4958
|
+
// EZİLMİYOR — iki temada aynı renk. Kardeşleri `--success` (light 29% →
|
|
4959
|
+
// dark 36%) ve `--primary` tema-uyarlanabilir olduğu için eşiği geçiyor;
|
|
4960
|
+
// bu iki aile o uyarlamadan yoksun kaldığı için light'ta kalıyor.
|
|
4961
|
+
//
|
|
4962
|
+
// ÇÖZÜM: eksik tema-uyarlamasını component düzeyinde ver — light'ta
|
|
4963
|
+
// skalanın -700 kademesine in, dark'ta semantik token'a DOKUNMA.
|
|
4964
|
+
// Tema-KÖR bir -700 ataması dark'ı kırardı (docs kartında warning 2.50 ✗
|
|
4965
|
+
// · error 2.23 ✗); `dark:` ayrımı tam olarak bunu önler ve dark render'ı
|
|
4966
|
+
// bit-bit aynı bırakır. Aynı desen badge.tsx:51-63'te zaten kullanılıyor.
|
|
4967
|
+
// Track alfaları BİLEREK `/20` kaldı: altı varyantın tamamı o konvansiyonu
|
|
4968
|
+
// paylaşıyor ve alfayı düşürmek track↔zemin ayrımını zayıflatırdı
|
|
4969
|
+
// (warning 1.162 → 1.081). Ölçülen sonuç — warning: light 4.24 ✓ /
|
|
4970
|
+
// dark 6.97 ✓ (docs kartı #111827: 5.77) · error: light 4.95 ✓ /
|
|
4971
|
+
// dark 4.46 ✓ (docs kartı 3.82). Skala token'ları RGB üçlüsüdür
|
|
4972
|
+
// (semantiklerin HSL'inden farklı) → `rgb(var(--x-700))` kompozisyonu;
|
|
4973
|
+
// `bg-warning-700` YAZILMADI, preset o sınıfı üretmez (#307 ölü-sınıf).
|
|
4974
|
+
// Regresyon: __tests__/progress-warning-error-contrast.test.ts
|
|
4975
|
+
warning: "bg-[rgb(var(--warning-700))] dark:bg-warning",
|
|
4976
|
+
error: "bg-[rgb(var(--error-700))] dark:bg-error"
|
|
4891
4977
|
},
|
|
4892
4978
|
animation: {
|
|
4893
4979
|
default: "transition-all duration-500",
|