@intlayer/design-system 8.1.2 → 8.1.3

package/dist/esm/components/Navbar/useNavigation.mjs

@@ -1,153 +1,2 @@
-'use client';
-
-import { useEffect, useState } from "react";
-
-//#region src/components/Navbar/useNavigation.ts
-/**
-* Navigation Actions Hook
-*
-* A comprehensive hook for managing navigation interactions and scroll-based section detection.
-* Provides automatic active section detection based on scroll position and handles smooth
-* scrolling navigation behaviors.
-*
-* Features:
-* - Automatic active section detection based on scroll position
-* - Smooth scrolling to sections within the same page
-* - Logo click handling with home navigation
-* - Section click handling with conditional scrolling vs navigation
-* - Passive scroll event listeners for optimal performance
-* - Viewport-aware active section calculation (using screen height / 4 offset)
-*
-* Active Section Detection:
-* - Monitors all `<section>` elements on the page
-* - Calculates which section is currently in the "active" zone
-* - Active zone is defined as the top 25% of the viewport
-* - Updates activeSection state as user scrolls
-*
-* Navigation Behaviors:
-* - Logo click: Scrolls to top if on home page, navigates to home if on other pages
-* - Section click: Smooth scrolls if on same page, executes callback if different page
-* - All scrolling uses smooth behavior for better UX
-*
-* @example
-* Basic usage in navigation component:
-* ```tsx
-* const { activeSection, onClickLogo, onClickSection } = useNavActions();
-*
-* // In navigation items
-* const navItems = sections.map(section => (
-*   <TabSelectorItem
-*     key={section.id}
-*     isActive={activeSection === section.id}
-*     onClick={() => onClickSection(section.id, section.url, section.onClick)}
-*   >
-*     {section.label}
-*   </TabSelectorItem>
-* ));
-*
-* // In logo
-* <Logo onClick={() => onClickLogo(navigate)} />
-* ```
-*
-* @example
-* Advanced usage with routing:
-* ```tsx
-* const { activeSection, onClickLogo, onClickSection } = useNavActions();
-* const navigate = useNavigate();
-*
-* const handleLogoClick = () => {
-*   onClickLogo((url) => {
-*     navigate(url);
-*     // Additional logic like analytics
-*     trackEvent('logo_click');
-*   });
-* };
-*
-* const handleSectionClick = (sectionId: string) => {
-*   onClickSection(
-*     sectionId,
-*     `/page#${sectionId}`,
-*     () => {
-*       navigate(`/page#${sectionId}`);
-*       trackEvent('section_navigation', { sectionId });
-*     }
-*   );
-* };
-* ```
-*
-* Performance Considerations:
-* - Uses passive scroll event listeners to prevent blocking
-* - Automatically cleans up event listeners on unmount
-* - Efficiently queries DOM elements using native selectors
-* - Calculates section positions dynamically for accuracy
-*
-* @returns Object containing navigation state and action handlers
-*/
-const useNavActions = () => {
-	/** Currently active section ID based on scroll position */
-	const [activeSection, setActiveSection] = useState(null);
-	/**
-	* Detects which section is currently active based on scroll position
-	* Uses viewport-aware calculation to determine active section
-	*/
-	const detectActiveSection = () => {
-		const scrollY = window.scrollY;
-		const sections = document.querySelectorAll("section");
-		const sectionsData = [];
-		sections.forEach((section) => sectionsData.push({
-			id: section.id,
-			offsetTop: section.offsetTop,
-			offsetHeight: section.offsetHeight
-		}));
-		const currentSection = sectionsData.find((section) => section.offsetTop <= scrollY + window.screen.height / 4 && section.offsetTop + section.offsetHeight > scrollY + window.screen.height / 4);
-		if (currentSection) setActiveSection(currentSection.id);
-	};
-	useEffect(() => {
-		window.addEventListener("scroll", detectActiveSection, { passive: true });
-		return () => {
-			window.removeEventListener("scroll", detectActiveSection);
-		};
-	}, []);
-	/**
-	* Handles logo click behavior
-	* Scrolls to top if on home page, navigates to home if on other pages
-	*
-	* @param onClick - Callback function to handle navigation (e.g., router.push)
-	*/
-	const onClickLogo = (onClick) => {
-		setActiveSection(null);
-		if (window.location.pathname === "/") window.scrollTo({
-			top: 0,
-			behavior: "smooth"
-		});
-		else onClick("/");
-	};
-	/**
-	* Handles section navigation click behavior
-	* Smooth scrolls if on same page, executes callback if different page
-	*
-	* @param sectionId - ID of the target section element
-	* @param url - URL of the page containing the section (optional)
-	* @param onClick - Callback function to handle navigation (optional)
-	*/
-	const onClickSection = (sectionId, url, onClick) => {
-		setActiveSection(sectionId);
-		if (window.location.pathname === url) {
-			const sectionEl = document.getElementById(sectionId);
-			if (sectionEl) sectionEl.scrollIntoView({
-				behavior: "smooth",
-				block: "center",
-				inline: "nearest"
-			});
-		} else onClick?.();
-	};
-	return {
-		activeSection,
-		onClickLogo,
-		onClickSection
-	};
-};
-
-//#endregion
-export { useNavActions };
+"use client";import{useEffect as e,useState as t}from"react";const n=()=>{let[n,r]=t(null),i=()=>{let e=window.scrollY,t=document.querySelectorAll(`section`),n=[];t.forEach(e=>n.push({id:e.id,offsetTop:e.offsetTop,offsetHeight:e.offsetHeight}));let i=n.find(t=>t.offsetTop<=e+window.screen.height/4&&t.offsetTop+t.offsetHeight>e+window.screen.height/4);i&&r(i.id)};return e(()=>(window.addEventListener(`scroll`,i,{passive:!0}),()=>{window.removeEventListener(`scroll`,i)}),[]),{activeSection:n,onClickLogo:e=>{r(null),window.location.pathname===`/`?window.scrollTo({top:0,behavior:`smooth`}):e(`/`)},onClickSection:(e,t,n)=>{if(r(e),window.location.pathname===t){let t=document.getElementById(e);t&&t.scrollIntoView({behavior:`smooth`,block:`center`,inline:`nearest`})}else n?.()}}};export{n as useNavActions};
 //# sourceMappingURL=useNavigation.mjs.map

package/dist/esm/components/Navbar/useNavigation.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useNavigation.mjs","names":[],"sources":["../../../../src/components/Navbar/useNavigation.ts"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\n\n/**\n * Interface describing section data used for scroll detection\n */\ninterface SectionData {\n  /** Unique identifier of the section element */\n  id: string;\n  /** Distance from top of document to section start */\n  offsetTop: number;\n  /** Height of the section element */\n  offsetHeight: number;\n}\n\n/**\n * Navigation Actions Hook\n *\n * A comprehensive hook for managing navigation interactions and scroll-based section detection.\n * Provides automatic active section detection based on scroll position and handles smooth\n * scrolling navigation behaviors.\n *\n * Features:\n * - Automatic active section detection based on scroll position\n * - Smooth scrolling to sections within the same page\n * - Logo click handling with home navigation\n * - Section click handling with conditional scrolling vs navigation\n * - Passive scroll event listeners for optimal performance\n * - Viewport-aware active section calculation (using screen height / 4 offset)\n *\n * Active Section Detection:\n * - Monitors all `<section>` elements on the page\n * - Calculates which section is currently in the \"active\" zone\n * - Active zone is defined as the top 25% of the viewport\n * - Updates activeSection state as user scrolls\n *\n * Navigation Behaviors:\n * - Logo click: Scrolls to top if on home page, navigates to home if on other pages\n * - Section click: Smooth scrolls if on same page, executes callback if different page\n * - All scrolling uses smooth behavior for better UX\n *\n * @example\n * Basic usage in navigation component:\n * ```tsx\n * const { activeSection, onClickLogo, onClickSection } = useNavActions();\n *\n * // In navigation items\n * const navItems = sections.map(section => (\n *   <TabSelectorItem\n *     key={section.id}\n *     isActive={activeSection === section.id}\n *     onClick={() => onClickSection(section.id, section.url, section.onClick)}\n *   >\n *     {section.label}\n *   </TabSelectorItem>\n * ));\n *\n * // In logo\n * <Logo onClick={() => onClickLogo(navigate)} />\n * ```\n *\n * @example\n * Advanced usage with routing:\n * ```tsx\n * const { activeSection, onClickLogo, onClickSection } = useNavActions();\n * const navigate = useNavigate();\n *\n * const handleLogoClick = () => {\n *   onClickLogo((url) => {\n *     navigate(url);\n *     // Additional logic like analytics\n *     trackEvent('logo_click');\n *   });\n * };\n *\n * const handleSectionClick = (sectionId: string) => {\n *   onClickSection(\n *     sectionId,\n *     `/page#${sectionId}`,\n *     () => {\n *       navigate(`/page#${sectionId}`);\n *       trackEvent('section_navigation', { sectionId });\n *     }\n *   );\n * };\n * ```\n *\n * Performance Considerations:\n * - Uses passive scroll event listeners to prevent blocking\n * - Automatically cleans up event listeners on unmount\n * - Efficiently queries DOM elements using native selectors\n * - Calculates section positions dynamically for accuracy\n *\n * @returns Object containing navigation state and action handlers\n */\nexport const useNavActions = () => {\n  /** Currently active section ID based on scroll position */\n  const [activeSection, setActiveSection] = useState<string | null>(null);\n\n  /**\n   * Detects which section is currently active based on scroll position\n   * Uses viewport-aware calculation to determine active section\n   */\n  const detectActiveSection = () => {\n    const scrollY = window.scrollY;\n    const sections = document.querySelectorAll('section');\n    const sectionsData: SectionData[] = [];\n\n    // Collect position data for all sections\n    sections.forEach((section) =>\n      sectionsData.push({\n        id: section.id,\n        offsetTop: section.offsetTop,\n        offsetHeight: section.offsetHeight,\n      })\n    );\n\n    // Find section that intersects with the active zone (top 25% of viewport)\n    const currentSection = sectionsData.find(\n      (section) =>\n        section.offsetTop <= scrollY + window.screen.height / 4 &&\n        section.offsetTop + section.offsetHeight >\n          scrollY + window.screen.height / 4\n    );\n\n    if (currentSection) {\n      setActiveSection(currentSection.id);\n    }\n  };\n\n  // Set up scroll listener for active section detection\n  useEffect(() => {\n    window.addEventListener('scroll', detectActiveSection, { passive: true });\n\n    return () => {\n      window.removeEventListener('scroll', detectActiveSection);\n    };\n  }, []);\n\n  /**\n   * Handles logo click behavior\n   * Scrolls to top if on home page, navigates to home if on other pages\n   *\n   * @param onClick - Callback function to handle navigation (e.g., router.push)\n   */\n  const onClickLogo = (onClick: (url: string) => void) => {\n    setActiveSection(null);\n\n    if (window.location.pathname === '/') {\n      window.scrollTo({ top: 0, behavior: 'smooth' });\n    } else {\n      onClick('/');\n    }\n  };\n\n  /**\n   * Handles section navigation click behavior\n   * Smooth scrolls if on same page, executes callback if different page\n   *\n   * @param sectionId - ID of the target section element\n   * @param url - URL of the page containing the section (optional)\n   * @param onClick - Callback function to handle navigation (optional)\n   */\n  const onClickSection = (\n    sectionId: string,\n    url?: string,\n    onClick?: () => void\n  ) => {\n    setActiveSection(sectionId);\n\n    // If on the same page, scroll to section\n    if (window.location.pathname === url) {\n      const sectionEl = document.getElementById(sectionId);\n\n      if (sectionEl) {\n        sectionEl.scrollIntoView({\n          behavior: 'smooth',\n          block: 'center',\n          inline: 'nearest',\n        });\n      }\n    } else {\n      // If on different page, execute callback (typically navigation)\n      onClick?.();\n    }\n  };\n\n  return {\n    /** Currently active section ID, null if no section is active */\n    activeSection,\n    /** Handler for logo click interactions */\n    onClickLogo,\n    /** Handler for section navigation clicks */\n    onClickSection,\n  };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgGA,MAAa,sBAAsB;;CAEjC,MAAM,CAAC,eAAe,oBAAoB,SAAwB,KAAK;;;;;CAMvE,MAAM,4BAA4B;EAChC,MAAM,UAAU,OAAO;EACvB,MAAM,WAAW,SAAS,iBAAiB,UAAU;EACrD,MAAM,eAA8B,EAAE;AAGtC,WAAS,SAAS,YAChB,aAAa,KAAK;GAChB,IAAI,QAAQ;GACZ,WAAW,QAAQ;GACnB,cAAc,QAAQ;GACvB,CAAC,CACH;EAGD,MAAM,iBAAiB,aAAa,MACjC,YACC,QAAQ,aAAa,UAAU,OAAO,OAAO,SAAS,KACtD,QAAQ,YAAY,QAAQ,eAC1B,UAAU,OAAO,OAAO,SAAS,EACtC;AAED,MAAI,eACF,kBAAiB,eAAe,GAAG;;AAKvC,iBAAgB;AACd,SAAO,iBAAiB,UAAU,qBAAqB,EAAE,SAAS,MAAM,CAAC;AAEzE,eAAa;AACX,UAAO,oBAAoB,UAAU,oBAAoB;;IAE1D,EAAE,CAAC;;;;;;;CAQN,MAAM,eAAe,YAAmC;AACtD,mBAAiB,KAAK;AAEtB,MAAI,OAAO,SAAS,aAAa,IAC/B,QAAO,SAAS;GAAE,KAAK;GAAG,UAAU;GAAU,CAAC;MAE/C,SAAQ,IAAI;;;;;;;;;;CAYhB,MAAM,kBACJ,WACA,KACA,YACG;AACH,mBAAiB,UAAU;AAG3B,MAAI,OAAO,SAAS,aAAa,KAAK;GACpC,MAAM,YAAY,SAAS,eAAe,UAAU;AAEpD,OAAI,UACF,WAAU,eAAe;IACvB,UAAU;IACV,OAAO;IACP,QAAQ;IACT,CAAC;QAIJ,YAAW;;AAIf,QAAO;EAEL;EAEA;EAEA;EACD"}
+{"version":3,"file":"useNavigation.mjs","names":[],"sources":["../../../../src/components/Navbar/useNavigation.ts"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\n\n/**\n * Interface describing section data used for scroll detection\n */\ninterface SectionData {\n  /** Unique identifier of the section element */\n  id: string;\n  /** Distance from top of document to section start */\n  offsetTop: number;\n  /** Height of the section element */\n  offsetHeight: number;\n}\n\n/**\n * Navigation Actions Hook\n *\n * A comprehensive hook for managing navigation interactions and scroll-based section detection.\n * Provides automatic active section detection based on scroll position and handles smooth\n * scrolling navigation behaviors.\n *\n * Features:\n * - Automatic active section detection based on scroll position\n * - Smooth scrolling to sections within the same page\n * - Logo click handling with home navigation\n * - Section click handling with conditional scrolling vs navigation\n * - Passive scroll event listeners for optimal performance\n * - Viewport-aware active section calculation (using screen height / 4 offset)\n *\n * Active Section Detection:\n * - Monitors all `<section>` elements on the page\n * - Calculates which section is currently in the \"active\" zone\n * - Active zone is defined as the top 25% of the viewport\n * - Updates activeSection state as user scrolls\n *\n * Navigation Behaviors:\n * - Logo click: Scrolls to top if on home page, navigates to home if on other pages\n * - Section click: Smooth scrolls if on same page, executes callback if different page\n * - All scrolling uses smooth behavior for better UX\n *\n * @example\n * Basic usage in navigation component:\n * ```tsx\n * const { activeSection, onClickLogo, onClickSection } = useNavActions();\n *\n * // In navigation items\n * const navItems = sections.map(section => (\n *   <TabSelectorItem\n *     key={section.id}\n *     isActive={activeSection === section.id}\n *     onClick={() => onClickSection(section.id, section.url, section.onClick)}\n *   >\n *     {section.label}\n *   </TabSelectorItem>\n * ));\n *\n * // In logo\n * <Logo onClick={() => onClickLogo(navigate)} />\n * ```\n *\n * @example\n * Advanced usage with routing:\n * ```tsx\n * const { activeSection, onClickLogo, onClickSection } = useNavActions();\n * const navigate = useNavigate();\n *\n * const handleLogoClick = () => {\n *   onClickLogo((url) => {\n *     navigate(url);\n *     // Additional logic like analytics\n *     trackEvent('logo_click');\n *   });\n * };\n *\n * const handleSectionClick = (sectionId: string) => {\n *   onClickSection(\n *     sectionId,\n *     `/page#${sectionId}`,\n *     () => {\n *       navigate(`/page#${sectionId}`);\n *       trackEvent('section_navigation', { sectionId });\n *     }\n *   );\n * };\n * ```\n *\n * Performance Considerations:\n * - Uses passive scroll event listeners to prevent blocking\n * - Automatically cleans up event listeners on unmount\n * - Efficiently queries DOM elements using native selectors\n * - Calculates section positions dynamically for accuracy\n *\n * @returns Object containing navigation state and action handlers\n */\nexport const useNavActions = () => {\n  /** Currently active section ID based on scroll position */\n  const [activeSection, setActiveSection] = useState<string | null>(null);\n\n  /**\n   * Detects which section is currently active based on scroll position\n   * Uses viewport-aware calculation to determine active section\n   */\n  const detectActiveSection = () => {\n    const scrollY = window.scrollY;\n    const sections = document.querySelectorAll('section');\n    const sectionsData: SectionData[] = [];\n\n    // Collect position data for all sections\n    sections.forEach((section) =>\n      sectionsData.push({\n        id: section.id,\n        offsetTop: section.offsetTop,\n        offsetHeight: section.offsetHeight,\n      })\n    );\n\n    // Find section that intersects with the active zone (top 25% of viewport)\n    const currentSection = sectionsData.find(\n      (section) =>\n        section.offsetTop <= scrollY + window.screen.height / 4 &&\n        section.offsetTop + section.offsetHeight >\n          scrollY + window.screen.height / 4\n    );\n\n    if (currentSection) {\n      setActiveSection(currentSection.id);\n    }\n  };\n\n  // Set up scroll listener for active section detection\n  useEffect(() => {\n    window.addEventListener('scroll', detectActiveSection, { passive: true });\n\n    return () => {\n      window.removeEventListener('scroll', detectActiveSection);\n    };\n  }, []);\n\n  /**\n   * Handles logo click behavior\n   * Scrolls to top if on home page, navigates to home if on other pages\n   *\n   * @param onClick - Callback function to handle navigation (e.g., router.push)\n   */\n  const onClickLogo = (onClick: (url: string) => void) => {\n    setActiveSection(null);\n\n    if (window.location.pathname === '/') {\n      window.scrollTo({ top: 0, behavior: 'smooth' });\n    } else {\n      onClick('/');\n    }\n  };\n\n  /**\n   * Handles section navigation click behavior\n   * Smooth scrolls if on same page, executes callback if different page\n   *\n   * @param sectionId - ID of the target section element\n   * @param url - URL of the page containing the section (optional)\n   * @param onClick - Callback function to handle navigation (optional)\n   */\n  const onClickSection = (\n    sectionId: string,\n    url?: string,\n    onClick?: () => void\n  ) => {\n    setActiveSection(sectionId);\n\n    // If on the same page, scroll to section\n    if (window.location.pathname === url) {\n      const sectionEl = document.getElementById(sectionId);\n\n      if (sectionEl) {\n        sectionEl.scrollIntoView({\n          behavior: 'smooth',\n          block: 'center',\n          inline: 'nearest',\n        });\n      }\n    } else {\n      // If on different page, execute callback (typically navigation)\n      onClick?.();\n    }\n  };\n\n  return {\n    /** Currently active section ID, null if no section is active */\n    activeSection,\n    /** Handler for logo click interactions */\n    onClickLogo,\n    /** Handler for section navigation clicks */\n    onClickSection,\n  };\n};\n"],"mappings":"6DAgGA,MAAa,MAAsB,CAEjC,GAAM,CAAC,EAAe,GAAoB,EAAwB,KAAK,CAMjE,MAA4B,CAChC,IAAM,EAAU,OAAO,QACjB,EAAW,SAAS,iBAAiB,UAAU,CAC/C,EAA8B,EAAE,CAGtC,EAAS,QAAS,GAChB,EAAa,KAAK,CAChB,GAAI,EAAQ,GACZ,UAAW,EAAQ,UACnB,aAAc,EAAQ,aACvB,CAAC,CACH,CAGD,IAAM,EAAiB,EAAa,KACjC,GACC,EAAQ,WAAa,EAAU,OAAO,OAAO,OAAS,GACtD,EAAQ,UAAY,EAAQ,aAC1B,EAAU,OAAO,OAAO,OAAS,EACtC,CAEG,GACF,EAAiB,EAAe,GAAG,EA6DvC,OAxDA,OACE,OAAO,iBAAiB,SAAU,EAAqB,CAAE,QAAS,GAAM,CAAC,KAE5D,CACX,OAAO,oBAAoB,SAAU,EAAoB,GAE1D,EAAE,CAAC,CAkDC,CAEL,gBAEA,YA9CmB,GAAmC,CACtD,EAAiB,KAAK,CAElB,OAAO,SAAS,WAAa,IAC/B,OAAO,SAAS,CAAE,IAAK,EAAG,SAAU,SAAU,CAAC,CAE/C,EAAQ,IAAI,EA0Cd,gBA7BA,EACA,EACA,IACG,CAIH,GAHA,EAAiB,EAAU,CAGvB,OAAO,SAAS,WAAa,EAAK,CACpC,IAAM,EAAY,SAAS,eAAe,EAAU,CAEhD,GACF,EAAU,eAAe,CACvB,SAAU,SACV,MAAO,SACP,OAAQ,UACT,CAAC,MAIJ,KAAW,EAWd"}

package/dist/esm/components/Pagination/NumberItemsSelector.mjs

@@ -1,47 +1,2 @@
-'use client';
-
-import { Select } from "../Select/Select.mjs";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useIntlayer } from "react-intlayer";
-
-//#region src/components/Pagination/NumberItemsSelector.tsx
-const NumberItemsSelector = ({ value, onValueChange, min = 5, max = 500 }) => {
-	const { numberItemsSelector, selectPageSize } = useIntlayer("pagination");
-	const items = [
-		1,
-		2,
-		5,
-		10,
-		20,
-		50,
-		100,
-		200,
-		500,
-		1e3,
-		2e3,
-		5e3,
-		1e4,
-		1e5
-	].filter((item) => item >= min && item <= max);
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex items-center gap-2",
-		children: [/* @__PURE__ */ jsx("span", {
-			className: "text-neutral-600 text-sm dark:text-neutral-400",
-			children: numberItemsSelector
-		}), /* @__PURE__ */ jsxs(Select, {
-			value,
-			onValueChange,
-			children: [/* @__PURE__ */ jsx(Select.Trigger, {
-				className: "w-20",
-				children: /* @__PURE__ */ jsx(Select.Value, { placeholder: selectPageSize })
-			}), /* @__PURE__ */ jsx(Select.Content, { children: items.map((item) => /* @__PURE__ */ jsx(Select.Item, {
-				value: item.toString(),
-				children: item
-			}, item)) })]
-		})]
-	});
-};
-
-//#endregion
-export { NumberItemsSelector };
+"use client";import{Select as e}from"../Select/Select.mjs";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useIntlayer as r}from"react-intlayer";const i=({value:i,onValueChange:a,min:o=5,max:s=500})=>{let{numberItemsSelector:c,selectPageSize:l}=r(`pagination`),u=[1,2,5,10,20,50,100,200,500,1e3,2e3,5e3,1e4,1e5].filter(e=>e>=o&&e<=s);return n(`div`,{className:`flex items-center gap-2`,children:[t(`span`,{className:`text-neutral-600 text-sm dark:text-neutral-400`,children:c}),n(e,{value:i,onValueChange:a,children:[t(e.Trigger,{className:`w-20`,children:t(e.Value,{placeholder:l})}),t(e.Content,{children:u.map(n=>t(e.Item,{value:n.toString(),children:n},n))})]})]})};export{i as NumberItemsSelector};
 //# sourceMappingURL=NumberItemsSelector.mjs.map

package/dist/esm/components/Pagination/NumberItemsSelector.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NumberItemsSelector.mjs","names":[],"sources":["../../../../src/components/Pagination/NumberItemsSelector.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Select } from '../Select';\n\nexport type NumberItemsSelectorProps = {\n  value: string;\n  onValueChange: (value: string) => void;\n  min?: number;\n  max?: number;\n};\n\nexport const NumberItemsSelector: FC<NumberItemsSelectorProps> = ({\n  value,\n  onValueChange,\n  min = 5,\n  max = 500,\n}) => {\n  const { numberItemsSelector, selectPageSize } = useIntlayer('pagination');\n\n  const items = [\n    1, 2, 5, 10, 20, 50, 100, 200, 500, 1000, 2000, 5000, 10000, 100000,\n  ].filter((item) => item >= min && item <= max);\n\n  return (\n    <div className=\"flex items-center gap-2\">\n      <span className=\"text-neutral-600 text-sm dark:text-neutral-400\">\n        {numberItemsSelector}\n      </span>\n      <Select value={value} onValueChange={onValueChange}>\n        <Select.Trigger className=\"w-20\">\n          <Select.Value placeholder={selectPageSize} />\n        </Select.Trigger>\n        <Select.Content>\n          {items.map((item) => (\n            <Select.Item key={item} value={item.toString()}>\n              {item}\n            </Select.Item>\n          ))}\n        </Select.Content>\n      </Select>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;AAaA,MAAa,uBAAqD,EAChE,OACA,eACA,MAAM,GACN,MAAM,UACF;CACJ,MAAM,EAAE,qBAAqB,mBAAmB,YAAY,aAAa;CAEzE,MAAM,QAAQ;EACZ;EAAG;EAAG;EAAG;EAAI;EAAI;EAAI;EAAK;EAAK;EAAK;EAAM;EAAM;EAAM;EAAO;EAC9D,CAAC,QAAQ,SAAS,QAAQ,OAAO,QAAQ,IAAI;AAE9C,QACE,qBAAC;EAAI,WAAU;aACb,oBAAC;GAAK,WAAU;aACb;IACI,EACP,qBAAC;GAAc;GAAsB;cACnC,oBAAC,OAAO;IAAQ,WAAU;cACxB,oBAAC,OAAO,SAAM,aAAa,iBAAkB;KAC9B,EACjB,oBAAC,OAAO,qBACL,MAAM,KAAK,SACV,oBAAC,OAAO;IAAgB,OAAO,KAAK,UAAU;cAC3C;MADe,KAEJ,CACd,GACa;IACV;GACL"}
+{"version":3,"file":"NumberItemsSelector.mjs","names":[],"sources":["../../../../src/components/Pagination/NumberItemsSelector.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Select } from '../Select';\n\nexport type NumberItemsSelectorProps = {\n  value: string;\n  onValueChange: (value: string) => void;\n  min?: number;\n  max?: number;\n};\n\nexport const NumberItemsSelector: FC<NumberItemsSelectorProps> = ({\n  value,\n  onValueChange,\n  min = 5,\n  max = 500,\n}) => {\n  const { numberItemsSelector, selectPageSize } = useIntlayer('pagination');\n\n  const items = [\n    1, 2, 5, 10, 20, 50, 100, 200, 500, 1000, 2000, 5000, 10000, 100000,\n  ].filter((item) => item >= min && item <= max);\n\n  return (\n    <div className=\"flex items-center gap-2\">\n      <span className=\"text-neutral-600 text-sm dark:text-neutral-400\">\n        {numberItemsSelector}\n      </span>\n      <Select value={value} onValueChange={onValueChange}>\n        <Select.Trigger className=\"w-20\">\n          <Select.Value placeholder={selectPageSize} />\n        </Select.Trigger>\n        <Select.Content>\n          {items.map((item) => (\n            <Select.Item key={item} value={item.toString()}>\n              {item}\n            </Select.Item>\n          ))}\n        </Select.Content>\n      </Select>\n    </div>\n  );\n};\n"],"mappings":"0JAaA,MAAa,GAAqD,CAChE,QACA,gBACA,MAAM,EACN,MAAM,OACF,CACJ,GAAM,CAAE,sBAAqB,kBAAmB,EAAY,aAAa,CAEnE,EAAQ,CACZ,EAAG,EAAG,EAAG,GAAI,GAAI,GAAI,IAAK,IAAK,IAAK,IAAM,IAAM,IAAM,IAAO,IAC9D,CAAC,OAAQ,GAAS,GAAQ,GAAO,GAAQ,EAAI,CAE9C,OACE,EAAC,MAAA,CAAI,UAAU,oCACb,EAAC,OAAA,CAAK,UAAU,0DACb,GACI,CACP,EAAC,EAAA,CAAc,QAAsB,0BACnC,EAAC,EAAO,QAAA,CAAQ,UAAU,gBACxB,EAAC,EAAO,MAAA,CAAM,YAAa,EAAA,CAAkB,EAC9B,CACjB,EAAC,EAAO,QAAA,CAAA,SACL,EAAM,IAAK,GACV,EAAC,EAAO,KAAA,CAAgB,MAAO,EAAK,UAAU,UAC3C,GADe,EAEJ,CACd,CAAA,CACa,CAAA,EACV,CAAA,EACL"}

package/dist/esm/components/Pagination/Pagination.mjs

@@ -1,174 +1,2 @@
-'use client';
-
-import { cn } from "../../utils/cn.mjs";
-import { Button, ButtonColor, ButtonSize, ButtonVariant } from "../Button/Button.mjs";
-import { useItemSelector } from "../../hooks/useItemSelector.mjs";
-import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react";
-import { useEffect, useRef } from "react";
-import { cva } from "class-variance-authority";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/Pagination/Pagination.tsx
-const paginationVariants = cva("flex items-center justify-center gap-1", {
-	variants: {
-		size: {
-			sm: "gap-1",
-			md: "gap-2",
-			lg: "gap-3"
-		},
-		color: {
-			text: "background-text",
-			primary: "background-primary",
-			secondary: "background-secondary",
-			neutral: "background-neutral",
-			destructive: "background-destructive"
-		},
-		variant: {
-			default: "",
-			bordered: "rounded-lg border border-border p-2",
-			ghost: "bg-transparent"
-		}
-	},
-	defaultVariants: {
-		size: "md",
-		variant: "default"
-	}
-});
-let PaginationSize = /* @__PURE__ */ function(PaginationSize) {
-	PaginationSize["SM"] = "sm";
-	PaginationSize["MD"] = "md";
-	PaginationSize["LG"] = "lg";
-	return PaginationSize;
-}({});
-let PaginationVariant = /* @__PURE__ */ function(PaginationVariant) {
-	PaginationVariant["DEFAULT"] = "default";
-	PaginationVariant["BORDERED"] = "bordered";
-	PaginationVariant["GHOST"] = "ghost";
-	return PaginationVariant;
-}({});
-const generatePageNumbers = (currentPage, totalPages, maxVisiblePages) => {
-	if (totalPages <= maxVisiblePages) return Array.from({ length: totalPages }, (_, i) => i + 1);
-	const pages = [];
-	const halfVisible = Math.floor(maxVisiblePages / 2);
-	pages.push(1);
-	if (currentPage <= halfVisible + 2) {
-		for (let i = 2; i <= Math.min(maxVisiblePages - 1, totalPages - 1); i++) pages.push(i);
-		if (totalPages > maxVisiblePages) pages.push("ellipsis");
-		if (totalPages > 1) pages.push(totalPages);
-	} else if (currentPage >= totalPages - halfVisible - 1) {
-		if (totalPages > maxVisiblePages) pages.push("ellipsis");
-		for (let i = Math.max(2, totalPages - maxVisiblePages + 2); i <= totalPages; i++) pages.push(i);
-	} else {
-		pages.push("ellipsis");
-		const start = currentPage - halfVisible;
-		const end = currentPage + halfVisible;
-		for (let i = start; i <= end; i++) pages.push(i);
-		pages.push("ellipsis");
-		pages.push(totalPages);
-	}
-	return pages;
-};
-const selector = (option) => option?.getAttribute("aria-current") === "true";
-const getButtonSize = (size) => {
-	if (size === PaginationSize.SM) return ButtonSize.ICON_SM;
-	else if (size === PaginationSize.LG) return ButtonSize.ICON_LG;
-	else return ButtonSize.ICON_MD;
-};
-const InputIndicator = (props) => /* @__PURE__ */ jsx("div", {
-	className: "absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/10 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none",
-	...props
-});
-const Pagination = ({ currentPage, totalPages, onPageChange, showFirstLast = false, showPrevNext = true, maxVisiblePages = 5, disabled = false, size = PaginationSize.MD, variant = PaginationVariant.DEFAULT, color = ButtonColor.TEXT, className, ...props }) => {
-	const pageNumbers = generatePageNumbers(currentPage, totalPages, maxVisiblePages);
-	const buttonSize = getButtonSize(size);
-	const isFirstPage = currentPage === 1;
-	const isLastPage = currentPage === totalPages;
-	const optionsRefs = useRef([]);
-	const indicatorRef = useRef(null);
-	const { choiceIndicatorPosition, calculatePosition } = useItemSelector(optionsRefs, {
-		selector,
-		isHoverable: true
-	});
-	useEffect(() => {
-		const timer = setTimeout(() => {
-			calculatePosition();
-		}, 300);
-		return () => clearTimeout(timer);
-	}, [currentPage, calculatePosition]);
-	if (totalPages <= 1) return null;
-	const handlePageChange = (page) => {
-		if (!disabled && page >= 1 && page <= totalPages && page !== currentPage) onPageChange(page);
-	};
-	return /* @__PURE__ */ jsx("div", {
-		className: cn(paginationVariants({
-			size,
-			variant
-		}), className),
-		...props,
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "relative flex items-center gap-1",
-			children: [
-				choiceIndicatorPosition && /* @__PURE__ */ jsx(InputIndicator, {
-					style: choiceIndicatorPosition,
-					ref: indicatorRef
-				}),
-				showPrevNext && /* @__PURE__ */ jsx(Button, {
-					variant: ButtonVariant.OUTLINE,
-					size: buttonSize,
-					color: ButtonColor.TEXT,
-					onClick: () => handlePageChange(currentPage - 1),
-					disabled: disabled || isFirstPage,
-					label: "Go to previous page",
-					Icon: ChevronLeft,
-					ref: (el) => {
-						if (el) optionsRefs.current[0] = el;
-					},
-					className: "min-w-0 px-2"
-				}),
-				/* @__PURE__ */ jsx("div", {
-					className: "flex items-center gap-1 max-md:gap-0.5",
-					children: pageNumbers.map((page, index) => {
-						if (page === "ellipsis") return /* @__PURE__ */ jsx("div", {
-							className: "flex h-8 min-w-8 items-center justify-center px-1",
-							children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4 text-muted-foreground" })
-						}, `ellipsis-${page}-${index}`);
-						const isActive = page === currentPage;
-						const refIndex = (showPrevNext ? 1 : 0) + pageNumbers.slice(0, index).filter((p) => p !== "ellipsis").length;
-						return /* @__PURE__ */ jsx(Button, {
-							variant: isActive ? ButtonVariant.DEFAULT : ButtonVariant.OUTLINE,
-							size: buttonSize,
-							color: ButtonColor.TEXT,
-							onClick: () => handlePageChange(page),
-							disabled,
-							label: `Go to page ${page}`,
-							"aria-current": isActive ? "true" : "false",
-							ref: (el) => {
-								if (el) optionsRefs.current[refIndex] = el;
-							},
-							className: cn("flex aspect-square h-8 w-8 min-w-0 items-center justify-center p-0 text-sm", size === "sm" && "h-6 w-6 text-xs", size === "lg" && "h-10 w-10 text-base", isActive && "font-semibold"),
-							children: page
-						}, page);
-					})
-				}),
-				showPrevNext && /* @__PURE__ */ jsx(Button, {
-					variant: ButtonVariant.OUTLINE,
-					size: buttonSize,
-					color: ButtonColor.TEXT,
-					onClick: () => handlePageChange(currentPage + 1),
-					disabled: disabled || isLastPage,
-					label: "Go to next page",
-					Icon: ChevronRight,
-					ref: (el) => {
-						const lastRefIndex = (showPrevNext ? 1 : 0) + pageNumbers.filter((p) => p !== "ellipsis").length;
-						if (el) optionsRefs.current[lastRefIndex] = el;
-					},
-					className: "min-w-0 px-2"
-				})
-			]
-		})
-	});
-};
-
-//#endregion
-export { Pagination, PaginationSize, PaginationVariant, paginationVariants };
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t,ButtonColor as n,ButtonSize as r,ButtonVariant as i}from"../Button/Button.mjs";import{useItemSelector as a}from"../../hooks/useItemSelector.mjs";import{ChevronLeft as o,ChevronRight as s,MoreHorizontal as c}from"lucide-react";import{useEffect as l,useRef as u}from"react";import{cva as d}from"class-variance-authority";import{jsx as f,jsxs as p}from"react/jsx-runtime";const m=d(`flex items-center justify-center gap-1`,{variants:{size:{sm:`gap-1`,md:`gap-2`,lg:`gap-3`},color:{text:`background-text`,primary:`background-primary`,secondary:`background-secondary`,neutral:`background-neutral`,destructive:`background-destructive`},variant:{default:``,bordered:`rounded-lg border border-border p-2`,ghost:`bg-transparent`}},defaultVariants:{size:`md`,variant:`default`}});let h=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e}({}),g=function(e){return e.DEFAULT=`default`,e.BORDERED=`bordered`,e.GHOST=`ghost`,e}({});const _=(e,t,n)=>{if(t<=n)return Array.from({length:t},(e,t)=>t+1);let r=[],i=Math.floor(n/2);if(r.push(1),e<=i+2){for(let e=2;e<=Math.min(n-1,t-1);e++)r.push(e);t>n&&r.push(`ellipsis`),t>1&&r.push(t)}else if(e>=t-i-1){t>n&&r.push(`ellipsis`);for(let e=Math.max(2,t-n+2);e<=t;e++)r.push(e)}else{r.push(`ellipsis`);let n=e-i,a=e+i;for(let e=n;e<=a;e++)r.push(e);r.push(`ellipsis`),r.push(t)}return r},v=e=>e?.getAttribute(`aria-current`)===`true`,y=e=>e===h.SM?r.ICON_SM:e===h.LG?r.ICON_LG:r.ICON_MD,b=e=>f(`div`,{className:`absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/10 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none`,...e}),x=({currentPage:r,totalPages:d,onPageChange:x,showFirstLast:S=!1,showPrevNext:C=!0,maxVisiblePages:w=5,disabled:T=!1,size:E=h.MD,variant:D=g.DEFAULT,color:O=n.TEXT,className:k,...A})=>{let j=_(r,d,w),M=y(E),N=r===1,P=r===d,F=u([]),I=u(null),{choiceIndicatorPosition:L,calculatePosition:R}=a(F,{selector:v,isHoverable:!0});if(l(()=>{let e=setTimeout(()=>{R()},300);return()=>clearTimeout(e)},[r,R]),d<=1)return null;let z=e=>{!T&&e>=1&&e<=d&&e!==r&&x(e)};return f(`div`,{className:e(m({size:E,variant:D}),k),...A,children:p(`div`,{className:`relative flex items-center gap-1`,children:[L&&f(b,{style:L,ref:I}),C&&f(t,{variant:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(r-1),disabled:T||N,label:`Go to previous page`,Icon:o,ref:e=>{e&&(F.current[0]=e)},className:`min-w-0 px-2`}),f(`div`,{className:`flex items-center gap-1 max-md:gap-0.5`,children:j.map((a,o)=>{if(a===`ellipsis`)return f(`div`,{className:`flex h-8 min-w-8 items-center justify-center px-1`,children:f(c,{className:`h-4 w-4 text-muted-foreground`})},`ellipsis-${a}-${o}`);let s=a===r,l=(C?1:0)+j.slice(0,o).filter(e=>e!==`ellipsis`).length;return f(t,{variant:s?i.DEFAULT:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(a),disabled:T,label:`Go to page ${a}`,"aria-current":s?`true`:`false`,ref:e=>{e&&(F.current[l]=e)},className:e(`flex aspect-square h-8 w-8 min-w-0 items-center justify-center p-0 text-sm`,E===`sm`&&`h-6 w-6 text-xs`,E===`lg`&&`h-10 w-10 text-base`,s&&`font-semibold`),children:a},a)})}),C&&f(t,{variant:i.OUTLINE,size:M,color:n.TEXT,onClick:()=>z(r+1),disabled:T||P,label:`Go to next page`,Icon:s,ref:e=>{let t=(C?1:0)+j.filter(e=>e!==`ellipsis`).length;e&&(F.current[t]=e)},className:`min-w-0 px-2`})]})})};export{x as Pagination,h as PaginationSize,g as PaginationVariant,m as paginationVariants};
 //# sourceMappingURL=Pagination.mjs.map

package/dist/esm/components/Pagination/Pagination.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.mjs","names":[],"sources":["../../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["'use client';\n\nimport { useItemSelector } from '@hooks/useItemSelector';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ChevronLeft, ChevronRight, MoreHorizontal } from 'lucide-react';\nimport {\n  type ComponentProps,\n  type FC,\n  type HTMLAttributes,\n  useEffect,\n  useRef,\n} from 'react';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../Button';\n\nexport const paginationVariants = cva(\n  'flex items-center justify-center gap-1',\n  {\n    variants: {\n      size: {\n        sm: 'gap-1',\n        md: 'gap-2',\n        lg: 'gap-3',\n      },\n      color: {\n        text: 'background-text',\n        primary: 'background-primary',\n        secondary: 'background-secondary',\n        neutral: 'background-neutral',\n        destructive: 'background-destructive',\n      },\n      variant: {\n        default: '',\n        bordered: 'rounded-lg border border-border p-2',\n        ghost: 'bg-transparent',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      variant: 'default',\n    },\n  }\n);\n\nexport enum PaginationSize {\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n}\n\nexport enum PaginationVariant {\n  DEFAULT = 'default',\n  BORDERED = 'bordered',\n  GHOST = 'ghost',\n}\n\nexport type PaginationProps = HTMLAttributes<HTMLDivElement> &\n  VariantProps<typeof paginationVariants> & {\n    currentPage: number;\n    totalPages: number;\n    onPageChange: (page: number) => void;\n    showFirstLast?: boolean;\n    showPrevNext?: boolean;\n    maxVisiblePages?: number;\n    disabled?: boolean;\n  };\n\nconst generatePageNumbers = (\n  currentPage: number,\n  totalPages: number,\n  maxVisiblePages: number\n): (number | 'ellipsis')[] => {\n  if (totalPages <= maxVisiblePages) {\n    return Array.from({ length: totalPages }, (_, i) => i + 1);\n  }\n\n  const pages: (number | 'ellipsis')[] = [];\n  const halfVisible = Math.floor(maxVisiblePages / 2);\n\n  pages.push(1);\n\n  if (currentPage <= halfVisible + 2) {\n    for (let i = 2; i <= Math.min(maxVisiblePages - 1, totalPages - 1); i++) {\n      pages.push(i);\n    }\n    if (totalPages > maxVisiblePages) {\n      pages.push('ellipsis');\n    }\n    if (totalPages > 1) {\n      pages.push(totalPages);\n    }\n  } else if (currentPage >= totalPages - halfVisible - 1) {\n    if (totalPages > maxVisiblePages) {\n      pages.push('ellipsis');\n    }\n    for (\n      let i = Math.max(2, totalPages - maxVisiblePages + 2);\n      i <= totalPages;\n      i++\n    ) {\n      pages.push(i);\n    }\n  } else {\n    pages.push('ellipsis');\n    const start = currentPage - halfVisible;\n    const end = currentPage + halfVisible;\n    for (let i = start; i <= end; i++) {\n      pages.push(i);\n    }\n    pages.push('ellipsis');\n    pages.push(totalPages);\n  }\n\n  return pages;\n};\n\nconst selector = (option: HTMLElement) =>\n  option?.getAttribute('aria-current') === 'true';\n\nconst getButtonSize = (size?: PaginationSize | `${PaginationSize}` | null) => {\n  if (size === PaginationSize.SM) {\n    return ButtonSize.ICON_SM;\n  } else if (size === PaginationSize.LG) {\n    return ButtonSize.ICON_LG;\n  } else {\n    return ButtonSize.ICON_MD;\n  }\n};\n\nconst InputIndicator: FC<ComponentProps<'div'>> = (props) => (\n  <div\n    className=\"absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/10 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none\"\n    {...props}\n  />\n);\n\nexport const Pagination: FC<PaginationProps> = ({\n  currentPage,\n  totalPages,\n  onPageChange,\n  showFirstLast = false,\n  showPrevNext = true,\n  maxVisiblePages = 5,\n  disabled = false,\n  size = PaginationSize.MD,\n  variant = PaginationVariant.DEFAULT,\n  color = ButtonColor.TEXT,\n  className,\n  ...props\n}) => {\n  const pageNumbers = generatePageNumbers(\n    currentPage,\n    totalPages,\n    maxVisiblePages\n  );\n\n  const buttonSize = getButtonSize(size);\n  const isFirstPage = currentPage === 1;\n  const isLastPage = currentPage === totalPages;\n\n  const optionsRefs = useRef<HTMLElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition, calculatePosition } = useItemSelector(\n    optionsRefs,\n    {\n      selector,\n      isHoverable: true,\n    }\n  );\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      calculatePosition();\n    }, 300);\n\n    return () => clearTimeout(timer);\n  }, [currentPage, calculatePosition]);\n\n  if (totalPages <= 1) return null;\n\n  const handlePageChange = (page: number) => {\n    if (!disabled && page >= 1 && page <= totalPages && page !== currentPage) {\n      onPageChange(page);\n    }\n  };\n\n  return (\n    <div\n      className={cn(paginationVariants({ size, variant }), className)}\n      {...props}\n    >\n      <div className=\"relative flex items-center gap-1\">\n        {choiceIndicatorPosition && (\n          <InputIndicator style={choiceIndicatorPosition} ref={indicatorRef} />\n        )}\n\n        {showPrevNext && (\n          <Button\n            variant={ButtonVariant.OUTLINE}\n            size={buttonSize}\n            color={ButtonColor.TEXT}\n            onClick={() => handlePageChange(currentPage - 1)}\n            disabled={disabled || isFirstPage}\n            label=\"Go to previous page\"\n            Icon={ChevronLeft}\n            ref={(el) => {\n              if (el) optionsRefs.current[0] = el;\n            }}\n            className=\"min-w-0 px-2\"\n          />\n        )}\n\n        <div className=\"flex items-center gap-1 max-md:gap-0.5\">\n          {pageNumbers.map((page, index) => {\n            if (page === 'ellipsis') {\n              return (\n                <div\n                  key={`ellipsis-${page}-${index}`}\n                  className=\"flex h-8 min-w-8 items-center justify-center px-1\"\n                >\n                  <MoreHorizontal className=\"h-4 w-4 text-muted-foreground\" />\n                </div>\n              );\n            }\n\n            const isActive = page === currentPage;\n            // Calculate ref index: offset by 1 if showPrevNext, then count only non-ellipsis items\n            const refIndex =\n              (showPrevNext ? 1 : 0) +\n              pageNumbers.slice(0, index).filter((p) => p !== 'ellipsis')\n                .length;\n\n            return (\n              <Button\n                key={page}\n                variant={\n                  isActive ? ButtonVariant.DEFAULT : ButtonVariant.OUTLINE\n                }\n                size={buttonSize}\n                color={ButtonColor.TEXT}\n                onClick={() => handlePageChange(page)}\n                disabled={disabled}\n                label={`Go to page ${page}`}\n                aria-current={isActive ? 'true' : 'false'}\n                ref={(el) => {\n                  if (el) optionsRefs.current[refIndex] = el;\n                }}\n                className={cn(\n                  'flex aspect-square h-8 w-8 min-w-0 items-center justify-center p-0 text-sm',\n                  size === 'sm' && 'h-6 w-6 text-xs',\n                  size === 'lg' && 'h-10 w-10 text-base',\n                  isActive && 'font-semibold'\n                )}\n              >\n                {page}\n              </Button>\n            );\n          })}\n        </div>\n\n        {showPrevNext && (\n          <Button\n            variant={ButtonVariant.OUTLINE}\n            size={buttonSize}\n            color={ButtonColor.TEXT}\n            onClick={() => handlePageChange(currentPage + 1)}\n            disabled={disabled || isLastPage}\n            label=\"Go to next page\"\n            Icon={ChevronRight}\n            ref={(el) => {\n              const lastRefIndex =\n                (showPrevNext ? 1 : 0) +\n                pageNumbers.filter((p) => p !== 'ellipsis').length;\n              if (el) optionsRefs.current[lastRefIndex] = el;\n            }}\n            className=\"min-w-0 px-2\"\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Pagination.mjs","names":[],"sources":["../../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["'use client';\n\nimport { useItemSelector } from '@hooks/useItemSelector';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ChevronLeft, ChevronRight, MoreHorizontal } from 'lucide-react';\nimport {\n  type ComponentProps,\n  type FC,\n  type HTMLAttributes,\n  useEffect,\n  useRef,\n} from 'react';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../Button';\n\nexport const paginationVariants = cva(\n  'flex items-center justify-center gap-1',\n  {\n    variants: {\n      size: {\n        sm: 'gap-1',\n        md: 'gap-2',\n        lg: 'gap-3',\n      },\n      color: {\n        text: 'background-text',\n        primary: 'background-primary',\n        secondary: 'background-secondary',\n        neutral: 'background-neutral',\n        destructive: 'background-destructive',\n      },\n      variant: {\n        default: '',\n        bordered: 'rounded-lg border border-border p-2',\n        ghost: 'bg-transparent',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      variant: 'default',\n    },\n  }\n);\n\nexport enum PaginationSize {\n  SM = 'sm',\n  MD = 'md',\n  LG = 'lg',\n}\n\nexport enum PaginationVariant {\n  DEFAULT = 'default',\n  BORDERED = 'bordered',\n  GHOST = 'ghost',\n}\n\nexport type PaginationProps = HTMLAttributes<HTMLDivElement> &\n  VariantProps<typeof paginationVariants> & {\n    currentPage: number;\n    totalPages: number;\n    onPageChange: (page: number) => void;\n    showFirstLast?: boolean;\n    showPrevNext?: boolean;\n    maxVisiblePages?: number;\n    disabled?: boolean;\n  };\n\nconst generatePageNumbers = (\n  currentPage: number,\n  totalPages: number,\n  maxVisiblePages: number\n): (number | 'ellipsis')[] => {\n  if (totalPages <= maxVisiblePages) {\n    return Array.from({ length: totalPages }, (_, i) => i + 1);\n  }\n\n  const pages: (number | 'ellipsis')[] = [];\n  const halfVisible = Math.floor(maxVisiblePages / 2);\n\n  pages.push(1);\n\n  if (currentPage <= halfVisible + 2) {\n    for (let i = 2; i <= Math.min(maxVisiblePages - 1, totalPages - 1); i++) {\n      pages.push(i);\n    }\n    if (totalPages > maxVisiblePages) {\n      pages.push('ellipsis');\n    }\n    if (totalPages > 1) {\n      pages.push(totalPages);\n    }\n  } else if (currentPage >= totalPages - halfVisible - 1) {\n    if (totalPages > maxVisiblePages) {\n      pages.push('ellipsis');\n    }\n    for (\n      let i = Math.max(2, totalPages - maxVisiblePages + 2);\n      i <= totalPages;\n      i++\n    ) {\n      pages.push(i);\n    }\n  } else {\n    pages.push('ellipsis');\n    const start = currentPage - halfVisible;\n    const end = currentPage + halfVisible;\n    for (let i = start; i <= end; i++) {\n      pages.push(i);\n    }\n    pages.push('ellipsis');\n    pages.push(totalPages);\n  }\n\n  return pages;\n};\n\nconst selector = (option: HTMLElement) =>\n  option?.getAttribute('aria-current') === 'true';\n\nconst getButtonSize = (size?: PaginationSize | `${PaginationSize}` | null) => {\n  if (size === PaginationSize.SM) {\n    return ButtonSize.ICON_SM;\n  } else if (size === PaginationSize.LG) {\n    return ButtonSize.ICON_LG;\n  } else {\n    return ButtonSize.ICON_MD;\n  }\n};\n\nconst InputIndicator: FC<ComponentProps<'div'>> = (props) => (\n  <div\n    className=\"absolute top-0 z-0 h-full w-auto rounded-xl bg-text/20 ring-4 ring-text/10 transition-[left,width] duration-300 ease-in-out [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl motion-reduce:transition-none\"\n    {...props}\n  />\n);\n\nexport const Pagination: FC<PaginationProps> = ({\n  currentPage,\n  totalPages,\n  onPageChange,\n  showFirstLast = false,\n  showPrevNext = true,\n  maxVisiblePages = 5,\n  disabled = false,\n  size = PaginationSize.MD,\n  variant = PaginationVariant.DEFAULT,\n  color = ButtonColor.TEXT,\n  className,\n  ...props\n}) => {\n  const pageNumbers = generatePageNumbers(\n    currentPage,\n    totalPages,\n    maxVisiblePages\n  );\n\n  const buttonSize = getButtonSize(size);\n  const isFirstPage = currentPage === 1;\n  const isLastPage = currentPage === totalPages;\n\n  const optionsRefs = useRef<HTMLElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition, calculatePosition } = useItemSelector(\n    optionsRefs,\n    {\n      selector,\n      isHoverable: true,\n    }\n  );\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      calculatePosition();\n    }, 300);\n\n    return () => clearTimeout(timer);\n  }, [currentPage, calculatePosition]);\n\n  if (totalPages <= 1) return null;\n\n  const handlePageChange = (page: number) => {\n    if (!disabled && page >= 1 && page <= totalPages && page !== currentPage) {\n      onPageChange(page);\n    }\n  };\n\n  return (\n    <div\n      className={cn(paginationVariants({ size, variant }), className)}\n      {...props}\n    >\n      <div className=\"relative flex items-center gap-1\">\n        {choiceIndicatorPosition && (\n          <InputIndicator style={choiceIndicatorPosition} ref={indicatorRef} />\n        )}\n\n        {showPrevNext && (\n          <Button\n            variant={ButtonVariant.OUTLINE}\n            size={buttonSize}\n            color={ButtonColor.TEXT}\n            onClick={() => handlePageChange(currentPage - 1)}\n            disabled={disabled || isFirstPage}\n            label=\"Go to previous page\"\n            Icon={ChevronLeft}\n            ref={(el) => {\n              if (el) optionsRefs.current[0] = el;\n            }}\n            className=\"min-w-0 px-2\"\n          />\n        )}\n\n        <div className=\"flex items-center gap-1 max-md:gap-0.5\">\n          {pageNumbers.map((page, index) => {\n            if (page === 'ellipsis') {\n              return (\n                <div\n                  key={`ellipsis-${page}-${index}`}\n                  className=\"flex h-8 min-w-8 items-center justify-center px-1\"\n                >\n                  <MoreHorizontal className=\"h-4 w-4 text-muted-foreground\" />\n                </div>\n              );\n            }\n\n            const isActive = page === currentPage;\n            // Calculate ref index: offset by 1 if showPrevNext, then count only non-ellipsis items\n            const refIndex =\n              (showPrevNext ? 1 : 0) +\n              pageNumbers.slice(0, index).filter((p) => p !== 'ellipsis')\n                .length;\n\n            return (\n              <Button\n                key={page}\n                variant={\n                  isActive ? ButtonVariant.DEFAULT : ButtonVariant.OUTLINE\n                }\n                size={buttonSize}\n                color={ButtonColor.TEXT}\n                onClick={() => handlePageChange(page)}\n                disabled={disabled}\n                label={`Go to page ${page}`}\n                aria-current={isActive ? 'true' : 'false'}\n                ref={(el) => {\n                  if (el) optionsRefs.current[refIndex] = el;\n                }}\n                className={cn(\n                  'flex aspect-square h-8 w-8 min-w-0 items-center justify-center p-0 text-sm',\n                  size === 'sm' && 'h-6 w-6 text-xs',\n                  size === 'lg' && 'h-10 w-10 text-base',\n                  isActive && 'font-semibold'\n                )}\n              >\n                {page}\n              </Button>\n            );\n          })}\n        </div>\n\n        {showPrevNext && (\n          <Button\n            variant={ButtonVariant.OUTLINE}\n            size={buttonSize}\n            color={ButtonColor.TEXT}\n            onClick={() => handlePageChange(currentPage + 1)}\n            disabled={disabled || isLastPage}\n            label=\"Go to next page\"\n            Icon={ChevronRight}\n            ref={(el) => {\n              const lastRefIndex =\n                (showPrevNext ? 1 : 0) +\n                pageNumbers.filter((p) => p !== 'ellipsis').length;\n              if (el) optionsRefs.current[lastRefIndex] = el;\n            }}\n            className=\"min-w-0 px-2\"\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/esm/components/Pagination/ShowingResultsNumberItems.mjs

@@ -1,28 +1,2 @@
-'use client';
-
-import { jsx } from "react/jsx-runtime";
-import { useIntlayer } from "react-intlayer";
-import { useNumber } from "react-intlayer/format";
-
-//#region src/components/Pagination/ShowingResultsNumberItems.tsx
-const ShowingResultsNumberItems = ({ currentPage, pageSize, totalItems }) => {
-	const { showingResults } = useIntlayer("pagination");
-	const number = useNumber();
-	const safePageSize = Math.max(1, pageSize);
-	const totalPages = Math.max(1, Math.ceil(totalItems / safePageSize));
-	const page = Math.min(Math.max(1, currentPage), totalPages);
-	const start = totalItems === 0 ? 0 : Math.min((page - 1) * safePageSize + 1, totalItems);
-	const end = totalItems === 0 ? 0 : Math.min(page * safePageSize, totalItems);
-	return /* @__PURE__ */ jsx("div", {
-		className: "text-neutral-600 text-sm dark:text-neutral-400",
-		children: showingResults({
-			start: number(start),
-			end: number(end),
-			total: number(totalItems)
-		})
-	});
-};
-
-//#endregion
-export { ShowingResultsNumberItems };
+"use client";import{jsx as e}from"react/jsx-runtime";import{useIntlayer as t}from"react-intlayer";import{useNumber as n}from"react-intlayer/format";const r=({currentPage:r,pageSize:i,totalItems:a})=>{let{showingResults:o}=t(`pagination`),s=n(),c=Math.max(1,i),l=Math.max(1,Math.ceil(a/c)),u=Math.min(Math.max(1,r),l),d=a===0?0:Math.min((u-1)*c+1,a),f=a===0?0:Math.min(u*c,a);return e(`div`,{className:`text-neutral-600 text-sm dark:text-neutral-400`,children:o({start:s(d),end:s(f),total:s(a)})})};export{r as ShowingResultsNumberItems};
 //# sourceMappingURL=ShowingResultsNumberItems.mjs.map

package/dist/esm/components/Pagination/ShowingResultsNumberItems.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ShowingResultsNumberItems.mjs","names":[],"sources":["../../../../src/components/Pagination/ShowingResultsNumberItems.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { useNumber } from 'react-intlayer/format';\n\nexport type ShowingResultsNumberItemsProps = {\n  currentPage: number;\n  pageSize: number;\n  totalItems: number;\n};\n\nexport const ShowingResultsNumberItems: FC<ShowingResultsNumberItemsProps> = ({\n  currentPage,\n  pageSize,\n  totalItems,\n}) => {\n  const { showingResults } = useIntlayer('pagination');\n  const number = useNumber();\n\n  // Guard against weird inputs\n  const safePageSize = Math.max(1, pageSize);\n  const totalPages = Math.max(1, Math.ceil(totalItems / safePageSize));\n  const page = Math.min(Math.max(1, currentPage), totalPages);\n\n  const start =\n    totalItems === 0 ? 0 : Math.min((page - 1) * safePageSize + 1, totalItems);\n  const end = totalItems === 0 ? 0 : Math.min(page * safePageSize, totalItems);\n\n  return (\n    <div className=\"text-neutral-600 text-sm dark:text-neutral-400\">\n      {showingResults({\n        start: number(start),\n        end: number(end),\n        total: number(totalItems),\n      })}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;AAYA,MAAa,6BAAiE,EAC5E,aACA,UACA,iBACI;CACJ,MAAM,EAAE,mBAAmB,YAAY,aAAa;CACpD,MAAM,SAAS,WAAW;CAG1B,MAAM,eAAe,KAAK,IAAI,GAAG,SAAS;CAC1C,MAAM,aAAa,KAAK,IAAI,GAAG,KAAK,KAAK,aAAa,aAAa,CAAC;CACpE,MAAM,OAAO,KAAK,IAAI,KAAK,IAAI,GAAG,YAAY,EAAE,WAAW;CAE3D,MAAM,QACJ,eAAe,IAAI,IAAI,KAAK,KAAK,OAAO,KAAK,eAAe,GAAG,WAAW;CAC5E,MAAM,MAAM,eAAe,IAAI,IAAI,KAAK,IAAI,OAAO,cAAc,WAAW;AAE5E,QACE,oBAAC;EAAI,WAAU;YACZ,eAAe;GACd,OAAO,OAAO,MAAM;GACpB,KAAK,OAAO,IAAI;GAChB,OAAO,OAAO,WAAW;GAC1B,CAAC;GACE"}
+{"version":3,"file":"ShowingResultsNumberItems.mjs","names":[],"sources":["../../../../src/components/Pagination/ShowingResultsNumberItems.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { useNumber } from 'react-intlayer/format';\n\nexport type ShowingResultsNumberItemsProps = {\n  currentPage: number;\n  pageSize: number;\n  totalItems: number;\n};\n\nexport const ShowingResultsNumberItems: FC<ShowingResultsNumberItemsProps> = ({\n  currentPage,\n  pageSize,\n  totalItems,\n}) => {\n  const { showingResults } = useIntlayer('pagination');\n  const number = useNumber();\n\n  // Guard against weird inputs\n  const safePageSize = Math.max(1, pageSize);\n  const totalPages = Math.max(1, Math.ceil(totalItems / safePageSize));\n  const page = Math.min(Math.max(1, currentPage), totalPages);\n\n  const start =\n    totalItems === 0 ? 0 : Math.min((page - 1) * safePageSize + 1, totalItems);\n  const end = totalItems === 0 ? 0 : Math.min(page * safePageSize, totalItems);\n\n  return (\n    <div className=\"text-neutral-600 text-sm dark:text-neutral-400\">\n      {showingResults({\n        start: number(start),\n        end: number(end),\n        total: number(totalItems),\n      })}\n    </div>\n  );\n};\n"],"mappings":"oJAYA,MAAa,GAAiE,CAC5E,cACA,WACA,gBACI,CACJ,GAAM,CAAE,kBAAmB,EAAY,aAAa,CAC9C,EAAS,GAAW,CAGpB,EAAe,KAAK,IAAI,EAAG,EAAS,CACpC,EAAa,KAAK,IAAI,EAAG,KAAK,KAAK,EAAa,EAAa,CAAC,CAC9D,EAAO,KAAK,IAAI,KAAK,IAAI,EAAG,EAAY,CAAE,EAAW,CAErD,EACJ,IAAe,EAAI,EAAI,KAAK,KAAK,EAAO,GAAK,EAAe,EAAG,EAAW,CACtE,EAAM,IAAe,EAAI,EAAI,KAAK,IAAI,EAAO,EAAc,EAAW,CAE5E,OACE,EAAC,MAAA,CAAI,UAAU,0DACZ,EAAe,CACd,MAAO,EAAO,EAAM,CACpB,IAAK,EAAO,EAAI,CAChB,MAAO,EAAO,EAAW,CAC1B,CAAC,EACE"}

package/dist/esm/components/Pagination/index.mjs

@@ -1,5 +1 @@
-import { NumberItemsSelector } from "./NumberItemsSelector.mjs";
-import { Pagination, PaginationSize, PaginationVariant, paginationVariants } from "./Pagination.mjs";
-import { ShowingResultsNumberItems } from "./ShowingResultsNumberItems.mjs";
-
-export { NumberItemsSelector, Pagination, PaginationSize, PaginationVariant, ShowingResultsNumberItems, paginationVariants };
+import{NumberItemsSelector as e}from"./NumberItemsSelector.mjs";import{Pagination as t,PaginationSize as n,PaginationVariant as r,paginationVariants as i}from"./Pagination.mjs";import{ShowingResultsNumberItems as a}from"./ShowingResultsNumberItems.mjs";export{e as NumberItemsSelector,t as Pagination,n as PaginationSize,r as PaginationVariant,a as ShowingResultsNumberItems,i as paginationVariants};