Update JS dependencies, remove space after emoji completion (#25266) (#25352)

Manual backport of #25266 because of lockfile conflicts.

- Update all JS dependencies
- Enable stylint
[`media-feature-name-value-no-unknown`](https://stylelint.io/user-guide/rules/media-feature-name-value-no-unknown)
- Make use of new features in webpack and text-expander-element
- Tested Swagger and Mermaid

To explain the `text-expander-element` change: Before this version, the
element added a unavoidable space after emoji completion. Now that
https://github.com/github/text-expander-element/pull/36 is in, we gain
control over this space and I opted to remove it for emoji completion
and retain it for `@` mentions.

Co-authored-by: Giteabot <teabot@gitea.io>

.stylelintrc.yaml

@@ -80,6 +80,7 @@ rules:
   media-feature-name-no-vendor-prefix: true
   media-feature-name-unit-allowed-list: null
   media-feature-name-value-allowed-list: null
+  media-feature-name-value-no-unknown: true
   media-feature-range-notation: null
   named-grid-areas-no-invalid: true
   no-descending-specificity: null

package.json

@@ -14,9 +14,9 @@
     "@claviska/jquery-minicolors": "2.3.6",
     "@github/markdown-toolbar-element": "2.1.1",
     "@github/relative-time-element": "4.3.0",
-    "@github/text-expander-element": "2.3.0",
+    "@github/text-expander-element": "2.5.0",
     "@mcaptcha/vanilla-glue": "0.1.0-alpha-3",
-    "@primer/octicons": "19.1.0",
+    "@primer/octicons": "19.3.0",
     "@webcomponents/custom-elements": "1.6.0",
     "add-asset-webpack-plugin": "2.0.1",
     "ansi-to-html": "0.7.2",
@@ -32,7 +32,7 @@
     "jquery.are-you-sure": "1.9.0",
     "katex": "0.16.7",
     "license-checker-webpack-plugin": "0.2.1",
-    "mermaid": "10.2.2",
+    "mermaid": "10.2.3",
     "mini-css-extract-plugin": "2.7.6",
     "minimatch": "9.0.1",
     "monaco-editor": "0.39.0",
@@ -40,7 +40,7 @@
     "pdfobject": "2.2.12",
     "pretty-ms": "8.0.0",
     "sortablejs": "1.15.0",
-    "swagger-ui-dist": "4.19.0",
+    "swagger-ui-dist": "5.0.0",
     "throttle-debounce": "5.0.0",
     "tippy.js": "6.3.7",
     "tributejs": "5.1.3",
@@ -49,17 +49,17 @@
     "vue-bar-graph": "2.0.0",
     "vue-loader": "17.2.2",
     "vue3-calendar-heatmap": "2.0.5",
-    "webpack": "5.86.0",
+    "webpack": "5.87.0",
     "webpack-cli": "5.1.4",
     "wrap-ansi": "8.1.0"
   },
   "devDependencies": {
     "@eslint-community/eslint-plugin-eslint-comments": "3.2.1",
-    "@playwright/test": "1.34.3",
+    "@playwright/test": "1.35.1",
     "@rollup/pluginutils": "5.0.2",
     "@stoplight/spectral-cli": "6.8.0",
     "@vitejs/plugin-vue": "4.2.3",
-    "eslint": "8.42.0",
+    "eslint": "8.43.0",
     "eslint-plugin-array-func": "3.1.8",
     "eslint-plugin-custom-elements": "0.0.8",
     "eslint-plugin-import": "2.27.5",
@@ -72,13 +72,14 @@
     "eslint-plugin-vue": "9.14.1",
     "eslint-plugin-wc": "1.5.0",
     "jsdom": "22.1.0",
-    "markdownlint-cli": "0.34.0",
+    "markdownlint-cli": "0.35.0",
     "postcss-html": "1.5.0",
-    "stylelint": "15.7.0",
+    "stylelint": "15.8.0",
+    "stylelint-declaration-block-no-ignored-properties": "2.7.0",
     "stylelint-declaration-strict-value": "1.9.2",
     "svgo": "3.0.2",
-    "updates": "14.1.1",
+    "updates": "14.2.4",
-    "vitest": "0.32.0"
+    "vitest": "0.32.2"
   },
   "browserslist": [
     "defaults",

public/img/svg/octicon-copilot.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="svg octicon-copilot" width="16" height="16" aria-hidden="true"><path d="M6.25 9a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-1.5 0v-1.5A.75.75 0 0 1 6.25 9Zm4.25.75a.75.75 0 0 0-1.5 0v1.5a.75.75 0 0 0 1.5 0v-1.5Z"/><path d="M7.86 1.77c.05.053.097.107.14.164.043-.057.09-.111.14-.164.681-.731 1.737-.9 2.943-.765 1.23.136 2.145.527 2.724 1.26.566.716.693 1.614.693 2.485 0 .572-.053 1.147-.254 1.655l.168.838.066.033A2.75 2.75 0 0 1 16 9.736V11c0 .24-.086.438-.156.567-.073.131-.16.253-.259.366-.18.21-.404.413-.605.58a10.19 10.19 0 0 1-.792.597l-.015.01-.006.004-.028.018a8.849 8.849 0 0 1-.456.281c-.307.177-.749.41-1.296.642C11.296 14.528 9.756 15 8 15c-1.756 0-3.296-.472-4.387-.935a12.28 12.28 0 0 1-1.296-.641 8.849 8.849 0 0 1-.456-.281l-.028-.02-.006-.003-.015-.01a10.593 10.593 0 0 1-.792-.596 5.264 5.264 0 0 1-.605-.58 2.133 2.133 0 0 1-.259-.367A1.189 1.189 0 0 1 0 11V9.736a2.75 2.75 0 0 1 1.52-2.46l.067-.033.167-.838C1.553 5.897 1.5 5.322 1.5 4.75c0-.87.127-1.77.693-2.485.579-.733 1.494-1.124 2.724-1.26 1.206-.134 2.262.034 2.944.765ZM3 7.824v4.261c.02.013.043.025.065.038.264.152.65.356 1.134.562.972.412 2.307.815 3.801.815 1.494 0 2.83-.403 3.8-.815.412-.174.813-.375 1.2-.6v-4.26l-.023-.116c-.49.21-1.075.291-1.727.291-1.146 0-2.06-.328-2.71-.991A3.233 3.233 0 0 1 8 6.266c-.144.269-.321.52-.54.743C6.81 7.672 5.896 8 4.75 8c-.652 0-1.236-.082-1.726-.291L3 7.824Zm6.237-5.031c-.204.218-.359.678-.242 1.614.091.726.303 1.23.618 1.553.299.304.784.54 1.638.54.922 0 1.28-.199 1.442-.38.179-.2.308-.578.308-1.37 0-.765-.123-1.242-.37-1.555-.233-.296-.693-.586-1.713-.7-1.044-.116-1.488.091-1.681.298Zm-2.472 0c-.193-.207-.637-.414-1.681-.298-1.02.114-1.48.404-1.713.7-.247.313-.37.79-.37 1.555 0 .792.129 1.17.308 1.37.162.181.52.38 1.442.38.854 0 1.339-.236 1.638-.54.315-.323.527-.827.618-1.553.117-.936-.038-1.396-.242-1.614Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="svg octicon-copilot" width="16" height="16" aria-hidden="true"><path d="M7.998 15.035c-4.562 0-7.873-2.914-7.998-3.749V9.338c.085-.628.677-1.686 1.588-2.065.013-.07.024-.143.036-.218.029-.183.06-.384.126-.612-.201-.508-.254-1.084-.254-1.656 0-.87.128-1.769.693-2.484.579-.733 1.494-1.124 2.724-1.261 1.206-.134 2.262.034 2.944.765.05.053.096.108.139.165.044-.057.094-.112.143-.165.682-.731 1.738-.899 2.944-.765 1.23.137 2.145.528 2.724 1.261.566.715.693 1.614.693 2.484 0 .572-.053 1.148-.254 1.656.066.228.098.429.126.612.012.076.024.148.037.218.924.385 1.522 1.471 1.591 2.095v1.872c0 .766-3.351 3.795-8.002 3.795Zm0-1.485c2.28 0 4.584-1.11 5.002-1.433V7.862l-.023-.116c-.49.21-1.075.291-1.727.291-1.146 0-2.059-.327-2.71-.991A3.222 3.222 0 0 1 8 6.303a3.24 3.24 0 0 1-.544.743c-.65.664-1.563.991-2.71.991-.652 0-1.236-.081-1.727-.291l-.023.116v4.255c.419.323 2.722 1.433 5.002 1.433ZM6.762 2.83c-.193-.206-.637-.413-1.682-.297-1.019.113-1.479.404-1.713.7-.247.312-.369.789-.369 1.554 0 .793.129 1.171.308 1.371.162.181.519.379 1.442.379.853 0 1.339-.235 1.638-.54.315-.322.527-.827.617-1.553.117-.935-.037-1.395-.241-1.614Zm4.155-.297c-1.044-.116-1.488.091-1.681.297-.204.219-.359.679-.242 1.614.091.726.303 1.231.618 1.553.299.305.784.54 1.638.54.922 0 1.28-.198 1.442-.379.179-.2.308-.578.308-1.371 0-.765-.123-1.242-.37-1.554-.233-.296-.693-.587-1.713-.7Z"/><path d="M6.25 9.037a.75.75 0 0 1 .75.75v1.501a.75.75 0 0 1-1.5 0V9.787a.75.75 0 0 1 .75-.75Zm4.25.75v1.501a.75.75 0 0 1-1.5 0V9.787a.75.75 0 0 1 1.5 0Z"/></svg>

public/img/svg/octicon-pivot-column.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="svg octicon-pivot-column" width="16" height="16" aria-hidden="true"><path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.217 0 16 .784 16 1.75v5.5a.75.75 0 0 1-1.5 0V6.5h-8v8h.75a.75.75 0 0 1 0 1.5h-5.5A1.75 1.75 0 0 1 0 14.25ZM1.5 6.5v7.75c0 .138.112.25.25.25H5v-8Zm5-1.5h8V1.75a.25.25 0 0 0-.25-.25H6.5ZM5 5V1.5H1.75a.25.25 0 0 0-.25.25V5Z"/><path d="m11.017 9.89-2.882 2.677a.249.249 0 0 0 0 .366l2.882 2.677a.25.25 0 0 0 .421-.183V13.5H12.5A3.5 3.5 0 0 0 16 10a.75.75 0 0 0-1.5 0 2 2 0 0 1-2 2h-1.062v-1.927a.25.25 0 0 0-.421-.183Z"/></svg>

public/img/svg/octicon-redo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="svg octicon-redo" width="16" height="16" aria-hidden="true"><path d="M14.78 6.28a.749.749 0 0 0 0-1.06l-3.5-3.5a.749.749 0 1 0-1.06 1.06L12.439 5H5.251l-.001.007L5.251 5a.8.8 0 0 0-.171.019A4.501 4.501 0 0 0 5.5 14h1.704a.75.75 0 0 0 0-1.5H5.5a3 3 0 1 1 0-6h6.939L10.22 8.72a.749.749 0 1 0 1.06 1.06l3.5-3.5Z"/></svg>

public/img/svg/octicon-tracked-by-closed-completed.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="svg octicon-tracked-by-closed-completed" width="16" height="16" aria-hidden="true"><path d="M1.5 8a6.5 6.5 0 1 1 13 0A.75.75 0 0 0 16 8a8 8 0 1 0-8 8 .75.75 0 0 0 0-1.5A6.5 6.5 0 0 1 1.5 8Z"/><path d="m8.677 12.427 2.896 2.896a.25.25 0 0 0 .427-.177V13h3.25a.75.75 0 0 0 0-1.5H12V9.354a.25.25 0 0 0-.427-.177l-2.896 2.896a.25.25 0 0 0 0 .354ZM11.28 6.78a.749.749 0 1 0-1.06-1.06L7.25 8.689 5.78 7.22a.749.749 0 1 0-1.06 1.06l2 2a.749.749 0 0 0 1.06 0l3.5-3.5Z"/></svg>

public/img/svg/octicon-tracked-by-closed-not-planned.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="svg octicon-tracked-by-closed-not-planned" width="16" height="16" aria-hidden="true"><path d="M1.5 8a6.5 6.5 0 1 1 13 0A.75.75 0 0 0 16 8a8 8 0 1 0-8 8 .75.75 0 0 0 0-1.5A6.5 6.5 0 0 1 1.5 8Z"/><path d="m8.677 12.427 2.896 2.896a.25.25 0 0 0 .427-.177V13h3.25a.75.75 0 0 0 0-1.5H12V9.354a.25.25 0 0 0-.427-.177l-2.896 2.896a.25.25 0 0 0 0 .354ZM11.28 5.78a.749.749 0 1 0-1.06-1.06l-5.5 5.5a.749.749 0 1 0 1.06 1.06l5.5-5.5Z"/></svg>

public/img/svg/octicon-undo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" class="svg octicon-undo" width="16" height="16" aria-hidden="true"><path d="M1.22 6.28a.749.749 0 0 1 0-1.06l3.5-3.5a.749.749 0 1 1 1.06 1.06L3.561 5h7.188l.001.007L10.749 5c.058 0 .116.007.171.019A4.501 4.501 0 0 1 10.5 14H8.796a.75.75 0 0 1 0-1.5H10.5a3 3 0 1 0 0-6H3.561L5.78 8.72a.749.749 0 1 1-1.06 1.06l-3.5-3.5Z"/></svg>

templates/shared/combomarkdowneditor.tmpl

@@ -44,7 +44,7 @@ Template Attributes:
 				<button class="markdown-toolbar-button markdown-switch-easymde" data-tooltip-content="{{.locale.Tr "editor.buttons.switch_to_legacy.tooltip"}}">{{svg "octicon-arrow-switch"}}</button>
 			</div>
 		</markdown-toolbar>
-		<text-expander keys=": @">
+		<text-expander keys=": @" suffix="">
 			<textarea class="markdown-text-editor js-quick-submit"{{if .TextareaName}} name="{{.TextareaName}}"{{end}}{{if .TextareaPlaceholder}} placeholder="{{.TextareaPlaceholder}}"{{end}}{{if .TextareaAriaLabel}} aria-label="{{.TextareaAriaLabel}}"{{end}}>{{.TextareaContent}}</textarea>
 		</text-expander>
 		<script>

web_src/js/features/comp/TextExpander.js

@@ -53,7 +53,9 @@ export function initTextExpander(expander) {
   });
   expander?.addEventListener('text-expander-value', ({detail}) => {
     if (detail?.item) {
-      detail.value = detail.item.getAttribute('data-value');
+      // add a space after @mentions as it's likely the user wants one
+      const suffix = detail.key === '@' ? ' ' : '';
+      detail.value = `${detail.item.getAttribute('data-value')}${suffix}`;
     }
   });
 }

webpack.config.js

@@ -199,7 +199,7 @@ export default {
       emitError: true,
       allow: '(Apache-2.0 OR BSD-2-Clause OR BSD-3-Clause OR MIT OR ISC OR CPAL-1.0 OR Unlicense OR EPL-1.0 OR EPL-2.0)',
     }) : new AddAssetPlugin('js/licenses.txt', `Licenses are disabled during development`),
-  ].filter(Boolean),
+  ],
   performance: {
     hints: false,
     maxEntrypointSize: Infinity,