Draft: Port demos to TypeScript

[vixalien]

This is my attempt to porting demos from javascript to workbench.

Groundwork

• All files were renamed from .js to .ts. I will be running the TypeScript compiler (with tsc) to fix demo files as we go.
• I added a simple README.typescript.md showing basic instructions on how I generated the types
• I added a tsconfig.json file
• I compiled and included all the types in workbench-types

Future tasks

• Don't include all the typescript definitions here. They should probably live in another repo. They are only included here so that I can easily check the validity of the demos I have ported so far.
• Add a simple script that will generate the types for us. Probably similar to https://github.com/vixalien/gi-typescript-definitions/blob/main/generate_types_in_flatpak.sh
• Ensure CI is run for .ts files

Ported demos

• About Dialog
• Accessibility
• Account ⚠️
• Action Bar
• Actions
• Animation
• Audio
• Avatar ⚠️
• Banner
• Box
• Boxed Lists
• Breakpoints
• Button Row
• Button
• CSS Gradients
• Calendar
• Camera ⚠️
• Carousel
• Checkboxes
• Clamp
• Color Dialog ⚠️
• Color Picker ⚠️
• Column View ⚠️
• Context Menu
• Custom Widget
• Dialog
• Drag and Drop ⚠️
• Drawing Area ⚠️
• Drop Down ⚠️
• Drop Zone ⚠️
• Email ⚠️
• Emoji Chooser
• Event Controllers
• File Monitor ⚠️
• Flow Box
• Font Dialog ⚠️
• Frame
• Grid View
• Grid
• HTTP Image ⚠️
• HTTP Request ⚠️
• HTTP Server
• Image
• Label
• Launcher ⚠️
• Level Bars
• Link Button
• List Model
• List View
• Location ⚠️
• Map
• Memory Monitor
• Menu Button
• Menu
• Message Dialogs ⚠️
• Navigation View
• Network Monitor
• Notification
• Open File ⚠️
• Overlay Split View
• Overlay
• Picture
• Popovers
• Power Profile Monitor
• Preferences Dialog
• Progress Bar
• Radio Buttons
• Revealer
• SVG
• Save File ⚠️
• Scale
• Screencast ⚠️
• Screenshot
• Scrolled Window
• Search
• Select Folder ⚠️
• Separator
• Session Monitor and Inhibit ⚠️
• Snapshot
• Source View
• Spell Checker
• Spin Button
• Spinner
• Stack
• Styling with CSS
• Switch
• Tab View
• Text Colors
• Text Fields
• Text View
• Toasts
• Toggle Button
• Tooltip
• Video
• View Switcher
• Wallpaper ⚠️
• Web View
• WebSocket Client
• Welcome

[vixalien]

To work with this version of the demos while hacking on Workbench, you can bind mount it. For example,

sudo mount --bind /path/to/cloned/demos /path/to/Worbench

[vixalien]

Currently all the demos are ported 🥳. However, some demos have // @ts-expect-error directives where the types generated have some issue or another. I have tried to create relevant issues upstream and link to them, but a longer term strategy may be need.

Now it's time for rebase, and working on other steps.