comand-component-library 4.0.30 → 4.0.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "comand-component-library",
-  "version": "4.0.30",
+  "version": "4.0.31",
   "private": false,
   "type": "module",
   "license": "GPL-3.0-only",

package/src/components/CmdContainer.vue

@@ -1,8 +1,8 @@
 <template>
     <div class="cmd-container">
-        <div v-html="contentAboveSlot"></div>
+        <div v-if="contentAboveSlot" v-html="contentAboveSlot"></div>
         <slot></slot>
-        <div v-html="contentBelowSlot"></div>
+        <div v-if="contentBelowSlot" v-html="contentBelowSlot"></div>
     </div>
 </template>
 

package/src/components/CmdImage.vue

@@ -16,6 +16,7 @@
             <figure :class="['cmd-image flex-container no-gap vertical', textAlign]">
                 <!-- begin figcaption above image -->
                 <template v-if="figcaption?.show && figcaption?.position === 'top'">
+                    <!-- begin CmdFormElement -->
                     <CmdFormElement
                         v-if="slotProps.editing"
                         element="input"
@@ -25,7 +26,8 @@
                         labelText="Text figcaption"
                         v-model="editableFigcaptionText"
                     />
-                    <figcaption v-else-if="figcaption?.text">{{ figcaption?.text }}</figcaption>
+                    <!-- end CmdFormElement -->
+                    <figcaption v-else-if="figcaption?.text" v-html="figcaption?.text" />
                 </template>
                 <!-- end figcaption above image -->
 
@@ -62,6 +64,7 @@
 
                 <!-- begin figcaption below image -->
                 <template v-if="figcaption?.show && figcaption?.position !== 'top'">
+                    <!-- begin CmdFormElement -->
                     <CmdFormElement
                         v-if="slotProps.editing"
                         element="input"
@@ -73,12 +76,15 @@
                         v-model="editableFigcaptionText"
                         placeholder="figcaption"
                     />
-                    <figcaption v-else-if="figcaption?.text">{{ figcaption?.text }}</figcaption>
+                    <!-- end CmdFormElement -->
+                    <figcaption v-else-if="figcaption?.text" v-html="figcaption?.text" />
                 </template>
                 <!-- end figcaption below image -->
 
                 <!-- begin show placeholder if no image exists (and component is not edited) -->
-                <button v-if="!slotProps.editing && !imageSource" type="button" class="button confirm"
+                <button v-if="!slotProps.editing && !imageSource"
+                        type="button"
+                        class="button confirm"
                         @click="onAddItem">
                     <span class="icon-add"></span>
                     <span>Add new image</span>
@@ -112,7 +118,7 @@ export default {
             mediumMaxWidth: 1023,
             smallMaxWidth: 600,
             currentWindowWidth: window.innerWidth,
-            allowedFileExtensions: ["jpg", "jpeg", "png", "webp"],
+            allowedFileExtensions: ["gif", "jpg", "jpeg", "png", "webp", "svg"],
             uploadInitiated: false,
             allowDrop: false,
             showFigcaption: true,

package/src/index.js

@@ -22,6 +22,7 @@ export { default as CmdImage } from '@/components/CmdImage.vue'
 export { default as CmdImageGallery } from '@/components/CmdImageGallery.vue'
 export { default as CmdImageZoom } from '@/components/CmdImageZoom.vue'
 export { default as CmdInputGroup } from '@/components/CmdInputGroup.vue'
+export { default as CmdLink } from '@/components/CmdLink.vue'
 export { default as CmdListOfLinks } from '@/components/CmdListOfLinks.vue'
 export { default as CmdLoginForm } from '@/components/CmdLoginForm.vue'
 export { default as CmdMainNavigation } from '@/components/CmdMainNavigation.vue'