@eturnity/eturnity_reusable_components 1.2.80 → 1.2.81
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.
|
|
3
|
+
"version": "1.2.81",
|
|
4
4
|
"private": false,
|
|
5
5
|
"scripts": {
|
|
6
6
|
"dev": "vue-cli-service serve",
|
|
@@ -11,7 +11,6 @@
|
|
|
11
11
|
},
|
|
12
12
|
"dependencies": {
|
|
13
13
|
"@vueform/slider": "1.0.5",
|
|
14
|
-
"core-js": "3.6.5",
|
|
15
14
|
"vue": "2.6.11",
|
|
16
15
|
"vue-styled-components": "1.6.0",
|
|
17
16
|
"html-loader": "0.5.5",
|
|
@@ -60,4 +59,4 @@
|
|
|
60
59
|
"author": "Aaron Enser",
|
|
61
60
|
"license": "ISC",
|
|
62
61
|
"homepage": "https://bitbucket.org/eturnitydevs/eturnity_reusable_components#readme"
|
|
63
|
-
}
|
|
62
|
+
}
|
package/src/App.vue
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<page-container>
|
|
4
4
|
<br />
|
|
5
5
|
|
|
6
|
-
|
|
6
|
+
{{ alignItems }}
|
|
7
7
|
<input-number
|
|
8
8
|
:value="value"
|
|
9
9
|
:minNumber="0"
|
|
@@ -16,7 +16,6 @@
|
|
|
16
16
|
textAlign="left"
|
|
17
17
|
:isInteractive="true"
|
|
18
18
|
:interactionStep="1"
|
|
19
|
-
alignItems="horizontal"
|
|
20
19
|
@on-input="value = $event"
|
|
21
20
|
@input-change="changeHandler"
|
|
22
21
|
@input-focus="focusHandler"
|
|
@@ -3,6 +3,10 @@
|
|
|
3
3
|
<label-slot-wrapper
|
|
4
4
|
v-if="hasLabelSlot"
|
|
5
5
|
:isInteractive="isInteractive"
|
|
6
|
+
:alignItems="alignItems"
|
|
7
|
+
:noBorder="noBorder"
|
|
8
|
+
:isError="isError"
|
|
9
|
+
:borderColor="borderColor"
|
|
6
10
|
@mousedown="initInteraction"
|
|
7
11
|
>
|
|
8
12
|
<slot name="label"></slot>
|
|
@@ -29,6 +33,7 @@
|
|
|
29
33
|
:isError="isError"
|
|
30
34
|
:inputHeight="inputHeight"
|
|
31
35
|
:minWidth="minWidth"
|
|
36
|
+
:isInteractive="isInteractive"
|
|
32
37
|
:value="formatWithCurrency(value)"
|
|
33
38
|
@blur="onInputBlur($event)"
|
|
34
39
|
@focus="focusInput()"
|
|
@@ -36,6 +41,7 @@
|
|
|
36
41
|
@input="onInput($event)"
|
|
37
42
|
:disabled="disabled"
|
|
38
43
|
:isDisabled="disabled"
|
|
44
|
+
:alignItems="alignItems"
|
|
39
45
|
:noBorder="noBorder"
|
|
40
46
|
:borderColor="borderColor"
|
|
41
47
|
:textAlign="textAlign"
|
|
@@ -154,7 +160,7 @@ const InputContainer = styled('input', inputProps)`
|
|
|
154
160
|
: isError && !showLinearUnitName
|
|
155
161
|
? '24px'
|
|
156
162
|
: '5px'};
|
|
157
|
-
border-radius: 4px;
|
|
163
|
+
border-radius: ${props=>props.isInteractive && props.alignItems!="vertical" ? "0 4px 4px 0" : "4px"};
|
|
158
164
|
text-align: ${(props) => props.textAlign};
|
|
159
165
|
cursor: ${(props) => (props.isDisabled ? 'not-allowed' : 'auto')};
|
|
160
166
|
font-size: ${(props) => (props.fontSize ? props.fontSize : '13px')};
|
|
@@ -246,6 +252,20 @@ const LabelSlotWrapper = styled('div', inputProps)`
|
|
|
246
252
|
gap: 10px;
|
|
247
253
|
align-items: center;
|
|
248
254
|
cursor: ${(props) => (props.isInteractive ? 'ew-resize' : 'auto')};
|
|
255
|
+
border: ${(props) =>
|
|
256
|
+
props.alignItems=="vertical"
|
|
257
|
+
? "none"
|
|
258
|
+
: props.isError
|
|
259
|
+
? '1px solid ' + props.theme.colors.red
|
|
260
|
+
: props.noBorder
|
|
261
|
+
? 'none'
|
|
262
|
+
: props.borderColor
|
|
263
|
+
? props.theme.colors[props.borderColor]
|
|
264
|
+
? '1px solid ' + props.theme.colors[props.borderColor]
|
|
265
|
+
: '1px solid ' + props.borderColor
|
|
266
|
+
: '1px solid ' + props.theme.colors.grey4};
|
|
267
|
+
border-radius: 4px 0 0 4px;
|
|
268
|
+
border-right:none;
|
|
249
269
|
`
|
|
250
270
|
|
|
251
271
|
const LabelText = styled('div', inputProps)`
|