refactor: Make md files vitepress compatible

Author: d3xter666

packages/documentation/.vitepress/cache/deps/_metadata.json

@@ -1,43 +1,43 @@
 {
-  "hash": "81bd2e0d",
+  "hash": "63a812a9",
   "configHash": "9f95b6b5",
-  "lockfileHash": "bc2dc377",
-  "browserHash": "26e8f67c",
+  "lockfileHash": "bbb8758d",
+  "browserHash": "1daff4d0",
   "optimized": {
     "vue": {
       "src": "../../../node_modules/vue/dist/vue.runtime.esm-bundler.js",
       "file": "vue.js",
-      "fileHash": "5c7c354e",
+      "fileHash": "6177bec1",
       "needsInterop": false
     },
     "vitepress > @vue/devtools-api": {
       "src": "../../../node_modules/@vue/devtools-api/dist/index.js",
       "file": "vitepress___@vue_devtools-api.js",
-      "fileHash": "4ff76e82",
+      "fileHash": "55d541db",
       "needsInterop": false
     },
     "vitepress > @vueuse/core": {
       "src": "../../../node_modules/@vueuse/core/index.mjs",
       "file": "vitepress___@vueuse_core.js",
-      "fileHash": "ddb016a9",
+      "fileHash": "bf9ced66",
       "needsInterop": false
     },
     "vitepress > @vueuse/integrations/useFocusTrap": {
       "src": "../../../node_modules/@vueuse/integrations/useFocusTrap.mjs",
       "file": "vitepress___@vueuse_integrations_useFocusTrap.js",
-      "fileHash": "f1dc281a",
+      "fileHash": "79f836fe",
       "needsInterop": false
     },
     "vitepress > mark.js/src/vanilla.js": {
       "src": "../../../node_modules/mark.js/src/vanilla.js",
       "file": "vitepress___mark__js_src_vanilla__js.js",
-      "fileHash": "f86e698d",
+      "fileHash": "ff322f2a",
       "needsInterop": false
     },
     "vitepress > minisearch": {
       "src": "../../../node_modules/minisearch/dist/es/index.js",
       "file": "vitepress___minisearch.js",
-      "fileHash": "6f580467",
+      "fileHash": "d295f707",
       "needsInterop": false
     }
   },

packages/documentation/docs/index.md

@@ -1,28 +1,34 @@
-![UI5 logo](images/UI5_logo_wide.png)
+![UI5 logo](./images/UI5_logo_wide.png)
 
 # UI5 CLI
 
 An open and modular toolchain to develop state-of-the-art applications based on the [UI5](https://ui5.sap.com) framework.
 
-!!! abstract "Project Rename"
-	**UI5 Tooling has been renamed to UI5 CLI 🚨**
+::: warning Project Rename
+**UI5 Tooling has been renamed to UI5 CLI 🚨**
 
-	Read the announcement blog post: **[SAP Community: Goodbye UI5 Tooling - Hello UI5 CLI!](https://community.sap.com/t5/technology-blog-posts-by-sap/goodbye-ui5-tooling-hello-ui5-cli/ba-p/14211769)**
+Read the announcement blog post: **[SAP Community: Goodbye UI5 Tooling - Hello UI5 CLI!](https://community.sap.com/t5/technology-blog-posts-by-sap/goodbye-ui5-tooling-hello-ui5-cli/ba-p/14211769)**
+:::
 
-!!! tip "New Release"
-	**UI5 CLI V4 is here 🎉**
+::: tip New Release
+**UI5 CLI V4 is here 🎉**
 
-	Read the announcement blog post: **[SAP Community: UI5 CLI 4.0](https://community.sap.com/t5/technology-blogs-by-sap/ui5-tooling-4-0/ba-p/13769578)**
+Read the announcement blog post: **[SAP Community: UI5 CLI 4.0](https://community.sap.com/t5/technology-blogs-by-sap/ui5-tooling-4-0/ba-p/13769578)**
 
-    And checkout the **[Migrate to v4](./updates/migrate-v4.md)** documentation.
+And checkout the **[Migrate to v4](./updates/migrate-v4)** documentation.
+:::
 
-[**Get Started**](./pages/GettingStarted.md){: .md-button .md-button--primary .sap-icon-initiative }
+<div style="margin: 2rem 0;">
+  <a href="./pages/GettingStarted" style="display: inline-block; padding: 12px 24px; background: #1976d2; color: white; text-decoration: none; border-radius: 6px; font-weight: 600;">
+    🚀 Get Started
+  </a>
+</div>
 
 ## Main Features
 
 ### 💻 UI5 CLI
 
-*Also see the [UI5 CLI Documentation](./pages/CLI.md)*
+*Also see the [UI5 CLI Documentation](./pages/CLI)*
 
 ```sh
 # Global
@@ -35,7 +41,7 @@ npm install --save-dev @ui5/cli
 #### ⚙️ Project Setup
 
 Configure your project for use with UI5 CLI.  
-*Also see the [Configuration Documentation](./pages/Configuration.md)*
+*Also see the [Configuration Documentation](./pages/Configuration)*
 
 ```
 ❯ ui5 init
@@ -64,7 +70,7 @@ Added framework libraries sap.ui.core sap.m themelib_sap_fiori_3 as dependencies
 #### 🏄 Development Server
 
 Start a local development server to work on your project.  
-*Also see the [Server Documentation](./pages/Server.md)*
+*Also see the [Server Documentation](./pages/Server)*
 
 ```
 ❯ ui5 serve
@@ -75,7 +81,7 @@ URL: http://localhost:8080
 #### 🛠 Build for Production
 
 Build an optimized version of your project.  
-*Also see the [Builder Documentation](./pages/Builder.md)*
+*Also see the [Builder Documentation](./pages/Builder)*
 
 ``` bash
 ❯ ui5 build
@@ -101,38 +107,38 @@ This allows you to rely on UI5 CLI for UI5-specific build functionality and proj
 
 All available APIs are documented in the [UI5 CLI API Reference](https://ui5.github.io/cli/v4/api/index.html).
 
-=== "ESM"
-
-    ```js linenums="1"
-    import {graphFromPackageDependencies} from "@ui5/project/graph";
-
-    async function buildApp(projectPath, destinationPath) {
-        const graph = await graphFromPackageDependencies({
-            cwd: projectPath
-        });
-        await graph.build({
-            destPath: destinationPath,
-            selfContained: true,
-            excludedTasks: ["transformBootstrapHtml"],
-            includedDependencies: ["*"]
-        });
-    }
-    ```
-
-=== "CommonJS"
-
-    ```js linenums="1"
-    async function buildApp(projectPath, destinationPath) {
-        const {graphFromPackageDependencies} = 
-            await import("@ui5/project/graph");
-        const graph = await graphFromPackageDependencies({
-            cwd: projectPath
-        });
-        await graph.build({
-            destPath: destinationPath,
-            selfContained: true,
-            excludedTasks: ["transformBootstrapHtml"],
-            includedDependencies: ["*"]
-        });
-    }
-    ```
+#### ESM
+
+```js linenums="1
+import {graphFromPackageDependencies} from "@ui5/project/graph";
+
+async function buildApp(projectPath, destinationPath) {
+    const graph = await graphFromPackageDependencies({
+        cwd: projectPath
+    });
+    await graph.build({
+        destPath: destinationPath,
+        selfContained: true,
+        excludedTasks: ["transformBootstrapHtml"],
+        includedDependencies: ["*"]
+    });
+}
+```
+
+#### CommonJS
+
+```js linenums="1
+async function buildApp(projectPath, destinationPath) {
+    const {graphFromPackageDependencies} = 
+        await import("@ui5/project/graph");
+    const graph = await graphFromPackageDependencies({
+        cwd: projectPath
+    });
+    await graph.build({
+        destPath: destinationPath,
+        selfContained: true,
+        excludedTasks: ["transformBootstrapHtml"],
+        includedDependencies: ["*"]
+    });
+}
+```

packages/documentation/docs/pages/Benchmarking.md

@@ -102,11 +102,11 @@ The following is a walk-through on how to evaluate the performance impact of an
 1. Prepare your change
     1. Switch to the branch that contains your change
         ```sh
-        (cd ../ui5-builder && git checkout my-change)
+        (cd ../pages/ui5-builder && git checkout my-change)
         ```
     1. If your change requires different npm dependencies, reinstall them
         ```sh
-        (cd ../ui5-builder && npm install)
+        (cd ../pages/ui5-builder && npm install)
         ```
     1. The link from UI5 CLI is still in place. However, if you have changes in **multiple** UI5 CLI modules, you might need to `npm link` those again
 

packages/documentation/docs/pages/Builder.md

@@ -4,16 +4,20 @@ The [UI5 Builder](https://github.com/SAP/ui5-builder) module takes care of build
 
 Based on a project's type, the UI5 Builder defines a series of build steps to execute; these are also called "tasks".
 
-For every type there is a set of default tasks. You can disable single tasks using the `--exclude-task` [CLI parameter](./CLI.md#ui5-build), and you can include tasks using the `--include-task` parameter.
+For every type there is a set of default tasks. You can disable single tasks using the `--exclude-task` [CLI parameter](./CLI#ui5-build), and you can include tasks using the `--include-task` parameter.
 
-[**API Reference**](https://ui5.github.io/cli/v4/api/index.html){: .md-button .sap-icon-initiative }
+<div style="margin: 1rem 0;">
+  <a href="https://ui5.github.io/cli/v4/api/index.html" target="_blank" style="display: inline-block; padding: 8px 16px; background: #1976d2; color: white; text-decoration: none; border-radius: 4px; font-weight: 600; font-size: 14px;">
+    📚 API Reference
+  </a>
+</div>
 
 ## Tasks
 Tasks are specific build steps to be executed during build phase.
 
 They are responsible for collecting resources which can be modified by a processor. A task configures one or more processors and supplies them with the collected resources. After the respective processor processed the resources, the task is able to continue with its workflow.
 
-A project can add custom tasks to the build by using the [Custom Tasks Extensibility](./extensibility/CustomTasks.md).
+A project can add custom tasks to the build by using the [Custom Tasks Extensibility](./extensibility/CustomTasks).
 
 ### Standard Tasks
 
@@ -43,14 +47,14 @@ All available standard tasks are documented [in the API reference](https://ui5.g
 | generateApiIndex               | *disabled* ^1^     |                |                      |
 | generateResourcesJson          | *disabled*         | *disabled*     | *disabled*           |
 
-*Disabled tasks can be activated by certain build modes, the project configuration, or by using the `--include-task` [CLI parameter](./CLI.md#ui5-build). See footnotes where given*
+*Disabled tasks can be activated by certain build modes, the project configuration, or by using the `--include-task` [CLI parameter](./CLI#ui5-build). See footnotes where given*
 
 ---
 
 ^1^ Enabled in `jsdoc` build, which disables most of the other tasks  
-^2^ Enabled for projects defining a [component preload configuration](./Configuration.md#component-preload-generation)  
+^2^ Enabled for projects defining a [component preload configuration](./Configuration#component-preload-generation)  
 ^3^ Enabled in `self-contained` build, which disables `generateComponentPreload` and `generateLibraryPreload`  
-^4^ Enabled for projects defining a [bundle configuration](./Configuration.md#custom-bundling)  
+^4^ Enabled for projects defining a [bundle configuration](./Configuration#custom-bundling)  
 ^5^ Can be enabled for framework projects via the `includeTask` option. For other projects, this task is skipped
 
 ### minify
@@ -65,24 +69,30 @@ Related to this, the bundling tasks will also incorporate the generated source m
 
 #### Input Source Maps
 
-!!! info
-	Support for input source maps has been added in UI5 CLI [`v3.7.0`](https://github.com/SAP/ui5-cli/releases/tag/v3.7.0).
+::: info Info
+Support for input source maps has been added in UI5 CLI [`v3.7.0`](https://github.com/SAP/ui5-cli/releases/tag/v3.7.0).
+
+:::
 
 For projects facilitating transpilation (such as TypeScript-based projects), it is commonly desired to debug in the browser using the original sources, e.g. TypeScript files. To make this work, the transpilation process first needs to create source maps and reference them in the generated JavaScript code.
 
 UI5 CLI's `minify` task will then find this reference and incorporate the source map into the minification process. In the end, the minified JavaScript resources will reference an updated source map, which reflects the transpilation as well as the minification. The browser can use this to map every statement back to the original TypeScript file, making debugging a breeze.
 
-!!! warning
-    If a resource has been modified by another build task before `minify` is executed, any referenced source map will be ignored. This is to ensure the integrity of the source maps in the build result.
+::: warning Warning
+If a resource has been modified by another build task before `minify` is executed, any referenced source map will be ignored. This is to ensure the integrity of the source maps in the build result.
+
+It is possible that the modification of the resource content is not reflected in the associated source map, rendering it corrupted. A corrupt source map can make it impossible to properly analyze and debug a resource in the browser development tools.
 
-    It is possible that the modification of the resource content is not reflected in the associated source map, rendering it corrupted. A corrupt source map can make it impossible to properly analyze and debug a resource in the browser development tools.
+Standard tasks which may modify resources without updating the associated source maps currently include `replaceVersion`, `replaceCopyright` and `replaceBuildtime`.
 
-    Standard tasks which may modify resources without updating the associated source maps currently include `replaceVersion`, `replaceCopyright` and `replaceBuildtime`.
+:::
 
 Expand the block below to view a diagram illustrating the minification process and source map handling.
 
-??? info "Minification Activity Diagram"
-    ![minify Task Activity](../images/UI5_CLI/Task_Minify.svg){ loading=lazy }
+::: info Minification Activity Diagram
+ ![minify Task Activity](../images/UI5_CLI/Task_Minify.svg)
+
+:::
 
 
 ### Generation of Supported Locales
@@ -156,7 +166,7 @@ UI5 CLI packages JavaScript files that require "top level scope" as a string, pr
 
 This ensures that the script works as expected, e.g. with regards to implicitly used globals. However, this `eval` runtime feature will be discontinued with UI5 2.x because of [security best practices](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) and to comply with stricter CSP settings (i.e. [unsafe-eval](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src#unsafe_eval_expressions)).
 
-If your project defines [Specification Version 4.0](./Configuration.md#specification-version-40) or higher, files requiring top level scope are no longer part of the created bundle and following error is logged by UI5 CLI:
+If your project defines [Specification Version 4.0](./Configuration#specification-version-40) or higher, files requiring top level scope are no longer part of the created bundle and following error is logged by UI5 CLI:
 >  Module myFancyModule requires top level scope and can only be embedded as a string (requires 'eval'), which is not supported with specVersion 4.0 and higher.
 
 If you see this error message, please adjust your code by applying one of the following options:
@@ -166,17 +176,19 @@ If you see this error message, please adjust your code by applying one of the fo
 **Option 2**: Wrap the respective files manually in `sap.ui.define` modules as shown below:
 
 
-!!! example
-    **Before**:
-    ```js
-    const myFancyModule = {};
-    ```
+::: details Example
+**Before**:
+```js
+const myFancyModule = {};
+```
 
-    **After**:
-    ```js
-    sap.ui.define([], () => {
-        "use strict";
-        const myFancyModule = {};
-        return myFancyModule;
-    });
-    ```
+**After**:
+```js
+sap.ui.define([], () => {
+    "use strict";
+    const myFancyModule = {};
+    return myFancyModule;
+});
+```
+
+:::

packages/documentation/docs/pages/CodeAnalysis.md

@@ -88,27 +88,27 @@ The **XMLComposite** control is deprecated since version UI5 1.88. Nevertheless,
 
 The [XML Composite Analyzer](https://github.com/SAP/ui5-builder/blob/main/lib/lbt/analyzer/XMLCompositeAnalyzer.js) searches for the name of the configured fragment containing the **XMLComposite** control.
 
-=== "Name of the XMLComposite is equal to fragment name"
-
-    ```javascript hl_lines="4"
-    sap.ui.define([
-        "sap/ui/core/XMLComposite"
-    ], function(XMLComposite) {
-        return XMLComposite.extend("composites.MyComposite", {} 
-    });
-    ```
-
-=== "Dedicated fragment name"
-
-    ```javascript hl_lines="5"
-    sap.ui.define([
-        "sap/ui/core/XMLComposite"
-    ], function(XMLComposite) {
-        return XMLComposite.extend("composites.MyComposite", {
-            fragment: "composites.custom.MyComposite"
-        } 
-    });
-    ```
+#### Name of the XMLComposite is equal to fragment name
+
+```js
+sap.ui.define([
+    "sap/ui/core/XMLComposite"
+], function(XMLComposite) {
+    return XMLComposite.extend("composites.MyComposite", {} 
+});
+```
+
+#### Dedicated fragment name
+
+```js
+sap.ui.define([
+    "sap/ui/core/XMLComposite"
+], function(XMLComposite) {
+    return XMLComposite.extend("composites.MyComposite", {
+        fragment: "composites.custom.MyComposite"
+    } 
+});
+```
 
 ## Library Initialization
 
@@ -128,7 +128,7 @@ Note: Currently only the usage via the global `sap.ui.getCore().initLibrary` is
 
 The UI5 CLI offers a JSDoc build, which is enhanced by UI5-specific JSDoc features.
 
-An UI5 SDK can be built locally. To get more insight into the local UI5 SDK build setup, have a look at our [Developer's Guide](https://github.com/SAP/openui5/blob/-/docs/developing.md#building-the-openui5-sdk-demo-kit).
+An UI5 SDK can be built locally. To get more insight into the local UI5 SDK build setup, have a look at our [Developer's Guide](https://github.com/SAP/openui5/blob/-/docs/developing#building-the-openui5-sdk-demo-kit).
 
 Currently, the resources needed for a UI5 SDK build are stored in [openui5](https://github.com/SAP/openui5/tree/-/lib/jsdoc) and in [ui5-builder](https://github.com/SAP/ui5-builder/blob/main/lib/processors/jsdoc). This double maintenance is needed because these files are not part of the `sap.ui.core` library artefact, so building JSDoc for any library has no access to the needed resources. It's therefore necessary to have these resources also available in the *ui5-builder*. This might change in the future.