feat(packages): introduce @dugyu/luna-stage-preview

Extract the stage visualization system (Mockup, Choreography,
LunaLynxStage, Studio) from apps/studio into a standalone
reusable package. apps/studio is now a thin consumer of it.

Author: Dugyu

.cspell/misc.txt

@@ -8,3 +8,4 @@ elif
 esac
 startswith
 tostring
+tsgo

apps/studio/package.json

@@ -14,18 +14,14 @@
   "dependencies": {
     "@dugyu/luna-catalog": "workspace:*",
     "@dugyu/luna-core": "workspace:*",
-    "@headlessui/react": "^2.2.7",
-    "@headlessui/tailwindcss": "^0.2.2",
+    "@dugyu/luna-stage-preview": "workspace:*",
     "@lynx-js/web-core": "catalog:lynx",
     "@lynx-js/web-elements": "catalog:lynx",
-    "clsx": "catalog:utils",
-    "lucide-react": "^0.546.0",
-    "motion": "^12.23.21",
     "react": "catalog:react18",
-    "react-dom": "catalog:react18",
-    "tailwind-merge": "catalog:tailwind"
+    "react-dom": "catalog:react18"
   },
   "devDependencies": {
+    "@headlessui/tailwindcss": "^0.2.2",
     "@rsbuild/core": "catalog:rsbuild",
     "@rsbuild/plugin-react": "catalog:rsbuild",
     "@types/react": "catalog:react18",

apps/studio/src/App.tsx

@@ -2,10 +2,17 @@
 // Licensed under the Apache License Version 2.0 that can be found in the
 // LICENSE file in the root directory of this source tree.
 
+// Lynx web element registration (side effects — must be imported by the app)
+import '@lynx-js/web-core/index.css';
+import '@lynx-js/web-elements/index.css';
+import '@lynx-js/web-core';
+import '@lynx-js/web-elements/all';
+
 import './App.css';
-import { Studio } from '@/components/studio';
-import { RECORD_MODE } from '@/constants/presentation.ts';
-import { cn } from '@/utils';
+
+import { Studio, cn } from '@dugyu/luna-stage-preview';
+
+import { RECORD_MODE } from './constants/presentation.ts';
 
 function App() {
   return (
@@ -32,7 +39,7 @@ function App() {
             RECORD_MODE ? 'h-full' : ' h-3/4',
           )}
         >
-          <Studio />
+          <Studio recordMode={RECORD_MODE} />
         </div>
       </div>
     </div>