comand-component-library 3.1.90 → 3.1.92
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/dist/comand-component-library.css +1 -1
- package/dist/comand-component-library.umd.min.js +1 -1
- package/package.json +2 -2
- package/src/App.vue +119 -45
- package/src/assets/data/main-navigation.json +1 -0
- package/src/assets/data/tabs.json +1 -0
- package/src/assets/styles/global-styles.scss +0 -1
- package/src/components/CmdBox.vue +15 -9
- package/src/components/CmdCookieDisclaimer.vue +38 -9
- package/src/components/CmdFakeSelect.vue +11 -19
- package/src/components/CmdFancyBox.vue +46 -13
- package/src/components/CmdFormElement.vue +29 -32
- package/src/components/CmdImageGallery.vue +2 -2
- package/src/components/CmdInputGroup.vue +9 -16
- package/src/components/CmdLoginForm.vue +80 -103
- package/src/components/CmdMainNavigation.vue +6 -6
- package/src/components/CmdMultipleSwitch.vue +4 -12
- package/src/components/CmdNewsletterSubscription.vue +205 -0
- package/src/components/CmdShareButtons.vue +100 -27
- package/src/components/{CmdBoxSiteSearch.vue → CmdSiteSearch.vue} +34 -13
- package/src/components/CmdSystemMessage.vue +6 -0
- package/src/components/CmdTabs.vue +5 -5
- package/src/components/CmdThumbnailScroller.vue +9 -1
- package/src/components/CmdTooltip.vue +1 -1
- package/src/components/CmdTooltipForInputElements.vue +1 -19
- package/src/documentation/generated/CmdFancyBoxPropertyDescriptions.json +10 -0
- package/src/documentation/generated/CmdFormElementPropertyDescriptions.json +0 -5
- package/src/documentation/generated/CmdLoginFormPropertyDescriptions.json +3 -3
- package/src/documentation/generated/CmdNewsletterSubscriptionPropertyDescriptions.json +42 -0
- package/src/documentation/generated/CmdShareButtonsPropertyDescriptions.json +24 -0
- package/src/documentation/generated/CmdSiteSearchPropertyDescriptions.json +79 -0
- package/src/documentation/generated/CmdTooltipForInputElementsPropertyDescriptions.json +1 -6
- package/src/index.js +1 -1
- package/src/mixins/CmdFormElement/DefaultMessageProperties.js +2 -1
- package/src/mixins/CmdThumbnailScroller/DefaultMessageProperties.js +9 -0
- package/src/mixins/FieldValidation.js +19 -7
- package/src/mixins/Identifier.js +28 -0
- package/src/utils/common.js +5 -1
@@ -1,21 +1,51 @@
|
|
1
1
|
<template>
|
2
|
-
<div :class="['cmd-share-buttons',{'stretch': stretchButtons, 'align-right': align === 'right'}]">
|
3
|
-
<
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
2
|
+
<div :class="['cmd-share-buttons', {'stretch': stretchButtons, 'align-right': align === 'right'}]">
|
3
|
+
<CmdFormElement
|
4
|
+
v-if="userMustAcceptDataPrivacy"
|
5
|
+
element="input"
|
6
|
+
type="checkbox"
|
7
|
+
:toggle-switch="cmdFormElement.toggleSwitch"
|
8
|
+
:labelText="cmdFormElement.labelText"
|
9
|
+
:required="cmdFormElement.required"
|
10
|
+
v-model="dataPrivacyAccepted"
|
11
|
+
/>
|
12
|
+
<div class="share-button-wrapper">
|
13
|
+
<a v-for="shareButton in validShareButtons"
|
14
|
+
:key="shareButton.path" :class="['button', {disabled: userMustAcceptDataPrivacy && !dataPrivacyAccepted}]"
|
15
|
+
:id="shareButton.id"
|
16
|
+
:href="getUrl(shareButton)"
|
17
|
+
target="_blank"
|
18
|
+
:title="tooltip(shareButton.tooltip)">
|
19
|
+
<span v-if="shareButton.iconClass && shareButton.iconPosition !== 'right'" :class="shareButton.iconClass"></span>
|
20
|
+
<span v-if="shareButton.linkText">{{ shareButton.linkText }}</span>
|
21
|
+
<span v-if="shareButton.iconClass && shareButton.iconPosition === 'right'" :class="shareButton.iconClass"></span>
|
22
|
+
</a>
|
23
|
+
</div>
|
12
24
|
</div>
|
13
25
|
</template>
|
14
26
|
|
15
27
|
<script>
|
28
|
+
// import components
|
29
|
+
import CmdFormElement from "./CmdFormElement"
|
30
|
+
|
16
31
|
export default {
|
17
32
|
name: "CmdShareButtons",
|
33
|
+
components: {
|
34
|
+
CmdFormElement
|
35
|
+
},
|
36
|
+
data() {
|
37
|
+
return {
|
38
|
+
dataPrivacyAccepted: false
|
39
|
+
}
|
40
|
+
},
|
18
41
|
props: {
|
42
|
+
/**
|
43
|
+
* set default v-model (must be named modelValue in Vue3)
|
44
|
+
*/
|
45
|
+
modelValue: {
|
46
|
+
type: [String, Number, Array],
|
47
|
+
default: ""
|
48
|
+
},
|
19
49
|
/**
|
20
50
|
* set horizontal alignment
|
21
51
|
*
|
@@ -54,6 +84,37 @@ export default {
|
|
54
84
|
appendPage: {
|
55
85
|
type: Boolean,
|
56
86
|
default: true
|
87
|
+
},
|
88
|
+
/**
|
89
|
+
* toggle if user has to accept that anonymous data will be send while sharing
|
90
|
+
*/
|
91
|
+
userMustAcceptDataPrivacy: {
|
92
|
+
type: Boolean,
|
93
|
+
default: true
|
94
|
+
},
|
95
|
+
/**
|
96
|
+
* tooltip shown on hovering disabled buttons
|
97
|
+
*
|
98
|
+
* userMustAcceptDataPrivacy-property must be activated
|
99
|
+
*/
|
100
|
+
tooltipAcceptDataPrivacy: {
|
101
|
+
type: String,
|
102
|
+
default: "You must accept data privacy conditions!"
|
103
|
+
},
|
104
|
+
/**
|
105
|
+
* properties for cmdFormElement
|
106
|
+
*
|
107
|
+
* userMustAcceptDataPrivacy-property must be activated
|
108
|
+
*/
|
109
|
+
cmdFormElement: {
|
110
|
+
type: Object,
|
111
|
+
default() {
|
112
|
+
return {
|
113
|
+
toggleSwitch: true,
|
114
|
+
labelText: "I accept that anonymous data will be send to the platform I share this page on!",
|
115
|
+
required: true
|
116
|
+
}
|
117
|
+
}
|
57
118
|
}
|
58
119
|
},
|
59
120
|
computed: {
|
@@ -63,19 +124,28 @@ export default {
|
|
63
124
|
},
|
64
125
|
methods: {
|
65
126
|
getUrl(shareButton) {
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
127
|
+
if(this.userMustAcceptDataPrivacy && this.dataPrivacyAccepted) {
|
128
|
+
// if path is not given completely by json-data
|
129
|
+
if (this.appendPage) {
|
130
|
+
// if page to share is given by property
|
131
|
+
if (this.page) {
|
132
|
+
return shareButton.path + encodeURIComponent(this.page)
|
133
|
+
}
|
134
|
+
|
135
|
+
// if current page should be append to url
|
136
|
+
return shareButton.path + encodeURIComponent(location.href)
|
71
137
|
}
|
72
138
|
|
73
|
-
// if
|
74
|
-
return shareButton.path
|
139
|
+
// if path is given completely by json-data
|
140
|
+
return shareButton.path
|
75
141
|
}
|
76
|
-
|
77
|
-
|
78
|
-
|
142
|
+
return null
|
143
|
+
},
|
144
|
+
tooltip(tooltip) {
|
145
|
+
if(this.userMustAcceptDataPrivacy && this.dataPrivacyAccepted) {
|
146
|
+
return tooltip
|
147
|
+
}
|
148
|
+
return this.tooltipAcceptDataPrivacy
|
79
149
|
}
|
80
150
|
}
|
81
151
|
}
|
@@ -87,10 +157,19 @@ export default {
|
|
87
157
|
|
88
158
|
.cmd-share-buttons {
|
89
159
|
display: flex;
|
160
|
+
flex-direction: column;
|
90
161
|
gap: var(--default-gap);
|
91
162
|
|
92
163
|
&.align-right {
|
93
|
-
|
164
|
+
.share-button-wrapper {
|
165
|
+
justify-content: flex-end;
|
166
|
+
}
|
167
|
+
}
|
168
|
+
|
169
|
+
&.stretch {
|
170
|
+
.button {
|
171
|
+
flex: 1;
|
172
|
+
}
|
94
173
|
}
|
95
174
|
|
96
175
|
.button {
|
@@ -101,12 +180,6 @@ export default {
|
|
101
180
|
}
|
102
181
|
}
|
103
182
|
|
104
|
-
&.stretch {
|
105
|
-
.button {
|
106
|
-
flex: 1;
|
107
|
-
}
|
108
|
-
}
|
109
|
-
|
110
183
|
a:last-of-type {
|
111
184
|
margin-right: 0;
|
112
185
|
}
|
@@ -1,8 +1,8 @@
|
|
1
1
|
<template>
|
2
2
|
<fieldset class="cmd-box-site-search flex-container">
|
3
3
|
<!-- begin legend -->
|
4
|
-
<legend
|
5
|
-
<!--
|
4
|
+
<legend :class="{'hidden' : !showLegend}">{{ textLegend }}</legend>
|
5
|
+
<!-- end legend -->
|
6
6
|
|
7
7
|
<!-- begin CmdHeadline -->
|
8
8
|
<CmdHeadline
|
@@ -12,20 +12,21 @@
|
|
12
12
|
<!-- end CmdHeadline -->
|
13
13
|
|
14
14
|
<!-- begin form-elements -->
|
15
|
-
<div class="flex-container">
|
15
|
+
<div class="flex-container align-bottom">
|
16
16
|
<!-- begin CmdFormElement for first input -->
|
17
17
|
<CmdFormElement
|
18
|
-
v-if="cmdFormElementInput1.show"
|
19
18
|
element="input"
|
20
19
|
:type="cmdFormElementInput1.type"
|
21
20
|
:show-label="cmdFormElementInput1.showLabel"
|
22
21
|
:labelText="cmdFormElementInput1.labelText"
|
23
22
|
:placeholder="cmdFormElementInput1.placeholder"
|
23
|
+
:required="cmdFormElementInput1.required"
|
24
|
+
:showSearchButton="cmdFormElementInput1.showSearchButton"
|
24
25
|
v-model="searchValue1"
|
25
26
|
/>
|
26
27
|
<!-- end CmdFormElement for first input -->
|
27
28
|
|
28
|
-
<div class="flex-container no-gap">
|
29
|
+
<div class="flex-container align-bottom no-gap">
|
29
30
|
<!-- begin CmdFormElement for second input -->
|
30
31
|
<CmdFormElement
|
31
32
|
v-if="cmdFormElementInput2.show"
|
@@ -34,6 +35,7 @@
|
|
34
35
|
:show-label="cmdFormElementInput2.showLabel"
|
35
36
|
:labelText="cmdFormElementInput2.labelText"
|
36
37
|
:placeholder="cmdFormElementInput2.placeholder"
|
38
|
+
:required="cmdFormElementInput2.required"
|
37
39
|
v-model="searchValue2"
|
38
40
|
/>
|
39
41
|
<!-- end CmdFormElement for second input -->
|
@@ -47,6 +49,7 @@
|
|
47
49
|
:show-label="cmdFormElementRadius.showLabel"
|
48
50
|
:labelText="cmdFormElementRadius.labelText"
|
49
51
|
:select-options="cmdFormElementRadius.selectOptions"
|
52
|
+
:required="cmdFormElementRadius.required"
|
50
53
|
/>
|
51
54
|
<!-- end CmdFormElement for radius -->
|
52
55
|
</div>
|
@@ -56,6 +59,7 @@
|
|
56
59
|
element="button"
|
57
60
|
:nativeButton="cmdFormElementSearchButton"
|
58
61
|
@click="onSearchButtonClick"
|
62
|
+
:disabled="buttonSearchDisabled"
|
59
63
|
aria-live="assertive"
|
60
64
|
/>
|
61
65
|
<!-- end CmdFormElement for search-button -->
|
@@ -71,9 +75,10 @@
|
|
71
75
|
<span v-else>{{ getMessage("cmdsitesearch.show_filter_options") }}</span>
|
72
76
|
</a>
|
73
77
|
<transition name="fade">
|
74
|
-
<div v-if="showFilters && cmdFakeSelect?.selectData.length" class="flex-container no-flex" aria-expanded="true">
|
78
|
+
<div v-if="showFilters && cmdFakeSelect?.selectData.length" class="flex-container no-flex" role="listbox" aria-expanded="true">
|
75
79
|
<!-- begin CmdFakeSelect -->
|
76
80
|
<CmdFakeSelect
|
81
|
+
role="option"
|
77
82
|
:selectData="cmdFakeSelect?.selectData"
|
78
83
|
v-model="searchFilters"
|
79
84
|
:defaultOptionName="cmdFakeSelect?.defaultOptionName"
|
@@ -86,7 +91,9 @@
|
|
86
91
|
</template>
|
87
92
|
<!-- end filters -->
|
88
93
|
</fieldset>
|
94
|
+
<!-- begin CmdFormFilters -->
|
89
95
|
<CmdFormFilters v-if="cmdFakeSelect?.show" v-model="searchFilters" :selectedOptionsName="getOptionName"/>
|
96
|
+
<!-- end CmdFormFilters -->
|
90
97
|
</template>
|
91
98
|
|
92
99
|
<script>
|
@@ -196,11 +203,12 @@ export default {
|
|
196
203
|
type: Object,
|
197
204
|
default() {
|
198
205
|
return {
|
199
|
-
|
200
|
-
|
201
|
-
|
206
|
+
type: "search",
|
207
|
+
showLabel: false,
|
208
|
+
required: true,
|
202
209
|
labelText: "What do you like to search for?",
|
203
|
-
placeholder: "
|
210
|
+
placeholder: "What do you like to search for?",
|
211
|
+
showSearchButton: false
|
204
212
|
}
|
205
213
|
}
|
206
214
|
},
|
@@ -213,9 +221,10 @@ export default {
|
|
213
221
|
return {
|
214
222
|
show: true,
|
215
223
|
type: "text",
|
216
|
-
showLabel:
|
224
|
+
showLabel: false,
|
225
|
+
required: true,
|
217
226
|
labelText: "Where do you like to search?",
|
218
|
-
placeholder: "
|
227
|
+
placeholder: "Enter city, zip, country"
|
219
228
|
}
|
220
229
|
}
|
221
230
|
},
|
@@ -227,9 +236,14 @@ export default {
|
|
227
236
|
default() {
|
228
237
|
return {
|
229
238
|
show: true,
|
230
|
-
showLabel:
|
239
|
+
showLabel: false,
|
240
|
+
required: false,
|
231
241
|
labelText: "Radius",
|
232
242
|
selectOptions: [
|
243
|
+
{
|
244
|
+
text: "None",
|
245
|
+
value: 0
|
246
|
+
},
|
233
247
|
{
|
234
248
|
text: "5 Km",
|
235
249
|
value: 5
|
@@ -310,6 +324,13 @@ export default {
|
|
310
324
|
set(value) {
|
311
325
|
this.$emit("update:modelValueSearchFilters", value)
|
312
326
|
}
|
327
|
+
},
|
328
|
+
buttonSearchDisabled() {
|
329
|
+
const validInput1 = !this.cmdFormElementInput1.required || this.searchValue1.trim()
|
330
|
+
const validInput2 = !this.cmdFormElementInput2.show || !this.cmdFormElementInput2.required || this.searchValue2.trim()
|
331
|
+
const validInputRadius = !this.cmdFormElementRadius.show || !this.cmdFormElementRadius.required || this.radius
|
332
|
+
|
333
|
+
return !(validInput1 && validInput2 && validInputRadius)
|
313
334
|
}
|
314
335
|
},
|
315
336
|
methods: {
|
@@ -4,6 +4,7 @@
|
|
4
4
|
v-if="showSystemMessage"
|
5
5
|
:class="['cmd-system-message', 'system-message', 'flex-container', 'vertical', { 'full-width': fullWidth }, validationStatus]"
|
6
6
|
:role="validationStatus === 'error' ? 'alert' : 'dialog'"
|
7
|
+
:aria-labelledby="htmlId"
|
7
8
|
>
|
8
9
|
<!-- begin close-icon -->
|
9
10
|
<a
|
@@ -21,6 +22,7 @@
|
|
21
22
|
:iconClass="iconMessage.iconClass"
|
22
23
|
:headlineText="systemMessage"
|
23
24
|
:headlineLevel="messageHeadlineLevel"
|
25
|
+
:id="htmlId"
|
24
26
|
/>
|
25
27
|
<!-- end cmd-headline -->
|
26
28
|
|
@@ -32,11 +34,15 @@
|
|
32
34
|
</template>
|
33
35
|
|
34
36
|
<script>
|
37
|
+
// import mixins
|
38
|
+
import Identifier from "../mixins/Identifier"
|
39
|
+
|
35
40
|
// import components
|
36
41
|
import CmdHeadline from "./CmdHeadline"
|
37
42
|
|
38
43
|
export default {
|
39
44
|
name: "CmdSystemMessage",
|
45
|
+
mixins: [Identifier],
|
40
46
|
components: {
|
41
47
|
CmdHeadline
|
42
48
|
},
|
@@ -3,7 +3,7 @@
|
|
3
3
|
<ul :class="{'stretch-tabs' : stretchTabs}" role="tablist">
|
4
4
|
<li :class="{active : showTab === index}" v-for="(tab, index) in tabs" :key="index" role="tab">
|
5
5
|
<a @click.prevent="setActiveTab(index)" :title="!tab.name ? tab.tooltip : false">
|
6
|
-
<span v-if="tab.iconClass"
|
6
|
+
<span v-if="tab.iconClass" :class="tab.iconClass"></span>
|
7
7
|
<span v-if="tab.name">{{ tab.name }}</span>
|
8
8
|
</a>
|
9
9
|
</li>
|
@@ -108,21 +108,21 @@ export default {
|
|
108
108
|
> li {
|
109
109
|
z-index: 10;
|
110
110
|
margin-left: 0;
|
111
|
-
border-bottom: 0;
|
112
111
|
border-top-left-radius: var(--border-radius);
|
113
112
|
border-top-right-radius: var(--border-radius);
|
114
113
|
list-style-type: none;
|
115
114
|
background: var(--color-scheme-background-color);
|
116
115
|
border: var(--default-border);
|
116
|
+
border-bottom: 0;
|
117
117
|
|
118
118
|
&.active {
|
119
|
-
border-bottom: 0;
|
120
119
|
border-color: var(--primary-color);
|
121
|
-
top: .1rem;
|
122
120
|
}
|
123
121
|
|
124
122
|
a {
|
125
|
-
display:
|
123
|
+
display: flex;
|
124
|
+
align-items: center;
|
125
|
+
justify-content: center;
|
126
126
|
padding: var(--default-padding);
|
127
127
|
color: var(--color-scheme-text-color);
|
128
128
|
border-top-left-radius: var(--border-radius);
|
@@ -10,7 +10,7 @@
|
|
10
10
|
<!-- begin list of images to slide -->
|
11
11
|
<transition-group name="slide" tag="ul">
|
12
12
|
<li v-for="(image, index) in thumbnails" :key="image.imgId" :class="{'active' : imgIndex === index}">
|
13
|
-
<a href="#" @click.prevent="showFancyBox(index)">
|
13
|
+
<a href="#" @click.prevent="showFancyBox(index)" :title="getMessage('cmdthumbnailscroller.tooltip.open_large_image')">
|
14
14
|
<figure>
|
15
15
|
<figcaption v-if="figcaption.show && figcaption.position === 'above-image' && image.figcaption.length">{{ image.figcaption }}</figcaption>
|
16
16
|
<img :src="image.srcImageSmall" :alt="image.alt"/>
|
@@ -31,6 +31,10 @@
|
|
31
31
|
</template>
|
32
32
|
|
33
33
|
<script>
|
34
|
+
// import mixins
|
35
|
+
import I18n from "../mixins/I18n"
|
36
|
+
import DefaultMessageProperties from "../mixins/CmdThumbnailScroller/DefaultMessageProperties"
|
37
|
+
|
34
38
|
// import components
|
35
39
|
import CmdSlideButton from "./CmdSlideButton.vue"
|
36
40
|
|
@@ -42,6 +46,10 @@ export default {
|
|
42
46
|
components: {
|
43
47
|
CmdSlideButton
|
44
48
|
},
|
49
|
+
mixins: [
|
50
|
+
I18n,
|
51
|
+
DefaultMessageProperties
|
52
|
+
],
|
45
53
|
data() {
|
46
54
|
return {
|
47
55
|
thumbnails: []
|
@@ -1,5 +1,5 @@
|
|
1
1
|
<template>
|
2
|
-
<div v-if="tooltipVisibility" :class="['cmd-tooltip', status]" ref="tooltip"
|
2
|
+
<div v-if="tooltipVisibility" :class="['cmd-tooltip', status]" ref="tooltip">
|
3
3
|
<div v-if="cmdHeadline || iconClose.show" class="headline-wrapper">
|
4
4
|
<!-- begin CmdHeadline -->
|
5
5
|
<CmdHeadline
|
@@ -7,15 +7,6 @@
|
|
7
7
|
:relatedId="relatedId"
|
8
8
|
:toggle-visibility-by-click="true">
|
9
9
|
|
10
|
-
<!-- begin CmdSystemMessage -->
|
11
|
-
<CmdSystemMessage
|
12
|
-
v-if="cmdListOfRequirements?.inputAttributes?.required && validationMessage"
|
13
|
-
:systemMessage="validationMessage"
|
14
|
-
:validation-status="validationStatus"
|
15
|
-
:iconClose="{show: false}"
|
16
|
-
/>
|
17
|
-
<!-- end CmdSystemMessage -->
|
18
|
-
|
19
10
|
<!-- begin CmdListOfRequirements -->
|
20
11
|
<CmdListOfRequirements
|
21
12
|
v-if="cmdListOfRequirements.showRequirements"
|
@@ -35,14 +26,12 @@
|
|
35
26
|
<script>
|
36
27
|
// import components
|
37
28
|
import CmdListOfRequirements from "./CmdListOfRequirements"
|
38
|
-
import CmdSystemMessage from "./CmdSystemMessage"
|
39
29
|
import CmdTooltip from "./CmdTooltip"
|
40
30
|
|
41
31
|
export default {
|
42
32
|
name: "CmdTooltipForInputElements",
|
43
33
|
components: {
|
44
34
|
CmdListOfRequirements,
|
45
|
-
CmdSystemMessage,
|
46
35
|
CmdTooltip
|
47
36
|
},
|
48
37
|
props: {
|
@@ -54,19 +43,12 @@ export default {
|
|
54
43
|
default: ""
|
55
44
|
},
|
56
45
|
/**
|
57
|
-
* validation-status for
|
46
|
+
* validation-status for CmdTooltip-component
|
58
47
|
*/
|
59
48
|
validationStatus: {
|
60
49
|
type: String,
|
61
50
|
default: ""
|
62
51
|
},
|
63
|
-
/**
|
64
|
-
* validation-message for CmdSystemMessage-component
|
65
|
-
*/
|
66
|
-
validationMessage: {
|
67
|
-
type: String,
|
68
|
-
default: ""
|
69
|
-
},
|
70
52
|
/**
|
71
53
|
* properties for CmdListOfRequirements-component
|
72
54
|
*/
|
@@ -4,7 +4,7 @@
|
|
4
4
|
"value for v-model (modelValue is default name in vue 3)"
|
5
5
|
]
|
6
6
|
},
|
7
|
-
"
|
7
|
+
"textLegendLoginForm": {
|
8
8
|
"comments": [
|
9
9
|
"text used as legend for login-fieldset"
|
10
10
|
],
|
@@ -19,9 +19,9 @@
|
|
19
19
|
"toggle legend visibility"
|
20
20
|
]
|
21
21
|
},
|
22
|
-
"
|
22
|
+
"textLegendForgotLoginForm": {
|
23
23
|
"comments": [
|
24
|
-
"legend for
|
24
|
+
"legend for forgot-login-fieldset"
|
25
25
|
],
|
26
26
|
"annotations": {
|
27
27
|
"requiredForAccessibility": [
|
@@ -0,0 +1,42 @@
|
|
1
|
+
{
|
2
|
+
"modelValue": {
|
3
|
+
"comments": [
|
4
|
+
"set value for v-model (must be named modelValue in vue3 if default v-model should be used)"
|
5
|
+
]
|
6
|
+
},
|
7
|
+
"buttonType": {
|
8
|
+
"comments": [
|
9
|
+
"set value for v-model (must be named modelValue in vue3 if default v-model should be used)"
|
10
|
+
]
|
11
|
+
},
|
12
|
+
"textLegend": {
|
13
|
+
"comments": [
|
14
|
+
"text used as legend for login-fieldset"
|
15
|
+
],
|
16
|
+
"annotations": {
|
17
|
+
"requiredForAccessibility": [
|
18
|
+
"true"
|
19
|
+
]
|
20
|
+
}
|
21
|
+
},
|
22
|
+
"showLegend": {
|
23
|
+
"comments": [
|
24
|
+
"toggle legend visibility"
|
25
|
+
]
|
26
|
+
},
|
27
|
+
"cmdInputGroup": {
|
28
|
+
"comments": [
|
29
|
+
"properties for CmdInputGroup-component"
|
30
|
+
]
|
31
|
+
},
|
32
|
+
"cmdFormElementEmail": {
|
33
|
+
"comments": [
|
34
|
+
"properties for CmdFormElement-component for email-field"
|
35
|
+
]
|
36
|
+
},
|
37
|
+
"cmdFormElementSubmit": {
|
38
|
+
"comments": [
|
39
|
+
"properties for CmdFormElement-component for submit-button"
|
40
|
+
]
|
41
|
+
}
|
42
|
+
}
|
@@ -1,4 +1,9 @@
|
|
1
1
|
{
|
2
|
+
"modelValue": {
|
3
|
+
"comments": [
|
4
|
+
"set default v-model (must be named modelValue in Vue3)"
|
5
|
+
]
|
6
|
+
},
|
2
7
|
"align": {
|
3
8
|
"comments": [
|
4
9
|
"set horizontal alignment"
|
@@ -30,5 +35,24 @@
|
|
30
35
|
"comments": [
|
31
36
|
"activate if page to share is not given by json-data"
|
32
37
|
]
|
38
|
+
},
|
39
|
+
"userMustAcceptDataPrivacy": {
|
40
|
+
"comments": [
|
41
|
+
"toggle if user has to accept that anonymous data will be send while sharing"
|
42
|
+
]
|
43
|
+
},
|
44
|
+
"tooltipAcceptDataPrivacy": {
|
45
|
+
"comments": [
|
46
|
+
"tooltip shown on hovering disabled buttons",
|
47
|
+
"",
|
48
|
+
"userMustAcceptDataPrivacy-property must be activated"
|
49
|
+
]
|
50
|
+
},
|
51
|
+
"cmdFormElement": {
|
52
|
+
"comments": [
|
53
|
+
"properties for cmdFormElement",
|
54
|
+
"",
|
55
|
+
"userMustAcceptDataPrivacy-property must be activated"
|
56
|
+
]
|
33
57
|
}
|
34
58
|
}
|
@@ -0,0 +1,79 @@
|
|
1
|
+
{
|
2
|
+
"modelValueInput1": {
|
3
|
+
"comments": [
|
4
|
+
"custom modelValue for first input-field"
|
5
|
+
]
|
6
|
+
},
|
7
|
+
"modelValueInput2": {
|
8
|
+
"comments": [
|
9
|
+
"custom modelValue for second input-field"
|
10
|
+
]
|
11
|
+
},
|
12
|
+
"modelValueRadius": {
|
13
|
+
"comments": [
|
14
|
+
"custom modelValue for radius"
|
15
|
+
]
|
16
|
+
},
|
17
|
+
"modelValueSearchFilters": {
|
18
|
+
"comments": [
|
19
|
+
"custom modelValue for search-filters"
|
20
|
+
]
|
21
|
+
},
|
22
|
+
"useFilters": {
|
23
|
+
"comments": [
|
24
|
+
"toggle use of filters (must configured)"
|
25
|
+
]
|
26
|
+
},
|
27
|
+
"textLegend": {
|
28
|
+
"comments": [
|
29
|
+
"text for legend"
|
30
|
+
],
|
31
|
+
"annotations": {
|
32
|
+
"requiredForAccessibility": [
|
33
|
+
"true"
|
34
|
+
]
|
35
|
+
}
|
36
|
+
},
|
37
|
+
"showLegend": {
|
38
|
+
"comments": [
|
39
|
+
"toggle legend visibility",
|
40
|
+
"",
|
41
|
+
"textLegend must be set"
|
42
|
+
]
|
43
|
+
},
|
44
|
+
"results": {
|
45
|
+
"comments": [
|
46
|
+
"send search result from outside to display inside this component"
|
47
|
+
]
|
48
|
+
},
|
49
|
+
"cmdHeadline": {
|
50
|
+
"comments": [
|
51
|
+
"properties for CmdHeadline-component"
|
52
|
+
]
|
53
|
+
},
|
54
|
+
"cmdFormElementInput1": {
|
55
|
+
"comments": [
|
56
|
+
"properties for CmdFormElement-component first search-field"
|
57
|
+
]
|
58
|
+
},
|
59
|
+
"cmdFormElementInput2": {
|
60
|
+
"comments": [
|
61
|
+
"properties for CmdFormElement-component for second search-field"
|
62
|
+
]
|
63
|
+
},
|
64
|
+
"cmdFormElementRadius": {
|
65
|
+
"comments": [
|
66
|
+
"properties for CmdFormElement-component for radius"
|
67
|
+
]
|
68
|
+
},
|
69
|
+
"cmdFormElementSearchButton": {
|
70
|
+
"comments": [
|
71
|
+
"properties for CmdFormElement-component for search-button"
|
72
|
+
]
|
73
|
+
},
|
74
|
+
"cmdFakeSelect": {
|
75
|
+
"comments": [
|
76
|
+
"properties for CmdFakeSelect-component for filters"
|
77
|
+
]
|
78
|
+
}
|
79
|
+
}
|