@policystudio/policy-studio-ui-vue 1.0.88 → 1.0.90

package/dist/css/psui_styles.css

@@ -18538,7 +18538,7 @@ html {
 .psui-el-table-results {
   position: relative;
   vertical-align: top;
-  width: auto;
+  width: 100%;
   max-width: 100%;
   font-size: 16px;
   line-height: 130%;
@@ -18579,7 +18579,7 @@ html {
       }
 
 .psui-el-table-results thead tr th {
-        padding-left: 1.25rem;
+        padding-left: 1.5rem;
         --text-opacity: 1;
         color: #798490;
         color: rgba(121, 132, 144, var(--text-opacity));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@policystudio/policy-studio-ui-vue",
-  "version": "1.0.88",
+  "version": "1.0.90",
   "description": "Policy Studio UI",
   "main": "src/index.js",
   "author": "Policy Studio Team",

package/src/assets/scss/components/PsTableResults.scss

@@ -4,7 +4,7 @@
   }
 
   .psui-el-table-results {
-    @apply psui-relative psui-align-top psui-w-auto psui-max-w-full psui-text-p;
+    @apply psui-relative psui-align-top psui-w-full psui-max-w-full psui-text-p;
 
     tr {
       th, td {
@@ -29,7 +29,7 @@
         }
 
         th {
-          @apply psui-pl-5 psui-text-gray-50 psui-text-right psui-w-auto psui-align-top;
+          @apply psui-pl-6 psui-text-gray-50 psui-text-right psui-w-auto psui-align-top;
           padding-top: 13px;
           padding-bottom: 13px;
 

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

@@ -3,7 +3,6 @@
     class="psui-el-table-results-wrapper"
     :style="{ maxHeight: tableMaxHeight }"
   >
-    <!-- <pre>{{ collapsedRows }}</pre> -->
     <table 
       ref="table"
       class="psui-el-table-results"

package/src/components/tooltip/PsTooltip.vue

@@ -48,22 +48,29 @@ export default {
     /**
      * It sets the layout of the tooltip if needed. Usefull when using rich or dialog tooltip.
      */
-    layout:{
-        type: String,
+    layout: {
+      type: String,
     },
     /**
      * It sets a additional styling if needed.
      */
-    cssClass:{
-        type: String,
+    cssClass: {
+      type: String,
     },
     /**
      * It sets the vertical position.
      */
-    position:{
+    position: {
       type: String,
       default: 'bottom',
-      validator: (value)=> ['bottom','top'].includes(value)
+      validator: (value)=> ['bottom','top', 'custom'].includes(value)
+    },
+    /**
+     * It sets the custom positions.
+     */
+    customPosition: {
+      type: String,
+      default: '',
     }
   },
   inheritAttrs: true,
@@ -120,7 +127,7 @@ export default {
         dialog.style.left = `${windowWidth - rectDialog.width - 30}px`
       } else if ((rectTrigger.x - rectDialog.width) < 0) {
         dialog.style.left = `${rectTrigger.x + 10}px`  
-      } else if (rectDialog.width >= rectTrigger.width){
+      } else if (rectDialog.width >= rectTrigger.width && this.position != 'custom') {
         dialog.style.left = `${rectTrigger.x - ((rectDialog.width - rectTrigger.width)/2)}px`
       } else {
         dialog.style.left = `${rectTrigger.x + ((rectTrigger.width - rectDialog.width)/2)}px`
@@ -130,6 +137,12 @@ export default {
         dialog.style.top = `${rectTrigger.y - rectDialog.height - 10}px`
       }
 
+      if(this.position == 'custom') {
+        dialog.style = this.customPosition
+        dialog.style.display = 'block'
+        dialog.style.position = 'absolute'
+      }
+
       setTimeout(() => {
         dialog.style.opacity = 100
       }, 100)