@pocketprep/ui-kit 3.5.9 → 3.5.11

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.
@@ -14,6 +14,7 @@
14
14
  :force-focus-style="isShowingCalendar"
15
15
  :hideInputCaret="true"
16
16
  :disabled="disabled"
17
+ :error="error"
17
18
  @update:modelValue="processDateString"
18
19
  @click="showCalendar"
19
20
  @keydown="handleInputKeydown"
@@ -45,7 +46,8 @@
45
46
  :class="{
46
47
  'uikit-calendar__calendar-icon--active': !disabled && (hover || isShowingCalendar),
47
48
  'uikit-calendar__calendar-icon--no-label': !label,
48
- 'uikit-calendar__calendar-icon--with-subtext': !!labelSubtext
49
+ 'uikit-calendar__calendar-icon--with-subtext': !!labelSubtext,
50
+ 'uikit-calendar__calendar-icon--error': error,
49
51
  }"
50
52
  >
51
53
  <Icon type="calendarPicker" />
@@ -87,6 +89,7 @@ export default class Calendar extends Vue {
87
89
  @Prop() modelValue!: Date | null
88
90
  @Prop({ default: false }) isDarkMode!: boolean
89
91
  @Prop({ default: false }) disabled!: boolean
92
+ @Prop({ default: false }) error!: boolean
90
93
 
91
94
  calendar: null | Litepicker = null
92
95
  calendarInput: Date | null = null
@@ -274,6 +277,14 @@ export default class Calendar extends Vue {
274
277
  top: 48px;
275
278
  }
276
279
 
280
+ &--error {
281
+ color: $pepper;
282
+
283
+ &--dark {
284
+ color: $rosa;
285
+ }
286
+ }
287
+
277
288
  svg {
278
289
  width: 100%;
279
290
  height: 100%;
@@ -76,6 +76,7 @@
76
76
  <IconLink v-else-if="type === 'link'" :title="title" />
77
77
  <IconAssignment v-else-if="type === 'assignment'" :title="title" />
78
78
  <IconQuickActions v-else-if="type === 'quickActions'" :title="title" />
79
+ <IconHighlight v-else-if="type === 'highlight'" :title="title" />
79
80
  </template>
80
81
 
81
82
  <script lang="ts">
@@ -150,6 +151,7 @@ import IconPresent from './IconPresent.vue'
150
151
  import IconLink from './IconLink.vue'
151
152
  import IconAssignment from './IconAssignment.vue'
152
153
  import IconQuickActions from './IconQuickActions.vue'
154
+ import IconHighlight from './IconHighlight.vue'
153
155
 
154
156
  @Component({
155
157
  name: 'Icon',
@@ -223,6 +225,7 @@ import IconQuickActions from './IconQuickActions.vue'
223
225
  IconLink,
224
226
  IconAssignment,
225
227
  IconQuickActions,
228
+ IconHighlight,
226
229
  },
227
230
  })
228
231
  export default class Icon extends Vue {
@@ -0,0 +1,26 @@
1
+ <script setup lang="ts">
2
+
3
+ const { title } = defineProps<{
4
+ title: string
5
+ }>()
6
+ </script>
7
+
8
+ <template>
9
+ <!-- eslint-disable -->
10
+ <svg width="134"
11
+ height="27"
12
+ viewBox="0 0 134 27"
13
+ fill="none"
14
+ xmlns="http://www.w3.org/2000/svg"
15
+ preserveAspectRatio="none">
16
+ <title>{{ title }}</title>
17
+ <g style="mix-blend-mode:multiply">
18
+ <path fill-rule="evenodd"
19
+ clip-rule="evenodd"
20
+ d="M121.896 26.7761C78.6574 17.4701 39.0734 19.3182 11.3378 23.0625C5.86462 23.8014 0.828735 19.9635 0.0898539 14.4903C-0.649027 9.01707 3.1889 3.98118 8.66209 3.2423C37.9265 -0.708394 79.9561 -2.70836 126.104 7.22387C131.503 8.38592 134.938 13.7049 133.776 19.1041C132.614 24.5033 127.295 27.9382 121.896 26.7761Z"
21
+ fill="currentColor"
22
+ fill-opacity="0.7" />
23
+ </g>
24
+ </svg>
25
+ <!-- eslint-disable -->
26
+ </template>
@@ -67,4 +67,5 @@ export type TIconType =
67
67
  | 'present'
68
68
  | 'link'
69
69
  | 'assignment'
70
- | 'quickActions'
70
+ | 'quickActions'
71
+ | 'highlight'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pocketprep/ui-kit",
3
- "version": "3.5.9",
3
+ "version": "3.5.11",
4
4
  "description": "Pocket Prep UI Kit",
5
5
  "author": "pocketprep",
6
6
  "scripts": {