feat: migrate from experimental decorators to TC39 Stage 3 decorators

- Rewrite all decorator definitions for TC39 (decorators.ts, decorators.functions.ts, nodeDecorator.ts)
- Use Symbol.metadata for per-class metadata storage
- Add 'accessor' keyword to all @expandToProperty and @addAccessorsForMaterialProperty properties
- Flip addAccessorsForMaterialProperty pattern: decorator on public accessor
- Rewrite 3MF XML decorators and Smart Filters decorators for TC39
- Update Lit viewer components with accessor keyword for @property/@state/@query
- Remove experimentalDecorators from all tsconfig files
- Add esnext.decorators and es2022.object to lib
- Bump UMD build targets from ES5 to ES2015 (accessor requires it)
- Replace _propStore access with getEditableProperties() helper
- Add unit tests for decorator metadata and expandToProperty
- Fix class self-references in decorator arguments (TS2449)
- Remove experimentalDecorators from Playground/Snippet Loader compiler options

Author: RaananW

packages/dev/core/src/BakedVertexAnimation/bakedVertexAnimationManager.ts

@@ -75,15 +75,15 @@ export class BakedVertexAnimationManager implements IBakedVertexAnimationManager
      */
     @serializeAsTexture()
     @expandToProperty("_markSubMeshesAsAttributesDirty")
-    public texture: Nullable<BaseTexture>;
+    public accessor texture: Nullable<BaseTexture>;
 
     private _isEnabled = true;
     /**
      * Enable or disable the vertex animation manager
      */
     @serialize()
     @expandToProperty("_markSubMeshesAsAttributesDirty")
-    public isEnabled = true;
+    public accessor isEnabled = true;
 
     /**
      * The animation parameters for the mesh. See setAnimationParameters()

packages/dev/core/src/Decorators/nodeDecorator.ts

@@ -107,19 +107,50 @@ export function editableInPropertyPage(
     groupName: string = "PROPERTIES",
     options?: IEditablePropertyOption
 ) {
-    return (target: any, propertyKey: string) => {
-        let propStore: IPropertyDescriptionForEdition[] = target._propStore;
-        if (!propStore) {
+    return (_value: unknown, context: { name: string | symbol; metadata: DecoratorMetadataObject }) => {
+        const meta = context.metadata;
+        let propStore: IPropertyDescriptionForEdition[];
+        if (Object.hasOwn(meta, __bjsPropStoreKey)) {
+            propStore = meta[__bjsPropStoreKey] as IPropertyDescriptionForEdition[];
+        } else {
             propStore = [];
-            target._propStore = propStore;
+            meta[__bjsPropStoreKey] = propStore;
         }
         propStore.push({
-            propertyName: propertyKey,
+            propertyName: String(context.name),
             displayName: displayName,
             type: propertyType,
             groupName: groupName,
             options: options ?? {},
-            className: target.getClassName(),
+            className: "",
         });
     };
 }
+
+/** @internal */
+export const __bjsPropStoreKey = "__bjs_prop_store__";
+
+/**
+ * Gets the editable properties for a given target using TC39 decorator metadata.
+ * Walks the metadata prototype chain to include properties from parent classes.
+ * @param target - the target object (instance or constructor)
+ * @returns array of property descriptions
+ */
+export function getEditableProperties(target: any): IPropertyDescriptionForEdition[] {
+    const ctor = typeof target === "function" ? target : target?.constructor;
+    const metadata: DecoratorMetadataObject | undefined = ctor?.[Symbol.metadata];
+    if (!metadata) {
+        return [];
+    }
+
+    const result: IPropertyDescriptionForEdition[] = [];
+    let currentMeta: any = metadata;
+    while (currentMeta) {
+        if (Object.hasOwn(currentMeta, __bjsPropStoreKey)) {
+            const store = currentMeta[__bjsPropStoreKey] as IPropertyDescriptionForEdition[];
+            result.push(...store);
+        }
+        currentMeta = Object.getPrototypeOf(currentMeta);
+    }
+    return result;
+}

packages/dev/core/src/Lights/light.ts

@@ -211,7 +211,7 @@ export abstract class Light extends Node implements ISortableLight {
      * exceeding the number allowed of the materials.
      */
     @expandToProperty("_reorderLightsInScene")
-    public renderPriority: number = 0;
+    public accessor renderPriority: number = 0;
 
     @serialize("shadowEnabled")
     private _shadowEnabled: boolean = true;

packages/dev/core/src/Materials/Background/backgroundMaterial.ts

@@ -247,7 +247,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * Key light Color (multiply against the environment texture)
      */
     @expandToProperty("_markAllSubMeshesAsLightsDirty")
-    public primaryColor = Color3.White();
+    public accessor primaryColor = Color3.White();
 
     @serializeAsColor3()
     protected __perceptualColor: Nullable<Color3>;
@@ -292,14 +292,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * The primary color is used at the level chosen to define what the white area would look.
      */
     @expandToProperty("_markAllSubMeshesAsLightsDirty")
-    public get primaryColorHighlightLevel(): float {
-        return this._primaryColorHighlightLevel;
-    }
-    public set primaryColorHighlightLevel(value: float) {
-        this._primaryColorHighlightLevel = value;
-        this._computePrimaryColors();
-        this._markAllSubMeshesAsLightsDirty();
-    }
+    public accessor primaryColorHighlightLevel: float;
 
     @serializeAsTexture()
     protected _reflectionTexture: Nullable<BaseTexture>;
@@ -308,7 +301,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * Should be author in a specific way for the best result (refer to the documentation).
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public reflectionTexture: Nullable<BaseTexture> = null;
+    public accessor reflectionTexture: Nullable<BaseTexture> = null;
 
     @serialize()
     protected _reflectionBlur: float;
@@ -319,7 +312,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * texture twice.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public reflectionBlur: float = 0;
+    public accessor reflectionBlur: float = 0;
 
     @serializeAsTexture()
     protected _diffuseTexture: Nullable<BaseTexture>;
@@ -328,15 +321,15 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * Should be author in a specific way for the best result (refer to the documentation).
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public diffuseTexture: Nullable<BaseTexture> = null;
+    public accessor diffuseTexture: Nullable<BaseTexture> = null;
 
     protected _shadowLights: Nullable<IShadowLight[]> = null;
     /**
      * Specify the list of lights casting shadow on the material.
      * All scene shadow lights will be included if null.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public shadowLights: Nullable<IShadowLight[]> = null;
+    public accessor shadowLights: Nullable<IShadowLight[]> = null;
 
     @serialize()
     protected _shadowLevel: float;
@@ -345,7 +338,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * 0 means black shadows and 1 means no shadows.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public shadowLevel: float = 0;
+    public accessor shadowLevel: float = 0;
 
     @serializeAsVector3()
     protected _sceneCenter: Vector3;
@@ -354,7 +347,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * It is usually zero but might be interesting to modify according to your setup.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public sceneCenter: Vector3 = Vector3.Zero();
+    public accessor sceneCenter: Vector3 = Vector3.Zero();
 
     @serialize()
     protected _opacityFresnel: boolean;
@@ -363,7 +356,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * This helps ensuring a nice transition when the camera goes under the ground.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public opacityFresnel: boolean = true;
+    public accessor opacityFresnel: boolean = true;
 
     @serialize()
     protected _reflectionFresnel: boolean;
@@ -372,7 +365,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * This helps adding a mirror texture on the ground.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public reflectionFresnel: boolean = false;
+    public accessor reflectionFresnel: boolean = false;
 
     @serialize()
     protected _reflectionFalloffDistance: number;
@@ -381,31 +374,31 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * This helps adding a nice falloff effect to the reflection if used as a mirror for instance.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public reflectionFalloffDistance: number = 0.0;
+    public accessor reflectionFalloffDistance: number = 0.0;
 
     @serialize()
     protected _reflectionAmount: number;
     /**
      * This specifies the weight of the reflection against the background in case of reflection Fresnel.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public reflectionAmount: number = 1.0;
+    public accessor reflectionAmount: number = 1.0;
 
     @serialize()
     protected _reflectionReflectance0: number;
     /**
      * This specifies the weight of the reflection at grazing angle.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public reflectionReflectance0: number = 0.05;
+    public accessor reflectionReflectance0: number = 0.05;
 
     @serialize()
     protected _reflectionReflectance90: number;
     /**
      * This specifies the weight of the reflection at a perpendicular point of view.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public reflectionReflectance90: number = 0.5;
+    public accessor reflectionReflectance90: number = 0.5;
 
     /**
      * Sets the reflection reflectance fresnel values according to the default standard
@@ -431,15 +424,15 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * Helps to directly use the maps channels instead of their level.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public useRGBColor: boolean = true;
+    public accessor useRGBColor: boolean = true;
 
     @serialize()
     protected _enableNoise: boolean;
     /**
      * This helps reducing the banding effect that could occur on the background.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public enableNoise: boolean = false;
+    public accessor enableNoise: boolean = false;
 
     /**
      * The current fov(field of view) multiplier, 0.0 - 2.0. Defaults to 1.0. Lower values "zoom in" and higher values "zoom out".
@@ -468,15 +461,15 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      * Number of Simultaneous lights allowed on the material.
      */
     @expandToProperty("_markAllSubMeshesAsTexturesDirty")
-    public maxSimultaneousLights: int = 4;
+    public accessor maxSimultaneousLights: int = 4;
 
     @serialize()
     private _shadowOnly: boolean = false;
     /**
      * Make the material only render shadows
      */
     @expandToProperty("_markAllSubMeshesAsLightsDirty")
-    public shadowOnly: boolean = false;
+    public accessor shadowOnly: boolean = false;
 
     /**
      * Due to a bug in iOS10, video tags (which are using the background material) are in BGR and not RGB.
@@ -491,7 +484,7 @@ export class BackgroundMaterial extends BackgroundMaterialBase {
      */
     @serialize()
     @expandToProperty("_markAllSubMeshesAsMiscDirty")
-    public enableGroundProjection: boolean = false;
+    public accessor enableGroundProjection: boolean = false;
 
     /**
      * Defines the radius of the projected ground if enableGroundProjection is true.

packages/dev/core/src/Materials/GaussianSplatting/gaussianSplattingSolidColorMaterialPlugin.ts

@@ -28,7 +28,7 @@ export class GaussianSplattingSolidColorMaterialPlugin extends MaterialPluginBas
      */
     @serialize()
     @expandToProperty("_onIsEnabledChanged")
-    public isEnabled = true;
+    public accessor isEnabled = true;
 
     /** @internal */
     public _onIsEnabledChanged(): void {

packages/dev/core/src/Materials/Node/Blocks/Dual/lightBlock.ts

@@ -31,7 +31,7 @@ export class LightBlock extends NodeMaterialBlock {
 
     /** Indicates that no code should be generated in the vertex shader. Can be useful in some specific circumstances (like when doing ray marching for eg) */
     @editableInPropertyPage("Generate only fragment code", PropertyTypeForEdition.Boolean, "ADVANCED", {
-        notifiers: { rebuild: true, update: true, onValidation: LightBlock._OnGenerateOnlyFragmentCodeChanged },
+        notifiers: { rebuild: true, update: true, onValidation: (block, prop) => LightBlock._OnGenerateOnlyFragmentCodeChanged(block, prop) },
     })
     public generateOnlyFragmentCode = false;
 

packages/dev/core/src/Materials/Node/Blocks/Dual/reflectionTextureBaseBlock.ts

@@ -101,7 +101,7 @@ export abstract class ReflectionTextureBaseBlock extends NodeMaterialBlock {
 
     /** Indicates that no code should be generated in the vertex shader. Can be useful in some specific circumstances (like when doing ray marching for eg) */
     @editableInPropertyPage("Generate only fragment code", PropertyTypeForEdition.Boolean, "ADVANCED", {
-        notifiers: { rebuild: true, update: true, onValidation: ReflectionTextureBaseBlock._OnGenerateOnlyFragmentCodeChanged },
+        notifiers: { rebuild: true, update: true, onValidation: (block, prop) => ReflectionTextureBaseBlock._OnGenerateOnlyFragmentCodeChanged(block, prop) },
     })
     public generateOnlyFragmentCode = false;
 

packages/dev/core/src/Materials/Node/Blocks/PBR/pbrMetallicRoughnessBlock.ts

@@ -320,7 +320,7 @@ export class PBRMetallicRoughnessBlock extends NodeMaterialBlock {
 
     /** Indicates that no code should be generated in the vertex shader. Can be useful in some specific circumstances (like when doing ray marching for eg) */
     @editableInPropertyPage("Generate only fragment code", PropertyTypeForEdition.Boolean, "ADVANCED", {
-        notifiers: { rebuild: true, update: true, onValidation: PBRMetallicRoughnessBlock._OnGenerateOnlyFragmentCodeChanged },
+        notifiers: { rebuild: true, update: true, onValidation: (block, prop) => PBRMetallicRoughnessBlock._OnGenerateOnlyFragmentCodeChanged(block, prop) },
     })
     public generateOnlyFragmentCode = false;