basic-spread-items

Spreads out a set of items horizontally so they take equal space.

Usage no npm install needed!

<script type="module">
  import basicSpreadItems from 'https://cdn.skypack.dev/basic-spread-items';
</script>

README

API Documentation

SpreadItems ⇐ ElementBase

Spreads out a set of items horizontally so they take equal space.

Live demo

This component is used, for example, by the basic-sliding-viewport component to ensure that children of different size will take up the same amount of horizontal space.

This component currently requires an explicit size by applied to it.

Kind: global class Extends: ElementBase
Mixes: DistributedChildrenAsContent , ObserveContentChanges

spreadItems.content : Array.<HTMLElement>

The content of this component, defined to be the flattened array of children distributed to the component.

Kind: instance property of SpreadItems. Defined by DistributedChildrenAsContent mixin.

"content-changed"

This event is raised when the component's contents (including distributed children) have changed.

Kind: event emitted by SpreadItems. Defined by ObserveContentChanges mixin.

spreadItems.contentChanged()

Invoked when the contents of the component (including distributed children) have changed.

This method is also invoked when a component is first instantiated; the contents have essentially "changed" from being nothing. This allows the component to perform initial processing of its children.

Kind: instance method of SpreadItems. Defined by ObserveContentChanges mixin.