@pocketprep/ui-kit 3.1.5 → 3.2.0
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.
- package/.eslintrc.cjs +1 -0
- package/README.md +29 -8
- package/dist/@pocketprep/ui-kit.js +8 -11
- package/dist/@pocketprep/ui-kit.js.map +1 -1
- package/dist/@pocketprep/ui-kit.umd.cjs +1 -1
- package/dist/@pocketprep/ui-kit.umd.cjs.map +1 -1
- package/lib/components/BundleIcons/BundleIcon.vue +2 -2
- package/lib/components/Filters/FilterDropdown.vue +2 -2
- package/lib/components/Tooltips/OverflowTooltip.vue +7 -9
- package/lib/pocketprep.scss +12 -12
- package/package.json +14 -13
- package/lib/components/Banners/Banner.md +0 -41
- package/lib/components/Blobs/Blob.md +0 -10
- package/lib/components/Blobs/BlobEmptyState.md +0 -9
- package/lib/components/BundleIcons/BundleIcon.md +0 -60
- package/lib/components/Bundles/BundleList.md +0 -63
- package/lib/components/Bundles/BundleSearch.md +0 -195
- package/lib/components/Bundles/PremiumPill.md +0 -23
- package/lib/components/Buttons/Button.md +0 -99
- package/lib/components/Buttons/Link.md +0 -58
- package/lib/components/Buttons/Tab.md +0 -35
- package/lib/components/Calendar/Calendar.md +0 -18
- package/lib/components/Charts/Bar.md +0 -123
- package/lib/components/Charts/Pie.md +0 -23
- package/lib/components/Controls/SegmentControl.md +0 -47
- package/lib/components/Controls/Slider.md +0 -67
- package/lib/components/Controls/ToggleSwitch.md +0 -56
- package/lib/components/EmptyStates/EmptyState.md +0 -44
- package/lib/components/Exams/ExamCard.md +0 -45
- package/lib/components/Exams/ExamMenuCard.md +0 -90
- package/lib/components/Filters/FilterDropdown.md +0 -68
- package/lib/components/Filters/FilterOptions.md +0 -67
- package/lib/components/Forms/Checkbox.md +0 -52
- package/lib/components/Forms/CheckboxOption.md +0 -37
- package/lib/components/Forms/Errors.md +0 -23
- package/lib/components/Forms/Input.md +0 -63
- package/lib/components/Forms/Radio.md +0 -66
- package/lib/components/Forms/Select.md +0 -133
- package/lib/components/Forms/Textarea.md +0 -57
- package/lib/components/Icons/Icon.md +0 -151
- package/lib/components/Icons/IconAccordionArrow.md +0 -7
- package/lib/components/Icons/IconActivity.md +0 -7
- package/lib/components/Icons/IconAdd.md +0 -7
- package/lib/components/Icons/IconAddCircle.md +0 -7
- package/lib/components/Icons/IconArrow.md +0 -7
- package/lib/components/Icons/IconBarChart.md +0 -7
- package/lib/components/Icons/IconCalendar.md +0 -7
- package/lib/components/Icons/IconChat.md +0 -7
- package/lib/components/Icons/IconCheck.md +0 -7
- package/lib/components/Icons/IconClose.md +0 -7
- package/lib/components/Icons/IconCorrect.md +0 -7
- package/lib/components/Icons/IconEdit.md +0 -7
- package/lib/components/Icons/IconExam.md +0 -7
- package/lib/components/Icons/IconExternalLink.md +0 -7
- package/lib/components/Icons/IconEyeHide.md +0 -7
- package/lib/components/Icons/IconEyeShow.md +0 -7
- package/lib/components/Icons/IconFilter.md +0 -7
- package/lib/components/Icons/IconFilterActive.md +0 -7
- package/lib/components/Icons/IconFlag.md +0 -7
- package/lib/components/Icons/IconFlagContent.md +0 -7
- package/lib/components/Icons/IconFlagFeedback.md +0 -11
- package/lib/components/Icons/IconFlagFilled.md +0 -7
- package/lib/components/Icons/IconFullView.md +0 -7
- package/lib/components/Icons/IconFullViewActive.md +0 -7
- package/lib/components/Icons/IconHandle.md +0 -7
- package/lib/components/Icons/IconHeart.md +0 -7
- package/lib/components/Icons/IconHelp.md +0 -7
- package/lib/components/Icons/IconHourglass.md +0 -7
- package/lib/components/Icons/IconImage.md +0 -7
- package/lib/components/Icons/IconIncorrect.md +0 -7
- package/lib/components/Icons/IconInfo.md +0 -7
- package/lib/components/Icons/IconKeyboard.md +0 -7
- package/lib/components/Icons/IconLaunch.md +0 -7
- package/lib/components/Icons/IconLevelUp.md +0 -7
- package/lib/components/Icons/IconLightbulb.md +0 -5
- package/lib/components/Icons/IconLightning.md +0 -7
- package/lib/components/Icons/IconList.md +0 -7
- package/lib/components/Icons/IconLoading.md +0 -7
- package/lib/components/Icons/IconLoading2.md +0 -7
- package/lib/components/Icons/IconLock.md +0 -7
- package/lib/components/Icons/IconMissedQuestions.md +0 -7
- package/lib/components/Icons/IconMoon.md +0 -7
- package/lib/components/Icons/IconPaginationArrow.md +0 -7
- package/lib/components/Icons/IconPassage.md +0 -7
- package/lib/components/Icons/IconPencil.md +0 -7
- package/lib/components/Icons/IconPeople.md +0 -7
- package/lib/components/Icons/IconPercent.md +0 -7
- package/lib/components/Icons/IconPerson.md +0 -7
- package/lib/components/Icons/IconPreview.md +0 -7
- package/lib/components/Icons/IconQuestions.md +0 -7
- package/lib/components/Icons/IconQuick10.md +0 -7
- package/lib/components/Icons/IconRemoveCircle.md +0 -7
- package/lib/components/Icons/IconReviewFlag.md +0 -7
- package/lib/components/Icons/IconSearch.md +0 -7
- package/lib/components/Icons/IconShare.md +0 -7
- package/lib/components/Icons/IconSideBar.md +0 -7
- package/lib/components/Icons/IconSideBarActive.md +0 -7
- package/lib/components/Icons/IconStopwatch.md +0 -7
- package/lib/components/Icons/IconStrike.md +0 -60
- package/lib/components/Icons/IconSubject.md +0 -7
- package/lib/components/Icons/IconText.md +0 -7
- package/lib/components/Icons/IconTimer.md +0 -7
- package/lib/components/Icons/IconWarning.md +0 -7
- package/lib/components/Loaders/SkeletonLoader.md +0 -43
- package/lib/components/Modal/Modal.md +0 -31
- package/lib/components/Modal/ModalContainer.md +0 -96
- package/lib/components/Onboarding/EmailAuth.md +0 -40
- package/lib/components/Onboarding/MagicCodeEntry.md +0 -20
- package/lib/components/Pagination/QuestionReviewPagination.md +0 -19
- package/lib/components/Pagination/TablePagination.md +0 -19
- package/lib/components/PhonePerson/PhonePerson.md +0 -36
- package/lib/components/Quiz/FlagToggle.md +0 -37
- package/lib/components/Quiz/GlobalMetricsToggle.md +0 -46
- package/lib/components/Quiz/KeyboardShortcutsButton.md +0 -18
- package/lib/components/Quiz/KeyboardShortcutsModal.md +0 -71
- package/lib/components/Quiz/Question.md +0 -579
- package/lib/components/Quiz/QuizContainer.md +0 -91
- package/lib/components/Quiz/QuizProgress.md +0 -122
- package/lib/components/Quiz/QuizProgressBar.md +0 -131
- package/lib/components/Search/Pill.md +0 -37
- package/lib/components/Search/Search.md +0 -44
- package/lib/components/SidePanels/SidePanel.md +0 -126
- package/lib/components/Tables/StudyTable.md +0 -136
- package/lib/components/Tables/TeachTable.md +0 -696
- package/lib/components/Toasts/Toast.md +0 -35
- package/lib/components/Tooltips/OverflowTooltip.md +0 -14
- package/lib/components/Tooltips/Tooltip.md +0 -72
|
@@ -1,151 +0,0 @@
|
|
|
1
|
-
```vue
|
|
2
|
-
<template>
|
|
3
|
-
<div>
|
|
4
|
-
<Button @click="toggleBackground">Toggle Background</Button>
|
|
5
|
-
<Button @click="toggleBorders">{{ showBorders ? 'Hide' : 'Show' }} Borders</Button>
|
|
6
|
-
<div class="icons__color">
|
|
7
|
-
<label>
|
|
8
|
-
Icon Color
|
|
9
|
-
</label>
|
|
10
|
-
<input type="color" v-model="iconColor">
|
|
11
|
-
</div>
|
|
12
|
-
<div
|
|
13
|
-
class="icons"
|
|
14
|
-
:class="{
|
|
15
|
-
'icons--dark': isDark,
|
|
16
|
-
'icons--borders': showBorders,
|
|
17
|
-
}"
|
|
18
|
-
:style="{
|
|
19
|
-
color: iconColor,
|
|
20
|
-
}"
|
|
21
|
-
>
|
|
22
|
-
<Icon type="accordionArrow" title="accordionArrow" />
|
|
23
|
-
<Icon type="activity" title="activity" />
|
|
24
|
-
<Icon type="add" title="add" />
|
|
25
|
-
<Icon type="addCircle" title="addCircle" />
|
|
26
|
-
<Icon type="arrow" title="arrow" />
|
|
27
|
-
<Icon type="barChart" title="barChart" />
|
|
28
|
-
<Icon type="calendar" title="calendar" />
|
|
29
|
-
<Icon type="check" title="check" />
|
|
30
|
-
<Icon type="close" title="close" />
|
|
31
|
-
<Icon type="correct" title="correct" />
|
|
32
|
-
<Icon type="edit" title="edit" />
|
|
33
|
-
<Icon type="exam" title="exam" />
|
|
34
|
-
<Icon type="eyeShow" title="eyeShow" />
|
|
35
|
-
<Icon type="eyeHide" title="eyeHide" />
|
|
36
|
-
<Icon type="filter" title="filter" />
|
|
37
|
-
<Icon type="filterActive" title="filterActive" />
|
|
38
|
-
<Icon type="flag" title="flag" />
|
|
39
|
-
<Icon type="flagContent" title="flagContent" />
|
|
40
|
-
<Icon type="flagFeedback" title="flagFeedback" />
|
|
41
|
-
<Icon type="flag-filled" title="flag-filled" />
|
|
42
|
-
<Icon type="handle" title="handle" />
|
|
43
|
-
<Icon type="help" title="help" />
|
|
44
|
-
<Icon type="hourglass" title="hourglass" />
|
|
45
|
-
<Icon type="image" title="image" />
|
|
46
|
-
<Icon type="incorrect" title="incorrect" />
|
|
47
|
-
<Icon type="info" title="info"/>
|
|
48
|
-
<Icon type="lightning" title="lightning" />
|
|
49
|
-
<Icon type="list" title="list" />
|
|
50
|
-
<Icon type="loading" title="loading" />
|
|
51
|
-
<Icon type="loading2" title="loading2" :isDarkMode="isDark" />
|
|
52
|
-
<Icon type="missedQuestions" title="missedQuestions" />
|
|
53
|
-
<Icon type="paginationArrow" title="paginationArrow" />
|
|
54
|
-
<Icon type="passage" title="passage" />
|
|
55
|
-
<Icon type="pencil" title="pencil" />
|
|
56
|
-
<Icon type="people" title="people" />
|
|
57
|
-
<Icon type="questions" title="questions" />
|
|
58
|
-
<Icon type="quick10" title="quick10" />
|
|
59
|
-
<Icon type="removeCircle" title="removeCircle" />
|
|
60
|
-
<Icon type="search" title="search" />
|
|
61
|
-
<Icon type="share" title="share" />
|
|
62
|
-
<Icon type="stopwatch" title="stopwatch" />
|
|
63
|
-
<Icon type="strike" title="strike" />
|
|
64
|
-
<Icon type="subject" title="subject" />
|
|
65
|
-
<Icon type="warning" title="warning" />
|
|
66
|
-
<Icon type="lock" title="lock" />
|
|
67
|
-
<Icon type="moon" title="moon" />
|
|
68
|
-
<Icon type="heart" title="heart" />
|
|
69
|
-
<Icon type="externalLink" title="externalLink" />
|
|
70
|
-
<Icon type="keyboard" title="keyboard" />
|
|
71
|
-
<Icon type="fullView" title="fullView" />
|
|
72
|
-
<Icon type="fullViewActive" title="fullViewActive" />
|
|
73
|
-
<Icon type="sideBar" title="sideBar" />
|
|
74
|
-
<Icon type="sideBarActive" title="sideBarActive" />
|
|
75
|
-
<Icon type="text" title="text" />
|
|
76
|
-
<Icon type="review-flag" title="review-flag" />
|
|
77
|
-
<Icon type="levelup" title="levelup" />
|
|
78
|
-
<Icon type="lightbulb" title="lightbulb" />
|
|
79
|
-
<Icon type="chat" title="chat" />
|
|
80
|
-
<Icon type="preview" title="preview" />
|
|
81
|
-
</div>
|
|
82
|
-
</div>
|
|
83
|
-
</template>
|
|
84
|
-
|
|
85
|
-
<script lang="ts">
|
|
86
|
-
export default {
|
|
87
|
-
data () {
|
|
88
|
-
return {
|
|
89
|
-
showBorders: false,
|
|
90
|
-
isDark: false,
|
|
91
|
-
iconColor: '#1f3545',
|
|
92
|
-
}
|
|
93
|
-
},
|
|
94
|
-
methods: {
|
|
95
|
-
toggleBackground () {
|
|
96
|
-
this.isDark = !this.isDark
|
|
97
|
-
if (this.isDark) {
|
|
98
|
-
this.iconColor = '#ffffff'
|
|
99
|
-
} else {
|
|
100
|
-
this.iconColor = '#1f3545'
|
|
101
|
-
}
|
|
102
|
-
},
|
|
103
|
-
toggleBorders () {
|
|
104
|
-
this.showBorders = !this.showBorders
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
</script>
|
|
109
|
-
|
|
110
|
-
<style>
|
|
111
|
-
.icons {
|
|
112
|
-
display: flex;
|
|
113
|
-
align-items: center;
|
|
114
|
-
flex-wrap: wrap;
|
|
115
|
-
margin-top: 12px;
|
|
116
|
-
padding: 12px;
|
|
117
|
-
border-radius: 4px;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
.icons--dark {
|
|
121
|
-
background-color: #1f3545;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
.icons svg,
|
|
125
|
-
.icons div {
|
|
126
|
-
margin: 5px;
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
.icons--borders svg,
|
|
130
|
-
.icons--borders div {
|
|
131
|
-
border: 1px solid #1f3545;
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
.icons--dark.icons--borders svg,
|
|
135
|
-
.icons--dark.icons--borders div {
|
|
136
|
-
border: 1px solid #fff;
|
|
137
|
-
}
|
|
138
|
-
|
|
139
|
-
.icons svg:hover {
|
|
140
|
-
color: #0064ff;
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
.icons--dark svg:hover {
|
|
144
|
-
color: #ffce74;
|
|
145
|
-
}
|
|
146
|
-
|
|
147
|
-
.icons__color {
|
|
148
|
-
margin: 10px 0;
|
|
149
|
-
}
|
|
150
|
-
</style>
|
|
151
|
-
```
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
```vue
|
|
2
|
-
<template>
|
|
3
|
-
<div>
|
|
4
|
-
<Icon type="flagFeedback" />
|
|
5
|
-
<Icon type="flagFeedback" :style="{ color: '#CE8500'}"/>
|
|
6
|
-
<Icon type="flagFeedback" :style="{ color: '#CE8500'}" secondary-color="#FFCE74" />
|
|
7
|
-
<Icon type="flagFeedback" :style="{ color: '#FFBD47', backgroundColor: '#1f3545'}"/>
|
|
8
|
-
<Icon type="flagFeedback" :style="{ color: '#FFBD47', backgroundColor: '#1f3545' }" secondary-color="#FFCE74" />
|
|
9
|
-
</div>
|
|
10
|
-
</template>
|
|
11
|
-
```
|