nuxt-layer-core 2.0.1

package/app/plugins/sdk.ts

@@ -0,0 +1,29 @@
+// plugins/sdk.ts
+
+import { SDK } from "@longvansoftware/service-js-client";
+// import { SDK } from "../../../storefront-js-client/src/lib/SDK";
+import { useRuntimeConfig } from '#app'
+
+export default defineNuxtPlugin(nuxtApp => {
+    if (nuxtApp?.vueApp?.config?.globalProperties?.$sdk) return;
+
+    const config = useRuntimeConfig();
+
+    // Ép kiểu từ `unknown` thành kiểu cụ thể
+    const { ORG_ID, STORE_ID, ENVIROMENT } = config.public as unknown as {
+        ORG_ID: string;
+        STORE_ID: string;
+        ENVIROMENT: string;
+    };
+
+    // Tạo instance SDK
+    const sdkInstance = new SDK(
+        ORG_ID,
+        STORE_ID,
+        "U2FsdGVkX1/Cci00sR9oVNTJxPhwM7jKkQP6xg97IVI=",
+        ENVIROMENT
+    );
+
+    // Inject vào nuxtApp để sử dụng toàn ứng dụng
+    nuxtApp.provide("sdk", sdkInstance);
+});

package/app/types/sdk.d.ts

@@ -0,0 +1,15 @@
+import type { SDK } from '../../../storefront-js-client/src/lib/SDK'
+
+declare module '#app' {
+  interface NuxtApp {
+    $sdk: SDK
+  }
+}
+
+declare module 'vue' {
+  interface ComponentCustomProperties {
+    $sdk: SDK
+  }
+}
+
+export {}

package/components.json

@@ -0,0 +1,24 @@
+{
+  "$schema": "https://shadcn-vue.com/schema.json",
+  "style": "reka-nova",
+  "font": "inter",
+  "typescript": true,
+  "tailwind": {
+    "config": "tailwind.config.js",
+    "css": "app/assets/css/main.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "rtl": false,
+  "pointer": false,
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "composables": "@/composables"
+  },
+  "registries": {}
+}

package/nuxt.config.ts

@@ -0,0 +1,104 @@
+export default defineNuxtConfig({
+  srcDir: "app/",
+
+  compatibilityDate: "2025-04-25",
+
+  ssr: true,
+
+  devtools: {
+    enabled: true,
+  },
+
+  future: {
+    compatibilityVersion: 4,
+  },
+
+  extends: [
+    "./app/layers/solution/app"
+  ],
+
+  typescript: {
+    strict: true,
+    typeCheck: false,
+  },
+
+  modules: [
+    "@pinia/nuxt",
+    "@nuxt/icon",
+    "@nuxt/image",
+    "@nuxtjs/tailwindcss",
+    "@nuxtjs/sitemap",
+    "@nuxtjs/strapi",
+    "nuxt-gtag",
+    // "./app/modules/layer-route-priority"
+  ],
+
+  // CSS loaded by consuming project via ~/assets/css/layer.css
+  // to ensure correct resolution when layer is in node_modules
+  // css: [
+  //   "~/assets/css/main.css",
+  // ],
+
+  imports: {
+    dirs: [
+      "stores",
+      "services",
+      "utils",
+      "types",
+      "constants",
+      "hooks",
+    ],
+  },
+
+  components: [
+    {
+      path: "~/components",
+      pathPrefix: false,
+    },
+  ],
+
+  image: {
+    provider: "ipx",
+  },
+
+  icon: {
+    serverBundle: {
+      collections: ['lucide']
+    },
+    clientBundle: {
+      scan: false,
+    }
+  },
+
+  tailwindcss: {
+    viewer: false,
+  },
+
+  runtimeConfig: {
+    public: {
+      ORG_ID: process.env.ORG_ID,
+      STORE_ID: process.env.STORE_ID,
+      ENVIROMENT: process.env.ENVIROMENT,
+      ACCESSTOKEN_NAME: process.env.ACCESSTOKEN_NAME || 'accessToken',
+    },
+  },
+
+  hooks: {
+    "pages:extend"(pages) {
+
+      const layerPages = pages.filter(page =>
+        page.file?.includes("layers")
+      )
+
+      const sourcePages = pages.filter(page =>
+        !page.file?.includes("layers")
+      )
+
+
+      console.log("Layer pages", layerPages)
+      console.log("Source pages", sourcePages)
+
+    },
+  },
+
+});

package/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "nuxt-layer-core",
+  "type": "module",
+  "private": false,
+  "version": "2.0.1",
+  "scripts": {
+    "build": "env-cmd -f .env nuxt build",
+    "dev": "env-cmd -f .env nuxt dev"
+  },
+  "dependencies": {
+    "@longvansoftware/service-js-client": "2.8.6",
+    "@lucide/vue": "^1.28.0",
+    "@nuxt/icon": "^2.1.0",
+    "@nuxt/image": "^2.0.0",
+    "@nuxtjs/sitemap": "^7.4.7",
+    "@nuxtjs/strapi": "^2.1.1",
+    "@nuxtjs/tailwindcss": "^6.14.0",
+    "@pinia/nuxt": "^0.11.3",
+    "@splidejs/vue-splide": "^0.6.12",
+    "@vueuse/core": "^14.4.0",
+    "aos": "^2.3.4",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "crypto-js": "^4.2.0",
+    "env-cmd": "^11.0.0",
+    "feather-icons": "^4.29.2",
+    "ipx": "^3.1.1",
+    "js-cookie": "^3.0.5",
+    "nuxt": "4.2.1",
+    "nuxt-gtag": "^4.1.0",
+    "pinia": "^3.0.4",
+    "qs": "^6.14.0",
+    "tailwind-merge": "^3.6.0",
+    "vue": "^3.5.24",
+    "vue-router": "^4.6.3",
+    "vue-sonner": "^2.0.9"
+  },
+  "packageManager": "yarn@1.22.22+sha1.ac34549e6aa8e7ead463a7407e1c7390f61a6610",
+  "devDependencies": {
+    "@iconify-json/lucide": "^1.2.120",
+    "@types/js-cookie": "^3.0.6",
+    "@types/node": "^24.10.1",
+    "@types/qs": "^6.14.0",
+    "autoprefixer": "10.4.20",
+    "postcss": "8.4.35",
+    "sass": "^1.94.2",
+    "shadcn-vue": "^2.8.1",
+    "tailwindcss": "3.4.15",
+    "tw-animate-css": "^1.4.0",
+    "vite-tsconfig-paths": "^5.1.4"
+  }
+}

package/tailwind.config.js

@@ -0,0 +1,96 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    darkMode: ["class"],
+    content: [
+        "./components/**/*.{vue,ts,js}",
+        "./layouts/**/*.{vue,ts,js}",
+        "./pages/**/*.{vue,ts,js}",
+        "./app.vue",
+        "./layers/**/*.{vue,ts,js}",
+    ],
+    theme: {
+    	extend: {
+    		keyframes: {
+    			'gentle-float': {
+    				'0%, 100%': { transform: 'translateY(0)' },
+    				'50%': { transform: 'translateY(-8px)' },
+    			},
+    		},
+    		animation: {
+    			'float': 'gentle-float 5s ease-in-out infinite',
+    			'float-delayed': 'gentle-float 5s ease-in-out 1.2s infinite',
+    		},
+    		borderRadius: {
+    			lg: 'var(--radius)',
+    			md: 'calc(var(--radius) - 2px)',
+    			sm: 'calc(var(--radius) - 4px)'
+    		},
+    		colors: {
+    			background: 'hsl(var(--background))',
+    			foreground: 'hsl(var(--foreground))',
+    			card: {
+    				DEFAULT: 'hsl(var(--card))',
+    				foreground: 'hsl(var(--card-foreground))'
+    			},
+    			popover: {
+    				DEFAULT: 'hsl(var(--popover))',
+    				foreground: 'hsl(var(--popover-foreground))'
+    			},
+    			primary: {
+    				DEFAULT: 'hsl(var(--primary))',
+    				foreground: 'hsl(var(--primary-foreground))'
+    			},
+    			secondary: {
+    				DEFAULT: 'hsl(var(--secondary))',
+    				foreground: 'hsl(var(--secondary-foreground))'
+    			},
+    			muted: {
+    				DEFAULT: 'hsl(var(--muted))',
+    				foreground: 'hsl(var(--muted-foreground))'
+    			},
+    			accent: {
+    				DEFAULT: 'hsl(var(--accent))',
+    				foreground: 'hsl(var(--accent-foreground))'
+    			},
+    			destructive: {
+    				DEFAULT: 'hsl(var(--destructive))',
+    				foreground: 'hsl(var(--destructive-foreground))'
+    			},
+    			border: 'hsl(var(--border))',
+    			input: 'hsl(var(--input))',
+    			ring: 'hsl(var(--ring))',
+    			chart: {
+    				'1': 'hsl(var(--chart-1))',
+    				'2': 'hsl(var(--chart-2))',
+    				'3': 'hsl(var(--chart-3))',
+    				'4': 'hsl(var(--chart-4))',
+    				'5': 'hsl(var(--chart-5))'
+    			}
+    		}
+    	}
+    },
+    plugins: [
+        function({ addUtilities }) {
+            addUtilities({
+                '.bg-grid': {
+                    'background-image': 'linear-gradient(to right, rgba(15, 23, 42, 0.05) 1px, transparent 1px), linear-gradient(to bottom, rgba(15, 23, 42, 0.05) 1px, transparent 1px)',
+                    'background-size': '40px 40px',
+                },
+                '[data-reveal]': {
+                    'opacity': '0',
+                    'transform': 'translateY(28px)',
+                    'transition': 'opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1)',
+                    'will-change': 'opacity, transform',
+                },
+                '[data-reveal="fade"]': { 'transform': 'translateY(0)' },
+                '[data-reveal="left"]': { 'transform': 'translateX(-28px)' },
+                '[data-reveal="right"]': { 'transform': 'translateX(28px)' },
+                '[data-reveal="scale"]': { 'transform': 'scale(0.94)' },
+                '[data-reveal].reveal-visible': {
+                    'opacity': '1',
+                    'transform': 'translate(0, 0) scale(1)',
+                },
+            })
+        }
+    ],
+};

package/tsconfig.base.json

@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "strict": true,
+    "jsx": "preserve",
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "types": ["node", "nuxt"],
+    "baseUrl": ".",
+    "paths": {
+      "#app": [".nuxt/types/app.d.ts"],
+      "#app/*": [".nuxt/types/app/*"]
+    }
+  },
+  "exclude": ["node_modules", ".nuxt", "dist"]
+}

package/tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "extends": "./tsconfig.base.json",
+  "files": [],
+  "references": [
+    {
+      "path": "./.nuxt/tsconfig.app.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.server.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.shared.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.node.json"
+    }
+  ]
+}