@memberjunction/ng-conversations 5.40.2 → 5.42.0

package/dist/lib/components/project/project-form-modal.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"project-form-modal.component.js","sourceRoot":"","sources":["../../../../src/lib/components/project/project-form-modal.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, Output, EventEmitter, OnInit, ViewChild, ChangeDetectorRef } from '@angular/core';\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\nimport { MJDialogRef } from '@memberjunction/ng-ui-components';\nimport { MJProjectEntity } from '@memberjunction/core-entities';\nimport { UserInfo, Metadata } from '@memberjunction/core';\n\nexport interface ProjectFormData {\n  name: string;\n  description: string;\n  color: string;\n  icon: string;\n}\n\nconst DEFAULT_PROJECT_COLORS = [\n  '#0076B6', // MJ Blue\n  '#F44336', // Red\n  '#E91E63', // Pink\n  '#9C27B0', // Purple\n  '#673AB7', // Deep Purple\n  '#3F51B5', // Indigo\n  '#2196F3', // Blue\n  '#03A9F4', // Light Blue\n  '#00BCD4', // Cyan\n  '#009688', // Teal\n  '#4CAF50', // Green\n  '#8BC34A', // Light Green\n  '#CDDC39', // Lime\n  '#FFEB3B', // Yellow\n  '#FFC107', // Amber\n  '#FF9800', // Orange\n  '#FF5722', // Deep Orange\n  '#795548', // Brown\n  '#607D8B', // Blue Grey\n  '#9E9E9E'  // Grey\n];\n\nconst DEFAULT_PROJECT_ICONS = [\n  'fa-folder',\n  'fa-folder-open',\n  'fa-briefcase',\n  'fa-project-diagram',\n  'fa-chart-line',\n  'fa-tasks',\n  'fa-clipboard-list',\n  'fa-bullseye',\n  'fa-rocket',\n  'fa-lightbulb',\n  'fa-brain',\n  'fa-cogs',\n  'fa-code',\n  'fa-database',\n  'fa-server',\n  'fa-cloud',\n  'fa-mobile-alt',\n  'fa-desktop',\n  'fa-globe',\n  'fa-users'\n];\n\n@Component({\n  standalone: false,\n  selector: 'mj-project-form-modal',\n  template: `\n    <mj-dialog\n      [Title]=\"isEditMode ? 'Edit Project' : 'New Project'\"\n      [Width]=\"600\"\n      [MinWidth]=\"400\"\n      [Visible]=\"true\"\n      (Close)=\"onCancel()\">\n\n      <div class=\"project-form\">\n        <!-- Name Input -->\n        <div class=\"form-field\">\n          <label for=\"projectName\" class=\"required\">\n            Project Name\n          </label>\n          <input\n            id=\"projectName\"\n            type=\"text\"\n            [(ngModel)]=\"formData.name\"\n            placeholder=\"Enter project name\"\n            class=\"mj-textbox full-width\"\n            (keydown.enter)=\"onSave()\"\n            autofocus />\n          @if (showNameError) {\n            <div class=\"error-message\">Project name is required</div>\n          }\n        </div>\n\n        <!-- Description Textarea -->\n        <div class=\"form-field\">\n          <label for=\"projectDescription\">\n            Description\n          </label>\n          <textarea\n            id=\"projectDescription\"\n            [(ngModel)]=\"formData.description\"\n            placeholder=\"Enter project description (optional)\"\n            class=\"mj-textarea full-width\"\n            rows=\"3\"></textarea>\n        </div>\n\n        <!-- Color Picker -->\n        <div class=\"form-field\">\n          <label>Color</label>\n          <div class=\"color-picker-section\">\n            <div class=\"color-palette\">\n              @for (color of availableColors; track color) {\n                <button\n                  type=\"button\"\n                  class=\"color-swatch\"\n                  [class.selected]=\"formData.color === color\"\n                  [style.backgroundColor]=\"color\"\n                  (click)=\"selectColor(color)\"\n                  [title]=\"color\">\n                </button>\n              }\n            </div>\n            <div class=\"custom-color-input\">\n              <label for=\"customColor\">Custom:</label>\n              <input\n                id=\"customColor\"\n                type=\"color\"\n                [(ngModel)]=\"formData.color\"\n                class=\"custom-color-picker\" />\n              <span class=\"color-value\">{{ formData.color }}</span>\n            </div>\n          </div>\n        </div>\n\n        <!-- Icon Selector -->\n        <div class=\"form-field\">\n          <label>Icon</label>\n          <div class=\"icon-selector-section\">\n            <div class=\"selected-icon-preview\">\n              <i class=\"fa-solid {{ formData.icon }}\" [style.color]=\"formData.color\"></i>\n              <span>{{ formData.icon }}</span>\n            </div>\n            <div class=\"icon-grid\">\n              @for (icon of availableIcons; track icon) {\n                <button\n                  type=\"button\"\n                  class=\"icon-option\"\n                  [class.selected]=\"formData.icon === icon\"\n                  (click)=\"selectIcon(icon)\"\n                  [title]=\"icon\">\n                  <i class=\"fa-solid {{ icon }}\"></i>\n                </button>\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <mj-dialog-actions>\n        <button mjButton (click)=\"onCancel()\">Cancel</button>\n        <button mjButton variant=\"primary\" (click)=\"onSave()\">\n          {{ isEditMode ? 'Save' : 'Create' }}\n        </button>\n      </mj-dialog-actions>\n    </mj-dialog>\n  `,\n  styles: [`\n    .project-form {\n      padding: 16px;\n    }\n\n    .form-field {\n      margin-bottom: 20px;\n    }\n\n    .form-field label {\n      display: block;\n      margin-bottom: 8px;\n      font-weight: 500;\n      font-size: 14px;\n      color: #333;\n    }\n\n    .form-field label.required::after {\n      content: '*';\n      color: #F44336;\n      margin-left: 4px;\n    }\n\n    .full-width {\n      width: 100%;\n    }\n\n    .error-message {\n      color: #F44336;\n      font-size: 12px;\n      margin-top: 4px;\n    }\n\n    /* Color Picker Styles */\n    .color-picker-section {\n      border: 1px solid #D9D9D9;\n      border-radius: 4px;\n      padding: 12px;\n      background: #F9F9F9;\n    }\n\n    .color-palette {\n      display: grid;\n      grid-template-columns: repeat(10, 1fr);\n      gap: 8px;\n      margin-bottom: 12px;\n    }\n\n    .color-swatch {\n      width: 100%;\n      aspect-ratio: 1;\n      border: 2px solid transparent;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: all 150ms ease;\n      box-shadow: 0 1px 3px rgba(0,0,0,0.1);\n    }\n\n    .color-swatch:hover {\n      transform: scale(1.1);\n      box-shadow: 0 2px 6px rgba(0,0,0,0.2);\n    }\n\n    .color-swatch.selected {\n      border-color: #0076B6;\n      box-shadow: 0 0 0 2px #fff, 0 0 0 4px #0076B6;\n    }\n\n    .custom-color-input {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding-top: 12px;\n      border-top: 1px solid #D9D9D9;\n    }\n\n    .custom-color-input label {\n      margin: 0;\n      font-size: 13px;\n    }\n\n    .custom-color-picker {\n      width: 50px;\n      height: 32px;\n      border: 1px solid #D9D9D9;\n      border-radius: 4px;\n      cursor: pointer;\n    }\n\n    .color-value {\n      font-family: monospace;\n      font-size: 13px;\n      color: #666;\n    }\n\n    /* Icon Selector Styles */\n    .icon-selector-section {\n      border: 1px solid #D9D9D9;\n      border-radius: 4px;\n      padding: 12px;\n      background: #F9F9F9;\n    }\n\n    .selected-icon-preview {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 12px;\n      background: white;\n      border: 1px solid #D9D9D9;\n      border-radius: 4px;\n      margin-bottom: 12px;\n    }\n\n    .selected-icon-preview i {\n      font-size: 24px;\n    }\n\n    .selected-icon-preview span {\n      font-family: monospace;\n      font-size: 13px;\n      color: #666;\n    }\n\n    .icon-grid {\n      display: grid;\n      grid-template-columns: repeat(10, 1fr);\n      gap: 6px;\n      max-height: 200px;\n      overflow-y: auto;\n      padding: 4px;\n    }\n\n    .icon-option {\n      aspect-ratio: 1;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border: 1px solid #D9D9D9;\n      background: white;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: all 150ms ease;\n    }\n\n    .icon-option:hover {\n      background: #F0F0F0;\n      border-color: #0076B6;\n      transform: scale(1.05);\n    }\n\n    .icon-option.selected {\n      background: #E3F2FD;\n      border-color: #0076B6;\n      border-width: 2px;\n    }\n\n    .icon-option i {\n      font-size: 18px;\n      color: #333;\n    }\n\n    /* Scrollbar Styles */\n    .icon-grid::-webkit-scrollbar {\n      width: 8px;\n    }\n\n    .icon-grid::-webkit-scrollbar-track {\n      background: #F0F0F0;\n      border-radius: 4px;\n    }\n\n    .icon-grid::-webkit-scrollbar-thumb {\n      background: #D9D9D9;\n      border-radius: 4px;\n    }\n\n    .icon-grid::-webkit-scrollbar-thumb:hover {\n      background: #BFBFBF;\n    }\n  `]\n})\nexport class ProjectFormModalComponent extends BaseAngularComponent implements OnInit  {\n  @Input() dialogRef!: MJDialogRef;\n  @Input() project: MJProjectEntity | null = null;\n  @Input() environmentId!: string;\n  @Input() currentUser!: UserInfo;\n\n  @Output() projectSaved = new EventEmitter<MJProjectEntity>();\n\n  public formData: ProjectFormData = {\n    name: '',\n    description: '',\n    color: '#0076B6',\n    icon: 'fa-folder'\n  };\n\n  public showNameError = false;\n  public isEditMode = false;\n  public availableColors = DEFAULT_PROJECT_COLORS;\n  public availableIcons = DEFAULT_PROJECT_ICONS;\n\n  constructor(private cdr: ChangeDetectorRef) {\n  super();}\n\n  ngOnInit(): void {\n    this.isEditMode = this.project != null;\n\n    if (this.project) {\n      this.loadProjectData();\n    }\n  }\n\n  private loadProjectData(): void {\n    if (!this.project) return;\n\n    this.formData = {\n      name: this.project.Name || '',\n      description: this.project.Description || '',\n      color: this.project.Color || '#0076B6',\n      icon: this.project.Icon || 'fa-folder'\n    };\n  }\n\n  selectColor(color: string): void {\n    this.formData.color = color;\n    this.cdr.detectChanges();\n  }\n\n  selectIcon(icon: string): void {\n    this.formData.icon = icon;\n    this.cdr.detectChanges();\n  }\n\n  async onSave(): Promise<void> {\n    // Validate\n    if (!this.formData.name.trim()) {\n      this.showNameError = true;\n      this.cdr.detectChanges();\n      return;\n    }\n\n    this.showNameError = false;\n\n    try {\n      const md = this.ProviderToUse;\n      const project = this.project || await md.GetEntityObject<MJProjectEntity>('MJ: Projects', this.currentUser);\n\n      project.Name = this.formData.name.trim();\n      project.Description = this.formData.description.trim() || null;\n      project.Color = this.formData.color;\n      project.Icon = this.formData.icon;\n\n      if (!this.isEditMode) {\n        project.EnvironmentID = this.environmentId;\n        project.IsArchived = false;\n      }\n\n      const saved = await project.Save();\n      if (saved) {\n        this.projectSaved.emit(project);\n        this.dialogRef.Close();\n      } else {\n        throw new Error('Failed to save project');\n      }\n    } catch (error) {\n      console.error('Error saving project:', error);\n      alert('Failed to save project. Please try again.');\n    }\n  }\n\n  onCancel(): void {\n    this.dialogRef.Close();\n  }\n}\n"]}
+{"version":3,"file":"project-form-modal.component.js","sourceRoot":"","sources":["../../../../src/lib/components/project/project-form-modal.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, Output, EventEmitter, OnInit, ViewChild, ChangeDetectorRef } from '@angular/core';\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\nimport { MJDialogRef } from '@memberjunction/ng-ui-components';\nimport { MJProjectEntity } from '@memberjunction/core-entities';\nimport { UserInfo, Metadata } from '@memberjunction/core';\n\nexport interface ProjectFormData {\n  name: string;\n  description: string;\n  color: string;\n  icon: string;\n}\n\nconst DEFAULT_PROJECT_COLORS = [\n  '#0076B6', // MJ Blue\n  '#F44336', // Red\n  '#E91E63', // Pink\n  '#9C27B0', // Purple\n  '#673AB7', // Deep Purple\n  '#3F51B5', // Indigo\n  '#2196F3', // Blue\n  '#03A9F4', // Light Blue\n  '#00BCD4', // Cyan\n  '#009688', // Teal\n  '#4CAF50', // Green\n  '#8BC34A', // Light Green\n  '#CDDC39', // Lime\n  '#FFEB3B', // Yellow\n  '#FFC107', // Amber\n  '#FF9800', // Orange\n  '#FF5722', // Deep Orange\n  '#795548', // Brown\n  '#607D8B', // Blue Grey\n  '#9E9E9E'  // Grey\n];\n\nconst DEFAULT_PROJECT_ICONS = [\n  'fa-folder',\n  'fa-folder-open',\n  'fa-briefcase',\n  'fa-project-diagram',\n  'fa-chart-line',\n  'fa-tasks',\n  'fa-clipboard-list',\n  'fa-bullseye',\n  'fa-rocket',\n  'fa-lightbulb',\n  'fa-brain',\n  'fa-cogs',\n  'fa-code',\n  'fa-database',\n  'fa-server',\n  'fa-cloud',\n  'fa-mobile-alt',\n  'fa-desktop',\n  'fa-globe',\n  'fa-users'\n];\n\n@Component({\n  standalone: false,\n  selector: 'mj-project-form-modal',\n  template: `\n    <mj-dialog\n      [Title]=\"isEditMode ? 'Edit Folder' : 'New Folder'\"\n      [Width]=\"560\"\n      [MinWidth]=\"400\"\n      [Visible]=\"true\"\n      (Close)=\"onCancel()\">\n\n      <div class=\"project-form\">\n        <!-- Live preview chip -->\n        <div class=\"folder-preview\">\n          <span class=\"folder-preview-chip\" [style.backgroundColor]=\"chipBackground\" [style.color]=\"formData.color\">\n            <i class=\"fa-solid {{ formData.icon }}\"></i>\n          </span>\n          <span class=\"folder-preview-name\">{{ formData.name.trim() || 'Untitled folder' }}</span>\n        </div>\n\n        <!-- Name Input -->\n        <div class=\"form-field\">\n          <label for=\"projectName\" class=\"required\">\n            Folder Name\n          </label>\n          <input\n            id=\"projectName\"\n            type=\"text\"\n            [(ngModel)]=\"formData.name\"\n            placeholder=\"e.g. Client work, Research, Ideas\"\n            class=\"mj-input full-width\"\n            (keydown.enter)=\"onSave()\"\n            autofocus />\n          @if (showNameError) {\n            <div class=\"error-message\">Folder name is required</div>\n          }\n        </div>\n\n        <!-- Description Textarea -->\n        <div class=\"form-field\">\n          <label for=\"projectDescription\">\n            Description\n          </label>\n          <textarea\n            id=\"projectDescription\"\n            [(ngModel)]=\"formData.description\"\n            placeholder=\"What goes in this folder? (optional)\"\n            class=\"mj-textarea full-width\"\n            rows=\"2\"></textarea>\n        </div>\n\n        <!-- Color Picker -->\n        <div class=\"form-field\">\n          <label>Color</label>\n          <div class=\"color-picker-section\">\n            <div class=\"color-palette\">\n              @for (color of availableColors; track color) {\n                <button\n                  type=\"button\"\n                  class=\"color-swatch\"\n                  [class.selected]=\"formData.color === color\"\n                  [style.backgroundColor]=\"color\"\n                  (click)=\"selectColor(color)\"\n                  [title]=\"color\">\n                </button>\n              }\n            </div>\n            <div class=\"custom-color-input\">\n              <label for=\"customColor\">Custom:</label>\n              <input\n                id=\"customColor\"\n                type=\"color\"\n                [(ngModel)]=\"formData.color\"\n                class=\"custom-color-picker\" />\n              <span class=\"color-value\">{{ formData.color }}</span>\n            </div>\n          </div>\n        </div>\n\n        <!-- Icon Selector -->\n        <div class=\"form-field\">\n          <label>Icon</label>\n          <div class=\"icon-grid\">\n            @for (icon of availableIcons; track icon) {\n              <button\n                type=\"button\"\n                class=\"icon-option\"\n                [class.selected]=\"formData.icon === icon\"\n                [style.color]=\"formData.icon === icon ? formData.color : null\"\n                (click)=\"selectIcon(icon)\"\n                [title]=\"icon\">\n                <i class=\"fa-solid {{ icon }}\"></i>\n              </button>\n            }\n          </div>\n        </div>\n      </div>\n\n      <mj-dialog-actions>\n        <button mjButton variant=\"primary\" (click)=\"onSave()\">\n          {{ isEditMode ? 'Save Changes' : 'Create Folder' }}\n        </button>\n        <button mjButton (click)=\"onCancel()\">Cancel</button>\n      </mj-dialog-actions>\n    </mj-dialog>\n  `,\n  styles: [`\n    .project-form {\n      padding: 20px 24px 8px;\n      display: flex;\n      flex-direction: column;\n      gap: 22px;\n    }\n\n    /* Live preview chip */\n    .folder-preview {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 14px 16px;\n      border-radius: 12px;\n      background: var(--mj-bg-surface-sunken);\n      border: 1px solid var(--mj-border-subtle);\n    }\n    .folder-preview-chip {\n      width: 40px;\n      height: 40px;\n      border-radius: 10px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 18px;\n      flex-shrink: 0;\n      transition: background-color 150ms ease, color 150ms ease;\n    }\n    .folder-preview-name {\n      font-size: 15px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .form-field {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n    }\n\n    .form-field label {\n      font-weight: 600;\n      font-size: 13px;\n      letter-spacing: 0.01em;\n      color: var(--mj-text-secondary);\n    }\n\n    .form-field label.required::after {\n      content: '*';\n      color: var(--mj-status-error);\n      margin-left: 4px;\n    }\n\n    .full-width { width: 100%; }\n\n    .error-message {\n      color: var(--mj-status-error);\n      font-size: 12px;\n    }\n\n    /* Color Picker */\n    .color-picker-section {\n      border: 1px solid var(--mj-border-default);\n      border-radius: 12px;\n      padding: 14px;\n      background: var(--mj-bg-surface);\n    }\n\n    .color-palette {\n      display: grid;\n      grid-template-columns: repeat(10, 1fr);\n      gap: 8px;\n      margin-bottom: 12px;\n    }\n\n    .color-swatch {\n      width: 100%;\n      aspect-ratio: 1;\n      border: none;\n      border-radius: 8px;\n      cursor: pointer;\n      padding: 0;\n      transition: transform 120ms ease, box-shadow 120ms ease;\n      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--mj-text-primary) 8%, transparent);\n    }\n\n    .color-swatch:hover {\n      transform: scale(1.12);\n    }\n\n    .color-swatch.selected {\n      box-shadow: 0 0 0 2px var(--mj-bg-surface), 0 0 0 4px var(--mj-brand-primary);\n    }\n\n    .custom-color-input {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding-top: 14px;\n      border-top: 1px solid var(--mj-border-subtle);\n    }\n\n    .custom-color-input label {\n      margin: 0;\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-secondary);\n    }\n\n    .custom-color-picker {\n      width: 44px;\n      height: 30px;\n      padding: 2px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 8px;\n      cursor: pointer;\n      background: var(--mj-bg-surface);\n    }\n\n    .color-value {\n      font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n      font-size: 13px;\n      color: var(--mj-text-muted);\n      text-transform: uppercase;\n    }\n\n    /* Icon Selector */\n    .icon-grid {\n      display: grid;\n      grid-template-columns: repeat(10, 1fr);\n      gap: 8px;\n      max-height: 184px;\n      overflow-y: auto;\n      padding: 14px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 12px;\n      background: var(--mj-bg-surface);\n    }\n\n    .icon-option {\n      aspect-ratio: 1;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border: 1px solid var(--mj-border-subtle);\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      cursor: pointer;\n      color: var(--mj-text-secondary);\n      transition: transform 120ms ease, border-color 120ms ease, background 120ms ease;\n    }\n\n    .icon-option:hover {\n      background: var(--mj-bg-surface-hover);\n      border-color: var(--mj-border-strong);\n      transform: translateY(-1px);\n    }\n\n    .icon-option.selected {\n      background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 1px var(--mj-brand-primary);\n    }\n\n    .icon-option i { font-size: 17px; }\n\n    /* Scrollbar */\n    .icon-grid::-webkit-scrollbar { width: 8px; }\n    .icon-grid::-webkit-scrollbar-track {\n      background: transparent;\n    }\n    .icon-grid::-webkit-scrollbar-thumb {\n      background: var(--mj-border-strong);\n      border-radius: 4px;\n    }\n    .icon-grid::-webkit-scrollbar-thumb:hover {\n      background: var(--mj-text-disabled);\n    }\n  `]\n})\nexport class ProjectFormModalComponent extends BaseAngularComponent implements OnInit  {\n  @Input() dialogRef!: MJDialogRef;\n  @Input() project: MJProjectEntity | null = null;\n  @Input() environmentId!: string;\n  @Input() currentUser!: UserInfo;\n  /** When creating a new folder, the parent folder ID for nesting (null = top level). */\n  @Input() parentId: string | null = null;\n\n  @Output() projectSaved = new EventEmitter<MJProjectEntity>();\n\n  public formData: ProjectFormData = {\n    name: '',\n    description: '',\n    color: '#0076B6',\n    icon: 'fa-folder'\n  };\n\n  public showNameError = false;\n  public isEditMode = false;\n  public availableColors = DEFAULT_PROJECT_COLORS;\n  public availableIcons = DEFAULT_PROJECT_ICONS;\n\n  /** Translucent tint of the selected color, used behind the preview/icon glyph. */\n  public get chipBackground(): string {\n    const hex = this.formData.color || '#0076B6';\n    // 8-digit hex (#RRGGBBAA) — ~14% alpha tint of the chosen color\n    return /^#[0-9a-fA-F]{6}$/.test(hex) ? `${hex}24` : hex;\n  }\n\n  constructor(private cdr: ChangeDetectorRef) {\n  super();}\n\n  ngOnInit(): void {\n    this.isEditMode = this.project != null;\n\n    if (this.project) {\n      this.loadProjectData();\n    }\n  }\n\n  private loadProjectData(): void {\n    if (!this.project) return;\n\n    this.formData = {\n      name: this.project.Name || '',\n      description: this.project.Description || '',\n      color: this.project.Color || '#0076B6',\n      icon: this.project.Icon || 'fa-folder'\n    };\n  }\n\n  selectColor(color: string): void {\n    this.formData.color = color;\n    this.cdr.detectChanges();\n  }\n\n  selectIcon(icon: string): void {\n    this.formData.icon = icon;\n    this.cdr.detectChanges();\n  }\n\n  async onSave(): Promise<void> {\n    // Validate\n    if (!this.formData.name.trim()) {\n      this.showNameError = true;\n      this.cdr.detectChanges();\n      return;\n    }\n\n    this.showNameError = false;\n\n    try {\n      const md = this.ProviderToUse;\n      const project = this.project || await md.GetEntityObject<MJProjectEntity>('MJ: Projects', this.currentUser);\n\n      project.Name = this.formData.name.trim();\n      project.Description = this.formData.description.trim() || null;\n      project.Color = this.formData.color;\n      project.Icon = this.formData.icon;\n\n      if (!this.isEditMode) {\n        project.EnvironmentID = this.environmentId;\n        project.IsArchived = false;\n        if (this.parentId) {\n          project.ParentID = this.parentId;\n        }\n      }\n\n      const saved = await project.Save();\n      if (saved) {\n        this.projectSaved.emit(project);\n        this.dialogRef.Close();\n      } else {\n        throw new Error('Failed to save project');\n      }\n    } catch (error) {\n      console.error('Error saving project:', error);\n      alert('Failed to save project. Please try again.');\n    }\n  }\n\n  onCancel(): void {\n    this.dialogRef.Close();\n  }\n}\n"]}

package/dist/lib/components/realtime/channels/base-realtime-channel-client.d.ts

@@ -0,0 +1,304 @@
+import type { Type } from '@angular/core';
+import { JSONValue, RealtimeToolDefinition } from '@memberjunction/ai';
+/**
+ * Host services handed to a {@link BaseRealtimeChannelClient} at {@link BaseRealtimeChannelClient.Initialize}.
+ *
+ * The context is the plugin's ONLY line back to the live session — channels never talk to
+ * `RealtimeSessionService` (or any host component) directly, which is what keeps them drop-in
+ * plugins. Every member is host-implemented:
+ *
+ *  - the SESSION SERVICE supplies {@link SendContextNote} (perception feed into the live
+ *    model), {@link RequestSave} (debounced state-of-record persistence onto the session's
+ *    `MJ: AI Agent Session Channels` row) and {@link AgentName};
+ *  - the OVERLAY SHELL wires {@link SetFocusMode} (through the service's focus stream) so a
+ *    channel surface can request the focus layout — main call column collapsed, surface
+ *    panel filling the overlay, floating call pill riding on top.
+ */
+export interface RealtimeChannelContext {
+    /** Display name of the agent the live session fronts (e.g. `"Sage"`), fixed at session start. */
+    AgentName: string;
+    /**
+     * Feeds a background context note into the live realtime model (no spoken reply is
+     * requested) — the PERCEPTION direction of the channel: serialized state deltas flow here
+     * so the agent stays aware of what's on the surface. No-op when the session isn't live.
+     */
+    SendContextNote(text: string): void;
+    /**
+     * Asks the host to persist `stateJson` as this channel's state of record. The host
+     * DEBOUNCES (a change burst becomes one save) and flushes any pending save at session
+     * teardown — the plugin just calls this on every state mutation and never schedules
+     * timers itself. Best-effort: persistence failures are logged host-side, never thrown.
+     */
+    RequestSave(stateJson: string): void;
+    /**
+     * Requests (or releases) the FOCUS layout for this channel's surface: the overlay
+     * collapses the main call column so the surface owns the screen, with a compact floating
+     * call pill keeping mute / thread / end reachable. Any channel may request it; the host
+     * tracks which channel holds focus and routes the pill's "exit" back to it via
+     * {@link BaseRealtimeChannelClient.RequestFocusExit}.
+     */
+    SetFocusMode(on: boolean): void;
+    /**
+     * Asks the live model to SPEAK a response to the supplied instructions RIGHT NOW —
+     * the channel's "react to this" path, e.g. a widget submission the user expects an
+     * audible reaction to ({@link SendContextNote} deliberately never triggers speech).
+     * Rides the realtime client's spoken-update channel, so on some providers the spoken
+     * reply is narration-kind (ephemeral, not persisted as a caption). OPTIONAL member:
+     * older host contexts may not supply it — plugins must call it null-safely.
+     */
+    RequestSpokenResponse?(instructions: string): void;
+    /**
+     * Persists a snapshot of the channel's state as a first-class versioned artifact
+     * (`MJ: Artifacts` + version, linked into conversation history when possible) — e.g. the
+     * whiteboard's "Save to artifacts". Distinct from {@link RealtimeChannelContext.RequestSave},
+     * which maintains the session's rolling state of record. Best-effort: resolves to the
+     * created Artifact ID, or `null` on failure (logged host-side, never thrown). Works during
+     * the call AND right after it ends (the host retains the session id for late saves).
+     */
+    SaveAsArtifact(name: string, contentJson: string): Promise<string | null>;
+    /**
+     * The live `MJ: AI Agent Sessions` id this channel belongs to, or `null` before the
+     * session has minted / after it has torn down. A channel whose tools or surface drive a
+     * SERVER-SIDE resource (e.g. the Remote Browser channel's server-hosted browser) passes
+     * this as the `agentSessionID` argument to its own GraphQL resolvers via
+     * {@link ExecuteServerAction}. Most channels (whiteboard, shared doc) keep all state
+     * client-side and never read it.
+     */
+    AgentSessionID: string | null;
+    /**
+     * Executes a CHANNEL-SPECIFIC GraphQL operation against the session's MJ server — the
+     * escape hatch for channels backed by a SERVER-SIDE resource that the generic
+     * {@link RequestSave} / {@link SaveAsArtifact} contract doesn't cover (e.g. the Remote
+     * Browser channel driving a server-hosted browser through its own
+     * `ExecuteRemoteBrowserAction` mutation + `RemoteBrowserSnapshot` query).
+     *
+     * The host runs the operation through the SAME provider the live session uses, so the
+     * request rides the authenticated session. Best-effort and tolerant: a transport or
+     * server error resolves to `null` (logged host-side) rather than throwing, so a channel
+     * can map the failure to a model-readable result string without `try/catch`.
+     *
+     * @typeParam TResult The expected shape of the GraphQL operation's data payload.
+     * @param query The GraphQL query/mutation document.
+     * @param variables The operation variables (all JSON-serializable).
+     * @returns The operation's `data` payload, or `null` on any failure / when no session is live.
+     */
+    ExecuteServerAction<TResult>(query: string, variables: Record<string, JSONValue>): Promise<TResult | null>;
+}
+/**
+ * The first-run INTRO content for an interactive channel — the concise "what is this surface
+ * and how do I use it" copy the overlay shows the very first time a user opens this channel's
+ * tab (persisted "seen" per user, so it's shown ONCE per channel per user).
+ *
+ * A channel opts in by overriding {@link BaseRealtimeChannelClient.GetOnboardingDetails}; the
+ * default returns `null`, so the base Voice/text channel (which has no plugin at all) AND any
+ * plugin that doesn't override it show nothing.
+ */
+export interface ChannelOnboardingDetails {
+    /** Short title, usually the surface name (e.g. `"Whiteboard"`). */
+    Heading: string;
+    /** One or two sentences: what the surface is and what the user can expect to see on it. */
+    Description: string;
+    /** Optional quick-tip bullets (kept to 2-3 short, scannable lines). */
+    Tips?: string[];
+    /** Optional Font Awesome icon class for the intro panel (e.g. `'fa-solid fa-chalkboard'`). */
+    IconClass?: string;
+}
+/**
+ * Base class for CLIENT-SIDE interactive-channel plugins (per
+ * `plans/ai-agent-sessions.md` → "Interactive Channels" / "Pluggable Channel Interfaces").
+ *
+ * An interactive channel is a bidirectional surface the session's single realtime agent
+ * both PERCEIVES and ACTS UPON (whiteboard, shared doc, map, …). A concrete plugin
+ * contributes everything the channel needs, so the session service / call overlay carry
+ * ZERO channel-specific wiring:
+ *
+ *  1. a CLIENT-EXECUTED TOOL SET ({@link GetToolDefinitions}, declared to the realtime
+ *     model at session mint) plus the local executor ({@link ApplyAgentTool}) the host
+ *     routes `{@link ToolNamePrefix}*` calls to — the ACTION direction;
+ *  2. a STATE→CONTEXT SERIALIZER policy — the plugin owns its state engine and pushes
+ *     coalesced deltas through {@link RealtimeChannelContext.SendContextNote} — the
+ *     PERCEPTION direction;
+ *  3. an OPTIONAL ANGULAR SURFACE ({@link GetSurfaceComponent}) the overlay creates dynamically
+ *     in a channel tab, handed back through {@link BindSurface} so the plugin wires its own
+ *     inputs/outputs (the host never knows the component's API). A channel may be **server-only**
+ *     (no rendered surface) — e.g. a bridge-contributed meeting-controls or native-whiteboard
+ *     channel whose surface lives on the external platform, not in MJ. Such a channel returns
+ *     `null` from {@link GetSurfaceComponent} ({@link HasSurface} is `false`) and the overlay
+ *     simply skips its tab while still wiring its tools + perception;
+ *  4. a STATE OF RECORD ({@link SerializeState}, persisted via
+ *     {@link RealtimeChannelContext.RequestSave} under {@link ChannelName}).
+ *
+ * ### Registration & resolution (mirrors the realtime model drivers)
+ * Concrete plugins are `@RegisterClass(BaseRealtimeChannelClient, '<ClientPluginClass>')`
+ * and are resolved at session start from the `MJ: AI Agent Channels` registry: each ACTIVE
+ * row's `ClientPluginClass` is the ClassFactory key (exactly how `BaseRealtimeClient`
+ * drivers resolve by provider key). Ship a `Load<YourChannel>()` no-op alongside the class
+ * and call it from a static code path to defeat tree-shaking.
+ *
+ * ### Lifecycle — ONE INSTANCE PER SESSION (not a singleton)
+ * `ClassFactory.CreateInstance` → {@link Initialize}(ctx) → zero or more
+ * {@link BindSurface}/{@link UnbindSurface} cycles (the surface pane is created/destroyed
+ * with the overlay's tab panel, e.g. collapse/expand) → {@link Dispose} at teardown.
+ * {@link ApplyAgentTool} MUST work with NO surface bound (apply to the state engine
+ * directly; skip the UI garnish) — tool calls can arrive while the panel is collapsed.
+ *
+ * @typeParam TSurface The plugin's Angular surface component type. The host only ever
+ *   sees the default (`object`) — the typed parameter exists so concrete plugins get a
+ *   fully typed {@link BindSurface} without casts.
+ */
+export declare abstract class BaseRealtimeChannelClient<TSurface extends object = object> {
+    /**
+     * The host context, available from {@link Initialize} until {@link Dispose}.
+     * `null` outside that window — guard with `?.` in any code that can run early/late.
+     */
+    protected Context: RealtimeChannelContext | null;
+    /**
+     * The channel definition name — MUST match the `MJ: AI Agent Channels` row's `Name`
+     * (e.g. `'Whiteboard'`). Used as the persistence key for {@link SerializeState} saves
+     * and as the channel tab's stable key.
+     */
+    abstract get ChannelName(): string;
+    /**
+     * The shared name prefix of every tool this channel exposes (e.g. `'Whiteboard_'`).
+     * The host registers ONE local-execution route per plugin: tool calls whose name starts
+     * with this prefix go to {@link ApplyAgentTool} instead of the server relay.
+     */
+    abstract get ToolNamePrefix(): string;
+    /** Label for the channel's tab on the overlay's surface panel (e.g. `'Whiteboard'`). */
+    abstract get TabTitle(): string;
+    /** Font Awesome icon class for the channel's tab (e.g. `'fa-solid fa-chalkboard'`). */
+    abstract get TabIcon(): string;
+    /**
+     * The channel's CLIENT-EXECUTED tool declarations, aggregated by the session service
+     * into the `clientTools` set declared to the realtime model at session mint. The server
+     * only DECLARES these — execution stays in the browser via {@link ApplyAgentTool}.
+     */
+    abstract GetToolDefinitions(): RealtimeToolDefinition[];
+    /**
+     * Executes ONE agent tool call locally (the ACTION direction) and returns the result
+     * JSON string fed back to the model as the `tool_response`. Called for every tool whose
+     * name starts with {@link ToolNamePrefix}. Must work both WITH a bound surface (apply +
+     * UI garnish) and WITHOUT one (apply to the state engine directly — the tab pane may not
+     * exist, e.g. the surface panel is collapsed). Should not throw: return a
+     * `{ success: false, error }` payload so the model can narrate the failure (the host
+     * additionally wraps anything thrown).
+     */
+    abstract ApplyAgentTool(toolName: string, argsJson: string): string | Promise<string>;
+    /**
+     * The Angular component the overlay creates dynamically as this channel's tab pane, or `null`
+     * for a **server-only** channel that renders no MJ surface (its surface, if any, lives on the
+     * external platform — e.g. a bridge-contributed native whiteboard or meeting-controls channel).
+     *
+     * When this returns `null`, the overlay renders NO tab for the channel and never calls
+     * {@link BindSurface}/{@link UnbindSurface} — but the channel's tools ({@link GetToolDefinitions} /
+     * {@link ApplyAgentTool}) and perception ({@link RealtimeChannelContext.SendContextNote}) still run.
+     * A created surface instance is handed straight back via {@link BindSurface}; the host treats it as
+     * opaque.
+     *
+     * Default: `null` (server-only). A channel with a rendered surface overrides this to return its
+     * component type.
+     */
+    GetSurfaceComponent(): Type<TSurface> | null;
+    /**
+     * Whether this channel has a rendered MJ surface ({@link GetSurfaceComponent} returns non-null).
+     * The overlay uses this to decide whether to register a surface tab; server-only channels are
+     * `false`. Override only if surface availability must be decided WITHOUT constructing the type
+     * (the default calls {@link GetSurfaceComponent} once).
+     */
+    HasSurface(): boolean;
+    /**
+     * The channel's FIRST-RUN INTRO content, or `null` when the channel offers no onboarding.
+     * The overlay shows this once per channel per user — the first time the user opens this
+     * channel's surface tab — and remembers "seen" via the user's settings (NOT localStorage),
+     * so it never re-appears on later sessions or other devices.
+     *
+     * Default: `null` (no intro). The base Voice/text channel has no plugin at all, so it never
+     * shows an intro; an interactive channel with a surface worth explaining (whiteboard, remote
+     * browser, …) overrides this to return its {@link ChannelOnboardingDetails}. A plugin that
+     * doesn't override it simply shows nothing — onboarding is strictly opt-in.
+     */
+    GetOnboardingDetails(): ChannelOnboardingDetails | null;
+    /**
+     * Called by the host right after it created the surface component (and BEFORE the
+     * component's first change detection, so inputs set here are visible in its `ngOnInit`).
+     * The plugin — which knows its own component type — sets inputs (state engine, agent
+     * name, …) and subscribes outputs here, wiring perception/garnish flows back through
+     * {@link Context}. May be called again with a NEW instance after an
+     * {@link UnbindSurface} (the pane is destroyed/recreated with the tab panel).
+     */
+    abstract BindSurface(instance: TSurface): void;
+    /**
+     * Called by the host when the surface component is being destroyed (tab panel
+     * collapsed / overlay torn down). Drop the instance reference and unsubscribe any
+     * output subscriptions — after this, {@link ApplyAgentTool} runs in its no-surface
+     * mode. Default: no-op.
+     */
+    UnbindSurface(): void;
+    /**
+     * Binds the host context and invokes the {@link OnInitialize} hook. Called exactly once
+     * per session, right after ClassFactory instantiation and before any tool call or
+     * surface bind.
+     */
+    Initialize(ctx: RealtimeChannelContext): void;
+    /**
+     * Subclass hook invoked from {@link Initialize} once {@link Context} is bound — wire
+     * state-engine subscriptions (e.g. state change → `Context.RequestSave(...)`) here.
+     * Default: no-op.
+     */
+    protected OnInitialize(): void;
+    /**
+     * Max time {@link ResolveAgentSessionId} waits for the session id to bind before giving up, and the
+     * poll interval it re-checks on. Protected so tests can shrink the wait; production keeps the
+     * defaults (the real mint race is sub-second, 8s is generous headroom).
+     */
+    protected SessionIdWaitTimeoutMs: number;
+    protected SessionIdWaitIntervalMs: number;
+    /**
+     * Resolves the live {@link RealtimeChannelContext.AgentSessionID}, briefly WAITING for it when it
+     * isn't bound yet rather than giving up instantly. `AgentSessionID` is a live getter over the
+     * session service's current id: it reads `null` in the window BEFORE the session mints (the
+     * realtime model can fire a tool call the very first beat it connects, before `mintSession`
+     * resolves) and again AFTER teardown. Server-backed tool paths (e.g. the Remote Browser channel's
+     * `browser_*` tools) call this instead of reading `Context?.AgentSessionID` synchronously, so a tool
+     * invoked a beat early WAITS for the session to come live — defense-in-depth against the
+     * "session id missing" race — instead of returning a hard failure to the model.
+     *
+     * Returns the id as soon as it's non-null (the common path resolves immediately, no delay), or
+     * `null` if it's still unbound after {@link SessionIdWaitTimeoutMs} — or the channel was
+     * {@link Dispose}d in the meantime (`Context` goes null, so we stop waiting on a torn-down session).
+     */
+    protected ResolveAgentSessionId(): Promise<string | null>;
+    /**
+     * Serializes the channel's current state of record (the payload persisted on the
+     * session's channel row), or `null` when the channel keeps no persistent state.
+     * Default: `null`.
+     */
+    SerializeState(): string | null;
+    /**
+     * Restores a PRIOR session's saved channel state (the payload a previous session
+     * persisted via {@link SerializeState} / {@link RealtimeChannelContext.RequestSave}).
+     * Invoked by the session host AFTER {@link Initialize} and BEFORE any surface binding,
+     * when a prior session's saved state exists for this channel.
+     *
+     * Returns `true` when the state was applied; `false` when the channel ignored it —
+     * either because it keeps no persistent state (this default) or because the payload was
+     * malformed/incompatible. Implementations MUST be tolerant: never throw on bad input,
+     * just return `false` and start fresh.
+     */
+    RestoreState(stateJson: string): boolean;
+    /**
+     * The focus pill's "exit" affordance, routed by the overlay to the channel that holds
+     * focus. Implementations should leave focus mode through their OWN surface (so surface
+     * toggles stay in sync), ultimately emitting `Context.SetFocusMode(false)`. The overlay
+     * defensively clears its layout flag as well, so a no-op default is safe.
+     */
+    RequestFocusExit(): void;
+    /**
+     * Tears the plugin down at session end: release the surface binding, unsubscribe
+     * state-engine subscriptions, then drop the context. Subclasses overriding this MUST
+     * call `super.Dispose()`. Any final state save has already been flushed by the host
+     * (the debounced {@link RealtimeChannelContext.RequestSave} pipeline) before disposal.
+     */
+    Dispose(): void;
+}
+//# sourceMappingURL=base-realtime-channel-client.d.ts.map

package/dist/lib/components/realtime/channels/base-realtime-channel-client.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-realtime-channel-client.d.ts","sourceRoot":"","sources":["../../../../../src/lib/components/realtime/channels/base-realtime-channel-client.ts"],"names":[],"mappings":"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"}

package/dist/lib/components/realtime/channels/base-realtime-channel-client.js

@@ -0,0 +1,198 @@
+/**
+ * Base class for CLIENT-SIDE interactive-channel plugins (per
+ * `plans/ai-agent-sessions.md` → "Interactive Channels" / "Pluggable Channel Interfaces").
+ *
+ * An interactive channel is a bidirectional surface the session's single realtime agent
+ * both PERCEIVES and ACTS UPON (whiteboard, shared doc, map, …). A concrete plugin
+ * contributes everything the channel needs, so the session service / call overlay carry
+ * ZERO channel-specific wiring:
+ *
+ *  1. a CLIENT-EXECUTED TOOL SET ({@link GetToolDefinitions}, declared to the realtime
+ *     model at session mint) plus the local executor ({@link ApplyAgentTool}) the host
+ *     routes `{@link ToolNamePrefix}*` calls to — the ACTION direction;
+ *  2. a STATE→CONTEXT SERIALIZER policy — the plugin owns its state engine and pushes
+ *     coalesced deltas through {@link RealtimeChannelContext.SendContextNote} — the
+ *     PERCEPTION direction;
+ *  3. an OPTIONAL ANGULAR SURFACE ({@link GetSurfaceComponent}) the overlay creates dynamically
+ *     in a channel tab, handed back through {@link BindSurface} so the plugin wires its own
+ *     inputs/outputs (the host never knows the component's API). A channel may be **server-only**
+ *     (no rendered surface) — e.g. a bridge-contributed meeting-controls or native-whiteboard
+ *     channel whose surface lives on the external platform, not in MJ. Such a channel returns
+ *     `null` from {@link GetSurfaceComponent} ({@link HasSurface} is `false`) and the overlay
+ *     simply skips its tab while still wiring its tools + perception;
+ *  4. a STATE OF RECORD ({@link SerializeState}, persisted via
+ *     {@link RealtimeChannelContext.RequestSave} under {@link ChannelName}).
+ *
+ * ### Registration & resolution (mirrors the realtime model drivers)
+ * Concrete plugins are `@RegisterClass(BaseRealtimeChannelClient, '<ClientPluginClass>')`
+ * and are resolved at session start from the `MJ: AI Agent Channels` registry: each ACTIVE
+ * row's `ClientPluginClass` is the ClassFactory key (exactly how `BaseRealtimeClient`
+ * drivers resolve by provider key). Ship a `Load<YourChannel>()` no-op alongside the class
+ * and call it from a static code path to defeat tree-shaking.
+ *
+ * ### Lifecycle — ONE INSTANCE PER SESSION (not a singleton)
+ * `ClassFactory.CreateInstance` → {@link Initialize}(ctx) → zero or more
+ * {@link BindSurface}/{@link UnbindSurface} cycles (the surface pane is created/destroyed
+ * with the overlay's tab panel, e.g. collapse/expand) → {@link Dispose} at teardown.
+ * {@link ApplyAgentTool} MUST work with NO surface bound (apply to the state engine
+ * directly; skip the UI garnish) — tool calls can arrive while the panel is collapsed.
+ *
+ * @typeParam TSurface The plugin's Angular surface component type. The host only ever
+ *   sees the default (`object`) — the typed parameter exists so concrete plugins get a
+ *   fully typed {@link BindSurface} without casts.
+ */
+export class BaseRealtimeChannelClient {
+    /**
+     * The host context, available from {@link Initialize} until {@link Dispose}.
+     * `null` outside that window — guard with `?.` in any code that can run early/late.
+     */
+    Context = null;
+    /**
+     * The Angular component the overlay creates dynamically as this channel's tab pane, or `null`
+     * for a **server-only** channel that renders no MJ surface (its surface, if any, lives on the
+     * external platform — e.g. a bridge-contributed native whiteboard or meeting-controls channel).
+     *
+     * When this returns `null`, the overlay renders NO tab for the channel and never calls
+     * {@link BindSurface}/{@link UnbindSurface} — but the channel's tools ({@link GetToolDefinitions} /
+     * {@link ApplyAgentTool}) and perception ({@link RealtimeChannelContext.SendContextNote}) still run.
+     * A created surface instance is handed straight back via {@link BindSurface}; the host treats it as
+     * opaque.
+     *
+     * Default: `null` (server-only). A channel with a rendered surface overrides this to return its
+     * component type.
+     */
+    GetSurfaceComponent() {
+        return null;
+    }
+    /**
+     * Whether this channel has a rendered MJ surface ({@link GetSurfaceComponent} returns non-null).
+     * The overlay uses this to decide whether to register a surface tab; server-only channels are
+     * `false`. Override only if surface availability must be decided WITHOUT constructing the type
+     * (the default calls {@link GetSurfaceComponent} once).
+     */
+    HasSurface() {
+        return this.GetSurfaceComponent() != null;
+    }
+    /**
+     * The channel's FIRST-RUN INTRO content, or `null` when the channel offers no onboarding.
+     * The overlay shows this once per channel per user — the first time the user opens this
+     * channel's surface tab — and remembers "seen" via the user's settings (NOT localStorage),
+     * so it never re-appears on later sessions or other devices.
+     *
+     * Default: `null` (no intro). The base Voice/text channel has no plugin at all, so it never
+     * shows an intro; an interactive channel with a surface worth explaining (whiteboard, remote
+     * browser, …) overrides this to return its {@link ChannelOnboardingDetails}. A plugin that
+     * doesn't override it simply shows nothing — onboarding is strictly opt-in.
+     */
+    GetOnboardingDetails() {
+        return null;
+    }
+    /**
+     * Called by the host when the surface component is being destroyed (tab panel
+     * collapsed / overlay torn down). Drop the instance reference and unsubscribe any
+     * output subscriptions — after this, {@link ApplyAgentTool} runs in its no-surface
+     * mode. Default: no-op.
+     */
+    UnbindSurface() {
+        // default: nothing to release
+    }
+    /**
+     * Binds the host context and invokes the {@link OnInitialize} hook. Called exactly once
+     * per session, right after ClassFactory instantiation and before any tool call or
+     * surface bind.
+     */
+    Initialize(ctx) {
+        this.Context = ctx;
+        this.OnInitialize();
+    }
+    /**
+     * Subclass hook invoked from {@link Initialize} once {@link Context} is bound — wire
+     * state-engine subscriptions (e.g. state change → `Context.RequestSave(...)`) here.
+     * Default: no-op.
+     */
+    OnInitialize() {
+        // default: nothing to initialize
+    }
+    /**
+     * Max time {@link ResolveAgentSessionId} waits for the session id to bind before giving up, and the
+     * poll interval it re-checks on. Protected so tests can shrink the wait; production keeps the
+     * defaults (the real mint race is sub-second, 8s is generous headroom).
+     */
+    SessionIdWaitTimeoutMs = 8000;
+    SessionIdWaitIntervalMs = 200;
+    /**
+     * Resolves the live {@link RealtimeChannelContext.AgentSessionID}, briefly WAITING for it when it
+     * isn't bound yet rather than giving up instantly. `AgentSessionID` is a live getter over the
+     * session service's current id: it reads `null` in the window BEFORE the session mints (the
+     * realtime model can fire a tool call the very first beat it connects, before `mintSession`
+     * resolves) and again AFTER teardown. Server-backed tool paths (e.g. the Remote Browser channel's
+     * `browser_*` tools) call this instead of reading `Context?.AgentSessionID` synchronously, so a tool
+     * invoked a beat early WAITS for the session to come live — defense-in-depth against the
+     * "session id missing" race — instead of returning a hard failure to the model.
+     *
+     * Returns the id as soon as it's non-null (the common path resolves immediately, no delay), or
+     * `null` if it's still unbound after {@link SessionIdWaitTimeoutMs} — or the channel was
+     * {@link Dispose}d in the meantime (`Context` goes null, so we stop waiting on a torn-down session).
+     */
+    async ResolveAgentSessionId() {
+        const immediate = this.Context?.AgentSessionID ?? null;
+        if (immediate) {
+            return immediate;
+        }
+        const intervalMs = Math.max(1, this.SessionIdWaitIntervalMs);
+        for (let waited = 0; waited < this.SessionIdWaitTimeoutMs; waited += intervalMs) {
+            await new Promise((resolve) => setTimeout(resolve, intervalMs));
+            // Context goes null on Dispose() — the session is gone, stop waiting.
+            if (!this.Context) {
+                return null;
+            }
+            const id = this.Context.AgentSessionID;
+            if (id) {
+                return id;
+            }
+        }
+        return this.Context?.AgentSessionID ?? null;
+    }
+    /**
+     * Serializes the channel's current state of record (the payload persisted on the
+     * session's channel row), or `null` when the channel keeps no persistent state.
+     * Default: `null`.
+     */
+    SerializeState() {
+        return null;
+    }
+    /**
+     * Restores a PRIOR session's saved channel state (the payload a previous session
+     * persisted via {@link SerializeState} / {@link RealtimeChannelContext.RequestSave}).
+     * Invoked by the session host AFTER {@link Initialize} and BEFORE any surface binding,
+     * when a prior session's saved state exists for this channel.
+     *
+     * Returns `true` when the state was applied; `false` when the channel ignored it —
+     * either because it keeps no persistent state (this default) or because the payload was
+     * malformed/incompatible. Implementations MUST be tolerant: never throw on bad input,
+     * just return `false` and start fresh.
+     */
+    RestoreState(stateJson) {
+        return false;
+    }
+    /**
+     * The focus pill's "exit" affordance, routed by the overlay to the channel that holds
+     * focus. Implementations should leave focus mode through their OWN surface (so surface
+     * toggles stay in sync), ultimately emitting `Context.SetFocusMode(false)`. The overlay
+     * defensively clears its layout flag as well, so a no-op default is safe.
+     */
+    RequestFocusExit() {
+        // default: the overlay's defensive clear handles it
+    }
+    /**
+     * Tears the plugin down at session end: release the surface binding, unsubscribe
+     * state-engine subscriptions, then drop the context. Subclasses overriding this MUST
+     * call `super.Dispose()`. Any final state save has already been flushed by the host
+     * (the debounced {@link RealtimeChannelContext.RequestSave} pipeline) before disposal.
+     */
+    Dispose() {
+        this.UnbindSurface();
+        this.Context = null;
+    }
+}
+//# sourceMappingURL=base-realtime-channel-client.js.map