dialog: add placeholder option (eclipse-theia#12244)

The commit adds support for passing a `placeholder` option to the `SingleTextInputDialog` which was previously not possible without having to extend the implementation. Signed-off-by: vince-fugnitto <[email protected]>
FernandoAscencio · Mar 1, 2023 · f7ef6b5 · f7ef6b5
1 parent d2f9a7a
commit f7ef6b5
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 2 deletions.
diff --git a/packages/core/src/browser/dialogs.ts b/packages/core/src/browser/dialogs.ts
@@ -477,6 +477,7 @@ export async function confirmExitWithOrWithoutSaving(captionsToSave: string[], p
 export class SingleTextInputDialogProps extends DialogProps {
     readonly confirmButtonLabel?: string;
     readonly initialValue?: string;
+    readonly placeholder?: string;
     readonly initialSelectionRange?: {
         start: number
         end: number
@@ -499,6 +500,7 @@ export class SingleTextInputDialog extends AbstractDialog<string> {
         this.inputField.className = 'theia-input';
         this.inputField.spellcheck = false;
         this.inputField.setAttribute('style', 'flex: 0;');
+        this.inputField.placeholder = props.placeholder || '';
         this.inputField.value = props.initialValue || '';
         if (props.initialSelectionRange) {
             this.inputField.setSelectionRange(

diff --git a/packages/debug/src/browser/console/debug-console-items.tsx b/packages/debug/src/browser/console/debug-console-items.tsx
@@ -239,7 +239,8 @@ export class DebugVariable extends ExpressionContainer {
         }
         const input = new SingleTextInputDialog({
             title: nls.localize('theia/debug/debugVariableInput', 'Set {0} Value', this.name),
-            initialValue: this.value
+            initialValue: this.value,
+            placeholder: nls.localizeByDefault('Value')
         });
         const newValue = await input.open();
         if (newValue) {

diff --git a/packages/debug/src/browser/view/debug-watch-expression.tsx b/packages/debug/src/browser/view/debug-watch-expression.tsx
@@ -63,7 +63,8 @@ export class DebugWatchExpression extends ExpressionItem {
     async open(): Promise<void> {
         const input = new SingleTextInputDialog({
             title: nls.localizeByDefault('Edit Expression'),
-            initialValue: this.expression
+            initialValue: this.expression,
+            placeholder: nls.localizeByDefault('Expression to watch')
         });
         const newValue = await input.open();
         if (newValue !== undefined) {

diff --git a/packages/workspace/src/browser/workspace-commands.ts b/packages/workspace/src/browser/workspace-commands.ts
@@ -237,6 +237,7 @@ export class WorkspaceCommandContribution implements CommandContribution {
                         title: nls.localizeByDefault('New File'),
                         parentUri: parentUri,
                         initialValue: vacantChildUri.path.base,
+                        placeholder: nls.localize('theia/workspace/newFilePlaceholder', 'File Name'),
                         validate: name => this.validateFileName(name, parent, true)
                     }, this.labelProvider);
 
@@ -261,6 +262,7 @@ export class WorkspaceCommandContribution implements CommandContribution {
                         title: nls.localizeByDefault('New Folder'),
                         parentUri: parentUri,
                         initialValue: vacantChildUri.path.base,
+                        placeholder: nls.localize('theia/workspace/newFolderPlaceholder', 'Folder Name'),
                         validate: name => this.validateFileName(name, parent, true)
                     }, this.labelProvider);
                     dialog.open().then(async name => {