@eturnity/eturnity_reusable_components 1.2.67 → 1.2.69-EPDM-6893

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": "1.2.67",
3
+ "version": "1.2.69-EPDM-6893",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "dev": "vue-cli-service serve",
@@ -143,8 +143,10 @@ const InputContainer = styled('input', inputProps)`
143
143
  ? '1px solid ' + props.theme.colors[props.borderColor]
144
144
  : '1px solid ' + props.borderColor
145
145
  : '1px solid ' + props.theme.colors.grey4};
146
- padding-top: 11px;
147
- padding-bottom: 11px;
146
+ height: ${(props) => props.inputHeight};
147
+ max-height: ${(props) => props.inputHeight};
148
+ padding-top: 0;
149
+ padding-bottom: 0;
148
150
  padding-left: 10px;
149
151
  padding-right: ${({ slotSize, isError, showLinearUnitName }) =>
150
152
  slotSize
@@ -176,7 +178,7 @@ const InputContainer = styled('input', inputProps)`
176
178
  background-color: ${(props) =>
177
179
  props.isDisabled ? props.theme.colors.grey5 : '#fff'};
178
180
  box-sizing: border-box;
179
- max-height: ${(props) => props.inputHeight};
181
+
180
182
  &::placeholder {
181
183
  color: ${(props) => props.theme.colors.grey2};
182
184
  }
@@ -310,7 +312,7 @@ export default {
310
312
  },
311
313
  inputHeight: {
312
314
  required: false,
313
- default: null
315
+ default: '40px'
314
316
  },
315
317
  value: {
316
318
  required: true,
@@ -39,6 +39,7 @@
39
39
  :isSearchBarVisible="isSearchBarVisible"
40
40
  :disabled="disabled"
41
41
  @keydown.native="onKeyDown"
42
+ :showBorder="showBorder"
42
43
  >
43
44
  <inputText
44
45
  v-if="isSearchBarVisible"
@@ -184,33 +185,36 @@ const selectButtonAttrs = {
184
185
  hasError: Boolean,
185
186
  disabled: Boolean,
186
187
  selectHeight: String,
187
- isSearchBarVisible: Boolean
188
+ isSearchBarVisible: Boolean,
189
+ showBorder: Boolean
188
190
  }
189
191
  const selectButton = styled('div', selectButtonAttrs)`
190
- position:relative;
191
- box-sizing: border-box;
192
- border-radius:4px;
193
- padding: ${(props) =>
194
- props.isSearchBarVisible ? '0 10px 0 0' : '0px 10px'};
195
- text-align:left;
196
- border-radius:4px;
197
- min-height:36px;
198
- display: flex;
199
- align-items: center;
200
- max-height:${(props) => props.selectHeight};
201
- border:1px solid ${(props) =>
202
- props.hasError ? props.theme.colors.red : props.theme.colors.grey4}
203
- background-color:${(props) =>
204
- props.disabled
205
- ? props.theme.colors.grey5
206
- : props.theme.colors[props.bgColor]
207
- ? props.theme.colors[props.bgColor]
208
- : props.bgColor};
209
- color:${(props) =>
210
- props.theme.colors[props.fontColor]
211
- ? props.theme.colors[props.fontColor]
212
- : props.fontColor};
213
- ${(props) => (props.disabled ? 'pointer-events: none' : '')};
192
+ position: relative;
193
+ box-sizing: border-box;
194
+ border-radius: 4px;
195
+ padding: ${(props) => (props.isSearchBarVisible ? '0 10px 0 0' : '0px 10px')};
196
+ text-align: left;
197
+ border-radius: 4px;
198
+ min-height: 36px;
199
+ display: flex;
200
+ align-items: center;
201
+ max-height: ${(props) => props.selectHeight};
202
+ ${({ showBorder, theme, hasError }) =>
203
+ showBorder &&
204
+ `
205
+ border:1px solid ${hasError ? theme.colors.red : theme.colors.grey4}
206
+ `}
207
+ background-color:${(props) =>
208
+ props.disabled
209
+ ? props.theme.colors.grey5
210
+ : props.theme.colors[props.bgColor]
211
+ ? props.theme.colors[props.bgColor]
212
+ : props.bgColor};
213
+ color: ${(props) =>
214
+ props.theme.colors[props.fontColor]
215
+ ? props.theme.colors[props.fontColor]
216
+ : props.fontColor};
217
+ ${(props) => (props.disabled ? 'pointer-events: none' : '')};
214
218
  `
215
219
  const selectDropdownAttrs = {
216
220
  bgColor: String,
@@ -341,6 +345,10 @@ export default {
341
345
  isAutoSearch: {
342
346
  required: false,
343
347
  default: true
348
+ },
349
+ showBorder: {
350
+ required: false,
351
+ default: true
344
352
  }
345
353
  },
346
354
 
@@ -71,9 +71,7 @@
71
71
  import styled from "vue-styled-components"
72
72
  import InfoText from "../../infoText"
73
73
  import theme from "../../../assets/theme"
74
- const Container = styled.div`
75
- display: inline-block;
76
- `
74
+ const Container = styled.div``
77
75
 
78
76
  const flexAttrs = { label:String,size: String, disabled: Boolean,alignItems: String }
79
77
  const FlexWrapper = styled("div", flexAttrs)`
@@ -117,12 +115,14 @@ import styled from "vue-styled-components"
117
115
  border:1px solid ${props=>props.isActive?props.secondaryColor:props.inactiveColor};
118
116
  display:flex;
119
117
  align-items:center;
120
- font-size: 13px;
121
- line-height: 1;
122
- text-align: center;
123
- padding: 10px;
124
- margin-right: -1px;
125
- transition: all 0.1s ease-in-out;
118
+ justify-content: center;
119
+ flex-grow:1;
120
+ font-size: 13px;
121
+ line-height: 1;
122
+ text-align: center;
123
+ padding: 10px;
124
+ margin-right: -1px;
125
+ transition: all 0.1s ease-in-out;
126
126
  overflow:hidden;
127
127
  & :hover{
128
128
  cursor: pointer;