@envive-ai/react-toolkit-v3 0.3.5 → 0.3.7

package/dist/FloatingChat/hooks/usePreventScroll.js

@@ -0,0 +1,116 @@
+import { useRef } from "react";
+
+//#region src/components/FloatingChat/hooks/usePreventScroll.ts
+/**
+* Prevent the body element from scrolling when a modal (partial view) is open.
+*
+* @returns
+*/
+const usePreventScroll = () => {
+	const gestureRef = useRef(null);
+	/**
+	* Calculate the angle of a user gesture (grab/drop).
+	*
+	* @param startX
+	* @param startY
+	* @param endX
+	* @param endY
+	* @returns
+	*/
+	const calculateAngle = (startX, startY, endX, endY) => {
+		const deltaX = endX - startX;
+		const deltaY = endY - startY;
+		return (Math.atan2(deltaY, deltaX) * (180 / Math.PI) + 360) % 360;
+	};
+	/**
+	* Test if an element has scrollable capabilities.
+	*
+	* @param node
+	* @returns
+	*/
+	const isScrollable = (node) => {
+		const style = window.getComputedStyle(node);
+		return /(auto|scroll)/.test(style.overflow + style.overflowX + style.overflowY);
+	};
+	/**
+	* Find the parent node that has scrollable capabilities.
+	*
+	* @param node
+	* @returns
+	*/
+	const getScrollParent = (node, ignoreCurrentNode = false) => {
+		let parentNode = ignoreCurrentNode ? node?.parentElement : node;
+		if (!parentNode) return null;
+		if (isScrollable(parentNode)) return parentNode;
+		while (parentNode && !isScrollable(parentNode)) parentNode = parentNode.parentElement;
+		if (!parentNode && isScrollable(document.body)) return document.body;
+		return parentNode || document.scrollingElement || document.documentElement;
+	};
+	/**
+	* Get the scrollable directions an element can scroll.
+	*
+	* @returns
+	*/
+	const getScrollDirections = (scrollableElement) => {
+		const horizontalScroll = (scrollableElement?.scrollWidth || 0) > (scrollableElement?.clientWidth || 0);
+		const verticalScroll = (scrollableElement?.scrollHeight || 0) > (scrollableElement?.clientHeight || 0);
+		const scrollDirections = [];
+		if (horizontalScroll) scrollDirections.push("horizontal");
+		if (verticalScroll) scrollDirections.push("vertical");
+		return scrollDirections;
+	};
+	/**
+	* Determine the direction of a gesture event based on the angle of a grab/drop event.
+	*
+	* @param fingerX
+	* @param fingerY
+	* @returns
+	*/
+	const getGestureDirection = (fingerX, fingerY) => {
+		const directionAngle = calculateAngle(gestureRef?.current?.event?.clientX || 0, gestureRef?.current?.event?.clientY || 0, fingerX, fingerY);
+		if (directionAngle < 45 || directionAngle > 315) return "right";
+		if (directionAngle > 45 && directionAngle < 135) return "down";
+		if (directionAngle > 135 && directionAngle < 225) return "left";
+		return "up";
+	};
+	/**
+	* Determine whether the direction of the gesture can scroll the element in context.
+	*
+	* @param param0
+	* @param direction
+	* @returns
+	*/
+	const isScrollDirectionAllowed = ({ element, scrollableDirections }, direction) => {
+		if (element?.tagName === "BODY" || element?.tagName === "HTML" || scrollableDirections?.length === 0) return false;
+		const { clientHeight = 0, clientWidth = 0, scrollHeight = 0, scrollWidth = 0, scrollTop = 0, scrollLeft = 0 } = element || {};
+		const atTop = scrollTop === 0;
+		const atLeft = scrollLeft === 0;
+		const atBottom = 100 / scrollHeight * (scrollTop + clientHeight) > 99.9;
+		const atRight = 100 / scrollWidth * (scrollLeft + clientWidth) > 99.9;
+		const verticalScrollBlocked = atBottom && direction === "up" || atTop && direction === "down" || direction === "left" || direction === "right";
+		if (scrollableDirections?.includes("vertical") && verticalScrollBlocked) return false;
+		const horizontalScrollBlocked = atRight && direction === "left" || atLeft && direction === "right" || direction === "up" || direction === "down";
+		if (scrollableDirections?.includes("horizontal") && horizontalScrollBlocked) return false;
+		return true;
+	};
+	/**
+	* Test if the selected scrollable element can scroll in the direction of the grab/drop event.
+	*
+	* @param direction
+	* @returns
+	*/
+	const isScrollableArea = (direction) => {
+		const { scrollableElements } = gestureRef.current || {};
+		return scrollableElements?.some((el) => isScrollDirectionAllowed(el, direction));
+	};
+	return {
+		gestureRef,
+		getScrollParent,
+		isScrollableArea,
+		getGestureDirection,
+		getScrollDirections
+	};
+};
+
+//#endregion
+export { usePreventScroll };

package/dist/FloatingChat/hooks/useSnapCalculator.cjs

@@ -0,0 +1,37 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let react = require("react");
+
+//#region src/components/FloatingChat/hooks/useSnapCalculator.ts
+let Unit = /* @__PURE__ */ function(Unit$1) {
+	Unit$1["PERCENT"] = "percent";
+	Unit$1["PIXEL"] = "pixel";
+	return Unit$1;
+}({});
+const useSnapCalculator = (snaps, maxHeight, unit) => {
+	const viewportHeightPx = document.documentElement.clientHeight;
+	const swipeviewHeightPx = unit === Unit.PERCENT ? Math.floor(viewportHeightPx * (maxHeight / 100)) : maxHeight;
+	const snapsToPixels = (0, react.useMemo)(() => snaps?.map((snap) => Math.abs((unit === Unit.PERCENT ? Math.floor(swipeviewHeightPx * (snap / 100)) : snap) - swipeviewHeightPx)), [
+		swipeviewHeightPx,
+		unit,
+		snaps
+	]);
+	const getPixelToSnap = (pixels) => {
+		const snapIdx = snapsToPixels?.indexOf(pixels) || 0;
+		return snaps?.[snapIdx] || 0;
+	};
+	const getSnapToPixel = (snap) => {
+		const snapIdx = snaps?.indexOf(snap) || 0;
+		return snapsToPixels?.[snapIdx] || 0;
+	};
+	return {
+		viewportHeightPx,
+		snapsToPixels,
+		swipeviewHeightPx,
+		getPixelToSnap,
+		getSnapToPixel
+	};
+};
+
+//#endregion
+exports.Unit = Unit;
+exports.useSnapCalculator = useSnapCalculator;

package/dist/FloatingChat/hooks/useSnapCalculator.js

@@ -0,0 +1,35 @@
+import { useMemo } from "react";
+
+//#region src/components/FloatingChat/hooks/useSnapCalculator.ts
+let Unit = /* @__PURE__ */ function(Unit$1) {
+	Unit$1["PERCENT"] = "percent";
+	Unit$1["PIXEL"] = "pixel";
+	return Unit$1;
+}({});
+const useSnapCalculator = (snaps, maxHeight, unit) => {
+	const viewportHeightPx = document.documentElement.clientHeight;
+	const swipeviewHeightPx = unit === Unit.PERCENT ? Math.floor(viewportHeightPx * (maxHeight / 100)) : maxHeight;
+	const snapsToPixels = useMemo(() => snaps?.map((snap) => Math.abs((unit === Unit.PERCENT ? Math.floor(swipeviewHeightPx * (snap / 100)) : snap) - swipeviewHeightPx)), [
+		swipeviewHeightPx,
+		unit,
+		snaps
+	]);
+	const getPixelToSnap = (pixels) => {
+		const snapIdx = snapsToPixels?.indexOf(pixels) || 0;
+		return snaps?.[snapIdx] || 0;
+	};
+	const getSnapToPixel = (snap) => {
+		const snapIdx = snaps?.indexOf(snap) || 0;
+		return snapsToPixels?.[snapIdx] || 0;
+	};
+	return {
+		viewportHeightPx,
+		snapsToPixels,
+		swipeviewHeightPx,
+		getPixelToSnap,
+		getSnapToPixel
+	};
+};
+
+//#endregion
+export { Unit, useSnapCalculator };

package/dist/FloatingChat/hooks/useSnapControl.cjs

@@ -0,0 +1,82 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_useSnapCalculator = require('./useSnapCalculator.cjs');
+let react = require("react");
+let framer_motion = require("framer-motion");
+
+//#region src/components/FloatingChat/hooks/useSnapControl.ts
+const MIDDLE_SNAP_OFFSET = 5;
+const useSnapControl = ({ animationKey, animation, height, unit, snaps, initSnap, onSnapComplete, overlayOpacity }) => {
+	const [scope, animate] = (0, framer_motion.useAnimate)();
+	const defaultAnimationKey = (0, framer_motion.useMotionValue)(-1);
+	const animatedY = animationKey || defaultAnimationKey;
+	const { swipeviewHeightPx, snapsToPixels, getPixelToSnap, getSnapToPixel } = require_useSnapCalculator.useSnapCalculator(snaps, height, unit);
+	const contentHeight = (0, framer_motion.useTransform)(animatedY, [0, swipeviewHeightPx], [swipeviewHeightPx, 0]);
+	const snapOverlayReference = (0, react.useMemo)(() => [
+		getSnapToPixel(snaps[0]),
+		getSnapToPixel(snaps[1]) - MIDDLE_SNAP_OFFSET,
+		getSnapToPixel(snaps[2])
+	], [getSnapToPixel, snaps]);
+	const displayOverlay = (0, framer_motion.useTransform)(() => animatedY.get() === -1 ? "none" : (0, framer_motion.transform)(animatedY.get(), snapOverlayReference, [
+		"none",
+		"none",
+		"block"
+	]));
+	const opacityOverlay = (0, framer_motion.useTransform)(() => animatedY.get() === -1 ? 0 : (0, framer_motion.transform)(animatedY.get(), snapOverlayReference, [
+		0,
+		0,
+		overlayOpacity
+	]));
+	const initSnapInPixels = snapsToPixels?.[initSnap];
+	const getInitSnap = () => snaps?.[initSnap];
+	const [currentSnap, setCurrentSnap] = (0, react.useState)(getInitSnap());
+	const defineNextSnapByPosition = () => {
+		const currentY = animatedY.get();
+		let closestSnap = snapsToPixels[0];
+		let minDistance = Math.abs(currentY - snapsToPixels[0]);
+		snapsToPixels.forEach((snapPx) => {
+			const distance = Math.abs(currentY - snapPx);
+			if (distance < minDistance) {
+				minDistance = distance;
+				closestSnap = snapPx;
+			}
+		});
+		return closestSnap;
+	};
+	const jumpTo = (snapPx) => {
+		const collapsed = snapPx === swipeviewHeightPx;
+		const nextSnap = getPixelToSnap(snapPx);
+		animate(scope.current, { y: snapPx }, {
+			...animation,
+			onComplete: () => {
+				onSnapComplete(currentSnap, nextSnap, collapsed);
+				setCurrentSnap(nextSnap);
+			}
+		});
+		return {
+			nextSnap,
+			collapsed
+		};
+	};
+	const resetControls = () => {
+		setCurrentSnap(getInitSnap());
+		return 0;
+	};
+	return {
+		scope,
+		animatedY,
+		animate,
+		swipeviewHeightPx,
+		initSnapInPixels,
+		contentHeight,
+		currentSnap,
+		displayOverlay,
+		opacityOverlay,
+		getSnapToPixel,
+		jumpTo,
+		defineNextSnapByPosition,
+		resetControls
+	};
+};
+
+//#endregion
+exports.useSnapControl = useSnapControl;

package/dist/FloatingChat/hooks/useSnapControl.js

@@ -0,0 +1,81 @@
+import { useSnapCalculator } from "./useSnapCalculator.js";
+import { useMemo, useState } from "react";
+import { transform, useAnimate, useMotionValue, useTransform } from "framer-motion";
+
+//#region src/components/FloatingChat/hooks/useSnapControl.ts
+const MIDDLE_SNAP_OFFSET = 5;
+const useSnapControl = ({ animationKey, animation, height, unit, snaps, initSnap, onSnapComplete, overlayOpacity }) => {
+	const [scope, animate] = useAnimate();
+	const defaultAnimationKey = useMotionValue(-1);
+	const animatedY = animationKey || defaultAnimationKey;
+	const { swipeviewHeightPx, snapsToPixels, getPixelToSnap, getSnapToPixel } = useSnapCalculator(snaps, height, unit);
+	const contentHeight = useTransform(animatedY, [0, swipeviewHeightPx], [swipeviewHeightPx, 0]);
+	const snapOverlayReference = useMemo(() => [
+		getSnapToPixel(snaps[0]),
+		getSnapToPixel(snaps[1]) - MIDDLE_SNAP_OFFSET,
+		getSnapToPixel(snaps[2])
+	], [getSnapToPixel, snaps]);
+	const displayOverlay = useTransform(() => animatedY.get() === -1 ? "none" : transform(animatedY.get(), snapOverlayReference, [
+		"none",
+		"none",
+		"block"
+	]));
+	const opacityOverlay = useTransform(() => animatedY.get() === -1 ? 0 : transform(animatedY.get(), snapOverlayReference, [
+		0,
+		0,
+		overlayOpacity
+	]));
+	const initSnapInPixels = snapsToPixels?.[initSnap];
+	const getInitSnap = () => snaps?.[initSnap];
+	const [currentSnap, setCurrentSnap] = useState(getInitSnap());
+	const defineNextSnapByPosition = () => {
+		const currentY = animatedY.get();
+		let closestSnap = snapsToPixels[0];
+		let minDistance = Math.abs(currentY - snapsToPixels[0]);
+		snapsToPixels.forEach((snapPx) => {
+			const distance = Math.abs(currentY - snapPx);
+			if (distance < minDistance) {
+				minDistance = distance;
+				closestSnap = snapPx;
+			}
+		});
+		return closestSnap;
+	};
+	const jumpTo = (snapPx) => {
+		const collapsed = snapPx === swipeviewHeightPx;
+		const nextSnap = getPixelToSnap(snapPx);
+		animate(scope.current, { y: snapPx }, {
+			...animation,
+			onComplete: () => {
+				onSnapComplete(currentSnap, nextSnap, collapsed);
+				setCurrentSnap(nextSnap);
+			}
+		});
+		return {
+			nextSnap,
+			collapsed
+		};
+	};
+	const resetControls = () => {
+		setCurrentSnap(getInitSnap());
+		return 0;
+	};
+	return {
+		scope,
+		animatedY,
+		animate,
+		swipeviewHeightPx,
+		initSnapInPixels,
+		contentHeight,
+		currentSnap,
+		displayOverlay,
+		opacityOverlay,
+		getSnapToPixel,
+		jumpTo,
+		defineNextSnapByPosition,
+		resetControls
+	};
+};
+
+//#endregion
+export { useSnapControl };

package/dist/FloatingChat/hooks/useSnapSetup.cjs

@@ -0,0 +1,59 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_useCheckIsMobile = require('../../utils/useCheckIsMobile.cjs');
+let react = require("react");
+let framer_motion = require("framer-motion");
+
+//#region src/components/FloatingChat/hooks/useSnapSetup.ts
+const useSnapSetup = ({ isFloatingChatOpen }) => {
+	const maxSwipeableViewHeight = 89;
+	const modalSheetControl = (0, react.useRef)(null);
+	const { viewportWidth } = require_useCheckIsMobile.useCheckIsMobile();
+	const isMobile = viewportWidth !== void 0 && viewportWidth < 512;
+	const shouldAutoExpand = Boolean(isMobile && window?._spiffy?.selectedCustomizeOption);
+	const snaps = shouldAutoExpand ? [43, 100] : [
+		0,
+		43,
+		100
+	];
+	const initialSnap = 1;
+	const [currentSnapPercentage, setCurrentSnapPercentage] = (0, react.useState)(snaps[initialSnap] || 43);
+	const animationKey = (0, framer_motion.useMotionValue)(0);
+	const snap43Percent = 57 / 100 * window.innerHeight;
+	const snap100Percent = 0;
+	const mobileHeaderHeight = (0, framer_motion.useTransform)(animationKey, [snap100Percent, snap43Percent], [56, 0]);
+	const [shouldShowHeader, setShouldShowHeader] = (0, react.useState)(false);
+	const [shouldShowScrolled, setShouldShowScrolled] = (0, react.useState)(false);
+	(0, react.useEffect)(() => {
+		return animationKey.on("change", (value) => {
+			setShouldShowHeader(value < snap43Percent - 10);
+			setShouldShowScrolled(value > snap43Percent);
+		});
+	}, [animationKey, snap43Percent]);
+	const isFullView = isMobile && currentSnapPercentage === 100;
+	const isPartialView = isMobile && currentSnapPercentage >= 0 && currentSnapPercentage <= 43;
+	const handleSnapChange = (snapPercentage) => {
+		setCurrentSnapPercentage(snapPercentage);
+	};
+	return {
+		modalSheetControl,
+		maxSwipeableViewHeight,
+		isOpen: window?._spiffy?.selectedCustomizeOption === "SalesAgent" ? true : Boolean(isFloatingChatOpen),
+		isMobile,
+		snaps,
+		initialSnap,
+		shouldAutoExpand,
+		currentSnapPercentage,
+		handleSnapChange,
+		animationKey,
+		mobileHeaderHeight,
+		snap43Percent,
+		snap100Percent,
+		shouldShowHeader,
+		shouldShowScrolled,
+		isFullView,
+		isPartialView
+	};
+};
+
+//#endregion
+exports.useSnapSetup = useSnapSetup;

package/dist/FloatingChat/hooks/useSnapSetup.js

@@ -0,0 +1,58 @@
+import { useCheckIsMobile } from "../../utils/useCheckIsMobile.js";
+import { useEffect, useRef, useState } from "react";
+import { useMotionValue, useTransform } from "framer-motion";
+
+//#region src/components/FloatingChat/hooks/useSnapSetup.ts
+const useSnapSetup = ({ isFloatingChatOpen }) => {
+	const maxSwipeableViewHeight = 89;
+	const modalSheetControl = useRef(null);
+	const { viewportWidth } = useCheckIsMobile();
+	const isMobile = viewportWidth !== void 0 && viewportWidth < 512;
+	const shouldAutoExpand = Boolean(isMobile && window?._spiffy?.selectedCustomizeOption);
+	const snaps = shouldAutoExpand ? [43, 100] : [
+		0,
+		43,
+		100
+	];
+	const initialSnap = 1;
+	const [currentSnapPercentage, setCurrentSnapPercentage] = useState(snaps[initialSnap] || 43);
+	const animationKey = useMotionValue(0);
+	const snap43Percent = 57 / 100 * window.innerHeight;
+	const snap100Percent = 0;
+	const mobileHeaderHeight = useTransform(animationKey, [snap100Percent, snap43Percent], [56, 0]);
+	const [shouldShowHeader, setShouldShowHeader] = useState(false);
+	const [shouldShowScrolled, setShouldShowScrolled] = useState(false);
+	useEffect(() => {
+		return animationKey.on("change", (value) => {
+			setShouldShowHeader(value < snap43Percent - 10);
+			setShouldShowScrolled(value > snap43Percent);
+		});
+	}, [animationKey, snap43Percent]);
+	const isFullView = isMobile && currentSnapPercentage === 100;
+	const isPartialView = isMobile && currentSnapPercentage >= 0 && currentSnapPercentage <= 43;
+	const handleSnapChange = (snapPercentage) => {
+		setCurrentSnapPercentage(snapPercentage);
+	};
+	return {
+		modalSheetControl,
+		maxSwipeableViewHeight,
+		isOpen: window?._spiffy?.selectedCustomizeOption === "SalesAgent" ? true : Boolean(isFloatingChatOpen),
+		isMobile,
+		snaps,
+		initialSnap,
+		shouldAutoExpand,
+		currentSnapPercentage,
+		handleSnapChange,
+		animationKey,
+		mobileHeaderHeight,
+		snap43Percent,
+		snap100Percent,
+		shouldShowHeader,
+		shouldShowScrolled,
+		isFullView,
+		isPartialView
+	};
+};
+
+//#endregion
+export { useSnapSetup };

package/dist/FloatingChat/types/types.d.cts

@@ -1,6 +1,6 @@
-import { Theme } from "../../components-v3/tokens/theme/theme.cjs";
-import { SalesAgent } from "../../hooks/dist/contexts/salesAgentContext/salesAgentContext.cjs";
-import { FloatingChatConfig, LookAndFeelConfig } from "../../hooks/dist/contexts/typesV3.cjs";
+import { Theme } from "../../tokens/theme/theme.cjs";
+import { SalesAgent } from "@envive-ai/react-hooks/contexts/salesAgentContext";
+import { FloatingChatConfig, LookAndFeelConfig } from "@envive-ai/react-hooks/contexts/typesV3";
 
 //#region src/components/FloatingChat/types/types.d.ts
 
@@ -59,6 +59,10 @@ interface FloatingChatProps {
    * Whether the CX button switch is enabled.
    */
   isCXButtonSwitchEnabled: boolean;
+  /**
+   * Whether the chat is open.
+   */
+  isFloatingChatOpen: boolean;
 }
 //#endregion
 export { FloatingChatProps };

package/dist/FloatingChat/types/types.d.ts

@@ -1,7 +1,6 @@
-import { Theme } from "../../components-v3/tokens/theme/theme.js";
-import { SalesAgent } from "../../hooks/dist/contexts/salesAgentContext/salesAgentContext.js";
-import "../../hooks/dist/contexts/salesAgentContext/index.js";
-import { FloatingChatConfig, LookAndFeelConfig } from "../../hooks/dist/contexts/typesV3.js";
+import { Theme } from "../../tokens/theme/theme.js";
+import { SalesAgent } from "@envive-ai/react-hooks/contexts/salesAgentContext";
+import { FloatingChatConfig, LookAndFeelConfig } from "@envive-ai/react-hooks/contexts/typesV3";
 
 //#region src/components/FloatingChat/types/types.d.ts
 
@@ -60,6 +59,10 @@ interface FloatingChatProps {
    * Whether the CX button switch is enabled.
    */
   isCXButtonSwitchEnabled: boolean;
+  /**
+   * Whether the chat is open.
+   */
+  isFloatingChatOpen: boolean;
 }
 //#endregion
 export { FloatingChatProps };

package/dist/Image/Image.d.cts

@@ -1,5 +1,5 @@
 import { ImageProps } from "./types/index.cjs";
-import * as react_jsx_runtime27 from "react/jsx-runtime";
+import * as react_jsx_runtime21 from "react/jsx-runtime";
 
 //#region src/components/Image/Image.d.ts
 
@@ -25,6 +25,6 @@ declare const Image: ({
   role,
   "aria-hidden": ariaHidden,
   ...rest
-}: ImageProps) => react_jsx_runtime27.JSX.Element;
+}: ImageProps) => react_jsx_runtime21.JSX.Element;
 //#endregion
 export { Image };

package/dist/Image/Image.d.ts

@@ -1,5 +1,5 @@
 import { ImageProps } from "./types/index.js";
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime20 from "react/jsx-runtime";
 
 //#region src/components/Image/Image.d.ts
 
@@ -25,6 +25,6 @@ declare const Image: ({
   role,
   "aria-hidden": ariaHidden,
   ...rest
-}: ImageProps) => react_jsx_runtime5.JSX.Element;
+}: ImageProps) => react_jsx_runtime20.JSX.Element;
 //#endregion
 export { Image };

package/dist/ImageGallery/ImageGallery.cjs

@@ -1,5 +1,5 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_theme = require('../components-v3/tokens/theme/theme.cjs');
+const require_theme = require('../tokens/theme/theme.cjs');
 const require_index = require('../Image/types/index.cjs');
 const require_index$1 = require('./components/index.cjs');
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/ImageGallery/ImageGallery.d.cts

@@ -1,5 +1,5 @@
 import { ImageGalleryProps } from "./types/types.cjs";
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime26 from "react/jsx-runtime";
 
 //#region src/components/ImageGallery/ImageGallery.d.ts
 
@@ -40,6 +40,6 @@ declare const ImageGallery: ({
   "aria-describedby": ariaDescribedBy,
   role,
   "aria-hidden": ariaHidden
-}: ImageGalleryProps) => react_jsx_runtime5.JSX.Element;
+}: ImageGalleryProps) => react_jsx_runtime26.JSX.Element;
 //#endregion
 export { ImageGallery };

package/dist/ImageGallery/ImageGallery.d.ts

@@ -1,5 +1,5 @@
 import { ImageGalleryProps } from "./types/types.js";
-import * as react_jsx_runtime33 from "react/jsx-runtime";
+import * as react_jsx_runtime30 from "react/jsx-runtime";
 
 //#region src/components/ImageGallery/ImageGallery.d.ts
 
@@ -40,6 +40,6 @@ declare const ImageGallery: ({
   "aria-describedby": ariaDescribedBy,
   role,
   "aria-hidden": ariaHidden
-}: ImageGalleryProps) => react_jsx_runtime33.JSX.Element;
+}: ImageGalleryProps) => react_jsx_runtime30.JSX.Element;
 //#endregion
 export { ImageGallery };

package/dist/ImageGallery/ImageGallery.js

@@ -1,4 +1,4 @@
-import { Theme } from "../components-v3/tokens/theme/theme.js";
+import { Theme } from "../tokens/theme/theme.js";
 import { ImageAspectRatio, ImageObjectFit } from "../Image/types/index.js";
 import { ImageGalleryComponents } from "./components/index.js";
 import { jsx } from "react/jsx-runtime";

package/dist/ImageGallery/components/Layout.cjs

@@ -1,5 +1,5 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
-const require_theme = require('../../components-v3/tokens/theme/theme.cjs');
+const require_theme = require('../../tokens/theme/theme.cjs');
 const require_useResponsiveValue = require('../../utils/useResponsiveValue.cjs');
 const require_Container = require('../../Container/Container.cjs');
 const require_useCheckIsMobile = require('../../utils/useCheckIsMobile.cjs');

package/dist/ImageGallery/components/Layout.js

@@ -1,4 +1,4 @@
-import { Theme } from "../../components-v3/tokens/theme/theme.js";
+import { Theme } from "../../tokens/theme/theme.js";
 import { useResponsiveValue } from "../../utils/useResponsiveValue.js";
 import { Container } from "../../Container/Container.js";
 import { useCheckIsMobile } from "../../utils/useCheckIsMobile.js";

package/dist/ImageGallery/types/types.d.cts

@@ -1,4 +1,4 @@
-import { Theme } from "../../components-v3/tokens/theme/theme.cjs";
+import { Theme } from "../../tokens/theme/theme.cjs";
 import { ImageAspectRatio, ImageObjectFit } from "../../Image/types/index.cjs";
 import { ResponsiveValue } from "../../utils/useResponsiveValue.cjs";
 

package/dist/ImageGallery/types/types.d.ts

@@ -1,4 +1,4 @@
-import { Theme } from "../../components-v3/tokens/theme/theme.js";
+import { Theme } from "../../tokens/theme/theme.js";
 import { ImageAspectRatio, ImageObjectFit } from "../../Image/types/index.js";
 import { ResponsiveValue } from "../../utils/useResponsiveValue.js";
 

package/dist/ImageGallery/utils/functions.cjs

@@ -1,5 +1,5 @@
 const require_utils = require('../../DesignTokens/components/utils.cjs');
-const require_theme = require('../../components-v3/tokens/theme/theme.cjs');
+const require_theme = require('../../tokens/theme/theme.cjs');
 const require_types = require('../types/types.cjs');
 
 //#region src/components/ImageGallery/utils/functions.ts

package/dist/ImageGallery/utils/functions.js

@@ -1,5 +1,5 @@
 import { getComputedCSSVariable } from "../../DesignTokens/components/utils.js";
-import { Theme, ThemeCSSVar } from "../../components-v3/tokens/theme/theme.js";
+import { Theme, ThemeCSSVar } from "../../tokens/theme/theme.js";
 import { ImageGalleryLayout } from "../types/types.js";
 
 //#region src/components/ImageGallery/utils/functions.ts

package/dist/MarkdownProcessor/MarkdownProcessor.d.cts

@@ -1,5 +1,5 @@
 import { MarkdownProcessorProps } from "./types/types.cjs";
-import * as react_jsx_runtime31 from "react/jsx-runtime";
+import * as react_jsx_runtime20 from "react/jsx-runtime";
 
 //#region src/components/MarkdownProcessor/MarkdownProcessor.d.ts
 declare const MarkdownProcessor: ({
@@ -9,6 +9,6 @@ declare const MarkdownProcessor: ({
   textVariant,
   subTextVariant,
   subTextColor
-}: MarkdownProcessorProps) => react_jsx_runtime31.JSX.Element;
+}: MarkdownProcessorProps) => react_jsx_runtime20.JSX.Element;
 //#endregion
 export { MarkdownProcessor };