@genesislcap/foundation-workspace 14.406.0-workspaces.8 → 14.412.0

package/dist/foundation-workspace.api.json

@@ -805,8 +805,8 @@
             },
             {
               "kind": "Reference",
-              "text": "HTMLElement",
-              "canonicalReference": "!HTMLElement:interface"
+              "text": "FoundationElement",
+              "canonicalReference": "@microsoft/fast-foundation!FoundationElement:class"
             },
             {
               "kind": "Content",
@@ -819,6 +819,36 @@
           "name": "GridRegister",
           "preserveMemberOrder": false,
           "members": [
+            {
+              "kind": "Property",
+              "canonicalReference": "@genesislcap/foundation-workspace!GridRegister#designSystemPrefix:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "designSystemPrefix: "
+                },
+                {
+                  "kind": "Content",
+                  "text": "string"
+                },
+                {
+                  "kind": "Content",
+                  "text": ";"
+                }
+              ],
+              "isReadonly": false,
+              "isOptional": false,
+              "releaseTag": "Alpha",
+              "name": "designSystemPrefix",
+              "propertyTypeTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "isStatic": false,
+              "isProtected": false,
+              "isAbstract": false
+            },
             {
               "kind": "Property",
               "canonicalReference": "@genesislcap/foundation-workspace!GridRegister#gridKey:member",
@@ -1669,8 +1699,8 @@
             },
             {
               "kind": "Reference",
-              "text": "HTMLElement",
-              "canonicalReference": "!HTMLElement:interface"
+              "text": "FoundationElement",
+              "canonicalReference": "@microsoft/fast-foundation!FoundationElement:class"
             },
             {
               "kind": "Content",
@@ -1683,6 +1713,36 @@
           "name": "LayoutWrapper",
           "preserveMemberOrder": false,
           "members": [
+            {
+              "kind": "Property",
+              "canonicalReference": "@genesislcap/foundation-workspace!LayoutWrapper#designSystemPrefix:member",
+              "docComment": "",
+              "excerptTokens": [
+                {
+                  "kind": "Content",
+                  "text": "designSystemPrefix: "
+                },
+                {
+                  "kind": "Content",
+                  "text": "string"
+                },
+                {
+                  "kind": "Content",
+                  "text": ";"
+                }
+              ],
+              "isReadonly": false,
+              "isOptional": false,
+              "releaseTag": "Alpha",
+              "name": "designSystemPrefix",
+              "propertyTypeTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "isStatic": false,
+              "isProtected": false,
+              "isAbstract": false
+            },
             {
               "kind": "Property",
               "canonicalReference": "@genesislcap/foundation-workspace!LayoutWrapper#layoutKey:member",

package/dist/foundation-workspace.d.ts

@@ -1,8 +1,8 @@
 import { Auth } from '@genesislcap/foundation-comms';
 import type { ColumnApi } from '@ag-grid-community/core';
 import { Connect } from '@genesislcap/foundation-comms';
-import type { Container } from '@microsoft/fast-foundation';
-import { FoundationElement } from '@microsoft/fast-foundation';
+import type { Container } from '@genesislcap/web-core';
+import { FoundationElement } from '@genesislcap/web-core';
 import type { FoundationLayout } from '@genesislcap/foundation-layout';
 import type { GridApi } from '@ag-grid-community/core';
 import { InterfaceSymbol } from '@microsoft/fast-foundation';
@@ -35,7 +35,7 @@ export declare class DefaultGridRegistry implements GridRegistry {
         applyColumns?: boolean;
         applyFilters?: boolean;
     }): Promise<boolean>;
-    applyAllGridsSettings(gridsSettings: SavedGridSettings[], maxRetries?: number, delayMs?: number): Promise<void>;
+    applyAllGridsSettings(gridsSettings: SavedGridSettings[], maxRetries?: number): Promise<void>;
     private getGridSettings;
 }
 
@@ -106,14 +106,14 @@ export declare const FilterRegistry: InterfaceSymbol<FilterRegistry>;
  * Registers an AG Grid instance so workspace state can apply/load it.
  * @alpha
  */
-export declare class GridRegister extends HTMLElement {
+export declare class GridRegister extends FoundationElement {
     gridKey: string;
+    designSystemPrefix: string;
     gridRegistry: GridRegistry;
     workspaceState: WorkspaceState;
     private gridElement;
     private gridApi;
     private columnApi;
-    private workspaceSettingsApplied;
     connectedCallback(): void;
     disconnectedCallback(): void;
     private findAndRegisterGrid;
@@ -133,15 +133,6 @@ export declare interface GridRegistration {
     columnApi: ColumnApi;
 }
 
-/**
- * @alpha
- */
-export declare interface GridRegistration {
-    gridKey: string;
-    gridApi: GridApi;
-    columnApi: ColumnApi;
-}
-
 /**
  * @alpha
  */
@@ -183,8 +174,9 @@ export declare const LayoutRegistry: InterfaceSymbol<LayoutRegistry>;
  * Registers a layout instance so workspace state can apply/load it.
  * @alpha
  */
-export declare class LayoutWrapper extends HTMLElement {
+export declare class LayoutWrapper extends FoundationElement {
     layoutKey: string;
+    designSystemPrefix: string;
     layoutRegistry: LayoutRegistry;
     private layoutElement;
     connectedCallback(): void;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/foundation-workspace",
   "description": "Genesis Foundation Workspace Components and State",
-  "version": "14.406.0-workspaces.8",
+  "version": "14.412.0",
   "sideEffects": false,
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
@@ -37,26 +37,23 @@
     }
   },
   "devDependencies": {
-    "@genesislcap/foundation-testing": "14.406.0-workspaces.8",
-    "@genesislcap/genx": "14.406.0-workspaces.8",
-    "@genesislcap/rollup-builder": "14.406.0-workspaces.8",
-    "@genesislcap/ts-builder": "14.406.0-workspaces.8",
-    "@genesislcap/uvu-playwright-builder": "14.406.0-workspaces.8",
-    "@genesislcap/vite-builder": "14.406.0-workspaces.8",
-    "@genesislcap/webpack-builder": "14.406.0-workspaces.8"
+    "@genesislcap/foundation-testing": "14.412.0",
+    "@genesislcap/genx": "14.412.0",
+    "@genesislcap/rollup-builder": "14.412.0",
+    "@genesislcap/ts-builder": "14.412.0",
+    "@genesislcap/uvu-playwright-builder": "14.412.0",
+    "@genesislcap/vite-builder": "14.412.0",
+    "@genesislcap/webpack-builder": "14.412.0"
   },
   "dependencies": {
     "@ag-grid-community/core": "29.2.0",
-    "@genesislcap/foundation-comms": "14.406.0-workspaces.8",
-    "@genesislcap/foundation-layout": "14.406.0-workspaces.8",
-    "@genesislcap/foundation-notifications": "14.406.0-workspaces.8",
-    "@genesislcap/foundation-ui": "14.406.0-workspaces.8",
-    "@genesislcap/foundation-utils": "14.406.0-workspaces.8",
-    "@genesislcap/grid-pro": "14.406.0-workspaces.8",
-    "@genesislcap/web-core": "14.406.0-workspaces.8",
-    "@microsoft/fast-components": "2.30.6",
-    "@microsoft/fast-element": "1.14.0",
-    "@microsoft/fast-foundation": "2.50.0"
+    "@genesislcap/foundation-comms": "14.412.0",
+    "@genesislcap/foundation-layout": "14.412.0",
+    "@genesislcap/foundation-notifications": "14.412.0",
+    "@genesislcap/foundation-ui": "14.412.0",
+    "@genesislcap/foundation-utils": "14.412.0",
+    "@genesislcap/grid-pro": "14.412.0",
+    "@genesislcap/web-core": "14.412.0"
   },
   "repository": {
     "type": "git",
@@ -67,5 +64,5 @@
     "access": "public"
   },
   "customElements": "dist/custom-elements.json",
-  "gitHead": "9c4f7249d2cfd373b15debe85075ed4d4519e360"
+  "gitHead": "b759370097c295bea2a87d6f3a132ec6dba807ca"
 }

package/src/workspace/filter-registry.ts

@@ -1,4 +1,4 @@
-import { DI } from '@microsoft/fast-foundation';
+import { DI } from '@genesislcap/web-core';
 import type { SavedFilterValue } from './workspace.types';
 
 /**

package/src/workspace/grid-register/grid-register.template.ts

@@ -1,5 +1,4 @@
-import { html } from '@microsoft/fast-element';
-import type { ViewTemplate } from '@microsoft/fast-element';
+import { html, ViewTemplate } from '@genesislcap/web-core';
 import type { GridRegister } from './grid-register';
 
 export const GridRegisterTemplate: ViewTemplate<GridRegister> = html`

package/src/workspace/grid-register/grid-register.ts

@@ -1,7 +1,8 @@
 import type { ColumnApi, GridApi } from '@ag-grid-community/core';
 import type { GridPro } from '@genesislcap/grid-pro';
-import { attr, customElement } from '@microsoft/fast-element';
-import { GridRegistry, WorkspaceState } from '..';
+import { FoundationElement, attr, customElement } from '@genesislcap/web-core';
+import { GridRegistry } from '../grid-registry';
+import { WorkspaceState } from '../workspace-state';
 import { GridRegisterTemplate as template } from './grid-register.template';
 
 const name = 'grid-register';
@@ -14,8 +15,9 @@ const name = 'grid-register';
   name,
   template,
 })
-export class GridRegister extends HTMLElement {
+export class GridRegister extends FoundationElement {
   @attr({ attribute: 'grid-key' }) gridKey: string;
+  @attr({ attribute: 'design-system-prefix' }) designSystemPrefix: string = 'rapid';
 
   @GridRegistry gridRegistry: GridRegistry;
   @WorkspaceState workspaceState: WorkspaceState;
@@ -23,13 +25,14 @@ export class GridRegister extends HTMLElement {
   private gridElement: GridPro | null = null;
   private gridApi: GridApi | null = null;
   private columnApi: ColumnApi | null = null;
-  private workspaceSettingsApplied: boolean = false;
 
   connectedCallback(): void {
+    super.connectedCallback();
     this.findAndRegisterGrid();
   }
 
   disconnectedCallback(): void {
+    super.disconnectedCallback();
     if (this.gridKey) {
       this.gridRegistry.unregisterGrid(this.gridKey);
     }
@@ -38,20 +41,21 @@ export class GridRegister extends HTMLElement {
   }
 
   private findAndRegisterGrid(): void {
-    this.gridElement = this.querySelector('rapid-grid-pro') as GridPro;
+    const gridTag = `${this.designSystemPrefix}-grid-pro`;
+    this.gridElement = this.querySelector(gridTag) as GridPro;
 
     if (this.gridElement) {
       this.gridElement.addEventListener('gridReady', this.handleGridReady as EventListener);
       this.attachToGridApis();
     } else {
       setTimeout(() => {
-        this.gridElement = this.querySelector('rapid-grid-pro') as GridPro;
+        this.gridElement = this.querySelector(gridTag) as GridPro;
 
         if (this.gridElement) {
           this.gridElement.addEventListener('gridReady', this.handleGridReady as EventListener);
           this.attachToGridApis();
         } else {
-          console.warn(`grid-register: rapid-grid-pro element not found`);
+          console.warn(`grid-register: ${gridTag} element not found`);
         }
       }, 100);
     }
@@ -77,19 +81,16 @@ export class GridRegister extends HTMLElement {
     this.gridApi = gridApi;
     this.columnApi = columnApi;
 
-    const effectiveGridKey = persistKey;
-    if (!effectiveGridKey) {
+    if (!persistKey) {
       console.warn('grid-register: missing persist-column-state-key; grid state will not be saved');
     } else {
-      this.gridRegistry.registerGrid(effectiveGridKey, gridApi, columnApi);
-      this.gridKey = effectiveGridKey;
+      this.gridRegistry.registerGrid(persistKey, gridApi, columnApi);
+      this.gridKey = persistKey;
     }
 
-    if (!this.workspaceSettingsApplied && this.gridApi) {
-      this.loadWorkspaceColumnState().catch((error) => {
-        console.warn(`Failed to apply column state for ${this.gridKey} on gridReady:`, error);
-      });
-    }
+    this.loadWorkspaceColumnState().catch((error) => {
+      console.warn(`Failed to apply column state for ${this.gridKey} on gridReady:`, error);
+    });
   }
 
   private detachFromGridApis(): void {

package/src/workspace/grid-registry.ts

@@ -1,5 +1,5 @@
 import type { ColumnApi, GridApi } from '@ag-grid-community/core';
-import { DI } from '@microsoft/fast-foundation';
+import { DI } from '@genesislcap/web-core';
 import type { SavedGridSettings } from './workspace.types';
 
 /**
@@ -26,15 +26,6 @@ export interface GridRegistry {
   applyAllGridsSettings(gridsSettings: SavedGridSettings[]): Promise<void>;
 }
 
-/**
- * @alpha
- */
-export interface GridRegistration {
-  gridKey: string;
-  gridApi: GridApi;
-  columnApi: ColumnApi;
-}
-
 /**
  * @alpha
  */
@@ -84,7 +75,7 @@ export class DefaultGridRegistry implements GridRegistry {
   ): Promise<boolean> {
     const gridRegistration = this.grids.get(gridSetting.gridKey);
 
-    if (!gridRegistration || !gridRegistration.columnApi || !gridRegistration.gridApi) {
+    if (!gridRegistration || (!gridRegistration.columnApi && !gridRegistration.gridApi)) {
       return false;
     }
 
@@ -99,10 +90,23 @@ export class DefaultGridRegistry implements GridRegistry {
 
     try {
       if (shouldApplyColumns) {
-        gridRegistration.columnApi.applyColumnState({
-          state: gridSetting.columnState,
-          applyOrder: true,
-        });
+        // Prefer Grid API if available, otherwise fall back to Column API.
+        // (AG Grid's Column API definitely supports applyColumnState; this is defensive.)
+        const applyColumnStateFn =
+          (gridRegistration.gridApi as any)?.applyColumnState?.bind(gridRegistration.gridApi) ??
+          (gridRegistration.columnApi as any)?.applyColumnState?.bind(gridRegistration.columnApi);
+
+        if (applyColumnStateFn) {
+          applyColumnStateFn({
+            state: gridSetting.columnState,
+            applyOrder: true,
+          });
+        } else {
+          console.warn(
+            `GridRegistry: applyColumnState not found for ${gridSetting.gridKey} (gridApi/columnApi)`,
+          );
+          return false;
+        }
       }
 
       return true;
@@ -115,7 +119,6 @@ export class DefaultGridRegistry implements GridRegistry {
   async applyAllGridsSettings(
     gridsSettings: SavedGridSettings[],
     maxRetries: number = 3,
-    delayMs: number = 200,
   ): Promise<void> {
     // eslint-disable-next-line no-plusplus
     for (let attempt = 0; attempt < maxRetries; attempt++) {
@@ -134,14 +137,16 @@ export class DefaultGridRegistry implements GridRegistry {
         break;
       }
 
-      // await new Promise((resolve) => setTimeout(resolve, delayMs));
       gridsSettings = remainingSettings;
     }
   }
 
   private getGridSettings(gridKey: string, grid: GridRegistration): SavedGridSettings | null {
     if (grid) {
-      const columnState = grid.columnApi?.getColumnState();
+      // Prefer Grid API if available, otherwise fall back to Column API.
+      // (AG Grid's Column state is typically on ColumnApi; this is defensive.)
+      const columnState =
+        (grid.gridApi as any)?.getColumnState?.() ?? grid.columnApi?.getColumnState();
       const columnCount = columnState?.length || 0;
 
       console.log(`Saved grid settings for ${gridKey}: ${columnCount} columns`);

package/src/workspace/layout-registry.ts

@@ -1,5 +1,5 @@
 import type { FoundationLayout } from '@genesislcap/foundation-layout';
-import { DI } from '@microsoft/fast-foundation';
+import { DI } from '@genesislcap/web-core';
 import type { SavedLayout } from './workspace.types';
 
 const LAYOUT_DELAY = 300;

package/src/workspace/layout-wrapper/layout-wrapper.template.ts

@@ -1,5 +1,4 @@
-import { html } from '@microsoft/fast-element';
-import type { ViewTemplate } from '@microsoft/fast-element';
+import { html, ViewTemplate } from '@genesislcap/web-core';
 import type { LayoutWrapper } from './layout-wrapper';
 
 export const LayoutWrapperTemplate: ViewTemplate<LayoutWrapper> = html`

package/src/workspace/layout-wrapper/layout-wrapper.ts

@@ -1,6 +1,6 @@
 import type { FoundationLayout } from '@genesislcap/foundation-layout';
-import { attr, customElement } from '@microsoft/fast-element';
-import { LayoutRegistry } from '..';
+import { FoundationElement, attr, customElement } from '@genesislcap/web-core';
+import { LayoutRegistry } from '../layout-registry';
 import { LayoutWrapperTemplate as template } from './layout-wrapper.template';
 
 const name = 'layout-register';
@@ -13,18 +13,21 @@ const name = 'layout-register';
   name,
   template,
 })
-export class LayoutWrapper extends HTMLElement {
+export class LayoutWrapper extends FoundationElement {
   @attr({ attribute: 'layout-key' }) layoutKey: string;
+  @attr({ attribute: 'design-system-prefix' }) designSystemPrefix: string = 'rapid';
 
   @LayoutRegistry layoutRegistry: LayoutRegistry;
 
   private layoutElement: FoundationLayout | null = null;
 
   connectedCallback(): void {
+    super.connectedCallback();
     this.findAndRegisterLayout();
   }
 
   disconnectedCallback(): void {
+    super.disconnectedCallback();
     const layoutKey =
       this.layoutElement?.autoSaveKey ??
       this.layoutElement?.getAttribute?.('auto-save-key') ??
@@ -36,11 +39,12 @@ export class LayoutWrapper extends HTMLElement {
   }
 
   private findAndRegisterLayout(): void {
-    let layoutElement = this.querySelector('rapid-layout') as FoundationLayout;
+    const layoutTag = `${this.designSystemPrefix}-layout`;
+    let layoutElement = this.querySelector(layoutTag) as FoundationLayout;
 
     const registerLayout = (layout: FoundationLayout | null) => {
       if (!layout) {
-        console.warn(`layout-register: rapid-layout element not found`);
+        console.warn(`layout-register: ${layoutTag} element not found`);
         return;
       }
       this.layoutElement = layout;
@@ -59,7 +63,7 @@ export class LayoutWrapper extends HTMLElement {
       registerLayout(layoutElement);
     } else {
       setTimeout(() => {
-        layoutElement = this.querySelector('rapid-layout') as FoundationLayout;
+        layoutElement = this.querySelector(layoutTag) as FoundationLayout;
         registerLayout(layoutElement);
       }, 100);
     }

package/src/workspace/workspace-state.ts

@@ -4,7 +4,7 @@ import {
   type KVStorage as KVStorageType,
   type Auth as AuthType,
 } from '@genesislcap/foundation-comms';
-import { DI } from '@microsoft/fast-foundation';
+import { DI } from '@genesislcap/web-core';
 import type { SavedWorkspace } from './workspace-state.types';
 import type { SavedFilterValue, SavedGridSettings, SavedLayout } from './workspace.types';
 

package/src/workspace-components.ts

@@ -1,4 +1,4 @@
-import type { Container } from '@microsoft/fast-foundation';
+import type { Container } from '@genesislcap/web-core';
 
 // Import the custom elements so their `@customElement` decorators run and define tags.
 import { LayoutWrapper, GridRegister } from './workspace';

package/src/workspace-manager/workspace-manager.styles.ts

@@ -1,4 +1,4 @@
-import { css } from '@microsoft/fast-element';
+import { css } from '@genesislcap/web-core';
 
 export const WorkspaceManagerStyles = css`
   .workspace-manager {
@@ -64,6 +64,7 @@ export const WorkspaceManagerStyles = css`
     cursor: pointer;
     display: flex;
     align-items: center;
+    gap: 5px;
   }
 
   .workspace-item:hover {
@@ -101,30 +102,6 @@ export const WorkspaceManagerStyles = css`
     line-height: 1.4;
   }
 
-  .workspace-description-input {
-    width: 100%;
-    min-height: 60px;
-    padding: 8px 12px;
-    margin-bottom: 16px;
-    font-family: inherit;
-    font-size: 14px;
-    border: 1px solid var(--neutral-stroke-rest);
-    border-radius: 4px;
-    background: var(--neutral-fill-rest);
-    color: var(--neutral-foreground-rest);
-    resize: vertical;
-    box-sizing: border-box;
-  }
-
-  .workspace-description-input::placeholder {
-    color: var(--neutral-foreground-hint);
-  }
-
-  .workspace-description-input:focus {
-    outline: none;
-    border-color: var(--accent-fill-rest);
-  }
-
   .loading-container {
     display: flex;
     flex-direction: column;

package/src/workspace-manager/workspace-manager.template.ts

@@ -1,11 +1,11 @@
 import { sync, whenElse } from '@genesislcap/foundation-utils';
-import { ExecutionContext, html, ref, repeat, when } from '@microsoft/fast-element';
+import { ExecutionContext, html, ref, repeat, ViewTemplate, when } from '@genesislcap/web-core';
 import { SavedWorkspace, SharedWorkspace } from '../workspace/workspace-state.types';
 import type { WorkspaceManager } from './workspace-manager';
 
 export const WORKSPACE_DESCRIPTION_MAX = 200;
 
-export const WorkspaceManagerTemplate = html<WorkspaceManager>`
+export const workspaceHeaderPartial: ViewTemplate<WorkspaceManager> = html`
   <div class="workspace-manager">
     <rapid-button @click=${(x) => x.openSaveDialog()}>
       <rapid-icon name="download"></rapid-icon>
@@ -16,6 +16,9 @@ export const WorkspaceManagerTemplate = html<WorkspaceManager>`
       Load Workspace
     </rapid-button>
   </div>
+`;
+
+export const workspaceSaveModalPartial: ViewTemplate<WorkspaceManager> = html`
   <rapid-modal ${ref('saveModal')}>
     <h2 slot="top">Save Workspace</h2>
     <div class="dialog-content">
@@ -44,14 +47,15 @@ export const WorkspaceManagerTemplate = html<WorkspaceManager>`
           <rapid-label>
             Description (optional, max ${WORKSPACE_DESCRIPTION_MAX} characters):
           </rapid-label>
-          <textarea
+          <rapid-text-area
             class="save-field workspace-description-input"
+            maxlength="${WORKSPACE_DESCRIPTION_MAX}"
             :value=${(x) => x.workspaceDescription}
             @input=${(x, c) =>
               x.updateWorkspaceDescription((c.event.target as HTMLTextAreaElement).value)}
             placeholder="Add a description for this workspace"
             rows="3"
-          ></textarea>
+          ></rapid-text-area>
           ${when(
             (x) => x.workspaceName && x.isWorkspaceExisting(x.workspaceName),
             html`
@@ -100,14 +104,15 @@ export const WorkspaceManagerTemplate = html<WorkspaceManager>`
             )}
           </rapid-radio-group>
           <rapid-label>Description (optional):</rapid-label>
-          <textarea
-            class="save-field workspace-description-input"
+          <rapid-text-area
+            class="save-field"
             :value=${(x) => x.workspaceDescription}
+            maxlength="${WORKSPACE_DESCRIPTION_MAX}"
             @input=${(x, c) =>
               x.updateWorkspaceDescription((c.event.target as HTMLTextAreaElement).value)}
             placeholder="Add a description for this workspace"
             rows="3"
-          ></textarea>
+          ></rapid-text-area>
           <div class="warning-message">
             <rapid-icon name="triangle-exclamation"></rapid-icon>
             This will permanently replace the selected workspace. This action cannot be undone.
@@ -230,6 +235,9 @@ export const WorkspaceManagerTemplate = html<WorkspaceManager>`
       <div class="workspace-dialog-boundary" ${ref('sharedWorkspaceDialogBoundary')}></div>
     </div>
   </rapid-modal>
+`;
+
+export const workspaceLoadModalPartial: ViewTemplate<WorkspaceManager> = html`
   <rapid-modal ${ref('loadModal')}>
     <h2 slot="top">Load Workspace</h2>
     <div class="dialog-content">
@@ -244,15 +252,16 @@ export const WorkspaceManagerTemplate = html<WorkspaceManager>`
       ${when(
         (x) => !x.applyingWorkspace,
         html<WorkspaceManager>`
-          <rapid-segmented-control value="${sync((x) => x.loadMode)}">
-            <rapid-segmented-item value="MY">My Workspaces</rapid-segmented-item>
-            ${when(
-              () => false,
-              html<WorkspaceManager>`
+          ${when(
+            () => false,
+            html<WorkspaceManager>`
+              <rapid-segmented-control value="${sync((x) => x.loadMode)}">
+                <rapid-segmented-item value="MY">My Workspaces</rapid-segmented-item>
+
                 <rapid-segmented-item value="SHARED">Shared Workspaces</rapid-segmented-item>
-              `,
-            )}
-          </rapid-segmented-control>
+              </rapid-segmented-control>
+            `,
+          )}
           ${when(
             (x) => x.loadMode === 'MY',
             html`
@@ -355,3 +364,7 @@ export const WorkspaceManagerTemplate = html<WorkspaceManager>`
     <div class="workspace-dialog-boundary" ${ref('dialogBoundary')}></div>
   </rapid-modal>
 `;
+
+export const WorkspaceManagerTemplate = html<WorkspaceManager>`
+  ${workspaceHeaderPartial} ${workspaceSaveModalPartial} ${workspaceLoadModalPartial}
+`;

package/src/workspace-manager/workspace-manager.ts

@@ -4,8 +4,7 @@ import {
   showNotificationToast,
 } from '@genesislcap/foundation-notifications';
 import { Modal } from '@genesislcap/foundation-ui';
-import { customElement, observable } from '@microsoft/fast-element';
-import { FoundationElement } from '@microsoft/fast-foundation';
+import { FoundationElement, customElement, observable } from '@genesislcap/web-core';
 import {
   LayoutRegistry,
   GridRegistry,
@@ -239,6 +238,7 @@ export class WorkspaceManager extends FoundationElement {
       const sharedData = await this.requestSharedWorkspace(shared.id);
       if (!sharedData?.length) {
         console.warn('workspace has no data');
+        this.applyingWorkspace = false;
         return;
       }
       const dataJoined = sharedData.map((d) => d.WORKSPACE_DATA).join('');

package/docs/.gitkeep

@@ -1 +0,0 @@
-