comand-component-library 4.0.95 → 4.0.97

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": "comand-component-library",
3
- "version": "4.0.95",
3
+ "version": "4.0.97",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "license": "GPL-3.0-only",
@@ -1418,6 +1418,18 @@
1418
1418
  ref="CmdHeadline"
1419
1419
  v-bind="cmdHeadlineSettingsData"
1420
1420
  />
1421
+ <CmdHeadline
1422
+ ref="CmdHeadline"
1423
+ headlineLevel="3"
1424
+ headlineText="Headline text<br /> with html given by property"
1425
+ />
1426
+ <CmdHeadline
1427
+ ref="CmdHeadline"
1428
+ headlineLevel="3"
1429
+ >
1430
+ Headline text<br /> with html given by slot
1431
+ </CmdHeadline>
1432
+
1421
1433
  </CmdWidthLimitationWrapper>
1422
1434
  <!-- end headlines ------------------------------------------------------------------------------------------------------------------------------------------------------->
1423
1435
 
@@ -1646,6 +1658,15 @@
1646
1658
  v-bind="cmdOpeningHoursSettingsData"
1647
1659
  :openingHours="openingHoursData"
1648
1660
  :checkInterval="0"
1661
+ abbreviationTextAm="h"
1662
+ abbreviationTextPm="h"
1663
+ />
1664
+ <CmdOpeningHours
1665
+ ref="CmdOpeningHours"
1666
+ v-bind="cmdOpeningHoursSettingsData"
1667
+ :openingHours="openingHoursData"
1668
+ :checkInterval="0"
1669
+ :use24HoursFormat="false"
1649
1670
  />
1650
1671
  </CmdWidthLimitationWrapper>
1651
1672
  <!-- end opening-hours ------------------------------------------------------------------------------------------------------------------------------------------------------->
@@ -6,7 +6,7 @@
6
6
  <template v-if="preHeadlineText">
7
7
  <component v-if="headlineText" :is="headlineTag">
8
8
  <!-- begin CmdIcon -->
9
- <CmdIcon v-if="cmdIcon" v-bind="cmdIcon" />
9
+ <CmdIcon v-if="cmdIcon" v-bind="cmdIcon"/>
10
10
  <!-- end CmdIcon -->
11
11
 
12
12
  <span class="pre-headline-text-wrapper">
@@ -14,11 +14,17 @@
14
14
  <span class="pre-headline-text" v-html="preHeadlineText"></span>
15
15
  <!-- end pre-headline-text -->
16
16
 
17
- <span>
17
+ <!-- begin default headline-text without slot -->
18
+ <span v-if="headlineText" v-html="headlineText"></span>
19
+ <!-- end default headline-text without slot -->
20
+
21
+ <!-- begin headline-text with slot -->
22
+ <span v-else>
18
23
  <!-- begin slot -->
19
- <slot>{{ headlineText }}</slot>
20
- <!-- end slot -->
24
+ <slot></slot>
25
+ <!-- end slot -->
21
26
  </span>
27
+ <!-- end headline-text with slot -->
22
28
  </span>
23
29
  </component>
24
30
  </template>
@@ -27,14 +33,20 @@
27
33
  <!-- begin headline without pre-headline-text -->
28
34
  <component v-else :is="headlineTag">
29
35
  <!-- begin CmdIcon -->
30
- <CmdIcon v-if="cmdIcon" v-bind="cmdIcon" />
36
+ <CmdIcon v-if="cmdIcon" v-bind="cmdIcon"/>
31
37
  <!-- end CmdIcon -->
32
38
 
33
- <span>
39
+ <!-- begin default headline-text without slot -->
40
+ <span v-if="headlineText" v-html="headlineText"></span>
41
+ <!-- end default headline-text without slot -->
42
+
43
+ <!-- begin headline-text with slot -->
44
+ <span v-else>
34
45
  <!-- begin slot -->
35
- <slot>{{ headlineText }}</slot>
46
+ <slot></slot>
36
47
  <!-- end slot -->
37
48
  </span>
49
+ <!-- end headline-text with slot -->
38
50
  </component>
39
51
  <!-- end headline without pre-headline-text -->
40
52
  </div>
@@ -67,15 +79,15 @@
67
79
  <!-- end CmdFormElement -->
68
80
 
69
81
  <template v-else-if="headlineText"
70
- :class="['cmd-headline', {'has-pre-headline-text': preHeadlineText, 'has-icon': cmdIcon?.iconClass}, headlineTextAlign]">
82
+ :class="['cmd-headline', {'has-pre-headline-text': preHeadlineText, 'has-icon': cmdIcon?.iconClass}, headlineTextAlign]">
71
83
  <!-- begin CmdIcon -->
72
- <CmdIcon v-if="cmdIcon" v-bind="cmdIcon" />
84
+ <CmdIcon v-if="cmdIcon" v-bind="cmdIcon"/>
73
85
  <!-- end CmdIcon -->
74
86
 
75
87
  <template v-if="preHeadlineText">
76
88
  <component v-if="headlineText" :is="headlineTag">
77
89
  <!-- begin CmdIcon -->
78
- <CmdIcon v-if="cmdIcon" v-bind="cmdIcon" />
90
+ <CmdIcon v-if="cmdIcon" v-bind="cmdIcon"/>
79
91
  <!-- end CmdIcon -->
80
92
 
81
93
  <!-- begin pre-headline-text -->
@@ -49,6 +49,7 @@
49
49
  :separator="separator"
50
50
  :abbreviationTextAm="abbreviationTextAm"
51
51
  :abbreviationTextPm="abbreviationTextPm"
52
+ :use24HoursFormat="use24HoursFormat"
52
53
  />
53
54
  </dl>
54
55
  <!-- end default view -->
@@ -78,6 +79,7 @@
78
79
  :separator="separator"
79
80
  :abbreviationTextAm="abbreviationTextAm"
80
81
  :abbreviationTextPm="abbreviationTextPm"
82
+ :use24HoursFormat="use24HoursFormat"
81
83
  />
82
84
  </dl>
83
85
  </EditComponentWrapper>
@@ -257,6 +259,13 @@ export default {
257
259
  type: Boolean,
258
260
  default: true
259
261
  },
262
+ /**
263
+ * toggle 24- and 12-hours format
264
+ */
265
+ use24HoursFormat: {
266
+ type: Boolean,
267
+ default: true
268
+ },
260
269
  /**
261
270
  * properties for CmdLink-component
262
271
  */
@@ -126,7 +126,7 @@
126
126
  import EditMode from "../mixins/EditMode.vue"
127
127
  import {updateHandlerProvider} from "../utils/editmode.js"
128
128
 
129
- function timeFormatting(separator, suffix1, suffix2, hoursLeadingZero = true) {
129
+ function timeFormatting(separator, suffix1, suffix2, hoursLeadingZero = true, use24HoursFormat = true) {
130
130
  function addLeadingZero(time, addLeadingZero) {
131
131
  if (addLeadingZero && time < 10) {
132
132
  return "0" + time
@@ -139,7 +139,9 @@ function timeFormatting(separator, suffix1, suffix2, hoursLeadingZero = true) {
139
139
  let hour12 = hour
140
140
  let currentSuffix = suffix1
141
141
  if (hour12 > 12) {
142
- hour12 -= 12
142
+ if(!use24HoursFormat) {
143
+ hour12 -= 12
144
+ }
143
145
  currentSuffix = suffix2
144
146
  }
145
147
  return addLeadingZero(hour12, hoursLeadingZero) + separator + addLeadingZero(minute, true) + currentSuffix
@@ -157,6 +159,13 @@ export default {
157
159
  }
158
160
  },
159
161
  props: {
162
+ /**
163
+ * toggle 24- and 12-hours format
164
+ */
165
+ use24HoursFormat: {
166
+ type: Boolean,
167
+ required: false
168
+ },
160
169
  /**
161
170
  * list of opening-hours
162
171
  */
@@ -202,7 +211,7 @@ export default {
202
211
  return this.timeFormatter(time.hours, time.mins)
203
212
  }
204
213
 
205
- return timeFormatting(":", " " + this.abbreviationTextAm, " " + this.abbreviationTextPm, false)(time.hours, time.mins)
214
+ return timeFormatting(":", " " + this.abbreviationTextAm, " " + this.abbreviationTextPm, false, this.use24HoursFormat)(time.hours, time.mins)
206
215
  },
207
216
  updateHandlerProvider() {
208
217
  const data = this.editableDay
@@ -228,7 +237,7 @@ export default {
228
237
  watch: {
229
238
  day: {
230
239
  handler() {
231
- const timeFormatter = timeFormatting(":", "", "", true)
240
+ const timeFormatter = timeFormatting(":", "", "", true, this.use24HoursFormat)
232
241
  this.editableDay = {
233
242
  day: this.day.day,
234
243
  amFrom: timeFormatter(this.day.am.fromTime.hours, this.day.am.fromTime.mins),
@@ -44,7 +44,7 @@
44
44
  },
45
45
  "collapsible": {
46
46
  "comments": [
47
- "activate if box should be collapsible"
47
+ "activate2 if box should be collapsible"
48
48
  ]
49
49
  },
50
50
  "cutoffTextLines": {
@@ -1,5 +1,5 @@
1
1
  {
2
- "link": {
2
+ "cmdLink": {
3
3
  "comments": [
4
4
  "set a link to a detail page"
5
5
  ]
@@ -19,18 +19,23 @@
19
19
  ]
20
20
  }
21
21
  },
22
+ "editModeContextData": {
23
+ "comments": [
24
+ "data for edit-mode"
25
+ ]
26
+ },
22
27
  "htmlContent": {
23
28
  "comments": [
24
29
  "define html-content for box-body"
25
30
  ]
26
31
  },
27
- "toggle orientation for content": {
32
+ "orientation": {
28
33
  "comments": [
29
- "define html-content for box-body"
34
+ "set orientation for inner-content"
30
35
  ],
31
36
  "annotations": {
32
37
  "allowedValues": [
33
- "horizontal, vertical"
38
+ "vertical, horizontal"
34
39
  ]
35
40
  }
36
41
  },
@@ -4,6 +4,11 @@
4
4
  "properties for CmdHeadline-component"
5
5
  ]
6
6
  },
7
+ "activeItemIndex": {
8
+ "comments": [
9
+ "set active (highlighted) item"
10
+ ]
11
+ },
7
12
  "contentType": {
8
13
  "comments": [
9
14
  "define content Type"