Sha256: fc72d44f723aea7c76453368a462a65f848de484ed21f8481e9f8094d023356a

Contents?: true

Size: 1.07 KB

Versions: 2186

Compression:

Stored size: 1.07 KB

Contents

A `popover` is a way to toggle content on top of other content. It can be used for small texts, small forms, or even dropdowns. By default, popover will toggle open/closed by simply clicking the trigger element.

### Enhancements

In addition, you may also choose to enable enhanced functionality so that the popover may be toggled by clicking outside of the "trigger element" and/or popover itself.

#### Usecase #1 - Close on click into popover content

You are building a single page application where clicking into the popover itself triggers some asynchronous actions which mutate the UI instantaneously. As a result, may want the popover to automatically close after a selection has been made from the popover contents.

#### Usecase #2 - Close only on click outside of popover content

You are building an custom in-page results filter list which is contained inside of the popover's content area. Since the filter list contains 5 filters, you may want to keep the popover open so that users may select multiple filters then only close the popover when users click outside of the popover.

Version data entries

2,186 entries across 2,186 versions & 2 rubygems

Version Path
playbook_ui-14.11.0.pre.rc.4 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.11.0.pre.rc.3 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.11.0.pre.rc.3 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.10.0.pre.alpha.PBNTR662stickyrightcolumnreact5160 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.10.0.pre.alpha.PBNTR662stickyrightcolumnreact5160 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.11.0.pre.rc.2 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.11.0.pre.rc.2 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.11.0.pre.rc.1 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.11.0.pre.rc.1 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.10.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5137 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.10.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5137 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.11.0.pre.rc.0 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.11.0.pre.rc.0 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.9.0.pre.alpha.PBNTR767advancedtablemultiheadercolumns5136 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.9.0.pre.alpha.PBNTR767advancedtablemultiheadercolumns5136 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.9.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5121 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.9.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5121 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui_docs-14.9.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5120 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.9.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5120 app/pb_kits/playbook/pb_popover/docs/_description.md
playbook_ui-14.10.0 app/pb_kits/playbook/pb_popover/docs/_description.md