support props in default theme of repr provider

src/mol-plugin/state/transforms/representation.ts

@@ -52,13 +52,13 @@ namespace StructureRepresentation3DHelpers {
         const type = ctx.structureRepresentation.registry.get(name);
 
         const themeDataCtx = { structure };
-        const colorParams = ctx.structureRepresentation.themeCtx.colorThemeRegistry.get(type.defaultColorTheme).getParams(themeDataCtx);
-        const sizeParams = ctx.structureRepresentation.themeCtx.sizeThemeRegistry.get(type.defaultSizeTheme).getParams(themeDataCtx)
+        const colorParams = ctx.structureRepresentation.themeCtx.colorThemeRegistry.get(type.defaultColorTheme.name).getParams(themeDataCtx);
+        const sizeParams = ctx.structureRepresentation.themeCtx.sizeThemeRegistry.get(type.defaultSizeTheme.name).getParams(themeDataCtx)
         const structureDefaultParams = PD.getDefaultValues(type.getParams(ctx.structureRepresentation.themeCtx, structure))
         return ({
             type: { name, params: structureParams ? { ...structureDefaultParams, ...structureParams } : structureDefaultParams },
-            colorTheme: { name: type.defaultColorTheme, params: PD.getDefaultValues(colorParams) },
-            sizeTheme: { name: type.defaultSizeTheme, params: PD.getDefaultValues(sizeParams) }
+            colorTheme: { name: type.defaultColorTheme.name, params: { ...PD.getDefaultValues(colorParams), ...type.defaultColorTheme.props } },
+            sizeTheme: { name: type.defaultSizeTheme.name, params: { ...PD.getDefaultValues(sizeParams), ...type.defaultSizeTheme.props } }
         })
     }
 
@@ -81,16 +81,16 @@ namespace StructureRepresentation3DHelpers {
 
         const color = params.color
             ? params.color instanceof Array ? params.color[0] : params.color
-            : themeCtx.colorThemeRegistry.get(repr.defaultColorTheme);
-        const colorDefaultParams = PD.getDefaultValues(color.getParams(themeCtx))
+            : themeCtx.colorThemeRegistry.get(repr.defaultColorTheme.name);
+        const colorDefaultParams = { ...PD.getDefaultValues(color.getParams(themeCtx)), ...repr.defaultColorTheme.props }
         const colorParams = params.color instanceof Array
             ? { ...colorDefaultParams, ...params.color[1](color as C, themeCtx) }
             : colorDefaultParams;
 
         const size = params.size
             ? params.size instanceof Array ? params.size[0] : params.size
-            : themeCtx.sizeThemeRegistry.get(repr.defaultSizeTheme);
-        const sizeDefaultParams = PD.getDefaultValues(size.getParams(themeCtx))
+            : themeCtx.sizeThemeRegistry.get(repr.defaultSizeTheme.name);
+        const sizeDefaultParams = { ...PD.getDefaultValues(size.getParams(themeCtx)), ...repr.defaultSizeTheme.props }
         const sizeParams = params.size instanceof Array
             ? { ...sizeDefaultParams, ...params.size[1](size as S, themeCtx) }
             : sizeDefaultParams;
@@ -106,26 +106,26 @@ namespace StructureRepresentation3DHelpers {
         const type = ctx.structureRepresentation.registry.get(reprName);
 
         const themeDataCtx = { structure };
-        const color = colorName || type.defaultColorTheme;
+        const color = colorName || type.defaultColorTheme.name;
         const colorParams = ctx.structureRepresentation.themeCtx.colorThemeRegistry.get(color).getParams(themeDataCtx);
-        const sizeParams = ctx.structureRepresentation.themeCtx.sizeThemeRegistry.get(type.defaultSizeTheme).getParams(themeDataCtx)
+        const sizeParams = ctx.structureRepresentation.themeCtx.sizeThemeRegistry.get(type.defaultSizeTheme.name).getParams(themeDataCtx)
         const structureDefaultParams = PD.getDefaultValues(type.getParams(ctx.structureRepresentation.themeCtx, structure))
         return ({
             type: { name: reprName, params: structureParams ? { ...structureDefaultParams, ...structureParams } : structureDefaultParams },
             colorTheme: { name: color, params: PD.getDefaultValues(colorParams) },
-            sizeTheme: { name: type.defaultSizeTheme, params: PD.getDefaultValues(sizeParams) }
+            sizeTheme: { name: type.defaultSizeTheme.name, params: PD.getDefaultValues(sizeParams) }
         })
     }
 
     export function getDefaultParamsStatic(ctx: PluginContext, name: BuiltInStructureRepresentationsName, structureParams?: Partial<PD.Values<StructureParams>>, colorName?: BuiltInColorThemeName): StateTransformer.Params<StructureRepresentation3D> {
         const type = ctx.structureRepresentation.registry.get(name);
-        const color = colorName || type.defaultColorTheme;
+        const color = colorName || type.defaultColorTheme.name;
         const colorParams = ctx.structureRepresentation.themeCtx.colorThemeRegistry.get(color).defaultValues;
-        const sizeParams = ctx.structureRepresentation.themeCtx.sizeThemeRegistry.get(type.defaultSizeTheme).defaultValues
+        const sizeParams = ctx.structureRepresentation.themeCtx.sizeThemeRegistry.get(type.defaultSizeTheme.name).defaultValues
         return ({
             type: { name, params: structureParams ? { ...type.defaultValues, ...structureParams } : type.defaultValues },
             colorTheme: { name: color, params: colorParams },
-            sizeTheme: { name: type.defaultSizeTheme, params: sizeParams }
+            sizeTheme: { name: type.defaultSizeTheme.name, params: sizeParams }
         })
     }
 }
@@ -156,13 +156,13 @@ const StructureRepresentation3D = PluginStateTransform.BuiltIn({
                     registry.types,
                     name => PD.Group<any>(registry.get(name).getParams(themeCtx, Structure.Empty))),
                 colorTheme: PD.Mapped<any>(
-                    type.defaultColorTheme,
+                    type.defaultColorTheme.name,
                     themeCtx.colorThemeRegistry.types,
                     name => PD.Group<any>(themeCtx.colorThemeRegistry.get(name).getParams({ structure: Structure.Empty })),
                     colorThemeInfo
                 ),
                 sizeTheme: PD.Mapped<any>(
-                    type.defaultSizeTheme,
+                    type.defaultSizeTheme.name,
                     themeCtx.sizeThemeRegistry.types,
                     name => PD.Group<any>(themeCtx.sizeThemeRegistry.get(name).getParams({ structure: Structure.Empty }))
                 )
@@ -185,13 +185,13 @@ const StructureRepresentation3D = PluginStateTransform.BuiltIn({
                 registry.getApplicableTypes(a.data),
                 name => PD.Group<any>(registry.get(name).getParams(themeCtx, a.data))),
             colorTheme: PD.Mapped<any>(
-                type.defaultColorTheme,
+                type.defaultColorTheme.name,
                 themeCtx.colorThemeRegistry.getApplicableTypes(dataCtx),
                 name => PD.Group<any>(themeCtx.colorThemeRegistry.get(name).getParams(dataCtx)),
                 colorThemeInfo
             ),
             sizeTheme: PD.Mapped<any>(
-                type.defaultSizeTheme,
+                type.defaultSizeTheme.name,
                 themeCtx.sizeThemeRegistry.types,
                 name => PD.Group<any>(themeCtx.sizeThemeRegistry.get(name).getParams(dataCtx))
             )
@@ -502,24 +502,24 @@ export namespace VolumeRepresentation3DHelpers {
         const type = ctx.volumeRepresentation.registry.get(name);
 
         const themeDataCtx = { volume };
-        const colorParams = ctx.volumeRepresentation.themeCtx.colorThemeRegistry.get(type.defaultColorTheme).getParams(themeDataCtx);
-        const sizeParams = ctx.volumeRepresentation.themeCtx.sizeThemeRegistry.get(type.defaultSizeTheme).getParams(themeDataCtx)
+        const colorParams = ctx.volumeRepresentation.themeCtx.colorThemeRegistry.get(type.defaultColorTheme.name).getParams(themeDataCtx);
+        const sizeParams = ctx.volumeRepresentation.themeCtx.sizeThemeRegistry.get(type.defaultSizeTheme.name).getParams(themeDataCtx)
         const volumeDefaultParams = PD.getDefaultValues(type.getParams(ctx.volumeRepresentation.themeCtx, volume))
         return ({
             type: { name, params: volumeParams ? { ...volumeDefaultParams, ...volumeParams } : volumeDefaultParams },
-            colorTheme: { name: type.defaultColorTheme, params: PD.getDefaultValues(colorParams) },
-            sizeTheme: { name: type.defaultSizeTheme, params: PD.getDefaultValues(sizeParams) }
+            colorTheme: { name: type.defaultColorTheme.name, params: PD.getDefaultValues(colorParams) },
+            sizeTheme: { name: type.defaultSizeTheme.name, params: PD.getDefaultValues(sizeParams) }
         })
     }
 
     export function getDefaultParamsStatic(ctx: PluginContext, name: BuiltInVolumeRepresentationsName, volumeParams?: Partial<PD.Values<PD.Params>>, colorName?: BuiltInColorThemeName, colorParams?: Partial<ColorTheme.Props>, sizeName?: BuiltInSizeThemeName, sizeParams?: Partial<SizeTheme.Props>): StateTransformer.Params<VolumeRepresentation3D> {
         const type = ctx.volumeRepresentation.registry.get(name);
-        const colorType = ctx.volumeRepresentation.themeCtx.colorThemeRegistry.get(colorName || type.defaultColorTheme);
-        const sizeType = ctx.volumeRepresentation.themeCtx.sizeThemeRegistry.get(sizeName || type.defaultSizeTheme);
+        const colorType = ctx.volumeRepresentation.themeCtx.colorThemeRegistry.get(colorName || type.defaultColorTheme.name);
+        const sizeType = ctx.volumeRepresentation.themeCtx.sizeThemeRegistry.get(sizeName || type.defaultSizeTheme.name);
         return ({
             type: { name, params: volumeParams ? { ...type.defaultValues, ...volumeParams } : type.defaultValues },
-            colorTheme: { name: type.defaultColorTheme, params: colorParams ? { ...colorType.defaultValues, ...colorParams } : colorType.defaultValues },
-            sizeTheme: { name: type.defaultSizeTheme, params: sizeParams ? { ...sizeType.defaultValues, ...sizeParams } : sizeType.defaultValues }
+            colorTheme: { name: type.defaultColorTheme.name, params: colorParams ? { ...colorType.defaultValues, ...colorParams } : colorType.defaultValues },
+            sizeTheme: { name: type.defaultSizeTheme.name, params: sizeParams ? { ...sizeType.defaultValues, ...sizeParams } : sizeType.defaultValues }
         })
     }
 
@@ -544,12 +544,12 @@ const VolumeRepresentation3D = PluginStateTransform.BuiltIn({
                     registry.types,
                     name => PD.Group<any>(registry.get(name).getParams(themeCtx, VolumeData.One ))),
                 colorTheme: PD.Mapped<any>(
-                    type.defaultColorTheme,
+                    type.defaultColorTheme.name,
                     themeCtx.colorThemeRegistry.types,
                     name => PD.Group<any>(themeCtx.colorThemeRegistry.get(name).getParams({ volume: VolumeData.One }))
                 ),
                 sizeTheme: PD.Mapped<any>(
-                    type.defaultSizeTheme,
+                    type.defaultSizeTheme.name,
                     themeCtx.sizeThemeRegistry.types,
                     name => PD.Group<any>(themeCtx.sizeThemeRegistry.get(name).getParams({ volume: VolumeData.One }))
                 )
@@ -563,12 +563,12 @@ const VolumeRepresentation3D = PluginStateTransform.BuiltIn({
                 registry.types,
                 name => PD.Group<any>(registry.get(name).getParams(themeCtx, a.data))),
             colorTheme: PD.Mapped<any>(
-                type.defaultColorTheme,
+                type.defaultColorTheme.name,
                 themeCtx.colorThemeRegistry.getApplicableTypes(dataCtx),
                 name => PD.Group<any>(themeCtx.colorThemeRegistry.get(name).getParams(dataCtx))
             ),
             sizeTheme: PD.Mapped<any>(
-                type.defaultSizeTheme,
+                type.defaultSizeTheme.name,
                 themeCtx.sizeThemeRegistry.types,
                 name => PD.Group<any>(themeCtx.sizeThemeRegistry.get(name).getParams(dataCtx))
             )

src/mol-repr/representation.ts

@@ -45,8 +45,8 @@ export interface RepresentationProvider<D, P extends PD.Params, S extends Repres
     readonly factory: RepresentationFactory<D, P, S>
     readonly getParams: RepresentationParamsGetter<D, P>
     readonly defaultValues: PD.Values<P>
-    readonly defaultColorTheme: string
-    readonly defaultSizeTheme: string
+    readonly defaultColorTheme: { name: string, props?: {} }
+    readonly defaultSizeTheme: { name: string, props?: {} }
     readonly isApplicable: (data: D) => boolean
     readonly ensureCustomProperties?: (ctx: CustomProperty.Context, data: D) => Promise<void>
 }

src/mol-repr/structure/representation/ball-and-stick.ts

@@ -47,7 +47,7 @@ export const BallAndStickRepresentationProvider: StructureRepresentationProvider
     factory: BallAndStickRepresentation,
     getParams: getBallAndStickParams,
     defaultValues: PD.getDefaultValues(BallAndStickParams),
-    defaultColorTheme: 'element-symbol',
-    defaultSizeTheme: 'physical',
+    defaultColorTheme: { name: 'element-symbol' },
+    defaultSizeTheme: { name: 'physical' },
     isApplicable: (structure: Structure) => structure.elementCount > 0
 }

src/mol-repr/structure/representation/carbohydrate.ts

@@ -42,7 +42,7 @@ export const CarbohydrateRepresentationProvider: StructureRepresentationProvider
     factory: CarbohydrateRepresentation,
     getParams: getCarbohydrateParams,
     defaultValues: PD.getDefaultValues(CarbohydrateParams),
-    defaultColorTheme: 'carbohydrate-symbol',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'carbohydrate-symbol' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.carbohydrates.elements.length > 0
 }

src/mol-repr/structure/representation/cartoon.ts

@@ -61,8 +61,8 @@ export const CartoonRepresentationProvider: StructureRepresentationProvider<Cart
     factory: CartoonRepresentation,
     getParams: getCartoonParams,
     defaultValues: PD.getDefaultValues(CartoonParams),
-    defaultColorTheme: 'polymer-id',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'polymer-id' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.polymerResidueCount > 0,
     ensureCustomProperties: (ctx: CustomProperty.Context, structure: Structure) => {
         return SecondaryStructureProvider.attach(ctx, structure)

src/mol-repr/structure/representation/distance-restraint.ts

@@ -37,7 +37,7 @@ export const DistanceRestraintRepresentationProvider: StructureRepresentationPro
     factory: DistanceRestraintRepresentation,
     getParams: getDistanceRestraintParams,
     defaultValues: PD.getDefaultValues(DistanceRestraintParams),
-    defaultColorTheme: 'cross-link',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'cross-link' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.crossLinkRestraints.count > 0
 }

src/mol-repr/structure/representation/ellipsoid.ts

@@ -47,7 +47,7 @@ export const EllipsoidRepresentationProvider: StructureRepresentationProvider<El
     factory: EllipsoidRepresentation,
     getParams: getEllipsoidParams,
     defaultValues: PD.getDefaultValues(EllipsoidParams),
-    defaultColorTheme: 'element-symbol',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'element-symbol' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.elementCount > 0 && structure.models.some(m => m.customProperties.has(AtomSiteAnisotrop.Descriptor))
 }

src/mol-repr/structure/representation/gaussian-surface.ts

@@ -41,7 +41,7 @@ export const GaussianSurfaceRepresentationProvider: StructureRepresentationProvi
     factory: GaussianSurfaceRepresentation,
     getParams: getGaussianSurfaceParams,
     defaultValues: PD.getDefaultValues(GaussianSurfaceParams),
-    defaultColorTheme: 'polymer-id',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'polymer-id' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.elementCount > 0
 }

src/mol-repr/structure/representation/gaussian-volume.ts

@@ -34,7 +34,7 @@ export const GaussianVolumeRepresentationProvider: StructureRepresentationProvid
     factory: GaussianVolumeRepresentation,
     getParams: getGaussianVolumeParams,
     defaultValues: PD.getDefaultValues(GaussianVolumeParams),
-    defaultColorTheme: 'polymer-id',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'polymer-id' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.elementCount > 0
 }

src/mol-repr/structure/representation/interactions.ts

@@ -43,8 +43,8 @@ export const InteractionsRepresentationProvider: StructureRepresentationProvider
     factory: InteractionRepresentation,
     getParams: getInteractionParams,
     defaultValues: PD.getDefaultValues(InteractionsParams),
-    defaultColorTheme: 'interaction-type',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'interaction-type' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.elementCount > 0,
     ensureCustomProperties: (ctx: CustomProperty.Context, structure: Structure) => {
         return InteractionsProvider.attach(ctx, structure)

src/mol-repr/structure/representation/label.ts

@@ -35,7 +35,7 @@ export const LabelRepresentationProvider: StructureRepresentationProvider<LabelP
     factory: LabelRepresentation,
     getParams: getLabelParams,
     defaultValues: PD.getDefaultValues(LabelParams),
-    defaultColorTheme: 'uniform',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'uniform' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.elementCount > 0
 }

src/mol-repr/structure/representation/molecular-surface.ts

@@ -39,7 +39,7 @@ export const MolecularSurfaceRepresentationProvider: StructureRepresentationProv
     factory: MolecularSurfaceRepresentation,
     getParams: getMolecularSurfaceParams,
     defaultValues: PD.getDefaultValues(MolecularSurfaceParams),
-    defaultColorTheme: 'polymer-id',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'polymer-id' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.elementCount > 0
 }

src/mol-repr/structure/representation/orientation.ts

@@ -36,7 +36,7 @@ export const OrientationRepresentationProvider: StructureRepresentationProvider<
     factory: OrientationRepresentation,
     getParams: getOrientationParams,
     defaultValues: PD.getDefaultValues(OrientationParams),
-    defaultColorTheme: 'polymer-id',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'polymer-id' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (structure: Structure) => structure.elementCount > 0
 }

src/mol-repr/structure/representation/point.ts

@@ -37,7 +37,7 @@ export const PointRepresentationProvider: StructureRepresentationProvider<PointP
     factory: PointRepresentation,
     getParams: getPointParams,
     defaultValues: PD.getDefaultValues(PointParams),
-    defaultColorTheme: 'element-symbol',
-    defaultSizeTheme: 'physical',
+    defaultColorTheme: { name: 'element-symbol' },
+    defaultSizeTheme: { name: 'physical' },
     isApplicable: (structure: Structure) => structure.elementCount > 0
 }

src/mol-repr/structure/representation/putty.ts

@@ -49,7 +49,7 @@ export const PuttyRepresentationProvider: StructureRepresentationProvider<PuttyP
     factory: PuttyRepresentation,
     getParams: getPuttyParams,
     defaultValues: PD.getDefaultValues(PuttyParams),
-    defaultColorTheme: 'polymer-id',
-    defaultSizeTheme: 'uncertainty',
+    defaultColorTheme: { name: 'polymer-id' },
+    defaultSizeTheme: { name: 'uncertainty' },
     isApplicable: (structure: Structure) => structure.polymerResidueCount > 0
 }

src/mol-repr/structure/representation/spacefill.ts

@@ -37,7 +37,7 @@ export const SpacefillRepresentationProvider: StructureRepresentationProvider<Sp
     factory: SpacefillRepresentation,
     getParams: getSpacefillParams,
     defaultValues: PD.getDefaultValues(SpacefillParams),
-    defaultColorTheme: 'element-symbol',
-    defaultSizeTheme: 'physical',
+    defaultColorTheme: { name: 'element-symbol' },
+    defaultSizeTheme: { name: 'physical' },
     isApplicable: (structure: Structure) => structure.elementCount > 0
 }

src/mol-repr/volume/direct-volume.ts

@@ -185,7 +185,7 @@ export const DirectVolumeRepresentationProvider: VolumeRepresentationProvider<Di
     factory: DirectVolumeRepresentation,
     getParams: getDirectVolumeParams,
     defaultValues: PD.getDefaultValues(DirectVolumeParams),
-    defaultColorTheme: 'uniform',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'uniform' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (volume: VolumeData) => volume.data.data.length > 0
 }

src/mol-repr/volume/isosurface.ts

@@ -170,7 +170,7 @@ export const IsosurfaceRepresentationProvider: VolumeRepresentationProvider<Isos
     factory: IsosurfaceRepresentation,
     getParams: getIsosurfaceParams,
     defaultValues: PD.getDefaultValues(IsosurfaceParams),
-    defaultColorTheme: 'uniform',
-    defaultSizeTheme: 'uniform',
+    defaultColorTheme: { name: 'uniform' },
+    defaultSizeTheme: { name: 'uniform' },
     isApplicable: (volume: VolumeData) => volume.data.data.length > 0
 }