Create a Magento 2 Custom Widget to track the package

Custom Widget should have the following 3 functions (see the attachment UI.jpg)

Function 1:
Search orders in the database of our Magento 2 website according to the customer-entered Email address, if order(s) are found, then send an Email to the Email address to inform the customer his/her order(s).

Email Titel: Your order(s) on mydesignlist.com
Email Body:

Dear customer,

here is your order(s) on mydesignlist.com:
Order number 1
Order number 2 (if existed)
....
Order number N (if existed)

Thank you very much,
Best regards,


Function 2:
Track the package with the package tracking number via API (API is very simple, see the attachment Screenshot_1.jpg)

A URL parameter will be added to the package tracking URL once we click the Search button

For example:
if the package tracking URL is
https://www.example.com/track-your-order
and the tracking number is 12345678

then add the URL parameter tracking_numbers=12345678 to the URL once click the Search button
https://www.example.com/track-your-order?tracking_numbers=12345678

We can also track the package 12345678 with the URL https://www.example.com/track-your-order?tracking_numbers=12345678 directly.

Function 3:
Track the package with the order number via API (API is very simple, see the attachment Screenshot_2.jpg)

2 URL parameters will be added to the package tracking URL once we click the Search button

For example:
if the package tracking URL is
https://www.example.com/track-your-order
the order number is 666888999
and the first five characters of the entered Email address is ABCDE

then add 2 URL parameters order_numbers=666888999 and add=ADCDE to the URL once we click the Search button
https://www.example.com/track-your-order?order_numbers=666888999&add=ADCDE

We can also track the order 666888999 with the URL https://www.example.com/track-your-order?order_numbers=666888999&add=ADCDE directly

We just need the order number to get the tracking info via API, but the tracking info should not be shown to the customer before verifying the first five characters of the Email address,

How to verify the first five characters of the Email address:
An Email address will be contained in the API responded json file (see the attachment Screenshot_3.jpg), so compare the first five characters of the Email address in the API responded file and the first five characters of the entered Email address, not case sensitive, for example, Abcde is the same as abCDe

One order may contain more than one package, then show the packages as the screenshots Screenshot_4.jpg and Screenshot_5.jpg

Requirements:
1. All the code and all the files should not be encrypted, so that we can modify the code and the files ourselves in the future.
2. UI Design: Details see the attachments UI.jpg and UI_Details.pdf
3. All the texts will be shown on the package tracking page(see the attachments UI.jpg and UI_Details.pdf) can be translated in the i18n directory, reference see: https://developer.adobe.com/commerce/frontend-core/guide/translations/
4. Using the object manager directly is not allowed, references:
https://magefan.com/blog/magento-2-object-manager
https://magento.stackexchange.com/questions/117098/to-use-or-not-to-use-the-objectmanager-directly


References:
How to create a Magento 2 Custom Widget:
https://www.mageplaza.com/devdocs/magento-2-create-widget/
https://www.cloudways.com/blog/magento-2-custom-widget/