@clikvn/showroom-visualizer 0.3.1 → 0.3.2

package/example/vite.config.ts

@@ -9,11 +9,11 @@ import autoprefixer from 'autoprefixer';
 // Custom plugin to handle CSS imports as strings (matching Rollup's postcss behavior)
 const cssAsStringPlugin = (): Plugin => {
   let postcssProcessor: any;
-  
+
   return {
     name: 'css-as-string',
     enforce: 'pre',
-    
+
     async configResolved(config) {
       // Initialize PostCSS processor with Tailwind
       postcssProcessor = postcss([
@@ -23,55 +23,60 @@ const cssAsStringPlugin = (): Plugin => {
         autoprefixer(),
       ]);
     },
-    
+
     async resolveId(source, importer) {
       // Handle CSS imports from the library
       if (source.endsWith('.css') && importer) {
         // Check if this is from our library (any src folder) or @clikvn packages
-        const isLibraryCSS = 
-          importer.includes('/showroom-visualizer/src/') || 
+        const isLibraryCSS =
+          importer.includes('/showroom-visualizer/src/') ||
           source.includes('@clikvn/');
-        
+
         if (isLibraryCSS) {
           // Resolve the full path
           let resolvedPath: string;
-          
+
           if (source.startsWith('.') || source.startsWith('/')) {
             resolvedPath = path.resolve(path.dirname(importer), source);
           } else if (source.startsWith('@clikvn/')) {
             // Handle @clikvn packages - look in parent node_modules
-            const packagePath = source.replace('@clikvn/', '../node_modules/@clikvn/');
+            const packagePath = source.replace(
+              '@clikvn/',
+              '../node_modules/@clikvn/'
+            );
             resolvedPath = path.resolve(__dirname, packagePath);
           } else {
             return null;
           }
-          
+
           // Add a virtual marker to bypass Vite's CSS processing
           return '\0' + resolvedPath + '.string';
         }
       }
       return null;
     },
-    
+
     async load(id) {
       // Handle our virtual CSS string modules
       if (id.startsWith('\0') && id.endsWith('.css.string')) {
         const realPath = id.slice(1, -7); // Remove \0 prefix and .string suffix
-        
+
         try {
           const content = await fs.promises.readFile(realPath, 'utf-8');
-          
+
           // Process all CSS through PostCSS/Tailwind to ensure Tailwind utilities work
           let processedContent = content;
           try {
-            const result = await postcssProcessor.process(content, { from: realPath });
+            const result = await postcssProcessor.process(content, {
+              from: realPath,
+            });
             processedContent = result.css;
           } catch (error) {
             console.warn(`PostCSS processing failed for ${realPath}:`, error);
             // Fall back to original content if processing fails
             processedContent = content;
           }
-          
+
           return {
             code: `export default ${JSON.stringify(processedContent)};`,
             map: null,
@@ -95,9 +100,12 @@ export default defineConfig({
   resolve: {
     alias: {
       // Force use of example's React to avoid duplicate instances
-      'react': path.resolve(__dirname, 'node_modules/react'),
+      react: path.resolve(__dirname, 'node_modules/react'),
       'react-dom': path.resolve(__dirname, 'node_modules/react-dom'),
-      'react/jsx-runtime': path.resolve(__dirname, 'node_modules/react/jsx-runtime'),
+      'react/jsx-runtime': path.resolve(
+        __dirname,
+        'node_modules/react/jsx-runtime'
+      ),
       // Alias để import trực tiếp từ source code thay vì build
       '@clikvn/showroom-visualizer': path.resolve(__dirname, '../src'),
       // Thư viện sử dụng baseUrl: "./src" nên tất cả imports cần aliases
@@ -116,6 +124,14 @@ export default defineConfig({
   server: {
     port: 3001,
     open: true,
+    host: true,
+    allowedHosts: [
+      'localhost',
+      '.localhost',
+      // Cho phép tất cả ngrok-free.app và ngrok.io hosts
+      '.ngrok-free.app',
+      '.ngrok.io',
+    ],
   },
   optimizeDeps: {
     // Force prebundle để tránh conflict React versions
@@ -123,4 +139,4 @@ export default defineConfig({
     // Ensure all React references use the same instance
     dedupe: ['react', 'react-dom'],
   },
-});
+});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@clikvn/showroom-visualizer",
   "description": "Showroom Visualizer",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "author": "Clik JSC",
   "license": "ISC",
   "type": "module",