Merge pull request galaxyproject#21962 from dannon/feature/g-tooltip

Replace v-b-tooltip directive with custom v-g-tooltip

Author: davelopez

client/src/components/Annotation.vue

@@ -2,7 +2,7 @@
     <ClickToEdit
         ref="annotationInput"
         v-slot="{ toggleEdit, placeholder, stateValidator }"
-        v-b-tooltip.hover="{ boundary: 'viewport', placement: tooltipPlacement }"
+        v-g-tooltip.hover="{ placement: tooltipPlacement }"
         class="annotation"
         tag-name="p"
         :value="annotation"

client/src/components/AvailableDatatypes/AvailableDatatypes.vue

@@ -60,7 +60,7 @@ const edamLink = (edamIRI: string) => `https://edamontology.github.io/edam-brows
                     :href="item.descriptionUrl">
                     {{ item.extension }}
                 </GLink>
-                <span v-else v-b-tooltip.hover :title="optionalString(item.description)">
+                <span v-else v-g-tooltip.hover :title="optionalString(item.description)">
                     {{ item.extension }}
                 </span>
             </template>

client/src/components/Citation/CitationsList.vue

@@ -153,7 +153,7 @@ function citationsToBibtexAsText() {
                     </BNav>
                     <BButton
                         v-if="outputFormat === outputFormats.CITATION"
-                        v-b-tooltip.hover
+                        v-g-tooltip.hover
                         title="Copy all references as APA"
                         variant="link"
                         size="sm"
@@ -163,7 +163,7 @@ function citationsToBibtexAsText() {
                     </BButton>
                     <div v-if="outputFormat === outputFormats.BIBTEX" class="bibtex-actions">
                         <BButton
-                            v-b-tooltip.hover
+                            v-g-tooltip.hover
                             title="Copy all references as BibTeX"
                             variant="link"
                             size="sm"
@@ -172,7 +172,7 @@ function citationsToBibtexAsText() {
                             <FontAwesomeIcon :icon="faCopy" />
                         </BButton>
                         <BButton
-                            v-b-tooltip.hover
+                            v-g-tooltip.hover
                             title="Download references as .bib file"
                             variant="link"
                             size="sm"

client/src/components/Collections/BuildFileSetWizard.vue

@@ -270,7 +270,7 @@ const {
             </BAlert>
             <h2 data-galaxy-file-drop-target>
                 {{ title }}
-                <a v-b-tooltip.hover aria-label="Upload Completed Workbook" :title="dropWorkbookTitle" href="#">
+                <a v-g-tooltip.hover aria-label="Upload Completed Workbook" :title="dropWorkbookTitle" href="#">
                     <FontAwesomeIcon
                         class="workbook-upload-helper mr-1"
                         :class="dropZoneClasses"

client/src/components/Common/Abbreviation.vue

@@ -7,7 +7,7 @@ const props = defineProps<Props>();
 </script>
 
 <template>
-    <abbr v-b-tooltip.hover :title="props.explanation">
+    <abbr v-g-tooltip.hover :title="props.explanation">
         <slot></slot>
     </abbr>
 </template>

client/src/components/Common/BreadcrumbHeading.vue

@@ -30,7 +30,7 @@ function isPathActive(path: RawLocation): boolean {
                 <BLink
                     v-if="item.to && !isPathActive(item.to)"
                     :key="index"
-                    v-b-tooltip.hover.bottom.noninteractive
+                    v-g-tooltip.hover.bottom
                     :title="`Go back to ${localize(item.title)}`"
                     :to="item.to"
                     class="breadcrumb-heading-header-active">

client/src/components/Common/BreadcrumbNavigation.vue

@@ -24,7 +24,7 @@ function handleNavigate(index: number | undefined) {
             <button
                 v-if="idx < items.length - 1"
                 :key="`link-${idx}`"
-                v-b-tooltip.hover.noninteractive
+                v-g-tooltip.hover
                 class="breadcrumb-link"
                 :title="`Navigate to ${item.title}`"
                 @click="handleNavigate(item.index)">

client/src/components/Common/DOILink.vue

@@ -14,7 +14,7 @@ const doiLink = computed(() => `https://doi.org/${props.doi}`);
 </script>
 
 <template>
-    <BBadge v-b-tooltip.hover.noninteractive class="doi-badge" size="sm" title="DOI link">
+    <BBadge v-g-tooltip.hover class="doi-badge" size="sm" title="DOI link">
         <ExternalLink :href="doiLink">
             {{ props.doi }}
         </ExternalLink>

client/src/components/Common/FilterMenuInput.vue

@@ -76,7 +76,7 @@ watch(
                 :id="`${identifier}-advanced-filter-${props.name}`"
                 ref="filterMenuInput"
                 v-model="localValue"
-                v-b-tooltip.focus.v-danger="props.error"
+                v-g-tooltip.focus.v-danger="props.error"
                 class="mw-100"
                 size="sm"
                 :state="props.error ? false : null"

client/src/components/Common/FilterMenuRanged.vue

@@ -90,7 +90,7 @@ watch(
             <BFormInput
                 :id="`${props.identifier}-advanced-filter-${localNameGt}`"
                 v-model="localValueGt"
-                v-b-tooltip.focus.v-danger="hasError(localNameGt)"
+                v-g-tooltip.focus.v-danger="hasError(localNameGt)"
                 size="sm"
                 :state="hasError(localNameGt) ? false : null"
                 :placeholder="localPlaceholder('gt')"
@@ -107,7 +107,7 @@ watch(
             <BFormInput
                 :id="`${props.identifier}-advanced-filter-${localNameLt}`"
                 v-model="localValueLt"
-                v-b-tooltip.focus.v-danger="hasError(localNameLt)"
+                v-g-tooltip.focus.v-danger="hasError(localNameLt)"
                 size="sm"
                 :state="hasError(localNameLt) ? false : null"
                 :placeholder="localPlaceholder('lt')"