@policystudio/policy-studio-ui-vue 1.1.24 → 1.1.27

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@policystudio/policy-studio-ui-vue",
-  "version": "1.1.24",
+  "version": "1.1.27",
   "description": "Policy Studio UI",
   "main": "src/index.js",
   "author": "Policy Studio Team",
@@ -24,6 +24,7 @@
   },
   "dependencies": {
     "core-js": "^3.6.5",
+    "v-tooltip": "^2.1.3",
     "vue": "^2.6.11"
   },
   "devDependencies": {

package/src/components/forms/PsDropdownList.vue

@@ -36,7 +36,7 @@
         v-if="rightLabelFormatter"
         class="psui-el-dropdown-menu-list-item-rigth-label"
       >
-        {{ rightLabelFormatter(item.key, studyData[item.key], studyData) }}
+        {{ rightLabelFormatter(item.key, getStudyDataLevel[item.key], getStudyDataLevel) }}
       </div>
       <div 
         v-else
@@ -142,6 +142,9 @@ export default {
     getItems() {
       return this.items
     },
+    getStudyDataLevel() {
+      return this.studyData?.data || this.studyData
+    },
   },
   methods: {
     selectItem(item) {

package/src/components/table-results/PsTableResults.vue

@@ -50,18 +50,19 @@
                   @click.native="onCollapse(item)"
                 />
 
-                <PsRichTooltip 
+                <div 
                   v-if="item.is_disabled || item.tooltip_text"
-                  layout="gray"
-                  position="top"
                   class="psui-inline-flex psui-cursor-default sticky"
                   :class="{ 'is-last-deep' : item.last_deep }"
+                  v-tooltip="{
+                    content: getTooltipContent(item),
+                    classes : 'layout-gray'
+                  }"
                 >
-                  <template v-slot:trigger>
-                    <div class="flex psui-items-center psui-relative ">
+                  <div class="flex psui-items-center psui-relative ">
                     <PsIcon v-if="item.has_blocked_icon" icon="do_disturb_alt" size="14" icon-classes="psui-absolute psui--left-1 psui-text-gray-50"/>
                     <p class="title psui-text-gray-50 opacity-100-childrens-on-hover">
-                      
+                    
                       {{ item.title }}
 
                       <PsIcon
@@ -74,16 +75,8 @@
                       />
                     </p>
                   </div>
-                  </template>
-                  <template v-slot:content>
-                    <p
-                      v-if="item.tooltip_text || item.is_disabled"
-                      class="psui-font-bold psui-text-gray-80 psui-text-xsmall"
-                    >
-                      {{ item.is_disabled ? item.title + ' buildings are not allowed.' : item.tooltip_text }}
-                    </p>
-                  </template>
-                </PsRichTooltip>
+                </div>
+
                 <p
                   v-else
                   class="title opacity-100-childrens-on-hover"
@@ -485,8 +478,6 @@ export default {
       }
     },
     checkRowIsVisible(item) {
-      console.log('item',item.index)
-      console.log('this.collapsedRows',this.collapsedRows)
       return this.collapsedRows.indexOf(item.index) < 0
     },
     checkRowIsCollapsed(item) {
@@ -560,6 +551,15 @@ export default {
         return tailwindConfig.theme.colors[value.replace('psui-bg-', '')]
       }
       return value || '#ffffff' 
+    },
+    getTooltipContent(item) {
+      let content = ''
+      if (item.tooltip_text) {
+        content = `<p class="psui-font-bold psui-text-gray-80 psui-text-xsmall">${item.tooltip_text}</p>`
+      } else if (item.is_disabled) {
+        content = `<p class="psui-font-bold psui-text-gray-80 psui-text-xsmall">${item.title} buildings are <br>not allowed.</p>`
+      }
+      return content
     }
   },
 }