11<template >
22 <div class =" PkpOpenReview" >
3- <BaseTabRoot default-value =" byRecord" >
3+ <PkpTabRoot default-value =" byRecord" >
44 <header class =" PkpOpenReview__tabs-header" >
55 <span class =" PkpOpenReview__tabs-label" >Sort by:</span >
6- <BaseTabList class =" PkpOpenReview__tabs-list" >
7- <BaseTabTrigger value =" byRecord" >Version of Record</BaseTabTrigger >
8- <BaseTabTrigger value =" byReviewer" >Reviewer Name</BaseTabTrigger >
9- </BaseTabList >
6+ <PkpTabList class =" PkpOpenReview__tabs-list" >
7+ <PkpTabTrigger value =" byRecord" >Version of Record</PkpTabTrigger >
8+ <PkpTabTrigger value =" byReviewer" >Reviewer Name</PkpTabTrigger >
9+ </PkpTabList >
1010 </header >
1111
1212 <!-- By Record View -->
13- <BaseTabContent value =" byRecord" >
13+ <PkpTabContent value =" byRecord" >
1414 <h2 class =" PkpOpenReview__heading" >Reviewer Reports by Record</h2 >
15- <BaseAccordionRoot :default-value =" reviewRounds[0]?.roundId" >
16- <BaseAccordionItem
15+ <PkpAccordionRoot :default-value =" reviewRounds[0]?.roundId" >
16+ <PkpAccordionItem
1717 v-for =" round in reviewRounds"
1818 :key =" round.roundId"
1919 :value =" round.roundId"
2020 class =" PkpOpenReview__accordion-item"
2121 >
22- <BaseAccordionHeader >
23- <BaseAccordionTrigger class =" PkpOpenReview__accordion-trigger" >
22+ <PkpAccordionHeader >
23+ <PkpAccordionTrigger class =" PkpOpenReview__accordion-trigger" >
2424 <hgroup class =" PkpOpenReview__header-title" >
2525 <h3 >
2626 {{ round.displayText }}
4040 {{ item.count }} {{ item.label }}
4141 </li >
4242 </ul >
43- </BaseAccordionTrigger >
44- </BaseAccordionHeader >
45- <BaseAccordionContent class =" PkpOpenReview__accordion-content" >
43+ </PkpAccordionTrigger >
44+ </PkpAccordionHeader >
45+ <PkpAccordionContent class =" PkpOpenReview__accordion-content" >
4646 <ul class =" PkpOpenReview__list" >
4747 <li v-for =" review in round.reviews" :key =" review.reviewId" >
4848 <span
6161 <BaseOpenReviewReadButton :review =" review" />
6262 </li >
6363 </ul >
64- </BaseAccordionContent >
65- </BaseAccordionItem >
66- </BaseAccordionRoot >
67- </BaseTabContent >
64+ </PkpAccordionContent >
65+ </PkpAccordionItem >
66+ </PkpAccordionRoot >
67+ </PkpTabContent >
6868
6969 <!-- By Reviewer View -->
70- <BaseTabContent value =" byReviewer" >
70+ <PkpTabContent value =" byReviewer" >
7171 <h2 class =" PkpOpenReview__heading" >Reviewer Reports by Reviewer</h2 >
72- <BaseAccordionRoot :default-value =" reviewerGroups[0]?.reviewerId" >
73- <BaseAccordionItem
72+ <PkpAccordionRoot :default-value =" reviewerGroups[0]?.reviewerId" >
73+ <PkpAccordionItem
7474 v-for =" reviewer in reviewerGroups"
7575 :key =" reviewer.reviewerId"
7676 :value =" reviewer.reviewerId"
7777 class =" PkpOpenReview__accordion-item"
7878 >
79- <BaseAccordionHeader >
80- <BaseAccordionTrigger class =" PkpOpenReview__accordion-trigger" >
79+ <PkpAccordionHeader >
80+ <PkpAccordionTrigger class =" PkpOpenReview__accordion-trigger" >
8181 <hgroup class =" PkpOpenReview__header-title" >
8282 <h3 >{{ reviewer.reviewerFullName }}</h3 >
8383 <p >{{ reviewer.reviewerAffiliation }}</p >
8484 </hgroup >
8585 <p class =" PkpOpenReview__review-count" >
8686 {{ reviewer.reviews?.length || 0 }} Reviews
8787 </p >
88- </BaseAccordionTrigger >
89- </BaseAccordionHeader >
90- <BaseAccordionContent class =" PkpOpenReview__accordion-content" >
88+ </PkpAccordionTrigger >
89+ </PkpAccordionHeader >
90+ <PkpAccordionContent class =" PkpOpenReview__accordion-content" >
9191 <ul class =" PkpOpenReview__list" >
9292 <li v-for =" review in reviewer.reviews" :key =" review.reviewId" >
9393 <span
106106 <BaseOpenReviewReadButton :review =" review" />
107107 </li >
108108 </ul >
109- </BaseAccordionContent >
110- </BaseAccordionItem >
111- </BaseAccordionRoot >
112- </BaseTabContent >
113- </BaseTabRoot >
109+ </PkpAccordionContent >
110+ </PkpAccordionItem >
111+ </PkpAccordionRoot >
112+ </PkpTabContent >
113+ </PkpTabRoot >
114114 </div >
115115</template >
116116
117117<script setup>
118118import {storeToRefs } from ' pinia' ;
119- import BaseTabRoot from ' @/frontend/components/PkpTab/base/BaseTabRoot .vue' ;
120- import BaseTabList from ' @/frontend/components/PkpTab/base/BaseTabList .vue' ;
121- import BaseTabTrigger from ' @/frontend/components/PkpTab/base/BaseTabTrigger .vue' ;
122- import BaseTabContent from ' @/frontend/components/PkpTab/base/BaseTabContent .vue' ;
123- import BaseAccordionRoot from ' @/frontend/components/PkpAccordion/base/BaseAccordionRoot .vue' ;
124- import BaseAccordionItem from ' @/frontend/components/PkpAccordion/base/BaseAccordionItem .vue' ;
125- import BaseAccordionHeader from ' @/frontend/components/PkpAccordion/base/BaseAccordionHeader .vue' ;
126- import BaseAccordionTrigger from ' @/frontend/components/PkpAccordion/base/BaseAccordionTrigger .vue' ;
127- import BaseAccordionContent from ' @/frontend/components/PkpAccordion/base/BaseAccordionContent .vue' ;
119+ import PkpTabRoot from ' @/frontend/components/PkpTab/PkpTabRoot .vue' ;
120+ import PkpTabList from ' @/frontend/components/PkpTab/PkpTabList .vue' ;
121+ import PkpTabTrigger from ' @/frontend/components/PkpTab/PkpTabTrigger .vue' ;
122+ import PkpTabContent from ' @/frontend/components/PkpTab/PkpTabContent .vue' ;
123+ import PkpAccordionRoot from ' @/frontend/components/PkpAccordion/PkpAccordionRoot .vue' ;
124+ import PkpAccordionItem from ' @/frontend/components/PkpAccordion/PkpAccordionItem .vue' ;
125+ import PkpAccordionHeader from ' @/frontend/components/PkpAccordion/PkpAccordionHeader .vue' ;
126+ import PkpAccordionTrigger from ' @/frontend/components/PkpAccordion/PkpAccordionTrigger .vue' ;
127+ import PkpAccordionContent from ' @/frontend/components/PkpAccordion/PkpAccordionContent .vue' ;
128128import BaseOpenReviewReadButton from ' ./base/BaseOpenReviewReadButton.vue' ;
129129import PkpIcon from ' @/frontend/components/PkpIcon/PkpIcon.vue' ;
130130import {usePkpOpenReviewStore } from ' ./usePkpOpenReviewStore' ;
@@ -169,7 +169,7 @@ const {formatShortDate} = usePkpDate();
169169 padding : 0.25rem ;
170170}
171171
172- .PkpOpenReview__tabs-list .BaseTabTrigger {
172+ .PkpOpenReview__tabs-list .PkpTabTrigger {
173173 padding : 0.5rem 1rem ;
174174 font-size : 0.875rem ;
175175 font-weight : 500 ;
@@ -180,16 +180,16 @@ const {formatShortDate} = usePkpDate();
180180 color : #374151 ;
181181}
182182
183- .PkpOpenReview__tabs-list .BaseTabTrigger :hover {
183+ .PkpOpenReview__tabs-list .PkpTabTrigger :hover {
184184 background : #e5e7eb ;
185185}
186186
187- .PkpOpenReview__tabs-list .BaseTabTrigger [data-state = ' active' ] {
187+ .PkpOpenReview__tabs-list .PkpTabTrigger [data-state = ' active' ] {
188188 background : #fff ;
189189 box-shadow : 0 1px 2px rgba (0 , 0 , 0 , 0.05 );
190190}
191191
192- .PkpOpenReview__tabs-list .BaseTabTrigger [data-state = ' active' ]::after {
192+ .PkpOpenReview__tabs-list .PkpTabTrigger [data-state = ' active' ]::after {
193193 display : none ;
194194}
195195
@@ -273,24 +273,24 @@ const {formatShortDate} = usePkpDate();
273273 font-size : 0.8125rem ;
274274}
275275
276- .PkpOpenReview__summary .BaseIcon {
276+ .PkpOpenReview__summary .PkpIcon {
277277 width : 1rem ;
278278 height : 1rem ;
279279}
280280
281- .PkpOpenReview__summary [data-recommendation = ' approved' ] .BaseIcon {
281+ .PkpOpenReview__summary [data-recommendation = ' approved' ] .PkpIcon {
282282 color : #0d6d3d ;
283283}
284284
285- .PkpOpenReview__summary [data-recommendation = ' revisions_requested' ] .BaseIcon {
285+ .PkpOpenReview__summary [data-recommendation = ' revisions_requested' ] .PkpIcon {
286286 color : #b45309 ;
287287}
288288
289- .PkpOpenReview__summary [data-recommendation = ' not_approved' ] .BaseIcon {
289+ .PkpOpenReview__summary [data-recommendation = ' not_approved' ] .PkpIcon {
290290 color : #dc2626 ;
291291}
292292
293- .PkpOpenReview__summary [data-recommendation = ' comments' ] .BaseIcon {
293+ .PkpOpenReview__summary [data-recommendation = ' comments' ] .PkpIcon {
294294 color : #2563eb ;
295295}
296296
@@ -324,24 +324,24 @@ const {formatShortDate} = usePkpDate();
324324 white-space : nowrap ;
325325}
326326
327- .PkpOpenReview__status .BaseIcon {
327+ .PkpOpenReview__status .PkpIcon {
328328 width : 1.125rem ;
329329 height : 1.125rem ;
330330}
331331
332- .PkpOpenReview__status [data-recommendation = ' approved' ] .BaseIcon {
332+ .PkpOpenReview__status [data-recommendation = ' approved' ] .PkpIcon {
333333 color : #0d6d3d ;
334334}
335335
336- .PkpOpenReview__status [data-recommendation = ' revisions_requested' ] .BaseIcon {
336+ .PkpOpenReview__status [data-recommendation = ' revisions_requested' ] .PkpIcon {
337337 color : #b45309 ;
338338}
339339
340- .PkpOpenReview__status [data-recommendation = ' not_approved' ] .BaseIcon {
340+ .PkpOpenReview__status [data-recommendation = ' not_approved' ] .PkpIcon {
341341 color : #dc2626 ;
342342}
343343
344- .PkpOpenReview__status [data-recommendation = ' comments' ] .BaseIcon {
344+ .PkpOpenReview__status [data-recommendation = ' comments' ] .PkpIcon {
345345 color : #2563eb ;
346346}
347347
0 commit comments