Demo/dynamic variables one value to rule them all

.__mf__temp/k3_mf_2_ring/localSharedImportMap.js

@@ -27,6 +27,16 @@
           let pkg = await import("__mf__virtual/k3_mf_2_ring__prebuild___mf_0_mui_mf_1_styled_mf_2_engine__prebuild__.js")
           return pkg
         }
+      ,
+        "@react-three/drei": async () => {
+          let pkg = await import("__mf__virtual/k3_mf_2_ring__prebuild___mf_0_react_mf_2_three_mf_1_drei__prebuild__.js")
+          return pkg
+        }
+      ,
+        "@react-three/fiber": async () => {
+          let pkg = await import("__mf__virtual/k3_mf_2_ring__prebuild___mf_0_react_mf_2_three_mf_1_fiber__prebuild__.js")
+          return pkg
+        }
       ,
         "react": async () => {
           let pkg = await import("__mf__virtual/k3_mf_2_ring__prebuild__react__prebuild__.js")
@@ -152,7 +162,7 @@
         ,
           "@mui/styled-engine": {
             name: "@mui/styled-engine",
-            version: "7.3.5",
+            version: "7.1.1",
             scope: ["default"],
             loaded: false,
             from: "k3-ring",
@@ -175,6 +185,58 @@
               requiredVersion: "^7.1.1"
             }
           }
+        ,
+          "@react-three/drei": {
+            name: "@react-three/drei",
+            version: "10.5.1",
+            scope: ["default"],
+            loaded: false,
+            from: "k3-ring",
+            async get () {
+              usedShared["@react-three/drei"].loaded = true
+              const {"@react-three/drei": pkgDynamicImport} = importMap 
+              const res = await pkgDynamicImport()
+              const exportModule = {...res}
+              // All npm packages pre-built by vite will be converted to esm
+              Object.defineProperty(exportModule, "__esModule", {
+                value: true,
+                enumerable: false
+              })
+              return function () {
+                return exportModule
+              }
+            },
+            shareConfig: {
+              singleton: true,
+              requiredVersion: "^10.1.2"
+            }
+          }
+        ,
+          "@react-three/fiber": {
+            name: "@react-three/fiber",
+            version: "9.2.0",
+            scope: ["default"],
+            loaded: false,
+            from: "k3-ring",
+            async get () {
+              usedShared["@react-three/fiber"].loaded = true
+              const {"@react-three/fiber": pkgDynamicImport} = importMap 
+              const res = await pkgDynamicImport()
+              const exportModule = {...res}
+              // All npm packages pre-built by vite will be converted to esm
+              Object.defineProperty(exportModule, "__esModule", {
+                value: true,
+                enumerable: false
+              })
+              return function () {
+                return exportModule
+              }
+            },
+            shareConfig: {
+              singleton: true,
+              requiredVersion: "^9.1.2"
+            }
+          }
         ,
           "react": {
             name: "react",

.yalc/k3-plugin-api/index.d.ts

@@ -0,0 +1,11 @@
+import type { BasicDynamicModelEditor } from "#/core/r3f/dynamicModels/models/components/BasicDynamicModelEditor";
+import type { DynamicModel } from "#core/types/dynamicModel.interface";
+export type K3API = {
+    DynamicModelEditor: BasicDynamicModelEditor;
+};
+export declare let K3: K3API;
+export declare function init(_ctx: K3API): void;
+export interface K3Plugin {
+    dynamicModels: DynamicModel[];
+}
+//# sourceMappingURL=index.d.ts.map

.yalc/k3-plugin-api/index.ts

@@ -0,0 +1,80 @@
+import type React from "react";
+
+export interface K3Plugin {
+  dynamicModels: DynamicModel[];
+  variableTemplates: VariableTemplate[];
+  layoutComponents: Record<string, React.ComponentType<any>>;
+}
+
+export interface DynamicModel {
+  type: string;
+  label: string;
+  screenshot?: string;
+  materials: string[];
+  disabledForAR: boolean;
+  component: React.ComponentType<any>;
+  propsDialog: Record<string, ModelProp>;
+  defaultProps: Record<string, ModelPropDefault>;
+  tag?: string;
+}
+
+export interface ModelProp {
+  type?: "basic" | "model" | "variable" | "expression";
+  label?: string;
+  /** For type="variable": restrict which variable types are selectable. */
+  allowedTypes?: VariableTypes[];
+  /** For type="model": allow selecting multiple models. */
+  multiple?: boolean;
+}
+
+/** All variable type string literals. */
+export const VariableType = {
+  List: "list",
+  Color: "color",
+  Number: "number",
+  Text: "text",
+  MultiSelect: "multiSelect",
+  Boolean: "boolean",
+  Image: "image",
+  Upload: "upload",
+  Components: "components",
+  Information: "information",
+} as const;
+
+export type VariableTypes = (typeof VariableType)[keyof typeof VariableType];
+
+export interface ModelPropDefault {
+  expression?: string;
+}
+
+export interface VariableTemplate {
+  key: string;
+  label: string;
+  type: string;
+  component: (Wrapped: React.ComponentType<any>) => React.ComponentType<any>;
+}
+
+// ---------------------------------------------------------------------------
+// VariableRef resolved prop API
+// ---------------------------------------------------------------------------
+
+/** K3 Value object (list / color / boolean selection). */
+export interface Value {
+  id: number | string;
+  key?: string | null;
+  value?: string | boolean | null;
+  label: string;
+}
+// ---------------------------------------------------------------------------
+// Plugin model context
+// ---------------------------------------------------------------------------
+
+/**
+ * Context passed to plugin dynamic model components at runtime.
+ */
+export interface PluginModelContext {
+  /** Only set during screenshot rendering. */
+  screenshotCameraName?: string;
+  /** The unique ID of the model action this instance is rendered for. */
+  modelActionId?: string;
+}

.yalc/k3-plugin-api/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "k3-plugin-api",
+  "version": "1.0.10",
+  "main": "index.js",
+  "types": "index.ts",
+  "scripts": {
+    "prepublishOnly": "tsc --emitDeclarationOnly"
+  },
+  "yalcSig": "c8f5fbf8b0f71d6d746571afd98f4507"
+}

.yalc/k3-plugin-api/tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "declaration": true,
+    "emitDeclarationOnly": true,
+    "declarationMap": true,
+    "outDir": "dist",
+    "baseUrl": ".",
+    "paths": {
+      "#core/*": ["../k3-frontend/src/lib/*"]
+    },
+    "skipLibCheck": true,
+    "composite": true,
+    "jsx": "react-jsx"
+  },
+  "include": ["index.ts"]
+}