Skip to content

Commit 7885db6

Browse files
Clean up of unnecessary Base components
1 parent 2059f1e commit 7885db6

18 files changed

+128
-183
lines changed

src/frontend/components/PkpAccordion/base/BaseAccordionContent.vue renamed to src/frontend/components/PkpAccordion/PkpAccordionContent.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<AccordionContent class="BaseAccordionContent">
2+
<AccordionContent class="PkpAccordionContent">
33
<slot />
44
</AccordionContent>
55
</template>

src/frontend/components/PkpAccordion/base/BaseAccordionHeader.vue renamed to src/frontend/components/PkpAccordion/PkpAccordionHeader.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<AccordionHeader class="BaseAccordionHeader" as-child>
2+
<AccordionHeader class="PkpAccordionHeader" as-child>
33
<slot />
44
</AccordionHeader>
55
</template>

src/frontend/components/PkpAccordion/base/BaseAccordionItem.vue renamed to src/frontend/components/PkpAccordion/PkpAccordionItem.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<AccordionItem class="BaseAccordionItem" :value="value">
2+
<AccordionItem class="PkpAccordionItem" :value="value">
33
<slot />
44
</AccordionItem>
55
</template>

src/frontend/components/PkpAccordion/base/BaseAccordionRoot.vue renamed to src/frontend/components/PkpAccordion/PkpAccordionRoot.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<AccordionRoot
3-
class="BaseAccordionRoot"
3+
class="PkpAccordionRoot"
44
:type="type"
55
:collapsible="collapsible"
66
:default-value="defaultValue"
@@ -14,6 +14,6 @@ import {AccordionRoot} from 'reka-ui';
1414
defineProps({
1515
type: {type: String, default: 'single'},
1616
collapsible: {type: Boolean, default: true},
17-
defaultValue: {type: [String, Number], default: null},
17+
defaultValue: {type: [String, Number, Array], default: null},
1818
});
1919
</script>

src/frontend/components/PkpAccordion/base/BaseAccordionTrigger.vue renamed to src/frontend/components/PkpAccordion/PkpAccordionTrigger.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<AccordionTrigger class="BaseAccordionTrigger">
2+
<AccordionTrigger class="PkpAccordionTrigger">
33
<slot />
44
</AccordionTrigger>
55
</template>

src/frontend/components/PkpButton/BaseButton.vue

Lines changed: 0 additions & 14 deletions
This file was deleted.
Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,14 @@
11
<template>
2-
<BaseButton v-bind="$attrs">
2+
<button v-bind="$attrs" class="PkpButton" :disabled="isDisabled">
33
<slot />
4-
</BaseButton>
4+
</button>
55
</template>
66

7-
<style></style>
7+
<script setup>
8+
defineProps({
9+
isDisabled: {
10+
type: Boolean,
11+
default: false,
12+
},
13+
});
14+
</script>

src/frontend/components/PkpIcon/BaseIcon.vue

Lines changed: 0 additions & 35 deletions
This file was deleted.
Lines changed: 32 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,40 @@
11
<template>
2-
<BaseIcon v-bind="$attrs" />
2+
<component :is="svgIcons[icon]" class="PkpIcon"></component>
33
</template>
4+
45
<script setup>
5-
import BaseIcon from './BaseIcon.vue';
6+
import Cancel from './icons/Cancel.vue';
7+
import MoreOptions from './icons/MoreOptions.vue';
8+
import Error from './icons/Error.vue';
9+
import Help from './icons/Help.vue';
10+
import User from './icons/User.vue';
11+
import Orcid from '@/frontend/components/PkpIcon/icons/Orcid.vue';
12+
import OrcidUnauthenticated from '@/frontend/components/PkpIcon/icons/OrcidUnauthenticated.vue';
13+
import ReviewApproved from './icons/ReviewApproved.vue';
14+
import ReviewRevisionsRequested from './icons/ReviewRevisionsRequested.vue';
15+
import ReviewNotApproved from './icons/ReviewNotApproved.vue';
16+
import ReviewComments from './icons/ReviewComments.vue';
17+
const svgIcons = {
18+
Cancel,
19+
MoreOptions,
20+
Error,
21+
Help,
22+
User,
23+
Orcid,
24+
OrcidUnauthenticated,
25+
// Review recommendation icons - keys match recommendation values
26+
approved: ReviewApproved,
27+
revisions_requested: ReviewRevisionsRequested,
28+
not_approved: ReviewNotApproved,
29+
comments: ReviewComments,
30+
};
31+
defineProps({
32+
/** Which icon to use from our [Icon Gallery](?path=/story/components-icon--icon-gallery) */
33+
icon: {type: String, required: true},
34+
});
635
</script>
736
<style>
8-
[dir='rtl'] .BaseIcon {
37+
[dir='rtl'] .PkpIcon {
938
transform: scaleX(-1);
1039
}
1140
</style>

src/frontend/components/PkpOpenReview/PkpOpenReview.vue

Lines changed: 53 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,26 @@
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 }}
@@ -40,9 +40,9 @@
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
@@ -61,33 +61,33 @@
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
@@ -106,25 +106,25 @@
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>
118118
import {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';
128128
import BaseOpenReviewReadButton from './base/BaseOpenReviewReadButton.vue';
129129
import PkpIcon from '@/frontend/components/PkpIcon/PkpIcon.vue';
130130
import {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

Comments
 (0)