How do you package up modules and related functionality, as in what's the smallest piece that you consider a "widget" or a metaclass?
For example, usually I create a Modal class/widget and reuse that as needed. But I've been thinking of breaking that up to even smaller pieces, and create an Overlay metaclass, which can be reused in Modal, or Tooltip, or anything with an absolute div overlaying the page.
Another example might be, maybe a Content metaclass (the name of this metaclass would need to be revised lol) but this metaclass would be in charge of showing/hiding itself, either via slide up/down, fade in/out, update itself via ajax or what not. This Content metaclass could then be reused in an Accordion widget (each panel sliding up and down could be a Content instance), or in a Tabs widget, etc.
Or a Rotator metaclass that could be reused for a Carousel widget, or anything that cycles through a list of things.
Hopefully I'm being clear with my question. I'm interested to know how small you guys break out your functionality. Also, writing metaclasses in this way is kind of foreign to me, any tips on how to achieve this type of pattern would be appreciated (in essence, a generic metaclass that can be applied to multiple scenarios, but with a way to appropriately augment itself with the right functionality).
Thanks!
EDIT: this would effectively relegate most widgets to simply being containers that bind all of these smaller metaclasses together. In a sense the Decorator pattern (or maybe Composite?) but most examples of the Decorator pattern I found were either too simple and didn't illustrate a real life scenario for me or I'm missing something.