**Use-cases for each NGX-Bootstrap component show examples of using it by user**

## Accordion

[Examples. Basic](accordion/accordion.examples.basic.use-case.md)

[Examples. Group opening event](accordion/accordion.examples.group-open.use-case.md)

[Examples. Custom-html](accordion/accordion.examples.custom-html.use-case.md)

[Examples. Disabled](accordion/accordion.examples.disabled.use-case.md)

[Examples. Initially opened](accordion/accordion.examples.initially-opened.use-case.md)

[Examples. Dynamic accordion](accordion/accordion.examples.dynamic.use-case.md)

[Examples. Dynamic body content](accordion/accordion.examples.dynamic-body.use-case.md)

[Examples. Manual toggle](accordion/accordion.examples.manual-toggle.use-case.md)

[Examples. Open only one at a time](accordion/accordion.examples.only-one.use-case.md)

[Examples. Styling](accordion/accordion.examples.styling.use-case.md)

[Examples. Configuring defaults](accordion/accordion.examples.conf-defaults.use-case.md)


## Alerts

[Examples. Basic](alerts/alerts.examples.basic.use-case.md)

[Examples. Link color](alerts/alerts.examples.link-color.use-case.md)

[Examples. Additional content](alerts/alerts.examples.add-content.use-case.md)

[Examples. Dismissing](alerts/alerts.examples.dismiss.use-case.md)

[Examples. Dynamic html](alerts/alerts.examples.dynamic-html.use-case.md)

[Examples. Dynamic content](alerts/alerts.examples.dynamic-content.use-case.md)

[Examples. Dismiss on timeout](alerts/alerts.examples.dismiss-on-time.use-case.md)

[Examples. Global styling](alerts/alerts.examples.glob-styling.use-case.md)

[Examples. Component level styling](alerts/alerts.examples.comp-styling.use-case.md)

[Examples. Configuring defaults](alerts/alerts.examples.conf-defaults.use-case.md)


## Buttons

[Buttons examples. Basic](buttons/buttons.examples.basic.use-case.md)

[Buttons examples. Checkbox](buttons/buttons.examples.checkbox.use-case.md)

[Buttons examples. Custom checkbox value](buttons/buttons.examples.custom-checkbox.use-case.md)

[Buttons examples. Checkbox with Reactive Forms](/buttons/buttons.examples.reactive-checkbox.use-case.md)

[Buttons examples. Radio](buttons/buttons.examples.radio.use-case.md)

[Buttons examples. Uncheckable Radio](buttons/buttons.examples.uncheckable-radio.use-case.md)

[Buttons examples. Radio with Reactive Forms](buttons/buttons.examples.reactive-radio.use-case.md)

[Buttons examples. Disabled Buttons](dbuttons/buttons.examples.disabled-buttons.use-case.md)


## Carousel

[Carousel. Basic](carousel/carousel.examples.basic.use-case.md)

[Carousel. Optional captions](carousel/carousel.examples.optional-captions.use-case.md)

[Carousel. Configuring defaults](carousel/carousel.examples.config-defaults.use-case.md)

[Carousel. Dynamic Slides](carousel/carousel.examples.dynamic-slides.use-case.md)

[Carousel. Pause on hover](carousel/carousel.examples.pause-on-hover.use-case.md)

[Carousel. Custom content](carousel/carousel.examples.custom-content.use-case.md)

[Carousel. Disable slide looping](carousel/carousel.examples.disable-looping.use-case.md)

[Carousel. Disable indicator](carousel/carousel.examples.disable-indicator.use-case.md)

[Carousel. Interval](carousel/carousel.examples.interval.use-case.md)

[Carousel. Slide changed event](carousel/carousel.examples.slide-changed-event.use-case.md)

[Carousel. Accessibility](carousel/carousel.examples.accessibility.use-case.md)


## Collapse

[Collapse. Basic](collapse/collapse.examples.basic.use-case.md)

[Collapse. Events](collapse/collapse.examples.events.use-case.md)

[Collapse. Manual toggle](collapse/collapse.examples.manual-toggle.use-case.md)

[Collapse. Accessibility](collapse/collapse.examples.accessibility.use-case.md)


## Datepicker

[Datepicker. Basic](datepicker/datepicker.examples.basic.use-case.md)

[Datepicker. Inline Datepicker](datepicker/datepicker.examples.inline-datepicker.use-case.md)

[Datepicker. Initial state](datepicker/datepicker.examples.initial-state.use-case.md)

[Datepicker. Custom date format](datepicker/datepicker.examples.custom-date-format.use-case.md)

[Datepicker. Hide on scroll](datepicker/datepicker.examples.hide-on-scroll.use-case.md)

[Datepicker. Themes](datepicker/datepicker.examples.themes.use-case.md)

[Datepicker. Locales](datepicker/datepicker.examples.locales.use-case.md)

[Datepicker. Min-max](datepicker/datepicker.examples.min-max.use-case.md)

[Datepicker. Days disabled](datepicker/datepicker.examples.days-disabled.use-case.md)

[Datepicker. Min-mode](datepicker/datepicker.examples.min-mode.use-case.md)

[Datepicker. Disabled](datepicker/datepicker.examples.disabled.use-case.md)

[Datepicker. Custom today class](datepicker/datepicker.examples.custom-today-class.use-case.md)

[Datepicker. Forms](datepicker/datepicker.examples.forms.use-case.md)

[Datepicker. Reactive forms](datepicker/datepicker.examples.reactive-forms.use-case.md)

[Datepicker. Manual triggering](datepicker/datepicker.examples.manual-trigger.use-case.md)

[Datepicker. Placement](datepicker/datepicker.examples.placement.use-case.md)

[Datepicker. Config method](datepicker/datepicker.examples.config-method.use-case.md)

[Datepicker. Visibility Events](datepicker/datepicker.examples.visibility-events.use-case.md)

[Datepicker. Value change event](datepicker/datepicker.examples.value-change-event.use-case.md)

[Datepicker. Config properties](datepicker/datepicker.examples.config-properties.md)

[Datepicker. Select dates from other month](datepicker/datepicker.examples.select-dates-from-other-month.use-case.md)

[Datepicker. Select week](datepicker/datepicker.examples.select-week.use-case.md)

[Datepicker. Outside click](datepicker/datepicker.examples.outside-click.md)

[Datepicker. Trigger by isOpen property](datepicker/datepicker.examples.trigger-by-isopen.md)

[Datepicker. Custom triggers](datepicker/datepicker.examples.custom-trigger.md)


## Dropdowns

[Dropdowns. Basic](dropdowns/dropdowns.examples.basic.use-case.md)

[Dropdowns. Trigger by tag \<a>](dropdowns/dropdowns.examples.trigger-by-a.use-case.md)

[Dropdowns. Split button dropdowns](dropdowns/dropdowns.examples.split-button.use-case.md)

[Dropdowns. Manual triggering](dropdowns/dropdowns.examples.manual-trigger.md)

[Dropdowns. Trigger by isOpen property](dropdowns/dropdowns.examples.trigger-by-isopen.use-case.md)

[Dropdowns. Disabled menu](dropdowns/dropdowns.examples.disabled-menu.use-case.md)

[Dropdowns. Mark item as disabled](dropdowns/dropdowns.examples.mark-item-disabled.use-case.md)

[Dropdowns. Menu alignment](dropdowns/dropdowns.examples.menu-alignment.use-case.md)

[Dropdowns. Inside click](dropdowns/dropdowns.examples.inside-click.use-case.md)

[Dropdowns. Nested dropdowns](dropdowns/dropdowns.examples.nested-dropdowns.use-case.md)

[Dropdowns. Append to body](dropdowns/dropdowns.examples.append-to-body.use-case.md)

[Dropdowns. Dropup variation](dropdowns/dropdowns.examples.dropup-variation.use-case.md)

[Dropdowns. Menu dividers](dropdowns/dropdowns.examples.menu-dividers.use-case.md)

[Dropdowns. Custom html](dropdowns/dropdowns.examples.custom-html.use-case.md)

[Dropdowns. Configuring defaults](dropdowns/dropdowns.examples.config-defaults.use-case.md)

[Dropdowns. Visibility Events](dropdowns/dropdowns.examples.visibility-events.use-case.md)

[Dropdowns. State change event](dropdowns/dropdowns.examples.state-change-event.use-case.md)

[Dropdowns. Auto close](dropdowns/dropdowns.examples.auto-close.use-case.md)

[Dropdowns. Accessibility](dropdowns/dropdowns.examples.accessibility.use-case.md)


## Modals

[Service examples. Template](modals/modals.service-examples.template.use-case.md)

[Service examples. Component](modals/modals.service-examples.component.use-case.md)

[Service examples. Nested](modals/modals.service-examples.nested.use-case.md)

[Service examples. Scrolling long content](modals/modals.service-examples.scrolling-long-content.use-case.md)

[Service examples. Events](modals/modals.service-examples.events.use-case.md)

[Service examples. Confirm Window](modals/modals.service-examples.confirm-window.use-case.md)

[Service examples. Сustom css class](modals/modals.service-examples.custom-css-class.use-case.md)

[Service examples. Animation option](modals/modals.service-examples.animation-option.use-case.md)

[Service examples. Esc closing option](modals/modals.service-examples.esc-closing-option.use-case.md)

[Service examples. Modal window with tooltip and popover](modals/modals.service-examples.tooltip-and-popover.use-case.md)

[Service examples. Backdrop options](modals/modals.service-examples.backdrop-options.use-case.md)

[Directive examples. Static modal](modals/modals.directive-examples.static-modal.use-cases.md)

[Directive examples. Optional sizes](modals/modals.directive-examples.optional-sizes.md)

[Directive examples. Child modal](modals/modals.directive-examples.child-modal.use-case.md)

[Directive examples. Nested modals](modals/modals.directive-examples.nested-modals.use-cases.md)

[Directive examples. Modal events](modals/modals.directive-examples.modal-events.use-cases.md)

[Directive examples. Auto shown modal](modals/modals.directive-examples.auto-shown-modal.md)


## Pagination

[Pagination. Basic](pagination/pagination.examples.basic.use-case.md)

[Pagination. Manual switching page](pagination/pagination.examples.manual-switching-page.use-case.md)

[Pagination. Page changed event](pagination/pagination.examples.page-changed-event.use-case.md)

[Pagination. Pages count changed event](pagination/pagination.examples.pages-count-changed-event.use-case.md)

[Pagination. Boundary links](pagination/pagination.examples.boundary-links.use-case.md)

[Pagination. Direction links](pagination/pagination.examples.direction-links.use-case.md)

[Pagination. Custom links content](pagination/pagination.examples.custom-links-content.use-cases.md)

[Pagination. Disabled](pagination/pagination.examples.disabled.use-case.md)

[Pagination. Limits](pagination/pagination.examples.limits.use-case.md)

[Pagination. Centering the active page link](pagination/pagination.examples.centering-active-page-link.md)

[Pagination. Content switching](pagination/pagination.examples.content-switching.use-case.md)

[Pagination. Pager](pagination/pagination.examples.pager.use-case.md)


## Popover

[Basic](popover/popover.examples.basic.use-case.md)

[Placement](popover/popover.examples.placement.use-case.md)

[Dismiss on next click](popover/popover.examples.dismiss-on-next.use-case.md)

[Dynamic content](popover/popover.examples.dynamic-content.use-case.md)

[Custom content template](popover/popover.examples.custom-content-template.use-case.md)

[Dynamic Html](popover/popover.examples.dynamic-html.use-case.md)

[Append to body](popover/popover.examples.append-to-body.use-case.md)

[Visibility events](popover/popover.examples.visibility-events.use-case.md)

[Configuring defaults](popover/popover.examples.config-defaults.use-case.md)

[Outside click](popover/popover.examples.outside-click.use-case.md)

[Custom triggers](popover/popover.examples.custom-trigger.use-case.md)

[Manual triggering](popover/popover.examples.manual-trigger.use-case.md)

[Trigger by isOpen property](popover/popover.examples.trigger-by-isopen.use-case.md)

[Component level styling](popover/popover.examples.comp-level-styling.use-case.md)

[Custom class](popover/popover.examples.custom-class.use-case.md)

[Popover context](popover/popover.examples.popover-context.use-case.md)


## Progressbar

[Progressbar. Static](progressbar/progressbar.examples.static.use-case.md)

[Progressbar. Dynamic](progressbar/progressbar.examples.dynamic.use-case.md)

[Progressbar. Stacked](progressbar/progressbar.examples.stacked.use-case.md)

[Progressbar. Configuring defaults](progressbar/progressbar.examples.config-default.use-case.md)


## Rating

[Rating. Basic rating](rating/rating.examples.basic.use-case.md)

[Rating. Dynamic rating](rating/rating.examples.dynamic.use-case.md)

[Rating. Custom icons](rating/rating.examples.custom-icons.use-case.md)

[Rating. Select on enter](rating/rating.examples.select-on-enter.use-case.md)


## Sortable

[Basic](sortable/sortable.examples.basic.use-case.md)

[Complex data model](sortable/sortable.examples.complex-data-model.use-case.md)

[Custom item template](sortable/sortable.examples.custom-item-template.use-case.md)

[Accessibility](sortable/sortable.examples.accessibility.use-case.md)


## Tabs

[Basic](tabs/tabs.examples.basic.use-case.md)

[Manual selection](tabs/tabs.examples.manual-selection.use-case.md)

[Disabled tabs](tabs/tabs.examples.disabled.use-case.md)

[Dynamic tabs](tabs/tabs.examples.dynamic.use-case.md)

[Pills](tabs/tabs.examples.pills.use-case.md)

[Vertical Pills](tabs/tabs.examples.vertical-pills.use-case.md)

[Justified](tabs/tabs.examples.justified.use-case.md)

[Custom class](tabs/tabs.examples.custom-class.use-case.md)

[Select event](tabs/tabs.examples.select-event.use-case.md)

[Configuring defaults](tabs/tabs.examples.config-default.use-case.md)

[Custom template](tabs/tabs.examples.custom-template.use-case.md)

[Accessibility](tabs/tabs.examples.accessibility.use-case.md)


## Timepicker

[Basic](timepicker/timepicker.examples.basic.use-case.md)

[Meridian](timepicker/timepicker.examples.meridian.use-case.md)

[Custom meridian](timepicker/timepicker.examples.custom-meridian.use-case.md)

[Min - Max](timepicker/timepicker.examples.min-max.use-case.md)

[Toggle minutes/seconds](timepicker/timepicker.examples.toggle-min-sec.use-case.md)

[Disabled](timepicker/timepicker.examples.disabled.use-case.md)

[Readonly](timepicker/timepicker.examples.readonly.use-case.md)

[Custom steps](timepicker/timepicker.examples.custom-steps.use-case.md)

[Custom validation](timepicker/timepicker.examples.custom-validation.use-case.md)

[Custom validation with isValid event](timepicker/timepicker.examples.custom-validation-event.use-case.md)

[Dynamic](timepicker/timepicker.examples.dynamic.use-case.md)

[Mouse wheel](timepicker/timepicker.examples.mouse-wheel.use-case.md)

[Arrow keys](timepicker/timepicker.examples.arrow-keys.use-case.md)

[Spinners](timepicker/timepicker.examples.spinners.use-case.md)

[Configuring defaults](timepicker/timepicker.examples.config-defaults.use-case.md)


## Tooltip

## Typeahead

[Basic array](typeahead/typeahead.examples.basic-array.use-case.md)

[Item template](typeahead/typeahead.examples.item-template.use-case.md)

[Option field](typeahead/typeahead.examples.option-field.use-case.md)

[Async data](typeahead/typeahead.examples.async-data.use-case.md)

[With delay](typeahead/typeahead.examples.with-delay.use-case.md)

[Template-driven forms](typeahead/typeahead.examples.template-driven-forms.use-case.md)

[Reactive forms](typeahead/typeahead.examples.reactive-forms.use-case.md)

[Grouping results](typeahead/typeahead.examples.grouping-results.use-case.md)

[Ignore spaces and order](typeahead/typeahead.examples.ignore-spaces-order.use-case.md)

[Phrase delimiters](typeahead/typeahead.examples.phrase-delimiters.use-case.md)

[Dropup](typeahead/typeahead.examples.dropup.use-case.md)

[On blur](typeahead/typeahead.examples.on-blur.use-case.md)

[Append to body](typeahead/typeahead.examples.append-to-body.use-case.md)

[No result](typeahead/typeahead.examples.no-result.use-case.md)

[Scrollable](typeahead/typeahead.examples.scrollable.use-case.md)

[Latinize](typeahead/typeahead.examples.latinize.use-case.md)

[On select](typeahead/typeahead.examples.on-select.use-case.md)