Add hints for configurations that impact performance

lib/vue/src/components/hint/CHint.vue

@@ -0,0 +1,39 @@
+<template>
+  <div
+    v-if="tooltip"
+    v-b-tooltip.hover.right="{ variant: tooltipVariant, title: tooltip, container: '#body' }"
+    class="d-flex align-items-center ml-1"
+  >
+    <font-awesome-icon
+      :icon="icon"
+      :class="iconClass"
+    />
+  </div>
+</template>
+
+<script>
+
+export default {
+  props: {
+    icon: {
+      type: Array,
+      default: () => ['far', 'question-circle'],
+    },
+
+    iconClass: {
+      type: String,
+      default: 'text-primary',
+    },
+
+    tooltip: {
+      type: String,
+      default: '',
+    },
+
+    tooltipVariant: {
+      type: String,
+      default: 'dark',
+    },
+  },
+}
+</script>

lib/vue/src/components/hint/index.ts

@@ -0,0 +1 @@
+export { default as CHint } from './CHint.vue'

lib/vue/src/components/index.ts

@@ -89,4 +89,8 @@ export {
   CToolbar,
 } from './toolbar'
 
+export {
+  CHint,
+} from './hint'
+
 export { default as C3 } from './c3'

lib/vue/src/components/input/CInputConfirm.vue

@@ -23,6 +23,7 @@
           <font-awesome-icon
             v-if="showIcon"
             :icon="icon"
+            :class="iconClass"
           />
           <span
             v-if="text"
@@ -89,6 +90,11 @@ export default {
       default: '',
     },
 
+    iconClass: {
+      type: String,
+      default: '',
+    },
+
     textClass: {
       type: String,
       default: '',