nexus-shell 0.2.10 → 0.2.12

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

@@ -2,25 +2,22 @@ import { ReactNode } from 'react';
 import { Model, IJsonModel } from 'flexlayout-react';
 import { IMenuItemConfig } from '../../core/registry/MenuRegistry';
 import { ISlashCommandConfig } from '../../core/services/ChatService';
-import { ISidebarPanel } from '../../core/services/SidebarService';
+import { IPanel } from '../../core/services/PaneService';
 import { IStatusBarWidgetConfig } from '../../core/services/StatusBarService';
 
 export interface ShellLayoutProps {
     /**
-     * Sidebar panels to register. Each becomes an icon in the activity bar and
-     * renders its `component` in the sidebar when selected.
-     */
-    panels?: ISidebarPanel[];
-    /**
-     * Right-hand panels — inspectors, properties, anything about the current
-     * selection rather than about navigation.
+     * Panels to register, for every edge.
+     *
+     * Each panel's `side` decides where it docks — `"left"`, `"right"` or
+     * `"bottom"`, defaulting to left — and each edge keeps its own open panel, so
+     * a file tree, an inspector and a terminal can all be showing at once. A rail
+     * appears only once its edge has a panel.
      *
-     * Registered exactly like `panels`, against a separate store, so the two
-     * sides open and close independently: file tree on the left and properties on
-     * the right, both at once. The right-hand rail appears only once at least one
-     * is registered.
+     * Placement is data on the panel rather than a separate prop per side, so
+     * moving something is a one-word change.
      */
-    inspectorPanels?: ISidebarPanel[];
+    panels?: IPanel[];
     /** Slash commands available in the chat pane. */
     slashCommands?: ISlashCommandConfig[];
     /** Menu structure, keyed by top-level menu name. Items dispatch by `commandId`. */
@@ -61,8 +58,8 @@ export interface ShellLayoutProps {
     onLayoutChange?: (layout: IJsonModel) => void;
 }
 /**
- * The complete application shell: menu bar, activity bar, sidebar, a
- * `flexlayout-react` docking workspace, terminal, chat pane and status bar.
+ * The complete application shell: menu bar, a docked pane and rail on each
+ * edge, a `flexlayout-react` docking workspace, and a status bar.
  *
  * **This is where an application starts.** Call {@link initializeShell} once to
  * register your commands, menus and panels, render this component, and add
@@ -91,7 +88,11 @@ export interface ShellLayoutProps {
  * componentRegistry.register('editor', Editor);
  *
  * initializeShell({
- *   panels: [{ id: 'files', label: 'Explorer', icon: Files, component: FileTree }],
+ *   panels: [
+ *     { id: 'files', label: 'Explorer', icon: Files, component: FileTree },
+ *     chatPanel({ side: 'right' }),
+ *     terminalPanel({ side: 'bottom' }),
+ *   ],
  *   commands: [{ id: 'file.save', label: 'File: Save', keybinding: 'Control+s', execute: save }],
  *   menus: { File: [{ id: 'save', label: 'Save', commandId: 'file.save' }] },
  *   statusBar: [{ id: 'branch', label: 'main', alignment: 'left' }],
@@ -102,4 +103,4 @@ export interface ShellLayoutProps {
  * );
  * ```
  */
-export declare const ShellLayout: ({ panels, inspectorPanels, slashCommands, menuConfig, statusBarConfig, title, rightMenuBarContent, centerMenuBarContent, layoutModel, initialLayoutJson, disableLocalStorage, onLayoutChange, }: ShellLayoutProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ShellLayout: ({ panels, slashCommands, menuConfig, statusBarConfig, title, rightMenuBarContent, centerMenuBarContent, layoutModel, initialLayoutJson, disableLocalStorage, onLayoutChange, }: ShellLayoutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/widgets/ActivityBar.d.ts

@@ -14,8 +14,12 @@ export interface ActivityBarProps {
     /** Items rendered in the main (top) group, in order. */
     items?: IActivityBarItem[];
     /**
-     * Items rendered in the bottom group, below the flex spacer. Defaults to a
-     * single Settings item. Pass `[]` to render no bottom group.
+     * Items rendered in the bottom group, below the flex spacer. Empty by
+     * default.
+     *
+     * This used to default to a Settings item, which meant every rail grew one
+     * whether the app had settings or not. Settings is now an ordinary panel with
+     * `align: 'end'` — see `settingsPanel()`.
      */
     bottomItems?: IActivityBarItem[];
     /** Id of the currently active item, or `null` when nothing is selected. */
@@ -31,7 +35,7 @@ export interface ActivityBarProps {
      * The divider and the active-item indicator both mirror, so a right-hand rail
      * marks its selection on the edge facing the content.
      */
-    side?: PaneSide;
+    side?: Exclude<PaneSide, 'bottom'>;
     /** Extra classes merged onto the root `<aside>`. */
     className?: string;
     /** Accessible label for the landmark. Defaults to `"Activity Bar"`. */

package/dist/components/widgets/SidebarPane.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 
 /** Which edge of the shell a pane or rail is docked to. */
-export type PaneSide = 'left' | 'right';
+export type PaneSide = 'left' | 'right' | 'bottom';
 export interface SidebarPaneProps {
     /**
      * Heading text. Rendered uppercase with letter-spacing; pass it in natural
@@ -15,8 +15,10 @@ export interface SidebarPaneProps {
      * entirely — useful when the pane is always visible.
      */
     onClose?: () => void;
-    /** Fixed pane width, as a CSS length. Defaults to `"300px"`. */
+    /** Fixed pane width, as a CSS length. Ignored when `side` is `"bottom"`. Defaults to `"300px"`. */
     width?: string;
+    /** Fixed pane height, as a CSS length. Only used when `side` is `"bottom"`. Defaults to `"240px"`. */
+    height?: string;
     /**
      * Which edge of the shell the pane is docked to. Defaults to `"left"`.
      *
@@ -39,8 +41,9 @@ export interface SidebarPaneProps {
  * prop existed every application hand-rolled its own right-hand
  * `<div className="w-80 border-l …">`, and they all drifted apart.
  *
- * For the store-backed variants used by `ShellLayout`, see
- * `ConnectedSidebarPane` and `ConnectedInspectorPane`.
+ * `bottom` docks it below the workspace, where `width` gives way to `height`.
+ *
+ * For the store-backed variant used by `ShellLayout`, see `ConnectedPane`.
  *
  * @example
  * ```tsx
@@ -51,6 +54,10 @@ export interface SidebarPaneProps {
  * <SidebarPane title="Properties" side="right" width="320px">
  *   <PropertyPanel subjects={selected} fields={fields} />
  * </SidebarPane>
+ *
+ * <SidebarPane title="Terminal" side="bottom" height="240px">
+ *   <ConnectedTerminalPane />
+ * </SidebarPane>
  * ```
  */
-export declare const SidebarPane: ({ title, children, onClose, width, side, className, }: SidebarPaneProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SidebarPane: ({ title, children, onClose, width, height, side, className, }: SidebarPaneProps) => import("react/jsx-runtime").JSX.Element;

package/dist/connected/ConnectedPane.d.ts

@@ -0,0 +1,24 @@
+import { SidebarPaneProps, PaneSide } from '../components/widgets/SidebarPane';
+
+export type ConnectedPaneProps = Omit<SidebarPaneProps, 'title' | 'children' | 'onClose'> & {
+    /** Which edge to render. Defaults to `"left"`. */
+    side?: PaneSide;
+};
+/**
+ * {@link SidebarPane} bound to the pane store for one edge.
+ *
+ * Renders whichever panel is open on that edge, or nothing when the pane is
+ * collapsed. Every edge resolves against its own registry, so the left pane,
+ * the right pane and the bottom drawer open and close independently — a file
+ * tree, an inspector and a terminal all at once is the normal case, not a
+ * special one.
+ *
+ * There is nothing edge-specific in here. A panel decides where it lives
+ * through its `side`, and this renders whatever arrived.
+ *
+ * @example
+ * ```tsx
+ * <ConnectedPane side="right" width="320px" />
+ * ```
+ */
+export declare const ConnectedPane: ({ side, ...props }: ConnectedPaneProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/connected/ConnectedPaneRail.d.ts

@@ -0,0 +1,25 @@
+import { ActivityBarProps } from '../components/widgets/ActivityBar';
+import { PaneSide } from '../components/widgets/SidebarPane';
+
+export type ConnectedPaneRailProps = Omit<ActivityBarProps, 'items' | 'bottomItems' | 'activeId' | 'onSelect' | 'side'> & {
+    /** Which edge to render. Defaults to `"left"`. */
+    side?: Exclude<PaneSide, 'bottom'>;
+};
+/**
+ * {@link ActivityBar} bound to the pane store for one edge.
+ *
+ * Derives its items from the panels registered on that edge and toggles the
+ * open one — clicking the already-open item closes the pane. Items with
+ * `align: 'end'` go to the far group, which is how settings ends up at the
+ * bottom without the rail knowing what settings is.
+ *
+ * Renders nothing when no panels are registered for the edge. An empty rail is
+ * a twelve-pixel strip of nothing, and both edges behave the same way — the
+ * left rail used to render regardless, which made the two sides subtly
+ * different for no reason anyone had chosen.
+ *
+ * There is no bottom rail: a bottom drawer is toggled from the status bar, a
+ * command or a keybinding, and a horizontal strip of icons under the workspace
+ * costs more room than it earns.
+ */
+export declare const ConnectedPaneRail: ({ side, ...props }: ConnectedPaneRailProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/connected/ConnectedSettingsPanel.d.ts

@@ -0,0 +1,12 @@
+import { SettingsPanelProps } from '../components/widgets/SettingsPanel';
+
+export type ConnectedSettingsPanelProps = Omit<SettingsPanelProps, 'theme' | 'onThemeChange'>;
+/**
+ * {@link SettingsPanel} bound to `useThemeStore`.
+ *
+ * This used to be reached through a reserved `"settings"` panel id that the
+ * pane special-cased. Making it an ordinary connected component means the pane
+ * has no privileged ids left, and both rails behave identically — register it
+ * with `settingsPanel()`, or don't, and nothing else changes.
+ */
+export declare const ConnectedSettingsPanel: (props: ConnectedSettingsPanelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/connected/index.d.ts

@@ -9,13 +9,14 @@
  * Reach for these when you want the shell's behavior. Reach for the plain
  * components when you want control.
  */
-export { chatPanel, terminalPanel } from './panels';
-export { ConnectedActivityBar, ConnectedInspectorBar, type ConnectedActivityBarProps, } from './ConnectedActivityBar';
+export { chatPanel, terminalPanel, settingsPanel } from './panels';
+export { ConnectedPaneRail, type ConnectedPaneRailProps } from './ConnectedPaneRail';
 export { ConnectedChatPane, type ConnectedChatPaneProps } from './ConnectedChatPane';
 export { ConnectedCommandPalette, type ConnectedCommandPaletteProps } from './ConnectedCommandPalette';
 export { ConnectedMenuBar, type ConnectedMenuBarProps } from './ConnectedMenuBar';
 export { ConnectedModal, type ConnectedModalProps } from './ConnectedModal';
-export { ConnectedInspectorPane, ConnectedSidebarPane, type ConnectedSidebarPaneProps, } from './ConnectedSidebarPane';
+export { ConnectedPane, type ConnectedPaneProps } from './ConnectedPane';
+export { ConnectedSettingsPanel, type ConnectedSettingsPanelProps, } from './ConnectedSettingsPanel';
 export { ConnectedStatusBar, type ConnectedStatusBarProps } from './ConnectedStatusBar';
 export { ConnectedTerminalPane, type ConnectedTerminalPaneProps } from './ConnectedTerminalPane';
 export { ConnectedThemeSwitcher, type ConnectedThemeSwitcherProps } from './ConnectedThemeSwitcher';

package/dist/connected/panels.d.ts

@@ -1,28 +1,36 @@
-import { CHAT_PANEL_ID, TERMINAL_PANEL_ID, ISidebarPanel } from '../core/services/SidebarService';
+import { IPanel } from '../core/services/PaneService';
 
 /**
  * Ready-made panel descriptors for the shell's own pieces.
  *
- * Chat and terminal used to be nailed into fixed slots — chat on the right,
- * terminal along the bottom — and there was no way to put them anywhere else.
- * They are now ordinary registrations, so they go wherever you register them:
+ * Chat, terminal and settings were each nailed into a fixed place — chat on the
+ * right, terminal along the bottom, settings behind a reserved panel id the
+ * pane special-cased. They are now ordinary registrations with no privileges,
+ * so they go wherever you put them:
  *
  * ```tsx
  * initializeShell({
- *   panels: [terminalPanel()],            // left rail
- *   inspectorPanels: [chatPanel()],       // right rail
+ *   panels: [
+ *     { id: 'files', label: 'Explorer', icon: Files, component: FileTree },
+ *     chatPanel({ side: 'right' }),
+ *     terminalPanel({ side: 'bottom' }),
+ *     settingsPanel(),
+ *   ],
  * });
- *
- * // …or as a dockable tab, alongside everything else:
- * componentRegistry.register('terminal', ConnectedTerminalPane);
- * useLayoutStore.getState().addTab('terminal', 'Terminal');
  * ```
  *
- * Each takes overrides, so the id, label or icon can be changed without
+ * Each takes overrides, so the id, label, icon or side can change without
  * rebuilding the descriptor by hand.
  */
 /** The chat pane, as a registerable panel. */
-export declare const chatPanel: (overrides?: Partial<ISidebarPanel>) => ISidebarPanel;
+export declare const chatPanel: (overrides?: Partial<IPanel>) => IPanel;
 /** The terminal, as a registerable panel. */
-export declare const terminalPanel: (overrides?: Partial<ISidebarPanel>) => ISidebarPanel;
-export { CHAT_PANEL_ID, TERMINAL_PANEL_ID };
+export declare const terminalPanel: (overrides?: Partial<IPanel>) => IPanel;
+/**
+ * The theme picker, as a registerable panel.
+ *
+ * `align: 'end'` pins it to the far group of its rail, which is where a
+ * settings icon conventionally sits — and is now the only reason it ends up
+ * there, rather than the pane knowing the string `"settings"`.
+ */
+export declare const settingsPanel: (overrides?: Partial<IPanel>) => IPanel;

package/dist/core/Boot.d.ts

@@ -1,7 +1,7 @@
 import { ICommand } from './registry/CommandRegistry';
 import { IMenuItemConfig } from './registry/MenuRegistry';
 import { ISlashCommandConfig } from './services/ChatService';
-import { ISidebarPanel } from './services/SidebarService';
+import { IPanel } from './services/PaneService';
 import { IStatusBarWidgetConfig } from './services/StatusBarService';
 
 export interface InitializeShellOptions {
@@ -9,13 +9,7 @@ export interface InitializeShellOptions {
      * Sidebar panels to register. Each becomes an icon in the activity bar and
      * renders its `component` in the sidebar when selected.
      */
-    panels?: ISidebarPanel[];
-    /**
-     * Right-hand panels — inspectors and properties, as opposed to navigation.
-     * Registered against `useInspectorStore`, so they open and close
-     * independently of the left-hand sidebar.
-     */
-    inspectorPanels?: ISidebarPanel[];
+    panels?: IPanel[];
     /** Menus keyed by top-level name. Items dispatch through their `commandId`. */
     menus?: Record<string, IMenuItemConfig[]>;
     /** Commands available to the palette, menus and keybindings. */
@@ -72,7 +66,10 @@ export declare const togglePanel: (id: string) => boolean;
  * componentRegistry.register('editor', Editor);
  *
  * initializeShell({
- *   panels: [{ id: 'files', label: 'Explorer', icon: Files, component: FileTree }],
+ *   panels: [
+ *     { id: 'files', label: 'Explorer', icon: Files, component: FileTree },
+ *     chatPanel({ side: 'right' }),
+ *   ],
  *   commands: [{ id: 'file.save', label: 'File: Save', keybinding: 'Control+s', execute: save }],
  *   menus: { File: [{ id: 'save', label: 'Save', commandId: 'file.save' }] },
  *   statusBar: [{ id: 'branch', label: 'main', alignment: 'left' }],

package/dist/core/services/ChatService.d.ts

@@ -17,7 +17,23 @@ interface ChatState {
     }) => void;
     clearMessages: () => void;
     setSlashCommands: (commands: ISlashCommandConfig[]) => void;
+    /**
+     * Add a command, replacing any existing one with the same `command` word.
+     *
+     * Registering is idempotent so that a component registering in an effect is
+     * safe to mount twice — which React does in StrictMode, and again on every
+     * remount. Appending blindly would leave the same command listed two or three
+     * times in the suggestion list.
+     */
     registerSlashCommand: (command: ISlashCommandConfig) => void;
+    /**
+     * Remove a command by its `command` word. Unknown words are ignored.
+     *
+     * The counterpart to {@link ChatState.registerSlashCommand}, so a component
+     * that registers on mount can clean up on unmount and stop offering a command
+     * whose handler is gone.
+     */
+    unregisterSlashCommand: (command: string) => void;
 }
 /**
  * Shell-level store for the chat pane's transcript and slash commands.

package/dist/core/services/PaneService.d.ts

@@ -0,0 +1,66 @@
+import { StoreApi, UseBoundStore } from 'zustand';
+import { LucideIcon } from 'lucide-react';
+import { PaneSide } from '../../components/widgets/SidebarPane';
+
+/**
+ * The shell's docked panes, one store per edge.
+ *
+ * Every edge behaves identically — a registry of panels, one of which is open,
+ * remembered across reloads — so they share an implementation rather than
+ * drifting into three. Which edge a panel belongs to is data on the panel, not
+ * a separate API per side.
+ */
+/** Ids the shell's own panels use by default. */
+export declare const CHAT_PANEL_ID = "chat";
+export declare const TERMINAL_PANEL_ID = "terminal";
+export declare const SETTINGS_PANEL_ID = "settings";
+export interface IPanel {
+    id: string;
+    label: string;
+    icon: LucideIcon;
+    component: React.ComponentType<any> | React.ReactNode;
+    /**
+     * Which edge the panel docks to. Defaults to `"left"`.
+     *
+     * This is the whole placement API: move a panel by changing this, not by
+     * registering it somewhere else.
+     */
+    side?: PaneSide;
+    /**
+     * Where the panel's icon sits on its rail. `"end"` pins it to the far group —
+     * conventionally settings and account. Defaults to `"start"`.
+     */
+    align?: 'start' | 'end';
+}
+export interface PaneState {
+    /** Id of the open panel, or `null` when the pane is collapsed. */
+    activePanel: string | null;
+    panels: IPanel[];
+    setActivePanel: (id: string | null) => void;
+    /** Open the panel, or close it if it is already open. */
+    togglePanel: (id: string) => void;
+    setPanels: (panels: IPanel[]) => void;
+}
+export type PaneStore = UseBoundStore<StoreApi<PaneState>>;
+/**
+ * A pane store bound to one storage key.
+ *
+ * Exported so an application with a docked region the shell doesn't provide
+ * gets the same behaviour without reimplementing it.
+ */
+export declare const createPaneStore: (storageKey: string) => PaneStore;
+export declare const useLeftPaneStore: PaneStore;
+export declare const useRightPaneStore: PaneStore;
+export declare const useBottomPaneStore: PaneStore;
+/** The store for one edge. */
+export declare const paneStore: (side: PaneSide) => PaneStore;
+/** Every pane store, for code that has to look across all of them. */
+export declare const PANE_SIDES: PaneSide[];
+/**
+ * Register panels across every edge at once.
+ *
+ * Panels arrive as one list and are routed by their `side`, so a caller never
+ * has to know there are three stores. Each edge is set rather than appended,
+ * matching how the rest of the shell's configuration behaves.
+ */
+export declare const setPanels: (panels: IPanel[]) => void;

package/dist/index.d.ts

@@ -32,7 +32,7 @@ export { componentRegistry, type ComponentConstructor } from './core/registry/Co
 export { useChatStore, type ISlashCommandConfig } from './core/services/ChatService';
 export { useLayoutStore } from './core/services/LayoutService';
 export { useModalStore, type ModalType as ModalStoreType } from './core/services/ModalStoreService';
-export { useSidebarStore, useInspectorStore, createSidebarStore, CHAT_PANEL_ID, TERMINAL_PANEL_ID, type ISidebarPanel, type SidebarState, type SidebarStore, } from './core/services/SidebarService';
+export { createPaneStore, paneStore, setPanels, useLeftPaneStore, useRightPaneStore, useBottomPaneStore, PANE_SIDES, CHAT_PANEL_ID, TERMINAL_PANEL_ID, SETTINGS_PANEL_ID, type IPanel, type PaneState, type PaneStore, } from './core/services/PaneService';
 export { useStatusBarStore, type IStatusBarWidgetConfig } from './core/services/StatusBarService';
 export { useTerminalStore } from './core/services/TerminalService';
 export { useThemeStore, type ThemeType } from './core/services/ThemeService';