ActiveListConfig<T>

Properties

• active Optional

  T [] | T

  Which item or items in the content array are currently active.

  When the active is an array each item in the array is activated from left to right one at a time.

  Note: "active" is chosen over the "activeIndexes" property.

  Defaults to [] meaning no content is active.

  Since 1.0.0

• activeIndexes Optional

  number | number []

  Which index or indexes of the content array are currently active.

  When the activeIndexes is an array each index in the array is activated from left to right one at a time.

  Note: "active" is chosen over the "activeIndexes" property.

  Defaults to [] meaning no content is active.

  Since 1.0.0

• autoPlay Optional

  ActiveListAutoPlayConfig<T>

  Whether or not autoPlay is enabled. When autoPlay is enabled it will automatically move to the next content, based on the duration.

  When isCircular is true content will move to the right indefinitely. When isCircular is false it will stop autoPlay at the end of the content.

  Note: autoPlay will only start when one or more contents are currently active. The reason for this is that the duration, is based on the ActiveList lastActivatedContent property. Whenever there are no more items to activate the autoPlay will stop.

  Defaults to no autoPlay.

  Since 1.0.0

• contents Optional

  T []

  The contents which you want to display, can be an array of anything you want.

  Note: the ActiveList will wrap each item in the contents array inside of a ActiveListContent item.

  Defaults to [] meaning there is no content.

  Since 1.0.0

• cooldown Optional

  ActiveListCooldownConfig<T>

  The cooldown is the number of milliseconds before another activation / deactivation is allowed. For example if the cooldown is 5000 the ActiveList will not allow transitions until after 5 seconds have passed. Any activation / deactivation in that period will simply be ignored.

  This can be useful when you have an animation which should be finished before allowing user interaction again.

  This global cooldown is the same for all transitions you might trigger. If you want a cooldown that differs per button use the cooldown in the ActiveListActivationOptions instead.

  Note that the cooldown options with the ActiveListActivationOptions takes precedence over this more global cooldown.

  IMPORTANT: cooldown is only ran when isUserInteraction within the ActiveListActivationOptions is true. This means that autoPlay, which is not a user interaction, ignores the cooldown.

  Since 1.0.0

• directions Optional

  ActiveListDirection

  Describes which strings should be associated with what direction, will be the value of the ActiveList property direction.

  So when setting the direction next to "up" and the content moves up, the ActiveList.direction will be "up". Useful when wanting to apply CSS classes based on the direction.

  Defaults to { next: 'right', previous: 'left' }`.

  Since 1.0.0

• isCircular Optional

  boolean

  Whether or not the content starts back at the beginning when the end of the content is reached, and whether the content should go to the end when moving left of the start.

  Defaults to true.

  Since 1.0.0

• keepHistoryFor Optional

  number

  For how many items the history may contain in the ActiveList.

  Defaults to 0 meaning that it will not track history.

  Since 1.0.0

• maxActivationLimit Optional

  number | false

  How many items can be active at the same time.

  When the value of limit is false there is no limit to the number of active items.

  Defaults to 1.

  Since 1.0.0

• maxActivationLimitBehavior Optional

  ActiveListMaxActivationLimitBehavior

  How the limit is enforced. In other words what the behavior should be when the limit is surpassed.

  The modes are strings which can be the following values:

  1. 'circular': the first item which was added will be removed so the last item can be added without violating the limit. This basically means that the first one in is the first one out.
  2. 'error': An error is thrown whenever the limit is surpassed, the error is called the ActiveListActivationLimitReachedError.
  3. 'ignore': Nothing happens when an item is added and the limit is reached. The item is simply not added, but no error is thrown.

  Defaults to 'circular'.

  Since 1.0.0