Skip to content

Popup: Publish focusLoopEnabled option#33001

Open
marker-dao wants to merge 1 commit intoDevExpress:26_1from
marker-dao:26_1_popup_loop_focus
Open

Popup: Publish focusLoopEnabled option#33001
marker-dao wants to merge 1 commit intoDevExpress:26_1from
marker-dao:26_1_popup_loop_focus

Conversation

@marker-dao
Copy link
Contributor

No description provided.

@marker-dao marker-dao force-pushed the 26_1_popup_loop_focus branch from bc4a646 to 860e0cf Compare March 20, 2026 16:51
@marker-dao marker-dao marked this pull request as ready for review March 20, 2026 16:51
@marker-dao marker-dao requested review from a team as code owners March 20, 2026 16:51
Copilot AI review requested due to automatic review settings March 20, 2026 16:51
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR exposes a previously internal focus-looping behavior as a public focusLoopEnabled option (replacing _loopFocus) for Popup and dependent overlay-based components, and propagates the new option through internal usages, typings, wrappers, and tests.

Changes:

  • Added public focusLoopEnabled to dxPopupOptions typings (including aggregated typings).
  • Replaced internal _loopFocus usage with focusLoopEnabled across overlay/popup-related implementation code and affected UI features (grids, scheduler, lookup).
  • Updated QUnit tests and Angular/React/Vue wrappers to use and surface focusLoopEnabled.

Reviewed changes

Copilot reviewed 56 out of 58 changed files in this pull request and generated no comments.

Show a summary per file
File Description
packages/devextreme/ts/dx.all.d.ts Publishes focusLoopEnabled in aggregated dxPopupOptions typings.
packages/devextreme/testing/tests/DevExpress.ui.widgets/overlay.tests.js Updates overlay focus-loop tests to use focusLoopEnabled instead of _loopFocus.
packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/lookup.tests.js Updates lookup popup-option expectations to check focusLoopEnabled.
packages/devextreme/js/ui/popup.d.ts Adds public focusLoopEnabled?: boolean to dxPopupOptions with doc/default metadata.
packages/devextreme/js/__internal/ui/popup/m_popup.ts Sets focusLoopEnabled: false in Popup default options.
packages/devextreme/js/__internal/ui/popover/m_popover.ts Minor formatting-only change in escape key handler block.
packages/devextreme/js/__internal/ui/overlay/overlay.ts Renames internal option _loopFocusfocusLoopEnabled and updates tab-terminator logic + optionChanged handling.
packages/devextreme/js/__internal/ui/m_lookup.ts Passes focusLoopEnabled into the Lookup popup/dropdown options.
packages/devextreme/js/__internal/scheduler/tooltip_strategies/m_desktop_tooltip_strategy.ts Uses extraOptions.focusLoopEnabled when creating scheduler tooltip overlay.
packages/devextreme/js/__internal/scheduler/m_compact_appointments_helper.ts Enables focus looping for compact appointment tooltip via focusLoopEnabled: true.
packages/devextreme/js/__internal/grids/new/grid_core/column_chooser/column_chooser.tsx Switches ColumnChooser popup prop to focusLoopEnabled.
packages/devextreme/js/__internal/grids/grid_core/header_filter/m_header_filter_core.ts Enables focus looping in header filter popup via focusLoopEnabled: true.
packages/devextreme/js/__internal/grids/grid_core/column_chooser/m_column_chooser.ts Enables focus looping in column chooser popup via focusLoopEnabled: true.
packages/devextreme-vue/src/tree-list.ts Exposes focusLoopEnabled on popup-related nested configs for Vue TreeList.
packages/devextreme-vue/src/tooltip.ts Exposes focusLoopEnabled as a Vue Tooltip prop and update event.
packages/devextreme-vue/src/tag-box.ts Exposes focusLoopEnabled on Vue TagBox dropDownOptions.
packages/devextreme-vue/src/select-box.ts Exposes focusLoopEnabled on Vue SelectBox dropDownOptions.
packages/devextreme-vue/src/popup.ts Exposes focusLoopEnabled as a Vue Popup prop and update event.
packages/devextreme-vue/src/popover.ts Exposes focusLoopEnabled as a Vue Popover prop and update event.
packages/devextreme-vue/src/lookup.ts Exposes focusLoopEnabled on Vue Lookup dropDownOptions.
packages/devextreme-vue/src/drop-down-button.ts Exposes focusLoopEnabled on Vue DropDownButton dropDownOptions.
packages/devextreme-vue/src/drop-down-box.ts Exposes focusLoopEnabled on Vue DropDownBox dropDownOptions.
packages/devextreme-vue/src/date-range-box.ts Exposes focusLoopEnabled on Vue DateRangeBox dropDownOptions.
packages/devextreme-vue/src/date-box.ts Exposes focusLoopEnabled on Vue DateBox dropDownOptions.
packages/devextreme-vue/src/data-grid.ts Exposes focusLoopEnabled on popup-related nested configs for Vue DataGrid.
packages/devextreme-vue/src/color-box.ts Exposes focusLoopEnabled on Vue ColorBox dropDownOptions.
packages/devextreme-vue/src/autocomplete.ts Exposes focusLoopEnabled on Vue Autocomplete dropDownOptions.
packages/devextreme-react/src/tree-list.ts Adds focusLoopEnabled to React TreeList popup-related prop typings.
packages/devextreme-react/src/tag-box.ts Adds focusLoopEnabled to React TagBox dropDownOptions prop typings.
packages/devextreme-react/src/select-box.ts Adds focusLoopEnabled to React SelectBox dropDownOptions prop typings.
packages/devextreme-react/src/lookup.ts Adds focusLoopEnabled to React Lookup dropDownOptions prop typings.
packages/devextreme-react/src/drop-down-button.ts Adds focusLoopEnabled to React DropDownButton dropDownOptions prop typings.
packages/devextreme-react/src/drop-down-box.ts Adds focusLoopEnabled to React DropDownBox dropDownOptions prop typings.
packages/devextreme-react/src/date-range-box.ts Adds focusLoopEnabled to React DateRangeBox dropDownOptions prop typings.
packages/devextreme-react/src/date-box.ts Adds focusLoopEnabled to React DateBox dropDownOptions prop typings.
packages/devextreme-react/src/data-grid.ts Adds focusLoopEnabled to React DataGrid popup-related prop typings.
packages/devextreme-react/src/color-box.ts Adds focusLoopEnabled to React ColorBox dropDownOptions prop typings.
packages/devextreme-react/src/autocomplete.ts Adds focusLoopEnabled to React Autocomplete dropDownOptions prop typings.
packages/devextreme-angular/src/ui/tree-list/nested/popup.ts Adds Angular @Input() focusLoopEnabled to TreeList popup nested option.
packages/devextreme-angular/src/ui/tree-list/nested/filter-builder-popup.ts Adds Angular @Input() focusLoopEnabled to TreeList filterBuilderPopup nested option.
packages/devextreme-angular/src/ui/tooltip/index.ts Adds Angular Tooltip focusLoopEnabled input/output and emitter wiring.
packages/devextreme-angular/src/ui/tag-box/nested/drop-down-options.ts Adds Angular TagBox dropDownOptions focusLoopEnabled input.
packages/devextreme-angular/src/ui/select-box/nested/drop-down-options.ts Adds Angular SelectBox dropDownOptions focusLoopEnabled input.
packages/devextreme-angular/src/ui/popup/component.ts Adds Angular Popup focusLoopEnabled input/output and emitter wiring.
packages/devextreme-angular/src/ui/popover/index.ts Adds Angular Popover focusLoopEnabled input/output and emitter wiring.
packages/devextreme-angular/src/ui/nested/popup.ts Registers focusLoopEnabled as a nested popup option for Angular.
packages/devextreme-angular/src/ui/nested/filter-builder-popup.ts Registers focusLoopEnabled as a nested filter-builder-popup option for Angular.
packages/devextreme-angular/src/ui/nested/drop-down-options.ts Registers focusLoopEnabled as a nested drop-down-options option for Angular.
packages/devextreme-angular/src/ui/nested/base/popup-options.ts Adds focusLoopEnabled to the Angular base popup-options abstraction.
packages/devextreme-angular/src/ui/lookup/nested/drop-down-options.ts Adds Angular Lookup dropDownOptions focusLoopEnabled input.
packages/devextreme-angular/src/ui/drop-down-button/nested/drop-down-options.ts Adds Angular DropDownButton dropDownOptions focusLoopEnabled input.
packages/devextreme-angular/src/ui/drop-down-box/nested/drop-down-options.ts Adds Angular DropDownBox dropDownOptions focusLoopEnabled input.
packages/devextreme-angular/src/ui/date-range-box/nested/drop-down-options.ts Adds Angular DateRangeBox dropDownOptions focusLoopEnabled input.
packages/devextreme-angular/src/ui/date-box/nested/drop-down-options.ts Adds Angular DateBox dropDownOptions focusLoopEnabled input.
packages/devextreme-angular/src/ui/data-grid/nested/popup.ts Adds Angular DataGrid popup nested option focusLoopEnabled input.
packages/devextreme-angular/src/ui/data-grid/nested/filter-builder-popup.ts Adds Angular DataGrid filterBuilderPopup nested option focusLoopEnabled input.
packages/devextreme-angular/src/ui/color-box/nested/drop-down-options.ts Adds Angular ColorBox dropDownOptions focusLoopEnabled input.
packages/devextreme-angular/src/ui/autocomplete/nested/drop-down-options.ts Adds Angular Autocomplete dropDownOptions focusLoopEnabled input.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants