Replace GlDeprecatedDropdown with GlDropdown in app/assets/javascripts/confidential_merge_request/components/dropdown.vue

Please migrate GlDeprecatedDropdown to the new implementation in the following file:

• app/assets/javascripts/confidential_merge_request/components/dropdown.vue

Instructions

• Replace imports of GlDeprecatedDropdown* with GlDropdown*
• Replace each instance of <gl-deprecated-dropdown> with <gl-dropdown>.
• Replace each instance of <gl-deprecated-dropdown-divider> with <gl-dropdown-divider>.
• Replace each instance of <gl-deprecated-dropdown-header> with <gl-dropdown-header>.
• Replace each instance of <gl-deprecated-dropdown-item> with <gl-dropdown-item>.
• Take before/after screenshots of each button in the file, and include them in the Merge Request description.
• Request review from a designer within your stage group. If you are outside of a stage group, ping a UX foundations member.

Notable differences between GlDeprecatedDropdown and GlNewDropdown

Please refer to the documentation for GlNewDropdown

GlDropdown

• the no-carat property no longer exists
• properties now exist for category, variant, size, and icon analogous to GlButton
• if icons or variant classes were manually applied before, please utilize these new properties instead

GlDropdownDivider

• identical implementation

GlDropdownHeader

• identical implementation

GlDropdownItem

• all behaviors of GlDeprecatedDropdown are identical
• contains a superset of properties to govern the implementation of checkmarks, icons, and avatars, as well as "secondary text". If any of these were manually implemented before, please utilize these new properties instead.