diff --git a/app/assets/javascripts/emoji/components/picker.vue b/app/assets/javascripts/emoji/components/picker.vue index dc3eac0cd0c..b3888114396 100644 --- a/app/assets/javascripts/emoji/components/picker.vue +++ b/app/assets/javascripts/emoji/components/picker.vue @@ -28,6 +28,16 @@ export default { required: false, default: () => [], }, + right: { + type: Boolean, + required: false, + default: true, + }, + boundary: { + type: String, + required: false, + default: '', + }, }, data() { return { @@ -62,7 +72,7 @@ export default { addToFrequentlyUsed(name); }, getBoundaryElement() { - return document.querySelector('.content-wrapper') || 'scrollParent'; + return this.boundary || document.querySelector('.content-wrapper') || 'scrollParent'; }, onSearchInput() { this.$refs.virtualScoller.setScrollTop(0); @@ -87,7 +97,7 @@ export default { menu-class="dropdown-extended-height" category="secondary" no-flip - right + :right="right" lazy @shown="$emit('shown')" @hidden="$emit('hidden')" diff --git a/app/assets/javascripts/set_status_modal/set_status_modal_wrapper.vue b/app/assets/javascripts/set_status_modal/set_status_modal_wrapper.vue index e41f3aa5c9d..a746642c191 100644 --- a/app/assets/javascripts/set_status_modal/set_status_modal_wrapper.vue +++ b/app/assets/javascripts/set_status_modal/set_status_modal_wrapper.vue @@ -267,6 +267,8 @@ export default { v-if="glFeatures.improvedEmojiPicker" dropdown-class="gl-h-full" toggle-class="btn emoji-menu-toggle-button gl-px-4! gl-rounded-top-right-none! gl-rounded-bottom-right-none!" + boundary="viewport" + :right="false" @click="setEmoji" >