Gadgets use the same principle as MediaWiki:Wikia.js, MediaWiki:Common.css, etc. because they allow scripting or styling over the entire site. Since Gadgets function in this manner (the list that enables them as well as the actual JS and CSS pages), it requires being a wiki admin to manage these, just like the sitewide JS or CSS.
The first field is the gadget's internal name, and may only contain letters and numbers in order to function correctly. If the internal name is Navigation_popups, the corresponding MediaWiki namespace page will be MediaWiki:Gadget-Navigation popups. This page allows you to define a description text which will be displayed on the Gadgets section of your preferences.
The second and subsequent fields define the pages that make up the code. In the above example, popups.js and navpop.css would be MediaWiki:Gadget-popups.js and MediaWiki:Gadget-navpop.css respectively. Like other sitewide pages, Gadgets may only be written using JS and CSS pages.
These defined pages will allow the gadget to appear in the "Gadgets" section of everyone's preferences, so users can choose which gadgets fit their wiki needs. An overview of added gadgets can be found on Special:Gadgets, along with links to the respective pages that define them, which allows for better control over the wiki's gadgets.
The Special:Gadgets page allows quick overview and easy management of all your gadgets interface with easy linking to every special page that controls all of your gadgets functionality and interface. The headings that appear in your preferences may also be redefined here.
Please note that all Gadget MediaWiki namespace pages must be prefixed with Gadget-, the only exception is where you define them in MediaWiki:Gadgets-definition as displayed in the above example.
You can see this extension in action at Help:Gadgets. Head to your Special:Preferences and go to the gadget tab. From there you can try one out by checking the box next to it and hitting Save.