Skip to content

Commit 0ea7a28

Browse files
nartcnartc
committed
fix(core): adjust applyProps to match r3f
1 parent d32782f commit 0ea7a28

File tree

3 files changed

+46
-45
lines changed

3 files changed

+46
-45
lines changed

‎apps/examples/src/app/soba/basic/scene.ts

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -139,34 +139,34 @@ export class Bot {
139139
</ngtp-effect-composer>
140140
141141
<ngts-orbit-controls [options]="{ makeDefault: true, autoRotate: true }" />
142-
}
143142
144-
<ngt-tweak-pane title="Soba Basic">
145-
<ngt-tweak-folder title="Bloom">
146-
<ngt-tweak-checkbox [(value)]="bloom" label="Enabled" />
147-
<ngt-tweak-number
148-
[(value)]="luminanceThreshold"
149-
label="luminanceThreshold"
150-
[params]="{ min: 0, max: 1, step: 0.01 }"
151-
/>
152-
<ngt-tweak-number
153-
[(value)]="luminanceSmoothing"
154-
label="luminanceSmoothing"
155-
[params]="{ min: 0, max: 1, step: 0.01 }"
156-
/>
157-
<ngt-tweak-number
158-
[(value)]="intensity"
159-
label="bloomIntensity"
160-
[params]="{ min: 0, max: 10, step: 0.5 }"
161-
/>
162-
</ngt-tweak-folder>
163-
<ngt-tweak-folder title="Glitch">
164-
<ngt-tweak-checkbox [(value)]="glitch" label="Enabled" />
165-
</ngt-tweak-folder>
166-
167-
<ngt-tweak-list [(value)]="selectedAction" [options]="['Strut', 'Dance', 'Idle']" label="Animation" />
168-
<ngt-tweak-color [(value)]="backgroundColor" label="Background" />
169-
</ngt-tweak-pane>
143+
<ngt-tweak-pane title="Soba Basic">
144+
<ngt-tweak-folder title="Bloom">
145+
<ngt-tweak-checkbox [(value)]="bloom" label="Enabled" />
146+
<ngt-tweak-number
147+
[(value)]="luminanceThreshold"
148+
label="luminanceThreshold"
149+
[params]="{ min: 0, max: 1, step: 0.01 }"
150+
/>
151+
<ngt-tweak-number
152+
[(value)]="luminanceSmoothing"
153+
label="luminanceSmoothing"
154+
[params]="{ min: 0, max: 1, step: 0.01 }"
155+
/>
156+
<ngt-tweak-number
157+
[(value)]="intensity"
158+
label="bloomIntensity"
159+
[params]="{ min: 0, max: 10, step: 0.5 }"
160+
/>
161+
</ngt-tweak-folder>
162+
<ngt-tweak-folder title="Glitch">
163+
<ngt-tweak-checkbox [(value)]="glitch" label="Enabled" />
164+
</ngt-tweak-folder>
165+
166+
<ngt-tweak-list [(value)]="selectedAction" [options]="['Strut', 'Dance', 'Idle']" label="Animation" />
167+
<ngt-tweak-color [(value)]="backgroundColor" label="Background" />
168+
</ngt-tweak-pane>
169+
}
170170
`,
171171
imports: [
172172
NgtsOrbitControls,

‎libs/core/src/lib/utils/apply-props.ts

Lines changed: 17 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -105,9 +105,17 @@ export function applyProps<T extends NgtAnyRecord>(instance: NgtInstanceState<T>
105105
return applyProps(root, { [targetKey]: value });
106106
}
107107

108+
// Layers have no copy function, we must therefore copy the mask property
109+
if (targetProp instanceof THREE.Layers && value instanceof THREE.Layers) {
110+
targetProp.mask = value.mask;
111+
} else if (is.three<THREE.Color>(targetProp, 'isColor') && is.colorRepresentation(value)) {
112+
targetProp.set(value);
113+
}
108114
// Copy if properties match signatures
109-
if (
110-
targetProp?.copy &&
115+
else if (
116+
targetProp &&
117+
typeof targetProp.set === 'function' &&
118+
typeof targetProp.copy === 'function' &&
111119
(value as ClassConstructor | undefined)?.constructor &&
112120
(targetProp as ClassConstructor).constructor === (value as ClassConstructor).constructor
113121
) {
@@ -118,29 +126,20 @@ export function applyProps<T extends NgtAnyRecord>(instance: NgtInstanceState<T>
118126
) {
119127
Object.assign(root, { [targetKey]: value });
120128
} else {
121-
// fetch the default state of the target
122-
const ctor = getMemoizedPrototype(root);
123-
// The target key was originally null or undefined, which indicates that the object which
124-
// is now present was externally set by the user, we should therefore assign the value directly
125-
if (ctor !== undefined && ctor[targetKey] == null) Object.assign(root, { [targetKey]: value });
126-
// Otherwise copy is correct
127-
else targetProp.copy(value);
129+
targetProp.copy(value);
128130
}
129131
}
130-
// Layers have no copy function, we must therefore copy the mask property
131-
else if (targetProp instanceof THREE.Layers && value instanceof THREE.Layers) {
132-
targetProp.mask = value.mask;
133-
}
134132
// Set array types
135-
else if (targetProp?.set && Array.isArray(value)) {
136-
if (targetProp.fromArray) targetProp.fromArray(value);
133+
else if (targetProp && typeof targetProp.set === 'function' && Array.isArray(value)) {
134+
if (typeof targetProp.fromArray === 'function') targetProp.fromArray(value);
137135
else targetProp.set(...value);
138136
}
139137
// Set literal types
140-
else if (targetProp?.set && typeof value !== 'object') {
141-
const isColor = (targetProp as THREE.Color | undefined)?.isColor;
138+
else if (targetProp && typeof targetProp.set === 'function' && typeof value !== 'object') {
139+
const isColor = is.three<THREE.Color>(targetProp, 'isColor');
142140
// Allow setting array scalars
143-
if (!isColor && targetProp.setScalar && typeof value === 'number') targetProp.setScalar(value);
141+
if (!isColor && typeof targetProp.setScalar === 'function' && typeof value === 'number')
142+
targetProp.setScalar(value);
144143
// Otherwise just set single value
145144
else targetProp.set(value);
146145
}

‎libs/core/src/lib/utils/is.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ export const is = {
2020
a: unknown,
2121
isKey: TKey extends `is${infer K}` ? TKey : never,
2222
): a is TThreeEntity => !!a && (a as any)[isKey],
23+
colorRepresentation: (a: unknown): a is THREE.ColorRepresentation =>
24+
a != null && (typeof a === 'string' || typeof a === 'number' || is.three<THREE.Color>(a, 'isColor')),
2325
colorSpaceExist: <
2426
T extends NgtRendererLike | THREE.Texture | object,
2527
P = T extends NgtRendererLike ? { outputColorSpace: string } : { colorSpace: string },

0 commit comments

Comments
 (0)