Basically XPM uses the same extension model as the CME does, it has a different configuration section (
<ext:editorextension target="CME"> vs.
<ext:editorextension target="SiteEdit">) and has different view names and controls, but other than that you have the same type of options you can work with.
If you want to look at more details for the Ribbon Toolbar, like using the smaller buttons in a group or the dropdowns, you have to use the Tridion User Controls (
.ascx) for that, I've explained some details of that in a blog post a while ago http://www.tridiondeveloper.com/ribbon-item-group
What comes in handy is that the CME and XPM come with a ton of examples actually next to what is all documentated about it (http://docs.sdl.com/LiveContent/content/en-US/SDL%20Web-v5/GUID-44562CE1-5D81-4E64-B65B-C8BFA0BAA53D). The examples I always look at are the UI screens of the CME and XPM themselves, if you take a look on the server where you have the CME installed you can look for yourself in:
[installation path]\SDL Web\web\WebUI\Editors\CME and
[installation path]\SDL Web\web\WebUI\Editors\SiteEdit, where
[installation path] is probably something like
C:\Programn Files (x86).
In here you have the configuration file (
..\Configuration\SiteEditEditor.config) that contains all the different extentions that the CME and XPM themselves consist of. They point to the
.asxc files which contain further examples of what you can use, and they also contain the names of the views and controls you need.
For the Component Properties panel, take a look at everything which mentions
PropertiesBox in the
SiteEditEditor.config. Any page that has an
ExtendableArea in it, can be extended by you.