Sha256: 8dc6f1e96f68c93a3c3ef7754ba48bd511cab215afe7a8ce6c341a30c81ef3eb

Contents?: true

Size: 851 Bytes

Versions: 1819

Compression:

Stored size: 851 Bytes

Contents

Datepicker supports `position` options from [Flatpickr Options Documentation](https://flatpickr.js.org/options/). There are multiple positioning options to choose from.

**Note:** In order for the above prop to work properly, you must also send `staticPosition={false}` to your Datepicker kit instance.

#### Affix Datepicker Upon Scrolling

Upon adding `static={false}` to the date picker, you will notice that the date picker detaches from the input field while scrolling. This is a known Flatpickr nuance. By adding the `scrollContainer` prop, you can tell the date picker which DOM container it should watch for scroll events. In this example, you can see that `scrollContainer=".pb--page--content--main"` is being passed in order to keep the date picker correctly positioned on page scroll.

**Useage:** `scrollContainer: .validQuerySelectorHere`

Version data entries

1,819 entries across 1,819 versions & 2 rubygems

Version Path
playbook_ui_docs-12.20.0.pre.alpha.movemarkdown668 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.20.0.pre.alpha.title2667 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.20.0.pre.alpha.title2665 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.20.0 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.19.0.pre.alpha.PLAY699zindexresponsive650 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui_docs-12.19.0.pre.alpha.movemarkdown639 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.19.0.pre.alpha.PLAY603datepickerquickpickinputpresetdropdown638 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY785typeaheadts632 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.19.0 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY603datepickerquickpickinputpresetdropdown629 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY603datepickerquickpickinputpresetdropdown628 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.play786multilevelselectimprovements627 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY603datepickerquickpickinputpresetdropdown626 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY603datepickerquickpickinputpresetdropdown617 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY735mobileheadersfix616 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.play786multilevelselectimprovements613 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY747carddarktokens610 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY785typeaheadts608 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0.pre.alpha.PLAY785typeaheadts607 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md
playbook_ui-12.18.0 app/pb_kits/playbook/pb_date_picker/docs/_date_picker_positions.md