feat: implement capitalization type option for prompt dialogs (#6325)

* feat: implement capitalization type option for prompt dialogs

Allow setting auto capitalization to "none", "all", "sentences" and "words".
This feature works on both Android and iOS.

* feat: add capitalization type examples to test page for dialogs

apps/app/ui-tests-app/dialogs/dialogs.xml

@@ -8,5 +8,9 @@
     <Button text="promptText" tap="{{ promptText }}" />
     <Button text="promptPass" tap="{{ promptPass }}" />
     <Button text="promptEmail" tap="{{ promptEmail }}" />   
+    <Button text="promptCapitalizationNone" tap="{{ promptCapitalizationNone }}" />
+    <Button text="promptCapitalizationAll" tap="{{ promptCapitalizationAll }}" />
+    <Button text="promptCapitalizationSentences" tap="{{ promptCapitalizationSentences }}" />
+    <Button text="promptCapitalizationWords" tap="{{ promptCapitalizationWords }}" />
   </StackLayout>
 </Page>

apps/app/ui-tests-app/dialogs/view-model.ts

@@ -137,5 +137,81 @@ export class SettingsViewModel extends observable.Observable {
             }
         });
     }
+
+    public promptCapitalizationNone(args: observable.EventData) {
+        dialogs.prompt({
+            title: "Name",
+            message: "Enter name:",
+            cancelButtonText: "Cancel",
+            okButtonText: "OK",
+            inputType: dialogs.inputType.text,
+            capitalizationType: dialogs.capitalizationType.none
+        }).then((promptResult) => {
+            console.log("### Result: " + promptResult.result + ", Text: " + promptResult.text);
+            if (promptResult.result) {
+                this.set("name", promptResult.text);
+            }
+            else {
+                this.set("name", "Harold Finch");
+            }
+        });
+    }
+
+    public promptCapitalizationAll(args: observable.EventData) {
+        dialogs.prompt({
+            title: "Name",
+            message: "Enter name:",
+            cancelButtonText: "Cancel",
+            okButtonText: "OK",
+            inputType: dialogs.inputType.text,
+            capitalizationType: dialogs.capitalizationType.all
+        }).then((promptResult) => {
+            console.log("### Result: " + promptResult.result + ", Text: " + promptResult.text);
+            if (promptResult.result) {
+                this.set("name", promptResult.text);
+            }
+            else {
+                this.set("name", "Harold Finch");
+            }
+        });
+    }
+
+    public promptCapitalizationSentences(args: observable.EventData) {
+        dialogs.prompt({
+            title: "Name",
+            message: "Enter name:",
+            cancelButtonText: "Cancel",
+            okButtonText: "OK",
+            inputType: dialogs.inputType.text,
+            capitalizationType: dialogs.capitalizationType.sentences
+        }).then((promptResult) => {
+            console.log("### Result: " + promptResult.result + ", Text: " + promptResult.text);
+            if (promptResult.result) {
+                this.set("name", promptResult.text);
+            }
+            else {
+                this.set("name", "Harold Finch");
+            }
+        });
+    }
+
+    public promptCapitalizationWords(args: observable.EventData) {
+        dialogs.prompt({
+            title: "Name",
+            message: "Enter name:",
+            cancelButtonText: "Cancel",
+            okButtonText: "OK",
+            inputType: dialogs.inputType.text,
+            capitalizationType: dialogs.capitalizationType.words
+        }).then((promptResult) => {
+            console.log("### Result: " + promptResult.result + ", Text: " + promptResult.text);
+            if (promptResult.result) {
+                this.set("name", promptResult.text);
+            }
+            else {
+                this.set("name", "Harold Finch");
+            }
+        });
+    }
 }
 export var settingsViewModel = new SettingsViewModel();

tns-core-modules/ui/dialogs/dialogs-common.ts

@@ -33,6 +33,31 @@ export module inputType {
     export const email: string = "email";
 }
 
+/**
+ * Defines the capitalization type for prompt dialog.
+ */
+export module capitalizationType {
+    /**
+     * No automatic capitalization.
+     */
+    export const none: string = "none";
+
+    /**
+     * Capitalizes every character.
+     */
+    export const all: string = "all";
+
+    /**
+     * Capitalize the first word of each sentence.
+     */
+    export const sentences: string = "sentences";
+
+    /**
+     * Capitalize the first letter of every word.
+     */
+    export const words: string = "words";
+}
+
 let frame: typeof frameModule;
 export function getCurrentPage(): Page {
     if (!frame) {

tns-core-modules/ui/dialogs/dialogs.android.ts

@@ -2,7 +2,7 @@
  * Android specific dialogs functions implementation.
  */
 import { DialogOptions, ConfirmOptions, PromptOptions, PromptResult, LoginOptions, LoginResult, ActionOptions } from ".";
-import { getLabelColor, getButtonColors, isDialogOptions, inputType, ALERT, OK, CONFIRM, CANCEL, PROMPT, LOGIN } from "./dialogs-common";
+import { getLabelColor, getButtonColors, isDialogOptions, inputType, capitalizationType, ALERT, OK, CONFIRM, CANCEL, PROMPT, LOGIN } from "./dialogs-common";
 import { android as androidApp } from "../../application";
 
 export * from "./dialogs-common";
@@ -185,6 +185,21 @@ export function prompt(arg: any): Promise<PromptResult> {
                 } else if (options.inputType === inputType.email) {
                     input.setInputType(android.text.InputType.TYPE_CLASS_TEXT | android.text.InputType.TYPE_TEXT_VARIATION_EMAIL_ADDRESS);
                 }
+
+                switch (options.capitalizationType) {
+                    case capitalizationType.all: {
+                        input.setInputType(input.getInputType() | android.text.InputType.TYPE_TEXT_FLAG_CAP_CHARACTERS);
+                        break;
+                    }
+                    case capitalizationType.sentences: {
+                        input.setInputType(input.getInputType() | android.text.InputType.TYPE_TEXT_FLAG_CAP_SENTENCES);
+                        break;
+                    }
+                    case capitalizationType.words: {
+                        input.setInputType(input.getInputType() | android.text.InputType.TYPE_TEXT_FLAG_CAP_WORDS);
+                        break;
+                    }
+                }
             }
 
             input.setText(options && options.defaultText || "");

tns-core-modules/ui/dialogs/dialogs.d.ts

@@ -23,6 +23,31 @@ export module inputType {
     export var email: string;
 }
 
+/**
+ * Defines the capitalization type for prompt dialog.
+ */
+export module capitalizationType {
+    /**
+     * No automatic capitalization.
+     */
+    export var none: string;
+
+    /**
+     * Capitalizes every character.
+     */
+    export var all: string;
+
+    /**
+     * Capitalize the first word of each sentence.
+     */
+    export var sentences: string;
+
+    /**
+     * Capitalize the first letter of every word.
+     */
+    export var words: string;
+}
+
 /**
  * The alert() method displays an alert box with a specified message.
  * @param message Specifies the text to display in the alert box.
@@ -177,6 +202,11 @@ export interface PromptOptions extends ConfirmOptions {
      * Gets or sets the prompt input type (plain text, password, or email).
      */
     inputType?: string;
+
+    /**
+     * Gets or sets the prompt capitalizationType (none, all, sentences, or words).
+     */
+    capitalizationType?: string;
 }
 
 /**

tns-core-modules/ui/dialogs/dialogs.ios.ts

@@ -3,7 +3,7 @@
  */
 import { View, ios as iosView } from "../core/view";
 import { ConfirmOptions, PromptOptions, PromptResult, LoginOptions, LoginResult, ActionOptions } from ".";
-import { getCurrentPage, getLabelColor, getButtonColors, getTextFieldColor, isDialogOptions, inputType, ALERT, OK, CONFIRM, CANCEL, PROMPT, LOGIN } from "./dialogs-common";
+import { getCurrentPage, getLabelColor, getButtonColors, getTextFieldColor, isDialogOptions, inputType, capitalizationType, ALERT, OK, CONFIRM, CANCEL, PROMPT, LOGIN } from "./dialogs-common";
 import { isString, isDefined, isFunction } from "../../utils/types";
 import { getRootView } from "../../application";
 
@@ -114,6 +114,23 @@ export function prompt(arg: any): Promise<PromptResult> {
 
             textField = alertController.textFields.firstObject;
 
+            if (options) {
+                switch (options.capitalizationType) {
+                    case capitalizationType.all: {
+                        textField.autocapitalizationType = UITextAutocapitalizationType.AllCharacters; break;
+                    }
+                    case capitalizationType.sentences: {
+                        textField.autocapitalizationType = UITextAutocapitalizationType.Sentences; break;
+                    }
+                    case capitalizationType.words: {
+                        textField.autocapitalizationType = UITextAutocapitalizationType.Words; break;
+                    }
+                    default: {
+                        textField.autocapitalizationType = UITextAutocapitalizationType.None;
+                    }
+                }
+            }
+
             addButtonsToAlertController(alertController, options,
                 (r) => { resolve({ result: r, text: textField.text }); });