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

package/dist/lib/components/panel/header/index.js

@@ -0,0 +1,366 @@
+import { useAppMenu } from "../../app-menu/index.js";
+import { AppIcon } from "../../app-icon/index.js";
+import { useCommand } from "../../command/index.js";
+import "../responsive.js";
+import { useInfoPanel } from "../info-panel/provider.js";
+import { ShortcutKey, ShortcutTooltipLabel } from "../../shortcut-key/index.js";
+import { ApplicationMenuSheet } from "./application-menu-sheet.js";
+import { BookmarksTrigger } from "./bookmarks/index.js";
+import { StorageTrigger } from "./storage/index.js";
+import { useCallback, useState } from "react";
+import { Avatar, Button, Dropdown, Label, Separator, Surface, Tooltip, useMediaQuery } from "@vezham/react-v3";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { AltArrowDown, Archive, Bookmark, Magnifier, SidebarMinimalistic } from "@vezham/icons-react";
+//#region src/lib/components/panel/header/index.tsx
+var Header = ({ users, showSearch = false, showBookamarks = false, showStorage = false, onAvatarClick, onSearchClick, isDockHidden = false, onToggleDock, isSidebarOpen = false, onToggleSidebar, extraActions, className, compact = false, hideSeparator = false, showMenuUtilities = true }) => {
+	const [open, setOpen] = useState(false);
+	const { openCommand } = useCommand();
+	const showHistoryNavigation = useMediaQuery("(max-width: 1023px)", { initializeWithValue: false });
+	const onToggleNavigation = onToggleSidebar ?? onToggleDock;
+	const navigationLabel = onToggleSidebar ? isSidebarOpen ? "Hide Sidebar" : "Show Sidebar" : isDockHidden ? "Show Dock" : "Hide Dock";
+	const handleSearch = useCallback(() => {
+		onSearchClick?.();
+		openCommand();
+	}, [onSearchClick, openCommand]);
+	const handleMenuSearch = useCallback(() => {
+		handleSearch();
+		setOpen(false);
+	}, [handleSearch]);
+	if (compact) return /* @__PURE__ */ jsxs(Surface, {
+		variant: "transparent",
+		className: `flex items-center ${className ?? ""}`,
+		"data-vx": "header",
+		children: [/* @__PURE__ */ jsxs("div", {
+			role: "group",
+			"aria-label": "Application controls",
+			"data-hovered": open || void 0,
+			className: "button button--ghost flex h-8 items-center gap-0 px-1 transition-transform duration-300",
+			children: [/* @__PURE__ */ jsx("button", {
+				type: "button",
+				"aria-label": "Application",
+				className: "flex h-full items-center bg-transparent p-0",
+				onClick: () => {
+					onAvatarClick?.(users);
+					setOpen(true);
+				},
+				children: /* @__PURE__ */ jsx(HeaderAvatar, { user: users })
+			}), /* @__PURE__ */ jsx(HeaderApplicationMenu, {
+				isOpen: open,
+				onOpenChange: setOpen,
+				onClose: () => setOpen(false),
+				onSearch: handleMenuSearch,
+				navigationLabel,
+				onToggleNavigation,
+				showHistoryNavigation,
+				showMenuUtilities,
+				showBookamarks,
+				showStorage,
+				children: /* @__PURE__ */ jsxs(Button, {
+					variant: "ghost",
+					isIconOnly: true,
+					"aria-label": "Open application menu",
+					size: "sm",
+					className: "h-6 w-6 min-w-0 p-0",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "sr-only",
+						children: "Application menu"
+					}), /* @__PURE__ */ jsx(AltArrowDown, {
+						size: 8,
+						className: "text-muted-foreground",
+						"aria-hidden": "true"
+					})]
+				})
+			})]
+		}), onToggleNavigation && /* @__PURE__ */ jsxs(Tooltip, {
+			delay: 0,
+			children: [/* @__PURE__ */ jsx(Tooltip.Trigger, { children: /* @__PURE__ */ jsx(Button, {
+				"aria-label": navigationLabel,
+				"aria-keyshortcuts": "Meta+S",
+				isIconOnly: true,
+				size: "sm",
+				variant: "ghost",
+				className: "text-muted hover:text-foreground",
+				onPress: onToggleNavigation,
+				children: /* @__PURE__ */ jsx(SidebarMinimalistic, {
+					size: 16,
+					className: "size-4",
+					"aria-hidden": "true"
+				})
+			}) }), /* @__PURE__ */ jsx(Tooltip.Content, {
+				placement: "right",
+				children: /* @__PURE__ */ jsx(ShortcutTooltipLabel, {
+					label: navigationLabel,
+					shortcut: "⌘ S"
+				})
+			})]
+		})]
+	});
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(Surface, {
+		variant: "transparent",
+		className: `flex flex-row items-center gap-1 md:flex-col md:gap-3 ${className ?? ""}`,
+		"data-vx": "header",
+		children: [
+			/* @__PURE__ */ jsx(HeaderApplicationMenu, {
+				isOpen: open,
+				onOpenChange: setOpen,
+				onClose: () => setOpen(false),
+				onSearch: handleMenuSearch,
+				navigationLabel,
+				onToggleNavigation,
+				showHistoryNavigation,
+				showMenuUtilities,
+				showBookamarks: false,
+				showStorage: false,
+				children: /* @__PURE__ */ jsxs(Button, {
+					variant: "ghost",
+					className: "flex h-10 items-center gap-2 px-2 transition-transform duration-300",
+					"aria-label": "Open application menu",
+					onPress: () => onAvatarClick?.(users),
+					children: [
+						/* @__PURE__ */ jsx(HeaderAvatar, { user: users }),
+						/* @__PURE__ */ jsx("span", {
+							className: "sr-only",
+							children: "Application menu"
+						}),
+						/* @__PURE__ */ jsx(AltArrowDown, {
+							size: 8,
+							className: "text-muted-foreground",
+							"aria-hidden": "true"
+						})
+					]
+				})
+			}),
+			showSearch && /* @__PURE__ */ jsxs(Tooltip, {
+				delay: 0,
+				children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
+					className: "size-5 leading-none",
+					children: /* @__PURE__ */ jsx("button", {
+						type: "button",
+						"aria-label": "Open command palette",
+						className: "inline-flex size-5 items-center justify-center bg-transparent p-0",
+						onClick: handleSearch,
+						children: /* @__PURE__ */ jsx(Magnifier, {
+							className: "text-muted cursor-pointer",
+							size: 20,
+							"aria-hidden": "true"
+						})
+					})
+				}), /* @__PURE__ */ jsx(Tooltip.Content, {
+					placement: "right",
+					children: /* @__PURE__ */ jsx(ShortcutTooltipLabel, {
+						label: "Search",
+						shortcut: "Mod K"
+					})
+				})]
+			}),
+			showBookamarks && /* @__PURE__ */ jsx(BookmarksTrigger, {}),
+			showStorage && /* @__PURE__ */ jsx(StorageTrigger, {}),
+			extraActions
+		]
+	}), !hideSeparator && /* @__PURE__ */ jsx(Separator, { className: "hidden md:block" })] });
+};
+var HeaderAvatar = ({ user }) => /* @__PURE__ */ jsxs(Avatar, {
+	className: "h-5 w-5",
+	children: [user.avatar && /* @__PURE__ */ jsx(Avatar.Image, {
+		src: user.avatar,
+		alt: user.name
+	}), /* @__PURE__ */ jsx(Avatar.Fallback, { children: user.name?.[0]?.toUpperCase() })]
+});
+var HeaderApplicationMenu = ({ children, isOpen, onOpenChange, ...props }) => {
+	if (useMediaQuery("(width < 640px)", { initializeWithValue: false })) return /* @__PURE__ */ jsx(ApplicationMenuSheet, {
+		...props,
+		isOpen,
+		onOpenChange,
+		trigger: children
+	});
+	return /* @__PURE__ */ jsxs(Dropdown, {
+		isOpen,
+		onOpenChange,
+		children: [children, /* @__PURE__ */ jsx(HeaderApplicationMenuContent, { ...props })]
+	});
+};
+var HeaderApplicationMenuContent = ({ onClose, onSearch, navigationLabel, onToggleNavigation, showHistoryNavigation, showMenuUtilities, showBookamarks, showStorage }) => {
+	const appMenu = useAppMenu();
+	return /* @__PURE__ */ jsx(Dropdown.Popover, { children: /* @__PURE__ */ jsxs(Dropdown.Menu, {
+		"aria-label": "Application menu",
+		children: [
+			/* @__PURE__ */ jsx(Dropdown.Item, {
+				id: "home",
+				textValue: "Back to home",
+				onPress: onClose,
+				children: /* @__PURE__ */ jsx(Label, { children: "Back to home" })
+			}),
+			showHistoryNavigation && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(Dropdown.Item, {
+				id: "back",
+				textValue: "Back",
+				"aria-keyshortcuts": "Meta+ArrowLeft",
+				onPress: () => {
+					onClose();
+					window.history.back();
+				},
+				children: [
+					/* @__PURE__ */ jsx(AppIcon, {
+						icon: "vx:arrow-left",
+						size: 18,
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ jsx(Label, { children: "Back" }),
+					/* @__PURE__ */ jsx(ShortcutKey, {
+						className: "ms-auto",
+						shortcut: "⌘ ←"
+					})
+				]
+			}), /* @__PURE__ */ jsxs(Dropdown.Item, {
+				id: "forward",
+				textValue: "Forward",
+				"aria-keyshortcuts": "Meta+ArrowRight",
+				onPress: () => {
+					onClose();
+					window.history.forward();
+				},
+				children: [
+					/* @__PURE__ */ jsx(AppIcon, {
+						icon: "vx:arrow-right",
+						size: 18,
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ jsx(Label, { children: "Forward" }),
+					/* @__PURE__ */ jsx(ShortcutKey, {
+						className: "ms-auto",
+						shortcut: "⌘ →"
+					})
+				]
+			})] }),
+			!showMenuUtilities && /* @__PURE__ */ jsx(Separator, {}),
+			showMenuUtilities && onToggleNavigation && /* @__PURE__ */ jsxs(Dropdown.Item, {
+				id: "toggle-navigation",
+				textValue: navigationLabel,
+				"aria-keyshortcuts": "Meta+S",
+				onPress: () => {
+					onClose();
+					onToggleNavigation();
+				},
+				children: [
+					/* @__PURE__ */ jsx(SidebarMinimalistic, {
+						size: 18,
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ jsx(Label, { children: navigationLabel }),
+					/* @__PURE__ */ jsx(ShortcutKey, {
+						className: "ms-auto",
+						shortcut: "⌘ S"
+					})
+				]
+			}),
+			showMenuUtilities && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Separator, {}), /* @__PURE__ */ jsxs(Dropdown.Item, {
+				id: "search",
+				textValue: "Search",
+				"aria-label": "Open command palette",
+				onPress: onSearch,
+				children: [
+					/* @__PURE__ */ jsx(AppIcon, {
+						icon: "vx:search",
+						size: 18,
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ jsx(Label, { children: "Search" }),
+					/* @__PURE__ */ jsx(ShortcutKey, {
+						className: "ms-auto",
+						shortcut: "Mod K"
+					})
+				]
+			})] }),
+			(showBookamarks || showStorage) && /* @__PURE__ */ jsx(HeaderPanelMenuItems, {
+				showBookamarks,
+				showStorage,
+				onClose
+			}),
+			(showMenuUtilities || showBookamarks || showStorage) && /* @__PURE__ */ jsx(Separator, {}),
+			appMenu?.items.map((menu) => /* @__PURE__ */ jsxs(Dropdown.SubmenuTrigger, { children: [/* @__PURE__ */ jsxs(Dropdown.Item, {
+				id: menu.key,
+				textValue: menu.label,
+				children: [
+					menu.icon && /* @__PURE__ */ jsx(AppIcon, {
+						icon: menu.icon,
+						size: 18,
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ jsx(Label, { children: menu.label }),
+					/* @__PURE__ */ jsx(Dropdown.SubmenuIndicator, {})
+				]
+			}), /* @__PURE__ */ jsx(Dropdown.Popover, {
+				placement: "right top",
+				children: /* @__PURE__ */ jsx(Dropdown.Menu, {
+					"aria-label": menu.label,
+					children: menu.groups.flatMap((group, index) => [...index ? [/* @__PURE__ */ jsx(Separator, {}, `${menu.key}-separator-${index}`)] : [], ...group.map((action) => /* @__PURE__ */ jsxs(Dropdown.Item, {
+						id: action.key,
+						textValue: action.label,
+						onPress: () => {
+							onClose();
+							appMenu.onAction(action);
+						},
+						children: [
+							action.icon && /* @__PURE__ */ jsx(AppIcon, {
+								icon: action.icon,
+								size: 18,
+								"aria-hidden": "true"
+							}),
+							/* @__PURE__ */ jsx(Label, { children: action.label }),
+							action.shortcut && /* @__PURE__ */ jsx(ShortcutKey, {
+								className: "ms-auto",
+								shortcut: action.shortcut
+							})
+						]
+					}, action.key))])
+				})
+			})] }, menu.key))
+		]
+	}) });
+};
+var HeaderPanelMenuItems = ({ showBookamarks, showStorage, onClose }) => {
+	const { toggleInfoPanel, activeInfoPanel, isOpen } = useInfoPanel();
+	return /* @__PURE__ */ jsxs(Fragment, { children: [showBookamarks && /* @__PURE__ */ jsxs(Dropdown.Item, {
+		id: "bookmarks",
+		textValue: "Bookmarks",
+		"aria-label": "Bookmarks",
+		"aria-keyshortcuts": "Meta+Shift+B Control+Shift+B",
+		onPress: () => {
+			onClose();
+			toggleInfoPanel("bookmarks");
+		},
+		children: [
+			/* @__PURE__ */ jsx(Bookmark, {
+				size: 18,
+				weight: isOpen && activeInfoPanel === "bookmarks" ? "filled" : "outline",
+				"aria-hidden": "true"
+			}),
+			/* @__PURE__ */ jsx(Label, { children: "Bookmarks" }),
+			/* @__PURE__ */ jsx(ShortcutKey, {
+				className: "ms-auto",
+				shortcut: "Mod ⇧ B"
+			})
+		]
+	}), showStorage && /* @__PURE__ */ jsxs(Dropdown.Item, {
+		id: "storage",
+		textValue: "Storage",
+		"aria-label": "Storage",
+		"aria-keyshortcuts": "Meta+Shift+S Control+Shift+S",
+		onPress: () => {
+			onClose();
+			toggleInfoPanel("storage");
+		},
+		children: [
+			/* @__PURE__ */ jsx(Archive, {
+				size: 18,
+				"aria-hidden": "true"
+			}),
+			/* @__PURE__ */ jsx(Label, { children: "Storage" }),
+			/* @__PURE__ */ jsx(ShortcutKey, {
+				className: "ms-auto",
+				shortcut: "Mod ⇧ S"
+			})
+		]
+	})] });
+};
+//#endregion
+export { Header };

package/dist/lib/components/panel/header/storage/archive/index.d.ts

@@ -0,0 +1,4 @@
+import { ArchiveProps } from './types';
+declare const Archive: (props: ArchiveProps) => import("react").JSX.Element;
+export { Archive };
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/components/panel/header/storage/archive/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/components/panel/header/storage/archive/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAKtC,QAAA,MAAM,OAAO,GAAI,OAAO,YAAY,gCA2MnC,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}

package/dist/lib/components/panel/header/storage/archive/index.js

@@ -0,0 +1,138 @@
+import { getAppPath, getOpenUrl } from "../../../../../utils/url.js";
+import { StorageHistoryActions } from "../history-actions.js";
+import { filterHistoryItems, groupHistoryItemsByDate } from "../history-utils.js";
+import { StorageHistoryDateGroup } from "../history-date-group.js";
+import { StorageHistoryItemContent } from "../history-item-content.js";
+import { StorageHistoryShell } from "../history-shell.js";
+import { archiveActions } from "./variants.js";
+import { useNavigate } from "@tanstack/react-router";
+import { Button, Input } from "@vezham/react-v3";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Archive, ArchiveUp, TrashBinTrash } from "@vezham/icons-react";
+import { EmptyState } from "@vezham/react-pro-v3/empty-state";
+//#region src/lib/components/panel/header/storage/archive/index.tsx
+var SearchInput = Input;
+var Archive$1 = (props) => {
+	const navigate = useNavigate();
+	const { archiveItems, archiveSearch, setArchiveSearch, setInternalArchiveItems, getSearchInputProps, getActionsBarProps, getClearAllButtonProps, getContainerProps, getEmptyContainerProps, getEmptyIconProps, getItemsContainerProps, getDateGroupProps, getDateHeaderProps, getDateLabelProps, getDateDividerProps, getItemsListProps, getItemProps, getItemFaviconProps, getItemFallbackIconProps, getItemContentProps, getItemTitleProps, getItemUrlProps, getItemActionsProps, getUnarchiveButtonProps, getDeleteButtonProps, getActionIconProps, onUnarchive, onDeleteFromArchive, onClearAllArchive, onItemClick, renderArchiveItem } = props;
+	const filteredArchiveItems = filterHistoryItems(archiveItems, archiveSearch);
+	const archiveByDate = groupHistoryItemsByDate(filteredArchiveItems, (item) => item.archivedDate);
+	const handleUnarchive = (id) => {
+		if (onUnarchive) onUnarchive(id);
+		else setInternalArchiveItems((prev) => prev.filter((item) => item.id !== id));
+	};
+	const handleDeleteFromArchive = (id) => {
+		if (onDeleteFromArchive) onDeleteFromArchive(id);
+		else setInternalArchiveItems((prev) => prev.filter((item) => item.id !== id));
+	};
+	const handleClearAllArchive = () => {
+		if (onClearAllArchive) onClearAllArchive();
+		else setInternalArchiveItems([]);
+	};
+	const handleItemClick = (url) => {
+		if (onItemClick) onItemClick(url);
+		else if (url && url !== "#") {
+			const appPath = getAppPath(url, window.location.origin);
+			if (appPath) navigate({ to: appPath });
+			else window.open(getOpenUrl(url), "_blank", "noopener,noreferrer");
+		}
+	};
+	const hasArchiveItems = filteredArchiveItems.length > 0;
+	const renderArchiveContent = () => {
+		if (!hasArchiveItems) return /* @__PURE__ */ jsx("div", {
+			...getEmptyContainerProps(),
+			children: /* @__PURE__ */ jsxs(EmptyState, {
+				className: "rounded-2xl",
+				children: [/* @__PURE__ */ jsx(EmptyState.Media, { children: /* @__PURE__ */ jsx(Archive, {
+					...getEmptyIconProps(),
+					weight: "outline",
+					"aria-hidden": "true"
+				}) }), /* @__PURE__ */ jsx(EmptyState.Title, { children: "Archive is Empty" })]
+			})
+		});
+		return /* @__PURE__ */ jsx("div", {
+			...getItemsContainerProps(),
+			children: Object.entries(archiveByDate).map(([date, items]) => /* @__PURE__ */ jsx(StorageHistoryDateGroup, {
+				date,
+				getDateGroupProps,
+				getDateHeaderProps,
+				getDateLabelProps,
+				getDateDividerProps,
+				getItemsListProps,
+				children: items.map((item) => {
+					if (renderArchiveItem) return renderArchiveItem({
+						item,
+						onAction: (action) => {
+							if (action === "unarchive") handleUnarchive(item.id);
+							if (action === "delete") handleDeleteFromArchive(item.id);
+						}
+					});
+					return /* @__PURE__ */ jsxs("div", {
+						...getItemProps(),
+						children: [/* @__PURE__ */ jsx("button", {
+							type: "button",
+							className: "flex min-w-0 flex-1 items-center gap-3 text-left",
+							onClick: () => handleItemClick(item.url),
+							children: /* @__PURE__ */ jsx(StorageHistoryItemContent, {
+								item,
+								getItemFaviconProps,
+								getItemFallbackIconProps,
+								getItemContentProps,
+								getItemTitleProps,
+								getItemUrlProps
+							})
+						}), /* @__PURE__ */ jsxs("div", {
+							...getItemActionsProps(),
+							children: [/* @__PURE__ */ jsx(Button, {
+								isIconOnly: true,
+								variant: "ghost",
+								...getUnarchiveButtonProps(),
+								onPress: () => {
+									handleUnarchive(item.id);
+								},
+								children: /* @__PURE__ */ jsx(ArchiveUp, {
+									...getActionIconProps("default"),
+									weight: "outline",
+									"aria-hidden": "true"
+								})
+							}), /* @__PURE__ */ jsx(Button, {
+								isIconOnly: true,
+								variant: "ghost",
+								...getDeleteButtonProps(),
+								onPress: () => {
+									handleDeleteFromArchive(item.id);
+								},
+								children: /* @__PURE__ */ jsx(TrashBinTrash, {
+									...getActionIconProps("danger"),
+									weight: "outline",
+									"aria-hidden": "true"
+								})
+							})]
+						})]
+					}, item.id);
+				})
+			}, date))
+		});
+	};
+	const actions = archiveActions.map((action) => ({
+		...action,
+		props: getClearAllButtonProps(),
+		onPress: handleClearAllArchive
+	}));
+	return /* @__PURE__ */ jsx(StorageHistoryShell, {
+		containerProps: getContainerProps(),
+		search: /* @__PURE__ */ jsx(SearchInput, {
+			...getSearchInputProps(true),
+			value: archiveSearch,
+			onChange: (e) => setArchiveSearch(e.target.value)
+		}),
+		actions: /* @__PURE__ */ jsx(StorageHistoryActions, {
+			visible: hasArchiveItems,
+			actions,
+			barProps: getActionsBarProps(false)
+		}),
+		children: renderArchiveContent()
+	});
+};
+//#endregion
+export { Archive$1 as Archive };

package/dist/lib/components/panel/header/storage/archive/types.d.ts

@@ -0,0 +1,27 @@
+import { Dispatch, ReactNode, SetStateAction } from 'react';
+import type { useProps } from '../types';
+export interface ArchiveItem {
+    id: string;
+    title: string;
+    url: string;
+    archivedDate: string;
+    favicon?: string;
+}
+export interface ArchiveItemRendererProps {
+    item: ArchiveItem;
+    onAction?: (action: string, item: ArchiveItem) => void;
+}
+type StorageProps = ReturnType<typeof useProps>;
+export interface ArchiveProps extends Pick<StorageProps, 'getSearchInputProps' | 'getActionsBarProps' | 'getClearAllButtonProps' | 'getContainerProps' | 'getEmptyContainerProps' | 'getEmptyIconProps' | 'getEmptyTitleProps' | 'getEmptyDescriptionProps' | 'getItemsContainerProps' | 'getDateGroupProps' | 'getDateHeaderProps' | 'getDateLabelProps' | 'getDateDividerProps' | 'getItemsListProps' | 'getItemProps' | 'getItemFaviconProps' | 'getItemFallbackIconProps' | 'getItemContentProps' | 'getItemTitleProps' | 'getItemUrlProps' | 'getItemActionsProps' | 'getUnarchiveButtonProps' | 'getDeleteButtonProps' | 'getActionIconProps'> {
+    archiveItems: ArchiveItem[];
+    archiveSearch: string;
+    setArchiveSearch: Dispatch<SetStateAction<string>>;
+    setInternalArchiveItems: Dispatch<SetStateAction<ArchiveItem[]>>;
+    onUnarchive?: (id: string) => void;
+    onDeleteFromArchive?: (id: string) => void;
+    onClearAllArchive?: () => void;
+    onItemClick?: (url: string) => void;
+    renderArchiveItem?: (props: ArchiveItemRendererProps) => ReactNode;
+}
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/lib/components/panel/header/storage/archive/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/components/panel/header/storage/archive/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAExC,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,MAAM,CAAA;IACX,YAAY,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,WAAW,CAAA;IACjB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,IAAI,CAAA;CACvD;AAED,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAA;AAE/C,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,YAAY,EACV,qBAAqB,GACrB,oBAAoB,GACpB,wBAAwB,GACxB,mBAAmB,GACnB,wBAAwB,GACxB,mBAAmB,GACnB,oBAAoB,GACpB,0BAA0B,GAC1B,wBAAwB,GACxB,mBAAmB,GACnB,oBAAoB,GACpB,mBAAmB,GACnB,qBAAqB,GACrB,mBAAmB,GACnB,cAAc,GACd,qBAAqB,GACrB,0BAA0B,GAC1B,qBAAqB,GACrB,mBAAmB,GACnB,iBAAiB,GACjB,qBAAqB,GACrB,yBAAyB,GACzB,sBAAsB,GACtB,oBAAoB,CACvB;IACC,YAAY,EAAE,WAAW,EAAE,CAAA;IAC3B,aAAa,EAAE,MAAM,CAAA;IACrB,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAA;IAClD,uBAAuB,EAAE,QAAQ,CAAC,cAAc,CAAC,WAAW,EAAE,CAAC,CAAC,CAAA;IAChE,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,mBAAmB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,SAAS,CAAA;CACnE"}

package/dist/lib/components/panel/header/storage/archive/variants.d.ts

@@ -0,0 +1,6 @@
+export declare const archiveActions: {
+    type: string;
+    icon: string;
+    label: string;
+}[];
+//# sourceMappingURL=variants.d.ts.map

package/dist/lib/components/panel/header/storage/archive/variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/components/panel/header/storage/archive/variants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc;;;;GAM1B,CAAA"}

package/dist/lib/components/panel/header/storage/archive/variants.js

@@ -0,0 +1,8 @@
+//#region src/lib/components/panel/header/storage/archive/variants.ts
+var archiveActions = [{
+	type: "clear",
+	icon: "vx:trash",
+	label: "Clear All"
+}];
+//#endregion
+export { archiveActions };

package/dist/lib/components/panel/header/storage/data.d.ts

@@ -0,0 +1,2 @@
+export * from '../../../../store/useStorage/data';
+//# sourceMappingURL=data.d.ts.map

package/dist/lib/components/panel/header/storage/data.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/components/panel/header/storage/data.ts"],"names":[],"mappings":"AAAA,cAAc,mCAAmC,CAAA"}

package/dist/lib/components/panel/header/storage/history-actions.d.ts

@@ -0,0 +1,16 @@
+import type { ComponentProps } from 'react';
+import { Button } from '@vezham/react-v3';
+type Action = {
+    type: string;
+    icon: string;
+    label: string;
+    props: ComponentProps<typeof Button>;
+    onPress: () => void;
+};
+export declare const StorageHistoryActions: ({ visible, actions, barProps }: {
+    visible: boolean;
+    actions: readonly Action[];
+    barProps: ComponentProps<"div">;
+}) => import("react").JSX.Element | null;
+export {};
+//# sourceMappingURL=history-actions.d.ts.map

package/dist/lib/components/panel/header/storage/history-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"history-actions.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/components/panel/header/storage/history-actions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AAIzC,KAAK,MAAM,GAAG;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,cAAc,CAAC,OAAO,MAAM,CAAC,CAAA;IACpC,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,qBAAqB,GAAI,gCAInC;IACD,OAAO,EAAE,OAAO,CAAA;IAChB,OAAO,EAAE,SAAS,MAAM,EAAE,CAAA;IAC1B,QAAQ,EAAE,cAAc,CAAC,KAAK,CAAC,CAAA;CAChC,uCAUS,CAAA"}

package/dist/lib/components/panel/header/storage/history-actions.js

@@ -0,0 +1,18 @@
+import { AppIcon } from "../../../app-icon/index.js";
+import { Button } from "@vezham/react-v3";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/lib/components/panel/header/storage/history-actions.tsx
+var StorageHistoryActions = ({ visible, actions, barProps }) => visible && actions.length > 0 ? /* @__PURE__ */ jsx("div", {
+	...barProps,
+	children: actions.map((action) => /* @__PURE__ */ jsxs(Button, {
+		...action.props,
+		onPress: action.onPress,
+		children: [/* @__PURE__ */ jsx(AppIcon, {
+			icon: action.icon,
+			size: 16,
+			"aria-hidden": "true"
+		}), action.label]
+	}, action.type))
+}) : null;
+//#endregion
+export { StorageHistoryActions };

package/dist/lib/components/panel/header/storage/history-date-group.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from 'react';
+import type { useProps } from './types';
+type Props = Pick<ReturnType<typeof useProps>, 'getDateGroupProps' | 'getDateHeaderProps' | 'getDateLabelProps' | 'getDateDividerProps' | 'getItemsListProps'> & {
+    date: string;
+    children: ReactNode;
+};
+export declare const StorageHistoryDateGroup: ({ date, children, getDateGroupProps, getDateHeaderProps, getDateLabelProps, getDateDividerProps, getItemsListProps }: Props) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=history-date-group.d.ts.map

package/dist/lib/components/panel/header/storage/history-date-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"history-date-group.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/components/panel/header/storage/history-date-group.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,KAAK,KAAK,GAAG,IAAI,CACf,UAAU,CAAC,OAAO,QAAQ,CAAC,EACzB,mBAAmB,GACnB,oBAAoB,GACpB,mBAAmB,GACnB,qBAAqB,GACrB,mBAAmB,CACtB,GAAG;IACF,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,SAAS,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,uBAAuB,GAAI,sHAQrC,KAAK,gCAUP,CAAA"}

package/dist/lib/components/panel/header/storage/history-date-group.js

@@ -0,0 +1,19 @@
+import { formatHistoryDate } from "./history-utils.js";
+import { Typography } from "@vezham/react-v3";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/lib/components/panel/header/storage/history-date-group.tsx
+var StorageHistoryDateGroup = ({ date, children, getDateGroupProps, getDateHeaderProps, getDateLabelProps, getDateDividerProps, getItemsListProps }) => /* @__PURE__ */ jsxs("div", {
+	...getDateGroupProps(),
+	children: [/* @__PURE__ */ jsxs("div", {
+		...getDateHeaderProps(),
+		children: [/* @__PURE__ */ jsx(Typography.Paragraph, {
+			...getDateLabelProps(),
+			children: formatHistoryDate(date)
+		}), /* @__PURE__ */ jsx("div", { ...getDateDividerProps() })]
+	}), /* @__PURE__ */ jsx("div", {
+		...getItemsListProps(),
+		children
+	})]
+});
+//#endregion
+export { StorageHistoryDateGroup };

package/dist/lib/components/panel/header/storage/history-item-content.d.ts

@@ -0,0 +1,11 @@
+import type { useProps } from './types';
+type Props = Pick<ReturnType<typeof useProps>, 'getItemFaviconProps' | 'getItemFallbackIconProps' | 'getItemContentProps' | 'getItemTitleProps' | 'getItemUrlProps'> & {
+    item: {
+        favicon?: string;
+        title: string;
+        url: string;
+    };
+};
+export declare const StorageHistoryItemContent: ({ item, getItemFaviconProps, getItemFallbackIconProps, getItemContentProps, getItemTitleProps, getItemUrlProps }: Props) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=history-item-content.d.ts.map

package/dist/lib/components/panel/header/storage/history-item-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"history-item-content.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/components/panel/header/storage/history-item-content.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,KAAK,KAAK,GAAG,IAAI,CACf,UAAU,CAAC,OAAO,QAAQ,CAAC,EACzB,qBAAqB,GACrB,0BAA0B,GAC1B,qBAAqB,GACrB,mBAAmB,GACnB,iBAAiB,CACpB,GAAG;IACF,IAAI,EAAE;QAAE,OAAO,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAA;CACvD,CAAA;AAED,eAAO,MAAM,yBAAyB,GAAI,kHAOvC,KAAK,gCAgBP,CAAA"}