@floegence/floe-webapp-core 0.1.5 → 0.1.7

package/dist/components/file-browser/Breadcrumb.d.ts

@@ -0,0 +1,7 @@
+export interface BreadcrumbProps {
+    class?: string;
+}
+/**
+ * Breadcrumb navigation showing current path
+ */
+export declare function Breadcrumb(props: BreadcrumbProps): import("solid-js").JSX.Element;

package/dist/components/file-browser/DirectoryTree.d.ts

@@ -0,0 +1,7 @@
+export interface DirectoryTreeProps {
+    class?: string;
+}
+/**
+ * Collapsible directory tree for sidebar navigation (folders only)
+ */
+export declare function DirectoryTree(props: DirectoryTreeProps): import("solid-js").JSX.Element;

package/dist/components/file-browser/FileBrowser.d.ts

@@ -0,0 +1,35 @@
+import { type JSX } from 'solid-js';
+import { type FileContextMenuProps } from './FileContextMenu';
+import type { FileItem, ViewMode, ContextMenuCallbacks, ContextMenuItem } from './types';
+export interface FileBrowserProps {
+    /** File tree data */
+    files: FileItem[];
+    /** Initial path to display */
+    initialPath?: string;
+    /** Initial view mode */
+    initialViewMode?: ViewMode;
+    /** Callback when navigation occurs */
+    onNavigate?: (path: string) => void;
+    /** Callback when selection changes */
+    onSelect?: (items: FileItem[]) => void;
+    /** Additional class names */
+    class?: string;
+    /** Custom header content */
+    header?: JSX.Element;
+    /** Sidebar width in pixels */
+    sidebarWidth?: number;
+    /** Hide sidebar on mobile by default */
+    hideSidebarOnMobile?: boolean;
+    /** Context menu callbacks for built-in actions */
+    contextMenuCallbacks?: ContextMenuCallbacks;
+    /** Custom context menu items to add */
+    customContextMenuItems?: ContextMenuItem[];
+    /** Override default context menu items completely */
+    overrideContextMenuItems?: ContextMenuItem[];
+    /** Default context menu items to hide */
+    hideContextMenuItems?: FileContextMenuProps['hideItems'];
+}
+/**
+ * Professional file browser component with list/grid views and directory tree sidebar
+ */
+export declare function FileBrowser(props: FileBrowserProps): JSX.Element;

package/dist/components/file-browser/FileBrowserContext.d.ts

@@ -0,0 +1,18 @@
+import { type JSX } from 'solid-js';
+import type { FileItem, ViewMode, FileBrowserContextValue } from './types';
+export interface FileBrowserProviderProps {
+    children: JSX.Element;
+    files: FileItem[];
+    initialPath?: string;
+    initialViewMode?: ViewMode;
+    onNavigate?: (path: string) => void;
+    onSelect?: (items: FileItem[]) => void;
+}
+/**
+ * Provider for file browser state management
+ */
+export declare function FileBrowserProvider(props: FileBrowserProviderProps): JSX.Element;
+/**
+ * Hook to access file browser context
+ */
+export declare function useFileBrowser(): FileBrowserContextValue;

package/dist/components/file-browser/FileBrowserToolbar.d.ts

@@ -0,0 +1,8 @@
+import type { JSX } from 'solid-js';
+export interface FileBrowserToolbarProps {
+    class?: string;
+}
+/**
+ * Toolbar with navigation, breadcrumb, and view mode toggle
+ */
+export declare function FileBrowserToolbar(props: FileBrowserToolbarProps): JSX.Element;

package/dist/components/file-browser/FileContextMenu.d.ts

@@ -0,0 +1,15 @@
+import type { ContextMenuItem, ContextMenuCallbacks } from './types';
+export interface FileContextMenuProps {
+    /** Custom menu items to add (will be merged with defaults) */
+    customItems?: ContextMenuItem[];
+    /** Override default menu items completely */
+    overrideItems?: ContextMenuItem[];
+    /** Callbacks for built-in actions */
+    callbacks?: ContextMenuCallbacks;
+    /** Items to hide from default menu */
+    hideItems?: Array<'duplicate' | 'ask-agent' | 'copy-to' | 'move-to' | 'delete' | 'rename'>;
+}
+/**
+ * Context menu for file browser items
+ */
+export declare function FileContextMenu(props: FileContextMenuProps): import("solid-js").JSX.Element;

package/dist/components/file-browser/FileGridView.d.ts

@@ -0,0 +1,7 @@
+export interface FileGridViewProps {
+    class?: string;
+}
+/**
+ * Grid/tile view for displaying files in a card format
+ */
+export declare function FileGridView(props: FileGridViewProps): import("solid-js").JSX.Element;

package/dist/components/file-browser/FileIcons.d.ts

@@ -0,0 +1,14 @@
+import type { JSX } from 'solid-js';
+interface FileIconProps {
+    class?: string;
+}
+export declare const FolderIcon: (props: FileIconProps) => JSX.Element;
+export declare const FolderOpenIcon: (props: FileIconProps) => JSX.Element;
+export declare const FileIcon: (props: FileIconProps) => JSX.Element;
+export declare const CodeFileIcon: (props: FileIconProps) => JSX.Element;
+export declare const ImageFileIcon: (props: FileIconProps) => JSX.Element;
+export declare const DocumentFileIcon: (props: FileIconProps) => JSX.Element;
+export declare const ConfigFileIcon: (props: FileIconProps) => JSX.Element;
+export declare const StyleFileIcon: (props: FileIconProps) => JSX.Element;
+export declare function getFileIcon(extension?: string): (props: FileIconProps) => JSX.Element;
+export {};

package/dist/components/file-browser/FileListView.d.ts

@@ -0,0 +1,7 @@
+export interface FileListViewProps {
+    class?: string;
+}
+/**
+ * List view for displaying files in a table format
+ */
+export declare function FileListView(props: FileListViewProps): import("solid-js").JSX.Element;

package/dist/components/file-browser/index.d.ts

@@ -0,0 +1,10 @@
+export { FileBrowser, type FileBrowserProps } from './FileBrowser';
+export { FileBrowserProvider, useFileBrowser, type FileBrowserProviderProps } from './FileBrowserContext';
+export { DirectoryTree, type DirectoryTreeProps } from './DirectoryTree';
+export { FileListView, type FileListViewProps } from './FileListView';
+export { FileGridView, type FileGridViewProps } from './FileGridView';
+export { FileContextMenu, type FileContextMenuProps } from './FileContextMenu';
+export { Breadcrumb, type BreadcrumbProps } from './Breadcrumb';
+export { FileBrowserToolbar, type FileBrowserToolbarProps } from './FileBrowserToolbar';
+export { FolderIcon, FolderOpenIcon, FileIcon, CodeFileIcon, ImageFileIcon, DocumentFileIcon, ConfigFileIcon, StyleFileIcon, getFileIcon, } from './FileIcons';
+export type { FileItem, ViewMode, SortField, SortDirection, SortConfig, FileBrowserContextValue, ContextMenuActionType, ContextMenuItem, ContextMenuEvent, ContextMenuCallbacks, } from './types';

package/dist/components/file-browser/types.d.ts

@@ -0,0 +1,104 @@
+import type { JSX, Accessor } from 'solid-js';
+/**
+ * Represents a file or folder item in the browser
+ */
+export interface FileItem {
+    id: string;
+    name: string;
+    type: 'file' | 'folder';
+    path: string;
+    size?: number;
+    modifiedAt?: Date;
+    extension?: string;
+    children?: FileItem[];
+    icon?: JSX.Element;
+}
+/**
+ * View mode for the file browser main content area
+ */
+export type ViewMode = 'list' | 'grid';
+/**
+ * Sort options for file list
+ */
+export type SortField = 'name' | 'size' | 'modifiedAt' | 'type';
+export type SortDirection = 'asc' | 'desc';
+export interface SortConfig {
+    field: SortField;
+    direction: SortDirection;
+}
+/**
+ * Built-in context menu action types
+ */
+export type ContextMenuActionType = 'duplicate' | 'ask-agent' | 'copy-to' | 'move-to' | 'delete' | 'rename' | 'custom';
+/**
+ * Context menu item definition
+ */
+export interface ContextMenuItem {
+    /** Unique identifier for the action */
+    id: string;
+    /** Display label */
+    label: string;
+    /** Action type - use 'custom' for user-defined actions */
+    type: ContextMenuActionType;
+    /** Optional icon component */
+    icon?: (props: {
+        class?: string;
+    }) => JSX.Element;
+    /** Whether this item is disabled */
+    disabled?: boolean;
+    /** Whether to show a separator after this item */
+    separator?: boolean;
+    /** Keyboard shortcut hint (display only) */
+    shortcut?: string;
+    /** Custom handler for 'custom' type actions */
+    onAction?: (items: FileItem[]) => void;
+}
+/**
+ * Context menu event with position and target items
+ */
+export interface ContextMenuEvent {
+    /** X position for the menu */
+    x: number;
+    /** Y position for the menu */
+    y: number;
+    /** Target file/folder items */
+    items: FileItem[];
+}
+/**
+ * Callbacks for context menu actions
+ */
+export interface ContextMenuCallbacks {
+    onDuplicate?: (items: FileItem[]) => void;
+    onAskAgent?: (items: FileItem[]) => void;
+    onCopyTo?: (items: FileItem[]) => void;
+    onMoveTo?: (items: FileItem[]) => void;
+    onDelete?: (items: FileItem[]) => void;
+    onRename?: (item: FileItem) => void;
+}
+/**
+ * File browser context value for internal state management
+ */
+export interface FileBrowserContextValue {
+    currentPath: Accessor<string>;
+    setCurrentPath: (path: string) => void;
+    navigateUp: () => void;
+    navigateTo: (item: FileItem) => void;
+    selectedItems: Accessor<Set<string>>;
+    selectItem: (id: string, multi?: boolean) => void;
+    clearSelection: () => void;
+    isSelected: (id: string) => boolean;
+    viewMode: Accessor<ViewMode>;
+    setViewMode: (mode: ViewMode) => void;
+    sortConfig: Accessor<SortConfig>;
+    setSortConfig: (config: SortConfig) => void;
+    expandedFolders: Accessor<Set<string>>;
+    toggleFolder: (path: string) => void;
+    isExpanded: (path: string) => boolean;
+    files: Accessor<FileItem[]>;
+    currentFiles: Accessor<FileItem[]>;
+    sidebarCollapsed: Accessor<boolean>;
+    toggleSidebar: () => void;
+    contextMenu: Accessor<ContextMenuEvent | null>;
+    showContextMenu: (event: ContextMenuEvent) => void;
+    hideContextMenu: () => void;
+}

package/dist/components/index.d.ts

@@ -3,3 +3,4 @@ export * from './ui';
 export * from './loading';
 export * from './icons';
 export * from './launchpad';
+export * from './file-browser';

package/dist/components/layout/Sidebar.d.ts

@@ -9,6 +9,24 @@ export interface SidebarProps {
  * Collapsible sidebar panel
  */
 export declare function Sidebar(props: SidebarProps): JSX.Element;
+/**
+ * Unified wrapper for sidebar content.
+ * Use this component to ensure consistent padding and spacing across all sidebars.
+ */
+export interface SidebarContentProps {
+    children: JSX.Element;
+    class?: string;
+}
+export declare function SidebarContent(props: SidebarContentProps): JSX.Element;
+/**
+ * Container for sidebar items within a section.
+ * Provides consistent spacing between list items.
+ */
+export interface SidebarItemListProps {
+    children: JSX.Element;
+    class?: string;
+}
+export declare function SidebarItemList(props: SidebarItemListProps): JSX.Element;
 /**
  * Sidebar section with optional header
  */

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

@@ -1,6 +1,6 @@
 export { Shell, type ShellProps } from './Shell';
 export { ActivityBar, type ActivityBarItem, type ActivityBarProps } from './ActivityBar';
-export { Sidebar, SidebarSection, SidebarItem, type SidebarProps, type SidebarSectionProps, type SidebarItemProps } from './Sidebar';
+export { Sidebar, SidebarContent, SidebarItemList, SidebarSection, SidebarItem, type SidebarProps, type SidebarContentProps, type SidebarItemListProps, type SidebarSectionProps, type SidebarItemProps, } from './Sidebar';
 export { TopBar, type TopBarProps } from './TopBar';
 export { BottomBar, BottomBarItem, StatusIndicator, type BottomBarProps, type BottomBarItemProps, type StatusIndicatorProps } from './BottomBar';
 export { MobileTabBar, type MobileTabBarItem, type MobileTabBarProps } from './MobileTabBar';

package/dist/components/layout/mobileTabs.d.ts

@@ -7,9 +7,9 @@ export interface ResolveMobileTabActiveIdArgs {
     activeIsFullScreen: boolean;
 }
 /**
- * On mobile we support two UX modes:
- * - Sidebar overlay mode (default): tabs toggle an overlay that renders the component as sidebar content.
- * - FullScreen navigation mode: tabs switch the main page (no overlay).
+ * Determine which tab should appear active in the mobile tab bar.
+ * - For fullScreen components: always show as active
+ * - For sidebar components: show as active only when sidebar is open
  */
 export declare function resolveMobileTabActiveId(args: ResolveMobileTabActiveIdArgs): string;
 export interface ResolveMobileTabSelectArgs {
@@ -22,4 +22,9 @@ export interface ResolveMobileTabSelectResult {
     nextActiveId: string;
     nextMobileSidebarOpen: boolean;
 }
+/**
+ * Handle mobile tab selection:
+ * - FullScreen components: navigate directly, close sidebar
+ * - Sidebar components: toggle sidebar visibility
+ */
 export declare function resolveMobileTabSelect(args: ResolveMobileTabSelectArgs): ResolveMobileTabSelectResult;