@eturnity/eturnity_reusable_components 6.46.5-EPDM-8599.0 → 6.46.5-EPDM-8891.1

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eturnity/eturnity_reusable_components",
3
- "version": "6.46.5-EPDM-8599.0",
3
+ "version": "6.46.5-EPDM-8891.1",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "dev": "vue-cli-service serve",
package/src/App.vue CHANGED
@@ -114,7 +114,6 @@ import iconCollection from '@/components/icon/iconCollection'
114
114
  import dropdownComponent from '@/components/dropdown'
115
115
  import videoThumbnail from '@/components/videoThumbnail'
116
116
  import icon from '@/components/icon'
117
- import infoCard from '@/components/infoCard'
118
117
  // import TableDropdown from "@/components/tableDropdown"
119
118
 
120
119
  const PageContainer = styled.div`
@@ -139,8 +138,7 @@ export default {
139
138
  iconCollection,
140
139
  dropdownComponent,
141
140
  videoThumbnail,
142
- icon,
143
- infoCard
141
+ icon
144
142
  },
145
143
  data() {
146
144
  return {
@@ -408,7 +408,7 @@ export default {
408
408
  isActive: false,
409
409
  textSearch: '',
410
410
  hoveredIndex: 0,
411
- hoveredValue:null,
411
+ hoveredValue: null,
412
412
  isClickOutsideActive: false
413
413
  }
414
414
  },
@@ -447,7 +447,7 @@ export default {
447
447
  this.$emit('input-change', e)
448
448
  },
449
449
  optionHovered(e) {
450
- this.hoveredValue=e
450
+ this.hoveredValue = e
451
451
  },
452
452
  mouseEnterHandler() {
453
453
  if (this.hoverDropdown) {
@@ -502,14 +502,16 @@ export default {
502
502
  },
503
503
  onArrowPress(dir) {
504
504
  let newHoveredElem
505
- const currentHoveredElem=this.$refs.dropdown.$el.querySelector(`[data-value="${this.hoveredValue}"]`);
506
- if(currentHoveredElem){
507
- if(dir>0){
508
- newHoveredElem=currentHoveredElem.nextElementSibling
509
- }else{
510
- newHoveredElem=currentHoveredElem.previousElementSibling
505
+ const currentHoveredElem = this.$refs.dropdown.$el.querySelector(
506
+ `[data-value="${this.hoveredValue}"]`
507
+ )
508
+ if (currentHoveredElem) {
509
+ if (dir > 0) {
510
+ newHoveredElem = currentHoveredElem.nextElementSibling
511
+ } else {
512
+ newHoveredElem = currentHoveredElem.previousElementSibling
511
513
  }
512
- if(newHoveredElem){
514
+ if (newHoveredElem) {
513
515
  this.hoveredValue = newHoveredElem.getAttribute('data-value')
514
516
  const topPos = newHoveredElem.offsetTop
515
517
  this.$refs.dropdown.$el.scrollTop = topPos
@@ -520,12 +522,20 @@ export default {
520
522
  computed: {
521
523
  optionLength() {
522
524
  if (this.isDropdownOpen) {
523
- return this.$refs.dropdown.$children.length
525
+ // this filterRef is needed to check for the # of children on Filter dropdowns
526
+ const filterRef =
527
+ this.$refs.dropdown.$children &&
528
+ this.$refs.dropdown.$children.length &&
529
+ this.$refs.dropdown.$children[0].$children
530
+ ? this.$refs.dropdown.$children[0].$children
531
+ : this.$refs.dropdown.$children
532
+ return filterRef.length
524
533
  } else {
525
534
  return 0
526
535
  }
527
536
  },
528
537
  isSearchBarVisible() {
538
+ console.log('this.optionLength', this.optionLength)
529
539
  return this.isSearchable && this.optionLength >= 5 && this.isDropdownOpen
530
540
  }
531
541
  },
@@ -1,38 +0,0 @@
1
- <template>
2
- <info-container>
3
- <icon name="info" size="24px" />
4
- <InfoTextContainer>
5
- <slot />
6
- </InfoTextContainer>
7
- </info-container>
8
- </template>
9
-
10
- <script>
11
- import styled from 'vue-styled-components'
12
- import icon from '../icon'
13
- const InfoContainer = styled('div')`
14
- display: flex;
15
- align-items: flex-start;
16
- gap: 15px;
17
- padding: 20px;
18
- width: 500px;
19
- min-width: 450px;
20
- border: 1px dashed #dee2eb;
21
- border-radius: 4px;
22
- margin:20px 0;
23
- `
24
-
25
- const InfoTextContainer = styled('div')`
26
- font-size: 13px;
27
- `
28
-
29
-
30
- export default {
31
- components:{
32
- icon,
33
- InfoTextContainer,
34
- InfoContainer
35
- },
36
- props:[]
37
- }
38
- </script>