@intlayer/design-system 6.1.6 → 7.0.0-canary.1

package/dist/components/Navbar/MobileNavbar.mjs

@@ -1,112 +0,0 @@
-"use client";
-import { jsxs, jsx } from "react/jsx-runtime";
-import { m } from "framer-motion";
-import { useState, useRef } from "react";
-import "@intlayer/config/built";
-import "../../better-auth.CiuwFiHM-7umXOENE.js";
-import "@intlayer/editor-react";
-import "@tanstack/react-query";
-import "@intlayer/api";
-import { u as useScrollBlockage } from "../../index-BCuMWKyy.js";
-import { useScrollDetection } from "../../hooks/useScrollDetection.mjs";
-import { cn } from "../../utils/cn.mjs";
-import { MaxHeightSmoother } from "../MaxHeightSmoother/index.mjs";
-import { Burger } from "./Burger.mjs";
-const navVariants = {
-  open: {
-    transition: { staggerChildren: 0.07, delayChildren: 0.2 }
-  },
-  closed: {
-    transition: { staggerChildren: 0.05, staggerDirection: -1 }
-  }
-};
-const bgStyle = "bg-card/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur";
-const MobileNavbar = ({
-  logo,
-  topChildren,
-  topSections = [],
-  bottomChildren,
-  bottomSections = [],
-  rightItems
-}) => {
-  const [isHidden, setIsHidden] = useState(false);
-  const [isUnrolled, setIsUnrolled] = useState(false);
-  const navRef = useRef(null);
-  useScrollBlockage({
-    disableScroll: isUnrolled,
-    key: "mobile_nav"
-  });
-  useScrollDetection({
-    onScrollUp: () => setIsHidden(false),
-    onScrollDown: () => setIsHidden(true),
-    isEnabled: !isUnrolled
-  });
-  const backDivHeight = !isHidden ? navRef.current?.clientHeight ?? 0 : 0;
-  const isBurgerShowed = topSections.length + bottomSections.length > 0;
-  return /* @__PURE__ */ jsxs(
-    "nav",
-    {
-      className: cn(
-        bgStyle,
-        "sticky top-0 z-50 flex w-screen flex-col transition",
-        isHidden ? "-translate-y-full" : "translate-y-0"
-      ),
-      id: "mobile-menu",
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: "flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]",
-            ref: navRef,
-            children: [
-              logo,
-              /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-1 items-center justify-end gap-6", children: [
-                /* @__PURE__ */ jsx("div", { className: "flex w-full items-center justify-end gap-1", children: rightItems }),
-                isBurgerShowed && /* @__PURE__ */ jsx(
-                  Burger,
-                  {
-                    isActive: isUnrolled,
-                    onClick: () => setIsUnrolled((isUnrolled2) => !isUnrolled2)
-                  }
-                )
-              ] })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: cn(
-              bgStyle,
-              "absolute bottom-0 left-0 w-full translate-y-full"
-            ),
-            children: /* @__PURE__ */ jsx(MaxHeightSmoother, { isHidden: !isUnrolled, children: /* @__PURE__ */ jsxs(
-              m.div,
-              {
-                className: "text-text flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide",
-                onClick: () => setIsUnrolled(false),
-                animate: isUnrolled ? "open" : "closed",
-                variants: navVariants,
-                style: {
-                  height: `calc(100vh - ${backDivHeight}px)`
-                },
-                children: [
-                  topChildren,
-                  /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col justify-center", children: [
-                    topSections,
-                    bottomSections
-                  ] }),
-                  /* @__PURE__ */ jsx("div", { className: "m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3", children: bottomChildren })
-                ]
-              }
-            ) })
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  MobileNavbar
-};
-//# sourceMappingURL=MobileNavbar.mjs.map

package/dist/components/Navbar/MobileNavbar.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"MobileNavbar.mjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport type { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\n/**\n * Props for the MobileNavbar component\n * @template T - The tab props type extending TabProps\n */\ntype MobileNavbarProps<T extends TabProps> = {\n  /** Logo component or element displayed in the header */\n  logo: ReactNode;\n  /** Additional content displayed at the top of expanded mobile menu */\n  topChildren?: ReactNode;\n  /** Navigation sections displayed in the top area of expanded menu */\n  topSections?: ReactElement<T>[];\n  /** Additional content displayed at the bottom of expanded mobile menu */\n  bottomChildren?: ReactNode;\n  /** Navigation sections displayed in the bottom area of expanded menu */\n  bottomSections?: ReactElement<T>[];\n  /** Right-aligned items in the collapsed header (e.g., search, notifications) */\n  rightItems?: ReactNode;\n};\n\n/**\n * Framer Motion animation variants for staggered menu item reveals\n * Creates a smooth cascading effect when menu opens/closes\n */\nconst navVariants: Variants = {\n  open: {\n    transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n  },\n  closed: {\n    transition: { staggerChildren: 0.05, staggerDirection: -1 },\n  },\n};\n\n/**\n * Shared background styling for mobile navbar components\n * Provides glass-morphism effect with blur and transparency\n */\nconst bgStyle =\n  'bg-card/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\n/**\n * Mobile Navigation Bar Component\n *\n * A sophisticated mobile-first navigation component with collapsible full-screen menu,\n * scroll-aware behavior, and smooth animations. Optimized for touch interactions and\n * mobile user experience patterns.\n *\n * Features:\n * - Collapsible hamburger menu with full-screen overlay\n * - Auto-hide on scroll down, show on scroll up for screen space optimization\n * - Background scroll prevention when menu is open\n * - Staggered animations for smooth menu item reveals\n * - Flexible content areas (top/bottom children and sections)\n * - Responsive layout with viewport-aware sizing\n * - Backdrop blur effects for modern glass-morphism design\n *\n * Layout Structure:\n * ```\n * [Logo] ----------- [Right Items] [Burger]\n *           (when expanded)\n * ┌─────────────────────────────────────────┐\n * │ [Top Children]                          │\n * │ [Top Sections - Navigation Items]       │\n * │ [Bottom Sections - Navigation Items]    │\n * │ [Bottom Children]                       │\n * └─────────────────────────────────────────┘\n * ```\n *\n * Behavioral Features:\n * - Sticky positioning with dynamic hide/show based on scroll direction\n * - Background scroll locking when menu is expanded\n * - Click outside to close expanded menu\n * - Smooth height animations with MaxHeightSmoother\n * - Intelligent burger button visibility (only shown if sections exist)\n *\n * Animation Details:\n * - Menu items animate in with staggered timing (70ms delay between items)\n * - Exit animations are reversed with 50ms stagger\n * - Initial delay of 200ms before items start animating in\n * - Full viewport height menu with dynamic height calculation\n *\n * @example\n * Basic mobile navbar:\n * ```tsx\n * <MobileNavbar\n *   logo={<MobileLogo />}\n *   topSections={primaryNavItems}\n *   rightItems={<SearchIcon />}\n * />\n * ```\n *\n * @example\n * Full-featured mobile navbar:\n * ```tsx\n * <MobileNavbar\n *   logo={<Logo />}\n *   topChildren={<WelcomeMessage />}\n *   topSections={mainNavItems}\n *   bottomSections={utilityNavItems}\n *   bottomChildren={<UserProfile />}\n *   rightItems={\n *     <>\n *       <NotificationIcon />\n *       <SearchIcon />\n *     </>\n *   }\n * />\n * ```\n *\n * Accessibility Features:\n * - Menu expanded state communicated via aria-expanded\n * - Focus management and keyboard navigation support\n * - Screen reader friendly with semantic nav structure\n *\n * @template T - Tab properties type extending TabProps for type safety\n * @param props - MobileNavbar component props\n * @returns Mobile navigation with collapsible full-screen menu\n */\nexport const MobileNavbar = <T extends TabProps>({\n  logo,\n  topChildren,\n  topSections = [],\n  bottomChildren,\n  bottomSections = [],\n  rightItems,\n}: MobileNavbarProps<T>) => {\n  const [isHidden, setIsHidden] = useState<boolean>(false);\n  const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n  const navRef = useRef<HTMLDivElement>(null);\n\n  useScrollBlockage({\n    disableScroll: isUnrolled,\n    key: 'mobile_nav',\n  });\n\n  useScrollDetection({\n    onScrollUp: () => setIsHidden(false),\n    onScrollDown: () => setIsHidden(true),\n    isEnabled: !isUnrolled,\n  });\n\n  const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n  const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n  return (\n    <nav\n      className={cn(\n        bgStyle,\n        'sticky top-0 z-50 flex w-screen flex-col transition',\n        isHidden ? '-translate-y-full' : 'translate-y-0'\n      )}\n      id=\"mobile-menu\"\n    >\n      <div\n        className=\"flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]\"\n        ref={navRef}\n      >\n        {logo}\n\n        <div className=\"flex w-full flex-1 items-center justify-end gap-6\">\n          <div className=\"flex w-full items-center justify-end gap-1\">\n            {rightItems}\n          </div>\n\n          {isBurgerShowed && (\n            <Burger\n              isActive={isUnrolled}\n              onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n            />\n          )}\n        </div>\n      </div>\n\n      <div\n        className={cn(\n          bgStyle,\n          'absolute bottom-0 left-0 w-full translate-y-full'\n        )}\n      >\n        <MaxHeightSmoother isHidden={!isUnrolled}>\n          <m.div\n            className=\"text-text flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n            onClick={() => setIsUnrolled(false)}\n            animate={isUnrolled ? 'open' : 'closed'}\n            variants={navVariants}\n            style={{\n              height: `calc(100vh - ${backDivHeight}px)`,\n            }}\n          >\n            {topChildren}\n            <div className=\"flex h-full flex-col justify-center\">\n              {topSections}\n              {bottomSections}\n            </div>\n\n            <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n              {bottomChildren}\n            </div>\n          </m.div>\n        </MaxHeightSmoother>\n      </div>\n    </nav>\n  );\n};\n"],"names":["isUnrolled"],"mappings":";;;;;;;;;;;;;;AAiCA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAA;AAAA,EAAI;AAAA,EAE1D,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAA;AAAA,EAAG;AAE9D;AAMA,MAAM,UACJ;AAgFK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAA;AAAA,EACd;AAAA,EACA,iBAAiB,CAAA;AAAA,EACjB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAI,SAAkB,KAAK;AAE3D,QAAM,SAAS,OAAuB,IAAI;AAE1C,oBAAkB;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAED,qBAAmB;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAEpE,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MAAA;AAAA,MAEnC,IAAG;AAAA,MAEH,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAED,qBAAC,OAAA,EAAI,WAAU,qDACb,UAAA;AAAA,gBAAA,oBAAC,OAAA,EAAI,WAAU,8CACZ,UAAA,YACH;AAAA,gBAEC,kBACC;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACA,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAC1D,EAAA,CAEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAGF;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,YAGF,UAAA,oBAAC,mBAAA,EAAkB,UAAU,CAAC,YAC5B,UAAA;AAAA,cAAC,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBAAA;AAAA,gBAGtC,UAAA;AAAA,kBAAA;AAAA,kBACD,qBAAC,OAAA,EAAI,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAEA,oBAAC,OAAA,EAAI,WAAU,gFACZ,UAAA,eAAA,CACH;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,EACF,CACF;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Navbar/index.cjs

@@ -1,51 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-require("@intlayer/config/built");
-require("../../better-auth.CiuwFiHM-C2nBKRMa.cjs");
-require("@intlayer/editor-react");
-require("@tanstack/react-query");
-require("@intlayer/api");
-const hooks_useDevice = require("../../hooks/useDevice.cjs");
-require("react");
-const hooks_useIsMounted = require("../../hooks/useIsMounted.cjs");
-require("../../hooks/useScrollBlockage/useScrollBlockageStore.cjs");
-const components_Navbar_DesktopNavbar = require("./DesktopNavbar.cjs");
-const components_Navbar_MobileNavbar = require("./MobileNavbar.cjs");
-const Navbar = ({
-  logo,
-  mobileTopChildren,
-  desktopSections = [],
-  mobileTopSections = [],
-  mobileBottomChildren,
-  mobileBottomSections = [],
-  rightItemsDesktop,
-  rightItemsMobile,
-  selectedChoice
-}) => {
-  const { isMobile } = hooks_useDevice.useDevice("lg");
-  const isMoUnted = hooks_useIsMounted.useIsMounted();
-  if (!isMoUnted) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
-  return isMobile ? /* @__PURE__ */ jsxRuntime.jsx(
-    components_Navbar_MobileNavbar.MobileNavbar,
-    {
-      topChildren: mobileTopChildren,
-      topSections: mobileTopSections,
-      bottomChildren: mobileBottomChildren,
-      bottomSections: mobileBottomSections,
-      logo,
-      rightItems: rightItemsMobile
-    }
-  ) : /* @__PURE__ */ jsxRuntime.jsx(
-    components_Navbar_DesktopNavbar.DesktopNavbar,
-    {
-      sections: desktopSections,
-      rightItems: rightItemsDesktop,
-      logo,
-      selectedChoice
-    }
-  );
-};
-exports.Navbar = Navbar;
-//# sourceMappingURL=index.cjs.map

package/dist/components/Navbar/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/Navbar/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport { useDevice, useIsMounted } from '../../hooks';\nimport type { TabProps } from '../TabSelector';\nimport { DesktopNavbar } from './DesktopNavbar';\nimport { MobileNavbar } from './MobileNavbar';\n\n/**\n * Props for the responsive Navbar component\n * @template T - The tab props type extending TabProps\n */\ntype NavbarProps<T extends TabProps> = {\n  /** Logo component or element to display in navbar */\n  logo: ReactNode;\n  /** Currently selected tab key for active state management */\n  selectedChoice: T['key'];\n  /** Navigation sections displayed on desktop layout */\n  desktopSections?: ReactElement<T>[];\n  /** Additional content displayed at top of mobile navbar */\n  mobileTopChildren?: ReactNode;\n  /** Navigation sections displayed at top of mobile navbar */\n  mobileTopSections?: ReactElement<T>[];\n  /** Additional content displayed at bottom of mobile navbar */\n  mobileBottomChildren?: ReactNode;\n  /** Navigation sections displayed at bottom of mobile navbar */\n  mobileBottomSections?: ReactElement<T>[];\n  /** Right-aligned items for desktop navbar (e.g., user menu, settings) */\n  rightItemsDesktop?: ReactNode;\n  /** Right-aligned items for mobile navbar */\n  rightItemsMobile?: ReactNode;\n};\n\n/**\n * Responsive Navbar Component\n *\n * A highly adaptable navigation component that automatically switches between desktop and mobile\n * layouts based on screen size. Provides comprehensive navigation structure with flexible content areas.\n *\n * Features:\n * - Automatic responsive switching at 'lg' breakpoint (1024px)\n * - Separate section configurations for desktop and mobile layouts\n * - Support for logo placement and right-aligned utility items\n * - Generic typing for tab properties and selected states\n * - Mobile-specific top/bottom content areas for enhanced mobile UX\n * - Hydration-safe rendering with useIsMounted hook\n *\n * @example\n * Basic usage:\n * ```tsx\n * const navSections = [\n *   { key: 'home', label: 'Home', href: '/' },\n *   { key: 'about', label: 'About', href: '/about' }\n * ];\n *\n * <Navbar\n *   logo={<Logo />}\n *   selectedChoice=\"home\"\n *   desktopSections={navSections}\n *   mobileTopSections={navSections}\n *   rightItemsDesktop={<UserMenu />}\n * />\n * ```\n *\n * @example\n * Advanced mobile configuration:\n * ```tsx\n * <Navbar\n *   logo={<Logo />}\n *   selectedChoice={activeTab}\n *   desktopSections={mainNavItems}\n *   mobileTopSections={primaryMobileNavItems}\n *   mobileTopChildren={<SearchBar />}\n *   mobileBottomSections={secondaryMobileNavItems}\n *   mobileBottomChildren={<UserProfile />}\n *   rightItemsDesktop={<DesktopActions />}\n *   rightItemsMobile={<MobileActions />}\n * />\n * ```\n *\n * Responsive Behavior:\n * - Desktop (≥1024px): Shows DesktopNavbar with horizontal layout\n * - Mobile (<1024px): Shows MobileNavbar with collapsible vertical layout\n * - Automatic detection with no flash of unstyled content\n *\n * @template T - Tab properties type extending TabProps for type safety\n * @param props - Navbar component props\n * @returns Responsive navbar JSX element\n */\nexport const Navbar = <T extends TabProps>({\n  logo,\n  mobileTopChildren,\n  desktopSections = [],\n  mobileTopSections = [],\n  mobileBottomChildren,\n  mobileBottomSections = [],\n  rightItemsDesktop,\n  rightItemsMobile,\n  selectedChoice,\n}: NavbarProps<T>) => {\n  const { isMobile } = useDevice('lg');\n  const isMoUnted = useIsMounted();\n\n  if (!isMoUnted) return <></>;\n\n  return isMobile ? (\n    <MobileNavbar\n      topChildren={mobileTopChildren}\n      topSections={mobileTopSections}\n      bottomChildren={mobileBottomChildren}\n      bottomSections={mobileBottomSections}\n      logo={logo}\n      rightItems={rightItemsMobile}\n    />\n  ) : (\n    <DesktopNavbar\n      sections={desktopSections}\n      rightItems={rightItemsDesktop}\n      logo={logo}\n      selectedChoice={selectedChoice}\n    />\n  );\n};\n"],"names":["useDevice","useIsMounted","jsx","Fragment","MobileNavbar","DesktopNavbar"],"mappings":";;;;;;;;;;;;;;;AAyFO,MAAM,SAAS,CAAqB;AAAA,EACzC;AAAA,EACA;AAAA,EACA,kBAAkB,CAAA;AAAA,EAClB,oBAAoB,CAAA;AAAA,EACpB;AAAA,EACA,uBAAuB,CAAA;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACpB,QAAM,EAAE,SAAA,IAAaA,gBAAAA,UAAU,IAAI;AACnC,QAAM,YAAYC,mBAAAA,aAAA;AAElB,MAAI,CAAC,UAAW,QAAOC,+BAAAC,WAAAA,UAAA,CAAA,CAAE;AAEzB,SAAO,WACLD,2BAAAA;AAAAA,IAACE,+BAAAA;AAAAA,IAAA;AAAA,MACC,aAAa;AAAA,MACb,aAAa;AAAA,MACb,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB;AAAA,MACA,YAAY;AAAA,IAAA;AAAA,EAAA,IAGdF,2BAAAA;AAAAA,IAACG,gCAAAA;AAAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,IAAA;AAAA,EAAA;AAGN;;"}

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

@@ -1,85 +0,0 @@
-import { ReactElement, ReactNode } from 'react';
-import { TabProps } from '../TabSelector';
-/**
- * Props for the responsive Navbar component
- * @template T - The tab props type extending TabProps
- */
-type NavbarProps<T extends TabProps> = {
-    /** Logo component or element to display in navbar */
-    logo: ReactNode;
-    /** Currently selected tab key for active state management */
-    selectedChoice: T['key'];
-    /** Navigation sections displayed on desktop layout */
-    desktopSections?: ReactElement<T>[];
-    /** Additional content displayed at top of mobile navbar */
-    mobileTopChildren?: ReactNode;
-    /** Navigation sections displayed at top of mobile navbar */
-    mobileTopSections?: ReactElement<T>[];
-    /** Additional content displayed at bottom of mobile navbar */
-    mobileBottomChildren?: ReactNode;
-    /** Navigation sections displayed at bottom of mobile navbar */
-    mobileBottomSections?: ReactElement<T>[];
-    /** Right-aligned items for desktop navbar (e.g., user menu, settings) */
-    rightItemsDesktop?: ReactNode;
-    /** Right-aligned items for mobile navbar */
-    rightItemsMobile?: ReactNode;
-};
-/**
- * Responsive Navbar Component
- *
- * A highly adaptable navigation component that automatically switches between desktop and mobile
- * layouts based on screen size. Provides comprehensive navigation structure with flexible content areas.
- *
- * Features:
- * - Automatic responsive switching at 'lg' breakpoint (1024px)
- * - Separate section configurations for desktop and mobile layouts
- * - Support for logo placement and right-aligned utility items
- * - Generic typing for tab properties and selected states
- * - Mobile-specific top/bottom content areas for enhanced mobile UX
- * - Hydration-safe rendering with useIsMounted hook
- *
- * @example
- * Basic usage:
- * ```tsx
- * const navSections = [
- *   { key: 'home', label: 'Home', href: '/' },
- *   { key: 'about', label: 'About', href: '/about' }
- * ];
- *
- * <Navbar
- *   logo={<Logo />}
- *   selectedChoice="home"
- *   desktopSections={navSections}
- *   mobileTopSections={navSections}
- *   rightItemsDesktop={<UserMenu />}
- * />
- * ```
- *
- * @example
- * Advanced mobile configuration:
- * ```tsx
- * <Navbar
- *   logo={<Logo />}
- *   selectedChoice={activeTab}
- *   desktopSections={mainNavItems}
- *   mobileTopSections={primaryMobileNavItems}
- *   mobileTopChildren={<SearchBar />}
- *   mobileBottomSections={secondaryMobileNavItems}
- *   mobileBottomChildren={<UserProfile />}
- *   rightItemsDesktop={<DesktopActions />}
- *   rightItemsMobile={<MobileActions />}
- * />
- * ```
- *
- * Responsive Behavior:
- * - Desktop (≥1024px): Shows DesktopNavbar with horizontal layout
- * - Mobile (<1024px): Shows MobileNavbar with collapsible vertical layout
- * - Automatic detection with no flash of unstyled content
- *
- * @template T - Tab properties type extending TabProps for type safety
- * @param props - Navbar component props
- * @returns Responsive navbar JSX element
- */
-export declare const Navbar: <T extends TabProps>({ logo, mobileTopChildren, desktopSections, mobileTopSections, mobileBottomChildren, mobileBottomSections, rightItemsDesktop, rightItemsMobile, selectedChoice, }: NavbarProps<T>) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=index.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Navbar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAErD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAI/C;;;GAGG;AACH,KAAK,WAAW,CAAC,CAAC,SAAS,QAAQ,IAAI;IACrC,qDAAqD;IACrD,IAAI,EAAE,SAAS,CAAC;IAChB,6DAA6D;IAC7D,cAAc,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;IACzB,sDAAsD;IACtD,eAAe,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IACpC,2DAA2D;IAC3D,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,4DAA4D;IAC5D,iBAAiB,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IACtC,8DAA8D;IAC9D,oBAAoB,CAAC,EAAE,SAAS,CAAC;IACjC,+DAA+D;IAC/D,oBAAoB,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IACzC,yEAAyE;IACzE,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,SAAS,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,eAAO,MAAM,MAAM,GAAI,CAAC,SAAS,QAAQ,EAAE,mKAUxC,WAAW,CAAC,CAAC,CAAC,4CAuBhB,CAAC"}

package/dist/components/Navbar/index.mjs

@@ -1,51 +0,0 @@
-"use client";
-import { jsx, Fragment } from "react/jsx-runtime";
-import "@intlayer/config/built";
-import "../../better-auth.CiuwFiHM-7umXOENE.js";
-import "@intlayer/editor-react";
-import "@tanstack/react-query";
-import "@intlayer/api";
-import { useDevice } from "../../hooks/useDevice.mjs";
-import "react";
-import { useIsMounted } from "../../hooks/useIsMounted.mjs";
-import "../../hooks/useScrollBlockage/useScrollBlockageStore.mjs";
-import { DesktopNavbar } from "./DesktopNavbar.mjs";
-import { MobileNavbar } from "./MobileNavbar.mjs";
-const Navbar = ({
-  logo,
-  mobileTopChildren,
-  desktopSections = [],
-  mobileTopSections = [],
-  mobileBottomChildren,
-  mobileBottomSections = [],
-  rightItemsDesktop,
-  rightItemsMobile,
-  selectedChoice
-}) => {
-  const { isMobile } = useDevice("lg");
-  const isMoUnted = useIsMounted();
-  if (!isMoUnted) return /* @__PURE__ */ jsx(Fragment, {});
-  return isMobile ? /* @__PURE__ */ jsx(
-    MobileNavbar,
-    {
-      topChildren: mobileTopChildren,
-      topSections: mobileTopSections,
-      bottomChildren: mobileBottomChildren,
-      bottomSections: mobileBottomSections,
-      logo,
-      rightItems: rightItemsMobile
-    }
-  ) : /* @__PURE__ */ jsx(
-    DesktopNavbar,
-    {
-      sections: desktopSections,
-      rightItems: rightItemsDesktop,
-      logo,
-      selectedChoice
-    }
-  );
-};
-export {
-  Navbar
-};
-//# sourceMappingURL=index.mjs.map

package/dist/components/Navbar/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.mjs","sources":["../../../src/components/Navbar/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport { useDevice, useIsMounted } from '../../hooks';\nimport type { TabProps } from '../TabSelector';\nimport { DesktopNavbar } from './DesktopNavbar';\nimport { MobileNavbar } from './MobileNavbar';\n\n/**\n * Props for the responsive Navbar component\n * @template T - The tab props type extending TabProps\n */\ntype NavbarProps<T extends TabProps> = {\n  /** Logo component or element to display in navbar */\n  logo: ReactNode;\n  /** Currently selected tab key for active state management */\n  selectedChoice: T['key'];\n  /** Navigation sections displayed on desktop layout */\n  desktopSections?: ReactElement<T>[];\n  /** Additional content displayed at top of mobile navbar */\n  mobileTopChildren?: ReactNode;\n  /** Navigation sections displayed at top of mobile navbar */\n  mobileTopSections?: ReactElement<T>[];\n  /** Additional content displayed at bottom of mobile navbar */\n  mobileBottomChildren?: ReactNode;\n  /** Navigation sections displayed at bottom of mobile navbar */\n  mobileBottomSections?: ReactElement<T>[];\n  /** Right-aligned items for desktop navbar (e.g., user menu, settings) */\n  rightItemsDesktop?: ReactNode;\n  /** Right-aligned items for mobile navbar */\n  rightItemsMobile?: ReactNode;\n};\n\n/**\n * Responsive Navbar Component\n *\n * A highly adaptable navigation component that automatically switches between desktop and mobile\n * layouts based on screen size. Provides comprehensive navigation structure with flexible content areas.\n *\n * Features:\n * - Automatic responsive switching at 'lg' breakpoint (1024px)\n * - Separate section configurations for desktop and mobile layouts\n * - Support for logo placement and right-aligned utility items\n * - Generic typing for tab properties and selected states\n * - Mobile-specific top/bottom content areas for enhanced mobile UX\n * - Hydration-safe rendering with useIsMounted hook\n *\n * @example\n * Basic usage:\n * ```tsx\n * const navSections = [\n *   { key: 'home', label: 'Home', href: '/' },\n *   { key: 'about', label: 'About', href: '/about' }\n * ];\n *\n * <Navbar\n *   logo={<Logo />}\n *   selectedChoice=\"home\"\n *   desktopSections={navSections}\n *   mobileTopSections={navSections}\n *   rightItemsDesktop={<UserMenu />}\n * />\n * ```\n *\n * @example\n * Advanced mobile configuration:\n * ```tsx\n * <Navbar\n *   logo={<Logo />}\n *   selectedChoice={activeTab}\n *   desktopSections={mainNavItems}\n *   mobileTopSections={primaryMobileNavItems}\n *   mobileTopChildren={<SearchBar />}\n *   mobileBottomSections={secondaryMobileNavItems}\n *   mobileBottomChildren={<UserProfile />}\n *   rightItemsDesktop={<DesktopActions />}\n *   rightItemsMobile={<MobileActions />}\n * />\n * ```\n *\n * Responsive Behavior:\n * - Desktop (≥1024px): Shows DesktopNavbar with horizontal layout\n * - Mobile (<1024px): Shows MobileNavbar with collapsible vertical layout\n * - Automatic detection with no flash of unstyled content\n *\n * @template T - Tab properties type extending TabProps for type safety\n * @param props - Navbar component props\n * @returns Responsive navbar JSX element\n */\nexport const Navbar = <T extends TabProps>({\n  logo,\n  mobileTopChildren,\n  desktopSections = [],\n  mobileTopSections = [],\n  mobileBottomChildren,\n  mobileBottomSections = [],\n  rightItemsDesktop,\n  rightItemsMobile,\n  selectedChoice,\n}: NavbarProps<T>) => {\n  const { isMobile } = useDevice('lg');\n  const isMoUnted = useIsMounted();\n\n  if (!isMoUnted) return <></>;\n\n  return isMobile ? (\n    <MobileNavbar\n      topChildren={mobileTopChildren}\n      topSections={mobileTopSections}\n      bottomChildren={mobileBottomChildren}\n      bottomSections={mobileBottomSections}\n      logo={logo}\n      rightItems={rightItemsMobile}\n    />\n  ) : (\n    <DesktopNavbar\n      sections={desktopSections}\n      rightItems={rightItemsDesktop}\n      logo={logo}\n      selectedChoice={selectedChoice}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;AAyFO,MAAM,SAAS,CAAqB;AAAA,EACzC;AAAA,EACA;AAAA,EACA,kBAAkB,CAAA;AAAA,EAClB,oBAAoB,CAAA;AAAA,EACpB;AAAA,EACA,uBAAuB,CAAA;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACpB,QAAM,EAAE,SAAA,IAAa,UAAU,IAAI;AACnC,QAAM,YAAY,aAAA;AAElB,MAAI,CAAC,UAAW,QAAO,oBAAA,UAAA,CAAA,CAAE;AAEzB,SAAO,WACL;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAa;AAAA,MACb,aAAa;AAAA,MACb,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB;AAAA,MACA,YAAY;AAAA,IAAA;AAAA,EAAA,IAGd;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Navbar/useNavigation.cjs

@@ -1,64 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const ReactExports = require("react");
-const useNavActions = () => {
-  const [activeSection, setActiveSection] = ReactExports.useState(null);
-  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);
-    }
-  };
-  ReactExports.useEffect(() => {
-    window.addEventListener("scroll", detectActiveSection, { passive: true });
-    return () => {
-      window.removeEventListener("scroll", detectActiveSection);
-    };
-  }, []);
-  const onClickLogo = (onClick) => {
-    setActiveSection(null);
-    if (window.location.pathname === "/") {
-      window.scrollTo({ top: 0, behavior: "smooth" });
-    } else {
-      onClick("/");
-    }
-  };
-  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 {
-    /** Currently active section ID, null if no section is active */
-    activeSection,
-    /** Handler for logo click interactions */
-    onClickLogo,
-    /** Handler for section navigation clicks */
-    onClickSection
-  };
-};
-exports.useNavActions = useNavActions;
-//# sourceMappingURL=useNavigation.cjs.map

package/dist/components/Navbar/useNavigation.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"useNavigation.cjs","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"],"names":["useState","useEffect"],"mappings":";;;;AAgGO,MAAM,gBAAgB,MAAM;AAEjC,QAAM,CAAC,eAAe,gBAAgB,IAAIA,aAAAA,SAAwB,IAAI;AAMtE,QAAM,sBAAsB,MAAM;AAChC,UAAM,UAAU,OAAO;AACvB,UAAM,WAAW,SAAS,iBAAiB,SAAS;AACpD,UAAM,eAA8B,CAAA;AAGpC,aAAS;AAAA,MAAQ,CAAC,YAChB,aAAa,KAAK;AAAA,QAChB,IAAI,QAAQ;AAAA,QACZ,WAAW,QAAQ;AAAA,QACnB,cAAc,QAAQ;AAAA,MAAA,CACvB;AAAA,IAAA;AAIH,UAAM,iBAAiB,aAAa;AAAA,MAClC,CAAC,YACC,QAAQ,aAAa,UAAU,OAAO,OAAO,SAAS,KACtD,QAAQ,YAAY,QAAQ,eAC1B,UAAU,OAAO,OAAO,SAAS;AAAA,IAAA;AAGvC,QAAI,gBAAgB;AAClB,uBAAiB,eAAe,EAAE;AAAA,IACpC;AAAA,EACF;AAGAC,eAAAA,UAAU,MAAM;AACd,WAAO,iBAAiB,UAAU,qBAAqB,EAAE,SAAS,MAAM;AAExE,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,mBAAmB;AAAA,IAC1D;AAAA,EACF,GAAG,CAAA,CAAE;AAQL,QAAM,cAAc,CAAC,YAAmC;AACtD,qBAAiB,IAAI;AAErB,QAAI,OAAO,SAAS,aAAa,KAAK;AACpC,aAAO,SAAS,EAAE,KAAK,GAAG,UAAU,UAAU;AAAA,IAChD,OAAO;AACL,cAAQ,GAAG;AAAA,IACb;AAAA,EACF;AAUA,QAAM,iBAAiB,CACrB,WACA,KACA,YACG;AACH,qBAAiB,SAAS;AAG1B,QAAI,OAAO,SAAS,aAAa,KAAK;AACpC,YAAM,YAAY,SAAS,eAAe,SAAS;AAEnD,UAAI,WAAW;AACb,kBAAU,eAAe;AAAA,UACvB,UAAU;AAAA,UACV,OAAO;AAAA,UACP,QAAQ;AAAA,QAAA,CACT;AAAA,MACH;AAAA,IACF,OAAO;AAEL,gBAAA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA;AAAA,IAEL;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA,EAAA;AAEJ;;"}

package/dist/components/Navbar/useNavigation.d.ts

@@ -1,89 +0,0 @@
-/**
- * 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
- */
-export declare const useNavActions: () => {
-    /** Currently active section ID, null if no section is active */
-    activeSection: string | null;
-    /** Handler for logo click interactions */
-    onClickLogo: (onClick: (url: string) => void) => void;
-    /** Handler for section navigation clicks */
-    onClickSection: (sectionId: string, url?: string, onClick?: () => void) => void;
-};
-//# sourceMappingURL=useNavigation.d.ts.map

package/dist/components/Navbar/useNavigation.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/Navbar/useNavigation.ts"],"names":[],"mappings":"AAgBA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+EG;AACH,eAAO,MAAM,aAAa;IA6FtB,gEAAgE;;IAEhE,0CAA0C;2BA7Cd,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI;IA+CjD,4CAA4C;gCA5BjC,MAAM,QACX,MAAM,YACF,MAAM,IAAI;CA6BvB,CAAC"}

package/dist/components/Navbar/useNavigation.mjs

@@ -1,64 +0,0 @@
-"use client";
-import { useState, useEffect } from "react";
-const useNavActions = () => {
-  const [activeSection, setActiveSection] = useState(null);
-  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);
-    };
-  }, []);
-  const onClickLogo = (onClick) => {
-    setActiveSection(null);
-    if (window.location.pathname === "/") {
-      window.scrollTo({ top: 0, behavior: "smooth" });
-    } else {
-      onClick("/");
-    }
-  };
-  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 {
-    /** Currently active section ID, null if no section is active */
-    activeSection,
-    /** Handler for logo click interactions */
-    onClickLogo,
-    /** Handler for section navigation clicks */
-    onClickSection
-  };
-};
-export {
-  useNavActions
-};
-//# sourceMappingURL=useNavigation.mjs.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"useNavigation.mjs","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"],"names":[],"mappings":";;AAgGO,MAAM,gBAAgB,MAAM;AAEjC,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAwB,IAAI;AAMtE,QAAM,sBAAsB,MAAM;AAChC,UAAM,UAAU,OAAO;AACvB,UAAM,WAAW,SAAS,iBAAiB,SAAS;AACpD,UAAM,eAA8B,CAAA;AAGpC,aAAS;AAAA,MAAQ,CAAC,YAChB,aAAa,KAAK;AAAA,QAChB,IAAI,QAAQ;AAAA,QACZ,WAAW,QAAQ;AAAA,QACnB,cAAc,QAAQ;AAAA,MAAA,CACvB;AAAA,IAAA;AAIH,UAAM,iBAAiB,aAAa;AAAA,MAClC,CAAC,YACC,QAAQ,aAAa,UAAU,OAAO,OAAO,SAAS,KACtD,QAAQ,YAAY,QAAQ,eAC1B,UAAU,OAAO,OAAO,SAAS;AAAA,IAAA;AAGvC,QAAI,gBAAgB;AAClB,uBAAiB,eAAe,EAAE;AAAA,IACpC;AAAA,EACF;AAGA,YAAU,MAAM;AACd,WAAO,iBAAiB,UAAU,qBAAqB,EAAE,SAAS,MAAM;AAExE,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,mBAAmB;AAAA,IAC1D;AAAA,EACF,GAAG,CAAA,CAAE;AAQL,QAAM,cAAc,CAAC,YAAmC;AACtD,qBAAiB,IAAI;AAErB,QAAI,OAAO,SAAS,aAAa,KAAK;AACpC,aAAO,SAAS,EAAE,KAAK,GAAG,UAAU,UAAU;AAAA,IAChD,OAAO;AACL,cAAQ,GAAG;AAAA,IACb;AAAA,EACF;AAUA,QAAM,iBAAiB,CACrB,WACA,KACA,YACG;AACH,qBAAiB,SAAS;AAG1B,QAAI,OAAO,SAAS,aAAa,KAAK;AACpC,YAAM,YAAY,SAAS,eAAe,SAAS;AAEnD,UAAI,WAAW;AACb,kBAAU,eAAe;AAAA,UACvB,UAAU;AAAA,UACV,OAAO;AAAA,UACP,QAAQ;AAAA,QAAA,CACT;AAAA,MACH;AAAA,IACF,OAAO;AAEL,gBAAA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA;AAAA,IAEL;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA,EAAA;AAEJ;"}