@kiva/kv-components 4.8.0 → 4.8.2

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.
Files changed (18) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/components/KvCommentsAdd.vue +4 -4
  3. package/dist/components/KvCommentsHeartButton.vue +1 -1
  4. package/dist/components/KvCommentsReplyButton.vue +3 -3
  5. package/dist/components/KvInlineActivityCard.vue +1 -1
  6. package/dist/components/KvIntroductionLoanCard.vue +2 -2
  7. package/dist/components/KvLendCta.vue +10 -9
  8. package/dist/components/KvLoanActivities.vue +7 -7
  9. package/dist/components/KvWideLoanCard.vue +1 -1
  10. package/package.json +2 -2
  11. package/vue/KvCommentsAdd.vue +4 -4
  12. package/vue/KvCommentsHeartButton.vue +1 -1
  13. package/vue/KvCommentsReplyButton.vue +3 -3
  14. package/vue/KvInlineActivityCard.vue +1 -1
  15. package/vue/KvIntroductionLoanCard.vue +2 -2
  16. package/vue/KvLendCta.vue +10 -9
  17. package/vue/KvLoanActivities.vue +7 -7
  18. package/vue/KvWideLoanCard.vue +1 -1
package/CHANGELOG.md CHANGED
@@ -3,6 +3,25 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [4.8.2](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@4.8.1...@kiva/kv-components@4.8.2) (2025-01-09)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * set full width for continue to basket state ([cacc5a2](https://github.com/kiva/kv-ui-elements/commit/cacc5a2ec697dd37466fc6b1b4ff4fef40edf5ef))
12
+
13
+
14
+
15
+
16
+
17
+ ## [4.8.1](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@4.8.0...@kiva/kv-components@4.8.1) (2025-01-09)
18
+
19
+ **Note:** Version bump only for package @kiva/kv-components
20
+
21
+
22
+
23
+
24
+
6
25
  # [4.8.0](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@4.7.1...@kiva/kv-components@4.8.0) (2025-01-09)
7
26
 
8
27
 
package/dist/components/KvCommentsAdd.vue CHANGED
@@ -116,20 +116,20 @@ export default {
116
116
  </script>
117
117
 
118
118
  <style lang="postcss" scoped>
119
- >>> input {
119
+ :deep(input) {
120
120
  @apply tw-border-t-0 tw-border-r-0 tw-border-l-0 tw-rounded-none tw-p-0 tw-h-4;
121
121
  }
122
122
 
123
- >>> input:focus {
123
+ :deep(input:focus) {
124
124
  @apply tw-border-tertiary;
125
125
  box-shadow: none;
126
126
  }
127
127
 
128
- >>> button > span {
128
+ :deep(button > span) {
129
129
  @apply tw-min-h-0;
130
130
  }
131
131
 
132
- >>> button > span > span {
132
+ :deep(button > span > span) {
133
133
  @apply tw-py-0 tw-px-0.5;
134
134
  }
135
135
  </style>
package/dist/components/KvCommentsHeartButton.vue CHANGED
@@ -64,7 +64,7 @@ export default {
64
64
  </script>
65
65
 
66
66
  <style scoped>
67
- .filled >>> svg {
67
+ .filled :deep(svg) {
68
68
  fill: #F60059;
69
69
  }
70
70
  </style>
package/dist/components/KvCommentsReplyButton.vue CHANGED
@@ -38,15 +38,15 @@ export default {
38
38
  </script>
39
39
 
40
40
  <style lang="postcss" scoped>
41
- >>> span {
41
+ :deep(span) {
42
42
  @apply tw-min-h-0;
43
43
  }
44
44
 
45
- >>> span > span {
45
+ :deep(span > span) {
46
46
  @apply tw-py-0 tw-px-0.5 tw-flex tw-items-center;
47
47
  }
48
48
 
49
- >>> svg {
49
+ :deep(svg) {
50
50
  @apply tw-mx-0.5;
51
51
  }
52
52
  </style>
package/dist/components/KvInlineActivityCard.vue CHANGED
@@ -49,7 +49,7 @@ export default {
49
49
  </script>
50
50
 
51
51
  <style scoped lang="postcss">
52
- .activity-avatar, .activity-avatar >>> img, .activity-avatar >>> div {
52
+ .activity-avatar, .activity-avatar :deep(img), .activity-avatar :deep(div) {
53
53
  @apply tw-w-4 tw-h-4;
54
54
  }
55
55
  </style>
package/dist/components/KvIntroductionLoanCard.vue CHANGED
@@ -425,7 +425,7 @@ export default {
425
425
  </script>
426
426
 
427
427
  <style lang="postcss" scoped>
428
- .loan-callouts >>> span {
428
+ .loan-callouts :deep(span) {
429
429
  @apply !tw-bg-transparent tw-text-action;
430
430
  }
431
431
  .loan-card-use:hover,
@@ -443,7 +443,7 @@ export default {
443
443
  .loan-card-name {
444
444
  @apply tw-pt-1 tw-px-3 tw-text-ellipsis tw-overflow-hidden tw-line-clamp-1 tw-cursor-pointer;
445
445
  }
446
- .loan-bookmark >>> button {
446
+ .loan-bookmark :deep(button) {
447
447
  @apply !tw-rounded-t-none;
448
448
  }
449
449
  </style>
package/dist/components/KvLendCta.vue CHANGED
@@ -5,6 +5,7 @@
5
5
  v-if="isInBasket"
6
6
  variant="secondary"
7
7
  class="tw-inline-flex tw-flex-1"
8
+ :class="{ 'tw-w-full': showPresetAmounts }"
8
9
  data-testid="bp-lend-cta-checkout-button"
9
10
  :to="!externalLinks ? '/basket' : undefined"
10
11
  :href="externalLinks ? '/basket' : undefined"
@@ -550,39 +551,39 @@ export default {
550
551
  </script>
551
552
 
552
553
  <style lang="postcss" scoped>
553
- .amountDropdownWrapper >>> select {
554
+ .amountDropdownWrapper :deep(select) {
554
555
  border-radius: 14px 0 0 14px;
555
556
  }
556
557
 
557
- .lend-again >>> span {
558
+ .lend-again :deep(span) {
558
559
  @apply tw-px-0;
559
560
  }
560
561
 
561
- .lend-again >>> span {
562
+ .lend-again :deep(span) {
562
563
  @apply tw-px-1;
563
564
  }
564
565
 
565
- .lendButtonWrapper >>> span:first-child {
566
+ .lendButtonWrapper :deep(span:first-child) {
566
567
  border-radius: 0 14px 14px 0;
567
568
  }
568
569
 
569
- .filtered-dropdown >>> select {
570
+ .filtered-dropdown :deep(select) {
570
571
  @apply tw-rounded tw-border-2 tw-font-medium tw-cursor-pointer;
571
572
  }
572
573
 
573
- .unselected-dropdown >>> select {
574
+ .unselected-dropdown :deep(select) {
574
575
  @apply tw-border-gray-400;
575
576
  }
576
577
 
577
- .selected-dropdown >>> select {
578
+ .selected-dropdown :deep(select) {
578
579
  @apply tw-border-eco-green-4;
579
580
  }
580
581
 
581
- .preset-option >>> span.tw-w-full:first-child {
582
+ .preset-option :deep(span.tw-w-full:first-child) {
582
583
  @apply tw-border-2 tw-border-gray-400;
583
584
  }
584
585
 
585
- .selected-option >>> span.tw-w-full:first-child {
586
+ .selected-option :deep(span.tw-w-full:first-child) {
586
587
  @apply tw-border-eco-green-4;
587
588
  }
588
589
  </style>
package/dist/components/KvLoanActivities.vue CHANGED
@@ -233,24 +233,24 @@ export default {
233
233
  </script>
234
234
 
235
235
  <style scoped lang="postcss">
236
- .loan-activity >>> #kvLightboxBody {
236
+ .loan-activity :deep(#kvLightboxBody) {
237
237
  @apply tw-flex tw-flex-col tw-px-0 tw-pb-0;
238
238
  }
239
239
 
240
- .loan-activity >>> div > div > div > div > div:first-child {
240
+ .loan-activity :deep(div > div > div > div > div:first-child) {
241
241
  box-shadow: var(--kiva-box-shadow);
242
242
  }
243
243
 
244
- .loan-activity >>> div > div > div > div > div:first-child > div,
245
- .loan-activity >>> #kvLightboxBody div {
244
+ .loan-activity :deep(div > div > div > div > div:first-child > div),
245
+ .loan-activity :deep(#kvLightboxBody div) {
246
246
  box-shadow: none;
247
247
  }
248
248
 
249
- .loan-activity >>> #kvLightboxBody > div:first-child {
249
+ .loan-activity :deep(#kvLightboxBody > div:first-child) {
250
250
  @apply tw-px-4;
251
251
  }
252
252
 
253
- .loan-activity >>> [role=dialog] {
253
+ .loan-activity :deep([role=dialog]) {
254
254
  min-width: 840px;
255
255
  max-width: 840px !important;
256
256
 
@@ -260,7 +260,7 @@ export default {
260
260
  }
261
261
  }
262
262
 
263
- .loan-activity >>> #kvLightboxBody > div:nth-child(2) {
263
+ .loan-activity :deep(#kvLightboxBody > div:nth-child(2)) {
264
264
  @apply tw-px-4;
265
265
 
266
266
  box-shadow: var(--kiva-negative-box-shadow);
package/dist/components/KvWideLoanCard.vue CHANGED
@@ -427,7 +427,7 @@ export default {
427
427
  @apply tw-no-underline;
428
428
  }
429
429
  /** Unique to this loan card */
430
- .loan-callouts >>> div{
430
+ .loan-callouts :deep(div) {
431
431
  @apply tw-flex-wrap tw-h-auto;
432
432
  }
433
433
  </style>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kiva/kv-components",
3
- "version": "4.8.0",
3
+ "version": "4.8.2",
4
4
  "type": "module",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -98,5 +98,5 @@
98
98
  "peerDependencies": {
99
99
  "vue": ">=3.0.0"
100
100
  },
101
- "gitHead": "b556f273d9899af55972cc28add6c4bb536bb15e"
101
+ "gitHead": "fb397ddfd2f024a90f420da0298e43ebb290a0b3"
102
102
  }
package/vue/KvCommentsAdd.vue CHANGED
@@ -116,20 +116,20 @@ export default {
116
116
  </script>
117
117
 
118
118
  <style lang="postcss" scoped>
119
- >>> input {
119
+ :deep(input) {
120
120
  @apply tw-border-t-0 tw-border-r-0 tw-border-l-0 tw-rounded-none tw-p-0 tw-h-4;
121
121
  }
122
122
 
123
- >>> input:focus {
123
+ :deep(input:focus) {
124
124
  @apply tw-border-tertiary;
125
125
  box-shadow: none;
126
126
  }
127
127
 
128
- >>> button > span {
128
+ :deep(button > span) {
129
129
  @apply tw-min-h-0;
130
130
  }
131
131
 
132
- >>> button > span > span {
132
+ :deep(button > span > span) {
133
133
  @apply tw-py-0 tw-px-0.5;
134
134
  }
135
135
  </style>
package/vue/KvCommentsHeartButton.vue CHANGED
@@ -64,7 +64,7 @@ export default {
64
64
  </script>
65
65
 
66
66
  <style scoped>
67
- .filled >>> svg {
67
+ .filled :deep(svg) {
68
68
  fill: #F60059;
69
69
  }
70
70
  </style>
package/vue/KvCommentsReplyButton.vue CHANGED
@@ -38,15 +38,15 @@ export default {
38
38
  </script>
39
39
 
40
40
  <style lang="postcss" scoped>
41
- >>> span {
41
+ :deep(span) {
42
42
  @apply tw-min-h-0;
43
43
  }
44
44
 
45
- >>> span > span {
45
+ :deep(span > span) {
46
46
  @apply tw-py-0 tw-px-0.5 tw-flex tw-items-center;
47
47
  }
48
48
 
49
- >>> svg {
49
+ :deep(svg) {
50
50
  @apply tw-mx-0.5;
51
51
  }
52
52
  </style>
package/vue/KvInlineActivityCard.vue CHANGED
@@ -49,7 +49,7 @@ export default {
49
49
  </script>
50
50
 
51
51
  <style scoped lang="postcss">
52
- .activity-avatar, .activity-avatar >>> img, .activity-avatar >>> div {
52
+ .activity-avatar, .activity-avatar :deep(img), .activity-avatar :deep(div) {
53
53
  @apply tw-w-4 tw-h-4;
54
54
  }
55
55
  </style>
package/vue/KvIntroductionLoanCard.vue CHANGED
@@ -425,7 +425,7 @@ export default {
425
425
  </script>
426
426
 
427
427
  <style lang="postcss" scoped>
428
- .loan-callouts >>> span {
428
+ .loan-callouts :deep(span) {
429
429
  @apply !tw-bg-transparent tw-text-action;
430
430
  }
431
431
  .loan-card-use:hover,
@@ -443,7 +443,7 @@ export default {
443
443
  .loan-card-name {
444
444
  @apply tw-pt-1 tw-px-3 tw-text-ellipsis tw-overflow-hidden tw-line-clamp-1 tw-cursor-pointer;
445
445
  }
446
- .loan-bookmark >>> button {
446
+ .loan-bookmark :deep(button) {
447
447
  @apply !tw-rounded-t-none;
448
448
  }
449
449
  </style>
package/vue/KvLendCta.vue CHANGED
@@ -5,6 +5,7 @@
5
5
  v-if="isInBasket"
6
6
  variant="secondary"
7
7
  class="tw-inline-flex tw-flex-1"
8
+ :class="{ 'tw-w-full': showPresetAmounts }"
8
9
  data-testid="bp-lend-cta-checkout-button"
9
10
  :to="!externalLinks ? '/basket' : undefined"
10
11
  :href="externalLinks ? '/basket' : undefined"
@@ -550,39 +551,39 @@ export default {
550
551
  </script>
551
552
 
552
553
  <style lang="postcss" scoped>
553
- .amountDropdownWrapper >>> select {
554
+ .amountDropdownWrapper :deep(select) {
554
555
  border-radius: 14px 0 0 14px;
555
556
  }
556
557
 
557
- .lend-again >>> span {
558
+ .lend-again :deep(span) {
558
559
  @apply tw-px-0;
559
560
  }
560
561
 
561
- .lend-again >>> span {
562
+ .lend-again :deep(span) {
562
563
  @apply tw-px-1;
563
564
  }
564
565
 
565
- .lendButtonWrapper >>> span:first-child {
566
+ .lendButtonWrapper :deep(span:first-child) {
566
567
  border-radius: 0 14px 14px 0;
567
568
  }
568
569
 
569
- .filtered-dropdown >>> select {
570
+ .filtered-dropdown :deep(select) {
570
571
  @apply tw-rounded tw-border-2 tw-font-medium tw-cursor-pointer;
571
572
  }
572
573
 
573
- .unselected-dropdown >>> select {
574
+ .unselected-dropdown :deep(select) {
574
575
  @apply tw-border-gray-400;
575
576
  }
576
577
 
577
- .selected-dropdown >>> select {
578
+ .selected-dropdown :deep(select) {
578
579
  @apply tw-border-eco-green-4;
579
580
  }
580
581
 
581
- .preset-option >>> span.tw-w-full:first-child {
582
+ .preset-option :deep(span.tw-w-full:first-child) {
582
583
  @apply tw-border-2 tw-border-gray-400;
583
584
  }
584
585
 
585
- .selected-option >>> span.tw-w-full:first-child {
586
+ .selected-option :deep(span.tw-w-full:first-child) {
586
587
  @apply tw-border-eco-green-4;
587
588
  }
588
589
  </style>
package/vue/KvLoanActivities.vue CHANGED
@@ -233,24 +233,24 @@ export default {
233
233
  </script>
234
234
 
235
235
  <style scoped lang="postcss">
236
- .loan-activity >>> #kvLightboxBody {
236
+ .loan-activity :deep(#kvLightboxBody) {
237
237
  @apply tw-flex tw-flex-col tw-px-0 tw-pb-0;
238
238
  }
239
239
 
240
- .loan-activity >>> div > div > div > div > div:first-child {
240
+ .loan-activity :deep(div > div > div > div > div:first-child) {
241
241
  box-shadow: var(--kiva-box-shadow);
242
242
  }
243
243
 
244
- .loan-activity >>> div > div > div > div > div:first-child > div,
245
- .loan-activity >>> #kvLightboxBody div {
244
+ .loan-activity :deep(div > div > div > div > div:first-child > div),
245
+ .loan-activity :deep(#kvLightboxBody div) {
246
246
  box-shadow: none;
247
247
  }
248
248
 
249
- .loan-activity >>> #kvLightboxBody > div:first-child {
249
+ .loan-activity :deep(#kvLightboxBody > div:first-child) {
250
250
  @apply tw-px-4;
251
251
  }
252
252
 
253
- .loan-activity >>> [role=dialog] {
253
+ .loan-activity :deep([role=dialog]) {
254
254
  min-width: 840px;
255
255
  max-width: 840px !important;
256
256
 
@@ -260,7 +260,7 @@ export default {
260
260
  }
261
261
  }
262
262
 
263
- .loan-activity >>> #kvLightboxBody > div:nth-child(2) {
263
+ .loan-activity :deep(#kvLightboxBody > div:nth-child(2)) {
264
264
  @apply tw-px-4;
265
265
 
266
266
  box-shadow: var(--kiva-negative-box-shadow);
package/vue/KvWideLoanCard.vue CHANGED
@@ -427,7 +427,7 @@ export default {
427
427
  @apply tw-no-underline;
428
428
  }
429
429
  /** Unique to this loan card */
430
- .loan-callouts >>> div{
430
+ .loan-callouts :deep(div) {
431
431
  @apply tw-flex-wrap tw-h-auto;
432
432
  }
433
433
  </style>