@eturnity/eturnity_reusable_components 7.20.0--EPDM-5518.6 → 7.20.0--EPDM-10564.5

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": "7.20.0--EPDM-5518.6",
3
+ "version": "7.20.0--EPDM-10564.5",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "dev": "vue-cli-service serve",
@@ -270,12 +270,6 @@
270
270
  :text="buttonText.cancel"
271
271
  @click="$emit('on-cancel-view')"
272
272
  />
273
- <reset-container v-if="!filterViews || !filterViews.length">
274
- <reset-button @click="$emit('on-reset-filters')">
275
- <icon :name="'update'" size="14px" :color="theme.colors.blue" />
276
- <div>{{ $gettext('reset_filters') }}</div>
277
- </reset-button>
278
- </reset-container>
279
273
  </button-container>
280
274
  </container-wrapper>
281
275
  </template>
@@ -337,16 +331,6 @@ const ButtonContainer = styled.div`
337
331
  padding: 15px;
338
332
  `
339
333
 
340
- const ResetContainer = styled.div`
341
- display: grid;
342
- align-content: center;
343
- margin-left: auto;
344
- div {
345
- margin-top: 0;
346
- align-self: center;
347
- }
348
- `
349
-
350
334
  const ColumnContainer = styled.div``
351
335
 
352
336
  const DragContainer = styled.div`
@@ -473,7 +457,6 @@ export default {
473
457
  DeleteIcon,
474
458
  UpperContainer,
475
459
  ResetButton,
476
- ResetContainer,
477
460
  VueDatePicker
478
461
  },
479
462
  props: {
@@ -70,9 +70,6 @@ export default {
70
70
  },
71
71
  settingsTranslations: {
72
72
  required: false
73
- },
74
- closeDropdown: {
75
- required: false
76
73
  }
77
74
  },
78
75
  data() {
@@ -125,7 +122,6 @@ export default {
125
122
  this.$emit('on-filter-view-select', item)
126
123
  },
127
124
  onViewDelete(item) {
128
- this.onToggleDropdown()
129
125
  this.$emit('on-filter-view-delete', item)
130
126
  },
131
127
  onApplyCurrentView() {
@@ -142,13 +138,6 @@ export default {
142
138
  },
143
139
  beforeDestroy() {
144
140
  document.removeEventListener('click', this.clickOutside)
145
- },
146
- watch: {
147
- closeDropdown(newVal) {
148
- if (newVal) {
149
- this.isDropdownOpen = false
150
- }
151
- }
152
141
  }
153
142
  }
154
143
  </script>
@@ -3,11 +3,10 @@
3
3
  <container
4
4
  :checkColor="checkColor"
5
5
  :size="size"
6
- :hasLabel="label && !!label.length"
6
+ :hasLabel="hasLabel"
7
7
  :backgroundColor="backgroundColor"
8
8
  :isChecked="isChecked"
9
9
  :isDisabled="isDisabled"
10
- :cursorType="cursorType"
11
10
  >
12
11
  <input-checkbox
13
12
  type="checkbox"
@@ -18,7 +17,7 @@
18
17
  <check-wrapper :hasLabel="hasLabel">
19
18
  <span class="checkmark"></span>
20
19
  </check-wrapper>
21
- <label-text v-if="label && !!label.length">{{ label }}</label-text>
20
+ <label-text v-if="hasLabel">{{ label }}</label-text>
22
21
  </container>
23
22
  </component-wrapper>
24
23
  </template>
@@ -34,7 +33,6 @@
34
33
  // size="small"
35
34
  // backgroundColor="red"
36
35
  // :isDisabled="true"
37
- // cursorType="default"
38
36
  // />
39
37
  import styled from 'vue3-styled-components'
40
38
 
@@ -57,8 +55,7 @@ const containerAttrs = {
57
55
  hasLabel: Boolean,
58
56
  backgroundColor: String,
59
57
  isChecked: Boolean,
60
- isDisabled: Boolean,
61
- cursorType: String
58
+ isDisabled: Boolean
62
59
  }
63
60
  const Container = styled('label', containerAttrs)`
64
61
  display: grid;
@@ -67,7 +64,7 @@ const Container = styled('label', containerAttrs)`
67
64
  align-content: center;
68
65
  color: ${(props) => props.theme.colors.black};
69
66
  position: relative;
70
- cursor: ${(props) => (props.isDisabled ? 'not-allowed' : props.cursorType)};
67
+ cursor: ${(props) => (props.isDisabled ? 'not-allowed' : 'pointer')};
71
68
  font-size: 16px;
72
69
  user-select: none;
73
70
 
@@ -92,7 +89,7 @@ const Container = styled('label', containerAttrs)`
92
89
  : props.theme.colors.green
93
90
  : props.isDisabled
94
91
  ? props.theme.colors.lightGray
95
- : props.theme.colors.white};
92
+ : '#fff'};
96
93
  border-radius: 4px;
97
94
  border: 1px solid
98
95
  ${(props) =>
@@ -186,10 +183,6 @@ export default {
186
183
  dataId: {
187
184
  type: String,
188
185
  default: ''
189
- },
190
- cursorType: {
191
- type: String,
192
- default: 'pointer'
193
186
  }
194
187
  },
195
188
  computed: {
@@ -328,7 +328,7 @@ export default {
328
328
  }
329
329
  },
330
330
  methods: {
331
- onEnterPress() {
331
+ onEnterPress(event){
332
332
  this.$emit('on-enter-click')
333
333
  this.$refs.inputElement.$el.blur()
334
334
  },
@@ -268,10 +268,12 @@ const selectButton = styled('div', selectButtonAttrs)`
268
268
  props.isSearchBarVisible
269
269
  ? ''
270
270
  : `padding-left: ${
271
- props.tablePaddingLeft ? props.tablePaddingLeft : props.paddingLeft
271
+ props.hasNoPadding
272
+ ? '0'
273
+ : props.tablePaddingLeft
274
+ ? props.tablePaddingLeft
275
+ : props.paddingLeft
272
276
  }`};
273
- ${(props) =>
274
- props.hasNoPadding ? '' : `padding-left: ${props.paddingLeft}`};
275
277
  text-align: left;
276
278
  min-height: ${(props) =>
277
279
  props.selectHeight
@@ -49,7 +49,7 @@
49
49
  // label="Question 5"
50
50
  // alignItems="horizontal" // horizontal, vertical
51
51
  // :isDisabled="true"
52
- // fontSize="13px"
52
+ // . fontSize="13px"
53
53
  // />
54
54
  import styled from 'vue3-styled-components'
55
55
  import InfoText from '../../infoText'
@@ -81,6 +81,8 @@ const paginationWrapper = styled.nav`
81
81
  flex-wrap: wrap;
82
82
  justify-content: flex-end;
83
83
  align-items: center;
84
+ margin-bottom: 2px;
85
+ margin-top: 10px;
84
86
  `
85
87
  const paginationLink = styled.div`
86
88
  display: flex;
@@ -90,18 +92,15 @@ const paginationLink = styled.div`
90
92
  border-radius: 3px;
91
93
  white-space: nowrap;
92
94
  cursor: pointer;
93
- color: ${(props) => props.theme.colors.brightBlue};
94
95
 
95
96
  &.active {
96
- color: ${(props) => props.theme.colors.white};
97
+ color: #fff;
97
98
  background-color: ${(props) => props.theme.colors.brightBlue};
98
99
  padding: 7px 12px;
99
100
  border-radius: 4px;
100
101
  }
101
102
  `
102
- const arrowText = styled.div`
103
- color: ${(props) => props.theme.colors.brightBlue};
104
- `
103
+ const arrowText = styled.div``
105
104
  const arrowIconContainer = styled.div`
106
105
  margin: 0 10px;
107
106
  display: flex;
@@ -69,7 +69,7 @@
69
69
  </template>
70
70
 
71
71
  <script>
72
- // import ProjectMarker from "@eturnity/eturnity_reusable_components/src/components/projectMarker"
72
+ // import ThreeDots from "@eturnity/eturnity_reusable_components/src/components/projectMarker"
73
73
  // To use:
74
74
  // <project-marker
75
75
  // :activeLanguage="'en-us'"
@@ -1,3 +0,0 @@
1
- <svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path fill-rule="evenodd" clip-rule="evenodd" d="M5 10C7.76142 10 10 7.76142 10 5C10 2.23858 7.76142 0 5 0C2.23858 0 0 2.23858 0 5C0 7.76142 2.23858 10 5 10ZM5.875 5.05243V2.125H4.125V5.92743L6.19061 7.47663L7.24061 6.07663L5.875 5.05243Z" fill="white"/>
3
- </svg>
@@ -1,145 +0,0 @@
1
- <template>
2
- <page-container>
3
- <box-container>
4
- <selected-container
5
- >{{ numberSelected }} {{ $gettext('selected') }}</selected-container
6
- >
7
- <list-container v-if="optionsList.length">
8
- <list-item
9
- v-for="item in optionsList"
10
- :key="item.type"
11
- :hoverColor="item.hoverColor"
12
- @click="$emit('on-' + item.type)"
13
- >
14
- {{ item.name }}
15
- </list-item>
16
- </list-container>
17
- <empty-text v-if="!optionsList.length">
18
- {{ $gettext('no_batch_actions_available') }}
19
- </empty-text>
20
- <icon-container @click="$emit('on-close')">
21
- <icon
22
- name="close_for_modals,_tool_tips"
23
- color="white"
24
- size="14px"
25
- cursor="pointer"
26
- />
27
- </icon-container>
28
- </box-container>
29
- </page-container>
30
- </template>
31
-
32
- <script>
33
- // import SelectedOptions from "@eturnity/eturnity_reusable_components/src/components/selectedOptions"
34
- // optionsList = [
35
- // {
36
- // type: 'export',
37
- // name: 'Export'
38
- // },
39
- // {
40
- // type: 'delete',
41
- // name: 'Delete',
42
- // hoverColor: 'red' // default is green
43
- // }
44
- // ]
45
- // @on-${type}="function" should $emit the callback for the 'type' in the optionsList
46
- // <selected-options
47
- // :numberSelected="numberSelected"
48
- // :optionsList="optionsList"
49
- // @on-close="onCloseFunction()"
50
- // @on-export="function()" @on-delete="function()"
51
- // />
52
- import styled from 'vue3-styled-components'
53
- import Icon from '../icon'
54
-
55
- const PageContainer = styled.div`
56
- position: fixed;
57
- bottom: 30px;
58
- left: 50%;
59
- transform: translateX(-50%);
60
- `
61
-
62
- const SelectedContainer = styled.div`
63
- display: grid;
64
- align-items: center;
65
- height: 100%;
66
- padding-right: 20px;
67
- border-right: 1px solid rgba(255, 255, 255, 0.2);
68
- `
69
-
70
- const BoxContainer = styled.div`
71
- display: flex;
72
- align-items: center;
73
- background-color: ${(props) => props.theme.colors.black};
74
- opacity: 90%;
75
- color: ${(props) => props.theme.colors.white};
76
- border-radius: 4px;
77
- padding: 8px 10px 8px 20px;
78
- font-size: 14px;
79
- height: 40px;
80
- `
81
-
82
- const ListContainer = styled.div`
83
- padding: 0 20px;
84
- display: flex;
85
- gap: 20px;
86
- color: ${(props) => props.theme.colors.white};
87
- `
88
-
89
- const ListAttrs = {
90
- hoverColor: String
91
- }
92
- const ListItem = styled('div', ListAttrs)`
93
- cursor: pointer;
94
- &:hover {
95
- color: ${(props) =>
96
- props.hoverColor
97
- ? props.theme.colors[props.hoverColor]
98
- : props.theme.colors.green};
99
- }
100
- `
101
-
102
- const IconContainer = styled.div`
103
- display: grid;
104
- align-items: center;
105
- justify-items: center;
106
- height: 30px;
107
- width: 30px;
108
- cursor: pointer;
109
- margin-left: 20px;
110
-
111
- &:hover {
112
- background: rgba(255, 255, 255, 0.1);
113
- border-radius: 4px;
114
- }
115
- `
116
-
117
- const EmptyText = styled.div`
118
- color: ${(props) => props.theme.colors.white};
119
- font-size: 13px;
120
- padding-left: 16px;
121
- `
122
-
123
- export default {
124
- name: 'selected-options',
125
- components: {
126
- PageContainer,
127
- BoxContainer,
128
- SelectedContainer,
129
- ListContainer,
130
- ListItem,
131
- Icon,
132
- IconContainer,
133
- EmptyText
134
- },
135
- props: {
136
- optionsList: {
137
- required: true
138
- },
139
- numberSelected: {
140
- required: true,
141
- default: 0
142
- }
143
- }
144
- }
145
- </script>