chore: update format

.changeset/quick-cycles-add.md

@@ -9,4 +9,5 @@ For example:
 `SwSharedPrice.vue` is used for multiple times to display a price. Create a component with the same name to make `cms-base` start using your component internally.
 
 ---
+
 ⚠️ Internal components aren't part of public API so the related changes won't be published in the changelog. Try to overwrite and track the changes on your responsibility.

.github/ISSUE_TEMPLATE/📚-documentation-or-readme-md-issue-report.md

@@ -1,20 +1,18 @@
 ---
 name: "\U0001F4DA Documentation or README.md issue report"
 about: Report an issue in the project's documentation or README.md file.
-title: ''
+title: ""
 labels: documentation
-assignees: ''
-
+assignees: ""
 ---
 
 # **📚 Documentation Issue Report**
 
 ## **Describe the bug**
+
 <!-- A clear and concise description of what the bug is. -->
 
-*
-
----
+- ***
 
 ### **To Reproduce**
 
@@ -35,18 +33,19 @@ assignees: ''
 ---
 
 ### **Media prove**
+
 <!-- If applicable, add screenshots or videos to help explain your problem. -->
 
 ---
 
 ## **Describe the solution you'd like**
-<!-- A clear and concise description of what you want to happen. -->
 
-*
+<!-- A clear and concise description of what you want to happen. -->
 
----
+- ***
 
 ### **Additional context**
+
 <!-- Add any other context or additional information about the problem here.-->
 
-*
+-

.github/dependabot.yml

@@ -58,10 +58,11 @@ updates:
           - "@faker*"
           - "@codspeed/*"
           - "@playwright*"
-      prettier:
+      linter:
         patterns:
           - "prettier"
           - "@types/prettier"
+          - "@biome/*"
       vue:
         patterns:
           - "vue"

apps/docs/src/framework/requirements.md

@@ -30,7 +30,7 @@ Every development instance / setup template is pre-configured with a public demo
 For an ideal development experience, we recommend using [VSCode](https://code.visualstudio.com/download) with the following extensions
 
 - Vue Language Features (`Vue.volar`)
-- Prettier - Code Formatter (`esbenp.prettier-vscode`)
+- Biome - Code Formatter and linter (`biomejs.biome`)
 - TS and JS Language Features (`vscode.typescript-language-features`)
 
 If you are using the `demo-store-template`, we also recommend the following extension

apps/docs/src/getting-started/cms/customize-components.md

@@ -42,7 +42,7 @@ Now the CMS module will automatically resolve that file based on the name and yo
 
 ❗**Internal components are not a part of public API. Once overwritten you need to track the changes on your own.**
 
-There is also a possibility to override the internal components, shared between public blocks and elements, the ones starting with `Sw` prefix, like [SwSlider.vue](https://github.com/shopware/frontends/blob/main/packages/cms-base/components/SwSlider.vue) or [SwProductCard.vue](https://github.com/shopware/frontends/blob/main/packages/cms-base/components/SwProductCard.vue). 
+There is also a possibility to override the internal components, shared between public blocks and elements, the ones starting with `Sw` prefix, like [SwSlider.vue](https://github.com/shopware/frontends/blob/main/packages/cms-base/components/SwSlider.vue) or [SwProductCard.vue](https://github.com/shopware/frontends/blob/main/packages/cms-base/components/SwProductCard.vue).
 
 ### Additional Example
 

apps/docs/src/getting-started/e-commerce/payments.md

@@ -125,10 +125,9 @@ See what can be achieved on Express Checkout example for PayPal provider.
 
 <PageRef page="../../../resources/integrations/payments/" title="Payment Integrations" sub="See also all our Payment Integrations." />
 
-
 ## App server integration
 
-When a payment method uses an app server, for example as a [gateway](https://developer.shopware.com/docs/guides/plugins/apps/gateways/checkout/checkout-gateway.html) or middleware, there are some key  information needed to identify the client source and the store related to the app itself.
+When a payment method uses an app server, for example as a [gateway](https://developer.shopware.com/docs/guides/plugins/apps/gateways/checkout/checkout-gateway.html) or middleware, there are some key information needed to identify the client source and the store related to the app itself.
 
 In detached API consumer like headless app, the mentioned information can be obtained by using a [tailored endpoint](https://developer.shopware.com/docs/guides/plugins/apps/clientside-to-app-backend.html):
 
@@ -137,37 +136,41 @@ In detached API consumer like headless app, the mentioned information can be obt
 ```ts
 const { apiClient } = useShopwareContext(); // or use an instance of @shopware/api-client library
 
-const tokenResponse = await apiClient.invoke("generateJWTAppSystemAppServer post /app-system/{name}/generate-token", {
-  pathParams: {
-    name: "MyPaymentApp"
-  }
-})
+const tokenResponse = await apiClient.invoke(
+  "generateJWTAppSystemAppServer post /app-system/{name}/generate-token",
+  {
+    pathParams: {
+      name: "MyPaymentApp",
+    },
+  },
+);
 ```
 
 The response may look like this:
+
 ```json
 // tokenResponse:
 {
-    "token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJVZXF4S1RtSHBKVHZmZkRQIiwiaWF0IjoxNzMzNDA5NTM3LjQ1NzYxMSwibmJmIjoxNzMzNDA5NTM3LjQ1NzYxMywiZXhwIjoxNzMzNDEwMTM3LjQ1BzUzOSwic2FsZXNDaGFubmVsSWQiOiI4ODQzMmRlZjM5ZmM0NjI0YjMzMjEzYTU2YjhjOTQ0ZCJ9.M2GZ6hFFBgQAgoAQAVC--aIG2pl5wytEBBwpCN0UFCw",
-    "expires": "2024-12-05T14:48:57+00:00",
-    "shopId": "QeqxZlmHpJBvfvDP"
+  "token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJVZXF4S1RtSHBKVHZmZkRQIiwiaWF0IjoxNzMzNDA5NTM3LjQ1NzYxMSwibmJmIjoxNzMzNDA5NTM3LjQ1NzYxMywiZXhwIjoxNzMzNDEwMTM3LjQ1BzUzOSwic2FsZXNDaGFubmVsSWQiOiI4ODQzMmRlZjM5ZmM0NjI0YjMzMjEzYTU2YjhjOTQ0ZCJ9.M2GZ6hFFBgQAgoAQAVC--aIG2pl5wytEBBwpCN0UFCw",
+  "expires": "2024-12-05T14:48:57+00:00",
+  "shopId": "QeqxZlmHpJBvfvDP"
 }
 ```
 
 Since the endpoint returns a `jwt` token containing all required data to identify the further requests: `salesChannelId` and `shopId`. Therefore using the `jwt` token should be the only way of authorization, in a request's header. The token is valid for 10 minutes by default.
 
 For example:
+
 ```ts
 await fetch("https://shopware.mypaymentgateway.com/api/store/card", {
   method: "POST",
   headers: {
     "Content-Type": "application/json",
-    "Authorization": `Bearer ${tokenResponse.data?.token}` // jwt token from the sample code above
+    Authorization: `Bearer ${tokenResponse.data?.token}`, // jwt token from the sample code above
   },
   body: JSON.stringify({
     cardId: "card_123",
     tokenId: "some-secret-token_123",
   }),
 });
 ```
-

examples/api-client-tutorial/package.json

@@ -22,7 +22,7 @@
     "@astrojs/check": "0.9.4",
     "@astrojs/react": "3.6.3",
     "@biomejs/biome": "1.8.3",
-    "@shopware/api-client": "1.1.2",
+    "@shopware/api-client": "canary",
     "@tutorialkit/astro": "1.1.1",
     "@tutorialkit/theme": "1.2.1",
     "@tutorialkit/types": "1.1.1",

package.json

@@ -17,9 +17,9 @@
     "test:watch": "turbo run test:watch",
     "test:bench": "turbo run test:bench -- --run",
     "test:e2e": "turbo run test:e2e",
-    "format": "prettier --write \"**/*.{ts,tsx,md,vue}\"",
+    "format": "biome format --write .",
     "version": "changeset version",
-    "postversion": "pnpm i && pnpm run versionReadme",
+    "postversion": "pnpm i && pnpm format && pnpm run versionReadme",
     "versionReadme": "esno scripts/addChangelogBodyToReadmeFile.ts",
     "prepare": "husky",
     "generate-types": "turbo run generate-types",

packages/cms-base/README.md

@@ -89,11 +89,12 @@ See a [short guide](https://frontends.shopware.com/getting-started/cms/content-p
 
 ## 📘 Available components
 
- The list of available blocks and elements is [here](https://frontends.shopware.com/packages/cms-base.html#available-components).
+The list of available blocks and elements is [here](https://frontends.shopware.com/packages/cms-base.html#available-components).
 
 ## 🔄 Overwriting components
 
 The procedure is:
+
 - find a component in component's [list](https://frontends.shopware.com/packages/cms-base.html#available-components), using a [Vue devtools](https://devtools.vuejs.org/) or browsing the github [repository](https://github.com/shopware/frontends/tree/main/packages/cms-base/components)
 - take its name
 - create a file with the same name and place it into `~/components` dir in your nuxt project (or wherever according your nuxt config)
@@ -104,7 +105,7 @@ The procedure is:
 
 ❗**Internal components are not a part of public API. Once overwritten you need to track the changes on your own.**
 
-There is also a possibility to override the internal components, shared between public blocks and elements, the ones starting with `Sw` prefix, like [SwSlider.vue](https://github.com/shopware/frontends/blob/main/packages/cms-base/components/SwSlider.vue) or [SwProductCard.vue](https://github.com/shopware/frontends/blob/main/packages/cms-base/components/SwProductCard.vue). 
+There is also a possibility to override the internal components, shared between public blocks and elements, the ones starting with `Sw` prefix, like [SwSlider.vue](https://github.com/shopware/frontends/blob/main/packages/cms-base/components/SwSlider.vue) or [SwProductCard.vue](https://github.com/shopware/frontends/blob/main/packages/cms-base/components/SwProductCard.vue).
 
 An example: some components use `SwSharedPrice.vue` to show prices with corresponding currency for products in many places like product card, product details page and so on. In order to change the way how the price is displayed consistently - create a one component with a name `SwSharedPrice.vue` and that's it. The new component will be used everywhere where is "imported" (autoimported actually).
 

templates/vue-demo-store/pages/registration/confirm.vue

@@ -45,7 +45,9 @@ onMounted(async () => {
   <div class="flex justify-center items-center my-20">
     <div v-if="!alreadyConfirmedError" class="flex flex-row items-center">
       <p class="text-15">{{ $t("account.messages.verifying") }}</p>
-      <div class="ml-10 size-15 i-carbon-circle-dash animate-spin animate-count-infinite animate-duration-2000" />
+      <div
+        class="ml-10 size-15 i-carbon-circle-dash animate-spin animate-count-infinite animate-duration-2000"
+      />
     </div>
     <div v-else class="text-red flex items-center gap-5">
       <div class="w-10 h-10 i-carbon-error" />