@fgv/ts-res-ui-components 5.0.0-30 → 5.0.0-31

package/dist/ts-res-ui-components.d.ts

@@ -1,7 +1,11 @@
 import { Bundle } from '@fgv/ts-res';
 import { Config } from '@fgv/ts-res';
-import { FileTree } from '@fgv/ts-utils';
+import { exportAsJson } from '@fgv/ts-web-extras';
+import { exportUsingFileSystemAPI } from '@fgv/ts-web-extras';
+import { FileTree } from '@fgv/ts-json-base';
 import { Import } from '@fgv/ts-res';
+import type { IResultReporter } from '@fgv/ts-utils';
+import { IUrlConfigOptions } from '@fgv/ts-web-extras';
 import { JsonCompatible } from '@fgv/ts-json-base';
 import { JsonValue } from '@fgv/ts-json-base';
 import { Logging } from '@fgv/ts-utils';
@@ -78,6 +82,24 @@ import { Success } from '@fgv/ts-utils';
  */
 declare function analyzeFilteredResources(originalResourceIds: string[], filteredProcessedResources: IProcessedResources, originalProcessedResources: IProcessedResources): IFilterResult;
 
+/**
+ * Generic app header component with configurable icon, title, and description
+ * @public
+ */
+export declare const AppHeader: React_2.FC<IAppHeaderProps>;
+
+/**
+ * Generic app layout component with header, sidebar, main content area, and messages window
+ * @public
+ */
+export declare const AppLayout: <TTool = unknown>({ children, selectedTool, onToolSelect, messages, onClearMessages, header: headerComponent, sidebar: sidebarComponent }: IAppLayoutProps<TTool>) => React_2.ReactElement;
+
+/**
+ * Generic app sidebar component with configurable tools list
+ * @public
+ */
+export declare const AppSidebar: <TTool = unknown>({ selectedTool, onToolSelect, tools, title }: IAppSidebarProps<TTool>) => React_2.ReactElement;
+
 /**
  * BooleanCell component for editing boolean values with checkbox presentation.
  *
@@ -260,12 +282,6 @@ declare class ConsoleUserLogger extends Logging.LoggerBase implements IUserLogge
     protected _log(message: string, level: MessageLogLevel): Success<string | undefined>;
 }
 
-/**
- * Convert ImportedDirectory to FileTree format
- */
-/** @internal */
-declare function convertImportedDirectoryToFileTree(directory: IImportedDirectory, o11y?: ObservabilityTools_2.IObservabilityContext): FileTree.FileTree;
-
 /**
  * Creates a console-based observability context for development and debugging.
  * @param diagLogLevel - Log level for diagnostic messages.
@@ -415,6 +431,13 @@ declare function createResolverWithContext(processedResources: IProcessedResourc
 /** @internal */
 declare function createSimpleContext(qualifiers: Qualifiers.IReadOnlyQualifierCollector, values: Record<string, string | undefined>): Result<Runtime.ValidatingSimpleContextQualifierProvider>;
 
+/**
+ * Creates a test observability context with no-op loggers and non-upgrade policy.
+ * @returns A new observability context configured for testing.
+ * @public
+ */
+declare function createTestObservabilityContext(): IObservabilityContext;
+
 /**
  * Creates a timestamp string suitable for filenames
  * @public
@@ -873,12 +896,6 @@ declare const EditableJsonView: React_2.FC<IEditableJsonViewProps>;
  */
 declare function evaluateConditionsForCandidate(resolver: Runtime.ResourceResolver, candidateIndex: number, compiledResource: ResourceJson.Compiled.ICompiledResource, compiledCollection: ResourceJson.Compiled.ICompiledResourceCollection): IConditionEvaluationResult[];
 
-/**
- * Export data as JSON file
- */
-/** @internal */
-declare function exportAsJson(data: JsonValue, filename: string): void;
-
 /**
  * Export configuration to JSON string
  */
@@ -927,18 +944,6 @@ declare function exportAsJson(data: JsonValue, filename: string): void;
  */
 declare function exportConfiguration(config: Config.Model.ISystemConfiguration, options?: IConfigurationExportOptions): Result<string>;
 
-/**
- * Export data using File System Access API if available
- */
-/** @internal */
-declare function exportUsingFileSystemAPI(data: JsonValue, suggestedName: string, description?: string): Promise<boolean>;
-
-/**
- * Convert flat file list to directory structure
- */
-/** @internal */
-declare function filesToDirectory(files: IImportedFile[]): IImportedDirectory;
-
 declare namespace FilterTools {
     export {
         FilterView,
@@ -1618,6 +1623,34 @@ declare function hasPendingContextChanges(contextValues: Record<string, string |
  */
 declare const HierarchyEditor: React_2.FC<IHierarchyEditorProps>;
 
+declare interface IAppHeaderProps {
+    icon: React_2.ComponentType<{
+        className?: string;
+    }>;
+    title: string;
+    description: string;
+}
+
+declare interface IAppLayoutProps<TTool = unknown> {
+    children: React_2.ReactNode;
+    selectedTool: TTool;
+    onToolSelect: (tool: TTool) => void;
+    messages: ViewStateTools.IMessage[];
+    onClearMessages: () => void;
+    header: React_2.ComponentType;
+    sidebar: React_2.ComponentType<{
+        selectedTool: TTool;
+        onToolSelect: (tool: TTool) => void;
+    }>;
+}
+
+declare interface IAppSidebarProps<TTool> {
+    selectedTool: TTool;
+    onToolSelect: (tool: TTool) => void;
+    tools: IToolDefinition<TTool>[];
+    title?: string;
+}
+
 /**
  * Props for the BooleanCell component.
  */
@@ -1843,23 +1876,11 @@ declare interface ICreatePendingResourceParams<T = unknown, TV extends JsonCompa
 }
 
 /**
- * Parameters for processImportedDirectory
- */
-/** @internal */
-declare interface ICreateProcessImportedDirectoryParams {
-    directory: IImportedDirectory;
-    systemConfig?: Config.Model.ISystemConfiguration;
-    qualifierTypeFactory?: Config.IConfigInitFactory<QualifierTypes.Config.IAnyQualifierTypeConfig, QualifierTypes.QualifierType>;
-    resourceTypeFactory?: Config.IConfigInitFactory<ResourceTypes.Config.IResourceTypeConfig, ResourceTypes.ResourceType>;
-    o11y?: ObservabilityTools_2.IObservabilityContext;
-}
-
-/**
- * Process imported files using the ts-res system
+ * Parameters for processFileTree
  */
 /** @internal */
-declare interface ICreateProcessImportedFilesParams {
-    files: IImportedFile[];
+declare interface ICreateProcessFileTreeParams {
+    fileTree: FileTree.FileTree;
     systemConfig?: Config.Model.ISystemConfiguration;
     qualifierTypeFactory?: Config.IConfigInitFactory<QualifierTypes.Config.IAnyQualifierTypeConfig, QualifierTypes.QualifierType>;
     resourceTypeFactory?: Config.IConfigInitFactory<ResourceTypes.Config.IResourceTypeConfig, ResourceTypes.ResourceType>;
@@ -2596,40 +2617,6 @@ declare interface IHierarchyEditorProps {
     className?: string;
 }
 
-/**
- * Represents a directory structure imported into the system.
- * Supports nested directory hierarchies with files and subdirectories.
- *
- * @public
- */
-declare interface IImportedDirectory {
-    /** Name of the directory */
-    name: string;
-    /** Optional directory path within the import structure */
-    path?: string;
-    /** Files contained in this directory */
-    files: IImportedFile[];
-    /** Nested subdirectories */
-    subdirectories?: IImportedDirectory[];
-}
-
-/**
- * Represents a file imported into the system.
- * Used for handling individual resource files and configurations.
- *
- * @public
- */
-declare interface IImportedFile {
-    /** Name of the file */
-    name: string;
-    /** Optional file path within the import structure */
-    path?: string;
-    /** Text content of the file */
-    content: string;
-    /** MIME type or file type identifier */
-    type?: string;
-}
-
 /**
  * Props for the ImportView component.
  * Handles importing resource configurations and bundles.
@@ -2638,11 +2625,11 @@ declare interface IImportedFile {
  */
 declare interface IImportViewProps extends IViewBaseProps {
     /** Callback when resource files/directories are imported */
-    onImport?: (data: IImportedDirectory | IImportedFile[]) => void;
+    onImport?: (data: FileTree.FileTree) => void;
     /** Callback when a bundle file is imported */
     onBundleImport?: (bundle: Bundle.IBundle) => void;
     /** Callback when a ZIP file is imported with optional configuration */
-    onZipImport?: (zipData: IImportedDirectory | IImportedFile[], config?: Config.Model.ISystemConfiguration) => void;
+    onZipImport?: (zipData: FileTree.FileTree, config?: Config.Model.ISystemConfiguration) => void;
     /** File types accepted for import */
     acceptedFileTypes?: string[];
     /** External error state to override local import status */
@@ -2756,12 +2743,8 @@ declare function importConfiguration(data: string): Result<Config.Model.ISystemC
 declare namespace ImportTools {
     export {
         ImportView,
-        readFilesFromInput,
-        filesToDirectory,
         exportAsJson,
         exportUsingFileSystemAPI,
-        IImportedFile,
-        IImportedDirectory,
         IImportViewProps
     }
 }
@@ -2788,16 +2771,16 @@ export { ImportTools }
  * import { ImportView } from '@fgv/ts-res-ui-components';
  *
  * function MyImportTool() {
- *   const handleFileImport = (files, directory) => {
- *     console.log('Importing files:', files, directory);
+ *   const handleFileImport = (fileTree) => {
+ *     console.log('Importing files:', fileTree);
  *   };
  *
  *   const handleBundleImport = (bundle) => {
  *     console.log('Importing bundle:', bundle);
  *   };
  *
- *   const handleZipImport = (zipData) => {
- *     console.log('Importing ZIP:', zipData);
+ *   const handleZipImport = (zipData, config) => {
+ *     console.log('Importing ZIP:', zipData, config);
  *   };
  *
  *   return (
@@ -2846,6 +2829,33 @@ declare interface IMultiGridViewProps extends IViewBaseProps {
     allowGridReordering?: boolean;
 }
 
+/**
+ * @public
+ */
+export declare interface INavigationWarningActions<T = unknown> {
+    setHasUnsavedChanges: (hasChanges: boolean) => void;
+    showWarning: (pendingTool: T) => void;
+    hideWarning: () => void;
+    confirmNavigation: () => T | null;
+}
+
+declare interface INavigationWarningModalProps {
+    isOpen: boolean;
+    onCancel: () => void;
+    onConfirm: () => void;
+    onSave?: () => void;
+    hasUnsavedChanges: boolean;
+}
+
+/**
+ * @public
+ */
+export declare interface INavigationWarningState<T = unknown> {
+    isWarningOpen: boolean;
+    pendingTool: T | null;
+    hasUnsavedChanges: boolean;
+}
+
 /**
  * Observability context that provides both diagnostic and user logging capabilities.
  * @public
@@ -2854,11 +2864,27 @@ declare interface IObservabilityContext {
     /**
      * Diagnostic logger for internal system diagnostics.
      */
-    readonly diag: Logging.ILogger;
+    readonly diag: Logging.LogReporter<unknown>;
     /**
      * User logger for user-facing messages and feedback.
      */
-    readonly user: IUserLogger;
+    readonly user: IUserLogReporter;
+    /**
+     * Optional policy configuration for context behavior.
+     */
+    readonly policy?: IObservabilityPolicy;
+}
+
+/**
+ * Policy configuration for observability context behavior.
+ * @public
+ */
+declare interface IObservabilityPolicy {
+    /**
+     * If true, prevents automatic upgrade of the context (e.g., in tests).
+     * Default (undefined or false) allows upgrade.
+     */
+    doNotUpgrade?: boolean;
 }
 
 /**
@@ -2978,9 +3004,8 @@ export declare interface IObservabilityProviderProps {
  * @public
  */
 export declare interface IOrchestratorActions {
-    importDirectory: (directory: IImportedDirectory) => Promise<void>;
-    importDirectoryWithConfig: (directory: IImportedDirectory, config: Config.Model.ISystemConfiguration) => Promise<void>;
-    importFiles: (files: IImportedFile[]) => Promise<void>;
+    importFileTree: (fileTree: FileTree.FileTree) => Promise<void>;
+    importFileTreeWithConfig: (fileTree: FileTree.FileTree, config: Config.Model.ISystemConfiguration) => Promise<void>;
     importBundle: (bundle: Bundle.IBundle) => Promise<void>;
     clearResources: () => void;
     updateConfiguration: (config: Config.Model.ISystemConfiguration) => void;
@@ -4227,6 +4252,15 @@ declare function isViewStateConnected(context: IObservabilityContext): boolean;
  */
 declare function isZipFile(filename: string): boolean;
 
+declare interface IToolDefinition<TTool> {
+    id: TTool;
+    name: string;
+    icon: React_2.ComponentType<{
+        className?: string;
+    }>;
+    description: string;
+}
+
 /**
  * Props for the TriStateCell component.
  */
@@ -4342,12 +4376,10 @@ declare interface IUseResourceDataReturn {
     state: IResourceManagerState;
     /** Available actions for processing and managing resources */
     actions: {
-        /** Process an imported directory structure into a resource system */
-        processDirectory: (directory: IImportedDirectory) => Promise<Result<void>>;
-        /** Process a directory with an explicit configuration */
-        processDirectoryWithConfig: (directory: IImportedDirectory, config: Config.Model.ISystemConfiguration) => Promise<Result<void>>;
-        /** Process an array of imported files into a resource system */
-        processFiles: (files: IImportedFile[]) => Promise<Result<void>>;
+        /** Process a FileTree into a resource system */
+        processFileTree: (fileTree: FileTree.FileTree) => Promise<Result<void>>;
+        /** Process a FileTree with an explicit configuration */
+        processFileTreeWithConfig: (fileTree: FileTree.FileTree, config: Config.Model.ISystemConfiguration) => Promise<Result<void>>;
         /** Process a pre-compiled bundle file */
         processBundleFile: (bundle: Bundle.IBundle) => Promise<void>;
         /** Clear any current error state */
@@ -4378,6 +4410,13 @@ declare interface IUserLogger extends Logging.ILogger {
     success(message?: unknown, ...parameters: unknown[]): Success<string | undefined>;
 }
 
+/**
+ * User log reporter interface that combines IUserLogger with IResultReporter.
+ * @public
+ */
+declare interface IUserLogReporter extends IUserLogger, IResultReporter<unknown> {
+}
+
 /**
  * Return type for the useViewState hook.
  *
@@ -4576,6 +4615,24 @@ export declare const MessagesWindow: React_2.FC<IMessagesWindowProps>;
  */
 export declare const MultiGridView: React_2.FC<IMultiGridViewProps>;
 
+/**
+ * @deprecated Use INavigationWarningActions instead
+ * @public
+ */
+export declare type NavigationWarningActions<T = unknown> = INavigationWarningActions<T>;
+
+/**
+ * Modal component for warning users about unsaved changes before navigation
+ * @public
+ */
+export declare const NavigationWarningModal: React_2.FC<INavigationWarningModalProps>;
+
+/**
+ * @deprecated Use INavigationWarningState instead
+ * @public
+ */
+export declare type NavigationWarningState<T = unknown> = INavigationWarningState<T>;
+
 /**
  * No-op user logger that suppresses all output.
  * @public
@@ -4604,17 +4661,22 @@ declare class ObservabilityContext implements IObservabilityContext {
     /**
      * {@inheritDoc ObservabilityTools.IObservabilityContext.diag}
      */
-    readonly diag: Logging.ILogger;
+    readonly diag: Logging.LogReporter<unknown>;
     /**
      * {@inheritDoc ObservabilityTools.IObservabilityContext.user}
      */
-    readonly user: IUserLogger;
+    readonly user: IUserLogReporter;
+    /**
+     * {@inheritDoc ObservabilityTools.IObservabilityContext.policy}
+     */
+    readonly policy?: IObservabilityPolicy;
     /**
      * Creates a new observability context.
      * @param diag - The diagnostic logger.
      * @param user - The user logger.
+     * @param policy - Optional policy configuration.
      */
-    constructor(diag: Logging.ILogger, user: IUserLogger);
+    constructor(diag: Logging.ILogger, user: IUserLogger, policy?: IObservabilityPolicy);
 }
 
 /**
@@ -4679,10 +4741,13 @@ export { ObservabilityTools }
 declare namespace ObservabilityTools_2 {
     export {
         IUserLogger,
+        IUserLogReporter,
         IObservabilityContext,
+        IObservabilityPolicy,
         ConsoleUserLogger,
         NoOpUserLogger,
         ViewStateUserLogger,
+        UserLogReporter,
         ObservabilityContext,
         detectObservabilityContextType,
         isViewStateConnected,
@@ -4690,6 +4755,7 @@ declare namespace ObservabilityTools_2 {
         ObservabilityContextType,
         createConsoleObservabilityContext,
         createNoOpObservabilityContext,
+        createTestObservabilityContext,
         createViewStateObservabilityContext,
         DefaultObservabilityContext,
         TestObservabilityContext
@@ -4712,21 +4778,18 @@ declare namespace PickerTools {
 export { PickerTools }
 
 /**
- * Process imported directory using the ts-res system
+ * Process FileTree using the ts-res system
+ * Unified function that replaces both processImportedFiles and processImportedDirectory
  */
 /** @internal */
-declare function processImportedDirectory(params: ICreateProcessImportedDirectoryParams): Result<IExtendedProcessedResources>;
-
-/** @internal */
-declare function processImportedFiles(params: ICreateProcessImportedFilesParams): Result<IExtendedProcessedResources>;
+declare function processFileTree(params: ICreateProcessFileTreeParams): Result<IExtendedProcessedResources>;
 
 /**
  * Helper function to process resources from a ZIP load result
  * @public
  */
 declare function processZipLoadResult(zipResult: {
-    files: IImportedFile[];
-    directory?: IImportedDirectory;
+    fileTree: FileTree.FileTree;
     config?: Config.Model.ISystemConfiguration;
 }, overrideConfig?: Config.Model.ISystemConfiguration, o11y?: ObservabilityTools_2.IObservabilityContext): Promise<Result<IProcessedResources>>;
 
@@ -4734,7 +4797,7 @@ declare function processZipLoadResult(zipResult: {
  * Helper function to process resources from ZIP data using ts-res-ui-components integration
  * @public
  */
-declare function processZipResources(files: IImportedFile[], directory: IImportedDirectory | undefined, config?: Config.Model.ISystemConfiguration, o11y?: ObservabilityTools_2.IObservabilityContext): Promise<Result<IProcessedResources>>;
+declare function processZipResources(fileTree: FileTree.FileTree, config?: Config.Model.ISystemConfiguration, o11y?: ObservabilityTools_2.IObservabilityContext): Promise<Result<IProcessedResources>>;
 
 /**
  * A control component for managing individual qualifier context values.
@@ -5051,12 +5114,6 @@ declare const QualifierEditForm: React_2.FC<IQualifierEditFormProps>;
  */
 declare const QualifierTypeEditForm: React_2.FC<IQualifierTypeEditFormProps>;
 
-/**
- * Read files from file input element
- */
-/** @internal */
-declare function readFilesFromInput(files: FileList): Promise<IImportedFile[]>;
-
 /**
  * Reusable control for configuring ResolutionView context options.
  *
@@ -6205,10 +6262,8 @@ declare namespace TsResTools {
         CompiledView,
         getDefaultSystemConfiguration,
         createSimpleContext,
-        convertImportedDirectoryToFileTree,
         createTsResSystemFromConfig,
-        processImportedFiles,
-        processImportedDirectory,
+        processFileTree,
         ISourceViewProps,
         ICompiledViewProps
     }
@@ -6351,6 +6406,14 @@ declare function useFilterState(initialState?: Partial<IFilterState>): IUseFilte
  */
 declare function useIConfigurationState(initialConfiguration?: Config.Model.ISystemConfiguration, onConfigurationChange?: (config: Config.Model.ISystemConfiguration) => void, onUnsavedChanges?: (hasChanges: boolean) => void): IUseIConfigurationStateReturn;
 
+/**
+ * @public
+ */
+export declare const useNavigationWarning: <T = unknown>() => {
+    state: INavigationWarningState<T>;
+    actions: INavigationWarningActions<T>;
+};
+
 /**
  * Hook to access the current observability context.
  *
@@ -6466,8 +6529,8 @@ declare function useResolutionState(processedResources: IProcessedResources | nu
  * ```typescript
  * const { state, actions } = useResourceData();
  *
- * // Process imported files
- * await actions.processFiles(importedFiles);
+ * // Process a FileTree
+ * await actions.processFileTree(fileTree);
  *
  * // Resolve a resource with context
  * const result = await actions.resolveResource('my.resource', {
@@ -6489,6 +6552,31 @@ declare function useResolutionState(processedResources: IProcessedResources | nu
  */
 declare function useResourceData(params?: IUseResourceDataParams): IUseResourceDataReturn;
 
+/**
+ * User logger that extends LogReporter to provide Result reporting capabilities.
+ * Wraps an existing IUserLogger to add IResultReporter functionality.
+ * @public
+ */
+declare class UserLogReporter extends Logging.LogReporter<unknown> implements IUserLogReporter {
+    private readonly _userLogger;
+    /**
+     * Creates a new UserLogReporter.
+     * @param userLogger - The user logger to wrap.
+     */
+    constructor(userLogger: IUserLogger);
+    /**
+     * {@inheritDoc ObservabilityTools.IUserLogger.success}
+     */
+    success(message?: unknown, ...parameters: unknown[]): Success<string | undefined>;
+    /**
+     * Override reportSuccess to use the success method for user-friendly reporting.
+     * @param level - The log level.
+     * @param value - The value to report.
+     * @param detail - Optional detail.
+     */
+    reportSuccess(level: MessageLogLevel, value: unknown, detail?: unknown): void;
+}
+
 /**
  * Smart observability hook that automatically provides the best available observability context.
  *
@@ -6518,6 +6606,15 @@ declare function useResourceData(params?: IUseResourceDataParams): IUseResourceD
  */
 export declare function useSmartObservability(): IObservabilityContext;
 
+/**
+ * Hook to parse and provide URL parameters for initial app configuration
+ * @public
+ */
+export declare function useUrlParams(): {
+    urlParams: IUrlConfigOptions;
+    hasUrlParams: boolean;
+};
+
 /**
  * Hook for managing view state including messages and resource selection.
  *

package/lib/components/common/AppHeader.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+interface IAppHeaderProps {
+    icon: React.ComponentType<{
+        className?: string;
+    }>;
+    title: string;
+    description: string;
+}
+/**
+ * Generic app header component with configurable icon, title, and description
+ * @public
+ */
+declare const AppHeader: React.FC<IAppHeaderProps>;
+export default AppHeader;
+//# sourceMappingURL=AppHeader.d.ts.map

package/lib/components/common/AppHeader.js

@@ -0,0 +1,17 @@
+import React from 'react';
+/**
+ * Generic app header component with configurable icon, title, and description
+ * @public
+ */
+const AppHeader = ({ icon: iconComponent, title, description }) => {
+    const Icon = iconComponent;
+    return (React.createElement("header", { className: "bg-white shadow-sm border-b border-gray-200" },
+        React.createElement("div", { className: "container mx-auto px-4 py-4" },
+            React.createElement("div", { className: "flex items-center space-x-3" },
+                React.createElement(Icon, { className: "h-8 w-8 text-blue-600" }),
+                React.createElement("div", null,
+                    React.createElement("h1", { className: "text-2xl font-bold text-gray-900" }, title),
+                    React.createElement("p", { className: "text-sm text-gray-600" }, description))))));
+};
+export default AppHeader;
+//# sourceMappingURL=AppHeader.js.map

package/lib/components/common/AppLayout.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { ViewStateTools } from '../../namespaces';
+interface IAppLayoutProps<TTool = unknown> {
+    children: React.ReactNode;
+    selectedTool: TTool;
+    onToolSelect: (tool: TTool) => void;
+    messages: ViewStateTools.IMessage[];
+    onClearMessages: () => void;
+    header: React.ComponentType;
+    sidebar: React.ComponentType<{
+        selectedTool: TTool;
+        onToolSelect: (tool: TTool) => void;
+    }>;
+}
+/**
+ * Generic app layout component with header, sidebar, main content area, and messages window
+ * @public
+ */
+declare const AppLayout: <TTool = unknown>({ children, selectedTool, onToolSelect, messages, onClearMessages, header: headerComponent, sidebar: sidebarComponent }: IAppLayoutProps<TTool>) => React.ReactElement;
+export default AppLayout;
+//# sourceMappingURL=AppLayout.d.ts.map

package/lib/components/common/AppLayout.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { ViewStateTools } from '../../namespaces';
+/**
+ * Generic app layout component with header, sidebar, main content area, and messages window
+ * @public
+ */
+const AppLayout = ({ children, selectedTool, onToolSelect, messages, onClearMessages, header: headerComponent, sidebar: sidebarComponent }) => {
+    const Header = headerComponent;
+    const Sidebar = sidebarComponent;
+    return (React.createElement("div", { className: "min-h-screen bg-gray-50" },
+        React.createElement(Header, null),
+        React.createElement("div", { className: "flex" },
+            React.createElement(Sidebar, { selectedTool: selectedTool, onToolSelect: onToolSelect }),
+            React.createElement("main", { className: "flex-1 overflow-hidden" },
+                React.createElement("div", { className: "h-full flex flex-col" },
+                    React.createElement("div", { className: "flex-1 overflow-auto" }, children),
+                    React.createElement(ViewStateTools.MessagesWindow, { messages: messages, onClearMessages: onClearMessages }))))));
+};
+export default AppLayout;
+//# sourceMappingURL=AppLayout.js.map

package/lib/components/common/AppSidebar.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+interface IToolDefinition<TTool> {
+    id: TTool;
+    name: string;
+    icon: React.ComponentType<{
+        className?: string;
+    }>;
+    description: string;
+}
+interface IAppSidebarProps<TTool> {
+    selectedTool: TTool;
+    onToolSelect: (tool: TTool) => void;
+    tools: IToolDefinition<TTool>[];
+    title?: string;
+}
+/**
+ * Generic app sidebar component with configurable tools list
+ * @public
+ */
+declare const AppSidebar: <TTool = unknown>({ selectedTool, onToolSelect, tools, title }: IAppSidebarProps<TTool>) => React.ReactElement;
+export default AppSidebar;
+//# sourceMappingURL=AppSidebar.d.ts.map