Merge pull request from GHSA-2f2w-349x-vrqm

[3.5.7] `v-html` security fixes

composer.json

@@ -8,7 +8,7 @@
     "core"
   ],
   "homepage": "https://getkirby.com",
-  "version": "3.5.7-rc.1",
+  "version": "3.5.7",
   "license": "proprietary",
   "authors": [
     {

config/sections/files.php

@@ -1,6 +1,7 @@
 <?php
 
 use Kirby\Cms\File;
+use Kirby\Toolkit\Escape;
 use Kirby\Toolkit\I18n;
 
 return [
@@ -116,6 +117,13 @@
             foreach ($this->files as $file) {
                 $image = $file->panelImage($this->image);
 
+                // escape the default text
+                // TODO: no longer needed in 3.6
+                $text = $file->toString($this->text);
+                if ($this->text === '{{ file.filename }}') {
+                    $text = Escape::html($text);
+                }
+
                 $data[] = [
                     'dragText' => $file->dragText('auto', $dragTextAbsolute),
                     'extension' => $file->extension(),
@@ -127,7 +135,7 @@
                     'link'     => $file->panelUrl(true),
                     'mime'     => $file->mime(),
                     'parent'   => $file->parent()->panelPath(),
-                    'text'     => $file->toString($this->text),
+                    'text'     => $text,
                     'url'      => $file->url(),
                 ];
             }

config/sections/pages.php

@@ -2,6 +2,7 @@
 
 use Kirby\Cms\Blueprint;
 use Kirby\Toolkit\A;
+use Kirby\Toolkit\Escape;
 use Kirby\Toolkit\I18n;
 
 return [
@@ -153,10 +154,17 @@
                 $permissions = $item->permissions();
                 $image       = $item->panelImage($this->image);
 
+                // escape the default text
+                // TODO: no longer needed in 3.6
+                $text = $item->toString($this->text);
+                if ($this->text === '{{ page.title }}') {
+                    $text = Escape::html($text);
+                }
+
                 $data[] = [
                     'id'          => $item->id(),
                     'dragText'    => $item->dragText(),
-                    'text'        => $item->toString($this->text),
+                    'text'        => $text,
                     'info'        => $item->toString($this->info ?? false),
                     'parent'      => $item->parentId(),
                     'icon'        => $item->panelIcon($image),

i18n/translations/sv_SE.json

@@ -118,7 +118,7 @@
   "error.page.duplicate.permission": "Du har inte behörighet att duplicera \"{slug}\"",
   "error.page.notFound": "Sidan \"{slug}\" kan inte hittas",
   "error.page.num.invalid": "Ange ett giltigt nummer för sortering. Numret får inte vara negativt.",
-  "error.page.slug.invalid": "Please enter a valid URL appendix",
+  "error.page.slug.invalid": "Ange en giltig URL-appendix",
   "error.page.slug.maxlength": "Permalänkens längd måste vara kortare än \"{length}\" tecken",
   "error.page.sort.permission": "Sidan \"{slug}\" kan inte sorteras",
   "error.page.status.invalid": "Sätt en giltig status för sidan",
@@ -163,7 +163,7 @@
   "error.user.password.invalid": "Ange ett giltigt lösenord. Lösenordet måste vara minst 8 tecken långt.",
   "error.user.password.notSame": "Lösenorden matchar inte",
   "error.user.password.undefined": "Användaren har inget lösenord",
-  "error.user.password.wrong": "Wrong password",
+  "error.user.password.wrong": "Fel lösenord",
   "error.user.role.invalid": "Ange en giltig roll",
   "error.user.update.permission": "Du har inte behörighet att uppdatera användaren \"{name}\"",
 
@@ -372,11 +372,11 @@
   "more": "Mer",
   "name": "Namn",
   "next": "Nästa",
-  "no": "no",
+  "no": "nej",
   "off": "av",
   "on": "på",
   "open": "Öppna",
-  "open.newWindow": "Open in new window",
+  "open.newWindow": "Öppna i nytt fönster",
   "options": "Alternativ",
   "options.none": "Inga alternativ",
 
@@ -468,9 +468,9 @@
   "toolbar.button.file.select": "Välj en fil",
   "toolbar.button.file.upload": "Ladda upp en fil",
   "toolbar.button.link": "L\u00e4nk",
-  "toolbar.button.strike": "Strike-through",
+  "toolbar.button.strike": "Genomstruken",
   "toolbar.button.ol": "Sorterad lista",
-  "toolbar.button.underline": "Underline",
+  "toolbar.button.underline": "Understruken",
   "toolbar.button.ul": "Punktlista",
 
   "translation.author": "Kirby-teamet, Ola Christensson",
@@ -523,5 +523,5 @@
 
   "welcome": "Välkommen",
   "year": "År",
-  "yes": "yes"
+  "yes": "ja"
 }

panel/src/components/Dialogs/FileRemoveDialog.vue

@@ -1,7 +1,7 @@
 <template>
   <k-remove-dialog
     ref="dialog"
-    :text="$t('file.delete.confirm', { filename: filename })"
+    :text="$t('file.delete.confirm', { filename: $esc(filename) })"
     @submit="submit"
   />
 </template>

panel/src/components/Dialogs/FilesDialog.vue

@@ -7,7 +7,7 @@
     @submit="submit"
   >
     <template v-if="issue">
-      <k-box :text="issue" theme="negative" />
+      <k-box :text="issue" :html="false" theme="negative" />
     </template>
 
     <template v-else>

panel/src/components/Dialogs/LanguageRemoveDialog.vue

@@ -1,7 +1,7 @@
 <template>
   <k-remove-dialog
     ref="dialog"
-    :text="$t('language.delete.confirm', { name: language.name })"
+    :text="$t('language.delete.confirm', { name: $esc(language.name) })"
     @submit="submit"
   />
 </template>

panel/src/components/Dialogs/PageRemoveDialog.vue

@@ -7,7 +7,7 @@
   >
     <template v-if="page.hasChildren || page.hasDrafts">
       <!-- eslint-disable-next-line vue/no-v-html -->
-      <k-text v-html="$t('page.delete.confirm', { title: page.title })" />
+      <k-text v-html="$t('page.delete.confirm', { title: $esc(page.title) })" />
       <div class="k-page-remove-warning">
         <!-- eslint-disable-next-line vue/no-v-html -->
         <k-box theme="negative" v-html="$t('page.delete.confirm.subpages')" />
@@ -21,7 +21,7 @@
     </template>
     <template v-else>
       <!-- eslint-disable-next-line vue/no-v-html -->
-      <k-text @keydown.enter="submit" v-html="$t('page.delete.confirm', { title: page.title })" />
+      <k-text @keydown.enter="submit" v-html="$t('page.delete.confirm', { title: $esc(page.title) })" />
     </template>
   </k-remove-dialog>
 </template>

panel/src/components/Dialogs/PagesDialog.vue

@@ -7,7 +7,7 @@
     @submit="submit"
   >
     <template v-if="issue">
-      <k-box :text="issue" theme="negative" />
+      <k-box :text="issue" :html="false" theme="negative" />
     </template>
     <template v-else>
       <header v-if="model" class="k-pages-dialog-navbar">

panel/src/components/Dialogs/UserRemoveDialog.vue

@@ -1,7 +1,7 @@
 <template>
   <k-remove-dialog
     ref="dialog"
-    :text="$t('user.delete.confirm', { email: user.email })"
+    :text="$t('user.delete.confirm', { email: $esc(user.email) })"
     @submit="submit"
   />
 </template>

panel/src/components/Dialogs/UsersDialog.vue

@@ -7,7 +7,7 @@
     @submit="submit"
   >
     <template v-if="issue">
-      <k-box :text="issue" theme="negative" />
+      <k-box :text="issue" :html="false" theme="negative" />
     </template>
 
     <template v-else>

panel/src/components/Forms/Autocomplete.vue

@@ -14,7 +14,8 @@
         @keydown.backspace.prevent="close"
         @keydown.delete.prevent="close"
       >
-        {{ item.text }}
+        <!-- eslint-disable-next-line vue/no-v-html -->
+        <span v-html="html ? item.text : $esc(item.text)" />
       </k-dropdown-item>
     </k-dropdown-content>
     {{ query }}
@@ -27,6 +28,13 @@
  */
 export default {
   props: {
+    /**
+     * If set to `true`, the text of the options is rendered as HTML
+     */
+    html: {
+      type: Boolean,
+      default: false
+    },
     /**
      * Maximum number of displayed results
      */
@@ -44,10 +52,10 @@ export default {
       }
     },
     /**
-     * Options for the autocomplete dropdown must be passed as an array of 
-     * objects. Each object can have as many items as you like, but a text 
+     * Options for the autocomplete dropdown must be passed as an array of
+     * objects. Each object can have as many items as you like, but a text
      * item is required to match agains the query
-     * 
+     *
      * @example [ { text: "this will be searched", id: "anything else is optional" }, ];
      */
     options: Array,
@@ -119,4 +127,4 @@ export default {
     }
   }
 }
-</script>
+</script>

panel/src/components/Forms/FormButtons.vue

@@ -26,7 +26,7 @@
       <p class="k-form-lock-info">
         <k-icon type="lock" />
         <!-- eslint-disable-next-line vue/no-v-html -->
-        <span v-html="$t('lock.isLocked', { email: form.lock.email })" />
+        <span v-html="$t('lock.isLocked', { email: $esc(form.lock.email) })" />
       </p>
 
       <k-icon

panel/src/components/Forms/Input/MultiselectInput.vue

@@ -19,7 +19,8 @@
       @keydown.native.right="navigate('next')"
       @keydown.native.down="$refs.dropdown.open"
     >
-      {{ tag.text }}
+      <!-- eslint-disable-next-line vue/no-v-html -->
+      <span v-html="tag.text" />
     </k-tag>
 
     <k-dropdown-content

panel/src/components/Forms/Input/RadioInput.vue

@@ -10,15 +10,16 @@
         class="k-radio-input-native"
         @change="onInput(option.value)"
       >
-      <label :for="id + '-' + index">
-        <template v-if="option.info">
-          <span class="k-radio-input-text">{{ option.text }}</span>
-          <span class="k-radio-input-info">{{ option.info }}</span>
-        </template>
-        <template v-else>
-          {{ option.text }}
-        </template>
+
+      <!-- eslint-disable vue/no-v-html -->
+      <label v-if="option.info" :for="id + '-' + index">
+        <span class="k-radio-input-text" v-html="option.text" />
+        <!-- @todo support (escaped) HTML in the info prop in 3.6.0 -->
+        <span class="k-radio-input-info">{{ option.info }}</span>
       </label>
+      <label v-else :for="id + '-' + index" v-html="option.text" />
+      <!-- eslint-enable vue/no-v-html -->
+
       <k-icon v-if="option.icon" :type="option.icon" />
     </li>
   </ul>

panel/src/components/Forms/Input/TagsInput.vue

@@ -22,11 +22,14 @@
       @dblclick.native="edit(tag)"
       @remove="remove(tag)"
     >
-      {{ tag.text }}
+      <!-- eslint-disable-next-line vue/no-v-html -->
+      <span v-html="tag.text" />
     </k-tag>
+
     <span slot="footer" class="k-tags-input-element">
       <k-autocomplete
         ref="autocomplete"
+        :html="true"
         :options="options"
         :skip="skip"
         @select="addTag"
@@ -73,9 +76,9 @@ export default {
     },
     id: [Number, String],
     /**
-     * You can set the layout to `list` to extend the width of each tag 
-     * to 100% and show them in a list. This is handy in narrow columns 
-     * or when a list is a more appropriate design choice for the input 
+     * You can set the layout to `list` to extend the width of each tag
+     * to 100% and show them in a list. This is handy in narrow columns
+     * or when a list is a more appropriate design choice for the input
      * in general.
      */
     layout: String,
@@ -89,7 +92,7 @@ export default {
     min: Number,
     name: [Number, String],
     /**
-     * Options will be shown in the autocomplete dropdown 
+     * Options will be shown in the autocomplete dropdown
      * as soon as you start typing.
      */
     options: {

panel/src/components/Layout/Box.vue

@@ -3,7 +3,10 @@
     <!-- @slot Use instead of `text` prop -->
     <slot>
       <!-- eslint-disable-next-line vue/no-v-html -->
-      <k-text v-html="text" />
+      <k-text v-if="html" v-html="text" />
+      <k-text v-else>
+        {{ text }}
+      </k-text>
     </slot>
   </div>
 </template>
@@ -27,7 +30,15 @@ export default {
     /**
      * Text to display inside the box
      */
-    text: String
+    text: String,
+    /**
+     * If set to `false`, the `text` is rendered as text only
+     * @todo Switch default value to `false` in 3.6.0
+     */
+    html: {
+      type: Boolean,
+      default: true
+    }
   }
 };
 </script>

panel/src/components/Layout/Card.vue

@@ -12,7 +12,8 @@
         <k-icon v-bind="icon" />
       </span>
       <figcaption class="k-card-content">
-        <span :data-noinfo="!info" class="k-card-text">{{ text }}</span>
+        <!-- eslint-disable-next-line vue/no-v-html -->
+        <span :data-noinfo="!info" class="k-card-text" v-html="text" />
         <!-- eslint-disable-next-line vue/no-v-html -->
         <span v-if="info" class="k-card-info" v-html="info" />
       </figcaption>