@workbench-kit/shell-react 0.0.2-prototype.0.2.6

package/src/field-remap-view.tsx

@@ -0,0 +1,86 @@
+import type { JSX } from 'react';
+import { WorkbenchActionSidebar } from '@workbench-kit/react/layout';
+
+import './field-remap-view.css';
+
+import {
+  FIELD_REMAP_SAMPLES,
+  resolveFieldRemapSampleId,
+  type FieldRemapSampleId,
+} from './field-remap-samples.js';
+import {
+  isSampleFieldRemapViewRenderData,
+  SAMPLE_FIELD_REMAP_VIEW_RENDER_KIND,
+  type SampleFieldRemapViewRenderData,
+} from './field-remap-view-data.js';
+import { useActiveEditorTab, useEditorService } from './use-editor.js';
+
+export type { SampleFieldRemapViewRenderData };
+export { isSampleFieldRemapViewRenderData, SAMPLE_FIELD_REMAP_VIEW_RENDER_KIND };
+
+const FIELD_REMAP_URI_PREFIX = 'workbench://field-remap/' as const;
+
+export function buildFieldRemapEditorUri(sampleId: FieldRemapSampleId | string): string {
+  return `${FIELD_REMAP_URI_PREFIX}${encodeURIComponent(sampleId)}`;
+}
+
+export function parseFieldRemapEditorSampleId(resourceUri: string): FieldRemapSampleId | undefined {
+  if (!resourceUri.startsWith(FIELD_REMAP_URI_PREFIX)) {
+    return undefined;
+  }
+  const encodedId = resourceUri.slice(FIELD_REMAP_URI_PREFIX.length);
+  if (!encodedId) {
+    return undefined;
+  }
+  try {
+    return resolveFieldRemapSampleId(decodeURIComponent(encodedId));
+  } catch {
+    return undefined;
+  }
+}
+
+export interface SampleFieldRemapViewProps {
+  readonly className?: string | undefined;
+}
+
+/** Sidebar: catalog of field-remap / table-mapping samples. */
+export function SampleFieldRemapView({ className }: SampleFieldRemapViewProps = {}): JSX.Element {
+  const editorService = useEditorService();
+  const activeTab = useActiveEditorTab();
+  const activeSampleId = activeTab
+    ? parseFieldRemapEditorSampleId(activeTab.resourceUri)
+    : undefined;
+
+  return (
+    <WorkbenchActionSidebar
+      className={['workbench-field-remap-view', className].filter(Boolean).join(' ')}
+      data-testid="field-remap-view"
+      items={FIELD_REMAP_SAMPLES.map((sample) => ({
+        description: sample.description,
+        icon: <i aria-hidden="true" className="codicon codicon-type-hierarchy" />,
+        id: sample.id,
+        label: sample.title,
+        selected: activeSampleId === sample.id,
+        testId: `field-remap-open-${sample.id}`,
+        title: `Open ${sample.title}`,
+      }))}
+      listProps={{
+        'aria-label': 'Field remap samples',
+        className: 'workbench-field-remap-view__list',
+      }}
+      onSelect={(item) => {
+        const sample = FIELD_REMAP_SAMPLES.find((entry) => entry.id === item.id);
+        if (!sample) {
+          return;
+        }
+        editorService.openEditor({
+          icon: 'codicon-type-hierarchy',
+          pinned: true,
+          preview: false,
+          resourceUri: buildFieldRemapEditorUri(sample.id),
+          title: sample.title,
+        });
+      }}
+    />
+  );
+}

package/src/index.ts

@@ -0,0 +1,199 @@
+export const WORKBENCH_KIT_WORKBENCH_REACT_VERSION = '0.0.0' as const;
+
+export {
+  WorkbenchProvider,
+  useWorkbench,
+  type WorkbenchContextValue,
+  type WorkbenchStorageAdapter,
+  type WorkbenchWorkspaceHostPort,
+} from './provider.js';
+export {
+  WorkbenchDevtoolsPanel,
+  WorkbenchDevtoolsShell,
+  useWorkbenchDevtoolsSnapshot,
+  type WorkbenchDevtoolsShellProps,
+  type WorkbenchDevtoolsSnapshot,
+} from './devtools/index.js';
+export {
+  DEFAULT_WORKBENCH_EDITOR_STATE_STORAGE_KEY,
+  isWorkbenchEditorStatePersistenceAvailable,
+  readPersistedEditorState,
+  writePersistedEditorState,
+} from './editor-state-storage.js';
+export {
+  DEFAULT_WORKBENCH_KEYBINDING_STORAGE_KEY,
+  isWorkbenchKeybindingPersistenceAvailable,
+  readPersistedKeybindingOverrides,
+  writePersistedKeybindingOverrides,
+} from './keybinding-overrides-storage.js';
+export {
+  DEFAULT_WORKBENCH_LOCAL_PREFERENCE_STORAGE_KEY,
+  isWorkbenchLocalPreferencePersistenceAvailable,
+  readPersistedLocalPreferences,
+  writePersistedLocalPreferences,
+} from './preference-settings-storage.js';
+export {
+  DEFAULT_WORKBENCH_LAYOUT_STORAGE_KEY,
+  isWorkbenchLayoutPersistenceAvailable,
+  readPersistedWorkbenchLayout,
+  resolvePersistedWorkbenchLayout,
+  writePersistedWorkbenchLayout,
+} from './workbench-layout-storage.js';
+export {
+  DEFAULT_WORKBENCH_APPEARANCE,
+  DEFAULT_WORKBENCH_APPEARANCE_STORAGE_KEY,
+  isWorkbenchAppearancePersistenceAvailable,
+  readPersistedWorkbenchAppearance,
+  writePersistedWorkbenchAppearance,
+  type WorkbenchAppearanceSettings,
+} from './workbench-appearance-storage.js';
+export {
+  usePersistedWorkbenchAppearance,
+  type UsePersistedWorkbenchAppearanceOptions,
+} from './use-persisted-workbench-appearance.js';
+export {
+  createWorkspaceResourceStatusItems,
+  mergeWorkbenchStatusSections,
+  type WorkspaceResourceStatusItemsInput,
+} from './workbench-status-sections.js';
+export { EditorArea, type EditorAreaProps, type EditorViewMode } from './editor-area.js';
+export {
+  DEFAULT_EDITOR_DOCUMENT_VIEW_PROVIDERS,
+  EditorDocumentViewProviderRegistry,
+  JDW_PREVIEW_PROVIDER_ID,
+  JDW_WIDGET_FORM_PROVIDER_ID,
+  JSON_FORM_PROVIDER,
+  JSON_FORM_PROVIDER_ID,
+  createEditorDocumentViewProviderRegistry,
+  resolveEditorDocumentViewProvider,
+  resolveEditorDocumentViews,
+  type CreateEditorDocumentViewProviderRegistryOptions,
+  type EditorDocumentContext,
+  type EditorDocumentViewKind,
+  type EditorDocumentViewProvider,
+  type EditorDocumentViewRenderContext,
+  type ResolvedEditorDocumentViews,
+} from './editor-view-providers.js';
+export { SampleJdwLabView, type SampleJdwLabViewProps } from './jdw-lab-view.js';
+export { JdwWidgetFormView, type JdwWidgetFormViewProps } from './jdw-widget-form-view.js';
+export { JdwWidgetPreviewView, type JdwWidgetPreviewViewProps } from './jdw-widget-preview-view.js';
+export {
+  isSampleJdwLabViewRenderData,
+  SAMPLE_JDW_LAB_VIEW_RENDER_KIND,
+  type SampleJdwLabViewRenderData,
+} from './jdw-lab-view-data.js';
+export { SampleFieldRemapDemo, type SampleFieldRemapDemoProps } from './field-remap-demo.js';
+export { FieldRemapPanel, type FieldRemapPanelProps } from './field-remap-panel.js';
+export { FieldRemapFlowMapper, type FieldRemapFlowMapperProps } from './field-remap-flow.js';
+export {
+  FIELD_REMAP_SAMPLES,
+  getFieldRemapSample,
+  isFieldRemapSampleId,
+  resolveFieldRemapSampleId,
+  type FieldRemapSampleDefinition,
+  type FieldRemapSampleId,
+} from './field-remap-samples.js';
+export {
+  SampleFieldRemapView,
+  buildFieldRemapEditorUri,
+  parseFieldRemapEditorSampleId,
+  type SampleFieldRemapViewProps,
+} from './field-remap-view.js';
+export {
+  isSampleFieldRemapViewRenderData,
+  SAMPLE_FIELD_REMAP_VIEW_RENDER_KIND,
+  type SampleFieldRemapViewRenderData,
+} from './field-remap-view-data.js';
+export {
+  FieldRemapEditorSurface,
+  type FieldRemapEditorSurfaceId,
+  type FieldRemapEditorSurfaceProps,
+} from './field-remap-editor-surface.js';
+export {
+  WorkbenchShell,
+  type WorkbenchLocaleOption,
+  type WorkbenchShellProps,
+  type WorkbenchThemeOption,
+} from './shell.js';
+export {
+  getWorkbenchCommandPaletteShortcutLabel,
+  getWorkbenchQuickAccessShortcutLabel,
+  WORKBENCH_COMMAND_PALETTE_SHORTCUT,
+  WORKBENCH_QUICK_ACCESS_SHORTCUT,
+  buildWorkbenchPaletteCommands,
+  matchesWorkbenchCommandPaletteShortcut,
+  matchesWorkbenchQuickAccessShortcut,
+  mergeWorkbenchCommandDescriptors,
+  resolveShellCommandActivities,
+} from './workbench-command-palette.js';
+export { WorkbenchCommandHost, type WorkbenchCommandHostProps } from './workbench-command-host.js';
+export { WorkbenchStartupGate, type WorkbenchStartupGateProps } from './workbench-startup-gate.js';
+export {
+  normalizeKeybindingKeyFromEvent,
+  resolveExtensionKeybindingCommand,
+} from './workbench-keybinding-bridge.js';
+export {
+  parseWorkbenchChatCommandInput,
+  type WorkbenchChatCommandInputParseResult,
+} from './chat-command-input.js';
+export {
+  useWorkbenchChatCommandSurface,
+  type WorkbenchChatCommandRunResult,
+  type WorkbenchChatCommandSurfaceOptions,
+} from './chat-command-surface.js';
+export { useWorkbenchCommandDescriptors } from './use-workbench-command-descriptors.js';
+export {
+  executeWorkbenchUserCommandAction,
+  registerWorkbenchUserCommands,
+} from './workbench-user-commands.js';
+export {
+  createWorkbenchHostThemeRegistration,
+  HOST_WORKBENCH_THEME_EXTENSION_ID,
+  registerHostWorkbenchThemes,
+  registerWorkbenchTheme,
+  REQUIRED_THEME_TOKEN_KEYS,
+  type RegisterWorkbenchThemeOptions,
+  type WorkbenchHostThemeMode,
+  type WorkbenchHostThemeRegistration,
+} from '@workbench-kit/workbench-core';
+export {
+  useActiveEditorTab,
+  useEditorDocumentViewProviders,
+  useEditorHost,
+  useEditorService,
+  useEditorState,
+} from './use-editor.js';
+export { isWorkspaceResourceService, useWorkspaceResourceState } from './workspace-view-state.js';
+export {
+  MANAGE_ACCOUNTS_COMMAND_ID,
+  MANAGE_COMMANDS_COMMAND_ID,
+  MANAGE_EXTENSIONS_COMMAND_ID,
+  MANAGE_KEYBINDINGS_COMMAND_ID,
+  WORKBENCH_ACCOUNTS_SETTINGS_CATEGORY_ID,
+  WORKBENCH_COMMANDS_SETTINGS_CATEGORY_ID,
+  WORKBENCH_EXTENSIONS_SETTINGS_CATEGORY_ID,
+  WORKBENCH_KEYBINDINGS_SETTINGS_CATEGORY_ID,
+} from './management-settings-ids.js';
+export { createWorkbenchManagementPaletteCommands } from './management-palette-commands.js';
+export {
+  WorkbenchAccountManagementSettings,
+  WorkbenchCommandManagementSettings,
+  WorkbenchExtensionManagementSettings,
+  WorkbenchKeybindingManagementSettings,
+  type WorkbenchAccountManagementInput,
+} from './management-settings.js';
+export {
+  WORKBENCH_PROFILE_ACTIVITY_ITEM_ID,
+  WORKBENCH_ACCOUNT_ACTIVITY_ITEM_ID,
+  WORKBENCH_SETTINGS_ACTIVITY_ITEM_ID,
+  createWorkbenchSecondaryActivityItems,
+  getWorkbenchSecondaryActivityRoute,
+  type WorkbenchSecondaryActivityItemsInput,
+  type WorkbenchSecondaryActivityRoute,
+} from './shell-secondary-actions.js';
+export {
+  WorkbenchProfileModal,
+  type WorkbenchProfileDetail,
+  type WorkbenchProfileInput,
+  type WorkbenchProfileModalProps,
+} from './workbench-profile-modal.js';

package/src/jdw-lab-view-data.ts

@@ -0,0 +1,25 @@
+export const SAMPLE_JDW_LAB_VIEW_RENDER_KIND = 'workbench-kit.samples.jdw.view' as const;
+
+export interface SampleJdwLabViewRenderData {
+  readonly kind: typeof SAMPLE_JDW_LAB_VIEW_RENDER_KIND;
+  readonly templateJdwPath: string;
+  readonly widgetTreePath: string;
+}
+
+export function isSampleJdwLabViewRenderData(value: unknown): value is SampleJdwLabViewRenderData {
+  if (typeof value !== 'object' || value === null) {
+    return false;
+  }
+
+  const candidate = value as {
+    kind?: unknown;
+    templateJdwPath?: unknown;
+    widgetTreePath?: unknown;
+  };
+
+  return (
+    candidate.kind === SAMPLE_JDW_LAB_VIEW_RENDER_KIND &&
+    typeof candidate.templateJdwPath === 'string' &&
+    typeof candidate.widgetTreePath === 'string'
+  );
+}

package/src/jdw-lab-view.css

@@ -0,0 +1,21 @@
+.workbench-jdw-lab-view {
+  height: 100%;
+  min-height: 0;
+}
+
+.workbench-jdw-lab-view__list {
+  padding-block: 4px;
+}
+
+.workbench-jdw-lab-view .ui-workbench-action-list-item__description {
+  font-family: var(
+    --monaco-monospace-font,
+    ui-monospace,
+    SFMono-Regular,
+    Menlo,
+    Consolas,
+    monospace
+  );
+  font-size: 11px;
+  opacity: 0.85;
+}

package/src/jdw-lab-view.tsx

@@ -0,0 +1,79 @@
+import { WorkbenchActionSidebar } from '@workbench-kit/react/layout';
+
+import './jdw-lab-view.css';
+
+import { useWorkbench } from './provider.js';
+import { useActiveEditorTab } from './use-editor.js';
+import { useActiveWorkspacePath } from './use-active-workspace-path.js';
+import {
+  isSampleJdwLabViewRenderData,
+  SAMPLE_JDW_LAB_VIEW_RENDER_KIND,
+  type SampleJdwLabViewRenderData,
+} from './jdw-lab-view-data.js';
+
+export type { SampleJdwLabViewRenderData };
+export { isSampleJdwLabViewRenderData, SAMPLE_JDW_LAB_VIEW_RENDER_KIND };
+
+const WORKSPACE_OPEN_COMMAND_ID = 'workspace.open' as const;
+
+const DEFAULT_WIDGET_TREE_PATH = 'jdw/showcase/example.jdw.json';
+const DEFAULT_TEMPLATE_JDW_PATH = 'jdw/templates/analytics-dashboard.jdw.json';
+
+export interface SampleJdwLabViewProps {
+  readonly templateJdwPath?: string | undefined;
+  readonly widgetTreePath?: string | undefined;
+}
+
+function pathMatches(activePath: string | undefined, candidate: string): boolean {
+  if (!activePath) {
+    return false;
+  }
+
+  return activePath === candidate || activePath.endsWith(`/${candidate}`);
+}
+
+export function SampleJdwLabView({
+  templateJdwPath = DEFAULT_TEMPLATE_JDW_PATH,
+  widgetTreePath = DEFAULT_WIDGET_TREE_PATH,
+}: SampleJdwLabViewProps = {}) {
+  const { executeCommand } = useWorkbench();
+  const activeTab = useActiveEditorTab();
+  const activePath = useActiveWorkspacePath(activeTab?.resourceUri);
+
+  return (
+    <WorkbenchActionSidebar
+      className="workbench-jdw-lab-view"
+      data-testid="jdw-lab-view"
+      items={[
+        {
+          description: widgetTreePath,
+          icon: <i aria-hidden="true" className="codicon codicon-layout" />,
+          id: 'widget-tree',
+          label: 'Widget Tree',
+          selected: pathMatches(activePath, widgetTreePath),
+          testId: 'jdw-lab-open-widget-tree',
+          title: `Open ${widgetTreePath}`,
+        },
+        {
+          description: templateJdwPath,
+          icon: <i aria-hidden="true" className="codicon codicon-symbol-structure" />,
+          id: 'template-jdw',
+          label: 'Template JDW',
+          selected: pathMatches(activePath, templateJdwPath),
+          testId: 'jdw-lab-open-template-jdw',
+          title: `Open ${templateJdwPath}`,
+        },
+      ]}
+      listProps={{
+        'aria-label': 'JDW lab surfaces',
+        className: 'workbench-jdw-lab-view__list',
+      }}
+      onSelect={(item) => {
+        if (typeof item.description !== 'string' || item.description.length === 0) {
+          return;
+        }
+        void executeCommand(WORKSPACE_OPEN_COMMAND_ID, { path: item.description });
+      }}
+    />
+  );
+}

package/src/jdw-widget-form-view.tsx

@@ -0,0 +1,65 @@
+import { useCallback, useMemo } from 'react';
+import { resolveWidgetStudioAssetCatalog } from '@workbench-kit/react/widget-studio';
+import { WidgetTreeLab } from '@workbench-kit/react/widget-tree';
+import { BUILTIN_JDW_REGISTRY } from '@workbench-kit/react/jdw';
+
+import { useWorkbench } from './provider.js';
+import { isWorkspaceResourceService, useWorkspaceResourceState } from './workspace-view-state.js';
+
+export interface JdwWidgetFormViewProps {
+  readonly path: string;
+  readonly content: string;
+  readonly onContentChange: (content: string) => void;
+}
+
+const EMPTY_WORKSPACE_FILES: readonly { readonly path: string; readonly content: string }[] = [];
+
+/**
+ * Form authoring surface for JDW widgets. Builds the Assets palette from built-in
+ * assets, workspace asset packages, and other workspace `*.jdw.json` documents.
+ * Preview expands `type: "ref"` via workspace documents without rewriting the
+ * authored JSON outline.
+ */
+export function JdwWidgetFormView({ path, content, onContentChange }: JdwWidgetFormViewProps) {
+  const { workspaceHostPort } = useWorkbench();
+  const workspaceService = isWorkspaceResourceService(workspaceHostPort?.service)
+    ? workspaceHostPort.service
+    : undefined;
+  const workspaceState = useWorkspaceResourceState(workspaceService);
+  const files =
+    workspaceState?.files ?? workspaceService?.getState().files ?? EMPTY_WORKSPACE_FILES;
+
+  const filesByPath = useMemo(() => {
+    const map = new Map<string, string>();
+    for (const file of files) {
+      map.set(file.path.replace(/\\/g, '/'), file.content);
+    }
+    return map;
+  }, [files]);
+
+  const loadDocument = useCallback(
+    (documentPath: string) => filesByPath.get(documentPath.replace(/\\/g, '/')) ?? null,
+    [filesByPath],
+  );
+
+  const assetCatalog = useMemo(
+    () =>
+      resolveWidgetStudioAssetCatalog(files, {
+        excludeDocumentPaths: [path],
+      }),
+    [files, path],
+  );
+
+  return (
+    <WidgetTreeLab
+      assetCatalog={assetCatalog}
+      loadDocument={loadDocument}
+      path={path}
+      registry={BUILTIN_JDW_REGISTRY}
+      showDesignSource={false}
+      value={content}
+      viewMode="design"
+      onChange={onContentChange}
+    />
+  );
+}

package/src/jdw-widget-preview-view.tsx

@@ -0,0 +1,51 @@
+import { useCallback, useMemo } from 'react';
+import { JdwPreviewViewport } from '@workbench-kit/react/jdw/preview-viewport';
+import { BUILTIN_JDW_REGISTRY } from '@workbench-kit/react/jdw';
+
+import { useWorkbench } from './provider.js';
+import { isWorkspaceResourceService, useWorkspaceResourceState } from './workspace-view-state.js';
+
+export interface JdwWidgetPreviewViewProps {
+  readonly path: string;
+  readonly content: string;
+  readonly className?: string | undefined;
+}
+
+const EMPTY_WORKSPACE_FILES: readonly { readonly path: string; readonly content: string }[] = [];
+
+/**
+ * Preview viewport for JDW documents. Expands workspace `type: "ref"` imports
+ * before layout/draw without rewriting the source buffer.
+ */
+export function JdwWidgetPreviewView({ path, content, className }: JdwWidgetPreviewViewProps) {
+  const { workspaceHostPort } = useWorkbench();
+  const workspaceService = isWorkspaceResourceService(workspaceHostPort?.service)
+    ? workspaceHostPort.service
+    : undefined;
+  const workspaceState = useWorkspaceResourceState(workspaceService);
+  const files =
+    workspaceState?.files ?? workspaceService?.getState().files ?? EMPTY_WORKSPACE_FILES;
+
+  const filesByPath = useMemo(() => {
+    const map = new Map<string, string>();
+    for (const file of files) {
+      map.set(file.path.replace(/\\/g, '/'), file.content);
+    }
+    return map;
+  }, [files]);
+
+  const loadDocument = useCallback(
+    (documentPath: string) => filesByPath.get(documentPath.replace(/\\/g, '/')) ?? null,
+    [filesByPath],
+  );
+
+  return (
+    <JdwPreviewViewport
+      className={className}
+      documentPath={path}
+      json={content}
+      loadDocument={loadDocument}
+      registry={BUILTIN_JDW_REGISTRY}
+    />
+  );
+}