@clikvn/showroom-visualizer 0.0.1-dev

package/dist/window.d.ts

@@ -0,0 +1,18 @@
+import { VirtualTourVisualizerType } from './types/SkinLayer';
+export declare const initVisualizer: (props: VirtualTourVisualizerType & {
+    id?: string;
+}) => void;
+export declare const destroy: () => void;
+type ShowroomVisualizer = {
+    initVisualizer: typeof initVisualizer;
+    destroy: typeof destroy;
+};
+export declare const parseVisualizer: () => {
+    initVisualizer: (props: VirtualTourVisualizerType & {
+        id?: string;
+    }) => void;
+    destroy: () => void;
+};
+export declare const injectVisualizerToWindow: (visualizer: ShowroomVisualizer) => void;
+export {};
+//# sourceMappingURL=window.d.ts.map

package/dist/window.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../src/window.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAI9D,eAAO,MAAM,cAAc,GACzB,OAAO,yBAAyB,GAAG;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,SAanD,CAAC;AAEF,eAAO,MAAM,OAAO,YAEnB,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,cAAc,EAAE,OAAO,cAAc,CAAC;IACtC,OAAO,EAAE,OAAO,OAAO,CAAC;CACzB,CAAC;AAQF,eAAO,MAAM,eAAe;4BA9BnB,yBAAyB,GAAG;QAAE,EAAE,CAAC,EAAE,MAAM,CAAA;KAAE;;CAiClD,CAAC;AAEH,eAAO,MAAM,wBAAwB,GAAI,YAAY,kBAAkB,SAGtE,CAAC"}

package/package.json

@@ -0,0 +1,107 @@
+{
+  "name": "@clikvn/showroom-visualizer",
+  "description": "Showrrom Visualizer",
+  "version": "0.0.1-dev",
+  "author": "Clik JSC",
+  "license": "ISC",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "dev": "rollup --watch --config rollup.config.js",
+    "build": "rollup --config rollup.config.js",
+    "lint": "eslint src",
+    "lint:fix": "eslint --fix src",
+    "prettier": "prettier --write .",
+    "pub": "publish --access public",
+    "deploy": "yarn build && yarn publish --access public"
+  },
+  "dependencies": {
+    "@fortawesome/fontawesome-svg-core": "^6.6.0",
+    "@fortawesome/free-brands-svg-icons": "^6.6.0",
+    "@fortawesome/free-regular-svg-icons": "^6.6.0",
+    "@fortawesome/free-solid-svg-icons": "^6.6.0",
+    "@fortawesome/react-fontawesome": "^0.2.2",
+    "@radix-ui/react-slot": "^1.1.1",
+    "@ts-stack/markdown": "1.4.0",
+    "@types/moment": "^2.13.0",
+    "class-variance-authority": "^0.7.1",
+    "classnames": "^2.5.1",
+    "clsx": "^2.1.1",
+    "date-fns": "^4.1.0",
+    "device-detector-js": "^3.0.3",
+    "framer-motion": "^11.18.0",
+    "howler": "^2.2.4",
+    "lodash": "^4.17.21",
+    "moment": "^2.30.1",
+    "node-fetch": "^3.3.2",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-markdown": "^9.0.3",
+    "remark-gfm": "^4.0.0",
+    "signals": "^1.0.0",
+    "swr": "^2.3.0",
+    "usehooks-ts": "^3.1.0",
+    "web-vitals": "^2.1.0"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@rollup-extras/plugin-copy": "^1.11.1",
+    "@rollup/plugin-babel": "^6.0.4",
+    "@rollup/plugin-commonjs": "^28.0.1",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^15.3.0",
+    "@rollup/plugin-typescript": "^12.1.1",
+    "@tailwindcss/typography": "^0.5.15",
+    "@testing-library/jest-dom": "^5.14.1",
+    "@testing-library/react": "^13.0.0",
+    "@testing-library/user-event": "^13.2.1",
+    "@types/howler": "^2.2.12",
+    "@types/jest": "^29.5.14",
+    "@types/lodash": "^4.17.20",
+    "@types/node": "^22.9.0",
+    "@types/node-fetch": "^2.6.13",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
+    "@types/signals": "^1.0.4",
+    "@typescript-eslint/eslint-plugin": "^8.20.0",
+    "@typescript-eslint/parser": "^8.20.0",
+    "autoprefixer": "^10.4.20",
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^10.0.1",
+    "eslint-plugin-prettier": "^5.2.2",
+    "prettier": "^3.4.2",
+    "react-scripts": "5.0.1",
+    "rollup": "^4.26.0",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-postcss": "^4.0.2",
+    "rollup-plugin-replace": "^2.2.0",
+    "rollup-plugin-terser": "^7.0.2",
+    "rollup-plugin-typescript-paths": "^1.5.0",
+    "rollup-plugin-uglify": "^6.0.4",
+    "tailwind-merge": "^2.6.0",
+    "tailwindcss": "^3.4.15",
+    "tailwindcss-animate": "^1.0.7",
+    "typescript": "^5.6.3"
+  },
+  "engines": {
+    "node": ">=18.18.0"
+  }
+}

package/rollup.config.js

@@ -0,0 +1,71 @@
+import resolve from '@rollup/plugin-node-resolve';
+import commonjs from '@rollup/plugin-commonjs';
+import typescript from '@rollup/plugin-typescript';
+import { terser } from 'rollup-plugin-terser';
+import postcss from 'rollup-plugin-postcss';
+import { babel } from '@rollup/plugin-babel';
+import autoprefixer from 'autoprefixer';
+import { typescriptPaths } from 'rollup-plugin-typescript-paths';
+import json from '@rollup/plugin-json';
+import { uglify } from 'rollup-plugin-uglify';
+import replace from 'rollup-plugin-replace';
+import tailwindcss from 'tailwindcss';
+import copy from '@rollup-extras/plugin-copy';
+
+const extensions = ['.ts', '.tsx', '.js'];
+
+const indexConfig = {
+  context: 'this',
+  plugins: [
+    resolve({ extensions, browser: true }),
+    commonjs(),
+    uglify(),
+    json(),
+    babel({
+      babelHelpers: 'bundled',
+      exclude: 'node_modules/**',
+      extensions,
+    }),
+    copy({
+      targets: [
+        {
+          src: [
+            'src/assets/fonts/icomoon.woff',
+            'src/assets/fonts/icomoon.ttf',
+            'src/assets/fonts/icomoon.svg',
+            'src/assets/fonts/icomoon.eot',
+          ],
+          dest: 'fonts',
+        },
+      ],
+    }),
+    replace({
+      'process.env.NODE_ENV': JSON.stringify('production'),
+    }),
+    postcss({
+      plugins: [autoprefixer(), tailwindcss()],
+      extract: false,
+      modules: false,
+      autoModules: false,
+      minimize: true,
+      inject: false,
+    }),
+    typescript(),
+    typescriptPaths({ preserveExtensions: true }),
+    terser({ output: { comments: false } }),
+  ],
+};
+
+const configs = [
+  {
+    input: './src/web.ts',
+    output: {
+      file: 'dist/web.js',
+      format: 'esm',
+      inlineDynamicImports: true,
+    },
+    ...indexConfig,
+  },
+];
+
+export default configs;

package/tailwind.config.cjs

@@ -0,0 +1,149 @@
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const defaultTheme = require('tailwindcss/defaultTheme');
+const plugin = require('tailwindcss/plugin')
+
+function rem2px(input, fontSize = 16) {
+  if (input == null) {
+    return input;
+  }
+  switch (typeof input) {
+    case 'object':
+      if (Array.isArray(input)) {
+        return input.map((val) => rem2px(val, fontSize));
+      }
+      // eslint-disable-next-line no-case-declarations
+      const ret = {};
+      for (const key in input) {
+        ret[key] = rem2px(input[key], fontSize);
+      }
+      return ret;
+    case 'string':
+      return input.replace(
+        /(\d*\.?\d+)rem$/,
+        (_, val) => `${parseFloat(val) * fontSize}px`
+      );
+    case 'function':
+      return eval(
+        input
+          .toString()
+          .replace(
+            /(\d*\.?\d+)rem/g,
+            (_, val) => `${parseFloat(val) * fontSize}px`
+          )
+      );
+    default:
+      return input;
+  }
+}
+
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  darkMode: ['class'],
+  content: ['./src/**/*.{js,jsx,ts,tsx}'],
+  theme: {
+    ...rem2px(defaultTheme),
+    fontFamily: {
+      sans: ['Be Vietnam Pro', 'sans-serif'],
+      mono: ['Be Vietnam Pro', 'sans-serif'],
+    },
+    extend: {
+      keyframes: {
+        'fade-in': {
+          '0%': {
+            opacity: '0',
+          },
+          '100%': {
+            opacity: '1',
+          },
+        },
+        'poi-item-info-bg-animation': {
+          '0%': {
+            'background-color': 'rgba(0, 0, 0, 0)',
+          },
+          '100%': {
+            'background-color': 'rgba(0, 0, 0, 0.48)',
+          },
+        },
+        'poi-item-info-animation': {
+          '0%': {
+            width: '0',
+          },
+          '100%': {
+            width: '100%',
+          },
+        },
+      },
+      /*animation: {
+        'fade-in': 'fade-in 0.3s ease-out',
+      },
+      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))',
+        },
+        sidebar: {
+          DEFAULT: 'hsl(var(--sidebar-background))',
+          foreground: 'hsl(var(--sidebar-foreground))',
+          primary: 'hsl(var(--sidebar-primary))',
+          'primary-foreground': 'hsl(var(--sidebar-primary-foreground))',
+          accent: 'hsl(var(--sidebar-accent))',
+          'accent-foreground': 'hsl(var(--sidebar-accent-foreground))',
+          border: 'hsl(var(--sidebar-border))',
+          ring: 'hsl(var(--sidebar-ring))',
+        },
+      },
+    },
+  },
+  plugins: [
+    require('tailwindcss-animate'),
+    require('@tailwindcss/typography'),
+    plugin(function ({ addVariant }) {
+      addVariant('wrapped', ({ container }) => {
+        container.walkRules(rule => {
+          rule.selector = `.clik-chatbot-wrapper ${rule.selector}`
+        })
+      })
+    }),
+  ],
+};