@policystudio/policy-studio-ui-vue 1.1.88 → 1.1.89

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.
@@ -2538,12 +2538,87 @@ video {
2538
2538
  margin-left: 4px;
2539
2539
  }
2540
2540
 
2541
+ .psui-el-table-results.layout-flexible tbody tr.combined_measure_margin_aux td {
2542
+ content: '' !important;
2543
+ background-color: white !important;
2544
+ max-height: 10px;
2545
+ visibility: hidden;
2546
+ }
2547
+
2548
+ .psui-el-table-results.layout-flexible tbody tr.combined_measure_margin_aux td:nth-child(3) {
2549
+ visibility: visible;
2550
+ }
2551
+
2541
2552
  .psui-el-table-results.layout-flexible tbody tr.is-disabled td.hover-color {
2542
2553
  background-color: #E6ECF2 !important;
2543
2554
  opacity: 0.99;
2544
2555
  transition: background-color 0.5s ease;
2545
2556
  }
2546
2557
 
2558
+ .psui-el-table-results.layout-flexible tbody tr.visible {
2559
+ display: none
2560
+ }
2561
+
2562
+ .psui-el-table-results.layout-flexible tbody tr.appended-row {
2563
+ --bg-opacity: 1;
2564
+ background-color: #ECF7FB;
2565
+ background-color: rgba(236, 247, 251, var(--bg-opacity));
2566
+ border-width: 1px;
2567
+ border-radius: 0.375rem;
2568
+ height: 36px;
2569
+ }
2570
+
2571
+ .psui-el-table-results.layout-flexible tbody tr.appended-row td {
2572
+ --bg-opacity: 1;
2573
+ background-color: #F3F6F9;
2574
+ background-color: rgba(243, 246, 249, var(--bg-opacity));
2575
+ --text-opacity: 1;
2576
+ color: #34404A;
2577
+ color: rgba(52, 64, 74, var(--text-opacity));
2578
+ transition: background-color 0.5s ease;
2579
+ }
2580
+
2581
+ .psui-el-table-results.layout-flexible tbody tr.appended-row td .title {
2582
+ margin-left: 6px;
2583
+ }
2584
+
2585
+ .psui-el-table-results.layout-flexible tbody tr.appended-row td:first-child {
2586
+ position: sticky;
2587
+ min-width: 330px;
2588
+ }
2589
+
2590
+ .psui-el-table-results.layout-flexible tbody tr.appended-row td:first-child:after,.psui-el-table-results.layout-flexible tbody tr.appended-row td:first-child:before {
2591
+ content: '';
2592
+ position: absolute;
2593
+ top: 0;
2594
+ }
2595
+
2596
+ .psui-el-table-results.layout-flexible tbody tr.appended-row td:first-child:before {
2597
+ --bg-opacity: 1;
2598
+ background-color: #F3F6F9;
2599
+ background-color: rgba(243, 246, 249, var(--bg-opacity));
2600
+ border-bottom-left-radius: 9999px;
2601
+ box-shadow: -3px 3px 0px 0px #ffffff;
2602
+ z-index: 30;
2603
+ top: 25px;
2604
+ left: 0;
2605
+ width: 10px;
2606
+ height: 10px;
2607
+ }
2608
+
2609
+ .psui-el-table-results.layout-flexible tbody tr.appended-row td:first-child:after {
2610
+ --bg-opacity: 1;
2611
+ background-color: #F3F6F9;
2612
+ background-color: rgba(243, 246, 249, var(--bg-opacity));
2613
+ border-top-left-radius: 9999px;
2614
+ box-shadow: -3px -3px 0px 0px #ffffff;
2615
+ z-index: 30;
2616
+ top: 0;
2617
+ left: 0;
2618
+ width: 10px;
2619
+ height: 10px;
2620
+ }
2621
+
2547
2622
  .psui-el-table-results.layout-flexible tbody tr td {
2548
2623
  --text-opacity: 1;
2549
2624
  color: #34404A;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@policystudio/policy-studio-ui-vue",
3
- "version": "1.1.88",
3
+ "version": "1.1.89",
4
4
  "description": "Policy Studio UI",
5
5
  "main": "src/index.js",
6
6
  "author": "Policy Studio Team",
@@ -479,7 +479,21 @@
479
479
  }
480
480
  }
481
481
  }
482
-
482
+ }
483
+
484
+ &.combined_measure_margin_aux {
485
+
486
+ td {
487
+ content: '' !important;
488
+ background-color: white !important;
489
+ max-height: 10px;
490
+ visibility: hidden;
491
+
492
+ &:nth-child(3) {
493
+ visibility: visible;
494
+ }
495
+
496
+ }
483
497
  }
484
498
 
485
499
  &.is-disabled {
@@ -491,6 +505,54 @@
491
505
  }
492
506
  }
493
507
  }
508
+
509
+ &.visible {
510
+ display: none
511
+ }
512
+
513
+ &.appended-row {
514
+ @apply psui-bg-blue-10 psui-border psui-rounded-md;
515
+ height: 36px;
516
+
517
+ td {
518
+ @apply psui-bg-gray-10 psui-text-gray-70;
519
+ transition: background-color 0.5s ease;
520
+
521
+ .title {
522
+ margin-left: 6px;
523
+ }
524
+
525
+ &:first-child {
526
+ @apply psui-sticky;
527
+ min-width: 330px;
528
+
529
+ &:after,&:before {
530
+ content: '';
531
+ @apply psui-absolute psui-top-0;
532
+ }
533
+
534
+ &:before {
535
+ @apply psui-bg-gray-10 psui-rounded-bl-full ;
536
+ box-shadow: -3px 3px 0px 0px #ffffff;
537
+ z-index: 30;
538
+ top: 25px;
539
+ left: 0;
540
+ width: 10px;
541
+ height: 10px;
542
+ }
543
+
544
+ &:after {
545
+ @apply psui-bg-gray-10 psui-rounded-tl-full ;
546
+ box-shadow: -3px -3px 0px 0px #ffffff;
547
+ z-index: 30;
548
+ top: 0;
549
+ left: 0;
550
+ width: 10px;
551
+ height: 10px;
552
+ }
553
+ }
554
+ }
555
+ }
494
556
 
495
557
  td {
496
558
  @apply psui-text-gray-70 psui-h-10 psui-text-right psui-text-small;
@@ -24,10 +24,11 @@
24
24
  {
25
25
  'is-disabled' : item.is_disabled,
26
26
  'is-first' : item.deep == 0,
27
- 'psui-hidden' : checkRowIsCollapsed(item),
27
+ 'psui-hidden' : checkRowIsCollapsed(item) || item.not_visible,
28
28
  'is-last' : item.is_last,
29
29
  'is-active' : selectedRow == item.id,
30
- 'removed-class' : (item.slug == 'removed_measures' || item.is_excluded) && layout == 'flexible'
30
+ 'removed-class' : (item.slug == 'removed_measures' || item.is_excluded) && layout == 'flexible',
31
+ 'appended-row' : item.is_appended,
31
32
  },
32
33
  `${item.type}`
33
34
  ]"
@@ -59,9 +60,9 @@
59
60
  <div
60
61
  class="psui-flex psui-items-center psui-space-x-3"
61
62
  :style="{paddingLeft: `${item.deep * 16}px`}"
62
- >
63
+ >
63
64
  <PsIcon
64
- v-if="!item.last_deep || item.type === 'total'"
65
+ v-if="(!item.last_deep || item.type === 'total') && !item.is_appended"
65
66
  icon="expand_more"
66
67
  size="24"
67
68
  class="actions-button psui-transition psui-transform psui-cursor-pointer"
@@ -74,8 +75,14 @@
74
75
  @click.native="onCollapse(item, $event)"
75
76
  />
76
77
 
78
+ <div v-if="item.is_appended">
79
+ <span class="psui-text-small psui-font-bold psui-text-blue-60 psui-ml-2">
80
+ {{ item.title }}
81
+ </span>
82
+ </div>
83
+
77
84
  <div
78
- v-if="item.is_disabled || item.tooltip_text"
85
+ v-else-if="item.is_disabled || item.tooltip_text"
79
86
  class="psui-inline-flex psui-cursor-default sticky"
80
87
  :class="{ 'is-last-deep' : item.last_deep }"
81
88
  v-tooltip="getTooltipContent(item)"
@@ -316,8 +323,6 @@
316
323
  </template>
317
324
  </tr>
318
325
  </tbody>
319
-
320
- <!-- <slot name="footer"></slot> -->
321
326
  </table>
322
327
  </div>
323
328
  </template>