Feat web password

examples/passwordinput/README.rst

@@ -0,0 +1,12 @@
+Password Input
+==============
+
+Test app for the Password Input widget.
+
+Quickstart
+~~~~~~~~~~
+
+To run this example:
+
+    $ pip install toga
+    $ python -m passwordinput

examples/passwordinput/passwordinput/__init__.py

@@ -0,0 +1,9 @@
+# Examples of valid version strings
+# __version__ = '1.2.3.dev1'  # Development release 1
+# __version__ = '1.2.3a1'     # Alpha Release 1
+# __version__ = '1.2.3b1'     # Beta Release 1
+# __version__ = '1.2.3rc1'    # RC Release 1
+# __version__ = '1.2.3'       # Final Release
+# __version__ = '1.2.3.post1' # Post Release 1
+
+__version__ = "0.0.1"

examples/passwordinput/passwordinput/__main__.py

@@ -0,0 +1,4 @@
+from passwordinput.app import main
+
+if __name__ == "__main__":
+    main().main_loop()

examples/passwordinput/passwordinput/app.py

@@ -0,0 +1,79 @@
+from string import ascii_lowercase, ascii_uppercase, digits
+
+import toga
+from toga import validators
+from toga.constants import COLUMN
+from toga.style import Pack
+
+EMPTY_PASSWORD = "Empty password"
+
+
+class PasswordInputApp(toga.App):
+    def on_password_change(self, widget):
+        content = widget.value
+        self.password_content_label.text = self.get_password_content_label(content)
+
+    def get_password_content_label(self, content):
+        if content.strip() == "":
+            return EMPTY_PASSWORD
+        contains = set()
+        for letter in content:
+            if letter in ascii_uppercase:
+                contains.add("uppercase letters")
+            elif letter in ascii_lowercase:
+                contains.add("lowercase letters")
+            elif letter in digits:
+                contains.add("digits")
+            else:
+                contains.add("special characters")
+        return "Password contains: {}".format(", ".join(contains))
+
+    def startup(self):
+        # Set up main window
+        self.main_window = toga.MainWindow(title=self.name)
+        PADDING = 5
+        # Label to show responses.
+        self.label = toga.Label("Testing Password")
+        self.password_content_label = toga.Label(
+            EMPTY_PASSWORD, style=Pack(padding_bottom=PADDING)
+        )
+
+        # Padding box only
+        self.password_input = toga.PasswordInput(
+            placeholder="Password...",
+            style=Pack(padding=PADDING),
+            on_change=self.on_password_change,
+            validators=[
+                validators.MinLength(10),
+                validators.ContainsUppercase(),
+                validators.ContainsLowercase(),
+                validators.ContainsSpecial(),
+                validators.ContainsDigit(),
+            ],
+        )
+
+        # Outermost box
+        children = [
+            self.label,
+            self.password_input,
+            self.password_content_label,
+        ]
+        outer_box = toga.Box(
+            children=children,
+            style=Pack(flex=1, direction=COLUMN, padding=10, width=500, height=300),
+        )
+
+        # Add the content on the main window
+        self.main_window.content = outer_box
+
+        # Show the main window
+        self.main_window.show()
+
+
+def main():
+    return PasswordInputApp("PasswordInput", "org.beeware.widgets.passwordinput")
+
+
+if __name__ == "__main__":
+    app = main()
+    app.main_loop()

examples/passwordinput/passwordinput/resources/README

@@ -0,0 +1 @@
+Put any icons or images in this directory.

examples/passwordinput/pyproject.toml

@@ -0,0 +1,55 @@
+[build-system]
+requires = ["briefcase"]
+
+[tool.briefcase]
+project_name = "Password Input"
+bundle = "org.beeware"
+version = "0.0.1"
+url = "https://beeware.org"
+license = "BSD license"
+author = 'Tiberius Yak'
+author_email = "tiberius@beeware.org"
+
+[tool.briefcase.app.passwordinput]
+formal_name = "Password Input Demo"
+description = "A testing app"
+sources = ['passwordinput']
+requires = [
+    '../../core',
+]
+
+
+[tool.briefcase.app.passwordinput.macOS]
+requires = [
+    '../../cocoa',
+    'std-nslog>=1.0.0',
+]
+
+[tool.briefcase.app.passwordinput.linux]
+requires = [
+    '../../gtk',
+]
+
+[tool.briefcase.app.passwordinput.windows]
+requires = [
+    '../../winforms',
+]
+
+# Mobile deployments
+[tool.briefcase.app.passwordinput.iOS]
+requires = [
+    '../../iOS',
+    'std-nslog>=1.0.0',
+]
+
+[tool.briefcase.app.passwordinput.android]
+requires = [
+    '../../android',
+]
+
+# Web deployment
+[tool.briefcase.app.passwordinput.web]
+requires = [
+    '../../web',
+]
+style_framework = "Shoelace v2.3"

web/src/toga_web/factory.py

@@ -21,7 +21,7 @@
 # from .widgets.multilinetextinput import MultilineTextInput
 # from .widgets.numberinput import NumberInput
 # from .widgets.optioncontainer import OptionContainer
-# from .widgets.passwordinput import PasswordInput
+from .widgets.passwordinput import PasswordInput
 from .widgets.progressbar import ProgressBar
 
 # from .widgets.scrollcontainer import ScrollContainer
@@ -66,7 +66,7 @@ def not_implemented(feature):
     # 'MultilineTextInput',
     # 'NumberInput',
     # 'OptionContainer',
-    # 'PasswordInput',
+    "PasswordInput",
     "ProgressBar",
     "ActivityIndicator",
     # 'ScrollContainer',

web/src/toga_web/widgets/passwordinput.py

@@ -0,0 +1,17 @@
+from toga_web.libs import create_proxy
+
+from .textinput import TextInput
+
+
+class PasswordInput(TextInput):
+    def create(self):
+        super().create()
+        self.native.setAttribute("type", "password")
+        self.native.addEventListener("sl-change", create_proxy(self.dom_onchange))
+
+    def dom_onchange(self, event):
+        self.interface.on_change(None)
+
+    def is_valid(self):
+        self.interface.factory.not_implemented("PasswordInput.is_valid()")
+        return True