@kadoui/react 1.4.8 → 1.4.9
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.
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { HTMLAttributes } from "react";
|
|
2
2
|
export type CarouselRootPropsT = HTMLAttributes<HTMLDivElement>;
|
|
3
|
-
export declare function CarouselRoot(p: CarouselRootPropsT): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export declare function CarouselRoot({ dir, ...p }: CarouselRootPropsT): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
//# sourceMappingURL=CarouselRoot.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CarouselRoot.d.ts","sourceRoot":"","sources":["../../../src/components/Carousel/CarouselRoot.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAA+B,MAAM,OAAO,CAAC;AAIpE,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhE,wBAAgB,YAAY,CAAC,CAAC,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"CarouselRoot.d.ts","sourceRoot":"","sources":["../../../src/components/Carousel/CarouselRoot.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAA+B,MAAM,OAAO,CAAC;AAIpE,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhE,wBAAgB,YAAY,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,EAAE,kBAAkB,2CAiD7D"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import { useEffect, useRef, useState } from "react";
|
|
4
4
|
import { CarouselContext } from "./CarouselContext";
|
|
5
|
-
export function CarouselRoot(p) {
|
|
5
|
+
export function CarouselRoot({ dir, ...p }) {
|
|
6
6
|
const scrollRef = useRef(null);
|
|
7
7
|
const [leftOpacity, setLeftOpacity] = useState(0);
|
|
8
8
|
const [rightOpacity, setRightOpacity] = useState(1);
|
|
@@ -18,10 +18,11 @@ export function CarouselRoot(p) {
|
|
|
18
18
|
return;
|
|
19
19
|
}
|
|
20
20
|
const scrollRatio = Math.abs(+(scrollLeft / maxScroll));
|
|
21
|
-
const left = Math.min(1, scrollRatio * 2);
|
|
22
|
-
const right = Math.min(1, (1 - scrollRatio) * 2);
|
|
23
|
-
|
|
24
|
-
|
|
21
|
+
const left = +(Math.min(1, scrollRatio * 2).toFixed(1));
|
|
22
|
+
const right = +(Math.min(1, (1 - scrollRatio) * 2).toFixed(1));
|
|
23
|
+
const currentDir = (dir || document.documentElement.getAttribute("dir") || "ltr");
|
|
24
|
+
setLeftOpacity(currentDir === "ltr" ? right : left);
|
|
25
|
+
setRightOpacity(currentDir === "ltr" ? left : right);
|
|
25
26
|
};
|
|
26
27
|
useEffect(() => {
|
|
27
28
|
const el = scrollRef.current;
|