comand-component-library 4.3.23 → 4.3.25

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.
Files changed (22) hide show
  1. package/dist/comand-component-library.css +1 -1
  2. package/dist/comand-component-library.js +4765 -4458
  3. package/package.json +2 -2
  4. package/src/ComponentLibrary.vue +55 -13
  5. package/src/assets/data/footnote.json +2 -2
  6. package/src/assets/data/form-elements.json +1 -1
  7. package/src/assets/data/listOfComponents.json +1 -0
  8. package/src/assets/data/site-wrapper.json +176 -0
  9. package/src/assets/styles/component-library-global-styles.scss +0 -10
  10. package/src/componentSettingsDataAndControls.vue +8 -0
  11. package/src/components/CmdCookieDisclaimer.vue +40 -7
  12. package/src/components/CmdLink.vue +2 -3
  13. package/src/components/CmdList.vue +3 -5
  14. package/src/components/CmdPageFooter.vue +34 -48
  15. package/src/components/CmdSiteFooter.vue +12 -3
  16. package/src/components/CmdSiteHeader.vue +45 -53
  17. package/src/components/CmdSiteWrapper.vue +339 -0
  18. package/src/components/CmdTooltip.vue +1 -1
  19. package/src/components/CmdWidthLimitationWrapper.vue +11 -14
  20. package/src/index.js +1 -0
  21. package/src/main.js +2 -1
  22. package/src/mixins/CmdCookieDisclaimer/DefaultMessageProperties.js +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "comand-component-library",
3
- "version": "4.3.23",
3
+ "version": "4.3.25",
4
4
  "license": "GPL-3.0-only",
5
5
  "author": "CoManD-UI",
6
6
  "private": false,
@@ -28,7 +28,7 @@
28
28
  "./us-cities.json": "./src/assets/lists-of-data/us-cities.json"
29
29
  },
30
30
  "dependencies": {
31
- "comand-frontend-framework": "^4.3.43",
31
+ "comand-frontend-framework": "^4.3.45",
32
32
  "comand-ui-iconfonts": "^1.0.21",
33
33
  "vue": "^3.5.25",
34
34
  "vue-router": "^4.0.12"
package/src/ComponentLibrary.vue CHANGED
@@ -1,7 +1,7 @@
1
1
  <!--suppress HtmlUnknownTarget, NpmUsedModulesInstalled, JSUnresolvedVariable -->
2
2
  <template>
3
- <!-- begin .page-wrapper -->
4
- <div class="page-wrapper" :id="templateId" v-fancybox>
3
+ <!-- begin .site-wrapper -->
4
+ <div class="site-wrapper" :id="templateId" v-fancybox>
5
5
  <a id="anchor-back-to-top"></a>
6
6
  <CmdSidebar v-if="showLeftSidebar"
7
7
  :cmdHeadline="{ headlineText: 'Site Settings', headlineLevel: 3, textAlign: 'center' }"
@@ -616,7 +616,7 @@
616
616
  <!-- end advanced form elements --------------------------------------------------------------------------------------------->
617
617
 
618
618
  <!-- begin back to top button --------------------------------------------------------------------------------------------->
619
- <CmdBackToTopButton href="#anchor-back-to-top" scroll-container=".page-wrapper" />
619
+ <CmdBackToTopButton href="#anchor-back-to-top" scroll-container=".site-wrapper" />
620
620
  <!-- end back to top button --------------------------------------------------------------------------------------------->
621
621
 
622
622
  <!-- begin bank account data --------------------------------------------------------------------------------------------->
@@ -1187,7 +1187,7 @@
1187
1187
  @click.prevent="openSettingsSidebar('CmdList')"></a>
1188
1188
  </h2>
1189
1189
  <CmdList :cmdHeadline="{ headlineText: 'List of links', headlineLevel: 3 }" ref="CmdList"
1190
- v-bind="cmdListSettingsData" :items="listData" listContentType="links" @click="cmdLinkOutput" />
1190
+ v-bind="listSettingsData" :items="listData" listContentType="links" @click="cmdLinkOutput" />
1191
1191
  <dl class="output">
1192
1192
  <dt>Event:</dt>
1193
1193
  <dd>{{ outputCmdLink?.event?.originalEvent }}</dd>
@@ -1293,12 +1293,10 @@
1293
1293
  <CmdMultistepFormWrapper :requiredPages="[1, 2]" :defaultInputValues="multistepFormDefaultInputValues">
1294
1294
 
1295
1295
  <template v-slot:page-1="props">
1296
- multistepFormDefaultInputValues: {{ multistepFormDefaultInputValues }}
1297
1296
  <h3>Page 1 - all fields required</h3>
1298
1297
  <CmdForm :formElements="multistepFormWrapperPage1Data" :useSlot="false"
1299
1298
  @validation-status-change="toggleSystemMessage($event, props)" :submitButton="{ show: false }"
1300
1299
  :modelValue="props.formDataForPage" @update:modelValue="props.updateFormDataForPage" />
1301
- props.formDataForPage: {{ props.formDataForPage }}
1302
1300
  <a href="#" @click.prevent="props.setErrorOnPage('This is an error!')">Set Error</a><br />
1303
1301
  <a href="#" @click.prevent="props.removeErrorOnPage">Remove Error</a>
1304
1302
  </template>
@@ -1317,7 +1315,6 @@
1317
1315
  @update:modelValue="setValue($event, 'page-2-email', props)"
1318
1316
  @validation-status-change="setValidationStatus($event, 'page-2-email', props)" />
1319
1317
  </CmdForm>
1320
- props.formDataForPage: {{ props.formDataForPage }}
1321
1318
  <a href="#" @click.prevent="props.setErrorOnPage('This is an error!')">Set Error</a>
1322
1319
  </template>
1323
1320
  <template v-slot:page-3="props">
@@ -1335,7 +1332,6 @@
1335
1332
  <CmdFormElement element="input" type="text" labelText="City:" name="city" id="city"
1336
1333
  v-model="props.formDataForPage.city" />
1337
1334
  </div>
1338
- props.formDataForPage: {{ props.formDataForPage }}
1339
1335
  </CmdForm>
1340
1336
  </template>
1341
1337
  <template v-slot:page-last="props">
@@ -1355,7 +1351,6 @@
1355
1351
  <CmdSystemMessage systemMessage="Your request was send successfully!"
1356
1352
  validationStatus="success" :iconClose="{ show: false }" />
1357
1353
  <p>A copy with all submitted data was send to you.</p>
1358
- props.formDataForPage: {{ props.formDataForPage }}
1359
1354
  </template>
1360
1355
  </template>
1361
1356
  </CmdMultistepFormWrapper>
@@ -1404,7 +1399,6 @@
1404
1399
  iconClass: "icon-chevron-one-stripe-left",
1405
1400
  tooltip: "To previous page"
1406
1401
  }' text="Back" @click="props.setPrevPage" :disabled="props.disabledPrevLink" />
1407
- props.disabledPrevLink: {{ props.disabledPrevLink }}
1408
1402
  </div>
1409
1403
  </template>
1410
1404
  </CmdMultistepFormWrapper>
@@ -1506,10 +1500,11 @@
1506
1500
  </h2>
1507
1501
  <h3>Section with content provided by properties</h3>
1508
1502
  <CmdSection
1503
+ style="border: 1px dashed var(--color-medium-gray);"
1509
1504
  :cmdHeadline="{ headlineText: 'Headline for section provided by property', headlineLevel: 4 }"
1510
1505
  content="Content for section provided by property." />
1511
1506
  <h3>Section with content provided by slot</h3>
1512
- <CmdSection :useSlot="true">
1507
+ <CmdSection :useSlot="true" style="border: 1px dashed var(--color-medium-gray);">
1513
1508
  <h4>Headline for section provided by slot</h4>
1514
1509
  <p>Content for section provided by slot.</p>
1515
1510
  </CmdSection>
@@ -1524,9 +1519,12 @@
1524
1519
  <!-- begin site-footer --------------------------------------------------------------------------------------------------->
1525
1520
  <CmdWidthLimitationWrapper>
1526
1521
  <h2 class="headline-demopage" id="section-site-footer">Site Footer</h2>
1522
+ <h3>Site Footer with content provided by properties</h3>
1523
+ <CmdSiteFooter :cmdList="{items: listData}" />
1524
+ <h3>Site Footer with content provided by slot</h3>
1527
1525
  <CmdSiteFooter>
1528
1526
  <CmdLink linkType="href" ref="CmdLink" v-bind="cmdLinkSettingsData"
1529
- :icon="{ iconClass: 'icon-chevron-one-stripe-left', position: 'left', tooltip: 'Tooltip for hyperlink' }"
1527
+ :icon="{ iconClass: 'icon-chevron-one-stripe-right', position: 'left', tooltip: 'Tooltip for hyperlink' }"
1530
1528
  @click="cmdLinkOutput" />
1531
1529
  </CmdSiteFooter>
1532
1530
  </CmdWidthLimitationWrapper>
@@ -1561,6 +1559,48 @@
1561
1559
  </CmdWidthLimitationWrapper>
1562
1560
  <!-- end site-search --------------------------------------------------------------------------------------------------->
1563
1561
 
1562
+ <!-- begin site-wrapper --------------------------------------------------------------------------------------------------->
1563
+ <CmdWidthLimitationWrapper>
1564
+ <h2 class="headline-demopage" id="section-site-wrapper">
1565
+ <span>Site Wrapper</span>
1566
+ <a href="#" class="button small icon-cog" title="Open Component Settings"
1567
+ @click.prevent="openSettingsSidebar('CmdSiteWrapper')"></a>
1568
+ </h2>
1569
+ <h3>Site Wrapper with content provided by properties</h3>
1570
+ <CmdSiteWrapper
1571
+ class="demo-border"
1572
+ ref="CmdSiteWrapper"
1573
+ :pageContent="siteWrapperData.pageContent"
1574
+ :cmdSiteHeader="siteWrapperData.cmdSiteHeader"
1575
+ :cmdSiteFooter="siteWrapperData.cmdSiteFooter"
1576
+ />
1577
+ <h3>Site Wrapper with content (in three columns) provided by slot</h3>
1578
+ <CmdSiteWrapper class="demo-border">
1579
+ <template v-slot:topheader>
1580
+ <CmdList :items="listData" orientation="horizontal" align="right" />
1581
+ </template>
1582
+ <template v-slot:logo>
1583
+ <CmdCompanyLogo v-bind="companyLogoData" />
1584
+ </template>
1585
+ <template v-slot:left-column>
1586
+ Slot content for left column
1587
+ </template>
1588
+ <template v-slot:page-content>
1589
+ <div class="demo-border">
1590
+ <h2>Headline for page-content-slot</h2>
1591
+ <p>Content for page-content-slot</p>
1592
+ </div>
1593
+ </template>
1594
+ <template v-slot:right-column>
1595
+ Slot content for right column
1596
+ </template>
1597
+ <template v-slot:site-footer>
1598
+ Slot content for site-footer-slot
1599
+ </template>
1600
+ </CmdSiteWrapper>
1601
+ </CmdWidthLimitationWrapper>
1602
+ <!-- end site-wrapper --------------------------------------------------------------------------------------------------->
1603
+
1564
1604
  <!-- begin slideshow --------------------------------------------------------------------------------------------------->
1565
1605
  <CmdWidthLimitationWrapper>
1566
1606
  <h2 class="headline-demopage" id="section-slideshow">
@@ -1884,7 +1924,7 @@
1884
1924
  </template>
1885
1925
  </CmdSidebar>
1886
1926
  <!-- end component-settings-sidebar --------------------------------------------------------------------------------------------------->
1887
- </div><!-- end .page-wrapper -->
1927
+ </div><!-- end .site-wrapper -->
1888
1928
  </template>
1889
1929
 
1890
1930
  <script>
@@ -1919,6 +1959,7 @@ import multistepFormWrapperPage1Data from '@/assets/data/multistep-form-wrapper-
1919
1959
  import navigationData from '@/assets/data/main-navigation.json'
1920
1960
  import openingHoursData from '@/assets/data/opening-hours.json'
1921
1961
  import selectOptionsData from '@/assets/data/select-options.json'
1962
+ import siteWrapperData from '@/assets/data/site-wrapper.json'
1922
1963
  import slideshowData from '@/assets/data/slideshow.json'
1923
1964
  import smartSearchData from '@/assets/data/smart-search.json'
1924
1965
  import socialNetworksData from '@/assets/data/social-networks-page-by-json.json'
@@ -2136,6 +2177,7 @@ export default {
2136
2177
  navigationData,
2137
2178
  openingHoursData,
2138
2179
  selectOptionsData,
2180
+ siteWrapperData,
2139
2181
  slideshowData,
2140
2182
  smartSearchData,
2141
2183
  socialNetworksData,
package/src/assets/data/footnote.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "descriptionData": [
5
5
  "Footnotetext #1",
6
6
  "Footnotetext #2",
7
- "Footnotetext #3"
7
+ "<a href='#'>Footnotelink</a>"
8
8
  ]
9
9
  },
10
10
  {
@@ -12,7 +12,7 @@
12
12
  "descriptionData": [
13
13
  "Footnotetext #1",
14
14
  "Footnotetext #2",
15
- "Footnotetext #3"
15
+ "<a href='#'>Footnotelink</a>"
16
16
  ]
17
17
  }
18
18
  ]
package/src/assets/data/form-elements.json CHANGED
@@ -11,7 +11,7 @@
11
11
  "placeholder": "Placeholdertext",
12
12
  "required": false,
13
13
  "disabled": false,
14
- "scrollContainerForTooltip": ".page-wrapper"
14
+ "scrollContainerForTooltip": ".site-wrapper"
15
15
  },
16
16
  {
17
17
  "component": "flexContainer",
package/src/assets/data/listOfComponents.json CHANGED
@@ -38,6 +38,7 @@
38
38
  "SiteFooter",
39
39
  "SiteHeader",
40
40
  "SiteSearch",
41
+ "SiteWrapper",
41
42
  "Slideshow",
42
43
  "SmartSearch",
43
44
  "SocialNetworks",
package/src/assets/data/site-wrapper.json ADDED
@@ -0,0 +1,176 @@
1
+ {
2
+ "pageContent": "<div style='height: 100%;'>Main content provided by property</div>",
3
+ "cmdSiteHeader": {
4
+ "sticky": true,
5
+ "navigationInline": false,
6
+ "resizeHeaderOnScroll": false,
7
+ "scrollContainerToResizeHeader": ".site-wrapper",
8
+ "useGrid": true,
9
+ "cmdMainNavigation": {
10
+ "offcanvasPosition": "right",
11
+ "stretchMainItems": false,
12
+ "persistOnMobile": false,
13
+ "navigationEntries": [
14
+ {
15
+ "type": "href",
16
+ "text": "href 1",
17
+ "path": "#",
18
+ "iconClass": "icon-home"
19
+ },
20
+ {
21
+ "type": "href",
22
+ "text": "href 2",
23
+ "path": "",
24
+ "subentries": [
25
+ {
26
+ "type": "href",
27
+ "text": "href 2.1",
28
+ "path": "",
29
+ "subentries": [
30
+ {
31
+ "type": "href",
32
+ "text": "href 2.1.1",
33
+ "path": "#"
34
+ },
35
+ {
36
+ "type": "href",
37
+ "text": "href 2.1.2",
38
+ "path": "#"
39
+ },
40
+ {
41
+ "type": "href",
42
+ "text": "href 2.1.3",
43
+ "path": "#"
44
+ }
45
+ ]
46
+ },
47
+ {
48
+ "type": "href",
49
+ "text": "href 2.2",
50
+ "path": "#",
51
+ "subentries": []
52
+ }
53
+ ]
54
+ },
55
+ {
56
+ "type": "router",
57
+ "text": "router 1",
58
+ "path": "#"
59
+ },
60
+ {
61
+ "type": "router",
62
+ "text": "router 2",
63
+ "path": "#",
64
+ "subentries": [
65
+ {
66
+ "type": "router",
67
+ "text": "router 2.1",
68
+ "path": {
69
+ "name": "home"
70
+ }
71
+ },
72
+ {
73
+ "type": "router",
74
+ "text": "router 2.2",
75
+ "path": {
76
+ "name": "home"
77
+ }
78
+ }
79
+ ]
80
+ },
81
+ {
82
+ "type": "href",
83
+ "text": "CoManD-UI",
84
+ "path": "https://www.comand-ui.com",
85
+ "target": "comand-website"
86
+ }
87
+ ]
88
+ },
89
+ "cmdCompanyLogo": {
90
+ "link": {
91
+ "type": "href",
92
+ "path": "./",
93
+ "tooltip": "Tooltip"
94
+ },
95
+ "pathDefaultLogo": "/media/images/logos/logo.svg",
96
+ "pathDarkmodeLogo": "/media/images/logos/logo-darkmode.svg",
97
+ "altText": "Company Logo"
98
+ }
99
+ },
100
+ "cmdSiteFooter": {
101
+ "contentOrientation": "vertical",
102
+ "cmdList": {
103
+ "items": [
104
+ {
105
+ "icon": {
106
+ "iconClass": "icon-user-profile",
107
+ "tooltip": "Href with anchor"
108
+ },
109
+ "linkType": "href",
110
+ "text": "",
111
+ "path": "#anchor-back-to-top"
112
+ },
113
+ {
114
+ "linkType": "router",
115
+ "text": "Router",
116
+ "path": {
117
+ "path": "#"
118
+ }
119
+ },
120
+ {
121
+ "icon": {
122
+ "iconClass": "icon-home",
123
+ "tooltip": "Router with object for path"
124
+ },
125
+ "linkType": "router",
126
+ "text": "Router (+hash)",
127
+ "path": {
128
+ "path": "/",
129
+ "hash": "#anchor-back-to-top"
130
+ }
131
+ },
132
+ {
133
+ "icon": {
134
+ "iconClass": "icon-user-profile",
135
+ "tooltip": "Tooltip"
136
+ },
137
+ "linkType": "href",
138
+ "text": "Fancybox content",
139
+ "path": "/content/fancybox-content.html",
140
+ "fancybox": true,
141
+ "children": [
142
+ {
143
+ "icon": {
144
+ "iconClass": "icon-home",
145
+ "tooltip": "Tooltip"
146
+ },
147
+ "linkType": "href",
148
+ "text": "Link for child #1",
149
+ "path": "#"
150
+ },
151
+ {
152
+ "icon": {
153
+ "iconClass": "icon-globe",
154
+ "tooltip": "Tooltip"
155
+ },
156
+ "linkType": "href",
157
+ "text": "Link for child #2",
158
+ "path": "#"
159
+ }
160
+ ]
161
+ },
162
+ {
163
+ "icon": {
164
+ "iconClass": "icon-export",
165
+ "tooltip": "Tooltip"
166
+ },
167
+ "linkType": "href",
168
+ "text": "External link",
169
+ "path": "https://www.comand-ui.com",
170
+ "target": "_blank",
171
+ "tooltip": "Open CoManD-Website in new tab"
172
+ }
173
+ ]
174
+ }
175
+ }
176
+ }
package/src/assets/styles/component-library-global-styles.scss CHANGED
@@ -45,16 +45,6 @@ html {
45
45
 
46
46
  /* ---------------------------------------------- BEGIN COMPONENTS AND GLOBAL STYLES -------------------------------------------------- */
47
47
  /* begin styles for main structure --------------------------------------------------------------------------------------------------------------------------------------------------- */
48
- .page-wrapper {
49
- display: flex;
50
- flex-direction: column;
51
- scroll-snap-type: y mandatory;
52
- overflow-y: auto;
53
- height: 100dvh;
54
- scroll-behavior: smooth;
55
- scroll-padding-top: 11.7rem;
56
- }
57
-
58
48
  main {
59
49
  flex: 1 0 auto;
60
50
  }
package/src/componentSettingsDataAndControls.vue CHANGED
@@ -788,6 +788,14 @@ export default {
788
788
  }
789
789
  ],
790
790
  },
791
+ cmdSiteWrapperSettingsData: {
792
+ "cmdSiteHeader.show": {
793
+ show: true
794
+ },
795
+ "cmdSiteFooter.show": {
796
+ show: true
797
+ }
798
+ },
791
799
  cmdSiteSearchSettingsData: {
792
800
  useFilters: true,
793
801
  legend: {
package/src/components/CmdCookieDisclaimer.vue CHANGED
@@ -126,12 +126,14 @@
126
126
 
127
127
  <!-- begin button-wrapper for 'accept'-buttons -->
128
128
  <div class="button-wrapper align-center">
129
- <button type="button" @click="acceptCurrentCookies">
130
- <span>{{ getMessage('cookie_disclaimer.button.accept_current_settings') }}</span>
131
- </button>
132
- <button type="button" class="primary" @click="acceptAllCookies">
133
- <span>{{ getMessage('cookie_disclaimer.button.accept_all_cookies') }}</span>
134
- </button>
129
+ <CmdLink
130
+ v-bind="cmdLinkAcceptRequiredCookiesProperties"
131
+ @click="acceptRequiredCookies"
132
+ />
133
+ <CmdLink
134
+ v-bind="cmdLinkAcceptAllCookiesProperties"
135
+ @click="acceptAllCookies"
136
+ />
135
137
  </div>
136
138
  <!-- end button-wrapper for 'accept'-buttons -->
137
139
  </div>
@@ -144,6 +146,7 @@
144
146
  // import mixins
145
147
  import I18n from "../mixins/I18n"
146
148
  import DefaultMessageProperties from "../mixins/CmdCookieDisclaimer/DefaultMessageProperties"
149
+ import CmdLink from "./CmdLink.vue";
147
150
 
148
151
  export default {
149
152
  name: "CmdCookieDisclaimer",
@@ -218,9 +221,39 @@ export default {
218
221
  showPrivacyText: {
219
222
  type: Boolean,
220
223
  default: true
224
+ },
225
+ /**
226
+ * properties for CmdLink-compnent for "accept required cookies"-button
227
+ */
228
+ cmdLinkAcceptRequiredCookies: {
229
+ type: Object,
230
+ required: false
231
+ },
232
+ /**
233
+ * properties for CmdLink-compnent for "accept all cookies"-button
234
+ */
235
+ cmdLinkAcceptAllCookies: {
236
+ type: Object,
237
+ required: false
221
238
  }
222
239
  },
223
240
  computed: {
241
+ cmdLinkAcceptRequiredCookiesProperties() {
242
+ return {
243
+ linkType: "button",
244
+ highlightLevel: null,
245
+ text: this.getMessage("cookie_disclaimer.button.accept_required_cookies"),
246
+ ...this.cmdLinkAcceptRequiredCookies
247
+ }
248
+ },
249
+ cmdLinkAcceptAllCookiesProperties() {
250
+ return {
251
+ linkType: "button",
252
+ highlightLevel: "primary",
253
+ text: this.getMessage("cookie_disclaimer.button.accept_all_cookies"),
254
+ ...this.cmdLinkAcceptAllCookies
255
+ }
256
+ },
224
257
  acceptedCookies: {
225
258
  get() {
226
259
  const cookies = this.modelValue ? [...this.modelValue] : []
@@ -270,7 +303,7 @@ export default {
270
303
  this.openBoxes.splice(index, 1);
271
304
  }
272
305
  },
273
- acceptCurrentCookies() {
306
+ acceptRequiredCookies() {
274
307
  this.$emit("close-cookie-disclaimer", this.acceptedCookies)
275
308
  },
276
309
  acceptAllCookies() {
package/src/components/CmdLink.vue CHANGED
@@ -125,14 +125,13 @@ export default {
125
125
  },
126
126
  /**
127
127
  * set highlight-level for link/button
128
- *
129
- * @allowedValues: "none", "primary", "secondary", "tertiary"
128
+ * null"none", "primary", "secondary", "tertiary"
130
129
  */
131
130
  highlightLevel: {
132
131
  type: String,
133
132
  default: "primary",
134
133
  validator(value) {
135
- return value === "none" ||
134
+ return value === null||
136
135
  value === "primary" ||
137
136
  value === "secondary" ||
138
137
  value === "tertiary"
package/src/components/CmdList.vue CHANGED
@@ -92,23 +92,21 @@
92
92
  v-if="entry.descriptionTerm?.cmdIcon?.iconClass"
93
93
  v-bind="entry.descriptionTerm.cmdIcon"
94
94
  />
95
- <span v-if="entry.descriptionTerm?.text">{{ entry.descriptionTerm?.text }}</span>
95
+ <span v-if="entry.descriptionTerm?.text" v-html="entry.descriptionTerm?.text"></span>
96
96
  </dt>
97
97
  <dd>
98
98
  <CmdLink
99
99
  v-if="entry.descriptionData.cmdLink !== undefined"
100
100
  v-bind="entry.descriptionData.cmdLink">
101
101
  </CmdLink>
102
- <template v-else>
103
- {{ entry.descriptionData.text }}
104
- </template>
102
+ <span v-else v-html="entry.descriptionData.text"></span>
105
103
  </dd>
106
104
  <dt v-if="alignDescriptionTermRight">
107
105
  <CmdIcon
108
106
  v-if="entry.descriptionTerm?.cmdIcon?.iconClass"
109
107
  v-bind="entry.descriptionTerm.cmdIcon"
110
108
  />
111
- <span v-if="entry.descriptionTerm?.text">{{ entry.descriptionTerm?.text }}</span>
109
+ <span v-if="entry.descriptionTerm?.text" v-html="entry.descriptionTerm?.text"></span>
112
110
  </dt>
113
111
  </template>
114
112
  </dl>