added function for trigger in admin

src/components/AdminFieldHelp.vue

@@ -1,25 +1,60 @@
 <template>
-  <p v-if="text" class="admin-field-help" :class="rootClass">{{ text }}</p>
+  <a-tooltip
+    v-if="text"
+    placement="top"
+    :title="text"
+    overlay-class-name="admin-field-help-tooltip"
+    :overlay-style="{ zIndex: TOOLTIP_ABOVE_MODAL_Z_INDEX }"
+    :overlay-inner-style="{
+      maxWidth: '22rem',
+      direction: 'rtl',
+      textAlign: 'right',
+      whiteSpace: 'pre-line',
+    }"
+    :mouse-enter-delay="0.15"
+  >
+    <span
+      class="admin-field-help"
+      :class="rootClass"
+      role="img"
+      :aria-label="text"
+      tabindex="0"
+    >
+      <IosInfoBadge :size="size" />
+    </span>
+  </a-tooltip>
 </template>
 
 <script setup lang="ts">
+import IosInfoBadge from '@/pages/dashboard/components/IosInfoBadge.vue'
+import { TOOLTIP_ABOVE_MODAL_Z_INDEX } from '@/constants/overlayZIndex'
+
 withDefaults(
   defineProps<{
     text?: string
     rootClass?: string
+    size?: 'xs' | 'sm' | 'md'
   }>(),
   {
     text: '',
     rootClass: '',
+    size: 'xs',
   }
 )
 </script>
 
 <style scoped lang="less">
 .admin-field-help {
-  margin: 0;
-  font-size: 11px;
-  color: var(--admin-text-secondary);
-  line-height: 1.5;
+  display: inline-flex;
+  align-items: center;
+  line-height: 0;
+  cursor: help;
+  vertical-align: middle;
+}
+</style>
+
+<style>
+.ant-tooltip.admin-field-help-tooltip {
+  z-index: 1250 !important;
 }
 </style>

src/components/AdminLabelWithHelp.vue

@@ -0,0 +1,31 @@
+<template>
+  <span
+    class="admin-label-with-help inline-flex max-w-full items-center gap-1.5"
+    :class="[textClass, rootClass]"
+  >
+    <span :class="labelClass">{{ label }}</span>
+    <AdminFieldHelp v-if="help" :text="help" :size="size" />
+  </span>
+</template>
+
+<script setup lang="ts">
+import AdminFieldHelp from '@/components/AdminFieldHelp.vue'
+
+withDefaults(
+  defineProps<{
+    label: string
+    help?: string
+    size?: 'xs' | 'sm' | 'md'
+    textClass?: string
+    labelClass?: string
+    rootClass?: string
+  }>(),
+  {
+    help: '',
+    size: 'xs',
+    textClass: 'text-sm',
+    labelClass: '',
+    rootClass: '',
+  }
+)
+</script>