@mithrl/design-system 0.2.0 → 0.3.0

package/dist/patterns/workspace-app-shell/WorkspaceAppShell.d.ts

@@ -1,21 +1,39 @@
 import { type HTMLAttributes, type ReactNode } from "react";
 import { type GlobalAppBarProjectSelector, type GlobalAppBarProps } from "../../components/global-app-bar/GlobalAppBar";
 import { type ResizablePanelGroupProps, type ResizablePanelMinimum } from "../../components/resizable-panels/ResizablePanels";
-import { type WorkspaceNavigationProps } from "../../components/workspace-navigation/WorkspaceNavigation";
+import { type WorkspaceNavigationPresentation, type WorkspaceNavigationProps } from "../../components/workspace-navigation/WorkspaceNavigation";
 import type { ThemeMode } from "../../components/switch/Switch";
 
 export type WorkspaceAppShellLayout = "expanded" | "condensed" | "single";
 type NativeWorkspaceAppShellProps = Omit<HTMLAttributes<HTMLDivElement>, "children">;
 type WorkspaceAppBarConfiguration = Omit<GlobalAppBarProps, "defaultTheme" | "onThemeChange" | "theme" | "workspaceControls">;
-type WorkspaceNavigationConfiguration = Omit<WorkspaceNavigationProps, "presentation">;
+export type WorkspaceNavigationConfiguration = Omit<WorkspaceNavigationProps, "presentation">;
 type WorkspaceProjectSelectorConfiguration = Omit<GlobalAppBarProjectSelector, "presentation">;
+export type WorkspaceAppShellNavigationRenderContext = {
+    /** Active structural layout selected from the shell's rendered width. */
+    layout: WorkspaceAppShellLayout;
+    /** Inline on persistent layouts and Overlay in the single-region layout. */
+    presentation: WorkspaceNavigationPresentation;
+    /** Current controlled or uncontrolled Navigation visibility. */
+    open: boolean;
+    /** Stable App Bar toggle identity for focus return from compact overlays. */
+    navigationToggleId: string;
+    /** Requests dismissal after safely relocating focus through the shell. */
+    requestClose: () => void;
+};
+export type WorkspaceAppShellNavigationRenderer = (context: WorkspaceAppShellNavigationRenderContext) => ReactNode;
 export type WorkspaceAppShellProps = NativeWorkspaceAppShellProps & {
     /** Global App Bar account, brand, and native attributes. */
     appBar: WorkspaceAppBarConfiguration;
     /** Project context rendered by the approved Global App Bar selector. */
     projectSelector: WorkspaceProjectSelectorConfiguration;
     /** Workspace Navigation content; App Shell selects Inline or Overlay. */
-    navigation: WorkspaceNavigationConfiguration;
+    navigation?: WorkspaceNavigationConfiguration;
+    /**
+     * Product-navigation adapter for domain-specific status and nested artifacts.
+     * Use instead of `navigation`; the shell still owns visibility and focus.
+     */
+    renderNavigation?: WorkspaceAppShellNavigationRenderer;
     /** Product-owned Primary Panel content. */
     primary: ReactNode;
     /** Product-owned Secondary Panel content. */
@@ -46,6 +64,14 @@ export type WorkspaceAppShellProps = NativeWorkspaceAppShellProps & {
     onSplitChange?: ResizablePanelGroupProps["onValueChange"];
     /** Reports the final pointer value or each committed keyboard step. */
     onSplitCommit?: ResizablePanelGroupProps["onValueCommit"];
+    /** Controlled Secondary width in pixels. Use for product `rightWidth`. */
+    secondaryWidth?: number;
+    /** Initial Secondary width for uncontrolled pixel-based persistence. */
+    defaultSecondaryWidth?: number;
+    /** Reports every resize in Secondary pixels. */
+    onSecondaryWidthChange?: ResizablePanelGroupProps["onSecondarySizeChange"];
+    /** Reports the final pointer value or each keyboard step in pixels. */
+    onSecondaryWidthCommit?: ResizablePanelGroupProps["onSecondarySizeCommit"];
     /** Primary minimum-size policy. Defaults to Standard. */
     primaryMinSize?: ResizablePanelMinimum;
     /** Secondary minimum in pixels. Defaults to 280px. */
@@ -64,7 +90,12 @@ export declare const WorkspaceAppShell: import("react").ForwardRefExoticComponen
     /** Project context rendered by the approved Global App Bar selector. */
     projectSelector: WorkspaceProjectSelectorConfiguration;
     /** Workspace Navigation content; App Shell selects Inline or Overlay. */
-    navigation: WorkspaceNavigationConfiguration;
+    navigation?: WorkspaceNavigationConfiguration;
+    /**
+     * Product-navigation adapter for domain-specific status and nested artifacts.
+     * Use instead of `navigation`; the shell still owns visibility and focus.
+     */
+    renderNavigation?: WorkspaceAppShellNavigationRenderer;
     /** Product-owned Primary Panel content. */
     primary: ReactNode;
     /** Product-owned Secondary Panel content. */
@@ -95,6 +126,14 @@ export declare const WorkspaceAppShell: import("react").ForwardRefExoticComponen
     onSplitChange?: ResizablePanelGroupProps["onValueChange"];
     /** Reports the final pointer value or each committed keyboard step. */
     onSplitCommit?: ResizablePanelGroupProps["onValueCommit"];
+    /** Controlled Secondary width in pixels. Use for product `rightWidth`. */
+    secondaryWidth?: number;
+    /** Initial Secondary width for uncontrolled pixel-based persistence. */
+    defaultSecondaryWidth?: number;
+    /** Reports every resize in Secondary pixels. */
+    onSecondaryWidthChange?: ResizablePanelGroupProps["onSecondarySizeChange"];
+    /** Reports the final pointer value or each keyboard step in pixels. */
+    onSecondaryWidthCommit?: ResizablePanelGroupProps["onSecondarySizeCommit"];
     /** Primary minimum-size policy. Defaults to Standard. */
     primaryMinSize?: ResizablePanelMinimum;
     /** Secondary minimum in pixels. Defaults to 280px. */

package/dist/patterns/workspace-app-shell/WorkspaceNewQuestionDialog.d.ts

@@ -0,0 +1,24 @@
+import { type ReactNode } from "react";
+import { type DialogContentProps } from "../../components/dialog/Dialog";
+
+export type WorkspaceNewQuestionDraft = {
+    question: string;
+};
+export type WorkspaceNewQuestionDialogProps = {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Associates the controlled Dialog with the Navigation action. */
+    triggerId?: string;
+    initialQuestion?: string;
+    onStart: (draft: WorkspaceNewQuestionDraft) => void | Promise<void>;
+    submitting?: boolean;
+    submitError?: ReactNode;
+    portalContainer?: DialogContentProps["portalContainer"];
+    className?: string;
+};
+/**
+ * Controlled Workspace entry pattern. Session creation, routing, persistence,
+ * authorization, and analytics remain owned by the product.
+ */
+export declare function WorkspaceNewQuestionDialog({ open, defaultOpen, onOpenChange, triggerId, initialQuestion, onStart, submitting, submitError, portalContainer, className, }: WorkspaceNewQuestionDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/patterns/workspace-app-shell/WorkspaceQuestionSurface.d.ts

@@ -0,0 +1,49 @@
+import { type HTMLAttributes, type ReactNode } from "react";
+
+export type WorkspaceQuestionSurfacePanel = "primary" | "secondary";
+export type WorkspaceQuestionSurfaceScroll = "consumer" | "surface";
+type NativeWorkspaceQuestionSurfaceProps = Omit<HTMLAttributes<HTMLElement>, "children" | "title">;
+export type WorkspaceQuestionSurfaceProps = NativeWorkspaceQuestionSurfaceProps & {
+    /** Panel that owns this mounted Question. Ownership remains product state. */
+    panel: WorkspaceQuestionSurfacePanel;
+    /** Full Question name used by the Primary header and region label. */
+    questionTitle: string;
+    /** Product-owned Question content inside the approved panel containment. */
+    children: ReactNode;
+    /** Product-owned Composer or ComposerViewTransition for this session. */
+    composer: ReactNode;
+    /**
+     * Scroll owner. Defaults to the consumer so existing Chat viewport logic,
+     * streaming follow, and minimaps remain unchanged.
+     */
+    contentScroll?: WorkspaceQuestionSurfaceScroll;
+    /** Product actions shown beside the Primary Question title. */
+    headerActions?: ReactNode;
+    /** Shows the contextual header. Defaults to true only in Primary. */
+    showHeader?: boolean;
+};
+/**
+ * Session-bound Question layout for either Workspace owner panel. The product
+ * supplies Chat and Composer behavior; this pattern owns the approved header,
+ * scroll containment, bottom anchoring, and adaptive fade.
+ */
+export declare const WorkspaceQuestionSurface: import("react").ForwardRefExoticComponent<NativeWorkspaceQuestionSurfaceProps & {
+    /** Panel that owns this mounted Question. Ownership remains product state. */
+    panel: WorkspaceQuestionSurfacePanel;
+    /** Full Question name used by the Primary header and region label. */
+    questionTitle: string;
+    /** Product-owned Question content inside the approved panel containment. */
+    children: ReactNode;
+    /** Product-owned Composer or ComposerViewTransition for this session. */
+    composer: ReactNode;
+    /**
+     * Scroll owner. Defaults to the consumer so existing Chat viewport logic,
+     * streaming follow, and minimaps remain unchanged.
+     */
+    contentScroll?: WorkspaceQuestionSurfaceScroll;
+    /** Product actions shown beside the Primary Question title. */
+    headerActions?: ReactNode;
+    /** Shows the contextual header. Defaults to true only in Primary. */
+    showHeader?: boolean;
+} & import("react").RefAttributes<HTMLElement>>;
+export {};