@logickernel/frame 0.1.0 → 0.3.0

package/README.md

@@ -252,7 +252,7 @@ const { items, organizations, loading, error } = useNavigation({
 **Options:**
 - `organizationId?: string` - Organization ID to fetch navigation for
 - `apiBaseUrl?: string` - API base URL (default: "/api")
-- `enabled?: boolean` - Enable/disable fetching (default: true)
+- `enabled?: boolean` - Enable/disable fetching (default: true). Useful for conditional fetching, e.g., `enabled: !!user` to only fetch when a user is logged in
 
 **Returns:**
 - `items: NavigationItem[]` - Navigation items

package/dist/index.d.mts

@@ -1,19 +1,119 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-import { User, FrameworkAdapter, SidebarData, NavigationItem, Organization } from './types/index.mjs';
-export { LinkProps, NavigationConfig, Router } from './types/index.mjs';
-import { Sidebar } from '@/components/ui/sidebar';
-export { useNavigation } from './hooks/useNavigation.mjs';
-export { getIconComponent } from './utils/iconMapper.mjs';
-import 'lucide-react';
+import * as React$1 from 'react';
+import { ComponentType, ReactNode } from 'react';
+import { LucideIcon } from 'lucide-react';
+
+/**
+ * @logickernel/frame library types
+ * Shared types for navigation, user, and organization data
+ */
+
+/**
+ * Navigation item for facade components
+ * Supports both icon components (props) and icon names (API)
+ */
+interface NavigationItem {
+    title: string;
+    url?: string;
+    icon?: string | LucideIcon;
+    isActive?: boolean;
+    items?: {
+        title: string;
+        url: string;
+    }[];
+}
+/**
+ * Navigation configuration
+ */
+interface NavigationConfig {
+    items: NavigationItem[];
+    organizationId?: string;
+}
+/**
+ * Sidebar data payload for props mode
+ * Contains organizations and navigation items
+ */
+interface SidebarData {
+    organizations: Organization[];
+    navigationItems: NavigationItem[];
+}
+/**
+ * User data structure
+ */
+interface User {
+    name: string | null;
+    email: string;
+    image: string | null;
+}
+/**
+ * Organization data structure
+ */
+interface Organization {
+    id: string;
+    name: string;
+    logo?: LucideIcon | React.ComponentType<{
+        className?: string;
+    }>;
+    plan?: string;
+}
+/**
+ * Router interface for framework-agnostic navigation
+ */
+interface Router {
+    push: (path: string) => void;
+    refresh?: () => void;
+}
+/**
+ * Link component props
+ */
+interface LinkProps {
+    href: string;
+    children: ReactNode;
+    className?: string;
+}
+/**
+ * Framework adapter interface
+ * Provides router functions and components for the library
+ */
+interface FrameworkAdapter {
+    usePathname: () => string;
+    useRouter: () => Router;
+    Link: ComponentType<LinkProps>;
+    signOut?: (options?: {
+        redirect?: boolean;
+    }) => Promise<void>;
+}
+
+type SidebarContext = {
+    state: "expanded" | "collapsed";
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    openMobile: boolean;
+    setOpenMobile: (open: boolean) => void;
+    isMobile: boolean;
+    toggleSidebar: () => void;
+};
+declare const SidebarContext: React$1.Context<SidebarContext | null>;
+declare function useSidebar(): SidebarContext;
+declare const SidebarProvider: React$1.ForwardRefExoticComponent<Omit<React$1.ClassAttributes<HTMLDivElement> & React$1.HTMLAttributes<HTMLDivElement> & {
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const Sidebar: React$1.ForwardRefExoticComponent<Omit<React$1.ClassAttributes<HTMLDivElement> & React$1.HTMLAttributes<HTMLDivElement> & {
+    side?: "left" | "right";
+    variant?: "sidebar" | "floating" | "inset";
+    collapsible?: "offcanvas" | "icon" | "none";
+}, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 
 /**
  * Props mode: Pass data (organizations + navigationItems)
  * API mode: Omit data (fetched from API)
  */
-interface AppSidebarProps extends React.ComponentProps<typeof Sidebar> {
+interface AppSidebarProps extends React$1.ComponentProps<typeof Sidebar> {
     user: User;
-    adapter: FrameworkAdapter;
+    /** Optional adapter - if not provided, Next.js defaults will be used */
+    adapter?: FrameworkAdapter;
     /** Sidebar data containing organizations and navigation items (props mode) */
     data?: SidebarData;
     /** Current organization ID (optional, can be extracted from pathname) */
@@ -21,7 +121,7 @@ interface AppSidebarProps extends React.ComponentProps<typeof Sidebar> {
     /** Custom API base URL (API mode only, defaults to "/api") */
     apiBaseUrl?: string;
 }
-declare function AppSidebar({ user, adapter, data, organizationId, apiBaseUrl, ...props }: AppSidebarProps): react_jsx_runtime.JSX.Element;
+declare function AppSidebar({ user, adapter: externalAdapter, data, organizationId, apiBaseUrl, ...props }: AppSidebarProps): react_jsx_runtime.JSX.Element;
 
 interface NavMainProps {
     items: NavigationItem[];
@@ -42,6 +142,38 @@ interface TeamSwitcherProps {
 }
 declare function TeamSwitcher({ teams, organizationId, adapter, }: TeamSwitcherProps): react_jsx_runtime.JSX.Element | null;
 
+interface UseNavigationOptions {
+    organizationId?: string;
+    apiBaseUrl?: string;
+    enabled?: boolean;
+}
+/**
+ * Hook to fetch navigation items and organizations from API
+ * Falls back to empty array if API is unavailable or disabled
+ *
+ * @param options - Configuration options
+ * @returns Navigation items, organizations, loading state, and error
+ */
+declare function useNavigation({ organizationId, apiBaseUrl, enabled, }?: UseNavigationOptions): {
+    items: NavigationItem[];
+    organizations: Organization[];
+    loading: boolean;
+    error: Error | null;
+};
+
+/**
+ * Icon mapper utility
+ * Maps icon name strings to Lucide React icon components
+ */
+
+/**
+ * Get icon component from icon name or component
+ *
+ * @param icon - Icon name (string) or icon component
+ * @returns Icon component or undefined
+ */
+declare function getIconComponent(icon?: string | LucideIcon): LucideIcon | undefined;
+
 /**
  * Next.js adapter for @logickernel/frame
  * Provides Next.js-specific implementations of FrameworkAdapter
@@ -55,4 +187,4 @@ declare function TeamSwitcher({ teams, organizationId, adapter, }: TeamSwitcherP
  */
 declare function createNextJSAdapter(): FrameworkAdapter;
 
-export { AppSidebar, FrameworkAdapter, NavMain, NavUser, NavigationItem, Organization, SidebarData, TeamSwitcher, User, createNextJSAdapter };
+export { AppSidebar, type FrameworkAdapter, type LinkProps, NavMain, NavUser, type NavigationConfig, type NavigationItem, type Organization, type Router, type SidebarData, SidebarProvider, TeamSwitcher, type User, createNextJSAdapter, getIconComponent, useNavigation, useSidebar };

package/dist/index.d.ts

@@ -1,19 +1,119 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-import { User, FrameworkAdapter, SidebarData, NavigationItem, Organization } from './types/index.js';
-export { LinkProps, NavigationConfig, Router } from './types/index.js';
-import { Sidebar } from '@/components/ui/sidebar';
-export { useNavigation } from './hooks/useNavigation.js';
-export { getIconComponent } from './utils/iconMapper.js';
-import 'lucide-react';
+import * as React$1 from 'react';
+import { ComponentType, ReactNode } from 'react';
+import { LucideIcon } from 'lucide-react';
+
+/**
+ * @logickernel/frame library types
+ * Shared types for navigation, user, and organization data
+ */
+
+/**
+ * Navigation item for facade components
+ * Supports both icon components (props) and icon names (API)
+ */
+interface NavigationItem {
+    title: string;
+    url?: string;
+    icon?: string | LucideIcon;
+    isActive?: boolean;
+    items?: {
+        title: string;
+        url: string;
+    }[];
+}
+/**
+ * Navigation configuration
+ */
+interface NavigationConfig {
+    items: NavigationItem[];
+    organizationId?: string;
+}
+/**
+ * Sidebar data payload for props mode
+ * Contains organizations and navigation items
+ */
+interface SidebarData {
+    organizations: Organization[];
+    navigationItems: NavigationItem[];
+}
+/**
+ * User data structure
+ */
+interface User {
+    name: string | null;
+    email: string;
+    image: string | null;
+}
+/**
+ * Organization data structure
+ */
+interface Organization {
+    id: string;
+    name: string;
+    logo?: LucideIcon | React.ComponentType<{
+        className?: string;
+    }>;
+    plan?: string;
+}
+/**
+ * Router interface for framework-agnostic navigation
+ */
+interface Router {
+    push: (path: string) => void;
+    refresh?: () => void;
+}
+/**
+ * Link component props
+ */
+interface LinkProps {
+    href: string;
+    children: ReactNode;
+    className?: string;
+}
+/**
+ * Framework adapter interface
+ * Provides router functions and components for the library
+ */
+interface FrameworkAdapter {
+    usePathname: () => string;
+    useRouter: () => Router;
+    Link: ComponentType<LinkProps>;
+    signOut?: (options?: {
+        redirect?: boolean;
+    }) => Promise<void>;
+}
+
+type SidebarContext = {
+    state: "expanded" | "collapsed";
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    openMobile: boolean;
+    setOpenMobile: (open: boolean) => void;
+    isMobile: boolean;
+    toggleSidebar: () => void;
+};
+declare const SidebarContext: React$1.Context<SidebarContext | null>;
+declare function useSidebar(): SidebarContext;
+declare const SidebarProvider: React$1.ForwardRefExoticComponent<Omit<React$1.ClassAttributes<HTMLDivElement> & React$1.HTMLAttributes<HTMLDivElement> & {
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const Sidebar: React$1.ForwardRefExoticComponent<Omit<React$1.ClassAttributes<HTMLDivElement> & React$1.HTMLAttributes<HTMLDivElement> & {
+    side?: "left" | "right";
+    variant?: "sidebar" | "floating" | "inset";
+    collapsible?: "offcanvas" | "icon" | "none";
+}, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 
 /**
  * Props mode: Pass data (organizations + navigationItems)
  * API mode: Omit data (fetched from API)
  */
-interface AppSidebarProps extends React.ComponentProps<typeof Sidebar> {
+interface AppSidebarProps extends React$1.ComponentProps<typeof Sidebar> {
     user: User;
-    adapter: FrameworkAdapter;
+    /** Optional adapter - if not provided, Next.js defaults will be used */
+    adapter?: FrameworkAdapter;
     /** Sidebar data containing organizations and navigation items (props mode) */
     data?: SidebarData;
     /** Current organization ID (optional, can be extracted from pathname) */
@@ -21,7 +121,7 @@ interface AppSidebarProps extends React.ComponentProps<typeof Sidebar> {
     /** Custom API base URL (API mode only, defaults to "/api") */
     apiBaseUrl?: string;
 }
-declare function AppSidebar({ user, adapter, data, organizationId, apiBaseUrl, ...props }: AppSidebarProps): react_jsx_runtime.JSX.Element;
+declare function AppSidebar({ user, adapter: externalAdapter, data, organizationId, apiBaseUrl, ...props }: AppSidebarProps): react_jsx_runtime.JSX.Element;
 
 interface NavMainProps {
     items: NavigationItem[];
@@ -42,6 +142,38 @@ interface TeamSwitcherProps {
 }
 declare function TeamSwitcher({ teams, organizationId, adapter, }: TeamSwitcherProps): react_jsx_runtime.JSX.Element | null;
 
+interface UseNavigationOptions {
+    organizationId?: string;
+    apiBaseUrl?: string;
+    enabled?: boolean;
+}
+/**
+ * Hook to fetch navigation items and organizations from API
+ * Falls back to empty array if API is unavailable or disabled
+ *
+ * @param options - Configuration options
+ * @returns Navigation items, organizations, loading state, and error
+ */
+declare function useNavigation({ organizationId, apiBaseUrl, enabled, }?: UseNavigationOptions): {
+    items: NavigationItem[];
+    organizations: Organization[];
+    loading: boolean;
+    error: Error | null;
+};
+
+/**
+ * Icon mapper utility
+ * Maps icon name strings to Lucide React icon components
+ */
+
+/**
+ * Get icon component from icon name or component
+ *
+ * @param icon - Icon name (string) or icon component
+ * @returns Icon component or undefined
+ */
+declare function getIconComponent(icon?: string | LucideIcon): LucideIcon | undefined;
+
 /**
  * Next.js adapter for @logickernel/frame
  * Provides Next.js-specific implementations of FrameworkAdapter
@@ -55,4 +187,4 @@ declare function TeamSwitcher({ teams, organizationId, adapter, }: TeamSwitcherP
  */
 declare function createNextJSAdapter(): FrameworkAdapter;
 
-export { AppSidebar, FrameworkAdapter, NavMain, NavUser, NavigationItem, Organization, SidebarData, TeamSwitcher, User, createNextJSAdapter };
+export { AppSidebar, type FrameworkAdapter, type LinkProps, NavMain, NavUser, type NavigationConfig, type NavigationItem, type Organization, type Router, type SidebarData, SidebarProvider, TeamSwitcher, type User, createNextJSAdapter, getIconComponent, useNavigation, useSidebar };