Templating into default slots

The library is built on Web Components, which can be parametrized via attributes, properties and slots. Slots are the main mean of operation for composing our components. THere can be named slots that you can assign elements to with the slot attribute (i.e. slot="icon") and default slots. The default slot is the slot, that elements get assigned to, if they do not have an explicit slot attribute.

There are several places, where our components have a default behavior for empty default slots, i.e. a zui-button with an icon has a different behavior than one with text:

<zui-button><zui-icon-common-holy-placeholder slot="icon"></zui-icon-common-holy-placeholder></zui-button>

This would render a proper icon-only button.

However:

<zui-button>
  <zui-icon-common-holy-placeholder slot="icon"></zui-icon-common-holy-placeholder>
</zui-button>

would not, because the default slot is not empty - it contains a line break. So you have to make sure, that you do not use line breaks in components, that rely on certain fallback behavior of default slots. This basically amounts to all components, that you want to pass a skeleton into the default slot.