design.estate/dees-catalog
3
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(workspace): rename editor components to workspace group and move terminal & TypeScript intellisense into workspace

Browse Source
This commit is contained in:
Jürgen Kunz
2025-12-31 12:37:14 +00:00
parent 08b302bd46
commit 15bca09086
29 changed files with 517 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
ts_web/elements/00group-input/dees-input-code/dees-input-code.ts
View File

@@ -12,8 +12,8 @@ import { themeDefaultStyles } from '../../00theme.js';
import { DeesModal } from '../../dees-modal/dees-modal.js';
import '../../dees-icon/dees-icon.js';
import '../../dees-label/dees-label.js';
import '../../00group-editor/dees-editor-monaco/dees-editor-monaco.js';
import { DeesEditorMonaco } from '../../00group-editor/dees-editor-monaco/dees-editor-monaco.js';
import '../../00group-workspace/dees-workspace-monaco/dees-workspace-monaco.js';
import { DeesWorkspaceMonaco } from '../../00group-workspace/dees-workspace-monaco/dees-workspace-monaco.js';
declare global {
interface HTMLElementTagNameMap {
@@ -77,7 +77,7 @@ export class DeesInputCode extends DeesInputBase<string> {
@state()
accessor copySuccess: boolean = false;
private editorElement: DeesEditorMonaco | null = null;
private editorElement: DeesWorkspaceMonaco | null = null;
public static styles = [
themeDefaultStyles,
@@ -207,7 +207,7 @@ export class DeesInputCode extends DeesInputBase<string> {
position: relative;
}
dees-editor-monaco {
dees-workspace-monaco {
display: block;
}
@@ -295,12 +295,12 @@ export class DeesInputCode extends DeesInputBase<string> {
</div>
</div>
<div class="editor-wrapper">
<dees-editor-monaco
<dees-workspace-monaco
.content=${this.value}
.language=${this.language}
.wordWrap=${this.wordWrap}
@content-change=${this.handleContentChange}
></dees-editor-monaco>
></dees-workspace-monaco>
</div>
</div>
</div>
@@ -308,7 +308,7 @@ export class DeesInputCode extends DeesInputBase<string> {
}
async firstUpdated() {
this.editorElement = this.shadowRoot?.querySelector('dees-editor-monaco') as DeesEditorMonaco;
this.editorElement = this.shadowRoot?.querySelector('dees-workspace-monaco') as DeesWorkspaceMonaco;
if (this.editorElement) {
// Subscribe to content changes from the editor
this.editorElement.contentSubject.subscribe((newContent: string) => {
@@ -386,7 +386,7 @@ export class DeesInputCode extends DeesInputBase<string> {
public async openFullscreen() {
const currentValue = this.value;
let modalEditorElement: DeesEditorMonaco | null = null;
let modalEditorElement: DeesWorkspaceMonaco | null = null;
// Modal-specific state
let modalLanguage = this.language;
@@ -579,11 +579,11 @@ export class DeesInputCode extends DeesInputBase<string> {
</div>
</div>
<div class="modal-editor-wrapper">
<dees-editor-monaco
<dees-workspace-monaco
.content=${currentValue}
.language=${modalLanguage}
.wordWrap=${modalWordWrap}
></dees-editor-monaco>
></dees-workspace-monaco>
</div>
`,
menuOptions: [
@@ -597,7 +597,7 @@ export class DeesInputCode extends DeesInputBase<string> {
name: 'Save & Close',
action: async (modalRef) => {
// Get the editor content from the modal
modalEditorElement = modalRef.shadowRoot?.querySelector('dees-editor-monaco') as DeesEditorMonaco;
modalEditorElement = modalRef.shadowRoot?.querySelector('dees-workspace-monaco') as DeesWorkspaceMonaco;
if (modalEditorElement) {
const editor = await modalEditorElement.editorDeferred.promise;
const newValue = editor.getValue();
@@ -611,7 +611,7 @@ export class DeesInputCode extends DeesInputBase<string> {
// Wait for modal to render
await new Promise(resolve => setTimeout(resolve, 100));
modalEditorElement = modal.shadowRoot?.querySelector('dees-editor-monaco') as DeesEditorMonaco;
modalEditorElement = modal.shadowRoot?.querySelector('dees-workspace-monaco') as DeesWorkspaceMonaco;
// Wire up toolbar event handlers
const toolbar = modal.shadowRoot?.querySelector('.modal-toolbar');