@policystudio/policy-studio-ui-vue 1.0.80 → 1.0.82

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -18635,6 +18635,15 @@ html {
18635
18635
  color: rgba(40, 50, 59, var(--text-opacity));
18636
18636
  }
18637
18637
 
18638
+ .psui-el-table-results tbody tr.is-disabled {
18639
+ pointer-events: none;
18640
+ }
18641
+
18642
+ .psui-el-table-results tbody tr .title {
18643
+ display: flex;
18644
+ align-items: center;
18645
+ }
18646
+
18638
18647
  .psui-el-table-results tbody tr td {
18639
18648
  padding-left: 2rem;
18640
18649
  --text-opacity: 1;
@@ -18687,9 +18696,6 @@ html {
18687
18696
  padding-bottom: 8px;
18688
18697
  }
18689
18698
 
18690
- .psui-el-table-results tfoot tr td {
18691
- }
18692
-
18693
18699
  .psui-el-table {
18694
18700
  width: 100%;
18695
18701
  table-layout: fixed;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@policystudio/policy-studio-ui-vue",
3
- "version": "1.0.80",
3
+ "version": "1.0.82",
4
4
  "description": "Policy Studio UI",
5
5
  "main": "src/index.js",
6
6
  "author": "Policy Studio Team",
@@ -1,55 +1,55 @@
1
1
  @layer components{
2
2
  .psui-el-table-results-wrapper {
3
- @apply .psui-w-full .psui-whitespace-no-wrap .psui-flex .psui-overflow-auto;
3
+ @apply psui-w-full psui-whitespace-no-wrap psui-flex psui-overflow-auto;
4
4
  }
5
5
 
6
6
  .psui-el-table-results {
7
- @apply .psui-relative .psui-align-top .psui-w-full .psui-max-w-full .psui-text-p;
7
+ @apply psui-relative psui-align-top psui-w-full psui-max-w-full psui-text-p;
8
8
 
9
9
  thead {
10
- @apply .psui-bg-white .psui-items-start .psui-shadow-elevation-10 .psui-sticky .psui-top-0 .psui-z-15;
10
+ @apply psui-bg-white psui-items-start psui-shadow-elevation-10 psui-sticky psui-top-0 psui-z-15;
11
11
 
12
12
  tr {
13
13
  .title {
14
- @apply .psui-text-small .psui-font-bold .psui-leading-4 .psui-text-gray-80;
14
+ @apply psui-text-small psui-font-bold psui-leading-4 psui-text-gray-80;
15
15
  }
16
16
 
17
17
  th {
18
- @apply .psui-pl-8 .psui-text-gray-50 .psui-text-right .psui-w-auto .psui-align-top;
18
+ @apply psui-pl-8 psui-text-gray-50 psui-text-right psui-w-auto psui-align-top;
19
19
  padding-top: 13px;
20
20
  padding-bottom: 13px;
21
21
 
22
22
  .description {
23
- @apply .psui-text-xsmall .psui-font-normal;
23
+ @apply psui-text-xsmall psui-font-normal;
24
24
  line-height: 110%;
25
25
  }
26
26
 
27
27
  &:first-child {
28
- @apply .psui-pl-0 .psui-pr-8 .psui-text-left .psui-bg-white .psui-sticky .psui-z-10 .psui-left-0;
28
+ @apply psui-pl-0 psui-pr-8 psui-text-left psui-bg-white psui-sticky psui-z-10 psui-left-0;
29
29
  box-shadow: inset -1px 0px 0px #EBEEF0;
30
30
  min-width: 300px;
31
31
 
32
32
  > div {
33
- @apply .psui-pl-0;
33
+ @apply psui-pl-0;
34
34
  }
35
35
  }
36
36
  }
37
37
 
38
38
  &:first-of-type {
39
39
  th {
40
- @apply .psui-text-left;
40
+ @apply psui-text-left;
41
41
  padding-top: 0;
42
42
  padding-bottom: 0;
43
43
 
44
44
  > div {
45
- @apply .psui-flex .psui-flex-row .psui-border-b .psui-border-gray-30;
45
+ @apply psui-flex psui-flex-row psui-border-b psui-border-gray-30;
46
46
  padding-top: 11px;
47
47
  padding-bottom: 11px;
48
48
  }
49
49
  }
50
50
 
51
51
  p {
52
- @apply .psui-text-p;
52
+ @apply psui-text-p;
53
53
  line-height: 18px;
54
54
  }
55
55
  }
@@ -58,28 +58,36 @@
58
58
 
59
59
  tbody {
60
60
  tr {
61
- @apply .psui-border-b .psui-border-gray-20;
61
+ @apply psui-border-b psui-border-gray-20;
62
62
 
63
63
  &.is-first {
64
64
  .title {
65
- @apply .psui-font-bold .psui-text-gray-80;
65
+ @apply psui-font-bold psui-text-gray-80;
66
66
  }
67
67
  }
68
68
 
69
+ &.is-disabled {
70
+ @apply psui-pointer-events-none;
71
+ }
72
+
73
+ .title {
74
+ @apply psui-flex psui-items-center;
75
+ }
76
+
69
77
  td {
70
- @apply .psui-pl-8 .psui-text-gray-80 .psui-h-10 .psui-text-right .psui-text-small;
78
+ @apply psui-pl-8 psui-text-gray-80 psui-h-10 psui-text-right psui-text-small;
71
79
  padding-top: 11px;
72
80
  padding-bottom: 11px;
73
81
 
74
82
  > div {
75
- @apply .psui-flex .psui-items-center;
83
+ @apply psui-flex psui-items-center;
76
84
  }
77
85
 
78
86
  .actions {
79
- @apply .psui-flex .psui-items-center .psui-h-full .psui-relative;
87
+ @apply psui-flex psui-items-center psui-h-full psui-relative;
80
88
 
81
89
  &-button {
82
- @apply .psui-cursor-pointer .psui-ml-1;
90
+ @apply psui-cursor-pointer psui-ml-1;
83
91
  }
84
92
 
85
93
  .is-last-deep {
@@ -89,12 +97,12 @@
89
97
 
90
98
  &:not(:first-child) {
91
99
  > div {
92
- @apply .psui-justify-end;
100
+ @apply psui-justify-end;
93
101
  }
94
102
  }
95
103
 
96
104
  &:first-child {
97
- @apply .psui-pl-0 .psui-pr-8 .psui-text-left .psui-block .psui-bg-white .psui-sticky .psui-z-10 .psui-left-0;
105
+ @apply psui-pl-0 psui-pr-8 psui-text-left psui-block psui-bg-white psui-sticky psui-z-10 psui-left-0;
98
106
  box-shadow: inset -1px 0px 0px #EBEEF0;
99
107
  padding-top: 8px;
100
108
  padding-bottom: 8px;
@@ -102,12 +110,6 @@
102
110
  }
103
111
  }
104
112
  }
105
-
106
- tfoot {
107
- tr {
108
- td {}
109
- }
110
- }
111
113
  }
112
114
 
113
115
  }
@@ -15,6 +15,7 @@
15
15
  :key="index"
16
16
  :class="[
17
17
  {
18
+ 'is-disabled' : item.is_disabled,
18
19
  'is-first' : item.deep == 0,
19
20
  'psui-hidden' : checkRowIsCollapsed(item),
20
21
  'is-last' : item.is_last
@@ -32,7 +33,7 @@
32
33
  icon="expand_more"
33
34
  size="24"
34
35
  class="actions-button psui-transition psui-transform"
35
- :icon-classes="getIconClasses(item)"
36
+ :icon-classes="item.is_disabled ? 'psui-text-gray-40' : getIconClasses(item)"
36
37
  :style="{ display: 'flex' }"
37
38
  :class="checkRowIsVisible(item) ? 'psui-rotate-0' : 'psui--rotate-90'"
38
39
  @click.native="onCollapse(item)"
@@ -65,13 +66,22 @@
65
66
  </PsRichTooltip>
66
67
  <p
67
68
  v-else
68
- class="title"
69
+ class="title opacity-100-childrens-on-hover"
69
70
  :class="[
70
71
  { 'psui-font-bold' : item.type == 'total' },
71
72
  { 'is-last-deep' : item.last_deep }
72
73
  ]"
73
74
  >
74
75
  {{ item.title }}
76
+
77
+ <PsIcon
78
+ v-if="item.has_helper"
79
+ icon="info"
80
+ size="14"
81
+ class="psui-text-blue-60 psui-opacity-0 psui-transition psui-leading-none psui-cursor-pointer psui-ml-1"
82
+ :style="{ display: 'flex' }"
83
+ @click.native="$eventBus.$emit('openDescriptionModal', { type: 'helper', slug: `table-results-${item.helper_slug}` })"
84
+ />
75
85
  </p>
76
86
  </div>
77
87
  </td>