@intlayer/design-system 8.7.11 → 8.7.13

package/dist/esm/hooks/useItemSelector.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import { useEffect, useRef, useState } from "react";
+import { useLayoutEffect, useRef, useState } from "react";
 
 //#region src/hooks/useItemSelector.ts
 const selectorDefault = (option) => option?.getAttribute("aria-selected") === "true";
@@ -24,47 +24,60 @@ const useItemSelector = (optionsRefs, { selector = selectorDefault, isHoverable
 			}
 		} else targetElement = optionsRefs.current.find(selector) ?? null;
 		if (!targetElement) {
-			if (orientation === "vertical") setChoiceIndicatorPosition((prev) => {
-				const verticalPrev = prev;
+			if (orientation === "vertical") {
+				const verticalPrev = lastPositionRef.current;
 				const newPosition = {
 					top: verticalPrev?.top ?? 0,
 					height: verticalPrev?.height ?? 0,
 					opacity: 0
 				};
-				lastPositionRef.current = newPosition;
-				return newPosition;
-			});
-			else setChoiceIndicatorPosition((prev) => {
-				const horizontalPrev = prev;
+				if (verticalPrev?.opacity !== 0) {
+					setChoiceIndicatorPosition(newPosition);
+					lastPositionRef.current = newPosition;
+				}
+			} else {
+				const horizontalPrev = lastPositionRef.current;
 				const newPosition = {
 					left: horizontalPrev?.left ?? 0,
 					width: horizontalPrev?.width ?? 0,
 					opacity: 0
 				};
-				lastPositionRef.current = newPosition;
-				return newPosition;
-			});
+				if (horizontalPrev?.opacity !== 0) {
+					setChoiceIndicatorPosition(newPosition);
+					lastPositionRef.current = newPosition;
+				}
+			}
 			return;
 		}
 		if (orientation === "vertical") {
+			const top = targetElement.offsetTop;
+			const height = targetElement.offsetHeight;
 			const newPosition = {
-				top: targetElement.offsetTop,
-				height: targetElement.offsetHeight,
+				top,
+				height,
 				opacity: 1
 			};
-			setChoiceIndicatorPosition(newPosition);
-			lastPositionRef.current = newPosition;
+			const prev = lastPositionRef.current;
+			if (!prev || prev.top !== top || prev.height !== height || prev.opacity !== 1) {
+				setChoiceIndicatorPosition(newPosition);
+				lastPositionRef.current = newPosition;
+			}
 		} else {
+			const left = targetElement.offsetLeft;
+			const width = targetElement.offsetWidth;
 			const newPosition = {
-				left: targetElement.offsetLeft,
-				width: targetElement.offsetWidth,
+				left,
+				width,
 				opacity: 1
 			};
-			setChoiceIndicatorPosition(newPosition);
-			lastPositionRef.current = newPosition;
+			const prev = lastPositionRef.current;
+			if (!prev || prev.left !== left || prev.width !== width || prev.opacity !== 1) {
+				setChoiceIndicatorPosition(newPosition);
+				lastPositionRef.current = newPosition;
+			}
 		}
 	};
-	useEffect(() => {
+	useLayoutEffect(() => {
 		calculatePosition();
 		window.addEventListener("resize", calculatePosition);
 		window.addEventListener("DOMContentLoaded", calculatePosition);
@@ -72,14 +85,18 @@ const useItemSelector = (optionsRefs, { selector = selectorDefault, isHoverable
 		optionsRefs.current.forEach((option) => {
 			if (option) {
 				const observer = new MutationObserver((mutations) => {
-					for (const mutation of mutations) if (mutation.type === "attributes" && mutation.attributeName === "aria-selected") {
+					for (const mutation of mutations) if (mutation.type === "attributes" && (mutation.attributeName === "aria-selected" || mutation.attributeName === "data-active" || mutation.attributeName === "data-indicator")) {
 						calculatePosition();
 						break;
 					}
 				});
 				observer.observe(option, {
 					attributes: true,
-					attributeFilter: ["aria-selected"]
+					attributeFilter: [
+						"aria-selected",
+						"data-active",
+						"data-indicator"
+					]
 				});
 				mutationObservers.push(observer);
 			}
@@ -133,7 +150,8 @@ const useItemSelector = (optionsRefs, { selector = selectorDefault, isHoverable
 		selector,
 		hoveredItem,
 		itemsLength,
-		orientation
+		orientation,
+		isHoverable
 	]);
 	return {
 		choiceIndicatorPosition,

package/dist/esm/hooks/useItemSelector.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useItemSelector.mjs","names":[],"sources":["../../../src/hooks/useItemSelector.ts"],"sourcesContent":["'use client';\n\nimport { type RefObject, useEffect, useRef, useState } from 'react';\n\nexport type ItemSelectorOrientation = 'horizontal' | 'vertical';\n\ntype HorizontalStyleState = {\n  left: number;\n  width: number;\n  opacity: number;\n};\n\ntype VerticalStyleState = {\n  top: number;\n  height: number;\n  opacity: number;\n};\n\ntype StyleState = HorizontalStyleState | VerticalStyleState;\n\nconst selectorDefault = (option: HTMLElement) =>\n  option?.getAttribute('aria-selected') === 'true';\n\ntype Options = {\n  selector?: (option: HTMLElement, index: number) => boolean;\n  isHoverable?: boolean;\n  orientation?: ItemSelectorOrientation;\n};\n\nexport const useItemSelector = (\n  optionsRefs: RefObject<HTMLElement[]>,\n  {\n    selector = selectorDefault,\n    isHoverable = false,\n    orientation = 'horizontal',\n  }: Options = {\n    selector: selectorDefault,\n    isHoverable: false,\n    orientation: 'horizontal',\n  }\n) => {\n  const [choiceIndicatorPosition, setChoiceIndicatorPosition] =\n    useState<StyleState | null>(null);\n\n  const [hoveredItem, setHoveredItem] = useState<HTMLElement | null>(null);\n  const hideTimeoutRef = useRef<NodeJS.Timeout | null>(null);\n  const lastPositionRef = useRef<StyleState | null>(null);\n\n  const itemsLength = optionsRefs.current.length;\n\n  const calculatePosition = () => {\n    let targetElement: HTMLElement | null = null;\n\n    if (hoveredItem) {\n      targetElement = hoveredItem;\n      // Clear any pending hide timeout when hovering over an item\n      if (hideTimeoutRef.current) {\n        clearTimeout(hideTimeoutRef.current);\n        hideTimeoutRef.current = null;\n      }\n    } else {\n      targetElement = optionsRefs.current.find(selector) ?? null;\n    }\n\n    if (!targetElement) {\n      // Keep previous position but set opacity to 0\n      if (orientation === 'vertical') {\n        setChoiceIndicatorPosition((prev) => {\n          const verticalPrev = prev as VerticalStyleState | null;\n          const newPosition: VerticalStyleState = {\n            top: verticalPrev?.top ?? 0,\n            height: verticalPrev?.height ?? 0,\n            opacity: 0,\n          };\n          lastPositionRef.current = newPosition;\n          return newPosition;\n        });\n      } else {\n        setChoiceIndicatorPosition((prev) => {\n          const horizontalPrev = prev as HorizontalStyleState | null;\n          const newPosition: HorizontalStyleState = {\n            left: horizontalPrev?.left ?? 0,\n            width: horizontalPrev?.width ?? 0,\n            opacity: 0,\n          };\n          lastPositionRef.current = newPosition;\n          return newPosition;\n        });\n      }\n      return;\n    }\n\n    if (orientation === 'vertical') {\n      const top = targetElement.offsetTop;\n      const height = targetElement.offsetHeight;\n\n      const newPosition = {\n        top,\n        height,\n        opacity: 1,\n      };\n      setChoiceIndicatorPosition(newPosition);\n      lastPositionRef.current = newPosition;\n    } else {\n      const left = targetElement.offsetLeft;\n      const width = targetElement.offsetWidth;\n\n      const newPosition = {\n        left,\n        width,\n        opacity: 1,\n      };\n      setChoiceIndicatorPosition(newPosition);\n      lastPositionRef.current = newPosition;\n    }\n  };\n\n  useEffect(() => {\n    calculatePosition();\n\n    // Event listeners for window events\n    window.addEventListener('resize', calculatePosition);\n    window.addEventListener('DOMContentLoaded', calculatePosition);\n\n    // MutationObserver to watch for 'aria-selected' changes\n    const mutationObservers: MutationObserver[] = [];\n\n    optionsRefs.current.forEach((option) => {\n      if (option) {\n        const observer = new MutationObserver((mutations) => {\n          for (const mutation of mutations) {\n            if (\n              mutation.type === 'attributes' &&\n              mutation.attributeName === 'aria-selected'\n            ) {\n              calculatePosition();\n              break;\n            }\n          }\n        });\n\n        observer.observe(option, {\n          attributes: true,\n          attributeFilter: ['aria-selected'],\n        });\n\n        mutationObservers.push(observer);\n      }\n    });\n\n    // ResizeObserver to watch for size changes\n    const resizeObservers: ResizeObserver[] = [];\n\n    const observeSize = (element: HTMLElement) => {\n      if (!element) return;\n      const resizeObserver = new ResizeObserver(() => {\n        calculatePosition();\n      });\n      resizeObserver.observe(element);\n      resizeObservers.push(resizeObserver);\n    };\n\n    // Observe the selected item\n    const selectedItem = optionsRefs.current.find(selector) ?? null;\n\n    if (selectedItem) {\n      observeSize(selectedItem);\n    }\n\n    // Observe the hovered item\n    if (hoveredItem) {\n      observeSize(hoveredItem);\n    }\n\n    // Add hover event listeners\n    const handleMouseEnter = (event: Event) => {\n      // Clear any pending hide timeout\n      if (hideTimeoutRef.current) {\n        clearTimeout(hideTimeoutRef.current);\n        hideTimeoutRef.current = null;\n      }\n      setHoveredItem(event.currentTarget as HTMLElement);\n    };\n\n    const handleMouseLeave = () => {\n      // Clear any existing timeout\n      if (hideTimeoutRef.current) {\n        clearTimeout(hideTimeoutRef.current);\n      }\n\n      // Keep the indicator at its current position for 150ms\n      // before removing the hovered item\n      hideTimeoutRef.current = setTimeout(() => {\n        setHoveredItem(null);\n      }, 150); // 150ms delay before hiding\n    };\n\n    if (isHoverable) {\n      optionsRefs.current.forEach((option) => {\n        option?.addEventListener('mouseenter', handleMouseEnter, {\n          passive: true,\n        });\n        option?.addEventListener('mouseleave', handleMouseLeave, {\n          passive: true,\n        });\n      });\n    }\n\n    return () => {\n      // Clear any pending hide timeout\n      if (hideTimeoutRef.current) {\n        clearTimeout(hideTimeoutRef.current);\n      }\n\n      // Cleanup window event listeners\n      window.removeEventListener('resize', calculatePosition);\n      window.removeEventListener('DOMContentLoaded', calculatePosition);\n\n      // Disconnect MutationObservers\n      mutationObservers.forEach((observer) => {\n        observer.disconnect();\n      });\n\n      // Disconnect ResizeObservers\n      resizeObservers.forEach((observer) => {\n        observer.disconnect();\n      });\n\n      // Remove hover event listeners\n      optionsRefs.current.forEach((option) => {\n        option?.removeEventListener('mouseenter', handleMouseEnter);\n        option?.removeEventListener('mouseleave', handleMouseLeave);\n      });\n    };\n  }, [optionsRefs, selector, hoveredItem, itemsLength, orientation]);\n\n  return { choiceIndicatorPosition, calculatePosition, orientation };\n};\n"],"mappings":";;;;;AAoBA,MAAM,mBAAmB,WACvB,QAAQ,aAAa,gBAAgB,KAAK;AAQ5C,MAAa,mBACX,aACA,EACE,WAAW,iBACX,cAAc,OACd,cAAc,iBACH;CACX,UAAU;CACV,aAAa;CACb,aAAa;CACd,KACE;CACH,MAAM,CAAC,yBAAyB,8BAC9B,SAA4B,KAAK;CAEnC,MAAM,CAAC,aAAa,kBAAkB,SAA6B,KAAK;CACxE,MAAM,iBAAiB,OAA8B,KAAK;CAC1D,MAAM,kBAAkB,OAA0B,KAAK;CAEvD,MAAM,cAAc,YAAY,QAAQ;CAExC,MAAM,0BAA0B;EAC9B,IAAI,gBAAoC;AAExC,MAAI,aAAa;AACf,mBAAgB;AAEhB,OAAI,eAAe,SAAS;AAC1B,iBAAa,eAAe,QAAQ;AACpC,mBAAe,UAAU;;QAG3B,iBAAgB,YAAY,QAAQ,KAAK,SAAS,IAAI;AAGxD,MAAI,CAAC,eAAe;AAElB,OAAI,gBAAgB,WAClB,6BAA4B,SAAS;IACnC,MAAM,eAAe;IACrB,MAAM,cAAkC;KACtC,KAAK,cAAc,OAAO;KAC1B,QAAQ,cAAc,UAAU;KAChC,SAAS;KACV;AACD,oBAAgB,UAAU;AAC1B,WAAO;KACP;OAEF,6BAA4B,SAAS;IACnC,MAAM,iBAAiB;IACvB,MAAM,cAAoC;KACxC,MAAM,gBAAgB,QAAQ;KAC9B,OAAO,gBAAgB,SAAS;KAChC,SAAS;KACV;AACD,oBAAgB,UAAU;AAC1B,WAAO;KACP;AAEJ;;AAGF,MAAI,gBAAgB,YAAY;GAI9B,MAAM,cAAc;IAClB,KAJU,cAAc;IAKxB,QAJa,cAAc;IAK3B,SAAS;IACV;AACD,8BAA2B,YAAY;AACvC,mBAAgB,UAAU;SACrB;GAIL,MAAM,cAAc;IAClB,MAJW,cAAc;IAKzB,OAJY,cAAc;IAK1B,SAAS;IACV;AACD,8BAA2B,YAAY;AACvC,mBAAgB,UAAU;;;AAI9B,iBAAgB;AACd,qBAAmB;AAGnB,SAAO,iBAAiB,UAAU,kBAAkB;AACpD,SAAO,iBAAiB,oBAAoB,kBAAkB;EAG9D,MAAM,oBAAwC,EAAE;AAEhD,cAAY,QAAQ,SAAS,WAAW;AACtC,OAAI,QAAQ;IACV,MAAM,WAAW,IAAI,kBAAkB,cAAc;AACnD,UAAK,MAAM,YAAY,UACrB,KACE,SAAS,SAAS,gBAClB,SAAS,kBAAkB,iBAC3B;AACA,yBAAmB;AACnB;;MAGJ;AAEF,aAAS,QAAQ,QAAQ;KACvB,YAAY;KACZ,iBAAiB,CAAC,gBAAgB;KACnC,CAAC;AAEF,sBAAkB,KAAK,SAAS;;IAElC;EAGF,MAAM,kBAAoC,EAAE;EAE5C,MAAM,eAAe,YAAyB;AAC5C,OAAI,CAAC,QAAS;GACd,MAAM,iBAAiB,IAAI,qBAAqB;AAC9C,uBAAmB;KACnB;AACF,kBAAe,QAAQ,QAAQ;AAC/B,mBAAgB,KAAK,eAAe;;EAItC,MAAM,eAAe,YAAY,QAAQ,KAAK,SAAS,IAAI;AAE3D,MAAI,aACF,aAAY,aAAa;AAI3B,MAAI,YACF,aAAY,YAAY;EAI1B,MAAM,oBAAoB,UAAiB;AAEzC,OAAI,eAAe,SAAS;AAC1B,iBAAa,eAAe,QAAQ;AACpC,mBAAe,UAAU;;AAE3B,kBAAe,MAAM,cAA6B;;EAGpD,MAAM,yBAAyB;AAE7B,OAAI,eAAe,QACjB,cAAa,eAAe,QAAQ;AAKtC,kBAAe,UAAU,iBAAiB;AACxC,mBAAe,KAAK;MACnB,IAAI;;AAGT,MAAI,YACF,aAAY,QAAQ,SAAS,WAAW;AACtC,WAAQ,iBAAiB,cAAc,kBAAkB,EACvD,SAAS,MACV,CAAC;AACF,WAAQ,iBAAiB,cAAc,kBAAkB,EACvD,SAAS,MACV,CAAC;IACF;AAGJ,eAAa;AAEX,OAAI,eAAe,QACjB,cAAa,eAAe,QAAQ;AAItC,UAAO,oBAAoB,UAAU,kBAAkB;AACvD,UAAO,oBAAoB,oBAAoB,kBAAkB;AAGjE,qBAAkB,SAAS,aAAa;AACtC,aAAS,YAAY;KACrB;AAGF,mBAAgB,SAAS,aAAa;AACpC,aAAS,YAAY;KACrB;AAGF,eAAY,QAAQ,SAAS,WAAW;AACtC,YAAQ,oBAAoB,cAAc,iBAAiB;AAC3D,YAAQ,oBAAoB,cAAc,iBAAiB;KAC3D;;IAEH;EAAC;EAAa;EAAU;EAAa;EAAa;EAAY,CAAC;AAElE,QAAO;EAAE;EAAyB;EAAmB;EAAa"}
+{"version":3,"file":"useItemSelector.mjs","names":[],"sources":["../../../src/hooks/useItemSelector.ts"],"sourcesContent":["'use client';\n\nimport { type RefObject, useLayoutEffect, useRef, useState } from 'react';\n\nexport type ItemSelectorOrientation = 'horizontal' | 'vertical';\n\ntype HorizontalStyleState = {\n  left: number;\n  width: number;\n  opacity: number;\n};\n\ntype VerticalStyleState = {\n  top: number;\n  height: number;\n  opacity: number;\n};\n\ntype StyleState = HorizontalStyleState | VerticalStyleState;\n\nconst selectorDefault = (option: HTMLElement) =>\n  option?.getAttribute('aria-selected') === 'true';\n\ntype Options = {\n  selector?: (option: HTMLElement, index: number) => boolean;\n  isHoverable?: boolean;\n  orientation?: ItemSelectorOrientation;\n};\n\nexport const useItemSelector = (\n  optionsRefs: RefObject<HTMLElement[]>,\n  {\n    selector = selectorDefault,\n    isHoverable = false,\n    orientation = 'horizontal',\n  }: Options = {\n    selector: selectorDefault,\n    isHoverable: false,\n    orientation: 'horizontal',\n  }\n) => {\n  const [choiceIndicatorPosition, setChoiceIndicatorPosition] =\n    useState<StyleState | null>(null);\n\n  const [hoveredItem, setHoveredItem] = useState<HTMLElement | null>(null);\n  const hideTimeoutRef = useRef<NodeJS.Timeout | null>(null);\n  const lastPositionRef = useRef<StyleState | null>(null);\n\n  const itemsLength = optionsRefs.current.length;\n\n  const calculatePosition = () => {\n    let targetElement: HTMLElement | null = null;\n\n    if (hoveredItem) {\n      targetElement = hoveredItem;\n      // Clear any pending hide timeout when hovering over an item\n      if (hideTimeoutRef.current) {\n        clearTimeout(hideTimeoutRef.current);\n        hideTimeoutRef.current = null;\n      }\n    } else {\n      targetElement = optionsRefs.current.find(selector) ?? null;\n    }\n\n    if (!targetElement) {\n      // Keep previous position but set opacity to 0\n      if (orientation === 'vertical') {\n        const verticalPrev =\n          lastPositionRef.current as VerticalStyleState | null;\n        const newPosition: VerticalStyleState = {\n          top: verticalPrev?.top ?? 0,\n          height: verticalPrev?.height ?? 0,\n          opacity: 0,\n        };\n\n        if (verticalPrev?.opacity !== 0) {\n          setChoiceIndicatorPosition(newPosition);\n          lastPositionRef.current = newPosition;\n        }\n      } else {\n        const horizontalPrev =\n          lastPositionRef.current as HorizontalStyleState | null;\n        const newPosition: HorizontalStyleState = {\n          left: horizontalPrev?.left ?? 0,\n          width: horizontalPrev?.width ?? 0,\n          opacity: 0,\n        };\n\n        if (horizontalPrev?.opacity !== 0) {\n          setChoiceIndicatorPosition(newPosition);\n          lastPositionRef.current = newPosition;\n        }\n      }\n      return;\n    }\n\n    if (orientation === 'vertical') {\n      const top = targetElement.offsetTop;\n      const height = targetElement.offsetHeight;\n\n      const newPosition = {\n        top,\n        height,\n        opacity: 1,\n      };\n\n      const prev = lastPositionRef.current as VerticalStyleState | null;\n\n      if (\n        !prev ||\n        prev.top !== top ||\n        prev.height !== height ||\n        prev.opacity !== 1\n      ) {\n        setChoiceIndicatorPosition(newPosition);\n        lastPositionRef.current = newPosition;\n      }\n    } else {\n      const left = targetElement.offsetLeft;\n      const width = targetElement.offsetWidth;\n\n      const newPosition = {\n        left,\n        width,\n        opacity: 1,\n      };\n\n      const prev = lastPositionRef.current as HorizontalStyleState | null;\n\n      if (\n        !prev ||\n        prev.left !== left ||\n        prev.width !== width ||\n        prev.opacity !== 1\n      ) {\n        setChoiceIndicatorPosition(newPosition);\n        lastPositionRef.current = newPosition;\n      }\n    }\n  };\n\n  useLayoutEffect(() => {\n    calculatePosition();\n\n    // Event listeners for window events\n    window.addEventListener('resize', calculatePosition);\n    window.addEventListener('DOMContentLoaded', calculatePosition);\n\n    // MutationObserver to watch for 'aria-selected' changes\n    const mutationObservers: MutationObserver[] = [];\n\n    optionsRefs.current.forEach((option) => {\n      if (option) {\n        const observer = new MutationObserver((mutations) => {\n          for (const mutation of mutations) {\n            if (\n              mutation.type === 'attributes' &&\n              (mutation.attributeName === 'aria-selected' ||\n                mutation.attributeName === 'data-active' ||\n                mutation.attributeName === 'data-indicator')\n            ) {\n              calculatePosition();\n              break;\n            }\n          }\n        });\n\n        observer.observe(option, {\n          attributes: true,\n          attributeFilter: ['aria-selected', 'data-active', 'data-indicator'],\n        });\n\n        mutationObservers.push(observer);\n      }\n    });\n\n    // ResizeObserver to watch for size changes\n    const resizeObservers: ResizeObserver[] = [];\n\n    const observeSize = (element: HTMLElement) => {\n      if (!element) return;\n      const resizeObserver = new ResizeObserver(() => {\n        calculatePosition();\n      });\n      resizeObserver.observe(element);\n      resizeObservers.push(resizeObserver);\n    };\n\n    // Observe the selected item\n    const selectedItem = optionsRefs.current.find(selector) ?? null;\n\n    if (selectedItem) {\n      observeSize(selectedItem);\n    }\n\n    // Observe the hovered item\n    if (hoveredItem) {\n      observeSize(hoveredItem);\n    }\n\n    // Add hover event listeners\n    const handleMouseEnter = (event: Event) => {\n      // Clear any pending hide timeout\n      if (hideTimeoutRef.current) {\n        clearTimeout(hideTimeoutRef.current);\n        hideTimeoutRef.current = null;\n      }\n      setHoveredItem(event.currentTarget as HTMLElement);\n    };\n\n    const handleMouseLeave = () => {\n      // Clear any existing timeout\n      if (hideTimeoutRef.current) {\n        clearTimeout(hideTimeoutRef.current);\n      }\n\n      // Keep the indicator at its current position for 150ms\n      // before removing the hovered item\n      hideTimeoutRef.current = setTimeout(() => {\n        setHoveredItem(null);\n      }, 150); // 150ms delay before hiding\n    };\n\n    if (isHoverable) {\n      optionsRefs.current.forEach((option) => {\n        option?.addEventListener('mouseenter', handleMouseEnter, {\n          passive: true,\n        });\n        option?.addEventListener('mouseleave', handleMouseLeave, {\n          passive: true,\n        });\n      });\n    }\n\n    return () => {\n      // Clear any pending hide timeout\n      if (hideTimeoutRef.current) {\n        clearTimeout(hideTimeoutRef.current);\n      }\n\n      // Cleanup window event listeners\n      window.removeEventListener('resize', calculatePosition);\n      window.removeEventListener('DOMContentLoaded', calculatePosition);\n\n      // Disconnect MutationObservers\n      mutationObservers.forEach((observer) => {\n        observer.disconnect();\n      });\n\n      // Disconnect ResizeObservers\n      resizeObservers.forEach((observer) => {\n        observer.disconnect();\n      });\n\n      // Remove hover event listeners\n      optionsRefs.current.forEach((option) => {\n        option?.removeEventListener('mouseenter', handleMouseEnter);\n        option?.removeEventListener('mouseleave', handleMouseLeave);\n      });\n    };\n  }, [\n    optionsRefs,\n    selector,\n    hoveredItem,\n    itemsLength,\n    orientation,\n    isHoverable,\n  ]);\n\n  return { choiceIndicatorPosition, calculatePosition, orientation };\n};\n"],"mappings":"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"}

package/dist/esm/providers/ReactQueryProvider.mjs

@@ -1,22 +1,38 @@
 'use client';
 
 import { useToast } from "../components/Toaster/useToast.mjs";
+import { createAsyncStoragePersister } from "@tanstack/query-async-storage-persister";
 import { MutationCache, QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { PersistQueryClientProvider } from "@tanstack/react-query-persist-client";
 import { useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/providers/ReactQueryProvider.tsx
+const PERSIST_MAX_AGE = 1e3 * 60 * 60 * 24;
+const PERSIST_BUSTER = "v1";
 const defaultQueryOptions = {
 	queries: {
 		retry: 1,
 		staleTime: 30 * 1e3,
-		gcTime: 300 * 1e3,
+		gcTime: PERSIST_MAX_AGE,
 		refetchOnMount: true,
 		refetchOnWindowFocus: false,
 		refetchOnReconnect: false
 	},
 	mutations: { retry: 0 }
 };
+const persister = createAsyncStoragePersister({
+	storage: typeof window !== "undefined" ? {
+		getItem: (key) => Promise.resolve(window.localStorage.getItem(key)),
+		setItem: (key, value) => Promise.resolve(window.localStorage.setItem(key, value)),
+		removeItem: (key) => Promise.resolve(window.localStorage.removeItem(key))
+	} : {
+		getItem: () => Promise.resolve(null),
+		setItem: () => Promise.resolve(),
+		removeItem: () => Promise.resolve()
+	},
+	key: "intlayer-rq-cache"
+});
 const formatErrorCode = (errorCode) => errorCode.split("_").join(" ");
 /**
 * Hook to handle error logging and toast notifications
@@ -64,29 +80,48 @@ const useToastEvents = () => {
 	};
 };
 const getQueryClient = () => new QueryClient({ defaultOptions: defaultQueryOptions });
-const ReactQueryProvider = ({ children }) => {
+const ReactQueryProvider = ({ children, client }) => {
 	const { onError, onSuccess } = useToastEvents();
-	const clientRef = useRef(null);
-	if (!clientRef.current) {
-		const queryClient = new QueryClient({
-			defaultOptions: defaultQueryOptions,
-			mutationCache: new MutationCache({
-				onSuccess,
-				onError,
-				onSettled: (_data, _error, _variables, _context, mutation) => {
-					if (mutation.meta?.invalidateQueries) mutation.meta.invalidateQueries.forEach((queryKey) => {
-						queryClient.invalidateQueries({ queryKey });
-					});
-					if (mutation.meta?.resetQueries) mutation.meta.resetQueries.forEach((queryKey) => {
-						queryClient.resetQueries({ queryKey });
-					});
-				}
-			})
-		});
-		clientRef.current = queryClient;
+	const handlersRef = useRef({
+		onSuccess,
+		onError
+	});
+	handlersRef.current = {
+		onSuccess,
+		onError
+	};
+	const clientRef = useRef(client ?? null);
+	if (!clientRef.current) clientRef.current = new QueryClient({
+		defaultOptions: defaultQueryOptions,
+		mutationCache: new MutationCache()
+	});
+	const wiredRef = useRef(false);
+	if (!wiredRef.current) {
+		wiredRef.current = true;
+		const cache = clientRef.current.getMutationCache();
+		cache.config.onSuccess = (data, variables, onMutateResult, mutation, context) => handlersRef.current.onSuccess?.(data, variables, onMutateResult, mutation, context);
+		cache.config.onError = (error, variables, onMutateResult, mutation, context) => handlersRef.current.onError?.(error, variables, onMutateResult, mutation, context);
+		cache.config.onSettled = (_data, _error, _variables, _onMutateResult, mutation) => {
+			if (mutation.meta?.invalidateQueries) mutation.meta.invalidateQueries.forEach((queryKey) => {
+				clientRef.current?.invalidateQueries({ queryKey });
+			});
+			if (mutation.meta?.resetQueries) mutation.meta.resetQueries.forEach((queryKey) => {
+				clientRef.current?.resetQueries({ queryKey });
+			});
+		};
 	}
-	return /* @__PURE__ */ jsx(QueryClientProvider, {
+	if (client) return /* @__PURE__ */ jsx(QueryClientProvider, {
+		client: clientRef.current,
+		children
+	});
+	return /* @__PURE__ */ jsx(PersistQueryClientProvider, {
 		client: clientRef.current,
+		persistOptions: {
+			persister,
+			maxAge: PERSIST_MAX_AGE,
+			buster: PERSIST_BUSTER,
+			dehydrateOptions: { shouldDehydrateQuery: (query) => query.state.status === "success" }
+		},
 		children
 	});
 };

package/dist/esm/providers/ReactQueryProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ReactQueryProvider.mjs","names":[],"sources":["../../../src/providers/ReactQueryProvider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type DefaultOptions,\n  MutationCache,\n  QueryClient,\n  QueryClientProvider,\n  type QueryKey,\n  type UseMutationOptions,\n} from '@tanstack/react-query';\nimport { type FC, type PropsWithChildren, useRef } from 'react';\nimport { useToast } from '../components/Toaster';\n\nconst defaultQueryOptions: DefaultOptions = {\n  queries: {\n    retry: 1,\n    // Keep data fresh for 30 seconds to avoid unnecessary refetches during navigation\n    staleTime: 30 * 1000,\n    // Give the cache a little breathing room across route transitions:\n    gcTime: 5 * 60 * 1000, // e.g. 5 minutes\n    // Only refetch on mount if data is stale (not every single mount)\n    refetchOnMount: true,\n    refetchOnWindowFocus: false,\n    refetchOnReconnect: false,\n  },\n  mutations: {\n    retry: 0,\n  },\n};\n\nconst SHOW_ERROR_CODE = false;\n\ndeclare module '@tanstack/react-query' {\n  interface Register {\n    mutationMeta: {\n      onSuccess?: UseMutationOptions['onSuccess'];\n      onError?: UseMutationOptions['onError'];\n      invalidateQueries?: QueryKey[];\n      resetQueries?: QueryKey[];\n    };\n  }\n}\n\nconst formatErrorCode = (errorCode: string) => errorCode.split('_').join(' ');\n\n/**\n * Hook to handle error logging and toast notifications\n */\nconst useToastEvents = () => {\n  const { toast } = useToast();\n\n  const onError: MutationCache['config']['onError'] = (error: any) => {\n    const parsed = (() => {\n      try {\n        if (typeof error === 'string') return JSON.parse(error);\n        if (error instanceof Error) return JSON.parse(error.message);\n      } catch (_) {}\n      return error;\n    })();\n\n    [parsed].flat().forEach((err: any) => {\n      // Check for nested error object (standard in your API responses: { statusCode, error: { ... } })\n      const apiError = err?.error ?? err;\n\n      if (apiError?.code === 'RATE_LIMIT_EXCEEDED_UNAUTHENTICATED') {\n        toast({\n          title: apiError.message,\n          variant: 'error',\n        });\n        return;\n      }\n\n      toast({\n        title: formatErrorCode(\n          SHOW_ERROR_CODE\n            ? (apiError?.code ?? err?.code)\n            : (apiError?.title ?? err?.title ?? 'Error')\n        ),\n        description:\n          apiError?.message ??\n          err?.message ??\n          String(apiError ?? 'An error occurred'),\n        variant: 'error',\n      });\n    });\n  };\n\n  const onSuccess: MutationCache['config']['onSuccess'] = (data: any) => {\n    if (data?.error) {\n      toast({\n        title: formatErrorCode(data.error.title ?? data.error.code ?? 'Error'),\n        description:\n          data.error.message ?? data.error.code ?? 'An error occurred',\n        variant: 'error',\n      });\n    }\n\n    if (data?.message) {\n      toast({\n        title: data.message,\n        description: data.description,\n        variant: 'success',\n      });\n    }\n  };\n\n  return {\n    onError,\n    onSuccess,\n  };\n};\n\nexport const getQueryClient = () =>\n  new QueryClient({ defaultOptions: defaultQueryOptions });\n\nexport const ReactQueryProvider: FC<PropsWithChildren> = ({ children }) => {\n  const { onError, onSuccess } = useToastEvents();\n  const clientRef = useRef<QueryClient>(null);\n\n  if (!clientRef.current) {\n    const mutationCache = new MutationCache({\n      onSuccess,\n      onError,\n      onSettled: (_data, _error, _variables, _context, mutation) => {\n        if (mutation.meta?.invalidateQueries) {\n          mutation.meta.invalidateQueries.forEach((queryKey) => {\n            queryClient.invalidateQueries({\n              queryKey,\n            });\n          });\n        }\n\n        if (mutation.meta?.resetQueries) {\n          mutation.meta.resetQueries.forEach((queryKey) => {\n            queryClient.resetQueries({\n              queryKey,\n            });\n          });\n        }\n      },\n    });\n\n    const queryClient = new QueryClient({\n      defaultOptions: defaultQueryOptions,\n      mutationCache,\n    });\n    clientRef.current = queryClient;\n  }\n\n  return (\n    <QueryClientProvider client={clientRef.current}>\n      {children}\n    </QueryClientProvider>\n  );\n};\n"],"mappings":";;;;;;;;AAaA,MAAM,sBAAsC;CAC1C,SAAS;EACP,OAAO;EAEP,WAAW,KAAK;EAEhB,QAAQ,MAAS;EAEjB,gBAAgB;EAChB,sBAAsB;EACtB,oBAAoB;EACrB;CACD,WAAW,EACT,OAAO,GACR;CACF;AAeD,MAAM,mBAAmB,cAAsB,UAAU,MAAM,IAAI,CAAC,KAAK,IAAI;;;;AAK7E,MAAM,uBAAuB;CAC3B,MAAM,EAAE,UAAU,UAAU;CAE5B,MAAM,WAA+C,UAAe;AASlE,UARsB;AACpB,OAAI;AACF,QAAI,OAAO,UAAU,SAAU,QAAO,KAAK,MAAM,MAAM;AACvD,QAAI,iBAAiB,MAAO,QAAO,KAAK,MAAM,MAAM,QAAQ;YACrD,GAAG;AACZ,UAAO;MAGF,CAAC,CAAC,MAAM,CAAC,SAAS,QAAa;GAEpC,MAAM,WAAW,KAAK,SAAS;AAE/B,OAAI,UAAU,SAAS,uCAAuC;AAC5D,UAAM;KACJ,OAAO,SAAS;KAChB,SAAS;KACV,CAAC;AACF;;AAGF,SAAM;IACJ,OAAO,gBAGA,UAAU,SAAS,KAAK,SAAS,QACvC;IACD,aACE,UAAU,WACV,KAAK,WACL,OAAO,YAAY,oBAAoB;IACzC,SAAS;IACV,CAAC;IACF;;CAGJ,MAAM,aAAmD,SAAc;AACrE,MAAI,MAAM,MACR,OAAM;GACJ,OAAO,gBAAgB,KAAK,MAAM,SAAS,KAAK,MAAM,QAAQ,QAAQ;GACtE,aACE,KAAK,MAAM,WAAW,KAAK,MAAM,QAAQ;GAC3C,SAAS;GACV,CAAC;AAGJ,MAAI,MAAM,QACR,OAAM;GACJ,OAAO,KAAK;GACZ,aAAa,KAAK;GAClB,SAAS;GACV,CAAC;;AAIN,QAAO;EACL;EACA;EACD;;AAGH,MAAa,uBACX,IAAI,YAAY,EAAE,gBAAgB,qBAAqB,CAAC;AAE1D,MAAa,sBAA6C,EAAE,eAAe;CACzE,MAAM,EAAE,SAAS,cAAc,gBAAgB;CAC/C,MAAM,YAAY,OAAoB,KAAK;AAE3C,KAAI,CAAC,UAAU,SAAS;EAuBtB,MAAM,cAAc,IAAI,YAAY;GAClC,gBAAgB;GAChB,mBAxBwB,cAAc;IACtC;IACA;IACA,YAAY,OAAO,QAAQ,YAAY,UAAU,aAAa;AAC5D,SAAI,SAAS,MAAM,kBACjB,UAAS,KAAK,kBAAkB,SAAS,aAAa;AACpD,kBAAY,kBAAkB,EAC5B,UACD,CAAC;OACF;AAGJ,SAAI,SAAS,MAAM,aACjB,UAAS,KAAK,aAAa,SAAS,aAAa;AAC/C,kBAAY,aAAa,EACvB,UACD,CAAC;OACF;;IAGP,CAIc;GACd,CAAC;AACF,YAAU,UAAU;;AAGtB,QACE,oBAAC,qBAAD;EAAqB,QAAQ,UAAU;EACpC;EACmB"}
+{"version":3,"file":"ReactQueryProvider.mjs","names":[],"sources":["../../../src/providers/ReactQueryProvider.tsx"],"sourcesContent":["'use client';\n\nimport { createAsyncStoragePersister } from '@tanstack/query-async-storage-persister';\nimport {\n  type DefaultOptions,\n  MutationCache,\n  QueryClient,\n  QueryClientProvider,\n  type QueryKey,\n  type UseMutationOptions,\n} from '@tanstack/react-query';\nimport { PersistQueryClientProvider } from '@tanstack/react-query-persist-client';\nimport { type FC, type PropsWithChildren, useRef } from 'react';\nimport { useToast } from '../components/Toaster';\n\nconst PERSIST_MAX_AGE = 1000 * 60 * 60 * 24; // 24h\n// Bump to invalidate every persisted cache after a breaking change in query shapes\nconst PERSIST_BUSTER = 'v1';\n\nconst defaultQueryOptions: DefaultOptions = {\n  queries: {\n    retry: 1,\n    // Keep data fresh for 30 seconds to avoid unnecessary refetches during navigation\n    staleTime: 30 * 1000,\n    // gcTime must be >= persist maxAge, otherwise restored entries are dropped on rehydrate\n    gcTime: PERSIST_MAX_AGE,\n    // Only refetch on mount if data is stale (not every single mount)\n    refetchOnMount: true,\n    refetchOnWindowFocus: false,\n    refetchOnReconnect: false,\n  },\n  mutations: {\n    retry: 0,\n  },\n};\n\nconst browserLocalStorage = {\n  getItem: (key: string) => Promise.resolve(window.localStorage.getItem(key)),\n  setItem: (key: string, value: string) =>\n    Promise.resolve(window.localStorage.setItem(key, value)),\n  removeItem: (key: string) =>\n    Promise.resolve(window.localStorage.removeItem(key)),\n};\n\nconst noopStorage = {\n  getItem: () => Promise.resolve(null),\n  setItem: () => Promise.resolve(),\n  removeItem: () => Promise.resolve(),\n};\n\nconst persister = createAsyncStoragePersister({\n  storage: typeof window !== 'undefined' ? browserLocalStorage : noopStorage,\n  key: 'intlayer-rq-cache',\n});\n\nconst SHOW_ERROR_CODE = false;\n\ndeclare module '@tanstack/react-query' {\n  interface Register {\n    mutationMeta: {\n      onSuccess?: UseMutationOptions['onSuccess'];\n      onError?: UseMutationOptions['onError'];\n      invalidateQueries?: QueryKey[];\n      resetQueries?: QueryKey[];\n    };\n  }\n}\n\nconst formatErrorCode = (errorCode: string) => errorCode.split('_').join(' ');\n\n/**\n * Hook to handle error logging and toast notifications\n */\nconst useToastEvents = () => {\n  const { toast } = useToast();\n\n  const onError: MutationCache['config']['onError'] = (error: any) => {\n    const parsed = (() => {\n      try {\n        if (typeof error === 'string') return JSON.parse(error);\n        if (error instanceof Error) return JSON.parse(error.message);\n      } catch (_) {}\n      return error;\n    })();\n\n    [parsed].flat().forEach((err: any) => {\n      // Check for nested error object (standard in your API responses: { statusCode, error: { ... } })\n      const apiError = err?.error ?? err;\n\n      if (apiError?.code === 'RATE_LIMIT_EXCEEDED_UNAUTHENTICATED') {\n        toast({\n          title: apiError.message,\n          variant: 'error',\n        });\n        return;\n      }\n\n      toast({\n        title: formatErrorCode(\n          SHOW_ERROR_CODE\n            ? (apiError?.code ?? err?.code)\n            : (apiError?.title ?? err?.title ?? 'Error')\n        ),\n        description:\n          apiError?.message ??\n          err?.message ??\n          String(apiError ?? 'An error occurred'),\n        variant: 'error',\n      });\n    });\n  };\n\n  const onSuccess: MutationCache['config']['onSuccess'] = (data: any) => {\n    if (data?.error) {\n      toast({\n        title: formatErrorCode(data.error.title ?? data.error.code ?? 'Error'),\n        description:\n          data.error.message ?? data.error.code ?? 'An error occurred',\n        variant: 'error',\n      });\n    }\n\n    if (data?.message) {\n      toast({\n        title: data.message,\n        description: data.description,\n        variant: 'success',\n      });\n    }\n  };\n\n  return {\n    onError,\n    onSuccess,\n  };\n};\n\nexport const getQueryClient = () =>\n  new QueryClient({ defaultOptions: defaultQueryOptions });\n\ninterface ReactQueryProviderProps {\n  client?: QueryClient;\n}\n\nexport const ReactQueryProvider: FC<\n  PropsWithChildren<ReactQueryProviderProps>\n> = ({ children, client }) => {\n  const { onError, onSuccess } = useToastEvents();\n  // Keep handlers in a ref so the cache config (set once below) always calls\n  // the latest closures from useToastEvents without needing re-wiring.\n  const handlersRef = useRef({ onSuccess, onError });\n  handlersRef.current = { onSuccess, onError };\n\n  const clientRef = useRef<QueryClient>(client ?? null);\n\n  if (!clientRef.current) {\n    clientRef.current = new QueryClient({\n      defaultOptions: defaultQueryOptions,\n      mutationCache: new MutationCache(),\n    });\n  }\n\n  // Wire toast handlers + meta-driven invalidation onto whatever client we\n  // ended up with. Required even when the client is created externally (e.g.\n  // via getQueryClient() in TanStack Router context), since the externally\n  // created client ships with a bare MutationCache.\n  const wiredRef = useRef(false);\n  if (!wiredRef.current) {\n    wiredRef.current = true;\n    const cache = clientRef.current.getMutationCache();\n    cache.config.onSuccess = (\n      data,\n      variables,\n      onMutateResult,\n      mutation,\n      context\n    ) =>\n      handlersRef.current.onSuccess?.(\n        data,\n        variables,\n        onMutateResult,\n        mutation,\n        context\n      );\n    cache.config.onError = (\n      error,\n      variables,\n      onMutateResult,\n      mutation,\n      context\n    ) =>\n      handlersRef.current.onError?.(\n        error,\n        variables,\n        onMutateResult,\n        mutation,\n        context\n      );\n    cache.config.onSettled = (\n      _data,\n      _error,\n      _variables,\n      _onMutateResult,\n      mutation\n    ) => {\n      if (mutation.meta?.invalidateQueries) {\n        mutation.meta.invalidateQueries.forEach((queryKey) => {\n          clientRef.current?.invalidateQueries({ queryKey });\n        });\n      }\n\n      if (mutation.meta?.resetQueries) {\n        mutation.meta.resetQueries.forEach((queryKey) => {\n          clientRef.current?.resetQueries({ queryKey });\n        });\n      }\n    };\n  }\n\n  if (client) {\n    return (\n      <QueryClientProvider client={clientRef.current}>\n        {children}\n      </QueryClientProvider>\n    );\n  }\n\n  return (\n    <PersistQueryClientProvider\n      client={clientRef.current}\n      persistOptions={{\n        persister,\n        maxAge: PERSIST_MAX_AGE,\n        buster: PERSIST_BUSTER,\n        dehydrateOptions: {\n          shouldDehydrateQuery: (query) => query.state.status === 'success',\n        },\n      }}\n    >\n      {children}\n    </PersistQueryClientProvider>\n  );\n};\n"],"mappings":"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"}

package/dist/types/components/Badge/index.d.ts

@@ -43,8 +43,8 @@ declare enum BadgeSize {
  * @description Defines the styling variants for different badge combinations
  */
 declare const badgeVariants: (props?: {
-  color?: "error" | "custom" | "text" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark" | "success";
-  variant?: "none" | "default" | "outline" | "hoverable";
+  color?: "text" | "error" | "custom" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark" | "success";
+  variant?: "none" | "default" | "hoverable" | "outline";
   size?: "sm" | "md" | "lg";
 } & _$class_variance_authority_types0.ClassProp) => string;
 /**

package/dist/types/components/Button/Button.d.ts

@@ -61,10 +61,10 @@ declare enum ButtonTextAlign {
  */
 declare const buttonVariants: (props?: {
   size?: "sm" | "md" | "lg" | "xl" | "icon-sm" | "icon-md" | "icon-lg" | "icon-xl";
-  color?: "error" | "custom" | "text" | "primary" | "secondary" | "destructive" | "neutral" | "card" | "light" | "dark" | "current" | "text-inverse" | "success";
-  roundedSize?: "none" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "full";
-  variant?: "input" | "none" | "default" | "outline" | "link" | "invisible-link" | "hoverable" | "fade";
-  textAlign?: "left" | "center" | "right";
+  color?: "text" | "error" | "custom" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark" | "text-inverse" | "success" | "card" | "current";
+  roundedSize?: "sm" | "md" | "lg" | "xl" | "2xl" | "none" | "3xl" | "full" | "4xl" | "5xl";
+  variant?: "none" | "default" | "input" | "invisible-link" | "hoverable" | "outline" | "link" | "fade";
+  textAlign?: "left" | "right" | "center";
   isFullWidth?: boolean;
 } & _$class_variance_authority_types0.ClassProp) => string;
 /**

package/dist/types/components/CollapsibleTable/CollapsibleTable.d.ts

@@ -5,8 +5,8 @@ import { VariantProps } from "class-variance-authority";
 //#region src/components/CollapsibleTable/CollapsibleTable.d.ts
 declare const collapsibleTableVariants: (props?: {
   size?: "sm" | "md" | "lg" | "xl" | "full";
-  variant?: "default" | "dark" | "ghost" | "outlined";
-  spacing?: "none" | "sm" | "md" | "lg" | "auto";
+  variant?: "default" | "ghost" | "dark" | "outlined";
+  spacing?: "sm" | "md" | "lg" | "none" | "auto";
 } & _$class_variance_authority_types0.ClassProp) => string;
 interface CollapsibleTableProps extends Omit<HTMLAttributes<HTMLElement>, 'title'>, VariantProps<typeof collapsibleTableVariants> {
   /** Table title displayed in the header */

package/dist/types/components/Container/index.d.ts

@@ -8,14 +8,14 @@ import { VariantProps } from "class-variance-authority";
  * Provides flexible styling options for background, padding, borders, and layout
  */
 declare const containerVariants: (props?: {
-  roundedSize?: "none" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "full";
-  transparency?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full";
-  padding?: "none" | "sm" | "md" | "lg" | "xl" | "2xl";
+  roundedSize?: "sm" | "md" | "lg" | "xl" | "2xl" | "none" | "3xl" | "full" | "4xl";
+  transparency?: "xs" | "sm" | "md" | "lg" | "xl" | "none" | "full";
+  padding?: "sm" | "md" | "lg" | "xl" | "2xl" | "none";
   separator?: "both" | "without" | "x" | "y";
-  border?: "with" | "none";
+  border?: "none" | "with";
   borderColor?: "error" | "success" | "text" | "primary" | "secondary" | "neutral" | "card" | "warning";
-  background?: "with" | "none" | "hoverable";
-  gap?: "none" | "sm" | "md" | "lg" | "xl" | "2xl";
+  background?: "none" | "with" | "hoverable";
+  gap?: "sm" | "md" | "lg" | "xl" | "2xl" | "none";
 } & _$class_variance_authority_types0.ClassProp) => string;
 /** Available rounded corner sizes for the container */
 declare enum ContainerRoundedSize {

package/dist/types/components/IDE/Code.d.ts

@@ -1,5 +1,5 @@
 import { CodeFormat, ContentDeclarationFormat, PackageManager } from "./CodeContext.js";
-import { FC, HTMLAttributes } from "react";
+import { FC, HTMLAttributes, ReactNode } from "react";
 import { BundledLanguage } from "shiki/bundle/web";
 
 //#region src/components/IDE/Code.d.ts
@@ -10,7 +10,7 @@ type CodeCompAttributes = {
   contentDeclarationFormat?: ContentDeclarationFormat | string | string[];
 };
 type CodeCompProps = {
-  children: string;
+  children: ReactNode;
   fileName?: string;
   language: BundledLanguage;
   isDarkMode?: boolean;

package/dist/types/components/IDE/Code.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Code.d.ts","names":[],"sources":["../../../../src/components/IDE/Code.tsx"],"mappings":";;;;;KAsBY,kBAAA;EACV,QAAA;EACA,cAAA,GAAiB,cAAA,EAFW;EAI5B,UAAA,GAAa,UAAA;EACb,wBAAA,GAA2B,wBAAA;AAAA;AAAA,KAGxB,aAAA;EACH,QAAA;EACA,QAAA;EACA,QAAA,EAAU,eAAA;EACV,UAAA;EACA,UAAA;EACA,eAAA;EACA,UAAA;AAAA,IACE,kBAAA,GACF,cAAA,CAAe,cAAA;AAAA,cAwBJ,IAAA,EAAM,EAAA,CAAG,aAAA"}
+{"version":3,"file":"Code.d.ts","names":[],"sources":["../../../../src/components/IDE/Code.tsx"],"mappings":";;;;;KAsBY,kBAAA;EACV,QAAA;EACA,cAAA,GAAiB,cAAA,EAFW;EAI5B,UAAA,GAAa,UAAA;EACb,wBAAA,GAA2B,wBAAA;AAAA;AAAA,KAGxB,aAAA;EACH,QAAA,EAAU,SAAA;EACV,QAAA;EACA,QAAA,EAAU,eAAA;EACV,UAAA;EACA,UAAA;EACA,eAAA;EACA,UAAA;AAAA,IACE,kBAAA,GACF,cAAA,CAAe,cAAA;AAAA,cAwBJ,IAAA,EAAM,EAAA,CAAG,aAAA"}

package/dist/types/components/IDE/CodeBlockClient.d.ts

@@ -1,12 +1,12 @@
-import { FC, HTMLAttributes } from "react";
+import { FC, HTMLAttributes, ReactNode } from "react";
 import { BundledLanguage, BundledLanguage as CodeLanguage } from "shiki/bundle/web";
 
 //#region src/components/IDE/CodeBlockClient.d.ts
 declare const CodeDefault: FC<{
-  children: string;
+  children: ReactNode;
 }>;
 type CodeBlockProps = {
-  children: string;
+  children: React.ReactNode;
   lang: BundledLanguage;
   isDarkMode?: boolean;
   isEditable?: boolean;

package/dist/types/components/IDE/CodeBlockClient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlockClient.d.ts","names":[],"sources":["../../../../src/components/IDE/CodeBlockClient.tsx"],"mappings":";;;;cAMa,WAAA,EAAa,EAAA;EAAK,QAAA;AAAA;AAAA,KA0BnB,cAAA;EACV,QAAA;EACA,IAAA,EAAM,eAAA;EACN,UAAA;EACA,UAAA;EACA,QAAA,IAAY,OAAA;AAAA,IACV,IAAA,CAAK,cAAA,CAAe,cAAA;AAAA,cAEX,SAAA,EAAW,EAAA,CAAG,cAAA"}
+{"version":3,"file":"CodeBlockClient.d.ts","names":[],"sources":["../../../../src/components/IDE/CodeBlockClient.tsx"],"mappings":";;;;cAYa,WAAA,EAAa,EAAA;EAAK,QAAA,EAAU,SAAA;AAAA;AAAA,KA0B7B,cAAA;EACV,QAAA,EAAU,KAAA,CAAM,SAAA;EAChB,IAAA,EAAM,eAAA;EACN,UAAA;EACA,UAAA;EACA,QAAA,IAAY,OAAA;AAAA,IACV,IAAA,CAAK,cAAA,CAAe,cAAA;AAAA,cAEX,SAAA,EAAW,EAAA,CAAG,cAAA"}

package/dist/types/components/IDE/CodeBlockHighlight.d.ts

@@ -1,10 +1,11 @@
 import { CodeFormat } from "./CodeContext.js";
+import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { BundledLanguage } from "shiki/bundle/web";
 
 //#region src/components/IDE/CodeBlockHighlight.d.ts
 type Props = {
-  /** Raw TypeScript source code (the canonical "source of truth"). */children: string; /** Language of the source (e.g. 'tsx', 'typescript'). */
+  /** Raw TypeScript source code (the canonical "source of truth"). */children: ReactNode; /** Language of the source (e.g. 'tsx', 'typescript'). */
   originalLang: BundledLanguage; /** Currently selected format: 'typescript' | 'esm' | 'commonjs'. */
   targetFormat: Exclude<CodeFormat, 'json'>;
   isDarkMode?: boolean;

package/dist/types/components/IDE/CodeBlockHighlight.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlockHighlight.d.ts","names":[],"sources":["../../../../src/components/IDE/CodeBlockHighlight.tsx"],"mappings":";;;;;KAcK,KAAA;sEAEH,QAAA,UAFG;EAIH,YAAA,EAAc,eAAA;EAEd,YAAA,EAAc,OAAA,CAAQ,UAAA;EACtB,UAAA;AAAA;AAAA,cAmBW,kBAAA;EAAsB,QAAA;EAAA,YAAA;EAAA,YAAA;EAAA;AAAA,GAKhC,KAAA,KAAK,oBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"CodeBlockHighlight.d.ts","names":[],"sources":["../../../../src/components/IDE/CodeBlockHighlight.tsx"],"mappings":";;;;;;KAcK,KAAA;EAMmB,oEAJtB,QAAA,EAAU,SAAA,EAIW;EAFrB,YAAA,EAAc,eAAA,EAFd;EAIA,YAAA,EAAc,OAAA,CAAQ,UAAA;EACtB,UAAA;AAAA;AAAA,cAmBW,kBAAA;EAAsB,QAAA;EAAA,YAAA;EAAA,YAAA;EAAA;AAAA,GAKhC,KAAA,KAAK,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/types/components/IDE/CodeBlockShiki.d.ts

@@ -1,9 +1,9 @@
-import { FC } from "react";
+import { FC, ReactNode } from "react";
 import { BundledLanguage } from "shiki/bundle/web";
 
 //#region src/components/IDE/CodeBlockShiki.d.ts
 type CodeBlockShikiProps = {
-  children: string;
+  children: ReactNode;
   lang: BundledLanguage;
   isDarkMode?: boolean;
 };

package/dist/types/components/IDE/CodeBlockShiki.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlockShiki.d.ts","names":[],"sources":["../../../../src/components/IDE/CodeBlockShiki.tsx"],"mappings":";;;;KA0JY,mBAAA;EACV,QAAA;EACA,IAAA,EAAM,eAAA;EACN,UAAA;AAAA;AAAA,cAGW,cAAA,EAAgB,EAAA,CAAG,mBAAA"}
+{"version":3,"file":"CodeBlockShiki.d.ts","names":[],"sources":["../../../../src/components/IDE/CodeBlockShiki.tsx"],"mappings":";;;;KAyJY,mBAAA;EACV,QAAA,EAAU,SAAA;EACV,IAAA,EAAM,eAAA;EACN,UAAA;AAAA;AAAA,cAGW,cAAA,EAAgB,EAAA,CAAG,mBAAA"}

package/dist/types/components/Input/Checkbox.d.ts

@@ -6,7 +6,7 @@ import { VariantProps } from "class-variance-authority";
 declare const checkboxVariants: (props?: {
   variant?: "default";
   size?: "xs" | "sm" | "md" | "lg";
-  color?: "error" | "success" | "custom" | "text" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark";
+  color?: "error" | "success" | "text" | "custom" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark";
   validationStyleEnabled?: "enabled" | "disabled";
 } & _$class_variance_authority_types0.ClassProp) => string;
 declare enum CheckboxSize {

package/dist/types/components/Input/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","names":[],"sources":["../../../../src/components/Input/Checkbox.tsx"],"mappings":";;;;;cASa,gBAAA,GAAgB,KAAA;;;;;IA0D5B,iCAAA,CAAA,SAAA;AAAA,aAEW,YAAA;EACV,EAAA;EACA,EAAA;EACA,EAAA;EACA,EAAA;AAAA;AAAA,aAGU,aAAA;EACV,OAAA;EACA,SAAA;EACA,WAAA;EACA,OAAA;EACA,KAAA;EACA,IAAA;EACA,IAAA;EACA,KAAA;EACA,OAAA;EACA,MAAA;AAAA;AAAA,KAGU,aAAA,GAAgB,IAAA,CAC1B,iBAAA,CAAkB,mBAAA,CAAoB,gBAAA,GAAmB,gBAAA;EAGzD,IAAA;EACA,sBAAA;EACA,KAAA,GAAQ,SAAA;AAAA,IACN,IAAA,CACA,YAAA,QAAoB,gBAAA;EAGpB,IAAA,GAAO,YAAA,MAAkB,YAAA;EACzB,KAAA,GAAQ,aAAA,MAAmB,aAAA;EAC3B,cAAA;AAAA;AAAA,cA6BS,QAAA,EAAU,EAAA,CAAG,aAAA"}
+{"version":3,"file":"Checkbox.d.ts","names":[],"sources":["../../../../src/components/Input/Checkbox.tsx"],"mappings":";;;;;cASa,gBAAA,GAAgB,KAAA;;;;;IAkE5B,iCAAA,CAAA,SAAA;AAAA,aAEW,YAAA;EACV,EAAA;EACA,EAAA;EACA,EAAA;EACA,EAAA;AAAA;AAAA,aAGU,aAAA;EACV,OAAA;EACA,SAAA;EACA,WAAA;EACA,OAAA;EACA,KAAA;EACA,IAAA;EACA,IAAA;EACA,KAAA;EACA,OAAA;EACA,MAAA;AAAA;AAAA,KAGU,aAAA,GAAgB,IAAA,CAC1B,iBAAA,CAAkB,mBAAA,CAAoB,gBAAA,GAAmB,gBAAA;EAGzD,IAAA;EACA,sBAAA;EACA,KAAA,GAAQ,SAAA;AAAA,IACN,IAAA,CACA,YAAA,QAAoB,gBAAA;EAGpB,IAAA,GAAO,YAAA,MAAkB,YAAA;EACzB,KAAA,GAAQ,aAAA,MAAmB,aAAA;EAC3B,cAAA;AAAA;AAAA,cA6BS,QAAA,EAAU,EAAA,CAAG,aAAA"}

package/dist/types/components/Link/Link.d.ts

@@ -53,9 +53,9 @@ declare enum LinkUnderlined {
   FALSE = "false"
 }
 declare const linkVariants: (props?: {
-  variant?: "default" | "invisible-link" | "hoverable" | "button" | "button-outlined";
-  roundedSize?: "none" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full";
-  color?: "error" | "custom" | "text" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark" | "text-inverse" | "success";
+  variant?: "default" | "invisible-link" | "button" | "button-outlined" | "hoverable";
+  roundedSize?: "sm" | "md" | "lg" | "xl" | "2xl" | "none" | "3xl" | "full";
+  color?: "text" | "error" | "custom" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark" | "text-inverse" | "success";
   size?: "sm" | "md" | "lg" | "xl" | "custom";
   underlined?: boolean | LinkUnderlined.DEFAULT;
 } & _$class_variance_authority_types0.ClassProp) => string;

package/dist/types/components/Navbar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/Navbar/index.tsx"],"mappings":";;;;;;;;;;;;KAaK,WAAA,WAAsB,oBAAA;uDAEzB,IAAA,EAAM,SAAA,EAFH;EAIH,cAAA,EAAgB,CAAA,SAJF;EAMd,eAAA,GAAkB,YAAA,CAAa,CAAA,KAJzB;EAMN,iBAAA,GAAoB,SAAA,EAFW;EAI/B,iBAAA,GAAoB,YAAA,CAAa,CAAA,KAFb;EAIpB,oBAAA,GAAuB,SAAA,EAFH;EAIpB,oBAAA,GAAuB,YAAA,CAAa,CAAA,KAAA;EAEpC,iBAAA,GAAoB,SAAA,EAAA;EAEpB,gBAAA,GAAmB,SAAA,EAAS;EAE5B,cAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAAa,MAAA,aAAoB,oBAAA;EAAsB,IAAA;EAAA,iBAAA;EAAA,eAAA;EAAA,iBAAA;EAAA,oBAAA;EAAA,oBAAA;EAAA,iBAAA;EAAA,gBAAA;EAAA,cAAA;EAAA;AAAA,GAWpD,WAAA,CAAY,CAAA,MAAE,oBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../../src/components/Navbar/index.tsx"],"mappings":";;;;;;;;;;;;KAYK,WAAA,WAAsB,oBAAA;uDAEzB,IAAA,EAAM,SAAA,EAFH;EAIH,cAAA,EAAgB,CAAA,SAJF;EAMd,eAAA,GAAkB,YAAA,CAAa,CAAA,KAJzB;EAMN,iBAAA,GAAoB,SAAA,EAFW;EAI/B,iBAAA,GAAoB,YAAA,CAAa,CAAA,KAFb;EAIpB,oBAAA,GAAuB,SAAA,EAFH;EAIpB,oBAAA,GAAuB,YAAA,CAAa,CAAA,KAAA;EAEpC,iBAAA,GAAoB,SAAA,EAAA;EAEpB,gBAAA,GAAmB,SAAA,EAAS;EAE5B,cAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAAa,MAAA,aAAoB,oBAAA;EAAsB,IAAA;EAAA,iBAAA;EAAA,eAAA;EAAA,iBAAA;EAAA,oBAAA;EAAA,oBAAA;EAAA,iBAAA;EAAA,gBAAA;EAAA,cAAA;EAAA;AAAA,GAWpD,WAAA,CAAY,CAAA,MAAE,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/types/components/SwitchSelector/SwitchSelector.d.ts

@@ -0,0 +1,56 @@
+import { HTMLAttributes, ReactNode } from "react";
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
+import { VariantProps } from "class-variance-authority";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/SwitchSelector/SwitchSelector.d.ts
+type SwitchSelectorChoice<T = boolean> = {
+  content: ReactNode;
+  value: T;
+} & HTMLAttributes<HTMLButtonElement>;
+type SwitchSelectorChoices<T> = SwitchSelectorChoice<T>[];
+declare const defaultChoices: SwitchSelectorChoices<boolean>;
+declare enum SwitchSelectorColor {
+  PRIMARY = "primary",
+  SECONDARY = "secondary",
+  DESTRUCTIVE = "destructive",
+  NEUTRAL = "neutral",
+  LIGHT = "light",
+  DARK = "dark",
+  TEXT = "text"
+}
+declare enum SwitchSelectorSize {
+  SM = "sm",
+  MD = "md",
+  LG = "lg"
+}
+type SwitchSelectorBaseProps<T = boolean> = {
+  choices?: SwitchSelectorChoices<T>;
+  value?: T;
+  defaultValue?: T;
+  onChange?: (choice: T) => void;
+  className?: string;
+  itemClassName?: string;
+  hoverable?: boolean;
+  disabled?: boolean;
+  [key: string]: any;
+};
+type SwitchSelectorProps<T = boolean> = SwitchSelectorBaseProps<T> & VariantProps<typeof switchSelectorVariant> & VariantProps<typeof choiceVariant>;
+declare const switchSelectorVariant: (props?: {
+  color?: "text" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark";
+  disabled?: boolean;
+} & _$class_variance_authority_types0.ClassProp) => string;
+declare const choiceVariant: (props?: {
+  size?: "sm" | "md" | "lg";
+} & _$class_variance_authority_types0.ClassProp) => string;
+declare const indicatorVariant: (props?: {
+  color?: "text" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark";
+} & _$class_variance_authority_types0.ClassProp) => string;
+/**
+ * Component that allows the user to select one of the provided choices.
+ * This component is horizontal.
+ */
+declare const SwitchSelector: <T>(props: SwitchSelectorProps<T>) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { SwitchSelector, SwitchSelectorBaseProps, SwitchSelectorChoice, SwitchSelectorChoices, SwitchSelectorColor, SwitchSelectorProps, SwitchSelectorSize, choiceVariant, defaultChoices, indicatorVariant, switchSelectorVariant };
+//# sourceMappingURL=SwitchSelector.d.ts.map

package/dist/types/components/SwitchSelector/SwitchSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchSelector.d.ts","names":[],"sources":["../../../../src/components/SwitchSelector/SwitchSelector.tsx"],"mappings":";;;;;;KAOY,oBAAA;EACV,OAAA,EAAS,SAAA;EACT,KAAA,EAAO,CAAA;AAAA,IACL,cAAA,CAAe,iBAAA;AAAA,KACP,qBAAA,MAA2B,oBAAA,CAAqB,CAAA;AAAA,cAE/C,cAAA,EAAgB,qBAAA;AAAA,aAKjB,mBAAA;EACV,OAAA;EACA,SAAA;EACA,WAAA;EACA,OAAA;EACA,KAAA;EACA,IAAA;EACA,IAAA;AAAA;AAAA,aAGU,kBAAA;EACV,EAAA;EACA,EAAA;EACA,EAAA;AAAA;AAAA,KAGU,uBAAA;EACV,OAAA,GAAU,qBAAA,CAAsB,CAAA;EAChC,KAAA,GAAQ,CAAA;EACR,YAAA,GAAe,CAAA;EACf,QAAA,IAAY,MAAA,EAAQ,CAAA;EACpB,SAAA;EACA,aAAA;EACA,SAAA;EACA,QAAA;EAAA,CACC,GAAA;AAAA;AAAA,KAGS,mBAAA,gBAAmC,uBAAA,CAAwB,CAAA,IACrE,YAAA,QAAoB,qBAAA,IACpB,YAAA,QAAoB,aAAA;AAAA,cAET,qBAAA,GAAqB,KAAA;;;IAwBjC,iCAAA,CAAA,SAAA;AAAA,cAEY,aAAA,GAAa,KAAA;;IAczB,iCAAA,CAAA,SAAA;AAAA,cAEY,gBAAA,GAAgB,KAAA;;IAsB5B,iCAAA,CAAA,SAAA;;;;;cAMY,cAAA,MAAsB,KAAA,EAAO,mBAAA,CAAoB,CAAA,MAAE,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/types/components/SwitchSelector/VerticalSwitchSelector.d.ts

@@ -0,0 +1,22 @@
+import { SwitchSelectorBaseProps } from "./SwitchSelector.js";
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
+import { VariantProps } from "class-variance-authority";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/SwitchSelector/VerticalSwitchSelector.d.ts
+declare const verticalSwitchSelectorVariant: (props?: {
+  color?: "text" | "primary" | "secondary" | "destructive" | "neutral" | "light" | "dark";
+  disabled?: boolean;
+} & _$class_variance_authority_types0.ClassProp) => string;
+declare const verticalChoiceVariant: (props?: {
+  size?: "sm" | "md" | "lg";
+} & _$class_variance_authority_types0.ClassProp) => string;
+type VerticalSwitchSelectorProps<T = boolean> = SwitchSelectorBaseProps<T> & VariantProps<typeof verticalSwitchSelectorVariant> & VariantProps<typeof verticalChoiceVariant>;
+/**
+ * Component that allows the user to select one of the provided choices.
+ * This component is vertical.
+ */
+declare const VerticalSwitchSelector: <T>(props: VerticalSwitchSelectorProps<T>) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { VerticalSwitchSelector, VerticalSwitchSelectorProps };
+//# sourceMappingURL=VerticalSwitchSelector.d.ts.map

package/dist/types/components/SwitchSelector/VerticalSwitchSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerticalSwitchSelector.d.ts","names":[],"sources":["../../../../src/components/SwitchSelector/VerticalSwitchSelector.tsx"],"mappings":";;;;;;cAaM,6BAAA,GAA6B,KAAA;;;IAwBlC,iCAAA,CAAA,SAAA;AAAA,cAEK,qBAAA,GAAqB,KAAA;;IAc1B,iCAAA,CAAA,SAAA;AAAA,KA0BW,2BAAA,gBACV,uBAAA,CAAwB,CAAA,IACtB,YAAA,QAAoB,6BAAA,IACpB,YAAA,QAAoB,qBAAA;;;;;cAMX,sBAAA,MACX,KAAA,EAAO,2BAAA,CAA4B,CAAA,MAAE,oBAAA,CAAA,GAAA,CAAA,OAAA"}