@brightspace-ui/labs 2.11.5 → 2.11.6

package/package.json

@@ -79,5 +79,5 @@
     "@lit/context": "^1.1.3",
     "lit": "^3"
   },
-  "version": "2.11.5"
+  "version": "2.11.6"
 }

package/src/utilities/reactive-store/constants.js

@@ -0,0 +1 @@
+export const combinedPropertiesSymbol = Symbol('combinedProperties');

package/src/utilities/reactive-store/context-controllers.js

@@ -3,11 +3,12 @@ import {
 	ContextConsumer as LitContextConsumer,
 	ContextProvider as LitContextProvider
 } from '@lit/context';
+import { combinedPropertiesSymbol } from './constants.js';
 import StoreReactor from './store-reactor.js';
 
 export class ContextProvider {
 	constructor(host, StoreClass, store = new StoreClass()) {
-		const { properties } = StoreClass;
+		const properties = StoreClass[combinedPropertiesSymbol];
 		const storeReactor = new StoreReactor(host, store, properties);
 		new LitContextProvider(host, {
 			context: createContext(StoreClass),
@@ -31,7 +32,7 @@ export class ContextProvider {
 }
 export class ContextConsumer {
 	constructor(host, StoreClass) {
-		const { properties } = StoreClass;
+		const properties = StoreClass[combinedPropertiesSymbol];
 		const target = {
 			store: {},
 			storeReactor: {},

package/src/utilities/reactive-store/reactive-store.js

@@ -1,3 +1,4 @@
+import { combinedPropertiesSymbol } from './constants.js';
 import { createContextControllers } from './context-controllers.js';
 import PubSub from '../pub-sub/pub-sub.js';
 import StoreConsumer from './store-consumer.js';
@@ -13,7 +14,11 @@ export default class ReactiveStore {
 		this._pubSub = new PubSub();
 		this._state = {};
 
-		this.#defineProperties(this.constructor.prototype);
+		this.#defineProperties();
+	}
+
+	static get [combinedPropertiesSymbol]() {
+		return getCombinedProperties(this.prototype);
 	}
 
 	createConsumer() {
@@ -37,12 +42,8 @@ export default class ReactiveStore {
 		this._pubSub.unsubscribe(callback);
 	}
 
-	#defineProperties(proto) {
-		if (!(proto instanceof ReactiveStore)) return;
-		this.#defineProperties(Object.getPrototypeOf(proto));
-
-		const { properties } = proto.constructor;
-		if (!properties) return;
+	#defineProperties() {
+		const properties = this.constructor[combinedPropertiesSymbol];
 
 		Object.keys(properties).forEach((property) => {
 			Object.defineProperty(this, property, {
@@ -62,3 +63,11 @@ export default class ReactiveStore {
 		});
 	}
 }
+
+function getCombinedProperties(proto) {
+	if (!(proto instanceof ReactiveStore)) return {};
+	return {
+		...getCombinedProperties(Object.getPrototypeOf(proto)),
+		...(proto.constructor.properties ?? {})
+	};
+}

package/src/utilities/reactive-store/store-consumer.js

@@ -1,7 +1,8 @@
+import { combinedPropertiesSymbol } from './constants.js';
 import StoreReactor from './store-reactor.js';
 
 export default class StoreConsumer {
-	constructor(host, store, properties = store.constructor.properties) {
+	constructor(host, store, properties = store.constructor[combinedPropertiesSymbol]) {
 		const storeReactor = new StoreReactor(host, store, properties);
 
 		return new Proxy(store, {

package/src/utilities/reactive-store/store-reactor.js

@@ -1,7 +1,9 @@
+import { combinedPropertiesSymbol } from './constants.js';
+
 export default class StoreReactor {
 	changedProperties;
 
-	constructor(host, store, properties = store.constructor.properties) {
+	constructor(host, store, properties = store.constructor[combinedPropertiesSymbol]) {
 		this.#host = host;
 		this.#host.addController(this);
 		this.#store = store;