@shopware/cms-base-layer 3.1.0 → 4.0.0

package/app/utils/useSelectedListingFilters.test.ts

@@ -8,17 +8,27 @@ import {
 describe("applyQueryToFilters", () => {
   it("populates sets from pipe-joined values", () => {
     const state = createEmptyFilterState();
-    applyQueryToFilters(state, { manufacturer: "a|b", properties: "x" });
+    applyQueryToFilters(state, {
+      manufacturer: "a|b",
+      properties: "x",
+      categories: "c1|c2",
+    });
     expect([...state.manufacturer]).toEqual(["a", "b"]);
     expect([...state.properties]).toEqual(["x"]);
+    expect([...state.categories]).toEqual(["c1", "c2"]);
   });
 
   it("clears removed filters when the query no longer has them (Back/Forward)", () => {
     const state = createEmptyFilterState();
-    applyQueryToFilters(state, { manufacturer: "a|b", search: "shirt" });
-    applyQueryToFilters(state, { search: "shirt" }); // manufacturer removed
+    applyQueryToFilters(state, {
+      manufacturer: "a|b",
+      categories: "c1",
+      search: "shirt",
+    });
+    applyQueryToFilters(state, { search: "shirt" }); // manufacturer + categories removed
     expect(state.manufacturer.size).toBe(0);
     expect(state.properties.size).toBe(0);
+    expect(state.categories.size).toBe(0);
   });
 
   it("clears removed scalar filters on resync", () => {

package/app/utils/useSelectedListingFilters.ts

@@ -8,6 +8,7 @@ import { firstQueryValue, toNumber } from "./routeQuery";
 export type FilterState = {
   manufacturer: Set<string>;
   properties: Set<string>;
+  categories: Set<string>;
   "min-price": number | undefined;
   "max-price": number | undefined;
   rating: number | undefined;
@@ -18,6 +19,7 @@ export type FilterState = {
 export const createEmptyFilterState = (): FilterState => ({
   manufacturer: new Set<string>(),
   properties: new Set<string>(),
+  categories: new Set<string>(),
   "min-price": undefined,
   "max-price": undefined,
   rating: undefined,
@@ -46,13 +48,14 @@ export const applyQueryToFilters = (
   //    (props bound to them stay reactive); replace scalars with undefined.
   state.manufacturer.clear();
   state.properties.clear();
+  state.categories.clear();
   state["min-price"] = undefined;
   state["max-price"] = undefined;
   state.rating = undefined;
   state["shipping-free"] = undefined;
 
   // 2) Repopulate from the current query.
-  for (const code of ["manufacturer", "properties"] as const) {
+  for (const code of ["manufacturer", "properties", "categories"] as const) {
     const value = firstQueryValue(query[code]);
     if (!value) continue;
     for (const element of value.split("|")) {
@@ -88,6 +91,9 @@ export const applyQueryToFilters = (
  */
 export const useSelectedListingFilters = (): UnwrapNestedRefs<FilterState> => {
   const route = useRoute();
+  // Fresh state per call, deliberately: the sidebar and the horizontal filter
+  // bar each hold their own selection object, so a mutation in one is invisible
+  // to the other until it reaches the route. The URL is what synchronises them.
   const state = reactive<FilterState>(createEmptyFilterState());
 
   // Initial parse (SSR + first client render).

package/component-dirs.json

@@ -0,0 +1,20 @@
+{
+  "dirs": [
+    {
+      "path": "./app/components",
+      "pattern": "Sw*",
+      "global": true
+    },
+    {
+      "path": "./app/components/public",
+      "pathPrefix": false,
+      "global": true
+    },
+    {
+      "path": "./app/components/ui",
+      "prefix": "Sw",
+      "global": true
+    }
+  ],
+  "excluded": ["SwMedia3D"]
+}

package/index.d.ts

@@ -1,7 +1,5 @@
 /// <reference types="@nuxt/schema" />
 
-export * from "@shopware/composables";
-export * from "./.nuxt/imports";
 
 type CmsBaseLayerAppConfig = {
   /** Placeholder shown while CMS images are loading */
@@ -42,3 +40,5 @@ declare module "@nuxt/schema" {
   interface AppConfig extends CmsBaseLayerAppConfig {}
   interface AppConfigInput extends CmsBaseLayerAppConfig {}
 }
+
+export {};

package/nuxt.config.ts

@@ -3,6 +3,8 @@ import type { NuxtConfig } from "@nuxt/schema";
 import { defineNuxtConfig } from "nuxt/config";
 import type { LoggingFunction, RollupLog } from "rollup";
 
+import componentDirs from "./component-dirs.json";
+
 const { resolve: resolveLayer } = createResolver(import.meta.url);
 
 export default defineNuxtConfig({
@@ -15,19 +17,15 @@ export default defineNuxtConfig({
   // the UnoCSS setup lives in @shopware/unocss-design-tokens-layer (or your own config),
   // so apps that don't use UnoCSS can still extend this layer.
   modules: ["@nuxt/image"],
+  css: [resolveLayer("./app/assets/css/rich-text.css")],
 
   hooks: {
     "components:extend"(components) {
       // Exclude SwMedia3D from auto-import to prevent bundling heavy 3D libraries
       // It should be dynamically imported when needed using defineAsyncComponent.
-      const index = components.findIndex(
-        (c) =>
-          c.pascalName === "SwMedia3D" ||
-          c.kebabName === "sw-media3-d" ||
-          c.filePath?.includes("SwMedia3D.vue"),
-      );
-      if (index > -1) {
-        components.splice(index, 1);
+      for (const name of componentDirs.excluded) {
+        const index = components.findIndex((c) => c.pascalName === name);
+        if (index > -1) components.splice(index, 1);
       }
     },
   },
@@ -90,26 +88,11 @@ export default defineNuxtConfig({
     },
   },
 
-  components: [
-    {
-      path: resolveLayer("./app/components"),
-      pattern: "Sw*",
-      extensions: [".vue"],
-      global: true,
-    },
-    {
-      path: resolveLayer("./app/components/ui"),
-      extensions: [".vue"],
-      prefix: "Sw",
-      global: true,
-    },
-    {
-      path: resolveLayer("./app/components/public"),
-      pathPrefix: false,
-      global: true,
-      extensions: [".vue"],
-    },
-  ],
+  components: componentDirs.dirs.map(({ path, ...dir }) => ({
+    ...dir,
+    path: resolveLayer(path),
+    extensions: [".vue"],
+  })),
   alias: {
     "@cms-assets": resolveLayer("./app/assets"),
   },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shopware/cms-base-layer",
-  "version": "3.1.0",
+  "version": "4.0.0",
   "description": "Vue CMS Nuxt Layer for Shopware",
   "author": "Shopware",
   "repository": {
@@ -21,20 +21,21 @@
   "license": "MIT",
   "type": "module",
   "main": "./nuxt.config.ts",
+  "exports": {
+    ".": "./nuxt.config.ts",
+    "./package.json": "./package.json"
+  },
   "files": [
-    "dist",
     "app",
-    "helpers",
-    "index.cjs",
+    "component-dirs.json",
     "index.d.ts",
-    "app.config.ts",
     "nuxt.config.ts"
   ],
   "dependencies": {
-    "@iconify-json/carbon": "1.2.24",
-    "@nuxt/image": "2.0.0",
-    "@nuxt/kit": "4.4.8",
-    "@tresjs/cientos": "5.7.2",
+    "@iconify-json/carbon": "1.2.26",
+    "@nuxt/image": "2.1.0",
+    "@nuxt/kit": "4.5.2",
+    "@tresjs/cientos": "5.8.1",
     "@tresjs/nuxt": "^5.6.3",
     "@vuelidate/core": "2.0.3",
     "@vuelidate/validators": "2.0.4",
@@ -42,34 +43,30 @@
     "entities": "8.0.0",
     "scule": "1.3.0",
     "html-to-ast": "0.0.6",
-    "three": "0.183.2",
-    "vue": "3.5.39",
+    "three": "0.185.1",
+    "vue": "3.5.42",
     "xss": "1.0.15",
-    "@shopware/api-client": "1.5.1",
-    "@shopware/composables": "1.12.1",
-    "@shopware/helpers": "1.7.2"
+    "@shopware/composables": "1.13.0",
+    "@shopware/api-client": "1.6.0",
+    "@shopware/helpers": "1.8.0"
   },
   "devDependencies": {
-    "@nuxt/schema": "4.4.8",
+    "@nuxt/schema": "4.5.2",
     "@types/three": "0.182.0",
     "@typescript/native-preview": "7.0.0-dev.20260205.1",
     "@vitest/coverage-v8": "4.1.10",
-    "nuxt": "4.4.8",
+    "nuxt": "4.5.2",
     "typescript": "5.9.3",
-    "unbuild": "3.6.1",
     "vitest": "4.1.10",
-    "vue-router": "5.1.0",
-    "vue-tsc": "3.3.7",
+    "vue-router": "5.2.0",
+    "vue-tsc": "3.3.9",
     "tsconfig": "0.0.0"
   },
   "scripts": {
-    "build": "nuxt prepare && unbuild",
-    "dev": "unbuild --stub",
     "lint": "oxlint . && oxfmt --check .",
     "lint:fix": "oxlint --fix . && oxfmt --write . && pnpm run typecheck",
     "typecheck": "pnpm nuxt prepare && tsgo --noEmit",
     "test": "vitest run",
-    "test:watch": "vitest",
-    "check-colors": "tsx scripts/check-unused-colors.ts"
+    "test:watch": "vitest"
   }
 }

package/dist/index.d.mts

@@ -1,5 +0,0 @@
-import * as _nuxt_schema from '@nuxt/schema';
-
-declare const _default: _nuxt_schema.NuxtModule<_nuxt_schema.ModuleOptions, _nuxt_schema.ModuleOptions, false>;
-
-export { _default as default };

package/dist/index.d.ts

@@ -1,5 +0,0 @@
-import * as _nuxt_schema from '@nuxt/schema';
-
-declare const _default: _nuxt_schema.NuxtModule<_nuxt_schema.ModuleOptions, _nuxt_schema.ModuleOptions, false>;
-
-export { _default as default };

package/dist/index.mjs

@@ -1,31 +0,0 @@
-import { resolve } from 'node:path';
-import { defineNuxtModule } from '@nuxt/kit';
-
-
-
-// -- Unbuild CommonJS Shims --
-import __cjs_url__ from 'url';
-import __cjs_path__ from 'path';
-import __cjs_mod__ from 'module';
-const __filename = __cjs_url__.fileURLToPath(import.meta.url);
-const __dirname = __cjs_path__.dirname(__filename);
-const require = __cjs_mod__.createRequire(import.meta.url);
-const index = defineNuxtModule({
-  meta: {
-    name: "@shopware/cms-base",
-    configKey: "shopware-cms"
-  },
-  setup(_, nuxt) {
-    nuxt.hook("components:dirs", (c) => {
-      c.push({
-        path: resolve(__dirname, "../components/public"),
-        global: true
-      });
-    });
-    nuxt.options.imports.transform = nuxt.options.imports.transform || {};
-    nuxt.options.imports.transform.include = nuxt.options.imports.transform?.include || [];
-    nuxt.options.imports.transform?.include.push(/.+cms-base.+/);
-  }
-});
-
-export { index as default };

package/index.cjs

@@ -1,7 +0,0 @@
-// CommonJS proxy to bypass jiti transforms from nuxt 2 and using native ESM
-module.exports = function (...args) {
-  return import("./dist/index.mjs").then((m) => m.default.call(this, ...args));
-};
-
-// eslint-disable-next-line
-module.exports.meta = require("./package.json");