comand-component-library 3.1.77 → 3.1.78

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "comand-component-library",
-  "version": "3.1.77",
+  "version": "3.1.78",
   "private": false,
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/App.vue

@@ -844,13 +844,13 @@
             <h3>Product boxes</h3>
             <div class="grid-container-create-columns">
                 <div class="grid-small-item" v-for="(product, index) in boxProductData" :key="index">
-                    <CmdBox boxType="product" :product="product" :CmdHeadline="{headlineLevel: 4}"/>
+                    <CmdBox boxType="product" :product="product" :cmdHeadline="{headlineLevel: 4}"/>
                 </div>
             </div>
             <h3>User boxes</h3>
             <div class="grid-container-create-columns">
                 <div class="grid-small-item" v-for="(user, index) in boxUserData" :key="index">
-                    <CmdBox boxType="user" :user="user" :CmdHeadline="{headlineLevel: 4}"/>
+                    <CmdBox boxType="user" :user="user" :cmdHeadline="{headlineLevel: 4}"/>
                 </div>
             </div>
             <h3>Box Site Search</h3>
@@ -1106,7 +1106,7 @@
                            :uploadOptions="{url: 'http://localhost:8888'}"
             />
             <h3>Advanced mode</h3>
-            <CmdUploadForm :CmdHeadlineFieldset="{headlineText: 'Select files to upload', headlineLevel: 3}"
+            <CmdUploadForm :cmdHeadlineFieldset="{headlineText: 'Select files to upload', headlineLevel: 3}"
                            :enableDragAndDrop="true"
                            :allowedFileExtensions="['jpg', 'png']"
                            :allowMultipleFileUploads="true"
@@ -1120,18 +1120,18 @@
         <CmdSwitchLanguage :languages="languagesData" @click="doSomething"/>
         <div class="flex-container">
             <CmdListOfLinks :links="listOfLinksData"
-                            :CmdHeadline="{headlineText: 'List of links', headlineLevel: 6}"
+                            :cmdHeadline="{headlineText: 'List of links', headlineLevel: 6}"
             />
             <CmdOpeningHours :openingHours="openingHoursData"
                              :closed="true"
-                             :CmdHeadline="{headlineText: 'Opening hours', headlineLevel: 6}"
+                             :cmdHeadline="{headlineText: 'Opening hours', headlineLevel: 6}"
                              textOpenClosed="Closed right now!"
                              textHolidaysClosed="Closed on holidays"
                              textMiscInfo="Miscellaneous information"
             />
             <CmdAddressData :addressData="addressData"
                             :linkGoogleMaps="true"
-                            :CmdHeadline="{headlineText: 'Address data', headlineLevel: 6}"
+                            :cmdHeadline="{headlineText: 'Address data', headlineLevel: 6}"
             />
         </div>
     </CmdSiteFooter>

package/src/components/CmdAddressData.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="cmd-address-data vcard">
         <!-- begin CmdHeadline -->
-        <CmdHeadline v-if="CmdHeadline" v-bind="CmdHeadline" />
+        <CmdHeadline v-if="cmdHeadline" v-bind="cmdHeadline" />
         <!-- end CmdHeadline -->
 
         <!-- begin address-data in vCard microformat -->

package/src/components/CmdBankAccountData.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="cmd-bank-account-data">
         <!-- begin CmdHeadline -->
-        <CmdHeadline v-if="CmdHeadline" v-bind="CmdHeadline"/>
+        <CmdHeadline v-if="cmdHeadline" v-bind="cmdHeadline" />
         <!-- end CmdHeadline -->
 
         <!-- begin account data -->
@@ -90,6 +90,7 @@ export default {
 </script>
 
 <style lang="scss">
+/* begin cmd-bank-account-data ---------------------------------------------------------------------------------------- */
 .cmd-bank-account-data {
     dd.flex-container {
         gap: calc(var(--default-gap) / 2);
@@ -101,4 +102,5 @@ export default {
         }
     }
 }
+/* end cmd-bank-account-data ---------------------------------------------------------------------------------------- */
 </style>

package/src/components/CmdBox.vue

@@ -23,16 +23,17 @@
             <!-- begin header for collapsible -->
             <a v-if="collapsible" class="box-header" href="#" :title="open ? iconOpen.tooltip : iconClosed.tooltip" @click.prevent="toggleContentVisibility">
                 <!-- begin CmdHeadline -->
-                <CmdHeadline v-if="CmdHeadline?.headlineText" v-bind="CmdHeadline"/>
+                <CmdHeadline v-if="cmdHeadline?.headlineText" v-bind="cmdHeadline" />
                 <!-- end CmdHeadline -->
                 <span class="toggle-icon" :class="[open ? iconOpen.iconClass : iconClosed.iconClass]"></span>
             </a>
             <!-- end header for collapsible -->
 
             <!-- begin CmdHeadline -->
-            <CmdHeadline v-else-if="!collapsible && CmdHeadline?.headlineText"
-                               class="box-header"
-                               v-bind="CmdHeadline"
+            <CmdHeadline
+                v-else-if="!collapsible && cmdHeadline?.headlineText"
+                class="box-header"
+                v-bind="cmdHeadline"
             />
             <!-- end CmdHeadline -->
         </template>
@@ -68,9 +69,10 @@
                 <span>{{ product.discount }}</span>
             </div>
             <!-- begin CmdHeadline -->
-            <CmdHeadline v-if="CmdHeadline?.headlineText || product.name"
-                               v-bind="CmdHeadline || {}"
-                               :headlineText="CmdHeadline?.headlineText ? CmdHeadline?.headlineText : product.name"/>
+            <CmdHeadline
+                v-if="cmdHeadline?.headlineText || product.name"
+                v-bind="cmdHeadline || {}"
+                :headlineText="cmdHeadline?.headlineText ? cmdHeadline?.headlineText : product.name"/>
             <!-- end CmdHeadline -->
         </div>
         <div class="box-body">
@@ -89,9 +91,11 @@
             <img v-if="user.image" :src="user.image.src" :alt="user.image.alt"/>
             <div v-else :class="defaultProfileIconClass" :title="user.name"></div>
             <!-- begin CmdHeadline -->
-            <CmdHeadline v-if="CmdHeadline?.headlineText || user.name"
-                               v-bind="CmdHeadline || {}"
-                               :headlineText="CmdHeadline?.headlineText ? CmdHeadline?.headlineText : user.name"/>
+            <CmdHeadline
+                v-if="cmdHeadline?.headlineText || user.name"
+                v-bind="cmdHeadline || {}"
+                :headlineText="cmdHeadline?.headlineText ? cmdHeadline?.headlineText : user.name"
+            />
             <!-- end CmdHeadline -->
         </div>
         <div class="box-body">

package/src/components/CmdBoxSiteSearch.vue

@@ -6,8 +6,8 @@
 
         <!-- begin CmdHeadline -->
         <CmdHeadline
-            v-if="CmdHeadline"
-            v-bind="CmdHeadline"
+            v-if="cmdHeadline"
+            v-bind="cmdHeadline"
         />
         <!-- end CmdHeadline -->
 

package/src/components/CmdCookieDisclaimer.vue

@@ -3,10 +3,10 @@
         <div class="cmd-cookie-disclaimer flex-container vertical">
             <!-- begin CmdHeadline -->
             <CmdHeadline
-                v-if="CmdHeadlineCookieDisclaimer?.show && CmdHeadlineCookieDisclaimer?.headlineText && CmdHeadlineCookieDisclaimer?.headlineLevel"
-                v-bind="CmdHeadlineCookieDisclaimer"
-                :headlineText="CmdHeadlineCookieDisclaimer.headlineText"
-                :headlineLevel="CmdHeadlineCookieDisclaimer.headlineLevel"
+                v-if="cmdHeadlineCookieDisclaimer?.show && cmdHeadlineCookieDisclaimer?.headlineText && cmdHeadlineCookieDisclaimer?.headlineLevel"
+                v-bind="cmdHeadlineCookieDisclaimer"
+                :headlineText="cmdHeadlineCookieDisclaimer.headlineText"
+                :headlineLevel="cmdHeadlineCookieDisclaimer.headlineLevel"
             />
             <!-- end CmdHeadline -->
 
@@ -151,7 +151,7 @@ export default {
         /**
          * properties for CmdHeadline-component at top of cookie disclaimer
          */
-        CmdHeadlineCookieDisclaimer: {
+        cmdHeadlineCookieDisclaimer: {
             type: Object,
             default() {
                 return {

package/src/components/CmdHeadline.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="['cmd-custom-headline', { 'has-pre-headline-text': preHeadlineText}]">
+    <div :class="['cmd-headline', { 'has-pre-headline-text': preHeadlineText}]">
         <span v-if="iconClass" :class="iconClass"></span>
         <div v-if="preHeadlineText">
             <span class="pre-headline-text">{{ preHeadlineText }}</span>
@@ -55,10 +55,10 @@ export default {
 </script>
 
 <style lang="scss">
+/* begin cmd--headline ------------------------------------------------------------------------------------------ */
 @import '../assets/styles/variables';
 
-/* begin cmd-custom-headline ------------------------------------------------------------------------------------------ */
-.cmd-custom-headline {
+.cmd-headline {
     display: flex;
     align-items: center;
     margin-bottom: var(--default-margin);
@@ -88,6 +88,5 @@ export default {
         }
     }
 }
-
-/* end cmd-custom-headline ------------------------------------------------------------------------------------------ */
+/* end cmd-headline ------------------------------------------------------------------------------------------ */
 </style>

package/src/components/CmdListOfLinks.vue

@@ -1,8 +1,10 @@
 <template>
     <div :class="['cmd-list-of-links', 'align-' + align, {box: styleAsBox, horizontal: orientation === 'horizontal', 'section-anchors': sectionAnchors}]">
         <!-- begin CmdHeadline -->
-        <CmdHeadline v-if="CmdHeadline"
-                           v-bind="CmdHeadline" />
+        <CmdHeadline
+            v-if="cmdHeadline"
+            v-bind="cmdHeadline"
+        />
         <!-- end CmdHeadline -->
 
         <!-- begin list of links -->

package/src/components/CmdListOfRequirements.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="cmd-list-of-requirements">
         <!-- begin cmd-custom-headline -->
-        <CmdHeadline :headline-level="CmdHeadline.headlineLevel">
+        <CmdHeadline :headline-level="cmdHeadline.headlineLevel">
             <!-- {{ getMessage("cmdfakeselect.headline.requirements_for_input") }}<br/>"{{ labelText }}" -->
         </CmdHeadline>
         <!-- end cmd-custom-headline -->

package/src/components/CmdLoginForm.vue

@@ -3,8 +3,8 @@
     <fieldset v-if="!sendLogin" class="cmd-login-form flex-container">
         <legend :class="{hidden : !showLegend}">{{ textLegend }}</legend>
         <!-- begin CmdHeadline -->
-        <CmdHeadline v-if="CmdHeadlineLoginForm"
-                           v-bind="CmdHeadlineLoginForm"/>
+        <CmdHeadline v-if="cmdHeadlineLoginForm"
+                           v-bind="cmdHeadlineLoginForm"/>
         <!-- end CmdHeadline -->
 
         <!-- being form elements -->
@@ -122,11 +122,11 @@
     <fieldset v-else class="cmd-login-form flex-container">
         <legend :class="{'hidden' : !legendSendLoginForm.show}">{{ legendSendLoginForm.text }}</legend>
         <!-- begin CmdHeadline -->
-        <CmdHeadline v-if="CmdHeadlineSendLoginForm"
-                           :iconClass="CmdHeadlineSendLoginForm.iconClass"
-                           :preHeadline="CmdHeadlineSendLoginForm.preHeadline"
-                           :headlineLevel="CmdHeadlineSendLoginForm.preHeadline"
-                           :headlineText="CmdHeadlineSendLoginForm.headlineText"/>
+        <CmdHeadline v-if="cmdHeadlineSendLoginForm"
+                           :iconClass="cmdHeadlineSendLoginForm.iconClass"
+                           :preHeadline="cmdHeadlineSendLoginForm.preHeadline"
+                           :headlineLevel="cmdHeadlineSendLoginForm.preHeadline"
+                           :headlineText="cmdHeadlineSendLoginForm.headlineText"/>
         <!-- end CmdHeadline -->
 
         <!-- begin CmdFormElement -->
@@ -272,14 +272,14 @@ export default {
         /**
          * properties for CmdHeadline-component for login-form
          */
-        CmdHeadlineLoginForm: {
+        cmdHeadlineLoginForm: {
             type: Object,
             required: false
         },
         /**
          * properties for CmdHeadline-component for send-login-form
          */
-        CmdHeadlineSendLoginForm: {
+        cmdHeadlineSendLoginForm: {
             type: Object,
             default() {
                 return {
@@ -439,6 +439,7 @@ export default {
 </script>
 
 <style lang="scss">
+/* begin cmd-login-form ---------------------------------------------------------------------------------------- */
 .cmd-login-form {
     .option-wrapper {
         align-items: center;
@@ -460,4 +461,5 @@ export default {
         }
     }
 }
+/* end cmd-login-form ---------------------------------------------------------------------------------------- */
 </style>

package/src/components/CmdOpeningHours.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="cmd-opening-hours">
         <!-- begin cmd-custom-headline -->
-        <CmdHeadline v-if="CmdHeadline" v-bind="CmdHeadline" />
+        <CmdHeadline v-if="cmdHeadline" v-bind="cmdHeadline" />
         <!-- end cmd-custom-headline -->
 
         <!-- begin opening-status with link to detail-page -->

package/src/components/CmdTooltip.vue

@@ -1,12 +1,14 @@
 <template>
     <div v-if="tooltipVisibility" :class="['cmd-tooltip', status]" ref="tooltip" aria-role="tooltip">
-        <div v-if="CmdHeadline || iconClose.show" class="headline-wrapper">
+        <div v-if="cmdHeadline || iconClose.show" class="headline-wrapper">
             <!-- begin CmdHeadline -->
-            <CmdHeadline v-if="CmdHeadline"
-                               :iconClass="CmdHeadline.iconClass"
-                               :preHeadline="CmdHeadline.preHeadline"
-                               :headlineLevel="CmdHeadline.headlineLevel"
-                               :headlineText="CmdHeadline.headlineText"/>
+            <CmdHeadline
+                v-if="cmdHeadline"
+               :iconClass="cmdHeadline.iconClass"
+               :preHeadline="cmdHeadline.preHeadline"
+               :headlineLevel="cmdHeadline.headlineLevel"
+               :headlineText="cmdHeadline.headlineText"
+            />
             <!-- end CmdHeadline -->
 
             <!-- begin icon to close tooltip -->

package/src/components/CmdUploadForm.vue

@@ -3,8 +3,9 @@
     <fieldset v-if="advancedMode" :class="['cmd-upload-form flex-container', { 'upload-initiated': uploadInitiated }]">
         <legend :class="{hidden : !showLegend}">{{ textLegend }}</legend>
         <!-- begin CmdHeadlineFieldset -->
-        <CmdHeadline v-if="CmdHeadlineFieldset"
-                           v-bind="CmdHeadlineFieldset"
+        <CmdHeadline
+            v-if="cmdHeadlineFieldset"
+            v-bind="cmdHeadlineFieldset"
         />
         <!-- end CmdHeadlineFieldset -->
 
@@ -25,10 +26,10 @@
 
         <div :class="['box drop-area flex-container vertical', { 'allow-drop': allowDrop }]" v-on="dragAndDropHandler">
             <template v-if="!listOfFiles.length">
-                <CmdHeadline v-if="allowMultipleFileUploads" v-bind="CmdHeadlineNoFilesToUpload" headlineLevel="4">
+                <CmdHeadline v-if="allowMultipleFileUploads" v-bind="cmdHeadlineNoFilesToUpload" headlineLevel="4">
                     {{ getMessage("cmduploadform.no_files_to_upload") }}
                 </CmdHeadline>
-                <CmdHeadline v-else v-bind="CmdHeadlineNoFilesToUpload" headlineLevel="4">
+                <CmdHeadline v-else v-bind="cmdHeadlineNoFilesToUpload" headlineLevel="4">
                     {{ getMessage("cmduploadform.no_file_to_upload") }}
                 </CmdHeadline>
             </template>
@@ -36,7 +37,7 @@
             <!-- begin total-upload information -->
             <div v-else class="flex-container vertical">
                 <div v-if="showTotalUpload && listOfFiles.length !== 1" class="flex-container vertical list-files-wrapper">
-                    <CmdHeadline v-bind="CmdHeadlineSummaryOfAllFiles" headlineLevel="4">
+                    <CmdHeadline v-bind="cmdHeadlineSummaryOfAllFiles" headlineLevel="4">
                         {{ getMessage("cmduploadform.headline.summary_of_all_files") }}
                     </CmdHeadline>
                     <ul v-if="showTotalUpload && listOfFiles.length !== 1" class="list-of-files total-files">
@@ -80,7 +81,7 @@
 
                 <div class="flex-container vertical list-files-wrapper">
                     <!-- begin list of selected files -->
-                    <CmdHeadline v-bind="CmdHeadlineListOfSelectedFiles" headlineLevel="4">
+                    <CmdHeadline v-bind="cmdHeadlineListOfSelectedFiles" headlineLevel="4">
                         {{ getMessage("cmduploadform.headline.list_of_selected_files") }}
                     </CmdHeadline>
                     <ul class="list-of-files">
@@ -131,10 +132,10 @@
             <!-- end list of selected files -->
 
             <!-- begin upload conditions -->
-            <CmdHeadline v-if="allowMultipleFileUploads && listOfFiles.length" v-bind="CmdHeadlineSelectAdditionalFiles" headlineLevel="4">
+            <CmdHeadline v-if="allowMultipleFileUploads && listOfFiles.length" v-bind="cmdHeadlineSelectAdditionalFiles" headlineLevel="4">
                 {{ getMessage("cmduploadform.headline.select_additional_files") }}
             </CmdHeadline>
-            <CmdHeadline v-if="!allowMultipleFileUploads && listOfFiles.length" v-bind="CmdHeadlineSelectNewFile" headlineLevel="4">
+            <CmdHeadline v-if="!allowMultipleFileUploads && listOfFiles.length" v-bind="cmdHeadlineSelectNewFile" headlineLevel="4">
                 {{ getMessage("cmduploadform.headline.select_new_file") }}
             </CmdHeadline>
             <dl class="small">
@@ -508,14 +509,14 @@ export default {
         /**
          * properties for CmdHeadline-component at of the fieldset
          */
-        CmdHeadlineFieldset: {
+        cmdHeadlineFieldset: {
             type: Object,
             required: false
         },
         /**
          * properties for CmdHeadline-component shown if no files for upload exist
          */
-        CmdHeadlineNoFilesToUpload: {
+        cmdHeadlineNoFilesToUpload: {
             type: Object,
             required: false
         },
@@ -529,28 +530,28 @@ export default {
         /**
          * properties for CmdHeadline-component for 'summary of all files'
          */
-        CmdHeadlineSummaryOfAllFiles: {
+        cmdHeadlineSummaryOfAllFiles: {
             type: Object,
             required: false
         },
         /**
          * properties for CmdHeadline-component for 'list of selected files'
          */
-        CmdHeadlineListOfSelectedFiles: {
+        cmdHeadlineListOfSelectedFiles: {
             type: Object,
             required: false
         },
         /**
          * properties for CmdHeadline-component for 'select additional files'
          */
-        CmdHeadlineSelectAdditionalFiles: {
+        cmdHeadlineSelectAdditionalFiles: {
             type: Object,
             required: false
         },
         /**
          * properties for CmdHeadline-component for 'select new file'
          */
-        CmdHeadlineSelectNewFile: {
+        cmdHeadlineSelectNewFile: {
             type: Object,
             required: false
         },

package/src/documentation/generated/CmdCookieDisclaimerPropertyDescriptions.json

@@ -4,7 +4,7 @@
             "set default v-model (must be named modelValue in Vue3)"
         ]
     },
-    "CmdHeadlineCookieDisclaimer": {
+    "cmdHeadlineCookieDisclaimer": {
         "comments": [
             "properties for CmdHeadline-component at top of cookie disclaimer"
         ]

package/src/documentation/generated/CmdLoginFormPropertyDescriptions.json

@@ -29,12 +29,12 @@
             ]
         }
     },
-    "CmdHeadlineLoginForm": {
+    "cmdHeadlineLoginForm": {
         "comments": [
             "properties for CmdHeadline-component for login-form"
         ]
     },
-    "CmdHeadlineSendLoginForm": {
+    "cmdHeadlineSendLoginForm": {
         "comments": [
             "properties for CmdHeadline-component for send-login-form"
         ]

package/src/documentation/generated/CmdUploadFormPropertyDescriptions.json

@@ -122,12 +122,12 @@
             "set icon class for cancel-icon"
         ]
     },
-    "CmdHeadlineFieldset": {
+    "cmdHeadlineFieldset": {
         "comments": [
             "properties for CmdHeadline-component at of the fieldset"
         ]
     },
-    "CmdHeadlineNoFilesToUpload": {
+    "cmdHeadlineNoFilesToUpload": {
         "comments": [
             "properties for CmdHeadline-component shown if no files for upload exist"
         ]
@@ -137,22 +137,22 @@
             "properties for CmdHeadline-component shown if no file for upload exist"
         ]
     },
-    "CmdHeadlineSummaryOfAllFiles": {
+    "cmdHeadlineSummaryOfAllFiles": {
         "comments": [
             "properties for CmdHeadline-component for 'summary of all files'"
         ]
     },
-    "CmdHeadlineListOfSelectedFiles": {
+    "cmdHeadlineListOfSelectedFiles": {
         "comments": [
             "properties for CmdHeadline-component for 'list of selected files'"
         ]
     },
-    "CmdHeadlineSelectAdditionalFiles": {
+    "cmdHeadlineSelectAdditionalFiles": {
         "comments": [
             "properties for CmdHeadline-component for 'select additional files'"
         ]
     },
-    "CmdHeadlineSelectNewFile": {
+    "cmdHeadlineSelectNewFile": {
         "comments": [
             "properties for CmdHeadline-component for 'select new file'"
         ]