Triple-State (or Multi-State) UI Object (Button)

Any ideas for how to design a multi-state UI "button"? The three states are:

• Off


• On, Selected


• On, Unselected

There needs to be a clear interaction difference between a user "Selecting" it and turning it "on" or "off".

Some clarifications from the comments:

On, Unselected means that the component driven by the button is 'On' or 'Enabled' but the controls/variables/view for that button is not in view (because it's not selected).

Off+Selected may be allowed, but for simplicity and to try out a design first I would rather keep it to just 3 states: Off, On+Selected, On+Unselected

Turning the component 'on' or 'off' is separate from the action of showing and hiding the variables associated with that component. Which is why the on/off interaction does not have to necessarily be part of the same button. However, there will be a handful of these buttons on the screen at any given moment, so it needs to be clear which button the user is actually turning on or off.

Any design patterns or inspirations you can think of?

For some more clarity, here is a wireframe example. The buttons in question are labeled A,B,C,D. There may be multiple "Controllers" on the page at any given time. The question is, what is a good way to allow the user to Turn On/Off one of the components (ABCD) and also to Select/Deselect...

^{download bmml source – Wireframes created with Balsamiq Mockups}