The problem with outer margins and paddings like the examples above is that it breaks encapsulation. Components with outer margins get their elbows out, NBA Jam style, knocking around adjacent components.
External spacing should never be the responsibility of a component. Components should only ever be concerned with internal spacing.
[
add
]
[
|
|
...
]