Refactor refresh()

packages/core/src/blade/binding/api/binding.ts

@@ -2,6 +2,7 @@ import {Emitter} from '../../../common/model/emitter';
 import {ValueEvents} from '../../../common/model/value';
 import {forceCast} from '../../../misc/type-util';
 import {BladeApi} from '../../common/api/blade';
+import {Refreshable} from '../../common/api/refreshable';
 import {TpChangeEvent} from '../../common/api/tp-event';
 import {BindingController} from '../controller/binding';
 
@@ -15,10 +16,13 @@ export interface BindingApiEvents<Ex> {
  * @template Ex The external type.
  */
 export class BindingApi<
-	In = unknown,
-	Ex = unknown,
-	C extends BindingController<In> = BindingController<In>,
-> extends BladeApi<C> {
+		In = unknown,
+		Ex = unknown,
+		C extends BindingController<In> = BindingController<In>,
+	>
+	extends BladeApi<C>
+	implements Refreshable
+{
 	private readonly emitter_: Emitter<BindingApiEvents<Ex>>;
 
 	/**

packages/core/src/blade/common/api/container.ts

@@ -6,8 +6,9 @@ import {FolderApi} from '../../folder/api/folder';
 import {TabApi} from '../../tab/api/tab';
 import {BladeApi} from './blade';
 import {BindingParams, ButtonParams, FolderParams, TabParams} from './params';
+import {Refreshable} from './refreshable';
 
-export interface ContainerApi {
+export interface ContainerApi extends Refreshable {
 	/**
 	 * Children of the container.
 	 */

packages/core/src/blade/common/api/rack-test.ts

@@ -11,6 +11,8 @@ import {forceCast} from '../../../misc/type-util';
 import {createDefaultPluginPool} from '../../../plugin/plugins';
 import {PluginPool} from '../../../plugin/pool';
 import {BindingApi} from '../../binding/api/binding';
+import {InputBindingApi} from '../../binding/api/input-binding';
+import {FolderApi} from '../../folder/api/folder';
 import {LabeledValueController} from '../../label/controller/value-label';
 import {LabelPropsObject} from '../../label/view/label';
 import {TestValueBladeApi, TestValueBladePlugin} from '../../test-util';
@@ -141,4 +143,31 @@ describe(RackApi.name, () => {
 
 		b['controller_'].value.rawValue = 2;
 	});
+
+	it('should refresh children', () => {
+		const doc = createTestWindow().document;
+		const api = createApi({document: doc});
+		const obj = {foo: 1};
+		api.addBinding(obj, 'foo');
+		obj.foo = 2;
+
+		const bapi = api.children[0] as InputBindingApi;
+		assert.strictEqual(bapi['controller_'].value.rawValue, 1);
+		api.refresh();
+		assert.strictEqual(bapi['controller_'].value.rawValue, 2);
+	});
+
+	it('should refresh nested children', () => {
+		const doc = createTestWindow().document;
+		const api = createApi({document: doc});
+		const obj = {foo: 1};
+		api.addFolder({title: ''}).addBinding(obj, 'foo');
+		obj.foo = 2;
+
+		const fapi = api.children[0] as FolderApi;
+		const bapi = fapi.children[0] as InputBindingApi;
+		assert.strictEqual(bapi['controller_'].value.rawValue, 1);
+		api.refresh();
+		assert.strictEqual(bapi['controller_'].value.rawValue, 2);
+	});
 });

packages/core/src/blade/common/api/rack.ts

@@ -18,6 +18,7 @@ import {
 	ContainerApi,
 } from './container';
 import {BindingParams, ButtonParams, FolderParams, TabParams} from './params';
+import {isRefreshable} from './refreshable';
 import {TpChangeEvent} from './tp-event';
 
 /**
@@ -116,6 +117,14 @@ export class RackApi implements ContainerApi {
 		return this;
 	}
 
+	public refresh(): void {
+		this.children.forEach((c) => {
+			if (isRefreshable(c)) {
+				c.refresh();
+			}
+		});
+	}
+
 	private onRackValueChange_(ev: RackEvents['valuechange']): void {
 		const bc = ev.bladeController;
 		const api = this.pool_.createApi(bc);

packages/core/src/blade/common/api/refreshable-test.ts

@@ -0,0 +1,24 @@
+import * as assert from 'assert';
+import {describe, it} from 'mocha';
+
+import {isRefreshable} from './refreshable';
+
+describe(isRefreshable.name, () => {
+	it('should determine Refreshable', () => {
+		assert.strictEqual(
+			isRefreshable({
+				refresh: () => {},
+			}),
+			true,
+		);
+	});
+
+	it('should not determine variable as Refreshable', () => {
+		assert.strictEqual(
+			isRefreshable({
+				refresh: 1,
+			}),
+			false,
+		);
+	});
+});

packages/core/src/blade/common/api/refreshable.ts

@@ -0,0 +1,15 @@
+import {isObject} from '../../../misc/type-util';
+
+export interface Refreshable {
+	/**
+	 * Refreshes the target.
+	 */
+	refresh(): void;
+}
+
+export function isRefreshable(value: unknown): value is Refreshable {
+	if (!isObject(value)) {
+		return false;
+	}
+	return 'refresh' in value && typeof value.refresh === 'function';
+}

packages/core/src/blade/folder/api/folder.ts

@@ -115,4 +115,8 @@ export class FolderApi
 		});
 		return this;
 	}
+
+	public refresh(): void {
+		this.rackApi_.refresh();
+	}
 }

packages/core/src/blade/tab/api/tab-page.ts

@@ -70,4 +70,8 @@ export class TabPageApi
 	public addBlade(params: BaseBladeParams): BladeApi {
 		return this.rackApi_.addBlade(params);
 	}
+
+	public refresh(): void {
+		this.rackApi_.refresh();
+	}
 }

packages/tweakpane/src/main/ts/blade/root/api/root.ts

@@ -1,26 +1,7 @@
-import {
-	BindingValue,
-	FolderApi,
-	isInputBindingController,
-	isMonitorBindingController,
-	MonitorBindingValue,
-	PluginPool,
-	Rack,
-} from '@tweakpane/core';
+import {FolderApi, PluginPool} from '@tweakpane/core';
 
 import {RootController} from '../controller/root';
 
-function findInputBindingValues(rack: Rack): BindingValue<unknown>[] {
-	const vcs = rack.find(isInputBindingController);
-	return vcs.map((vc) => vc.value);
-}
-
-function findMonitorBindingValues(rack: Rack): MonitorBindingValue<unknown>[] {
-	return rack
-		.find(isMonitorBindingController)
-		.map((vc) => vc.value as MonitorBindingValue<unknown>);
-}
-
 export class RootApi extends FolderApi {
 	/**
 	 * @hidden
@@ -32,21 +13,4 @@ export class RootApi extends FolderApi {
 	get element(): HTMLElement {
 		return this.controller_.view.element;
 	}
-
-	/**
-	 * Refreshes all bindings of the pane.
-	 */
-	public refresh(): void {
-		// Force-read all input bindings
-		findInputBindingValues(this.controller_.rackController.rack).forEach((bv) =>
-			bv.fetch(),
-		);
-
-		// Force-read all monitor bindings
-		findMonitorBindingValues(this.controller_.rackController.rack).forEach(
-			(mbv) => {
-				mbv.fetch();
-			},
-		);
-	}
 }