Interface CollapsibleConfig

Automatically close the collapsible when clicking outside it or pressing Escape. Furthermore, if any trigger opens the widget on OpenableTriggerConfig.hover, the widget will be closed when the pointer leaves both the trigger and the root.

Class name(s) or a list of class names of the collapsible. Will result in the top-level root element that's created by us getting these classes.

Open sideways (to the right) instead of downwards (default).

IMPORTANT: In horizontal mode the width of the content element should not be set (or be auto), but you can use min-width or max-width in your CSS if needed.

Add an icon to each trigger.

If set to something other than false, then by default the icon in the closed state is a plus (+) and in the open state it's a minus (-), but this can be configured with iconClosed and iconOpen.

Set the type of icon used on the trigger(s) in the closed state.

Note that icon must be set to something other than false.

Set the type of icon used on the trigger(s) in the open state.

Note that icon must be set to something other than false.

The DOM ID of the collapsible. Will result in the top-level root element that's created by us getting this ID.

Note, this does not replace or affect the data-lisn-collapsible-content-id attribute used to link triggers to the collapsible.

If not false, part of the content will be visible when the collapsible is closed. The value can be any valid CSS width specification.

If you set this to true, then the size of the peek window will be dictated by CSS. By default the size is 100px, but you can change this by setting --lisn-peek-size CSS property on the content element or any of its ancestors.

Otherwise, if the value is a string, it must be a CSS length including units.

Open to the left if horizontal or upwards if vertical.

The elements that open the widget when clicked on. You can also pass a map whose keys are the elements and values are OpenableTriggerConfig objects.

If not given, then the elements that will be used as triggers are discovered in the following way:

1. If the content element has a data-lisn-collapsible-content-id attribute, then it must be a unique (for the current page) ID. In this case, the trigger elements will be any element in the document that has a lisn-collapsible-trigger class or data-lisn-collapsible-trigger attribute and the same data-lisn-collapsible-content-id attribute.
2. Otherwise, the closest ancestor that has a lisn-collapsible-container class, or if no such ancestor then the immediate parent of the content element, is searched for any elements that have a lisn-collapsible-trigger class or data-lisn-collapsible-trigger attribute and that do not have a data-lisn-collapsible-content-id attribute, and that are not children of the content element.