@vezham/react 26.0.0-alpha.4 → 26.0.0-alpha.6

package/dist/lib/components/panel/header/bookmarks/types.d.ts

@@ -0,0 +1,648 @@
+import { type ComponentPropsWithRef, type ElementType, ReactNode } from 'react';
+import type { BookmarkItem, FavoriteItem } from '../../../../store/useBookmarks/types';
+import { tvProps, tvSlots } from './variant';
+export type { BookmarkItem, FavoriteItem };
+export interface BookmarkTreeItem {
+    id: string;
+    title: string;
+    kind: 'bookmark' | 'folder';
+    color?: string;
+    visualType?: 'emoji' | 'icon';
+    emoji?: string;
+    icon?: string;
+    bookmark?: BookmarkItem;
+    children?: BookmarkTreeItem[];
+}
+export type TreeKey = string | number;
+export type TreeSelection = 'all' | Set<TreeKey>;
+export interface BookmarkFileTreeNode {
+    key: TreeKey;
+    value: BookmarkTreeItem;
+    children?: BookmarkFileTreeNode[] | null;
+}
+export interface FavoriteItemRendererProps {
+    item: FavoriteItem;
+    onItemClick?: (url: string) => void;
+}
+export interface BookmarkItemRendererProps {
+    item: BookmarkItem;
+    onItemClick?: (url: string) => void;
+}
+interface Props extends tvProps, ComponentPropsWithRef<'div'> {
+    as?: ElementType;
+    classNames?: Partial<Record<tvSlots, string>>;
+    favorites?: FavoriteItem[];
+    bookmarks?: BookmarkItem[];
+    pins?: FavoriteItem[];
+    onFavoriteClick?: (url: string, item: FavoriteItem) => void;
+    onBookmarkClick?: (url: string, item: BookmarkItem) => void;
+    onFavoritesChange?: (items: FavoriteItem[]) => void;
+    onPinsChange?: (items: FavoriteItem[]) => void;
+    onFavoritesReorder?: (newFavorites: FavoriteItem[]) => void;
+    onBookmarksReorder?: (newBookmarks: BookmarkItem[]) => void;
+    onFolderReorder?: (newBookmarks: BookmarkItem[]) => void;
+    renderFavoriteItem?: (props: FavoriteItemRendererProps) => ReactNode;
+    renderBookmarkItem?: (props: BookmarkItemRendererProps) => ReactNode;
+    renderFolderItem?: (folder: string, items: BookmarkItem[], onItemClick: (url: string) => void) => ReactNode;
+}
+declare const useProps: (originalProps: Props) => {
+    Component: ElementType;
+    domRef: import("react").Ref<HTMLDivElement> | undefined;
+    slots: {
+        search_container: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        search_input: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        search_input_wrapper: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        search_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        scroll_shadow: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        empty_container: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        empty_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        empty_title: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        empty_description: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        content_container: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        section: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        section_header: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        section_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        section_title: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorites_grid: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_item: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorites_grid2: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_item2: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_background_image: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_background_gradient: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_overlay: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_avatar_container: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_avatar: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_avatar_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_avatar_fallback: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_content: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_name: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmarks_list: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_item: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_avatar: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_avatar_fallback: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_content: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_name: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_url: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_arrow: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_delete_button: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        file_tree: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_tree_empty_state: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_section: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_accordion: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_item: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_heading: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_trigger: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_trigger_content: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_name: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_count: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_indicator: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_panel: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_body: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+    } & {
+        search_container: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        search_input: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        search_input_wrapper: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        search_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        scroll_shadow: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        empty_container: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        empty_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        empty_title: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        empty_description: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        content_container: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        section: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        section_header: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        section_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        section_title: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorites_grid: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_item: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorites_grid2: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_item2: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_background_image: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_background_gradient: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_overlay: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_avatar_container: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_avatar: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_avatar_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_avatar_fallback: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_content: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        favorite_name: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmarks_list: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_item: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_avatar: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_avatar_fallback: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_content: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_name: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_url: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_arrow: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_delete_button: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        file_tree: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        bookmark_tree_empty_state: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_section: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_accordion: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_item: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_heading: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_trigger: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_trigger_content: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_icon: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_name: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_count: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_indicator: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_panel: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+        folder_body: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+    } & {
+        base: (slotProps?: ({
+            size?: "lg" | "sm" | "md" | undefined;
+            variant?: "dark" | "light" | "default" | "glass" | undefined;
+        } & import("tailwind-variants").ClassProp<import("tailwind-variants").ClassValue>) | undefined) => string;
+    };
+    classNames: Partial<Record<"section" | "base" | "scroll_shadow" | "search_container" | "search_input" | "search_input_wrapper" | "search_icon" | "empty_container" | "empty_icon" | "empty_title" | "empty_description" | "content_container" | "section_header" | "section_icon" | "section_title" | "favorites_grid" | "favorite_item" | "favorites_grid2" | "favorite_item2" | "favorite_background_image" | "favorite_background_gradient" | "favorite_overlay" | "favorite_avatar_container" | "favorite_avatar" | "favorite_avatar_icon" | "favorite_avatar_fallback" | "favorite_content" | "favorite_name" | "bookmarks_list" | "bookmark_item" | "bookmark_avatar" | "bookmark_avatar_fallback" | "bookmark_content" | "bookmark_name" | "bookmark_url" | "bookmark_arrow" | "bookmark_delete_button" | "file_tree" | "bookmark_tree_empty_state" | "folder_section" | "folder_accordion" | "folder_item" | "folder_heading" | "folder_trigger" | "folder_trigger_content" | "folder_icon" | "folder_name" | "folder_count" | "folder_indicator" | "folder_panel" | "folder_body", string>> | undefined;
+    children: ReactNode;
+    getSearchContainerProps: () => {
+        className: string;
+    };
+    getSearchInputProps: () => {
+        className: string;
+        placeholder: "Search ...";
+        classNames: {
+            inputWrapper: string;
+        };
+    };
+    getScrollShadowProps: () => {
+        className: string;
+        hideScrollBar: boolean;
+    };
+    getEmptyContainerProps: () => {
+        className: string;
+    };
+    getEmptyIconProps: () => {
+        icon: "vx:star";
+        width: number;
+        className: string;
+    };
+    getEmptyTitleProps: () => {
+        className: string;
+        children: "No items yet";
+    };
+    getEmptyDescriptionProps: () => {
+        className: string;
+        children: "Add items to favorites or bookmarks to quickly access them later.";
+    };
+    getContentContainerProps: () => {
+        className: string;
+    };
+    getSectionProps: () => {
+        className: string;
+    };
+    getSectionHeaderProps: () => {
+        className: string;
+    };
+    getSectionIconProps: (className?: string) => {
+        size: number;
+        className: import("tailwind-variants").CnReturn;
+    };
+    getSectionTitleProps: (title: string) => {
+        className: string;
+        children: string;
+    };
+    getFavoritesGridProps: () => {
+        className: string;
+    };
+    getFavoriteItemProps: () => {
+        className: string;
+    };
+    getFavorites2GridProps: () => {
+        className: string;
+    };
+    getFavorite2ItemsProps: () => {
+        className: string;
+    };
+    getFavoriteBackgroundImageProps: (src: string, alt: string) => {
+        src: string;
+        'aria-label': string;
+        className: string;
+    };
+    getFavoriteBackgroundGradientProps: () => {
+        className: string;
+    };
+    getFavoriteOverlayProps: () => {
+        className: string;
+    };
+    getFavoriteAvatarContainerProps: () => {
+        className: string;
+    };
+    getFavoriteAvatarProps: () => {
+        size: "sm";
+        className: string;
+    };
+    getFavoriteAvatarIconProps: () => {
+        icon: "vx:star-filled";
+        width: number;
+        className: string;
+    };
+    getFavoriteAvatarFallbackProps: (name: string) => {
+        className: string;
+        children: string;
+    };
+    getFavoriteContentProps: () => {
+        className: string;
+    };
+    getFavoriteNameProps: (name: string) => {
+        className: string;
+        children: string;
+    };
+    getBookmarksListProps: () => {
+        className: string;
+    };
+    getBookmarkItemProps: () => {
+        className: string;
+    };
+    getBookmarkAvatarProps: () => {
+        size: "sm";
+        className: string;
+    };
+    getBookmarkAvatarFallbackProps: (name: string) => {
+        className: string;
+        children: string;
+    };
+    getBookmarkContentProps: () => {
+        className: string;
+    };
+    getBookmarkNameProps: (name: string) => {
+        className: string;
+        children: string;
+    };
+    getBookmarkUrlProps: (url: string) => {
+        className: string;
+        children: string;
+    };
+    getBookmarkArrowProps: () => {
+        icon: "vx:external-link";
+        width: number;
+        className: string;
+    };
+    getBookmarkDeleteButtonProps: () => {
+        className: string;
+    };
+    getFileTreeProps: () => {
+        className: string;
+    };
+    getBookmarkTreeEmptyStateProps: () => {
+        className: string;
+    };
+    getFolderAccordionProps: () => {
+        variant: "light";
+        selectionMode: "multiple";
+        className: string;
+    };
+    getFolderItemProps: () => {
+        className: string;
+    };
+    getFolderHeadingProps: () => {
+        className: string;
+    };
+    getFolderTriggerProps: () => {
+        className: string;
+    };
+    getFolderTriggerContentProps: () => {
+        className: string;
+    };
+    getFolderIconProps: () => {
+        icon: "vx:folder-filled";
+        width: number;
+        className: string;
+    };
+    getFolderNameProps: (name: string) => {
+        className: string;
+        children: string;
+    };
+    getFolderCountProps: (count: number) => {
+        className: string;
+        children: string;
+    };
+    getFolderIndicatorProps: () => {
+        className: string;
+    };
+    getFolderPanelProps: () => {
+        className: string;
+    };
+    getFolderBodyProps: () => {
+        className: string;
+    };
+    externalFavorites: FavoriteItem[] | undefined;
+    externalBookmarks: BookmarkItem[] | undefined;
+    externalPins: FavoriteItem[] | undefined;
+    onFavoriteClick: ((url: string, item: FavoriteItem) => void) | undefined;
+    onBookmarkClick: ((url: string, item: BookmarkItem) => void) | undefined;
+    onFavoritesChange: ((items: FavoriteItem[]) => void) | undefined;
+    onPinsChange: ((items: FavoriteItem[]) => void) | undefined;
+    onFavoritesReorder: ((newFavorites: FavoriteItem[]) => void) | undefined;
+    onBookmarksReorder: ((newBookmarks: BookmarkItem[]) => void) | undefined;
+    onFolderReorder: ((newBookmarks: BookmarkItem[]) => void) | undefined;
+    renderFavoriteItem: ((props: FavoriteItemRendererProps) => ReactNode) | undefined;
+    renderBookmarkItem: ((props: BookmarkItemRendererProps) => ReactNode) | undefined;
+    renderFolderItem: ((folder: string, items: BookmarkItem[], onItemClick: (url: string) => void) => ReactNode) | undefined;
+};
+export { useProps };
+export type { Props };
+//# sourceMappingURL=types.d.ts.map